@ng-native/fabric 0.4.0 → 0.6.0

package/dist/engine.d.ts

@@ -194,6 +194,10 @@ export interface EngineNode extends HostNode {
     styleCache: StyleCache | null;
     /** Set when something that could change what this node matches has changed. */
     styleDirty: boolean;
+    /** See `StyleTarget.hasDirty`. */
+    hasDirty: boolean;
+    /** See `StyleTarget.stateDirty`. */
+    stateDirty: boolean;
     /** A family left out while it loads. See `loadingFamilies`. */
     heldFamily?: string;
     /** See `StyleTarget.inlineInherits`. */
@@ -230,6 +234,18 @@ export interface EngineNode extends HostNode {
     ownStyle?: object;
     /** The resolved style this node was last committed with, for the skip check in `reconcile`. */
     styleCommitted: StyleCache | null;
+    /**
+     * How this node laid its children out when one of them last had a `fit-content` size, as
+     * `containerOf` says it. Set by such a child, and compared on each reconcile so the children
+     * are worked out again when the direction or alignment changes. Unset on every other node.
+     */
+    fitContainer?: string;
+    /**
+     * Whether this node had a height a percentage could be taken of, when a box beneath it with a
+     * percentage height last asked, as `definiteHeight` says it. Compared on each reconcile so its
+     * children are worked out again when it changes. Unset on every other node.
+     */
+    heightBasis?: boolean;
     /**
      * Per-property transition state, for every property this node has ever seen a `transition` for.
      * A finished entry stays, because its target is what the next change is measured against.
@@ -267,6 +283,10 @@ export interface EngineNode extends HostNode {
     componentHost?: true;
     /** See `keepNativeView`. */
     nativeView?: true;
+    /** Props kept for selectors to match and left out of what is committed. See `keepAsAttribute`. */
+    attributeOnly?: Set<string>;
+    /** The child this node's background is painted on instead of itself. See `paintOn`. */
+    paintsOn?: EngineNode;
     /**
      * 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
@@ -426,6 +446,8 @@ export interface ViewNameNode {
     readonly nativeView?: boolean;
     /** What it holds, which decides whether one of HTML's text elements is text or a view. */
     readonly children?: readonly ViewNameNode[];
+    /** Set on the paragraph the engine makes for a run of text written straight into a view. */
+    readonly anonymous?: boolean;
 }
 /**
  * The native view a node commits as: `Paragraph` for a `<text>`, `VirtualText` for one nested in
@@ -567,6 +589,16 @@ export declare class Engine implements HostEngine {
      * does, a child list can move without anything else needing to be looked at again.
      */
     private structuralSheets;
+    /** How many children after a change in a list one of them reaches. See `siblingReach`. */
+    private structuralAfter;
+    /** Whether one of them reaches the children before it. */
+    private structuralBefore;
+    /** The compounds of theirs that read an element's place from under it. See `markPlace`. */
+    private readonly placeElsewhere;
+    /** The sheets `watchStructure` has read, which it is asked about once an element. */
+    private readonly watchedStructure;
+    /** Whether any sheet uses `:has()`. See `markBeneath`. */
+    private hasSheets;
     private readonly resolveAssetSource;
     constructor(fabric: FabricUIManager, rootTag: number, options?: EngineOptions);
     /**
@@ -590,6 +622,25 @@ export declare class Engine implements HostEngine {
      * binding, so nothing marks an Angular view dirty and no change-detection pass would follow.
      */
     private setActiveChain;
+    /** 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. */
+    private readonly activeBySheet;
+    /** Note what a sheet in play asks about a pressed element. See `markActive`. */
+    private watchActive;
+    /** A sheet has left play, by a hot swap or by being removed: what it asked goes with it. */
+    private unwatchActive;
+    private countActive;
+    /**
+     * A press began or ended on `node` or under it, which is all that changed about it. A press
+     * reaches every ancestor up to the root, and marking each as restyled would style the whole
+     * screen again, twice a press. So each is only matched again, and keeps its style and all
+     * that is under it unless it now matches other rules. An element a rule asks about from
+     * inside or beside it, `.card:active .title`, changes more than itself, and is restyled with
+     * everything under it as any other change is. With no rule for a pressed element at all there
+     * is nothing to match.
+     */
+    private markActive;
     /**
      * Custom properties the device knows and the stylesheet cannot, once they change.
      *
@@ -604,6 +655,12 @@ export declare class Engine implements HostEngine {
      * `replacing` is a sheet added before that this one takes the place of, after a hot swap.
      */
     addGlobalSheet(sheet: StyleSheet, replacing?: StyleSheet): boolean;
+    /**
+     * Have styled again each node a sheet just added could match. The rest keep the style they
+     * have, which the resolver lets stand for a node none of the sheet's rules is written for,
+     * so a commit steps over them: the walk here is what finds the ones it must not step over.
+     */
+    private markWrittenFor;
     /**
      * Stop matching a sheet `addGlobalSheet` added, and restyle everything; false, and nothing
      * done, when it is not one. A hot swap that leaves a None component no rules, or makes it scoped.
@@ -700,6 +757,21 @@ export declare class Engine implements HostEngine {
     createElement(name: string, sheet?: StyleSheet | null): EngineNode;
     addClass(node: EngineNode, name: string): void;
     removeClass(node: EngineNode, name: string): void;
+    /**
+     * Mark a node whose classes changed, by what the rules that name those classes can restyle.
+     *
+     * A class no selector names changes no style: a library's own marker, of an overlay that is
+     * animating or a control that was touched. One named only as what a rule's element is
+     * inside, `.animating .close`, restyles the elements under the node that such rules are for.
+     * Either way a whole subtree is not styled again for a class that has no say in it. Any other
+     * class restyles the node and everything under it, 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;
+    /** Have styled again each element under a node that one of `subjects`' rules could be for. */
+    private markUnder;
     /**
      * The sheet of the component `node` hosts, whose `:host` rules it matches. Set again when a hot
      * swap replaces the component's sheet, which recreates the views inside but not the host, so the
@@ -765,6 +837,20 @@ export declare class Engine implements HostEngine {
     parentNode(node: EngineNode): EngineNode | null;
     nextSibling(node: EngineNode): EngineNode | null;
     setProp(node: EngineNode, key: string, value: unknown): void;
+    /**
+     * Paint a node's background on one of its children instead of on the node: the node keeps its
+     * `background-color` and `background-image` in the cascade, where a stylesheet wrote them, and
+     * the child is the view that draws them. What a view that masks its children and not itself
+     * needs, as `<gradient-text>` is.
+     */
+    paintOn(node: EngineNode, child: EngineNode): void;
+    /**
+     * 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.
+     * It is committed again once the prop is next written. What the platform adapter does with a
+     * static attribute that is an input of the host's component.
+     */
+    keepAsAttribute(node: EngineNode, key: string): 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.
@@ -796,11 +882,50 @@ export declare class Engine implements HostEngine {
      */
     setCustomProperty(node: EngineNode, name: string, value: unknown): void;
     setText(node: EngineNode, value: string): void;
+    private markFilled;
     setEventListener(node: EngineNode, topLevelType: string, fn: (event: unknown) => void): () => void;
     private markProps;
+    /** Start matching ancestors again on a change, once a sheet that uses `:has()` is in play. */
+    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.
+     */
+    private markBeneath;
     private markLaterSiblings;
-    /** `node`'s child list changed: `moved` came into it or went out of it. */
+    /** `node`'s child list changed: `moved` came into it at `at`, or went out of it from there. */
     private markStructure;
+    /**
+     * Mark the children whose place in a child list that changed at `at` a sheet could read
+     * differently. The two at each end always, which are the old first and last and the new. Those
+     * from `at` on where some sheet counts from the start or asks about any one before, since a
+     * child's place from the start hangs only on those before it; and those before `at` where one
+     * counts from the end. Styling one again resolves everything under it again, so a long list
+     * gaining a row at its end is not the whole list.
+     *
+     * Where the sheets ask no further than the element just before (`+`), a rule steps a known
+     * number of elements along from one whose own match changed, and those are all there is to
+     * mark: that many after the change, and that many after the two at the start, either of which
+     * may have stopped or started being first. Nothing comes after the two at the end.
+     */
+    private markRepositioned;
+    /**
+     * A child's place in its list changed, which is all that changed about it. It is matched
+     * again, and keeps its style and all that is under it unless it now matches other rules: its
+     * place is read by the rules that style it and by no other. Not where a rule reads the place
+     * of an element like it from under it, `.row:nth-child(odd) .label`: that changes more than
+     * the element itself, which is then styled again with everything under it, as is a child
+     * that is no element.
+     */
+    private markPlace;
+    /**
+     * Whether a rule could read this element's place from another element. By its classes alone,
+     * which every such compound it could be asks for: a compound with none could be any element.
+     */
+    private placeReadFromUnder;
+    /** Note what a sheet coming into play asks about a child list. None is unset: see `structural`. */
+    private watchStructure;
     /** Walk up until we hit a node already known to have a dirty subtree. */
     private markPath;
     private isClean;
@@ -811,6 +936,15 @@ export declare class Engine implements HostEngine {
      * optimisation.
      */
     commit(): boolean;
+    private beforeCommit;
+    private announceCommit;
+    /**
+     * Run `run` once, as the next commit hands its tree to the host and before the host has it: the
+     * moment for something the host applies to its next commit, which is only this one from here.
+     * A pass that changes nothing commits nothing and runs nothing, so a request waits until it is
+     * taken back with the function returned. A later request replaces an earlier one.
+     */
+    beforeNextCommit(run: () => void): () => void;
     /** The first commit whose new views have not been drawn yet, while `commitUnseen` runs. */
     private unseen;
     /**
@@ -864,19 +998,45 @@ export declare class Engine implements HostEngine {
      * a tree that changes halfway through being walked is the one thing a commit cannot survive.
      */
     private flushTransitionEvents;
+    /**
+     * The nodes whose animation has ended with no fill and is still held at its last frame, until
+     * its `animationend` has been heard. A browser runs that listener before it paints again, and
+     * an exit animation's listener takes the element away: it is never seen back at rest. Here the
+     * listener runs after the commit, so the commit that ends the animation paints the last frame,
+     * and the element goes back to rest once the listener has run and left it there.
+     */
+    private readonly lettingGo;
+    private letGo;
     /** Anchors take part in sibling ordering but never reach Fabric. */
     private visibleChildren;
     /**
      * Everything a node renders with, unprocessed. Precedence, weakest first: native defaults, the
      * node's `defaultStyle`, matched CSS, explicit props, inline style, a component's
-     * `styleOverride`. Inline wins over CSS for the same reason it does on the web.
+     * `styleOverride`. Inline wins over CSS as it does on the web, but for a declaration marked
+     * `!important`, which stands over it: see `inlineOf`.
      *
      * Raw, because this is what the next commit diffs against. Colours and asset ids are converted
      * on the way out instead (`processed`), and only for the keys that changed: the converters
      * return fresh objects, so diffing their output would re-send every image and shadow on every
      * unrelated change.
      */
+    /** What a touch on an element that keeps a drag holds off, while it lasts: see `holdSwipe`. */
+    private heldFor;
     private mergeProps;
+    /**
+     * Leave a node's background out of what it commits when a child paints it, and give that child
+     * its parent's: the cascade's, and over it the parent's inline style.
+     */
+    private movePaint;
+    /**
+     * 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
+     * with a percentage height asked: those children are merged again. A change to a container
+     * marks nothing beneath it, since none of these is inherited.
+     */
+    private refitChildren;
+    /** Have a container's children merged again, through any `display: contents` among them. */
+    private refit;
     /**
      * The text size cap that lays a paragraph or text input out again once a face it names has
      * registered: a step per face above the app's own cap where it set one (below 1 is none, on
@@ -956,6 +1116,51 @@ export declare class Engine implements HostEngine {
      * asks for another by name, or its keyframes went, as a browser fires it.
      */
     private cancelPlaying;
+    /** Stop on native each animation whose view has left the tree. */
+    private releasePlayedNatively;
+    /** Every node whose animation native is playing, with no frame of it in JavaScript. */
+    private readonly playedNatively;
+    /**
+     * Hand an animation that has just started to native, where native can play it: one that moves
+     * only opacity and transforms, starts at once, and repeats a whole number of times. Native then
+     * runs it frame by frame, and JavaScript hears of it again when it ends. Anything else is
+     * played from here, a commit a frame. See `NativeScrollDriver.play`.
+     */
+    /**
+     * The nodes whose animation moves them by a share of their own size and had no size yet when
+     * it started, each with the style it rests at: asked again once the commit has laid them out.
+     */
+    private readonly unsized;
+    /**
+     * An animation's frames as native can interpolate them: a move by a share of the box,
+     * `translateX(200%)`, as the points that is of the size the view is laid out at. Nothing where
+     * the view has no size yet, which is every view until its first commit: it is played from
+     * JavaScript, and handed over once that commit has laid it out. See `playSized`.
+     *
+     * ponytail: the size it had when it started. A box that changes size goes on moving by the
+     * points of the old one until the animation starts again; restart it from the box's layout
+     * event if a bar that resizes mid-animation comes up.
+     */
+    private sized;
+    /**
+     * Hand to native each animation that was waiting for its view to have a size. The commit just
+     * made painted its first frame, so its clock starts here: no frame of it has been seen move.
+     */
+    private playSized;
+    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.
+     */
+    private endedNatively;
+    /** Take an animation back from native, which stops it there. The caller plays it on, or not. */
+    private stopNative;
+    /**
+     * Play on from JavaScript an animation native was playing, from where its clock has got to:
+     * what a pause, other frames or a view made again need, none of which native can be told of.
+     */
+    private backToScript;
     /** Start the clock on an animation, unless the node is already playing this one. */
     private startPlaying;
     /**
@@ -1009,6 +1214,13 @@ export declare class Engine implements HostEngine {
     private reportHeld;
     private reportMissingKeyframes;
     private transitioned;
+    /**
+     * Whether an animation that has finished goes on holding its last frame. With a forwards fill
+     * it does, for good: without one the element falls back to whatever the cascade gives it, and
+     * 'backwards' fills the start only. Heard, it holds until whoever listens has been told: see
+     * `lettingGo`.
+     */
+    private keeps;
     /** One `@keyframes` player, one frame on. */
     private advancePlayer;
     /**
@@ -1047,7 +1259,8 @@ export declare class Engine implements HostEngine {
      *
      * A stop's colour is a colour like any other, but it is two levels down and nothing else looks
      * there: without this the device is handed the string `rgb(255, 0, 0)` where it wants a number,
-     * and paints nothing.
+     * and paints nothing. The stops are first rewritten so native's interpolation paints what
+     * CSS's premultiplied one does (see `premultipliedStops`).
      */
     private processGradients;
     private clearFlags;
@@ -1103,6 +1316,20 @@ export declare class Engine implements HostEngine {
      * when it is shown again, as Modal.js creates it afresh. Committed again, it ignores every touch.
      */
     private withheld;
+    /**
+     * Whether an element is `display: none`, which has no box and so no view, nor has anything
+     * in it. A view that is committed and not displayed looks the same, but Yoga marks one as
+     * laid out each time it measures what holds it, and React Native clears the mark only where it
+     * reads that parent's layout: a debug build stops at the mark, on a later commit that has the
+     * parent's layout already. Shown again it is made again, as an element put back in the tree
+     * is: what its views held of their own, a scroll offset, is not kept.
+     */
+    private undisplayed;
+    /**
+     * Whether a node hoisted into `target` is not displayed where it was written: it, or a box
+     * between it and the child of `target` it was written in. That child is asked before this is.
+     */
+    private undisplayedUnder;
     /**
      * `reconcileChildren` for a node other nodes hoist into: its own children, each followed by
      * the hoisted nodes written inside it, then those written in it directly, then the views it
@@ -1340,6 +1567,43 @@ export declare class Engine implements HostEngine {
      * bubble for the rest, as in the DOM.
      */
     dispatchEvent(instanceHandle: unknown, topLevelType: string, nativeEvent: unknown): void;
+    /** The screen whose swipe back is held off while a finger is on what keeps a sideways drag. */
+    private swipeHeld;
+    /**
+     * Hold a screen's swipe back off for a touch that starts on an element whose `touch-action`
+     * keeps a drag to the side for itself, and give it back when the last finger lifts. From iOS
+     * 26 the swipe starts anywhere on a screen once a finger has moved a little to the right, and
+     * takes the touch from whatever was following it: a slider's thumb stops and the screen
+     * leaves. The screen is told before the finger has moved that far.
+     */
+    private holdSwipe;
+    /**
+     * A touch on an element that keeps a drag to the side: where it began, and whether native's
+     * own gestures are held off for it. Held from the start where the element keeps a drag down
+     * the page too (`none`); from the moment the finger sets off across where it leaves that one
+     * to the page (`pan-y`), and never for that touch where it sets off down.
+     */
+    private drag;
+    private holdFrom;
+    /** The scroll view whose scrolling is off while a drag over it is an element's own. */
+    private scrollHeld;
+    /**
+     * Stop the scroll view a node is in from scrolling, until the touch ends. Telling native who
+     * holds the touch does this on Android. On iOS a scroll view is held off only by a responder
+     * that is over it, never one inside it, so it is told not to scroll.
+     */
+    private holdScroll;
+    /** Settle which way a drag set off, and hold native's own off one that set off across. */
+    private settleDrag;
+    /** Give the swipe back once the last finger has lifted. */
+    private releaseSwipe;
+    /**
+     * Commit a screen or a scroll view again now, not with whatever next changes: the swipe begins
+     * once the finger has moved ten points or so, which is a frame or two after it came down.
+     */
+    private tellScreen;
+    /** The screen of a native stack a node is on, or nothing where it is on none. */
+    private screenOf;
     /** A presented modal host has finished leaving, so a hidden one can come out of the tree. */
     private dismissed;
     private reportEventError;