react-native-gtkx 0.2.0-alpha.2 → 0.3.0-alpha.1

package/dist/reanimated-compat/scroll-offset.js

@@ -0,0 +1,104 @@
+// `useScrollOffset` (and `useScrollViewOffset`, its own deprecated alias
+// upstream) — a shared value that always holds a scrollable's current offset.
+//
+// Upstream builds it out of `useEvent`, which subscribes a native view tag to
+// the scroll event names and lets the UI runtime write the value. Here it is
+// shorter and reads the same: an `AnimatedRef` on a scrollable resolves to the
+// `GtkScrolledWindow` behind it, and its adjustments already emit
+// `value-changed` on the loop this JS is on — the same signal
+// `ScrollView.emitScroll` runs from. So the value moves with the scroll, with
+// no React render and no event machinery, which is what the hook promises.
+//
+// **It costs nothing to be untracked.** Nothing is connected until a hook
+// actually points at a scrollable, and it is disconnected when the component
+// unmounts or the ref moves to a different one. A scrollable nobody tracks is
+// the widget it always was.
+import { useEffect, useRef, useState } from "react";
+import { widgetForHandle } from "../components/measure";
+import { warnOnce } from "../style/dev-warning";
+import { Gtk } from "../gtkx/bridge/index";
+const instanceOf = (animatedRef) => {
+    if (!animatedRef) {
+        return null;
+    }
+    return typeof animatedRef === "function" ? animatedRef() : animatedRef.current;
+};
+/**
+ * The scrolled window a ref stands for. A `ScrollView`'s handle IS the
+ * scrolled window; a windowed list's handle resolves through to the
+ * `ScrollView` it renders (`registerHandleAlias`), which is the same rule
+ * `findNodeHandle` and `measureLayout` already follow — so this works on a
+ * `FlatList` ref without knowing anything about lists.
+ */
+const scrolledWindowOf = (animatedRef) => {
+    const widget = widgetForHandle(instanceOf(animatedRef));
+    return widget instanceof Gtk.ScrolledWindow ? widget : null;
+};
+export const createScrollOffsetHooks = (makeMutable) => {
+    const useScrollOffset = (animatedRef, 
+    // Upstream's second argument: write into the caller's shared value
+    // instead of minting one, so two hooks can share an offset.
+    providedOffset) => {
+        // useState rather than a lazily-filled ref for the reason `useSharedValue`
+        // reaches for it: this value IS the return value, so a ref would be a
+        // render-time read.
+        const [internal] = useState(() => makeMutable(0));
+        const offset = providedOffset ?? internal;
+        // The widget currently subscribed to, so a re-render that resolved to the
+        // same one reconnects nothing.
+        const attached = useRef(null);
+        const detach = useRef(null);
+        // No dependency array on purpose. A ref is attached by React AFTER the
+        // render that created it, so the first run of this effect commonly
+        // resolves to nothing and the second one — a commit later, with the list
+        // mounted — is the one that finds the scroller. Upstream solves the same
+        // problem with `animatedRef.observe`; re-resolving per commit is the same
+        // answer without a second observer protocol, and it is one WeakMap lookup
+        // when the answer has not changed.
+        useEffect(() => {
+            const widget = scrolledWindowOf(animatedRef);
+            if (widget === attached.current) {
+                return;
+            }
+            detach.current?.();
+            detach.current = null;
+            attached.current = widget;
+            if (!widget) {
+                if (instanceOf(animatedRef) !== null) {
+                    warnOnce("useScrollOffset", "useScrollOffset was given a ref that is not on a scrollable, so the " +
+                        "offset will stay at 0. Pass the ref to a ScrollView, FlatList or " +
+                        "Animated.ScrollView.");
+                }
+                return;
+            }
+            const hadjustment = widget.getHadjustment();
+            const vadjustment = widget.getVadjustment();
+            const update = () => {
+                // Upstream's own rule, mirrored exactly: the horizontal offset when
+                // there is one, the vertical otherwise. One shared value cannot carry
+                // two axes, and this is the choice every consumer is written against.
+                const x = hadjustment.getValue();
+                offset.value = x === 0 ? vadjustment.getValue() : x;
+            };
+            update();
+            hadjustment.on("value-changed", update);
+            vadjustment.on("value-changed", update);
+            detach.current = () => {
+                hadjustment.off("value-changed", update);
+                vadjustment.off("value-changed", update);
+            };
+        });
+        useEffect(() => () => {
+            detach.current?.();
+            detach.current = null;
+            attached.current = null;
+        }, []);
+        return offset;
+    };
+    return {
+        useScrollOffset,
+        /** Upstream's own deprecated alias, kept so library call sites are unchanged. */
+        useScrollViewOffset: useScrollOffset,
+    };
+};
+//# sourceMappingURL=scroll-offset.js.map

package/dist/reanimated-compat/scroll-offset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll-offset.js","sourceRoot":"","sources":["../../src/reanimated-compat/scroll-offset.ts"],"names":[],"mappings":"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","sourcesContent":["// `useScrollOffset` (and `useScrollViewOffset`, its own deprecated alias\n// upstream) — a shared value that always holds a scrollable's current offset.\n//\n// Upstream builds it out of `useEvent`, which subscribes a native view tag to\n// the scroll event names and lets the UI runtime write the value. Here it is\n// shorter and reads the same: an `AnimatedRef` on a scrollable resolves to the\n// `GtkScrolledWindow` behind it, and its adjustments already emit\n// `value-changed` on the loop this JS is on — the same signal\n// `ScrollView.emitScroll` runs from. So the value moves with the scroll, with\n// no React render and no event machinery, which is what the hook promises.\n//\n// **It costs nothing to be untracked.** Nothing is connected until a hook\n// actually points at a scrollable, and it is disconnected when the component\n// unmounts or the ref moves to a different one. A scrollable nobody tracks is\n// the widget it always was.\nimport { useEffect, useRef, useState } from \"react\"\nimport { widgetForHandle } from \"../components/measure\"\nimport { warnOnce } from \"../style/dev-warning\"\nimport { Gtk } from \"../gtkx/bridge/index\"\nimport type { SharedValue } from \"./mutable\"\n\ntype MakeMutable = <T>(initial: T) => SharedValue<T>\n\n/** Either spelling of a ref, as everything else on this surface accepts. */\ntype ScrollableRef = (() => unknown) | { current: unknown } | null | undefined\n\nconst instanceOf = (animatedRef: ScrollableRef): unknown => {\n  if (!animatedRef) {\n    return null\n  }\n  return typeof animatedRef === \"function\" ? animatedRef() : animatedRef.current\n}\n\n/**\n * The scrolled window a ref stands for. A `ScrollView`'s handle IS the\n * scrolled window; a windowed list's handle resolves through to the\n * `ScrollView` it renders (`registerHandleAlias`), which is the same rule\n * `findNodeHandle` and `measureLayout` already follow — so this works on a\n * `FlatList` ref without knowing anything about lists.\n */\nconst scrolledWindowOf = (\n  animatedRef: ScrollableRef,\n): Gtk.ScrolledWindow | null => {\n  const widget = widgetForHandle(instanceOf(animatedRef))\n  return widget instanceof Gtk.ScrolledWindow ? widget : null\n}\n\nexport const createScrollOffsetHooks = (makeMutable: MakeMutable) => {\n  const useScrollOffset = (\n    animatedRef: ScrollableRef,\n    // Upstream's second argument: write into the caller's shared value\n    // instead of minting one, so two hooks can share an offset.\n    providedOffset?: SharedValue<number>,\n  ): SharedValue<number> => {\n    // useState rather than a lazily-filled ref for the reason `useSharedValue`\n    // reaches for it: this value IS the return value, so a ref would be a\n    // render-time read.\n    const [internal] = useState(() => makeMutable(0))\n    const offset = providedOffset ?? internal\n\n    // The widget currently subscribed to, so a re-render that resolved to the\n    // same one reconnects nothing.\n    const attached = useRef<Gtk.ScrolledWindow | null>(null)\n    const detach = useRef<(() => void) | null>(null)\n\n    // No dependency array on purpose. A ref is attached by React AFTER the\n    // render that created it, so the first run of this effect commonly\n    // resolves to nothing and the second one — a commit later, with the list\n    // mounted — is the one that finds the scroller. Upstream solves the same\n    // problem with `animatedRef.observe`; re-resolving per commit is the same\n    // answer without a second observer protocol, and it is one WeakMap lookup\n    // when the answer has not changed.\n    useEffect(() => {\n      const widget = scrolledWindowOf(animatedRef)\n      if (widget === attached.current) {\n        return\n      }\n      detach.current?.()\n      detach.current = null\n      attached.current = widget\n      if (!widget) {\n        if (instanceOf(animatedRef) !== null) {\n          warnOnce(\n            \"useScrollOffset\",\n            \"useScrollOffset was given a ref that is not on a scrollable, so the \" +\n              \"offset will stay at 0. Pass the ref to a ScrollView, FlatList or \" +\n              \"Animated.ScrollView.\",\n          )\n        }\n        return\n      }\n\n      const hadjustment = widget.getHadjustment()\n      const vadjustment = widget.getVadjustment()\n      const update = (): void => {\n        // Upstream's own rule, mirrored exactly: the horizontal offset when\n        // there is one, the vertical otherwise. One shared value cannot carry\n        // two axes, and this is the choice every consumer is written against.\n        const x = hadjustment.getValue()\n        offset.value = x === 0 ? vadjustment.getValue() : x\n      }\n      update()\n      hadjustment.on(\"value-changed\", update)\n      vadjustment.on(\"value-changed\", update)\n      detach.current = () => {\n        hadjustment.off(\"value-changed\", update)\n        vadjustment.off(\"value-changed\", update)\n      }\n    })\n\n    useEffect(\n      () => () => {\n        detach.current?.()\n        detach.current = null\n        attached.current = null\n      },\n      [],\n    )\n\n    return offset\n  }\n\n  return {\n    useScrollOffset,\n    /** Upstream's own deprecated alias, kept so library call sites are unchanged. */\n    useScrollViewOffset: useScrollOffset,\n  }\n}\n"]}

package/dist/reanimated-compat/style.d.ts

@@ -0,0 +1,90 @@
+export type StyleValue = number | string;
+export type StyleObject = Record<string, unknown>;
+/** The animated node a style leaf is replaced with. */
+export type StyleNode = {
+    addListener(callback: (state: {
+        value: StyleValue;
+    }) => void): string;
+    removeListener(id: string): void;
+    __getValue(): StyleValue;
+    /** @internal Publishes a new value to the view layer. */
+    __push(value: StyleValue): void;
+};
+/**
+ * @internal Shared with `props.ts`: `useAnimatedProps` publishes through the
+ * exact same node the style path does, because the receivers duck-type it the
+ * same way (`addListener` + `__getValue`).
+ */
+export declare const createStyleNode: (initial: StyleValue) => StyleNode;
+/** @internal Test seam: the warning is once per session by design. */
+export declare const resetUndriveableWarnings: () => void;
+/**
+ * Whether a property that finishes an animation has to be published through a
+ * React render to land at all.
+ *
+ * Every warning on the layout path ends with "the new value is applied on the
+ * next React render", and until now that was true only by luck: a value that
+ * moves solely inside a `useAnimatedStyle` produces no render, so the last
+ * frame of the animation was the last place it existed. `@gorhom/bottom-sheet`
+ * is exactly that case — it bounds its scrollable with an animated `height`
+ * and nothing else re-renders — and `spike/core-exports` is what found it.
+ *
+ * Layout properties only. `opacity`, `transform` and colours are written to
+ * the widget on the frame they change, so a render at the end would be a
+ * render for nothing; a `width`/`height` the driven-size rule ACCEPTS is on
+ * screen at the right size already, and the render is what puts the same value
+ * into Yoga so the committed layout and the override agree.
+ *
+ * At the end of the animation AND on a cadence while it runs, which is the
+ * correction §10 made to §9: the settle alone kept the promise only when the
+ * animation was short and never when its target moved every frame, and
+ * gorhom's sheet was blank for 1.38 s because of it. Ten renders a second at
+ * the very most, against sixty frames — still the whole difference between
+ * this and the naive layout write the refusal is about
+ * (docs/research/animated-size.md §3, and LANDING_INTERVAL_MS in
+ * ./updater-animations.ts for the numbers).
+ */
+export declare const settlesThroughReact: (property: string) => boolean;
+export type AnimatedStyle = {
+    /**
+     * The object handed to `Animated.View`. Stable while an animation runs — a
+     * driven frame is a write into a node, not a new style — and replaced by a
+     * shallow copy exactly once per `renew()`, which is how a value that cannot
+     * be driven reaches the view layer at all.
+     */
+    readonly style: StyleObject;
+    /** The nodes behind it, reusable when the style has to be rebuilt. */
+    readonly nodes: ReadonlyMap<string, StyleNode>;
+    /**
+     * Publishes a fresh updater result. Returns false when the SHAPE changed
+     * (a transform entry appeared, vanished or swapped kind) and the caller
+     * must rebuild — the node set no longer matches, and the bindings in the
+     * view layer were made against the old one.
+     */
+    apply(next: StyleObject): boolean;
+    /**
+     * Gives the style a new identity, so a render that follows actually reaches
+     * the view.
+     *
+     * A stable object was the right default and it is still what a running
+     * animation gets, but it is not enough on its own: `@gorhom/bottom-sheet`
+     * wraps the view this style lands on in `memo`, and a re-render of the
+     * component that OWNS the `useAnimatedStyle` stops at that boundary with
+     * every prop identical. The value then exists in the style and never reaches
+     * Yoga — measured, `spike/core-exports`: the sheet's content mask stayed at
+     * the height of the animation's first frame while the animation itself ran
+     * to 543 px.
+     *
+     * Called for a property the platform will not drive at frame rate when its
+     * animation settles, and at most ten times a second while it runs — never
+     * per frame. See LANDING_INTERVAL_MS in ./updater-animations.ts for why the
+     * settle on its own was not enough.
+     */
+    renew(): void;
+};
+/**
+ * Builds the node-backed style. `reuse` carries nodes over from a previous
+ * build so a shape change keeps the identity of the leaves that survived it,
+ * which is what stops the view layer re-binding the parts that did not move.
+ */
+export declare const createAnimatedStyle: (source: StyleObject, reuse?: ReadonlyMap<string, StyleNode>) => AnimatedStyle;

package/dist/reanimated-compat/style.js

@@ -0,0 +1,452 @@
+// Turning a `useAnimatedStyle` updater's plain object into a style the view
+// layer can drive without React.
+//
+// The mapper returns ordinary values every frame. On the first run each
+// animatable leaf is replaced by a small animated NODE and the mapping is
+// remembered; later runs only push new values into those nodes, so a running
+// animation costs zero React renders. `src/components/animated.tsx`
+// recognises those nodes structurally and writes them straight to GTK —
+// `widget.setOpacity` for opacity, the rect store plus `queueAllocate` for
+// transforms, and a CSS provider private to the widget for colours.
+//
+// WHERE THE BOUNDARY IS NOW. Opacity, transforms and colours are driven
+// unconditionally. `flex`, every `margin*`/`padding*`, `gap`, `flexBasis` and
+// the `min*`/`max*` family are refused, and that is a refusal on measured
+// grounds rather than a gap waiting to be filled: a layout write has to go
+// through Yoga, and a pass plus its commit walk costs what the CONTAINER
+// costs, not what the animated value costs — 52 µs for a five-child
+// container, 133 µs at sixty, 496 µs at three hundred, per frame. The same
+// frame's transform write is 1.5 µs and does not grow at all.
+//
+// It is a cost argument and ONLY a cost argument, which is narrower than this
+// comment used to claim. docs/research/animated-size.md re-measured the two
+// other things that were said here: GTK re-measuring the ancestors after the
+// resize adds nothing at any tree size, and a size write cannot move the
+// window — the RN root reports a zero size request, so the toplevel never
+// re-negotiates. (An `IntrinsicRoot` mounted directly in GTK chrome is the one
+// exception, and it does change the window's request.)
+//
+// TWO CARVE-OUTS, and neither is a softening of that.
+//
+//  - `top`/`left`/`right`/`bottom` on a node whose OWN `position` is
+//    `"absolute"`, because an out-of-flow node's inset has an exact transform
+//    equivalent: moving it changes nothing but where it is drawn, which is
+//    what the transform path already does, so no Yoga pass is needed at all —
+//    src/style/absolute-insets.ts, docs/research/absolute-insets.md.
+//  - `width`/`height` where the change is CONFINED to the node that owns it.
+//    There is no transform that reproduces a size change (a scale grows about
+//    the centre and stretches the content instead of re-laying it out —
+//    measured), so this one really does run Yoga; it just runs it rooted at
+//    the animated node rather than at the tree's root, which is 6.6 µs for a
+//    leaf and 23 µs with wrapped text, IDENTICAL at 5, 60 and 300 siblings —
+//    src/style/animated-size.ts, docs/research/animated-size.md.
+//
+// Both rules are measured, neither is universal, and the configurations where
+// they fail are refused as loudly as `flex` is.
+//
+// The rule for everything undriveable stays what it was: it must be VISIBLE.
+// A property that changes between mapper runs but cannot be driven says so
+// once, by name — and layout properties say it in their own words, because
+// "use translateX instead of left" is advice and "cannot be written" is not.
+import { INSET_PROPERTIES, insetRefusalReason, insetTranslation, } from "../style/absolute-insets";
+import { SIZE_PROPERTIES } from "../style/animated-size";
+import { DRIVEABLE_COLOR_PROPERTIES } from "../style/imperative-css";
+/**
+ * @internal Shared with `props.ts`: `useAnimatedProps` publishes through the
+ * exact same node the style path does, because the receivers duck-type it the
+ * same way (`addListener` + `__getValue`).
+ */
+export const createStyleNode = (initial) => {
+    let current = initial;
+    const listeners = new Map();
+    let nextListenerId = 1;
+    return {
+        addListener(callback) {
+            const id = String(nextListenerId++);
+            listeners.set(id, callback);
+            return id;
+        },
+        removeListener(id) {
+            listeners.delete(id);
+        },
+        __getValue() {
+            return current;
+        },
+        __push(value) {
+            if (Object.is(value, current)) {
+                return;
+            }
+            current = value;
+            for (const listener of [...listeners.values()]) {
+                listener({ value: current });
+            }
+        },
+    };
+};
+const isStyleValue = (value) => typeof value === "number" || typeof value === "string";
+const OPACITY = "opacity";
+const Z_INDEX = "zIndex";
+const transformLeafKey = (index, part) => `transform.${index}.${part}`;
+const isInsetProperty = (property) => INSET_PROPERTIES.includes(property);
+const isSizeProperty = (property) => SIZE_PROPERTIES.includes(property);
+/**
+ * Whether this style's `property` is one of the insets that becomes a
+ * transform. A number is required rather than merely a `DimensionValue`: a
+ * percentage has no fixed offset from a point base, and switching to one
+ * mid-animation changes the leaf signature, which rebuilds the style and puts
+ * the property back on the refusal path where it belongs.
+ *
+ * The updater's object is not the whole style. `style={[styles.row, animated]}`
+ * is how most people write this, so `position` and the opposite edge are very
+ * often in a SIBLING entry that this module never sees. When the updater says
+ * nothing about `position`, the question is simply not answerable here and the
+ * leaf is made optimistically — the view layer re-asks it against the
+ * FLATTENED style, which is the only place the true answer exists, and warns
+ * there if the answer is no (components/animated.tsx). Nothing becomes silent
+ * either way; only which channel says it moves.
+ */
+const isDriveableInset = (source, property) => {
+    if (!isInsetProperty(property) || typeof source[property] !== "number") {
+        return false;
+    }
+    return source.position === undefined
+        ? true
+        : insetTranslation(source, property) !== null;
+};
+// RN's layout properties, as `STYLE_PROPERTIES_CONFIG` enumerates them.
+// Enumerated by hand rather than derived by subtracting the driveable set,
+// because the point of the list is to produce a DIFFERENT message: these are
+// refused for a measured reason and have a real alternative, which
+// `borderStyle` does not.
+const LAYOUT_PROPERTIES = new Set([
+    "aspectRatio",
+    "borderBottomWidth",
+    "borderEndWidth",
+    "borderLeftWidth",
+    "borderRightWidth",
+    "borderStartWidth",
+    "borderTopWidth",
+    "borderWidth",
+    "bottom",
+    "columnGap",
+    "end",
+    "flex",
+    "flexBasis",
+    "flexGrow",
+    "flexShrink",
+    "gap",
+    "height",
+    "left",
+    "margin",
+    "marginBottom",
+    "marginEnd",
+    "marginHorizontal",
+    "marginLeft",
+    "marginRight",
+    "marginStart",
+    "marginTop",
+    "marginVertical",
+    "maxHeight",
+    "maxWidth",
+    "minHeight",
+    "minWidth",
+    "padding",
+    "paddingBottom",
+    "paddingEnd",
+    "paddingHorizontal",
+    "paddingLeft",
+    "paddingRight",
+    "paddingStart",
+    "paddingTop",
+    "paddingVertical",
+    "right",
+    "rowGap",
+    "start",
+    "top",
+    "width",
+]);
+// Which transform to reach for instead, in the two kinds it comes in. The
+// distinction is not pedantry — `scaleX` was named as the replacement for
+// `width` here and it is not one, which docs/research/animated-size.md §6
+// measured on a 100×60 box widened to 260:
+//
+//   - a scale grows about the view's CENTRE, so the box MOVES: x went 500 →
+//     420, where the width change kept it at 500;
+//   - a scale scales the CONTENT with the box instead of re-laying it out: the
+//     label inside kept its three-line, 45 px-tall layout and was drawn 2.6×
+//     wide — stretched glyphs — where the width change re-wrapped it to one
+//     line, 15 px tall.
+//
+// So an inset really does have a transform that reproduces it, and a size does
+// not. Offering `scaleX` as if it did sends people to a different behaviour
+// with the same name on it — which is also why a numeric `width`/`height` is
+// driven for real now and only reaches this table as a PERCENTAGE, where
+// there is no point base to lay out at.
+const EXACT_ALTERNATIVE = {
+    bottom: "translateY",
+    end: "translateX",
+    left: "translateX",
+    right: "translateX",
+    start: "translateX",
+    top: "translateY",
+};
+const APPROXIMATE_ALTERNATIVE = {
+    height: "scaleY",
+    width: "scaleX",
+};
+// One warning per property name per session, matching the platform's
+// warnNativeDriverIgnored policy: a 60 Hz mapper must not produce 60 lines a
+// second, and the name is the actionable part.
+const warned = new Set();
+const warnUndriveable = (property, source) => {
+    if (warned.has(property)) {
+        return;
+    }
+    warned.add(property);
+    const isProduction = typeof process !== "undefined" && process.env.NODE_ENV === "production";
+    if (isProduction) {
+        return;
+    }
+    const insetReason = isInsetProperty(property)
+        ? insetRefusalReason(source, property)
+        : null;
+    if (insetReason) {
+        console.warn(`react-native-reanimated: useAnimatedStyle changed \`${property}\`. This node IS absolutely ` +
+            `positioned — which is normally driven at frame rate here — but ${insetReason}, so no ` +
+            "translation reproduces it and it would need a Yoga pass. Give the axis a single edge (or a " +
+            `definite size) and \`${property}\` animates; otherwise animate ` +
+            `\`transform: [{ ${EXACT_ALTERNATIVE[property]}: … }]\`. The new value is applied on the next ` +
+            "React render. See docs/api.md.");
+        return;
+    }
+    if (LAYOUT_PROPERTIES.has(property)) {
+        const exact = EXACT_ALTERNATIVE[property];
+        const approximate = APPROXIMATE_ALTERNATIVE[property];
+        console.warn(`react-native-reanimated: useAnimatedStyle changed \`${property}\`, a LAYOUT property. ` +
+            "react-native-gtkx does not drive layout at frame rate on purpose: a layout write costs a Yoga " +
+            "pass over the container plus the commit walk that follows it, and that cost grows with the " +
+            "CONTAINER rather than with the number of animated values — measured at 52 µs for a five-child " +
+            "container and 496 µs at three hundred, against a transform's 1.5 µs. " +
+            (exact
+                ? `Animate \`transform: [{ ${exact}: … }]\` instead — it reproduces the move exactly, it is ` +
+                    "paint-only, it costs the same at any tree size, and it is what RN's own native driver " +
+                    "restricts you to. "
+                : approximate
+                    ? `The closest transform is \`transform: [{ ${approximate}: … }]\`, but it is NOT the same ` +
+                        "thing and it is worth knowing how: a scale grows about the view's CENTRE, so the box " +
+                        "moves as it grows, and it scales the CONTENT with the box instead of re-laying it out — " +
+                        "text stretches rather than re-wrapping. Reach for it when the content can take being " +
+                        "stretched (a plain box, an image), not as a replacement. "
+                    : "Transforms are paint-only and cost the same at any tree size. ") +
+            (isInsetProperty(property)
+                ? `(\`${property}\` IS driven at frame rate on a node whose own \`position\` is "absolute", ` +
+                    "where moving it is exactly a translation and touches no sibling.) "
+                : isSizeProperty(property)
+                    ? `(A NUMERIC \`${property}\` IS driven at frame rate where the change is confined to the node ` +
+                        "that owns it. This one is a percentage, which has no point base to re-lay the subtree out " +
+                        "at.) "
+                    : "") +
+            "The new value is applied on the next React render. See docs/api.md.");
+        return;
+    }
+    console.warn(`react-native-reanimated: useAnimatedStyle changed \`${property}\`, which react-native-gtkx cannot ` +
+        "write to a mounted widget without a React render. `opacity`, `transform` and colours animate at " +
+        "frame rate here; the new value is applied on the next render instead. See docs/api.md.");
+};
+/** @internal Test seam: the warning is once per session by design. */
+export const resetUndriveableWarnings = () => {
+    warned.clear();
+};
+/**
+ * Whether a property that finishes an animation has to be published through a
+ * React render to land at all.
+ *
+ * Every warning on the layout path ends with "the new value is applied on the
+ * next React render", and until now that was true only by luck: a value that
+ * moves solely inside a `useAnimatedStyle` produces no render, so the last
+ * frame of the animation was the last place it existed. `@gorhom/bottom-sheet`
+ * is exactly that case — it bounds its scrollable with an animated `height`
+ * and nothing else re-renders — and `spike/core-exports` is what found it.
+ *
+ * Layout properties only. `opacity`, `transform` and colours are written to
+ * the widget on the frame they change, so a render at the end would be a
+ * render for nothing; a `width`/`height` the driven-size rule ACCEPTS is on
+ * screen at the right size already, and the render is what puts the same value
+ * into Yoga so the committed layout and the override agree.
+ *
+ * At the end of the animation AND on a cadence while it runs, which is the
+ * correction §10 made to §9: the settle alone kept the promise only when the
+ * animation was short and never when its target moved every frame, and
+ * gorhom's sheet was blank for 1.38 s because of it. Ten renders a second at
+ * the very most, against sixty frames — still the whole difference between
+ * this and the naive layout write the refusal is about
+ * (docs/research/animated-size.md §3, and LANDING_INTERVAL_MS in
+ * ./updater-animations.ts for the numbers).
+ */
+export const settlesThroughReact = (property) => LAYOUT_PROPERTIES.has(property);
+/**
+ * Collects the animatable leaves of a style, in the order the view layer
+ * composes them (the transform array's order IS the composition order in RN).
+ */
+const leavesOf = (source) => {
+    const leaves = [];
+    if (typeof source[OPACITY] === "number") {
+        leaves.push({ key: OPACITY, value: source[OPACITY] });
+    }
+    // Driven for real, and by the same kind of write opacity uses: the paint
+    // and pick order of the container (gtkx/bridge/view-box.ts). It has to be
+    // driveable rather than merely accepted — `useSortable` puts it in the
+    // style object on every frame, so a refusal here is a refusal of the whole
+    // sortable-list shape.
+    if (typeof source[Z_INDEX] === "number") {
+        leaves.push({ key: Z_INDEX, value: source[Z_INDEX] });
+    }
+    for (const property of DRIVEABLE_COLOR_PROPERTIES) {
+        const value = source[property];
+        // Strings only. A colour is a string on this platform (RN's packed
+        // integers never reach a GTK stylesheet), so a number here is not a
+        // colour we can drive and belongs on the warn path with everything else.
+        if (typeof value === "string") {
+            leaves.push({ key: property, value });
+        }
+    }
+    for (const property of INSET_PROPERTIES) {
+        if (isDriveableInset(source, property)) {
+            leaves.push({ key: property, value: source[property] });
+        }
+    }
+    // Sizes: a number is the whole of what can be decided HERE. Whether the
+    // change is confined to the node depends on the container's
+    // `flexDirection`, its `alignItems` and where its own size comes from —
+    // none of which is in the updater's object, and none of which is even in
+    // the animated component's props. So the leaf is made optimistically and
+    // the view layer, which has the layout tree, answers and warns
+    // (src/style/animated-size.ts, components/animated.tsx). A percentage stays
+    // on the refusal path: it has no point base to lay out at, and switching to
+    // one mid-animation changes the leaf signature, which rebuilds the style.
+    for (const property of SIZE_PROPERTIES) {
+        if (typeof source[property] === "number") {
+            leaves.push({ key: property, value: source[property] });
+        }
+    }
+    if (Array.isArray(source.transform)) {
+        source.transform.forEach((entry, index) => {
+            if (typeof entry !== "object" || entry === null) {
+                return;
+            }
+            const part = Object.keys(entry)[0];
+            if (part === undefined) {
+                return;
+            }
+            const value = entry[part];
+            if (isStyleValue(value)) {
+                leaves.push({ key: transformLeafKey(index, part), value });
+            }
+        });
+    }
+    return leaves;
+};
+const signatureOf = (leaves) => leaves.map((leaf) => leaf.key).join("|");
+/**
+ * Builds the node-backed style. `reuse` carries nodes over from a previous
+ * build so a shape change keeps the identity of the leaves that survived it,
+ * which is what stops the view layer re-binding the parts that did not move.
+ */
+export const createAnimatedStyle = (source, reuse) => {
+    const leaves = leavesOf(source);
+    const signature = signatureOf(leaves);
+    const nodes = new Map();
+    for (const leaf of leaves) {
+        const existing = reuse?.get(leaf.key);
+        if (existing) {
+            existing.__push(leaf.value);
+            nodes.set(leaf.key, existing);
+        }
+        else {
+            nodes.set(leaf.key, createStyleNode(leaf.value));
+        }
+    }
+    // Reassigned by `renew()` only. Every other write below — the node
+    // substitutions here, and `apply`'s update of a value it cannot drive — goes
+    // INTO the object currently published, so a renewed copy carries the latest
+    // of everything rather than a snapshot taken when it was made.
+    let style = { ...source };
+    const opacityNode = nodes.get(OPACITY);
+    if (opacityNode) {
+        style[OPACITY] = opacityNode;
+    }
+    const zIndexNode = nodes.get(Z_INDEX);
+    if (zIndexNode) {
+        style[Z_INDEX] = zIndexNode;
+    }
+    for (const property of DRIVEABLE_COLOR_PROPERTIES) {
+        const colorNode = nodes.get(property);
+        if (colorNode) {
+            style[property] = colorNode;
+        }
+    }
+    // The view layer duck-types these exactly as it does opacity and colours,
+    // and turns each into a translate measured from the position Yoga committed
+    // (components/animated.tsx, splitAnimated).
+    for (const property of INSET_PROPERTIES) {
+        const insetNode = nodes.get(property);
+        if (insetNode) {
+            style[property] = insetNode;
+        }
+    }
+    for (const property of SIZE_PROPERTIES) {
+        const sizeNode = nodes.get(property);
+        if (sizeNode) {
+            style[property] = sizeNode;
+        }
+    }
+    if (Array.isArray(source.transform)) {
+        style.transform = source.transform.map((entry, index) => {
+            if (typeof entry !== "object" || entry === null) {
+                return entry;
+            }
+            const part = Object.keys(entry)[0];
+            if (part === undefined) {
+                return entry;
+            }
+            const node = nodes.get(transformLeafKey(index, part));
+            return node ? { [part]: node } : entry;
+        });
+    }
+    // The last values seen for everything that is NOT node-backed, so a change
+    // can be reported rather than silently dropped.
+    let staticSnapshot = source;
+    return {
+        get style() {
+            return style;
+        },
+        nodes,
+        renew() {
+            style = { ...style };
+        },
+        apply(next) {
+            const nextLeaves = leavesOf(next);
+            if (signatureOf(nextLeaves) !== signature) {
+                return false;
+            }
+            for (const leaf of nextLeaves) {
+                nodes.get(leaf.key)?.__push(leaf.value);
+            }
+            for (const key of Object.keys(next)) {
+                if (key === OPACITY || key === "transform" || nodes.has(key)) {
+                    continue;
+                }
+                if (!Object.is(next[key], staticSnapshot[key])) {
+                    warnUndriveable(key, next);
+                    // Kept up to date anyway: the next React render — whenever it
+                    // happens, for whatever reason — then applies the current value
+                    // rather than the one from mount.
+                    style[key] = next[key];
+                }
+            }
+            staticSnapshot = next;
+            return true;
+        },
+    };
+};
+//# sourceMappingURL=style.js.map