@nativescript/canvas 2.0.0-beta.2 → 2.0.0-beta.4

package/Dom/Paint.d.ts

@@ -9,6 +9,7 @@ export declare class Paint extends LayoutBase {
     paintStyle: 'fill' | 'stroke';
     _paintStyleDirty: boolean;
     _inGroup: boolean;
+    invalidate(): void;
     _getStrokeWidth(): any;
     _getPaintStyle(): any;
     _getColor(): any;

package/Dom/Paint.js

@@ -20,6 +20,12 @@ export class Paint extends LayoutBase {
     [paintStyleProperty.setNative](value) {
         this._paintStyleDirty = true;
     }
+    invalidate() {
+        const parent = this.parent;
+        if (parent != null) {
+            parent._dirty?.();
+        }
+    }
     _getStrokeWidth() {
         return this.parent?.strokeWidth ?? this.strokeWidth;
     }

package/Dom/Paint.js.map

@@ -1 +1 @@
-{"version":3,"file":"Paint.js","sourceRoot":"","sources":["../../../../packages/canvas/Dom/Paint.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAGjE,MAAM,CAAC,MAAM,kBAAkB,GAAG,IAAI,QAAQ,CAA2B;IACxE,IAAI,EAAE,YAAY;IAClB,YAAY,EAAE,MAAM;CACpB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,mBAAmB,GAAG,IAAI,QAAQ,CAAgB;IAC9D,IAAI,EAAE,aAAa;IACnB,YAAY,EAAE,CAAC;CACf,CAAC,CAAC;AAEH,MAAM,YAAY,GAAG,IAAI,KAAK,CAAC,OAAO,CAAC,CAAC;AACxC,MAAM,OAAO,KAAM,SAAQ,UAAU;IAArC;;QASC,qBAAgB,GAAG,KAAK,CAAC;QAEzB,aAAQ,GAAG,KAAK,CAAC;IAiDlB,CAAC;IAzDA,UAAU,CAAC,MAAc;QACxB,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC;IACvB,CAAC;IAQD,CAAC,kBAAkB,CAAC,SAAS,CAAC,CAAC,KAAK;QACnC,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;IAC9B,CAAC;IAED,eAAe;QACd,OAAQ,IAAI,CAAC,MAAc,EAAE,WAAW,IAAI,IAAI,CAAC,WAAW,CAAC;IAC9D,CAAC;IACD,cAAc;QACb,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;QACnC,IAAI,UAAU,KAAK,MAAM,EAAE;YAC1B,OAAO,UAAU,CAAC;SAClB;QACD,IAAI,IAAI,CAAC,QAAQ,EAAE;YAClB,OAAQ,IAAI,CAAC,MAAc,CAAC,UAAU,CAAC;SACvC;QACD,OAAO,MAAM,CAAC;IACf,CAAC;IAED,SAAS;QACR,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,IAAI,YAAY,CAAC;QACzC,MAAM,GAAG,GAAG,KAAK,CAAC,GAAG,CAAC;QACtB,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO,IAAI,GAAG,KAAK,SAAS,EAAE;YAChD,OAAO,GAAG,CAAC;SACX;QACD,OAAQ,IAAI,CAAC,MAAc,EAAE,KAAK,EAAE,GAAG,IAAI,GAAG,CAAC;IAChD,CAAC;IAED,IAAI;QACH,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC;QAE/B,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAoC,CAAC;QAEjF,MAAM,KAAK,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;QAEpC,OAAO,CAAC,SAAS,EAAE,CAAC;QAEpB,IAAI,KAAK,KAAK,MAAM,EAAE;YACrB,OAAO,CAAC,SAAS,GAAG,KAAK,CAAC;YAC1B,OAAO,CAAC,IAAI,EAAE,CAAC;SACf;aAAM,IAAI,KAAK,KAAK,QAAQ,EAAE;YAC9B,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;YAC3C,OAAO,CAAC,WAAW,GAAG,KAAK,CAAC;YAC5B,OAAO,CAAC,MAAM,EAAE,CAAC;SACjB;QAED,OAAO,CAAC,SAAS,EAAE,CAAC;IACrB,CAAC;CACD;AAED,kBAAkB,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;AACnC,mBAAmB,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC"}
+{"version":3,"file":"Paint.js","sourceRoot":"","sources":["../../../../packages/canvas/Dom/Paint.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAIjE,MAAM,CAAC,MAAM,kBAAkB,GAAG,IAAI,QAAQ,CAA2B;IACxE,IAAI,EAAE,YAAY;IAClB,YAAY,EAAE,MAAM;CACpB,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,mBAAmB,GAAG,IAAI,QAAQ,CAAgB;IAC9D,IAAI,EAAE,aAAa;IACnB,YAAY,EAAE,CAAC;CACf,CAAC,CAAC;AAEH,MAAM,YAAY,GAAG,IAAI,KAAK,CAAC,OAAO,CAAC,CAAC;AACxC,MAAM,OAAO,KAAM,SAAQ,UAAU;IAArC;;QASC,qBAAgB,GAAG,KAAK,CAAC;QAEzB,aAAQ,GAAG,KAAK,CAAC;IAwDlB,CAAC;IAhEA,UAAU,CAAC,MAAc;QACxB,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC;IACvB,CAAC;IAQD,CAAC,kBAAkB,CAAC,SAAS,CAAC,CAAC,KAAK;QACnC,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;IAC9B,CAAC;IAED,UAAU;QACT,MAAM,MAAM,GAAG,IAAI,CAAC,MAAa,CAAC;QAClC,IAAI,MAAM,IAAI,IAAI,EAAE;YACnB,MAAM,CAAC,MAAM,EAAE,EAAE,CAAC;SAClB;IACF,CAAC;IAED,eAAe;QACd,OAAQ,IAAI,CAAC,MAAc,EAAE,WAAW,IAAI,IAAI,CAAC,WAAW,CAAC;IAC9D,CAAC;IACD,cAAc;QACb,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;QACnC,IAAI,UAAU,KAAK,MAAM,EAAE;YAC1B,OAAO,UAAU,CAAC;SAClB;QACD,IAAI,IAAI,CAAC,QAAQ,EAAE;YAClB,OAAQ,IAAI,CAAC,MAAc,CAAC,UAAU,CAAC;SACvC;QACD,OAAO,MAAM,CAAC;IACf,CAAC;IAED,SAAS;QACR,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,IAAI,YAAY,CAAC;QACzC,MAAM,GAAG,GAAG,KAAK,CAAC,GAAG,CAAC;QACtB,IAAI,KAAK,CAAC,IAAI,KAAK,OAAO,IAAI,GAAG,KAAK,SAAS,EAAE;YAChD,OAAO,GAAG,CAAC;SACX;QACD,OAAQ,IAAI,CAAC,MAAc,EAAE,KAAK,EAAE,GAAG,IAAI,GAAG,CAAC;IAChD,CAAC;IAED,IAAI;QACH,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC;QAE/B,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAoC,CAAC;QAEjF,MAAM,KAAK,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;QAEpC,OAAO,CAAC,SAAS,EAAE,CAAC;QAEpB,IAAI,KAAK,KAAK,MAAM,EAAE;YACrB,OAAO,CAAC,SAAS,GAAG,KAAK,CAAC;YAC1B,OAAO,CAAC,IAAI,EAAE,CAAC;SACf;aAAM,IAAI,KAAK,KAAK,QAAQ,EAAE;YAC9B,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;YAC3C,OAAO,CAAC,WAAW,GAAG,KAAK,CAAC;YAC5B,OAAO,CAAC,MAAM,EAAE,CAAC;SACjB;QAED,OAAO,CAAC,SAAS,EAAE,CAAC;IACrB,CAAC;CACD;AAED,kBAAkB,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;AACnC,mBAAmB,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC"}

package/Dom/Shadow.js

@@ -5,18 +5,27 @@ export const dxProperty = new Property({
     valueConverter(value) {
         return parseFloat(value);
     },
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 export const dyProperty = new Property({
     name: 'dy',
     valueConverter(value) {
         return parseFloat(value);
     },
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 export const blurProperty = new Property({
     name: 'blur',
     valueConverter(value) {
         return parseFloat(value);
     },
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 export class Shadow extends Paint {
 }

package/Dom/Shadow.js.map

@@ -1 +1 @@
-{"version":3,"file":"Shadow.js","sourceRoot":"","sources":["../../../../packages/canvas/Dom/Shadow.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEhC,MAAM,CAAC,MAAM,UAAU,GAAG,IAAI,QAAQ,CAAiB;IACtD,IAAI,EAAE,IAAI;IACV,cAAc,CAAC,KAAK;QACnB,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,UAAU,GAAG,IAAI,QAAQ,CAAiB;IACtD,IAAI,EAAE,IAAI;IACV,cAAc,CAAC,KAAK;QACnB,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,YAAY,GAAG,IAAI,QAAQ,CAAiB;IACxD,IAAI,EAAE,MAAM;IACZ,cAAc,CAAC,KAAK;QACnB,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,OAAO,MAAO,SAAQ,KAAK;CAIhC;AAED,UAAU,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;AAC5B,UAAU,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;AAC5B,YAAY,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC"}
+{"version":3,"file":"Shadow.js","sourceRoot":"","sources":["../../../../packages/canvas/Dom/Shadow.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEhC,MAAM,CAAC,MAAM,UAAU,GAAG,IAAI,QAAQ,CAAiB;IACtD,IAAI,EAAE,IAAI;IACV,cAAc,CAAC,KAAK;QACnB,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;IACD,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,UAAU,GAAG,IAAI,QAAQ,CAAiB;IACtD,IAAI,EAAE,IAAI;IACV,cAAc,CAAC,KAAK;QACnB,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;IACD,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,YAAY,GAAG,IAAI,QAAQ,CAAiB;IACxD,IAAI,EAAE,MAAM;IACZ,cAAc,CAAC,KAAK;QACnB,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;IACD,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,OAAO,MAAO,SAAQ,KAAK;CAIhC;AAED,UAAU,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;AAC5B,UAAU,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;AAC5B,YAAY,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC"}

package/Dom/Text.js

@@ -5,15 +5,24 @@ const xProperty = new Property({
     valueConverter(value) {
         return parseFloat(value);
     },
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 const yProperty = new Property({
     name: 'y',
     valueConverter(value) {
         return parseFloat(value);
     },
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 const textProperty = new Property({
     name: 'text',
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 export class Text extends Paint {
     set font(value) {

package/Dom/Text.js.map

@@ -1 +1 @@
-{"version":3,"file":"Text.js","sourceRoot":"","sources":["../../../../packages/canvas/Dom/Text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAU,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEhC,MAAM,SAAS,GAAG,IAAI,QAAQ,CAAe;IAC5C,IAAI,EAAE,GAAG;IACT,cAAc,CAAC,KAAK;QACnB,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,SAAS,GAAG,IAAI,QAAQ,CAAe;IAC5C,IAAI,EAAE,GAAG;IACT,cAAc,CAAC,KAAK;QACnB,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,YAAY,GAAG,IAAI,QAAQ,CAAe;IAC/C,IAAI,EAAE,MAAM;CACZ,CAAC,CAAC;AAEH,MAAM,OAAO,IAAK,SAAQ,KAAK;IAK9B,IAAI,IAAI,CAAC,KAAK;QACb,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,KAAK,CAAC;QACxB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;IACpB,CAAC;IAED,IAAI;QACH,IAAI,OAAO,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE;YAClC,OAAO;SACP;QACD,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAQ,CAAC;QAErD,IAAI,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,EAAE;YACnC,OAAO,CAAC,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC;SAC1B;QAED,MAAM,KAAK,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;QACpC,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC;QAC/B,QAAQ,KAAK,EAAE;YACd,KAAK,MAAM;gBACV,OAAO,CAAC,SAAS,GAAG,KAAK,CAAC;gBAC1B,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC;gBAC5C,MAAM;YACP,KAAK,QAAQ;gBACZ,OAAO,CAAC,WAAW,GAAG,KAAK,CAAC;gBAC5B,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC;gBACrC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC;gBAC9C,MAAM;SACP;IACF,CAAC;CACD;AAED,YAAY,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;AAC5B,SAAS,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;AACzB,SAAS,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC"}
+{"version":3,"file":"Text.js","sourceRoot":"","sources":["../../../../packages/canvas/Dom/Text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAU,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEhC,MAAM,SAAS,GAAG,IAAI,QAAQ,CAAe;IAC5C,IAAI,EAAE,GAAG;IACT,cAAc,CAAC,KAAK;QACnB,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;IACD,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,SAAS,GAAG,IAAI,QAAQ,CAAe;IAC5C,IAAI,EAAE,GAAG;IACT,cAAc,CAAC,KAAK;QACnB,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;IACD,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,YAAY,GAAG,IAAI,QAAQ,CAAe;IAC/C,IAAI,EAAE,MAAM;IACZ,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,OAAO,IAAK,SAAQ,KAAK;IAK9B,IAAI,IAAI,CAAC,KAAK;QACb,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,KAAK,CAAC;QACxB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;IACpB,CAAC;IAED,IAAI;QACH,IAAI,OAAO,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE;YAClC,OAAO;SACP;QACD,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAQ,CAAC;QAErD,IAAI,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ,EAAE;YACnC,OAAO,CAAC,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC;SAC1B;QAED,MAAM,KAAK,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;QACpC,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC;QAC/B,QAAQ,KAAK,EAAE;YACd,KAAK,MAAM;gBACV,OAAO,CAAC,SAAS,GAAG,KAAK,CAAC;gBAC1B,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC;gBAC5C,MAAM;YACP,KAAK,QAAQ;gBACZ,OAAO,CAAC,WAAW,GAAG,KAAK,CAAC;gBAC5B,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC;gBACrC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC;gBAC9C,MAAM;SACP;IACF,CAAC;CACD;AAED,YAAY,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;AAC5B,SAAS,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;AACzB,SAAS,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC"}

package/Dom/index.d.ts

@@ -6,3 +6,4 @@ export * from './Paint';
 export * from './Fill';
 export * from './Text';
 export * from './Shadow';
+export * from './shaders';

package/Dom/index.js

@@ -6,4 +6,5 @@ export * from './Paint';
 export * from './Fill';
 export * from './Text';
 export * from './Shadow';
+export * from './shaders';
 //# sourceMappingURL=index.js.map

package/Dom/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../packages/canvas/Dom/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../packages/canvas/Dom/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC"}

package/Dom/shaders/Gradients.d.ts

@@ -0,0 +1,3 @@
+import { Paint } from '../Paint';
+export declare class Gradients extends Paint {
+}

package/Dom/shaders/Gradients.js

@@ -0,0 +1,4 @@
+import { Paint } from '../Paint';
+export class Gradients extends Paint {
+}
+//# sourceMappingURL=Gradients.js.map

package/Dom/shaders/Gradients.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Gradients.js","sourceRoot":"","sources":["../../../../../packages/canvas/Dom/shaders/Gradients.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAEjC,MAAM,OAAO,SAAU,SAAQ,KAAK;CAAG"}

package/Dom/shaders/LinearGradient.d.ts

@@ -0,0 +1,14 @@
+import { Gradients } from './Gradients';
+export declare class LinearGradient extends Gradients {
+    start: {
+        x: number;
+        y: number;
+    };
+    end: {
+        x: number;
+        y: number;
+    };
+    colors: string[];
+    _getColor(): import("../..").CanvasGradient;
+    draw(): void;
+}

package/Dom/shaders/LinearGradient.js

@@ -0,0 +1,44 @@
+import { Property } from '@nativescript/core';
+import { Gradients } from './Gradients';
+const startProperty = new Property({
+    name: 'start',
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
+});
+const endProperty = new Property({
+    name: 'end',
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
+});
+const colorsProperty = new Property({
+    name: 'colors',
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
+});
+export class LinearGradient extends Gradients {
+    _getColor() {
+        const ctx = this._canvas.getContext('2d');
+        const gradient = ctx.createLinearGradient(this.start.x, this.start.y, this.end.x, this.end.y);
+        for (let i = 0; i < this.colors.length; i++) {
+            gradient.addColorStop(i, this.colors[i]);
+        }
+        return gradient;
+    }
+    draw() {
+        const ctx = this._canvas.getContext('2d');
+        const gradient = this._getColor();
+        if (this._getPaintStyle() === 'stroke') {
+            ctx.strokeStyle = gradient;
+        }
+        else {
+            ctx.fillStyle = gradient;
+        }
+    }
+}
+startProperty.register(LinearGradient);
+endProperty.register(LinearGradient);
+colorsProperty.register(LinearGradient);
+//# sourceMappingURL=LinearGradient.js.map

package/Dom/shaders/LinearGradient.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LinearGradient.js","sourceRoot":"","sources":["../../../../../packages/canvas/Dom/shaders/LinearGradient.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,MAAM,aAAa,GAAG,IAAI,QAAQ,CAA2C;IAC5E,IAAI,EAAE,OAAO;IACb,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,WAAW,GAAG,IAAI,QAAQ,CAA2C;IAC1E,IAAI,EAAE,KAAK;IACX,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,cAAc,GAAG,IAAI,QAAQ,CAA2B;IAC7D,IAAI,EAAE,QAAQ;IACd,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,OAAO,cAAe,SAAQ,SAAS;IAK5C,SAAS;QACR,MAAM,GAAG,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QAC1C,MAAM,QAAQ,GAAG,GAAG,CAAC,oBAAoB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;QAE9F,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YAC5C,QAAQ,CAAC,YAAY,CAAC,CAAC,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;SACzC;QAED,OAAO,QAAQ,CAAC;IACjB,CAAC;IAED,IAAI;QACH,MAAM,GAAG,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QAC1C,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC;QAClC,IAAI,IAAI,CAAC,cAAc,EAAE,KAAK,QAAQ,EAAE;YACvC,GAAG,CAAC,WAAW,GAAG,QAAQ,CAAC;SAC3B;aAAM;YACN,GAAG,CAAC,SAAS,GAAG,QAAQ,CAAC;SACzB;IACF,CAAC;CACD;AAED,aAAa,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC;AACvC,WAAW,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC;AACrC,cAAc,CAAC,QAAQ,CAAC,cAAc,CAAC,CAAC"}

package/Dom/shaders/TwoPointConicalGradient.d.ts

@@ -0,0 +1,16 @@
+import { Gradients } from './Gradients';
+export declare class TwoPointConicalGradient extends Gradients {
+    start: {
+        x: number;
+        y: number;
+    };
+    end: {
+        x: number;
+        y: number;
+    };
+    colors: string[];
+    startR: number;
+    endR: number;
+    _getColor(): import("../..").CanvasGradient;
+    draw(): void;
+}

package/Dom/shaders/TwoPointConicalGradient.js

@@ -0,0 +1,60 @@
+import { Property } from '@nativescript/core';
+import { Gradients } from './Gradients';
+const startProperty = new Property({
+    name: 'start',
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
+});
+const startRProperty = new Property({
+    name: 'startR',
+    valueConverter: parseFloat,
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
+});
+const endProperty = new Property({
+    name: 'end',
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
+});
+const endRProperty = new Property({
+    name: 'endR',
+    valueConverter: parseFloat,
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
+});
+const colorsProperty = new Property({
+    name: 'colors',
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
+});
+export class TwoPointConicalGradient extends Gradients {
+    _getColor() {
+        const ctx = this._canvas.getContext('2d');
+        const gradient = ctx.createRadialGradient(this.start.x, this.start.y, this.startR, this.end.x, this.end.y, this.endR);
+        for (let i = 0; i < this.colors.length; i++) {
+            gradient.addColorStop(i, this.colors[i]);
+        }
+        return gradient;
+    }
+    draw() {
+        const ctx = this._canvas.getContext('2d');
+        const gradient = this._getColor();
+        if (this._getPaintStyle() === 'stroke') {
+            ctx.strokeStyle = gradient;
+        }
+        else {
+            ctx.fillStyle = gradient;
+        }
+    }
+}
+startProperty.register(TwoPointConicalGradient);
+endProperty.register(TwoPointConicalGradient);
+colorsProperty.register(TwoPointConicalGradient);
+startRProperty.register(TwoPointConicalGradient);
+endRProperty.register(TwoPointConicalGradient);
+//# sourceMappingURL=TwoPointConicalGradient.js.map

package/Dom/shaders/TwoPointConicalGradient.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TwoPointConicalGradient.js","sourceRoot":"","sources":["../../../../../packages/canvas/Dom/shaders/TwoPointConicalGradient.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,MAAM,aAAa,GAAG,IAAI,QAAQ,CAAoD;IACrF,IAAI,EAAE,OAAO;IACb,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,cAAc,GAAG,IAAI,QAAQ,CAAkC;IACpE,IAAI,EAAE,QAAQ;IACd,cAAc,EAAE,UAAU;IAC1B,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,WAAW,GAAG,IAAI,QAAQ,CAAoD;IACnF,IAAI,EAAE,KAAK;IACX,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,YAAY,GAAG,IAAI,QAAQ,CAAkC;IAClE,IAAI,EAAE,MAAM;IACZ,cAAc,EAAE,UAAU;IAC1B,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,cAAc,GAAG,IAAI,QAAQ,CAAoC;IACtE,IAAI,EAAE,QAAQ;IACd,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,OAAO,uBAAwB,SAAQ,SAAS;IAOrD,SAAS;QACR,MAAM,GAAG,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QAC1C,MAAM,QAAQ,GAAG,GAAG,CAAC,oBAAoB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC;QAEtH,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YAC5C,QAAQ,CAAC,YAAY,CAAC,CAAC,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;SACzC;QAED,OAAO,QAAQ,CAAC;IACjB,CAAC;IAED,IAAI;QACH,MAAM,GAAG,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QAC1C,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC;QAClC,IAAI,IAAI,CAAC,cAAc,EAAE,KAAK,QAAQ,EAAE;YACvC,GAAG,CAAC,WAAW,GAAG,QAAQ,CAAC;SAC3B;aAAM;YACN,GAAG,CAAC,SAAS,GAAG,QAAQ,CAAC;SACzB;IACF,CAAC;CACD;AAED,aAAa,CAAC,QAAQ,CAAC,uBAAuB,CAAC,CAAC;AAChD,WAAW,CAAC,QAAQ,CAAC,uBAAuB,CAAC,CAAC;AAC9C,cAAc,CAAC,QAAQ,CAAC,uBAAuB,CAAC,CAAC;AACjD,cAAc,CAAC,QAAQ,CAAC,uBAAuB,CAAC,CAAC;AACjD,YAAY,CAAC,QAAQ,CAAC,uBAAuB,CAAC,CAAC"}

package/Dom/shaders/index.d.ts

@@ -0,0 +1,2 @@
+export * from './LinearGradient';
+export * from './TwoPointConicalGradient';

package/Dom/shaders/index.js

@@ -0,0 +1,3 @@
+export * from './LinearGradient';
+export * from './TwoPointConicalGradient';
+//# sourceMappingURL=index.js.map

package/Dom/shaders/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../packages/canvas/Dom/shaders/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,2BAA2B,CAAC"}

package/Dom/shapes/Circle.js

@@ -5,18 +5,27 @@ export const cxProperty = new Property({
     valueConverter(value) {
         return parseFloat(value);
     },
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 export const cyProperty = new Property({
     name: 'cy',
     valueConverter(value) {
         return parseFloat(value);
     },
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 export const rProperty = new Property({
     name: 'r',
     valueConverter(value) {
         return parseFloat(value);
     },
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 export const cProperty = new ShorthandProperty({
     name: 'c',
@@ -86,6 +95,7 @@ export class Circle extends Paint {
             return true;
         }
         else if (view instanceof Paint) {
+            view._canvas = this._canvas;
             this._children.push(view);
         }
         return false;

package/Dom/shapes/Circle.js.map

@@ -1 +1 @@
-{"version":3,"file":"Circle.js","sourceRoot":"","sources":["../../../../../packages/canvas/Dom/shapes/Circle.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"Circle.js","sourceRoot":"","sources":["../../../../../packages/canvas/Dom/shapes/Circle.ts"],"names":[],"mappings":"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"}

package/Dom/shapes/Line.d.ts

@@ -1,9 +1,21 @@
 import { Property } from '@nativescript/core';
 import { Paint } from '../Paint';
-export declare const p1Property: Property<Line, number>;
-export declare const p2Property: Property<Line, number>;
+export declare const p1Property: Property<Line, {
+    x: number;
+    y: number;
+}>;
+export declare const p2Property: Property<Line, {
+    x: number;
+    y: number;
+}>;
 export declare class Line extends Paint {
-    p1: number;
-    p2: number;
+    p1: {
+        x: number;
+        y: number;
+    };
+    p2: {
+        x: number;
+        y: number;
+    };
     draw(): void;
 }

package/Dom/shapes/Line.js

@@ -1,15 +1,16 @@
 import { Property } from '@nativescript/core';
 import { Paint } from '../Paint';
+import { Path2D } from '../../Canvas2D';
 export const p1Property = new Property({
     name: 'p1',
-    valueConverter(value) {
-        return parseFloat(value);
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
     },
 });
 export const p2Property = new Property({
     name: 'p2',
-    valueConverter(value) {
-        return parseFloat(value);
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
     },
 });
 export class Line extends Paint {
@@ -20,14 +21,17 @@ export class Line extends Paint {
         const override_color = this.parent._overrideColor;
         const context = this._canvas.getContext('2d');
         const line = new Path2D();
-        line.lineTo(this.p1, this.p2);
-        const style = this.paintStyle;
+        line.lineTo(this.p1.x, this.p1.y);
+        line.lineTo(this.p2.x, this.p2.y);
+        const color = this._getColor();
+        const style = this._getPaintStyle();
         if (style === 'fill') {
-            context.fillStyle = this.color.hex;
+            context.fillStyle = color;
             context.fill(line);
         }
         else if (style === 'stroke') {
-            context.strokeStyle = this.color.hex;
+            context.strokeStyle = color;
+            context.lineWidth = this._getStrokeWidth();
             context.stroke(line);
         }
     }

package/Dom/shapes/Line.js.map

@@ -1 +1 @@
-{"version":3,"file":"Line.js","sourceRoot":"","sources":["../../../../../packages/canvas/Dom/shapes/Line.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,QAAQ,EAAoB,MAAM,oBAAoB,CAAC;AAE/E,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAEjC,MAAM,CAAC,MAAM,UAAU,GAAG,IAAI,QAAQ,CAAe;IACpD,IAAI,EAAE,IAAI;IACV,cAAc,CAAC,KAAK;QACnB,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,UAAU,GAAG,IAAI,QAAQ,CAAe;IACpD,IAAI,EAAE,IAAI;IACV,cAAc,CAAC,KAAK;QACnB,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,OAAO,IAAK,SAAQ,KAAK;IAI9B,IAAI;QACH,IAAI,IAAI,CAAC,EAAE,KAAK,SAAS,IAAI,IAAI,CAAC,EAAE,KAAK,SAAS,EAAE;YACnD,OAAO;SACP;QACD,MAAM,cAAc,GAAI,IAAI,CAAC,MAAc,CAAC,cAAc,CAAC;QAC3D,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAoC,CAAC;QACjF,MAAM,IAAI,GAAG,IAAI,MAAM,EAAE,CAAC;QAC1B,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;QAC9B,MAAM,KAAK,GAAG,IAAI,CAAC,UAAU,CAAC;QAC9B,IAAI,KAAK,KAAK,MAAM,EAAE;YACrB,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;YACnC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;SACnB;aAAM,IAAI,KAAK,KAAK,QAAQ,EAAE;YAC9B,OAAO,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;YACrC,OAAO,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;SACrB;IACF,CAAC;CACD;AAED,UAAU,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;AAC1B,UAAU,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC"}
+{"version":3,"file":"Line.js","sourceRoot":"","sources":["../../../../../packages/canvas/Dom/shapes/Line.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,QAAQ,EAAoB,MAAM,oBAAoB,CAAC;AAC/E,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAExC,MAAM,CAAC,MAAM,UAAU,GAAG,IAAI,QAAQ,CAAiC;IACtE,IAAI,EAAE,IAAI;IACV,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,UAAU,GAAG,IAAI,QAAQ,CAAiC;IACtE,IAAI,EAAE,IAAI;IACV,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,OAAO,IAAK,SAAQ,KAAK;IAI9B,IAAI;QACH,IAAI,IAAI,CAAC,EAAE,KAAK,SAAS,IAAI,IAAI,CAAC,EAAE,KAAK,SAAS,EAAE;YACnD,OAAO;SACP;QACD,MAAM,cAAc,GAAI,IAAI,CAAC,MAAc,CAAC,cAAc,CAAC;QAC3D,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAoC,CAAC;QACjF,MAAM,IAAI,GAAG,IAAI,MAAM,EAAE,CAAC;QAC1B,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;QAClC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;QAClC,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,EAAE,CAAC;QAC/B,MAAM,KAAK,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;QAEpC,IAAI,KAAK,KAAK,MAAM,EAAE;YACrB,OAAO,CAAC,SAAS,GAAG,KAAK,CAAC;YAC1B,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;SACnB;aAAM,IAAI,KAAK,KAAK,QAAQ,EAAE;YAC9B,OAAO,CAAC,WAAW,GAAG,KAAK,CAAC;YAC5B,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;YAC3C,OAAO,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;SACrB;IACF,CAAC;CACD;AAED,UAAU,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;AAC1B,UAAU,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC"}

package/Dom/shapes/Path.js

@@ -3,6 +3,9 @@ import { Paint } from '../Paint';
 import { Path2D } from '../../Canvas2D';
 export const pathProperty = new Property({
     name: 'path',
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 export class Path extends Paint {
     [pathProperty.setNative](value) {

package/Dom/shapes/Path.js.map

@@ -1 +1 @@
-{"version":3,"file":"Path.js","sourceRoot":"","sources":["../../../../../packages/canvas/Dom/shapes/Path.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAExC,MAAM,CAAC,MAAM,YAAY,GAAG,IAAI,QAAQ,CAAe;IACtD,IAAI,EAAE,MAAM;CACZ,CAAC,CAAC;AAEH,MAAM,OAAO,IAAK,SAAQ,KAAK;IAI9B,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,KAAK;QAC7B,IAAI,KAAK,EAAE;YACV,IAAI,CAAC,KAAK,GAAG,IAAI,MAAM,CAAC,KAAK,CAAC,CAAC;SAC/B;IACF,CAAC;IAED,IAAI;QACH,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS,EAAE;YAC7B,OAAO;SACP;QACD,MAAM,cAAc,GAAI,IAAI,CAAC,MAAc,CAAC,cAAc,CAAC;QAC3D,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAoC,CAAC;QAEjF,MAAM,KAAK,GAAG,IAAI,CAAC,UAAU,CAAC;QAC9B,IAAI,KAAK,KAAK,MAAM,EAAE;YACrB,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;YACnC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,KAAY,CAAC,CAAC;SAChC;aAAM,IAAI,KAAK,KAAK,QAAQ,EAAE;YAC9B,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC;YACrC,OAAO,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;YACrC,OAAO,CAAC,MAAM,CAAC,IAAI,CAAC,KAAY,CAAC,CAAC;SAClC;IACF,CAAC;CACD;AAED,YAAY,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC"}
+{"version":3,"file":"Path.js","sourceRoot":"","sources":["../../../../../packages/canvas/Dom/shapes/Path.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAExC,MAAM,CAAC,MAAM,YAAY,GAAG,IAAI,QAAQ,CAAe;IACtD,IAAI,EAAE,MAAM;IACZ,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,OAAO,IAAK,SAAQ,KAAK;IAI9B,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,KAAK;QAC7B,IAAI,KAAK,EAAE;YACV,IAAI,CAAC,KAAK,GAAG,IAAI,MAAM,CAAC,KAAK,CAAC,CAAC;SAC/B;IACF,CAAC;IAED,IAAI;QACH,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS,EAAE;YAC7B,OAAO;SACP;QACD,MAAM,cAAc,GAAI,IAAI,CAAC,MAAc,CAAC,cAAc,CAAC;QAC3D,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAoC,CAAC;QAEjF,MAAM,KAAK,GAAG,IAAI,CAAC,UAAU,CAAC;QAC9B,IAAI,KAAK,KAAK,MAAM,EAAE;YACrB,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;YACnC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,KAAY,CAAC,CAAC;SAChC;aAAM,IAAI,KAAK,KAAK,QAAQ,EAAE;YAC9B,OAAO,CAAC,SAAS,GAAG,IAAI,CAAC,WAAW,CAAC;YACrC,OAAO,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;YACrC,OAAO,CAAC,MAAM,CAAC,IAAI,CAAC,KAAY,CAAC,CAAC;SAClC;IACF,CAAC;CACD;AAED,YAAY,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC"}

package/Dom/shapes/Points.js

@@ -2,10 +2,16 @@ import { Property } from '@nativescript/core';
 import { Paint } from '../Paint';
 export const pointsProperty = new Property({
     name: 'points',
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 export const modeProperty = new Property({
     name: 'mode',
     defaultValue: 'points',
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 export class Points extends Paint {
     draw() {

package/Dom/shapes/Points.js.map

@@ -1 +1 @@
-{"version":3,"file":"Points.js","sourceRoot":"","sources":["../../../../../packages/canvas/Dom/shapes/Points.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,QAAQ,EAAoB,MAAM,oBAAoB,CAAC;AAE/E,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAEjC,MAAM,CAAC,MAAM,cAAc,GAAG,IAAI,QAAQ,CAAqC;IAC9E,IAAI,EAAE,QAAQ;CACd,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,YAAY,GAAG,IAAI,QAAQ,CAAyC;IAChF,IAAI,EAAE,MAAM;IACZ,YAAY,EAAE,QAAQ;CACtB,CAAC,CAAC;AAEH,MAAM,OAAO,MAAO,SAAQ,KAAK;IAIhC,IAAI;QACH,MAAM,cAAc,GAAI,IAAI,CAAC,MAAc,CAAC,cAAc,CAAC;QAC3D,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAoC,CAAC;QACjF,OAAO,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;QACpC,OAAe,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,IAAI,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;IACjE,CAAC;CACD;AAED,cAAc,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;AAChC,YAAY,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC"}
+{"version":3,"file":"Points.js","sourceRoot":"","sources":["../../../../../packages/canvas/Dom/shapes/Points.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,QAAQ,EAAoB,MAAM,oBAAoB,CAAC;AAE/E,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAEjC,MAAM,CAAC,MAAM,cAAc,GAAG,IAAI,QAAQ,CAAqC;IAC9E,IAAI,EAAE,QAAQ;IACd,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,YAAY,GAAG,IAAI,QAAQ,CAAyC;IAChF,IAAI,EAAE,MAAM;IACZ,YAAY,EAAE,QAAQ;IACtB,YAAY,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ;QACtC,MAAM,CAAC,UAAU,EAAE,CAAC;IACrB,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,OAAO,MAAO,SAAQ,KAAK;IAIhC,IAAI;QACH,MAAM,cAAc,GAAI,IAAI,CAAC,MAAc,CAAC,cAAc,CAAC;QAC3D,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAoC,CAAC;QACjF,OAAO,CAAC,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC;QACpC,OAAe,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,IAAI,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;IACjE,CAAC;CACD;AAED,cAAc,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;AAChC,YAAY,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC"}

package/Dom/shapes/Rect.js

@@ -5,24 +5,36 @@ export const xProperty = new Property({
     valueConverter(value) {
         return parseFloat(value);
     },
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 export const yProperty = new Property({
     name: 'y',
     valueConverter(value) {
         return parseFloat(value);
     },
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 export const widthProperty = new Property({
     name: 'width',
     valueConverter(value) {
         return parseFloat(value);
     },
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 export const heightProperty = new Property({
     name: 'height',
     valueConverter(value) {
         return parseFloat(value);
     },
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 export class Rect extends Paint {
     constructor() {
@@ -34,14 +46,16 @@ export class Rect extends Paint {
         context.rect(this.x, this.y, this.width, this.height);
         if (this._children.length > 0) {
             for (const child of this._children) {
-                switch (child.paintStyle) {
+                const color = child._getColor();
+                const style = child._getPaintStyle();
+                switch (style) {
                     case 'fill':
-                        context.fillStyle = child.color.hex;
+                        context.fillStyle = color;
                         context.fill();
                         break;
                     case 'stroke':
-                        context.strokeStyle = child.color.hex;
-                        context.lineWidth = child.strokeWidth;
+                        context.strokeStyle = color;
+                        context.lineWidth = child._getStrokeWidth();
                         context.stroke();
                         break;
                 }
@@ -52,7 +66,12 @@ export class Rect extends Paint {
         }
     }
     _addViewToNativeVisualTree(view, atIndex) {
-        if (view instanceof Paint) {
+        if (view === this._canvas) {
+            this.nativeView.addView(this._canvas.nativeView);
+            return true;
+        }
+        else if (view instanceof Paint) {
+            view._canvas = this._canvas;
             this._children.push(view);
         }
         return false;
@@ -60,4 +79,6 @@ export class Rect extends Paint {
 }
 xProperty.register(Rect);
 yProperty.register(Rect);
+widthProperty.register(Rect);
+heightProperty.register(Rect);
 //# sourceMappingURL=Rect.js.map

package/Dom/shapes/Rect.js.map

@@ -1 +1 @@
-{"version":3,"file":"Rect.js","sourceRoot":"","sources":["../../../../../packages/canvas/Dom/shapes/Rect.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,QAAQ,EAA8B,MAAM,oBAAoB,CAAC;AAEzF,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAEjC,MAAM,CAAC,MAAM,SAAS,GAAG,IAAI,QAAQ,CAAe;IACnD,IAAI,EAAE,GAAG;IACT,cAAc,CAAC,KAAK;QACnB,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,SAAS,GAAG,IAAI,QAAQ,CAAe;IACnD,IAAI,EAAE,GAAG;IACT,cAAc,CAAC,KAAK;QACnB,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,aAAa,GAAG,IAAI,QAAQ,CAAe;IACvD,IAAI,EAAE,OAAO;IACb,cAAc,CAAC,KAAK;QACnB,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,cAAc,GAAG,IAAI,QAAQ,CAAe;IACxD,IAAI,EAAE,QAAQ;IACd,cAAc,CAAC,KAAK;QACnB,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;CACD,CAAC,CAAC;AAEH,MAAM,OAAO,IAAK,SAAQ,KAAK;IAA/B;;QAMC,cAAS,GAAY,EAAE,CAAC;IA8BzB,CAAC;IA5BA,IAAI;QACH,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,IAAI,CAAoC,CAAC;QACjF,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;QACtD,IAAI,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,EAAE;YAC9B,KAAK,MAAM,KAAK,IAAI,IAAI,CAAC,SAAS,EAAE;gBACnC,QAAQ,KAAK,CAAC,UAAU,EAAE;oBACzB,KAAK,MAAM;wBACV,OAAO,CAAC,SAAS,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;wBACpC,OAAO,CAAC,IAAI,EAAE,CAAC;wBACf,MAAM;oBACP,KAAK,QAAQ;wBACZ,OAAO,CAAC,WAAW,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;wBACtC,OAAO,CAAC,SAAS,GAAG,KAAK,CAAC,WAAW,CAAC;wBACtC,OAAO,CAAC,MAAM,EAAE,CAAC;wBACjB,MAAM;iBACP;aACD;SACD;aAAM;YACN,KAAK,CAAC,IAAI,EAAE,CAAC;SACb;IACF,CAAC;IAED,0BAA0B,CAAC,IAAc,EAAE,OAAgB;QAC1D,IAAI,IAAI,YAAY,KAAK,EAAE;YAC1B,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;SAC1B;QACD,OAAO,KAAK,CAAC;IACd,CAAC;CACD;AAED,SAAS,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;AACzB,SAAS,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC"}
+{"version":3,"file":"Rect.js","sourceRoot":"","sources":["../../../../../packages/canvas/Dom/shapes/Rect.ts"],"names":[],"mappings":"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"}

package/Dom/shapes/RoundedRect.d.ts

@@ -1,6 +1,7 @@
 import { ViewBase } from '@nativescript/core';
 import { Paint } from '../Paint';
-export declare class RoundedRect extends Paint {
+import { Rect } from './Rect';
+export declare class RoundedRect extends Rect {
     x: number;
     y: number;
     width: number;

package/Dom/shapes/RoundedRect.js

@@ -1,25 +1,35 @@
 import { Property } from '@nativescript/core';
 import { Paint } from '../Paint';
 import { Shadow } from '../Shadow';
+import { Rect } from './Rect';
 const xProperty = new Property({
     name: 'x',
     valueConverter(value) {
         return parseFloat(value);
     },
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 const yProperty = new Property({
     name: 'y',
     valueConverter(value) {
         return parseFloat(value);
     },
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
 const rProperty = new Property({
     name: 'r',
     valueConverter(value) {
         return parseFloat(value);
     },
+    valueChanged(target, oldValue, newValue) {
+        target.invalidate();
+    },
 });
-export class RoundedRect extends Paint {
+export class RoundedRect extends Rect {
     constructor() {
         super(...arguments);
         this._children = [];