@ng-native/fabric 0.13.0 → 0.15.0

package/dist/defer-triggers.js

@@ -11,6 +11,7 @@
  * `installDeferTriggers` runs once, from `mount()`, before anything renders.
  */
 import { isEngineNode, viewNameOf } from "./engine.js";
+import { letEngineNodesPass } from "./node-global.js";
 /** The views a node scrolls inside of, and whose scrolling can bring it into view. */
 const SCROLLERS = new Set(['ScrollView', 'AndroidHorizontalScrollView']);
 /**
@@ -137,14 +138,7 @@ export function installDeferTriggers() {
     const scope = globalThis;
     const existing = scope['Element'];
     if (existing) {
-        // Its own check if it defines one, and the ordinary prototype walk if not.
-        const own = existing[Symbol.hasInstance];
-        Object.defineProperty(existing, Symbol.hasInstance, {
-            configurable: true,
-            value(value) {
-                return (this === existing && isEngineNode(value)) || own.call(this, value);
-            },
-        });
+        letEngineNodesPass(existing);
     }
     else {
         scope['Element'] = class Element {

package/dist/defer-triggers.js.map

@@ -1 +1 @@
-{"version":3,"file":"defer-triggers.js","sourceRoot":"","sources":["../src/defer-triggers.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AACH,OAAO,EAAE,YAAY,EAAE,UAAU,EAAqC,MAAM,aAAa,CAAC;AAE1F,sFAAsF;AACtF,MAAM,SAAS,GAAG,IAAI,GAAG,CAAC,CAAC,YAAY,EAAE,6BAA6B,CAAC,CAAC,CAAC;AAkBzE;;;;;;;;GAQG;AACH,MAAM,OAAO,0BAA0B;IACpB,QAAQ,CAAW;IACnB,SAAS,CAAS;IAClB,OAAO,GAAG,IAAI,GAAG,EAAuB,CAAC;IAE1D,YAAY,QAAkB,EAAE,OAAiB;QAC/C,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;QACzB,MAAM,SAAS,GAAG,OAAO,EAAE,SAAS,CAAC;QACrC,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC;YACvC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,GAAI,SAAsB,CAAC;YACtC,CAAC,CAAC,CAAE,SAAgC,IAAI,CAAC,CAAC,CAAC;IAC/C,CAAC;IAED,OAAO,CAAC,MAAkB;QACxB,IAAI,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC;YAAE,OAAO;QACrC,MAAM,KAAK,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;QACvC,MAAM,KAAK,GAAG,CAAC,MAAM,CAAC,IAAK,CAAC,gBAAgB,CAAC,MAAM,EAAE,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC;QAC1E,KAAK,IAAI,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,MAAM,EAAE,CAAC;YAChD,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;gBAAE,SAAS;YAC7C,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,IAAK,CAAC,gBAAgB,CAAC,EAAE,EAAE,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC;QAChE,CAAC;QACD,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC;QACpC,yFAAyF;QACzF,6FAA6F;QAC7F,oBAAoB;QACpB,cAAc,CAAC,KAAK,CAAC,CAAC;IACxB,CAAC;IAED,SAAS,CAAC,MAAkB;QAC1B,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;QACzC,IAAI,CAAC,OAAO;YAAE,OAAO;QACrB,KAAK,MAAM,IAAI,IAAI,OAAO,CAAC,KAAK;YAAE,IAAI,EAAE,CAAC;QACzC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;IAC9B,CAAC;IAED,UAAU;QACR,KAAK,MAAM,MAAM,IAAI,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;YAAE,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;IACxE,CAAC;IAED,WAAW;QACT,OAAO,EAAE,CAAC;IACZ,CAAC;IAEO,KAAK,CAAC,MAAkB;QAC9B,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC;YAAE,OAAO;QACtC,MAAM,KAAK,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC;QACnC,IAAI,KAAK,KAAK,IAAI;YAAE,OAAO;QAC3B,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,IAAI,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC;QACjF,IAAI,cAAc;YAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,EAAE,MAAM,EAAE,cAAc,EAAE,iBAAiB,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,CAAC,CAAC;IAClG,CAAC;CACF;AAUD,MAAM,GAAG,GAAG,CAAC,KAAkB,EAAO,EAAE,CAAC,CAAC;IACxC,IAAI,EAAE,KAAK,CAAC,CAAC;IACb,GAAG,EAAE,KAAK,CAAC,CAAC;IACZ,KAAK,EAAE,KAAK,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK;IAC5B,MAAM,EAAE,KAAK,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM;CAC/B,CAAC,CAAC;AAEH,SAAS,QAAQ,CAAC,IAAgB;IAChC,IAAI,KAAK,GAAe,IAAI,CAAC;IAC7B,IAAI,CAAC,IAAK,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;IAC1D,OAAO,KAAK,CAAC;AACf,CAAC;AAED,SAAS,IAAI,CAAC,IAAS,EAAE,EAAO;IAC9B,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,CAAC;IACzC,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,CAAC;IACtC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,CAAC;IAC5C,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC;AACjD,CAAC;AAED;;;GAGG;AACH,SAAS,YAAY,CAAC,MAAkB;IACtC,MAAM,KAAK,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC;IAC/B,IAAI,CAAC,KAAK;QAAE,OAAO,IAAI,CAAC;IACxB,MAAM,OAAO,GAAG,EAAE,GAAG,KAAK,EAAE,CAAC;IAC7B,KAAK,IAAI,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,MAAM,EAAE,CAAC;QAChD,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;YAAE,SAAS;QAC7C,MAAM,QAAQ,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;QAC9B,IAAI,QAAQ;YAAE,IAAI,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;IACxC,CAAC;IACD,MAAM,MAAM,GAAI,MAAM,CAAC,IAAyD,CAAC,QAAQ,CAAC;IAC1F,IAAI,MAAM,IAAI,MAAM,CAAC,KAAK,GAAG,CAAC,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QACpD,IAAI,CAAC,OAAO,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,CAAC,CAAC;IACjF,CAAC;IACD,MAAM,KAAK,GAAG,OAAO,CAAC,KAAK,GAAG,OAAO,CAAC,IAAI,CAAC;IAC3C,MAAM,MAAM,GAAG,OAAO,CAAC,MAAM,GAAG,OAAO,CAAC,GAAG,CAAC;IAC5C,IAAI,KAAK,GAAG,CAAC,IAAI,MAAM,GAAG,CAAC;QAAE,OAAO,CAAC,CAAC,CAAC;IACvC,MAAM,IAAI,GAAG,CAAC,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC,GAAG,CAAC,CAAC;IACrE,OAAO,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,MAAM,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;AAChD,CAAC;AAYD,gFAAgF;AAChF,IAAI,SAAS,GAAG,KAAK,CAAC;AAEtB;;;;;;;;GAQG;AACH,MAAM,UAAU,oBAAoB;IAClC,IAAI,SAAS;QAAE,OAAO;IACtB,SAAS,GAAG,IAAI,CAAC;IACjB,MAAM,KAAK,GAAG,UAAgD,CAAC;IAE/D,MAAM,QAAQ,GAAG,KAAK,CAAC,SAAS,CAA4B,CAAC;IAC7D,IAAI,QAAQ,EAAE,CAAC;QACb,2EAA2E;QAC3E,MAAM,GAAG,GAAG,QAAQ,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;QACzC,MAAM,CAAC,cAAc,CAAC,QAAQ,EAAE,MAAM,CAAC,WAAW,EAAE;YAClD,YAAY,EAAE,IAAI;YAClB,KAAK,CAAoB,KAAc;gBACrC,OAAO,CAAC,IAAI,KAAK,QAAQ,IAAI,YAAY,CAAC,KAAK,CAAC,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;YAC7E,CAAC;SACF,CAAC,CAAC;IACL,CAAC;SAAM,CAAC;QACN,KAAK,CAAC,SAAS,CAAC,GAAG,MAAM,OAAO;YAC9B,MAAM,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,KAAc;gBACxC,OAAO,YAAY,CAAC,KAAK,CAAC,CAAC;YAC7B,CAAC;SACF,CAAC;IACJ,CAAC;IAED,MAAM,MAAM,GAAG,KAAK,CAAC,sBAAsB,CAAoC,CAAC;IAChF,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,KAAK,CAAC,sBAAsB,CAAC,GAAG,0BAA0B,CAAC;QAC3D,OAAO;IACT,CAAC;IACD,KAAK,CAAC,sBAAsB,CAAC,GAAG,KAAM,SAAQ,0BAA0B;QACrD,IAAI,CAAqB;QAClC,KAAK,GAA0B,IAAI,CAAC;QAE5C,YAAY,QAAkB,EAAE,OAAiB;YAC/C,KAAK,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;YACzB,IAAI,CAAC,IAAI,GAAG,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAC;QAClC,CAAC;QAEQ,OAAO,CAAC,MAAkB;YACjC,IAAI,YAAY,CAAC,MAAM,CAAC;gBAAE,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;;gBAC3C,CAAC,IAAI,CAAC,KAAK,KAAK,IAAI,MAAM,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;QACjE,CAAC;QAEQ,SAAS,CAAC,MAAkB;YACnC,IAAI,YAAY,CAAC,MAAM,CAAC;gBAAE,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;;gBAC7C,IAAI,CAAC,KAAK,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;QACrC,CAAC;QAEQ,UAAU;YACjB,KAAK,CAAC,UAAU,EAAE,CAAC;YACnB,IAAI,CAAC,KAAK,EAAE,UAAU,EAAE,CAAC;QAC3B,CAAC;KACF,CAAC;AACJ,CAAC","sourcesContent":["/**\n * What Angular's `@defer (on interaction | hover | viewport)` asks of a trigger element, for the\n * engine's nodes.\n *\n * Angular registers those three triggers on the element itself rather than through `Renderer2`:\n * it asserts in development that the element is an `Element`, listens with `addEventListener`,\n * and watches for visibility with a global `IntersectionObserver`. An engine node was none of\n * those, so the placeholder stayed forever and every render logged an assertion. The listeners\n * are on the node (`addEventListener` in `engine.ts`); this is the other two.\n *\n * `installDeferTriggers` runs once, from `mount()`, before anything renders.\n */\nimport { isEngineNode, viewNameOf, type EngineNode, type WindowFrame } from './engine.ts';\n\n/** The views a node scrolls inside of, and whose scrolling can bring it into view. */\nconst SCROLLERS = new Set(['ScrollView', 'AndroidHorizontalScrollView']);\n\ninterface Entry {\n  readonly target: EngineNode;\n  readonly isIntersecting: boolean;\n  readonly intersectionRatio: number;\n}\n\ntype Callback = (entries: Entry[], observer: EngineIntersectionObserver) => void;\n\ninterface Options {\n  readonly threshold?: number | readonly number[];\n}\n\ninterface Watched {\n  readonly stops: (() => void)[];\n}\n\n/**\n * Visibility for engine nodes, from the layout and scroll events native already sends.\n *\n * A node is checked when it is observed, when it is laid out, and whenever a scroll view it sits\n * in scrolls. The check measures the node in window coordinates, clips it by each scroll view\n * around it and by the window, and reports it intersecting once the visible share reaches the\n * threshold: any of it by default, as the web does, and a node of no size counts once its position\n * is inside. `root` and `rootMargin` are not applied; the root is always the window.\n */\nexport class EngineIntersectionObserver {\n  private readonly callback: Callback;\n  private readonly threshold: number;\n  private readonly watched = new Map<EngineNode, Watched>();\n\n  constructor(callback: Callback, options?: Options) {\n    this.callback = callback;\n    const threshold = options?.threshold;\n    this.threshold = Array.isArray(threshold)\n      ? Math.min(...(threshold as number[]))\n      : ((threshold as number | undefined) ?? 0);\n  }\n\n  observe(target: EngineNode): void {\n    if (this.watched.has(target)) return;\n    const check = () => this.check(target);\n    const stops = [target.host!.setEventListener(target, 'topLayout', check)];\n    for (let at = target.parent; at; at = at.parent) {\n      if (!SCROLLERS.has(viewNameOf(at))) continue;\n      stops.push(at.host!.setEventListener(at, 'topScroll', check));\n    }\n    this.watched.set(target, { stops });\n    // A node laid out before it was observed sends no layout event of its own. Measured now,\n    // after the commit that mounted it, and in a microtask, as an observer never calls back from\n    // inside `observe`.\n    queueMicrotask(check);\n  }\n\n  unobserve(target: EngineNode): void {\n    const watched = this.watched.get(target);\n    if (!watched) return;\n    for (const stop of watched.stops) stop();\n    this.watched.delete(target);\n  }\n\n  disconnect(): void {\n    for (const target of [...this.watched.keys()]) this.unobserve(target);\n  }\n\n  takeRecords(): Entry[] {\n    return [];\n  }\n\n  private check(target: EngineNode): void {\n    if (!this.watched.has(target)) return;\n    const ratio = visibleShare(target);\n    if (ratio === null) return;\n    const isIntersecting = this.threshold > 0 ? ratio >= this.threshold : ratio >= 0;\n    if (isIntersecting) this.callback([{ target, isIntersecting, intersectionRatio: ratio }], this);\n  }\n}\n\n/** A frame as its four edges. */\ninterface Box {\n  left: number;\n  top: number;\n  right: number;\n  bottom: number;\n}\n\nconst box = (frame: WindowFrame): Box => ({\n  left: frame.x,\n  top: frame.y,\n  right: frame.x + frame.width,\n  bottom: frame.y + frame.height,\n});\n\nfunction measured(node: EngineNode): Box | null {\n  let found: Box | null = null;\n  node.host!.measure(node, (frame) => (found = box(frame)));\n  return found;\n}\n\nfunction clip(into: Box, by: Box): void {\n  into.left = Math.max(into.left, by.left);\n  into.top = Math.max(into.top, by.top);\n  into.right = Math.min(into.right, by.right);\n  into.bottom = Math.min(into.bottom, by.bottom);\n}\n\n/**\n * How much of the node is on screen, from 0 to 1; below 0 when none of it is, and null when it\n * has not been measured. Measuring is synchronous on the new architecture.\n */\nfunction visibleShare(target: EngineNode): number | null {\n  const frame = measured(target);\n  if (!frame) return null;\n  const visible = { ...frame };\n  for (let at = target.parent; at; at = at.parent) {\n    if (!SCROLLERS.has(viewNameOf(at))) continue;\n    const scroller = measured(at);\n    if (scroller) clip(visible, scroller);\n  }\n  const window = (target.host as { viewport?: { width: number; height: number } }).viewport;\n  if (window && window.width > 0 && window.height > 0) {\n    clip(visible, { left: 0, top: 0, right: window.width, bottom: window.height });\n  }\n  const width = visible.right - visible.left;\n  const height = visible.bottom - visible.top;\n  if (width < 0 || height < 0) return -1;\n  const area = (frame.right - frame.left) * (frame.bottom - frame.top);\n  return area > 0 ? (width * height) / area : 1;\n}\n\ntype Constructor = abstract new (...args: never[]) => object;\n\n/** React Native's own `IntersectionObserver`, when its feature flag has installed one. */\ninterface NativeObserver {\n  observe(target: unknown): void;\n  unobserve(target: unknown): void;\n  disconnect(): void;\n}\ntype NativeObserverClass = new (callback: unknown, options?: unknown) => NativeObserver;\n\n// Never reset: the globals it patches stay patched for the life of the process.\nlet installed = false;\n\n/**\n * Let an engine node pass Angular's development check that a trigger is an `Element`, and give\n * `@defer (on viewport)` an `IntersectionObserver` that can watch one.\n *\n * React Native defines a global `Element` for its own DOM-like nodes, so an engine node is made to\n * answer `instanceof Element` as well, and nothing else about that class changes. Node has none,\n * and gets one that only engine nodes are instances of. An `IntersectionObserver` React Native\n * already has is kept for its own nodes; engine nodes are watched by the one above.\n */\nexport function installDeferTriggers(): void {\n  if (installed) return;\n  installed = true;\n  const scope = globalThis as unknown as Record<string, unknown>;\n\n  const existing = scope['Element'] as Constructor | undefined;\n  if (existing) {\n    // Its own check if it defines one, and the ordinary prototype walk if not.\n    const own = existing[Symbol.hasInstance];\n    Object.defineProperty(existing, Symbol.hasInstance, {\n      configurable: true,\n      value(this: Constructor, value: unknown): boolean {\n        return (this === existing && isEngineNode(value)) || own.call(this, value);\n      },\n    });\n  } else {\n    scope['Element'] = class Element {\n      static [Symbol.hasInstance](value: unknown): boolean {\n        return isEngineNode(value);\n      }\n    };\n  }\n\n  const native = scope['IntersectionObserver'] as NativeObserverClass | undefined;\n  if (!native) {\n    scope['IntersectionObserver'] = EngineIntersectionObserver;\n    return;\n  }\n  scope['IntersectionObserver'] = class extends EngineIntersectionObserver {\n    private readonly args: [unknown, unknown];\n    private other: NativeObserver | null = null;\n\n    constructor(callback: Callback, options?: Options) {\n      super(callback, options);\n      this.args = [callback, options];\n    }\n\n    override observe(target: EngineNode): void {\n      if (isEngineNode(target)) super.observe(target);\n      else (this.other ??= new native(...this.args)).observe(target);\n    }\n\n    override unobserve(target: EngineNode): void {\n      if (isEngineNode(target)) super.unobserve(target);\n      else this.other?.unobserve(target);\n    }\n\n    override disconnect(): void {\n      super.disconnect();\n      this.other?.disconnect();\n    }\n  };\n}\n"]}
+{"version":3,"file":"defer-triggers.js","sourceRoot":"","sources":["../src/defer-triggers.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * What Angular's `@defer (on interaction | hover | viewport)` asks of a trigger element, for the\n * engine's nodes.\n *\n * Angular registers those three triggers on the element itself rather than through `Renderer2`:\n * it asserts in development that the element is an `Element`, listens with `addEventListener`,\n * and watches for visibility with a global `IntersectionObserver`. An engine node was none of\n * those, so the placeholder stayed forever and every render logged an assertion. The listeners\n * are on the node (`addEventListener` in `engine.ts`); this is the other two.\n *\n * `installDeferTriggers` runs once, from `mount()`, before anything renders.\n */\nimport { isEngineNode, viewNameOf, type EngineNode, type WindowFrame } from './engine.ts';\nimport { letEngineNodesPass, type Constructor } from './node-global.ts';\n\n/** The views a node scrolls inside of, and whose scrolling can bring it into view. */\nconst SCROLLERS = new Set(['ScrollView', 'AndroidHorizontalScrollView']);\n\ninterface Entry {\n  readonly target: EngineNode;\n  readonly isIntersecting: boolean;\n  readonly intersectionRatio: number;\n}\n\ntype Callback = (entries: Entry[], observer: EngineIntersectionObserver) => void;\n\ninterface Options {\n  readonly threshold?: number | readonly number[];\n}\n\ninterface Watched {\n  readonly stops: (() => void)[];\n}\n\n/**\n * Visibility for engine nodes, from the layout and scroll events native already sends.\n *\n * A node is checked when it is observed, when it is laid out, and whenever a scroll view it sits\n * in scrolls. The check measures the node in window coordinates, clips it by each scroll view\n * around it and by the window, and reports it intersecting once the visible share reaches the\n * threshold: any of it by default, as the web does, and a node of no size counts once its position\n * is inside. `root` and `rootMargin` are not applied; the root is always the window.\n */\nexport class EngineIntersectionObserver {\n  private readonly callback: Callback;\n  private readonly threshold: number;\n  private readonly watched = new Map<EngineNode, Watched>();\n\n  constructor(callback: Callback, options?: Options) {\n    this.callback = callback;\n    const threshold = options?.threshold;\n    this.threshold = Array.isArray(threshold)\n      ? Math.min(...(threshold as number[]))\n      : ((threshold as number | undefined) ?? 0);\n  }\n\n  observe(target: EngineNode): void {\n    if (this.watched.has(target)) return;\n    const check = () => this.check(target);\n    const stops = [target.host!.setEventListener(target, 'topLayout', check)];\n    for (let at = target.parent; at; at = at.parent) {\n      if (!SCROLLERS.has(viewNameOf(at))) continue;\n      stops.push(at.host!.setEventListener(at, 'topScroll', check));\n    }\n    this.watched.set(target, { stops });\n    // A node laid out before it was observed sends no layout event of its own. Measured now,\n    // after the commit that mounted it, and in a microtask, as an observer never calls back from\n    // inside `observe`.\n    queueMicrotask(check);\n  }\n\n  unobserve(target: EngineNode): void {\n    const watched = this.watched.get(target);\n    if (!watched) return;\n    for (const stop of watched.stops) stop();\n    this.watched.delete(target);\n  }\n\n  disconnect(): void {\n    for (const target of [...this.watched.keys()]) this.unobserve(target);\n  }\n\n  takeRecords(): Entry[] {\n    return [];\n  }\n\n  private check(target: EngineNode): void {\n    if (!this.watched.has(target)) return;\n    const ratio = visibleShare(target);\n    if (ratio === null) return;\n    const isIntersecting = this.threshold > 0 ? ratio >= this.threshold : ratio >= 0;\n    if (isIntersecting) this.callback([{ target, isIntersecting, intersectionRatio: ratio }], this);\n  }\n}\n\n/** A frame as its four edges. */\ninterface Box {\n  left: number;\n  top: number;\n  right: number;\n  bottom: number;\n}\n\nconst box = (frame: WindowFrame): Box => ({\n  left: frame.x,\n  top: frame.y,\n  right: frame.x + frame.width,\n  bottom: frame.y + frame.height,\n});\n\nfunction measured(node: EngineNode): Box | null {\n  let found: Box | null = null;\n  node.host!.measure(node, (frame) => (found = box(frame)));\n  return found;\n}\n\nfunction clip(into: Box, by: Box): void {\n  into.left = Math.max(into.left, by.left);\n  into.top = Math.max(into.top, by.top);\n  into.right = Math.min(into.right, by.right);\n  into.bottom = Math.min(into.bottom, by.bottom);\n}\n\n/**\n * How much of the node is on screen, from 0 to 1; below 0 when none of it is, and null when it\n * has not been measured. Measuring is synchronous on the new architecture.\n */\nfunction visibleShare(target: EngineNode): number | null {\n  const frame = measured(target);\n  if (!frame) return null;\n  const visible = { ...frame };\n  for (let at = target.parent; at; at = at.parent) {\n    if (!SCROLLERS.has(viewNameOf(at))) continue;\n    const scroller = measured(at);\n    if (scroller) clip(visible, scroller);\n  }\n  const window = (target.host as { viewport?: { width: number; height: number } }).viewport;\n  if (window && window.width > 0 && window.height > 0) {\n    clip(visible, { left: 0, top: 0, right: window.width, bottom: window.height });\n  }\n  const width = visible.right - visible.left;\n  const height = visible.bottom - visible.top;\n  if (width < 0 || height < 0) return -1;\n  const area = (frame.right - frame.left) * (frame.bottom - frame.top);\n  return area > 0 ? (width * height) / area : 1;\n}\n\n/** React Native's own `IntersectionObserver`, when its feature flag has installed one. */\ninterface NativeObserver {\n  observe(target: unknown): void;\n  unobserve(target: unknown): void;\n  disconnect(): void;\n}\ntype NativeObserverClass = new (callback: unknown, options?: unknown) => NativeObserver;\n\n// Never reset: the globals it patches stay patched for the life of the process.\nlet installed = false;\n\n/**\n * Let an engine node pass Angular's development check that a trigger is an `Element`, and give\n * `@defer (on viewport)` an `IntersectionObserver` that can watch one.\n *\n * React Native defines a global `Element` for its own DOM-like nodes, so an engine node is made to\n * answer `instanceof Element` as well, and nothing else about that class changes. Node has none,\n * and gets one that only engine nodes are instances of. An `IntersectionObserver` React Native\n * already has is kept for its own nodes; engine nodes are watched by the one above.\n */\nexport function installDeferTriggers(): void {\n  if (installed) return;\n  installed = true;\n  const scope = globalThis as unknown as Record<string, unknown>;\n\n  const existing = scope['Element'] as Constructor | undefined;\n  if (existing) {\n    letEngineNodesPass(existing);\n  } else {\n    scope['Element'] = class Element {\n      static [Symbol.hasInstance](value: unknown): boolean {\n        return isEngineNode(value);\n      }\n    };\n  }\n\n  const native = scope['IntersectionObserver'] as NativeObserverClass | undefined;\n  if (!native) {\n    scope['IntersectionObserver'] = EngineIntersectionObserver;\n    return;\n  }\n  scope['IntersectionObserver'] = class extends EngineIntersectionObserver {\n    private readonly args: [unknown, unknown];\n    private other: NativeObserver | null = null;\n\n    constructor(callback: Callback, options?: Options) {\n      super(callback, options);\n      this.args = [callback, options];\n    }\n\n    override observe(target: EngineNode): void {\n      if (isEngineNode(target)) super.observe(target);\n      else (this.other ??= new native(...this.args)).observe(target);\n    }\n\n    override unobserve(target: EngineNode): void {\n      if (isEngineNode(target)) super.unobserve(target);\n      else this.other?.unobserve(target);\n    }\n\n    override disconnect(): void {\n      super.disconnect();\n      this.other?.disconnect();\n    }\n  };\n}\n"]}

package/dist/engine.d.ts

@@ -186,8 +186,8 @@ interface Committed {
 export interface EngineNode extends HostNode {
     readonly kind: NodeKind;
     /** Lowercase template spelling, e.g. `view`. Never the native view name. */
-    readonly name: string;
-    /** `name` again, for Angular 22.0, which reads it on a component's host element. */
+    readonly tag: string;
+    /** `tag` again, for Angular 22.0, which reads it on a component's host element. */
     readonly tagName: string;
     props: Record<string, unknown>;
     text: string;
@@ -269,6 +269,14 @@ export interface EngineNode extends HostNode {
     playing?: RunningAnimation;
     /** An animation played by a scroll view's offset rather than the clock. See `scrollAnimated`. */
     scrolled?: ScrollAnimation;
+    /**
+     * The props a native animated graph has set on the view with this tag, which no commit
+     * changes again: see `Touched`. A view made again has another tag, and starts with none.
+     */
+    owned?: {
+        readonly tag: number;
+        readonly keys: Set<string>;
+    };
     /**
      * The last `transform` built from the individual transform properties, and what it was built
      * from. Reused while the parts are the same objects, so an unrelated change does not re-send it.
@@ -299,8 +307,18 @@ export interface EngineNode extends HostNode {
     nativeView?: true;
     /** Props kept for selectors to match and left out of what is committed. See `keepAsAttribute`. */
     attributeOnly?: Set<string>;
+    /**
+     * Set by whoever needs to know which props have been written: each `setProp` with a value adds
+     * its key, even one equal to the value already there, and one with `undefined` or `null` takes
+     * it out. The native stack outlet tells a page's own binding from a value it carried this way.
+     */
+    writes?: Set<string>;
     /** The child this node's background is painted on instead of itself. See `paintOn`. */
     paintsOn?: EngineNode;
+    /** What this node's background colour is handed to instead of painted. See `takePaint`. */
+    paintTaker?: (color: unknown) => void;
+    /** The background colour `paintTaker` was last handed, or is about to be. */
+    paintTaken?: unknown;
     /**
      * Style weaker than every sheet, where no rule and no inline style says otherwise. What lets the
      * root component's host fill the surface by default and still give way to its own `:host`. See
@@ -403,7 +421,16 @@ export interface ViewNameOptions {
      * element is the engine's own, as the paragraph a view is given for its loose text is.
      */
     readonly looseText?: string;
+    /**
+     * Where a view's own props name a font that must reach native by another name, as SwiftUI's
+     * `font` modifier must name a face by its file's PostScript name: rewrites `props` in place,
+     * given that name for each name the app's `@font-face` faces are registered under. Called on
+     * every commit of the view, and again for each view when the faces change.
+     */
+    readonly fontNames?: (props: Record<string, unknown>, postScriptName: PostScriptNames) => void;
 }
+/** The PostScript name of the face a name is registered under, where the build read it. */
+export type PostScriptNames = (name: string) => string | undefined;
 /**
  * A view whose native name differs by platform. Chosen when the view is looked up rather than when
  * it is registered, so it does not matter which ran first: an app's imports register the router's
@@ -457,6 +484,25 @@ export interface HoistOptions {
      * another, so what the native side sees is one config that is updated, never one that goes.
      */
     standIn?: Record<string, unknown>;
+    /**
+     * Have the ancestor commit the elements hoisted into it and nothing else, in the order they
+     * were written.
+     *
+     * For a native component that takes children of one type only. `RNSScreenStackHeaderConfig`
+     * takes `RNSScreenStackHeaderSubview`s: iOS logs an error and drops any other child, and Android
+     * throws. A header item written inside a component of the header reached it inside that
+     * component's host view.
+     */
+    only?: boolean;
+    /**
+     * Ancestor names the element never hoists past: met before the ancestor it commits into, it
+     * commits where it is, as one with no such ancestor does.
+     *
+     * For an ancestor the target is not meant to reach through. A tab's page with no stack of its
+     * own has no screen of its own, and the screen above its tab is the one that holds the whole
+     * tab bar, so a header written in that page must not configure it.
+     */
+    stopAt?: readonly string[];
 }
 /** A native view an ancestor keeps for a hoisted name with a stand-in, and who it is for now. */
 interface KeptHoist {
@@ -467,7 +513,7 @@ interface KeptHoist {
 /** The part of a node `viewNameOf` reads: an engine node, or any host's mirror of one. */
 export interface ViewNameNode {
     readonly kind: string;
-    readonly name: string;
+    readonly tag: string;
     readonly parent: ViewNameNode | null;
     /** Whether a component is mounted on it, and whether that component is the native view. */
     readonly componentHost?: boolean;
@@ -650,6 +696,8 @@ export declare class Engine implements HostEngine {
      * binding, so nothing marks an Angular view dirty and no change-detection pass would follow.
      */
     private setActiveChain;
+    /** The nodes a press has set `:active` on, to clear whatever happens to the tree meanwhile. */
+    private readonly activeNodes;
     /** Whether any sheet styles a pressed element, and each compound that asks about one from another. */
     private activeUse;
     /** What each sheet in play asks about a pressed element: `activeUse` is all of them together. */
@@ -793,13 +841,29 @@ export declare class Engine implements HostEngine {
      * element matched again, and one named as what a rule's element is inside, `.animating .close`
      * or `.close:is(.animating *)`, the elements under the node that such rules are for. What is
      * under any of those is styled again from the rules it matched, for what it inherits: a `dark`
-     * class on the root finds no rule again for an element no `dark` rule is for. Any other class
-     * has the node and everything under it matched again, as any other change to it does.
+     * class on the root finds no rule again for an element no `dark` rule is for. One named in
+     * `:has()`, or answering a test of the class attribute there, has the boxes above the node
+     * asked again, and one named only in `:has(> )` the box right above it. Any other class has the node and everything under it matched again, as any
+     * other change to it does.
      *
      * A sheet that names a class later restyles what it is for as it arrives, and a node not yet
      * committed is styled when it is, with the class as it is then.
      */
     private markClasses;
+    /**
+     * How many class changes have restyled what is under an element. `markUnder` walks the tree as
+     * it is, so an element out of it then is not reached: one that comes back after any is matched
+     * again, with all that is under it.
+     */
+    private classesAbove;
+    /**
+     * The count when each element went out of the tree, for the ones still out. `detach` sets it
+     * for a node that only moves too, so `markReturned` runs after it and clears that.
+     */
+    private readonly outSince;
+    /** Have matched again a node coming back into the tree that missed a class change above it. */
+    private markReturned;
+    private markAllUnder;
     /**
      * Have matched again each element under a node that one of `subjects`' rules could be for. One
      * under another is marked too: what is under an element marked this way keeps its rules.
@@ -873,6 +937,13 @@ export declare class Engine implements HostEngine {
      * forgetting walks each subtree that left once.
      */
     private releaseDetached;
+    /** A pressed node out of the tree gets no release: native has no view to end the touch on. */
+    private dropDetachedPress;
+    /**
+     * Forget the focused node, which has left the tree without a blur: off the node as well as the
+     * engine, or a `:focus` rule styles it again when it is put back.
+     */
+    private dropFocus;
     /** Forget the committed views of each node removed since the last commit that is still out. */
     private forgetDetached;
     /** The root of the tree a node is in: the engine's root while it is attached. */
@@ -885,6 +956,18 @@ export declare class Engine implements HostEngine {
     destroyNode(node: EngineNode): void;
     parentNode(node: EngineNode): EngineNode | null;
     nextSibling(node: EngineNode): EngineNode | null;
+    /**
+     * Whether any declaration the engine was given transitions or animates: until one does, a
+     * node's style is committed as it is, with nothing asked of what eases it. See `eased`.
+     */
+    private eases;
+    private noteEasing;
+    /** A node's style as its transitions and animation have it: a declaration asks for one. */
+    private eased;
+    /** Note a sheet any of whose rules transitions or animates: see `eases`. */
+    private noteSheetEasing;
+    /** Note a prop, or a style set as one, that transitions or animates: see `eases`. */
+    private noteEasingProp;
     setProp(node: EngineNode, key: string, value: unknown): void;
     /**
      * Have the paragraph a run of text is in merged again: it is as tall as the tallest line of
@@ -898,6 +981,17 @@ export declare class Engine implements HostEngine {
      * needs, as `<gradient-text>` is.
      */
     paintOn(node: EngineNode, child: EngineNode): void;
+    /**
+     * Hand a node's background colour to `listener` instead of painting it: what its stylesheets,
+     * tokens and inline style resolve `background-color` to, or undefined for none. Called after
+     * each commit that changes it, the first one included. What a component needs whose colour is
+     * drawn by a native view the node is not, from a prop of that view's, as a bottom sheet's is.
+     * The function returned stops it, and the node paints its own background again.
+     */
+    takePaint(node: EngineNode, listener: (color: unknown) => void): () => void;
+    /** Nodes whose background colour is to be handed over once the commit running ends. */
+    private readonly paintReports;
+    private reportPaint;
     /**
      * Keep a prop the node already has as an attribute: on the node for a selector such as
      * `:host([variant='primary'])` to match, and left out of what is committed to the native view.
@@ -922,11 +1016,15 @@ export declare class Engine implements HostEngine {
      */
     styleChanged(node: EngineNode): void;
     /**
-     * A bound declaration, `[style.color]`, whose value may be a `var()`. One that is, is kept as a
-     * declaration the cascade settles with the node's tokens, as a rule's is, and true is answered:
-     * the text is no value to put in the node's style. Any other value forgets what was kept.
+     * A bound declaration, `[style.color]`, whose value may be a `var()`, or a length in `em` or a
+     * viewport unit. One that is, is kept as a declaration the cascade settles with the node's
+     * tokens, font size and viewport, as a rule's is, and true is answered: the text is no value to
+     * put in the node's style. A negative `line-height` is dropped, with a warning, and true is
+     * answered too. Any other value forgets what was kept.
      */
     setBoundStyle(node: EngineNode, prop: string, value: unknown): boolean;
+    /** Whether a bound value is one CSS has none of, which is dropped with a warning. */
+    private refusedBound;
     /**
      * Set a custom property on a node, `--tint` from `[style.--tint]`, or remove it with `null`.
      *
@@ -943,8 +1041,9 @@ export declare class Engine implements HostEngine {
     private watchHas;
     /**
      * Something at or beneath `from` changed: every node from there up may match a `:has()` rule
-     * it did not, or stop matching one. They are matched again rather than marked for restyling,
-     * which would restyle everything under them. Only sheets that use `:has()` pay.
+     * it did not, or stop matching one, up to `upTo` and not it. They are matched again rather than
+     * marked for restyling, which would restyle everything under them. Only sheets that use
+     * `:has()` pay.
      */
     private markBeneath;
     /**
@@ -958,8 +1057,18 @@ export declare class Engine implements HostEngine {
      * Have matched again what is under each box that changed beneath and that such a rule could
      * be asking: the nodes the rule is for, and no other. Once for a commit, however many changes
      * there were beneath the box: a table gains its rows one at a time.
+     *
+     * A rule asked of a box above is walked under the highest box that asks it, which reaches what
+     * is under the boxes beneath that one as well: a rule `:has()` asks of any box is asked by every
+     * box from the change up to the root, and walked once, from the root. The rules a box asks are
+     * walked together, the tree beneath it once.
      */
     private markUnderHas;
+    /**
+     * `markUnderHas` for one box: the rules it asks that no box above it was walked for, walked
+     * together. What was walked under it and above it, which is `above` where it asks no more.
+     */
+    private markUnderBox;
     /**
      * What `node` matches changed, which the elements after it can read: as many of them as a rule
      * steps along from one, every one for a `~`, and none where no sheet steps at all.
@@ -1007,6 +1116,9 @@ export declare class Engine implements HostEngine {
      * optimisation.
      */
     commit(): boolean;
+    /** A field went out of view focused, in the commit running: see `undisplayed`. */
+    private blurAfterCommit;
+    private blurHidden;
     private beforeCommit;
     private announceCommit;
     /**
@@ -1019,14 +1131,14 @@ export declare class Engine implements HostEngine {
     /** The first commit whose new views have not been drawn yet, while `commitUnseen` runs. */
     private unseen;
     /**
-     * A commit for what changed in the same turn as earlier commits, before a frame was drawn.
-     * `since` is how many commits there had been before the first of them (`stats.commits`).
+     * A commit for what changed after earlier commits, before a frame has drawn them. `since` is
+     * how many commits there had been before the first of them (`stats.commits`).
      *
      * A view those commits created has not been seen in the style they gave it, so what this one
-     * gives it is where it starts, and no transition runs toward it. That is what a browser
-     * does with a class added to an element in the turn that inserted it, and what `animate.enter`
-     * is built on: Angular adds the enter class after the render pass that created the element, and
-     * takes it off a frame later, which is the one change the transition is for.
+     * gives it is where it starts, and no transition runs toward it. That is what a browser does
+     * with a class added to an element before the frame after it was inserted, and what
+     * `animate.enter` is built on: Angular adds the enter class after the render pass that created
+     * the element, and takes it off a frame later, which is the one change the transition is for.
      */
     commitUnseen(since: number): boolean;
     /** Nodes that asked for `@keyframes` this commit had not met, by the name they asked for. */
@@ -1133,6 +1245,8 @@ export declare class Engine implements HostEngine {
      * its parent's: the cascade's, and over it the parent's inline style.
      */
     private movePaint;
+    /** Note the background colour a node that hands it over resolves to, where it changed. */
+    private takenPaint;
     /**
      * A container whose direction or alignment changed since a child with a `fit-content` size
      * read it, or whose height stopped or started being one a percentage is taken of since a child
@@ -1193,6 +1307,7 @@ export declare class Engine implements HostEngine {
     private markAnimated;
     /** Every `@font-face` seen, global as on the web: a face declared in one sheet serves all. */
     private readonly fontFaces;
+    private readonly postScriptName;
     /** Whether a sheet first used in this commit declared a face. See `rematchFonts`. */
     private facesAdded;
     /**
@@ -1273,10 +1388,24 @@ export declare class Engine implements HostEngine {
     private playNatively;
     /**
      * Native reached the end of an animation it was playing. The frame it ends at, or the resting
-     * style where it does not fill, is committed before the view is let go, so nothing shows of
-     * the frame it started at, which is what the view had been committed with.
+     * style where it does not fill, is committed, and set on native where the animation set the
+     * prop (see `setOwned`). The view is let go first, which puts nothing back on Fabric: it is
+     * drawn where the animation left it until then.
      */
     private endedNatively;
+    /** A graph of native's was connected to a view: see `Touched`. */
+    private touchedNatively;
+    /**
+     * Set on native a change of a prop a graph of native's has set on the view before, while no
+     * graph of its holds it: the commit cannot change it (see `Touched`). The payload is committed
+     * as well, so the shadow node is as the view is drawn. A transform native cannot take as
+     * numbers, a matrix, is left committed alone.
+     */
+    private setOwned;
+    /** The size a view is laid out at, where it has been. */
+    private boxSize;
+    /** Forget the props native set on a node's view, which is gone or made again. */
+    private disown;
     /** Take an animation back from native, which stops it there. The caller plays it on, or not. */
     private stopNative;
     /**
@@ -1339,6 +1468,13 @@ export declare class Engine implements HostEngine {
     private reportHeld;
     private reportMissingKeyframes;
     private transitioned;
+    /**
+     * What a view was last painted with, by property, for a transition that arrives with the change
+     * it eases: CSS takes the transition from the style after the change and eases from the value
+     * before it. Nothing for a view nobody has seen yet, which starts where it is. The individual
+     * transforms are read back from the parts the painted transform was put together from.
+     */
+    private paintedBefore;
     /** Nobody saw what the last commit gave a view it created, so this is where the view starts. */
     private unseenTransitions;
     /** The elements native is playing a transition of. */
@@ -1362,11 +1498,24 @@ export declare class Engine implements HostEngine {
     /**
      * Commit where it ends each transition of a size or a place that just started, for native to
      * move the view there: a layout animation, which the commit asks for once it is known that
-     * nothing else in it moves. One still on its way is committed where it ends too.
+     * nothing else in it moves. One still on its way is committed where it ends too. On a host
+     * with no layout animation they are eased from JavaScript, but for one sent on again and again.
      *
      * A width eased from JavaScript is a commit a frame, and a commit lays the whole screen out.
      */
     private layEased;
+    /** When each size in transition was last started, and how many starts in a row came soon. */
+    private readonly laidStarts;
+    /**
+     * Whether a transition of a size is one sent on again and again, each before the last had
+     * ended: a progress bar that steps every 50ms and eases each step over 150. Native moves the
+     * view, and lays the screen out, every frame while a layout animation runs, and JavaScript
+     * commits every frame while it eases one, so one started at every step is one that never
+     * stops. The first, and one sent back before it ends, are played; from the second sent on in
+     * a row, each is committed where it ends, and the steps are the motion. Played again once the
+     * size has been left alone for as long as it lasts.
+     */
+    private sentOnAgain;
     /** The animations this commit lays out at their last frame, for native to move the views to. */
     private laidPlayed;
     /**
@@ -1427,6 +1576,8 @@ export declare class Engine implements HostEngine {
      * `lettingGo`.
      */
     private keeps;
+    /** Whether a node, or an element it is in, is `display: none`. */
+    private boxless;
     /** One `@keyframes` player, one frame on. */
     private advancePlayer;
     /**
@@ -1451,7 +1602,11 @@ export declare class Engine implements HostEngine {
      * device the platform pumps this from `requestAnimationFrame` for as long as it returns true.
      */
     advanceAnimations(now?: number): boolean;
-    /** The host's conversions, applied to a copy. A removed prop travels as null and stays null. */
+    /**
+     * The host's conversions, applied to a copy. A removed prop travels as `cleared` says, null for
+     * nearly every one. On an update a colour dropped as unreadable is null too: JSI leaves out an
+     * undefined key, and Fabric keeps what a clone leaves out.
+     */
     private processed;
     /** Copy a list of shadow-like objects, running each `color` through the host's converter. */
     private processNestedColors;
@@ -1563,6 +1718,11 @@ export declare class Engine implements HostEngine {
      * keeps for hoisted nodes that are gone.
      */
     private reconcileHoistTarget;
+    /**
+     * `reconcileHoistTarget` for a node that commits only what is hoisted into it
+     * (`HoistOptions.only`): those nodes, in the order they were written, and none of its own.
+     */
+    private reconcileOnlyHoisted;
     /**
      * A child's handle as a child of `parent`, created again when it was committed under another.
      *
@@ -1596,6 +1756,17 @@ export declare class Engine implements HostEngine {
      * itself so the native side sees an update rather than a removal.
      */
     private standIn;
+    /**
+     * What a hoist target takes of a child written in it: the child's handle, `direct` for one
+     * hoisted into it, which goes after its siblings, or null for none.
+     */
+    private takenByTarget;
+    /**
+     * A clean element's handle under `parent`, before anything else is asked of it: one committed
+     * there and unchanged since was displayed and in its place, and is still. The siblings of what
+     * changed are most of what a commit steps over: a list one row of which ticks.
+     */
+    private cleanUnder;
     /** A clean child's committed handle, when its style still holds under its parent's. */
     private stillCommitted;
     /**
@@ -1622,6 +1793,12 @@ export declare class Engine implements HostEngine {
     private readonly undefinedTokens;
     /** Said once per name: a phone has no inspector to show the declaration struck out. */
     private reportUndefinedToken;
+    private readonly droppedDeclarations;
+    /**
+     * A declaration in a style, written or bound, that is no value its property takes, so it is
+     * dropped as a browser drops it. Said once per element name and declaration, in development.
+     */
+    reportDroppedDeclaration(prop: string, value: string, on: string, why: string): void;
     private readonly unreadDisplays;
     /**
      * Said once per token and value: the compiler refuses `display: grid` written out, but a token
@@ -1741,9 +1918,12 @@ export declare class Engine implements HostEngine {
     private isAttached;
     /** The host's `resolveAssetSource`, for a component that needs an asset's size up front. */
     resolveAsset(value: unknown): unknown;
+    /** A colour prop as `processed` sends it: one dropped as unreadable is null on an update. */
+    private colourProp;
     /**
      * A colour prop as native takes it. A shape's `fill` or `stroke` the cascade settled from a
-     * token is the solid brush react-native-svg takes, and `none` no paint at all.
+     * token is the solid brush react-native-svg takes, `none` no paint at all, and one the host
+     * reads no colour in no paint of the shape's own.
      */
     private painted;
     /**