@octane-xplat/patches 0.16.1 → 0.17.1

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

@@ -1,16 +1,45 @@
+diff --git a/dist/driver.d.ts b/dist/driver.d.ts
+index 80e30299c44e889e3a066ce2c9a8feb6b7ceaa42..b17dc120c5c00ba4be701233fb95b6d2b3eb72d9 100644
+--- a/dist/driver.d.ts
++++ b/dist/driver.d.ts
+@@ -14,6 +14,9 @@ interface HostNode {
+     readonly muted: Set<string>;
+     /** Whether this node's `text` has been driven by `#text` children. */
+     textApplied: boolean;
++    readonly propDefaults: Map<string, unknown>;
++    readonly styleDefaults: Map<string, unknown>;
++    styleKeys: Set<string>;
+ }
+ /**
+  * A command `parent`: a host node id's node, the root container (`null`), or a
 diff --git a/dist/driver.js b/dist/driver.js
-index 8bc563a..4cb1f95 100644
+index 8bc563add4cb675a12651184b63805b10224274d..ca251841c91abdd8c254fb6307e5af09f0707c0f 100644
 --- a/dist/driver.js
 +++ b/dist/driver.js
-@@ -3,6 +3,7 @@ import { createUniversalRoot, } from 'octane/universal/native';
+@@ -1,8 +1,11 @@
+-import { ActionBar, ContentView, FormattedString, LayoutBase, ListView, Span, TabView, TabViewItem, TextBase, View, unsetValue, } from '@nativescript/core';
++import { cssTreeParse } from '@nativescript/core/css/css-tree-parser';
++import { _getProperties, _getStyleProperties, } from '@nativescript/core/ui/core/properties';
++import { ActionBar, ContentView, FormattedString, LayoutBase, ListView, Span, TabView, TabViewItem, TextBase, View, Utils, unsetValue, } from '@nativescript/core';
+ 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';
++import { Style as MasonStyle } from '@octane-xplat/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) {
+@@ -62,6 +65,9 @@ function createNode(container, id, type, props) {
+         listeners: new Map(),
+         muted: new Set(),
+         textApplied: false,
++        propDefaults: new Map(),
++        styleDefaults: new Map(),
++        styleKeys: new Set(),
+     };
+     if (node.view !== null)
+         viewOwners.set(node.view, { container, node });
+@@ -73,7 +79,10 @@ function instantiate(type) {
      if (Element === undefined) {
          throw new Error(`NativeScript driver: <${type}> is not a registered element.`);
      }
@@ -22,35 +51,46 @@ index 8bc563a..4cb1f95 100644
  }
  function applyProps(node, props) {
      if (node.view === null) {
-@@ -91,13 +95,23 @@ function applyProps(node, props) {
+@@ -90,14 +99,16 @@ function applyProps(node, props) {
+             setProp(node, node.view, name, props[name]);
      }
  }
- /**
+-/**
 - * `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.
-  */
+- */
++/** `update` is the complete next bag, including the plan's static props. */
  function updateProps(node, next) {
-+    const dropped = [];
-+    for (const name in node.props) {
-+        if (node.props[name] != null && !(name in next))
-+            dropped.push(name);
++    for (const name of Object.keys(node.props)) {
++        if (!Object.hasOwn(next, name) && node.view !== null)
++            setProp(node, node.view, name, undefined);
 +    }
      applyProps(node, next);
 -    node.props = { ...node.props, ...next };
-+    for (const name of dropped) {
-+        resetProp(node, node.view, name);
-+    }
 +    node.props = next;
++    if (node.parent !== null && MASON_CONTAINER_TAGS.has(node.parent.type))
++        applyMasonChildLayout(node, node.parent);
  }
  function setProp(node, view, name, value) {
      if (name === 'children' || name === 'key' || name === 'ref')
-@@ -113,13 +127,36 @@ function setProp(node, view, name, value) {
+@@ -105,6 +116,15 @@ function setProp(node, view, name, value) {
+     // Event props arrive as their own `event` commands.
+     if (EVENT_PROP.test(name))
+         return;
++    if (value === undefined &&
++        !node.propDefaults.has(name) &&
++        (name !== 'style' || node.styleKeys.size === 0))
++        return;
++    if (value != null &&
++        value !== unsetValue &&
++        name !== 'style' &&
++        !node.propDefaults.has(name))
++        node.propDefaults.set(name, view[name]);
+     if (name === 'className' || name === 'class') {
+         view.className =
+             value == null || value === unsetValue
+@@ -113,13 +133,31 @@ function setProp(node, view, name, value) {
          return;
      }
      if (name === 'style') {
@@ -70,147 +110,126 @@ index 8bc563a..4cb1f95 100644
 +        (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.
++    // Never forward nullish values to coercing native setters. A never-applied
++    // prop has nothing to restore, including when its initial value is undefined.
++    const target = view;
 +    if (value == null || value === unsetValue) {
-+        if (value === undefined && node.props[name] == null)
++        if (!node.propDefaults.has(name))
 +            return;
-+        resetProp(node, view, name);
-+        return;
++        value = isRegisteredProperty(view, name)
++            ? unsetValue
++            : node.propDefaults.get(name);
 +    }
-+    // 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);
+@@ -127,7 +165,10 @@ function setProp(node, view, name, value) {
+     if (listening)
+         node.muted.add(echo);
+     try {
+-        view[name] = value;
++        target[name] = value;
++        if (value === unsetValue &&
++            _getStyleProperties().some((p) => p.name === name))
++            refreshCss(view);
      }
- }
-+/** 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);
-+    }
-+}
+     finally {
+         if (listening)
+@@ -137,6 +178,8 @@ function setProp(node, view, name, value) {
  // `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) {
++    if (typeof value === 'number')
++        return value ? String(value) : '';
+     if (typeof value === 'string')
+         return value;
+     if (Array.isArray(value))
+@@ -147,16 +190,298 @@ 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.
-+ */
++/** Match the actual registered setter, not merely a globally registered name. */
++function isRegisteredProperty(view, name) {
++    let prototype = view;
++    while (prototype !== null) {
++        const descriptor = Object.getOwnPropertyDescriptor(prototype, name);
++        if (descriptor !== undefined) {
++            return (_getProperties().some((property) => property.name === name && property.set === descriptor.set) ||
++                (_getStyleProperties().some((property) => property.name === name) &&
++                    descriptor.set !== undefined &&
++                    name in view.style));
++        }
++        prototype = Object.getPrototypeOf(prototype);
++    }
++    return false;
++}
++/** Core discards the cascaded value when a local value occupies its slot. */
++function refreshCss(view) {
++    // No public single-key refresh exists in core 9.1. setInlineStyle only writes
++    // declarations; the recursive _onCssStateChange would also touch descendants.
++    view._cssState?.onChange();
++}
++/** Replace authored keys; clearing a local CssProperty must restore class CSS. */
 +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;
++    const style = view.style;
++    const next = typeof value === 'string'
++        ? inlineStyleKeys(value)
++        : value !== null && typeof value === 'object' && value !== unsetValue
++            ? new Set(Object.keys(value))
++            : new Set();
++    for (const key of node.styleKeys) {
++        if (!next.has(key))
++            unsetStyleKey(node, view, key);
 +    }
-+    if (value == null || value === unsetValue || typeof value !== 'object') {
-+        clearStyleKeys(view, applied);
-+        return;
++    for (const key of next) {
++        if (!node.styleDefaults.has(key))
++            node.styleDefaults.set(key, style[key]);
 +    }
-+    if (applied !== undefined) {
-+        for (const key of applied) {
-+            if (!(key in value))
-+                unsetStyleKey(view, key);
-+        }
+     if (typeof value === 'string') {
+         view.setInlineStyle(value);
 +    }
-+    // 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;
++    else if (value !== null &&
++        typeof value === 'object' &&
++        value !== unsetValue) {
++        for (const key of next) {
++            const entry = value[key];
++            if (entry == null || entry === unsetValue)
++                unsetStyleKey(node, view, key);
++            else
++                style[key] = entry;
 +        }
-+        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);
++    node.styleKeys = next;
 +}
-+function unsetStyleKey(view, name) {
++function unsetStyleKey(node, view, name) {
++    // The foreign-leaf binding observes the resolved style, so removal needs
++    // no leaf write here — the cascade restore raises the longhand's Change
++    // event and the binding re-syncs.
 +    const style = view.style;
 +    if (name.startsWith('--')) {
-+        style.setUnscopedCssVariable?.(name, unsetValue);
-+        return;
++        view.style.removeUnscopedCssVariable(name);
 +    }
-+    style[name] = unsetValue;
-+    // A style field outside the CssProperty registry stores the sentinel raw.
-+    if (style[name] === unsetValue)
-+        style[name] = undefined;
++    else {
++        const registered = _getStyleProperties().some((p) => p.name === name || p.cssLocalName === name);
++        style[name] = registered ? unsetValue : node.styleDefaults.get(name);
++    }
++    refreshCss(view);
 +}
 +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()));
++    const sheet = cssTreeParse(`local { ${style} }`, undefined);
++    for (const rule of sheet.stylesheet.rules) {
++        for (const declaration of rule.declarations ?? []) {
++            if (declaration.type !== 'declaration')
++                continue;
++            const name = declaration.property;
++            keys.add(name.startsWith('--')
++                ? name
++                : name.replace(/-([a-z])/g, (_, letter) => letter.toUpperCase()));
++        }
 +    }
 +    return keys;
 +}
@@ -240,12 +259,16 @@ index 8bc563a..4cb1f95 100644
 +    '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');
++// Only leaf layout longhands: core expands shorthands before notifying.
++// Read the effective NS style, never copy authored values into another tier.
++const MASON_LEAF_STYLE_KEYS = [
++    'width', 'height', 'minWidth', 'minHeight', 'maxWidth', 'maxHeight',
++    'marginTop', 'marginRight', 'marginBottom', 'marginLeft',
++    'flexGrow', 'flexShrink', 'flexBasis', 'alignSelf', 'justifySelf',
++    'order', 'position', 'left', 'top', 'right', 'bottom', 'aspectRatio',
++    'gridRow', 'gridColumn', 'gridRowStart', 'gridRowEnd', 'gridColumnStart', 'gridColumnEnd',
++];
++const masonLeafBindings = new WeakMap();
 +const warnedStyleOnlyProps = new Set();
 +function warnStyleOnlyProp(node, name) {
 +    const key = node.type + ':' + name;
@@ -303,7 +326,8 @@ index 8bc563a..4cb1f95 100644
 +        style.overflowY = 'scroll';
 +        style.overflowX = 'hidden';
 +    }
-+    style.alignItems = 'stretch';
++    // Core's alignItems CssProperty already defaults to stretch. A local
++    // write here would outrank every stylesheet rule, including centering.
 +    // Containers establish the containing block for absolute descendants.
 +    style.position = 'relative';
 +}
@@ -329,31 +353,102 @@ index 8bc563a..4cb1f95 100644
 +    }
 +}
 +
-+/** 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. */
++/** Keep foreign leaves in sync with the effective NativeScript cascade.
++ * MasonKit's property handlers only forward to its own _styleHelper views.
++ * Observe longhand changes so classes, pseudo states, inline removal and
++ * stylesheet refreshes follow the same path. Rebind on loaded because the
++ * native leaf may not exist at insert, or may have been recreated. */
 +function applyMasonChildLayout(node, parent) {
 +    const view = node.view;
-+    if (view === null || view === undefined)
-         return;
-+    const style = masonChildStyle(view);
-+    if (style === undefined)
++    if (!view || view._styleHelper !== undefined)
 +        return;
-+    const leafStash = view[MASON_LEAF_STYLE_STASH];
-+    if (leafStash !== undefined) {
-+        for (const key of Object.keys(leafStash))
-+            style[key] = leafStash[key];
++    if (masonLeafBindings.has(view)) {
++        masonLeafBindings.get(view).sync();
+         return;
      }
 -    if (typeof value === 'object')
 -        Object.assign(view.style, value);
++    let native;
++    let leaf;
++    const applied = new Map();
++    const syncKey = (key) => {
++        if (!leaf)
++            return;
++        let value = view.style[key];
++        if (value === undefined || value === unsetValue) {
++            // Plain/unregistered fields can vanish without a CssProperty
++            // default. Mason requires an explicit grid reset (undefined is
++            // ignored by its setters).
++            if ((key === 'gridRow' || key === 'gridColumn') && applied.has(key))
++                value = 'auto';
++            else
++                return;
++        }
++        // Core's auto self-alignment is Mason's normal (-1 / parent default).
++        if ((key === 'alignSelf' || key === 'justifySelf') && value === 'auto')
++            value = 'normal';
++        if (typeof value === 'number' && !Number.isFinite(value))
++            value = 'auto';
++        // Mason's object px setter treats the number as DIP; core's parsed
++        // px length is physical pixels. Convert once at this boundary.
++        if (value && typeof value === 'object' && value.unit === 'px')
++            value = { value: Utils.layout.toDeviceIndependentPixels(value.value), unit: 'dip' };
++        const previous = applied.get(key);
++        if (Object.is(previous, value) || (value && previous && typeof value === 'object' &&
++            value.unit === previous.unit && value.value === previous.value))
++            return;
++        leaf[key] = value;
++        applied.set(key, value);
++        return true;
++    };
++    const sync = () => {
++        if (native !== view.nativeViewProtected || !leaf) {
++            native = view.nativeViewProtected;
++            leaf = masonChildStyle(view);
++            applied.clear();
++        }
++        let changed = false;
++        const update = () => {
++            for (const key of MASON_LEAF_STYLE_KEYS)
++                changed = syncKey(key) || changed;
++        };
++        // Foreign native style writes normally flush on a microtask, after
++        // core may already have measured the parent. Commit first, then ask
++        // the Mason container to recompute the foreign frame.
++        if (leaf?.batch)
++            leaf.batch(update);
++        else
++            update();
++        if (changed)
++            parent.view?.requestLayout?.();
++    };
++    const handlers = MASON_LEAF_STYLE_KEYS.map(key => {
++        const handler = () => sync();
++        view.style.on?.(key + 'Change', handler);
++        return [key + 'Change', handler];
++    });
++    view.on('loaded', sync);
++    masonLeafBindings.set(view, {
++        sync,
++        dispose() {
++            for (const [event, handler] of handlers)
++                view.style.off?.(event, handler);
++            view.off('loaded', sync);
++        },
++    });
++    sync();
++}
++function releaseMasonChildLayout(view) {
++    if (!view)
++        return;
++    masonLeafBindings.get(view)?.dispose();
++    masonLeafBindings.delete(view);
  }
 +
  /** 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) {
+@@ -190,6 +515,15 @@ function addViewChild(parentView, view, index) {
          parentView.insertChild(view, Math.min(index, parentView.getChildrenCount()));
          return;
      }
@@ -369,7 +464,7 @@ index 8bc563a..4cb1f95 100644
      if (parentView instanceof ContentView) {
          parentView.content = view;
          return;
-@@ -234,6 +516,13 @@ function removeViewChild(parentView, view) {
+@@ -234,6 +568,13 @@ function removeViewChild(parentView, view) {
              parentView.removeChild(view);
          return;
      }
@@ -383,13 +478,20 @@ index 8bc563a..4cb1f95 100644
      if (parentView instanceof ContentView) {
          if (parentView.content === view)
              parentView.content = CLEARED;
-@@ -370,6 +659,13 @@ function attach(container, node) {
+@@ -315,6 +656,7 @@ function tabViewOwning(node) {
+     return null;
+ }
+ function detach(container, node) {
++    releaseMasonChildLayout(node.view);
+     const parent = node.parent;
+     const siblings = childrenOf(container, parent);
+     const index = siblings.indexOf(node);
+@@ -370,6 +712,12 @@ 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).
++    // synchronize effective styles after attachment.
 +    if (parent !== null && MASON_CONTAINER_TAGS.has(parent.type)) {
 +        for (const sibling of childrenOf(container, parent))
 +            applyMasonChildLayout(sibling, parent);
@@ -397,7 +499,46 @@ index 8bc563a..4cb1f95 100644
      markTabView(tabViewOwning(node));
  }
  function insert(container, parent, node, before) {
-@@ -548,7 +844,7 @@ function preparePortalTarget(context) {
+@@ -429,6 +777,7 @@ function setEvent(container, node, type, listener) {
+     view.on(type, handler);
+ }
+ function disposeListeners(node) {
++    releaseMasonChildLayout(node.view);
+     const view = node.view;
+     if (view !== null) {
+         for (const [type, handler] of node.listeners)
+@@ -460,6 +809,7 @@ function recreateView(container, node) {
+         // no longer host them.
+         throw new Error(`NativeScript driver: re-registered <${node.type}> is a <${view.typeName}>, which cannot host portal children; the registration stays on the previous view.`);
+     }
++    releaseMasonChildLayout(previous);
+     const parentView = hostViewOf(container, node.parent);
+     for (const child of node.children) {
+         if (child.view !== null)
+@@ -480,6 +830,9 @@ function recreateView(container, node) {
+     viewOwners.set(view, { container, node });
+     node.view = view;
+     node.textApplied = false;
++    node.propDefaults.clear();
++    node.styleDefaults.clear();
++    node.styleKeys.clear();
+     applyProps(node, node.props);
+     for (const [type, handler] of node.listeners)
+         view.on(type, handler);
+@@ -500,6 +853,12 @@ function recreateView(container, node) {
+                 addViewChild(view, child.view, index++);
+         }
+     }
++    if (MASON_CONTAINER_TAGS.has(node.type)) {
++        for (const child of node.children) {
++            releaseMasonChildLayout(child.view);
++            applyMasonChildLayout(child, node);
++        }
++    }
+     syncText(node);
+     markTabView(node);
+     attach(container, node);
+@@ -548,7 +907,7 @@ function preparePortalTarget(context) {
      }
      const target = owner?.node.view ?? suppliedTarget;
      if (!(target instanceof LayoutBase)) {
@@ -406,7 +547,7 @@ index 8bc563a..4cb1f95 100644
      }
      let id = portalTargetIds.get(target);
      if (id === undefined) {
-@@ -641,7 +937,7 @@ function applyCommand(container, command) {
+@@ -641,7 +1000,7 @@ function applyCommand(container, command) {
  }
  export const nativeScriptDriver = {
      id: NATIVESCRIPT_RENDERER_ID,
@@ -416,7 +557,7 @@ index 8bc563a..4cb1f95 100644
          classify(name) {
              if (!EVENT_PROP.test(name))
 diff --git a/dist/elements.js b/dist/elements.js
-index a13bcea..e9988e1 100644
+index a13bcea75176146f58f047be1d9c7b0cdda1120a..e9988e174d0b89dcd70220d3014ca6b9bb1820e5 100644
 --- a/dist/elements.js
 +++ b/dist/elements.js
 @@ -1,4 +1,7 @@
@@ -424,7 +565,7 @@ index a13bcea..e9988e1 100644
 +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';
++import { View as MasonView, Scroll as MasonScroll } from '@octane-xplat/nativescript-masonkit';
  /**
   * Lowercase tag name -> view constructor. The keys are the JSX tag names of
   * `intrinsics.ts`; an app extends the vocabulary with `registerElement`.
@@ -473,12 +614,14 @@ index a13bcea..e9988e1 100644
  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
+index 45a47cbbce199df9635852ca4cdb2849e9bbc83d..23b81c44b6860e6099e8c1a70f975f6e792aa2b2 100644
 --- a/dist/intrinsics.d.ts
 +++ b/dist/intrinsics.d.ts
-@@ -24,9 +24,9 @@
+@@ -23,10 +23,11 @@
+  * ```
   */
  import type * as NS from '@nativescript/core';
++import type { CSSProperties } from 'octane/jsx-runtime';
  export type NativeScriptNode = unknown;
 -type Ref<TInstance> = ((instance: TInstance | null) => void) | {
 +type Ref<TInstance> = ((instance: TInstance | null) => void | (() => void)) | {
@@ -488,10 +631,17 @@ index 45a47cb..668c920 100644
  /**
   * 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;
- };
+@@ -72,16 +73,64 @@ export interface CommonEvents<TInstance> {
+     onFocus?: (event: NSEventData<TInstance>) => void;
+     onBlur?: (event: NSEventData<TInstance>) => void;
+ }
+-/** Values accepted by the driver's `className` and `class` props. */
+-export type ClassValue = string | boolean | null | undefined | readonly ClassValue[] | {
+-    readonly [className: string]: unknown;
+-};
++/** Octane's class composition contract, shared unchanged with the DOM. */
++export type { ClassValue } from 'octane/jsx-runtime';
++import type { ClassValue } from 'octane/jsx-runtime';
 +/** 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
@@ -547,17 +697,19 @@ index 45a47cb..668c920 100644
      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;
++    style?: string | Partial<NS.Style> | MasonStyleProps | CSSProperties;
      /**
       * 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.
+@@ -89,21 +138,18 @@ export interface CommonAttributes {
       */
      hostSlot?: string;
--    /**
+     /**
 -     * Attached layout properties. The layout modules register these on `View` at
 -     * runtime, so they are absent from the `@nativescript/core` class typings.
--     */
++     * ARIA-shaped accessibility values; shared components emit plain strings
++     * through the escape-props helpers rather than the NativeScript enums.
+      */
 -    row?: number | string;
 -    col?: number | string;
 -    rowSpan?: number | string;
@@ -570,10 +722,19 @@ index 45a47cb..668c920 100644
 -    flexWrapBefore?: boolean | string;
 -    alignSelf?: 'auto' | 'flex-start' | 'flex-end' | 'center' | 'baseline' | 'stretch';
 -    order?: number | string;
++    accessibilityRole?: string;
++    accessibilityState?: string;
++    accessibilityLiveRegion?: string;
++    /** Platform escape bags — applied onto the native view by the leaf's
++     *  applyEscapeProps, not by the driver. */
++    ios?: Record<string, unknown>;
++    android?: Record<string, unknown>;
++    windows?: Record<string, unknown>;
++    macos?: Record<string, unknown>;
  }
  export interface ListViewAttributes {
      /**
-@@ -117,25 +150,21 @@ export interface ListViewAttributes {
+@@ -117,25 +163,21 @@ export interface ListViewAttributes {
  }
  export interface OctaneAttributes<TInstance> {
      key?: string | number;
@@ -600,7 +761,7 @@ index 45a47cb..668c920 100644
      htmlview: Attributes<typeof NS.HtmlView>;
      image: Attributes<typeof NS.Image>;
      label: Attributes<typeof NS.Label>;
-@@ -153,7 +182,6 @@ export interface NativeScriptElements {
+@@ -153,7 +195,6 @@ export interface NativeScriptElements {
      segmentedbaritem: Attributes<typeof NS.SegmentedBarItem>;
      slider: Attributes<typeof NS.Slider>;
      span: Attributes<typeof NS.Span>;
@@ -608,7 +769,7 @@ index 45a47cb..668c920 100644
      switch: Attributes<typeof NS.Switch>;
      tabview: Attributes<typeof NS.TabView>;
      tabviewitem: Attributes<typeof NS.TabViewItem>;
-@@ -161,7 +189,8 @@ export interface NativeScriptElements {
+@@ -161,7 +202,8 @@ export interface NativeScriptElements {
      textview: Attributes<typeof NS.TextView>;
      timepicker: Attributes<typeof NS.TimePicker>;
      webview: Attributes<typeof NS.WebView>;