@elytracms/studio 0.0.60 → 0.0.62

package/dist/components/account/account-settings.js

@@ -46,7 +46,12 @@ export function AccountSettings({ projectId }) {
 }
 function LoadedAccount({ projectId, self, refresh, }) {
     const source = useSelfAccountViewSource({ projectId, self, refresh });
-    return (_jsxs("div", { className: "flex h-full flex-col overflow-y-auto", children: [_jsx("div", { className: "flex min-h-[28rem] flex-col", children: _jsx(PortableDetailEditor, { source: source, projectId: projectId, documentId: self.id }) }), _jsx("div", { className: "mx-auto w-full max-w-2xl px-4 pb-8 sm:px-6", children: _jsx(CredentialPanel, {}) })] }));
+    // EC-396: ONE editor surface. The identity form renders through the portable edit
+    // shell (name/avatar editable), and the credential seam mounts through the shell's
+    // form-column appendix — so the CredentialPanel sits IN the form column (aligned,
+    // same width as the fieldset cards) and the shell owns the scroll + full height,
+    // making the Issues sidebar span the whole surface. No parallel card wrapper.
+    return (_jsx(PortableDetailEditor, { source: source, projectId: projectId, documentId: self.id, formAppendix: _jsx(CredentialPanel, {}) }));
 }
 function CenteredNote({ children, testId }) {
     return (_jsx(Stack, { className: "h-full place-items-center p-8", align: "center", justify: "center", children: _jsx(Text, { size: "sm", tone: "muted", ...(testId ? { 'data-testid': testId } : {}), children: children }) }));

package/dist/components/account/account-settings.js.map

@@ -1 +1 @@
-{"version":3,"file":"account-settings.js","sourceRoot":"","sources":["../../../src/components/account/account-settings.tsx"],"names":[],"mappings":"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","sourcesContent":["import { UserCog } from 'lucide-react'\nimport type { UserRecord } from '@elytracms/core/persistence'\nimport { Heading, Stack, Text } from '@elytracms/studio/ui'\nimport { listStoreState, useOperationQuery } from '@elytracms/studio/lib/query'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport { useAuth } from '../auth-context'\nimport { PortableDetailEditor } from '../cms/detail-editor'\nimport { CredentialPanel } from './credential-panel'\nimport { useSelfAccountViewSource } from './self-account-view-source'\n\n/**\n * The **account-settings** surface (EC-240 H-tail items 1–4). A member — admin or\n * not — opens their OWN record here (via the user menu → `users/<selfId>`). It is\n * self-permitted: the self record is read through `users.getSelf` (never the\n * admin-only `users.list`/`get`), so a non-admin reaches ONLY their own account.\n *\n * Reuses the portable edit shell (AD-19) for the identity form (name/avatar\n * editable → `updateProfile`; email/role read-only) and appends the credential\n * seam (change password). No bespoke form — the shell + the self source carry it.\n */\nexport function AccountSettings({ projectId }: { projectId: string }) {\n  const auth = useAuth()\n  const userId = auth.session?.user?.id ?? null\n\n  const query = useOperationQuery<UserRecord | null>({\n    queryKey: ['account', projectId, userId ?? '∅'],\n    loader: async (operations) => {\n      const result = await operations.users.getSelf({ projectId })\n      if (!result.ok) throw new Error(result.error.message)\n      return result.value ?? null\n    },\n    enabled: userId !== null,\n  })\n  const { status, errorMessage } = listStoreState(query)\n  const self = query.data ?? null\n\n  if (status === 'loading') {\n    return <CenteredNote>{translate('account.loading')}</CenteredNote>\n  }\n  if (status === 'error') {\n    return (\n      <CenteredNote testId=\"account-error\">\n        {errorMessage ?? translate('account.loadFailed')}\n      </CenteredNote>\n    )\n  }\n  if (!self) {\n    // Authenticated but not a member (no role yet) — honest, not a raw auth error.\n    return (\n      <Stack gap=\"2\" align=\"center\" justify=\"center\" className=\"h-full p-8 text-center\">\n        <UserCog className=\"size-6 text-muted-foreground\" />\n        <Heading level={2} size=\"h3\">\n          {translate('account.notMemberTitle')}\n        </Heading>\n        <Text size=\"sm\" tone=\"muted\" className=\"max-w-sm\">\n          {translate('account.notMemberBody')}\n        </Text>\n      </Stack>\n    )\n  }\n\n  return <LoadedAccount projectId={projectId} self={self} refresh={async () => void (await query.refetch())} />\n}\n\nfunction LoadedAccount({\n  projectId,\n  self,\n  refresh,\n}: {\n  projectId: string\n  self: UserRecord\n  refresh: () => Promise<void>\n}) {\n  const source = useSelfAccountViewSource({ projectId, self, refresh })\n  return (\n    <div className=\"flex h-full flex-col overflow-y-auto\">\n      {/* The identity form via the portable edit shell (name/avatar editable). */}\n      <div className=\"flex min-h-[28rem] flex-col\">\n        <PortableDetailEditor source={source} projectId={projectId} documentId={self.id} />\n      </div>\n      {/* The credential seam — part of the property surface, below the identity form. */}\n      <div className=\"mx-auto w-full max-w-2xl px-4 pb-8 sm:px-6\">\n        <CredentialPanel />\n      </div>\n    </div>\n  )\n}\n\nfunction CenteredNote({ children, testId }: { children: React.ReactNode; testId?: string }) {\n  return (\n    <Stack className=\"h-full place-items-center p-8\" align=\"center\" justify=\"center\">\n      <Text size=\"sm\" tone=\"muted\" {...(testId ? { 'data-testid': testId } : {})}>\n        {children}\n      </Text>\n    </Stack>\n  )\n}\n"]}
+{"version":3,"file":"account-settings.js","sourceRoot":"","sources":["../../../src/components/account/account-settings.tsx"],"names":[],"mappings":"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","sourcesContent":["import { UserCog } from 'lucide-react'\nimport type { UserRecord } from '@elytracms/core/persistence'\nimport { Heading, Stack, Text } from '@elytracms/studio/ui'\nimport { listStoreState, useOperationQuery } from '@elytracms/studio/lib/query'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport { useAuth } from '../auth-context'\nimport { PortableDetailEditor } from '../cms/detail-editor'\nimport { CredentialPanel } from './credential-panel'\nimport { useSelfAccountViewSource } from './self-account-view-source'\n\n/**\n * The **account-settings** surface (EC-240 H-tail items 1–4). A member — admin or\n * not — opens their OWN record here (via the user menu → `users/<selfId>`). It is\n * self-permitted: the self record is read through `users.getSelf` (never the\n * admin-only `users.list`/`get`), so a non-admin reaches ONLY their own account.\n *\n * Reuses the portable edit shell (AD-19) for the identity form (name/avatar\n * editable → `updateProfile`; email/role read-only) and appends the credential\n * seam (change password). No bespoke form — the shell + the self source carry it.\n */\nexport function AccountSettings({ projectId }: { projectId: string }) {\n  const auth = useAuth()\n  const userId = auth.session?.user?.id ?? null\n\n  const query = useOperationQuery<UserRecord | null>({\n    queryKey: ['account', projectId, userId ?? '∅'],\n    loader: async (operations) => {\n      const result = await operations.users.getSelf({ projectId })\n      if (!result.ok) throw new Error(result.error.message)\n      return result.value ?? null\n    },\n    enabled: userId !== null,\n  })\n  const { status, errorMessage } = listStoreState(query)\n  const self = query.data ?? null\n\n  if (status === 'loading') {\n    return <CenteredNote>{translate('account.loading')}</CenteredNote>\n  }\n  if (status === 'error') {\n    return (\n      <CenteredNote testId=\"account-error\">\n        {errorMessage ?? translate('account.loadFailed')}\n      </CenteredNote>\n    )\n  }\n  if (!self) {\n    // Authenticated but not a member (no role yet) — honest, not a raw auth error.\n    return (\n      <Stack gap=\"2\" align=\"center\" justify=\"center\" className=\"h-full p-8 text-center\">\n        <UserCog className=\"size-6 text-muted-foreground\" />\n        <Heading level={2} size=\"h3\">\n          {translate('account.notMemberTitle')}\n        </Heading>\n        <Text size=\"sm\" tone=\"muted\" className=\"max-w-sm\">\n          {translate('account.notMemberBody')}\n        </Text>\n      </Stack>\n    )\n  }\n\n  return <LoadedAccount projectId={projectId} self={self} refresh={async () => void (await query.refetch())} />\n}\n\nfunction LoadedAccount({\n  projectId,\n  self,\n  refresh,\n}: {\n  projectId: string\n  self: UserRecord\n  refresh: () => Promise<void>\n}) {\n  const source = useSelfAccountViewSource({ projectId, self, refresh })\n  // EC-396: ONE editor surface. The identity form renders through the portable edit\n  // shell (name/avatar editable), and the credential seam mounts through the shell's\n  // form-column appendix — so the CredentialPanel sits IN the form column (aligned,\n  // same width as the fieldset cards) and the shell owns the scroll + full height,\n  // making the Issues sidebar span the whole surface. No parallel card wrapper.\n  return (\n    <PortableDetailEditor\n      source={source}\n      projectId={projectId}\n      documentId={self.id}\n      formAppendix={<CredentialPanel />}\n    />\n  )\n}\n\nfunction CenteredNote({ children, testId }: { children: React.ReactNode; testId?: string }) {\n  return (\n    <Stack className=\"h-full place-items-center p-8\" align=\"center\" justify=\"center\">\n      <Text size=\"sm\" tone=\"muted\" {...(testId ? { 'data-testid': testId } : {})}>\n        {children}\n      </Text>\n    </Stack>\n  )\n}\n"]}

package/dist/components/account/self-account-schema.js

@@ -1,6 +1,7 @@
 import { collectionDefSchema } from '@elytracms/core/cms-core';
 import { roleOptions } from '@elytracms/core/persistence';
 import { msgLabel } from '@elytracms/studio/lib/i18n';
+import { userTitleFallback } from '../users/users-schema.js';
 /**
  * The **account-settings** field lens (EC-240 H-tail) — the schema the portable
  * edit shell renders when a member opens their OWN record (via the user menu). It
@@ -21,7 +22,9 @@ import { msgLabel } from '@elytracms/studio/lib/i18n';
 export const selfAccountCollectionDef = collectionDefSchema.parse({
     id: 'account',
     kind: 'document',
-    titleField: 'name',
+    // EC-396: name → email → id (shared with the users rail) so the account header,
+    // breadcrumb, and user menu never show the raw internal id when an email exists.
+    titleField: userTitleFallback,
     form: {
         label: msgLabel('account.rail.label'),
         labelSingular: msgLabel('account.rail.labelSingular'),

package/dist/components/account/self-account-schema.js.map

@@ -1 +1 @@
-{"version":3,"file":"self-account-schema.js","sourceRoot":"","sources":["../../../src/components/account/self-account-schema.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAA;AAE9D,OAAO,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAA;AAErD;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAkB,mBAAmB,CAAC,KAAK,CAAC;IAC/E,EAAE,EAAE,SAAS;IACb,IAAI,EAAE,UAAU;IAChB,UAAU,EAAE,MAAM;IAClB,IAAI,EAAE;QACJ,KAAK,EAAE,QAAQ,CAAC,oBAAoB,CAAC;QACrC,aAAa,EAAE,QAAQ,CAAC,4BAA4B,CAAC;KACtD;IACD,MAAM,EAAE;QACN,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,EAAE,KAAK,EAAE,QAAQ,CAAC,0BAA0B,CAAC,EAAE,EAAE;QACrF;YACE,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,MAAM;YACZ,IAAI,EAAE;gBACJ,KAAK,EAAE,QAAQ,CAAC,4BAA4B,CAAC;gBAC7C,WAAW,EAAE,QAAQ,CAAC,2BAA2B,CAAC;aACnD;SACF;QACD;YACE,IAAI,EAAE,OAAO;YACb,IAAI,EAAE,MAAM;YACZ,IAAI,EAAE,EAAE,KAAK,EAAE,QAAQ,CAAC,2BAA2B,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE;SACvE;QACD;YACE,IAAI,EAAE,MAAM;YACZ,IAAI,EAAE,QAAQ;YACd,OAAO,EAAE,CAAC,GAAG,WAAW,EAAE,CAAC;YAC3B,IAAI,EAAE,EAAE,KAAK,EAAE,QAAQ,CAAC,0BAA0B,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE;SACtE;KACF;CACF,CAAC,CAAA","sourcesContent":["import { collectionDefSchema } from '@elytracms/core/cms-core'\nimport type { CollectionDef } from '@elytracms/core/cms-core'\nimport { roleOptions } from '@elytracms/core/persistence'\nimport { msgLabel } from '@elytracms/studio/lib/i18n'\n\n/**\n * The **account-settings** field lens (EC-240 H-tail) — the schema the portable\n * edit shell renders when a member opens their OWN record (via the user menu). It\n * diverges from the admin `usersCollectionDef` in exactly the way the ratified\n * scope dictates:\n *\n * - **name / avatar are EDITABLE** (not `form.readOnly`) — the person edits their\n *   own identity; the source's `save` routes these to `AuthAdapter.updateProfile`\n *   (auth-owned), never the members rail.\n * - **email is read-only** (email change is a separate, deferred seam).\n * - **role is read-only** — you never change your own role (the server integrity\n *   floor also guards it).\n *\n * Avatar is a plain URL text field for now; the media-picker convention is a\n * deferred polish item — this keeps the mechanism (name + avatar → updateProfile)\n * honest and complete without a half-built picker.\n */\nexport const selfAccountCollectionDef: CollectionDef = collectionDefSchema.parse({\n  id: 'account',\n  kind: 'document',\n  titleField: 'name',\n  form: {\n    label: msgLabel('account.rail.label'),\n    labelSingular: msgLabel('account.rail.labelSingular'),\n  },\n  fields: [\n    { name: 'name', type: 'text', form: { label: msgLabel('account.field.name.label') } },\n    {\n      name: 'avatar',\n      type: 'text',\n      form: {\n        label: msgLabel('account.field.avatar.label'),\n        description: msgLabel('account.field.avatar.hint'),\n      },\n    },\n    {\n      name: 'email',\n      type: 'text',\n      form: { label: msgLabel('account.field.email.label'), readOnly: true },\n    },\n    {\n      name: 'role',\n      type: 'select',\n      options: [...roleOptions()],\n      form: { label: msgLabel('account.field.role.label'), readOnly: true },\n    },\n  ],\n})\n"]}
+{"version":3,"file":"self-account-schema.js","sourceRoot":"","sources":["../../../src/components/account/self-account-schema.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAA;AAE9D,OAAO,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAA;AACrD,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAA;AAEzD;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAkB,mBAAmB,CAAC,KAAK,CAAC;IAC/E,EAAE,EAAE,SAAS;IACb,IAAI,EAAE,UAAU;IAChB,gFAAgF;IAChF,iFAAiF;IACjF,UAAU,EAAE,iBAAiB;IAC7B,IAAI,EAAE;QACJ,KAAK,EAAE,QAAQ,CAAC,oBAAoB,CAAC;QACrC,aAAa,EAAE,QAAQ,CAAC,4BAA4B,CAAC;KACtD;IACD,MAAM,EAAE;QACN,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,EAAE,KAAK,EAAE,QAAQ,CAAC,0BAA0B,CAAC,EAAE,EAAE;QACrF;YACE,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,MAAM;YACZ,IAAI,EAAE;gBACJ,KAAK,EAAE,QAAQ,CAAC,4BAA4B,CAAC;gBAC7C,WAAW,EAAE,QAAQ,CAAC,2BAA2B,CAAC;aACnD;SACF;QACD;YACE,IAAI,EAAE,OAAO;YACb,IAAI,EAAE,MAAM;YACZ,IAAI,EAAE,EAAE,KAAK,EAAE,QAAQ,CAAC,2BAA2B,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE;SACvE;QACD;YACE,IAAI,EAAE,MAAM;YACZ,IAAI,EAAE,QAAQ;YACd,OAAO,EAAE,CAAC,GAAG,WAAW,EAAE,CAAC;YAC3B,IAAI,EAAE,EAAE,KAAK,EAAE,QAAQ,CAAC,0BAA0B,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE;SACtE;KACF;CACF,CAAC,CAAA","sourcesContent":["import { collectionDefSchema } from '@elytracms/core/cms-core'\nimport type { CollectionDef } from '@elytracms/core/cms-core'\nimport { roleOptions } from '@elytracms/core/persistence'\nimport { msgLabel } from '@elytracms/studio/lib/i18n'\nimport { userTitleFallback } from '../users/users-schema'\n\n/**\n * The **account-settings** field lens (EC-240 H-tail) — the schema the portable\n * edit shell renders when a member opens their OWN record (via the user menu). It\n * diverges from the admin `usersCollectionDef` in exactly the way the ratified\n * scope dictates:\n *\n * - **name / avatar are EDITABLE** (not `form.readOnly`) — the person edits their\n *   own identity; the source's `save` routes these to `AuthAdapter.updateProfile`\n *   (auth-owned), never the members rail.\n * - **email is read-only** (email change is a separate, deferred seam).\n * - **role is read-only** — you never change your own role (the server integrity\n *   floor also guards it).\n *\n * Avatar is a plain URL text field for now; the media-picker convention is a\n * deferred polish item — this keeps the mechanism (name + avatar → updateProfile)\n * honest and complete without a half-built picker.\n */\nexport const selfAccountCollectionDef: CollectionDef = collectionDefSchema.parse({\n  id: 'account',\n  kind: 'document',\n  // EC-396: name → email → id (shared with the users rail) so the account header,\n  // breadcrumb, and user menu never show the raw internal id when an email exists.\n  titleField: userTitleFallback,\n  form: {\n    label: msgLabel('account.rail.label'),\n    labelSingular: msgLabel('account.rail.labelSingular'),\n  },\n  fields: [\n    { name: 'name', type: 'text', form: { label: msgLabel('account.field.name.label') } },\n    {\n      name: 'avatar',\n      type: 'text',\n      form: {\n        label: msgLabel('account.field.avatar.label'),\n        description: msgLabel('account.field.avatar.hint'),\n      },\n    },\n    {\n      name: 'email',\n      type: 'text',\n      form: { label: msgLabel('account.field.email.label'), readOnly: true },\n    },\n    {\n      name: 'role',\n      type: 'select',\n      options: [...roleOptions()],\n      form: { label: msgLabel('account.field.role.label'), readOnly: true },\n    },\n  ],\n})\n"]}

package/dist/components/ai/proposal-card.js

@@ -1,10 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useEffect, useMemo, useState } from 'react';
-import { createPortal } from 'react-dom';
+import { useMemo, useState } from 'react';
 import { ArrowUpRight, Check, Maximize2, Sparkles, X } from 'lucide-react';
 import { diffDocuments } from '@elytracms/core/content';
 import { resolveLabel } from '@elytracms/core/cms-core';
-import { Badge, Button, Heading, Row, Spacer, Stack, Text } from '@elytracms/studio/ui';
+import { Badge, Button, ExpandableSurface, Row, Spacer, Stack, Text } from '@elytracms/studio/ui';
 import { translate } from '@elytracms/studio/lib/i18n';
 import { proposalDocuments } from '@elytracms/studio/lib/ai';
 import { useCms } from '../cms/cms-store.js';
@@ -83,27 +82,19 @@ export function ProposalCardView({ proposal, collection, source, onApply, onDisc
  * REVIEW surface, not a form, so it stays lightly dismissible (backdrop click /
  * Escape / close button) rather than a trapping modal — the forms-never-modal
  * spirit, applied. Presentation only: Apply/Discard call the same handlers the
- * card does; it changes no proposal data. Rendered through a portal so it
- * escapes the narrow AI panel; the card default keeps it closed, so the SSR
- * smoke path never mounts the portal.
+ * card does; it changes no proposal data. Since EC-392 it renders through the
+ * shared {@link ExpandableSurface} primitive (portal-to-body, backdrop, header
+ * close, layer-stacked Escape) at the shipped 720px width, so it escapes the
+ * narrow AI panel; the card default keeps it closed, so the SSR smoke path
+ * never mounts the portal.
  */
 function ProposalReviewSheet({ title, diff, collection, source, columnHeaders, status, onApply, onDiscard, onClose, }) {
-    useEffect(() => {
-        const onKey = (e) => {
-            if (e.key === 'Escape')
-                onClose();
-        };
-        window.addEventListener('keydown', onKey);
-        return () => window.removeEventListener('keydown', onKey);
-    }, [onClose]);
-    if (typeof document === 'undefined')
-        return null;
-    return createPortal(_jsxs("div", { className: "fixed inset-0 z-50 flex", children: [_jsx("div", { className: "flex-1 bg-background/70 backdrop-blur-sm", "aria-hidden": true, onClick: onClose }), _jsxs("aside", { role: "dialog", "aria-label": title, className: "flex h-full w-[min(720px,92vw)] flex-col border-l border-border bg-card shadow-2xl", children: [_jsxs(Row, { gap: "2", align: "center", className: "h-12 shrink-0 border-b border-border px-4", children: [_jsx(Sparkles, { className: "size-4 shrink-0 text-primary" }), _jsx(Heading, { level: 2, size: "h4", className: "min-w-0 truncate", children: title }), _jsx(Spacer, {}), _jsx(Button, { size: "icon-sm", variant: "ghost", onClick: onClose, title: translate('ai.proposal.collapseReview'), "aria-label": translate('ai.proposal.collapseReview'), children: _jsx(X, {}) })] }), _jsx("div", { className: "min-h-0 flex-1 overflow-y-auto p-4 sm:p-6", children: _jsx("div", { className: "mx-auto w-full max-w-3xl", children: _jsx(CollectionViewProvider, { source: source, children: _jsx(DocumentDiffView, { diff: diff, collection: collection, columnHeaders: columnHeaders }) }) }) }), status === 'pending' ? (_jsxs(Row, { gap: "2", align: "center", className: "shrink-0 border-t border-border px-4 py-3", children: [_jsx(Text, { size: "xs", tone: "muted", className: "min-w-0 flex-1", children: translate('ai.proposal.reviewHint') }), _jsxs(Button, { size: "sm", variant: "ghost", onClick: () => {
-                                    onDiscard();
-                                    onClose();
-                                }, children: [_jsx(X, {}), " ", translate('ai.proposal.discard')] }), _jsxs(Button, { size: "sm", onClick: () => {
-                                    onApply();
-                                    onClose();
-                                }, children: [_jsx(Check, {}), " ", translate('ai.proposal.apply')] })] })) : null] })] }), document.body);
+    return (_jsxs(ExpandableSurface, { title: title, closeLabel: translate('ai.proposal.collapseReview'), width: "min(720px, 92vw)", onDismiss: onClose, headerLeading: _jsx(Sparkles, { className: "size-4 shrink-0 text-primary" }), children: [_jsx("div", { className: "min-h-0 flex-1 overflow-y-auto p-4 sm:p-6", children: _jsx("div", { className: "mx-auto w-full max-w-3xl", children: _jsx(CollectionViewProvider, { source: source, children: _jsx(DocumentDiffView, { diff: diff, collection: collection, columnHeaders: columnHeaders }) }) }) }), status === 'pending' ? (_jsxs(Row, { gap: "2", align: "center", className: "shrink-0 border-t border-border px-4 py-3", children: [_jsx(Text, { size: "xs", tone: "muted", className: "min-w-0 flex-1", children: translate('ai.proposal.reviewHint') }), _jsxs(Button, { size: "sm", variant: "ghost", onClick: () => {
+                            onDiscard();
+                            onClose();
+                        }, children: [_jsx(X, {}), " ", translate('ai.proposal.discard')] }), _jsxs(Button, { size: "sm", onClick: () => {
+                            onApply();
+                            onClose();
+                        }, children: [_jsx(Check, {}), " ", translate('ai.proposal.apply')] })] })) : null] }));
 }
 //# sourceMappingURL=proposal-card.js.map

package/dist/components/ai/proposal-card.js.map

@@ -1 +1 @@
-{"version":3,"file":"proposal-card.js","sourceRoot":"","sources":["../../../src/components/ai/proposal-card.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useMemo, useState } from 'react'\nimport { createPortal } from 'react-dom'\nimport { ArrowUpRight, Check, Maximize2, Sparkles, X } from 'lucide-react'\nimport { diffDocuments } from '@elytracms/core/content'\nimport type { DocumentDiff } from '@elytracms/core/content'\nimport { resolveLabel } from '@elytracms/core/cms-core'\nimport type { CollectionDef } from '@elytracms/core/cms-core'\nimport { Badge, Button, Heading, Row, Spacer, Stack, Text } from '@elytracms/studio/ui'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport { proposalDocuments } from '@elytracms/studio/lib/ai'\nimport type { ProposalOrigin, ProposalReview } from '@elytracms/studio/lib/ai'\nimport type { CollectionViewSource } from '@elytracms/studio/lib/collection-view/collection-view-source'\nimport { useCms } from '../cms/cms-store'\nimport { useCmsCollectionViewSource } from '../collection-view/cms-collection-view-source'\nimport { CollectionViewProvider } from '../collection-view/collection-view-context'\nimport { DocumentDiffView } from '../cms/document-diff-view'\n\n/**\n * The AI proposal review (EC-199, extended by EC-332/EC-378): a valid,\n * leash-compliant proposal the editor reviews as a DIFF (the shared EC-317\n * {@link DocumentDiffView} — never a second renderer) before applying it as a\n * draft or discarding it. Create proposals diff `empty-before` vs\n * `proposed-after`; translate/update proposals diff the EXISTING document\n * (old → new). Apply/discard are handled by the panel (the operations write +\n * provenance snapshot happen there); this card is the surface.\n *\n * {@link ProposalCard} is the CMS-wired shell; {@link ProposalCardView} is the\n * presentational card over an injected collection + view source (node-smoked\n * with `renderToStaticMarkup`, house pattern).\n */\n\n/** The card's origin-dependent captions (title + diff column headers). */\nexport function proposalCaptions(\n  origin: ProposalOrigin,\n  collectionLabel: string,\n): { title: string; unified: string; before: string; after: string } {\n  if (origin === 'translate') {\n    return {\n      title: translate('ai.translate.proposalTitle', { collection: collectionLabel }),\n      unified: translate('ai.proposal.diffUnified'),\n      before: translate('ai.translate.diffBefore'),\n      after: translate('ai.translate.diffAfter'),\n    }\n  }\n  if (origin === 'update') {\n    return {\n      title: translate('ai.update.proposalTitle', { collection: collectionLabel }),\n      unified: translate('ai.proposal.diffUnified'),\n      before: translate('ai.update.diffBefore'),\n      after: translate('ai.update.diffAfter'),\n    }\n  }\n  return {\n    title: translate('ai.proposal.title', { collection: collectionLabel }),\n    unified: translate('ai.proposal.diffUnified'),\n    before: translate('ai.proposal.diffBefore'),\n    after: translate('ai.proposal.diffAfter'),\n  }\n}\n\nexport function ProposalCard({\n  proposal,\n  onApply,\n  onDiscard,\n  onOpen,\n}: {\n  proposal: ProposalReview\n  onApply: () => void\n  onDiscard: () => void\n  onOpen: () => void\n}) {\n  const cms = useCms()\n  const collection = cms.getCollection(proposal.collection)\n  const source = useCmsCollectionViewSource(proposal.collection)\n  return (\n    <ProposalCardView\n      proposal={proposal}\n      collection={collection}\n      source={source}\n      onApply={onApply}\n      onDiscard={onDiscard}\n      onOpen={onOpen}\n    />\n  )\n}\n\n/** The presentational proposal card over an injected collection + view source. */\nexport function ProposalCardView({\n  proposal,\n  collection,\n  source,\n  onApply,\n  onDiscard,\n  onOpen,\n}: {\n  proposal: ProposalReview\n  collection: CollectionDef | undefined\n  source: CollectionViewSource | null\n  onApply: () => void\n  onDiscard: () => void\n  onOpen: () => void\n}) {\n  const diff = useMemo(() => {\n    if (!collection) return null\n    const { before, after } = proposalDocuments(proposal.patch, proposal.before)\n    return diffDocuments(collection, before, after)\n  }, [collection, proposal.patch, proposal.before])\n\n  const collectionLabel =\n    (collection?.form?.labelSingular && resolveLabel(collection.form.labelSingular)) ??\n    (collection?.form?.label && resolveLabel(collection.form.label)) ??\n    proposal.collection\n\n  const captions = proposalCaptions(proposal.origin, collectionLabel)\n  const applied = proposal.status === 'applied'\n  const rejected = proposal.status === 'rejected'\n  const columnHeaders = { unified: captions.unified, before: captions.before, after: captions.after }\n\n  // EC-382 — the expandable review surface: the sidebar card stays stacked; a\n  // roomy full-height sheet is offered for a large proposal (never a modal form).\n  const [reviewOpen, setReviewOpen] = useState(false)\n  const reviewable = diff !== null && source !== null\n\n  return (\n    <Stack\n      gap=\"2\"\n      className=\"overflow-hidden rounded-xl border border-border bg-card\"\n    >\n      <Row gap=\"2\" align=\"center\" className=\"border-b border-border/60 bg-muted/30 px-3 py-2\">\n        <Sparkles className=\"size-4 shrink-0 text-primary\" />\n        <Text size=\"sm\" weight=\"medium\" className=\"min-w-0 truncate\">\n          {captions.title}\n        </Text>\n        <Spacer />\n        {applied ? <Badge variant=\"success\">{translate('ai.proposal.applied')}</Badge> : null}\n        {rejected ? <Badge variant=\"outline\">{translate('ai.proposal.discarded')}</Badge> : null}\n        {reviewable ? (\n          <Button\n            size=\"icon-sm\"\n            variant=\"ghost\"\n            onClick={() => setReviewOpen(true)}\n            title={translate('ai.proposal.expandReview')}\n            aria-label={translate('ai.proposal.expandReview')}\n          >\n            <Maximize2 />\n          </Button>\n        ) : null}\n      </Row>\n\n      <div className=\"px-3\">\n        {reviewable ? (\n          <CollectionViewProvider source={source!}>\n            <DocumentDiffView\n              diff={diff!}\n              collection={collection!}\n              columnHeaders={columnHeaders}\n              layout=\"stacked\"\n            />\n          </CollectionViewProvider>\n        ) : (\n          <Text size=\"xs\" tone=\"muted\" className=\"py-2\">\n            {translate('ai.proposal.unavailable')}\n          </Text>\n        )}\n      </div>\n\n      <Row gap=\"2\" align=\"center\" className=\"border-t border-border/60 px-3 py-2\">\n        {proposal.status === 'pending' ? (\n          <>\n            <Text size=\"xs\" tone=\"muted\" className=\"min-w-0 flex-1\">\n              {translate('ai.proposal.reviewHint')}\n            </Text>\n            <Button size=\"sm\" variant=\"ghost\" onClick={onDiscard}>\n              <X /> {translate('ai.proposal.discard')}\n            </Button>\n            <Button size=\"sm\" onClick={onApply}>\n              <Check /> {translate('ai.proposal.apply')}\n            </Button>\n          </>\n        ) : applied ? (\n          <>\n            <Spacer />\n            <Button size=\"sm\" variant=\"outline\" onClick={onOpen}>\n              <ArrowUpRight /> {translate('ai.proposal.open')}\n            </Button>\n          </>\n        ) : (\n          <Text size=\"xs\" tone=\"muted\">\n            {translate('ai.proposal.discardedNote')}\n          </Text>\n        )}\n      </Row>\n\n      {reviewable && reviewOpen ? (\n        <ProposalReviewSheet\n          title={captions.title}\n          diff={diff!}\n          collection={collection!}\n          source={source!}\n          columnHeaders={columnHeaders}\n          status={proposal.status}\n          onApply={onApply}\n          onDiscard={onDiscard}\n          onClose={() => setReviewOpen(false)}\n        />\n      ) : null}\n    </Stack>\n  )\n}\n\n/**\n * The expandable review surface (EC-382): the proposal's diff promoted into a\n * roomy, full-height right-anchored sheet where the wide `grid` layout is\n * comfortable — for a large proposal the 320px sidebar can only cramp. It is a\n * REVIEW surface, not a form, so it stays lightly dismissible (backdrop click /\n * Escape / close button) rather than a trapping modal — the forms-never-modal\n * spirit, applied. Presentation only: Apply/Discard call the same handlers the\n * card does; it changes no proposal data. Rendered through a portal so it\n * escapes the narrow AI panel; the card default keeps it closed, so the SSR\n * smoke path never mounts the portal.\n */\nfunction ProposalReviewSheet({\n  title,\n  diff,\n  collection,\n  source,\n  columnHeaders,\n  status,\n  onApply,\n  onDiscard,\n  onClose,\n}: {\n  title: string\n  diff: DocumentDiff\n  collection: CollectionDef\n  source: CollectionViewSource\n  columnHeaders: { unified: string; before: string; after: string }\n  status: ProposalReview['status']\n  onApply: () => void\n  onDiscard: () => void\n  onClose: () => void\n}) {\n  useEffect(() => {\n    const onKey = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') onClose()\n    }\n    window.addEventListener('keydown', onKey)\n    return () => window.removeEventListener('keydown', onKey)\n  }, [onClose])\n\n  if (typeof document === 'undefined') return null\n\n  return createPortal(\n    <div className=\"fixed inset-0 z-50 flex\">\n      <div className=\"flex-1 bg-background/70 backdrop-blur-sm\" aria-hidden onClick={onClose} />\n      <aside\n        role=\"dialog\"\n        aria-label={title}\n        className=\"flex h-full w-[min(720px,92vw)] flex-col border-l border-border bg-card shadow-2xl\"\n      >\n        <Row gap=\"2\" align=\"center\" className=\"h-12 shrink-0 border-b border-border px-4\">\n          <Sparkles className=\"size-4 shrink-0 text-primary\" />\n          <Heading level={2} size=\"h4\" className=\"min-w-0 truncate\">\n            {title}\n          </Heading>\n          <Spacer />\n          <Button\n            size=\"icon-sm\"\n            variant=\"ghost\"\n            onClick={onClose}\n            title={translate('ai.proposal.collapseReview')}\n            aria-label={translate('ai.proposal.collapseReview')}\n          >\n            <X />\n          </Button>\n        </Row>\n\n        <div className=\"min-h-0 flex-1 overflow-y-auto p-4 sm:p-6\">\n          <div className=\"mx-auto w-full max-w-3xl\">\n            <CollectionViewProvider source={source}>\n              <DocumentDiffView diff={diff} collection={collection} columnHeaders={columnHeaders} />\n            </CollectionViewProvider>\n          </div>\n        </div>\n\n        {status === 'pending' ? (\n          <Row gap=\"2\" align=\"center\" className=\"shrink-0 border-t border-border px-4 py-3\">\n            <Text size=\"xs\" tone=\"muted\" className=\"min-w-0 flex-1\">\n              {translate('ai.proposal.reviewHint')}\n            </Text>\n            <Button\n              size=\"sm\"\n              variant=\"ghost\"\n              onClick={() => {\n                onDiscard()\n                onClose()\n              }}\n            >\n              <X /> {translate('ai.proposal.discard')}\n            </Button>\n            <Button\n              size=\"sm\"\n              onClick={() => {\n                onApply()\n                onClose()\n              }}\n            >\n              <Check /> {translate('ai.proposal.apply')}\n            </Button>\n          </Row>\n        ) : null}\n      </aside>\n    </div>,\n    document.body,\n  )\n}\n"]}
+{"version":3,"file":"proposal-card.js","sourceRoot":"","sources":["../../../src/components/ai/proposal-card.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo, useState } from 'react'\nimport { ArrowUpRight, Check, Maximize2, Sparkles, X } from 'lucide-react'\nimport { diffDocuments } from '@elytracms/core/content'\nimport type { DocumentDiff } from '@elytracms/core/content'\nimport { resolveLabel } from '@elytracms/core/cms-core'\nimport type { CollectionDef } from '@elytracms/core/cms-core'\nimport { Badge, Button, ExpandableSurface, Row, Spacer, Stack, Text } from '@elytracms/studio/ui'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport { proposalDocuments } from '@elytracms/studio/lib/ai'\nimport type { ProposalOrigin, ProposalReview } from '@elytracms/studio/lib/ai'\nimport type { CollectionViewSource } from '@elytracms/studio/lib/collection-view/collection-view-source'\nimport { useCms } from '../cms/cms-store'\nimport { useCmsCollectionViewSource } from '../collection-view/cms-collection-view-source'\nimport { CollectionViewProvider } from '../collection-view/collection-view-context'\nimport { DocumentDiffView } from '../cms/document-diff-view'\n\n/**\n * The AI proposal review (EC-199, extended by EC-332/EC-378): a valid,\n * leash-compliant proposal the editor reviews as a DIFF (the shared EC-317\n * {@link DocumentDiffView} — never a second renderer) before applying it as a\n * draft or discarding it. Create proposals diff `empty-before` vs\n * `proposed-after`; translate/update proposals diff the EXISTING document\n * (old → new). Apply/discard are handled by the panel (the operations write +\n * provenance snapshot happen there); this card is the surface.\n *\n * {@link ProposalCard} is the CMS-wired shell; {@link ProposalCardView} is the\n * presentational card over an injected collection + view source (node-smoked\n * with `renderToStaticMarkup`, house pattern).\n */\n\n/** The card's origin-dependent captions (title + diff column headers). */\nexport function proposalCaptions(\n  origin: ProposalOrigin,\n  collectionLabel: string,\n): { title: string; unified: string; before: string; after: string } {\n  if (origin === 'translate') {\n    return {\n      title: translate('ai.translate.proposalTitle', { collection: collectionLabel }),\n      unified: translate('ai.proposal.diffUnified'),\n      before: translate('ai.translate.diffBefore'),\n      after: translate('ai.translate.diffAfter'),\n    }\n  }\n  if (origin === 'update') {\n    return {\n      title: translate('ai.update.proposalTitle', { collection: collectionLabel }),\n      unified: translate('ai.proposal.diffUnified'),\n      before: translate('ai.update.diffBefore'),\n      after: translate('ai.update.diffAfter'),\n    }\n  }\n  return {\n    title: translate('ai.proposal.title', { collection: collectionLabel }),\n    unified: translate('ai.proposal.diffUnified'),\n    before: translate('ai.proposal.diffBefore'),\n    after: translate('ai.proposal.diffAfter'),\n  }\n}\n\nexport function ProposalCard({\n  proposal,\n  onApply,\n  onDiscard,\n  onOpen,\n}: {\n  proposal: ProposalReview\n  onApply: () => void\n  onDiscard: () => void\n  onOpen: () => void\n}) {\n  const cms = useCms()\n  const collection = cms.getCollection(proposal.collection)\n  const source = useCmsCollectionViewSource(proposal.collection)\n  return (\n    <ProposalCardView\n      proposal={proposal}\n      collection={collection}\n      source={source}\n      onApply={onApply}\n      onDiscard={onDiscard}\n      onOpen={onOpen}\n    />\n  )\n}\n\n/** The presentational proposal card over an injected collection + view source. */\nexport function ProposalCardView({\n  proposal,\n  collection,\n  source,\n  onApply,\n  onDiscard,\n  onOpen,\n}: {\n  proposal: ProposalReview\n  collection: CollectionDef | undefined\n  source: CollectionViewSource | null\n  onApply: () => void\n  onDiscard: () => void\n  onOpen: () => void\n}) {\n  const diff = useMemo(() => {\n    if (!collection) return null\n    const { before, after } = proposalDocuments(proposal.patch, proposal.before)\n    return diffDocuments(collection, before, after)\n  }, [collection, proposal.patch, proposal.before])\n\n  const collectionLabel =\n    (collection?.form?.labelSingular && resolveLabel(collection.form.labelSingular)) ??\n    (collection?.form?.label && resolveLabel(collection.form.label)) ??\n    proposal.collection\n\n  const captions = proposalCaptions(proposal.origin, collectionLabel)\n  const applied = proposal.status === 'applied'\n  const rejected = proposal.status === 'rejected'\n  const columnHeaders = { unified: captions.unified, before: captions.before, after: captions.after }\n\n  // EC-382 — the expandable review surface: the sidebar card stays stacked; a\n  // roomy full-height sheet is offered for a large proposal (never a modal form).\n  const [reviewOpen, setReviewOpen] = useState(false)\n  const reviewable = diff !== null && source !== null\n\n  return (\n    <Stack\n      gap=\"2\"\n      className=\"overflow-hidden rounded-xl border border-border bg-card\"\n    >\n      <Row gap=\"2\" align=\"center\" className=\"border-b border-border/60 bg-muted/30 px-3 py-2\">\n        <Sparkles className=\"size-4 shrink-0 text-primary\" />\n        <Text size=\"sm\" weight=\"medium\" className=\"min-w-0 truncate\">\n          {captions.title}\n        </Text>\n        <Spacer />\n        {applied ? <Badge variant=\"success\">{translate('ai.proposal.applied')}</Badge> : null}\n        {rejected ? <Badge variant=\"outline\">{translate('ai.proposal.discarded')}</Badge> : null}\n        {reviewable ? (\n          <Button\n            size=\"icon-sm\"\n            variant=\"ghost\"\n            onClick={() => setReviewOpen(true)}\n            title={translate('ai.proposal.expandReview')}\n            aria-label={translate('ai.proposal.expandReview')}\n          >\n            <Maximize2 />\n          </Button>\n        ) : null}\n      </Row>\n\n      <div className=\"px-3\">\n        {reviewable ? (\n          <CollectionViewProvider source={source!}>\n            <DocumentDiffView\n              diff={diff!}\n              collection={collection!}\n              columnHeaders={columnHeaders}\n              layout=\"stacked\"\n            />\n          </CollectionViewProvider>\n        ) : (\n          <Text size=\"xs\" tone=\"muted\" className=\"py-2\">\n            {translate('ai.proposal.unavailable')}\n          </Text>\n        )}\n      </div>\n\n      <Row gap=\"2\" align=\"center\" className=\"border-t border-border/60 px-3 py-2\">\n        {proposal.status === 'pending' ? (\n          <>\n            <Text size=\"xs\" tone=\"muted\" className=\"min-w-0 flex-1\">\n              {translate('ai.proposal.reviewHint')}\n            </Text>\n            <Button size=\"sm\" variant=\"ghost\" onClick={onDiscard}>\n              <X /> {translate('ai.proposal.discard')}\n            </Button>\n            <Button size=\"sm\" onClick={onApply}>\n              <Check /> {translate('ai.proposal.apply')}\n            </Button>\n          </>\n        ) : applied ? (\n          <>\n            <Spacer />\n            <Button size=\"sm\" variant=\"outline\" onClick={onOpen}>\n              <ArrowUpRight /> {translate('ai.proposal.open')}\n            </Button>\n          </>\n        ) : (\n          <Text size=\"xs\" tone=\"muted\">\n            {translate('ai.proposal.discardedNote')}\n          </Text>\n        )}\n      </Row>\n\n      {reviewable && reviewOpen ? (\n        <ProposalReviewSheet\n          title={captions.title}\n          diff={diff!}\n          collection={collection!}\n          source={source!}\n          columnHeaders={columnHeaders}\n          status={proposal.status}\n          onApply={onApply}\n          onDiscard={onDiscard}\n          onClose={() => setReviewOpen(false)}\n        />\n      ) : null}\n    </Stack>\n  )\n}\n\n/**\n * The expandable review surface (EC-382): the proposal's diff promoted into a\n * roomy, full-height right-anchored sheet where the wide `grid` layout is\n * comfortable — for a large proposal the 320px sidebar can only cramp. It is a\n * REVIEW surface, not a form, so it stays lightly dismissible (backdrop click /\n * Escape / close button) rather than a trapping modal — the forms-never-modal\n * spirit, applied. Presentation only: Apply/Discard call the same handlers the\n * card does; it changes no proposal data. Since EC-392 it renders through the\n * shared {@link ExpandableSurface} primitive (portal-to-body, backdrop, header\n * close, layer-stacked Escape) at the shipped 720px width, so it escapes the\n * narrow AI panel; the card default keeps it closed, so the SSR smoke path\n * never mounts the portal.\n */\nfunction ProposalReviewSheet({\n  title,\n  diff,\n  collection,\n  source,\n  columnHeaders,\n  status,\n  onApply,\n  onDiscard,\n  onClose,\n}: {\n  title: string\n  diff: DocumentDiff\n  collection: CollectionDef\n  source: CollectionViewSource\n  columnHeaders: { unified: string; before: string; after: string }\n  status: ProposalReview['status']\n  onApply: () => void\n  onDiscard: () => void\n  onClose: () => void\n}) {\n  return (\n    <ExpandableSurface\n      title={title}\n      closeLabel={translate('ai.proposal.collapseReview')}\n      width=\"min(720px, 92vw)\"\n      onDismiss={onClose}\n      headerLeading={<Sparkles className=\"size-4 shrink-0 text-primary\" />}\n    >\n      <div className=\"min-h-0 flex-1 overflow-y-auto p-4 sm:p-6\">\n        <div className=\"mx-auto w-full max-w-3xl\">\n          <CollectionViewProvider source={source}>\n            <DocumentDiffView diff={diff} collection={collection} columnHeaders={columnHeaders} />\n          </CollectionViewProvider>\n        </div>\n      </div>\n\n      {status === 'pending' ? (\n        <Row gap=\"2\" align=\"center\" className=\"shrink-0 border-t border-border px-4 py-3\">\n          <Text size=\"xs\" tone=\"muted\" className=\"min-w-0 flex-1\">\n            {translate('ai.proposal.reviewHint')}\n          </Text>\n          <Button\n            size=\"sm\"\n            variant=\"ghost\"\n            onClick={() => {\n              onDiscard()\n              onClose()\n            }}\n          >\n            <X /> {translate('ai.proposal.discard')}\n          </Button>\n          <Button\n            size=\"sm\"\n            onClick={() => {\n              onApply()\n              onClose()\n            }}\n          >\n            <Check /> {translate('ai.proposal.apply')}\n          </Button>\n        </Row>\n      ) : null}\n    </ExpandableSurface>\n  )\n}\n"]}

package/dist/components/builder/property-inspector.d.ts

@@ -1 +1,22 @@
+import type { ComponentNode } from '@elytracms/core/project-graph';
+import type { ComponentManifest, PropField } from '@elytracms/core/component-registry';
 export declare function PropertyInspector(): import("react").JSX.Element;
+/**
+ * The prop rows the inspector renders for a node (EC-393). Manifest props MINUS:
+ * layout-managed props (they render in the Layout section, EC-162); `blocks` props
+ * (they are child regions shown in Slots, EC-190); and any prop hidden RIGHT NOW by
+ * its `form.hidden` — static `true`, or a predicate over the SIBLING prop values.
+ *
+ * The predicate's context is the component instance's EFFECTIVE prop values
+ * (`effectivePropValues` — static values with manifest defaults filled), the prop
+ * analogue of the document form's active-locale draft values (`isFieldHidden` there).
+ * So a conditional row shows/hides live as a sibling prop changes and unmounts
+ * exactly like a document-form field. Pure (no store) so the behaviour is testable.
+ */
+export declare function visibleInspectorProps(manifest: ComponentManifest, node: ComponentNode, layoutManaged: ReadonlySet<string>): [string, PropField][];
+declare function PropField({ node, name, spec }: {
+    node: ComponentNode;
+    name: string;
+    spec: PropField;
+}): import("react").JSX.Element;
+export {};

package/dist/components/builder/property-inspector.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { staticProp } from '@elytracms/core/project-graph';
-import { manifestSlots } from '@elytracms/core/component-registry';
+import { effectivePropValues, manifestSlots } from '@elytracms/core/component-registry';
+import { isFieldHidden } from '@elytracms/core/cms-core';
 import { getStudioRegistry } from '@elytracms/studio/lib/registry';
 import { Badge, Code, Field, InspectorSection, PanelHeader, Row, Spacer, Stack, Text, } from '@elytracms/studio/ui';
 import { humanizeName } from '@elytracms/studio/lib/utils';
@@ -19,17 +20,32 @@ export function PropertyInspector() {
     const manifest = studio.registry.getManifest(node.componentId);
     return (_jsxs("div", { className: "flex h-full min-h-0 flex-col", children: [_jsxs(PanelHeader, { children: [_jsx(Text, { size: "sm", weight: "semibold", children: translate('builder.inspector.title') }), _jsx(Spacer, {}), _jsx(Code, { tone: "muted", title: node.componentId, children: componentDisplayName(node.componentId, manifest) })] }), _jsx("div", { className: "min-h-0 flex-1 overflow-auto", children: _jsx(SettingsTab, { node: node, manifest: manifest }) })] }));
 }
+/**
+ * The prop rows the inspector renders for a node (EC-393). Manifest props MINUS:
+ * layout-managed props (they render in the Layout section, EC-162); `blocks` props
+ * (they are child regions shown in Slots, EC-190); and any prop hidden RIGHT NOW by
+ * its `form.hidden` — static `true`, or a predicate over the SIBLING prop values.
+ *
+ * The predicate's context is the component instance's EFFECTIVE prop values
+ * (`effectivePropValues` — static values with manifest defaults filled), the prop
+ * analogue of the document form's active-locale draft values (`isFieldHidden` there).
+ * So a conditional row shows/hides live as a sibling prop changes and unmounts
+ * exactly like a document-form field. Pure (no store) so the behaviour is testable.
+ */
+export function visibleInspectorProps(manifest, node, layoutManaged) {
+    const ctx = { values: effectivePropValues(manifest, node) };
+    return Object.entries(manifest.props).filter(([name, spec]) => !layoutManaged.has(name) &&
+        spec.type !== 'blocks' &&
+        !isFieldHidden({ ...spec, name }, ctx));
+}
 /** The full property surface: node identity, static props, condition, slots. */
 function SettingsTab({ node, manifest, }) {
     // Container layout props render in the dedicated Layout section (EC-162),
     // not as a second set of generic controls.
     const layoutManaged = new Set(layoutManagedPropNames(node));
-    // EC-190: `blocks` props are slots (named child regions), edited via the page
-    // tree / composition surface, not as a scalar control — so they show in the
-    // Slots section, not Props.
-    const props = manifest
-        ? Object.entries(manifest.props).filter(([name, spec]) => !layoutManaged.has(name) && spec.type !== 'blocks')
-        : [];
+    // EC-190: `blocks` props are slots; EC-393: `form.hidden` props are omitted —
+    // evaluated against the node's effective sibling prop values, live as they change.
+    const props = manifest ? visibleInspectorProps(manifest, node, layoutManaged) : [];
     const slots = manifest ? manifestSlots(manifest) : [];
     return (_jsxs(_Fragment, { children: [_jsx(LayoutSection, { node: node }), !manifest ? (_jsxs("div", { className: "p-3", children: [_jsx(Badge, { variant: "error", children: translate('builder.inspector.unknownComponent') }), _jsx(Text, { size: "xs", tone: "muted", className: "mt-2", children: translate('builder.inspector.noManifest') })] })) : (_jsx(InspectorSection, { title: translate('builder.inspector.props'), children: props.length === 0 ? (_jsx(Text, { size: "xs", tone: "subtle", children: translate('builder.inspector.noEditableProps') })) : (_jsx(Stack, { gap: "4", children: props.map(([name, spec]) => (_jsx(PropField, { node: node, name: name, spec: spec }, `${node.id}:${name}`))) })) })), slots.length > 0 ? (_jsxs(InspectorSection, { title: translate('builder.inspector.slots'), children: [_jsx(Stack, { gap: "1", children: slots.map((slot) => {
                             const count = node.slots?.[slot.name]?.length ?? 0;
@@ -43,6 +59,6 @@ function PropField({ node, name, spec }) {
     const id = `prop-${node.id}-${name}`;
     // Coalesce rapid edits to the same prop into one undo step (EC-190).
     const coalesceKey = `${node.id}:${name}`;
-    return (_jsx(Field, { label: localizedLabel(spec.form?.label, name), htmlFor: id, children: _jsx(PropValueControl, { id: id, name: name, spec: spec, value: value, onSet: (v) => builder.dispatch({ type: 'setProp', id: node.id, name, value: staticProp(v), coalesceKey }), onClear: () => builder.dispatch({ type: 'removeProp', id: node.id, name }) }) }));
+    return (_jsx(Field, { label: localizedLabel(spec.form?.label, name), htmlFor: id, hint: localizedLabel(spec.form?.description) || undefined, children: _jsx(PropValueControl, { id: id, name: name, spec: spec, value: value, onSet: (v) => builder.dispatch({ type: 'setProp', id: node.id, name, value: staticProp(v), coalesceKey }), onClear: () => builder.dispatch({ type: 'removeProp', id: node.id, name }) }) }));
 }
 //# sourceMappingURL=property-inspector.js.map

package/dist/components/builder/property-inspector.js.map

@@ -1 +1 @@
-{"version":3,"file":"property-inspector.js","sourceRoot":"","sources":["../../../src/components/builder/property-inspector.tsx"],"names":[],"mappings":"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","sourcesContent":["import { staticProp } from '@elytracms/core/project-graph'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport type { ComponentManifest, PropField } from '@elytracms/core/component-registry'\nimport { manifestSlots } from '@elytracms/core/component-registry'\nimport { getStudioRegistry } from '@elytracms/studio/lib/registry'\nimport {\n  Badge,\n  Code,\n  Field,\n  InspectorSection,\n  PanelHeader,\n  Row,\n  Spacer,\n  Stack,\n  Text,\n} from '@elytracms/studio/ui'\nimport { humanizeName } from '@elytracms/studio/lib/utils'\nimport { localizedLabel, translate } from '@elytracms/studio/lib/i18n'\nimport { componentDisplayName } from '@elytracms/studio/lib/persona/labels'\nimport { PropValueControl } from '../cms/prop-fields'\nimport { useBuilder } from './builder-store'\nimport { LayoutSection, layoutManagedPropNames } from './layout-inspector'\n\nexport function PropertyInspector() {\n  const builder = useBuilder()\n  const studio = getStudioRegistry()\n  const node = builder.selectedNode\n\n  if (!node) {\n    return (\n      <div className=\"grid h-full place-items-center p-6 text-center\">\n        <Text size=\"sm\" tone=\"muted\">\n          {translate('builder.inspector.emptySelection')}\n        </Text>\n      </div>\n    )\n  }\n\n  const manifest = studio.registry.getManifest(node.componentId)\n\n  return (\n    <div className=\"flex h-full min-h-0 flex-col\">\n      <PanelHeader>\n        <Text size=\"sm\" weight=\"semibold\">\n          {translate('builder.inspector.title')}\n        </Text>\n        <Spacer />\n        <Code tone=\"muted\" title={node.componentId}>\n          {componentDisplayName(node.componentId, manifest)}\n        </Code>\n      </PanelHeader>\n\n      <div className=\"min-h-0 flex-1 overflow-auto\">\n        <SettingsTab node={node} manifest={manifest} />\n      </div>\n    </div>\n  )\n}\n\n/** The full property surface: node identity, static props, condition, slots. */\nfunction SettingsTab({\n  node,\n  manifest,\n}: {\n  node: ComponentNode\n  manifest: ComponentManifest | undefined\n}) {\n  // Container layout props render in the dedicated Layout section (EC-162),\n  // not as a second set of generic controls.\n  const layoutManaged = new Set(layoutManagedPropNames(node))\n  // EC-190: `blocks` props are slots (named child regions), edited via the page\n  // tree / composition surface, not as a scalar control — so they show in the\n  // Slots section, not Props.\n  const props = manifest\n    ? Object.entries(manifest.props).filter(\n        ([name, spec]) => !layoutManaged.has(name) && spec.type !== 'blocks',\n      )\n    : []\n  const slots = manifest ? manifestSlots(manifest) : []\n\n  return (\n    <>\n      {/* EC-192: the editor-facing inspector no longer renders the raw node id or\n          namespaced component id (the persona promise). The component's human name\n          is in the panel header (with the manifest id in its `title`); the canvas\n          and tree provide selection. */}\n      {/* Contextual layout inspector for Stack/Grid containers (EC-162). */}\n      <LayoutSection node={node} />\n\n      {!manifest ? (\n        <div className=\"p-3\">\n          <Badge variant=\"error\">{translate('builder.inspector.unknownComponent')}</Badge>\n          <Text size=\"xs\" tone=\"muted\" className=\"mt-2\">\n            {translate('builder.inspector.noManifest')}\n          </Text>\n        </div>\n      ) : (\n        <InspectorSection title={translate('builder.inspector.props')}>\n          {props.length === 0 ? (\n            <Text size=\"xs\" tone=\"subtle\">\n              {translate('builder.inspector.noEditableProps')}\n            </Text>\n          ) : (\n            <Stack gap=\"4\">\n              {props.map(([name, spec]) => (\n                // Key by node id so per-node local control state never leaks\n                // across a selection change to a same-named prop.\n                <PropField key={`${node.id}:${name}`} node={node} name={name} spec={spec} />\n              ))}\n            </Stack>\n          )}\n        </InspectorSection>\n      )}\n\n      {slots.length > 0 ? (\n        <InspectorSection title={translate('builder.inspector.slots')}>\n          <Stack gap=\"1\">\n            {slots.map((slot) => {\n              const count = node.slots?.[slot.name]?.length ?? 0\n              const missing = slot.required && count === 0\n              return (\n                <Row key={slot.name} gap=\"2\">\n                  <Text size=\"xs\" title={slot.name}>\n                    {humanizeName(slot.name)}\n                  </Text>\n                  {slot.required ? (\n                    <Badge variant={missing ? 'error' : 'outline'}>{translate('common.required')}</Badge>\n                  ) : null}\n                  <Spacer />\n                  <Text size=\"xs\" tone=\"subtle\" mono>\n                    {count}\n                  </Text>\n                </Row>\n              )\n            })}\n          </Stack>\n          <Text size=\"xs\" tone=\"subtle\" className=\"mt-2\">\n            {translate('builder.inspector.slotsHint')}\n          </Text>\n        </InspectorSection>\n      ) : null}\n    </>\n  )\n}\n\nfunction PropField({ node, name, spec }: { node: ComponentNode; name: string; spec: PropField }) {\n  const builder = useBuilder()\n  const value = node.props?.[name]\n  const id = `prop-${node.id}-${name}`\n  // Coalesce rapid edits to the same prop into one undo step (EC-190).\n  const coalesceKey = `${node.id}:${name}`\n\n  return (\n    <Field label={localizedLabel(spec.form?.label, name)} htmlFor={id}>\n      <PropValueControl\n        id={id}\n        name={name}\n        spec={spec}\n        value={value}\n        onSet={(v) => builder.dispatch({ type: 'setProp', id: node.id, name, value: staticProp(v), coalesceKey })}\n        onClear={() => builder.dispatch({ type: 'removeProp', id: node.id, name })}\n      />\n    </Field>\n  )\n}\n\n"]}
+{"version":3,"file":"property-inspector.js","sourceRoot":"","sources":["../../../src/components/builder/property-inspector.tsx"],"names":[],"mappings":"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","sourcesContent":["import { staticProp } from '@elytracms/core/project-graph'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport type { ComponentManifest, PropField } from '@elytracms/core/component-registry'\nimport { effectivePropValues, manifestSlots } from '@elytracms/core/component-registry'\nimport { isFieldHidden } from '@elytracms/core/cms-core'\nimport type { FieldConditionContext, FieldDef } from '@elytracms/core/cms-core'\nimport { getStudioRegistry } from '@elytracms/studio/lib/registry'\nimport {\n  Badge,\n  Code,\n  Field,\n  InspectorSection,\n  PanelHeader,\n  Row,\n  Spacer,\n  Stack,\n  Text,\n} from '@elytracms/studio/ui'\nimport { humanizeName } from '@elytracms/studio/lib/utils'\nimport { localizedLabel, translate } from '@elytracms/studio/lib/i18n'\nimport { componentDisplayName } from '@elytracms/studio/lib/persona/labels'\nimport { PropValueControl } from '../cms/prop-fields'\nimport { useBuilder } from './builder-store'\nimport { LayoutSection, layoutManagedPropNames } from './layout-inspector'\n\nexport function PropertyInspector() {\n  const builder = useBuilder()\n  const studio = getStudioRegistry()\n  const node = builder.selectedNode\n\n  if (!node) {\n    return (\n      <div className=\"grid h-full place-items-center p-6 text-center\">\n        <Text size=\"sm\" tone=\"muted\">\n          {translate('builder.inspector.emptySelection')}\n        </Text>\n      </div>\n    )\n  }\n\n  const manifest = studio.registry.getManifest(node.componentId)\n\n  return (\n    <div className=\"flex h-full min-h-0 flex-col\">\n      <PanelHeader>\n        <Text size=\"sm\" weight=\"semibold\">\n          {translate('builder.inspector.title')}\n        </Text>\n        <Spacer />\n        <Code tone=\"muted\" title={node.componentId}>\n          {componentDisplayName(node.componentId, manifest)}\n        </Code>\n      </PanelHeader>\n\n      <div className=\"min-h-0 flex-1 overflow-auto\">\n        <SettingsTab node={node} manifest={manifest} />\n      </div>\n    </div>\n  )\n}\n\n/**\n * The prop rows the inspector renders for a node (EC-393). Manifest props MINUS:\n * layout-managed props (they render in the Layout section, EC-162); `blocks` props\n * (they are child regions shown in Slots, EC-190); and any prop hidden RIGHT NOW by\n * its `form.hidden` — static `true`, or a predicate over the SIBLING prop values.\n *\n * The predicate's context is the component instance's EFFECTIVE prop values\n * (`effectivePropValues` — static values with manifest defaults filled), the prop\n * analogue of the document form's active-locale draft values (`isFieldHidden` there).\n * So a conditional row shows/hides live as a sibling prop changes and unmounts\n * exactly like a document-form field. Pure (no store) so the behaviour is testable.\n */\nexport function visibleInspectorProps(\n  manifest: ComponentManifest,\n  node: ComponentNode,\n  layoutManaged: ReadonlySet<string>,\n): [string, PropField][] {\n  const ctx: FieldConditionContext = { values: effectivePropValues(manifest, node) }\n  return Object.entries(manifest.props).filter(\n    ([name, spec]) =>\n      !layoutManaged.has(name) &&\n      spec.type !== 'blocks' &&\n      !isFieldHidden({ ...spec, name } as FieldDef, ctx),\n  )\n}\n\n/** The full property surface: node identity, static props, condition, slots. */\nfunction SettingsTab({\n  node,\n  manifest,\n}: {\n  node: ComponentNode\n  manifest: ComponentManifest | undefined\n}) {\n  // Container layout props render in the dedicated Layout section (EC-162),\n  // not as a second set of generic controls.\n  const layoutManaged = new Set(layoutManagedPropNames(node))\n  // EC-190: `blocks` props are slots; EC-393: `form.hidden` props are omitted —\n  // evaluated against the node's effective sibling prop values, live as they change.\n  const props = manifest ? visibleInspectorProps(manifest, node, layoutManaged) : []\n  const slots = manifest ? manifestSlots(manifest) : []\n\n  return (\n    <>\n      {/* EC-192: the editor-facing inspector no longer renders the raw node id or\n          namespaced component id (the persona promise). The component's human name\n          is in the panel header (with the manifest id in its `title`); the canvas\n          and tree provide selection. */}\n      {/* Contextual layout inspector for Stack/Grid containers (EC-162). */}\n      <LayoutSection node={node} />\n\n      {!manifest ? (\n        <div className=\"p-3\">\n          <Badge variant=\"error\">{translate('builder.inspector.unknownComponent')}</Badge>\n          <Text size=\"xs\" tone=\"muted\" className=\"mt-2\">\n            {translate('builder.inspector.noManifest')}\n          </Text>\n        </div>\n      ) : (\n        <InspectorSection title={translate('builder.inspector.props')}>\n          {props.length === 0 ? (\n            <Text size=\"xs\" tone=\"subtle\">\n              {translate('builder.inspector.noEditableProps')}\n            </Text>\n          ) : (\n            <Stack gap=\"4\">\n              {props.map(([name, spec]) => (\n                // Key by node id so per-node local control state never leaks\n                // across a selection change to a same-named prop.\n                <PropField key={`${node.id}:${name}`} node={node} name={name} spec={spec} />\n              ))}\n            </Stack>\n          )}\n        </InspectorSection>\n      )}\n\n      {slots.length > 0 ? (\n        <InspectorSection title={translate('builder.inspector.slots')}>\n          <Stack gap=\"1\">\n            {slots.map((slot) => {\n              const count = node.slots?.[slot.name]?.length ?? 0\n              const missing = slot.required && count === 0\n              return (\n                <Row key={slot.name} gap=\"2\">\n                  <Text size=\"xs\" title={slot.name}>\n                    {humanizeName(slot.name)}\n                  </Text>\n                  {slot.required ? (\n                    <Badge variant={missing ? 'error' : 'outline'}>{translate('common.required')}</Badge>\n                  ) : null}\n                  <Spacer />\n                  <Text size=\"xs\" tone=\"subtle\" mono>\n                    {count}\n                  </Text>\n                </Row>\n              )\n            })}\n          </Stack>\n          <Text size=\"xs\" tone=\"subtle\" className=\"mt-2\">\n            {translate('builder.inspector.slotsHint')}\n          </Text>\n        </InspectorSection>\n      ) : null}\n    </>\n  )\n}\n\nfunction PropField({ node, name, spec }: { node: ComponentNode; name: string; spec: PropField }) {\n  const builder = useBuilder()\n  const value = node.props?.[name]\n  const id = `prop-${node.id}-${name}`\n  // Coalesce rapid edits to the same prop into one undo step (EC-190).\n  const coalesceKey = `${node.id}:${name}`\n\n  return (\n    // EC-393: honor `form.description` as the field hint, at parity with the document\n    // form (`detail-editor.tsx` passes the same to its `Field`).\n    <Field\n      label={localizedLabel(spec.form?.label, name)}\n      htmlFor={id}\n      hint={localizedLabel(spec.form?.description) || undefined}\n    >\n      <PropValueControl\n        id={id}\n        name={name}\n        spec={spec}\n        value={value}\n        onSet={(v) => builder.dispatch({ type: 'setProp', id: node.id, name, value: staticProp(v), coalesceKey })}\n        onClear={() => builder.dispatch({ type: 'removeProp', id: node.id, name })}\n      />\n    </Field>\n  )\n}\n\n"]}

package/dist/components/cms/detail-editor.d.ts

@@ -1,3 +1,4 @@
+import type { ReactNode } from 'react';
 import type { CollectionViewSource } from '@elytracms/studio/lib/collection-view/collection-view-source';
 export declare function DetailEditor({ projectId, collectionId, documentId, focusPath, }: {
     projectId: string;
@@ -13,9 +14,19 @@ export declare function DetailEditor({ projectId, collectionId, documentId, focu
  * routing (the "back to list" target, the not-found link) is rail-owned via
  * `source.listPath`, so the shell never hard-codes the CMS route.
  */
-export declare function PortableDetailEditor({ source, projectId, documentId, focusPath, }: {
+export declare function PortableDetailEditor({ source, projectId, documentId, focusPath, formAppendix, }: {
     source: CollectionViewSource;
     projectId: string;
     documentId: string;
     focusPath?: string;
+    /**
+     * EC-396 — a form-column appendix seam (a direct-value node, per the customization
+     * principle — no registry): rendered INSIDE the editor's form column, below the
+     * fieldset cards, at the same `max-w-2xl` width and gap-6 rhythm. The account
+     * surface mounts its `CredentialPanel` through it so the account page is ONE editor
+     * surface (the editor owns the scroll + fills the height, so the Issues sidebar
+     * spans the full surface), never a second parallel card wrapper. Absent for the CMS
+     * and users entry points, which pass nothing.
+     */
+    formAppendix?: ReactNode;
 }): import("react").JSX.Element;

package/dist/components/cms/detail-editor.js

@@ -70,7 +70,7 @@ export function DetailEditor({ projectId, collectionId, documentId, focusPath, }
  * routing (the "back to list" target, the not-found link) is rail-owned via
  * `source.listPath`, so the shell never hard-codes the CMS route.
  */
-export function PortableDetailEditor({ source, projectId, documentId, focusPath, }) {
+export function PortableDetailEditor({ source, projectId, documentId, focusPath, formAppendix, }) {
     const doc = source.get({ collection: source.collectionId, id: documentId });
     // EC-274: singleton opening is owned by `SingletonGate` (it resolves the lone
     // document and materializes it). The detail editor just renders the document it
@@ -78,13 +78,13 @@ export function PortableDetailEditor({ source, projectId, documentId, focusPath,
     if (!doc) {
         return (_jsx(DocumentNotFound, { projectId: projectId, listPath: source.listPath, label: localizedLabel(source.schema.form?.label, source.collectionId) }));
     }
-    return (_jsx(CollectionViewProvider, { source: source, children: _jsx(EditorBody, { projectId: projectId, collection: source.schema, doc: doc, focusPath: focusPath }, `${source.collectionId}/${documentId}`) }));
+    return (_jsx(CollectionViewProvider, { source: source, children: _jsx(EditorBody, { projectId: projectId, collection: source.schema, doc: doc, focusPath: focusPath, formAppendix: formAppendix }, `${source.collectionId}/${documentId}`) }));
 }
 /** The record-not-found state — a heading + a rail-owned "back to list" link. */
 function DocumentNotFound({ projectId, listPath, label, }) {
     return (_jsx("div", { className: "grid h-full place-items-center p-8", children: _jsxs(Stack, { gap: "3", align: "center", className: "text-center", children: [_jsx(Heading, { level: 2, size: "h2", children: translate('cms.editor.notFoundTitle') }), listPath !== undefined ? (_jsx(Link, { to: STUDIO_PROJECT_ROUTE, params: { projectId, _splat: listPath }, className: "text-sm text-primary hover:underline", children: translate('cms.editor.backToList', { label }) })) : null] }) }));
 }
-function EditorBody({ projectId, collection, doc, focusPath, }) {
+function EditorBody({ projectId, collection, doc, focusPath, formAppendix, }) {
     const source = useCollectionView();
     const navigate = useNavigate();
     // AD-19: capability flags gate whole shell regions AND their method groups, so
@@ -508,26 +508,26 @@ function EditorBody({ projectId, collection, doc, focusPath, }) {
                                                     ? 'bg-accent text-accent-foreground'
                                                     : 'text-muted-foreground hover:bg-muted'), children: [_jsxs("button", { type: "button", onClick: () => setActiveTab(COMPARE_TAB), "aria-pressed": activeTab === COMPARE_TAB, className: "inline-flex items-center gap-1", children: [_jsx(GitCompareArrows, { className: "size-3", "aria-hidden": true }), " ", translate('cms.version.compare')] }), _jsx("button", { type: "button", onClick: exitCompare, "aria-label": translate('cms.version.closeCompare'), className: "ml-0.5 rounded p-0.5 hover:bg-background/40", children: _jsx(X, { className: "size-3" }) })] })) : null] }), _jsx(Spacer, {}), canLocales ? _jsx(LocaleSwitcher, {}) : null, canPublish ? (_jsxs(Row, { gap: "px", className: "rounded-md bg-muted/60 p-0.5", children: [_jsx(PerspectiveButton, { label: translate('cms.editor.draftState'), active: perspective === 'draft', onClick: () => setPerspective('draft') }), _jsx(PerspectiveButton, { label: translate('cms.editor.publishedState'), active: perspective === 'published', accent: "info", disabled: !published, title: published ? undefined : translate('cms.editor.publishToViewPublished'), onClick: () => setPerspective('published') })] })) : null] })) : null] }), viewReadOnly ? (_jsxs(Row, { gap: "2", className: "shrink-0 border-b border-info/30 bg-info/10 px-4 py-1.5 text-info sm:px-6", "data-testid": "published-view-banner", children: [_jsx(Lock, { className: "size-3.5 shrink-0", "aria-hidden": true }), _jsx(Text, { size: "xs", className: "text-info", children: translate('cms.editor.publishedReadOnlyBanner') }), _jsx(Spacer, {}), _jsx("button", { type: "button", onClick: () => setPerspective('draft'), className: "text-xs font-medium underline-offset-2 hover:underline", children: translate('cms.editor.switchToDraft') })] })) : null, publishedPending ? (_jsx("div", { className: "grid min-h-0 flex-1 place-items-center p-8", children: _jsx(Text, { size: "sm", tone: "muted", children: publishedSnapshot.status === 'loading'
                                 ? translate('cms.editor.loadingPublishedVersion')
-                                : translate('cms.editor.noPublishedVersion') }) })) : activeTab === COMPARE_TAB && compare ? (_jsxs("div", { className: "flex min-h-0 flex-1 overflow-hidden", children: [_jsx("div", { className: "min-h-0 flex-1 overflow-auto", children: _jsx(VersionCompare, {}) }), _jsx(InspectorSidebar, { panes: trailingPanes, activeId: inspectorPaneId, onActiveChange: setInspectorPaneId, className: "w-[320px] shrink-0 border-l border-border" })] })) : canvasField ? (_jsx("div", { className: "min-h-0 flex-1 overflow-hidden", children: _jsx(CompositionFieldEditor, { field: canvasField, value: getValue(canvasField), onChange: (v) => setValue(canvasField, v), readOnly: viewReadOnly || source.isFieldReadOnly(canvasField), trailingPanes: trailingPanes }, `${canvasField.name}:${restoreNonce}:${perspective}`) })) : activeTab === REFERENCES_TAB ? (_jsx("div", { className: "flex min-h-0 flex-1 overflow-hidden", children: _jsx("div", { className: "min-h-0 flex-1 overflow-auto p-4 sm:p-6", children: _jsx("div", { className: "mx-auto w-full max-w-2xl", children: _jsx(ReferencesPanel, { projectId: projectId, source: { type: 'document', id: documentKey(ref) }, target: { type: 'document', id: documentKey(ref) } }) }) }) })) : (_jsxs("div", { className: "flex min-h-0 flex-1 overflow-hidden", children: [_jsx("div", { className: "min-h-0 flex-1 overflow-auto p-4 sm:p-6", children: _jsx("div", { className: "mx-auto w-full max-w-2xl", children: _jsx(Stack, { gap: "6", children: groups.map((group) => {
-                                            // EC-306: a conditionally/statically hidden group section is skipped
-                                            // entirely (its fields are also exempt from validation).
-                                            if (hiddenGroups.has(group.name))
-                                                return null;
-                                            // EC-273/EC-240: drop a fieldset whose every field is hidden — whether
-                                            // content-conditionally or for this principal — so the form never
-                                            // shows an empty section header.
-                                            const visible = group.fields.filter(isFieldShown);
-                                            if (visible.length === 0)
-                                                return null;
-                                            const section = group.section;
-                                            // EC-241: a section `title` is a LocalizedString ({ en, de } or a plain
-                                            // string) — resolve it against the active UI locale before rendering.
-                                            const sectionTitle = section?.title !== undefined ? localizedLabel(section.title, group.name) : undefined;
-                                            return (_jsx(CollapsibleSection, { collapsible: section?.collapsible, defaultOpen: section?.defaultOpen, title: _jsx(Text, { size: "sm", weight: "semibold", className: sectionTitle || group.name === DEFAULT_FIELD_GROUP ? undefined : 'capitalize', children: sectionTitle ??
-                                                        (group.name === DEFAULT_FIELD_GROUP
-                                                            ? translate('cms.editor.defaultGroup')
-                                                            : group.name) }), children: _jsx("div", { className: "grid grid-cols-1 gap-4 p-4 md:grid-cols-12", children: visible.map((field) => (_jsx("div", { className: cn('col-span-1', fieldWidthColSpan(field.form?.width)), children: renderFieldRow(field) }, field.name))) }) }, group.name));
-                                        }) }) }) }), activeEmbed ? (_jsx(EmbedInspector, { payload: activeEmbed, className: "w-[320px] shrink-0 border-l border-border" })) : (_jsx(InspectorSidebar, { panes: trailingPanes, activeId: inspectorPaneId, onActiveChange: setInspectorPaneId, className: "w-[320px] shrink-0 border-l border-border" }))] })), explicitSave ? (_jsx(UnsavedChangesGuard, { when: dirty, onSave: () => {
+                                : translate('cms.editor.noPublishedVersion') }) })) : activeTab === COMPARE_TAB && compare ? (_jsxs("div", { className: "flex min-h-0 flex-1 overflow-hidden", children: [_jsx("div", { className: "min-h-0 flex-1 overflow-auto", children: _jsx(VersionCompare, {}) }), _jsx(InspectorSidebar, { panes: trailingPanes, activeId: inspectorPaneId, onActiveChange: setInspectorPaneId, className: "w-[320px] shrink-0 border-l border-border" })] })) : canvasField ? (_jsx("div", { className: "min-h-0 flex-1 overflow-hidden", children: _jsx(CompositionFieldEditor, { field: canvasField, value: getValue(canvasField), onChange: (v) => setValue(canvasField, v), readOnly: viewReadOnly || source.isFieldReadOnly(canvasField), trailingPanes: trailingPanes }, `${canvasField.name}:${restoreNonce}:${perspective}`) })) : activeTab === REFERENCES_TAB ? (_jsx("div", { className: "flex min-h-0 flex-1 overflow-hidden", children: _jsx("div", { className: "min-h-0 flex-1 overflow-auto p-4 sm:p-6", children: _jsx("div", { className: "mx-auto w-full max-w-2xl", children: _jsx(ReferencesPanel, { projectId: projectId, source: { type: 'document', id: documentKey(ref) }, target: { type: 'document', id: documentKey(ref) } }) }) }) })) : (_jsxs("div", { className: "flex min-h-0 flex-1 overflow-hidden", children: [_jsx("div", { className: "min-h-0 flex-1 overflow-auto p-4 sm:p-6", children: _jsx("div", { className: "mx-auto w-full max-w-2xl", children: _jsxs(Stack, { gap: "6", children: [groups.map((group) => {
+                                                // EC-306: a conditionally/statically hidden group section is skipped
+                                                // entirely (its fields are also exempt from validation).
+                                                if (hiddenGroups.has(group.name))
+                                                    return null;
+                                                // EC-273/EC-240: drop a fieldset whose every field is hidden — whether
+                                                // content-conditionally or for this principal — so the form never
+                                                // shows an empty section header.
+                                                const visible = group.fields.filter(isFieldShown);
+                                                if (visible.length === 0)
+                                                    return null;
+                                                const section = group.section;
+                                                // EC-241: a section `title` is a LocalizedString ({ en, de } or a plain
+                                                // string) — resolve it against the active UI locale before rendering.
+                                                const sectionTitle = section?.title !== undefined ? localizedLabel(section.title, group.name) : undefined;
+                                                return (_jsx(CollapsibleSection, { collapsible: section?.collapsible, defaultOpen: section?.defaultOpen, title: _jsx(Text, { size: "sm", weight: "semibold", className: sectionTitle || group.name === DEFAULT_FIELD_GROUP ? undefined : 'capitalize', children: sectionTitle ??
+                                                            (group.name === DEFAULT_FIELD_GROUP
+                                                                ? translate('cms.editor.defaultGroup')
+                                                                : group.name) }), children: _jsx("div", { className: "grid grid-cols-1 gap-4 p-4 md:grid-cols-12", children: visible.map((field) => (_jsx("div", { className: cn('col-span-1', fieldWidthColSpan(field.form?.width)), children: renderFieldRow(field) }, field.name))) }) }, group.name));
+                                            }), formAppendix] }) }) }), activeEmbed ? (_jsx(EmbedInspector, { payload: activeEmbed, className: "w-[320px] shrink-0 border-l border-border" })) : (_jsx(InspectorSidebar, { panes: trailingPanes, activeId: inspectorPaneId, onActiveChange: setInspectorPaneId, className: "w-[320px] shrink-0 border-l border-border" }))] })), explicitSave ? (_jsx(UnsavedChangesGuard, { when: dirty, onSave: () => {
                             save();
                             return true;
                         }, description: translate('cms.editor.unsavedChangesGuard') })) : null, confirmAction !== null ? (_jsx(ReferenceConfirmDialog, { projectId: projectId, action: confirmAction, targets: confirmTargets, open: true, onOpenChange: (open) => {