chore(ui-charts): sdk updates (#15)

Author: triniwiz

packages/ui-charts/common.ts

@@ -1,10 +1,10 @@
 import { Property, View } from '@nativescript/core';
 
 export class UIChartsViewBase extends View {
-  options: any;
+  options: Record<string, any>;
 }
 
-export const optionsProperty = new Property<UIChartsViewBase, {}>({
+export const optionsProperty = new Property<UIChartsViewBase, Record<string, any>>({
   name: 'options',
   defaultValue: {},
   affectsLayout: true,

packages/ui-charts/index.android.ts

@@ -13,6 +13,7 @@ export class UIChartsView extends UIChartsViewBase {
     super.onLoaded();
     this.customLayoutChangeListener = new android.view.View.OnLayoutChangeListener({
       onLayoutChange: (v) => {
+        const nativeView = <com.highsoft.highcharts.core.HIChartView>this.nativeView;
         const w = this.nativeView.owner.get();
         if (w && this.nativeView.getOptions()) {
           const newWidth = w.getActualSize().width;
@@ -22,9 +23,9 @@ export class UIChartsView extends UIChartsViewBase {
             // condition detected where android chart won't resize above this height,
             // dont attempt resize to avoid chart being cut off at the bottom
           } else if (this.chartHeight !== newHeight) {
-            if (this.nativeView.getOptions().getChart()) {
-              this.nativeView.getOptions().getChart().setHeight(new java.lang.Long(newHeight));
-              this.nativeView.getOptions().getChart().setWidth(new java.lang.Long(newWidth));
+            if (nativeView.getOptions().getChart()) {
+              nativeView.getOptions().getChart().setHeight(java.lang.Long.valueOf(newHeight));
+              nativeView.getOptions().getChart().setWidth(java.lang.Long.valueOf(newWidth));
             }
             this.chartHeight = newHeight;
             this.chartWidth = newWidth;

packages/ui-charts/index.ios.ts

@@ -4,12 +4,12 @@ import { langHandler } from './options-handlers/lang/lang-handler';
 import { Utils, ViewBase } from '@nativescript/core';
 
 export class UIChartsView extends UIChartsViewBase {
-  public _chartInitialized: boolean = false;
+  public _chartInitialized = false;
   private _delegate: HighchartsViewDelegateImpl;
 
   public createNativeView() {
     // const chartView = new HIChartView({ frame: CGRectMake(0, 0, 200, 200) }) as any;
-    const chartView = HIChartView.alloc().initWithFrame(CGRectMake(0, 0, 200, 200));
+    const chartView = HIChartView.new();
     // always retain delegate on owner class to ensure it doesn't inadvertently get garbage collected
     this._delegate = HighchartsViewDelegateImpl.initWithOwner(new WeakRef(this));
     chartView.delegate = this._delegate;
@@ -51,13 +51,23 @@ export class UIChartsView extends UIChartsViewBase {
     }
   }
 
+  public onMeasure(widthMeasureSpec: number, heightMeasureSpec: number) {
+    const nativeView = this.nativeView;
+    if (nativeView) {
+      const width = Utils.layout.getMeasureSpecSize(widthMeasureSpec);
+      const height = Utils.layout.getMeasureSpecSize(heightMeasureSpec);
+      this.setMeasuredDimension(width, height);
+    }
+  }
+
   public setOptions(opts: any) {
     this.options = opts;
     const hiOptions = optionsHandler(this.options);
-    if (this.nativeView) {
-      this.nativeView.options = hiOptions;
+    const nativeView = this.nativeView as HIChartView;
+    if (nativeView) {
+      nativeView.options = hiOptions;
       this._chartInitialized = true;
-      this.nativeView.reload();
+      nativeView.reload();
     }
   }
 
@@ -71,13 +81,14 @@ export class UIChartsView extends UIChartsViewBase {
   public updateOptions(opts) {
     this.options = opts;
     const hiOptions = optionsHandler(this.options);
-    if (this.nativeView) {
-      this.nativeView.updateRedrawOneToOneAnimation(hiOptions, 1, 1, new HIAnimationOptionsObject());
+    const nativeView = this.nativeView as HIChartView;
+    if (nativeView) {
+      nativeView.updateRedrawOneToOneAnimation(hiOptions, 1, 1, new HIAnimationOptionsObject());
     }
   }
 
   setExtremes(newMin, newMax, xAxisIndex = 0) {
-    const nativeview = this.nativeView;
+    const nativeview = this.nativeView as HIChartView;
     if (nativeview) {
       const opts = nativeview.options;
       if (opts) {

packages/ui-charts/options-handlers/annotations/annotations-handler.ts

@@ -16,9 +16,9 @@ export function annotationsHandler(annotationsOptions) {
     visible: 'number',
     zIndex: 'number',
   };
-  if (annotationsOptions instanceof Array) {
-    var annotationsArray = [];
-    for (var i = 0; i < annotationsOptions.length; i++) {
+  if (Array.isArray(annotationsOptions)) {
+    const annotationsArray = [];
+    for (let i = 0; i < annotationsOptions.length; i++) {
       annotationsArray.push(optionsBuilder(annotationsSchema, annotationsOptions[i], annotations));
     }
     return convertJSArrayToNative(annotationsArray);

packages/ui-charts/options-handlers/condition/conditionHandler.ts

@@ -0,0 +1,16 @@
+import { optionsBuilder } from '../helpers/helpers';
+import { isAndroid } from '@nativescript/core';
+
+export function conditionHandler(conditionOptions) {
+  const condition = isAndroid ? new com.highsoft.highcharts.common.hichartsclasses.HICondition() : new HICondition();
+
+  const conditionSchema = {
+    callback: 'HIFunction',
+    maxHeight: 'number',
+    maxWidth: 'number',
+    minHeight: 'number',
+    minWidth: 'number',
+  };
+
+  return optionsBuilder(conditionSchema, conditionOptions, condition);
+}

packages/ui-charts/options-handlers/function/function-handler.ts

@@ -26,25 +26,59 @@ import { toStringArray } from '../helpers/helpers';
 
 // With event?
 export function functionHandler(functionOptions) {
+  let func = functionOptions;
+
+  if (typeof func === 'string') {
+    try {
+      func = eval(`function func() { (${functionOptions})() }`);
+      // eslint-disable-next-line no-empty
+    } catch (error) {
+      console.log('Error in functionHandler eval: ', error);
+    }
+  }
+
   if (isAndroid) {
     return new com.highsoft.highcharts.core.HIFunction(
       new java.lang.Runnable({
-        run: functionOptions,
+        run() {
+          func?.();
+        },
       })
     );
   }
 
-  return new HIFunction({ closure: (event) => functionOptions(event) });
+  return new HIFunction({
+    closure: (event) => {
+      func?.(event);
+    },
+  });
 }
 
 export function dataPointFunctionHandler(functionOptions) {
+  let func = functionOptions;
+
+  if (typeof func === 'string') {
+    try {
+      func = eval(`function func() { (${functionOptions})() }`);
+      // eslint-disable-next-line no-empty
+    } catch (error) {
+      console.log('Error in functionHandler eval: ', error);
+    }
+  }
+
   if (isAndroid) {
     return new com.highsoft.highcharts.core.HIFunction(
       new java.lang.Runnable({
-        run: functionOptions,
+        run() {
+          func?.();
+        },
       })
     );
   }
 
-  return new HIFunction({ closure: (event) => functionOptions(event) });
+  return new HIFunction({
+    closure: (event) => {
+      func?.(event);
+    },
+  });
 }

packages/ui-charts/options-handlers/helpers/_helpers.common.ts

@@ -105,6 +105,9 @@ import { wordcloudHandler } from '../series/wordcloud/wordcloud-handler';
 import { xrangeHandler } from '../series/xrange/xrange-handler';
 import { selectHandler } from '../select/select-handler';
 import { inactiveHandler } from '../inactive/inactive-handler';
+import { responsiveHandler } from '../responsive/responsive-handler';
+import { rulesHandler } from '../rules/rules-handler';
+import { conditionHandler } from '../condition/conditionHandler';
 
 const seriesHandlers = {
   HIArea: (options) => areaHandler(options),
@@ -170,6 +173,7 @@ export const typesMap = {
   HIButtonOptions: (options) => buttonOptionsHandler(options),
   // 'HICaption': (options) => captionHandler(options),
   HIChart: (options) => chartHandler(options),
+  HICondition: (options) => conditionHandler(options),
   HICredits: (options) => creditsHandler(options),
   HICSSObject: (options) => styleHandler(options),
   HIDateTimeLabelFormats: (options) => dateTimeLabelFormatsHandler(options),
@@ -204,8 +208,9 @@ export const typesMap = {
   HIPlotOptions: (options) => plotOptionsHandler(options),
   HIPlotBands: (options) => plotBandsHandler(options),
   HIPlotLines: (options) => plotLinesHandler(options),
-  // 'HIResponsive': (options) => responsiveHandler(options),
+  HIResponsive: (options) => responsiveHandler(options),
   HIResetZoomButton: (options) => resetZoomButtonHandler(options),
+  HIRules: (options) => rulesHandler(options),
   HIScrollablePlotArea: (options) => scrollablePlotAreaHandler(options),
   HISeries: (options) => seriesHandler(options),
   HIShapes: (options) => shapesHandler(options),

packages/ui-charts/options-handlers/helpers/helpers.android.ts

@@ -1,12 +1,14 @@
 import { Color } from '@nativescript/core';
 import { typesMap as _typesMap } from './_helpers.common';
+import { dataSerialize, numberHasDecimals } from '@nativescript/core/utils';
 
 const typesMap = Object.assign({}, _typesMap, {
   number: (options) => fromJSToNativePrimitive(options),
   boolean: (options) => fromJSToNativePrimitive(options),
   Array: (options) => convertJSArrayToNative(options),
   LinkedList: (options) => toLinkedList(options),
   HIColor: (options) => toHIColor(options),
+  object: (options) => dataSerialize(options),
 });
 
 export function convertJSArrayToNative(jsArray: Array<any>): java.util.ArrayList<any> {
@@ -19,25 +21,37 @@ export function convertJSArrayToNative(jsArray: Array<any>): java.util.ArrayList
 }
 
 export function fromJSToNativePrimitive(value: any): any {
+  if (value === null) return null;
+  if (value === undefined) return undefined;
   if (typeof value === 'boolean' || value === 'false' || value === 'true') return new java.lang.Boolean(value);
-  if (typeof value === 'string') return value;
+  if (typeof value === 'string') return new java.lang.String(value);
 
-  if (Number.isInteger(value)) {
-    return new java.lang.Double(value);
-  }
+  if (typeof value === 'number' || Number.isInteger(value) || value instanceof Number) {
+    if (numberHasDecimals(value)) {
+      return new java.lang.Double(value);
+    }
+    if (Number.isInteger(value)) {
+      return new java.lang.Long(value);
+    }
 
-  if (!isNaN(Number(value)) && value !== null) {
-    return new java.lang.Double(value.toString());
+    if (!isNaN(Number(value)) && value !== null) {
+      if (value.toString().includes('.')) {
+        return new java.lang.Double(value.toString());
+      }
+      return new java.lang.Long(value.toString());
+    }
   }
 
   return value;
 }
 
 export function toArrayList(arr, isNumber = false) {
-  const arrayList = new java.util.ArrayList<any>();
-  arr.forEach((item) => {
+  const size = arr?.length ?? 0;
+  const arrayList = new java.util.ArrayList<any>(size);
+  for (let i = 0; i < size; i++) {
+    const item = arr[i];
     arrayList.add(item);
-  });
+  }
   return arrayList;
 }
 
@@ -79,7 +93,7 @@ export function colorToString(color: any) {
 }
 
 export function toHIColor(color) {
-  if (color instanceof Array) {
+  if (Array.isArray(color)) {
     const colorArray = [];
     for (let i = 0; i < color.length; i++) {
       const c = color[i];

packages/ui-charts/options-handlers/helpers/helpers.ios.ts

@@ -1,12 +1,14 @@
 import { Color } from '@nativescript/core';
 import { typesMap as _typesMap } from './_helpers.common';
+import { dataSerialize } from '@nativescript/core/utils';
 
 const typesMap = Object.assign({}, _typesMap, {
   number: (options) => fromJSToNativePrimitive(options),
   boolean: (options) => fromJSToNativePrimitive(options),
   string: (options) => fromJSToNativePrimitive(options),
   Array: (options) => convertJSArrayToNative(options),
   HIColor: (options) => toHIColor(options),
+  object: (options) => dataSerialize(options),
 });
 
 export function convertJSArrayToNative(array) {
@@ -43,10 +45,10 @@ export function colorToString(color: any) {
 }
 
 export function toHIColor(color) {
-  if (color instanceof Array) {
+  if (Array.isArray(color)) {
     const colorArray = [];
     for (let i = 0; i < color.length; i++) {
-      const c = color[i];
+      let c = color[i];
 
       if (c.radialGradient && c.stops) {
         const stops = c.stops.map((stop, index) => [index, colorToString(stop)]);
@@ -67,38 +69,70 @@ export function toHIColor(color) {
           })
         );
       } else {
+        if (typeof c === 'string' && c.indexOf('#') === 0) {
+          if (c.length === 4) {
+            c = `#${c[1]}${c[1]}${c[2]}${c[2]}${c[3]}${c[3]}`;
+          }
+        }
+
         const _c = new Color(c);
-        colorArray.push(new HIColor(_c.ios) as any);
+        colorArray.push(HIColor.alloc().initWithUIColor(_c.ios));
       }
     }
 
     return convertJSArrayToNative(colorArray);
   } else {
     if (color.radialGradient && color.stops) {
-      const stops = color.stops.map((stop, index) => [index, colorToString(stop)]);
+      const stops = NSMutableArray.alloc().initWithCapacity(color.stops.length);
+
+      for (const stop of color.stops) {
+        const item = NSMutableArray.alloc().initWithCapacity(2);
+        item.addObject(NSNumber.numberWithDouble(stop[0]));
+        item.addObject(colorToString(stop));
+        stops.addObject(item);
+      }
+
       const g = color.radialGradient;
-      return new HIColor({
-        radialGradient: NSDictionary.dictionaryWithObjectsForKeys([g.cx, g.cy, g.r], ['cx', 'cy', 'r']),
-        stops: stops,
-      });
+      const radialGradient = NSMutableDictionary.alloc().initWithCapacity(3);
+      radialGradient.setObjectForKey(g.cx, 'cx');
+      radialGradient.setObjectForKey(g.cy, 'cy');
+      radialGradient.setObjectForKey(g.r, 'r');
+      return HIColor.alloc().initWithRadialGradientStops(radialGradient, stops);
     } else if (color.linearGradient && color.stops) {
-      const stops = color.stops.map((stop, index) => [index, colorToString(stop)]);
-      const g = color.linearGradient;
-      return new HIColor({
-        linearGradient: NSDictionary.dictionaryWithObjectsForKeys([g.x1, g.y1, g.x2, g.y2], ['x1', 'y1', 'x2', 'y2']),
-        stops: stops,
+      const stops = NSMutableArray.alloc().initWithCapacity(color.stops.length);
+
+      color.stops.forEach((stop, index) => {
+        const item = NSMutableArray.alloc().initWithCapacity(2);
+        item.addObject(NSNumber.numberWithInt(index));
+        item.addObject(colorToString(stop));
+        stops.addObject(item);
       });
+      const g = color.linearGradient;
+
+      const linearGradient = NSMutableDictionary.alloc().initWithCapacity(4);
+
+      linearGradient.setObjectForKey(g.x1, 'x1');
+      linearGradient.setObjectForKey(g.y1, 'y1');
+      linearGradient.setObjectForKey(g.x2, 'x2');
+      linearGradient.setObjectForKey(g.y2, 'y2');
+
+      return HIColor.alloc().initWithLinearGradientStops(linearGradient, stops);
     } else {
+      if (typeof color === 'string' && color.indexOf('#') === 0) {
+        if (color.length === 4) {
+          color = `#${color[1]}${color[1]}${color[2]}${color[2]}${color[3]}${color[3]}`;
+        }
+        return HIColor.alloc().initWithHexValue(color);
+      }
       const c = new Color(color);
-      return new HIColor(c.ios) as any;
+      return HIColor.alloc().initWithUIColor(c.ios);
     }
   }
 }
 
 export function optionsBuilder(schema, options, containerObject) {
   const schemaKeys = Object.keys(schema);
   const optionsKeys = Object.keys(options);
-
   for (const schemaKey of schemaKeys) {
     if ((<any>optionsKeys).includes(schemaKey)) {
       if (typeof typesMap[schema[schemaKey]] === 'function') {