@triniwiz/nativescript-masonkit 1.0.0-beta.85 → 1.0.0-beta.86

package/br/index.windows.d.ts

@@ -0,0 +1,11 @@
+import { ViewBase } from '@nativescript/core';
+import { Style } from '../style';
+import { style_ } from '../symbols';
+export declare class Br extends ViewBase {
+    [style_]: any;
+    constructor();
+    get _view(): NativeScript.Mason.Br;
+    get windows(): NativeScript.Mason.Br;
+    get _styleHelper(): Style;
+    createNativeView(): NativeScript.Mason.Br;
+}

package/br/index.windows.js

@@ -0,0 +1,31 @@
+import { ViewBase } from '@nativescript/core';
+import { Style } from '../style';
+import { Tree } from '../tree';
+import { isMasonView_, isPlaceholder_, native_, style_ } from '../symbols';
+export class Br extends ViewBase {
+    constructor() {
+        super();
+        this[isMasonView_] = true;
+        this[isPlaceholder_] = true;
+    }
+    get _view() {
+        if (!this[native_]) {
+            this[native_] = Tree.instance.createBr();
+        }
+        return this[native_];
+    }
+    // @ts-ignore
+    get windows() {
+        return this._view;
+    }
+    get _styleHelper() {
+        if (this[style_] === undefined) {
+            this[style_] = Style.fromView(this, this._view);
+        }
+        return this[style_];
+    }
+    createNativeView() {
+        return this._view;
+    }
+}
+//# sourceMappingURL=index.windows.js.map

package/br/index.windows.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.windows.js","sourceRoot":"","sources":["../../../../packages/nativescript-masonkit/br/index.windows.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC/B,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC;AAE3E,MAAM,OAAO,EAAG,SAAQ,QAAQ;IAE9B;QACE,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC;QAC1B,IAAI,CAAC,cAAc,CAAC,GAAG,IAAI,CAAC;IAC9B,CAAC;IAED,IAAI,KAAK;QACP,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC;YACnB,IAAI,CAAC,OAAO,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAW,CAAC;QACpD,CAAC;QACD,OAAO,IAAI,CAAC,OAAO,CAAmC,CAAC;IACzD,CAAC;IAED,aAAa;IACb,IAAI,OAAO;QACT,OAAO,IAAI,CAAC,KAAK,CAAC;IACpB,CAAC;IAED,IAAI,YAAY;QACd,IAAI,IAAI,CAAC,MAAM,CAAC,KAAK,SAAS,EAAE,CAAC;YAC/B,IAAI,CAAC,MAAM,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,IAAa,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;QAC3D,CAAC;QACD,OAAO,IAAI,CAAC,MAAM,CAAC,CAAC;IACtB,CAAC;IAED,gBAAgB;QACd,OAAO,IAAI,CAAC,KAAK,CAAC;IACpB,CAAC;CACF"}

package/button/index.windows.d.ts

@@ -0,0 +1,12 @@
+import { ButtonBase } from '../common';
+import { Style } from '../style';
+import { style_ } from '../symbols';
+export declare class Button extends ButtonBase {
+    [style_]: any;
+    _inBatch: boolean;
+    constructor();
+    get _view(): NativeScript.Mason.Button;
+    get windows(): NativeScript.Mason.Button;
+    get _styleHelper(): Style;
+    createNativeView(): NativeScript.Mason.Button;
+}

package/button/index.windows.js

@@ -0,0 +1,44 @@
+import { CSSType } from '@nativescript/core';
+import { ButtonBase, textContentProperty } from '../common';
+import { Style } from '../style';
+import { Tree } from '../tree';
+import { style_, isText_, isMasonView_, native_ } from '../symbols';
+let Button = class Button extends ButtonBase {
+    constructor() {
+        super();
+        this._inBatch = false;
+        this[isText_] = true;
+        this[isMasonView_] = true;
+    }
+    get _view() {
+        if (!this[native_]) {
+            this[native_] = Tree.instance.createButtonView();
+        }
+        return this[native_];
+    }
+    // @ts-ignore
+    get windows() {
+        return this._view;
+    }
+    get _styleHelper() {
+        if (this[style_] === undefined) {
+            this[style_] = Style.fromView(this, this._view);
+        }
+        return this[style_];
+    }
+    createNativeView() {
+        return this._view;
+    }
+    [textContentProperty.setNative](value) {
+        const nativeView = this._view;
+        if (nativeView) {
+            nativeView.Content = value ?? '';
+        }
+    }
+};
+Button = __decorate([
+    CSSType('Button'),
+    __metadata("design:paramtypes", [])
+], Button);
+export { Button };
+//# sourceMappingURL=index.windows.js.map

package/button/index.windows.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.windows.js","sourceRoot":"","sources":["../../../../packages/nativescript-masonkit/button/index.windows.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAC7C,OAAO,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,WAAW,CAAC;AAC5D,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAG7D,IAAM,MAAM,GAAZ,MAAM,MAAO,SAAQ,UAAU;IAGpC;QACE,KAAK,EAAE,CAAC;QAFV,aAAQ,GAAG,KAAK,CAAC;QAGf,IAAI,CAAC,OAAO,CAAC,GAAG,IAAI,CAAC;QACrB,IAAI,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC;IAC5B,CAAC;IAED,IAAI,KAAK;QACP,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC;YACnB,IAAI,CAAC,OAAO,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,gBAAgB,EAAW,CAAC;QAC5D,CAAC;QACD,OAAO,IAAI,CAAC,OAAO,CAAuC,CAAC;IAC7D,CAAC;IAED,aAAa;IACb,IAAI,OAAO;QACT,OAAO,IAAI,CAAC,KAAK,CAAC;IACpB,CAAC;IAED,IAAI,YAAY;QACd,IAAI,IAAI,CAAC,MAAM,CAAC,KAAK,SAAS,EAAE,CAAC;YAC/B,IAAI,CAAC,MAAM,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,IAAa,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;QAC3D,CAAC;QACD,OAAO,IAAI,CAAC,MAAM,CAAC,CAAC;IACtB,CAAC;IAED,gBAAgB;QACd,OAAO,IAAI,CAAC,KAAK,CAAC;IACpB,CAAC;IAED,CAAC,mBAAmB,CAAC,SAAS,CAAC,CAAC,KAAK;QACnC,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC;QAC9B,IAAI,UAAU,EAAE,CAAC;YACf,UAAU,CAAC,OAAO,GAAG,KAAK,IAAI,EAAE,CAAC;QACnC,CAAC;IACH,CAAC;CACF,CAAA;AAtCY,MAAM;IADlB,OAAO,CAAC,QAAQ,CAAC;;GACL,MAAM,CAsClB"}

package/common.d.ts

@@ -161,6 +161,7 @@ export declare class ViewBase extends CustomLayoutView implements AddChildFromBu
     private _nativeReplaceChild;
     private _setOrPushChild;
     private _updateTextNode;
+    private _syncTextRunLayout;
     get filter(): string;
     set filter(value: string);
     set borderRadius(value: string | number | CoreTypes.LengthDipUnit | CoreTypes.LengthPxUnit);
@@ -183,6 +184,7 @@ export declare class ViewBase extends CustomLayoutView implements AddChildFromBu
     set scrollBarWidth(value: Length);
     get position(): Position;
     set position(value: Position);
+    private _applyTextRunProp;
     get alignContent(): import("@nativescript/core").AlignContent;
     set alignContent(value: import("@nativescript/core").AlignContent);
     get justifyItems(): import(".").AlignItems;

package/common.js

@@ -14,11 +14,72 @@ function getViewStyle(view) {
     const ret = (__ANDROID__ ? view.get() : view.deref());
     return ret._styleHelper;
 }
-/**
- * Cached per-view accessor for the framework's virtual DOM element.
- * The accessor is a function that retrieves the element cheaply on subsequent calls.
- * We use `false` as a sentinel to indicate "no framework detected" (avoids re-scanning).
- */
+// move to cpp
+function parseCssTransformToMatrix(s) {
+    if (!s || s === 'none')
+        return null;
+    let tx = 0, ty = 0, rad = 0, sx = 1, sy = 1;
+    let found = false;
+    const re = /(\w+)\(([^)]*)\)/g;
+    let m;
+    while ((m = re.exec(s))) {
+        found = true;
+        const args = m[2].split(',').map((a) => parseFloat(a.trim()));
+        switch (m[1]) {
+            case 'translate':
+                tx += args[0] || 0;
+                ty += args[1] || 0;
+                break;
+            case 'translateX':
+                tx += args[0] || 0;
+                break;
+            case 'translateY':
+                ty += args[0] || 0;
+                break;
+            case 'rotate':
+            case 'rotateZ':
+                rad += ((args[0] || 0) * Math.PI) / 180;
+                break;
+            case 'scale':
+                sx *= args[0] != null ? args[0] : 1;
+                sy *= args[1] != null ? args[1] : args[0] != null ? args[0] : 1;
+                break;
+            case 'scaleX':
+                sx *= args[0] != null ? args[0] : 1;
+                break;
+            case 'scaleY':
+                sy *= args[0] != null ? args[0] : 1;
+                break;
+        }
+    }
+    if (!found)
+        return null;
+    const cos = Math.cos(rad), sin = Math.sin(rad);
+    // CSS matrix(a,b,c,d,e,f) of rotate*scale → WinUI Matrix(M11,M12,M21,M22,OffsetX,OffsetY).
+    return { m11: sx * cos, m12: sx * sin, m21: -sy * sin, m22: sy * cos, tx, ty };
+}
+// move to cpp
+function parseBoxShadow(s) {
+    if (!s || s === 'none')
+        return null;
+    let color = 'rgba(0,0,0,0.2)';
+    let rest = s;
+    const m = s.match(/rgba?\([^)]*\)|#[0-9a-fA-F]{3,8}/);
+    if (m) {
+        color = m[0];
+        rest = s.replace(m[0], ' ');
+    }
+    const nums = (rest.match(/-?\d*\.?\d+/g) || []).map((n) => parseFloat(n));
+    const ox = nums[0] || 0, oy = nums[1] || 0, blur = nums[2] || 0;
+    let argb = 0x33000000;
+    try {
+        argb = new Color(color).argb >>> 0;
+    }
+    catch (_) {
+        /* keep default */
+    }
+    return { ox, oy, blur, argb };
+}
 const _frameworkAccessorCache = new WeakMap();
 function getFrameworkElement(view) {
     const cached = _frameworkAccessorCache.get(view);
@@ -186,6 +247,40 @@ export class ViewBase extends CustomLayoutView {
                 });
                 callback['mason:event:id'] = id;
             }
+            if (__WINDOWS__) {
+                if (arg === 'click' || arg === 'tap') {
+                    try {
+                        const NSWinRT_ = globalThis.NSWinRT;
+                        const MUX = globalThis.Microsoft;
+                        const owner = this;
+                        const view = this._view;
+                        const delegate = NSWinRT_.asDelegate('Microsoft.UI.Xaml.Input.TappedEventHandler', (_sender, _e) => {
+                            const ret = {};
+                            ret[native_] = _e;
+                            ret._target = owner;
+                            callback.call(thisArg || owner, ret);
+                        });
+                        if (view.Background == null && MUX?.UI?.Xaml?.Media?.SolidColorBrush) {
+                            view.Background = new MUX.UI.Xaml.Media.SolidColorBrush(MUX.UI.Colors.Transparent);
+                        }
+                        const tappedEvent = MUX?.UI?.Xaml?.UIElement?.TappedEvent ?? view.TappedEvent;
+                        let attached = false;
+                        if (tappedEvent && typeof view.AddHandler === 'function') {
+                            try {
+                                view.AddHandler(tappedEvent, delegate, true);
+                                callback['mason:event:tapped'] = tappedEvent;
+                                attached = true;
+                            }
+                            catch (_e) { }
+                        }
+                        if (!attached) {
+                            view.Tapped = delegate;
+                        }
+                        callback['mason:event:id'] = delegate;
+                    }
+                    catch (_) { }
+                }
+            }
         }
     }
     _unregisterNativeEvent(arg, callback, thisArg) {
@@ -212,6 +307,23 @@ export class ViewBase extends CustomLayoutView {
                     callback['mason:event:id'] = undefined;
                 }
             }
+            if (__WINDOWS__) {
+                if (id && (arg === 'click' || arg === 'tap')) {
+                    try {
+                        const view = this._view;
+                        const tappedEvent = callback['mason:event:tapped'];
+                        if (tappedEvent && typeof view.RemoveHandler === 'function') {
+                            view.RemoveHandler(tappedEvent, id);
+                        }
+                        else if (view) {
+                            view.Tapped = null;
+                        }
+                    }
+                    catch (_) { }
+                    callback['mason:event:id'] = undefined;
+                    callback['mason:event:tapped'] = undefined;
+                }
+            }
         }
     }
     initNativeView() {
@@ -546,6 +658,7 @@ export class ViewBase extends CustomLayoutView {
                 // Drop the proxy binding so a later re-adopt re-installs cleanly.
                 child[textNodeProxied_] = false;
                 child[textNode_] = undefined;
+                this._syncTextRunLayout();
                 this.requestLayout?.();
                 return;
             }
@@ -579,6 +692,11 @@ export class ViewBase extends CustomLayoutView {
             else
                 view.mason_removeChildAt?.(index);
         }
+        if (__WINDOWS__) {
+            //@ts-ignore
+            if (typeof view.RemoveRun === 'function')
+                view.RemoveRun(node);
+        }
     }
     removeChildren() {
         if (this._viewChildren.length === 0) {
@@ -659,6 +777,9 @@ export class ViewBase extends CustomLayoutView {
             if (__APPLE__) {
                 node[textNode_].data = text;
             }
+            if (__WINDOWS__) {
+                node[textNode_].Data = text;
+            }
             this._installTextNodeProxy(node);
             return node[textNode_];
         }
@@ -669,6 +790,11 @@ export class ViewBase extends CustomLayoutView {
         if (__APPLE__) {
             textNode = MasonTextNode.alloc().initWithMasonDataAttributes(Tree.instance.native, text, null);
         }
+        if (__WINDOWS__) {
+            const tn = new NativeScript.Mason.TextNode();
+            tn.Data = text;
+            textNode = tn;
+        }
         node[textNode_] = textNode;
         // Back-reference from the native node to the framework text node.
         textNode['__raw__'] = node;
@@ -722,6 +848,8 @@ export class ViewBase extends CustomLayoutView {
                         nativeTextNode.setData(data);
                     if (__APPLE__)
                         nativeTextNode.data = data;
+                    if (__WINDOWS__)
+                        nativeTextNode.Data = data;
                     // Re-measure/layout so the new text is reflected on screen.
                     owner.requestLayout?.();
                 }
@@ -735,6 +863,15 @@ export class ViewBase extends CustomLayoutView {
         //@ts-ignore
         if (__APPLE__)
             this._view.mason_addChildAtNode(textNode, index);
+        if (__WINDOWS__) {
+            const view = this._view;
+            if (!view)
+                return;
+            if (typeof view.SetRun === 'function')
+                view.SetRun(textNode, index);
+            else
+                NativeScript.Mason.Css.ReparentChild(view, textNode, index);
+        }
     }
     _nativeReplaceChild(textNode, index) {
         //@ts-ignore
@@ -743,6 +880,15 @@ export class ViewBase extends CustomLayoutView {
         //@ts-ignore
         if (__APPLE__)
             this._view.mason_replaceChildAtNode(textNode, index);
+        if (__WINDOWS__) {
+            const view = this._view;
+            if (!view)
+                return;
+            if (typeof view.SetRun === 'function')
+                view.SetRun(textNode, index);
+            else
+                NativeScript.Mason.Css.ReparentChild(view, textNode, index);
+        }
     }
     _setOrPushChild(index, entry) {
         if (this._children.length > index) {
@@ -758,6 +904,9 @@ export class ViewBase extends CustomLayoutView {
     _updateTextNode(node, operation = null) {
         const text = node.text ?? node.data ?? '';
         const textNode = this._createOrUpdateNativeTextNode(node, text);
+        if (__WINDOWS__ && textNode && typeof textNode.SetBreak === 'function') {
+            textNode.SetBreak(!!operation?.isBreak);
+        }
         if (!operation)
             return;
         const entry = { [text_]: text, [textNode_]: textNode, [textNodeIndex_]: operation.index ?? this._children.length };
@@ -776,6 +925,21 @@ export class ViewBase extends CustomLayoutView {
                 this._setOrPushChild(operation.index, entry);
                 break;
         }
+        this._syncTextRunLayout();
+    }
+    _syncTextRunLayout() {
+        if (!__WINDOWS__)
+            return;
+        // @ts-ignore
+        const sh = this._styleHelper;
+        if (!sh)
+            return;
+        try {
+            sh.display = 'block';
+        }
+        catch (_) {
+            // empty
+        }
     }
     // -- Text setter with per-view framework detection --
     [textProperty.setNative](value) {
@@ -954,6 +1118,13 @@ export class ViewBase extends CustomLayoutView {
         // @ts-ignore
         const style = this._styleHelper;
         if (style) {
+            // Pass the raw value straight through — the style setter's normalizeColorValue handles
+            // number / string / Color / {argb} via duck-typing, which is robust even when a `Color`
+            // instance comes from a different @nativescript/core copy (cross-copy `instanceof` fails).
+            // @ts-ignore
+            style.backgroundColor = value;
+            return;
+            // eslint-disable-next-line no-unreachable
             switch (typeof value) {
                 case 'number':
                     // @ts-ignore
@@ -1012,26 +1183,23 @@ export class ViewBase extends CustomLayoutView {
     [lineHeightProperty.setNative](value) {
         // @ts-ignore
         const style = this._styleHelper;
-        if (style) {
-            // @ts-ignore
+        // @ts-ignore
+        if (style)
             style.lineHeight = value;
-        }
     }
     [letterSpacingProperty.setNative](value) {
         // @ts-ignore
         const style = this._styleHelper;
-        if (style) {
-            // @ts-ignore
+        // @ts-ignore
+        if (style)
             style.letterSpacing = value;
-        }
     }
     [textAlignmentProperty.setNative](value) {
         // @ts-ignore
         const style = this._styleHelper;
-        if (style) {
-            // @ts-ignore
+        // @ts-ignore
+        if (style)
             style.textAlignment = value;
-        }
     }
     [textDecorationProperty.setNative](value) {
         // @ts-ignore
@@ -1172,13 +1340,37 @@ export class ViewBase extends CustomLayoutView {
             style.position = value;
         }
     }
+    // Windows: push a font/text property to the native Text container, which applies it to its
+    // TextBlock (the default for all inline runs). Font props otherwise only land in the style buffer,
+    // which the TextBlock-backed text doesn't read — so size/weight/line-height/letter-spacing
+    // wouldn't change visually. No-op on a container that isn't a Text.
+    _applyTextRunProp(method, arg) {
+        if (!__WINDOWS__)
+            return;
+        try {
+            const view = this._view;
+            if (view && typeof view[method] === 'function')
+                view[method](arg);
+        }
+        catch (_) { }
+    }
     [colorProperty.setNative](value) {
-        if (value instanceof Color) {
+        // @ts-ignore
+        const style = this._styleHelper;
+        if (style) {
+            // Duck-typed via normalizeColorValue (robust to cross-core Color instances).
             // @ts-ignore
-            const style = this._styleHelper;
-            if (style) {
-                // @ts-ignore
-                style.color = value.argb;
+            style.color = value;
+            if (__WINDOWS__) {
+                // Push the resolved color to the Text container's TextBlock (the default for all runs).
+                // Imperative — not during layout.
+                try {
+                    const argb = style.color >>> 0 || 0;
+                    const view = this._view;
+                    if (view && argb && typeof view.SetColor === 'function')
+                        view.SetColor(argb);
+                }
+                catch (_) { }
             }
         }
     }
@@ -1751,6 +1943,19 @@ export class ViewBase extends CustomLayoutView {
         if (style) {
             // @ts-ignore
             style.boxShadow = value;
+            if (__WINDOWS__) {
+                // box-shadow isn't a Mason buffer prop — render it as a Composition DropShadow on the element
+                // (masked to its rounded-rect shape, re-applied on resize). The corner radius is read natively.
+                const nv = this.nativeViewProtected ?? this._view;
+                try {
+                    const sh = parseBoxShadow(typeof value === 'string' ? value : '');
+                    if (!sh)
+                        NativeScript.Mason.Css.ClearShadow(nv);
+                    else
+                        NativeScript.Mason.Css.ApplyShadow(nv, sh.ox, sh.oy, sh.blur, sh.argb, 0);
+                }
+                catch (_) { }
+            }
         }
     }
     [transformProperty.setNative](value) {
@@ -1759,6 +1964,20 @@ export class ViewBase extends CustomLayoutView {
         if (style) {
             // @ts-ignore
             style.transform = value;
+            if (__WINDOWS__) {
+                // transform isn't a Mason buffer prop — apply it to the FrameworkElement via Composition,
+                // like @nativescript/core does on its own panels (the plugin's View is a custom Panel core
+                // doesn't drive transforms on). Parse the CSS string to a matrix and set RenderTransform.
+                const nv = this.nativeViewProtected ?? this._view;
+                try {
+                    const mtx = parseCssTransformToMatrix(typeof value === 'string' ? value : '');
+                    if (!mtx)
+                        NativeScript.Mason.Css.ClearTransform(nv);
+                    else
+                        NativeScript.Mason.Css.ApplyTransform(nv, mtx.m11, mtx.m12, mtx.m21, mtx.m22, mtx.tx, mtx.ty);
+                }
+                catch (_) { }
+            }
         }
     }
 }