@octane-xplat/patches 0.14.0 → 0.16.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@octane-xplat/patches",
-  "version": "0.14.0",
+  "version": "0.16.0",
   "description": "pnpm config dependency carrying the framework patch files",
   "keywords": [
     "framework",

package/patches/@nativescript-community__octane@0.2.4.patch

@@ -1,20 +1,195 @@
 diff --git a/dist/driver.js b/dist/driver.js
-index c88828e30337ee566bc1a919940e58b4b0227aba..52cde3f8f8acffcc05a1db8e0fcd90515efc70f6 100644
+index c88828e30337ee566bc1a919940e58b4b0227aba..5fcee7ffb92d8ddf937b65b27825cbb81944a195 100644
 --- a/dist/driver.js
 +++ b/dist/driver.js
-@@ -85,6 +85,11 @@ function setProp(node, view, name, value) {
+@@ -56,15 +56,34 @@ function applyProps(node, props) {
+     }
+ }
+ /**
+- * `update` carries the host's dynamic-prop snapshot; attributes that were
+- * static in the compiled plan arrive only with `create`. Merge instead of
+- * replace, or a first update would strip a node's static layout props.
++ * `update` carries the host's complete prop bag: a key present in the last
++ * applied bag but absent from the next is a removal, and the view state it
++ * installed returns to the prop's documented default. `undefined` never
++ * crosses the wire (the runtime elides it); `null` is "not supplied" for
++ * props without an explicit nullable contract — both reset through setProp.
+  */
+ function updateProps(node, next) {
++    const dropped = [];
++    for (const name in node.props) {
++        if (node.props[name] != null && !(name in next))
++            dropped.push(name);
++    }
+     applyProps(node, next);
+-    node.props = { ...node.props, ...next };
++    for (const name of dropped) {
++        resetProp(node, node.view, name);
++    }
++    node.props = next;
+ }
+ function setProp(node, view, name, value) {
++    // Keep authored placement separate from Grid's computed native coordinates.
++    // NativeScript does not retain a setter write equal to its default (row/col 0).
++    if (name === 'row' || name === 'col' || name === 'rowSpan' || name === 'colSpan') {
++        const key = Symbol.for('octane-xplat.grid-placement');
++        const placement = view[key] ?? (view[key] = {});
++        if (value == null || value === unsetValue) delete placement[name];
++        else placement[name] = value;
++        view.notify({ eventName: 'xplatGridPlacementChange', object: view });
++    }
+     if (name === 'children' || name === 'key' || name === 'ref')
+         return;
+     // Event props arrive as their own `event` commands.
+@@ -78,13 +97,28 @@ function setProp(node, view, name, value) {
+         return;
+     }
+     if (name === 'style') {
+-        applyStyle(view, value);
++        applyStyle(node, view, value);
+         return;
+     }
+     if (name === 'renderItem' && view instanceof ListView) {
          setRenderItem(view, value ?? null, createNativeScriptRoot);
          return;
      }
-+    // `undefined` means "prop not supplied" — skip the write. NativeScript
-+    // native setters coerce it (e.g. editable → ios.userInteractionEnabled =
-+    // NO) leaving dead UI that still has its JS listeners.
-+    if (value === undefined)
++    // `null`/`unsetValue` restore the prop's default rather than writing a
++    // literal null through a native setter. `undefined` is a removal: skip it
++    // when nothing applied (NativeScript setters coerce it badly) and reset
++    // when a real value did.
++    if (value == null || value === unsetValue) {
++        if (value === undefined && node.props[name] == null)
++            return;
++        resetProp(node, view, name);
 +        return;
++    }
++    // Capture the pre-prop value once so a plain (non-Property) field can be
++    // restored when the prop is removed later.
++    const defaults = (node.propDefaults ??= {});
++    if (!(name in defaults))
++        defaults[name] = view[name];
      // Core raises `<name>Change` for a script write exactly as for a user
      // edit; a controlled input must not see its own value come back as one.
      const echo = `${name}Change`;
-@@ -482,7 +487,7 @@ function applyCommand(container, command) {
+@@ -99,6 +133,44 @@ function setProp(node, view, name, value) {
+             node.muted.delete(echo);
+     }
+ }
++/** Restore a removed prop to the value it holds when never supplied. */
++function resetProp(node, view, name) {
++    if (view === null)
++        return;
++    if (name === 'children' || name === 'key' || name === 'ref')
++        return;
++    // `on*` handlers unbind through `event` commands, not props.
++    if (EVENT_PROP.test(name))
++        return;
++    if (name === 'className' || name === 'class') {
++        view.className = unsetValue;
++        return;
++    }
++    if (name === 'style') {
++        applyStyle(node, view, null);
++        return;
++    }
++    if (name === 'renderItem' && view instanceof ListView) {
++        setRenderItem(view, null, createNativeScriptRoot);
++        return;
++    }
++    const echo = `${name}Change`;
++    const listening = node.listeners.has(echo);
++    if (listening)
++        node.muted.add(echo);
++    try {
++        // Property/CssProperty setters consume the sentinel and restore the
++        // declared default. A plain field stores it raw — detect that and
++        // write back the captured pre-prop value instead.
++        view[name] = unsetValue;
++        if (view[name] === unsetValue)
++            view[name] = node.propDefaults?.[name];
++    }
++    finally {
++        if (listening)
++            node.muted.delete(echo);
++    }
++}
+ // `class`/`className` compose clsx-style on the DOM renderer; join arrays
+ // with spaces so NativeScript's class selectors can match each class.
+ function normalizeClass(value) {
+@@ -112,15 +184,67 @@ function normalizeClass(value) {
+             .join(' ');
+     return '';
+ }
+-function applyStyle(view, value) {
+-    if (value == null || value === unsetValue)
+-        return;
++/**
++ * The `style` prop replaces wholesale — a key dropped or nulled since the last
++ * apply resets what it installed (`unsetValue` clears a local CssProperty
++ * value so the cascade can re-apply). String styles are parsed for their
++ * declared names so a later object or removal can reset them.
++ */
++function applyStyle(node, view, value) {
++    const applied = node.styleKeys;
++    node.styleKeys = undefined;
+     if (typeof value === 'string') {
++        clearStyleKeys(view, applied);
+         view.setInlineStyle(value);
++        node.styleKeys = inlineStyleKeys(value);
++        return;
++    }
++    if (value == null || value === unsetValue || typeof value !== 'object') {
++        clearStyleKeys(view, applied);
+         return;
+     }
+-    if (typeof value === 'object')
+-        Object.assign(view.style, value);
++    if (applied !== undefined) {
++        for (const key of applied) {
++            if (!(key in value))
++                unsetStyleKey(view, key);
++        }
++    }
++    for (const [key, nextValue] of Object.entries(value)) {
++        if (nextValue == null)
++            unsetStyleKey(view, key);
++        else
++            view.style[key] = nextValue;
++    }
++    node.styleKeys = new Set(Object.keys(value));
++}
++function clearStyleKeys(view, keys) {
++    if (keys === undefined)
++        return;
++    for (const key of keys)
++        unsetStyleKey(view, key);
++}
++function unsetStyleKey(view, name) {
++    const style = view.style;
++    if (name.startsWith('--')) {
++        style.setUnscopedCssVariable?.(name, unsetValue);
++        return;
++    }
++    style[name] = unsetValue;
++    // A style field outside the CssProperty registry stores the sentinel raw.
++    if (style[name] === unsetValue)
++        style[name] = undefined;
++}
++function inlineStyleKeys(style) {
++    const keys = new Set();
++    for (const declaration of style.split(';')) {
++        const colon = declaration.indexOf(':');
++        if (colon === -1)
++            continue;
++        const name = declaration.slice(0, colon).trim();
++        if (name !== '')
++            keys.add(name.replace(/-([a-z])/g, (_, letter) => letter.toUpperCase()));
++    }
++    return keys;
+ }
+ /** Recompute a text host's `text` from its `#text` children. */
+ function syncText(parent) {
+@@ -482,7 +606,7 @@ function applyCommand(container, command) {
  }
  export const nativeScriptDriver = {
      id: NATIVESCRIPT_RENDERER_ID,

package/patches/@nativescript-community__octane@0.2.5.patch

@@ -0,0 +1,620 @@
+diff --git a/dist/driver.js b/dist/driver.js
+index 8bc563a..4cb1f95 100644
+--- a/dist/driver.js
++++ b/dist/driver.js
+@@ -3,6 +3,7 @@ import { createUniversalRoot, } from 'octane/universal/native';
+ import { NATIVESCRIPT_RENDERER_ID } from './config.js';
+ import { ELEMENTS, EVENT_PROP, eventNameFor, onElementReplaced, } from './elements.js';
+ import { releaseListView, setRenderItem, } from './list-view.js';
++import { Style as MasonStyle } from '@triniwiz/nativescript-masonkit/style';
+ /** `#text` nodes carry no view; the driver folds them into the parent's `text`. */
+ const TEXT = '#text';
+ /**
+@@ -73,7 +74,10 @@ function instantiate(type) {
+     if (Element === undefined) {
+         throw new Error(`NativeScript driver: <${type}> is not a registered element.`);
+     }
+-    return new Element();
++    const view = new Element();
++    if (MASON_CONTAINER_TAGS.has(type))
++        applyMasonDefaults(type, view);
++    return view;
+ }
+ function applyProps(node, props) {
+     if (node.view === null) {
+@@ -91,13 +95,23 @@ function applyProps(node, props) {
+     }
+ }
+ /**
+- * `update` carries the host's dynamic-prop snapshot; attributes that were
+- * static in the compiled plan arrive only with `create`. Merge instead of
+- * replace, or a first update would strip a node's static layout props.
++ * `update` carries the host's complete prop bag: a key present in the last
++ * applied bag but absent from the next is a removal, and the view state it
++ * installed returns to the prop's documented default. `undefined` never
++ * crosses the wire (the runtime elides it); `null` is "not supplied" for
++ * props without an explicit nullable contract — both reset through setProp.
+  */
+ function updateProps(node, next) {
++    const dropped = [];
++    for (const name in node.props) {
++        if (node.props[name] != null && !(name in next))
++            dropped.push(name);
++    }
+     applyProps(node, next);
+-    node.props = { ...node.props, ...next };
++    for (const name of dropped) {
++        resetProp(node, node.view, name);
++    }
++    node.props = next;
+ }
+ function setProp(node, view, name, value) {
+     if (name === 'children' || name === 'key' || name === 'ref')
+@@ -113,13 +127,36 @@ function setProp(node, view, name, value) {
+         return;
+     }
+     if (name === 'style') {
+-        applyStyle(view, value);
++        applyStyle(node, view, value);
+         return;
+     }
+     if (name === 'renderItem' && view instanceof ListView) {
+         setRenderItem(view, value ?? null, createNativeScriptRoot);
+         return;
+     }
++    // Mason cutover — all layout props are style-only: warn when a former
++    // prop name arrives on a mason container or a child of one.
++    if (MASON_CONTAINER_TAGS.has(node.type))
++        applyMasonContainerProp(node, view, name, value);
++    if (MASON_STYLE_ONLY_PROPS.has(name) &&
++        (MASON_CONTAINER_TAGS.has(node.type) ||
++            (node.parent !== null && MASON_CONTAINER_TAGS.has(node.parent.type))))
++        warnStyleOnlyProp(node, name);
++    // `null`/`unsetValue` restore the prop's default rather than writing a
++    // literal null through a native setter. `undefined` is a removal: skip it
++    // when nothing applied (NativeScript setters coerce it badly) and reset
++    // when a real value did.
++    if (value == null || value === unsetValue) {
++        if (value === undefined && node.props[name] == null)
++            return;
++        resetProp(node, view, name);
++        return;
++    }
++    // Capture the pre-prop value once so a plain (non-Property) field can be
++    // restored when the prop is removed later.
++    const defaults = (node.propDefaults ??= {});
++    if (!(name in defaults))
++        defaults[name] = view[name];
+     // Core raises `<name>Change` for a script write exactly as for a user
+     // edit; a controlled input must not see its own value come back as one.
+     const echo = `${name}Change`;
+@@ -134,6 +171,44 @@ function setProp(node, view, name, value) {
+             node.muted.delete(echo);
+     }
+ }
++/** Restore a removed prop to the value it holds when never supplied. */
++function resetProp(node, view, name) {
++    if (view === null)
++        return;
++    if (name === 'children' || name === 'key' || name === 'ref')
++        return;
++    // `on*` handlers unbind through `event` commands, not props.
++    if (EVENT_PROP.test(name))
++        return;
++    if (name === 'className' || name === 'class') {
++        view.className = unsetValue;
++        return;
++    }
++    if (name === 'style') {
++        applyStyle(node, view, null);
++        return;
++    }
++    if (name === 'renderItem' && view instanceof ListView) {
++        setRenderItem(view, null, createNativeScriptRoot);
++        return;
++    }
++    const echo = `${name}Change`;
++    const listening = node.listeners.has(echo);
++    if (listening)
++        node.muted.add(echo);
++    try {
++        // Property/CssProperty setters consume the sentinel and restore the
++        // declared default. A plain field stores it raw — detect that and
++        // write back the captured pre-prop value instead.
++        view[name] = unsetValue;
++        if (view[name] === unsetValue)
++            view[name] = node.propDefaults?.[name];
++    }
++    finally {
++        if (listening)
++            node.muted.delete(echo);
++    }
++}
+ // `class`/`className` compose clsx-style on the DOM renderer; join arrays
+ // with spaces so NativeScript's class selectors can match each class.
+ function normalizeClass(value) {
+@@ -147,16 +222,214 @@ function normalizeClass(value) {
+             .join(' ');
+     return '';
+ }
+-function applyStyle(view, value) {
+-    if (value == null || value === unsetValue)
+-        return;
++/**
++ * The `style` prop replaces wholesale — a key dropped or nulled since the last
++ * apply resets what it installed (`unsetValue` clears a local CssProperty
++ * value so the cascade can re-apply). String styles are parsed for their
++ * declared names so a later object or removal can reset them.
++ */
++function applyStyle(node, view, value) {
++    const applied = node.styleKeys;
++    node.styleKeys = undefined;
+     if (typeof value === 'string') {
++        clearStyleKeys(view, applied);
+         view.setInlineStyle(value);
++        node.styleKeys = inlineStyleKeys(value);
++        return;
++    }
++    if (value == null || value === unsetValue || typeof value !== 'object') {
++        clearStyleKeys(view, applied);
++        return;
++    }
++    if (applied !== undefined) {
++        for (const key of applied) {
++            if (!(key in value))
++                unsetStyleKey(view, key);
++        }
++    }
++    // Mason layout keys target the leaf style under a mason parent —
++    // `view.style` is the NS surface where they land as dead fields. The leaf
++    // style exists only once the parent attaches the view, so entries are
++    // stashed and replayed by applyMasonChildLayout.
++    const parentIsMason = node.parent !== null && MASON_CONTAINER_TAGS.has(node.parent.type);
++    const masonLeaf = parentIsMason ? masonChildStyle(view) : undefined;
++    for (const [key, nextValue] of Object.entries(value)) {
++        if (MASON_LEAF_STYLE_KEYS.has(key)) {
++            const leafStash = view[MASON_LEAF_STYLE_STASH] ?? (view[MASON_LEAF_STYLE_STASH] = {});
++            leafStash[key] = nextValue == null ? undefined : nextValue;
++            if (masonLeaf !== undefined)
++                masonLeaf[key] = nextValue == null ? undefined : nextValue;
++        }
++        if (nextValue == null)
++            unsetStyleKey(view, key);
++        else
++            view.style[key] = nextValue;
++    }
++    node.styleKeys = new Set(Object.keys(value));
++}
++function clearStyleKeys(view, keys) {
++    if (keys === undefined)
++        return;
++    for (const key of keys)
++        unsetStyleKey(view, key);
++}
++function unsetStyleKey(view, name) {
++    const style = view.style;
++    if (name.startsWith('--')) {
++        style.setUnscopedCssVariable?.(name, unsetValue);
++        return;
++    }
++    style[name] = unsetValue;
++    // A style field outside the CssProperty registry stores the sentinel raw.
++    if (style[name] === unsetValue)
++        style[name] = undefined;
++}
++function inlineStyleKeys(style) {
++    const keys = new Set();
++    for (const declaration of style.split(';')) {
++        const colon = declaration.indexOf(':');
++        if (colon === -1)
++            continue;
++        const name = declaration.slice(0, colon).trim();
++        if (name !== '')
++            keys.add(name.replace(/-([a-z])/g, (_, letter) => letter.toUpperCase()));
++    }
++    return keys;
++}
++
++// --- Mason layout cutover ---------------------------------------------------
++// masonview is the single layout intrinsic — all layout is expressed in CSS
++// props (display/flex/grid/position), forwarded onto the node's mason Style.
++// scrollview stays the platform scroll shell (MasonKit Scroll). Dispatch is
++// by node tag, so nothing below re-derives the view's class.
++const MASON_CONTAINER_TAGS = new Set(['masonview', 'scrollview']);
++// Props whose CssProperty is registered on core's layout classes, never on
++// MasonKit's ViewBase — `view.flexDirection` would store a dead field, so the
++// write is forwarded to the mason Style surface instead.
++// Every former layout-prop name — contract props, LayoutChildProps sugar,
++// and raw CSS keys alike — is style-only now. As direct props they land on a
++// dead native field, so the driver warns once per key instead.
++const MASON_STYLE_ONLY_PROPS = new Set([
++    'display', 'position', 'inset', 'aspectRatio', 'overflow', 'overflowX',
++    'overflowY', 'flexBasis', 'justifySelf', 'justifyItems', 'direction',
++    'boxSizing', 'textAlign', 'scrollbarWidth', 'gridTemplateRows',
++    'gridTemplateColumns', 'gridTemplateAreas', 'gridAutoFlow', 'gridAutoRows',
++    'gridAutoColumns', 'gridRow', 'gridColumn', 'gridRowStart', 'gridRowEnd',
++    'gridColumnStart', 'gridColumnEnd', 'gridArea', 'flexDirection', 'flexWrap',
++    'justifyContent', 'alignItems', 'alignContent', 'gap', 'rowGap',
++    'columnGap', 'flexGrow', 'flexShrink', 'alignSelf', 'order', 'row', 'col',
++    'rowSpan', 'colSpan', 'dock', 'horizontalAlignment', 'verticalAlignment',
++    'flexWrapBefore', 'stretchLastChild', 'itemWidth', 'itemHeight',
++    'rows', 'columns',
++]);
++// Style-bag keys that mason owns — under a mason parent these are written to
++// the child's mason leaf style in addition to the NS style surface.
++const MASON_LEAF_STYLE_KEYS = new Set([
++    ...MASON_STYLE_ONLY_PROPS, 'left', 'top', 'right', 'bottom',
++]);
++const MASON_LEAF_STYLE_STASH = Symbol.for('octane-xplat.mason-leaf-style');
++const warnedStyleOnlyProps = new Set();
++function warnStyleOnlyProp(node, name) {
++    const key = node.type + ':' + name;
++    if (warnedStyleOnlyProps.has(key))
++        return;
++    warnedStyleOnlyProps.add(key);
++    console.warn(`[xplat] <${node.type} ${name}=...> is a layout key — move it into style={{ ${name}: ... }} or a class.`);
++}
++
++/** A mason Style bound to the node's mason leaf — `_styleHelper` on MasonKit's
++ *  own views; for foreign ({N}-native) children, `Style.fromView` binds the
++ *  leaf node `nodeForView` creates at insert. Returns undefined until the
++ *  child's native view exists (props are stashed and replayed at attach). */
++function masonChildStyle(view) {
++    if (view === null || view === undefined)
++        return undefined;
++    const helper = view._styleHelper;
++    if (helper !== undefined)
++        return helper;
++    const native = view.nativeViewProtected;
++    if (!native)
++        return undefined;
++    try {
++        return MasonStyle.fromView(view, native);
++    }
++    catch {
++        return undefined;
++    }
++}
++
++/** NS attached alignment -> CSS self-alignment keyword. */
++function masonAlignKeyword(value) {
++    switch (value) {
++        case 'left':
++        case 'top':
++            return 'start';
++        case 'right':
++        case 'bottom':
++            return 'end';
++        case 'center':
++        case 'middle':
++            return 'center';
++        case 'stretch':
++            return 'stretch';
++    }
++    return undefined;
++}
++
++/** Container-role defaults — equivalent to each NS layout's built-in mode. */
++function applyMasonDefaults(type, view) {
++    const style = view.style;
++    if (type === 'scrollview') {
++        style.display = 'flex';
++        style.flexDirection = 'column';
++        style.overflowY = 'scroll';
++        style.overflowX = 'hidden';
++    }
++    style.alignItems = 'stretch';
++    // Containers establish the containing block for absolute descendants.
++    style.position = 'relative';
++}
++
++/** Container-role prop -> mason style write. Runs for every prop on a mason
++ *  container; only the scrollview chrome keys (orientation/scroll toggles)
++ *  still translate — everything else is style-only. */
++function applyMasonContainerProp(node, view, name, value) {
++    const style = view.style;
++    const unset = value == null || value === unsetValue;
++    if (node.type === 'scrollview') {
++        if (name === 'orientation' || name === 'horizontal') {
++            const horizontal = !unset && (value === 'horizontal' || value === true);
++            style.flexDirection = horizontal ? 'row' : 'column';
++            style.overflowX = horizontal ? 'scroll' : 'hidden';
++            style.overflowY = horizontal ? 'hidden' : 'scroll';
++        }
++        if (name === 'isScrollEnabled') {
++            const enabled = !unset && value !== false;
++            style.overflowX = enabled ? 'scroll' : 'hidden';
++            style.overflowY = enabled ? 'scroll' : 'hidden';
++        }
++    }
++}
++
++/** Replay a child's authored mason style entries onto its leaf — the leaf
++ *  style only exists once the parent attaches the view, so `applyStyle`
++ *  stashes leaf-intended keys and every attach replays them. Sibling order is
++ *  irrelevant to the replay, but the pass runs per sibling anyway so a child
++ *  inserted later still gets its stash flushed. */
++function applyMasonChildLayout(node, parent) {
++    const view = node.view;
++    if (view === null || view === undefined)
+         return;
++    const style = masonChildStyle(view);
++    if (style === undefined)
++        return;
++    const leafStash = view[MASON_LEAF_STYLE_STASH];
++    if (leafStash !== undefined) {
++        for (const key of Object.keys(leafStash))
++            style[key] = leafStash[key];
+     }
+-    if (typeof value === 'object')
+-        Object.assign(view.style, value);
+ }
++
+ /** Recompute a text host's `text` from its `#text` children. */
+ function syncText(parent) {
+     if (parent === null || isPortalTarget(parent))
+@@ -190,6 +463,15 @@ function addViewChild(parentView, view, index) {
+         parentView.insertChild(view, Math.min(index, parentView.getChildrenCount()));
+         return;
+     }
++    // Custom-layout containers that own their child list without subclassing
++    // LayoutBase (e.g. MasonKit ViewBase — CustomLayoutView → ContainerView).
++    // Plain View/ContainerView lacks insertChild, so this stays a capability
++    // check rather than a catch-all.
++    if (typeof parentView.insertChild === 'function' && typeof parentView.removeChild === 'function') {
++        const count = typeof parentView.getChildrenCount === 'function' ? parentView.getChildrenCount() : index;
++        parentView.insertChild(view, Math.min(index, count));
++        return;
++    }
+     if (parentView instanceof ContentView) {
+         parentView.content = view;
+         return;
+@@ -234,6 +516,13 @@ function removeViewChild(parentView, view) {
+             parentView.removeChild(view);
+         return;
+     }
++    // Same capability check as addViewChild: custom-layout containers that
++    // aren't LayoutBase subclasses remove children through removeChild.
++    if (typeof parentView.removeChild === 'function' && typeof parentView.insertChild === 'function') {
++        if (view.parent === parentView)
++            parentView.removeChild(view);
++        return;
++    }
+     if (parentView instanceof ContentView) {
+         if (parentView.content === view)
+             parentView.content = CLEARED;
+@@ -370,6 +659,13 @@ function attach(container, node) {
+         }
+     }
+     addViewChild(parentView, node.view, index);
++    // The child's mason leaf node exists only once the parent has attached it;
++    // replay placement for every sibling (dock's stretchLastChild depends on
++    // the full sibling list).
++    if (parent !== null && MASON_CONTAINER_TAGS.has(parent.type)) {
++        for (const sibling of childrenOf(container, parent))
++            applyMasonChildLayout(sibling, parent);
++    }
+     markTabView(tabViewOwning(node));
+ }
+ function insert(container, parent, node, before) {
+@@ -548,7 +844,7 @@ function preparePortalTarget(context) {
+     }
+     const target = owner?.node.view ?? suppliedTarget;
+     if (!(target instanceof LayoutBase)) {
+-        throw new TypeError(`NativeScript driver: a <${target.typeName}> view cannot host portal children; target a layout (e.g. rootlayout, gridlayout).`);
++        throw new TypeError(`NativeScript driver: a <${target.typeName}> view cannot host portal children; target a layout (e.g. rootlayout, masonview).`);
+     }
+     let id = portalTargetIds.get(target);
+     if (id === undefined) {
+@@ -641,7 +937,7 @@ function applyCommand(container, command) {
+ }
+ export const nativeScriptDriver = {
+     id: NATIVESCRIPT_RENDERER_ID,
+-    capabilities: { text: 'host' },
++    capabilities: { text: 'host', visibility: true },
+     events: {
+         classify(name) {
+             if (!EVENT_PROP.test(name))
+diff --git a/dist/elements.js b/dist/elements.js
+index a13bcea..e9988e1 100644
+--- a/dist/elements.js
++++ b/dist/elements.js
+@@ -1,4 +1,7 @@
+-import { AbsoluteLayout, ActionBar, ActionItem, ActivityIndicator, Button, LiquidGlass, ContentView, DatePicker, DockLayout, FlexboxLayout, FormattedString, Frame, GridLayout, HtmlView, Image, Label, ListPicker, ListView, NavigationButton, Page, Placeholder, Progress, ProxyViewContainer, RootLayout, ScrollView, SearchBar, SegmentedBar, SegmentedBarItem, Slider, Span, StackLayout, Switch, TabView, TabViewItem, TextField, TextView, TimePicker, WebView, WrapLayout, } from '@nativescript/core';
++import { ActionBar, ActionItem, ActivityIndicator, Button, LiquidGlass, ContentView, DatePicker, FormattedString, Frame, HtmlView, Image, Label, ListPicker, ListView, NavigationButton, Page, Placeholder, Progress, ProxyViewContainer, RootLayout, SearchBar, SegmentedBar, SegmentedBarItem, Slider, Span, Switch, TabView, TabViewItem, TextField, TextView, TimePicker, WebView, } from '@nativescript/core';
++// Mason cutover: container intrinsics resolve to MasonKit views; the driver
++// translates their NativeScript-shaped props into mason style writes.
++import { View as MasonView, Scroll as MasonScroll } from '@triniwiz/nativescript-masonkit';
+ /**
+  * Lowercase tag name -> view constructor. The keys are the JSX tag names of
+  * `intrinsics.ts`; an app extends the vocabulary with `registerElement`.
+@@ -28,18 +31,14 @@ export function onElementReplaced(listener) {
+     };
+ }
+ const BUILTIN_ELEMENTS = [
+-    ['absolutelayout', AbsoluteLayout],
+     ['actionbar', ActionBar],
+     ['actionitem', ActionItem],
+     ['activityindicator', ActivityIndicator],
+     ['button', Button],
+     ['contentview', ContentView],
+     ['datepicker', DatePicker],
+-    ['docklayout', DockLayout],
+-    ['flexboxlayout', FlexboxLayout],
+     ['formattedstring', FormattedString],
+     ['frame', Frame],
+-    ['gridlayout', GridLayout],
+     ['htmlview', HtmlView],
+     ['image', Image],
+     ['label', Label],
+@@ -51,13 +50,12 @@ const BUILTIN_ELEMENTS = [
+     ['progress', Progress],
+     ['proxyviewcontainer', ProxyViewContainer],
+     ['rootlayout', RootLayout],
+-    ['scrollview', ScrollView],
++    ['scrollview', MasonScroll],
+     ['searchbar', SearchBar],
+     ['segmentedbar', SegmentedBar],
+     ['segmentedbaritem', SegmentedBarItem],
+     ['slider', Slider],
+     ['span', Span],
+-    ['stacklayout', StackLayout],
+     ['switch', Switch],
+     ['tabview', TabView],
+     ['tabviewitem', TabViewItem],
+@@ -65,8 +63,8 @@ const BUILTIN_ELEMENTS = [
+     ['textview', TextView],
+     ['timepicker', TimePicker],
+     ['webview', WebView],
+-    ['wraplayout', WrapLayout],
+     ['liquidglass', LiquidGlass],
++    ['masonview', MasonView],
+ ];
+ for (const [tag, element] of BUILTIN_ELEMENTS)
+     registerElement(tag, element);
+diff --git a/dist/intrinsics.d.ts b/dist/intrinsics.d.ts
+index 45a47cb..668c920 100644
+--- a/dist/intrinsics.d.ts
++++ b/dist/intrinsics.d.ts
+@@ -24,9 +24,9 @@
+  */
+ import type * as NS from '@nativescript/core';
+ export type NativeScriptNode = unknown;
+-type Ref<TInstance> = ((instance: TInstance | null) => void) | {
++type Ref<TInstance> = ((instance: TInstance | null) => void | (() => void)) | {
+     current: TInstance | null;
+-} | null;
++} | readonly Ref<TInstance>[] | null | undefined;
+ /**
+  * The driver assigns every non-event prop onto the view instance, so a JSX
+  * attribute is a NativeScript view property rather than a DOM attribute.
+@@ -76,34 +76,67 @@ export interface CommonEvents<TInstance> {
+ export type ClassValue = string | boolean | null | undefined | readonly ClassValue[] | {
+     readonly [className: string]: unknown;
+ };
++/** Mason engine style keys accepted through `style`/`className` — under a
++ * masonview parent a child's leaf style consumes them; on a masonview they
++ * are the container's own layout. These are the only way to set raw layout
++ * properties: direct props of the same names are rejected by the driver. */
++export interface MasonStyleProps {
++    display?: string;
++    position?: string;
++    inset?: number | string;
++    left?: number | string;
++    top?: number | string;
++    right?: number | string;
++    bottom?: number | string;
++    direction?: string;
++    boxSizing?: string;
++    flexDirection?: string;
++    flexWrap?: string;
++    justifyContent?: string;
++    justifyItems?: string;
++    justifySelf?: string;
++    alignItems?: string;
++    alignContent?: string;
++    alignSelf?: string;
++    textAlign?: string;
++    gap?: number | string;
++    rowGap?: number | string;
++    columnGap?: number | string;
++    flexGrow?: number;
++    flexShrink?: number;
++    flexBasis?: number | string;
++    order?: number;
++    aspectRatio?: number;
++    overflow?: string;
++    overflowX?: string;
++    overflowY?: string;
++    scrollbarWidth?: number;
++    gridTemplateRows?: string;
++    gridTemplateColumns?: string;
++    gridTemplateAreas?: string;
++    gridAutoFlow?: string;
++    gridAutoRows?: string;
++    gridAutoColumns?: string;
++    gridRow?: string;
++    gridColumn?: string;
++    gridRowStart?: string | number;
++    gridRowEnd?: string | number;
++    gridColumnStart?: string | number;
++    gridColumnEnd?: string | number;
++    gridArea?: string;
++}
+ export interface CommonAttributes {
+     /** Resolved against `app.css`. */
+     className?: ClassValue;
+     class?: ClassValue;
+     /** A string is parsed as inline CSS; an object is assigned onto `view.style`. */
+-    style?: string | Partial<NS.Style>;
++    style?: string | Partial<NS.Style> | MasonStyleProps;
+     /**
+      * Name of the property on a slot-hosting parent (e.g. a drawer's
+      * `mainContent` / `leftDrawer`) this child should be assigned to instead of
+      * being added as a regular layout child.
+      */
+     hostSlot?: string;
+-    /**
+-     * Attached layout properties. The layout modules register these on `View` at
+-     * runtime, so they are absent from the `@nativescript/core` class typings.
+-     */
+-    row?: number | string;
+-    col?: number | string;
+-    rowSpan?: number | string;
+-    colSpan?: number | string;
+-    dock?: 'top' | 'right' | 'bottom' | 'left';
+-    left?: number | string;
+-    top?: number | string;
+-    flexGrow?: number | string;
+-    flexShrink?: number | string;
+-    flexWrapBefore?: boolean | string;
+-    alignSelf?: 'auto' | 'flex-start' | 'flex-end' | 'center' | 'baseline' | 'stretch';
+-    order?: number | string;
+ }
+ export interface ListViewAttributes {
+     /**
+@@ -117,25 +150,21 @@ export interface ListViewAttributes {
+ }
+ export interface OctaneAttributes<TInstance> {
+     key?: string | number;
+-    ref?: Ref<TInstance> | readonly Ref<TInstance>[];
++    ref?: Ref<TInstance>;
+     children?: NativeScriptNode;
+ }
+ type Overridden = keyof CommonAttributes | keyof OctaneAttributes<unknown> | keyof CommonEvents<unknown>;
+ /** Props of a JSX tag backed by a `@nativescript/core`-style view class; the type to use for app-registered tags. */
+ export type Attributes<TClass extends abstract new (...args: never[]) => unknown> = Omit<ViewProperties<InstanceType<TClass>> & DerivedEvents<TClass, InstanceType<TClass>>, Overridden> & CommonAttributes & CommonEvents<InstanceType<TClass>> & OctaneAttributes<InstanceType<TClass>>;
+ export interface NativeScriptElements {
+-    absolutelayout: Attributes<typeof NS.AbsoluteLayout>;
+     actionbar: Attributes<typeof NS.ActionBar>;
+     actionitem: Attributes<typeof NS.ActionItem>;
+     activityindicator: Attributes<typeof NS.ActivityIndicator>;
+     button: Attributes<typeof NS.Button>;
+     contentview: Attributes<typeof NS.ContentView>;
+     datepicker: Attributes<typeof NS.DatePicker>;
+-    docklayout: Attributes<typeof NS.DockLayout>;
+-    flexboxlayout: Attributes<typeof NS.FlexboxLayout>;
+     formattedstring: Attributes<typeof NS.FormattedString>;
+     frame: Attributes<typeof NS.Frame>;
+-    gridlayout: Attributes<typeof NS.GridLayout>;
+     htmlview: Attributes<typeof NS.HtmlView>;
+     image: Attributes<typeof NS.Image>;
+     label: Attributes<typeof NS.Label>;
+@@ -153,7 +182,6 @@ export interface NativeScriptElements {
+     segmentedbaritem: Attributes<typeof NS.SegmentedBarItem>;
+     slider: Attributes<typeof NS.Slider>;
+     span: Attributes<typeof NS.Span>;
+-    stacklayout: Attributes<typeof NS.StackLayout>;
+     switch: Attributes<typeof NS.Switch>;
+     tabview: Attributes<typeof NS.TabView>;
+     tabviewitem: Attributes<typeof NS.TabViewItem>;
+@@ -161,7 +189,8 @@ export interface NativeScriptElements {
+     textview: Attributes<typeof NS.TextView>;
+     timepicker: Attributes<typeof NS.TimePicker>;
+     webview: Attributes<typeof NS.WebView>;
+-    wraplayout: Attributes<typeof NS.WrapLayout>;
++    /** The single layout container — all layout flows through `style`/`className`; layout prop names are rejected by the driver. */
++    masonview: Attributes<typeof NS.View>;
+     /** iOS 26 glass surface (plain layout elsewhere); behaves as a GridLayout. */
+     liquidglass: Attributes<typeof NS.LiquidGlass>;
+ }

package/patches/@nativescript__doctor@2.0.18.patch

@@ -0,0 +1,13 @@
+diff --git a/dist/android-tools-info.js b/dist/android-tools-info.js
+index ed84fd1c23bbc3161d40fdd7c65dbd842704696c..ef647fb6b834a5fdf4d09da5e920e8befce1e6f2 100644
+--- a/dist/android-tools-info.js
++++ b/dist/android-tools-info.js
+@@ -383,7 +383,7 @@ class AndroidToolsInfo {
+             });
+             if (foundRuntime) {
+                 let version = content.devDependencies[foundRuntime];
+-                if (version.includes("tgz")) {
++                if (version.includes("tgz") || version.startsWith("catalog:")) {
+                     try {
+                         const packagePath = require.resolve(`${foundRuntime}/package.json`, {
+                             paths: [projectDir],

package/patches/@nativescript__vite@8.0.17.patch

@@ -107,6 +107,43 @@ index a05696b679b3feecd1bafa267de44b59db559162..06648067a3fcf7f8c74437a82b94ec01
      }
      return ['.native', ''];
  }
+diff --git a/hmr/helpers/ast-normalizer.js b/hmr/helpers/ast-normalizer.js
+index c6113c74247db616609b87d7f365c4d4c199c934..73651a1fd1892555cc5dd57bcefb9e93d30516b6 100644
+--- a/hmr/helpers/ast-normalizer.js
++++ b/hmr/helpers/ast-normalizer.js
+@@ -86,9 +86,10 @@ export function astNormalizeModuleImportsAndHelpers(code, opts) {
+         // path (e.g. `html-entities` when not in optimizeDeps) — those must be
+         // rewritten to the bare id (see below), not removed; removing them
+         // left consumer bindings undefined (`decode is not defined`).
++        // User virtual stylesheets must reach the native CSS registration route.
+         // Exemption: oxc runtime helper virtuals are real servable URLs that
+         // downstream passes preserve/origin-prefix — keep them here too.
+-        const isViteVirtual = (src) => !!src && (/\0/.test(src) || /__x00__/.test(src)) && !src.includes('__x00__@oxc-project+runtime');
++        const isViteVirtual = (src) => !!src && (/\0/.test(src) || /__x00__/.test(src)) && !src.includes('__x00__@oxc-project+runtime') && !/\.(css|scss|sass|less|styl|stylus)(?:[?#]|$)/i.test(src);
+         const realIdPrefixed = (src) => {
+             if (!src || !src.startsWith('/@id/'))
+                 return null;
+diff --git a/hmr/server/css-device-module.js b/hmr/server/css-device-module.js
+index 0d7cd968eac690a85411cf3d6a24323a3d3a3992..98094d6ccfb918d00249d8087aebdd994b64244d 100644
+--- a/hmr/server/css-device-module.js
++++ b/hmr/server/css-device-module.js
+@@ -41,4 +41,15 @@ export function buildCssRegisterSnippet(tag, cssText) {
+ export function buildCssRegisterSnippetFromVar(tag, varName) {
+     return buildRegisterCall(JSON.stringify(tag), varName);
+ }
++/** Bridge only plugin-provided virtual stylesheets; file CSS has its own hot-update path. */
++export function virtualCssUpdates(payload) {
++    if (payload?.type !== 'update') return [];
++    return (payload.updates || []).flatMap((update) => {
++        if (update.type !== 'css-update' && update.type !== 'js-update') return [];
++        let spec = update.path?.split(/[?#]/)[0];
++        if (spec?.startsWith('\0')) spec = '/@id/' + spec.replace(/\0/g, '__x00__');
++        if (!spec?.startsWith('/@id/__x00__') || !CSS_MODULE_RE.test(spec)) return [];
++        return [{ type: 'css-update', path: '/ns/m' + spec, acceptedPath: '/ns/m' + spec, tag: spec, timestamp: update.timestamp }];
++    });
++}
+ //# sourceMappingURL=css-device-module.js.map
+
 diff --git a/hmr/server/deps-bundle.js b/hmr/server/deps-bundle.js
 index 8f2fa15556244f7ef811b5e2ea0fc6a19bab74d3..80137262ec46d347d39a7ee12d66d649b5f909f5 100644
 --- a/hmr/server/deps-bundle.js
@@ -166,11 +203,41 @@ index 71574c48f655183af0c9601b020fd1febd63ccb3..0061d9c9e9fe9c6034576eae8449831d
      if (!imports.length) {
          return code;
      }
+diff --git a/hmr/server/process-code-for-device.js b/hmr/server/process-code-for-device.js
+index c71d457806a8add919f7e2368e7ebc349bd908e7..998eb268ed0db1200f8b5ce30fc7da211125406f 100644
+--- a/hmr/server/process-code-for-device.js
++++ b/hmr/server/process-code-for-device.js
+@@ -1,3 +1,4 @@
++import { CSS_MODULE_RE } from './css-device-module.js';
+ // Device code-transform: cleans Vite/framework noise out of a served module,
+ // injects NativeScript build globals + the process.env shim, normalizes
+ // imports/helpers for the on-device ESM runtime, and collects an importer's
+@@ -451,13 +452,13 @@ function processCodeForDevice(code, isVitePreBundled, preserveVendorImports = fa
+     // Unlike other virtual ids these are real, servable dev-server URLs returning
+     // self-contained ESM — stripping them leaves `_decorate`/`_decorateMetadata`
+     // undefined at runtime. They're origin-prefixed for the device in rewriteImports.
+-    result = result.replace(/import\s+[^;]+\s+from\s+["']\/@id\/(?!__x00__@oxc-project\+runtime)[^"']*["'];?\s*/g, '');
++    result = result.replace(/import\s+[^;]+\s+from\s+["'](\/@id\/(?!__x00__@oxc-project\+runtime)[^"']*)["'];?\s*/g, (statement, spec) => CSS_MODULE_RE.test(spec) ? statement : '');
+     // Also remove side-effect only virtual id imports like: import "/@id/__x00__vite/dynamic-import-helper.js";
+     // These can slip through and cause the NativeScript runtime to attempt resolving
+     // a non-existent physical file (e.g. /@id/__x00__vite/dynamic-import-helper.js) leading to
+     // module not found crashes during HMR evaluation.
+     if (/^[\t ]*import\s+["']\/@id\/[^"']+["'];?\s*$/m.test(result)) {
+-        result = result.replace(/^[\t ]*import\s+["']\/@id\/[^"']+["'];?\s*$/gm, '');
++        result = result.replace(/^[\t ]*import\s+["'](\/@id\/[^"']+)["'];?\s*$/gm, (statement, spec) => CSS_MODULE_RE.test(spec) ? statement : '');
+         // Inject a lightweight marker comment (harmless if left in output) so devs can confirm rewrite took place when viewing streamed artifact.
+         result = `// [hmr-sanitize] stripped virtual /@id/ side-effect imports\n${result}`;
+     }
 diff --git a/hmr/server/rewrite-imports.js b/hmr/server/rewrite-imports.js
-index 4a6575cb00a6aeecbbb7ac5ccac3268cb10d7f54..ea97dfe6c895bb6b80b0c0403c86663046c65496 100644
+index 4a6575cb00a6aeecbbb7ac5ccac3268cb10d7f54..2876cf3694c278249b9db182e2f89df34cc464f3 100644
 --- a/hmr/server/rewrite-imports.js
 +++ b/hmr/server/rewrite-imports.js
-@@ -12,7 +12,93 @@ import { resolveAngularCoreHmrImportSource, rewriteAngularEntryRegisterOnly } fr
+@@ -1,3 +1,4 @@
++import { CSS_MODULE_RE } from './css-device-module.js';
+ // THE SINGLE import-rewrite function — used everywhere for consistency. Maps a
+ // served module's specifiers to device-reachable forms: the unified /ns/core
+ // bridge, /ns/m node_modules + app modules, /ns/sfc for Vue, vendor bare specs,
+@@ -12,7 +13,93 @@ import { resolveAngularCoreHmrImportSource, rewriteAngularEntryRegisterOnly } fr
  import { isNativeScriptCoreModule, isNativeScriptPluginModule, normalizeNativeScriptCoreSpecifier, normalizeNodeModulesSpecifier, resolveNodeModulesPackageBoundary, resolveVendorRouting, rewriteFsAbsoluteToNsM, shouldPreserveBareRuntimePluginSubpathImport } from './websocket-module-specifiers.js';
  import { ensureDynamicHmrImportHelper } from './websocket-served-module-helpers.js';
  import { collectMixedRuntimePluginHttpRootPackages, findDependencyFileName, getProjectRelativeImportPath, isApplicationImport, normalizeImportPath, stripToProjectRelative, toAppModuleBaseId, toNodeModulesHttpModuleId } from './device-transform-helpers.js';
@@ -264,7 +331,7 @@ index 4a6575cb00a6aeecbbb7ac5ccac3268cb10d7f54..ea97dfe6c895bb6b80b0c0403c866630
  export function prepareAngularEntryForDevice(code, importerPath, sfcFileMap, depFileMap, projectRoot, verbose = false, outputDirOverrideRel, httpOrigin, resolveVendorAsHttp = false) {
      const rewrittenCode = rewriteImports(code, importerPath, sfcFileMap, depFileMap, projectRoot, verbose, outputDirOverrideRel, httpOrigin, resolveVendorAsHttp);
      return rewriteAngularEntryRegisterOnly(rewrittenCode, resolveAngularCoreHmrImportSource(rewrittenCode, httpOrigin));
-@@ -236,6 +322,19 @@ export function rewriteImports(code, importerPath, sfcFileMap, depFileMap, proje
+@@ -236,6 +323,19 @@ export function rewriteImports(code, importerPath, sfcFileMap, depFileMap, proje
              }
              return `${prefix}${stub}${suffix}`;
          }
@@ -284,7 +351,7 @@ index 4a6575cb00a6aeecbbb7ac5ccac3268cb10d7f54..ea97dfe6c895bb6b80b0c0403c866630
          spec = normalizeNativeScriptCoreSpecifier(spec);
          // Pull `/@fs/<abs-path>` URLs back into the `/ns/m/` pipeline so they
          // hit our CJS/UMD-wrapping handler. Vite emits `/@fs/...` for any
-@@ -253,11 +352,29 @@ export function rewriteImports(code, importerPath, sfcFileMap, depFileMap, proje
+@@ -253,17 +353,39 @@ export function rewriteImports(code, importerPath, sfcFileMap, depFileMap, proje
                  }
                  return `${prefix}${rewritten}${suffix}`;
              }
@@ -319,17 +386,32 @@ index 4a6575cb00a6aeecbbb7ac5ccac3268cb10d7f54..ea97dfe6c895bb6b80b0c0403c866630
          }
          // Vite 8 oxc runtime helpers (decorators etc.) — emitted as
          // `/@id/__x00__@oxc-project+runtime@<ver>/helpers/<name>.js`. These are
+         // real dev-server URLs serving self-contained ESM, so just origin-prefix
+         // them for the device; no /ns/m wrapping needed (processCodeForDevice
+         // exempts them from the generic /@id/ strip for the same reason).
++        // User virtual CSS needs native compilation/registration, never the DOM module.
++        if (spec.startsWith('/@id/') && CSS_MODULE_RE.test(spec)) {
++            return `${prefix}${httpOriginSafe || ''}/ns/m${spec}${suffix}`;
++        }
+         if (spec.startsWith('/@id/__x00__@oxc-project+runtime')) {
+             if (httpOriginSafe) {
+                 return `${prefix}${httpOriginSafe}${spec}${suffix}`;
 diff --git a/hmr/server/websocket-module-specifiers.js b/hmr/server/websocket-module-specifiers.js
-index 74f50a77f48f3873aebf375a29d06b16c29440a3..cc196fb6b92d48179bf8e124ba2a2aa9b13796f9 100644
+index 74f50a77f48f3873aebf375a29d06b16c29440a3..0f06b6dc997118473e4a1ac6d3a3c48432311c71 100644
 --- a/hmr/server/websocket-module-specifiers.js
 +++ b/hmr/server/websocket-module-specifiers.js
-@@ -1,4 +1,4 @@
+@@ -1,8 +1,8 @@
 -import { existsSync, readdirSync, readFileSync, realpathSync } from 'fs';
 +import { existsSync, readdirSync, readFileSync, realpathSync, statSync } from 'fs';
  import * as path from 'path';
  import * as PAT from './constants.js';
  import { getVendorManifest, resolveVendorSpecifier } from '../shared/vendor/registry.js';
-@@ -328,6 +328,60 @@ export function resolveVendorFromCandidate(specifier) {
+-import { getProjectRootPath } from '../../helpers/project.js';
++import { getMonorepoWorkspaceRoot, getProjectRootPath } from '../../helpers/project.js';
+ import { extractRootPackageName, getPackageRuntimeInfo } from '../shared/package-classifier.js';
+ import { getFlavorClientPackages } from '../framework-flavors.js';
+ const ESM_FRAMEWORK_PACKAGE_ROOTS = new Set(['@nativescript/angular', 'nativescript-angular']);
+@@ -328,6 +328,76 @@ export function resolveVendorFromCandidate(specifier) {
      }
      return null;
  }
@@ -339,7 +421,8 @@ index 74f50a77f48f3873aebf375a29d06b16c29440a3..cc196fb6b92d48179bf8e124ba2a2aa9
 + * its workspace layout — consulted when neither the project root nor the
 + * workspace root can anchor a served `/node_modules/` tail:
 + *  - `link:`/`file:`/`portal:` deps keep their own `node_modules` at the real
-+ *    target; a linked package's transitive deps never reach the app's store.
++ *    target; their workspace siblings can own transitive deps too. Reuse the
++ *    bounded workspace scan rather than recursively walking dependency trees.
 + *  - pnpm's isolated virtual store keeps every non-hoisted package under
 + *    `node_modules/.pnpm/<name>@<ver>/node_modules/`.
 + * Importer info is gone from the URL — first hit wins, same as the workspace
@@ -351,9 +434,13 @@ index 74f50a77f48f3873aebf375a29d06b16c29440a3..cc196fb6b92d48179bf8e124ba2a2aa9
 +        return cached;
 +    }
 +    const dirs = [];
++    const seen = new Set();
++    const linkedWorkspaces = new Set();
 +    const pushIfPresent = (dir) => {
-+        if (existsSync(dir))
++        if (!seen.has(dir) && existsSync(dir)) {
++            seen.add(dir);
 +            dirs.push(dir);
++        }
 +    };
 +    const pnpmStore = path.join(projectRoot, 'node_modules', '.pnpm');
 +    try {
@@ -374,8 +461,12 @@ index 74f50a77f48f3873aebf375a29d06b16c29440a3..cc196fb6b92d48179bf8e124ba2a2aa9
 +                    continue;
 +                try {
 +                    const depDir = realpathSync(path.resolve(projectRoot, target));
-+                    if (statSync(depDir).isDirectory())
++                    if (statSync(depDir).isDirectory()) {
 +                        pushIfPresent(path.join(depDir, 'node_modules'));
++                        const workspace = getMonorepoWorkspaceRoot(depDir);
++                        if (workspace)
++                            linkedWorkspaces.add(workspace);
++                    }
 +                }
 +                catch {
 +                }
@@ -384,13 +475,20 @@ index 74f50a77f48f3873aebf375a29d06b16c29440a3..cc196fb6b92d48179bf8e124ba2a2aa9
 +    }
 +    catch {
 +    }
++    // Preserve direct-dependency precedence. Scan each linked workspace once,
++    // using the existing two-level package scan and its per-workspace cache.
++    for (const workspace of linkedWorkspaces) {
++        pushIfPresent(path.join(workspace, 'node_modules'));
++        for (const dir of listWorkspaceNodeModulesDirs(workspace))
++            pushIfPresent(dir);
++    }
 +    depFallbackDirsCache.set(projectRoot, dirs);
 +    return dirs;
 +}
  const workspaceNodeModulesDirsCache = new Map();
  /**
   * `node_modules` dirs that can hold a package the served URL no longer
-@@ -428,6 +482,16 @@ export function resolveCandidateFilePath(candidate, projectRoot, workspaceRoot)
+@@ -428,6 +498,16 @@ export function resolveCandidateFilePath(candidate, projectRoot, workspaceRoot)
              }
          }
      }
@@ -407,14 +505,26 @@ index 74f50a77f48f3873aebf375a29d06b16c29440a3..cc196fb6b92d48179bf8e124ba2a2aa9
      return null;
  }
  /**
-@@ -557,22 +621,17 @@ export function filterExistingNodeModulesTransformCandidates(spec, candidates, p
+@@ -512,8 +592,8 @@ export function rewriteFsAbsoluteToNsM(spec, projectRoot, workspaceRoot) {
+  * `export const X: string = '...'`. Routing through the realpath makes
+  * Vite see a non-`node_modules` path and the TS transform applies.
+  *
+- * App-local candidates whose real path is also app-local are returned
+- * unchanged so existing behaviour is preserved bit-for-bit.
++ * Candidates are returned unchanged only when their URL addresses the file
++ * found. Fallback files need filesystem anchors even inside the app root.
+  */
+ export function filterExistingNodeModulesTransformCandidates(spec, candidates, projectRoot, workspaceRoot) {
+     const cleanedSpec = spec.replace(PAT.QUERY_PATTERN, '');
+@@ -557,22 +637,18 @@ export function filterExistingNodeModulesTransformCandidates(spec, candidates, p
              // through to the existing project/workspace logic.
          }
          if (mapped === null) {
 -            if (!hasDistinctWorkspaceRoot) {
-+            const relFromProject = path.relative(resolvedProjectRoot, resolved);
-+            const insideProjectRoot = relFromProject !== '' && !relFromProject.startsWith('..') && !path.isAbsolute(relFromProject);
-+            if (insideProjectRoot) {
++            const candidatePath = cleanedCandidate.startsWith('/@fs/')
++                ? path.resolve(cleanedCandidate.slice('/@fs'.length))
++                : path.resolve(resolvedProjectRoot, cleanedCandidate.replace(/^\/+/, ''));
++            if (candidatePath === resolved) {
                  mapped = candidate;
              }
              else {
@@ -430,10 +540,10 @@ index 74f50a77f48f3873aebf375a29d06b16c29440a3..cc196fb6b92d48179bf8e124ba2a2aa9
 -                    // hoisted package's `exports` field may refuse.
 -                    mapped = `/@fs${resolved.replace(/\\/g, '/')}${querySuffix}`;
 -                }
-+                // File resolves outside the project root — hoisted workspace
-+                // node_modules, pnpm's `.pnpm` store, or a link:/file:/portal:
-+                // dep's own node_modules. Serve the fs-anchored URL so Vite
-+                // reads it directly; the root-relative URL would miss.
++                // The candidate URL does not address the discovered file. A
++                // fallback may live inside the project (nested link: dependency
++                // or pnpm store) as well as outside it (hoisted dependency).
++                // Anchor the actual path so Vite loads the same file we found.
 +                mapped = `/@fs${resolved.replace(/\\/g, '/')}${querySuffix}`;
              }
          }
@@ -475,6 +585,80 @@ index a11fbd5d24579cdf572a91f70cb06561bfa43cd0..c887334efce2c2f6cf85c75082761094
          }
      }
      return null;
+diff --git a/hmr/server/websocket-ns-m.js b/hmr/server/websocket-ns-m.js
+index 63b5d9a4886d8da03b8e7deac8a16d53347ea5d7..0f92b3377e6d697f5e5c9eafad130d9579078d93 100644
+--- a/hmr/server/websocket-ns-m.js
++++ b/hmr/server/websocket-ns-m.js
+@@ -97,7 +97,7 @@ export function registerNsModuleServerRoute(server, options) {
+             // internal virtual modules (e.g., \0nsvite:nsconfig-json for
+             // ~/package.json) that don't exist on disk and must NOT run
+             // through the device post-processing pipeline below.
+-            if (spec.startsWith('/@id/')) {
++            if (spec.startsWith('/@id/') && !CSS_MODULE_RE.test(spec)) {
+                 try {
+                     // First try Vite's transform pipeline directly
+                     const vr = await sharedTransformRequest(spec);
+@@ -157,8 +157,21 @@ export function registerNsModuleServerRoute(server, options) {
+                     // Workspace css outside the vite root must be anchored to /@fs or
+                     // `?inline` is denied and the DOM css module (__vite__updateStyle)
+                     // is served instead.
+-                    const inlineSpec = resolveFsAnchoredSpec(spec, serverRoot, monorepoWorkspaceRoot) || spec;
+-                    const inlineRes = await sharedTransformRequest(`${inlineSpec}?inline`);
++                    const inlineSpec = spec.startsWith('/@id/')
++                        ? spec.slice('/@id/'.length).replace(/__x00__/g, '\0')
++                        : resolveFsAnchoredSpec(spec, serverRoot, monorepoWorkspaceRoot) || spec;
++                    // Keep the canonical sheet's watch edges and CSS HMR boundary alive.
++                    // The inline variant alone is not the node stylesheet plugins reload.
++                    const virtualCss = spec.startsWith('/@id/');
++                    // Plugin reloads can invalidate only the canonical sheet, not its
++                    // inline sibling or the NativeScript transform-result TTL cache.
++                    const compileCss = virtualCss ? (url) => server.transformRequest(url) : sharedTransformRequest;
++                    if (virtualCss) {
++                        await compileCss(inlineSpec);
++                        const inlineModule = server.moduleGraph.getModuleById(`${inlineSpec}?inline`);
++                        if (inlineModule) server.moduleGraph.invalidateModule(inlineModule);
++                    }
++                    const inlineRes = await compileCss(`${inlineSpec}?inline`);
+                     const inlineCode = inlineRes?.code || '';
+                     // `?inline` output is `export default "<compiled css>"`.
+                     const m = inlineCode.match(/export\s+default\s+("(?:[^"\\]|\\.)*")\s*;?/s);
+@@ -168,7 +181,14 @@ export function registerNsModuleServerRoute(server, options) {
+                             css = JSON.parse(m[1]);
+                         }
+                         catch { }
+-                        css = normalizeCssForDevice(css);
++                        css = normalizeCssForDevice(css) || '/* empty stylesheet */';
++                        // HMR fetches adapted text through this same compiler and tag.
++                        if (urlObj.searchParams.has('direct')) {
++                            res.setHeader('Content-Type', 'text/css; charset=utf-8');
++                            res.statusCode = 200;
++                            res.end(css);
++                            return;
++                        }
+                         const out = `// [ns:m][css] ${spec}\n` + `const __ns_css_text__ = ${JSON.stringify(css)};\n` + buildCssRegisterSnippetFromVar(spec, '__ns_css_text__') + `export default __ns_css_text__;\n`;
+                         res.statusCode = 200;
+                         res.end(out);
+@@ -181,7 +201,10 @@ export function registerNsModuleServerRoute(server, options) {
+                     if (verbose)
+                         console.warn('[ns:m][css] inline compile failed', spec, cssErr?.message);
+                 }
+-                // Fall through to default handling if inline compile produced nothing.
++                // Never send raw CSS or a DOM injection module to the native loader.
++                res.statusCode = 500;
++                res.end('throw new Error(' + JSON.stringify('[ns:m] CSS compilation failed: ' + spec) + ');');
++                return;
+             }
+             // Queue and dedupe transformRequest calls so heavy app graphs do not
+             // overwhelm Vite with concurrent work. Slow-transform warnings start only
+@@ -503,6 +526,8 @@ export function registerNsModuleServerRoute(server, options) {
+                                     continue;
+                                 }
+                                 else if (u.pathname.startsWith('/ns/m')) {
++                                    // The CSS route synthesizes a default string export after compilation.
++                                    if (CSS_MODULE_RE.test(u.pathname)) continue;
+                                     // Resolve the import target through the SAME
+                                     // canonical pipeline the /ns/m route itself uses
+                                     // (websocket-ns-m-request.ts) instead of a third
 diff --git a/hmr/server/websocket-served-module-helpers.js b/hmr/server/websocket-served-module-helpers.js
 index b9e3ab67eb4ae7c9b12bc4b02b9aa3660d712644..f857f4a5a5956af229e447ed04bf1a52a90c6399 100644
 --- a/hmr/server/websocket-served-module-helpers.js
@@ -499,3 +683,27 @@ index b9e3ab67eb4ae7c9b12bc4b02b9aa3660d712644..f857f4a5a5956af229e447ed04bf1a52
              .map((node) => ({
              start: node.start,
              end: node.end,
+diff --git a/hmr/server/websocket.js b/hmr/server/websocket.js
+index e6a14437f8990e2c631f23eb8db21aa0b28b5759..2b9fb450511b6e114b6e7e7ac8a48831b4a09dc9 100644
+--- a/hmr/server/websocket.js
++++ b/hmr/server/websocket.js
+@@ -1,3 +1,5 @@
++import { virtualCssUpdates } from './css-device-module.js';
++import { buildCssUpdatesMessage } from './css-update-message.js';
+ import { readFileSync } from 'fs';
+ import { WebSocketServer } from 'ws';
+ import * as path from 'path';
+@@ -341,6 +343,13 @@ function createHmrWebSocketPlugin(opts, strategy) {
+                         // to reach the device, since they drive the
+                         // in-place `ɵɵreplaceMetadata` template-swap path.
+                         // Filter the relay to those.
++                        const cssUpdates = virtualCssUpdates(normalized);
++                        if (cssUpdates.length) {
++                            const message = JSON.stringify(buildCssUpdatesMessage(server, cssUpdates));
++                            wss?.clients.forEach((client) => {
++                                if (client?.readyState === 1) client.send(message);
++                            });
++                        }
+                         if (normalized.type !== 'custom')
+                             return;
+                         // Root-component guard. Analog's in-place

package/patches/@triniwiz__nativescript-masonkit@1.0.0-beta.110.patch

@@ -0,0 +1,13 @@
+diff --git a/list/index.ios.js b/list/index.ios.js
+index d683fa030ea4adb1b442405458055256319e0adc..97f1953ffbc8ca9e809953c2024e17cd32beb1bb 100644
+--- a/list/index.ios.js
++++ b/list/index.ios.js
+@@ -42,7 +42,7 @@ var ListDelegateImpl = (function (_super) {
+             });
+         }
+     };
+-    ListDelegateImpl.ObjCProtocols = [MasonListDelegate];
++    ListDelegateImpl.ObjCProtocols = typeof MasonListDelegate !== "undefined" ? [MasonListDelegate] : [];
+     return ListDelegateImpl;
+ }(NSObject));
+ const listState_ = Symbol('[[listState]]');

package/patches/octane@0.11.0.patch

@@ -1,5 +1,5 @@
 diff --git a/dist/cjs/runtime.cjs b/dist/cjs/runtime.cjs
-index a035f05..9912e51 100644
+index a035f05..e1c9ca1 100644
 --- a/dist/cjs/runtime.cjs
 +++ b/dist/cjs/runtime.cjs
 @@ -365,6 +365,7 @@ var import_stream_protocol = require("./stream-protocol.cjs");
@@ -18,6 +18,15 @@ index a035f05..9912e51 100644
  function useState(initial, slot) {
    const s = readStateHook(initial, slot, arguments.length === 1);
    return [s.value, s.setter];
+@@ -9659,6 +9661,8 @@ function renderClientContextProvider(context, props, renderScope) {
+       ensureHooks(scope).set(CHILDREN_DIALECT_SLOT, dialect);
+     }
+     renderSharedBody(childrenAsBody(children), void 0, scope, void 0);
++  } else {
++    resetScopeChildren(scope);
+   }
+ }
+ let SHARED_BODY_SCOPE = null;
 diff --git a/dist/cjs/signals/client.cjs b/dist/cjs/signals/client.cjs
 index 28e2844..af40518 100644
 --- a/dist/cjs/signals/client.cjs
@@ -453,7 +462,7 @@ index 90848a6..474c2bb 100644
 +		let specifiers = signalHelperImports.get(request);
 +		if (specifiers === undefined) signalHelperImports.set(request, (specifiers = []));
 diff --git a/dist/node/runtime.js b/dist/node/runtime.js
-index 927d060..cef6b5b 100644
+index 927d060..d311ac9 100644
 --- a/dist/node/runtime.js
 +++ b/dist/node/runtime.js
 @@ -185,6 +185,7 @@ import {
@@ -472,6 +481,15 @@ index 927d060..cef6b5b 100644
  function useState(initial, slot) {
    const s = readStateHook(initial, slot, arguments.length === 1);
    return [s.value, s.setter];
+@@ -9532,6 +9534,8 @@ function renderClientContextProvider(context, props, renderScope) {
+       ensureHooks(scope).set(CHILDREN_DIALECT_SLOT, dialect);
+     }
+     renderSharedBody(childrenAsBody(children), void 0, scope, void 0);
++  } else {
++    resetScopeChildren(scope);
+   }
+ }
+ let SHARED_BODY_SCOPE = null;
 diff --git a/dist/node/signals/client.js b/dist/node/signals/client.js
 index 21a39c3..3f85700 100644
 --- a/dist/node/signals/client.js
@@ -1034,7 +1052,7 @@ index 6427a01..8049b78 100644
    createContext,
    createSubSlot,
 diff --git a/dist/runtime.js b/dist/runtime.js
-index 67ace09..ef61a91 100644
+index 67ace09..afeb8ea 100644
 --- a/dist/runtime.js
 +++ b/dist/runtime.js
 @@ -184,6 +184,7 @@ import {
@@ -1053,6 +1071,15 @@ index 67ace09..ef61a91 100644
  function useState(initial, slot) {
    const s = readStateHook(initial, slot, arguments.length === 1);
    return [s.value, s.setter];
+@@ -9531,6 +9533,8 @@ function renderClientContextProvider(context, props, renderScope) {
+       ensureHooks(scope).set(CHILDREN_DIALECT_SLOT, dialect);
+     }
+     renderSharedBody(childrenAsBody(children), void 0, scope, void 0);
++  } else {
++    resetScopeChildren(scope);
+   }
+ }
+ let SHARED_BODY_SCOPE = null;
 diff --git a/dist/signals/client.d.ts b/dist/signals/client.d.ts
 index 6388c2f..f9e9862 100644
 --- a/dist/signals/client.d.ts