canopycms 0.0.63 → 0.0.64

package/dist/editor/components/EditorFooter.js

@@ -12,4 +12,3 @@ import { Group, Paper, Text } from '@mantine/core';
 export function EditorFooter({ children }) {
     return (_jsx(Paper, { withBorder: true, radius: 0, shadow: "sm", px: "md", py: "xs", style: { position: 'fixed', left: 0, right: 0, bottom: 0, zIndex: 40 }, children: children ?? (_jsxs(Group, { gap: "md", justify: "center", children: [_jsx(Text, { size: "xs", c: "dimmed", children: "Terms" }), _jsx(Text, { size: "xs", c: "dimmed", children: "Privacy" }), _jsx(Text, { size: "xs", c: "dimmed", children: "\u00A9 CanopyCMS" })] })) }));
 }
-//# sourceMappingURL=EditorFooter.js.map

package/dist/editor/components/EditorHeader.d.ts

@@ -1,7 +1,7 @@
-import type { OperatingMode } from '../../operating-mode';
-import type { BranchStatus } from '../../types';
-import type { EditorEntry } from '../Editor';
-import type { LogicalPath } from '../../paths/types';
+import type { OperatingMode } from '../../operating-mode/index.js';
+import type { BranchStatus } from '../../types.js';
+import type { EditorEntry } from '../Editor.js';
+import type { LogicalPath } from '../../paths/types.js';
 /**
  * Props for the EditorHeader component.
  */
@@ -180,4 +180,3 @@ export interface EditorHeaderProps {
  * ```
  */
 export declare const EditorHeader: import("react").ForwardRefExoticComponent<EditorHeaderProps & import("react").RefAttributes<HTMLDivElement>>;
-//# sourceMappingURL=EditorHeader.d.ts.map

package/dist/editor/components/EditorHeader.js

@@ -182,4 +182,3 @@ export const EditorHeader = forwardRef(function EditorHeader({ siteTitle, siteSu
                                         ? `Branch "${branchName}" is submitted for review and locked for edits. Use Withdraw Branch above to resume editing.`
                                         : `Branch "${branchName}" is ${branchStatus} — content is read-only.` }), _jsx(Button, { size: "xs", variant: "light", color: "yellow", onClick: onBranchManagerOpen, children: "Manage Branches" })] }) }))] }) }));
 });
-//# sourceMappingURL=EditorHeader.js.map

package/dist/editor/components/EditorSidebar.d.ts

@@ -1,4 +1,4 @@
-import type { PaneLayout } from '../EditorPanes';
+import type { PaneLayout } from '../EditorPanes.js';
 /**
  * Props for the EditorSidebar component.
  */
@@ -84,4 +84,3 @@ export interface EditorSidebarProps {
  * ```
  */
 export declare function EditorSidebar({ layout, highlightEnabled, sidebarWidth, headerHeight, footerHeight, onLayoutChange, onHighlightToggle, onPermissionManagerOpen, onGroupManagerOpen, onMediaLibraryOpen, onSystemHealthOpen, AccountComponent, onAccountClick, onLogoutClick, }: EditorSidebarProps): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=EditorSidebar.d.ts.map

package/dist/editor/components/EditorSidebar.js

@@ -36,4 +36,3 @@ export function EditorSidebar({ layout, highlightEnabled, sidebarWidth, headerHe
             gap: 8,
         }, children: [_jsxs(Stack, { gap: "sm", align: "center", style: { width: '100%', paddingTop: 6 }, children: [_jsx(ActionIcon, { variant: "subtle", size: "lg", radius: "md", "aria-label": "Toggle layout", onClick: () => onLayoutChange(layout === 'side' ? 'stacked' : 'side'), children: layout === 'side' ? _jsx(IconLayoutRows, { size: 18 }) : _jsx(IconLayoutColumns, { size: 18 }) }), _jsx(ActionIcon, { variant: highlightEnabled ? 'filled' : 'subtle', color: highlightEnabled ? 'brand' : 'gray', size: "lg", radius: "md", "aria-pressed": highlightEnabled, "aria-label": "Toggle highlights", onClick: onHighlightToggle, children: _jsx(IconSquareDashed, { size: 18 }) })] }), _jsxs(Stack, { gap: "xs", align: "center", children: [_jsxs(Menu, { shadow: "md", width: 200, position: "left", children: [_jsx(Menu.Target, { children: _jsx(ActionIcon, { variant: "subtle", size: "lg", radius: "md", "aria-label": "Settings", children: _jsx(IconSettings, { size: 18 }) }) }), _jsxs(Menu.Dropdown, { children: [_jsx(Menu.Label, { children: "Settings" }), _jsx(Menu.Item, { onClick: onPermissionManagerOpen, children: "Manage Permissions" }), _jsx(Menu.Item, { onClick: onGroupManagerOpen, children: "Manage Groups" }), _jsx(Menu.Item, { leftSection: _jsx(IconPhoto, { size: 14 }), onClick: onMediaLibraryOpen, children: "Media library" }), onSystemHealthOpen && (_jsx(Menu.Item, { leftSection: _jsx(IconActivity, { size: 14 }), onClick: onSystemHealthOpen, children: "System health" }))] })] }), AccountComponent ? (_jsx(AccountComponent, {})) : (_jsxs(_Fragment, { children: [onAccountClick && (_jsx(ActionIcon, { variant: "subtle", size: "lg", radius: "md", "aria-label": "Account", onClick: onAccountClick, children: _jsx(IconUserCircle, { size: 18 }) })), onLogoutClick && (_jsx(ActionIcon, { variant: "subtle", size: "lg", radius: "md", "aria-label": "Sign out", onClick: onLogoutClick, children: _jsx(IconLogout, { size: 18 }) }))] }))] })] }));
 }
-//# sourceMappingURL=EditorSidebar.js.map

package/dist/editor/components/EntryCreateModal.d.ts

@@ -32,4 +32,3 @@ export interface EntryCreateModalProps {
     existingSlugs?: Set<string>;
 }
 export declare function EntryCreateModal({ isOpen, collectionLabel, entryTypes, selectedEntryTypeName, onCreate, onClose, isCreating, error, existingSlugs, }: EntryCreateModalProps): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=EntryCreateModal.d.ts.map

package/dist/editor/components/EntryCreateModal.js

@@ -11,6 +11,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useEffect, useRef } from 'react';
 import { Modal, Stack, TextInput, Group, Button, Alert, Text, Select } from '@mantine/core';
 import { IconAlertCircle } from '@tabler/icons-react';
+import { parseSlug } from '../../paths/validation.js';
 /** Slug the form is seeded with each time the modal opens. */
 const DEFAULT_SLUG = 'untitled';
 export function EntryCreateModal({ isOpen, collectionLabel, entryTypes, selectedEntryTypeName, onCreate, onClose, isCreating = false, error = null, existingSlugs, }) {
@@ -49,20 +50,31 @@ export function EntryCreateModal({ isOpen, collectionLabel, entryTypes, selected
         wasOpenRef.current = isOpen;
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [isOpen]);
-    // Validate slug format
+    // Validate slug format.
+    //
+    // Delegates to `parseSlug` rather than restating its rule: the server refuses to CREATE an
+    // entry whose slug fails it (api/content.ts and ContentStore.write's [SLUG] guards), and the
+    // static build fails outright on one that slipped through (static/index.ts's
+    // assertRoutableSlugs). A second, hand-maintained copy of the charset/length/separator rules
+    // here could only ever drift out of agreement with the boundary that actually decides.
+    //
+    // Imported from '../../paths/validation.js' directly, NOT the `paths` barrel, which pulls
+    // node:fs into the browser bundle (pnpm lint:bundle enforces this).
     const validateSlug = (value) => {
         if (!value.trim()) {
             return 'Slug cannot be empty';
         }
-        if (value.includes('/')) {
-            return 'Slug cannot contain slashes';
-        }
-        // Simple validation - lowercase, alphanumeric + hyphens
-        if (!/^[a-z0-9][-a-z0-9]*$/.test(value)) {
-            return 'Slug must start with letter/number and contain only lowercase letters, numbers, and hyphens';
+        const parsed = parseSlug(value);
+        if (!parsed.ok) {
+            return parsed.error;
         }
-        if (value.length > 64) {
-            return 'Slug must be 64 characters or less';
+        // `parseSlug` lowercases before testing, so it accepts 'My-Post' and hands back 'my-post'.
+        // Keep the field itself strict: the value typed here is what the duplicate check below and
+        // the create request are keyed on, so silently normalizing would let 'My-Post' sail past a
+        // collision with an existing 'my-post' and land as a 409 from the server instead of an
+        // inline message here.
+        if (parsed.slug !== value) {
+            return 'Slug must be lowercase';
         }
         if (existingSlugs?.has(value)) {
             return 'An entry with this slug already exists';
@@ -93,4 +105,3 @@ export function EntryCreateModal({ isOpen, collectionLabel, entryTypes, selected
                         label: et.label || et.name,
                     })), required: true, disabled: isCreating, searchable: true, placeholder: "Select entry type..." })), entryTypes.length === 1 && (_jsxs(Text, { size: "sm", c: "dimmed", children: ["Entry type: ", _jsx("strong", { children: typeLabel })] })), _jsx(TextInput, { label: "Slug", description: "URL-friendly identifier (lowercase, alphanumeric + hyphens)", value: slug, onChange: (e) => handleSlugChange(e.currentTarget.value), error: validationError, placeholder: "my-entry-slug", required: true, disabled: isCreating, "data-autofocus": true, "data-testid": "entry-slug-input" }), _jsxs(Text, { size: "xs", c: "dimmed", children: ["Preview: ", _jsx("code", { children: slug })] }), _jsxs(Group, { justify: "flex-end", gap: "sm", children: [_jsx(Button, { variant: "subtle", onClick: onClose, disabled: isCreating, children: "Cancel" }), _jsx(Button, { onClick: handleCreate, loading: isCreating, disabled: !canCreate, "data-testid": "create-entry-submit", children: "Create" })] })] }) }));
 }
-//# sourceMappingURL=EntryCreateModal.js.map

package/dist/editor/components/RenameEntryModal.d.ts

@@ -15,4 +15,3 @@ export interface RenameEntryModalProps {
     error?: string | null;
 }
 export declare function RenameEntryModal({ isOpen, entryLabel, currentSlug, onSave, onClose, isSaving, error, }: RenameEntryModalProps): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=RenameEntryModal.d.ts.map

package/dist/editor/components/RenameEntryModal.js

@@ -59,4 +59,3 @@ export function RenameEntryModal({ isOpen, entryLabel, currentSlug, onSave, onCl
     const canSave = !validationError && newSlug.trim() !== '' && newSlug !== currentSlug && !isSaving;
     return (_jsx(Modal, { opened: isOpen, onClose: onClose, title: _jsx(Text, { fw: 600, children: "Rename Entry" }), size: "md", closeOnClickOutside: !isSaving, closeOnEscape: !isSaving, children: _jsxs(Stack, { gap: "md", "data-testid": "rename-entry-modal", children: [error && (_jsx(Alert, { icon: _jsx(IconAlertCircle, { size: 16 }), color: "red", variant: "light", children: error })), _jsxs(Text, { size: "sm", c: "dimmed", children: ["Renaming \"", entryLabel, "\""] }), _jsx(TextInput, { label: "Slug", description: "URL-friendly identifier (lowercase, alphanumeric + hyphens)", value: newSlug, onChange: (e) => handleSlugChange(e.currentTarget.value), error: validationError, placeholder: "my-entry-slug", required: true, disabled: isSaving, "data-autofocus": true, "data-testid": "rename-slug-input" }), _jsxs(Text, { size: "xs", c: "dimmed", children: ["Current: ", _jsx("code", { children: currentSlug }), newSlug !== currentSlug && (_jsxs(_Fragment, { children: [' → ', "New: ", _jsx("code", { children: newSlug })] }))] }), _jsxs(Group, { justify: "flex-end", gap: "sm", children: [_jsx(Button, { variant: "subtle", onClick: onClose, disabled: isSaving, children: "Cancel" }), _jsx(Button, { onClick: handleSave, loading: isSaving, disabled: !canSave, "data-testid": "rename-entry-submit", children: "Rename" })] })] }) }));
 }
-//# sourceMappingURL=RenameEntryModal.js.map

package/dist/editor/components/UserBadge.d.ts

@@ -1,5 +1,5 @@
-import type { UserSearchResult } from '../../auth/types';
-import type { CanopyUserId } from '../../types';
+import type { UserSearchResult } from '../../auth/types.js';
+import type { CanopyUserId } from '../../types.js';
 export interface UserBadgeProps {
     /** User ID to display */
     userId: CanopyUserId;
@@ -25,4 +25,3 @@ export interface UserBadgeProps {
     cachedUser?: UserSearchResult;
 }
 export declare const UserBadge: React.FC<UserBadgeProps>;
-//# sourceMappingURL=UserBadge.d.ts.map

package/dist/editor/components/UserBadge.js

@@ -90,4 +90,3 @@ export const UserBadge = ({ userId, getUserMetadata, variant = 'avatar-name', sh
     // No badge wrapper - just wrap with tooltip if needed
     return showEmailTooltip && variant !== 'full' ? (_jsx(Tooltip, { label: userMetadata.email, children: content })) : (content);
 };
-//# sourceMappingURL=UserBadge.js.map

package/dist/editor/components/index.d.ts

@@ -1,4 +1,3 @@
-export * from './EditorFooter';
-export * from './EditorHeader';
-export * from './EditorSidebar';
-//# sourceMappingURL=index.d.ts.map
+export * from './EditorFooter.js';
+export * from './EditorHeader.js';
+export * from './EditorSidebar.js';

package/dist/editor/components/index.js

@@ -3,4 +3,3 @@
 export * from './EditorFooter.js';
 export * from './EditorHeader.js';
 export * from './EditorSidebar.js';
-//# sourceMappingURL=index.js.map

package/dist/editor/context/ApiClientContext.d.ts

@@ -8,18 +8,25 @@
  * - No global mutable state
  */
 import React from 'react';
-import { createApiClient } from '../../api';
+import { createApiClient } from '../../api/index.js';
 export type ApiClient = ReturnType<typeof createApiClient>;
 export interface ApiClientProviderProps {
     children: React.ReactNode;
     /** Optional custom client for testing */
     client?: ApiClient;
+    /**
+     * Deployment prefix the host app is served under (`CanopyClientConfig.basePath`, e.g.
+     * `/preview-123`). Joined onto the default `/api/canopycms` base via `joinUrlPrefix` so every
+     * request the editor makes lands on the actual route instead of the un-prefixed root. Ignored
+     * when `client` is supplied directly. Unset/empty is a no-op (same as today).
+     */
+    basePath?: string;
 }
 /**
  * Provider that creates and provides the API client.
  * Use the client prop to inject a mock client for testing.
  */
-export declare function ApiClientProvider({ children, client }: ApiClientProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function ApiClientProvider({ children, client, basePath }: ApiClientProviderProps): import("react/jsx-runtime").JSX.Element;
 /**
  * Hook to access the API client.
  * Must be used within an ApiClientProvider.
@@ -30,4 +37,3 @@ export declare function useApiClient(): ApiClient;
  * Useful for conditional usage or graceful degradation.
  */
 export declare function useOptionalApiClient(): ApiClient | null;
-//# sourceMappingURL=ApiClientContext.d.ts.map

package/dist/editor/context/ApiClientContext.js

@@ -11,15 +11,20 @@ import { jsx as _jsx } from "react/jsx-runtime";
  */
 import { createContext, useContext, useMemo } from 'react';
 import { createApiClient } from '../../api/index.js';
+import { joinUrlPrefix } from '../../utils/url-prefix.js';
 const ApiClientContext = createContext(null);
 /**
  * Provider that creates and provides the API client.
  * Use the client prop to inject a mock client for testing.
  */
-export function ApiClientProvider({ children, client }) {
+export function ApiClientProvider({ children, client, basePath }) {
+    // Memoized on identity, not just for cost: several consumers now list the client in their
+    // effect deps (useUserContext, useReferenceResolution, ReferenceField), so a fresh client each
+    // render would turn those one-shot fetches into a loop. A caller injecting an inline
+    // `client={createApiClient()}` would reintroduce exactly that.
     const apiClient = useMemo(() => {
-        return client ?? createApiClient();
-    }, [client]);
+        return client ?? createApiClient({ baseUrl: joinUrlPrefix(basePath, '/api/canopycms') });
+    }, [client, basePath]);
     return _jsx(ApiClientContext.Provider, { value: apiClient, children: children });
 }
 /**
@@ -40,4 +45,3 @@ export function useApiClient() {
 export function useOptionalApiClient() {
     return useContext(ApiClientContext);
 }
-//# sourceMappingURL=ApiClientContext.js.map

package/dist/editor/context/AssetContext.d.ts

@@ -18,8 +18,32 @@ export interface AssetContextValue {
 }
 export interface AssetContextProviderProps extends AssetContextValue {
     children: React.ReactNode;
+    /**
+     * `CanopyClientConfig.basePath` - the deployment prefix the host app is served under. Used only
+     * when `baseUrl` is unset.
+     */
+    basePath?: string;
 }
-export declare function AssetContextProvider({ baseUrl, children }: AssetContextProviderProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * `baseUrl` (`media.publicBaseUrl`) wins; `basePath` is the fallback.
+ *
+ * They are ALTERNATIVES, never composed: `publicBaseUrl` is validated absolute-only, so it names
+ * another origin serving `/assets` at THAT origin's root, and a deployment `basePath` cannot apply
+ * on top of it. Where the two differ is topology, not precedence - see the asset-mount table in
+ * the README.
+ *
+ * The fallback exists because `publicBaseUrl` cannot express a bare path (it is validated
+ * absolute-only), so without it the editor's thumbnails, previews and crop images stay
+ * root-relative on a basePath deployment where Next serves `/assets` — and 404.
+ *
+ * KNOWN LIMITATION: the fallback assumes that topology, and consults none. On a CloudFront/CDK
+ * deployment a basePath does NOT move the asset space (behaviors are anchored at the distribution
+ * root), so prefixing is wrong there — the requests still resolve, because `withCanopy`'s
+ * auto-prefixed `/assets/:path*` rewrite catches them and serves through the CMS Lambda, but they
+ * bypass the CDN cache and the dedicated transform Lambda. The workaround is real though not
+ * obvious: set `media.publicBaseUrl` to the distribution origin, which takes precedence here.
+ * Tracked in `.claude/future-tasks/editor-asset-mount-topology.md`.
+ */
+export declare function AssetContextProvider({ baseUrl, basePath, children }: AssetContextProviderProps): import("react/jsx-runtime").JSX.Element;
 /** Safe to call outside a provider - returns `{ baseUrl: undefined }` (root-relative URLs). */
 export declare function useAssetContext(): AssetContextValue;
-//# sourceMappingURL=AssetContext.d.ts.map

package/dist/editor/context/AssetContext.js

@@ -15,12 +15,32 @@ import { jsx as _jsx } from "react/jsx-runtime";
  */
 import { createContext, useContext, useMemo } from 'react';
 const AssetContext = createContext({});
-export function AssetContextProvider({ baseUrl, children }) {
-    const value = useMemo(() => ({ baseUrl }), [baseUrl]);
+/**
+ * `baseUrl` (`media.publicBaseUrl`) wins; `basePath` is the fallback.
+ *
+ * They are ALTERNATIVES, never composed: `publicBaseUrl` is validated absolute-only, so it names
+ * another origin serving `/assets` at THAT origin's root, and a deployment `basePath` cannot apply
+ * on top of it. Where the two differ is topology, not precedence - see the asset-mount table in
+ * the README.
+ *
+ * The fallback exists because `publicBaseUrl` cannot express a bare path (it is validated
+ * absolute-only), so without it the editor's thumbnails, previews and crop images stay
+ * root-relative on a basePath deployment where Next serves `/assets` — and 404.
+ *
+ * KNOWN LIMITATION: the fallback assumes that topology, and consults none. On a CloudFront/CDK
+ * deployment a basePath does NOT move the asset space (behaviors are anchored at the distribution
+ * root), so prefixing is wrong there — the requests still resolve, because `withCanopy`'s
+ * auto-prefixed `/assets/:path*` rewrite catches them and serves through the CMS Lambda, but they
+ * bypass the CDN cache and the dedicated transform Lambda. The workaround is real though not
+ * obvious: set `media.publicBaseUrl` to the distribution origin, which takes precedence here.
+ * Tracked in `.claude/future-tasks/editor-asset-mount-topology.md`.
+ */
+export function AssetContextProvider({ baseUrl, basePath, children }) {
+    const resolved = baseUrl ?? basePath;
+    const value = useMemo(() => ({ baseUrl: resolved }), [resolved]);
     return _jsx(AssetContext.Provider, { value: value, children: children });
 }
 /** Safe to call outside a provider - returns `{ baseUrl: undefined }` (root-relative URLs). */
 export function useAssetContext() {
     return useContext(AssetContext);
 }
-//# sourceMappingURL=AssetContext.js.map

package/dist/editor/context/EditorStateContext.d.ts

@@ -11,7 +11,7 @@
  * - Preview data and loading state
  */
 import React from 'react';
-import type { FormValue } from '../FormRenderer';
+import type { FormValue } from '../FormRenderer.js';
 export interface LoadingState {
     branches: boolean;
     entries: boolean;
@@ -90,4 +90,3 @@ export declare function useEditorPreview(): {
     setData: (data: FormValue) => void;
     setLoading: (loading: FormValue) => void;
 };
-//# sourceMappingURL=EditorStateContext.d.ts.map

package/dist/editor/context/EditorStateContext.js

@@ -140,4 +140,3 @@ export function useEditorPreview() {
         setLoading: actions.setPreviewLoading,
     };
 }
-//# sourceMappingURL=EditorStateContext.js.map

package/dist/editor/context/SWRProvider.d.ts

@@ -28,4 +28,3 @@ export interface SWRProviderProps {
     children: React.ReactNode;
 }
 export declare function SWRProvider({ children }: SWRProviderProps): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=SWRProvider.d.ts.map

package/dist/editor/context/SWRProvider.js

@@ -9,4 +9,3 @@ export function SWRProvider({ children }) {
             dedupingInterval: 2000,
         }, children: children }));
 }
-//# sourceMappingURL=SWRProvider.js.map

package/dist/editor/context/index.d.ts

@@ -17,8 +17,7 @@
  * </ApiClientProvider>
  * ```
  */
-export { ApiClientProvider, useApiClient, useOptionalApiClient, type ApiClient, type ApiClientProviderProps, } from './ApiClientContext';
-export { AssetContextProvider, useAssetContext, type AssetContextValue, type AssetContextProviderProps, } from './AssetContext';
-export { SWRProvider, type SWRProviderProps } from './SWRProvider';
-export { EditorStateProvider, useEditorState, useEditorLoading, useEditorModals, useEditorPreview, type EditorState, type EditorStateActions, type EditorStateContextValue, type EditorStateProviderProps, type LoadingState, type ModalState, type PreviewState, } from './EditorStateContext';
-//# sourceMappingURL=index.d.ts.map
+export { ApiClientProvider, useApiClient, useOptionalApiClient, type ApiClient, type ApiClientProviderProps, } from './ApiClientContext.js';
+export { AssetContextProvider, useAssetContext, type AssetContextValue, type AssetContextProviderProps, } from './AssetContext.js';
+export { SWRProvider, type SWRProviderProps } from './SWRProvider.js';
+export { EditorStateProvider, useEditorState, useEditorLoading, useEditorModals, useEditorPreview, type EditorState, type EditorStateActions, type EditorStateContextValue, type EditorStateProviderProps, type LoadingState, type ModalState, type PreviewState, } from './EditorStateContext.js';

package/dist/editor/context/index.js

@@ -21,4 +21,3 @@ export { ApiClientProvider, useApiClient, useOptionalApiClient, } from './ApiCli
 export { AssetContextProvider, useAssetContext, } from './AssetContext.js';
 export { SWRProvider } from './SWRProvider.js';
 export { EditorStateProvider, useEditorState, useEditorLoading, useEditorModals, useEditorPreview, } from './EditorStateContext.js';
-//# sourceMappingURL=index.js.map

package/dist/editor/editor-config.d.ts

@@ -1,5 +1,5 @@
-import type { CanopyConfig, FlatSchemaItem } from '../config';
-import type { EditorCollection } from './Editor';
+import type { CanopyConfig, FlatSchemaItem } from '../config/index.js';
+import type { EditorCollection } from './Editor.js';
 /**
  * Build hierarchical editor collections from the flattened schema.
  * Uses logicalPath as IDs to match API responses.
@@ -11,4 +11,3 @@ import type { EditorCollection } from './Editor';
  */
 export declare const buildEditorCollections: (flatSchema: FlatSchemaItem[]) => EditorCollection[];
 export declare const buildPreviewBaseByCollection: (config: Pick<CanopyConfig, "contentRoot">, flatSchema: FlatSchemaItem[]) => Record<string, string>;
-//# sourceMappingURL=editor-config.d.ts.map

package/dist/editor/editor-config.js

@@ -76,4 +76,3 @@ export const buildPreviewBaseByCollection = (config, flatSchema) => {
     }
     return map;
 };
-//# sourceMappingURL=editor-config.js.map

package/dist/editor/editor-utils.d.ts

@@ -1,23 +1,38 @@
-import type { CollectionItem, ListEntriesResponse } from '../api/entries';
-import type { ContentFormat, FlatSchemaItem } from '../config';
-import type { FormValue } from './FormRenderer';
-import type { EditorEntry, EditorCollection } from './Editor';
+import type { CollectionItem, ListEntriesResponse } from '../api/entries.js';
+import type { ContentFormat, FlatSchemaItem } from '../config/index.js';
+import type { FormValue } from './FormRenderer.js';
+import type { EditorEntry, EditorCollection } from './Editor.js';
 import type { TreeNodeData } from '@mantine/core';
-import { normalizeCollectionPath } from '../paths/normalize';
+import { normalizeCollectionPath } from '../paths/normalize.js';
 export { normalizeCollectionPath };
 export interface PreviewContext {
     branchName?: string;
     previewBaseByCollection?: Record<string, string>;
 }
 export declare const encodeSlug: (value?: string) => string;
+/**
+ * Builds the preview iframe `src` for an entry, prefixed with the deployment `basePath`
+ * (`CanopyClientConfig.basePath`, e.g. `/preview-123`) when configured.
+ *
+ * This matters twice: the raw `<iframe src>` (`PreviewFrame` in preview-bridge.tsx) 404s without
+ * the prefix when the host app is served under a basePath, AND `resolvePreviewPath` there compares
+ * the SAME string against `window.location.pathname` -- which browsers report WITH the basePath
+ * included -- so an unprefixed `previewSrc` also breaks draft sync / click-to-focus even when the
+ * iframe itself happens to resolve. One prefix, applied uniformly here, fixes both.
+ *
+ * Applied via `joinUrlPrefix`, so it's a no-op when `basePath` is unset (default), and it passes an
+ * already-absolute `previewSrc` (a fully custom, e.g. cross-origin, override) through untouched --
+ * matching `joinUrlPrefix`'s own absolute-URL passthrough rule.
+ */
 export declare const buildPreviewSrc: (entry: {
     collectionPath?: string;
     collectionName?: string;
     slug?: string;
     itemType?: string;
     previewSrc?: string;
-}, { branchName, previewBaseByCollection, contentRoot }: PreviewContext & {
+}, context: PreviewContext & {
     contentRoot?: string;
+    basePath?: string;
 }) => string;
 export declare const normalizeContentPayload: (raw: unknown) => FormValue;
 export declare const buildWritePayload: (entry: {
@@ -27,12 +42,10 @@ export declare const buildWritePayload: (entry: {
 }, value: FormValue) => FormValue;
 interface BuildEntriesFromListParams {
     response: ListEntriesResponse;
-    branchName: string;
     resolvePreviewSrc: (entry: Pick<CollectionItem, 'collectionPath' | 'collectionName' | 'slug' | 'entryType'>) => string;
-    contentRoot: string;
     flatSchema: FlatSchemaItem[];
 }
-export declare const buildEntriesFromListResponse: ({ response, branchName, resolvePreviewSrc, contentRoot, flatSchema, }: BuildEntriesFromListParams) => EditorEntry[];
+export declare const buildEntriesFromListResponse: ({ response, resolvePreviewSrc, flatSchema, }: BuildEntriesFromListParams) => EditorEntry[];
 /**
  * Builds a map of collection IDs to their labels for breadcrumb display.
  * Recursively walks through nested collections to build a flat map.
@@ -89,4 +102,3 @@ export declare const buildBreadcrumbSegments: (currentEntry: EditorEntry | undef
  * ```
  */
 export declare const calculatePathToEntry: (entryPath: string | undefined, treeData: TreeNodeData[]) => Record<string, boolean>;
-//# sourceMappingURL=editor-utils.d.ts.map

package/dist/editor/editor-utils.js

@@ -1,13 +1,33 @@
 // Import directly from normalize to avoid pulling in server-only branch.ts
 import { normalizeCollectionPath } from '../paths/normalize.js';
+import { isIndexSlug } from '../utils/entry-url.js';
 import { isDataOnlyFormat } from '../utils/format.js';
+import { joinUrlPrefix } from '../utils/url-prefix.js';
 export { normalizeCollectionPath };
+/**
+ * The slug portion of a preview URL, or '' for an index entry.
+ *
+ * An index entry's URL is its COLLECTION's path -- the same collapse `computeEntryUrl`,
+ * `listEntries` and `defaultBuildPath` apply. Without it this builder pointed the preview iframe
+ * at `/x/index`, which `resolveUrlPathCandidates` deliberately refuses to resolve, so the host
+ * app answered the editor's own preview with notFound().
+ *
+ * Kept separate from `computeEntryUrl` rather than delegating wholesale because this builder must
+ * percent-encode each segment and must NOT lowercase (a preview base is adopter-supplied and
+ * case-sensitive). Only the index decision is shared -- which is the part that drifted.
+ */
+const encodePreviewSlug = (slug) => (isIndexSlug(slug) ? '' : encodeSlug(slug));
 export const encodeSlug = (value) => (value ?? '')
     .split('/')
     .filter(Boolean)
     .map((segment) => encodeURIComponent(segment))
     .join('/');
-export const buildPreviewSrc = (entry, { branchName, previewBaseByCollection, contentRoot }) => {
+/**
+ * Builds the (unprefixed) preview URL -- see `buildPreviewSrc` below, which wraps this with the
+ * deployment `basePath`. Split out so that prefixing happens exactly once, at the end, uniformly
+ * across every branch (including the `entry.previewSrc` escape hatch).
+ */
+const buildRawPreviewSrc = (entry, { branchName, previewBaseByCollection, contentRoot }) => {
     if (entry.previewSrc)
         return entry.previewSrc;
     const appendBranch = (url) => {
@@ -38,16 +58,33 @@ export const buildPreviewSrc = (entry, { branchName, previewBaseByCollection, co
         const collectionPath = entry.collectionPath
             ? normalizeCollectionPath(entry.collectionPath, contentRoot)
             : '';
-        const encoded = encodeSlug(entry.slug);
+        const encoded = encodePreviewSlug(entry.slug);
         const segments = [collectionPath, encoded].filter(Boolean);
         const url = segments.length > 0 ? `/${segments.join('/')}` : '/';
         return appendBranch(url);
     }
     const trimmed = base.endsWith('/') ? base.slice(0, -1) : base;
-    const encoded = encodeSlug(entry.slug);
+    const encoded = encodePreviewSlug(entry.slug);
     const url = encoded ? `${trimmed}/${encoded}` : trimmed || '/';
     return appendBranch(url);
 };
+/**
+ * Builds the preview iframe `src` for an entry, prefixed with the deployment `basePath`
+ * (`CanopyClientConfig.basePath`, e.g. `/preview-123`) when configured.
+ *
+ * This matters twice: the raw `<iframe src>` (`PreviewFrame` in preview-bridge.tsx) 404s without
+ * the prefix when the host app is served under a basePath, AND `resolvePreviewPath` there compares
+ * the SAME string against `window.location.pathname` -- which browsers report WITH the basePath
+ * included -- so an unprefixed `previewSrc` also breaks draft sync / click-to-focus even when the
+ * iframe itself happens to resolve. One prefix, applied uniformly here, fixes both.
+ *
+ * Applied via `joinUrlPrefix`, so it's a no-op when `basePath` is unset (default), and it passes an
+ * already-absolute `previewSrc` (a fully custom, e.g. cross-origin, override) through untouched --
+ * matching `joinUrlPrefix`'s own absolute-URL passthrough rule.
+ */
+export const buildPreviewSrc = (entry, context) => {
+    return joinUrlPrefix(context.basePath, buildRawPreviewSrc(entry, context));
+};
 export const normalizeContentPayload = (raw) => {
     const candidate = raw;
     const data = candidate && 'format' in candidate && 'data' in candidate
@@ -83,7 +120,7 @@ export const buildWritePayload = (entry, value) => {
         body: typeof body === 'string' ? body : '',
     };
 };
-export const buildEntriesFromListResponse = ({ response, branchName, resolvePreviewSrc, contentRoot, flatSchema, }) => {
+export const buildEntriesFromListResponse = ({ response, resolvePreviewSrc, flatSchema, }) => {
     return response.entries.map((entry) => {
         // Resolve schema from flatSchema using parentPath + name
         let schema = [];
@@ -95,17 +132,12 @@ export const buildEntriesFromListResponse = ({ response, branchName, resolvePrev
                 schema = entryTypeItem.schema;
             }
         }
-        const isRootEntry = entry.collectionPath === contentRoot;
-        const apiPath = isRootEntry
-            ? `/api/canopycms/${branchName}/content/${encodeURIComponent(entry.slug)}`
-            : `/api/canopycms/${branchName}/content/${encodeURIComponent(entry.collectionPath)}/${encodeURIComponent(entry.slug)}`;
         return {
             path: entry.logicalPath,
             contentId: entry.contentId,
             label: entry.title || entry.slug || entry.collectionName || entry.collectionPath,
             status: entry.exists === false ? 'missing' : (entry.entryType ?? 'entry'),
             schema: schema,
-            apiPath,
             previewSrc: resolvePreviewSrc(entry),
             collectionPath: entry.collectionPath,
             collectionName: entry.collectionName,
@@ -245,4 +277,3 @@ export const calculatePathToEntry = (entryPath, treeData) => {
     findAndMarkPath(treeData, []);
     return pathToExpand;
 };
-//# sourceMappingURL=editor-utils.js.map

package/dist/editor/fields/BlockField.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { BlockConfig, FieldConfig } from '../../config';
+import type { BlockConfig, FieldConfig } from '../../config/index.js';
 export interface BlockInstance {
     template: string;
     value: Record<string, unknown>;
@@ -16,4 +16,3 @@ export interface BlockFieldProps {
 }
 export declare const BlockField: React.FC<BlockFieldProps>;
 export default BlockField;
-//# sourceMappingURL=BlockField.d.ts.map

package/dist/editor/fields/BlockField.js

@@ -84,4 +84,3 @@ export const BlockField = ({ label, templates, value, onChange, renderField, pat
                             }) }) }) })] }) }));
 };
 export default BlockField;
-//# sourceMappingURL=BlockField.js.map

package/dist/editor/fields/CodeField.d.ts

@@ -9,4 +9,3 @@ export interface CodeFieldProps {
 }
 export declare const CodeField: React.FC<CodeFieldProps>;
 export default CodeField;
-//# sourceMappingURL=CodeField.d.ts.map

package/dist/editor/fields/CodeField.js

@@ -8,4 +8,3 @@ export const CodeField = ({ id, label, value, onChange, language, dataCanopyFiel
     return (_jsx(Textarea, { id: inputId, label: label, value: value, onChange: (e) => onChange(e.currentTarget.value), placeholder: language ? `Code (${language})` : 'Code', autosize: true, minRows: 6, size: "sm", "data-canopy-field": dataCanopyField, styles: { input: { fontFamily: 'Menlo, Consolas, monospace' } } }));
 };
 export default CodeField;
-//# sourceMappingURL=CodeField.js.map

package/dist/editor/fields/DateTimeField.d.ts

@@ -43,4 +43,3 @@ export declare function datetimeLocalValueToIso(local: string): string;
  */
 export declare const DateTimeField: React.FC<DateTimeFieldProps>;
 export default DateTimeField;
-//# sourceMappingURL=DateTimeField.d.ts.map

package/dist/editor/fields/DateTimeField.js

@@ -63,4 +63,3 @@ export const DateTimeField = ({ id, label, value, onChange, dataCanopyField, })
     return (_jsx(Input.Wrapper, { id: inputId, label: label, size: "sm", children: _jsx(Input, { type: "datetime-local", step: 1, size: "sm", value: isoToDatetimeLocalValue(value), onChange: (e) => onChange(datetimeLocalValueToIso(e.currentTarget.value)), "data-canopy-field": dataCanopyField }) }));
 };
 export default DateTimeField;
-//# sourceMappingURL=DateTimeField.js.map

package/dist/editor/fields/ImageField.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { ImageFieldValue } from '../../config';
+import type { ImageFieldValue } from '../../config/index.js';
 export interface ImageFieldErrors {
     src?: string;
     alt?: string;
@@ -19,4 +19,3 @@ export interface ImageFieldProps {
 }
 export declare const ImageField: React.FC<ImageFieldProps>;
 export default ImageField;
-//# sourceMappingURL=ImageField.d.ts.map

package/dist/editor/fields/ImageField.js

@@ -124,4 +124,3 @@ export const ImageField = ({ id, label, value, onChange, aspect, altOptional, da
                         }, onError: () => setPreviewFailed(true) })), errors?.src && (_jsx(Text, { size: "xs", c: "red", children: errors.src })), _jsx(TextInput, { id: inputId, ref: altInputRef, label: "Alt text", required: !altOptional, value: value.alt, onChange: (event) => handleAltChange(event.currentTarget.value), error: errors?.alt, size: "sm", "data-testid": `image-field-alt-${dataCanopyField}` }), _jsxs(Group, { gap: "xs", children: [_jsx(Button, { variant: "light", size: "xs", onClick: () => setPickerOpen(true), "data-testid": `image-field-replace-${dataCanopyField}`, children: "Replace" }), aspectRatio !== undefined && (_jsx(Button, { variant: "light", size: "xs", onClick: () => setCropRequest({ kind: 'existing' }), "data-testid": `image-field-crop-${dataCanopyField}`, children: "Crop" })), _jsx(Button, { variant: "subtle", color: "red", size: "xs", onClick: handleRemove, "data-testid": `image-field-remove-${dataCanopyField}`, children: "Remove" })] }), errors?.crop && (_jsx(Text, { size: "xs", c: "red", children: errors.crop }))] })), _jsx(MediaLibrary, { opened: pickerOpen, onClose: () => setPickerOpen(false), mode: "picker", onSelect: handleAssetReady }), aspectRatio !== undefined && (_jsx(CropStep, { opened: cropRequest !== null, onClose: () => setCropRequest(null), imageSrc: cropImageSrc, aspect: aspectRatio, initialCrop: cropInitial, onConfirm: handleCropConfirm }))] }));
 };
 export default ImageField;
-//# sourceMappingURL=ImageField.js.map

package/dist/editor/fields/InlineGroupField.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import type { FieldConfig } from '../../config';
-import type { RenderField } from './ObjectField';
+import type { FieldConfig } from '../../config/index.js';
+import type { RenderField } from './ObjectField.js';
 export interface InlineGroupFieldProps {
     label?: string;
     description?: string;
@@ -14,4 +14,3 @@ export interface InlineGroupFieldProps {
 }
 export declare const InlineGroupField: React.FC<InlineGroupFieldProps>;
 export default InlineGroupField;
-//# sourceMappingURL=InlineGroupField.d.ts.map