@elytracms/studio 0.0.38 → 0.0.39

package/dist/components/cms/discard-draft.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"discard-draft.js","sourceRoot":"","sources":["../../../src/components/cms/discard-draft.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAA;AAuBhE,MAAM,UAAU,kBAAkB,CAAC,KAWlC;IACC,IAAI,CAAC,KAAK,CAAC,UAAU,IAAI,CAAC,KAAK,CAAC,SAAS;QAAE,OAAO,QAAQ,CAAA;IAC1D,IAAI,KAAK,CAAC,YAAY;QAAE,OAAO,gBAAgB,CAAA;IAC/C,IAAI,KAAK,CAAC,iBAAiB,KAAK,SAAS;QAAE,OAAO,SAAS,CAAA;IAC3D,OAAO,sBAAsB,CAAC,KAAK,CAAC,UAAU,EAAE,KAAK,CAAC,iBAAiB,EAAE,KAAK,CAAC,KAAK,CAAC;QACnF,CAAC,CAAC,YAAY;QACd,CAAC,CAAC,OAAO,CAAA;AACb,CAAC","sourcesContent":["import { documentsSemanticEqual } from '@elytracms/core/content'\nimport type { CmsDocument, CollectionDef } from '@elytracms/core/cms-core'\n\n/**\n * EC-316 — the \"Discard changes\" header action's enablement, as one pure\n * decision. Discarding reverts the draft to exactly the published content (via\n * the EC-298 restore machinery), so it is offered iff there is a published\n * version to revert TO and the draft actually differs from it:\n *\n * - `hidden`        — the rail can't discard at all (no publish/versions\n *                     capability) or the document isn't published: there is no\n *                     published content to revert to, so no menu item.\n * - `view-read-only`— viewing the Published snapshot (EC-226): the draft isn't\n *                     the active view, so the item is disabled with a hint.\n * - `loading`       — the version history hasn't resolved yet; disabled.\n * - `up-to-date`    — the draft SEMANTICALLY equals the published snapshot\n *                     (`documentsSemanticEqual`, the SAME comparator the\n *                     Versions pane's publish gate uses, EC-298 — so the two\n *                     surfaces never contradict); nothing to discard, disabled.\n * - `ready`         — a published version exists and the draft differs: enabled.\n */\nexport type DiscardDraftStatus = 'hidden' | 'view-read-only' | 'loading' | 'up-to-date' | 'ready'\n\nexport function discardDraftStatus(input: {\n  /** The rail can publish AND has version history (both required to discard). */\n  canDiscard: boolean\n  /** The document IS published (version pointer set). */\n  published: boolean\n  /** The editor is viewing the read-only Published snapshot (EC-226). */\n  viewReadOnly: boolean\n  /** The pinned published version's snapshot; `undefined` while loading / none pinned. */\n  publishedSnapshot: CmsDocument | undefined\n  collection: CollectionDef\n  draft: CmsDocument\n}): DiscardDraftStatus {\n  if (!input.canDiscard || !input.published) return 'hidden'\n  if (input.viewReadOnly) return 'view-read-only'\n  if (input.publishedSnapshot === undefined) return 'loading'\n  return documentsSemanticEqual(input.collection, input.publishedSnapshot, input.draft)\n    ? 'up-to-date'\n    : 'ready'\n}\n"]}

package/dist/components/cms/document-staging.d.ts

@@ -0,0 +1,7 @@
+import type { CmsDocument } from '@elytracms/core/cms-core';
+/** Stage a document for the next `CmsProvider` mount of `projectId` (playground only). */
+export declare function stageDocument(projectId: string, doc: CmsDocument): void;
+/** The documents staged for `projectId` (a copy; non-destructive). */
+export declare function stagedDocuments(projectId: string | undefined): CmsDocument[];
+/** Test seam: drop all staged documents. */
+export declare function clearStagedDocuments(): void;

package/dist/components/cms/document-staging.js

@@ -0,0 +1,44 @@
+import { isPlaygroundMode } from '@elytracms/studio/lib/persistence';
+/**
+ * EC-320 — a tiny cross-mount handoff for a freshly created document.
+ *
+ * The "Use in document…" transfer creates a draft in the Components view, then
+ * navigates to that document's CMS editor — a FRESH `CmsProvider` mount. In
+ * **Convex** mode the new provider re-hydrates from persistence (the transfer's
+ * `saveDocument` already upserted it), so nothing more is needed. In the
+ * **playground**, though, `CmsSessionGate` renders synchronously with `null`
+ * (fixtures) and never reads back the seeded adapter, so a doc created in one
+ * mount is invisible to the next.
+ *
+ * This module bridges exactly that gap: the transfer STAGES the built document,
+ * and the next `CmsProvider` for the same project merges any staged docs into its
+ * initial set (staged wins by id). It is deliberately **playground-only** — under
+ * Convex, hydration is the source of truth and staging would risk shadowing a
+ * newer persisted revision. Reads are non-destructive (StrictMode-safe: a double
+ * mount sees the same doc both times); the buffer is session-scoped dev state.
+ */
+const staged = new Map();
+function docKey(doc) {
+    return `${doc.collection}/${doc.id}`;
+}
+/** Stage a document for the next `CmsProvider` mount of `projectId` (playground only). */
+export function stageDocument(projectId, doc) {
+    if (!isPlaygroundMode())
+        return;
+    const list = staged.get(projectId) ?? [];
+    // Replace any prior staging of the same doc key so a re-transfer wins.
+    const next = list.filter((d) => docKey(d) !== docKey(doc));
+    next.push(doc);
+    staged.set(projectId, next);
+}
+/** The documents staged for `projectId` (a copy; non-destructive). */
+export function stagedDocuments(projectId) {
+    if (projectId === undefined)
+        return [];
+    return (staged.get(projectId) ?? []).map((d) => structuredClone(d));
+}
+/** Test seam: drop all staged documents. */
+export function clearStagedDocuments() {
+    staged.clear();
+}
+//# sourceMappingURL=document-staging.js.map

package/dist/components/cms/document-staging.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"document-staging.js","sourceRoot":"","sources":["../../../src/components/cms/document-staging.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAA;AAEpE;;;;;;;;;;;;;;;;;GAiBG;AAEH,MAAM,MAAM,GAAG,IAAI,GAAG,EAAyB,CAAA;AAE/C,SAAS,MAAM,CAAC,GAAgB;IAC9B,OAAO,GAAG,GAAG,CAAC,UAAU,IAAI,GAAG,CAAC,EAAE,EAAE,CAAA;AACtC,CAAC;AAED,0FAA0F;AAC1F,MAAM,UAAU,aAAa,CAAC,SAAiB,EAAE,GAAgB;IAC/D,IAAI,CAAC,gBAAgB,EAAE;QAAE,OAAM;IAC/B,MAAM,IAAI,GAAG,MAAM,CAAC,GAAG,CAAC,SAAS,CAAC,IAAI,EAAE,CAAA;IACxC,uEAAuE;IACvE,MAAM,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,MAAM,CAAC,GAAG,CAAC,CAAC,CAAA;IAC1D,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;IACd,MAAM,CAAC,GAAG,CAAC,SAAS,EAAE,IAAI,CAAC,CAAA;AAC7B,CAAC;AAED,sEAAsE;AACtE,MAAM,UAAU,eAAe,CAAC,SAA6B;IAC3D,IAAI,SAAS,KAAK,SAAS;QAAE,OAAO,EAAE,CAAA;IACtC,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAA;AACrE,CAAC;AAED,4CAA4C;AAC5C,MAAM,UAAU,oBAAoB;IAClC,MAAM,CAAC,KAAK,EAAE,CAAA;AAChB,CAAC","sourcesContent":["import type { CmsDocument } from '@elytracms/core/cms-core'\nimport { isPlaygroundMode } from '@elytracms/studio/lib/persistence'\n\n/**\n * EC-320 — a tiny cross-mount handoff for a freshly created document.\n *\n * The \"Use in document…\" transfer creates a draft in the Components view, then\n * navigates to that document's CMS editor — a FRESH `CmsProvider` mount. In\n * **Convex** mode the new provider re-hydrates from persistence (the transfer's\n * `saveDocument` already upserted it), so nothing more is needed. In the\n * **playground**, though, `CmsSessionGate` renders synchronously with `null`\n * (fixtures) and never reads back the seeded adapter, so a doc created in one\n * mount is invisible to the next.\n *\n * This module bridges exactly that gap: the transfer STAGES the built document,\n * and the next `CmsProvider` for the same project merges any staged docs into its\n * initial set (staged wins by id). It is deliberately **playground-only** — under\n * Convex, hydration is the source of truth and staging would risk shadowing a\n * newer persisted revision. Reads are non-destructive (StrictMode-safe: a double\n * mount sees the same doc both times); the buffer is session-scoped dev state.\n */\n\nconst staged = new Map<string, CmsDocument[]>()\n\nfunction docKey(doc: CmsDocument): string {\n  return `${doc.collection}/${doc.id}`\n}\n\n/** Stage a document for the next `CmsProvider` mount of `projectId` (playground only). */\nexport function stageDocument(projectId: string, doc: CmsDocument): void {\n  if (!isPlaygroundMode()) return\n  const list = staged.get(projectId) ?? []\n  // Replace any prior staging of the same doc key so a re-transfer wins.\n  const next = list.filter((d) => docKey(d) !== docKey(doc))\n  next.push(doc)\n  staged.set(projectId, next)\n}\n\n/** The documents staged for `projectId` (a copy; non-destructive). */\nexport function stagedDocuments(projectId: string | undefined): CmsDocument[] {\n  if (projectId === undefined) return []\n  return (staged.get(projectId) ?? []).map((d) => structuredClone(d))\n}\n\n/** Test seam: drop all staged documents. */\nexport function clearStagedDocuments(): void {\n  staged.clear()\n}\n"]}

package/dist/components/cms/field-connection.d.ts

@@ -0,0 +1,22 @@
+import type { Locale } from '@elytracms/core/cms-core';
+import type { FieldConnection } from '@elytracms/studio/lib/locale';
+/**
+ * EC-318 — the per-field localization CONNECTION affordance, replacing EC-176's
+ * passive "showing EN" text. On a localized field in a non-base locale it shows,
+ * quietly, whether the field FOLLOWS the base locale (connected) or OWNS a
+ * translation (diverged), with the matching action:
+ *   • connected → a "Follows EN" chip + "Fill from EN" (seed a translatable copy);
+ *   • diverged  → a "Translated" chip + "Reset to EN" (confirmed — discards it).
+ * Typing directly into a connected field also diverges it (the caller's write path).
+ *
+ * Connection state is DERIVED (a per-locale key present ⇒ diverged), never stored.
+ * The caller renders this ONLY in an editable, non-base-locale view — so it is
+ * absent on the base locale, on non-localized fields, and in read-only/Published.
+ */
+export declare function FieldConnectionControl({ connection, fieldName, locale, onFillFromBase, onResetToBase, }: {
+    connection: FieldConnection;
+    fieldName: string;
+    locale: Locale;
+    onFillFromBase: () => void;
+    onResetToBase: () => void;
+}): import("react").JSX.Element;

package/dist/components/cms/field-connection.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Languages, Link2, RotateCcw } from 'lucide-react';
+import { useState } from 'react';
+import { Badge, Button, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, Row, } from '@elytracms/studio/ui';
+import { translate } from '@elytracms/studio/lib/i18n';
+import { localeChipLabel } from '@elytracms/studio/lib/locale';
+/**
+ * EC-318 — the per-field localization CONNECTION affordance, replacing EC-176's
+ * passive "showing EN" text. On a localized field in a non-base locale it shows,
+ * quietly, whether the field FOLLOWS the base locale (connected) or OWNS a
+ * translation (diverged), with the matching action:
+ *   • connected → a "Follows EN" chip + "Fill from EN" (seed a translatable copy);
+ *   • diverged  → a "Translated" chip + "Reset to EN" (confirmed — discards it).
+ * Typing directly into a connected field also diverges it (the caller's write path).
+ *
+ * Connection state is DERIVED (a per-locale key present ⇒ diverged), never stored.
+ * The caller renders this ONLY in an editable, non-base-locale view — so it is
+ * absent on the base locale, on non-localized fields, and in read-only/Published.
+ */
+export function FieldConnectionControl({ connection, fieldName, locale, onFillFromBase, onResetToBase, }) {
+    const [confirmOpen, setConfirmOpen] = useState(false);
+    const base = localeChipLabel(connection.baseLocale);
+    const active = localeChipLabel(locale);
+    if (connection.connected) {
+        return (_jsxs(Row, { gap: "1", children: [_jsxs(Badge, { variant: "outline", "data-testid": `field-connected-${fieldName}`, title: translate('cms.editor.localeFollowsHint', { base }), className: "border-dashed px-1.5 py-0 text-[0.65rem] font-normal", children: [_jsx(Link2, { className: "size-3", "aria-hidden": true }), translate('cms.editor.localeFollowsBase', { base })] }), connection.canFillFromBase ? (_jsx(ConnectionAction, { testId: `field-fill-from-base-${fieldName}`, onClick: onFillFromBase, children: translate('cms.editor.localeFillFromBase', { base }) })) : null] }));
+    }
+    return (_jsxs(Row, { gap: "1", children: [_jsxs(Badge, { variant: "outline", "data-testid": `field-diverged-${fieldName}`, title: translate('cms.editor.localeTranslatedHint', { base, locale: active }), className: "px-1.5 py-0 text-[0.65rem] font-normal", children: [_jsx(Languages, { className: "size-3", "aria-hidden": true }), translate('cms.editor.localeTranslated')] }), _jsx(ConnectionAction, { testId: `field-reset-to-base-${fieldName}`, onClick: () => setConfirmOpen(true), children: translate('cms.editor.localeResetToBase', { base }) }), _jsx(Dialog, { open: confirmOpen, onOpenChange: (open) => { if (!open)
+                    setConfirmOpen(false); }, children: _jsxs(DialogContent, { children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: translate('cms.editor.localeResetTitle', { base }) }), _jsx(DialogDescription, { children: translate('cms.editor.localeResetDescription', { base, locale: active }) })] }), _jsxs(DialogFooter, { className: "mt-4", children: [_jsx(Button, { variant: "ghost", size: "sm", onClick: () => setConfirmOpen(false), children: translate('common.cancel') }), _jsxs(Button, { variant: "destructive", size: "sm", "data-testid": `field-reset-to-base-confirm-${fieldName}`, onClick: () => {
+                                        setConfirmOpen(false);
+                                        onResetToBase();
+                                    }, children: [_jsx(RotateCcw, {}), " ", translate('cms.editor.localeResetConfirm', { base })] })] })] }) })] }));
+}
+/** A quiet inline text action for the connection affordance (fill / reset). */
+function ConnectionAction({ testId, onClick, children, }) {
+    return (_jsx("button", { type: "button", "data-testid": testId, onClick: onClick, className: "rounded text-[0.7rem] font-medium text-primary underline-offset-2 hover:underline", children: children }));
+}
+//# sourceMappingURL=field-connection.js.map

package/dist/components/cms/field-connection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"field-connection.js","sourceRoot":"","sources":["../../../src/components/cms/field-connection.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Languages, Link2, RotateCcw } from 'lucide-react'\nimport { useState } from 'react'\nimport type { ReactNode } from 'react'\nimport type { Locale } from '@elytracms/core/cms-core'\nimport {\n  Badge,\n  Button,\n  Dialog,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogTitle,\n  Row,\n} from '@elytracms/studio/ui'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport { localeChipLabel } from '@elytracms/studio/lib/locale'\nimport type { FieldConnection } from '@elytracms/studio/lib/locale'\n\n/**\n * EC-318 — the per-field localization CONNECTION affordance, replacing EC-176's\n * passive \"showing EN\" text. On a localized field in a non-base locale it shows,\n * quietly, whether the field FOLLOWS the base locale (connected) or OWNS a\n * translation (diverged), with the matching action:\n *   • connected → a \"Follows EN\" chip + \"Fill from EN\" (seed a translatable copy);\n *   • diverged  → a \"Translated\" chip + \"Reset to EN\" (confirmed — discards it).\n * Typing directly into a connected field also diverges it (the caller's write path).\n *\n * Connection state is DERIVED (a per-locale key present ⇒ diverged), never stored.\n * The caller renders this ONLY in an editable, non-base-locale view — so it is\n * absent on the base locale, on non-localized fields, and in read-only/Published.\n */\nexport function FieldConnectionControl({\n  connection,\n  fieldName,\n  locale,\n  onFillFromBase,\n  onResetToBase,\n}: {\n  connection: FieldConnection\n  fieldName: string\n  locale: Locale\n  onFillFromBase: () => void\n  onResetToBase: () => void\n}) {\n  const [confirmOpen, setConfirmOpen] = useState(false)\n  const base = localeChipLabel(connection.baseLocale)\n  const active = localeChipLabel(locale)\n\n  if (connection.connected) {\n    return (\n      <Row gap=\"1\">\n        <Badge\n          variant=\"outline\"\n          data-testid={`field-connected-${fieldName}`}\n          title={translate('cms.editor.localeFollowsHint', { base })}\n          className=\"border-dashed px-1.5 py-0 text-[0.65rem] font-normal\"\n        >\n          <Link2 className=\"size-3\" aria-hidden />\n          {translate('cms.editor.localeFollowsBase', { base })}\n        </Badge>\n        {connection.canFillFromBase ? (\n          <ConnectionAction\n            testId={`field-fill-from-base-${fieldName}`}\n            onClick={onFillFromBase}\n          >\n            {translate('cms.editor.localeFillFromBase', { base })}\n          </ConnectionAction>\n        ) : null}\n      </Row>\n    )\n  }\n\n  return (\n    <Row gap=\"1\">\n      <Badge\n        variant=\"outline\"\n        data-testid={`field-diverged-${fieldName}`}\n        title={translate('cms.editor.localeTranslatedHint', { base, locale: active })}\n        className=\"px-1.5 py-0 text-[0.65rem] font-normal\"\n      >\n        <Languages className=\"size-3\" aria-hidden />\n        {translate('cms.editor.localeTranslated')}\n      </Badge>\n      <ConnectionAction\n        testId={`field-reset-to-base-${fieldName}`}\n        onClick={() => setConfirmOpen(true)}\n      >\n        {translate('cms.editor.localeResetToBase', { base })}\n      </ConnectionAction>\n      <Dialog open={confirmOpen} onOpenChange={(open) => { if (!open) setConfirmOpen(false) }}>\n        <DialogContent>\n          <DialogHeader>\n            <DialogTitle>{translate('cms.editor.localeResetTitle', { base })}</DialogTitle>\n            <DialogDescription>\n              {translate('cms.editor.localeResetDescription', { base, locale: active })}\n            </DialogDescription>\n          </DialogHeader>\n          <DialogFooter className=\"mt-4\">\n            <Button variant=\"ghost\" size=\"sm\" onClick={() => setConfirmOpen(false)}>\n              {translate('common.cancel')}\n            </Button>\n            <Button\n              variant=\"destructive\"\n              size=\"sm\"\n              data-testid={`field-reset-to-base-confirm-${fieldName}`}\n              onClick={() => {\n                setConfirmOpen(false)\n                onResetToBase()\n              }}\n            >\n              <RotateCcw /> {translate('cms.editor.localeResetConfirm', { base })}\n            </Button>\n          </DialogFooter>\n        </DialogContent>\n      </Dialog>\n    </Row>\n  )\n}\n\n/** A quiet inline text action for the connection affordance (fill / reset). */\nfunction ConnectionAction({\n  testId,\n  onClick,\n  children,\n}: {\n  testId: string\n  onClick: () => void\n  children: ReactNode\n}) {\n  return (\n    <button\n      type=\"button\"\n      data-testid={testId}\n      onClick={onClick}\n      className=\"rounded text-[0.7rem] font-medium text-primary underline-offset-2 hover:underline\"\n    >\n      {children}\n    </button>\n  )\n}\n"]}

package/dist/components/cms/field-control.js

@@ -1,15 +1,18 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { AlertTriangle, ChevronDown, ChevronUp, GripVertical, ImagePlus, Link2, MoreHorizontal, Pencil, Plus, RotateCcw, SlidersHorizontal, Trash2, Upload, X } from 'lucide-react';
+import { AlertTriangle, ChevronDown, ChevronUp, GripVertical, ImagePlus, Link2, MoreHorizontal, Pencil, Plus, RotateCcw, RotateCw, SlidersHorizontal, Trash2, Upload, X } from 'lucide-react';
 import { createContext, useContext, useEffect, useMemo, useRef, useState } from 'react';
 import { Link, STUDIO_PROJECT_ROUTE, studioPath } from '@elytracms/studio/router';
-import { BUILTIN_FIELD_CONTROLS, assetAcceptAttr, assetMatchesAccept, assetNode, assetSubfieldsOf, describeAccept, descendantIds, isFieldHidden, parentRelationField, readAssetId, } from '@elytracms/core/cms-core';
+import { BUILTIN_FIELD_CONTROLS, applySlugify, assetAcceptAttr, assetMatchesAccept, assetNode, assetSubfieldsOf, describeAccept, descendantIds, findSlugCollision, isFieldHidden, parentRelationField, readAssetId, resolveSlugPath, slugSourceValue, } from '@elytracms/core/cms-core';
+import { resolveDeploymentRoutes } from '@elytracms/studio/lib/workspace';
 import { Button, Card, Code, Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, Field, Input, Row, RowItem, Select, Spacer, Stack, Text, } from '@elytracms/studio/ui';
 import { cn } from '@elytracms/studio/lib/utils';
 import { localizedLabel, translate } from '@elytracms/studio/lib/i18n';
+import { activeLocaleValues } from '@elytracms/studio/lib/locale';
 import { applyAssetSelection, assetIdsOf, singleAssetIdOf } from '../assets/asset-selection';
 import { useOptionalAssets } from '../assets/assets-store';
 import { AssetThumb, FocalCropPreviews, FocalPointPicker, useAssetRecord } from '../assets/asset-thumb';
 import { newlyAddedAssetIds } from '../assets/focal-point';
+import { assetMetaFieldsOf, pruneMeta } from '../assets/asset-metadata';
 import { fieldLabel } from './cms-store';
 import { useCollectionView } from '../collection-view/collection-view-context';
 import { useFieldDensity } from './field-density';
@@ -50,7 +53,26 @@ export function FieldControl(props) {
     }
     return builtIn;
 }
+/** The conventional slug field name (mirrors `url-for-document`'s `SLUG_FIELD`). */
+const SLUG_FIELD_NAME = 'slug';
+/** The built-in control name that opts any `text` field into the slug control (EC-315). */
+const SLUG_CONTROL = 'slug';
+/**
+ * EC-315: a `text` field is rendered by the smart slug control when it opts in via
+ * `form.control: 'slug'`, OR (the default auto-upgrade) when it is simply named
+ * `slug` — the long-standing convention `url-for-document`/hierarchy already key off.
+ */
+function isSlugControl(field) {
+    return field.type === 'text' && (field.form?.control === SLUG_CONTROL || field.name === SLUG_FIELD_NAME);
+}
 function BuiltInFieldControl({ field, value, onChange, readOnly, id }) {
+    // EC-315: the smart slug control (composed path, auto-slug, per-locale segments)
+    // subsumes the old inline `slug` input + PathPreview. It degrades to a plain input
+    // when the collection isn't routable (name-based auto-upgrade only) or no document
+    // editor context is present (e.g. a table-cell picker).
+    if (isSlugControl(field)) {
+        return _jsx(SlugField, { field: field, value: value, onChange: onChange, readOnly: readOnly, id: id });
+    }
     switch (field.type) {
         case 'boolean':
             return (_jsxs("label", { className: "flex h-8 items-center gap-2 text-sm", children: [_jsx("input", { id: id, type: "checkbox", checked: value === true, disabled: readOnly, onChange: (e) => onChange(e.target.checked), className: "size-4 accent-primary disabled:opacity-50" }), _jsx(Text, { size: "sm", tone: "muted", children: translate(value === true ? 'common.true' : 'common.false') })] }));
@@ -99,6 +121,135 @@ export function SegmentedOptions({ field, value, onChange, readOnly, id, }) {
             return (_jsx(Button, { type: "button", variant: active ? 'default' : 'outline', size: "sm", role: "radio", "aria-checked": active, title: localizedLabel(opt.description) || undefined, disabled: readOnly, onClick: () => onChange(opt.value), children: localizedLabel(opt.label, opt.value) }, opt.value));
         }) }));
 }
+/**
+ * EC-315 — the smart slug / URL-segment control. A `text` field named `slug` (or any
+ * `text` field with `form.control: 'slug'`) renders here instead of a bare input:
+ *
+ * - **Composed path**: the route-derived URL, decomposed by {@link resolveSlugPath}
+ *   into read-only parent/context segments + the editable slug segment inline + the
+ *   locale prefix (non-default locales). Reuses the same `urlForDocument` the live
+ *   site uses, so the preview matches what visitors get. Draft-derived (updates as
+ *   you type); the live "View live" button in the header stays the published open.
+ * - **Auto-slug**: while the slug is empty or was last produced by auto-derivation,
+ *   it live-derives from the source field (default: the collection's `titleField`).
+ *   A manual edit stops the auto-fill; the ↻ button always re-derives.
+ * - **Per-locale**: reads/writes through the shared `value`/`onChange` seam, so a
+ *   `localized` slug edits the active locale's segment with no bespoke locale code.
+ * - **Uniqueness**: an inline warning when the candidate collides with a sibling in
+ *   the same scope (same parent when hierarchical, same locale). A custom
+ *   `slug.unique` hook replaces the default sibling scan.
+ *
+ * Degrades to a plain input when there is no document editor context (a table-cell
+ * picker) or when a name-based auto-upgrade lands on a non-routable collection.
+ */
+function SlugField({ field, value, onChange, readOnly, id, }) {
+    const source = useCollectionView();
+    const editor = useOptionalDocumentEditor();
+    const slugConfig = field.slug;
+    const explicit = field.form?.control === SLUG_CONTROL;
+    const current = typeof value === 'string' ? value : '';
+    const locale = source.activeLocale;
+    const localeConfig = source.localeConfig;
+    const routes = useMemo(() => resolveDeploymentRoutes(), []);
+    const routable = useMemo(() => routes.some((r) => r.document?.collection === source.collectionId), [routes, source.collectionId]);
+    const draft = editor?.draft;
+    // The active-locale value bag the auto-slug source derives from (title, etc.).
+    const values = useMemo(() => (draft ? activeLocaleValues(draft, locale) : {}), [draft, locale]);
+    const derived = applySlugify(slugConfig, slugSourceValue(slugConfig, source.schema, values));
+    // Track whether the slug was manually set — auto-derive stays active while the
+    // slug is empty or was last produced by auto-derivation (never overwrites a manual
+    // slug). Seeded true when the loaded document already carries a slug.
+    const [manuallyEdited, setManuallyEdited] = useState(() => current.trim() !== '');
+    const onChangeRef = useRef(onChange);
+    onChangeRef.current = onChange;
+    useEffect(() => {
+        if (readOnly || manuallyEdited)
+            return;
+        if (derived && derived !== current)
+            onChangeRef.current(derived);
+    }, [derived, manuallyEdited, readOnly, current]);
+    // The composed path parts (routable collections with a document editor only).
+    const siblings = draft ? source.documents() : [];
+    // Draft-derived (routes + locale only, no `frontendUrl`) — the composed path is a
+    // read-only preview that updates as you type, mirroring the detail editor's draft
+    // URL. The header's published-gated "View live" stays the sole open-live action,
+    // so the draft/live distinction is preserved (an unpublished slug never links out).
+    const parts = useMemo(() => {
+        if (!draft || !routable)
+            return undefined;
+        return resolveSlugPath({ routes, localeConfig }, source.schema, draft, { siblings, locale });
+    }, [draft, routable, routes, localeConfig, source.schema, locale]);
+    // Default (sync) uniqueness — the first colliding sibling's title, or null.
+    const defaultCollisionTitle = useMemo(() => {
+        if (slugConfig?.unique || !draft)
+            return null;
+        const trimmed = current.trim();
+        if (trimmed === '')
+            return null;
+        const hit = findSlugCollision(trimmed, draft, source.documents(), {
+            collection: source.schema,
+            locale,
+            localeConfig,
+        });
+        return hit ? source.titleOf({ collection: source.collectionId, id: hit.id }) : null;
+    }, [current, draft, slugConfig, locale, localeConfig, source]);
+    // Custom (possibly async) uniqueness hook — race-guarded.
+    const [asyncTaken, setAsyncTaken] = useState(false);
+    useEffect(() => {
+        const unique = slugConfig?.unique;
+        if (!unique || !draft) {
+            setAsyncTaken(false);
+            return;
+        }
+        const trimmed = current.trim();
+        if (trimmed === '') {
+            setAsyncTaken(false);
+            return;
+        }
+        let cancelled = false;
+        Promise.resolve(unique(trimmed, { document: draft, locale, siblings: source.documents() }))
+            .then((ok) => {
+            if (!cancelled)
+                setAsyncTaken(ok === false);
+        })
+            .catch(() => {
+            if (!cancelled)
+                setAsyncTaken(false);
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [current, slugConfig, draft, locale, source]);
+    const collisionMessage = slugConfig?.unique
+        ? asyncTaken
+            ? translate('cms.field.slug.takenGeneric')
+            : undefined
+        : defaultCollisionTitle
+            ? translate('cms.field.slug.taken', { title: defaultCollisionTitle })
+            : undefined;
+    function handleInput(next) {
+        onChange(next || undefined);
+        // Clearing re-enables auto-derive; any non-empty entry is a manual override.
+        setManuallyEdited(next.trim() !== '');
+    }
+    function regenerate() {
+        setManuallyEdited(false);
+        const next = applySlugify(slugConfig, slugSourceValue(slugConfig, source.schema, values));
+        onChange(next || undefined);
+    }
+    // No document editor (a picker), or a name-based auto-upgrade on a non-routable
+    // collection: keep the historical plain input, no slug chrome (no regression).
+    if (!editor || (!explicit && !routable)) {
+        return (_jsx(Input, { id: id, disabled: readOnly, value: current, onChange: (e) => onChange(e.target.value || undefined) }));
+    }
+    const input = (_jsx(Input, { id: id, disabled: readOnly, value: current, placeholder: derived || undefined, onChange: (e) => handleInput(e.target.value), className: cn(parts ? 'h-7 min-w-[10ch] flex-1 bg-background font-mono text-xs' : 'flex-1') }));
+    const regenerateButton = !readOnly ? (_jsx(Button, { type: "button", variant: "ghost", size: "icon-sm", onClick: regenerate, "aria-label": translate('cms.field.slug.regenerate'), title: translate('cms.field.slug.regenerate'), children: _jsx(RotateCw, {}) })) : null;
+    return (_jsxs(Stack, { gap: "2", children: [parts ? (_jsxs(Row, { gap: "1", align: "center", wrap: true, className: "rounded-md border border-input bg-muted/30 px-2 py-1 font-mono text-xs text-muted-foreground", "data-testid": "slug-composed-path", children: [parts.localePrefix ? _jsx(SlugSegment, { children: parts.localePrefix }) : null, _jsx("span", { "aria-hidden": true, children: "/" }), parts.parentSegments.map((seg, i) => (_jsxs("span", { className: "inline-flex items-center gap-1", children: [_jsx(SlugSegment, { children: seg }), _jsx("span", { "aria-hidden": true, children: "/" })] }, `${seg}-${i}`))), input, regenerateButton] })) : (_jsxs(Row, { gap: "1", align: "center", children: [input, regenerateButton] })), routable ? (_jsxs(Row, { gap: "1", align: "center", className: "text-xs text-muted-foreground", "data-testid": "slug-path-preview", children: [_jsx(Link2, { className: "size-3 shrink-0", "aria-hidden": true }), parts?.path ? (_jsx(Text, { as: "span", size: "xs", tone: "muted", className: "min-w-0 truncate", title: parts.path, children: translate('cms.editor.servedAt', { path: parts.path }) })) : (_jsx(Text, { as: "span", size: "xs", tone: "muted", children: translate('cms.editor.slugUrlHint') }))] })) : null, collisionMessage ? (_jsxs(Row, { gap: "1", align: "center", "data-testid": "slug-collision", children: [_jsx(AlertTriangle, { className: "size-3.5 shrink-0 text-warning", "aria-hidden": true }), _jsx(Text, { size: "xs", tone: "muted", children: collisionMessage })] })) : null] }));
+}
+/** A single read-only path segment, subtly boxed to read as fixed context (EC-315). */
+function SlugSegment({ children }) {
+    return (_jsx("span", { className: "rounded bg-background px-1.5 py-0.5 text-foreground/70 ring-1 ring-inset ring-border", children: children }));
+}
 function asRecord(value) {
     return value !== null && typeof value === 'object' && !Array.isArray(value)
         ? value
@@ -522,10 +673,7 @@ function AssetField({ field, value, onChange, readOnly, }) {
     // is the belt to the picker's stopPropagation braces: the field cannot react at all.
     const dragProps = canUpload && !open ? { onDragEnter, onDragOver, onDragLeave, onDrop } : {};
     const selectButton = !readOnly ? (_jsxs(Button, { variant: "outline", size: "sm", onClick: () => setOpen(true), children: [_jsx(ImagePlus, {}), " ", translate('common.select')] })) : null;
-    return (_jsxs(Stack, { gap: "2", className: cn('relative rounded-lg transition-shadow', dragging && 'ring-2 ring-primary ring-offset-2 ring-offset-background'), ...dragProps, children: [many && hasSub ? (
-            // Gallery with per-use sub-fields (EC-301): a card per placement — thumbnail +
-            // its own sub-field form — reusing the object/repeater item rendering.
-            _jsxs(Stack, { gap: "2", children: [entries.length > 0 ? (_jsx(Stack, { gap: "2", children: entries.map((entry, i) => {
+    return (_jsxs(Stack, { gap: "2", className: cn('relative rounded-lg transition-shadow', dragging && 'ring-2 ring-primary ring-offset-2 ring-offset-background'), ...dragProps, children: [many && hasSub ? (_jsxs(Stack, { gap: "2", children: [entries.length > 0 ? (_jsx(Stack, { gap: "2", children: entries.map((entry, i) => {
                             const aid = readAssetId(entry);
                             if (!aid)
                                 return null;
@@ -534,12 +682,7 @@ function AssetField({ field, value, onChange, readOnly, }) {
                                     nextEntries[i] = assetNode(aid, next);
                                     onChange(nextEntries);
                                 }, onRemove: readOnly ? undefined : () => onChange(entries.filter((_, j) => j !== i)) }, `${aid}-${i}`));
-                        }) })) : (_jsx(EmptyAssetState, { compact: compact, canUpload: canUpload, onSelect: () => setOpen(true) })), _jsx(Row, { gap: "2", wrap: true, align: "center", children: selectButton })] })) : many ? (
-            // Gallery: a grid of focal-aware previews + the single Select entry.
-            _jsxs(Stack, { gap: "2", children: [ids.length > 0 ? (_jsx("div", { className: cn('grid gap-2', compact ? 'grid-cols-2' : 'grid-cols-3 sm:grid-cols-4'), children: ids.map((aid, i) => (_jsx(AssetChip, { assetId: aid, collectionId: assetCollectionId, onRemove: readOnly ? undefined : () => onChange(ids.filter((x) => x !== aid)) }, `${aid}-${i}`))) })) : (_jsx(EmptyAssetState, { compact: compact, canUpload: canUpload, onSelect: () => setOpen(true) })), _jsx(Row, { gap: "2", wrap: true, align: "center", children: selectButton })] })) : single && hasSub ? (
-            // With per-use sub-fields the asset + its fields read as ONE grouped unit
-            // (like an object), so it's clear they belong together (EC-301 feedback).
-            _jsx(Card, { className: "border-l-2 border-l-border p-3", children: _jsxs(Stack, { gap: "3", children: [_jsx(AssetSinglePreview, { assetId: single, compact: compact, readOnly: readOnly, hasLibrary: assets !== null, fallbackTitle: source.titleOf({ collection: assetCollectionId, id: single }), selectButton: selectButton, onEdit: () => setEditing(true), onRemove: () => onChange(applyAssetSelection(value, null, field.multiple)) }), _jsx("div", { className: "border-t border-border/60 pt-3", children: _jsx(ObjectItemForm, { fields: subFields, value: assetSubfieldsOf(value), readOnly: readOnly, idPrefix: "asset-sub", onChange: (next) => onChange(assetNode(single, next)) }) })] }) })) : single ? (_jsx(AssetSinglePreview, { assetId: single, compact: compact, readOnly: readOnly, hasLibrary: assets !== null, fallbackTitle: source.titleOf({ collection: assetCollectionId, id: single }), selectButton: selectButton, onEdit: () => setEditing(true), onRemove: () => onChange(applyAssetSelection(value, null, field.multiple)) })) : (_jsxs(Stack, { gap: "2", children: [_jsx(EmptyAssetState, { compact: compact, canUpload: canUpload, onSelect: () => setOpen(true) }), _jsx(Row, { gap: "2", wrap: true, align: "center", children: selectButton })] })), !many && single && assets ? (_jsx(AssetOptionsDialog, { assetId: single, readOnly: readOnly, open: editing, onOpenChange: setEditing })) : null, _jsx(AssetPicker, { value: single, open: open, onOpenChange: setOpen, accept: assetAcceptAttr(field.accept), onChange: applyPicked }), rejected.length > 0 ? (_jsxs(Row, { gap: "2", align: "center", children: [_jsx(AlertTriangle, { className: "size-4 shrink-0 text-warning" }), _jsx(Text, { size: "xs", tone: "muted", children: rejected.length === 1
+                        }) })) : (_jsx(EmptyAssetState, { compact: compact, canUpload: canUpload, onSelect: () => setOpen(true) })), _jsx(Row, { gap: "2", wrap: true, align: "center", children: selectButton })] })) : many ? (_jsxs(Stack, { gap: "2", children: [ids.length > 0 ? (_jsx("div", { className: cn('grid gap-2', compact ? 'grid-cols-2' : 'grid-cols-3 sm:grid-cols-4'), children: ids.map((aid, i) => (_jsx(AssetChip, { assetId: aid, collectionId: assetCollectionId, onRemove: readOnly ? undefined : () => onChange(ids.filter((x) => x !== aid)) }, `${aid}-${i}`))) })) : (_jsx(EmptyAssetState, { compact: compact, canUpload: canUpload, onSelect: () => setOpen(true) })), _jsx(Row, { gap: "2", wrap: true, align: "center", children: selectButton })] })) : single && hasSub ? (_jsx(Card, { className: "border-l-2 border-l-border p-3", children: _jsxs(Stack, { gap: "3", children: [_jsx(AssetSinglePreview, { assetId: single, compact: compact, readOnly: readOnly, hasLibrary: assets !== null, fallbackTitle: source.titleOf({ collection: assetCollectionId, id: single }), selectButton: selectButton, onEdit: () => setEditing(true), onRemove: () => onChange(applyAssetSelection(value, null, field.multiple)) }), _jsx("div", { className: "border-t border-border/60 pt-3", children: _jsx(ObjectItemForm, { fields: subFields, value: assetSubfieldsOf(value), readOnly: readOnly, idPrefix: "asset-sub", onChange: (next) => onChange(assetNode(single, next)) }) })] }) })) : single ? (_jsx(AssetSinglePreview, { assetId: single, compact: compact, readOnly: readOnly, hasLibrary: assets !== null, fallbackTitle: source.titleOf({ collection: assetCollectionId, id: single }), selectButton: selectButton, onEdit: () => setEditing(true), onRemove: () => onChange(applyAssetSelection(value, null, field.multiple)) })) : (_jsxs(Stack, { gap: "2", children: [_jsx(EmptyAssetState, { compact: compact, canUpload: canUpload, onSelect: () => setOpen(true) }), _jsx(Row, { gap: "2", wrap: true, align: "center", children: selectButton })] })), !many && single && assets ? (_jsx(AssetOptionsDialog, { assetId: single, readOnly: readOnly, open: editing, onOpenChange: setEditing })) : null, _jsx(AssetPicker, { value: single, open: open, onOpenChange: setOpen, accept: assetAcceptAttr(field.accept), onChange: applyPicked }), rejected.length > 0 ? (_jsxs(Row, { gap: "2", align: "center", children: [_jsx(AlertTriangle, { className: "size-4 shrink-0 text-warning" }), _jsx(Text, { size: "xs", tone: "muted", children: rejected.length === 1
                             ? translate('cms.asset.rejected.one', {
                                 name: rejected[0],
                                 types: describeAccept(field.accept),
@@ -605,25 +748,6 @@ function AssetGalleryItem({ assetId, collectionId, fields, value, onChangeSubs,
     const title = source.titleOf({ collection: collectionId, id: assetId });
     return (_jsxs(Card, { className: "border-l-2 border-l-border p-0", children: [_jsxs(Row, { gap: "2", align: "center", className: "border-b border-border/60 bg-muted/30 px-2 py-1.5", children: [_jsx(AssetThumb, { record: record, alt: title, className: "size-10 shrink-0" }), _jsx(Text, { size: "sm", className: "min-w-0 flex-1 truncate font-medium", title: title, children: title }), onRemove ? (_jsx(Button, { variant: "ghost", size: "sm", "aria-label": translate('common.remove'), onClick: onRemove, children: _jsx(Trash2, { className: "size-3.5" }) })) : null] }), _jsx("div", { className: "px-3 pb-3", children: _jsx(ObjectItemForm, { fields: fields, value: value, onChange: onChangeSubs, readOnly: readOnly, idPrefix: idPrefix }) })] }));
 }
-/**
- * System columns the upload pipeline owns — never editable metadata, so they're
- * excluded from the asset collection's schema-driven options form (EC-301). The
- * filename + dimensions already show in the field's info column.
- */
-const SYSTEM_ASSET_FIELDS = new Set([
-    'filename',
-    'url',
-    'contentType',
-    'byteSize',
-    'width',
-    'height',
-    'storageKey',
-    'title',
-]);
-/** Drop `undefined` values so the persisted meta bag stays JSON/Convex-clean. */
-function pruneMeta(meta) {
-    return Object.fromEntries(Object.entries(meta).filter(([, v]) => v !== undefined));
-}
 /**
  * The image options dialog (EC-301): the focal point (engine-special visual
  * control) + the asset's **schema-driven** metadata, rendered from the
@@ -638,9 +762,9 @@ function AssetOptionsDialog({ assetId, readOnly, open, onOpenChange, }) {
     const assets = useOptionalAssets();
     const record = useAssetRecord(assetId);
     const metaFields = useMemo(() => {
-        const assetId = source.assetCollectionId ?? 'asset';
-        const collection = source.collections.find((c) => c.id === assetId);
-        return (collection?.fields ?? []).filter((f) => !SYSTEM_ASSET_FIELDS.has(f.name) && !f.form?.readOnly);
+        const assetCollectionId = source.assetCollectionId ?? 'asset';
+        const collection = source.collections.find((c) => c.id === assetCollectionId);
+        return collection ? assetMetaFieldsOf(collection) : [];
     }, [source]);
     // Local edit buffers, seeded once per open from the record (so an external edit
     // still wins between opens). Metadata is non-localized in v1 (the asset