@ng-native/fabric 0.8.0 → 0.10.0

package/dist/engine.d.ts

@@ -206,6 +206,8 @@ export interface EngineNode extends HostNode {
     styleCache: StyleCache | null;
     /** Set when something that could change what this node matches has changed. */
     styleDirty: boolean;
+    /** See `StyleTarget.ownDirty`. */
+    ownDirty: boolean;
     /** See `StyleTarget.hasDirty`. */
     hasDirty: boolean;
     /** See `StyleTarget.stateDirty`. */
@@ -321,6 +323,10 @@ export interface EngineNode extends HostNode {
     baselineFields?: Set<EngineNode>;
     /** Commit this node again with its children so Fabric measures it again. `remeasureText`. */
     remeasure?: true;
+    /** On a paragraph, whether its text was one word when it was last merged: `wholeWords`. */
+    oneWord?: boolean;
+    /** The z-index this view is drawn at for a box in it, where it has none: `Engine.raise`. */
+    raised?: number;
     /**
      * A modal host committed as visible on iOS whose dismissal native has not yet reported. It
      * stays committed after `visible` goes false until `topDismiss`, as React Native's Modal.js
@@ -777,16 +783,21 @@ export declare class Engine implements HostEngine {
      * 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.
+     * animating or a control that was touched. One a rule is for the element of, `.on`, has that
+     * 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.
      *
      * 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. */
+    /**
+     * 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.
+     */
     private markUnder;
     /**
      * The sheet of the component `node` hosts, whose `:host` rules it matches. Set again when a hot
@@ -800,19 +811,35 @@ export declare class Engine implements HostEngine {
      * the web's mount point has, unless the app's `:host` sizes it otherwise.
      */
     setDefaultStyle(node: EngineNode, style: Readonly<Record<string, unknown>> | undefined): void;
-    /** `class="a b"` from a template. Replaces the set rather than adding to it. */
+    /**
+     * `class="a b"` from a template. Replaces the set rather than adding to it. The same classes in
+     * another order are a change too, to a selector that reads the class attribute, `[class^="a"]`.
+     */
     setClasses(node: EngineNode, value: string): void;
     /** Angular's `@if`/`@for`/`ViewContainerRef` markers. Ordered, never committed. */
     createAnchor(): EngineNode;
     createText(value: string): EngineNode;
     appendChild(parent: EngineNode, child: EngineNode): void;
     insertBefore(parent: EngineNode, child: EngineNode, ref: EngineNode | null): void;
+    /**
+     * A node coming under a parent other than the one it is under, or under any once it has been
+     * taken out: what is over it may be other than it was styled under. The resolver sees that for
+     * itself by the parent's cache, except between two boxes that share one, where it is told here.
+     * Moved within its own parent, a row of a list reordered, it is styled as it was.
+     */
+    private markAdopted;
     removeChild(parent: EngineNode | null, child: EngineNode): void;
     /**
      * A child came or went under a view that takes its text as a prop: that prop changed. A span
      * changes it too, by keeping or dropping the space before it.
      */
     private markTextContent;
+    /**
+     * Text came, went or changed in a paragraph: where it has become one word, or stopped being
+     * one, the paragraph is merged again, since that is one line or as many as it takes. Asked
+     * of the paragraph's outermost element, which is the view; any other change leaves it be.
+     */
+    private markWords;
     /** A subtree that went out of the tree is back in: its hoisted nodes commit again. */
     private wakeHoists;
     /**
@@ -853,6 +880,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;
+    /**
+     * Have the paragraph a run of text is in merged again: it is as tall as the tallest line of
+     * its runs, by a line height or a text scaling set on one of them. See `lineTall`.
+     */
+    private markParagraph;
     /**
      * 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
@@ -909,6 +941,23 @@ export declare class Engine implements HostEngine {
      * which would restyle everything under them. Only sheets that use `:has()` pay.
      */
     private markBeneath;
+    /**
+     * The boxes rules ask `:has()` of above the node they style, `.card:has(.x) .title`, by the
+     * sheet that asks: a sheet replaced or taken away asks no more.
+     */
+    private readonly hasReaders;
+    /** The nodes something changed beneath since the last commit, where any sheet has such a rule. */
+    private readonly changedBeneath;
+    /**
+     * 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.
+     */
+    private markUnderHas;
+    /**
+     * 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.
+     */
     private markLaterSiblings;
     /** `node`'s child list changed: `moved` came into it at `at`, or went out of it from there. */
     private markStructure;
@@ -1039,6 +1088,40 @@ export declare class Engine implements HostEngine {
     /** What a touch on an element that keeps a drag holds off, while it lasts: see `holdSwipe`. */
     private heldFor;
     private mergeProps;
+    /**
+     * The z-index a view is drawn at for the boxes in it: the highest of theirs. A browser draws a
+     * box with a z-index over what follows the boxes it is in, and a native view is ordered among
+     * the views beside it and no further, so each view the box is in is raised as far. Read from
+     * what its children committed, which for a raised child is what raised it. A child with a
+     * z-index of its own answers with that and nothing from inside it, as the stacking context it
+     * is. Only a plain view is raised: a scroll view clips what is in it, and a screen is ordered
+     * by its stack.
+     *
+     * ponytail: a z-index is the one thing read as making a stacking context. Opacity and a
+     * transform make one in a browser too; read them here if a box is ever raised past one.
+     */
+    private raisedBy;
+    /** Read how far a view is raised, once its children are committed: its props are, if it moved. */
+    private raise;
+    /**
+     * Draw a border that has a width and no colour in the colour of the text, as a browser does:
+     * `border-color` starts as `currentColor`, and native starts it as black. Each side with a
+     * width, where nothing gave that side a colour. Left to native where there is no text colour
+     * to take, which is black in a browser too.
+     */
+    private borderInText;
+    /**
+     * The tallest line, as the system text size draws it, of the runs of text in a paragraph:
+     * none is 0. A run scales as what it is in does, `within`, but for what it says of that
+     * itself: one that does not scale, or stops at a size, beside text that does.
+     */
+    private tallestRun;
+    /**
+     * Keep a paragraph whose text has nowhere to wrap on one line, as a browser does: a word is
+     * not broken inside, and what does not fit is past the edge. Native breaks a word wider than
+     * its line between any two letters. Cut at the edge, where no rule says how it ends.
+     */
+    private wholeWords;
     /**
      * 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.
@@ -1122,6 +1205,24 @@ export declare class Engine implements HostEngine {
      * own frames, which is what lets an element animate in without differing from anything.
      */
     private animated;
+    /**
+     * The keyframes a node's animation names: those of its own component's sheet where it has
+     * some by that name, as Angular scopes a component's keyframes in a browser, and otherwise
+     * whichever sheet has them, since any other is global.
+     *
+     * ponytail: a host is asked of the sheet it is written in before its own component's, so
+     * a `:host` animation is played by its parent's frames where both have the name.
+     */
+    private keyframesOf;
+    /** Each node's frames as they settle on it, kept for as long as they settle the same. */
+    private readonly settledFrames;
+    /**
+     * An animation's frames for the node playing it: those with a value that waits for the node,
+     * a `var()` it sets, settled against it. The same frames are answered while they settle the
+     * same, and others once a variable changes, which is what an animation under way is played
+     * on from: see `reframe`.
+     */
+    private framesFor;
     /**
      * A clock animation the scroll plays instead: the same animation where only the timeline moved,
      * and one cancelled where the name changed.
@@ -1179,6 +1280,8 @@ export declare class Engine implements HostEngine {
     private backToScript;
     /** Start the clock on an animation, unless the node is already playing this one. */
     private startPlaying;
+    /** Play an animation that has just started: by native's layout, by native's driver, or here. */
+    private playSomewhere;
     /**
      * The colour `node` inherits, for frames that set `color: currentColor`, which is that colour
      * wherever the animation has got to, as in CSS. Undefined for frames that do not.
@@ -1258,12 +1361,27 @@ export declare class Engine implements HostEngine {
      * A width eased from JavaScript is a commit a frame, and a commit lays the whole screen out.
      */
     private layEased;
+    /** The animations this commit lays out at their last frame, for native to move the views to. */
+    private laidPlayed;
+    /**
+     * Whether an animation that has just started is one native can play by laying the view out
+     * at its last frame: two frames of sizes or places, played once from where the view is drawn
+     * now, which is where native moves it from. It is then committed at that frame; see `layOut`.
+     */
+    private layPlayed;
+    /** Go on from JavaScript with an animation native was to lay out, by the clock it started on. */
+    private playLaidHere;
+    /** An animation native laid out has had its time: it is at its last frame, and says so. */
+    private endLaidPlayed;
     /**
-     * Before a commit is handed over: ask native to move what it lays out, or take the
-     * transitions back to ease them from JavaScript where the commit moves anything else, and
-     * where they would not all take as long. Answers whether the tree has to be reconciled again.
+     * Before a commit is handed over: ask native to move what it lays out, and take back to
+     * ease from JavaScript whatever it cannot: all of it where the commit moves anything else,
+     * and otherwise what would not take as long as the longest. Answers whether the tree has to
+     * be reconciled again.
      */
     private layOut;
+    /** Ask native to move what the commit lays out over `duration`, and end each when it is up. */
+    private askLayout;
     /**
      * Note a commit that resizes or moves a box in no transition native lays out: a prop of one
      * that moves boxes, children that came or went, text longer or shorter than it was.