unframer 2.7.11 → 2.9.0

package/dist/framer.js

@@ -49,7 +49,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.LayoutGroupContext = exports.DeprecatedLayoutGroupContext = exports.DeprecatedFrameWithEvents = exports.DeprecatedComponentContainer = exports.defaultDeviceProps = exports.DataObserverContext = exports.DataObserver = exports.DataContext = exports.Data = exports.CycleVariantState = exports.CustomCursorHost = exports.createBox = exports.ConvertColor = exports.ControlType = exports.Container = exports.ConstraintValues = exports.ConstraintMask = exports.ComponentViewportProvider = exports.ComponentContainerContext = exports.complex = exports.combinedCSSRulesForPreview = exports.ColorMixModelType = exports.ColorFormat = exports.color = exports.Color = exports.clamp = exports.circOut = exports.circInOut = exports.circIn = exports.cancelSync = exports.cancelFrame = exports.callEach = exports.BoxShadow = exports.BezierAnimator = exports.backOut = exports.backInOut = exports.backIn = exports.BackgroundImage = exports.AnyInterpolation = exports.anticipate = exports.animations = exports.AnimateSharedLayout = exports.AnimatePresence = exports.animateMini = exports.animate = exports.Animatable = exports.AnchorLinkTarget = exports.addPointerInfo = exports.AcceleratedAnimation = exports.combinedCSSRules = void 0;
 exports.LazyValue = exports.LayoutIdContext = exports.LayoutGroup = exports.Layer = exports.isMotionValue = exports.isBrowser = exports.invariant = exports.InternalID = exports.Image = exports.GeneratedComponentContext = exports.GamepadContext = exports.FrameWithMotion = exports.frameSteps = exports.FramerEventSession = exports.FramerEventListener = exports.FramerEvent = exports.framerCSSMarker = exports.framerAppearTransformTemplateToken = exports.framerAppearIdKey = exports.framerAppearEffects = exports.framerAppearAnimationScriptKey = exports.FramerAnimation = exports.frameFromElements = exports.frameFromElement = exports.frameData = exports.frame = exports.Frame = exports.FormSelect = exports.FormPlainTextInput = exports.FormContainer = exports.FormBooleanInput = exports.fontStore = exports.FontSourceNames = exports.FlatTree = exports.Fetcher = exports.environment = exports.easeOut = exports.easeInOut = exports.easeIn = exports.Draggable = exports.DragControls = exports.domMin = exports.domMax = exports.domAnimation = exports.DOM = exports.distance = exports.dispatchKeyDownEvent = exports.DimensionType = exports.devicePresets = exports.DeviceCodeComponent = void 0;
 exports.SpringAnimator = exports.Size = exports.sharedSVGManager = exports.Shadow = exports.Scroll = exports.RichText = exports.reverseEasing = exports.ResolveLinks = exports.RenderTarget = exports.Rect = exports.RadialGradient = exports.QueryEngine = exports.px = exports.PropertyStore = exports.PropertyOverrides = exports.progress = exports.PresenceContext = exports.Polygon = exports.pipe = exports.PathVariablesContext = exports.PathSegment = exports.pathDefaults = exports.ParentSizeState = exports.Page = exports.optimizedAppearDataAttribute = exports.optimizeAppearTransformTemplate = exports.optimizeAppear = exports.ObservableObject = exports.NotFoundError = exports.nestedLinksCollector = exports.NavigationTransitionType = exports.NavigationConsumer = exports.NavigationCallbackProvider = exports.NavigateTo = exports.Reorder = exports.MotionValue = exports.MotionGlobalConfig = exports.MotionContext = exports.MotionConfigContext = exports.motion = exports.mirrorEasing = exports.makeUseVisualState = exports.MainLoop = exports.m = exports.localPackageFallbackIdentifier = exports.loadFont = exports.Link = exports.LinearGradient = exports.Line = exports.LibraryFeaturesProvider = void 0;
-exports.wrap = exports.withVariantFX = exports.withVariantAppearEffect = exports.withStyleAppearEffect = exports.withParallaxTransform = exports.withMeasuredSize = exports.withGeneratedLayoutId = exports.withFX = exports.withCSS = exports.WindowContext = exports.warning = exports.visualElementStore = exports.VisualElement = exports.version = exports.VectorGroup = exports.Vector = exports.VariantSelector = exports.ValueInterpolation = exports.useProvidedWindow = exports.useIsomorphicLayoutEffect = exports.useAnimation = exports.Text = exports.systemFontFamilyName = exports.sync = exports.SwitchLayoutGroupContext = exports.StyleSheetContext = exports.Stack = exports.SSRVariants = void 0;
+exports.FormContext = exports.FetchClientProvider = exports.wrap = exports.withVariantFX = exports.withVariantAppearEffect = exports.withStyleAppearEffect = exports.withParallaxTransform = exports.withMeasuredSize = exports.withGeneratedLayoutId = exports.withFX = exports.withCSS = exports.WindowContext = exports.warning = exports.visualElementStore = exports.VisualElement = exports.version = exports.VectorGroup = exports.Vector = exports.VariantSelector = exports.ValueInterpolation = exports.useProvidedWindow = exports.useIsomorphicLayoutEffect = exports.useAnimation = exports.Text = exports.systemFontFamilyName = exports.sync = exports.SwitchLayoutGroupContext = exports.StyleSheetContext = exports.Stack = exports.SSRVariants = void 0;
 exports._injectRuntime = _injectRuntime;
 exports.addActionControls = addActionControls;
 exports.addFonts = addFonts;
@@ -194,6 +194,7 @@ exports.useBreakpointVariants = useBreakpointVariants;
 exports.useComponentViewport = useComponentViewport;
 exports.useConstant = useConstant2;
 exports.useCurrentPathVariables = useCurrentPathVariables;
+exports.useCurrentRoute = useCurrentRoute;
 exports.useCurrentRouteId = useCurrentRouteId;
 exports.useCustomCursors = useCustomCursors;
 exports.useCycle = useCycle;
@@ -265,6 +266,7 @@ exports.WithOverride = WithOverride;
 exports.withPath = withPath;
 exports.withPerformanceMarks = withPerformanceMarks;
 exports.withShape = withShape;
+exports.Router = Router;
 var __defProp = Object.defineProperty;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __esm = (fn, res) => function __init() {
@@ -14630,7 +14632,7 @@ function steps(numSteps, direction = 'end') {
         return clamp(0, 1, rounded / numSteps);
     };
 }
-// https :https://app.framerstatic.com/framer.ZONHQAMM.mjs
+// https :https://app.framerstatic.com/framer.K3G2LCX5.mjs
 init_chunk_QLPHEVXG();
 const react_11 = __importDefault(require("react"));
 const react_12 = require("react");
@@ -16530,11 +16532,11 @@ function lazy(factory) {
     const LazyComponent = react_11.default.lazy(factory);
     let factoryPromise;
     let LoadedComponent;
-    const Component15 = react_11.default.forwardRef(function LazyWithPreload(props, ref) {
+    const Component16 = react_11.default.forwardRef(function LazyWithPreload(props, ref) {
         return react_11.default.createElement(LoadedComponent !== null && LoadedComponent !== void 0 ? LoadedComponent : LazyComponent, ref
             ? Object.assign({ ref }, props) : props);
     });
-    Component15.preload = () => {
+    Component16.preload = () => {
         if (!factoryPromise) {
             factoryPromise = factory().then((module) => {
                 LoadedComponent = module.default;
@@ -16543,7 +16545,7 @@ function lazy(factory) {
         }
         return factoryPromise;
     };
-    return Component15;
+    return Component16;
 }
 function getRouteElementId(route, hash2) {
     if (hash2 && route) {
@@ -17140,8 +17142,7 @@ function pushRouteState(routeId_1, route_1, _j) {
                 pathVariables,
                 localeId,
             }, newPath, enableAsyncURLUpdate, isNavigationTransition);
-            if (!enableAsyncURLUpdate)
-                yield urlUpdatePromise;
+            return yield urlUpdatePromise;
         }
         catch (_k) { }
     });
@@ -17263,6 +17264,7 @@ function usePopStateHandler(currentRouteId, setCurrentRouteId) {
                             reject,
                         };
                     });
+                    viewTransitionReady.current = void 0;
                 });
             },
             scroll: 'after-transition',
@@ -17795,15 +17797,6 @@ function useNavigationTransition(enableAsyncURLUpdates) {
             transitionFn(signal);
             return nextRender;
         }
-        transitionFn(signal);
-        yield interactionResponse({
-            priority: 'user-visible',
-            signal,
-        }).catch(noop2);
-        yield interactionResponse({
-            priority: 'user-visible',
-            signal,
-        }).catch(noop2);
         let resolveNavigationPromise;
         const navigationPromise = new Promise((resolve, reject) => {
             resolveNavigationPromise = resolve;
@@ -17812,13 +17805,18 @@ function useNavigationTransition(enableAsyncURLUpdates) {
             else
                 signal === null || signal === void 0 ? void 0 : signal.addEventListener('abort', reject);
         });
+        yield interactionResponse({
+            priority: 'user-blocking',
+            signal,
+        }).catch(noop2);
+        transitionFn(signal);
         startNativeSpinner(navigationPromise, updateURL, controller);
         return nextRender.then(() => {
             resolveNavigationPromise();
         });
     }), [enableAsyncURLUpdates, monitorNextPaintAfterRender, startNativeSpinner,]);
 }
-function Router({ defaultPageStyle, disableHistory, initialPathVariables, initialRoute, notFoundPage, collectionUtils, routes, initialLocaleId, locales = EMPTY_ARRAY, preserveQueryParams = false, enableAsyncURLUpdates = false, LayoutTemplate, }) {
+function Router({ defaultPageStyle, disableHistory, initialPathVariables, initialRoute, notFoundPage, collectionUtils, routes, initialLocaleId, locales = EMPTY_ARRAY, preserveQueryParams = false, enableAsyncURLUpdates = false, LayoutTemplate, editorBar, }) {
     useMarkRouterEffects();
     useReplaceInitialState({
         disabled: disableHistory,
@@ -17954,22 +17952,20 @@ function Router({ defaultPageStyle, disableHistory, initialPathVariables, initia
             routeId,
             pathVariables,
         })) {
-            updateScrollPosition(routeElementId, smoothScroll, false);
             const route = routes[routeId];
-            if (((_b = window.history.state) === null || _b === void 0 ? void 0 : _b.hash) === hash2 || disableHistory || !route)
-                return;
-            const updateURLPromise = pushRouteState(routeId, route, {
-                currentRoutePath: route.path,
-                currentPathVariables: currentPathVariables2,
-                pathVariables,
-                hash: hash2,
-                localeId: currentRouteLocaleId,
-                preserveQueryParams,
-            }, 
-            // we want to yield as this is called synchronusly from an user interaction.
-            enableAsyncURLUpdates);
-            if (!enableAsyncURLUpdates)
-                return yield updateURLPromise;
+            if (((_b = window.history.state) === null || _b === void 0 ? void 0 : _b.hash) !== hash2 && !disableHistory && route) {
+                yield pushRouteState(routeId, route, {
+                    currentRoutePath: route.path,
+                    currentPathVariables: currentPathVariables2,
+                    pathVariables,
+                    hash: hash2,
+                    localeId: currentRouteLocaleId,
+                    preserveQueryParams,
+                }, 
+                // we want to yield as this is called synchronusly from an user interaction.
+                enableAsyncURLUpdates);
+            }
+            updateScrollPosition(routeElementId, smoothScroll, false);
             return;
         }
         if (!newRoute)
@@ -18037,6 +18033,7 @@ function Router({ defaultPageStyle, disableHistory, initialPathVariables, initia
                     }),
                     (0, jsx_runtime_1.jsx)(TurnOnReactEventHandling, {}),
                     (0, jsx_runtime_1.jsx)(MarkSuspenseEffects.End, {}),
+                    editorBar,
                 ],
             }),
         }),
@@ -18926,7 +18923,7 @@ var SpringCurveValueConverter = {
         };
         const initialGuess = 5 / duration;
         const undampedFrequency = approximateRoot2(envelope, derivative, initialGuess);
-        if (!isNaN(undampedFrequency)) {
+        if (!Number.isNaN(undampedFrequency)) {
             result.tension = Math.pow(undampedFrequency, 2) * mass;
             result.friction = dampingRatio * 2 * Math.sqrt(mass * result.tension);
         }
@@ -19355,7 +19352,7 @@ function modulate(value, rangeA, rangeB, limit = false) {
     return result;
 }
 function isNumeric(value) {
-    return !isNaN(value) && isFinite(value);
+    return !Number.isNaN(value) && Number.isFinite(value);
 }
 function percentToFraction(val) {
     const digits = numberFromString(val);
@@ -20167,7 +20164,7 @@ function correctAlpha(alphaValue) {
     if (alphaValue < 0) {
         alphaValue = 0;
     }
-    if (isNaN(alphaValue) || alphaValue > 1) {
+    if (Number.isNaN(alphaValue) || alphaValue > 1) {
         alphaValue = 1;
     }
     return alphaValue;
@@ -21605,7 +21602,7 @@ function getDeviceStyle({ scaleTo, deviceOptions, overrideTheme, } = {}) {
     };
 }
 function isFiniteNumber(value) {
-    return typeof value === 'number' && isFinite(value);
+    return Number.isFinite(value);
 }
 function finiteNumber(value) {
     return isFiniteNumber(value) ? value : void 0;
@@ -22037,10 +22034,10 @@ var Rect = {
         if (point2.y > Rect.maxY(rect)) {
             return false;
         }
-        if (isNaN(rect.x)) {
+        if (Number.isNaN(rect.x)) {
             return false;
         }
-        if (isNaN(rect.y)) {
+        if (Number.isNaN(rect.y)) {
             return false;
         }
         return true;
@@ -23864,7 +23861,7 @@ function isNullish2(value) {
     return value == null;
 }
 function isValidDate(value) {
-    return value instanceof Date && !isNaN(value.getTime());
+    return value instanceof Date && !Number.isNaN(value.getTime());
 }
 function isGenerator2(value) {
     return isObject2(value) && isFunction(value.return);
@@ -26074,7 +26071,7 @@ function useMeasuredSize(ref) {
     return size.current;
 }
 var SIZE_COMPATIBILITY_WRAPPER_ATTRIBUTE = 'data-framer-size-compatibility-wrapper';
-var withMeasuredSize = (Component15) => (props) => {
+var withMeasuredSize = (Component16) => (props) => {
     var _j, _k, _l, _m;
     const ref = react_11.default.useRef(null);
     const size = useMeasuredSize(ref);
@@ -26088,7 +26085,7 @@ var withMeasuredSize = (Component15) => (props) => {
             width: '100%',
             height: '100%',
             pointerEvents: 'none',
-        }, ref }, dataProps), { children: shouldRender && /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign(Object.assign({}, props), { width: (_l = (size == null ? void 0 : size.width)) !== null && _l !== void 0 ? _l : fallbackWidth, height: (_m = (size == null ? void 0 : size.height)) !== null && _m !== void 0 ? _m : fallbackHeight })) }));
+        }, ref }, dataProps), { children: shouldRender && /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign(Object.assign({}, props), { width: (_l = (size == null ? void 0 : size.width)) !== null && _l !== void 0 ? _l : fallbackWidth, height: (_m = (size == null ? void 0 : size.height)) !== null && _m !== void 0 ? _m : fallbackHeight })) }));
 };
 exports.withMeasuredSize = withMeasuredSize;
 function getMeasurableCodeComponentChildren(element) {
@@ -27568,7 +27565,7 @@ var clamp2 = (value, a, b) => {
 var DraggingContext = /* @__PURE__ */ react_11.default.createContext({
     dragging: false,
 });
-function WithDragging(Component15) {
+function WithDragging(Component16) {
     const _WithDraggingHOC = class extends react_11.default.Component {
         constructor(props, defaultProps) {
             super(props, defaultProps);
@@ -28129,7 +28126,7 @@ function WithDragging(Component15) {
                 value: {
                     dragging: this.state.isDragging,
                 },
-                children: /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign({}, originalProps)),
+                children: /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign({}, originalProps)),
             });
         }
     };
@@ -28165,9 +28162,9 @@ function WithDragging(Component15) {
         constraints: {},
         mouseWheel: false,
     });
-    __publicField(WithDraggingHOC, 'defaultProps', Object.assign({}, Component15.defaultProps, _WithDraggingHOC.draggingDefaultProps));
+    __publicField(WithDraggingHOC, 'defaultProps', Object.assign({}, Component16.defaultProps, _WithDraggingHOC.draggingDefaultProps));
     const withDragging = WithDraggingHOC;
-    (0, import_hoist_non_react_statics.default)(withDragging, Component15);
+    (0, import_hoist_non_react_statics.default)(withDragging, Component16);
     return withDragging;
 }
 var hoverProps = {
@@ -28445,7 +28442,7 @@ function hasRadius(props) {
 }
 function getRadiusValue(value) {
     let num = Number(value);
-    if (typeof value === 'string' && isNaN(num)) {
+    if (typeof value === 'string' && Number.isNaN(Number(num))) {
         return value;
     }
     else if (isAnimatable2(value)) {
@@ -30765,7 +30762,7 @@ function useInfiniteScroll({ ref: elementRef, loadMore, rootMargin = '0px', thre
         };
     }, [elementRef, callback, rootMargin, threshold, paginationInfo.currentPage,]);
 }
-function withInfiniteScroll(Component15) {
+function withInfiniteScroll(Component16) {
     return react_11.default.forwardRef((_j, ref) => {
         var { __paginationInfo, __loadMore } = _j, props = __rest(_j, ["__paginationInfo", "__loadMore"]);
         const backupRef = react_11.default.useRef(null);
@@ -30776,7 +30773,7 @@ function withInfiniteScroll(Component15) {
             ref: infiniteScrollRef,
             paginationInfo: __paginationInfo,
         });
-        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign(Object.assign({}, props), { ref: infiniteScrollRef }));
+        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign(Object.assign({}, props), { ref: infiniteScrollRef }));
     });
 }
 var import_process2 = __toESM(require_browser(), 1);
@@ -33410,7 +33407,7 @@ var DataObserverContext = /* @__PURE__ */ react_11.default.createContext({
 exports.DataObserverContext = DataObserverContext;
 function useObserveData() {
     const context = react_11.default.useContext(DataObserverContext);
-    return !isNaN(context.update);
+    return !Number.isNaN(context.update);
 }
 var DataObserver = class extends react_7.Component {
     constructor() {
@@ -33479,16 +33476,16 @@ function convertColorProps(props) {
     }
     return props;
 }
-function WithOverride(Component15, override) {
+function WithOverride(Component16, override) {
     const useOverride = typeof override === 'function' ? (props) => override(convertColorProps(props)) : () => convertColorProps(override);
     const ComponentWithOverride = function (props) {
         (0, react_2.useContext)(DataObserverContext);
         const overrideProps = useOverride(props);
         const { style } = props, rest = __rest(props, ["style"]);
-        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign(Object.assign(Object.assign({}, rest), overrideProps), { _initialStyle: style }));
+        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign(Object.assign(Object.assign({}, rest), overrideProps), { _initialStyle: style }));
     };
-    (0, import_hoist_non_react_statics4.default)(ComponentWithOverride, Component15);
-    ComponentWithOverride['displayName'] = `WithOverride(${Component15.displayName || Component15.name})`;
+    (0, import_hoist_non_react_statics4.default)(ComponentWithOverride, Component16);
+    ComponentWithOverride['displayName'] = `WithOverride(${Component16.displayName || Component16.name})`;
     return ComponentWithOverride;
 }
 var prefix = '__framer__';
@@ -34289,15 +34286,15 @@ function addMotionValueStyle(style, values) {
 function isVariantOrVariantList(value) {
     return isString2(value) || Array.isArray(value);
 }
-var withFX = (Component15) => react_11.default.forwardRef((props, forwardedRef) => {
+var withFX = (Component16) => react_11.default.forwardRef((props, forwardedRef) => {
     var _a;
     if (props.__withFX) {
-        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign(Object.assign({}, props), { animate: void 0, initial: void 0, exit: void 0, ref: forwardedRef }));
+        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign(Object.assign({}, props), { animate: void 0, initial: void 0, exit: void 0, ref: forwardedRef }));
     }
     if (RenderTarget.current() === RenderTarget.canvas) {
         const animate4 = isVariantOrVariantList(props.animate) ? props.animate : void 0;
         const initial2 = isVariantOrVariantList(props.initial) ? props.initial : void 0;
-        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign(Object.assign({}, props), { animate: animate4, initial: initial2, exit: void 0, ref: forwardedRef }));
+        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign(Object.assign({}, props), { animate: animate4, initial: initial2, exit: void 0, ref: forwardedRef }));
     }
     const { parallax = {}, styleAppear = {}, styleTransform = {}, presence = {}, loop = {}, forwardedProps, } = extractFXOptions(props);
     const { __targetOpacity: targetOpacityValue, __perspectiveFX: withPerspective, __smartComponentFX: inSmartComponent = false, } = props;
@@ -34369,7 +34366,7 @@ var withFX = (Component15) => react_11.default.forwardRef((props, forwardedRef)
             exit,
         }
         : {};
-    return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign(Object.assign(Object.assign({}, forwardedProps), motionGestures), { __withFX: true, style: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, props.style), parallaxStyle), scrollStyle), loopStyle), motionValueStyle), values: presenceEffectValues, ref: observerRef }));
+    return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign(Object.assign(Object.assign({}, forwardedProps), motionGestures), { __withFX: true, style: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, props.style), parallaxStyle), scrollStyle), loopStyle), motionValueStyle), values: presenceEffectValues, ref: observerRef }));
 });
 exports.withFX = withFX;
 var withParallaxTransform = withFX;
@@ -34495,9 +34492,9 @@ var ComponentViewportProvider = /* @__PURE__ */ react_11.default.forwardRef((_j,
     });
 });
 exports.ComponentViewportProvider = ComponentViewportProvider;
-var withGeneratedLayoutId = (Component15) => react_11.default.forwardRef((props, ref) => {
+var withGeneratedLayoutId = (Component16) => react_11.default.forwardRef((props, ref) => {
     const layoutId = useLayoutId2(props);
-    return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign(Object.assign({ layoutId }, props), { layoutIdKey: void 0, duplicatedFrom: void 0, ref }));
+    return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign(Object.assign({ layoutId }, props), { layoutIdKey: void 0, duplicatedFrom: void 0, ref }));
 });
 exports.withGeneratedLayoutId = withGeneratedLayoutId;
 var ContainerErrorBoundary = class extends react_7.Component {
@@ -34574,7 +34571,7 @@ var componentsWithServerRenderedStyles = /* @__PURE__ */ (() => {
 })();
 var framerCSSMarker = 'data-framer-css-ssr';
 exports.framerCSSMarker = framerCSSMarker;
-var withCSS = (Component15, escapedCSS, componentSerializationId) => react_11.default.forwardRef((props, ref) => {
+var withCSS = (Component16, escapedCSS, componentSerializationId) => react_11.default.forwardRef((props, ref) => {
     var _j;
     const { sheet, cache: cache2, } = (_j = react_11.default.useContext(StyleSheetContext)) !== null && _j !== void 0 ? _j : {};
     if (!isBrowser2()) {
@@ -34588,7 +34585,7 @@ var withCSS = (Component15, escapedCSS, componentSerializationId) => react_11.de
                 }, { 'data-framer-component': componentSerializationId, dangerouslySetInnerHTML: {
                         __html: concatenatedCSS,
                     } })),
-                /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign(Object.assign({}, props), { ref })),
+                /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign(Object.assign({}, props), { ref })),
             ],
         });
     }
@@ -34602,7 +34599,7 @@ var withCSS = (Component15, escapedCSS, componentSerializationId) => react_11.de
                 : escapedCSS.split('\n');
         css2.forEach((rule) => rule && injectCSSRule(rule, sheet, cache2));
     }, []);
-    return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign(Object.assign({}, props), { ref }));
+    return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign(Object.assign({}, props), { ref }));
 });
 exports.withCSS = withCSS;
 var CustomCursorContext = /* @__PURE__ */ (0, react_1.createContext)({
@@ -35574,10 +35571,10 @@ function ChildrenCanSuspend({ children, }) {
         children,
     });
 }
-function withChildrenCanSuspend(Component15) {
+function withChildrenCanSuspend(Component16) {
     return (0, react_4.forwardRef)(function withChildrenCanSuspendInner(props, ref) {
         return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(ChildrenCanSuspend, {
-            children: /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign(Object.assign({}, props), { ref })),
+            children: /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign(Object.assign({}, props), { ref })),
         });
     });
 }
@@ -36324,6 +36321,24 @@ function maybeReplaceAnchorWithSpan(component) {
         return motion.span;
     return component;
 }
+var IgnoreErrors = class extends react_7.Component {
+    constructor() {
+        super(...arguments);
+        __publicField(this, 'state', {
+            error: void 0,
+        });
+    }
+    static getDerivedStateFromError(error) {
+        return {
+            error,
+        };
+    }
+    render() {
+        if (this.state.error)
+            return null;
+        return this.props.children;
+    }
+};
 var salt = 'framer';
 var difficulty = 3;
 var tokenLength = 30;
@@ -36440,6 +36455,7 @@ function openExternalLinkInCurrentTab(link, formRef) {
     linkElement.remove();
 }
 var FormContext = react_11.default.createContext(void 0);
+exports.FormContext = FormContext;
 var FormContainer = /* @__PURE__ */ react_11.default.forwardRef(function FormContainer2(_j, forwardedRef) {
     var { action, children, redirectUrl, onSuccess, onError, onLoading } = _j, props = __rest(_j, ["action", "children", "redirectUrl", "onSuccess", "onError", "onLoading"]);
     const fallbackRef = react_11.default.useRef(null);
@@ -36499,18 +36515,18 @@ var FormContainer = /* @__PURE__ */ react_11.default.forwardRef(function FormCon
         try {
             (_b = (_a = callbacks.current).onLoading) == null ? void 0 : _b.call(_a);
             yield submitForm(action, data2, projectHash);
-            dispatch({
+            (0, react_12.startTransition)(() => dispatch({
                 type: 'success',
-            });
+            }));
             (_d = (_c = callbacks.current).onSuccess) == null ? void 0 : _d.call(_c);
             if (redirectUrl) {
                 yield redirectTo(redirectUrl);
             }
         }
         catch (error) {
-            dispatch({
+            (0, react_12.startTransition)(() => dispatch({
                 type: 'error',
-            });
+            }));
             (_f = (_e = callbacks.current).onError) == null ? void 0 : _f.call(_e);
             console.error(error);
         }
@@ -36624,7 +36640,7 @@ var loadingFetchResult = {
     data: void 0,
 };
 function isNumberString(value) {
-    return isString2(value) && !isNaN(Number(value));
+    return isString2(value) && !Number.isNaN(Number(value));
 }
 function isValidFetchDataValueResult(type, value) {
     switch (type) {
@@ -36947,6 +36963,7 @@ var FetchClientProvider = ({ children, client: initialClient, }) => {
         }),
     });
 };
+exports.FetchClientProvider = FetchClientProvider;
 var _subscriptions;
 var _subscribers2;
 var _results;
@@ -37098,7 +37115,7 @@ function usePrefetch() {
     }
     return React2.useCallback((request) => fetchClient.prefetch(request), [fetchClient,]);
 }
-function PageRoot({ RootComponent, isWebsite, routeId, framerSiteId, pathVariables, routes, collectionUtils, notFoundPage, isReducedMotion = false, includeDataObserver = false, localeId, locales, preserveQueryParams, }) {
+function PageRoot({ RootComponent, isWebsite, routeId, framerSiteId, pathVariables, routes, collectionUtils, notFoundPage, isReducedMotion = false, includeDataObserver = false, localeId, locales, preserveQueryParams, EditorBar, }) {
     const { enableAsyncURLUpdates, } = useLibraryFeatures();
     react_11.default.useEffect(() => {
         if (isWebsite)
@@ -37126,6 +37143,13 @@ function PageRoot({ RootComponent, isWebsite, routeId, framerSiteId, pathVariabl
                             },
                             preserveQueryParams,
                             enableAsyncURLUpdates,
+                            editorBar: EditorBar && framerSiteId && /* @__PURE__ */ (0, jsx_runtime_1.jsx)(IgnoreErrors, {
+                                children: /* @__PURE__ */ (0, jsx_runtime_1.jsx)(react_13.Suspense, {
+                                    children: /* @__PURE__ */ (0, jsx_runtime_1.jsx)(EditorBar, {
+                                        framerSiteId,
+                                    }),
+                                }),
+                            }),
                         }),
                     }),
                 }),
@@ -41857,7 +41881,7 @@ var AnimationCollector = class {
 _variantHashes = /* @__PURE__ */ new WeakMap();
 var framerAppearEffects = /* @__PURE__ */ new AnimationCollector();
 exports.framerAppearEffects = framerAppearEffects;
-function withOptimizedAppearEffect(Component15) {
+function withOptimizedAppearEffect(Component16) {
     return react_11.default.forwardRef((_j, ref) => {
         var { optimized } = _j, props = __rest(_j, ["optimized"]);
         const generatedComponentContext = react_11.default.useContext(GeneratedComponentContext);
@@ -41872,7 +41896,7 @@ function withOptimizedAppearEffect(Component15) {
             // should not be optimized.
             optimized ? props : null, generatedComponentContext);
         }
-        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign({ ref }, props));
+        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign({ ref }, props));
     });
 }
 var optimizeAppear = (prop, id3, animateTargetAndTransition, variantHash) => {
@@ -42438,49 +42462,49 @@ function usePrototypeNavigate({ preload, } = {}) {
             navigation.goBack();
             return false;
         }
-        const Component15 = typeof target === 'string'
+        const Component16 = typeof target === 'string'
             ? yield componentForRoute(getRoute == null ? void 0 : getRoute(target)).catch(() => { })
             : react_11.default.isValidElement(target)
                 ? target
                 : null;
-        if (!Component15)
+        if (!Component16)
             return;
         const { appearsFrom, backdropColor, animation, } = options;
         const transitionType = options.transition || 'instant';
         switch (transitionType) {
             case 'instant':
-                navigation.instant(Component15);
+                navigation.instant(Component16);
                 break;
             case 'fade':
-                navigation.fade(Component15, {
+                navigation.fade(Component16, {
                     animation,
                 });
                 break;
             case 'push':
-                navigation.push(Component15, {
+                navigation.push(Component16, {
                     appearsFrom,
                     animation,
                 });
                 break;
             case 'flip':
-                navigation.flip(Component15, {
+                navigation.flip(Component16, {
                     appearsFrom,
                     animation,
                 });
                 break;
             case 'magicMotion':
-                navigation.magicMotion(Component15, {
+                navigation.magicMotion(Component16, {
                     animation,
                 });
                 break;
             case 'modal':
-                navigation.modal(Component15, {
+                navigation.modal(Component16, {
                     backdropColor,
                     animation,
                 });
                 break;
             case 'overlay':
-                navigation.overlay(Component15, {
+                navigation.overlay(Component16, {
                     appearsFrom,
                     backdropColor,
                     animation,
@@ -42855,7 +42879,7 @@ function extractMappingFromInfo(info) {
         return void 0;
     }
 }
-function withMappedReactProps(Component15, info) {
+function withMappedReactProps(Component16, info) {
     return (rawProps) => {
         var _j;
         const props = {};
@@ -42863,7 +42887,7 @@ function withMappedReactProps(Component15, info) {
         for (const key7 in rawProps) {
             asRecord(props)[(_j = (mapping == null ? void 0 : mapping[key7])) !== null && _j !== void 0 ? _j : key7] = rawProps[key7];
         }
-        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign({}, props));
+        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign({}, props));
     };
 }
 var keys2 = /* @__PURE__ */ new Set([
@@ -42904,9 +42928,9 @@ function createInputOutputRanges2(transformTargets, threshold, exitTarget) {
         outputRange: [-1, -1, ...outputRange,],
     };
 }
-var withVariantAppearEffect = (Component15) => react_11.default.forwardRef((props, forwardedRef) => {
+var withVariantAppearEffect = (Component16) => react_11.default.forwardRef((props, forwardedRef) => {
     if (RenderTarget.current() === RenderTarget.canvas) {
-        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign(Object.assign({}, props), { ref: forwardedRef }));
+        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign(Object.assign({}, props), { ref: forwardedRef }));
     }
     const { wrapUpdatesInTransitions, } = useLibraryFeatures();
     const [options, rest,] = extractPrefixedProps(props, keys2);
@@ -42989,14 +43013,14 @@ var withVariantAppearEffect = (Component15) => react_11.default.forwardRef((prop
         repeat: !animateOnce,
     });
     if (!('variantAppearEffectEnabled' in options) || variantAppearEffectEnabled === true) {
-        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign(Object.assign({}, rest), { variant: activeVariant !== null && activeVariant !== void 0 ? activeVariant : props.variant, ref: observerRef }));
+        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign(Object.assign({}, rest), { variant: activeVariant !== null && activeVariant !== void 0 ? activeVariant : props.variant, ref: observerRef }));
     }
     else {
-        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign({}, rest));
+        return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign({}, rest));
     }
 });
 exports.withVariantAppearEffect = withVariantAppearEffect;
-var withVariantFX = (Component15) => react_11.default.forwardRef((_j, forwardedRef) => {
+var withVariantFX = (Component16) => react_11.default.forwardRef((_j, forwardedRef) => {
     var { initial, animate: animate3, exit } = _j, props = __rest(_j, ["initial", "animate", "exit"]);
     const observerRef = useObserverRef(forwardedRef);
     const effect = usePresenceAnimation({
@@ -43004,7 +43028,7 @@ var withVariantFX = (Component15) => react_11.default.forwardRef((_j, forwardedR
         animate: animate3,
         exit,
     }, observerRef, true);
-    return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign(Object.assign({}, props), { style: Object.assign(Object.assign({}, (props == null ? void 0 : props.style)), effect.values), ref: observerRef }));
+    return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign(Object.assign({}, props), { style: Object.assign(Object.assign({}, (props == null ? void 0 : props.style)), effect.values), ref: observerRef }));
 });
 exports.withVariantFX = withVariantFX;
 var WindowContext = /* @__PURE__ */ react_11.default.createContext(void 0);
@@ -46354,10 +46378,10 @@ var RichTextContainer = /* @__PURE__ */ (0, react_4.forwardRef)((props, ref) =>
     if (layoutId) {
         rest.layout = 'preserve-aspect';
     }
-    const Component15 = htmlElementAsMotionComponent(props.as);
+    const Component16 = htmlElementAsMotionComponent(props.as);
     if (isString2(props.viewBox)) {
         if (props.as !== void 0) {
-            return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign(Object.assign({}, rest), { ref: containerRef, style: containerStyle, layoutId, transformTemplate: template, 'data-framer-name': name, 'data-framer-component-type': 'RichTextContainer', children: /* @__PURE__ */ (0, jsx_runtime_1.jsx)(FitText, {
+            return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign(Object.assign({}, rest), { ref: containerRef, style: containerStyle, layoutId, transformTemplate: template, 'data-framer-name': name, 'data-framer-component-type': 'RichTextContainer', children: /* @__PURE__ */ (0, jsx_runtime_1.jsx)(FitText, {
                     viewBox,
                     viewBoxScale,
                     style: {
@@ -46373,7 +46397,7 @@ var RichTextContainer = /* @__PURE__ */ (0, react_4.forwardRef)((props, ref) =>
                 viewBoxScale, transformTemplate: template, 'data-framer-name': name, 'data-framer-component-type': 'RichTextContainer', children: processedChildren }));
         }
     }
-    return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component15, Object.assign(Object.assign({}, rest), { ref: containerRef, style: containerStyle, layoutId, transformTemplate: template, 'data-framer-name': name, 'data-framer-component-type': 'RichTextContainer', children: processedChildren }));
+    return /* @__PURE__ */ (0, jsx_runtime_1.jsx)(Component16, Object.assign(Object.assign({}, rest), { ref: containerRef, style: containerStyle, layoutId, transformTemplate: template, 'data-framer-name': name, 'data-framer-component-type': 'RichTextContainer', children: processedChildren }));
 });
 function isFragment(element) {
     return element.type === react_8.Fragment;