@reacteditor/core 0.0.16 → 0.0.18

package/dist/index.d.ts

@@ -1,10 +1,10 @@
 import { D as Data, o as Field, p as FieldProps, C as Config, U as UserGenerics, O as OnAction, f as UiState, q as EditorChromeConfig, d as Plugin, e as Overrides, h as FieldTransforms, M as Metadata, I as IframeConfig, V as Viewports, a as Permissions, E as EditorAction, r as InitialHistory, b as ComponentData, l as DefaultComponentProps, m as DefaultRootFieldProps, c as ResolveDataTrigger, s as ItemSelector, t as PluginInternal } from './actions-BxLinRKD.js';
 export { u as Adaptor, A as AppState, v as ArrayField, w as ArrayState, x as AsFieldProps, B as BaseData, y as BaseField, z as CacheOpts, G as ColorField, g as ComponentConfig, J as ComponentConfigExtensions, K as ComponentConfigParams, L as ComponentDataMap, N as ComponentDataOptionalId, Q as ComponentMetadata, S as ConfigParams, j as Content, T as CustomField, X as CustomFieldRender, k as DefaultComponents, Y as DefaultRootProps, Z as DefaultRootRenderProps, _ as Direction, $ as DragAxis, a0 as EditorComponent, a1 as EditorContext, a2 as EditorMetadata, a3 as ExternalField, a4 as ExternalFieldWithAdaptor, a5 as ExtractConfigParams, a6 as ExtractField, a7 as FieldMetadata, a8 as FieldRenderFunctions, a9 as FieldTransformFn, aa as FieldTransformFnParams, F as Fields, H as History, ab as ItemWithId, ac as MappedItem, ad as NumberField, ae as ObjectField, af as OverrideKey, ag as RadioField, ah as RichText, i as RichtextField, ai as RootConfig, n as RootData, R as RootDataWithProps, aj as RootDataWithoutProps, ak as SelectField, al as Slot, am as SlotComponent, an as SlotField, ao as TextField, ap as TextareaField, aq as Viewport, ar as WithChildren, as as WithEditorProps, W as WithId, at as WithSlotProps, au as overrideKeys } from './actions-BxLinRKD.js';
 export { G as GetRoutePropsOptions, g as getRouteProps, m as migrate, r as resolveAllData, a as resolveRouteFromString, t as transformProps, w as walkTree } from './walk-tree-Clklc1Ql.js';
+import { O as OnPublish, E as EditorRoute, A as AppStore, G as GetPermissions, R as RefreshPermissions, H as HistorySlice } from './index-CYzc1n29.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import react__default, { ReactNode, SyntheticEvent, ReactElement, CSSProperties } from 'react';
-import { A as AppStore, G as GetPermissions, R as RefreshPermissions, H as HistorySlice } from './index-B_21fGrq.js';
 import '@tiptap/react';
 import '@tiptap/extension-blockquote';
 import '@tiptap/extension-bold';
@@ -34,8 +34,8 @@ type GlobalsMap = NonNullable<Data["globals"]>;
  * the picker entry in `<Editor routes>`. The same string flows through:
  *   - `pages={{ [routeKey]: pageData }}` declares the schema
  *   - `<Editor routes={[routeKey, ...]}>` powers the page picker
- *   - `<Editor currentPath={routeKey}>` marks the selected page
- *   - `onPublish(data, routeKey)` returns it for persistence
+ *   - `<Editor route={{ key: routeKey, path, params }}>` marks the selected page
+ *   - `onPublish({ data, route })` returns the descriptor for persistence
  *
  * Patterns follow path-to-regexp v8 / Express 5 syntax: "/", "/about",
  * "/products/:handle", "/docs/*splat".
@@ -93,13 +93,18 @@ declare function AutoField<ValueType = any, FieldType extends FieldNoLabel<Value
 
 /** A route key — the literal pattern used in `pages`. */
 type RouteKey = string;
-type AppMatched<Data = unknown> = {
-    /** The route key string — stable persistence identifier. */
-    route: RouteKey;
+/**
+ * Routing descriptor for the current page. Pure routing info — no page data
+ * (use `pages[route.key]` for the static initial, or `useEditor((s) => s.appState.data)`
+ * for the live editor data).
+ */
+type AppRoute = {
+    /** Route key/pattern, e.g. "/posts/:handle". */
+    key: RouteKey;
+    /** Canonical page URL with `editorPath` stripped, e.g. "/posts/abc". */
+    path: string;
     /** Concrete params extracted from the URL (e.g. { handle: "abc" }). */
     params: Readonly<Record<string, string | undefined>>;
-    /** The page's data. */
-    data: Data;
 };
 type AppConfigContext<UserConfig extends Config = Config, G extends UserGenerics<UserConfig> = UserGenerics<UserConfig>> = {
     config: UserConfig;
@@ -111,14 +116,10 @@ declare const appConfigContext: react.Context<AppConfigContext<Config, UserGener
 type AppContextValue<UserConfig extends Config = Config, G extends UserGenerics<UserConfig> = UserGenerics<UserConfig>> = AppConfigContext<UserConfig, G> & {
     /** All page route keys, in declaration order. */
     routes: RouteKey[];
-    /** Resolved current pathname from React Router. */
-    currentPath: string;
-    /** True when currentPath starts with editorPath. */
+    /** True when the live URL is under `editorPath`. */
     isEditing: boolean;
-    /** The URL relative to editorPath when isEditing — what pages are matched against. */
-    matchRoute: string;
-    /** Result of matching matchRoute against pages. Null = 404. */
-    matched: AppMatched<Partial<G["UserData"] | Data>> | null;
+    /** Resolved routing descriptor for the current page. Null = 404. */
+    route: AppRoute | null;
     /** Navigate to a route key. Wraps with editorPath when editing. */
     navigate: (route: RouteKey) => void;
 };
@@ -149,8 +150,8 @@ declare function AppProvider<UserConfig extends Config = Config, G extends UserG
 
 /** Editor pass-through props shared by <App> (default layout) and <App.Editor>. */
 type EditorPassthroughProps<UserConfig extends Config = Config, G extends UserGenerics<UserConfig> = UserGenerics<UserConfig>> = {
-    /** Called when the editor publishes. `route` is the schema route key. */
-    onPublish?: (data: G["UserData"], route?: string) => void;
+    /** Called when the editor publishes — receives `{ data, route }`. */
+    onPublish?: OnPublish<G["UserData"]>;
     onChange?: (data: G["UserData"]) => void;
     onAction?: OnAction<G["UserData"]>;
     ui?: Partial<UiState> & Partial<EditorChromeConfig>;
@@ -296,7 +297,7 @@ type EditorProps<UserConfig extends Config = Config, G extends UserGenerics<User
      */
     ui?: Partial<UiState> & Partial<EditorChromeConfig>;
     onChange?: (data: G["UserData"]) => void;
-    onPublish?: (data: G["UserData"], route?: string) => void;
+    onPublish?: OnPublish<G["UserData"]>;
     onAction?: OnAction<G["UserData"]>;
     permissions?: Partial<Permissions>;
     plugins?: Plugin<UserConfig>[];
@@ -315,7 +316,12 @@ type EditorProps<UserConfig extends Config = Config, G extends UserGenerics<User
     headerPath?: string;
     title?: ReactNode;
     routes?: Route[];
-    currentRoute?: string;
+    /**
+     * Routing descriptor for the page being edited. Mirrored into the editor
+     * store and exposed via `useEditor((s) => s.route)`. Set by `<App>` from
+     * `useApp().route`; usually omitted when mounting `<Editor>` standalone.
+     */
+    route?: EditorRoute;
     onRouteChange?: (path: string) => void | Promise<void>;
     viewports?: Viewports;
     iframe?: IframeConfig;
@@ -501,11 +507,20 @@ type EditorCommands = {
     updateRoot: (updater: Partial<DefaultRootFieldProps> | ((prev: DefaultRootFieldProps) => Partial<DefaultRootFieldProps>)) => void;
     selectComponent: (id: string | null) => void;
     scrollToComponent: (id: string) => void;
+    /**
+     * Invoke the user's `onPublish` callback with the current editor data and
+     * route descriptor. No-op when `onPublish` isn't set on the Editor.
+     */
+    publish: () => void;
 };
 
 type UseEditorData<UserConfig extends Config = Config, G extends UserGenerics<UserConfig> = UserGenerics<UserConfig>> = EditorCommands & {
     appState: G["UserPublicAppState"];
     config: UserConfig;
+    /** Routing descriptor for the page being edited. Null when standalone or 404. */
+    route: EditorRoute | null;
+    /** True while a `publish()` call is in flight. */
+    isPublishing: boolean;
     dispatch: AppStore["dispatch"];
     getPermissions: GetPermissions<UserConfig>;
     refreshPermissions: RefreshPermissions<UserConfig>;
@@ -557,4 +572,4 @@ declare const outlinePlugin: () => Plugin;
 
 declare const legacySideBarPlugin: () => Plugin;
 
-export { Action, ActionBar, App, type AppContextValue, type AppEditorProps, type AppMatched, type AppProps, AppProvider, type AppProviderProps, type AppRenderProps, type AppRouterVariant, AutoField, Button, ComponentData, ComponentList, Config, Data, DefaultComponentProps, DefaultRootFieldProps, Drawer, Editor, EditorAction, type EditorApi, EditorChromeConfig, type EditorCommands, Field, FieldLabel, FieldProps, FieldTransforms, type GlobalsMap, Group, IconButton, IframeConfig, InitialHistory, type InsertComponentArgs, Label, Metadata, type MoveDestination, OnAction, Overrides, type PageMetadata, type Parent, Permissions, Plugin, Render, ResolveDataTrigger, RichTextMenu, type Route, type RouteKey, Separator, UiState, type UseEditorData, UserGenerics, Viewports, appConfigContext, blocksPlugin, createUseEditor, fieldsPlugin, legacySideBarPlugin, outlinePlugin, pageMetadata, registerOverlayPortal, renderContext, setDeep, useApp, useEditor, useGetEditor, usePropsContext, useRouteParams, useStableValue };
+export { Action, ActionBar, App, type AppContextValue, type AppEditorProps, type AppProps, AppProvider, type AppProviderProps, type AppRenderProps, type AppRoute, type AppRouterVariant, AutoField, Button, ComponentData, ComponentList, Config, Data, DefaultComponentProps, DefaultRootFieldProps, Drawer, Editor, EditorAction, type EditorApi, EditorChromeConfig, type EditorCommands, EditorRoute, Field, FieldLabel, FieldProps, FieldTransforms, type GlobalsMap, Group, IconButton, IframeConfig, InitialHistory, type InsertComponentArgs, Label, Metadata, type MoveDestination, OnAction, OnPublish, Overrides, type PageMetadata, type Parent, Permissions, Plugin, Render, ResolveDataTrigger, RichTextMenu, type Route, type RouteKey, Separator, UiState, type UseEditorData, UserGenerics, Viewports, appConfigContext, blocksPlugin, createUseEditor, fieldsPlugin, legacySideBarPlugin, outlinePlugin, pageMetadata, registerOverlayPortal, renderContext, setDeep, useApp, useEditor, useGetEditor, usePropsContext, useRouteParams, useStableValue };

package/dist/index.js

@@ -160,19 +160,29 @@ var init_get_class_name_factory = __esm({
     "use strict";
     init_react_import();
     import_classnames = __toESM(require_classnames());
-    getClassNameFactory = (rootClass, styles2, config = { baseClass: "" }) => (options = {}) => {
+    getClassNameFactory = (rootClass, styles2, config = { baseClass: "" }) => (options = {}, modifiers) => {
       if (typeof options === "string") {
         const descendant = options;
-        const style = styles2[`${rootClass}-${descendant}`];
+        const baseKey = `${rootClass}-${descendant}`;
+        const style = styles2[baseKey];
+        if (modifiers) {
+          const prefixedModifiers = {};
+          for (let modifier in modifiers) {
+            prefixedModifiers[styles2[`${baseKey}--${modifier}`]] = modifiers[modifier];
+          }
+          return config.baseClass + (0, import_classnames.default)(__spreadValues({
+            [style]: !!style
+          }, prefixedModifiers));
+        }
         if (style) {
-          return config.baseClass + styles2[`${rootClass}-${descendant}`] || "";
+          return config.baseClass + style;
         }
         return "";
       } else if (typeof options === "object") {
-        const modifiers = options;
+        const modifiers2 = options;
         const prefixedModifiers = {};
-        for (let modifier in modifiers) {
-          prefixedModifiers[styles2[`${rootClass}--${modifier}`]] = modifiers[modifier];
+        for (let modifier in modifiers2) {
+          prefixedModifiers[styles2[`${rootClass}--${modifier}`]] = modifiers2[modifier];
         }
         const c = styles2[rootClass];
         return config.baseClass + (0, import_classnames.default)(__spreadValues({
@@ -3245,7 +3255,19 @@ var init_store = __esm({
           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),
@@ -3590,12 +3612,12 @@ var init_styles_module2 = __esm({
     "use strict";
     init_react_import();
     init_css_module_data3();
-    styles_module_default4 = { "Loader": "_Loader_nacdm_13", "loader-animation": "_loader-animation_nacdm_1" };
+    styles_module_default4 = { "Loader": "_Loader_6933g_10", "loader-spin": "_loader-spin_6933g_1" };
   }
 });
 
 // components/Loader/index.tsx
-var import_jsx_runtime3, getClassName2, Loader;
+var import_jsx_runtime3, getClassName2, LoaderIcon, Loader;
 var init_Loader = __esm({
   "components/Loader/index.tsx"() {
     "use strict";
@@ -3604,25 +3626,125 @@ var init_Loader = __esm({
     init_styles_module2();
     import_jsx_runtime3 = require("react/jsx-runtime");
     getClassName2 = get_class_name_factory_default("Loader", styles_module_default4);
+    LoaderIcon = ({ size = 16 }) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+      "svg",
+      {
+        height: size,
+        strokeLinejoin: "round",
+        style: { color: "currentcolor" },
+        viewBox: "0 0 16 16",
+        width: size,
+        "aria-hidden": "true",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("g", { clipPath: "url(#editor-loader-clip)", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M8 0V4", stroke: "currentColor", strokeWidth: "1.5" }),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+              "path",
+              {
+                d: "M8 16V12",
+                opacity: "0.5",
+                stroke: "currentColor",
+                strokeWidth: "1.5"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+              "path",
+              {
+                d: "M3.29773 1.52783L5.64887 4.7639",
+                opacity: "0.9",
+                stroke: "currentColor",
+                strokeWidth: "1.5"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+              "path",
+              {
+                d: "M12.7023 1.52783L10.3511 4.7639",
+                opacity: "0.1",
+                stroke: "currentColor",
+                strokeWidth: "1.5"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+              "path",
+              {
+                d: "M12.7023 14.472L10.3511 11.236",
+                opacity: "0.4",
+                stroke: "currentColor",
+                strokeWidth: "1.5"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+              "path",
+              {
+                d: "M3.29773 14.472L5.64887 11.236",
+                opacity: "0.6",
+                stroke: "currentColor",
+                strokeWidth: "1.5"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+              "path",
+              {
+                d: "M15.6085 5.52783L11.8043 6.7639",
+                opacity: "0.2",
+                stroke: "currentColor",
+                strokeWidth: "1.5"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+              "path",
+              {
+                d: "M0.391602 10.472L4.19583 9.23598",
+                opacity: "0.7",
+                stroke: "currentColor",
+                strokeWidth: "1.5"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+              "path",
+              {
+                d: "M15.6085 10.4722L11.8043 9.2361",
+                opacity: "0.3",
+                stroke: "currentColor",
+                strokeWidth: "1.5"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+              "path",
+              {
+                d: "M0.391602 5.52783L4.19583 6.7639",
+                opacity: "0.8",
+                stroke: "currentColor",
+                strokeWidth: "1.5"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("clipPath", { id: "editor-loader-clip", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("rect", { fill: "white", height: "16", width: "16" }) }) })
+        ]
+      }
+    );
     Loader = (_a) => {
       var _b = _a, {
         color,
-        size = 16
+        size = 16,
+        className,
+        style
       } = _b, props = __objRest(_b, [
         "color",
-        "size"
+        "size",
+        "className",
+        "style"
       ]);
       return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-        "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__ */ (0, import_jsx_runtime3.jsx)(LoaderIcon, { size })
+        })
       );
     };
   }
@@ -6946,9 +7068,8 @@ var Button = (_a) => {
       href
     }, dataAttrs), {
       children: [
-        icon && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: getClassName10("icon"), children: icon }),
-        children,
-        loading && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: getClassName10("spinner"), children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Loader, { size: 14 }) })
+        loading ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: getClassName10("spinner"), children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Loader, { size: 14 }) }) : icon && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: getClassName10("icon"), children: icon }),
+        children
       ]
     })
   );
@@ -12797,6 +12918,9 @@ var createEditorCommands = (appStore) => {
       ui: { itemSelector: { index: sel.index, zone: sel.zone } }
     });
   };
+  const publish = () => {
+    void getState().publish();
+  };
   return {
     insertComponent: insertComponent2,
     removeComponent,
@@ -12806,7 +12930,8 @@ var createEditorCommands = (appStore) => {
     updateProps,
     updateRoot,
     selectComponent,
-    scrollToComponent
+    scrollToComponent,
+    publish
   };
 };
 
@@ -12825,6 +12950,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,
@@ -12859,7 +12986,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) => {
@@ -13301,18 +13430,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] = (0, import_react87.useState)(currentRoute != null ? currentRoute : "");
-  const lastSyncedPath = (0, import_react87.useRef)(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] = (0, import_react87.useState)(currentKey != null ? currentKey : "");
+  const lastSyncedPath = (0, import_react87.useRef)(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;
@@ -13321,7 +13451,7 @@ var UrlBar = () => {
       Combobox,
       {
         items: routes,
-        value: currentRoute,
+        value: currentKey,
         onValueChange: (next) => {
           if (typeof next === "string") submit(next);
         },
@@ -14155,12 +14285,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
   );
@@ -14212,11 +14342,8 @@ var TopHeader = ({
       /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(CustomHeaderActions, { children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
         Button,
         {
-          onClick: () => {
-            const data = appStore.getState().state.data;
-            onPublish && onPublish(data, currentRoute);
-          },
-          children: "Publish"
+          onClick: () => appStore.getState().publish(),
+          children: isPublishing ? "Publishing\u2026" : "Publish"
         }
       ) })
     ] })
@@ -14638,6 +14765,7 @@ function EditorProvider({ children }) {
     data: initialData,
     ui: initialUi,
     onChange,
+    onPublish,
     permissions = {},
     plugins,
     overrides,
@@ -14648,7 +14776,8 @@ function EditorProvider({ children }) {
     onAction,
     fieldTransforms,
     fullScreenCanvas,
-    _experimentalVirtualization
+    _experimentalVirtualization,
+    route
   } = usePropsContext();
   const iframe = (0, import_react95.useMemo)(
     () => __spreadValues({
@@ -14758,7 +14887,9 @@ function EditorProvider({ children }) {
         _experimentalVirtualization: !!_experimentalVirtualization,
         onAction,
         metadata,
-        fieldTransforms: loadedFieldTransforms
+        fieldTransforms: loadedFieldTransforms,
+        route: route != null ? route : null,
+        onPublish
       };
     },
     [
@@ -14773,7 +14904,9 @@ function EditorProvider({ children }) {
       _experimentalVirtualization,
       onAction,
       metadata,
-      loadedFieldTransforms
+      loadedFieldTransforms,
+      route,
+      onPublish
     ]
   );
   const [appStore] = (0, import_react95.useState)(
@@ -14866,34 +14999,31 @@ var useApp = () => {
   const rrNavigate = (0, import_react_router.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 = (0, import_react97.useMemo)(() => {
+  const pagePath = isEditing ? stripPrefix(currentPath, cfg.editorPath) : currentPath;
+  const route = (0, import_react97.useMemo)(() => {
     const routeKeys = Object.keys(cfg.pages);
     if (routeKeys.length === 0) return null;
     const matches = (0, import_react_router.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 = (0, import_react97.useMemo)(() => 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
   });
 };
@@ -14977,9 +15107,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__ */ (0, import_jsx_runtime94.jsx)(
     Editor4,
     {
@@ -15006,7 +15141,7 @@ function EditorForKey({
       disableZoomControls: editorProps.disableZoomControls,
       _experimentalVirtualization: editorProps._experimentalVirtualization,
       routes,
-      currentRoute: routeKey,
+      route: editorRoute,
       onRouteChange: (next) => navigate(next),
       children
     },

package/dist/index.mjs

@@ -25,8 +25,8 @@ import {
   usePropsContext,
   useRouteParams,
   useStableValue
-} from "./chunk-3NSI5XES.mjs";
-import "./chunk-5QKQ3LQJ.mjs";
+} from "./chunk-WUEYD7ZN.mjs";
+import "./chunk-NABX5FH7.mjs";
 import {
   Action,
   ActionBar,
@@ -35,22 +35,22 @@ import {
   Label,
   RichTextMenu,
   Separator
-} from "./chunk-Q667J2EG.mjs";
-import "./chunk-RQZQMS6E.mjs";
+} from "./chunk-UQHR5LFK.mjs";
+import "./chunk-HR67L662.mjs";
 import {
   getRouteProps,
   migrate,
   resolveAllData,
   resolveRouteFromString,
   transformProps
-} from "./chunk-4L7H4JV4.mjs";
+} from "./chunk-AD67LVXW.mjs";
 import "./chunk-6QJ2HF4O.mjs";
-import "./chunk-RGC274VM.mjs";
-import "./chunk-TG2KTWSB.mjs";
-import "./chunk-JHURG5NN.mjs";
+import "./chunk-DGIVBKSJ.mjs";
+import "./chunk-IOAYKTDH.mjs";
+import "./chunk-LFJGTSUB.mjs";
 import "./chunk-M4JDRFYB.mjs";
 import "./chunk-FTVOCMGV.mjs";
-import "./chunk-Y2EFNT5P.mjs";
+import "./chunk-DQU3HIP4.mjs";
 import {
   walkTree
 } from "./chunk-JIXMPJZA.mjs";

package/dist/internal.d.mts

@@ -1,6 +1,6 @@
 import { Reducer } from 'react';
 import { D as Data, A as AppState, O as OnAction, P as PrivateAppState, E as EditorAction } from './actions-BxLinRKD.mjs';
-import { A as AppStore } from './index-BZRpxcwy.mjs';
+import { A as AppStore } from './index-CUe2XTb6.mjs';
 import '@tiptap/react';
 import '@tiptap/extension-blockquote';
 import '@tiptap/extension-bold';

package/dist/internal.d.ts

@@ -1,6 +1,6 @@
 import { Reducer } from 'react';
 import { D as Data, A as AppState, O as OnAction, P as PrivateAppState, E as EditorAction } from './actions-BxLinRKD.js';
-import { A as AppStore } from './index-B_21fGrq.js';
+import { A as AppStore } from './index-CYzc1n29.js';
 import '@tiptap/react';
 import '@tiptap/extension-blockquote';
 import '@tiptap/extension-bold';

package/dist/{loaded-ZQCRSG65.mjs → loaded-FZVSXAM7.mjs}

@@ -1,14 +1,14 @@
 import {
   useAlignOptions
-} from "./chunk-RGC274VM.mjs";
+} from "./chunk-DGIVBKSJ.mjs";
 import {
   AlignLeft,
   SelectControl,
   useControlContext
-} from "./chunk-JHURG5NN.mjs";
+} from "./chunk-LFJGTSUB.mjs";
 import "./chunk-M4JDRFYB.mjs";
 import "./chunk-FTVOCMGV.mjs";
-import "./chunk-Y2EFNT5P.mjs";
+import "./chunk-DQU3HIP4.mjs";
 import "./chunk-JIXMPJZA.mjs";
 import {
   init_react_import

package/dist/{loaded-DUBT6SP5.mjs → loaded-MSWM6QEM.mjs}

@@ -1,14 +1,14 @@
 import {
   useListOptions
-} from "./chunk-RQZQMS6E.mjs";
+} from "./chunk-HR67L662.mjs";
 import {
   List,
   SelectControl,
   useControlContext
-} from "./chunk-JHURG5NN.mjs";
+} from "./chunk-LFJGTSUB.mjs";
 import "./chunk-M4JDRFYB.mjs";
 import "./chunk-FTVOCMGV.mjs";
-import "./chunk-Y2EFNT5P.mjs";
+import "./chunk-DQU3HIP4.mjs";
 import "./chunk-JIXMPJZA.mjs";
 import {
   init_react_import