@bettercms-ai/kit 0.1.1 → 1.0.0

package/controls/rich-text/component-card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"component-card.js","names":[],"sources":["../../../src/kit/controls/rich-text/component-card.tsx"],"sourcesContent":["/**\n * The embedded component card (V2 features/blocks/instance-card.tsx + instance-ui.tsx StateChip / MissingNote / dialogs),\n * drawn when the host can look the component up (KitServices.useComponentInfo, component-services.ts):\n *\n *   ┌ [icon] Inline CTA   🔗 2 places · ● Edited here                          ⋯ ┐  36px strip\n *   ├ ⚠ The original \"Product card\" was deleted. …   [Keep as a separate copy] [Remove] ┤  missing only\n *   │  the component itself, drawn live with this place's values (KitServices.ComponentPreview), else    │\n *   │  its snapshot where this place shows exactly that, else its fields; at most 240px, faded            │\n *   └──────────────────────────────────────────────────────────────────────────────┘\n *\n * Every state comes from the lookup or the stored copy: \"Missing component\" only when the library says there is no\n * such component, the count only when the host measured it, \"Edited here\" only for overrides of fields the component\n * has, \"Detached\" for a separate copy (V2 instances.ts `detached`), and \"Shared version changed\" only when the\n * component's current version (`info.publishedAt`) differs from the one the copy was taken from.\n *\n * A separate copy is made through the host (`copyComponent`, which answers what readers see now) and written as ONE\n * undo step (V2 detachNow: \"Make a separate copy\"); \"Use shared version again\" (V2 RelinkDialog) keeps this place's\n * edits as overrides or drops them, also one step. A host without `copyComponent` offers neither.\n *\n * Deviation from V2: V2 shows \"Shared version changed\" on a LINKED instance after a breaking release (instances.ts\n * `pending`). A linked instance here follows every publish of its component, so there is nothing to review; the\n * notice is drawn on a separate copy instead, whose source moved on, and it opens \"Use shared version again\".\n */\nimport * as React from \"react\";\nimport {\n  IconAlertTriangle, IconArrowDown, IconArrowUp, IconComponents, IconCopy, IconDots, IconLayoutNavbarCollapse, IconLayoutNavbarExpand, IconLink,\n  IconRefresh, IconTrash, IconUnlink,\n} from \"@tabler/icons-react\";\nimport { cn } from \"../../lib/cn\";\nimport { useKitServices, type KitServices } from \"../../context\";\nimport { Button, IconButton } from \"../../ui/button\";\nimport { Menu, MenuContent, MenuItem, MenuSeparator, MenuTrigger, Modal, ModalBody, ModalContent, ModalFooter, ModalHeader, Tooltip } from \"../../ui/overlay\";\nimport type { KitComponentField, KitComponentPreviewProps } from \"../component-services\";\nimport type { ComponentModel, IslandEl } from \"./dom\";\nimport type { IslandCtx } from \"./blocks\";\n\n/** V2 NARROW: at or under this card width the scope chip shows its icon only. */\nconst NARROW = 480;\n/** V2 PREVIEW_CAP: the preview at rest is at most this tall, faded when its content is taller. */\nconst PREVIEW_H = 240;\n\nconst placesShort = (n: number) => `${n} ${n === 1 ? \"place\" : \"places\"}`;\n\nfunction useWidth(ref: React.RefObject<HTMLElement | null>) {\n  const [w, setW] = React.useState(0);\n  React.useLayoutEffect(() => {\n    const el = ref.current;\n    if (!el) return;\n    setW(el.clientWidth);\n    if (typeof ResizeObserver === \"undefined\") return;\n    const ro = new ResizeObserver(() => setW(el.clientWidth));\n    ro.observe(el);\n    return () => ro.disconnect();\n  }, [ref]);\n  return w;\n}\n\n/** A stored value as one line of reading text, or null when it has none (lists, empty values, flags). */\nfunction readable(v: unknown): string | null {\n  if (typeof v === \"number\") return String(v);\n  if (typeof v === \"string\") {\n    const t = v.replace(/<[^>]+>/g, \" \").replace(/&nbsp;/g, \" \").replace(/\\s+/g, \" \").trim();\n    return t || null;\n  }\n  if (v && typeof v === \"object\" && !Array.isArray(v)) {\n    const o = v as { label?: unknown; text?: unknown; title?: unknown; href?: unknown };\n    return readable(o.label ?? o.text ?? o.title ?? o.href);\n  }\n  return null;\n}\n\nconst parseObj = (s: string | undefined): Record<string, unknown> => {\n  try {\n    const v = s ? (JSON.parse(s) as unknown) : {};\n    return v && typeof v === \"object\" && !Array.isArray(v) ? (v as Record<string, unknown>) : {};\n  } catch {\n    return {};\n  }\n};\n/** True when `a` is a later instant than `b`; false when either is absent or unreadable (never a made-up \"changed\"). */\nconst laterThan = (a: string | null | undefined, b: string | undefined) => {\n  const x = a ? Date.parse(a) : NaN;\n  const y = b ? Date.parse(b) : NaN;\n  return Number.isFinite(x) && Number.isFinite(y) && x > y;\n};\nconst same = (a: unknown, b: unknown) => a === b || JSON.stringify(a) === JSON.stringify(b);\n\ntype UseComponentInfo = NonNullable<KitServices[\"useComponentInfo\"]>;\ntype SetComponent = (patch: (m: ComponentModel) => ComponentModel, label: string, record?: boolean) => void;\n\nexport function ComponentCard({\n  m, el, ctx, use, overrides, set,\n}: { m: ComponentModel; el: IslandEl; ctx: IslandCtx; use: UseComponentInfo; overrides: Record<string, unknown>; set: SetComponent }) {\n  const { copyComponent, toast, ComponentPreview } = useKitServices();\n  const { info, loading, error } = use(m.ref ?? \"\");\n  const card = React.useRef<HTMLDivElement>(null);\n  const width = useWidth(card);\n  const narrow = !!width && width <= NARROW;\n  const [collapsed, setCollapsed] = React.useState(false);\n  const [dialog, setDialog] = React.useState<null | \"detach\" | \"relink\">(null);\n  const [busy, setBusy] = React.useState(false);\n  const detached = !!m.detached;\n  const own = React.useMemo(() => parseObj(m.props), [m.props]);\n  const missing = !m.ref || !!info?.missing;\n  const name = info && !info.missing ? info.name : m.name || info?.name || \"Component\";\n  const fieldKeys = new Set((info?.fields ?? []).map((f) => f.key));\n  const edited = missing || detached ? 0 : Object.keys(overrides).filter((k) => fieldKeys.has(k)).length;\n  const places = info?.places;\n  const known = !!info || missing;\n  // compared as instants, not strings: the same publish can be spelled two ways (precision, offset)\n  const changed = detached && !missing && laterThan(info?.publishedAt, m.sourcePublishedAt);\n  const state = detached ? `Detached${changed ? \", Shared version changed\" : \"\"}` : missing ? \"Missing component\" : edited ? \"Edited here\" : \"Shared\";\n  const label = `${name} component${known ? `, ${state}` : \"\"}${known && !missing && !detached && places != null ? `, ${placesShort(places)}` : \"\"}`;\n  const rows = detached ? copyRows(own, info?.fields, m.variant) : previewRows(missing, info?.fields, overrides, m.variant);\n  // the picture is the component with its own values (the host's snapshot): drawn only where this place shows exactly\n  // that. A separate copy, an edited place or another layout would be shown content it doesn't have, so those list\n  // their values instead.\n  const image = missing || detached || edited || m.variant ? null : info?.image || null;\n  // V2 draws the component itself in the card, with this place's values (linked, edited or a separate copy): the host's\n  // live renderer where it has one. Another layout lists its values (the renderer draws the component's own layout).\n  const liveProps = React.useMemo(\n    () => (detached ? own : { ...Object.fromEntries((info?.fields ?? []).flatMap((f) => (f.value !== undefined ? [[f.key, f.value]] : []))), ...overrides }),\n    [detached, own, info?.fields, overrides],\n  );\n  const live = ComponentPreview && m.ref && info && !missing && !m.variant ? { Preview: ComponentPreview, ref: m.ref } : null;\n  const preview = live ? (\n    <LivePreview Preview={live.Preview} componentId={live.ref} title={name} props={liveProps} rows={rows} />\n  ) : image || rows.length ? (\n    <PreviewWindow image={image} rows={rows} />\n  ) : null;\n  const canCopy = !!copyComponent && !!m.ref && !ctx.readOnly;\n\n  /**\n   * The change as ONE undo step (IslandCtx.step: the dock's toolbar Undo, this toast's Undo and ⌘Z in the body are one\n   * undo), and the toast that offers it back.\n   */\n  const commit = (patch: (cur: ComponentModel) => ComponentModel, label: string, title: string, description: string) => {\n    const before = el.__rt as ComponentModel | undefined;\n    const undo = ctx.step\n      ? ctx.step(label, () => (set(patch, label, false), el), before)\n      : (set(patch, label), () => (ctx.undo?.() ? (true as const) : \"Changes made after it come first. Press ⌘Z to undo them.\"));\n    toast?.(title, {\n      description,\n      action: {\n        label: \"Undo\",\n        onClick: () => {\n          const r = undo();\n          if (r !== true) ctx.notify(\"Nothing was undone\", r);\n        },\n      },\n    });\n  };\n\n  /** V2 detachNow: this place keeps what readers see now and stops following the component, as one undo step. */\n  const detach = async (title: string) => {\n    if (!copyComponent || !m.ref || busy) return;\n    setBusy(true);\n    try {\n      const copy = await copyComponent(m.ref, { overrides, ...(m.variant ? { variant: m.variant } : {}) });\n      commit(\n        (cur) => ({\n          id: cur.id,\n          ref: cur.ref,\n          ...(cur.name !== undefined || info?.name ? { name: cur.name ?? info?.name } : {}),\n          ...(cur.variant !== undefined ? { variant: cur.variant } : {}),\n          detached: true,\n          props: JSON.stringify(copy.props),\n          ...(copy.blocks !== undefined ? { blocks: copy.blocks } : {}),\n          ...(copy.sourcePublishedAt ? { sourcePublishedAt: copy.sourcePublishedAt } : {}),\n          ...(cur.extra !== undefined ? { extra: cur.extra } : {}),\n        }),\n        \"Make a separate copy\",\n        title,\n        \"It keeps its content and no longer follows the shared component.\",\n      );\n    } catch (e) {\n      ctx.notify(\"This place couldn't keep its own copy\", e instanceof Error ? e.message : String(e));\n    } finally {\n      setBusy(false);\n    }\n  };\n\n  /** V2 instanceOps.relink: keep = what differs from the component becomes overrides; reset = the component's content. */\n  const relink = (mode: \"keep\" | \"reset\") => {\n    const kept = copyEdits(m, own, info?.fields);\n    const n = Object.keys(kept).length;\n    commit(\n      (cur) => ({\n        id: cur.id,\n        ref: cur.ref,\n        ...(cur.name !== undefined ? { name: info?.name ?? cur.name } : {}),\n        ...(mode === \"keep\" && Object.keys(kept).length ? { overrides: JSON.stringify(kept) } : {}),\n        ...(mode === \"keep\" && cur.variant !== undefined ? { variant: cur.variant } : {}),\n        ...(cur.extra !== undefined ? { extra: cur.extra } : {}),\n      }),\n      \"Use shared version again\",\n      `${name} is shared again`,\n      mode === \"keep\" && n ? `${n} ${n === 1 ? \"edit\" : \"edits\"} kept here.` : \"It shows the component's content.\",\n    );\n  };\n\n  return (\n    <div\n      ref={card}\n      role=\"group\"\n      aria-label={label}\n      aria-roledescription=\"component\"\n      aria-busy={busy || undefined}\n      data-instance-card=\"\"\n      data-rt-isolate=\"\"\n      data-state={detached ? \"detached\" : missing ? \"missing\" : known ? \"linked\" : undefined}\n      className={cn(\n        \"group/inst relative rounded-kit-lg border bg-kit-control-bg text-left transition-colors duration-150 motion-reduce:transition-none\",\n        missing && !detached ? \"border-kit-warning-line\" : \"border-kit-line hover:border-kit-line-strong\",\n      )}\n    >\n      <div className=\"flex h-9 select-none items-center gap-1.5 pl-1 pr-1\">\n        <span className=\"w-1\" />\n        <IconComponents size={15} stroke={1.5} className=\"shrink-0 text-kit-fg-2\" aria-hidden />\n        <span className=\"min-w-0 shrink truncate text-kit-sm font-medium text-kit-fg\">{name}</span>\n        {detached ? (\n          <>\n            <DetachedChip name={name} compact={narrow} />\n            {changed ? <ChangedChip name={name} compact={narrow} onReview={canCopy ? () => setDialog(\"relink\") : undefined} /> : null}\n          </>\n        ) : known ? (\n          <StateChip missing={missing} places={places} edited={edited} compact={narrow} />\n        ) : null}\n        <span className=\"flex-1\" />\n        {ctx.readOnly ? null : (\n          <Menu>\n            <MenuTrigger\n              render={\n                <IconButton size=\"sm\" className=\"shrink-0\" label={`${name} actions`}>\n                  <IconDots stroke={1.5} />\n                </IconButton>\n              }\n            />\n            <MenuContent align=\"end\" className=\"w-56\">\n              {preview ? (\n                <MenuItem icon={collapsed ? <IconLayoutNavbarExpand stroke={1.5} /> : <IconLayoutNavbarCollapse stroke={1.5} />} onClick={() => setCollapsed(!collapsed)}>\n                  {collapsed ? \"Show preview\" : \"Collapse preview\"}\n                </MenuItem>\n              ) : null}\n              {canCopy && info && !missing && !detached ? (\n                <MenuItem icon={<IconUnlink stroke={1.5} />} disabled={busy} onClick={() => setDialog(\"detach\")}>\n                  Make a separate copy\n                </MenuItem>\n              ) : null}\n              {canCopy && missing && !detached ? (\n                <MenuItem icon={<IconUnlink stroke={1.5} />} disabled={busy} onClick={() => void detach(\"Kept as a separate copy\")}>\n                  Keep as a separate copy\n                </MenuItem>\n              ) : null}\n              {canCopy && info && !missing && detached ? (\n                <MenuItem icon={<IconLink stroke={1.5} />} onClick={() => setDialog(\"relink\")}>\n                  Use shared version again\n                </MenuItem>\n              ) : null}\n              {ctx.duplicate ? (\n                <MenuItem icon={<IconCopy stroke={1.5} />} onClick={() => ctx.duplicate?.(el)}>\n                  Duplicate\n                </MenuItem>\n              ) : null}\n              {ctx.move ? (\n                <>\n                  <MenuItem icon={<IconArrowUp stroke={1.5} />} disabled={!el.previousElementSibling} onClick={() => ctx.move?.(el, -1)}>\n                    Move up\n                  </MenuItem>\n                  <MenuItem icon={<IconArrowDown stroke={1.5} />} disabled={!el.nextElementSibling} onClick={() => ctx.move?.(el, 1)}>\n                    Move down\n                  </MenuItem>\n                </>\n              ) : null}\n              <MenuSeparator />\n              <MenuItem danger icon={<IconTrash stroke={1.5} />} onClick={() => ctx.remove(el)}>\n                Remove\n              </MenuItem>\n            </MenuContent>\n          </Menu>\n        )}\n      </div>\n      {error ? (\n        <div role=\"alert\" className=\"flex items-center gap-2 border-t border-kit-line-subtle px-3 py-2.5 text-kit-sm text-kit-fg-2\">\n          <IconAlertTriangle className=\"size-4 shrink-0 text-kit-warning-fg\" stroke={1.5} aria-hidden />\n          <span className=\"min-w-0 flex-1\">{error}</span>\n        </div>\n      ) : null}\n      {missing && !detached && !loading ? (\n        <div className=\"flex flex-wrap items-center gap-2 border-t border-kit-line-subtle px-3 py-2.5 text-kit-sm\" role=\"note\">\n          <IconAlertTriangle className=\"size-4 shrink-0 text-kit-warning-fg\" stroke={1.5} aria-hidden />\n          <span className=\"min-w-0 flex-1 text-kit-fg-2\">The original “{name}” was deleted. Readers see nothing in this place.</span>\n          {ctx.readOnly ? null : (\n            <span className=\"flex shrink-0 items-center gap-1.5\">\n              {canCopy ? (\n                <Button size=\"xs\" variant=\"secondary\" loading={busy} onClick={() => void detach(\"Kept as a separate copy\")}>\n                  Keep as a separate copy\n                </Button>\n              ) : null}\n              <Button size=\"xs\" variant=\"danger-ghost\" onClick={() => ctx.remove(el)}>\n                Remove\n              </Button>\n            </span>\n          )}\n        </div>\n      ) : null}\n      {collapsed ? null : preview}\n      {canCopy ? (\n        <>\n          <DetachDialog\n            open={dialog === \"detach\"}\n            name={name}\n            places={places}\n            onClose={() => setDialog(null)}\n            onConfirm={() => {\n              setDialog(null);\n              void detach(`Separate copy of ${name}`);\n            }}\n          />\n          <RelinkDialog\n            open={dialog === \"relink\"}\n            name={name}\n            kept={Object.keys(copyEdits(m, own, info?.fields)).length}\n            onClose={() => setDialog(null)}\n            onConfirm={(mode) => {\n              setDialog(null);\n              relink(mode);\n            }}\n          />\n        </>\n      ) : null}\n    </div>\n  );\n}\n\n/**\n * A separate copy's EDITS, which it keeps as overrides when it follows the component again: its values that differ from\n * the snapshot taken when the copy was made, never from the component as it is now (a republish since is not an edit\n * of this place; the owner saw \"2 fields stay as they are\" with nothing edited).\n *\n * A copy made here stores that snapshot: its values (`props`) with the blocks drawn from them (`blocks`), and no\n * surface edits a copy's values afterwards, so it has no edits. Copy markup from V2 stores no snapshot (no `blocks`):\n * its values that differ from the component's, on fields the component has (V2 instanceOps.relink).\n */\nfunction copyEdits(m: ComponentModel, own: Record<string, unknown>, fields: KitComponentField[] | undefined): Record<string, unknown> {\n  const out: Record<string, unknown> = {};\n  if (m.blocks !== undefined) return out;\n  for (const f of fields ?? []) if (f.key in own && !same(own[f.key], f.value)) out[f.key] = own[f.key];\n  return out;\n}\n\n/** V2 StateChip: 13px, neutral, not a pill; the missing chip is the one tinted state. */\nfunction StateChip({ missing, places, edited, compact }: { missing: boolean; places?: number; edited: number; compact: boolean }) {\n  const base = CHIP;\n  if (missing) {\n    return (\n      <Tooltip content=\"The component was deleted. Readers see nothing in this place.\">\n        <span className={cn(base, \"bg-kit-warning-soft px-1.5 text-kit-warning-fg\")}>\n          <IconAlertTriangle className=\"size-3.5 shrink-0\" stroke={1.5} aria-hidden />\n          {compact ? <span className=\"sr-only\">Missing component</span> : \"Missing component\"}\n        </span>\n      </Tooltip>\n    );\n  }\n  const count = places ? placesShort(places) : null;\n  const tip = `Changes here apply only to this place. Edit the component to change ${places && places > 1 ? `all ${places}` : \"it everywhere\"}.${\n    edited ? ` ${edited} ${edited === 1 ? \"field\" : \"fields\"} edited here.` : \"\"\n  }`;\n  return (\n    <Tooltip content={tip}>\n      <span className={cn(base, \"px-1 text-kit-fg-2\")} tabIndex={-1}>\n        <IconLink className=\"size-3.5 shrink-0\" stroke={1.5} aria-hidden />\n        {compact ? <span className=\"sr-only\">Shared{count ? `, ${count}` : \"\"}</span> : count ?? \"Shared\"}\n        {!compact && count ? <span className=\"sr-only\">, shared</span> : null}\n        {edited ? (\n          <>\n            <span className=\"ml-1 size-1.5 shrink-0 rounded-full bg-kit-accent\" aria-hidden />\n            {compact ? <span className=\"sr-only\">, edited here</span> : <span>Edited here</span>}\n          </>\n        ) : null}\n      </span>\n    </Tooltip>\n  );\n}\n\nconst CHIP = \"inline-flex h-6 shrink-0 items-center gap-1 rounded-kit-md text-[13px] leading-none whitespace-nowrap\";\n\n/** V2 StateChip, detached: fg-3, the unlink glyph. */\nfunction DetachedChip({ name, compact }: { name: string; compact: boolean }) {\n  return (\n    <Tooltip content={`A separate copy. Changes to ${name} don't reach it.`}>\n      <span className={cn(CHIP, \"px-1 text-kit-fg-3\")} tabIndex={-1}>\n        <IconUnlink className=\"size-3.5 shrink-0\" stroke={1.5} aria-hidden />\n        {compact ? <span className=\"sr-only\">Detached</span> : \"Detached\"}\n      </span>\n    </Tooltip>\n  );\n}\n\n/** V2 StateChip, update: a quiet button that opens the way back to the shared version. */\nfunction ChangedChip({ name, compact, onReview }: { name: string; compact: boolean; onReview?: () => void }) {\n  return (\n    <Tooltip content={`${name} changed since this copy was made.`}>\n      <button\n        type=\"button\"\n        onClick={onReview}\n        disabled={!onReview}\n        className={cn(CHIP, \"px-1 text-kit-fg-2 hover:bg-kit-hover hover:text-kit-fg disabled:hover:bg-transparent\")}\n      >\n        <IconRefresh className=\"size-3.5 shrink-0\" stroke={1.5} aria-hidden />\n        {compact ? <span className=\"sr-only\">Shared version changed</span> : \"Shared version changed\"}\n      </button>\n    </Tooltip>\n  );\n}\n\n/** V2 useInstanceDialogs \"detach\": confirm before this place stops following the component. */\nfunction DetachDialog({ open, name, places, onClose, onConfirm }: { open: boolean; name: string; places?: number; onClose: () => void; onConfirm: () => void }) {\n  const others = places != null ? places - 1 : null;\n  return (\n    <Modal open={open} onOpenChange={(o) => !o && onClose()}>\n      <ModalContent size=\"sm\">\n        <ModalHeader title={`Make a separate copy of ${name}?`} description=\"This place keeps its current content and stops following the shared component.\" />\n        {others != null ? (\n          <ModalBody className=\"pt-2 text-kit-sm text-kit-fg-2\">\n            {others > 0 ? `The other ${others === 1 ? \"place stays\" : `${others} places stay`} shared.` : \"No other place uses it.\"}\n          </ModalBody>\n        ) : null}\n        <ModalFooter>\n          <Button variant=\"ghost\" onClick={onClose}>\n            Cancel\n          </Button>\n          <Button variant=\"primary\" autoFocus onClick={onConfirm}>\n            Make a copy\n          </Button>\n        </ModalFooter>\n      </ModalContent>\n    </Modal>\n  );\n}\n\n/** V2 RelinkDialog: keep this place's edits as overrides, or take the component's content. */\nfunction RelinkDialog({ open, name, kept, onClose, onConfirm }: { open: boolean; name: string; kept: number; onClose: () => void; onConfirm: (mode: \"keep\" | \"reset\") => void }) {\n  const [mode, setMode] = React.useState<\"keep\" | \"reset\">(\"keep\");\n  React.useEffect(() => {\n    if (open) setMode(\"keep\");\n  }, [open]);\n  const rows: { v: \"keep\" | \"reset\"; title: string; line: string }[] = [\n    {\n      v: \"keep\",\n      title: \"Keep my edits here\",\n      line: kept ? `${kept} ${kept === 1 ? \"field stays\" : \"fields stay\"} as ${kept === 1 ? \"it is\" : \"they are\"}; everything else follows ${name} again.` : `Nothing differs, so it simply follows ${name} again.`,\n    },\n    { v: \"reset\", title: `Use ${name}'s content`, line: \"Drops the edits made here. Undo is one click away.\" },\n  ];\n  return (\n    <Modal open={open} onOpenChange={(o) => !o && onClose()}>\n      <ModalContent size=\"sm\">\n        <ModalHeader title={`Use the shared ${name} again?`} description=\"This place follows the shared component again.\" />\n        <ModalBody className=\"pt-3\">\n          <div\n            role=\"radiogroup\"\n            aria-label=\"Use shared version again\"\n            className=\"flex flex-col divide-y divide-kit-line overflow-hidden rounded-kit-lg border border-kit-line\"\n            onKeyDown={(e) => {\n              // a radio group moves with the arrow keys (one tab stop, the checked row)\n              if (![\"ArrowUp\", \"ArrowDown\", \"ArrowLeft\", \"ArrowRight\"].includes(e.key)) return;\n              e.preventDefault();\n              const next = mode === \"keep\" ? \"reset\" : \"keep\";\n              setMode(next);\n              (e.currentTarget.querySelector(`[data-mode=\"${next}\"]`) as HTMLElement | null)?.focus();\n            }}\n          >\n            {rows.map((row) => (\n              <button\n                key={row.v}\n                type=\"button\"\n                role=\"radio\"\n                data-mode={row.v}\n                tabIndex={mode === row.v ? 0 : -1}\n                aria-checked={mode === row.v}\n                onClick={() => setMode(row.v)}\n                className={cn(\"flex min-h-14 items-start gap-3 px-3 py-2.5 text-left transition-colors hover:bg-kit-hover\", mode === row.v && \"bg-kit-subtle\")}\n              >\n                <span className={cn(\"mt-0.5 flex size-4 shrink-0 items-center justify-center rounded-full border\", mode === row.v ? \"border-kit-control-checked\" : \"border-kit-line-strong\")}>\n                  {mode === row.v ? <span className=\"size-2 rounded-full bg-kit-fg\" /> : null}\n                </span>\n                <span className=\"min-w-0\">\n                  <span className=\"block text-kit-sm font-medium text-kit-fg\">{row.title}</span>\n                  <span className=\"block text-kit-xs text-kit-fg-3\">{row.line}</span>\n                </span>\n              </button>\n            ))}\n          </div>\n        </ModalBody>\n        <ModalFooter>\n          <Button variant=\"ghost\" onClick={onClose}>\n            Cancel\n          </Button>\n          <Button variant=\"primary\" onClick={() => onConfirm(mode)}>\n            Use shared version\n          </Button>\n        </ModalFooter>\n      </ModalContent>\n    </Modal>\n  );\n}\n\ninterface Row {\n  key: string;\n  label: string;\n  text: string;\n}\n\n/**\n * What the window lists when there is no picture: each field's value as this place shows it (its override, else the\n * component's own), then the layout this place draws it in. A missing component has only what this place stored: its\n * overrides, named by their keys, and its layout.\n */\nfunction previewRows(missing: boolean, fields: KitComponentField[] | undefined, overrides: Record<string, unknown>, variant?: string): Row[] {\n  const out: Row[] = [];\n  if (missing || !fields) {\n    for (const [key, v] of Object.entries(overrides)) {\n      const text = readable(v);\n      if (text) out.push({ key, label: key, text });\n    }\n  } else {\n    for (const f of fields) {\n      const text = readable(f.key in overrides ? overrides[f.key] : f.value);\n      if (text) out.push({ key: f.key, label: f.label, text });\n    }\n  }\n  if (variant) out.push({ key: \"__variant\", label: \"Layout\", text: variant });\n  return out;\n}\n\n/**\n * A separate copy's values (V2 `props`) in the component's field order. A field the copy doesn't hold draws the\n * component's value for it, as V2's renderer does for a copy (it draws the def with `props`, defaults for the rest);\n * a value the component no longer has a field for follows, under its key. Then its layout.\n */\nfunction copyRows(own: Record<string, unknown>, fields: KitComponentField[] | undefined, variant?: string): Row[] {\n  const out: Row[] = [];\n  const push = (key: string, label: string, v: unknown) => {\n    const text = readable(v);\n    if (text) out.push({ key, label, text });\n  };\n  for (const f of fields ?? []) push(f.key, f.label, f.key in own ? own[f.key] : f.value);\n  for (const [key, v] of Object.entries(own)) if (!fields?.some((f) => f.key === key)) push(key, key, v);\n  if (variant) out.push({ key: \"__variant\", label: \"Layout\", text: variant });\n  return out;\n}\n\n/** The preview's frame: under the card's header, at most PREVIEW_H tall. */\nconst PREVIEW_CHROME = \"relative overflow-hidden rounded-b-kit-lg border-t border-kit-line-subtle bg-kit-subtle\";\n\nfunction PreviewWindow({ image, rows }: { image: string | null; rows: Row[] }) {\n  return (\n    <div data-instance-preview=\"\" className={PREVIEW_CHROME} style={{ maxHeight: PREVIEW_H }}>\n      <PreviewBody image={image} rows={rows} />\n    </div>\n  );\n}\n\n/**\n * The component drawn live by the host (KitServices.ComponentPreview), mounted once the card is on screen. Its height is\n * reserved from the start (PREVIEW_H), so the card never moves while it loads; where the host cannot draw it, the values\n * are listed under the reason.\n */\nfunction LivePreview({\n  Preview,\n  componentId,\n  title,\n  props,\n  rows,\n}: {\n  Preview: React.ComponentType<KitComponentPreviewProps>;\n  componentId: string;\n  title: string;\n  props: Record<string, unknown>;\n  rows: Row[];\n}) {\n  const box = React.useRef<HTMLDivElement>(null);\n  const [seen, setSeen] = React.useState(() => typeof IntersectionObserver === \"undefined\");\n  React.useEffect(() => {\n    const el = box.current;\n    if (seen || !el) return;\n    const io = new IntersectionObserver((entries) => {\n      if (entries.some((e) => e.isIntersecting)) setSeen(true);\n    });\n    io.observe(el);\n    return () => io.disconnect();\n  }, [seen]);\n  return (\n    <div ref={box} data-instance-preview=\"\" data-live=\"\" className={PREVIEW_CHROME}>\n      {seen ? (\n        <Preview componentId={componentId} title={title} props={props} fallback={(reason) => <PreviewBody image={null} rows={rows} note={reason} />} />\n      ) : (\n        <div aria-hidden style={{ height: PREVIEW_H }} />\n      )}\n    </div>\n  );\n}\n\nfunction PreviewBody({ image, rows, note }: { image: string | null; rows: Row[]; note?: string }) {\n  const inner = React.useRef<HTMLDivElement>(null);\n  const [tall, setTall] = React.useState(false);\n  // a picture's height is unknown until it loads: the cap is held until then, so the card doesn't jump when it lands\n  const [loaded, setLoaded] = React.useState(!image);\n  React.useLayoutEffect(() => {\n    const el = inner.current;\n    if (!el) return;\n    const on = () => setTall(el.scrollHeight > PREVIEW_H + 1);\n    on();\n    if (typeof ResizeObserver === \"undefined\") return;\n    const ro = new ResizeObserver(on);\n    ro.observe(el);\n    return () => ro.disconnect();\n  }, []);\n  return (\n    <div\n      ref={inner}\n      className={cn(tall && \"[mask-image:linear-gradient(to_bottom,black_calc(100%-24px),transparent)]\")}\n      style={tall || !loaded ? { height: PREVIEW_H } : undefined}\n    >\n      {image ? (\n        // the whole width, scaled to the card like V2's frame (top-left origin): never cropped at the sides\n        <img src={image} alt=\"\" className=\"block h-auto w-full\" draggable={false} onLoad={() => setLoaded(true)} onError={() => setLoaded(true)} />\n      ) : (\n        <>\n          {note ? <p className=\"px-4 pt-3 text-kit-xs text-kit-fg-3\">{note}</p> : null}\n          <dl className=\"flex flex-col gap-3 px-4 py-3.5\">\n            {rows.map((r) => (\n              <div key={r.key} className=\"min-w-0\">\n                <dt className=\"truncate text-kit-xs text-kit-fg-3\">{r.label}</dt>\n                <dd className=\"mt-0.5 line-clamp-3 text-kit-sm text-kit-fg\">{r.text}</dd>\n              </div>\n            ))}\n          </dl>\n        </>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/controls/rich-text/control.d.ts

@@ -0,0 +1,21 @@
+import type { ControlProps } from "../../types";
+import type { KitRichTextCodec, RichTextRead } from "./codec";
+export declare function setFullEditor(key: string | null): void;
+/** What the control decided for one stored value. */
+type Opened = {
+    ok: true;
+    read: RichTextRead;
+    html: string;
+} | {
+    ok: false;
+    reason: string;
+};
+/**
+ * Open a stored value: read it, then prove the editor carries it unchanged (load → serialize → write === stored).
+ * A codec that throws, or a value that does not survive, is handed to the host's own control with the reason.
+ */
+export declare function openValue(codec: KitRichTextCodec, value: unknown, at: Parameters<KitRichTextCodec["read"]>[1]): Opened;
+export declare function RichTextControl(props: ControlProps): import("react/jsx-runtime").JSX.Element;
+/** Label-row action (at rest): the field's toolbar holds the same button while it's open. */
+export declare function RichTextExpandAction({ path, field }: ControlProps): import("react/jsx-runtime").JSX.Element | null;
+export {};

package/controls/rich-text/control.js

@@ -0,0 +1,254 @@
+import { cn } from "../../lib/cn.js";
+import { pathKey } from "../../lib/path.js";
+import { useForm, useKitEnv, useKitServices } from "../../context.js";
+import { Tooltip } from "../../ui/overlay.js";
+import { resolveFrames } from "../../lib/frames.js";
+import { LegacyFallback } from "../../engine/kit-field.js";
+import { editorRoundTrip } from "./dom.js";
+import { RichTextEditor } from "./editor.js";
+import * as React from "react";
+import { IconArrowsMaximize } from "@tabler/icons-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/kit/controls/rich-text/control.tsx
+/**
+* Rich text field (V2 HEAD controls/richtext.tsx, CPO D49).
+*  - The editor stays in place: the document variant is the full editor in the column, the panel variant (inspector)
+*    the same editor height-capped.
+*  - Expanding (the toolbar's expand button, ⌘↵, or the expand icon in the field's label row at rest) opens the shared
+*    ExpandedEditorModal: breadcrumb "Section › Item › Field", word count, Done. Esc closes and focus returns.
+*
+* STORAGE. The editor edits HTML; the stored value stays what production stores for the field, through the host's
+* codec (KitServices.richText, see ./codec.ts):
+*   - read:  stored value → the HTML the editor opens on (+ what the field accepts)
+*   - write: edited HTML → the stored value, in the surface's own shape; a write that would drop something is refused,
+*            named, and nothing is stored
+*   - probe: a value the editor cannot carry unchanged (open → no edit → write ≠ stored) is not opened here at all: the
+*            host's own control edits it (LegacyFallback), with the reason above it. Opening never writes.
+*/
+var openKey = null;
+var subs = /* @__PURE__ */ new Set();
+function setFullEditor(key) {
+	openKey = key;
+	subs.forEach((s) => s());
+}
+function useFullEditorKey() {
+	return React.useSyncExternalStore((cb) => {
+		subs.add(cb);
+		return () => subs.delete(cb);
+	}, () => openKey, () => openKey);
+}
+var handedOff = /* @__PURE__ */ new Set();
+function setHandedOff(key, on) {
+	if (handedOff.has(key) === on) return;
+	if (on) handedOff.add(key);
+	else handedOff.delete(key);
+	subs.forEach((s) => s());
+}
+function useHandedOff(key) {
+	return React.useSyncExternalStore((cb) => {
+		subs.add(cb);
+		return () => subs.delete(cb);
+	}, () => handedOff.has(key), () => handedOff.has(key));
+}
+/** The expanded editor's breadcrumb: the form's frames (root › drilled items) and this field. */
+function useExpandCrumbs(fieldTitle) {
+	const form = useForm();
+	const env = useKitEnv();
+	if (!form) return [env.docTitle, fieldTitle].filter(Boolean);
+	const { frames } = resolveFrames(form.schema, form.value, form.path, form.resolveSchema);
+	return [...frames.filter((f) => f.kind !== "history").map((f, i) => i === 0 ? env.docTitle || f.title : f.title), fieldTitle];
+}
+/** A stored block array, or the `{ content }` / `{ format, value }` envelope around one, holding a pull quote block. */
+var holdsPullQuote = (seed) => Array.isArray(seed) ? seed.some((b) => !!b && typeof b === "object" && b._type === "pullQuote") : !!seed && typeof seed === "object" && holdsPullQuote(seed.content ?? seed.value);
+/**
+* Open a stored value: read it, then prove the editor carries it unchanged (load → serialize → write === stored).
+* A codec that throws, or a value that does not survive, is handed to the host's own control with the reason.
+*/
+function openValue(codec, value, at) {
+	let read;
+	try {
+		read = codec.read(value, at);
+	} catch (err) {
+		return {
+			ok: false,
+			reason: `the stored text could not be read (${err instanceof Error ? err.message : String(err)})`
+		};
+	}
+	if (holdsPullQuote(read.seed) && !/data-rt="pullquote"/.test(read.html)) return {
+		ok: false,
+		reason: "it holds a pull quote, which the standard editor edits"
+	};
+	const html = editorRoundTrip(read.html);
+	try {
+		const back = codec.write(html, at, value);
+		if (back.losses.length) return {
+			ok: false,
+			reason: `this editor would drop ${back.losses.join(", ")}`
+		};
+		if (!codec.same(back.value, read.seed)) return {
+			ok: false,
+			reason: "it holds formatting this editor cannot keep"
+		};
+	} catch (err) {
+		return {
+			ok: false,
+			reason: `the text could not be checked (${err instanceof Error ? err.message : String(err)})`
+		};
+	}
+	return {
+		ok: true,
+		read,
+		html
+	};
+}
+function RichTextControl(props) {
+	const { richText } = useKitServices();
+	if (!richText) return /* @__PURE__ */ jsx(LegacyFallback, { ...props });
+	return /* @__PURE__ */ jsx(CodecRichText, {
+		codec: richText,
+		...props
+	});
+}
+function CodecRichText({ codec, field, value, onChange, readOnly, path, id, invalid }) {
+	const env = useKitEnv();
+	const docKey = `${env.docId}:${pathKey(path)}`;
+	const open = useFullEditorKey() === docKey;
+	const crumbs = useExpandCrumbs(field.title);
+	const at = React.useMemo(() => ({
+		field,
+		path
+	}), [field, path]);
+	const { useInsertableComponents } = useKitServices();
+	const insertable = useInsertableComponents?.(at);
+	const mine = React.useRef(null);
+	const [refusal, setRefusal] = React.useState(null);
+	const opened = React.useMemo(() => {
+		if (mine.current && mine.current.value === value) try {
+			return {
+				ok: true,
+				read: codec.read(value, at),
+				html: mine.current.html
+			};
+		} catch {}
+		return openValue(codec, value, at);
+	}, [
+		codec,
+		value,
+		JSON.stringify(field),
+		pathKey(path)
+	]);
+	React.useEffect(() => () => {
+		if (openKey === docKey) setFullEditor(null);
+		setHandedOff(docKey, false);
+	}, [docKey]);
+	React.useLayoutEffect(() => {
+		setHandedOff(docKey, !opened.ok);
+		if (!opened.ok && openKey === docKey) setFullEditor(null);
+	}, [docKey, opened.ok]);
+	if (!opened.ok) return /* @__PURE__ */ jsxs("div", {
+		className: "flex min-w-0 flex-col gap-1.5",
+		children: [/* @__PURE__ */ jsxs("p", {
+			role: "note",
+			"data-slot": "kit-richtext-handoff",
+			className: "rounded-kit-md bg-kit-subtle px-2.5 py-1.5 text-kit-xs text-kit-fg-2",
+			children: [
+				"Edited with the standard editor: ",
+				opened.reason,
+				"."
+			]
+		}), /* @__PURE__ */ jsx(LegacyFallback, {
+			field,
+			value,
+			onChange,
+			readOnly,
+			path,
+			id,
+			invalid
+		})]
+	});
+	const { read, html } = opened;
+	const write = (next) => {
+		let res;
+		try {
+			res = codec.write(next, at, value);
+		} catch (err) {
+			setRefusal(`Not saved: the text could not be stored (${err instanceof Error ? err.message : String(err)}). Undo the last change with ⌘Z; leaving the field puts back the saved text.`);
+			return;
+		}
+		if (res.losses.length) {
+			setRefusal(`Not saved: this field cannot keep ${res.losses.join(", ")}. Undo the last change with ⌘Z; leaving the field puts back the saved text.`);
+			return;
+		}
+		setRefusal(null);
+		if (codec.same(res.value, value)) return;
+		mine.current = {
+			value: res.value,
+			html: next
+		};
+		onChange(res.value);
+	};
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex min-w-0 flex-col gap-1.5",
+		children: [
+			read.losses.length ? /* @__PURE__ */ jsxs("p", {
+				role: "status",
+				className: "rounded-kit-md bg-kit-warning-soft px-2.5 py-1.5 text-kit-xs text-kit-warning-fg",
+				children: [
+					"Saved by an earlier editor. Editing here would drop ",
+					read.losses.join(", "),
+					". Nothing changes until you edit."
+				]
+			}) : null,
+			/* @__PURE__ */ jsx(RichTextEditor, {
+				value: html,
+				onChange: write,
+				readOnly,
+				placeholder: field.placeholder,
+				docKey,
+				id,
+				invalid: invalid || !!refusal,
+				features: read.features,
+				single: read.single,
+				allowNewTab: read.newTab,
+				components: insertable && !read.single && !readOnly ? insertable : void 0,
+				variant: env.variant === "document" ? "document" : "panel",
+				maxHeight: env.variant === "document" ? void 0 : 320,
+				expandCrumbs: crumbs,
+				expandedOpen: open,
+				onExpandedOpenChange: (o) => setFullEditor(o ? docKey : null),
+				onComment: env.onComment ? () => env.onComment(path, field) : void 0
+			}),
+			refusal ? /* @__PURE__ */ jsx("p", {
+				role: "alert",
+				className: "text-kit-xs text-kit-danger-fg",
+				children: refusal
+			}) : null
+		]
+	});
+}
+/** Label-row action (at rest): the field's toolbar holds the same button while it's open. */
+function RichTextExpandAction({ path, field }) {
+	const env = useKitEnv();
+	const { richText } = useKitServices();
+	const handed = useHandedOff(`${env.docId}:${pathKey(path)}`);
+	if (env.variant === "document" || !richText || handed) return null;
+	return /* @__PURE__ */ jsx(Tooltip, {
+		content: "Expand editor",
+		shortcut: "⌘↵",
+		children: /* @__PURE__ */ jsx("button", {
+			type: "button",
+			"aria-label": `Expand ${field.title}`,
+			onClick: () => setFullEditor(`${env.docId}:${pathKey(path)}`),
+			className: cn("-my-0.5 hidden size-6 items-center justify-center rounded-kit-md text-kit-fg-3 hover:bg-kit-hover hover:text-kit-fg", "group-hover/field:inline-flex group-focus-within/field:!hidden [@media(pointer:coarse)]:inline-flex"),
+			children: /* @__PURE__ */ jsx(IconArrowsMaximize, {
+				className: "size-3.5",
+				stroke: 1.5,
+				"aria-hidden": true
+			})
+		})
+	});
+}
+//#endregion
+export { RichTextControl, RichTextExpandAction };
+
+//# sourceMappingURL=control.js.map

package/controls/rich-text/control.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"control.js","names":[],"sources":["../../../src/kit/controls/rich-text/control.tsx"],"sourcesContent":["/**\n * Rich text field (V2 HEAD controls/richtext.tsx, CPO D49).\n *  - The editor stays in place: the document variant is the full editor in the column, the panel variant (inspector)\n *    the same editor height-capped.\n *  - Expanding (the toolbar's expand button, ⌘↵, or the expand icon in the field's label row at rest) opens the shared\n *    ExpandedEditorModal: breadcrumb \"Section › Item › Field\", word count, Done. Esc closes and focus returns.\n *\n * STORAGE. The editor edits HTML; the stored value stays what production stores for the field, through the host's\n * codec (KitServices.richText, see ./codec.ts):\n *   - read:  stored value → the HTML the editor opens on (+ what the field accepts)\n *   - write: edited HTML → the stored value, in the surface's own shape; a write that would drop something is refused,\n *            named, and nothing is stored\n *   - probe: a value the editor cannot carry unchanged (open → no edit → write ≠ stored) is not opened here at all: the\n *            host's own control edits it (LegacyFallback), with the reason above it. Opening never writes.\n */\nimport * as React from \"react\";\nimport { IconArrowsMaximize } from \"@tabler/icons-react\";\nimport { cn } from \"../../lib/cn\";\nimport { useForm, useKitEnv, useKitServices } from \"../../context\";\nimport { resolveFrames } from \"../../lib/frames\";\nimport { pathKey } from \"../../lib/path\";\nimport type { ControlProps } from \"../../types\";\nimport { Tooltip } from \"../../ui/overlay\";\nimport { LegacyFallback } from \"../../engine/kit-field\";\nimport type { KitRichTextCodec, RichTextRead } from \"./codec\";\nimport { editorRoundTrip } from \"./dom\";\nimport { RichTextEditor } from \"./editor\";\n\n/* ── which rich-text field (docKey) has its full editor open — shared with the label-row action ── */\nlet openKey: string | null = null;\nconst subs = new Set<() => void>();\nexport function setFullEditor(key: string | null) {\n  openKey = key;\n  subs.forEach((s) => s());\n}\nfunction useFullEditorKey() {\n  return React.useSyncExternalStore(\n    (cb) => {\n      subs.add(cb);\n      return () => subs.delete(cb);\n    },\n    () => openKey,\n    () => openKey,\n  );\n}\n\n/* ── fields whose value went to the host's own control: the label-row expand button is not theirs to draw ── */\nconst handedOff = new Set<string>();\nfunction setHandedOff(key: string, on: boolean) {\n  if (handedOff.has(key) === on) return;\n  if (on) handedOff.add(key);\n  else handedOff.delete(key);\n  subs.forEach((s) => s());\n}\nfunction useHandedOff(key: string) {\n  return React.useSyncExternalStore(\n    (cb) => {\n      subs.add(cb);\n      return () => subs.delete(cb);\n    },\n    () => handedOff.has(key),\n    () => handedOff.has(key),\n  );\n}\n\n/** The expanded editor's breadcrumb: the form's frames (root › drilled items) and this field. */\nfunction useExpandCrumbs(fieldTitle: string): string[] {\n  const form = useForm();\n  const env = useKitEnv();\n  if (!form) return [env.docTitle, fieldTitle].filter(Boolean) as string[];\n  const { frames } = resolveFrames(form.schema, form.value, form.path, form.resolveSchema);\n  const titles = frames.filter((f) => f.kind !== \"history\").map((f, i) => (i === 0 ? env.docTitle || f.title : f.title));\n  return [...titles, fieldTitle];\n}\n\n/** A stored block array, or the `{ content }` / `{ format, value }` envelope around one, holding a pull quote block. */\nconst holdsPullQuote = (seed: unknown): boolean =>\n  Array.isArray(seed)\n    ? seed.some((b) => !!b && typeof b === \"object\" && (b as { _type?: unknown })._type === \"pullQuote\")\n    : !!seed && typeof seed === \"object\" && holdsPullQuote((seed as { content?: unknown; value?: unknown }).content ?? (seed as { value?: unknown }).value);\n\n/** What the control decided for one stored value. */\ntype Opened =\n  | { ok: true; read: RichTextRead; html: string }\n  | { ok: false; reason: string };\n\n/**\n * Open a stored value: read it, then prove the editor carries it unchanged (load → serialize → write === stored).\n * A codec that throws, or a value that does not survive, is handed to the host's own control with the reason.\n */\nexport function openValue(codec: KitRichTextCodec, value: unknown, at: Parameters<KitRichTextCodec[\"read\"]>[1]): Opened {\n  let read: RichTextRead;\n  try {\n    read = codec.read(value, at);\n  } catch (err) {\n    return { ok: false, reason: `the stored text could not be read (${err instanceof Error ? err.message : String(err)})` };\n  }\n  // a pull quote (V2 D55 article block) opens as the editor's pull-quote island, but only when the codec renders the\n  // stored block as its markup: a codec that renders nothing for it would lose it, so the standard editor edits it\n  if (holdsPullQuote(read.seed) && !/data-rt=\"pullquote\"/.test(read.html))\n    return { ok: false, reason: \"it holds a pull quote, which the standard editor edits\" };\n  // tables and pull quotes are islands (V2 TableBlock, PullQuote); the probe below proves they survive unchanged\n  const html = editorRoundTrip(read.html);\n  try {\n    const back = codec.write(html, at, value);\n    if (back.losses.length) return { ok: false, reason: `this editor would drop ${back.losses.join(\", \")}` };\n    if (!codec.same(back.value, read.seed)) return { ok: false, reason: \"it holds formatting this editor cannot keep\" };\n  } catch (err) {\n    return { ok: false, reason: `the text could not be checked (${err instanceof Error ? err.message : String(err)})` };\n  }\n  return { ok: true, read, html };\n}\n\nexport function RichTextControl(props: ControlProps) {\n  const { richText } = useKitServices();\n  if (!richText) return <LegacyFallback {...props} />;\n  return <CodecRichText codec={richText} {...props} />;\n}\n\nfunction CodecRichText({ codec, field, value, onChange, readOnly, path, id, invalid }: ControlProps & { codec: KitRichTextCodec }) {\n  const env = useKitEnv();\n  const docKey = `${env.docId}:${pathKey(path)}`;\n  const open = useFullEditorKey() === docKey;\n  const crumbs = useExpandCrumbs(field.title);\n  const at = React.useMemo(() => ({ field, path }), [field, path]);\n  // the components this field may embed (More components): a hook with one identity for the form's life, so calling it\n  // only when the host provides it keeps the hook order fixed\n  const { useInsertableComponents } = useKitServices();\n  const insertable = useInsertableComponents?.(at);\n  /* our own last write: its value comes back as `value`, and the editor keeps the HTML it emitted (no reload, no probe) */\n  const mine = React.useRef<{ value: unknown; html: string } | null>(null);\n  const [refusal, setRefusal] = React.useState<string | null>(null);\n  const opened = React.useMemo<Opened>(() => {\n    if (mine.current && mine.current.value === value) {\n      try {\n        return { ok: true, read: codec.read(value, at), html: mine.current.html };\n      } catch {\n        /* judged afresh below, which names the failure */\n      }\n    }\n    return openValue(codec, value, at);\n    // `at` changes identity with the field object; the field's content is what matters\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [codec, value, JSON.stringify(field), pathKey(path)]);\n\n  // close when this field goes away (block deselected, drilled elsewhere)\n  React.useEffect(\n    () => () => {\n      if (openKey === docKey) setFullEditor(null);\n      setHandedOff(docKey, false);\n    },\n    [docKey],\n  );\n  React.useLayoutEffect(() => {\n    setHandedOff(docKey, !opened.ok);\n    if (!opened.ok && openKey === docKey) setFullEditor(null);\n  }, [docKey, opened.ok]);\n\n  if (!opened.ok)\n    return (\n      <div className=\"flex min-w-0 flex-col gap-1.5\">\n        <p role=\"note\" data-slot=\"kit-richtext-handoff\" className=\"rounded-kit-md bg-kit-subtle px-2.5 py-1.5 text-kit-xs text-kit-fg-2\">\n          Edited with the standard editor: {opened.reason}.\n        </p>\n        <LegacyFallback field={field} value={value} onChange={onChange} readOnly={readOnly} path={path} id={id} invalid={invalid} />\n      </div>\n    );\n\n  const { read, html } = opened;\n  const write = (next: string) => {\n    let res;\n    try {\n      res = codec.write(next, at, value);\n    } catch (err) {\n      setRefusal(`Not saved: the text could not be stored (${err instanceof Error ? err.message : String(err)}). Undo the last change with ⌘Z; leaving the field puts back the saved text.`);\n      return;\n    }\n    if (res.losses.length) {\n      setRefusal(`Not saved: this field cannot keep ${res.losses.join(\", \")}. Undo the last change with ⌘Z; leaving the field puts back the saved text.`);\n      return;\n    }\n    setRefusal(null);\n    if (codec.same(res.value, value)) return;\n    mine.current = { value: res.value, html: next };\n    onChange(res.value);\n  };\n\n  return (\n    <div className=\"flex min-w-0 flex-col gap-1.5\">\n      {read.losses.length ? (\n        <p role=\"status\" className=\"rounded-kit-md bg-kit-warning-soft px-2.5 py-1.5 text-kit-xs text-kit-warning-fg\">\n          Saved by an earlier editor. Editing here would drop {read.losses.join(\", \")}. Nothing changes until you edit.\n        </p>\n      ) : null}\n      <RichTextEditor\n        value={html}\n        onChange={write}\n        readOnly={readOnly}\n        placeholder={field.placeholder}\n        docKey={docKey}\n        id={id}\n        invalid={invalid || !!refusal}\n        features={read.features}\n        single={read.single}\n        allowNewTab={read.newTab}\n        components={insertable && !read.single && !readOnly ? insertable : undefined}\n        variant={env.variant === \"document\" ? \"document\" : \"panel\"}\n        maxHeight={env.variant === \"document\" ? undefined : 320}\n        expandCrumbs={crumbs}\n        expandedOpen={open}\n        onExpandedOpenChange={(o) => setFullEditor(o ? docKey : null)}\n        onComment={env.onComment ? () => env.onComment!(path, field) : undefined}\n      />\n      {refusal ? (\n        <p role=\"alert\" className=\"text-kit-xs text-kit-danger-fg\">\n          {refusal}\n        </p>\n      ) : null}\n    </div>\n  );\n}\n\n/** Label-row action (at rest): the field's toolbar holds the same button while it's open. */\nexport function RichTextExpandAction({ path, field }: ControlProps) {\n  const env = useKitEnv();\n  const { richText } = useKitServices();\n  const handed = useHandedOff(`${env.docId}:${pathKey(path)}`);\n  // the host's own control (no codec, or a value handed to it) has its own full-screen button\n  if (env.variant === \"document\" || !richText || handed) return null;\n  return (\n    <Tooltip content=\"Expand editor\" shortcut=\"⌘↵\">\n      <button\n        type=\"button\"\n        aria-label={`Expand ${field.title}`}\n        onClick={() => setFullEditor(`${env.docId}:${pathKey(path)}`)}\n        className={cn(\n          \"-my-0.5 hidden size-6 items-center justify-center rounded-kit-md text-kit-fg-3 hover:bg-kit-hover hover:text-kit-fg\",\n          \"group-hover/field:inline-flex group-focus-within/field:!hidden [@media(pointer:coarse)]:inline-flex\",\n        )}\n      >\n        <IconArrowsMaximize className=\"size-3.5\" stroke={1.5} aria-hidden />\n      </button>\n    </Tooltip>\n  );\n}\n"],"mappings":"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"}

package/controls/rich-text/dom.d.ts

@@ -0,0 +1,190 @@
+/**
+ * RICH TEXT · DOM layer (V2 HEAD controls/rich-text/dom.ts). The field value is clean, semantic HTML; rich blocks are
+ * "islands" while editing.
+ *
+ * Live DOM  = the HTML, with every rich block swapped for a `div[data-rt-island="kind"]` (contenteditable=false) that
+ *             React renders into through a portal. The island's model lives on the element (`el.__rt`).
+ * Stored    = `serialize()` swaps each island back for its static HTML (`renderStatic`). The static form is the markup
+ *             production's own renderer writes for the same block, so the host's ingest reads it back as that block.
+ * Loading   = `hydrate()` turns that markup back into islands, so a re-mount restores them.
+ *
+ * Only the blocks production stores are islands here. Each one's markup is what the host's codec renders the stored
+ * block as and reads back (features/dock-v2/richTextCodec.ts); `data-extra` carries, opaque, whatever of the stored block
+ * the editor does not edit, so nothing it holds is dropped by an edit elsewhere.
+ *   image       `bcmsBlock` builtin:image: address, alt text, caption, alignment, size, link
+ *               (`<figure data-rt="image" data-align data-size><a href><img src alt></a><figcaption>`)
+ *   table       production's Portable Text table (rows of cells, a header row, header cells, and the V2 table's caption,
+ *               note, row groups and column groups), drawn with the kit's table editor (V2 TableBlock), stored as the markup
+ *               production's renderer writes (`<caption>`, `th[scope=colgroup data-group]`, a `<tbody data-key>` per row
+ *               group under a `th[scope=rowgroup]` row, `<figure data-rt="table">…<p data-notes>` for the note; footnotes
+ *               fold into the note as `[1] …`, as production's ingest folds V2's). A cell's closing
+ *               footnote markers (`<sup data-footnote>`) ride the cell as written (`marks`). A table whose cells hold
+ *               other inline formatting the table value has no place for (a term, bold) is not an island: it stays
+ *               markup in the body, edited in place, so the formatting survives.
+ *   pullquote   V2 article block (CPO D55), `<figure data-rt="pullquote">` → a `pullQuote` block.
+ *   takeaways   V2 article block (CPO D55), `<aside data-rt="takeaways"><p data-title>…<ul><li>…` → a `keyTakeaways` block
+ *               {title?, points} (written in the text itself, V2 TakeawaysEditor).
+ *   callout     `bcmsBlock` builtin:callout {tone, title, message}: `<div data-rt="callout" data-callout><p data-title>…
+ *               <div data-body><p>…` (the message is plain text: paragraphs and line breaks)
+ *   toggle      `bcmsBlock` builtin:toggle {title, body}: `<details data-rt="toggle"><summary>…<div data-body><p>…`
+ *   video       the `video` block {src, title}: `<div data-rt="video" data-url data-title>`
+ *   file        the `file` block {src, name, size}: `<div data-rt="file" data-url data-name data-size>`
+ *   component   `bcmsBlock` "component" {componentId, overrides, variant} (CPO D28): `<div data-rt="component" data-ref
+ *               data-id data-name data-overrides data-variant>` — a linked instance of a project component, shown as a card.
+ *               A separate copy (V2 instances.ts `detach`) adds {detached, props, blocks, sourcePublishedAt}:
+ *               `data-detached="true" data-props data-blocks data-source-published-at`, and carries no overrides.
+ * A key the stored block holds is an attribute or element that is present; a key it lacks is absent, so an untouched
+ * block reads back exactly as stored.
+ * V2's gallery, embed, columns, footnotes, contents, related posts and author bio have no stored form in
+ * production and are not offered.
+ */
+import { type TableValue } from "../../schema/table";
+export declare const esc: (s: string) => string;
+export declare const escAttr: (s: string) => string;
+export declare const rid: (p?: string) => string;
+export type ImageAlign = "full" | "center" | "left" | "right";
+export type ImageSize = "s" | "m" | "l" | "full";
+export declare const IMAGE_ALIGNS: readonly ImageAlign[];
+export declare const IMAGE_SIZES: readonly ImageSize[];
+/** Every optional key is absent when the stored block lacks it (see the header). */
+export interface ImageModel {
+    src: string;
+    /** absent only on a stored block that never had one (every new image has alt text, empty or not) */
+    alt?: string;
+    caption?: string;
+    align?: ImageAlign;
+    size?: ImageSize;
+    href?: string;
+    /** the stored block's other keys, opaque to the editor */
+    extra?: string;
+}
+/** A table island IS the kit's table value (V2 TableModel); only what production's table keeps is stored (see above). */
+export type TableModel = TableValue;
+/** V2 PullQuoteModel (article.ts). */
+export interface PullQuoteModel {
+    quote: string;
+    name: string;
+    role: string;
+    link: string;
+}
+/** V2 TakeawaysModel (article.ts): the title over the list and one plain string per point. */
+export interface TakeawaysModel {
+    title: string;
+    points: string[];
+}
+export type CalloutTone = "info" | "tip" | "warning";
+export declare const CALLOUT_TONES: readonly CalloutTone[];
+export interface CalloutModel {
+    /** the stored tone, as written (the editor offers info, tip and warning) */
+    tone?: string;
+    title?: string;
+    /** plain text: paragraphs split by a blank line, line breaks kept */
+    body?: string;
+    extra?: string;
+}
+export interface ToggleModel {
+    title?: string;
+    body?: string;
+    extra?: string;
+}
+export interface VideoModel {
+    url?: string;
+    title?: string;
+    extra?: string;
+}
+export interface FileModel {
+    url?: string;
+    name?: string;
+    size?: number;
+    extra?: string;
+}
+/** A linked instance of a project component (CPO D28): its library id, its own id, its name and its overrides. */
+export interface ComponentModel {
+    /** the component it links to (`fields.componentId`) */
+    ref?: string;
+    /** this instance (the block's key) */
+    id: string;
+    /** the component's name when it was placed (`schemaLabel`) */
+    name?: string;
+    /** the fields this instance overrides, as stored JSON */
+    overrides?: string;
+    /** the layout this instance draws the component in (V2's per-instance variant, `fields.variant`) */
+    variant?: string;
+    /** V2 `detached`: a separate copy that no longer follows the component (`fields.detached`) */
+    detached?: boolean;
+    /** a separate copy's values as readers see them, as stored JSON (V2 `props`, `fields.props`) */
+    props?: string;
+    /** a separate copy's frozen block tree, as stored JSON (`fields.blocks`); the editor never edits it */
+    blocks?: string;
+    /** the version of the component the copy was taken from (`fields.sourcePublishedAt`) */
+    sourcePublishedAt?: string;
+    extra?: string;
+}
+export interface IslandModels {
+    image: ImageModel;
+    table: TableModel;
+    pullquote: PullQuoteModel;
+    takeaways: TakeawaysModel;
+    callout: CalloutModel;
+    toggle: ToggleModel;
+    video: VideoModel;
+    file: FileModel;
+    component: ComponentModel;
+}
+export type IslandKind = keyof IslandModels;
+export declare const ISLAND_KINDS: IslandKind[];
+export type IslandEl = HTMLElement & {
+    __rt?: IslandModels[IslandKind];
+    __rtFocus?: boolean;
+    /** the mounted island's own setter: restores a model from the editor's history (undo / redo) */
+    __rtSet?: (m: IslandModels[IslandKind]) => void;
+};
+export declare function defaultModel<K extends IslandKind>(kind: K, extra?: Partial<IslandModels[K]>): IslandModels[K];
+/** Deep copy (Duplicate). A copied table or component instance gets its own id. */
+export declare const cloneModel: <K extends IslandKind>(kind: K, m: IslandModels[K]) => IslandModels[K];
+/** "a\nb\n\nc" → `<p>a<br>b</p><p>c</p>`. Split on exactly one blank line, so any text reads back as written. */
+export declare const textToParas: (s: string) => string;
+/** The inverse of textToParas: each paragraph's text, its line breaks kept. */
+export declare function parasToText(el: Element): string;
+export declare function renderStatic(kind: IslandKind, model: unknown): string;
+/**
+ * Production's table markup → the table value, cell for cell (renderStoredTable's inverse): the plain `<table>`, or
+ * the `<figure data-rt="table">` around one with its note. The V2 reader (parseTableElement) is not used here: it reads
+ * a one-column row as a row-group heading and a caption-less grid by guesses that a stored table never meant.
+ */
+export declare function parseStoredTable(src: Element): TableModel;
+/**
+ * The table as production's renderer writes a Portable Text table (@bettercms-ai/richtext html.ts tableHtml): a header
+ * row in <thead>, header cells of the first column as <th>, every cell its text (a link cell its link). A caption, a
+ * note or a group adds what that renderer writes for it, in the order the rows are held (an unedited stored table
+ * comes back as it was; the editor's row list writes V2's order, loose rows first). An empty group has no row to label
+ * and is not written, as production's renderer writes none.
+ */
+export declare function renderStoredTable(input: TableModel): string;
+export declare function detectKind(el: Element): IslandKind | null;
+export declare function parseIsland(kind: IslandKind, el: HTMLElement): IslandModels[IslandKind];
+export declare function createIsland<K extends IslandKind>(kind: K, model: IslandModels[K]): IslandEl;
+/** Static block HTML → islands (top level only). Keeps a writable line after a trailing island or rule. */
+export declare function hydrate(root: HTMLElement): void;
+/** Live DOM → stored HTML. */
+export declare function serialize(root: HTMLElement): string;
+/** The HTML exactly as the editor would store it after opening `html` (load → hydrate → serialize), with no edit. */
+export declare function editorRoundTrip(html: string): string;
+/** Strip scripts, event handlers and script URLs from HTML we did not author (paste, Markdown, loaded values). */
+export declare function sanitize(html: string): string;
+export declare const TEXT_BLOCKS: Set<string>;
+export declare function topBlock(root: HTMLElement | null, node: Node | null): HTMLElement | null;
+/** Nearest text-ish block element around a node, inside root. */
+export declare function closestBlock(root: HTMLElement, node: Node | null): HTMLElement | null;
+export declare function placeCaret(el: Node, atEnd?: boolean): void;
+export declare function textBeforeCaret(block: HTMLElement): string | null;
+export declare function editingHost(n: Node | null): HTMLElement | null;
+/** A range's box. Browsers measure a collapsed caret as an empty rect, and some engines cannot measure ranges at all: then
+ *  the box of the element the range sits in. */
+export declare function rangeRect(r: Range, fallback: Element | null): DOMRect;
+export declare function countWords(html: string): number;
+/** Linked component instances in the body. */
+export declare const countComponents: (html: string) => number;
+/** "1,840 words · 3 components" */
+export declare const bodyCountLabel: (html: string) => string;
+export declare const isEmptyHtml: (html: string) => boolean;