@kerfjs/ui 5.0.0-beta.100 → 5.0.0-beta.101

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kerfjs/ui",
-  "version": "5.0.0-beta.100",
+  "version": "5.0.0-beta.101",
   "description": "Accessible, composable UI primitives for kerf applications.",
   "type": "module",
   "license": "MIT",
@@ -224,6 +224,10 @@
       "types": "./dist/wire-scroll-dividers.d.ts",
       "import": "./dist/wire-scroll-dividers.js"
     },
+    "./wire-overlay-sheets": {
+      "types": "./dist/wire-overlay-sheets.d.ts",
+      "import": "./dist/wire-overlay-sheets.js"
+    },
     "./wire-list-reorder": {
       "types": "./dist/wire-list-reorder.d.ts",
       "import": "./dist/wire-list-reorder.js"
@@ -412,6 +416,11 @@
       "types": "./dist/wire-file-pickers.d.ts",
       "import": "./dist/wire-file-pickers.js"
     },
+    "./backdrop-image": {
+      "types": "./dist/backdrop-image.d.ts",
+      "browser": "./dist/browser/backdrop-image.js",
+      "import": "./dist/backdrop-image.js"
+    },
     "./content-swap": {
       "types": "./dist/content-swap.d.ts",
       "browser": "./dist/browser/content-swap.js",
@@ -452,6 +461,7 @@
     },
     "./foundation.css": "./dist/styles/foundation.css",
     "./document.css": "./dist/styles/document.css",
+    "./overlay-sheet.css": "./dist/styles/overlay-sheet.css",
     "./layout.css": "./dist/styles/layout.css",
     "./webawesome.css": "./dist/styles/webawesome.css",
     "./styles.css": "./dist/styles/styles.css",
@@ -499,6 +509,7 @@
     "./corner-status.css": "./dist/styles/corner-status.css",
     "./column-track.css": "./dist/styles/column-track.css",
     "./content-swap.css": "./dist/styles/content-swap.css",
+    "./backdrop-image.css": "./dist/styles/backdrop-image.css",
     "./file-picker.css": "./dist/styles/file-picker.css",
     "./combobox.css": "./dist/styles/combobox.css",
     "./edge-activity-indicator.css": "./dist/styles/edge-activity-indicator.css",
@@ -534,6 +545,7 @@
   "scripts": {
     "build": "tsup && node ../scripts/clean-dist-output.mjs dist && node scripts/build-css.mjs && node scripts/build-browser-entries.mjs",
     "dev": "npm run build && vite --config ux-demo/vite.config.ts",
+    "dev:lan": "npm run build && node scripts/dev-lan.mjs",
     "demo:bundle": "npm run build && vite build --config ux-demo/vite.config.ts",
     "demo:build": "npm run demo:bundle && node scripts/check-demo-bundle.mjs",
     "demo:serve": "vite preview --config ux-demo/vite.config.ts",

package/ux-demo/recipes/loaders.ts

@@ -11,6 +11,7 @@ export const recipeIds = [
   'recipe-navigation-stack',
   'recipe-loading-inspector',
   'recipe-collapsible-sidebar',
+  'recipe-media-detail',
 ] as const;
 
 export type RecipeId = (typeof recipeIds)[number];
@@ -32,6 +33,7 @@ export const recipeLoaders: Record<
   'recipe-navigation-stack': () => import('./navigation-stack.js'),
   'recipe-loading-inspector': () => import('./loading-inspector.js'),
   'recipe-collapsible-sidebar': () => import('./collapsible-sidebar.js'),
+  'recipe-media-detail': () => import('./media-detail.js'),
 };
 
 export function isRecipeId(value: string): value is RecipeId {

package/ux-demo/recipes/media-detail.tsx

@@ -0,0 +1,272 @@
+import '@kerfjs/ui/layout.css';
+import '@kerfjs/ui/nav-stack.css';
+import '@kerfjs/ui/pane.css';
+import '@kerfjs/ui/backdrop-image.css';
+import '@kerfjs/ui/toolbar.css';
+import '@kerfjs/ui/toolbar-text.css';
+import '@kerfjs/ui/toolbar-control-group.css';
+
+import { BackdropImage } from '@kerfjs/ui/backdrop-image';
+import { fillColor, uiColor } from '@kerfjs/ui/css-values';
+import { List } from '@kerfjs/ui/list';
+import { ListHeader } from '@kerfjs/ui/list-header';
+import { ListItem } from '@kerfjs/ui/list-item';
+import { LucideIcon } from '@kerfjs/ui/lucide-icon';
+import { NavStack, type NavStackView } from '@kerfjs/ui/nav-stack';
+import { Text } from '@kerfjs/ui/text';
+import { Toolbar } from '@kerfjs/ui/toolbar';
+import { ToolbarControlGroup } from '@kerfjs/ui/toolbar-control-group';
+import { ToolbarText } from '@kerfjs/ui/toolbar-text';
+import { wireScrollDividers } from '@kerfjs/ui/wire-scroll-dividers';
+import { signal } from 'kerfjs';
+import { ChevronRight, Disc3, Ellipsis, Play, Share, Shuffle } from 'lucide';
+
+import type { RecipeFactory, RecipePresentation } from './types.js';
+
+export const presentation: RecipePresentation = {
+  viewport: {
+    layout: 'grid',
+    width: 'compact',
+    height: 'tall',
+    frame: 'solid',
+    surface: 'default',
+    overflow: 'hidden',
+    shadow: true,
+  },
+  note: "An Apple-Music-style detail page composed only from components: a NavStack with clear chrome and the scroll-edge material, a scoped tint from the artwork's bottom color, an underChrome BackdropImage with parallax and progressive blur that fades into the tinted surface, and glass control groups. The app owns the artwork, its two colors (the tint and its scheme), the stack, playback, and data.",
+};
+
+interface Album {
+  id: string;
+  title: string;
+  artist: string;
+  /** The artwork's bottom color, which the app already knows. */
+  tint: string;
+  tracks: readonly (readonly [title: string, length: string])[];
+}
+
+const ALBUMS: readonly Album[] = [
+  {
+    id: 'night-harbor',
+    title: 'Night Harbor',
+    artist: 'The Lanterns',
+    tint: '#2a1a3d',
+    tracks: [
+      ['Low Tide', '3:42'],
+      ['Harbor Lights', '4:05'],
+      ['Northbound', '3:18'],
+      ['Glass Coast', '5:01'],
+      ['Undertow', '3:56'],
+      ['Night Ferry', '4:27'],
+      ['Salt Air', '2:59'],
+      ['Last Call', '4:12'],
+      ['Lantern', '3:33'],
+      ['Morning Swell', '4:48'],
+    ],
+  },
+];
+
+// Generated artwork, so the recipe needs no network or binary assets: a dusk
+// sky over three ridge lines whose depth makes the parallax legible.
+const ARTWORK = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1600 1200" preserveAspectRatio="xMidYMid slice">
+<defs><linearGradient id="s" x1="0" y1="0" x2="0" y2="1"><stop offset="0" stop-color="#1b2a5c"/><stop offset=".5" stop-color="#c2577a"/><stop offset="1" stop-color="#f4b36b"/></linearGradient>
+<radialGradient id="g" cx=".5" cy=".5" r=".5"><stop offset="0" stop-color="#fff3c4"/><stop offset="1" stop-color="#fff3c4" stop-opacity="0"/></radialGradient></defs>
+<rect width="1600" height="1200" fill="url(#s)"/>
+<circle cx="1080" cy="560" r="240" fill="url(#g)"/><circle cx="1080" cy="560" r="96" fill="#ffe9b0"/>
+<path d="M0 680 L180 540 L330 640 L520 470 L700 620 L880 510 L1060 660 L1260 490 L1440 620 L1600 530 V1200 H0Z" fill="#7a3f6e"/>
+<path d="M0 820 L220 700 L400 790 L600 660 L820 810 L1000 720 L1200 830 L1400 720 L1600 810 V1200 H0Z" fill="#4b2a5a"/>
+<path d="M0 960 L260 850 L480 940 L720 840 L940 960 L1180 880 L1400 970 L1600 900 V1200 H0Z" fill="#2a1a3d"/>
+</svg>`;
+
+// A blob URL rather than a data URL: older kerf releases this package still
+// supports screen `data:image/svg+xml` out of every URL attribute; current kerf
+// allows it in `<img src>`. Created once and
+// reused, so re-renders do not leak blob URLs.
+let artworkUrl: string | undefined;
+const artwork = () =>
+  (artworkUrl ??= URL.createObjectURL(
+    new Blob([ARTWORK], { type: 'image/svg+xml' }),
+  ));
+
+const command = (name: string, label: string, icon: SafeIcon) => (
+  <button
+    type="button"
+    aria-label={label}
+    data-action="recipe-action"
+    data-recipe-command={name}
+  >
+    {icon}
+  </button>
+);
+
+type SafeIcon = ReturnType<typeof LucideIcon>;
+
+export const createRecipe: RecipeFactory = (announce) => {
+  const libraryView = (): NavStackView => ({
+    key: 'library',
+    toolbar: { title: 'Library' },
+    content: (
+      <List>
+        <section>
+          <ListHeader label="Albums" />
+          {ALBUMS.map((album) => (
+            <ListItem
+              action="recipe-action"
+              itemId={album.id}
+              label={album.title}
+              description={album.artist}
+              icon={<LucideIcon icon={Disc3} name="disc-3" />}
+              trailing={<LucideIcon icon={ChevronRight} name="chevron-right" />}
+            />
+          ))}
+        </section>
+      </List>
+    ),
+  });
+
+  const albumView = (album: Album): NavStackView => ({
+    key: album.id,
+    toolbar: {
+      title: '',
+      trailing: (
+        <ToolbarControlGroup
+          label="Album Actions"
+          content="icon"
+          material="glass"
+        >
+          {command('share', 'Share', <LucideIcon icon={Share} name="share" />)}
+          {command(
+            'more',
+            'More',
+            <LucideIcon icon={Ellipsis} name="ellipsis" />,
+          )}
+        </ToolbarControlGroup>
+      ),
+    },
+    pane: { safeAreaEdges: [] },
+    content: (
+      <BackdropImage
+        src={artwork()}
+        alt={`${album.title} artwork: ridges at dusk under a low sun`}
+        position="bottom"
+        parallax="subtle"
+        blur={{ dim: 0.2 }}
+        fadeTo={uiColor('surface')}
+        underChrome
+        overlay={
+          <Toolbar
+            label={album.title}
+            leading={
+              <ToolbarText
+                text={album.title}
+                description={album.artist}
+                size="xlarge"
+                headingLevel={2}
+              />
+            }
+            trailing={
+              <ToolbarControlGroup
+                label="Playback"
+                content="mixed"
+                material="glass"
+              >
+                {command(
+                  'play',
+                  'Play',
+                  <>
+                    <LucideIcon icon={Play} name="play" />
+                    <span>Play</span>
+                  </>,
+                )}
+                {command(
+                  'shuffle',
+                  'Shuffle',
+                  <LucideIcon icon={Shuffle} name="shuffle" />,
+                )}
+              </ToolbarControlGroup>
+            }
+          />
+        }
+      >
+        <List>
+          <section>
+            <ListHeader
+              label="Songs"
+              count={album.tracks.length}
+              countLabel={`${String(album.tracks.length)} songs`}
+            />
+            {album.tracks.map(([title, length], index) => (
+              <ListItem
+                action="recipe-action"
+                itemId={`${album.id}-track-${String(index + 1)}`}
+                label={title}
+                trailing={
+                  <Text variant="span" tone="quiet">
+                    {length}
+                  </Text>
+                }
+              />
+            ))}
+          </section>
+        </List>
+      </BackdropImage>
+    ),
+  });
+
+  const views = signal<NavStackView[]>([libraryView(), albumView(ALBUMS[0]!)]);
+  const current = () =>
+    ALBUMS.find((album) => album.id === views.value.at(-1)?.key);
+
+  const render = () => {
+    const album = current();
+    return (
+      <section data-recipe="recipe-media-detail" aria-label="Music">
+        <NavStack
+          id="recipe-media"
+          label="Music"
+          views={views.value}
+          chromePresentation="clear"
+          scrollEdge="material"
+          tint={
+            album === undefined
+              ? undefined
+              : { color: fillColor(album.tint), scheme: 'dark' }
+          }
+        />
+      </section>
+    );
+  };
+
+  return {
+    render,
+    action(name, element) {
+      if (name === 'nav-back') {
+        if (views.value.length > 1) {
+          views.value = views.value.slice(0, -1);
+          announce('Navigated back');
+        }
+        return;
+      }
+      const album = ALBUMS.find(
+        (candidate) => candidate.id === element.dataset.itemId,
+      );
+      if (album) {
+        views.value = [...views.value, albumView(album)];
+        announce(`Opened ${album.title}`);
+        return;
+      }
+      if (element.dataset.itemId) {
+        announce(
+          `Playing ${element.querySelector('.kui-list-item__primary-label')?.textContent ?? 'song'}`,
+        );
+        return;
+      }
+      announce(`${name} requested`);
+    },
+    wire(root) {
+      // The clear chrome's scroll-edge material and the view Pane's chrome
+      // clearance follow the scroll state this reports.
+      return wireScrollDividers(root);
+    },
+  };
+};

package/dist/chunk-CMETHPKR.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/navigation/nav-stack/nav-stack.tsx"],"names":[],"mappings":"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","file":"chunk-CMETHPKR.js","sourcesContent":["import { ChevronLeft } from 'lucide';\n\nimport type { KerfUiContent } from '../../../shared/content/semantic-content.js';\nimport type { NavPane } from '../../../shared/panels/nav-pane.js';\nimport type { PanelBottomToolbar } from '../../../shared/panels/panel-toolbar.js';\nimport { Toolbar, type ToolbarConfig } from '../../actions/toolbar/toolbar.js';\nimport { ToolbarControlGroup } from '../../actions/toolbar-control-group/toolbar-control-group.js';\nimport {\n  type HeadingLevel,\n  ToolbarText,\n  type ToolbarTextSize,\n} from '../../actions/toolbar-text/toolbar-text.js';\nimport { List, type ListConfig } from '../../collections/list/list.js';\nimport { paneConfigProps } from '../../layout/pane/internal/pane-config-props.js';\nimport { Pane } from '../../layout/pane/pane.js';\nimport { LucideIcon } from '../../media/lucide-icon/lucide-icon.js';\n\n/**\n * One entry in a {@link NavStack}. The app owns the stack as an array (usually a\n * signal); `NavStack` renders it and `wireNavStack` animates the transitions.\n */\nexport interface NavStackView extends NavPane<\n  NavStackViewToolbar,\n  PanelBottomToolbar\n> {\n  /** Stable identity for keyed reconcile and transition direction. */\n  key: string;\n}\n\n/** Per-view top toolbar. The stack supplies its back control before `leading`. */\nexport interface NavStackViewToolbar extends NavStackToolbarConfig {\n  title?: string;\n  leading?: KerfUiContent;\n  center?: KerfUiContent;\n  trailing?: KerfUiContent;\n}\n\n/** A view's structured bottom toolbar; it cross-fades on navigation. */\nexport type NavStackViewBottomToolbar = PanelBottomToolbar;\n\n/**\n * The top toolbar's configuration. Its `ToolbarConfig` forwards to the real\n * `Toolbar` the stack renders; by default that toolbar draws no divider and\n * claims the top and side safe-area edges the stack still touches.\n */\nexport interface NavStackToolbarConfig extends ToolbarConfig {\n  /** Accessible name of the top toolbar (default: none). */\n  label?: string;\n  /**\n   * Size of the view title's `ToolbarText`. Default `xlarge` at the root,\n   * where the title is the page heading, and `large` once a back control\n   * shares the bar.\n   */\n  titleSize?: ToolbarTextSize;\n  /** Expose the view title as a heading at this level (default: a plain span). */\n  headingLevel?: HeadingLevel;\n}\n\n/**\n * How a {@link NavStack}'s top chrome relates to the active view: `docked`\n * above it, or `overlay` laid over its top edge on the translucent chrome\n * material, so the view's content scrolls visibly beneath it.\n */\nexport type NavStackChromePresentation = 'docked' | 'overlay';\n\n/**\n * How a {@link NavStack}'s bottom toolbar relates to the active view:\n * `docked` below it, or `overlay` laid over its bottom edge on the\n * translucent chrome material, so the view's content scrolls visibly beneath\n * it.\n */\nexport type NavStackBottomToolbarPresentation = 'docked' | 'overlay';\n\nexport interface NavStackProps {\n  id: string;\n  /** Accessible name for the stack region. */\n  label: string;\n  /** The stack, root first; the last entry is the active top view. */\n  views: NavStackView[];\n  /** Accessible label for the icon-only back control (default \"Back\"). */\n  backLabel?: string;\n  /** The back control's icon (default a chevron-left `LucideIcon`). */\n  backIcon?: KerfUiContent;\n  /**\n   * Visible text beside the back icon, such as the previous view's title\n   * (default: icon only). When set, the text names the control and\n   * `backLabel` is not used.\n   */\n  backText?: string;\n  /** The top toolbar's configuration, forwarded to its `Toolbar`. */\n  toolbarConfig?: NavStackToolbarConfig;\n  /** Persistent last group in every view's top toolbar, supplied by a hosting panel. */\n  panelToggle?: KerfUiContent;\n  /** Hide the top toolbar entirely (rare — a fully custom-chrome view). */\n  hideToolbar?: boolean;\n  /** Optional persistent bottom toolbar used when the active view does not provide one. */\n  bottomToolbar?: NavStackViewBottomToolbar;\n  /**\n   * Stack chrome separator. `auto` (default) draws both available edges\n   * against a sunken active Pane and otherwise follows `chromeDividers`;\n   * `hidden` suppresses the stack-owned edges.\n   */\n  separator?: 'auto' | 'hidden';\n  /**\n   * The line under the top chrome and over the bottom toolbar, where they\n   * meet the active view. `scroll` (default) shows the chrome's line only\n   * while the view's content is scrolled beneath it, and the bottom\n   * toolbar's only while more content lies below — never when the content\n   * fits — once `wireScrollDividers` (`@kerfjs/ui/wire-scroll-dividers`) is\n   * wired above the stack; unwired, neither shows. `always` shows both\n   * without the wiring; `none` neither, even when wired. The line is drawn\n   * inside the chrome, so no state moves the chrome or the content. A\n   * A sunken active Pane still draws the separator unless\n   * `separator=\"hidden\"`. A `toolbarConfig.dividerSides` edge is the Toolbar's\n   * own and is unaffected.\n   */\n  chromeDividers?: 'scroll' | 'always' | 'none';\n  /**\n   * `docked` (default) gives the top chrome its own band above the active\n   * view. `overlay` lays the chrome over the view's top edge on the\n   * translucent chrome material (`--kui-chrome-material`, opaque under\n   * `prefers-reduced-transparency`, `prefers-contrast: more`, forced colors,\n   * or without `backdrop-filter`), so content scrolls visibly beneath it, as\n   * an iOS navigation bar does. `wireNavStack` measures the live chrome and\n   * hands its height (top safe area included) to the viewport as the\n   * block-start `--kui-edge-inset-*` context, so every view clears it with no\n   * prop: a plain view, a sole `Pane`'s content (or header), and a nested\n   * layout all pad and `scroll-padding` by it, so the first item, and anything\n   * focused or scrolled into view, rests clear of the bar. Until then, and\n   * with `hideToolbar`, the chrome stays docked. An untoned `ToolbarText` in\n   * the chrome lifts its title and description to AA over the content passing\n   * beneath it; keep any other quiet copy in the view.\n   */\n  chromePresentation?: NavStackChromePresentation;\n  /**\n   * `docked` (default) gives the bottom toolbar its own band below the\n   * active view. `overlay` lays it over the view's bottom edge on the\n   * translucent chrome material (opaque under the same preferences as\n   * `chromePresentation`), so content scrolls visibly beneath it, as under\n   * an iOS toolbar. `wireNavStack` measures the live bottom toolbar (never a\n   * cross-fading copy) and hands its height (bottom safe area included) to\n   * the viewport as the block-end `--kui-edge-inset-*` context, so a plain\n   * view, a sole `Pane`'s content (or footer), and a nested layout rest their\n   * last item, and anything focused or scrolled into view, clear of it. Until\n   * then, and while no bottom toolbar is shown, it stays docked. Independent\n   * of `chromePresentation`, which governs only the top chrome. An untoned\n   * `ToolbarText` in the toolbar lifts to AA over the content beneath it.\n   */\n  bottomToolbarPresentation?: NavStackBottomToolbarPresentation;\n  className?: string;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n}\n\nconst DEFAULT_SAFE_AREA_EDGES = [\n  'block-start',\n  'inline-start',\n  'inline-end',\n] as const;\n\nconst DEFAULT_BOTTOM_SAFE_AREA_EDGES = [\n  'block-end',\n  'inline-start',\n  'inline-end',\n] as const;\n\nfunction chromeList(content: KerfUiContent, config?: ListConfig) {\n  return (\n    <List\n      dividerSides={config?.dividerSides}\n      gap={config?.gap}\n      hAlign={config?.hAlign}\n      vAlign={config?.vAlign}\n      textInsets={config?.textInsets}\n      controlInsets={config?.controlInsets}\n    >\n      {content}\n    </List>\n  );\n}\n\n/**\n * A navigation stack (iOS-style push/pop). Renders every entry stacked, the last\n * one active; `@kerfjs/ui/wire-nav-stack`'s `wireNavStack` slides the content and\n * cross-fades the chrome across a change. Its top chrome is a real `Toolbar`: the\n * back control and title lead, the active view's `toolbar` fills the zones,\n * and `toolbarConfig` supplies defaults. A single-pane\n * layout is a `NavStack` with one entry. See `docs/23-app-layouts.md` §3.1.\n */\nexport function NavStack({\n  id,\n  label,\n  views,\n  backLabel = 'Back',\n  backIcon,\n  backText,\n  toolbarConfig = {},\n  panelToggle,\n  hideToolbar = false,\n  bottomToolbar,\n  separator = 'auto',\n  chromeDividers = 'scroll',\n  chromePresentation = 'docked',\n  bottomToolbarPresentation = 'docked',\n  className = '',\n  slot,\n}: NavStackProps) {\n  const topIndex = views.length - 1;\n  const top = views[topIndex];\n  const topToolbar = top?.toolbar;\n  const bottom = top?.bottomToolbar ?? bottomToolbar;\n  const canPop = views.length > 1;\n  const topDensity = topToolbar?.density ?? toolbarConfig.density;\n  // With a back control, the title centers on the bar (iOS-style) unless the\n  // view owns the center zone; at the root it leads and fills, left-aligned.\n  const centerTitle = canPop && topToolbar?.center === undefined;\n  const title = (\n    <ToolbarText\n      text={topToolbar?.title ?? ''}\n      size={\n        topToolbar?.titleSize ??\n        toolbarConfig.titleSize ??\n        (canPop ? 'large' : 'xlarge')\n      }\n      headingLevel={topToolbar?.headingLevel ?? toolbarConfig.headingLevel}\n      fill={!centerTitle}\n    />\n  );\n  return (\n    <section\n      class={`kui-nav-stack ${className}`.trim()}\n      id={id}\n      data-component=\"nav-stack\"\n      data-nav-stack-id={id}\n      data-depth={String(views.length)}\n      data-separator={separator}\n      data-chrome-dividers={\n        chromeDividers === 'always' || chromeDividers === 'none'\n          ? chromeDividers\n          : undefined\n      }\n      data-chrome-presentation={\n        chromePresentation === 'overlay' && !hideToolbar ? 'overlay' : undefined\n      }\n      data-bottom-toolbar-presentation={\n        bottomToolbarPresentation === 'overlay' ? 'overlay' : undefined\n      }\n      aria-label={label}\n      slot={slot}\n    >\n      {!hideToolbar && (\n        <div class=\"kui-nav-stack__chrome\" data-nav-stack-chrome>\n          <Toolbar\n            label={topToolbar?.label ?? toolbarConfig.label}\n            density={topDensity}\n            dividerSides={\n              topToolbar?.dividerSides ?? toolbarConfig.dividerSides\n            }\n            centerAlign={\n              centerTitle\n                ? 'balanced'\n                : (topToolbar?.centerAlign ?? toolbarConfig.centerAlign)\n            }\n            responsive={topToolbar?.responsive ?? toolbarConfig.responsive}\n            responsiveAt={\n              topToolbar?.responsiveAt ?? toolbarConfig.responsiveAt\n            }\n            safeAreaEdges={\n              topToolbar?.safeAreaEdges ??\n              toolbarConfig.safeAreaEdges ??\n              DEFAULT_SAFE_AREA_EDGES\n            }\n            leading={\n              <>\n                {canPop && (\n                  <ToolbarControlGroup\n                    content={backText ? 'mixed' : 'icon'}\n                    size={topDensity === 'compact' ? 'compact' : 'default'}\n                    single\n                  >\n                    <button\n                      type=\"button\"\n                      class=\"kui-nav-stack__back\"\n                      data-nav-back\n                      aria-label={backText ? undefined : backLabel}\n                    >\n                      {backIcon ?? (\n                        <LucideIcon\n                          icon={ChevronLeft}\n                          name=\"chevron-left\"\n                          className=\"kui-nav-stack__back-icon\"\n                        />\n                      )}\n                      {backText ? <span>{backText}</span> : null}\n                    </button>\n                  </ToolbarControlGroup>\n                )}\n                {topToolbar?.leading}\n                {centerTitle ? null : title}\n              </>\n            }\n            center={centerTitle ? title : topToolbar?.center}\n            trailing={\n              <>\n                {topToolbar?.trailing}\n                {panelToggle}\n              </>\n            }\n          />\n        </div>\n      )}\n      <div class=\"kui-nav-stack__viewport\" data-nav-stack-viewport>\n        {views.map((view, index) => (\n          <article\n            class=\"kui-nav-stack__view\"\n            data-key={view.key}\n            data-nav-key={view.key}\n            data-nav-active={String(index === topIndex)}\n            aria-hidden={String(index !== topIndex)}\n          >\n            {view.pane ||\n            view.header !== undefined ||\n            view.footer !== undefined ? (\n              <Pane\n                {...paneConfigProps(view.pane)}\n                header={\n                  view.header === undefined ? undefined : (\n                    <div data-nav-stack-header>\n                      {chromeList(view.header, view.headerList)}\n                    </div>\n                  )\n                }\n                footer={\n                  view.footer === undefined ? undefined : (\n                    <div data-nav-stack-footer>\n                      {chromeList(view.footer, view.footerList)}\n                    </div>\n                  )\n                }\n              >\n                {view.content}\n              </Pane>\n            ) : (\n              view.content\n            )}\n          </article>\n        ))}\n      </div>\n      {bottom && (\n        <footer class=\"kui-nav-stack__bottom\" data-nav-stack-bottom>\n          <Toolbar\n            position=\"footer\"\n            label={bottom.label}\n            density={bottom.density}\n            dividerSides={bottom.dividerSides}\n            centerAlign={bottom.centerAlign}\n            responsive={bottom.responsive}\n            responsiveAt={bottom.responsiveAt}\n            safeAreaEdges={\n              bottom.safeAreaEdges ?? DEFAULT_BOTTOM_SAFE_AREA_EDGES\n            }\n            leading={bottom.leading}\n            center={bottom.center}\n            trailing={bottom.trailing}\n          />\n        </footer>\n      )}\n    </section>\n  );\n}\n"]}

package/dist/chunk-CXZXHZTR.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/wiring/wire-scroll-dividers.ts"],"names":["view","scroller"],"mappings":"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","file":"chunk-CXZXHZTR.js","sourcesContent":["/**\n * An app-owned scroll arrangement outside a `Pane`: the `id` of the element\n * that scrolls and the `id`s of the pinned chrome on each physical side of it.\n * Each named chrome element shows its divider on the side facing the scroller\n * while content is scrolled away beyond that side. Ids are resolved below the\n * wired root on every refresh, so a re-render that replaces an element keeps\n * the pairing.\n */\nexport interface ScrollDividerTarget {\n  /** The `id` of the scrolling element. */\n  scroller: string;\n  /** Chrome above the scroller: shows its bottom divider once scrolled down. */\n  top?: string;\n  /**\n   * Chrome right of the scroller: shows its left divider while content is\n   * hidden beyond the scroller's right edge (never when nothing overflows).\n   */\n  right?: string;\n  /**\n   * Chrome below the scroller: shows its top divider while content is hidden\n   * beyond the scroller's bottom edge (never when nothing overflows).\n   */\n  bottom?: string;\n  /** Chrome left of the scroller: shows its right divider once scrolled right. */\n  left?: string;\n}\n\nexport interface WireScrollDividersOptions {\n  /**\n   * App-owned scroll arrangements to pair beyond the ones found by structure\n   * (every `Pane`'s header and footer around its content, every `NavStack`'s\n   * and `TabNavigator`'s chrome around its active region, and every `TabBar`\n   * strip).\n   */\n  targets?: readonly ScrollDividerTarget[];\n}\n\ntype Edge = 't' | 'r' | 'b' | 'l';\n\nconst EDGES: readonly Edge[] = ['t', 'r', 'b', 'l'];\n\n/** The side of a chrome element that faces a scroller it sits on `edge` of. */\nconst FACING: Record<Edge, Edge> = { t: 'b', r: 'l', b: 't', l: 'r' };\n\nconst TARGET_EDGES: Record<Edge, 'top' | 'right' | 'bottom' | 'left'> = {\n  t: 'top',\n  r: 'right',\n  b: 'bottom',\n  l: 'left',\n};\n\n/** On a scroller: the edges beyond which content is currently hidden. */\nconst SCROLL_OVERFLOW = 'data-scroll-overflow';\n/** On a chrome element: its sides that currently show a scroll divider. */\nconst SCROLL_DIVIDER = 'data-scroll-divider';\n\n/** On a Pane with an overlay header: the wiring has measured that header. */\nconst HEADER_OVERLAY = 'data-header-overlay';\n/** The inherited clearance context a measured overlay header publishes. */\nconst CLEARANCE_BLOCK_START = '--kui-scroll-clearance-block-start';\n/**\n * On a Pane with a measured overlay header: the inline size of its content's\n * classic vertical scrollbar, which the header leaves uncovered. Unset for an\n * overlay scrollbar, which takes no space.\n */\nconst SCROLLBAR_INLINE_SIZE = '--kui-pane-scrollbar-inline-size';\n/** A Pane whose header is laid over its content (fixed chrome only). */\nconst OVERLAY_PANE =\n  '.kui-pane[data-header-presentation=\"overlay\"]:not([data-chrome-placement=\"auto\"])';\n\n/**\n * Scroll distance, in px, that must be exceeded to count as \"away from an\n * edge\": `scrollWidth`/`scrollHeight` are rounded to whole pixels while the\n * scroll position is fractional, so a scroller at its end can report up to a\n * pixel still to go.\n */\nconst THRESHOLD = 1;\n\ninterface Pairing {\n  scroller: HTMLElement;\n  chrome: Partial<Record<Edge, HTMLElement>>;\n}\n\n/** A double-quoted CSS attribute-selector value. */\nconst quoted = (value: string) =>\n  `\"${value.replaceAll('\\\\', '\\\\\\\\').replaceAll('\"', '\\\\\"')}\"`;\n\n/** Elements matching `selector` at and below root. */\nfunction within<T extends Element>(\n  root: HTMLElement | Document,\n  selector: string,\n): T[] {\n  const found = [...root.querySelectorAll<T>(selector)];\n  if (root.nodeType === 1 && (root as HTMLElement).matches(selector))\n    found.unshift(root as unknown as T);\n  return found;\n}\n\nconst directChild = (parent: Element, selector: string) =>\n  [...parent.children].find((child): child is HTMLElement =>\n    child.matches(selector),\n  );\n\nconst PANE_CHROME = {\n  t: '.kui-pane__header, .kui-pane__toolbar',\n  b: '.kui-pane__footer',\n} as const;\n\n/** A NavStack's live (not cross-fading copy) chrome on `edge`. */\nconst NAV_STACK_CHROME = {\n  t: '.kui-nav-stack__chrome:not([data-nav-chrome-copy])',\n  b: '.kui-nav-stack__bottom:not([data-nav-chrome-copy])',\n} as const;\n\n/** A NavStack's active view: the top entry, never one sliding out. */\nfunction activeView(stack: Element): HTMLElement | undefined {\n  const viewport = directChild(stack, '.kui-nav-stack__viewport');\n  if (!viewport) return undefined;\n  return [...viewport.children]\n    .filter((child): child is HTMLElement =>\n      child.matches(\n        '.kui-nav-stack__view[data-nav-active=\"true\"]:not([data-nav-exiting=\"true\"])',\n      ),\n    )\n    .at(-1);\n}\n\n/** A TabNavigator's shown scene. */\nfunction activeScene(scaffold: Element): HTMLElement | undefined {\n  const scenes = directChild(scaffold, '.kui-tab-scaffold__scenes');\n  return scenes\n    ? directChild(scenes, '.kui-tab-scaffold__scene[data-active=\"true\"]')\n    : undefined;\n}\n\n/**\n * The elements that may scroll against a layout region's `edge` (the top or\n * bottom of a NavStack view or a TabNavigator scene): the region itself, then,\n * through a sole child that puts no chrome of its own on that edge, a Pane's\n * content slot or a nested NavStack's or TabNavigator's active region. Every\n * candidate is paired with the layout's chrome; one that does not overflow\n * reports nothing, so the chrome keys on whichever element actually scrolls.\n * A sole child with chrome on that edge (a Pane header, a nested NavStack's\n * top chrome, a TabNavigator's bar) stops the walk: that chrome draws its own\n * divider against its own content.\n */\nfunction regionScrollers(region: HTMLElement, edge: 't' | 'b'): HTMLElement[] {\n  const found: HTMLElement[] = [];\n  let current: HTMLElement | undefined = region;\n  while (current) {\n    found.push(current);\n    if (current.children.length !== 1) break;\n    const child: Element = current.children[0]!;\n    if (child.matches('.kui-pane')) {\n      current = directChild(child, PANE_CHROME[edge])\n        ? undefined\n        : directChild(child, '.kui-pane__content');\n      if (current) found.push(current);\n      break;\n    }\n    if (child.matches('.kui-nav-stack'))\n      current = directChild(child, NAV_STACK_CHROME[edge])\n        ? undefined\n        : activeView(child);\n    else if (child.matches('.kui-tab-scaffold') && edge === 't')\n      current = activeScene(child);\n    else current = undefined;\n  }\n  return found;\n}\n\n/** Canonical top/right/bottom/left string of the given edges. */\nconst sides = (edges: ReadonlySet<Edge>) =>\n  EDGES.filter((edge) => edges.has(edge)).join('');\n\n/**\n * Which edges of `scroller` currently have content hidden beyond them. Nothing\n * overflows when the content fits, so the far edges report no divider then.\n * Horizontal edges are physical, so a right-to-left scroller (whose\n * `scrollLeft` runs from the negative maximum to 0) reports the same sides.\n */\nfunction measure(scroller: HTMLElement): string {\n  const edges = new Set<Edge>();\n  const maxY = scroller.scrollHeight - scroller.clientHeight;\n  if (maxY > THRESHOLD) {\n    if (scroller.scrollTop > THRESHOLD) edges.add('t');\n    if (maxY - scroller.scrollTop > THRESHOLD) edges.add('b');\n  }\n  const maxX = scroller.scrollWidth - scroller.clientWidth;\n  if (maxX > THRESHOLD) {\n    const view = scroller.ownerDocument.defaultView;\n    const rtl = view?.getComputedStyle(scroller).direction === 'rtl';\n    const left = rtl ? maxX + scroller.scrollLeft : scroller.scrollLeft;\n    if (left > THRESHOLD) edges.add('l');\n    if (maxX - left > THRESHOLD) edges.add('r');\n  }\n  return sides(edges);\n}\n\ntype StateAttribute = typeof SCROLL_OVERFLOW | typeof SCROLL_DIVIDER;\ntype Root = HTMLElement | Document;\n\ninterface Registration {\n  root: Root;\n  targets: readonly ScrollDividerTarget[];\n}\n\n// A document has one attribute writer even when registrations overlap. The\n// WeakMap ties this coordination cache to the document's lifetime.\nconst CONTROLLERS = new WeakMap<\n  Document,\n  (registration: Registration) => () => void\n>();\n\n/** Set (or, for an empty value, remove) one of this wiring's attributes. */\nfunction write(element: Element, name: StateAttribute, value: string) {\n  if (element.getAttribute(name) === (value || null)) return;\n  if (name === SCROLL_OVERFLOW) {\n    if (value) element.setAttribute(SCROLL_OVERFLOW, value);\n    else element.removeAttribute(SCROLL_OVERFLOW);\n  } else if (value) element.setAttribute(SCROLL_DIVIDER, value);\n  else element.removeAttribute(SCROLL_DIVIDER);\n}\n\n/**\n * Wire scroll dividers below `root`: a divider between pinned chrome and the\n * content that scrolls beside it shows only while content is scrolled away\n * from that edge. Near edges (top, left) hide at the scroll start; far edges\n * (bottom, right) hide at the scroll end and whenever nothing overflows.\n *\n * The wiring only reports scroll state; each component draws its own divider\n * from it. It writes `data-scroll-overflow` (the edges with hidden content, in\n * canonical `t`/`r`/`b`/`l` order) on each scroller, and `data-scroll-divider`\n * (the sides to draw) on each paired chrome element:\n *\n * - every `Pane` with a header or footer: its header shows a bottom divider and\n *   its footer a top divider (drawn by the Pane, per its `chromeDividers`);\n * - every `NavStack`'s top chrome and bottom toolbar around its active view,\n *   and every `TabNavigator`'s bar under its active scene: the chrome shows a\n *   bottom (top chrome) or top (bottom toolbar, bar) divider. The scroller is\n *   whichever element actually scrolls there: the view or scene itself, or,\n *   through a sole child with no chrome of its own on that edge, a `Pane`'s\n *   content or a nested `NavStack` / `TabNavigator` region (a Pane's own header\n *   or footer draws that boundary instead);\n * - every `TabBar` strip: the bar draws a divider on each side of the strip\n *   whose tabs are scrolled out of view;\n * - each app-owned `targets` pairing: a `Toolbar` or `List` named as chrome\n *   draws the divider on its facing side.\n *\n * It also measures every `Pane` header laid over its content\n * (`headerPresentation=\"overlay\"`, with fixed chrome placement): it publishes\n * the header's border-box block size on the Pane root as the inherited\n * `--kui-scroll-clearance-block-start` context, and marks the root\n * `data-header-overlay=\"measured\"`, which moves the header over the content\n * and has the content clear it. The measurement follows the header as it\n * wraps, zooms, or changes content, and both are restored before paint if a\n * re-render drops them.\n *\n * Structure is re-read after every DOM change below root that can change a\n * pairing — a structural element or target id added, removed, or re-classed;\n * mutations inside scrolled content (a row's class, a list's rows) do not\n * re-read it. Either way the scrollers are re-measured once the next frame\n * has laid out, before it paints, so a large render never forces a layout\n * (where `ResizeObserver` is missing, structure is measured at once and\n * content in the next animation frame) — and a re-render that drops the\n * attributes gets them back before paint.\n * Scroll is tracked with one capturing listener per registered root, and size\n * changes of each scroller and its children with a `ResizeObserver`. Overlapping registrations\n * share one attribute writer; each disposer removes its registration, and the\n * final disposer removes the wiring-owned attributes. See\n * `docs/23-app-layouts.md` §3.7.\n */\nexport function wireScrollDividers(\n  root: Root,\n  { targets = [] }: WireScrollDividersOptions = {},\n): () => void {\n  const ownerDocument = (\n    root.nodeType === 9 ? (root as Document) : root.ownerDocument\n  )!;\n  let register = CONTROLLERS.get(ownerDocument);\n  if (!register) {\n    register = createController(ownerDocument);\n    CONTROLLERS.set(ownerDocument, register);\n  }\n  return register({ root, targets });\n}\n\n/**\n * Every class `collect()` and `regionScrollers()` select by. An element that\n * carries none of them (and no target id) can never become or stop being part\n * of a pairing.\n */\nconst STRUCTURAL_CLASSES = [\n  'kui-pane',\n  'kui-pane__content',\n  'kui-pane__header',\n  'kui-pane__toolbar',\n  'kui-pane__footer',\n  'kui-nav-stack',\n  'kui-nav-stack__viewport',\n  'kui-nav-stack__view',\n  'kui-nav-stack__chrome',\n  'kui-nav-stack__bottom',\n  'kui-tab-scaffold',\n  'kui-tab-scaffold__scenes',\n  'kui-tab-scaffold__scene',\n  'kui-tab-scaffold__bar',\n] as const;\n\nconst STRUCTURAL_SELECTOR = [\n  ...STRUCTURAL_CLASSES.map((name) => `.${name}`),\n  '[data-kui-tab-list]',\n].join(', ');\n\n/** Whether a class attribute value names a structural class. */\nconst hasStructuralClass = (value: string | null) =>\n  !!value &&\n  value\n    .split(/\\s+/)\n    .some((token) => (STRUCTURAL_CLASSES as readonly string[]).includes(token));\n\nfunction createController(\n  ownerDocument: Document,\n): (registration: Registration) => () => void {\n  const view = ownerDocument.defaultView;\n  let disposed = false;\n  const registrations = new Set<Registration>();\n  const listenedRoots = new Set<Root>();\n  let pairings: Pairing[] = [];\n  const overflow = new Map<HTMLElement, string>();\n  /** Every element this wiring has written, with what it wrote. */\n  const written = new Map<Element, Map<StateAttribute, string>>();\n  /** Each overlay Pane header, with its Pane. */\n  let overlays = new Map<HTMLElement, HTMLElement>();\n  /** Each overlay header's last measured border-box block size, in px. */\n  const headerSizes = new Map<HTMLElement, number>();\n  /** Each overlay header's Pane content scrollbar inline size, in px. */\n  const scrollbarSizes = new Map<HTMLElement, number>();\n  /** Each Pane this wiring has published a header clearance on. */\n  const published = new Set<HTMLElement>();\n\n  const byId = (root: Root, id: string | undefined) => {\n    if (!id) return undefined;\n    const [match] = within<HTMLElement>(root, `[id=${quoted(id)}]`);\n    return match;\n  };\n\n  const collect = (): Pairing[] => {\n    const found: Pairing[] = [];\n    for (const { root, targets } of registrations) {\n      for (const pane of within<HTMLElement>(root, '.kui-pane')) {\n        const scroller = directChild(pane, '.kui-pane__content');\n        const header = directChild(pane, PANE_CHROME.t);\n        const footer = directChild(pane, PANE_CHROME.b);\n        if (scroller && (header || footer))\n          found.push({ scroller, chrome: { t: header, b: footer } });\n      }\n      const pairRegion = (\n        region: HTMLElement | undefined,\n        edge: 't' | 'b',\n        chrome: HTMLElement | undefined,\n      ) => {\n        if (!region || !chrome) return;\n        for (const scroller of regionScrollers(region, edge))\n          found.push({ scroller, chrome: { [edge]: chrome } });\n      };\n      for (const stack of within<HTMLElement>(root, '.kui-nav-stack')) {\n        const view = activeView(stack);\n        for (const edge of ['t', 'b'] as const)\n          pairRegion(view, edge, directChild(stack, NAV_STACK_CHROME[edge]));\n      }\n      for (const scaffold of within<HTMLElement>(root, '.kui-tab-scaffold'))\n        pairRegion(\n          activeScene(scaffold),\n          'b',\n          directChild(scaffold, '.kui-tab-scaffold__bar'),\n        );\n      for (const strip of within<HTMLElement>(root, '[data-kui-tab-list]'))\n        found.push({ scroller: strip, chrome: {} });\n      for (const target of targets) {\n        const scroller = byId(root, target.scroller);\n        if (!scroller) continue;\n        const chrome: Pairing['chrome'] = {};\n        for (const edge of EDGES)\n          chrome[edge] = byId(root, target[TARGET_EDGES[edge]]);\n        found.push({ scroller, chrome });\n      }\n    }\n    return found;\n  };\n\n  const collectOverlays = () => {\n    const found = new Map<HTMLElement, HTMLElement>();\n    for (const { root } of registrations)\n      for (const pane of within<HTMLElement>(root, OVERLAY_PANE)) {\n        const header = directChild(pane, PANE_CHROME.t);\n        if (header) found.set(header, pane);\n      }\n    return found;\n  };\n\n  /**\n   * Re-read the classic vertical scrollbar of each overlay Pane's content (its\n   * `offsetWidth` beyond `clientWidth` and the borders; 0 for an overlay\n   * scrollbar). Returns whether any changed.\n   */\n  const measureScrollbars = () => {\n    let changed = false;\n    for (const [header, pane] of overlays) {\n      const scroller = directChild(pane, '.kui-pane__content');\n      let size = 0;\n      if (scroller) {\n        const style =\n          scroller.ownerDocument.defaultView!.getComputedStyle(scroller);\n        size = Math.max(\n          0,\n          scroller.offsetWidth -\n            scroller.clientWidth -\n            (Number.parseFloat(style.borderLeftWidth) || 0) -\n            (Number.parseFloat(style.borderRightWidth) || 0),\n        );\n      }\n      if (scrollbarSizes.get(header) === size) continue;\n      scrollbarSizes.set(header, size);\n      changed = true;\n    }\n    return changed;\n  };\n\n  /**\n   * Watches only the Panes this wiring published on, so a re-render that\n   * strips the published clearance or gate gets them back before paint.\n   */\n  const overlayObserver = view?.MutationObserver\n    ? new view.MutationObserver(() => {\n        if (!disposed) publish();\n      })\n    : undefined;\n\n  /**\n   * Publish each measured overlay header's clearance on its Pane, with the\n   * inline size of a classic scrollbar the header must leave uncovered.\n   */\n  const publish = () => {\n    const current = new Map<HTMLElement, [string, string]>();\n    for (const [header, pane] of overlays) {\n      const size = headerSizes.get(header);\n      const scrollbar = scrollbarSizes.get(header);\n      if (size !== undefined)\n        current.set(pane, [`${size}px`, scrollbar ? `${scrollbar}px` : '']);\n    }\n    // Disconnect first, so this wiring's own writes are not reported back.\n    overlayObserver?.disconnect();\n    for (const pane of published)\n      if (!current.has(pane)) {\n        pane.style.removeProperty(CLEARANCE_BLOCK_START);\n        pane.style.removeProperty(SCROLLBAR_INLINE_SIZE);\n        if (!pane.getAttribute('style')) pane.removeAttribute('style');\n        pane.removeAttribute(HEADER_OVERLAY);\n      }\n    published.clear();\n    for (const [pane, [value, scrollbar]] of current) {\n      if (pane.style.getPropertyValue(CLEARANCE_BLOCK_START) !== value)\n        pane.style.setProperty(CLEARANCE_BLOCK_START, value);\n      if (pane.style.getPropertyValue(SCROLLBAR_INLINE_SIZE) !== scrollbar) {\n        if (scrollbar) pane.style.setProperty(SCROLLBAR_INLINE_SIZE, scrollbar);\n        else pane.style.removeProperty(SCROLLBAR_INLINE_SIZE);\n      }\n      if (pane.getAttribute(HEADER_OVERLAY) !== 'measured')\n        pane.setAttribute(HEADER_OVERLAY, 'measured');\n      published.add(pane);\n      overlayObserver?.observe(pane, {\n        attributes: true,\n        attributeFilter: ['style', HEADER_OVERLAY],\n      });\n    }\n  };\n\n  /** Write every paired element's attributes from the measured overflow. */\n  const apply = () => {\n    const current = new Map<Element, Map<StateAttribute, string>>();\n    const dividers = new Map<HTMLElement, Set<Edge>>();\n    for (const { scroller, chrome } of pairings) {\n      const edges = overflow.get(scroller)!;\n      (\n        current.get(scroller) ?? current.set(scroller, new Map()).get(scroller)!\n      ).set(SCROLL_OVERFLOW, edges);\n      for (const edge of EDGES) {\n        const element = chrome[edge];\n        if (!element) continue;\n        const shown = dividers.get(element) ?? new Set<Edge>();\n        dividers.set(element, shown);\n        if (edges.includes(edge)) shown.add(FACING[edge]);\n      }\n    }\n    for (const [element, shown] of dividers)\n      (\n        current.get(element) ?? current.set(element, new Map()).get(element)!\n      ).set(SCROLL_DIVIDER, sides(shown));\n    // Anything written before that is no longer paired gets its attributes back.\n    for (const [element, values] of written)\n      for (const name of values.keys())\n        if (!current.get(element)?.has(name)) write(element, name, '');\n    written.clear();\n    for (const [element, values] of current) {\n      written.set(element, values);\n      for (const [name, value] of values) write(element, name, value);\n    }\n  };\n\n  /** Each observed element, keyed to whether it is observed by border box. */\n  const observed = new Map<Element, boolean>();\n  /**\n   * A post-layout hook for the content re-measure: an inert zero-height box\n   * outside the app tree whose width a content mutation toggles. The\n   * ResizeObserver reports it after the frame's layout, so the re-measure\n   * reads scroll extents from a clean layout instead of forcing one on the\n   * freshly rendered tree.\n   */\n  let probe: HTMLElement | undefined;\n  /** Whether a toggled probe has yet to be reported. */\n  let probePending = false;\n  const resizeObserver = view?.ResizeObserver\n    ? new view.ResizeObserver((entries) => {\n        if (disposed) return;\n        const scrollers = new Set(pairings.map(({ scroller }) => scroller));\n        let headerResized = false;\n        // A scroller resized (a classic scrollbar appeared or went away) or\n        // the post-layout probe reported: the scrollbars may have changed.\n        let scrollersResized = false;\n        for (const entry of entries) {\n          const { target } = entry;\n          if (overlays.has(target as HTMLElement)) {\n            headerSizes.set(\n              target as HTMLElement,\n              entry.borderBoxSize?.[0]?.blockSize ??\n                target.getBoundingClientRect().height,\n            );\n            headerResized = true;\n            continue;\n          }\n          scrollersResized = true;\n          if (target === probe) {\n            probePending = false;\n            for (const scroller of overflow.keys())\n              overflow.set(scroller, measure(scroller));\n            continue;\n          }\n          const scroller = scrollers.has(target as HTMLElement)\n            ? (target as HTMLElement)\n            : target.parentElement;\n          if (scroller && scrollers.has(scroller))\n            overflow.set(scroller, measure(scroller));\n        }\n        if (scrollersResized && measureScrollbars()) headerResized = true;\n        apply();\n        if (headerResized) publish();\n      })\n    : undefined;\n\n  const observeSizes = () => {\n    if (!resizeObserver) return;\n    const wanted = new Map<Element, boolean>();\n    for (const { scroller } of pairings) {\n      wanted.set(scroller, false);\n      for (const child of scroller.children) wanted.set(child, false);\n    }\n    // An overlay header's clearance is its border box, so a border alone (the\n    // forced-colors edge) must report a resize too.\n    for (const header of overlays.keys()) wanted.set(header, true);\n    for (const element of observed.keys())\n      if (!wanted.has(element)) {\n        resizeObserver.unobserve(element);\n        observed.delete(element);\n      }\n    for (const [element, borderBox] of wanted)\n      if (observed.get(element) !== borderBox) {\n        resizeObserver.observe(\n          element,\n          borderBox ? { box: 'border-box' } : undefined,\n        );\n        observed.set(element, borderBox);\n      }\n  };\n\n  /**\n   * Re-read every pairing. A registration measures at once; a mutation\n   * (`afterLayout`) keeps each still-paired scroller's last measurement and\n   * re-measures through the probe once the frame has laid out, before it\n   * paints, so a structural re-render does not force a layout either.\n   */\n  const refresh = (afterLayout = false) => {\n    const deferred = afterLayout && resizeObserver !== undefined;\n    const previous = deferred ? new Map(overflow) : undefined;\n    pairings = collect();\n    overflow.clear();\n    for (const { scroller } of pairings)\n      overflow.set(\n        scroller,\n        previous ? (previous.get(scroller) ?? '') : measure(scroller),\n      );\n    overlays = collectOverlays();\n    for (const sizes of [headerSizes, scrollbarSizes])\n      for (const header of sizes.keys())\n        if (!overlays.has(header)) sizes.delete(header);\n    // A new overlay header is measured at once unless the ResizeObserver\n    // will report it after this frame's layout.\n    if (!deferred)\n      for (const header of overlays.keys())\n        if (!headerSizes.has(header))\n          headerSizes.set(header, header.getBoundingClientRect().height);\n    if (!deferred) measureScrollbars();\n    observeSizes();\n    apply();\n    publish();\n    if (deferred) scheduleRemeasure();\n  };\n\n  /** Re-measure every scroller (pairings unchanged); write what changed. */\n  const remeasure = () => {\n    let changed = false;\n    for (const scroller of overflow.keys()) {\n      const edges = measure(scroller);\n      if (edges === overflow.get(scroller)) continue;\n      overflow.set(scroller, edges);\n      changed = true;\n    }\n    if (changed) apply();\n    if (measureScrollbars()) publish();\n  };\n\n  let remeasureFrame: number | undefined;\n  const scheduleRemeasure = () => {\n    if (resizeObserver) {\n      // Toggle once per report: a second toggle before the frame would undo\n      // the size change and the report with it.\n      if (probePending) return;\n      probePending = true;\n      if (!probe) {\n        probe = ownerDocument.createElement('div');\n        probe.setAttribute('aria-hidden', 'true');\n        probe.style.cssText =\n          'position:fixed;top:0;left:0;width:0;height:0;overflow:hidden;visibility:hidden;pointer-events:none;contain:strict';\n        resizeObserver.observe(probe);\n      }\n      // Outside body, so an app that renders into body never removes it; an\n      // app that removed it anyway gets it back.\n      if (!probe.isConnected) ownerDocument.documentElement.append(probe);\n      probe.style.width = probe.style.width === '1px' ? '0px' : '1px';\n      return;\n    }\n    if (remeasureFrame !== undefined || !view?.requestAnimationFrame) return;\n    // The final disposer cancels a pending frame.\n    remeasureFrame = view.requestAnimationFrame(() => {\n      remeasureFrame = undefined;\n      remeasure();\n    });\n  };\n\n  const onScroll = (event: Event) => {\n    const scroller = event.target as HTMLElement;\n    if (!overflow.has(scroller)) return;\n    const edges = measure(scroller);\n    if (edges === overflow.get(scroller)) return;\n    overflow.set(scroller, edges);\n    apply();\n  };\n\n  const mutationObserver = view?.MutationObserver\n    ? new view.MutationObserver((records) => {\n        if (disposed) return;\n        // Structure changes re-read every pairing. A re-render that only\n        // dropped or changed attributes this wiring owns gets them back\n        // without re-measuring.\n        // Everything else (a row's selection class, a list morph's rows)\n        // cannot change a pairing. It is re-measured after the next frame's\n        // layout instead (through the probe, else in the next animation\n        // frame), which catches what the scrollers' own observations cannot:\n        // an extent change that resizes no direct child (an absolutely\n        // positioned popup, a `display: contents` child), without forcing a\n        // layout of the freshly rendered tree.\n        const ids = targetIds();\n        const selector = [\n          STRUCTURAL_SELECTOR,\n          ...[...ids].map((id) => `[id=${quoted(id)}]`),\n        ].join(', ');\n        if (records.some((record) => changesPairings(record, ids, selector)))\n          refresh(true);\n        else {\n          if (\n            records.some(\n              ({ attributeName }) =>\n                attributeName === SCROLL_OVERFLOW ||\n                attributeName === SCROLL_DIVIDER,\n            )\n          )\n            apply();\n          if (\n            records.some(\n              ({ attributeName }) =>\n                attributeName !== SCROLL_OVERFLOW &&\n                attributeName !== SCROLL_DIVIDER,\n            )\n          )\n            scheduleRemeasure();\n        }\n      })\n    : undefined;\n\n  /** Every target id any registration resolves. */\n  const targetIds = () => {\n    const ids = new Set<string>();\n    for (const { targets } of registrations)\n      for (const target of targets) {\n        ids.add(target.scroller);\n        for (const edge of EDGES) {\n          const id = target[TARGET_EDGES[edge]];\n          if (id) ids.add(id);\n        }\n      }\n    return ids;\n  };\n\n  /** Whether `node` is or contains an element matching `selector`. */\n  const holds = (node: Node, selector: string) =>\n    node.nodeType === 1 &&\n    ((node as Element).matches(selector) ||\n      !!(node as Element).querySelector(selector));\n\n  /**\n   * Whether a mutation record can change what `collect()` finds: a structural\n   * element or target-id element (or, through its old class or id, a former\n   * one) changed, or one was added or removed. Every scroller is itself\n   * structural or a target id, so a child-list change of a scroller (whose\n   * child count `regionScrollers` reads, and whose children the\n   * ResizeObserver watches) always counts.\n   */\n  const changesPairings = (\n    {\n      type,\n      target,\n      attributeName,\n      oldValue,\n      addedNodes,\n      removedNodes,\n    }: MutationRecord,\n    ids: ReadonlySet<string>,\n    selector: string,\n  ) => {\n    if (\n      type === 'attributes' &&\n      (attributeName === SCROLL_OVERFLOW || attributeName === SCROLL_DIVIDER)\n    )\n      return false;\n    if (target.nodeType === 1 && (target as Element).matches(selector))\n      return true;\n    if (type === 'attributes')\n      return attributeName === 'class'\n        ? hasStructuralClass(oldValue)\n        : attributeName === 'id' && oldValue !== null && ids.has(oldValue);\n    for (const node of [...addedNodes, ...removedNodes])\n      if (holds(node, selector)) return true;\n    return false;\n  };\n\n  const syncRoots = () => {\n    const roots = new Set([...registrations].map(({ root }) => root));\n    for (const root of listenedRoots)\n      if (!roots.has(root)) {\n        root.removeEventListener('scroll', onScroll, { capture: true });\n        listenedRoots.delete(root);\n      }\n    for (const root of roots)\n      if (!listenedRoots.has(root)) {\n        root.addEventListener('scroll', onScroll, {\n          capture: true,\n          passive: true,\n        });\n        listenedRoots.add(root);\n      }\n    mutationObserver?.disconnect();\n    for (const root of roots)\n      mutationObserver?.observe(root, {\n        subtree: true,\n        childList: true,\n        attributes: true,\n        // Old values tell a class or id that stopped being structural.\n        attributeOldValue: true,\n        // The shown NavStack view and TabNavigator scene change by attribute,\n        // and a Pane's header presentation by its attributes.\n        attributeFilter: [\n          'data-header-presentation',\n          'data-chrome-placement',\n          SCROLL_OVERFLOW,\n          SCROLL_DIVIDER,\n          'id',\n          'class',\n          'data-nav-active',\n          'data-nav-exiting',\n          'data-active',\n        ],\n      });\n  };\n\n  return (registration) => {\n    registrations.add(registration);\n    syncRoots();\n    refresh();\n    return () => {\n      if (!registrations.delete(registration)) return;\n      syncRoots();\n      if (registrations.size) refresh();\n      else {\n        disposed = true;\n        if (remeasureFrame !== undefined)\n          view?.cancelAnimationFrame(remeasureFrame);\n        remeasureFrame = undefined;\n        resizeObserver?.disconnect();\n        probe?.remove();\n        probe = undefined;\n        probePending = false;\n        for (const [element, values] of written)\n          for (const name of values.keys()) write(element, name, '');\n        written.clear();\n        overlays.clear();\n        headerSizes.clear();\n        scrollbarSizes.clear();\n        publish();\n        overlayObserver?.disconnect();\n        overflow.clear();\n        observed.clear();\n        pairings = [];\n        CONTROLLERS.delete(ownerDocument);\n      }\n    };\n  };\n}\n"]}

package/dist/chunk-HGV7J4T6.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/actions/toolbar-text/toolbar-text.tsx"],"names":[],"mappings":"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","file":"chunk-HGV7J4T6.js","sourcesContent":["import { type CssLength, em } from '../../../shared/styles/css-values.js';\nimport { Skeleton } from '../../feedback/skeleton/skeleton.js';\n\nexport type ToolbarTextSize =\n  'xlarge' | 'xlarge-fixed' | 'large' | 'default' | 'small' | 'xsmall';\n\nexport type ToolbarTextTone = 'default' | 'dark';\n\n/** ARIA heading level for a title exposed as a heading landmark. */\nexport type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;\n\ninterface ToolbarTextBaseProps {\n  text: string;\n  size?: ToolbarTextSize;\n  /** Use dark-toolbar foregrounds on a dark or photo-backed toolbar. */\n  tone?: ToolbarTextTone;\n  /** Hide below this Toolbar content width; requires wireToolbarVisibility. */\n  hideBelow?: CssLength;\n  /** Show only below this Toolbar content width; requires wireToolbarVisibility. */\n  showBelow?: CssLength;\n  className?: string;\n  /** Optional id, e.g. so a dialog can reference the title via aria-labelledby. */\n  id?: string;\n  /**\n   * Show a trailing ellipsis (…) where the text is truncated — on the single line\n   * (default), or at the `maxLines` boundary when wrapping. Set false to hard-clip\n   * instead. Default true.\n   */\n  ellipsis?: boolean;\n  /**\n   * Grow to fill the free space of the flex row it sits in (a Toolbar zone),\n   * truncating at the space left by its siblings instead of taking only its\n   * text's width. Default false.\n   */\n  fill?: boolean;\n  /** Native named-slot assignment when composed inside a web component. */\n  slot?: string;\n  /**\n   * Cap wrapped text to this many lines, truncating past it. Only takes effect with\n   * `wrap`; ignored on a single line. `null`/omitted wraps without a line cap. Default null.\n   */\n}\n\ntype ToolbarTextWrappingProps =\n  | {\n      /** Wrap onto multiple lines; combine with `maxLines` to cap them. */\n      wrap: true;\n      maxLines?: number | null;\n    }\n  | { wrap?: false; maxLines?: never };\n\nexport type ToolbarTextProps = ToolbarTextBaseProps &\n  (\n    | ({\n        action?: never;\n        /** Expose `role=\"heading\"` and `aria-level` on read-only text. */\n        headingLevel?: HeadingLevel;\n        /** Render an unanimated loading skeleton instead of the text. */\n        placeholder?: boolean;\n        /**\n         * Quiet, single-line supporting copy under the title (\"Changes save\n         * automatically.\"), truncating with an ellipsis. Title and description\n         * share the toolbar's control band and the same text start, with or\n         * without a leading icon group. With a description, `id` and\n         * `headingLevel` apply to the title alone, so a dialog's\n         * `aria-labelledby` names only the title.\n         */\n        description?: string;\n        /** Id for the description, for a dialog's `aria-describedby`. */\n        descriptionId?: string;\n      } & ToolbarTextWrappingProps)\n    | {\n        /** Render a native button with this delegated action; the app owns editing. */\n        action: string;\n        headingLevel?: never;\n        placeholder?: never;\n        wrap?: never;\n        maxLines?: never;\n        description?: never;\n        descriptionId?: never;\n      }\n  );\n\nexport function ToolbarText({\n  text,\n  size = 'default',\n  tone = 'default',\n  hideBelow,\n  showBelow,\n  className = '',\n  id,\n  headingLevel,\n  placeholder = false,\n  wrap = false,\n  ellipsis = true,\n  maxLines = null,\n  fill = false,\n  slot,\n  action,\n  description,\n  descriptionId,\n}: ToolbarTextProps) {\n  const capped = wrap && maxLines != null && maxLines > 0;\n  if (action !== undefined)\n    return (\n      <button\n        type=\"button\"\n        class={`kui-toolbar-text ${className}`.trim()}\n        data-component=\"toolbar-text\"\n        data-size={size}\n        data-hide-below={hideBelow}\n        data-show-below={showBelow}\n        data-tone={tone === 'default' ? undefined : tone}\n        data-fill={fill ? 'true' : undefined}\n        data-ellipsis={ellipsis ? undefined : 'false'}\n        data-action={action}\n        id={id}\n        slot={slot}\n      >\n        <span class=\"kui-toolbar-text__text\">{text}</span>\n      </button>\n    );\n  const described = description !== undefined && !placeholder;\n  const title = placeholder ? (\n    <Skeleton width={em(8)} />\n  ) : (\n    <span\n      class=\"kui-toolbar-text__text\"\n      id={described ? id : undefined}\n      role={described && headingLevel ? 'heading' : undefined}\n      aria-level={described && headingLevel ? String(headingLevel) : undefined}\n    >\n      {text}\n    </span>\n  );\n  return (\n    <span\n      class={`kui-toolbar-text ${className}`.trim()}\n      data-component=\"toolbar-text\"\n      data-size={size}\n      data-hide-below={hideBelow}\n      data-show-below={showBelow}\n      data-tone={tone === 'default' ? undefined : tone}\n      data-fill={fill ? 'true' : undefined}\n      data-wrap={wrap ? 'true' : undefined}\n      data-ellipsis={ellipsis ? undefined : 'false'}\n      data-max-lines={capped ? String(maxLines) : undefined}\n      style={capped ? `--kui-toolbar-text-max-lines:${maxLines}` : undefined}\n      data-placeholder={placeholder ? 'true' : undefined}\n      data-has-description={described ? 'true' : undefined}\n      id={described ? undefined : id}\n      role={headingLevel && !described ? 'heading' : undefined}\n      aria-level={headingLevel && !described ? String(headingLevel) : undefined}\n      aria-busy={placeholder ? 'true' : undefined}\n      slot={slot}\n    >\n      {title}\n      {described ? (\n        <span class=\"kui-toolbar-text__description\" id={descriptionId}>\n          {description}\n        </span>\n      ) : null}\n    </span>\n  );\n}\n"]}

package/dist/chunk-INI4WDWC.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/layout/pane/pane.tsx"],"names":[],"mappings":"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","file":"chunk-INI4WDWC.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 { ensureSunkenTexture } from '../../../shared/styles/sunken-texture.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-chrome-dividers',\n  'data-appearance',\n  'data-deep-inset',\n  'data-outlined',\n  'data-scroll-clearance',\n  'data-header-presentation',\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-deep-inset'?: never;\n    'data-outlined'?: never;\n    'data-scroll-clearance'?: never;\n    'data-header-presentation'?: never;\n    'data-header-overlay'?: 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 * 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 */\nexport type PaneHeaderPresentation = 'docked' | 'overlay';\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  headerPresentation?: PaneHeaderPresentation;\n  /** Paint the scrolling work surface with the shared lowered-surface color. */\n  appearance?: PaneAppearance;\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  | 'headerPresentation'\n  | 'appearance'\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  headerPresentation = 'docked',\n  appearance = 'default',\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') ensureSunkenTexture();\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 ${className}`.trim(),\n    id,\n    'data-component': 'pane',\n    'data-appearance': appearance === 'sunken' ? 'sunken' : undefined,\n    'data-deep-inset': deepInset ? 'true' : undefined,\n    'data-outlined': outlined ? 'true' : undefined,\n    'data-scroll-clearance': scrollClearance,\n    'data-header-presentation':\n      headerPresentation === 'overlay' && header !== undefined\n        ? 'overlay'\n        : undefined,\n    'data-chrome-placement': chromePlacement === 'auto' ? 'auto' : 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';\n"]}

package/dist/chunk-PIVY32AE.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/surfaces/surface-scaffold/surface-scaffold.tsx"],"names":[],"mappings":";;;AAwCA,IAAM,wBAAA,uBAA+B,GAAA,CAAI;AAAA,EACvC,gBAAA;AAAA,EACA,WAAA;AAAA,EACA,mBAAA;AAAA,EACA,sBAAA;AAAA,EACA,iBAAA;AAAA,EACA,mBAAA;AAAA,EACA,sBAAA;AAAA,EACA,iBAAA;AAAA,EACA,aAAA;AAAA,EACA,kBAAA;AAAA,EACA,0BAAA;AAAA,EACA;AACF,CAAC,CAAA;AAqEM,SAAS,aAAA,CAAc;AAAA,EAC5B,QAAA;AAAA,EACA,IAAA,GAAO,QAAA;AAAA,EACP,YAAA,GAAe,OAAA;AAAA,EACf,cAAA;AAAA,EACA,SAAA,GAAY,SAAA;AAAA,EACZ,WAAA,GAAc,aAAA;AAAA,EACd,cAAA;AAAA,EACA,SAAA;AAAA,EACA,MAAA;AAAA,EACA,UAAA,GAAa,MAAA;AAAA,EACb,kBAAA,GAAqB,QAAA;AAAA,EACrB,kBAAA,GAAqB,QAAA;AAAA,EACrB,YAAA;AAAA,EACA,iBAAiB,EAAC;AAAA,EAClB,SAAA,GAAY,EAAA;AAAA,EACZ;AACF,CAAA,EAAuB;AACrB,EAAA,MAAM,KAAA,GAAQ;AAAA,IACZ,cAAA,KAAmB,MAAA,GACf,EAAA,GACA,CAAA,sCAAA,EAAyC,cAAc,CAAA,CAAA;AAAA,IAC3D,cAAA,KAAmB,MAAA,GACf,EAAA,GACA,CAAA,6BAAA,EAAgC,cAAc,CAAA,CAAA;AAAA,IAClD,cAAc,MAAA,IAAa,SAAA,KAAc,UAAA,GACrC,EAAA,GACA,oCAAoC,SAAS,CAAA,CAAA;AAAA,IACjD,WAAW,MAAA,IAAa,MAAA,KAAW,UAAA,GAC/B,EAAA,GACA,gCAAgC,MAAM,CAAA,CAAA;AAAA,IAC1C,YAAA,KAAiB,MAAA,GACb,EAAA,GACA,CAAA,oCAAA,EAAuC,YAAY,CAAA;AAAA,GACzD,CACG,MAAA,CAAO,OAAO,CAAA,CACd,KAAK,GAAG,CAAA;AACX,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,oBAAA,CAAqB,cAAA,EAAgB,wBAAwB,CAAA;AAAA,MACjE,KAAA,EAAO,CAAA,mBAAA,EAAsB,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK;AAAA,MAC9C,gBAAA,EAAe,gBAAA;AAAA,MACf,WAAA,EAAW,IAAA;AAAA,MACX,mBAAA,EAAmB,YAAA;AAAA,MACnB,sBAAA,EAAsB,cAAA,KAAmB,MAAA,GAAY,MAAA,GAAY,EAAA;AAAA,MACjE,iBAAA,EAAiB,SAAA;AAAA,MACjB,mBAAA,EAAmB,WAAA;AAAA,MACnB,sBAAA,EAAsB,cAAA,KAAmB,MAAA,GAAY,MAAA,GAAY,EAAA;AAAA,MACjE,iBAAA,EAAiB,SAAA,KAAc,MAAA,GAAY,MAAA,GAAY,EAAA;AAAA,MACvD,aAAA,EAAa,MAAA,KAAW,MAAA,GAAY,MAAA,GAAY,EAAA;AAAA,MAChD,kBAAA,EAAkB,UAAA,KAAe,MAAA,GAAS,MAAA,GAAY,UAAA;AAAA,MACtD,0BAAA,EACE,kBAAA,KAAuB,UAAA,GAAa,UAAA,GAAa,MAAA;AAAA,MAEnD,0BAAA,EACE,kBAAA,KAAuB,UAAA,GAAa,UAAA,GAAa,MAAA;AAAA,MAEnD,OAAO,KAAA,IAAS,MAAA;AAAA,MAChB,IAAA;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ;AAkDA,IAAM,wBAAA,uBAA+B,GAAA,CAAI;AAAA,EACvC,gBAAA;AAAA,EACA,mBAAA;AAAA,EACA,WAAA;AAAA,EACA,aAAA;AAAA,EACA,iBAAA;AAAA,EACA;AACF,CAAC,CAAA;AASM,SAAS,oBAAA,CAAqB;AAAA,EACnC,EAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAA;AAAA,EACA,UAAA;AAAA,EACA,WAAA;AAAA,EACA,YAAA,GAAe,SAAA;AAAA,EACf,IAAA,GAAO,QAAA;AAAA,EACP,cAAA;AAAA,EACA,MAAA;AAAA,EACA,SAAA;AAAA,EACA,cAAA;AAAA,EACA,UAAA,GAAa,MAAA;AAAA,EACb,iBAAiB,EAAC;AAAA,EAClB,SAAA,GAAY,EAAA;AAAA,EACZ;AACF,CAAA,EAA8B;AAC5B,EAAA,MAAM,KAAA,GAAQ;AAAA,IACZ,cAAA,KAAmB,MAAA,GACf,EAAA,GACA,CAAA,8CAAA,EAAiD,cAAc,CAAA,CAAA;AAAA,IACnE,cAAA,KAAmB,MAAA,GACf,EAAA,GACA,CAAA,qCAAA,EAAwC,cAAc,CAAA,CAAA;AAAA,IAC1D,WAAW,MAAA,IAAa,MAAA,KAAW,UAAA,GAC/B,EAAA,GACA,wCAAwC,MAAM,CAAA,CAAA;AAAA,IAClD,cAAc,MAAA,IAAa,SAAA,KAAc,UAAA,GACrC,EAAA,GACA,4CAA4C,SAAS,CAAA;AAAA,GAC3D,CACG,MAAA,CAAO,OAAO,CAAA,CACd,KAAK,GAAG,CAAA;AACX,EAAA,uBACE,GAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACE,GAAG,oBAAA,CAAqB,cAAA,EAAgB,wBAAwB,CAAA;AAAA,MACjE,EAAA;AAAA,MACA,KAAA,EAAO,CAAA,2BAAA,EAA8B,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK;AAAA,MACtD,gBAAA,EAAe,wBAAA;AAAA,MACf,mBAAA,EAAmB,YAAA;AAAA,MACnB,WAAA,EAAW,IAAA;AAAA,MACX,aAAA,EAAa,MAAA,KAAW,MAAA,GAAY,MAAA,GAAY,EAAA;AAAA,MAChD,iBAAA,EAAiB,SAAA,KAAc,MAAA,GAAY,MAAA,GAAY,EAAA;AAAA,MACvD,kBAAA,EAAkB,UAAA,KAAe,MAAA,GAAS,MAAA,GAAY,UAAA;AAAA,MACtD,OAAA,EAAS,YAAA,KAAiB,SAAA,GAAY,MAAA,GAAS,MAAA;AAAA,MAC/C,IAAA,EAAK,QAAA;AAAA,MACL,YAAA,EAAY,KAAA;AAAA,MACZ,iBAAA,EAAiB,UAAA;AAAA,MACjB,kBAAA,EAAkB,WAAA;AAAA,MAClB,OAAO,KAAA,IAAS,MAAA;AAAA,MAChB,IAAA;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ;AAaO,SAAS,YAAA,CAAa;AAAA,EAC3B,QAAA;AAAA,EACA,KAAA,GAAQ,UAAA;AAAA,EACR,SAAA,GAAY,EAAA;AAAA,EACZ;AACF,CAAA,EAAsB;AACpB,EAAA,uBACE,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,CAAA,kBAAA,EAAqB,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK;AAAA,MAC7C,gBAAA,EAAe,eAAA;AAAA,MACf,YAAA,EAAY,KAAA;AAAA,MACZ,IAAA;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ","file":"chunk-PIVY32AE.js","sourcesContent":["import 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';\n\nexport type DialogSurfaceSize = 'small' | 'medium' | 'large';\nexport type DialogSurfacePresentation = 'modal' | 'side-sheet' | 'fullscreen';\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]);\n\nexport interface DialogSurfaceProps {\n  children: KerfUiContent;\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  /** Modal height cap, bounded by the dynamic viewport minus both gutters. */\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`.\n   */\n  height?: DialogSurfaceHeight;\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/** Configure recurring Web Awesome dialog geometry without consumer ::part() CSS. */\nexport function DialogSurface({\n  children,\n  size = 'medium',\n  presentation = 'modal',\n  preferredWidth,\n  bodyInset = 'compact',\n  footerInset = 'comfortable',\n  viewportGutter,\n  maxHeight,\n  height,\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  ]\n    .filter(Boolean)\n    .join(';');\n  return (\n    <div\n      {...filterDataAttributes(rootAttributes, DIALOG_SURFACE_PROTECTED)}\n      class={`kui-dialog-surface ${className}`.trim()}\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      style={style || undefined}\n      slot={slot}\n    >\n      {children}\n    </div>\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` with\n * `wa-dialog` when the 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"]}