morphicons 1.7.0 → 1.7.1

package/README.md

@@ -141,7 +141,7 @@ ref.current?.morphTo(Check); // animates
 ref.current?.set(X);         // jumps without animating
 ```
 
-The DOM-free core beyond the browser: the dom driver is reused verbatim as the engine (React Native has a global `requestAnimationFrame`, and `PathEl` is structural), so the whole platform difference is a shim that forwards the per-frame `d` write to `Path.setNativeProps` of react-native-svg — outside the React render, exactly like the web mutation. Same surface as the React binding (`size`, `strokeWidth`, `absoluteStrokeWidth`, `color`, plus the native `Svg` props: `testID`, touch handlers…), same accessibility defaults (`aria-hidden` unless you pass `label` → `role="img"` + `aria-label`). With `reducedMotion="user"`, the OS setting comes from `AccessibilityInfo` (best-effort: the query is async; a `reduceMotionChanged` subscription keeps it exact from then on). Requires Metro with package `exports` resolution — default since React Native 0.79; on older versions enable `unstable_enablePackageExports`.
+The DOM-free core beyond the browser: the dom driver is reused verbatim as the engine (React Native has a global `requestAnimationFrame`, and `PathEl` is structural), so the whole platform difference is a shim that forwards the per-frame `d` write to `Path.setNativeProps` of react-native-svg — outside the React render, exactly like the web mutation. On the New Architecture that write is not the last word, because every Fabric commit rebuilds the native path from the props React declares: the binding therefore publishes the driver's live `d` on each render, and re-applies it in a layout effect when a frame landed in between, so an unrelated re-render (a color or selection change, at rest or mid-flight) can no longer restore the icon the component mounted with. Same surface as the React binding (`size`, `strokeWidth`, `absoluteStrokeWidth`, `color`, plus the native `Svg` props: `testID`, touch handlers…), same accessibility defaults (`aria-hidden` unless you pass `label` → `role="img"` + `aria-label`). With `reducedMotion="user"`, the OS setting comes from `AccessibilityInfo` (best-effort: the query is async; a `reduceMotionChanged` subscription keeps it exact from then on). Requires Metro with package `exports` resolution — default since React Native 0.79; on older versions enable `unstable_enablePackageExports`.
 
 ### Astro — same three modes, zero framework runtime
 

package/dist/react-native.js

@@ -5,8 +5,10 @@ import { forwardRef, useCallback, useEffect, useImperativeHandle, useLayoutEffec
 import { jsx } from "react/jsx-runtime";
 import { AccessibilityInfo } from "react-native";
 import Svg, { Path } from "react-native-svg";
+//#region src/react-native/iso-layout-effect.ts
+const useIsoLayoutEffect = typeof window === "undefined" ? useEffect : useLayoutEffect;
+//#endregion
 //#region src/react-native/index.tsx
-const useIsoLayoutEffect = typeof document === "undefined" ? useEffect : useLayoutEffect;
 let reduced = false;
 let rmInit = false;
 function initReducedMotion() {
@@ -39,6 +41,8 @@ const MorphIcon = forwardRef(function MorphIcon(props, ref) {
 		if (controlled) return frozenD(from, to, progress ?? 0);
 		return initialIcon !== void 0 ? canonicalD(initialIcon) : "";
 	});
+	const liveD = useRef(initialD);
+	const declaredD = liveD.current;
 	const pathRef = useRef(null);
 	const morphRef = useRef(null);
 	const springRef = useRef(spring);
@@ -53,7 +57,9 @@ const MorphIcon = forwardRef(function MorphIcon(props, ref) {
 	/** The PathEl shim: createMorph only ever writes `d`, and Path forwards
 	*  it to the native view without re-rendering. Stable identity. */
 	const el = useRef({ setAttribute: (name, value) => {
-		if (name === "d") pathRef.current?.setNativeProps({ d: value });
+		if (name !== "d") return;
+		liveD.current = value;
+		pathRef.current?.setNativeProps({ d: value });
 	} });
 	/** morphTo that applies the reduced-motion policy ("user" reads the OS
 	*  setting via AccessibilityInfo, best-effort). */
@@ -99,6 +105,9 @@ const MorphIcon = forwardRef(function MorphIcon(props, ref) {
 			pair.current = null;
 		};
 	}, []);
+	useIsoLayoutEffect(() => {
+		if (liveD.current !== declaredD) pathRef.current?.setNativeProps({ d: liveD.current });
+	});
 	useEffect(() => {
 		if (reducedMotion === "user") initReducedMotion();
 	}, [reducedMotion]);
@@ -180,7 +189,7 @@ const MorphIcon = forwardRef(function MorphIcon(props, ref) {
 		...rest,
 		children: /* @__PURE__ */ jsx(Path, {
 			ref: pathRef,
-			d: initialD
+			d: declaredD
 		})
 	});
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "morphicons",
-  "version": "1.7.0",
+  "version": "1.7.1",
   "description": "Universal morphing for stroke-based icons with spring physics — zero runtime dependencies",
   "license": "MIT",
   "author": "Guillermo (https://guillermolg.com)",