@reacteditor/core 0.0.17 → 0.0.18

package/dist/{Editor-4LPVLYSU.css → Editor-IRCQF4VT.css}

@@ -88,25 +88,19 @@
 }
 
 /* css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Loader/styles.module.css/#css-module-data */
-@keyframes _loader-animation_nacdm_1 {
-  0% {
-    transform: rotate(0deg) scale(1);
+@keyframes _loader-spin_6933g_1 {
+  from {
+    transform: rotate(0deg);
   }
-  50% {
-    transform: rotate(180deg) scale(0.8);
-  }
-  100% {
-    transform: rotate(360deg) scale(1);
+  to {
+    transform: rotate(360deg);
   }
 }
-._Loader_nacdm_13 {
-  background: transparent;
-  border-radius: 100%;
-  border: 2px solid currentColor;
-  border-bottom-color: transparent;
-  display: inline-block;
-  animation: _loader-animation_nacdm_1 1s 0s infinite linear;
-  animation-fill-mode: both;
+._Loader_6933g_10 {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  animation: _loader-spin_6933g_1 1s linear infinite;
 }
 
 /* css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/ActionBar/styles.module.css/#css-module-data */

package/dist/{Editor-RY6D73N6.mjs → Editor-ULH2S4LO.mjs}

@@ -4,16 +4,16 @@ import {
 import {
   EditorInner,
   LoadedRichTextMenu
-} from "./chunk-2A2HBRLV.mjs";
-import "./chunk-OAOKQORI.mjs";
-import "./chunk-CUGSM3PC.mjs";
+} from "./chunk-NABX5FH7.mjs";
+import "./chunk-UQHR5LFK.mjs";
+import "./chunk-HR67L662.mjs";
 import "./chunk-6QJ2HF4O.mjs";
-import "./chunk-ESU6AYGB.mjs";
-import "./chunk-C5G7WUBQ.mjs";
+import "./chunk-DGIVBKSJ.mjs";
+import "./chunk-IOAYKTDH.mjs";
 import {
   useAppStore,
   useAppStoreApi
-} from "./chunk-NUBRSWFJ.mjs";
+} from "./chunk-LFJGTSUB.mjs";
 import "./chunk-M4JDRFYB.mjs";
 import "./chunk-FTVOCMGV.mjs";
 import "./chunk-DQU3HIP4.mjs";

package/dist/{chunk-ESU6AYGB.mjs → chunk-DGIVBKSJ.mjs}

@@ -3,7 +3,7 @@ import {
   AlignJustify,
   AlignLeft,
   AlignRight
-} from "./chunk-NUBRSWFJ.mjs";
+} from "./chunk-LFJGTSUB.mjs";
 import {
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";

package/dist/{chunk-CUGSM3PC.mjs → chunk-HR67L662.mjs}

@@ -1,7 +1,7 @@
 import {
   List,
   ListOrdered
-} from "./chunk-NUBRSWFJ.mjs";
+} from "./chunk-LFJGTSUB.mjs";
 import {
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";

package/dist/{chunk-C5G7WUBQ.mjs → chunk-IOAYKTDH.mjs}

@@ -5,7 +5,7 @@ import {
   Heading4,
   Heading5,
   Heading6
-} from "./chunk-NUBRSWFJ.mjs";
+} from "./chunk-LFJGTSUB.mjs";
 import {
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";

package/dist/{chunk-NUBRSWFJ.mjs → chunk-LFJGTSUB.mjs}

@@ -1143,7 +1143,19 @@ var createAppStore = (initialAppStore) => create2()(
       metadata: {},
       fieldTransforms: {},
       scrollToComponent: () => {
-      }
+      },
+      route: null,
+      isPublishing: false,
+      publish: () => __async(null, null, function* () {
+        const { onPublish, state, route } = get();
+        if (!onPublish) return;
+        set({ isPublishing: true });
+        try {
+          yield onPublish({ data: state.data, route });
+        } finally {
+          set({ isPublishing: false });
+        }
+      })
     }, initialAppStore), {
       fields: createFieldsSlice(set, get),
       history: createHistorySlice(set, get),

package/dist/{chunk-2A2HBRLV.mjs → chunk-NABX5FH7.mjs}

@@ -1,13 +1,13 @@
 import {
   LoadedRichTextMenuInner
-} from "./chunk-OAOKQORI.mjs";
+} from "./chunk-UQHR5LFK.mjs";
 import {
   styles_module_default
 } from "./chunk-6QJ2HF4O.mjs";
 import {
   useAppStore,
   useAppStoreApi
-} from "./chunk-NUBRSWFJ.mjs";
+} from "./chunk-LFJGTSUB.mjs";
 import {
   get_class_name_factory_default
 } from "./chunk-DQU3HIP4.mjs";
@@ -100,7 +100,7 @@ init_react_import();
 import { lazy, Suspense } from "react";
 import { jsx as jsx2 } from "react/jsx-runtime";
 var LoadedRichTextMenuFull = lazy(
-  () => import("./full-35622JEC.mjs").then((m) => ({
+  () => import("./full-LIVYWOAF.mjs").then((m) => ({
     default: m.LoadedRichTextMenuFull
   }))
 );

package/dist/{chunk-OAOKQORI.mjs → chunk-UQHR5LFK.mjs}

@@ -1,12 +1,12 @@
 import {
   useListOptions
-} from "./chunk-CUGSM3PC.mjs";
+} from "./chunk-HR67L662.mjs";
 import {
   useAlignOptions
-} from "./chunk-ESU6AYGB.mjs";
+} from "./chunk-DGIVBKSJ.mjs";
 import {
   useHeadingOptions
-} from "./chunk-C5G7WUBQ.mjs";
+} from "./chunk-IOAYKTDH.mjs";
 import {
   AlignCenter,
   AlignJustify,
@@ -26,12 +26,13 @@ import {
   Strikethrough,
   Underline,
   useControlContext
-} from "./chunk-NUBRSWFJ.mjs";
+} from "./chunk-LFJGTSUB.mjs";
 import {
   get_class_name_factory_default
 } from "./chunk-DQU3HIP4.mjs";
 import {
   __objRest,
+  __spreadProps,
   __spreadValues,
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";
@@ -102,35 +103,135 @@ init_react_import();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Loader/styles.module.css#css-module
 init_react_import();
-var styles_module_default2 = { "Loader": "_Loader_nacdm_13", "loader-animation": "_loader-animation_nacdm_1" };
+var styles_module_default2 = { "Loader": "_Loader_6933g_10", "loader-spin": "_loader-spin_6933g_1" };
 
 // components/Loader/index.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var getClassName2 = get_class_name_factory_default("Loader", styles_module_default2);
+var LoaderIcon = ({ size = 16 }) => /* @__PURE__ */ jsxs2(
+  "svg",
+  {
+    height: size,
+    strokeLinejoin: "round",
+    style: { color: "currentcolor" },
+    viewBox: "0 0 16 16",
+    width: size,
+    "aria-hidden": "true",
+    children: [
+      /* @__PURE__ */ jsxs2("g", { clipPath: "url(#editor-loader-clip)", children: [
+        /* @__PURE__ */ jsx2("path", { d: "M8 0V4", stroke: "currentColor", strokeWidth: "1.5" }),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M8 16V12",
+            opacity: "0.5",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M3.29773 1.52783L5.64887 4.7639",
+            opacity: "0.9",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M12.7023 1.52783L10.3511 4.7639",
+            opacity: "0.1",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M12.7023 14.472L10.3511 11.236",
+            opacity: "0.4",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M3.29773 14.472L5.64887 11.236",
+            opacity: "0.6",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M15.6085 5.52783L11.8043 6.7639",
+            opacity: "0.2",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M0.391602 10.472L4.19583 9.23598",
+            opacity: "0.7",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M15.6085 10.4722L11.8043 9.2361",
+            opacity: "0.3",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M0.391602 5.52783L4.19583 6.7639",
+            opacity: "0.8",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx2("defs", { children: /* @__PURE__ */ jsx2("clipPath", { id: "editor-loader-clip", children: /* @__PURE__ */ jsx2("rect", { fill: "white", height: "16", width: "16" }) }) })
+    ]
+  }
+);
 var Loader = (_a) => {
   var _b = _a, {
     color,
-    size = 16
+    size = 16,
+    className,
+    style
   } = _b, props = __objRest(_b, [
     "color",
-    "size"
+    "size",
+    "className",
+    "style"
   ]);
   return /* @__PURE__ */ jsx2(
-    "span",
-    __spreadValues({
-      className: getClassName2(),
-      style: {
-        width: size,
-        height: size,
-        color
-      },
+    "div",
+    __spreadProps(__spreadValues({
+      className: [getClassName2(), className].filter(Boolean).join(" "),
+      style: __spreadValues({ color }, style),
       "aria-label": "loading"
-    }, props)
+    }, props), {
+      children: /* @__PURE__ */ jsx2(LoaderIcon, { size })
+    })
   );
 };
 
 // components/IconButton/IconButton.tsx
-import { Fragment, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 var getClassName3 = get_class_name_factory_default("IconButton", IconButton_module_default);
 var IconButton = ({
   active = false,
@@ -147,7 +248,7 @@ var IconButton = ({
 }) => {
   const [loading, setLoading] = useState(false);
   const ElementType = href ? "a" : "button";
-  const el = /* @__PURE__ */ jsxs2(
+  const el = /* @__PURE__ */ jsxs3(
     ElementType,
     {
       className: getClassName3({
@@ -173,7 +274,7 @@ var IconButton = ({
       children: [
         /* @__PURE__ */ jsx3("span", { className: getClassName3("title"), children: title }),
         children,
-        loading && /* @__PURE__ */ jsxs2(Fragment, { children: [
+        loading && /* @__PURE__ */ jsxs3(Fragment, { children: [
           "\xA0\xA0",
           /* @__PURE__ */ jsx3(Loader, { size: 14 })
         ] })
@@ -349,7 +450,7 @@ function AlignSelectFallback() {
 // components/RichTextMenu/controls/AlignSelect/index.tsx
 import { jsx as jsx10 } from "react/jsx-runtime";
 var AlignSelectLoaded = lazy(
-  () => import("./loaded-HGQBTPJQ.mjs").then((m) => ({
+  () => import("./loaded-FZVSXAM7.mjs").then((m) => ({
     default: m.AlignSelectLoaded
   }))
 );
@@ -580,7 +681,7 @@ function HeadingSelectFallback() {
 // components/RichTextMenu/controls/HeadingSelect/index.tsx
 import { jsx as jsx22 } from "react/jsx-runtime";
 var HeadingSelectLoaded = lazy2(
-  () => import("./loaded-I7V7FYES.mjs").then((m) => ({
+  () => import("./loaded-PYHJ6TB5.mjs").then((m) => ({
     default: m.HeadingSelectLoaded
   }))
 );
@@ -612,14 +713,14 @@ function ListSelectFallback() {
 // components/RichTextMenu/controls/ListSelect/index.tsx
 import { jsx as jsx24 } from "react/jsx-runtime";
 var ListSelectLoaded = lazy3(
-  () => import("./loaded-GJMTZ3M5.mjs").then((m) => ({
+  () => import("./loaded-MSWM6QEM.mjs").then((m) => ({
     default: m.ListSelectLoaded
   }))
 );
 var ListSelect = () => /* @__PURE__ */ jsx24(Suspense3, { fallback: /* @__PURE__ */ jsx24(ListSelectFallback, {}), children: /* @__PURE__ */ jsx24(ListSelectLoaded, {}) });
 
 // components/RichTextMenu/inner.tsx
-import { jsx as jsx25, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs4 } from "react/jsx-runtime";
 var getClassName5 = get_class_name_factory_default("RichTextMenu", styles_module_default3);
 var DefaultMenu = ({ children }) => {
   return /* @__PURE__ */ jsx25(RichTextMenu, { children });
@@ -673,18 +774,18 @@ var LoadedRichTextMenuInner = ({
           editor,
           editorState,
           readOnly,
-          children: /* @__PURE__ */ jsxs3(Group2, { children: [
+          children: /* @__PURE__ */ jsxs4(Group2, { children: [
             /* @__PURE__ */ jsx25(Bold2, {}),
             /* @__PURE__ */ jsx25(Italic2, {}),
             /* @__PURE__ */ jsx25(Underline2, {})
           ] })
         }
-      ) : /* @__PURE__ */ jsxs3(Menu, { editor, editorState, readOnly, children: [
-        /* @__PURE__ */ jsxs3(Group2, { children: [
+      ) : /* @__PURE__ */ jsxs4(Menu, { editor, editorState, readOnly, children: [
+        /* @__PURE__ */ jsxs4(Group2, { children: [
           /* @__PURE__ */ jsx25(HeadingSelect, {}),
           /* @__PURE__ */ jsx25(ListSelect, {})
         ] }),
-        /* @__PURE__ */ jsxs3(Group2, { children: [
+        /* @__PURE__ */ jsxs4(Group2, { children: [
           /* @__PURE__ */ jsx25(Bold2, {}),
           /* @__PURE__ */ jsx25(Italic2, {}),
           /* @__PURE__ */ jsx25(Underline2, {})

package/dist/{chunk-AXB6UJ2P.mjs → chunk-WUEYD7ZN.mjs}

@@ -1,13 +1,13 @@
 import {
   EditorInner,
   LoadedRichTextMenu
-} from "./chunk-2A2HBRLV.mjs";
+} from "./chunk-NABX5FH7.mjs";
 import {
   ActionBar,
   IconButton,
   LoadedRichTextMenuInner,
   Loader
-} from "./chunk-OAOKQORI.mjs";
+} from "./chunk-UQHR5LFK.mjs";
 import {
   RichTextRenderFallback,
   SlotRender,
@@ -60,7 +60,7 @@ import {
   useRegisterFieldsSlice,
   useRegisterHistorySlice,
   useRegisterPermissionsSlice
-} from "./chunk-NUBRSWFJ.mjs";
+} from "./chunk-LFJGTSUB.mjs";
 import {
   getItem,
   insert,
@@ -226,9 +226,8 @@ var Button = (_a) => {
       href
     }, dataAttrs), {
       children: [
-        icon && /* @__PURE__ */ jsx("div", { className: getClassName("icon"), children: icon }),
-        children,
-        loading && /* @__PURE__ */ jsx("div", { className: getClassName("spinner"), children: /* @__PURE__ */ jsx(Loader, { size: 14 }) })
+        loading ? /* @__PURE__ */ jsx("div", { className: getClassName("spinner"), children: /* @__PURE__ */ jsx(Loader, { size: 14 }) }) : icon && /* @__PURE__ */ jsx("div", { className: getClassName("icon"), children: icon }),
+        children
       ]
     })
   );
@@ -2146,7 +2145,7 @@ EditorFallback.displayName = "EditorFallback";
 // components/AutoField/fields/RichtextField/index.tsx
 import { Fragment as Fragment3, jsx as jsx20 } from "react/jsx-runtime";
 var Editor = lazy(
-  () => import("./Editor-RY6D73N6.mjs").then((m) => ({
+  () => import("./Editor-ULH2S4LO.mjs").then((m) => ({
     default: m.Editor
   }))
 );
@@ -4698,7 +4697,7 @@ import {
 } from "react";
 import { jsx as jsx30 } from "react/jsx-runtime";
 var Editor2 = lazy2(
-  () => import("./Editor-RY6D73N6.mjs").then((m) => ({
+  () => import("./Editor-ULH2S4LO.mjs").then((m) => ({
     default: m.Editor
   }))
 );
@@ -5896,6 +5895,9 @@ var createEditorCommands = (appStore) => {
       ui: { itemSelector: { index: sel.index, zone: sel.zone } }
     });
   };
+  const publish = () => {
+    void getState().publish();
+  };
   return {
     insertComponent: insertComponent2,
     removeComponent,
@@ -5905,7 +5907,8 @@ var createEditorCommands = (appStore) => {
     updateProps,
     updateRoot,
     selectComponent,
-    scrollToComponent
+    scrollToComponent,
+    publish
   };
 };
 
@@ -5924,6 +5927,8 @@ var generateUseEditor = (store, getState, commands) => {
   const storeData = __spreadProps(__spreadValues({}, commands), {
     appState: makeStatePublic(store.state),
     config: store.config,
+    route: store.route,
+    isPublishing: store.isPublishing,
     dispatch: store.dispatch,
     getPermissions: store.permissions.getPermissions,
     refreshPermissions: store.permissions.refreshPermissions,
@@ -5958,7 +5963,9 @@ var convertToPickedStore = (store) => {
     dispatch: store.dispatch,
     permissions: store.permissions,
     history: store.history,
-    selectedItem: store.selectedItem
+    selectedItem: store.selectedItem,
+    route: store.route,
+    isPublishing: store.isPublishing
   };
 };
 var useRegisterUseEditorStore = (appStore) => {
@@ -7634,18 +7641,19 @@ var DEVICE_VIEWPORTS = {
   mobile: { width: 360, height: "auto", icon: "Smartphone", label: "Mobile" }
 };
 var UrlBar = () => {
-  const { routes, currentRoute, onRouteChange } = usePropsContext();
+  const { routes, route, onRouteChange } = usePropsContext();
   const chrome = useChromeConfig();
-  const showRoutePicker = !!routes && currentRoute !== void 0 && !!onRouteChange;
-  const [inputValue, setInputValue] = useState20(currentRoute != null ? currentRoute : "");
-  const lastSyncedPath = useRef13(currentRoute);
-  if (lastSyncedPath.current !== currentRoute) {
-    lastSyncedPath.current = currentRoute;
-    setInputValue(currentRoute != null ? currentRoute : "");
+  const currentKey = route == null ? void 0 : route.key;
+  const showRoutePicker = !!routes && currentKey !== void 0 && !!onRouteChange;
+  const [inputValue, setInputValue] = useState20(currentKey != null ? currentKey : "");
+  const lastSyncedPath = useRef13(currentKey);
+  if (lastSyncedPath.current !== currentKey) {
+    lastSyncedPath.current = currentKey;
+    setInputValue(currentKey != null ? currentKey : "");
   }
   const submit = (raw) => {
     const next = normalizeRoute(raw);
-    if (!next || next === currentRoute) return;
+    if (!next || next === currentKey) return;
     void (onRouteChange == null ? void 0 : onRouteChange(next));
   };
   if (!chrome.showUrlBar) return null;
@@ -7654,7 +7662,7 @@ var UrlBar = () => {
       Combobox,
       {
         items: routes,
-        value: currentRoute,
+        value: currentKey,
         onValueChange: (next) => {
           if (typeof next === "string") submit(next);
         },
@@ -8425,12 +8433,12 @@ var TopHeader = ({
   pluginItems
 }) => {
   const appStore = useAppStoreApi();
-  const { onPublish, currentRoute } = usePropsContext();
   const chrome = useChromeConfig();
   const back = useAppStore((s) => s.history.back);
   const forward = useAppStore((s) => s.history.forward);
   const hasFuture = useAppStore((s) => s.history.hasFuture());
   const hasPast = useAppStore((s) => s.history.hasPast());
+  const isPublishing = useAppStore((s) => s.isPublishing);
   const CustomHeaderActions = useAppStore(
     (s) => s.overrides.headerActions || DefaultOverride
   );
@@ -8482,11 +8490,8 @@ var TopHeader = ({
       /* @__PURE__ */ jsx53(CustomHeaderActions, { children: /* @__PURE__ */ jsx53(
         Button,
         {
-          onClick: () => {
-            const data = appStore.getState().state.data;
-            onPublish && onPublish(data, currentRoute);
-          },
-          children: "Publish"
+          onClick: () => appStore.getState().publish(),
+          children: isPublishing ? "Publishing\u2026" : "Publish"
         }
       ) })
     ] })
@@ -8908,6 +8913,7 @@ function EditorProvider({ children }) {
     data: initialData,
     ui: initialUi,
     onChange,
+    onPublish,
     permissions = {},
     plugins,
     overrides,
@@ -8918,7 +8924,8 @@ function EditorProvider({ children }) {
     onAction,
     fieldTransforms,
     fullScreenCanvas,
-    _experimentalVirtualization
+    _experimentalVirtualization,
+    route
   } = usePropsContext();
   const iframe = useMemo24(
     () => __spreadValues({
@@ -9028,7 +9035,9 @@ function EditorProvider({ children }) {
         _experimentalVirtualization: !!_experimentalVirtualization,
         onAction,
         metadata,
-        fieldTransforms: loadedFieldTransforms
+        fieldTransforms: loadedFieldTransforms,
+        route: route != null ? route : null,
+        onPublish
       };
     },
     [
@@ -9043,7 +9052,9 @@ function EditorProvider({ children }) {
       _experimentalVirtualization,
       onAction,
       metadata,
-      loadedFieldTransforms
+      loadedFieldTransforms,
+      route,
+      onPublish
     ]
   );
   const [appStore] = useState24(
@@ -9131,34 +9142,31 @@ var useApp = () => {
   const rrNavigate = useNavigate();
   const currentPath = location.pathname || "/";
   const isEditing = cfg.editorPath !== null && (currentPath === cfg.editorPath || currentPath.startsWith(`${cfg.editorPath}/`));
-  const matchRoute = isEditing ? stripPrefix(currentPath, cfg.editorPath) : currentPath;
-  const matched = useMemo25(() => {
+  const pagePath = isEditing ? stripPrefix(currentPath, cfg.editorPath) : currentPath;
+  const route = useMemo25(() => {
     const routeKeys = Object.keys(cfg.pages);
     if (routeKeys.length === 0) return null;
     const matches = matchRoutes(
       routeKeys.map((path) => ({ path })),
-      matchRoute
+      pagePath
     );
     if (!matches || matches.length === 0) return null;
     const last = matches[matches.length - 1];
-    const key = last.route.path;
     return {
-      route: key,
-      params: last.params,
-      data: cfg.pages[key]
+      key: last.route.path,
+      path: pagePath,
+      params: last.params
     };
-  }, [cfg.pages, matchRoute]);
+  }, [cfg.pages, pagePath]);
   const routes = useMemo25(() => Object.keys(cfg.pages), [cfg.pages]);
-  const navigate = (route) => {
-    const target = isEditing && cfg.editorPath ? `${cfg.editorPath}${route === "/" ? "" : route}` || "/" : route;
-    rrNavigate(target || "/");
+  const navigate = (target) => {
+    const next = isEditing && cfg.editorPath ? `${cfg.editorPath}${target === "/" ? "" : target}` || "/" : target;
+    rrNavigate(next || "/");
   };
   return __spreadProps(__spreadValues({}, cfg), {
     routes,
-    currentPath,
     isEditing,
-    matchRoute,
-    matched,
+    route,
     navigate
   });
 };
@@ -9252,9 +9260,14 @@ function EditorForKey({
   editorProps,
   children
 }) {
-  const { config, pages, routes, navigate } = useApp();
+  const { config, pages, routes, navigate, route } = useApp();
   const data = pages[routeKey];
   if (!data) return null;
+  const editorRoute = {
+    key: routeKey,
+    path: (route == null ? void 0 : route.key) === routeKey ? route.path : routeKey,
+    params: (route == null ? void 0 : route.key) === routeKey ? route.params : {}
+  };
   return /* @__PURE__ */ jsx56(
     Editor3,
     {
@@ -9281,7 +9294,7 @@ function EditorForKey({
       disableZoomControls: editorProps.disableZoomControls,
       _experimentalVirtualization: editorProps._experimentalVirtualization,
       routes,
-      currentRoute: routeKey,
+      route: editorRoute,
       onRouteChange: (next) => navigate(next),
       children
     },