@kerfjs/ui 5.0.0-beta.110 → 5.0.0-beta.112

package/docs/manual-test-plan.md

@@ -26,4 +26,30 @@ in `tests/browser/dialog-bottom-sheet.spec.ts`.
 
 ## Automated coverage summary
 
-Nothing has moved from this plan into automation yet.
+The feed-card route `?component=content-item`, example "Image-Tinted Feed
+Cards", has unit coverage for image state transitions and three-engine browser
+coverage for independent timelines, reverse scrolling, image error/recovery,
+light/dark tint contrast, reduced motion, increased contrast, and forced
+colors. Wide and narrow light/dark captures were inspected for text, controls,
+image clipping, and card spacing. A 50/200-card Chromium trace checks node and
+listener growth; it uses repeated sample artwork, so a production feed with
+unique high-resolution assets still needs its own image-cache profiling.
+The composed BackdropImage card has browser checks for its edge geometry,
+fade, scrim, and focusable overlay at wide and narrow sizes; inspect the same
+states in both captured WebKit views.
+
+The remaining device-only checks above require a real mobile keyboard.
+The List View Transitions catalog example has unit coverage for its row edits,
+pending-snapshot queue, and clip lifecycle, with browser coverage for real controls, fallback,
+reduced motion, and wide/narrow layout. Its animation was visually inspected
+at both widths; the browser tests verify names and state after each edit.
+The real catalog scroll position is checked during and after all four List
+transition actions at wide and narrow viewports. During motion, check that
+named rows stay within the visible example and do not cover the catalog footer
+or neighboring examples; the browser suite checks the computed transition
+clip at wide and narrow viewports. Also check that the catalog header, sidebar,
+and surrounding examples remain painted throughout the transition; browser
+captures compare a header pixel before and during motion at narrow, medium,
+and review-sized viewports.
+The row viewport has a fixed height across Reorder, Insert Delta, Remove Last,
+and Reset; inspect the disappearing last row within it at wide and narrow sizes.

package/docs/recipes.md

@@ -220,6 +220,15 @@ and [`backdrop-image.md`](backdrop-image.md) for the image.
 
 ## Rules shared by every recipe
 
+An image-led feed composes `ContentItem` rows with `media` and a per-card
+app-sampled `tint` inside one scrolling Pane. Each image reserves its size and
+animates on its own view timeline as it crosses that Pane's top edge. Use
+`wireContentItems` on the stable app root for image load/error as well as card
+keyboard behavior. Put source links and actions inside static cards. Use
+`ContentItem.media` composes `BackdropImage` for each feed row; use the public
+`BackdropImage` directly for a page hero. See
+[Content items](layout.md#content-items) and [BackdropImage](backdrop-image.md).
+
 - Import `@kerfjs/ui/layout.css`; keep every pane unpadded and use exactly one
   `.kui-pane__content` scroll owner for each real boundary.
 - For direct `wa-*` JSX, import types from `@kerfjs/ui/webawesome`. Import only

package/docs/surface-scaffold.md

@@ -47,7 +47,10 @@ openDialog(document.getElementById('edit-workspace') as HTMLDialogElement);
   copy in the body. `rootAttributes` takes only `data-*` attributes, so it can
   never set or override `aria-describedby`.
 - **Header.** The title, then `headerActions` and a close button (`closeLabel`,
-  default `Close`). `withoutHeader` renders none, for content that owns its
+  default `Close`). Set `closeEmphasis="quiet"` for a smaller, softer X in the
+  same 40px button target; the default `"normal"` keeps the standard close
+  control. Both preserve the accessible name, keyboard focus, and close
+  request behavior. `withoutHeader` renders none, for content that owns its
   heading and close control.
 - **Body and footer.** `children` is the body; `footer` sits below it (or
   floats over it, see [Chat dialogs](#chat-dialogs-a-floating-footer-over-a-filling-transcript)).
@@ -102,6 +105,52 @@ of wrapping it in an app `div`:
 `rootAttributes` takes `data-*` identity only; the surface's own configuration
 attributes (`data-size`, `data-presentation`, …) stay protected.
 
+### Controlled modal stacks
+
+For a reader stack, render one `DialogSurface` per reader with a stable `id` or
+`data-key`, and pass each layer its controlled `stack` state:
+
+```tsx
+<DialogSurface
+  id={`reader-${reader.id}`}
+  label={reader.title}
+  preferredWidth={remify(1024)}
+  height="viewport"
+  bodyInset="none"
+  bodyLayout="fill"
+  stack={{
+    open: reader.open,
+    active: reader.id === activeReaderId,
+    position: reader.position,
+    count: readers.length,
+    offset: remify(-10 * (readers.length - reader.position)),
+  }}
+  rootAttributes={{ 'data-key': reader.id }}
+>
+  {reader.content}
+</DialogSurface>;
+```
+
+Call `wireDialogStack(container)` once on a stable ancestor after rendering and
+call its returned cleanup when that ancestor unmounts; cleanup closes its open
+layers. It observes subsequent
+renders and calls `syncDialogStack(container)` to open layers back to front in
+the browser's native top layer. `position` is a unique 1-based order within the
+stack; `count` includes closed layers that remain rendered. Exactly one open
+layer must be `active`, and it must have the highest open position. An inactive
+layer has `aria-hidden` and `inert`, and only the active layer has
+`aria-modal="true"`. The optional typed `offset` translates inactive layers on
+roomy screens; compact screens stay aligned. Stacked modals default to a 24px
+desktop and 16px phone viewport gutter, overridable with `viewportGutter`.
+
+Handle `kui-request-close` by updating application state to close the top
+layer; the stack controller then reconciles it. It never closes a controlled
+layer on its own. A reorder may briefly close and reopen moved native dialogs
+to establish browser top-layer order, so do not treat the native `close` event
+as a user dismissal. Each dialog retains its own in-dialog overlay host for
+popups and menus. The catalog's **Controlled Reader Stack** demonstrates push,
+reorder, Escape, and close at desktop and phone widths.
+
 ### Modal viewport bounds
 
 `viewportGutter` accepts a branded `CssLength` from `@kerfjs/ui/css-values`.

package/docs/value-preview.md

@@ -0,0 +1,16 @@
+# ValuePreview
+
+`ValuePreview` displays a literal, read-only multiline string inside a bounded, keyboard-scrollable region. Use it for an existing value that may contain line breaks or long unbroken tokens, such as two versions in a conflict review. It owns compact text, pre-wrapping, anywhere wrapping, and a 48–96px default height window. It does not paint a background, border, or outer inset; compose it inside `SunkenPanel` when the value needs a lowered frame.
+
+```tsx
+import { SunkenPanel } from '@kerfjs/ui/sunken-panel';
+import { ValuePreview } from '@kerfjs/ui/value-preview';
+
+<SunkenPanel>
+  <ValuePreview label="Their Latest Version" value={remoteText} />
+</SunkenPanel>;
+```
+
+`label` gives the focusable output an accessible name. The string in `value` is rendered as text, not HTML; newlines remain visible and long tokens wrap instead of widening the pane. An empty string stays empty, so the application chooses any placeholder wording. `minHeight` and `maxHeight` take typed CSS lengths from `@kerfjs/ui/css-values` when a different scroll window is needed. The component itself scrolls long content; the containing `SunkenPanel` remains the sole owner of its surface.
+
+Use `TextField multiline` when the person can edit the value. Use `ValueTable` for labelled short facts. `ValuePreview` is for one potentially long, read-only value.

package/llms.txt

@@ -717,6 +717,9 @@ headingLevel`, `SearchField clearIcon`, `ContentItem frame="framed"` for a
   renders a native `aria-pressed` button whose pressed look draws on top of
   its tone and emphasis; the app flips the state. Never wrap a
   `ToolbarControlGroup` outside a toolbar or restyle a button to fake it.
+- **Mark a current setup step with `Button.currentStep`.** It emits
+  `aria-current="step"` on a button or link, including a disabled current step.
+  The app owns the step label and which step is current. See `docs/button.md`.
 - **Let an icon-state toggle skip selected chrome.** When a pressed toggle's
   glyph already shows its state (an empty or filled star), set
   `data-selected-chrome="none"` on that button, or `selectedChrome="none"` on
@@ -729,7 +732,10 @@ headingLevel`, `SearchField clearIcon`, `ContentItem frame="framed"` for a
   per item as a list `row` or board `card`, with a state `rail`, a clamped
   `title`, `trailingMeta`, a `metadata` line, `selected`, `dimmed`, and
   `listEdge` rounding; the app owns the listbox and keyboard movement. Never
-  hand-roll ticket-row chrome.
+  hand-roll ticket-row chrome. For a non-option diagnostic with a nested
+  recovery button, set `semanticRole="group"` and `ariaLabel`; the root is not
+  a Tab stop and only the button activates. Set `draggable` on an option row or
+  card for a native drag source on that same selection root.
 - **Group settings rows in `FramedList`.** For rows of arbitrary content in
   one rounded frame with dividers between them (settings, account cards,
   shortcut lists), compose `FramedListRow`s; `ValueTable` is the same frame for
@@ -916,6 +922,9 @@ created, input }`. Never use a hand-styled `<input list>` + `<datalist>`.
   `data-kui-effects="static"`, or without scroll-driven animations, and ends on
   a hard edge (overlay on a solid `fadeTo` band) under reduced transparency. Never hand-roll scroll listeners or
   `background-attachment: fixed`.
+  In a dense image-led feed, opt into `ContentItem.media.deferOffscreen` (or
+  `BackdropImage.deferOffscreen` directly) to skip offscreen hero painting while
+  preserving card height and the shared scroll owner.
 
 - **Use `MessageComposer` for a chat or prompt composer.** `@kerfjs/ui/message-composer`
   renders a raised frame (standard border, large radius, `shadow-l`) whose

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kerfjs/ui",
-  "version": "5.0.0-beta.110",
+  "version": "5.0.0-beta.112",
   "description": "Accessible, composable UI primitives for kerf applications.",
   "type": "module",
   "license": "MIT",
@@ -561,6 +561,16 @@
       "browser": "./dist/browser/value-table.js",
       "import": "./dist/value-table.js"
     },
+    "./value-preview": {
+      "types": "./dist/value-preview.d.ts",
+      "browser": "./dist/browser/value-preview.js",
+      "import": "./dist/value-preview.js"
+    },
+    "./editor-frame": {
+      "types": "./dist/editor-frame.d.ts",
+      "browser": "./dist/browser/editor-frame.js",
+      "import": "./dist/editor-frame.js"
+    },
     "./unstyled": {
       "types": "./dist/index.d.ts",
       "import": "./dist/index.js"
@@ -642,6 +652,8 @@
     "./summary-row.css": "./dist/styles/summary-row.css",
     "./empty-state.css": "./dist/styles/empty-state.css",
     "./value-table.css": "./dist/styles/value-table.css",
+    "./value-preview.css": "./dist/styles/value-preview.css",
+    "./editor-frame.css": "./dist/styles/editor-frame.css",
     "./ai/*": "./ai/*",
     "./docs/*": "./docs/*"
   },

package/dist/chunk-3GLYIIFR.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/collections/list-item/list-item.tsx"],"names":[],"mappings":"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","file":"chunk-3GLYIIFR.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nimport {\n  type ListIconTile,\n  type ListIconTilePresentation,\n  listIconTilePresentation,\n} from '../../../shared/content/list-icon-tile.js';\nimport type { KerfUiContent } from '../../../shared/content/semantic-content.js';\nimport { nativeDraggable } from '../../../shared/dom/draggable.js';\nimport { filterDataAttributes } from '../../../shared/dom/extension-attributes.js';\nimport { em, remify } from '../../../shared/styles/css-values.js';\nimport { withWordBreaks } from '../../../shared/text/word-breaks.js';\nimport { LoadingSpinner } from '../../feedback/loading-spinner/loading-spinner.js';\nimport { Skeleton } from '../../feedback/skeleton/skeleton.js';\n\nexport type {\n  ListIconTile,\n  ListIconTileColor,\n  ListIconTileTone,\n} from '../../../shared/content/list-icon-tile.js';\n\nconst PROTECTED_ROOT_DATA_ATTRIBUTES = new Set([\n  'data-component',\n  'data-action',\n  'data-item-id',\n  'data-has-icon',\n  'data-has-description',\n  'data-multiline',\n  'data-density',\n  'data-divider',\n  'data-busy',\n  'data-state',\n  'data-kui-disabled',\n  'data-icon-align',\n  'data-icon-tile',\n  'data-icon-tile-tone',\n  'data-dragging',\n  'data-drop-position',\n]);\n\ntype ListItemRootAttributes = Readonly<\n  Record<`data-${string}`, string | undefined> & {\n    'data-component'?: never;\n    'data-action'?: never;\n    'data-item-id'?: never;\n    'data-has-icon'?: never;\n    'data-has-description'?: never;\n    'data-multiline'?: never;\n    'data-density'?: never;\n    'data-divider'?: never;\n    'data-busy'?: never;\n    'data-state'?: never;\n    'data-kui-disabled'?: never;\n    'data-icon-align'?: never;\n    'data-icon-tile'?: never;\n    'data-icon-tile-tone'?: never;\n    'data-dragging'?: never;\n    'data-drop-position'?: never;\n  }\n>;\n\nexport interface ListItemProps {\n  label: string | SafeHtml;\n  /** App-owned supporting text rendered in the component's stable label stack. */\n  description?: string | SafeHtml;\n  icon?: SafeHtml;\n  /** Present `icon` in a filled 32px rounded tile with an 18px glyph: a quiet tone preset, or `{ color, foreground? }` for an application color. */\n  iconTile?: ListIconTile;\n  /** Dormant author content at the row's end; a placeholder renders it as a skeleton. */\n  trailing?: KerfUiContent;\n  /** Dormant status metadata rendered before trailing content; a placeholder renders it as a skeleton. */\n  status?: string | SafeHtml;\n  /** Show a progress indicator and expose the row as busy without replacing its content; a placeholder keeps the indicator. */\n  busy?: boolean;\n  density?: 'standard' | 'compact' | 'spacious';\n  divider?: 'none' | 'before' | 'after' | 'both';\n  selected?: boolean;\n  action: string;\n  itemId?: string;\n  className?: string;\n  pressed?: boolean;\n  accessibleLabel?: string;\n  title?: string;\n  multiline?: boolean;\n  /** Alignment of an icon beside a wrapped label. Defaults to its first line. */\n  multilineIconAlign?: 'first-line' | 'center';\n  state?: string;\n  disabled?: boolean;\n  tabIndex?: number;\n  /** Render the row as an unanimated loading skeleton, disabling its action: label, description, icon, status, and trailing content become skeletons; the `busy` indicator stays live. */\n  placeholder?: boolean;\n  /** Native HTML drag source (`draggable=\"true\"`); a placeholder is never draggable. Pair with `wireListReorder` for pointer and keyboard reordering. */\n  draggable?: boolean;\n  /** Dim this row as one of the rows being dragged. */\n  dragging?: boolean;\n  /** Draw the insertion line at this row's leading (`before`) or trailing (`after`) block edge. */\n  dropPosition?: 'before' | 'after';\n  rootAttributes?: ListItemRootAttributes;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n}\n\nexport interface ListItemLinkProps extends Omit<\n  ListItemProps,\n  'action' | 'pressed'\n> {\n  /** Native destination for this navigation row. */\n  href: string;\n  /** Open in a new tab with a safe rel and announce that behavior. */\n  external?: boolean;\n  action?: never;\n  pressed?: never;\n}\n\nfunction listItemContent({\n  label,\n  description,\n  icon,\n  tile,\n  trailing,\n  status,\n  busy = false,\n  multiline = false,\n  placeholder = false,\n}: Pick<\n  ListItemProps,\n  | 'label'\n  | 'description'\n  | 'icon'\n  | 'trailing'\n  | 'status'\n  | 'busy'\n  | 'multiline'\n  | 'placeholder'\n> & { tile: ListIconTilePresentation | null }) {\n  const tileSize = tile?.tile ? 32 : 18;\n  return (\n    <>\n      {icon && (\n        <span\n          class=\"kui-list-item__icon\"\n          style={placeholder ? undefined : tile?.style}\n        >\n          {placeholder ? (\n            <Skeleton\n              block\n              width={remify(tileSize)}\n              height={remify(tileSize)}\n            />\n          ) : (\n            icon\n          )}\n        </span>\n      )}\n      <span class=\"kui-list-item__label\">\n        <span class=\"kui-list-item__primary-label\">\n          {placeholder ? (\n            <Skeleton width={em(9)} />\n          ) : multiline ? (\n            withWordBreaks(label)\n          ) : (\n            label\n          )}\n        </span>\n        {description && (\n          <span class=\"kui-list-item__description\">\n            {placeholder ? <Skeleton width={em(11)} /> : description}\n          </span>\n        )}\n      </span>\n      {(busy || status || trailing) && (\n        <span class=\"kui-list-item__trailing\">\n          {/* The busy spinner is component-owned chrome drawn from a known\n              prop, so a placeholder keeps it live. Status text and\n              author-supplied trailing content are values: skeletons. */}\n          {busy && <LoadingSpinner />}\n          {status && (\n            <span class=\"kui-list-item__status\">\n              {placeholder ? <Skeleton width={em(3.5)} /> : status}\n            </span>\n          )}\n          {trailing && (placeholder ? <Skeleton width={em(1.5)} /> : trailing)}\n        </span>\n      )}\n    </>\n  );\n}\n\nexport function ListItem({\n  label,\n  description,\n  icon,\n  iconTile,\n  trailing,\n  status,\n  busy = false,\n  density = 'standard',\n  divider = 'none',\n  selected = false,\n  action,\n  itemId,\n  className = '',\n  pressed,\n  accessibleLabel,\n  title,\n  multiline = false,\n  multilineIconAlign = 'first-line',\n  state,\n  disabled = false,\n  tabIndex,\n  placeholder = false,\n  draggable,\n  dragging = false,\n  dropPosition,\n  rootAttributes = {},\n  slot,\n}: ListItemProps) {\n  const extensionAttributes = filterDataAttributes(\n    rootAttributes,\n    PROTECTED_ROOT_DATA_ATTRIBUTES,\n  );\n  const tile = icon ? listIconTilePresentation(iconTile, 'list-item') : null;\n  return (\n    <button\n      {...extensionAttributes}\n      type=\"button\"\n      class={`kui-list-item ${className}`.trim()}\n      title={placeholder ? undefined : title}\n      disabled={disabled || placeholder}\n      tabindex={placeholder ? -1 : tabIndex}\n      data-component=\"list-item\"\n      data-action={placeholder ? undefined : action}\n      data-item-id={itemId}\n      data-has-icon={String(Boolean(icon))}\n      data-has-description={String(Boolean(description))}\n      data-multiline={multiline ? 'true' : undefined}\n      data-icon-align={multiline ? multilineIconAlign : undefined}\n      data-icon-tile={tile?.tile}\n      data-icon-tile-tone={tile?.tone}\n      data-density={density}\n      data-divider={divider}\n      data-busy={busy ? 'true' : undefined}\n      data-state={state}\n      data-kui-disabled={disabled ? 'true' : undefined}\n      data-placeholder={placeholder ? 'true' : undefined}\n      draggable={nativeDraggable(draggable, placeholder)}\n      data-dragging={dragging ? 'true' : undefined}\n      data-drop-position={dropPosition}\n      aria-label={accessibleLabel}\n      aria-current={selected ? 'page' : undefined}\n      aria-pressed={pressed === undefined ? undefined : String(pressed)}\n      aria-busy={placeholder || busy ? 'true' : undefined}\n      slot={slot}\n    >\n      {listItemContent({\n        label,\n        description,\n        icon,\n        tile,\n        trailing,\n        status,\n        busy,\n        multiline,\n        placeholder,\n      })}\n    </button>\n  );\n}\n\n/** A navigation row with native link activation and ListItem geometry. */\nexport function ListItemLink({\n  href,\n  external = false,\n  label,\n  description,\n  icon,\n  iconTile,\n  trailing,\n  status,\n  busy = false,\n  density = 'standard',\n  divider = 'none',\n  selected = false,\n  itemId,\n  className = '',\n  accessibleLabel,\n  title,\n  multiline = false,\n  multilineIconAlign = 'first-line',\n  state,\n  disabled = false,\n  tabIndex,\n  placeholder = false,\n  draggable,\n  dragging = false,\n  dropPosition,\n  rootAttributes = {},\n  slot,\n}: ListItemLinkProps) {\n  const extensionAttributes = filterDataAttributes(\n    rootAttributes,\n    PROTECTED_ROOT_DATA_ATTRIBUTES,\n  );\n  const tile = icon ? listIconTilePresentation(iconTile, 'list-item') : null;\n  const inactive = disabled || placeholder;\n  const linkLabel =\n    accessibleLabel ??\n    (external && typeof label === 'string'\n      ? `${label} (opens in new tab)`\n      : undefined);\n  return (\n    <a\n      {...extensionAttributes}\n      class={`kui-list-item ${className}`.trim()}\n      href={inactive ? undefined : href}\n      target={inactive || !external ? undefined : '_blank'}\n      rel={inactive || !external ? undefined : 'noopener noreferrer'}\n      title={placeholder ? undefined : title}\n      tabindex={inactive ? -1 : tabIndex}\n      data-component=\"list-item-link\"\n      data-item-id={itemId}\n      data-has-icon={String(Boolean(icon))}\n      data-has-description={String(Boolean(description))}\n      data-multiline={multiline ? 'true' : undefined}\n      data-icon-align={multiline ? multilineIconAlign : undefined}\n      data-icon-tile={tile?.tile}\n      data-icon-tile-tone={tile?.tone}\n      data-density={density}\n      data-divider={divider}\n      data-busy={busy ? 'true' : undefined}\n      data-state={state}\n      data-kui-disabled={disabled ? 'true' : undefined}\n      data-placeholder={placeholder ? 'true' : undefined}\n      draggable={nativeDraggable(draggable, placeholder)}\n      data-dragging={dragging ? 'true' : undefined}\n      data-drop-position={dropPosition}\n      aria-label={linkLabel}\n      aria-current={selected ? 'page' : undefined}\n      aria-disabled={inactive ? 'true' : undefined}\n      aria-busy={placeholder || busy ? 'true' : undefined}\n      slot={slot}\n    >\n      {listItemContent({\n        label,\n        description,\n        icon,\n        tile,\n        trailing,\n        status,\n        busy,\n        multiline,\n        placeholder,\n      })}\n    </a>\n  );\n}\n"]}

package/dist/chunk-4UB5Z3ZZ.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/collections/summary-row/summary-row.tsx"],"names":[],"mappings":";;;AAWA,IAAM,mBAAA,uBAA0B,GAAA,CAAI;AAAA,EAClC,gBAAA;AAAA,EACA,mBAAA;AAAA,EACA,gBAAA;AAAA,EACA,WAAA;AAAA,EACA,eAAA;AAAA,EACA;AACF,CAAC,CAAA;AAmDM,SAAS,UAAA,CAAW;AAAA,EACzB,KAAA;AAAA,EACA,OAAA;AAAA,EACA,YAAA;AAAA,EACA,QAAA;AAAA,EACA,YAAA,GAAe,KAAA;AAAA,EACf,UAAA;AAAA,EACA,IAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,MAAA,GAAS,KAAA;AAAA,EACT,QAAA;AAAA,EACA,cAAA,GAAiB,KAAA;AAAA,EACjB,SAAA;AAAA,EACA,EAAA;AAAA,EACA,SAAA,GAAY,EAAA;AAAA,EACZ,iBAAiB;AACnB,CAAA,EAAoB;AAClB,EAAA,IACE,eAAe,MAAA,KACd,CAAC,OAAO,SAAA,CAAU,UAAU,KAAK,UAAA,GAAa,CAAA,CAAA;AAE/C,IAAA,MAAM,IAAI,WAAW,kDAAkD,CAAA;AACzE,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,oBAAA,CAAqB,cAAA,EAAgB,mBAAmB,CAAA;AAAA,MAC5D,EAAA;AAAA,MACA,KAAA,EAAO,CAAA,gBAAA,EAAmB,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK;AAAA,MAC3C,gBAAA,EAAe,aAAA;AAAA,MACf,mBAAA,EAAmB,YAAA;AAAA,MACnB,gBAAA,EAAgB,QAAA;AAAA,MAChB,WAAA,EAAW,IAAA;AAAA,MACX,eAAA,EAAe,WAAW,MAAA,GAAS,MAAA;AAAA,MACnC,aAAA,EAAa,SAAS,MAAA,GAAS,MAAA;AAAA,MAC/B,YAAA,EAAY,iBAAiB,MAAA,GAAS,MAAA;AAAA,MACtC,IAAA,EAAK,QAAA;AAAA,MACL,QAAA,EAAS,GAAA;AAAA,MACT,eAAA,EAAe,WAAW,MAAA,GAAS,OAAA;AAAA,MACnC,YAAA,EAAY,SAAA;AAAA,MACZ,KAAA,EACE,UAAA,KAAe,MAAA,GACX,MAAA,GACA,kCAAkC,UAAU,CAAA,CAAA;AAAA,MAGjD,QAAA,EAAA;AAAA,QAAA,IAAA,oBAAQ,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,uBAAA,EAAwB,eAAY,MAAA,EAAO,CAAA;AAAA,wBAChE,IAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,uBAAA,EACR,QAAA,EAAA;AAAA,UAAA,OAAA,oBAAW,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,0BAAA,EAA4B,QAAA,EAAA,OAAA,EAAQ,CAAA;AAAA,0BAC5D,IAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,0BAAA,EACT,QAAA,EAAA;AAAA,4BAAA,IAAA,CAAC,KAAA,EAAA,EAAI,OAAM,wBAAA,EACR,QAAA,EAAA;AAAA,cAAA,YAAA,KAAiB,MAAA,oBAChB,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,6BAA6B,QAAA,EAAA,YAAA,EAAa,CAAA;AAAA,cAEvD;AAAA,aAAA,EACH,CAAA;AAAA,YACC,QAAA,oBAAY,GAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,6BAA6B,QAAA,EAAA,QAAA,EAAS;AAAA,WAAA,EAChE;AAAA,SAAA,EACF;AAAA;AAAA;AAAA,GACF;AAEJ","file":"chunk-4UB5Z3ZZ.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nimport type { KerfUiContent } from '../../../shared/content/semantic-content.js';\nimport { filterDataAttributes } from '../../../shared/dom/extension-attributes.js';\nimport type { SemanticTone } from '../../../shared/styles/semantic-tone.js';\n\n/** `row` for a list section; `card` for a board column. */\nexport type SummaryRowPresentation = 'row' | 'card';\n/** A row's place in a rounded list section, so its corners match. */\nexport type SummaryRowListEdge = 'start' | 'end' | 'only';\n\nconst summaryRowProtected = new Set([\n  'data-component',\n  'data-presentation',\n  'data-list-edge',\n  'data-rail',\n  'data-selected',\n  'data-dimmed',\n]);\n\ntype SummaryRowRootAttributes = Readonly<\n  Record<`data-${string}`, string | undefined> & {\n    'data-component'?: never;\n    'data-presentation'?: never;\n    'data-list-edge'?: never;\n    'data-rail'?: never;\n    'data-selected'?: never;\n    'data-dimmed'?: never;\n  }\n>;\n\nexport interface SummaryRowProps {\n  /** The identity line: an identifier, inline status glyphs, and the title. */\n  title: KerfUiContent;\n  /** Optional leading glyph, such as a category icon. */\n  leading?: SafeHtml;\n  /** Quiet text at the end of the title line, such as a relative time. */\n  trailingMeta?: string | SafeHtml;\n  /** A wrapping line of badges, chips, and quiet text below the title. */\n  metadata?: KerfUiContent;\n  /** `row` (default) or `card`. */\n  presentation?: SummaryRowPresentation;\n  /** Title lines before clipping; default 2 for a row and 4 for a card. */\n  titleLines?: number;\n  /** A leading state rail in a semantic tone (Up Next, blocked, …). */\n  rail?: SemanticTone;\n  /** Selected state, exposed as `aria-selected`. */\n  selected?: boolean;\n  /** Dim a finished or cut item; hover and selection restore it. */\n  dimmed?: boolean;\n  /** Round the corners that meet a rounded list section's edge. */\n  listEdge?: SummaryRowListEdge;\n  /** Skip rendering while off screen in long lists (`content-visibility`). */\n  deferRendering?: boolean;\n  /** Accessible name when the visible content is not a good one. */\n  ariaLabel?: string;\n  id?: string;\n  className?: string;\n  /** Safe `data-*` identity (an item id or delegated action) on the option. */\n  rootAttributes?: SummaryRowRootAttributes;\n}\n\n/**\n * A selectable, keyboard-focusable summary of one item, as a list row or a\n * board card: an optional leading glyph and state rail, a clamped identity line\n * with trailing quiet metadata, and a wrapping metadata line. It is a\n * `role=\"option\"`; place rows in a labeled `role=\"listbox\"` and own selection\n * and keyboard movement in the application.\n */\nexport function SummaryRow({\n  title,\n  leading,\n  trailingMeta,\n  metadata,\n  presentation = 'row',\n  titleLines,\n  rail,\n  selected = false,\n  dimmed = false,\n  listEdge,\n  deferRendering = false,\n  ariaLabel,\n  id,\n  className = '',\n  rootAttributes = {},\n}: SummaryRowProps) {\n  if (\n    titleLines !== undefined &&\n    (!Number.isInteger(titleLines) || titleLines < 1)\n  )\n    throw new RangeError('SummaryRow titleLines must be a positive integer');\n  return (\n    <div\n      {...filterDataAttributes(rootAttributes, summaryRowProtected)}\n      id={id}\n      class={`kui-summary-row ${className}`.trim()}\n      data-component=\"summary-row\"\n      data-presentation={presentation}\n      data-list-edge={listEdge}\n      data-rail={rail}\n      data-selected={selected ? 'true' : undefined}\n      data-dimmed={dimmed ? 'true' : undefined}\n      data-defer={deferRendering ? 'true' : undefined}\n      role=\"option\"\n      tabindex=\"0\"\n      aria-selected={selected ? 'true' : 'false'}\n      aria-label={ariaLabel}\n      style={\n        titleLines === undefined\n          ? undefined\n          : `--_kui-summary-row-title-lines:${titleLines}`\n      }\n    >\n      {rail && <span class=\"kui-summary-row__rail\" aria-hidden=\"true\" />}\n      <div class=\"kui-summary-row__body\">\n        {leading && <span class=\"kui-summary-row__leading\">{leading}</span>}\n        <div class=\"kui-summary-row__content\">\n          <div class=\"kui-summary-row__title\">\n            {trailingMeta !== undefined && (\n              <span class=\"kui-summary-row__trailing\">{trailingMeta}</span>\n            )}\n            {title}\n          </div>\n          {metadata && <div class=\"kui-summary-row__metadata\">{metadata}</div>}\n        </div>\n      </div>\n    </div>\n  );\n}\n"]}

package/dist/chunk-5USKCWGL.js

@@ -1,113 +0,0 @@
-import { filterDataAttributes } from './chunk-KH4KEMSP.js';
-import { jsx } from 'kerfjs/jsx-runtime';
-
-function roleForSelectionMode(mode) {
-  switch (mode) {
-    case "single":
-      return "option";
-    case "multiple":
-      return "row";
-    case "none":
-    case "toggle":
-      return "button";
-  }
-}
-var contentItemProtectedAttributes = /* @__PURE__ */ new Set([
-  "data-component",
-  "data-appearance",
-  "data-outlined",
-  "data-bubble",
-  "data-grid-row"
-]);
-var interactiveProtectedAttributes = /* @__PURE__ */ new Set([
-  "data-component",
-  "data-appearance",
-  "data-outlined",
-  "data-bubble",
-  "data-grid-row",
-  "data-action",
-  "data-item-id",
-  "data-interactive",
-  "data-selected",
-  "data-disabled",
-  "data-selection-mode",
-  "data-kui-pressed"
-]);
-function ContentItem({
-  appearance = "transparent",
-  children,
-  frame = "none",
-  flush = false,
-  shape = "rounded",
-  bubble,
-  title,
-  ariaLabel,
-  focusTarget = false,
-  outlined = false,
-  tabIndex,
-  gridRow = false,
-  interactive = false,
-  action,
-  itemId,
-  selectionMode = "none",
-  selected = false,
-  disabled = false,
-  className = "",
-  rootAttributes = {},
-  slot
-}) {
-  const safeRootAttributes = filterDataAttributes(
-    rootAttributes,
-    interactive ? interactiveProtectedAttributes : contentItemProtectedAttributes
-  );
-  if (interactive && !action) {
-    throw new Error("Interactive ContentItem requires an action");
-  }
-  if (interactive && selected && selectionMode === "none") {
-    throw new Error("Selected ContentItem requires a selectionMode");
-  }
-  const cls = [
-    "kui-content-item",
-    shape === "pill" ? "kui-content-item--pill" : "",
-    frame === "framed" ? "kui-content-item--framed" : "",
-    flush ? "kui-content-item--flush" : "",
-    className
-  ].filter(Boolean).join(" ");
-  const interactiveAttributes = interactive ? {
-    "data-interactive": "true",
-    "data-action": disabled ? void 0 : action,
-    "data-item-id": itemId,
-    "data-selection-mode": selectionMode,
-    "data-selected": selectionMode === "none" ? void 0 : String(selected),
-    "data-disabled": disabled ? "true" : void 0
-  } : {};
-  let role = ariaLabel ? "region" : void 0;
-  if (interactive) role = roleForSelectionMode(selectionMode);
-  else if (gridRow) role = "row";
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ...safeRootAttributes,
-      ...interactiveAttributes,
-      class: cls,
-      title,
-      "data-component": "content-item",
-      "data-appearance": appearance,
-      "data-outlined": outlined ? "true" : void 0,
-      "data-bubble": bubble,
-      "data-grid-row": !interactive && gridRow ? "true" : void 0,
-      role,
-      "aria-label": ariaLabel,
-      "aria-selected": interactive && (selectionMode === "single" || selectionMode === "multiple") ? String(selected) : void 0,
-      "aria-pressed": interactive && selectionMode === "toggle" ? String(selected) : void 0,
-      "aria-disabled": interactive && disabled ? "true" : void 0,
-      tabindex: interactive ? disabled ? "-1" : "0" : tabIndex ?? (focusTarget ? "-1" : void 0),
-      slot,
-      children: interactive && selectionMode === "multiple" || !interactive && gridRow ? /* @__PURE__ */ jsx("div", { role: "gridcell", children }) : children
-    }
-  );
-}
-
-export { ContentItem };
-
-//# sourceMappingURL=chunk-5USKCWGL.js.map

package/dist/chunk-5USKCWGL.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/surfaces/content-item/content-item.tsx"],"names":[],"mappings":"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","file":"chunk-5USKCWGL.js","sourcesContent":["import type { KerfUiContent } from '../../../shared/content/semantic-content.js';\nimport { filterDataAttributes } from '../../../shared/dom/extension-attributes.js';\nimport type { SemanticTone } from '../../../shared/styles/semantic-tone.js';\n\nexport type { SemanticTone } from '../../../shared/styles/semantic-tone.js';\n\n/**\n * Base surface treatment, semantic status colors, or `brand-loud`: the solid\n * brand fill with its on-loud foreground (a transcript's own messages).\n */\nexport type ContentItemAppearance =\n  'transparent' | 'surface' | 'brand-loud' | SemanticTone;\n\n/**\n * A chat-bubble layout for transcripts: the item fits its content up to 80%\n * of the row and sits at the `start` (other participants) or `end` (the\n * person's own messages) of the line.\n */\nexport type ContentItemBubble = 'start' | 'end';\n\n/** Whether the item's always-reserved 1px border is transparent or visible. */\nexport type ContentItemFrame = 'none' | 'framed';\n\n/** Corner shape: the 12px rounded rectangle or the 22px pill. */\nexport type ContentItemShape = 'rounded' | 'pill';\n/** `single` uses an option; `multiple` uses a grid row; `toggle` uses a pressed button. */\nexport type ContentItemSelectionMode =\n  'none' | 'single' | 'multiple' | 'toggle';\n\nfunction roleForSelectionMode(\n  mode: ContentItemSelectionMode,\n): 'option' | 'row' | 'button' {\n  switch (mode) {\n    case 'single':\n      return 'option';\n    case 'multiple':\n      return 'row';\n    case 'none':\n    case 'toggle':\n      return 'button';\n  }\n}\n\nconst contentItemProtectedAttributes = new Set([\n  'data-component',\n  'data-appearance',\n  'data-outlined',\n  'data-bubble',\n  'data-grid-row',\n]);\nconst interactiveProtectedAttributes = new Set([\n  'data-component',\n  'data-appearance',\n  'data-outlined',\n  'data-bubble',\n  'data-grid-row',\n  'data-action',\n  'data-item-id',\n  'data-interactive',\n  'data-selected',\n  'data-disabled',\n  'data-selection-mode',\n  'data-kui-pressed',\n]);\n\ntype ContentItemRootAttributes = Readonly<\n  Record<`data-${string}`, string | undefined> & {\n    'data-component'?: never;\n    'data-appearance'?: never;\n    'data-outlined'?: never;\n    'data-bubble'?: never;\n    'data-grid-row'?: never;\n  }\n>;\n\ntype ContentItemInteractiveRootAttributes = Readonly<\n  Record<`data-${string}`, string | undefined> & {\n    'data-component'?: never;\n    'data-appearance'?: never;\n    'data-outlined'?: never;\n    'data-bubble'?: never;\n    'data-grid-row'?: never;\n    'data-action'?: never;\n    'data-item-id'?: never;\n    'data-interactive'?: never;\n    'data-selected'?: never;\n    'data-disabled'?: never;\n    'data-selection-mode'?: never;\n    'data-kui-pressed'?: never;\n  }\n>;\n\ninterface ContentItemBaseProps {\n  /**\n   * Coordinated background, border, and foreground colors. `transparent`\n   * preserves the surrounding surface; `surface` paints the base surface;\n   * semantic values match StateBanner. Defaults to `transparent`.\n   */\n  appearance?: ContentItemAppearance;\n  /** Item content; a plain string is allowed for bare copy. */\n  children?: KerfUiContent | string;\n  /**\n   * `framed` paints the standard neutral border in the 1px the item always\n   * reserves, so framing never changes geometry. Frame only an item that\n   * marks a real distinction. Defaults to `none` (transparent border).\n   */\n  frame?: ContentItemFrame;\n  /** Remove block padding and block borders while retaining inline geometry. */\n  flush?: boolean;\n  /** Corner shape. Defaults to `rounded`. */\n  shape?: ContentItemShape;\n  /**\n   * Lay the item out as a chat bubble: content width up to 80% of the row,\n   * at the `start` or `end` of the line. Pair `end` with `brand-loud` for the\n   * person's own messages. Omit for an ordinary full-width item.\n   */\n  bubble?: ContentItemBubble;\n  /** Native hover tooltip. */\n  title?: string;\n  /**\n   * Names the item as a distinct region (`role=\"region\"`). Omit it for an\n   * ordinary item, which stays a non-landmark grouping.\n   */\n  ariaLabel?: string;\n  /**\n   * Makes the item a programmatic focus target (`tabindex=\"-1\"`, never a tab\n   * stop), for example the preferred initial focus of a NavStack view when\n   * combined with `data-nav-focus` in `rootAttributes`.\n   */\n  focusTarget?: boolean;\n  /** Keep the standard focus outline visible, such as for a drop target. */\n  outlined?: boolean;\n  className?: string;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n}\n\nexport type ContentItemProps = ContentItemBaseProps &\n  (\n    | {\n        interactive?: false;\n        action?: never;\n        itemId?: never;\n        selectionMode?: never;\n        selected?: never;\n        disabled?: never;\n        /** Opt into keyboard (`0`) or programmatic (`-1`) focus. */\n        tabIndex?: 0 | -1;\n        /**\n         * A non-selectable row of a multi-select `List` or `Grid`: renders\n         * `role=\"row\"` around a `gridcell`, with no `aria-selected` and no\n         * Tab stop of its own, for content between selectable rows (an\n         * activity group, a \"messages skipped\" divider). Its controls stay\n         * reachable by Tab; arrow keys skip it.\n         */\n        gridRow?: boolean;\n        /** Existing static `data-*` metadata remains available. */\n        rootAttributes?: ContentItemRootAttributes;\n      }\n    | {\n        /** Enable a keyboard reachable card; wire `wireContentItems` once on its containing root. */\n        interactive: true;\n        /** Delegated action dispatched by pointer, Enter, or Space. */\n        action: string;\n        itemId?: string;\n        selectionMode?: ContentItemSelectionMode;\n        selected?: boolean;\n        disabled?: boolean;\n        tabIndex?: never;\n        /** An interactive item is already a row in a multi-select grid. */\n        gridRow?: never;\n        /** Safe app metadata; interaction attributes are component-owned. */\n        rootAttributes?: ContentItemInteractiveRootAttributes;\n      }\n  );\n\n/**\n * One self-contained `.kui-content` child: an 8px inline margin, a real 1px\n * border (transparent unless `framed`), 8px padding, and a rounded or pill\n * radius. It owns that whole geometry, so wrappers must not add more.\n */\nexport function ContentItem({\n  appearance = 'transparent',\n  children,\n  frame = 'none',\n  flush = false,\n  shape = 'rounded',\n  bubble,\n  title,\n  ariaLabel,\n  focusTarget = false,\n  outlined = false,\n  tabIndex,\n  gridRow = false,\n  interactive = false,\n  action,\n  itemId,\n  selectionMode = 'none',\n  selected = false,\n  disabled = false,\n  className = '',\n  rootAttributes = {},\n  slot,\n}: ContentItemProps) {\n  const safeRootAttributes = filterDataAttributes(\n    rootAttributes,\n    interactive\n      ? interactiveProtectedAttributes\n      : contentItemProtectedAttributes,\n  );\n  if (interactive && !action) {\n    throw new Error('Interactive ContentItem requires an action');\n  }\n  if (interactive && selected && selectionMode === 'none') {\n    throw new Error('Selected ContentItem requires a selectionMode');\n  }\n  const cls = [\n    'kui-content-item',\n    shape === 'pill' ? 'kui-content-item--pill' : '',\n    frame === 'framed' ? 'kui-content-item--framed' : '',\n    flush ? 'kui-content-item--flush' : '',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n  const interactiveAttributes = interactive\n    ? {\n        'data-interactive': 'true',\n        'data-action': disabled ? undefined : action,\n        'data-item-id': itemId,\n        'data-selection-mode': selectionMode,\n        'data-selected':\n          selectionMode === 'none' ? undefined : String(selected),\n        'data-disabled': disabled ? 'true' : undefined,\n      }\n    : {};\n  let role: 'option' | 'row' | 'button' | 'region' | undefined = ariaLabel\n    ? 'region'\n    : undefined;\n  if (interactive) role = roleForSelectionMode(selectionMode);\n  else if (gridRow) role = 'row';\n  return (\n    <div\n      {...safeRootAttributes}\n      {...interactiveAttributes}\n      class={cls}\n      title={title}\n      data-component=\"content-item\"\n      data-appearance={appearance}\n      data-outlined={outlined ? 'true' : undefined}\n      data-bubble={bubble}\n      data-grid-row={!interactive && gridRow ? 'true' : undefined}\n      role={role}\n      aria-label={ariaLabel}\n      aria-selected={\n        interactive &&\n        (selectionMode === 'single' || selectionMode === 'multiple')\n          ? String(selected)\n          : undefined\n      }\n      aria-pressed={\n        interactive && selectionMode === 'toggle' ? String(selected) : undefined\n      }\n      aria-disabled={interactive && disabled ? 'true' : undefined}\n      tabindex={\n        interactive\n          ? disabled\n            ? '-1'\n            : '0'\n          : (tabIndex ?? (focusTarget ? '-1' : undefined))\n      }\n      slot={slot}\n    >\n      {(interactive && selectionMode === 'multiple') ||\n      (!interactive && gridRow) ? (\n        <div role=\"gridcell\">{children}</div>\n      ) : (\n        children\n      )}\n    </div>\n  );\n}\n"]}

package/dist/chunk-6CDILXF4.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/surfaces/surface-scaffold/surface-scaffold.tsx"],"names":[],"mappings":"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","file":"chunk-6CDILXF4.js","sourcesContent":["import { X } from 'lucide';\n\nimport type { KerfUiContent } from '../../../shared/content/semantic-content.js';\nimport { filterDataAttributes } from '../../../shared/dom/extension-attributes.js';\nimport type { CssLength } from '../../../shared/styles/css-values.js';\nimport { LucideIcon } from '../../media/lucide-icon/lucide-icon.js';\n\nexport {\n  closeDialog,\n  type DialogCloseSource,\n  type DialogRequestCloseDetail,\n  openDialog,\n} from './internal/dialog-surface-controller.js';\n\nexport type DialogSurfaceSize = 'small' | 'medium' | 'large';\n/**\n * How the dialog is presented: `modal` (default) centered on the screen,\n * `side-sheet` against the inline end, `fullscreen`, or `bottom-sheet`\n * attached to the bottom edge (square bottom corners, safe-area and\n * virtual-keyboard clearance, optionally user-resizable).\n */\nexport type DialogSurfacePresentation =\n  'modal' | 'side-sheet' | 'fullscreen' | 'bottom-sheet';\n/**\n * How a bottom sheet appears or leaves: `slide` (default) moves the panel in\n * from, or out to, the bottom edge; `standard` keeps the dialog's\n * scale-and-fade. Both honor `prefers-reduced-motion`.\n */\nexport type DialogSurfaceSheetMotion = 'slide' | 'standard';\nexport type SurfaceInset = 'none' | 'compact' | 'comfortable';\nexport type DialogSurfaceMaxHeight = CssLength | 'viewport';\n/** A definite modal height: a length or the full viewport, minus both gutters. */\nexport type DialogSurfaceHeight = CssLength | 'viewport';\n/**\n * How the dialog body lays out its children: `flow` (default) scrolls ordinary\n * content in the body; `fill` gives one child the body's whole height and\n * lets it own scrolling (a SplitView, a Pane, an editor); `fill-last` stacks\n * the leading children at their natural height and gives the last child the\n * remaining height to own its scrolling (a heading and notices above a\n * scrolling transcript).\n */\nexport type DialogSurfaceBodyLayout = 'flow' | 'fill' | 'fill-last';\n/**\n * Where the dialog footer sits: `docked` (default) below the body, or\n * `floating` over the body's block end, inset from the panel's inline and\n * block-end edges on a transparent background (a chat composer).\n */\nexport type DialogSurfaceFooterPresentation = 'docked' | 'floating';\n/**\n * Where the dialog header sits: `docked` (default) above the body, or\n * `floating` over the body's block-start edge on the translucent chrome\n * material, so content scrolls visibly beneath the title bar.\n */\nexport type DialogSurfaceHeaderPresentation = 'docked' | 'floating';\n\n/**\n * Application `data-*` identity on the DialogSurface root, such as\n * `data-key`; the surface's own configuration attributes stay protected.\n */\nexport type DialogSurfaceRootAttributes = Readonly<\n  Record<`data-${string}`, string | undefined>\n>;\n\nconst DIALOG_SURFACE_PROTECTED = new Set([\n  'data-component',\n  'data-size',\n  'data-presentation',\n  'data-preferred-width',\n  'data-body-inset',\n  'data-footer-inset',\n  'data-viewport-gutter',\n  'data-max-height',\n  'data-height',\n  'data-body-layout',\n  'data-footer-presentation',\n  'data-header-presentation',\n  'data-min-height',\n  'data-resizable',\n  'data-enter-motion',\n  'data-exit-motion',\n  'data-light-dismiss',\n]);\n\n/**\n * The dialog's accessible name: its `label` text (also the default title), or\n * the id of an element that names it, such as a `heading` ToolbarText.\n */\nexport type DialogSurfaceName =\n  { label: string; labelledBy?: never } | { label?: never; labelledBy: string };\n\nexport type DialogSurfaceProps = DialogSurfaceName & DialogSurfaceOptions;\n\nexport interface DialogSurfaceOptions {\n  /** The dialog's id, for `openDialog(document.getElementById(id))`. */\n  id?: string;\n  /**\n   * Id of the element whose text is the dialog's accessible description,\n   * such as the `heading` ToolbarText's `descriptionId` or app-owned summary\n   * copy in the body; rendered as `aria-describedby` on the `<dialog>`.\n   */\n  describedBy?: string;\n  /**\n   * An alert dialog: a confirmation that interrupts the person to report\n   * something urgent or ask before a destructive action (\"Delete this\n   * topic?\"). Renders `role=\"alertdialog\"` on the `<dialog>`; set\n   * `describedBy` to the element holding the message, and leave\n   * `lightDismiss` off so the person answers it.\n   */\n  alert?: boolean;\n  /** The body content. */\n  children: KerfUiContent;\n  /**\n   * Header title content in place of the `label` text, such as an xl\n   * `ToolbarText` with a description. The dialog keeps its `label` (or\n   * `labelledBy`) name.\n   */\n  heading?: KerfUiContent;\n  /** Controls before the close button in the header. */\n  headerActions?: KerfUiContent;\n  /** The footer, below the body (or floating over it); usually its buttons. */\n  footer?: KerfUiContent;\n  /**\n   * Render no header: no title and no close button. The content then owns its\n   * heading and a way to close (an element with `data-dialog-close`).\n   */\n  withoutHeader?: boolean;\n  /** Close on a press on the backdrop; otherwise the panel pulses. */\n  lightDismiss?: boolean;\n  /** The close button's accessible name (default `Close`). */\n  closeLabel?: string;\n  size?: DialogSurfaceSize;\n  presentation?: DialogSurfacePresentation;\n  /** Modal preferred width. Takes precedence over size, within the viewport cap. */\n  preferredWidth?: CssLength;\n  bodyInset?: SurfaceInset;\n  footerInset?: SurfaceInset;\n  /** Modal edge clearance. Omit to retain Web Awesome's default viewport cap. */\n  viewportGutter?: CssLength;\n  /**\n   * Modal height cap, bounded by the dynamic viewport minus both gutters. On a\n   * bottom sheet, the cap (and the resize ceiling), bounded by the dynamic\n   * viewport minus the top safe area and one gutter.\n   */\n  maxHeight?: DialogSurfaceMaxHeight;\n  /**\n   * Modal definite height, bounded the same way, so a filling child has a\n   * height to fill. Takes precedence over `maxHeight`. On a bottom sheet, the\n   * height it opens at (the visible height above the safe area or keyboard).\n   */\n  height?: DialogSurfaceHeight;\n  /**\n   * A resizable bottom sheet's resize floor (default 160px), the visible\n   * height above the safe area or keyboard.\n   */\n  minHeight?: CssLength;\n  /**\n   * Let the person resize a bottom sheet by its top grabber (drag, or the\n   * arrow, Page Up/Down, Home and End keys) between `minHeight` and the\n   * sheet's cap. Needs the `/register` entry; each opening starts at `height`\n   * (or the content height). Ignored by other presentations.\n   */\n  resizable?: boolean;\n  /** How a bottom sheet appears (default `slide` up from the bottom edge). */\n  enterMotion?: DialogSurfaceSheetMotion;\n  /** How a bottom sheet is dismissed (default `slide` down off the bottom edge). */\n  exitMotion?: DialogSurfaceSheetMotion;\n  /**\n   * Body layout (default `flow`); `fill` lets one child own the body and\n   * `fill-last` stacks fixed rows above one filling last child.\n   */\n  bodyLayout?: DialogSurfaceBodyLayout;\n  /**\n   * Header placement (default `docked`); `floating` lays the dialog's header\n   * (its title and close control) over the body's block-start edge on the\n   * translucent chrome material (`--kui-chrome-material-raised`, opaque under\n   * `prefers-reduced-transparency`, increased contrast, forced colors, or\n   * without `backdrop-filter`). The `/register` entry measures the header;\n   * the body reserves that height before its own inset, so its first content\n   * rests below the title bar. A `fill`/`fill-last` child that is the body's\n   * only child and opts into block-start `scrollClearance` (a `List` or\n   * `Pane`) takes the clearance inside its own scroll area instead, published\n   * as `--kui-scroll-clearance-block-start`, so its content scrolls visibly\n   * beneath the header. Unmeasured (without the register), the header stays\n   * docked. Keep header text in the normal text color: quiet text can fall\n   * below AA over the content passing beneath it.\n   */\n  headerPresentation?: DialogSurfaceHeaderPresentation;\n  /**\n   * Footer placement (default `docked`); `floating` lays the footer over the\n   * body's block end. The body reserves the footer's measured height so its\n   * last content is never hidden beneath it. A `fill`/`fill-last` child that\n   * opts into block-end `scrollClearance` (a `List` or `Pane`) takes that\n   * clearance inside its own scroll area instead, published as\n   * `--kui-scroll-clearance-block-end`, so its content scrolls visibly beneath\n   * the transparent footer.\n   */\n  footerPresentation?: DialogSurfaceFooterPresentation;\n  /**\n   * A floating footer's clearance from the panel's inline and block-end edges\n   * (default the 16px container inset). Choose a phone value such as\n   * `remify(8)` from `deviceClass()`; the scaffold adds no breakpoint.\n   */\n  footerOffset?: CssLength;\n  /**\n   * Safe `data-*` identity on the root. Give sibling dialogs distinct\n   * `data-key`s so a re-render morphs each surface into itself instead of\n   * reusing one dialog's element for another (structurally identical roots\n   * are otherwise matched by position).\n   */\n  rootAttributes?: DialogSurfaceRootAttributes;\n  className?: string;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n}\n\n/**\n * A modal dialog: a native `<dialog>` with Kerf's header, body, and footer\n * chrome, sized and presented by its props. Render it closed, then open it\n * with `openDialog()` and close it with `closeDialog()`, the close button, an\n * element with `data-dialog-close`, Escape, or (with `lightDismiss`) a press\n * on the backdrop. Import `@kerfjs/ui/surface-scaffold/register` for the\n * floating header and footer measurement, the bottom sheet's keyboard\n * clearance and grabber, and re-render resilience while open.\n */\nexport function DialogSurface({\n  id,\n  label,\n  labelledBy,\n  describedBy,\n  alert = false,\n  heading,\n  headerActions,\n  footer,\n  withoutHeader = false,\n  lightDismiss = false,\n  closeLabel = 'Close',\n  children,\n  size = 'medium',\n  presentation = 'modal',\n  preferredWidth,\n  bodyInset = 'compact',\n  footerInset = 'comfortable',\n  viewportGutter,\n  maxHeight,\n  height,\n  minHeight,\n  resizable = false,\n  enterMotion = 'slide',\n  exitMotion = 'slide',\n  bodyLayout = 'flow',\n  headerPresentation = 'docked',\n  footerPresentation = 'docked',\n  footerOffset,\n  rootAttributes = {},\n  className = '',\n  slot,\n}: DialogSurfaceProps) {\n  const style = [\n    preferredWidth === undefined\n      ? ''\n      : `--_kui-dialog-surface-preferred-width:${preferredWidth}`,\n    viewportGutter === undefined\n      ? ''\n      : `--_kui-dialog-surface-gutter:${viewportGutter}`,\n    maxHeight === undefined || maxHeight === 'viewport'\n      ? ''\n      : `--_kui-dialog-surface-max-height:${maxHeight}`,\n    height === undefined || height === 'viewport'\n      ? ''\n      : `--_kui-dialog-surface-height:${height}`,\n    footerOffset === undefined\n      ? ''\n      : `--_kui-dialog-surface-footer-offset:${footerOffset}`,\n    minHeight === undefined\n      ? ''\n      : `--_kui-dialog-surface-min-height:${minHeight}`,\n  ]\n    .filter(Boolean)\n    .join(';');\n  return (\n    <dialog\n      {...filterDataAttributes(rootAttributes, DIALOG_SURFACE_PROTECTED)}\n      id={id}\n      class={`kui-dialog-surface ${className}`.trim()}\n      role={alert ? 'alertdialog' : undefined}\n      aria-label={label}\n      aria-labelledby={labelledBy}\n      aria-describedby={describedBy}\n      tabindex={-1}\n      data-light-dismiss={lightDismiss ? '' : undefined}\n      data-component=\"dialog-surface\"\n      data-size={size}\n      data-presentation={presentation}\n      data-preferred-width={preferredWidth === undefined ? undefined : ''}\n      data-body-inset={bodyInset}\n      data-footer-inset={footerInset}\n      data-viewport-gutter={viewportGutter === undefined ? undefined : ''}\n      data-max-height={maxHeight === undefined ? undefined : ''}\n      data-height={height === undefined ? undefined : ''}\n      data-body-layout={bodyLayout === 'flow' ? undefined : bodyLayout}\n      data-header-presentation={\n        headerPresentation === 'floating' ? 'floating' : undefined\n      }\n      data-footer-presentation={\n        footerPresentation === 'floating' ? 'floating' : undefined\n      }\n      data-min-height={minHeight === undefined ? undefined : ''}\n      data-resizable={resizable ? '' : undefined}\n      data-enter-motion={enterMotion === 'slide' ? undefined : enterMotion}\n      data-exit-motion={exitMotion === 'slide' ? undefined : exitMotion}\n      style={style || undefined}\n      slot={slot}\n    >\n      {withoutHeader ? null : (\n        <header class=\"kui-dialog-surface__header\">\n          {heading === undefined ? (\n            <h2 class=\"kui-dialog-surface__title\">{label}</h2>\n          ) : (\n            <div class=\"kui-dialog-surface__title\">{heading}</div>\n          )}\n          <div class=\"kui-dialog-surface__header-actions\">\n            {headerActions}\n            <button\n              type=\"button\"\n              class=\"kui-dialog-surface__close\"\n              aria-label={closeLabel}\n              data-dialog-close=\"\"\n            >\n              <LucideIcon icon={X} name=\"x\" size=\"l\" />\n            </button>\n          </div>\n        </header>\n      )}\n      {presentation === 'bottom-sheet' && resizable ? (\n        <div\n          class=\"kui-dialog-surface__sheet-handle\"\n          role=\"separator\"\n          aria-orientation=\"horizontal\"\n          aria-label=\"Resize sheet\"\n          tabindex={0}\n        />\n      ) : null}\n      <div class=\"kui-dialog-surface__body\">{children}</div>\n      {footer === undefined ? null : (\n        <footer class=\"kui-dialog-surface__footer\">{footer}</footer>\n      )}\n      {/* Where kerfjs/overlay hosts a popover or tooltip opened inside the\n          modal dialog, so it stays interactive above the inert page. */}\n      <div data-kerf-overlay-host data-morph-skip style=\"display:contents\" />\n    </dialog>\n  );\n}\n\n/** Where a PopoverDialogSurface appears: the top layer, or in flow. */\nexport type PopoverDialogSurfacePresentation = 'overlay' | 'embedded';\n\n/** Application `data-*` metadata on the surface root. */\nexport type PopoverDialogSurfaceDataAttributes = Readonly<\n  Record<`data-${string}`, string>\n>;\n\ntype PopoverDialogSurfaceName =\n  { label: string; labelledBy?: never } | { label?: never; labelledBy: string };\n\nexport type PopoverDialogSurfaceProps = PopoverDialogSurfaceName & {\n  /** The root id: what an opening control's `popovertarget` names. */\n  id?: string;\n  /**\n   * Id of the element whose text is the dialog's accessible description,\n   * such as a title `ToolbarText`'s `descriptionId`; rendered as\n   * `aria-describedby` on the `role=\"dialog\"` root.\n   */\n  describedBy?: string;\n  children: KerfUiContent;\n  /**\n   * `overlay` (default) is a native `popover=\"auto\"` in the top layer:\n   * non-modal, light dismiss (Escape or a press outside), nothing inert.\n   * `embedded` renders the same surface in flow for a catalog or inline use.\n   */\n  presentation?: PopoverDialogSurfacePresentation;\n  /** Preferred width preset: 400px, 560px (default), or 800px. */\n  size?: DialogSurfaceSize;\n  /** Preferred width; takes precedence over `size`, within the viewport cap. */\n  preferredWidth?: CssLength;\n  /** Definite height, bounded by the dynamic viewport minus both gutters. */\n  height?: DialogSurfaceHeight;\n  /** Height cap, bounded the same way, for a surface that sizes to content. */\n  maxHeight?: DialogSurfaceMaxHeight;\n  /** Edge clearance on each side of the viewport (default 16px). */\n  viewportGutter?: CssLength;\n  /**\n   * Body layout (default `flow`); `fill` lets one child own the surface and\n   * `fill-last` stacks fixed rows above one filling last child.\n   */\n  bodyLayout?: DialogSurfaceBodyLayout;\n  rootAttributes?: PopoverDialogSurfaceDataAttributes;\n  className?: string;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n};\n\nconst POPOVER_DIALOG_PROTECTED = new Set([\n  'data-component',\n  'data-presentation',\n  'data-size',\n  'data-height',\n  'data-max-height',\n  'data-body-layout',\n]);\n\n/**\n * A non-modal dialog surface on the native Popover API: Kerf's dialog chrome,\n * viewport-bounded size, and single-child fill without application CSS.\n * Open it with a `popovertarget` control or `showPopover()`; it light\n * dismisses and leaves the page interactive. Use `DialogSurface` when the\n * task must block the page.\n */\nexport function PopoverDialogSurface({\n  id,\n  children,\n  label,\n  labelledBy,\n  describedBy,\n  presentation = 'overlay',\n  size = 'medium',\n  preferredWidth,\n  height,\n  maxHeight,\n  viewportGutter,\n  bodyLayout = 'flow',\n  rootAttributes = {},\n  className = '',\n  slot,\n}: PopoverDialogSurfaceProps) {\n  const style = [\n    preferredWidth === undefined\n      ? ''\n      : `--_kui-popover-dialog-surface-preferred-width:${preferredWidth}`,\n    viewportGutter === undefined\n      ? ''\n      : `--_kui-popover-dialog-surface-gutter:${viewportGutter}`,\n    height === undefined || height === 'viewport'\n      ? ''\n      : `--_kui-popover-dialog-surface-height:${height}`,\n    maxHeight === undefined || maxHeight === 'viewport'\n      ? ''\n      : `--_kui-popover-dialog-surface-max-height:${maxHeight}`,\n  ]\n    .filter(Boolean)\n    .join(';');\n  return (\n    <section\n      {...filterDataAttributes(rootAttributes, POPOVER_DIALOG_PROTECTED)}\n      id={id}\n      class={`kui-popover-dialog-surface ${className}`.trim()}\n      data-component=\"popover-dialog-surface\"\n      data-presentation={presentation}\n      data-size={size}\n      data-height={height === undefined ? undefined : ''}\n      data-max-height={maxHeight === undefined ? undefined : ''}\n      data-body-layout={bodyLayout === 'flow' ? undefined : bodyLayout}\n      popover={presentation === 'overlay' ? 'auto' : undefined}\n      role=\"dialog\"\n      aria-label={label}\n      aria-labelledby={labelledBy}\n      aria-describedby={describedBy}\n      style={style || undefined}\n      slot={slot}\n    >\n      {children}\n    </section>\n  );\n}\n\nexport type PopupSurfaceInset = 'standard' | 'compact' | 'list-zero';\n\nexport interface PopupSurfaceProps {\n  children: KerfUiContent;\n  inset?: PopupSurfaceInset;\n  className?: string;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n}\n\n/** Configure recurring Web Awesome dropdown-menu geometry without consumer ::part() CSS. */\nexport function PopupSurface({\n  children,\n  inset = 'standard',\n  className = '',\n  slot,\n}: PopupSurfaceProps) {\n  return (\n    <span\n      class={`kui-popup-surface ${className}`.trim()}\n      data-component=\"popup-surface\"\n      data-inset={inset}\n      slot={slot}\n    >\n      {children}\n    </span>\n  );\n}\n"]}

package/dist/chunk-ATGAJVZ6.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/surfaces/surface-scaffold/internal/dialog-surface-controller.ts"],"names":[],"mappings":"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","file":"chunk-ATGAJVZ6.js","sourcesContent":["import { syncSheetHandleValues, wireSheetHandle } from './sheet-handle.js';\n\n/** What asked an open DialogSurface to close. */\nexport type DialogCloseSource = 'close-button' | 'escape' | 'backdrop';\n\n/** The detail of a DialogSurface's cancelable `kui-request-close` event. */\nexport interface DialogRequestCloseDetail {\n  readonly source: DialogCloseSource;\n}\n\nconst SURFACE = 'dialog.kui-dialog-surface';\n\n/** The attribute marking a running enter, exit, or pulse animation. */\nexport const DIALOG_MOTION_ATTRIBUTE = 'data-kui-dialog-motion';\n\n/** The panel variable a floating header's body clearance reads. */\nexport const HEADER_BLOCK_SIZE_PROPERTY =\n  '--_kui-dialog-surface-header-block-size';\n\n/** The panel variable a floating footer's body clearance reads. */\nexport const FOOTER_BLOCK_SIZE_PROPERTY =\n  '--_kui-dialog-surface-footer-block-size';\n\n/**\n * The panel variable a floating header's divider reads: set while content\n * is scrolled away beneath the header, unset (no divider) otherwise.\n */\nexport const HEADER_DIVIDER_PROPERTY = '--_kui-dialog-surface-header-divider';\n\n/** The panel variable holding a resized sheet's visible height. */\nexport const SHEET_HEIGHT_PROPERTY = '--_kui-dialog-surface-sheet-height';\n\n/** The panel variable holding the virtual keyboard's overlap. */\nexport const KEYBOARD_INSET_PROPERTY = '--_kui-dialog-surface-keyboard-inset';\n\n/** The value published while the divider shows: the color the CSS owns. */\nconst DIVIDER_SHOWN = 'var(--_kui-dialog-surface-header-divider-color)';\n\n/**\n * Scroll distance, in px, that counts as \"away from the top\": a scroller at\n * rest can report a fractional offset.\n */\nconst SCROLL_THRESHOLD = 1;\n\ntype Motion = 'enter' | 'exit' | 'pulse';\n\ninterface OpenState {\n  /** Panel variables the controller owns while open, restored after a morph. */\n  readonly owned: Map<string, string>;\n  readonly stop: (() => void)[];\n  motionTimer: ReturnType<typeof globalThis.setTimeout> | undefined;\n  closing: boolean;\n}\n\nconst states = new WeakMap<HTMLDialogElement, OpenState>();\nconst installed = new WeakSet<Document>();\n\nconst isSurface = (target: EventTarget | null): target is HTMLDialogElement =>\n  target instanceof Element && target.matches(SURFACE);\n\n/**\n * The layout viewport's bottom band a virtual keyboard covers: what the\n * visual viewport no longer shows below itself. Zero while pinch-zoomed (the\n * visual viewport then shrinks for another reason) and wherever the keyboard\n * resizes the layout viewport instead (`interactive-widget=resizes-content`).\n */\nexport function keyboardInset(\n  viewport: Pick<VisualViewport, 'height' | 'offsetTop' | 'scale'>,\n  layoutHeight: number,\n): number {\n  if (viewport.scale > 1.01) return 0;\n  const inset = Math.round(layoutHeight - viewport.height - viewport.offsetTop);\n  return inset > 0 ? inset : 0;\n}\n\n/** The longest running animation on the panel, in ms (0 when none runs). */\nfunction motionDuration(dialog: HTMLElement): number {\n  const style = globalThis.getComputedStyle(dialog);\n  if (!style.animationName || style.animationName === 'none') return 0;\n  return Math.max(\n    0,\n    ...style.animationDuration.split(',').map((part) => {\n      const value = parseFloat(part);\n      return part.trim().endsWith('ms') ? value : value * 1000;\n    }),\n  );\n}\n\n/**\n * Mark a motion while its keyframes run, then finish it. A timer, not\n * `animationend`, ends it, so an application re-render that drops the marker\n * mid-animation still closes the dialog.\n */\nfunction runMotion(\n  dialog: HTMLDialogElement,\n  motion: Motion,\n  done?: () => void,\n): void {\n  const state = states.get(dialog);\n  if (state) globalThis.clearTimeout(state.motionTimer);\n  dialog.setAttribute(DIALOG_MOTION_ATTRIBUTE, motion);\n  const finish = () => {\n    done?.();\n    if (dialog.getAttribute(DIALOG_MOTION_ATTRIBUTE) === motion)\n      dialog.removeAttribute(DIALOG_MOTION_ATTRIBUTE);\n  };\n  const duration = motionDuration(dialog);\n  if (duration === 0 || !state) finish();\n  else state.motionTimer = globalThis.setTimeout(finish, duration);\n}\n\n/** Set (or, with `null`, clear) a panel variable the controller owns. */\nfunction own(\n  dialog: HTMLDialogElement,\n  property: string,\n  value: string | null,\n): void {\n  const owned = states.get(dialog)?.owned;\n  if (value === null) {\n    owned?.delete(property);\n    dialog.style.removeProperty(property);\n    return;\n  }\n  owned?.set(property, value);\n  if (dialog.style.getPropertyValue(property) !== value)\n    dialog.style.setProperty(property, value);\n}\n\n/** Watch an open dialog: owned state, chrome sizes, divider, and sheet. */\nfunction follow(dialog: HTMLDialogElement, state: OpenState): void {\n  const sheet = dialog.getAttribute('data-presentation') === 'bottom-sheet';\n  // Layout sizes, not boxes: the panel opens scaled while its enter motion\n  // runs. A resize observation reports the exact border box; until the first\n  // one, `offsetHeight` stands in.\n  const blockSizes = new WeakMap<Element, number>();\n  const sizes = new ResizeObserver((entries) => {\n    for (const entry of entries) {\n      const box = entry.borderBoxSize?.[0];\n      if (box) blockSizes.set(entry.target, box.blockSize);\n    }\n    measure();\n  });\n  const blockSize = (element: HTMLElement) =>\n    `${blockSizes.get(element) ?? element.offsetHeight}px`;\n  let header: HTMLElement | null = null;\n  let footer: HTMLElement | null = null;\n  let handle: HTMLElement | null = null;\n  let unwireHandle: (() => void) | undefined;\n  const measure = () => {\n    own(dialog, HEADER_BLOCK_SIZE_PROPERTY, header ? blockSize(header) : null);\n    own(dialog, FOOTER_BLOCK_SIZE_PROPERTY, footer ? blockSize(footer) : null);\n  };\n  // The header, footer, and grabber the template renders; a re-render may\n  // replace them.\n  const track = () => {\n    const nextHeader = dialog.querySelector<HTMLElement>(\n      ':scope > .kui-dialog-surface__header',\n    );\n    const nextFooter = dialog.querySelector<HTMLElement>(\n      ':scope > .kui-dialog-surface__footer',\n    );\n    if (nextHeader !== header || nextFooter !== footer) {\n      sizes.disconnect();\n      header = nextHeader;\n      footer = nextFooter;\n      for (const element of [header, footer])\n        if (element) sizes.observe(element);\n      measure();\n    }\n    const nextHandle = dialog.querySelector<HTMLElement>(\n      ':scope > .kui-dialog-surface__sheet-handle',\n    );\n    if (nextHandle !== handle) {\n      unwireHandle?.();\n      unwireHandle = undefined;\n      handle = nextHandle;\n      if (handle) {\n        unwireHandle = wireSheetHandle(handle, {\n          panel: dialog,\n          host: dialog,\n          property: SHEET_HEIGHT_PROPERTY,\n          enabled: () => true,\n          publish: (value) => own(dialog, SHEET_HEIGHT_PROPERTY, value),\n        });\n        syncSheetHandleValues(handle, dialog);\n      }\n    }\n  };\n  track();\n  // An application re-render morphs the panel back to its rendered\n  // attributes and may replace its chrome: restore the owned variables and\n  // follow the new elements.\n  const restore = new MutationObserver(() => {\n    for (const [property, value] of state.owned)\n      if (dialog.style.getPropertyValue(property) !== value)\n        dialog.style.setProperty(property, value);\n    track();\n  });\n  restore.observe(dialog, {\n    attributes: true,\n    attributeFilter: ['style'],\n    childList: true,\n  });\n  // A floating header's divider shows while a scroller reaching beneath it\n  // is scrolled away from its top. `scroll` does not bubble: capture it.\n  const scrolled = new Set<Element>();\n  const onScroll = (event: Event) => {\n    const scroller = event.target as Element;\n    const floating =\n      dialog.getAttribute('data-header-presentation') === 'floating';\n    if (\n      floating &&\n      header &&\n      scroller.scrollTop > SCROLL_THRESHOLD &&\n      scroller.getBoundingClientRect().top <=\n        header.getBoundingClientRect().bottom\n    )\n      scrolled.add(scroller);\n    else scrolled.delete(scroller);\n    for (const element of scrolled)\n      if (!element.isConnected) scrolled.delete(element);\n    own(\n      dialog,\n      HEADER_DIVIDER_PROPERTY,\n      scrolled.size > 0 ? DIVIDER_SHOWN : null,\n    );\n  };\n  dialog.addEventListener('scroll', onScroll, { capture: true, passive: true });\n  state.stop.push(() => {\n    sizes.disconnect();\n    restore.disconnect();\n    unwireHandle?.();\n    dialog.removeEventListener('scroll', onScroll, { capture: true });\n  });\n  // A bottom sheet keeps its content above a virtual keyboard.\n  const viewport = dialog.ownerDocument.defaultView?.visualViewport;\n  if (sheet && viewport) {\n    const publish = () => {\n      const inset = keyboardInset(viewport, globalThis.innerHeight);\n      own(dialog, KEYBOARD_INSET_PROPERTY, inset > 0 ? `${inset}px` : null);\n    };\n    viewport.addEventListener('resize', publish);\n    viewport.addEventListener('scroll', publish);\n    state.stop.push(() => {\n      viewport.removeEventListener('resize', publish);\n      viewport.removeEventListener('scroll', publish);\n    });\n    publish();\n  }\n}\n\n/** Stop following a closed dialog and drop the state it owned. */\nfunction settle(dialog: HTMLDialogElement): void {\n  const state = states.get(dialog);\n  if (!state) return;\n  states.delete(dialog);\n  globalThis.clearTimeout(state.motionTimer);\n  for (const stop of state.stop) stop();\n  for (const property of state.owned.keys())\n    dialog.style.removeProperty(property);\n  dialog.removeAttribute(DIALOG_MOTION_ATTRIBUTE);\n}\n\n/**\n * Open a DialogSurface as a modal dialog: in the top layer, the rest of the\n * page inert, focus on its `autofocus` element or else the panel. It plays\n * its enter motion and, with the controller installed here, keeps its\n * measured chrome, sheet height, and keyboard clearance across application\n * re-renders. Opening an open dialog does nothing.\n */\nexport function openDialog(dialog: HTMLDialogElement): void {\n  installDialogSurfaces(dialog.ownerDocument);\n  const closing = states.get(dialog);\n  if (closing?.closing) {\n    // The latest request wins: reopening during the exit motion keeps it open.\n    closing.closing = false;\n    runMotion(dialog, 'enter');\n    return;\n  }\n  if (dialog.open) return;\n  dialog.showModal();\n  const state: OpenState = {\n    owned: new Map(),\n    stop: [],\n    motionTimer: undefined,\n    closing: false,\n  };\n  states.set(dialog, state);\n  if (!dialog.querySelector('[autofocus]'))\n    dialog.focus({ preventScroll: true });\n  follow(dialog, state);\n  runMotion(dialog, 'enter');\n}\n\n/**\n * Close an open DialogSurface after its exit motion. The application's own\n * close is never refused: no `kui-request-close` is dispatched. The native\n * `close` event fires once it has closed.\n */\nexport function closeDialog(dialog: HTMLDialogElement): void {\n  const state = states.get(dialog);\n  if (!dialog.open) return;\n  if (!state) {\n    dialog.close();\n    return;\n  }\n  if (state.closing) return;\n  state.closing = true;\n  runMotion(dialog, 'exit', () => dialog.close());\n}\n\n/**\n * A person asked to close the dialog: dispatch the cancelable\n * `kui-request-close`; refused, the panel pulses, otherwise it closes.\n */\nfunction requestClose(\n  dialog: HTMLDialogElement,\n  source: DialogCloseSource,\n): void {\n  const allowed = dialog.dispatchEvent(\n    new CustomEvent<DialogRequestCloseDetail>('kui-request-close', {\n      bubbles: true,\n      cancelable: true,\n      detail: { source },\n    }),\n  );\n  if (allowed) closeDialog(dialog);\n  else runMotion(dialog, 'pulse');\n}\n\nconst outside = (dialog: HTMLElement, event: MouseEvent): boolean => {\n  const box = dialog.getBoundingClientRect();\n  return (\n    event.clientX < box.left ||\n    event.clientX > box.right ||\n    event.clientY < box.top ||\n    event.clientY > box.bottom\n  );\n};\n\n/**\n * Wire every DialogSurface in `doc`: the close button and any element with\n * `data-dialog-close`, Escape, and a press on the backdrop (closing with\n * `lightDismiss`, pulsing without) ask to close through `kui-request-close`;\n * a closed dialog stops being followed. `openDialog` installs this itself;\n * the `surface-scaffold/register` entry installs it for the document.\n * Idempotent per document.\n */\nexport function installDialogSurfaces(doc: Document = document): void {\n  if (installed.has(doc)) return;\n  installed.add(doc);\n  // A backdrop press starts and ends outside the panel; a drag out of the\n  // panel (a text selection) is not one.\n  let pressedOutside: HTMLDialogElement | null = null;\n  doc.addEventListener(\n    'pointerdown',\n    (event) => {\n      pressedOutside =\n        isSurface(event.target) && outside(event.target, event)\n          ? event.target\n          : null;\n    },\n    true,\n  );\n  doc.addEventListener(\n    'click',\n    (event) => {\n      const target = event.target as Element;\n      const dialog = target.closest?.<HTMLDialogElement>(SURFACE);\n      if (!dialog?.open) return;\n      if (target === dialog) {\n        if (pressedOutside !== dialog || !outside(dialog, event)) return;\n        if (dialog.hasAttribute('data-light-dismiss'))\n          requestClose(dialog, 'backdrop');\n        else runMotion(dialog, 'pulse');\n        return;\n      }\n      const closer = target.closest('[data-dialog-close]');\n      if (closer && closer.closest(SURFACE) === dialog) {\n        event.preventDefault();\n        requestClose(dialog, 'close-button');\n      }\n    },\n    true,\n  );\n  // Escape fires `cancel`; the dialog closes through the same request.\n  doc.addEventListener(\n    'cancel',\n    (event) => {\n      if (!isSurface(event.target)) return;\n      event.preventDefault();\n      requestClose(event.target, 'escape');\n    },\n    true,\n  );\n  // However it closed (including an engine closing it past a refused\n  // Escape), stop following it.\n  doc.addEventListener(\n    'close',\n    (event) => {\n      if (isSurface(event.target)) settle(event.target);\n    },\n    true,\n  );\n}\n"]}

package/dist/chunk-HQZG3OFL.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/layout/pane/pane.tsx"],"names":[],"mappings":"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","file":"chunk-HQZG3OFL.js","sourcesContent":["import type { KerfUiContent } from '../../../shared/content/semantic-content.js';\nimport { filterDataAttributes } from '../../../shared/dom/extension-attributes.js';\nimport type { ScrollClearance } from '../../../shared/layout/scroll-clearance.js';\nimport {\n  type ScrollEdge,\n  scrollEdgeAttributes,\n} from '../../../shared/layout/scroll-edge.js';\nimport type { CssColor } from '../../../shared/styles/css-values.js';\nimport { ensureSunkenTexture } from '../../../shared/styles/sunken-texture.js';\nimport {\n  joinStyles,\n  type SurfaceTint,\n  surfaceTintAttributes,\n} from '../../../shared/styles/surface-tint.js';\n\n/**\n * Logical pane sides: where a {@link Pane} can show a separator and where it can\n * compensate for a device safe-area inset.\n */\nexport type PaneSeparatorSide =\n  'block-start' | 'block-end' | 'inline-start' | 'inline-end';\n\n/** Semantic root elements supported by {@link Pane}. */\nexport type PaneElement = 'article' | 'aside' | 'div' | 'main' | 'section';\n\n/** Semantic elements supported by the scrolling content slot. */\nexport type PaneContentElement = 'div' | 'main' | 'nav' | 'section';\n\nconst paneProtectedAttributes = new Set([\n  'data-component',\n  'data-chrome-placement',\n  'data-compact-header',\n  'data-compact-footer',\n  'data-compact-header-open',\n  'data-compact-footer-open',\n  'data-chrome-dividers',\n  'data-appearance',\n  'data-background',\n  'data-kui-tint',\n  'data-kui-tint-accent',\n  'data-deep-inset',\n  'data-outlined',\n  'data-scroll-clearance',\n  'data-header-presentation',\n  'data-header-material',\n  'data-scroll-edge',\n  'data-scroll-edge-distance',\n  'data-header-overlay',\n  'data-separator-block-start',\n  'data-separator-block-end',\n  'data-separator-inline-start',\n  'data-separator-inline-end',\n  'data-safe-area-block-start',\n  'data-safe-area-block-end',\n  'data-safe-area-inline-start',\n  'data-safe-area-inline-end',\n]);\n\nconst allPaneSides: readonly PaneSeparatorSide[] = [\n  'block-start',\n  'block-end',\n  'inline-start',\n  'inline-end',\n];\n\ntype PaneRootAttributes = Readonly<\n  Record<`data-${string}`, string | undefined> & {\n    'data-component'?: never;\n    'data-separator-block-start'?: never;\n    'data-separator-block-end'?: never;\n    'data-separator-inline-start'?: never;\n    'data-separator-inline-end'?: never;\n    'data-safe-area-block-start'?: never;\n    'data-safe-area-block-end'?: never;\n    'data-safe-area-inline-start'?: never;\n    'data-safe-area-inline-end'?: never;\n    'data-chrome-placement'?: never;\n    'data-chrome-dividers'?: never;\n    'data-appearance'?: never;\n    'data-background'?: never;\n    'data-kui-tint'?: never;\n    'data-kui-tint-accent'?: never;\n    'data-deep-inset'?: never;\n    'data-outlined'?: never;\n    'data-scroll-clearance'?: never;\n    'data-header-presentation'?: never;\n    'data-header-material'?: never;\n    'data-scroll-edge'?: never;\n    'data-scroll-edge-distance'?: never;\n    'data-header-overlay'?: never;\n    'data-compact-header'?: never;\n    'data-compact-footer'?: never;\n    'data-compact-header-open'?: never;\n    'data-compact-footer-open'?: never;\n  }\n>;\n\n/** How a Pane's header and footer relate to its scrolling content. */\nexport type PaneChromePlacement = 'fixed' | 'auto';\n\n/**\n * How a header or footer behaves when the pane's container presents\n * compactly (a `NavStack` view, a `TabNavigator` scene, a full-screen dialog,\n * or a compact `Workbench`): `fixed` stays docked and shrinks the content\n * area; `scroll` sits inline with the content (a footer settles at the end\n * and scrolls past when the content is longer); `overlay` lies over the\n * content on the chrome material, shown only while the app opens it.\n */\nexport type PaneCompactChrome = 'fixed' | 'scroll' | 'overlay';\n\n/** The compact chrome policy for a Pane's header and footer. */\nexport interface PaneCompactChromePolicy {\n  header?: PaneCompactChrome;\n  footer?: PaneCompactChrome;\n}\n\n/**\n * When a Pane draws the divider between its pinned header or footer and its\n * scrolling content: `scroll` while content is scrolled away beneath that\n * chrome, as `wireScrollDividers` reports; `always`; or `none`.\n */\nexport type PaneChromeDividers = 'scroll' | 'always' | 'none';\n\n/**\n * How a Pane's header relates to its scrolling content: `docked` in its own\n * row above the content, or `overlay` laid over the content's top edge on the\n * translucent chrome material, so content scrolls visibly beneath it.\n * `clear` lays it over\n * the same edge fully transparent, for chrome over imagery: legibility comes\n * from glass control groups or a scrim, and with `scrollEdge=\"material\"` the\n * chrome material fades in once content scrolls beneath it.\n */\nexport type PaneHeaderPresentation = 'docked' | 'overlay' | 'clear';\n\n/** Background treatment of the Pane's scrolling work surface. */\nexport type PaneAppearance = 'default' | 'sunken';\n\nexport interface PaneProps {\n  /** Optional fixed chrome above the scrolling content, arranged vertically. */\n  header?: KerfUiContent;\n  /** The pane's primary vertical, scrolling content stack. */\n  children?: KerfUiContent;\n  /** Optional fixed chrome below the scrolling content. */\n  footer?: KerfUiContent;\n  /**\n   * Whether the header and footer stay pinned around the scrolling content.\n   * `fixed` (default) always pins them. `auto` pins them while the pane is\n   * tall enough, and below 480px of height (30rem, so it scales with the text\n   * size) lets the whole pane scroll as one column, so tall chrome can never\n   * squeeze the content to nothing.\n   */\n  chromePlacement?: PaneChromePlacement;\n  /**\n   * The divider under the header and over the footer, where they meet the\n   * scrolling content. Omitted defaults to `scroll` for a plain pane and\n   * `always` for `appearance=\"sunken\"`. `scroll` shows the header's divider only\n   * while the content is scrolled down, and the footer's only while more\n   * content lies below — never when the content fits — once\n   * `wireScrollDividers` (`@kerfjs/ui/wire-scroll-dividers`) is wired above\n   * the pane; unwired, neither shows. `always` shows both; `none` neither.\n   * The line is drawn inside the chrome, so no state moves the content.\n   */\n  chromeDividers?: PaneChromeDividers;\n  /**\n   * `docked` (default) gives the header its own row above the scrolling\n   * content. `overlay` lays the header over the content's top edge on the\n   * translucent chrome material (`--kui-chrome-material`, opaque under\n   * `prefers-reduced-transparency`, forced colors, or without\n   * `backdrop-filter`), so content scrolls visibly beneath it. Once\n   * `wireScrollDividers` (`@kerfjs/ui/wire-scroll-dividers`) is wired above\n   * the pane it measures the header and publishes its height as the\n   * `--kui-scroll-clearance-block-start` context, which the content adds to\n   * its block-start padding and `scroll-padding` without any\n   * `scrollClearance` prop, so the first item, and anything focused or\n   * scrolled into view, rests clear of the header. Until then, and with\n   * `chromePlacement=\"auto\"`, the header stays docked. Keep overlay header\n   * text in the normal text color: quiet text can fall below AA over the\n   * content passing beneath it.\n   */\n  /**\n   * What the header and footer do when the pane's container presents\n   * compactly (default `fixed`); roomy containers ignore it. The container\n   * interprets it, so set it on panes inside a `NavStack`, `TabNavigator`,\n   * full-screen dialog, or `Workbench`.\n   */\n  compactChrome?: PaneCompactChromePolicy;\n  /**\n   * Which `overlay` compact chrome is showing. The app owns it and flips it\n   * from a control the person can reach while the chrome is hidden.\n   */\n  compactChromeOpen?: { header?: boolean; footer?: boolean };\n  headerPresentation?: PaneHeaderPresentation;\n  /**\n   * With `headerPresentation=\"clear\"`, `material` fades the chrome material\n   * in behind the header once content scrolls beneath it (default `none`).\n   */\n  scrollEdge?: ScrollEdge;\n  /**\n   * The scroll distance, in CSS pixels, over which the scroll edge fades in\n   * (default 60).\n   */\n  scrollEdgeDistance?: number;\n  /** Paint the scrolling work surface with the shared lowered-surface color. */\n  appearance?: PaneAppearance;\n  /**\n   * Paint the whole pane, header and footer included, in an app-chosen color\n   * (`uiColor('surface-raised')`, `fillColor('#1f2a44')`, or `colorVar(…)`\n   * from `@kerfjs/ui/css-values`). It replaces the appearance's fill: a sunken\n   * pane drops its lowered color and grain. Omitted, the pane keeps its\n   * default (transparent, or the sunken surface). Forced colors paint\n   * `Canvas`. Keep text at AA over the color; a dark color needs a matching\n   * tint or dark tones for its content.\n   */\n  background?: CssColor;\n  /**\n   * A scoped tint: `{ color, scheme }`, the app's color and the scheme it\n   * belongs to. The pane paints the tinted surface (unless `background` is\n   * set) and its whole subtree, chrome material and quiet fills included,\n   * re-derives its surface and text tokens from the color with lightness\n   * clamped to keep text at WCAG AA. Without relative color syntax, or under\n   * `prefers-contrast: more`, the scope keeps the plain palette in the\n   * declared scheme.\n   */\n  tint?: SurfaceTint;\n  /**\n   * Clear chrome that lies over the scrolling content's block-start and/or\n   * block-end edge, such as a `DialogSurface` floating footer over a filling\n   * Pane. The content scroller adds the inherited\n   * `--kui-scroll-clearance-block-*` context that chrome publishes to its block\n   * padding and `scroll-padding`, so content scrolls visibly beneath the chrome\n   * while its first and last items (and anything focused or scrolled into\n   * view) can still rest clear of it. Defaults to none.\n   */\n  scrollClearance?: ScrollClearance;\n  /** Add 8px to every side of scrolling content (default: false). */\n  deepInset?: boolean;\n  /** Opt into keyboard (`0`) or programmatic (`-1`) focus on the Pane root. */\n  tabIndex?: 0 | -1;\n  /** Keep the standard focus outline visible, such as for a drop target. */\n  outlined?: boolean;\n  /** Root semantics. Defaults to `div`. */\n  element?: PaneElement;\n  /** Scrolling content semantics. Defaults to `div`. */\n  contentElement?: PaneContentElement;\n  /** Independent logical-edge separator lines. Defaults to none. */\n  separators?: readonly PaneSeparatorSide[];\n  /**\n   * Sides on which the pane may compensate for a device safe-area inset.\n   * Defaults to every side: the pane pads its slots for each side that still\n   * reaches an unsafe screen edge, as its surrounding layout reports, while its\n   * background and separators paint through. List only the sides an app-owned\n   * layout places at a screen edge, or pass `[]` to opt out.\n   */\n  safeAreaEdges?: readonly PaneSeparatorSide[];\n  id?: string;\n  /** Accessible name for a landmark root such as `aside` or `main`. */\n  label?: string;\n  /** Accessible name for a landmark scrolling slot such as `nav`. */\n  contentLabel?: string;\n  className?: string;\n  headerClassName?: string;\n  contentClassName?: string;\n  footerClassName?: string;\n  /** Safe `data-*` metadata; Pane-owned structural attributes remain protected. */\n  rootAttributes?: PaneRootAttributes;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n}\n\n/**\n * A pane's configuration, apart from its content and styling hooks: the props a\n * composite that renders a `Pane` for the app (a Workbench panel or work area,\n * or a CollapsiblePanel) forwards, so the app configures that pane instead of\n * styling it. An omitted or `undefined` field keeps the composite's default.\n */\nexport type PaneConfig = Pick<\n  PaneProps,\n  | 'contentElement'\n  | 'contentLabel'\n  | 'separators'\n  | 'safeAreaEdges'\n  | 'chromeDividers'\n  | 'compactChrome'\n  | 'compactChromeOpen'\n  | 'headerPresentation'\n  | 'scrollEdge'\n  | 'scrollEdgeDistance'\n  | 'appearance'\n  | 'background'\n  | 'tint'\n  | 'deepInset'\n  | 'scrollClearance'\n  | 'tabIndex'\n  | 'outlined'\n>;\n\nfunction paneContent(\n  element: PaneContentElement,\n  children: KerfUiContent,\n  className: string,\n  label: string | undefined,\n) {\n  const attributes = {\n    class: `kui-pane__content kui-content ${className}`.trim(),\n    'aria-label': label,\n  };\n  if (element === 'main') return <main {...attributes}>{children}</main>;\n  if (element === 'nav') return <nav {...attributes}>{children}</nav>;\n  if (element === 'section')\n    return <section {...attributes}>{children}</section>;\n  return <div {...attributes}>{children}</div>;\n}\n\n/**\n * An unpadded application column with optional fixed header/footer slots and one\n * scrolling vertical content owner. Separator lines are independently opt-in on\n * each logical edge, so the same component works as a sidebar, main area,\n * inspector, or dialog column.\n */\nexport function Pane({\n  header,\n  children,\n  footer,\n  chromePlacement = 'fixed',\n  chromeDividers,\n  compactChrome = {},\n  compactChromeOpen = {},\n  headerPresentation = 'docked',\n  scrollEdge = 'none',\n  scrollEdgeDistance,\n  appearance = 'default',\n  background,\n  tint,\n  deepInset = false,\n  scrollClearance,\n  tabIndex,\n  outlined = false,\n  element = 'div',\n  contentElement = 'div',\n  separators = [],\n  safeAreaEdges = allPaneSides,\n  id,\n  label,\n  contentLabel,\n  className = '',\n  headerClassName = '',\n  contentClassName = '',\n  footerClassName = '',\n  rootAttributes = {},\n  slot,\n}: PaneProps) {\n  const safeRootAttributes = filterDataAttributes(\n    rootAttributes,\n    paneProtectedAttributes,\n  );\n  const content = paneContent(\n    contentElement,\n    children,\n    contentClassName,\n    contentLabel,\n  );\n  const resolvedChromeDividers =\n    chromeDividers ?? (appearance === 'sunken' ? 'always' : 'scroll');\n  if (appearance === 'sunken' && background === undefined)\n    ensureSunkenTexture();\n  const tinted = surfaceTintAttributes(tint);\n  const clearHeader = headerPresentation === 'clear' && header !== undefined;\n  const body = (\n    <>\n      {header === undefined ? null : (\n        <header\n          class={`kui-pane__header kui-pane__toolbar ${headerClassName}`.trim()}\n        >\n          {header}\n        </header>\n      )}\n      {content}\n      {footer === undefined ? null : (\n        <footer class={`kui-pane__footer ${footerClassName}`.trim()}>\n          {footer}\n        </footer>\n      )}\n    </>\n  );\n  const attributes = {\n    ...safeRootAttributes,\n    class: `kui-pane ${tinted.className} ${className}`\n      .replace(/\\s+/g, ' ')\n      .trim(),\n    id,\n    'data-component': 'pane',\n    'data-appearance': appearance === 'sunken' ? 'sunken' : undefined,\n    'data-background': background === undefined ? undefined : '',\n    'data-kui-tint': tinted['data-kui-tint'],\n    'data-kui-tint-accent': tinted['data-kui-tint-accent'],\n    style: joinStyles(\n      background === undefined\n        ? undefined\n        : `--_kui-pane-background:${background}`,\n      tinted.style,\n    ),\n    'data-deep-inset': deepInset ? 'true' : undefined,\n    'data-outlined': outlined ? 'true' : undefined,\n    'data-scroll-clearance': scrollClearance,\n    'data-header-presentation':\n      headerPresentation !== 'docked' && header !== undefined\n        ? 'overlay'\n        : undefined,\n    'data-header-material': clearHeader ? 'clear' : undefined,\n    ...scrollEdgeAttributes(scrollEdge, scrollEdgeDistance, clearHeader),\n    'data-chrome-placement': chromePlacement === 'auto' ? 'auto' : undefined,\n    'data-compact-header':\n      header !== undefined && compactChrome.header !== 'fixed'\n        ? compactChrome.header\n        : undefined,\n    'data-compact-footer':\n      footer !== undefined && compactChrome.footer !== 'fixed'\n        ? compactChrome.footer\n        : undefined,\n    'data-compact-header-open':\n      compactChrome.header === 'overlay' && compactChromeOpen.header\n        ? ''\n        : undefined,\n    'data-compact-footer-open':\n      compactChrome.footer === 'overlay' && compactChromeOpen.footer\n        ? ''\n        : undefined,\n    'data-chrome-dividers':\n      resolvedChromeDividers === 'always' || resolvedChromeDividers === 'none'\n        ? resolvedChromeDividers\n        : undefined,\n    'data-separator-block-start': String(separators.includes('block-start')),\n    'data-separator-block-end': String(separators.includes('block-end')),\n    'data-separator-inline-start': String(separators.includes('inline-start')),\n    'data-separator-inline-end': String(separators.includes('inline-end')),\n    'data-safe-area-block-start': String(safeAreaEdges.includes('block-start')),\n    'data-safe-area-block-end': String(safeAreaEdges.includes('block-end')),\n    'data-safe-area-inline-start': String(\n      safeAreaEdges.includes('inline-start'),\n    ),\n    'data-safe-area-inline-end': String(safeAreaEdges.includes('inline-end')),\n    'aria-label': label,\n    tabindex: tabIndex,\n    slot,\n  };\n\n  if (element === 'article') return <article {...attributes}>{body}</article>;\n  if (element === 'aside') return <aside {...attributes}>{body}</aside>;\n  if (element === 'main') return <main {...attributes}>{body}</main>;\n  if (element === 'section') return <section {...attributes}>{body}</section>;\n  return <div {...attributes}>{body}</div>;\n}\n\nexport type { ScrollClearance } from '../../../shared/layout/scroll-clearance.js';\nexport type { ScrollEdge } from '../../../shared/layout/scroll-edge.js';\nexport type {\n  SurfaceTint,\n  SurfaceTintScheme,\n} from '../../../shared/styles/surface-tint.js';\n"]}