unframer 2.25.3 → 2.25.4

package/src/framer.js

@@ -11104,7 +11104,7 @@ function stagger(duration = 0.1, {
   };
 }
 
-// /:https://app.framerstatic.com/framer.ZDVTUSJ2.mjs
+// /:https://app.framerstatic.com/framer.4LIH3HZD.mjs
 import { lazy as ReactLazy, } from 'react';
 import React4 from 'react';
 import { startTransition as startTransition2, } from 'react';
@@ -12816,6 +12816,7 @@ async function replacePathVariables(path, currentLocale, nextLocale, defaultLoca
     hasMatch = true;
   }
   if (hasMatch) {
+    replacedPath += resultPath.substring(lastIndex,);
     resultPath = replacedPath;
   }
   return {
@@ -13909,20 +13910,6 @@ function TurnOnReactEventHandling() {
   }, [],);
   return null;
 }
-var hydrationRunning = false;
-function setInitialHydrationState() {
-  hydrationRunning = true;
-}
-function setHydrationDone() {
-  hydrationRunning = false;
-}
-function useIsHydrationOrSSR() {
-  const isHydrationOrSSR = useRef3(!isWindow || hydrationRunning,);
-  useEffect(() => {
-    isHydrationOrSSR.current = false;
-  }, [],);
-  return isHydrationOrSSR;
-}
 function onlyRunOnce(originalMethod,) {
   let hasRun = false;
   return function (...args) {
@@ -24322,6 +24309,24 @@ function MagicMotionCrossfadeRoot(props,) {
     children: props.children,
   },);
 }
+function useMemoOne(factory, inputs,) {
+  const initial = useState(() => ({
+    inputs,
+    result: factory(),
+  }))[0];
+  const isFirstRun = useRef3(true,);
+  const committed = useRef3(initial,);
+  const useCache = isFirstRun.current || Boolean(inputs && committed.current.inputs && isEqual(inputs, committed.current.inputs, false,),);
+  const cache2 = useCache ? committed.current : {
+    inputs,
+    result: factory(),
+  };
+  useEffect(() => {
+    isFirstRun.current = false;
+    committed.current = cache2;
+  }, [cache2,],);
+  return cache2.result;
+}
 function setRef(ref, value,) {
   if (isFunction(ref,)) {
     ref(value,);
@@ -24387,7 +24392,7 @@ function useRefEffect(ref, effect, deps,) {
   var _a;
   const effectRef = useRef3();
   const depsChangedRef = useRef3();
-  useMemo2(() => {
+  useMemoOne(() => {
     if (depsChangedRef.current !== void 0) depsChangedRef.current = true;
   }, deps ?? [{},],);
   if (!ref) return;
@@ -31390,17 +31395,15 @@ function propsForBreakpoint(variant, props, overrides,) {
     ...overrides[variant],
   };
 }
-var PropertyOverridesWithoutCSS = /* @__PURE__ */ React4.forwardRef(function PropertyOverrides({
-  breakpoint,
-  overrides,
-  children,
-  ...props
-}, ref,) {
+var noopSubscribe = () => () => {};
+var returnTrue = () => true;
+var returnFalse = () => false;
+var PropertyOverridesWithoutCSS = /* @__PURE__ */ React4.forwardRef(function PropertyOverrides(props, ref,) {
   const cloneWithRefs = useCloneChildrenWithPropsAndRef(ref,);
   const ancestorCtx = React4.useContext(SSRParentVariantsContext,);
-  const isHydrationOrSSR = useIsHydrationOrSSR();
+  const isHydrationOrSSR = React4.useSyncExternalStore(noopSubscribe, returnFalse, returnTrue,);
   const action = useConstant2(() => {
-    if (isHydrationOrSSR.current) {
+    if (isHydrationOrSSR) {
       if (isBrowser2()) {
         return 1;
       } else {
@@ -31411,50 +31414,58 @@ var PropertyOverridesWithoutCSS = /* @__PURE__ */ React4.forwardRef(function Pro
     }
   },);
   const generatedComponentContext = React4.useContext(GeneratedComponentContext,);
-  if (!generatedComponentContext) {
-    console.warn('PropertyOverrides is missing GeneratedComponentContext',);
-    return cloneWithRefs(children, props,);
-  }
-  const {
-    primaryVariantId,
-    variantClassNames,
-  } = generatedComponentContext;
-  const parentVariants = (ancestorCtx == null ? void 0 : ancestorCtx.primaryVariantId) === primaryVariantId
-    ? ancestorCtx == null ? void 0 : ancestorCtx.variants
-    : void 0;
-  switch (action) {
-    case 0:
-      return cloneWithRefs(children, propsForBreakpoint(breakpoint, props, overrides,),);
-    case 1:
-      return renderBranchedChildrenFromPropertyOverrides(
-        overrides,
-        children,
-        props,
-        variantClassNames,
-        primaryVariantId,
-        parentVariants,
-        cloneWithRefs,
-        breakpoint,
-        // only render the single, active branch
-      );
-    case 2:
-      return renderBranchedChildrenFromPropertyOverrides(
-        overrides,
-        children,
-        props,
-        variantClassNames,
-        primaryVariantId,
-        parentVariants,
-        // On the server, we use plain cloneChildrenWithProps instead of useCloneChildrenWithPropsAndRef,
-        // because we can't clone one ref to multiple branched-out elements (useCloneChildrenWithPropsAndRef
-        // even guards against it), but luckily, refs mean nothing on the server anyway.
-        cloneChildrenWithProps,
-        void 0,
-        // render all branches
-      );
-    default:
-      assertNever(action,);
-  }
+  return useMemoOne(() => {
+    const {
+      breakpoint,
+      overrides,
+      children,
+      ...restProps
+    } = props;
+    if (!generatedComponentContext) {
+      console.warn('PropertyOverrides is missing GeneratedComponentContext',);
+      return cloneWithRefs(children, restProps,);
+    }
+    const {
+      primaryVariantId,
+      variantClassNames,
+    } = generatedComponentContext;
+    const parentVariants = (ancestorCtx == null ? void 0 : ancestorCtx.primaryVariantId) === primaryVariantId
+      ? ancestorCtx == null ? void 0 : ancestorCtx.variants
+      : void 0;
+    switch (action) {
+      case 0:
+        return cloneWithRefs(children, propsForBreakpoint(breakpoint, restProps, overrides,),);
+      case 1:
+        return renderBranchedChildrenFromPropertyOverrides(
+          overrides,
+          children,
+          restProps,
+          variantClassNames,
+          primaryVariantId,
+          parentVariants,
+          cloneWithRefs,
+          breakpoint,
+          // only render the single, active branch
+        );
+      case 2:
+        return renderBranchedChildrenFromPropertyOverrides(
+          overrides,
+          children,
+          restProps,
+          variantClassNames,
+          primaryVariantId,
+          parentVariants,
+          // On the server, we use plain cloneChildrenWithProps instead of useCloneChildrenWithPropsAndRef,
+          // because we can't clone one ref to multiple branched-out elements (useCloneChildrenWithPropsAndRef
+          // even guards against it), but luckily, refs mean nothing on the server anyway.
+          cloneChildrenWithProps,
+          void 0,
+          // render all branches
+        );
+      default:
+        assertNever(action,);
+    }
+  }, [generatedComponentContext, ancestorCtx, cloneWithRefs, props,],);
 },);
 var PropertyOverrides2 =
   /* @__PURE__ */ (() => withCSS(PropertyOverridesWithoutCSS, `.${SSRVariantClassName} { display: contents }`, 'PropertyOverrides',))();
@@ -35582,7 +35593,6 @@ function useNavigationTransition() {
   const navigationController = useRef3(void 0,);
   return useCallback(async (transitionFn, nextRender, updateURL, isAbortable = true,) => {
     var _a, _b;
-    setHydrationDone();
     const hasUpdateURL = updateURL !== void 0;
     (_a = navigationController.current) == null ? void 0 : _a.abort();
     const controller = isAbortable ? new AbortController() : void 0;
@@ -46884,16 +46894,33 @@ var SharedSVGManager = class {
    *
    * VECTOR @TODO - Unsubscribe from vector set items.
    */
-  template(id3, svg,) {
-    const entry = this.vectorSetItems.get(id3,);
-    if (entry) return `#${entry.id}`;
-    this.vectorSetItems.set(id3, {
-      id: id3,
+  template(revision, svg,) {
+    const entry = this.vectorSetItems.get(revision,);
+    if (entry) return `#${revision}`;
+    this.vectorSetItems.set(revision, {
       svg,
+      count: 0,
     },);
-    if (!useDOM) return `#${id3}`;
-    this.maybeAppendTemplate(id3, svg,);
-    return `#${id3}`;
+    if (!useDOM) return `#${revision}`;
+    this.maybeAppendTemplate(revision, svg,);
+    return `#${revision}`;
+  }
+  subscribeToTemplate(revision,) {
+    const entry = this.vectorSetItems.get(revision,);
+    if (!entry) return;
+    entry.count++;
+    return () => {
+      const latest = this.vectorSetItems.get(revision,);
+      if (!latest) return;
+      latest.count--;
+      if (latest.count > 0) return;
+      setTimeout(() => {
+        var _a, _b;
+        if ((_a = this.vectorSetItems.get(revision,)) == null ? void 0 : _a.count) return;
+        this.vectorSetItems.delete(revision,);
+        if (useDOM) (_b = document == null ? void 0 : document.getElementById(revision,)) == null ? void 0 : _b.remove();
+      }, 5e3,);
+    };
   }
   clear() {
     this.entries.clear();
@@ -46909,6 +46936,10 @@ var SharedSVGManager = class {
     return output.join('\n',);
   }
 };
+function useSVGTemplate(revision, svg,) {
+  useEffect(() => sharedSVGManager.subscribeToTemplate(revision,), [revision,],);
+  return sharedSVGManager.template(revision, svg,);
+}
 var sharedSVGManager = /* @__PURE__ */ new SharedSVGManager();
 function parseSVG(svg,) {
   try {
@@ -48208,6 +48239,7 @@ var Vector = /* @__PURE__ */ (() => {
       const {
         opacity,
         calculatedPath,
+        calculatedPathBoundingBox,
         d,
         insideStroke,
         strokeEnabled,
@@ -48327,7 +48359,18 @@ var Vector = /* @__PURE__ */ (() => {
       }
       const internalShapeId = InternalID.forKey(id3,);
       const internalStrokeClipId = InternalID.forKey(strokeClipId,);
-      const shadow = shadowForShape(shadows, rect, internalShapeId, strokeAlpha, strokeWidth, internalStrokeClipId, svgStrokeAttributes,);
+      const shadow = shadowForShape(
+        shadows,
+        // Shadow filter uses 'objectBoundingBox' as filter units, so calculations should be
+        // relative to the referenced object itself (path), instead of the node rect, which
+        // can be larger than the path bounding box.
+        calculatedPathBoundingBox,
+        internalShapeId,
+        strokeAlpha,
+        strokeWidth,
+        internalStrokeClipId,
+        svgStrokeAttributes,
+      );
       const currentName = target === RenderTarget.preview ? name || void 0 : void 0;
       if (shadow.insetElement !== null || shadow.outsetElement !== null || insideStroke) {
         pathAttributes.id = internalShapeId.id;
@@ -48475,6 +48518,12 @@ var Vector = /* @__PURE__ */ (() => {
       rotate: void 0,
       opacity: void 0,
       calculatedPath: [],
+      calculatedPathBoundingBox: {
+        x: 0,
+        y: 0,
+        width: 0,
+        height: 0,
+      },
       d: void 0,
       insideStroke: false,
       strokeEnabled: true,
@@ -49333,7 +49382,6 @@ export {
   secondsToMilliseconds,
   setDragLock,
   setGlobalRenderEnvironment,
-  setInitialHydrationState,
   setStyle,
   Shadow,
   sharedSVGManager,
@@ -49455,6 +49503,7 @@ export {
   useScroll,
   useSiteRefs,
   useSpring,
+  useSVGTemplate,
   useTime,
   useTransform,
   useUnmountEffect,