@ng-native/fabric 0.3.0 → 0.4.0

package/dist/element-styles.d.ts

@@ -0,0 +1,15 @@
+/**
+ * What HTML's text elements look like with no rule of the app's: the few a browser's own sheet
+ * styles that Tailwind's preflight leaves alone. A heading and a paragraph are not here: they are
+ * plain text, as preflight makes them, and the web host's reset says the same. `code` is in the
+ * font each platform uses for code, by the class the root carries for its platform, as
+ * `@ng-native/tailwind`'s `font-mono` is.
+ *
+ * `ELEMENT_STYLES` is `ELEMENT_STYLES_CSS` compiled, written out because the engine has no
+ * compiler. `element-styles.test.ts` fails when the two disagree.
+ */
+import type { StyleSheet } from './css.ts';
+export declare const ELEMENT_STYLES_CSS = "\nstrong, b { font-weight: bold }\nem, i, cite { font-style: italic }\nu { text-decoration-line: underline }\ns { text-decoration-line: line-through }\nsmall { font-size: 80% }\ncode { font-family: Courier New }\n.platform-ios code { font-family: Menlo }\n.platform-android code { font-family: monospace }\nmark { background-color: rgb(255, 255, 0); color: rgb(0, 0, 0) }\n";
+export declare const ELEMENT_STYLES: StyleSheet;
+/** The element names `ELEMENT_STYLES` has a rule for. */
+export declare const STYLED_ELEMENTS: ReadonlySet<string>;

package/dist/element-styles.js

@@ -0,0 +1,103 @@
+export const ELEMENT_STYLES_CSS = `
+strong, b { font-weight: bold }
+em, i, cite { font-style: italic }
+u { text-decoration-line: underline }
+s { text-decoration-line: line-through }
+small { font-size: 80% }
+code { font-family: Courier New }
+.platform-ios code { font-family: Menlo }
+.platform-android code { font-family: monospace }
+mark { background-color: rgb(255, 255, 0); color: rgb(0, 0, 0) }
+`;
+export const ELEMENT_STYLES = {
+    rules: [
+        {
+            compounds: [{ classes: [], type: 'strong' }],
+            combinators: [],
+            specificity: 1,
+            order: 0,
+            declarations: { fontWeight: '700' },
+        },
+        {
+            compounds: [{ classes: [], type: 'b' }],
+            combinators: [],
+            specificity: 1,
+            order: 1,
+            declarations: { fontWeight: '700' },
+        },
+        {
+            compounds: [{ classes: [], type: 'em' }],
+            combinators: [],
+            specificity: 1,
+            order: 2,
+            declarations: { fontStyle: 'italic' },
+        },
+        {
+            compounds: [{ classes: [], type: 'i' }],
+            combinators: [],
+            specificity: 1,
+            order: 3,
+            declarations: { fontStyle: 'italic' },
+        },
+        {
+            compounds: [{ classes: [], type: 'cite' }],
+            combinators: [],
+            specificity: 1,
+            order: 4,
+            declarations: { fontStyle: 'italic' },
+        },
+        {
+            compounds: [{ classes: [], type: 'u' }],
+            combinators: [],
+            specificity: 1,
+            order: 5,
+            declarations: { textDecorationLine: 'underline' },
+        },
+        {
+            compounds: [{ classes: [], type: 's' }],
+            combinators: [],
+            specificity: 1,
+            order: 6,
+            declarations: { textDecorationLine: 'line-through' },
+        },
+        {
+            compounds: [{ classes: [], type: 'small' }],
+            combinators: [],
+            specificity: 1,
+            order: 7,
+            declarations: {},
+            deferred: [{ props: ['fontSize'], compute: { unit: 'em', factor: 0.8 } }],
+        },
+        {
+            compounds: [{ classes: [], type: 'code' }],
+            combinators: [],
+            specificity: 1,
+            order: 8,
+            declarations: { fontFamily: 'Courier New' },
+        },
+        {
+            compounds: [{ classes: [], type: 'mark' }],
+            combinators: [],
+            specificity: 1,
+            order: 11,
+            declarations: { backgroundColor: 'rgb(255, 255, 0)', color: 'rgb(0, 0, 0)' },
+        },
+        {
+            compounds: [{ classes: ['platform-ios'] }, { classes: [], type: 'code' }],
+            combinators: ['descendant'],
+            specificity: 1001,
+            order: 9,
+            declarations: { fontFamily: 'Menlo' },
+        },
+        {
+            compounds: [{ classes: ['platform-android'] }, { classes: [], type: 'code' }],
+            combinators: ['descendant'],
+            specificity: 1001,
+            order: 10,
+            declarations: { fontFamily: 'monospace' },
+        },
+    ],
+};
+/** The element names `ELEMENT_STYLES` has a rule for. */
+export const STYLED_ELEMENTS = new Set(ELEMENT_STYLES.rules.map((rule) => rule.compounds.at(-1).type));
+//# sourceMappingURL=element-styles.js.map

package/dist/element-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"element-styles.js","sourceRoot":"","sources":["../src/element-styles.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * What HTML's text elements look like with no rule of the app's: the few a browser's own sheet\n * styles that Tailwind's preflight leaves alone. A heading and a paragraph are not here: they are\n * plain text, as preflight makes them, and the web host's reset says the same. `code` is in the\n * font each platform uses for code, by the class the root carries for its platform, as\n * `@ng-native/tailwind`'s `font-mono` is.\n *\n * `ELEMENT_STYLES` is `ELEMENT_STYLES_CSS` compiled, written out because the engine has no\n * compiler. `element-styles.test.ts` fails when the two disagree.\n */\nimport type { StyleSheet } from './css.ts';\n\nexport const ELEMENT_STYLES_CSS = `\nstrong, b { font-weight: bold }\nem, i, cite { font-style: italic }\nu { text-decoration-line: underline }\ns { text-decoration-line: line-through }\nsmall { font-size: 80% }\ncode { font-family: Courier New }\n.platform-ios code { font-family: Menlo }\n.platform-android code { font-family: monospace }\nmark { background-color: rgb(255, 255, 0); color: rgb(0, 0, 0) }\n`;\n\nexport const ELEMENT_STYLES = {\n  rules: [\n    {\n      compounds: [{ classes: [], type: 'strong' }],\n      combinators: [],\n      specificity: 1,\n      order: 0,\n      declarations: { fontWeight: '700' },\n    },\n    {\n      compounds: [{ classes: [], type: 'b' }],\n      combinators: [],\n      specificity: 1,\n      order: 1,\n      declarations: { fontWeight: '700' },\n    },\n    {\n      compounds: [{ classes: [], type: 'em' }],\n      combinators: [],\n      specificity: 1,\n      order: 2,\n      declarations: { fontStyle: 'italic' },\n    },\n    {\n      compounds: [{ classes: [], type: 'i' }],\n      combinators: [],\n      specificity: 1,\n      order: 3,\n      declarations: { fontStyle: 'italic' },\n    },\n    {\n      compounds: [{ classes: [], type: 'cite' }],\n      combinators: [],\n      specificity: 1,\n      order: 4,\n      declarations: { fontStyle: 'italic' },\n    },\n    {\n      compounds: [{ classes: [], type: 'u' }],\n      combinators: [],\n      specificity: 1,\n      order: 5,\n      declarations: { textDecorationLine: 'underline' },\n    },\n    {\n      compounds: [{ classes: [], type: 's' }],\n      combinators: [],\n      specificity: 1,\n      order: 6,\n      declarations: { textDecorationLine: 'line-through' },\n    },\n    {\n      compounds: [{ classes: [], type: 'small' }],\n      combinators: [],\n      specificity: 1,\n      order: 7,\n      declarations: {},\n      deferred: [{ props: ['fontSize'], compute: { unit: 'em', factor: 0.8 } }],\n    },\n    {\n      compounds: [{ classes: [], type: 'code' }],\n      combinators: [],\n      specificity: 1,\n      order: 8,\n      declarations: { fontFamily: 'Courier New' },\n    },\n    {\n      compounds: [{ classes: [], type: 'mark' }],\n      combinators: [],\n      specificity: 1,\n      order: 11,\n      declarations: { backgroundColor: 'rgb(255, 255, 0)', color: 'rgb(0, 0, 0)' },\n    },\n    {\n      compounds: [{ classes: ['platform-ios'] }, { classes: [], type: 'code' }],\n      combinators: ['descendant'],\n      specificity: 1001,\n      order: 9,\n      declarations: { fontFamily: 'Menlo' },\n    },\n    {\n      compounds: [{ classes: ['platform-android'] }, { classes: [], type: 'code' }],\n      combinators: ['descendant'],\n      specificity: 1001,\n      order: 10,\n      declarations: { fontFamily: 'monospace' },\n    },\n  ],\n} as unknown as StyleSheet;\n\n/** The element names `ELEMENT_STYLES` has a rule for. */\nexport const STYLED_ELEMENTS: ReadonlySet<string> = new Set(\n  ELEMENT_STYLES.rules.map((rule) => rule.compounds.at(-1)!.type as string),\n);\n"]}

package/dist/engine.d.ts

@@ -7,7 +7,7 @@
  * because a persistent parent holds references to specific child handles. That bubble is
  * inherent and is what React's own Fabric renderer does.
  */
-import { type Conditions, type StyleCache, type StyleSheet, type TokenValue } from './css.ts';
+import { type Conditions, type DeferredDeclaration, type StyleCache, type StyleSheet, type TokenValue } from './css.ts';
 import { type AnimationSpec, type Keyframe, type RunningAnimation, type Transition } from './transition.ts';
 import { type DrivenProperty, type EventFeed, type NativeAnimated, type ScrollAxis, type ScrollDrive, type ScrollRange, type StaticTransform } from './native-drive.ts';
 import type { DrivenChannels } from './scroll-animation.ts';
@@ -168,6 +168,8 @@ interface Committed {
     props: Record<string, unknown>;
     /** The child handles this node was committed with, in order. */
     childHandles: FabricNode[];
+    /** The native view it was created as, which a clone cannot change. */
+    viewName: string;
 }
 export interface EngineNode extends HostNode {
     readonly kind: NodeKind;
@@ -192,6 +194,27 @@ export interface EngineNode extends HostNode {
     styleCache: StyleCache | null;
     /** Set when something that could change what this node matches has changed. */
     styleDirty: boolean;
+    /** A family left out while it loads. See `loadingFamilies`. */
+    heldFamily?: string;
+    /** See `StyleTarget.inlineInherits`. */
+    inlineInherits?: boolean;
+    /** See `StyleTarget.boundStyle`: the declarations, and the same by the property each sets. */
+    boundStyle?: readonly DeferredDeclaration[] | null;
+    boundByProp?: Map<string, DeferredDeclaration>;
+    /**
+     * Whether this node, or one inside it, takes touches under a `pointer-events: none` it would
+     * otherwise inherit. Kept as each node is reconciled, children first. See `noteTouches`.
+     */
+    touchWithin?: boolean;
+    /**
+     * The paragraph the engine makes around a run of text written straight into a view. It is in no
+     * template and in no node's `children`: it holds the text, and commits where the text would.
+     */
+    box?: EngineNode;
+    /** A node the engine made, which no rule matches: it only inherits. */
+    anonymous?: true;
+    /** See `StyleTarget.styled`. */
+    styled?: true;
     /** `:focus`, from the native focus and blur events. */
     focused?: boolean;
     /** `:active`, set on the responder and every ancestor of it. */
@@ -224,6 +247,13 @@ export interface EngineNode extends HostNode {
         parts: readonly unknown[];
         value: unknown[];
     };
+    /** The commit that created this node's view, by its number: see `Engine.commitUnseen`. */
+    bornIn?: number;
+    /** The last bound `transform` string and the list it reads as, undefined where CSS cannot. */
+    boundTransform?: {
+        text: string;
+        list: unknown[] | undefined;
+    };
     /**
      * Set by the component that owns this element. A host primitive that reaches a commit without it
      * was written in a template that never imported the component, which is reported in dev.
@@ -235,6 +265,8 @@ export interface EngineNode extends HostNode {
      * knows. See `markComponentHost`.
      */
     componentHost?: true;
+    /** See `keepNativeView`. */
+    nativeView?: true;
     /**
      * 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
@@ -283,6 +315,12 @@ export declare function claimHost(node: HostNode): void;
  * with the host element in hand, whatever the component's selector.
  */
 export declare function markComponentHost(node: HostNode): void;
+/**
+ * Say that a component's host is the native view its element name is registered as: a typed
+ * wrapper for the view, where a component of the app's own with the same selector is a plain view.
+ * Called from the component's constructor. See `ViewNameOptions.yieldsToComponents`.
+ */
+export declare function keepNativeView(node: HostNode): void;
 /** Names Android registers differently. */
 export declare const ANDROID_VIEW_NAMES: Record<string, string>;
 export declare function nativePlatform(): string;
@@ -310,6 +348,13 @@ export interface ViewNameOptions {
      * takes its own content, and is not committed as children. An explicit prop wins over it.
      */
     readonly textContent?: string;
+    /**
+     * Whether the name gives way to a component of the app's own with the same selector, whose host
+     * is then a plain view. For a set of views registered under a prefix an app may also use for
+     * its design system, as `@expo/ui`'s are under `ui-`. A component that is the view itself, a
+     * typed wrapper for it, says so with `keepNativeView`.
+     */
+    readonly yieldsToComponents?: boolean;
 }
 /**
  * A view whose native name differs by platform. Chosen when the view is looked up rather than when
@@ -328,6 +373,16 @@ export declare function onFontsRegistered(listener: (families: ReadonlySet<strin
  * `Engine.fontsRegistered`.
  */
 export declare function fontsRegistered(families: Iterable<string>): void;
+/** Faces a load is about to ask the platform for. See `loadingFamilies`. */
+export declare function fontsLoading(families: Iterable<string>): void;
+/** Hear about loads settling, until the returned function is called. */
+export declare function onFontsSettled(listener: (families: ReadonlySet<string>) => void): () => void;
+/**
+ * Faces a load asked for and has finished with, registered or not, before `fontsRegistered`.
+ * Text held back for one that no load still asks for is laid out with the name again: see
+ * `Engine.fontsSettled`.
+ */
+export declare function fontsSettled(families: Iterable<string>): void;
 /**
  * Commit every `elementName` as a direct child of its nearest `ancestorName`, wherever the
  * template put it, e.g. `registerHoist('native-header', 'screen')`.
@@ -365,9 +420,12 @@ interface KeptHoist {
 export interface ViewNameNode {
     readonly kind: string;
     readonly name: string;
-    readonly parent: {
-        readonly name: string;
-    } | null;
+    readonly parent: ViewNameNode | null;
+    /** Whether a component is mounted on it, and whether that component is the native view. */
+    readonly componentHost?: boolean;
+    readonly nativeView?: boolean;
+    /** What it holds, which decides whether one of HTML's text elements is text or a view. */
+    readonly children?: readonly ViewNameNode[];
 }
 /**
  * The native view a node commits as: `Paragraph` for a `<text>`, `VirtualText` for one nested in
@@ -452,7 +510,7 @@ export interface EngineStats {
     firstCommitMs: number;
     /** Worst commit *after* the mount. This is the number that matters for frame rate. */
     worstCommitMs: number;
-    /** Commits that blew a 60fps frame budget, excluding the mount. */
+    /** Commits that took longer than 8ms, a frame at 120Hz, excluding the mount. */
     slowCommits: number;
     /**
      * Worst `begin()`..`end()` span, excluding the mount. This brackets Angular's whole render
@@ -585,6 +643,11 @@ export declare class Engine implements HostEngine {
      * text attributes change, which the same cap does. Android sets it only when `fontFamily` is in
      * the props it is sent, and the engine sends only what changed, so it is sent again once.
      */
+    /**
+     * Loads have settled for these families: every node held back for one, a span inside a
+     * paragraph included, is laid out with the name again, registered or not. See `loadingFamilies`.
+     */
+    fontsSettled(families: ReadonlySet<string>): void;
     fontsRegistered(families: ReadonlySet<string>): void;
     /**
      * Put the cursor in a text input; bring anything else on screen, in the scroll view it is in.
@@ -630,6 +693,9 @@ export declare class Engine implements HostEngine {
     private viewportSize;
     /** The system text size, from the conditions. See `Conditions.fontScale`. */
     private fontScale;
+    private readonly viewportWatchers;
+    /** Calls `listener` after each change of conditions, which is when `viewport` can change. */
+    watchViewport(listener: () => void): () => void;
     updateConditions(next: Conditions): void;
     createElement(name: string, sheet?: StyleSheet | null): EngineNode;
     addClass(node: EngineNode, name: string): void;
@@ -699,6 +765,11 @@ export declare class Engine implements HostEngine {
     parentNode(node: EngineNode): EngineNode | null;
     nextSibling(node: EngineNode): EngineNode | null;
     setProp(node: EngineNode, key: string, value: unknown): void;
+    /**
+     * Whether a node's inline style can change what it or anything below it resolves to: it sets,
+     * or until now set, a property its children inherit.
+     */
+    private inlineReachesStyle;
     /** Whether a node's inline style sets `direction`, remembering that one has. */
     private noteInlineDirection;
     /**
@@ -710,6 +781,12 @@ export declare class Engine implements HostEngine {
      * has changed for the props diff to notice.
      */
     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.
+     */
+    setBoundStyle(node: EngineNode, prop: string, value: unknown): boolean;
     /**
      * Set a custom property on a node, `--tint` from `[style.--tint]`, or remove it with `null`.
      *
@@ -722,6 +799,7 @@ export declare class Engine implements HostEngine {
     setEventListener(node: EngineNode, topLevelType: string, fn: (event: unknown) => void): () => void;
     private markProps;
     private markLaterSiblings;
+    /** `node`'s child list changed: `moved` came into it or went out of it. */
     private markStructure;
     /** Walk up until we hit a node already known to have a dirty subtree. */
     private markPath;
@@ -733,6 +811,28 @@ export declare class Engine implements HostEngine {
      * optimisation.
      */
     commit(): boolean;
+    /** 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 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.
+     */
+    commitUnseen(since: number): boolean;
+    /** Nodes that asked for `@keyframes` this commit had not met, by the name they asked for. */
+    private readonly awaitingKeyframes;
+    /**
+     * A sheet is registered when the first node it styles is committed, so a node committed before
+     * it can name keyframes that arrive later in the same commit. Those nodes play them from another
+     * commit straight away, as a browser applies keyframes however the sheets arrived; a name still
+     * unknown once the commit is over is reported.
+     */
+    private settleKeyframes;
     private readonly scrollDriver;
     /** Whether native can move a view by a scroll with no JavaScript in between. */
     get drivesScroll(): boolean;
@@ -817,6 +917,11 @@ export declare class Engine implements HostEngine {
      * A `sheet` already gone, such as a global sheet removed, leaves `next` registered last.
      */
     sheetReplaced(sheet: StyleSheet, next: StyleSheet | null): void;
+    /**
+     * Every sheet's `@font-face` rules again, in order, and every text that names a family matched
+     * again: a face whose rule went is no longer matched, though the platform keeps it registered.
+     */
+    private reindexFonts;
     /** Every sheet's `@keyframes` again, in order, and every animation told to look them up. */
     private reindexKeyframes;
     /** Mark every node under `node` with an animation, so it looks its keyframes up again. */
@@ -831,6 +936,8 @@ export declare class Engine implements HostEngine {
      * Once per sheet that declares faces, so walking the tree costs nothing that matters.
      */
     private rematchFonts;
+    /** Mark every element under `node` committed with a family, so it is matched again. */
+    private markFontText;
     private readonly knownSheets;
     /**
      * Start, advance or stop the `@keyframes` animation a node's style asks for.
@@ -839,6 +946,16 @@ export declare class Engine implements HostEngine {
      * own frames, which is what lets an element animate in without differing from anything.
      */
     private animated;
+    /**
+     * A clock animation the scroll plays instead: the same animation where only the timeline moved,
+     * and one cancelled where the name changed.
+     */
+    private handOverToScroll;
+    /**
+     * `animationcancel` for an animation stopped before it ended: the element no longer asks for it,
+     * asks for another by name, or its keyframes went, as a browser fires it.
+     */
+    private cancelPlaying;
     /** Start the clock on an animation, unless the node is already playing this one. */
     private startPlaying;
     /**
@@ -955,6 +1072,20 @@ export declare class Engine implements HostEngine {
      * which, per child, was most of what a one-row update cost.
      */
     private reconcileChildren;
+    /**
+     * The paragraph a run of text written straight into a view is drawn in, or nothing for a run of
+     * whitespace, which a browser draws nothing for between the items of a flex box either.
+     *
+     * It is the text's own, kept on the text node, and no part of the tree: its parent is the view,
+     * so it inherits what the view's text would, and no rule matches it.
+     */
+    /**
+     * A run of text under `parent`, which commits as `viewName`: the text itself inside a text, a
+     * paragraph of its own inside any other view, and nothing where the view takes its text as a
+     * prop (see `ViewNameOptions`) or the run is whitespace between a view's children.
+     */
+    private reconcileText;
+    private looseText;
     /** Remember an iOS modal host committed as showing, so hiding it waits for `topDismiss`. */
     private notePresented;
     /**
@@ -989,6 +1120,11 @@ export declare class Engine implements HostEngine {
      * Its native state goes with it, as it would there.
      */
     private reconcileUnder;
+    /**
+     * A node whose native view is no longer the one it was created as is created again: a text
+     * element that came to hold a view, or stopped. A clone keeps the view it was made as.
+     */
+    private forgetRenamed;
     /**
      * Let a node and everything under it be created again at the next commit. The views it keeps
      * for hoisted names go too: they are children of the native view it is losing.
@@ -1018,7 +1154,7 @@ export declare class Engine implements HostEngine {
     private create;
     /**
      * Angular's own unknown-element check does not run in this pipeline, so a `<text>` in a
-     * template that never imported `Text` compiles, renders as a plain view, and looks like a
+     * template that never imported `Text` compiles, draws without the component, and looks like a
      * layout bug. On the first commit of any known element with no component behind it, say so.
      */
     private checkClaimed;
@@ -1151,6 +1287,11 @@ 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 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.
+     */
+    private painted;
     /**
      * The host's `processColor`, and the one place a platform colour becomes one.
      *