@ecoma-io/loom 0.5.0 → 0.6.0

package/dist/layouts/desktop-app-shell/src/DesktopAppShell.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DesktopAppShell.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../../packages/layouts/desktop-app-shell/src/DesktopAppShell.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * DesktopAppShell — the ready-made layout a desktop (Electron/Tauri) app\n * reaches for. It composes TitleBar, a sidebar, and a content area into a\n * single root so the host never hand-tunes the flex relationship between\n * window chrome and application body.\n *\n * The sidebar sits on the sunken plane (`bg-sunken`). The rail+main row is\n * `flex-col` below the `md` media query and `md:flex-row` above it — the\n * collapse is a literal breakpoint switch, not an intrinsic wrap, so it lands\n * at the viewport's 768px whatever either pane holds. The rail's width is\n * never negotiated either: `sidebarWidth` fixes its basis below the switch\n * (12/16/20rem) and `md:shrink-0 md:grow-0` settles it above. SidebarNav has\n * no viewport behaviour for the shell to mirror — its icon-only mode is a\n * prop the host sets, not a width the nav measures.\n *\n * Content sits on `bg-background` with gutters that step open at `sm` and\n * `3xl`, matching the same step scale AppHeader uses — a 16px gutter beside a\n * 1920px canvas reads as an accident.\n *\n * Every TitleBar event is re-emitted so the host wires its own window bridge;\n * the shell itself owns no IPC.\n */\nimport type { MenubarMenu } from \"@ecoma-io/loom-menubar\";\nimport type { WindowPlatform } from \"@ecoma-io/loom-window-controls\";\n</script>\n\n<script setup lang=\"ts\">\nimport TitleBar from \"@ecoma-io/loom-title-bar\";\nimport { type WindowControlsLabels } from \"@ecoma-io/loom-window-controls\";\nimport { optional } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** The host app's brand name — passed through to TitleBar, which has no identity of its own. */\n    appName: string;\n    /** Centered subtitle — usually the open project / composition. Passed through to TitleBar. */\n    title?: string;\n    /** Top-level menus for the TitleBar's Menubar. Omit for a menu-less app. */\n    menus?: MenubarMenu[];\n    /** Whether the window is maximized — controls the TitleBar's middle window-control glyph. */\n    isMaximized?: boolean;\n    /**\n     * The desktop platform the window runs on. Passed through to TitleBar, which\n     * adjusts layout for native traffic-lights on macOS. The host decides —\n     * Loom never sniffs the OS at runtime.\n     */\n    platform?: WindowPlatform;\n    /** Names for the window-control buttons, as any subset of `WindowControlsLabels`. */\n    windowControlsLabels?: WindowControlsLabels;\n    /** Sidebar rail width. Maps to 12/16/20 rem — the three widths SidebarNav's label/labelless\n     *  modes were measured against. */\n    sidebarWidth?: \"sm\" | \"md\" | \"lg\";\n    /** Accessible name for the sidebar's `<aside>` landmark. */\n    sidebarAriaLabel?: string;\n  }>(),\n  {\n    title: \"\",\n    menus: () => [],\n    isMaximized: false,\n    platform: \"windows\",\n    sidebarWidth: \"md\",\n    sidebarAriaLabel: \"Sidebar\",\n  },\n);\n\nconst emit = defineEmits<{\n  (e: \"select\", command: string): void;\n  (e: \"minimize\"): void;\n  (e: \"maximize\"): void;\n  (e: \"close\"): void;\n}>();\n\nconst SIDEBAR_WIDTH = {\n  sm: \"12rem\",\n  md: \"16rem\",\n  lg: \"20rem\",\n} as const;\n</script>\n\n<template>\n  <div class=\"flex h-dvh flex-col\">\n    <TitleBar\n      :app-name=\"appName\"\n      :title=\"title\"\n      :menus=\"menus\"\n      :is-maximized=\"isMaximized\"\n      :platform=\"platform\"\n      v-bind=\"optional({ windowControlsLabels })\"\n      @select=\"emit('select', $event)\"\n      @minimize=\"emit('minimize')\"\n      @maximize=\"emit('maximize')\"\n      @close=\"emit('close')\"\n    >\n      <template v-if=\"$slots.brandIcon\" #brandIcon>\n        <!-- @slot Brand icon — forwarded to TitleBar's own brandIcon slot. -->\n        <slot name=\"brandIcon\" />\n      </template>\n      <template v-if=\"$slots.brandMark\" #brandMark>\n        <!-- @slot Brand mark — forwarded to TitleBar's own brandMark slot. -->\n        <slot name=\"brandMark\" />\n      </template>\n    </TitleBar>\n\n    <div class=\"flex min-h-0 flex-1 flex-col md:flex-row\">\n      <aside\n        :aria-label=\"sidebarAriaLabel\"\n        class=\"shrink-1 bg-sunken md:shrink-0 md:grow-0\"\n        :style=\"{ flexBasis: SIDEBAR_WIDTH[sidebarWidth] }\"\n      >\n        <!-- @slot Sidebar navigation content — typically SidebarNav. Sits on the sunken plane. -->\n        <slot name=\"sidebar\" />\n      </aside>\n\n      <main class=\"min-w-1/2 grow-[999] overflow-y-auto bg-background px-4 sm:px-6 3xl:px-8\">\n        <!-- @slot Main content area. Sits on the background plane with stepped gutters. -->\n        <slot />\n      </main>\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkEA,MAAM,OAAO;EAOb,MAAM,gBAAgB;GACpB,IAAI;GACJ,IAAI;GACJ,IAAI;EACN;;GAIE,OAAA,UAAA,GAAA,mBAsCM,OAtCN,YAsCM,CArCJ,YAoBW,MAAA,gBAAA,GApBX,WAoBW;IAnBR,YAAU,QAAA;IACV,OAAO,QAAA;IACP,OAAO,QAAA;IACP,gBAAc,QAAA;IACd,UAAU,QAAA;GACH,GAAA,MAAA,QAAA,CAAQ,CAAA,EAAA,sBAAG,QAAA,qBAAoB,CAAA,GAAA;IACtC,UAAM,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,UAAW,MAAM;IAC7B,YAAQ,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,UAAA;IACd,YAAQ,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,UAAA;IACd,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,OAAA;GAEIA,CAAAA,GAAAA,YAAAA,EAAAA,GAAAA,EAAAA,GAAAA,CAAAA,KAAAA,OAAO,YAAA;IAAY,MAAA;IAEjC,IAAA,cAAyB,CAAzB,WAAyB,KAAA,QAAA,WAAA,CAAA,CAAA;;GAEXA,IAAAA,KAAAA,GAAAA,KAAAA,OAAO,YAAA;IAAY,MAAA;IAEjC,IAAA,cAAyB,CAAzB,WAAyB,KAAA,QAAA,WAAA,CAAA,CAAA;;;;;;;;GAI7B,CAAA,GAAA,mBAcM,OAdN,YAcM,CAbJ,mBAOQ,SAAA;IANL,cAAY,QAAA;IACb,OAAM;IACL,OAAK,eAAA,EAAA,WAAe,cAAc,QAAA,cAAY,CAAA;GAG/C,GAAA,CAAA,WAAuB,KAAA,QAAA,SAAA,CAAA,GAAA,IAAA,UAAA,GAGzB,mBAGO,QAHP,YAGO,CADL,WAAQ,KAAA,QAAA,SAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA"}

package/dist/layouts/form-layout/src/FormLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormLayout.js","names":[],"sources":["../../../../packages/layouts/form-layout/src/FormLayout.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * FormLayout — a centered form page with constrained width for readability.\n *\n * Forms are narrower than general content: a line length comfortable for reading\n * prose is already wider than the labels and inputs a form needs. FormLayout\n * enforces that cap so the host never ships a form that stretches across an\n * ultrawide monitor. The `maxWidth` prop maps to named steps rather than a pixel\n * value, so the host names intent and the layout owns the geometry.\n *\n * The `#actions` slot flows with the content rather than being sticky, because a\n * submit button that stays pinned while the user scrolls is a button that gets\n * clicked before the form is filled. The gap between content and actions is a\n * fixed `mt-8` — a visual separator is the layout's responsibility, and a wider\n * gap than Stack's `lg` step is warranted to make the boundary unmistakable.\n *\n * The header slot is full-width, above the centered content, so a page title or\n * breadcrumb never competes for horizontal space with the constrained form.\n * Gutters widen at wider breakpoints so ultrawide viewports add whitespace rails\n * rather than stretching the form.\n */\nexport type FormLayoutMaxWidth = \"sm\" | \"md\" | \"lg\" | \"xl\";\n\nconst maxWidthClass: Record<FormLayoutMaxWidth, string> = {\n  sm: \"max-w-sm\",\n  md: \"max-w-md\",\n  lg: \"max-w-lg\",\n  xl: \"max-w-xl\",\n} as const;\n\nexport { maxWidthClass };\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Max-width for the form column. Forms should be narrower than general content. */\n    maxWidth?: FormLayoutMaxWidth;\n  }>(),\n  { maxWidth: \"md\" },\n);\n</script>\n\n<template>\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header is full-width, above the centered form content, so a page\n      title or breadcrumb never competes for horizontal space.\n    -->\n    <header v-if=\"$slots.header\" :class=\"cn('px-4 sm:px-6 3xl:px-8')\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      The content area fills available vertical space and centres the form\n      horizontally. `max-w-md` (default) keeps labels and inputs at a\n      comfortable width — wider than that and the eye has to travel too far\n      between label and input. Gutters widen at wider breakpoints so\n      ultrawide viewports add whitespace rails rather than stretching lines.\n    -->\n    <div :class=\"cn('mx-auto w-full flex-1 px-4 sm:px-6 3xl:px-8', maxWidthClass[maxWidth])\">\n      <slot />\n\n      <!--\n        The actions slot is separated from the form content by a wider gap\n        than Stack's lg step, so the boundary between \"fill in\" and \"submit\"\n        is unmistakable. It flows with the content rather than being sticky,\n        because a submit button pinned to the viewport is a button clicked\n        before the form is filled.\n      -->\n      <div v-if=\"$slots.actions\" :class=\"cn('mt-8')\">\n        <slot name=\"actions\" />\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":""}

package/dist/layouts/form-layout/src/FormLayout.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormLayout.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../../packages/layouts/form-layout/src/FormLayout.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * FormLayout — a centered form page with constrained width for readability.\n *\n * Forms are narrower than general content: a line length comfortable for reading\n * prose is already wider than the labels and inputs a form needs. FormLayout\n * enforces that cap so the host never ships a form that stretches across an\n * ultrawide monitor. The `maxWidth` prop maps to named steps rather than a pixel\n * value, so the host names intent and the layout owns the geometry.\n *\n * The `#actions` slot flows with the content rather than being sticky, because a\n * submit button that stays pinned while the user scrolls is a button that gets\n * clicked before the form is filled. The gap between content and actions is a\n * fixed `mt-8` — a visual separator is the layout's responsibility, and a wider\n * gap than Stack's `lg` step is warranted to make the boundary unmistakable.\n *\n * The header slot is full-width, above the centered content, so a page title or\n * breadcrumb never competes for horizontal space with the constrained form.\n * Gutters widen at wider breakpoints so ultrawide viewports add whitespace rails\n * rather than stretching the form.\n */\nexport type FormLayoutMaxWidth = \"sm\" | \"md\" | \"lg\" | \"xl\";\n\nconst maxWidthClass: Record<FormLayoutMaxWidth, string> = {\n  sm: \"max-w-sm\",\n  md: \"max-w-md\",\n  lg: \"max-w-lg\",\n  xl: \"max-w-xl\",\n} as const;\n\nexport { maxWidthClass };\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Max-width for the form column. Forms should be narrower than general content. */\n    maxWidth?: FormLayoutMaxWidth;\n  }>(),\n  { maxWidth: \"md\" },\n);\n</script>\n\n<template>\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header is full-width, above the centered form content, so a page\n      title or breadcrumb never competes for horizontal space.\n    -->\n    <header v-if=\"$slots.header\" :class=\"cn('px-4 sm:px-6 3xl:px-8')\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      The content area fills available vertical space and centres the form\n      horizontally. `max-w-md` (default) keeps labels and inputs at a\n      comfortable width — wider than that and the eye has to travel too far\n      between label and input. Gutters widen at wider breakpoints so\n      ultrawide viewports add whitespace rails rather than stretching lines.\n    -->\n    <div :class=\"cn('mx-auto w-full flex-1 px-4 sm:px-6 3xl:px-8', maxWidthClass[maxWidth])\">\n      <slot />\n\n      <!--\n        The actions slot is separated from the form content by a wider gap\n        than Stack's lg step, so the boundary between \"fill in\" and \"submit\"\n        is unmistakable. It flows with the content rather than being sticky,\n        because a submit button pinned to the viewport is a button clicked\n        before the form is filled.\n      -->\n      <div v-if=\"$slots.actions\" :class=\"cn('mt-8')\">\n        <slot name=\"actions\" />\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;AAuBA,IAAM,gBAAoD;CACxD,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;GAkBE,OAAA,UAAA,GAAA,mBA8BM,OAAA,EA9BA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,yBAAA,CAAA,EAAA,GAAA,CAKCA,KAAAA,OAAO,UAArB,UAAA,GAAA,mBAES,UAAA;;IAFqB,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,uBAAA,CAAA;GACrC,GAAA,CAAA,WAAsB,KAAA,QAAA,QAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAUxB,mBAaM,OAAA,EAbA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,+CAAgD,cAAc,QAAA,SAAQ,CAAA,EAAA,GAAA,CACnF,WAAQ,KAAA,QAAA,SAAA,GASGA,KAAAA,OAAO,WAAlB,UAAA,GAAA,mBAEM,OAAA;;IAFsB,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,MAAA,CAAA;GACnC,GAAA,CAAA,WAAuB,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA"}

package/dist/layouts/master-detail/src/MasterDetail.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MasterDetail.js","names":[],"sources":["../../../../packages/layouts/master-detail/src/MasterDetail.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * MasterDetail — a master list panel and a detail panel side by side.\n *\n * The master/detail pattern is the layout that list-driven applications reach\n * for: a selectable list on one side, its content on the other. Mail clients,\n * file browsers, and settings pages all share this structure.\n *\n * The intrinsic collapse from the Split composition primitive is reused directly\n * — `flex-wrap` plus a `min-width: 50%` guard on the detail panel — so the\n * layout derives its own breakpoint from the container's width rather than a\n * viewport media query. Below the collapse width the panels stack vertically;\n * the master list sits above the detail area.\n *\n * The master panel does not shrink (`flex-shrink: 0`), unlike the AppShell\n * sidebar, because a master list whose column widths change under compression\n * is harder to scan than one that holds its shape and lets the detail panel\n * absorb the squeeze. The detail panel scrolls independently so long lists of\n * content never push the master list off-screen.\n */\nexport type MasterDetailMinMasterWidth = string;\n\nexport type MasterDetailGap = \"sm\" | \"md\" | \"lg\" | \"none\";\n\nconst gapClass: Record<Exclude<MasterDetailGap, \"none\">, string> = {\n  sm: \"gap-2 sm:gap-3\",\n  md: \"gap-3 sm:gap-4\",\n  lg: \"gap-4 sm:gap-6\",\n} as const;\n\nexport { gapClass };\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Minimum width for the master panel (e.g. \"14rem\"). The detail area takes the rest. */\n    minMasterWidth?: MasterDetailMinMasterWidth;\n    /** Gap between master and detail panels. Tightens one notch below sm. */\n    gap?: MasterDetailGap;\n  }>(),\n  { minMasterWidth: \"14rem\", gap: \"none\" },\n);\n</script>\n\n<template>\n  <!--\n    `flex-wrap: wrap` is the intrinsic collapse mechanism. When the detail\n    panel cannot honour its `min-width: 50%`, both panels wrap to full-width —\n    the master list sits above the detail area. No media query; the layout\n    derives its own breakpoint from the container's width.\n  -->\n  <div\n    :class=\"cn('flex h-full', gap !== 'none' ? gapClass[gap] : undefined)\"\n    :style=\"{ flexWrap: 'wrap' }\"\n  >\n    <!--\n      The master panel holds a fixed basis and does not grow or shrink. It sits\n      on the sunken elevation so the detail area reads as the work surface\n      lifted above navigation chrome.\n    -->\n    <div\n      :style=\"{\n        flexBasis: minMasterWidth,\n        flexGrow: 0,\n        flexShrink: 0,\n      }\"\n      :class=\"cn('bg-sunken w-full')\"\n    >\n      <slot name=\"master\" />\n    </div>\n\n    <!--\n      The detail panel takes all remaining space (`flex-grow: 999`) when the\n      container is wide enough. Its `min-width: 50%` triggers wrapping below\n      tablet-like widths. It scrolls independently so long content never pushes\n      the master list off-screen. Gutters widen at wider breakpoints so\n      ultrawide viewports add whitespace rails rather than stretching lines.\n    -->\n    <div\n      :style=\"{\n        flexBasis: 0,\n        flexGrow: 999,\n        flexShrink: 1,\n        minWidth: '50%',\n      }\"\n      :class=\"cn('bg-background overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n    >\n      <slot />\n    </div>\n  </div>\n</template>\n"],"mappings":""}

package/dist/layouts/master-detail/src/MasterDetail.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MasterDetail.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../packages/layouts/master-detail/src/MasterDetail.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * MasterDetail — a master list panel and a detail panel side by side.\n *\n * The master/detail pattern is the layout that list-driven applications reach\n * for: a selectable list on one side, its content on the other. Mail clients,\n * file browsers, and settings pages all share this structure.\n *\n * The intrinsic collapse from the Split composition primitive is reused directly\n * — `flex-wrap` plus a `min-width: 50%` guard on the detail panel — so the\n * layout derives its own breakpoint from the container's width rather than a\n * viewport media query. Below the collapse width the panels stack vertically;\n * the master list sits above the detail area.\n *\n * The master panel does not shrink (`flex-shrink: 0`), unlike the AppShell\n * sidebar, because a master list whose column widths change under compression\n * is harder to scan than one that holds its shape and lets the detail panel\n * absorb the squeeze. The detail panel scrolls independently so long lists of\n * content never push the master list off-screen.\n */\nexport type MasterDetailMinMasterWidth = string;\n\nexport type MasterDetailGap = \"sm\" | \"md\" | \"lg\" | \"none\";\n\nconst gapClass: Record<Exclude<MasterDetailGap, \"none\">, string> = {\n  sm: \"gap-2 sm:gap-3\",\n  md: \"gap-3 sm:gap-4\",\n  lg: \"gap-4 sm:gap-6\",\n} as const;\n\nexport { gapClass };\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Minimum width for the master panel (e.g. \"14rem\"). The detail area takes the rest. */\n    minMasterWidth?: MasterDetailMinMasterWidth;\n    /** Gap between master and detail panels. Tightens one notch below sm. */\n    gap?: MasterDetailGap;\n  }>(),\n  { minMasterWidth: \"14rem\", gap: \"none\" },\n);\n</script>\n\n<template>\n  <!--\n    `flex-wrap: wrap` is the intrinsic collapse mechanism. When the detail\n    panel cannot honour its `min-width: 50%`, both panels wrap to full-width —\n    the master list sits above the detail area. No media query; the layout\n    derives its own breakpoint from the container's width.\n  -->\n  <div\n    :class=\"cn('flex h-full', gap !== 'none' ? gapClass[gap] : undefined)\"\n    :style=\"{ flexWrap: 'wrap' }\"\n  >\n    <!--\n      The master panel holds a fixed basis and does not grow or shrink. It sits\n      on the sunken elevation so the detail area reads as the work surface\n      lifted above navigation chrome.\n    -->\n    <div\n      :style=\"{\n        flexBasis: minMasterWidth,\n        flexGrow: 0,\n        flexShrink: 0,\n      }\"\n      :class=\"cn('bg-sunken w-full')\"\n    >\n      <slot name=\"master\" />\n    </div>\n\n    <!--\n      The detail panel takes all remaining space (`flex-grow: 999`) when the\n      container is wide enough. Its `min-width: 50%` triggers wrapping below\n      tablet-like widths. It scrolls independently so long content never pushes\n      the master list off-screen. Gutters widen at wider breakpoints so\n      ultrawide viewports add whitespace rails rather than stretching lines.\n    -->\n    <div\n      :style=\"{\n        flexBasis: 0,\n        flexGrow: 999,\n        flexShrink: 1,\n        minWidth: '50%',\n      }\"\n      :class=\"cn('bg-background overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n    >\n      <slot />\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;AAwBA,IAAM,WAA6D;CACjE,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;;;;GA0BE,OAAA,UAAA,GAAA,mBAsCM,OAAA;IArCH,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,eAAgB,QAAA,QAAG,SAAc,SAAS,QAAA,OAAO,KAAA,CAAS,CAAA;IACnE,OAAO,EAAA,UAAA,OAAA;GAOR,GAAA,CAAA,mBASM,OAAA;IARH,OAAK,eAAA;KAAuB,WAAA,QAAA;;;;IAK5B,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,kBAAA,CAAA;GAEV,GAAA,CAAA,WAAsB,KAAA,QAAA,QAAA,CAAA,GAAA,CAAA,GAUxB,mBAUM,OAAA;IATH,OAAO;;;;;IAKP;IACA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,qDAAA,CAAA;GAEV,GAAA,CAAA,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA"}

package/dist/layouts/reading/src/Reading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Reading.js","names":[],"sources":["../../../../packages/layouts/reading/src/Reading.vue"],"sourcesContent":["<script lang=\"ts\">\n/** Whether the layout carries horizontal gutters that widen at wider breakpoints. */\nexport type ReadingGutter = boolean;\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Whether to add horizontal gutters that widen at wider breakpoints. */\n    gutter?: ReadingGutter;\n  }>(),\n  { gutter: true },\n);\n</script>\n\n<template>\n  <!--\n    Reading — a long-form reading layout that caps the content area at a\n    comfortable line length (~65ch). The header and footer span full-width\n    (site chrome, navigation, copyright), while only the reading content is\n    constrained to `max-w-prose` — the width that research identifies as the\n    fastest for sustained reading. Extra viewport on ultrawide monitors goes\n    to intentional whitespace, never to stretching lines.\n\n    The content wrapper is always prose-width with no prop: this layout exists\n    to enforce that cap. A reading layout that can go full-width is not a\n    reading layout. The `gutter` prop controls horizontal padding, not width.\n  -->\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <header v-if=\"$slots.header\" :class=\"cn(gutter ? 'px-4 sm:px-6 3xl:px-8' : undefined)\">\n      <slot name=\"header\" />\n    </header>\n\n    <div\n      :class=\"\n        cn(\n          'mx-auto w-full max-w-prose flex-1',\n          gutter ? 'px-4 sm:px-6 3xl:px-8' : undefined,\n          'py-8 sm:py-12',\n        )\n      \"\n    >\n      <slot />\n    </div>\n\n    <footer v-if=\"$slots.footer\" :class=\"cn(gutter ? 'px-4 sm:px-6 3xl:px-8' : undefined)\">\n      <slot name=\"footer\" />\n    </footer>\n  </div>\n</template>\n"],"mappings":""}

package/dist/layouts/reading/src/Reading.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Reading.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../../packages/layouts/reading/src/Reading.vue"],"sourcesContent":["<script lang=\"ts\">\n/** Whether the layout carries horizontal gutters that widen at wider breakpoints. */\nexport type ReadingGutter = boolean;\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Whether to add horizontal gutters that widen at wider breakpoints. */\n    gutter?: ReadingGutter;\n  }>(),\n  { gutter: true },\n);\n</script>\n\n<template>\n  <!--\n    Reading — a long-form reading layout that caps the content area at a\n    comfortable line length (~65ch). The header and footer span full-width\n    (site chrome, navigation, copyright), while only the reading content is\n    constrained to `max-w-prose` — the width that research identifies as the\n    fastest for sustained reading. Extra viewport on ultrawide monitors goes\n    to intentional whitespace, never to stretching lines.\n\n    The content wrapper is always prose-width with no prop: this layout exists\n    to enforce that cap. A reading layout that can go full-width is not a\n    reading layout. The `gutter` prop controls horizontal padding, not width.\n  -->\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <header v-if=\"$slots.header\" :class=\"cn(gutter ? 'px-4 sm:px-6 3xl:px-8' : undefined)\">\n      <slot name=\"header\" />\n    </header>\n\n    <div\n      :class=\"\n        cn(\n          'mx-auto w-full max-w-prose flex-1',\n          gutter ? 'px-4 sm:px-6 3xl:px-8' : undefined,\n          'py-8 sm:py-12',\n        )\n      \"\n    >\n      <slot />\n    </div>\n\n    <footer v-if=\"$slots.footer\" :class=\"cn(gutter ? 'px-4 sm:px-6 3xl:px-8' : undefined)\">\n      <slot name=\"footer\" />\n    </footer>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;GA8BE,OAAA,UAAA,GAAA,mBAoBM,OAAA,EApBA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,yBAAA,CAAA,EAAA,GAAA;IACCA,KAAAA,OAAO,UAArB,UAAA,GAAA,mBAES,UAAA;;KAFqB,OAAK,eAAE,MAAA,EAAA,CAAE,CAAC,QAAA,SAAM,0BAA6B,KAAA,CAAS,CAAA;IAClF,GAAA,CAAA,WAAsB,KAAA,QAAA,QAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA;IAGxB,mBAUM,OAAA,EATH,OAAK,eAAW,MAAA,EAAA,CAAE,CAAA,qCAA2D,QAAA,SAAM,0BAA6B,KAAA,GAAA,eAAA,CAAA,EAAA,GAAA,CAQjH,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA;IAGIA,KAAAA,OAAO,UAArB,UAAA,GAAA,mBAES,UAAA;;KAFqB,OAAK,eAAE,MAAA,EAAA,CAAE,CAAC,QAAA,SAAM,0BAA6B,KAAA,CAAS,CAAA;IAClF,GAAA,CAAA,WAAsB,KAAA,QAAA,QAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA"}

package/dist/layouts/settings/src/Settings.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Settings.js","names":[],"sources":["../../../../packages/layouts/settings/src/Settings.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Settings — a settings/preferences page layout: navigation sidebar + content\n * sections.\n *\n * The layout uses the same intrinsic flex-wrap collapse as the Sidebar\n * composition primitive. The nav panel gets a fixed flex-basis and the content\n * area gets `flex-grow: 999`, so when the container cannot fit the content's\n * `min-width: 50%`, the pair wraps onto separate lines — the nav keeps its\n * declared width on the line above the content. No media query, no JavaScript\n * — the layout derives its own breakpoint from the container's width.\n *\n * The nav panel recedes into the sunken elevation layer so the content reads as\n * the work surface. The content area scrolls independently so long settings\n * pages stay navigable without the nav scrolling out of view.\n */\nexport type SettingsNavWidth = string;\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Width for the navigation panel (e.g. \"12rem\"). */\n    navWidth?: SettingsNavWidth;\n  }>(),\n  { navWidth: \"12rem\" },\n);\n</script>\n\n<template>\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header is full-width and above the nav+content row, so a title bar\n      or breadcrumb never competes for horizontal space with the nav panel.\n    -->\n    <header v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      `flex-wrap: wrap` is the intrinsic collapse mechanism. When the content\n      panel can't fit its `min-width: 50%`, the pair wraps onto separate lines\n      — the nav keeps its declared `navWidth` on the line above the content,\n      and the content takes the whole next line. No media query; the layout\n      derives its own breakpoint from the container's width.\n    -->\n    <div :class=\"cn('flex flex-1 flex-row')\" :style=\"{ flexWrap: 'wrap' }\">\n      <!--\n        The nav panel: fixed-basis, no growth, no shrink. It does not yield\n        width to the content area and never compresses — when the container\n        is too narrow for both, it wraps to its own line at this declared\n        width rather than shrinking. Sunken elevation marks it as chrome,\n        not work surface.\n      -->\n      <nav\n        :style=\"{\n          flexBasis: navWidth,\n          flexGrow: 0,\n          flexShrink: 0,\n        }\"\n        :class=\"cn('bg-sunken w-full p-2')\"\n      >\n        <slot name=\"nav\" />\n      </nav>\n\n      <!--\n        The content area takes all remaining space (`flex-grow: 999`) when the\n        container is wide enough. Its `min-width: 50%` triggers wrapping below\n        tablet-like widths. It scrolls independently so long settings pages\n        stay navigable without the nav scrolling out of view. Gutters widen at\n        wider breakpoints so ultrawide viewports add whitespace rails rather\n        than stretching lines.\n      -->\n      <div\n        :style=\"{\n          flexBasis: 0,\n          flexGrow: 999,\n          flexShrink: 1,\n          minWidth: '50%',\n        }\"\n        :class=\"cn('bg-background min-w-0 flex-1 overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n      >\n        <slot />\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":""}

package/dist/layouts/settings/src/Settings.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Settings.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../../packages/layouts/settings/src/Settings.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Settings — a settings/preferences page layout: navigation sidebar + content\n * sections.\n *\n * The layout uses the same intrinsic flex-wrap collapse as the Sidebar\n * composition primitive. The nav panel gets a fixed flex-basis and the content\n * area gets `flex-grow: 999`, so when the container cannot fit the content's\n * `min-width: 50%`, the pair wraps onto separate lines — the nav keeps its\n * declared width on the line above the content. No media query, no JavaScript\n * — the layout derives its own breakpoint from the container's width.\n *\n * The nav panel recedes into the sunken elevation layer so the content reads as\n * the work surface. The content area scrolls independently so long settings\n * pages stay navigable without the nav scrolling out of view.\n */\nexport type SettingsNavWidth = string;\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Width for the navigation panel (e.g. \"12rem\"). */\n    navWidth?: SettingsNavWidth;\n  }>(),\n  { navWidth: \"12rem\" },\n);\n</script>\n\n<template>\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header is full-width and above the nav+content row, so a title bar\n      or breadcrumb never competes for horizontal space with the nav panel.\n    -->\n    <header v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      `flex-wrap: wrap` is the intrinsic collapse mechanism. When the content\n      panel can't fit its `min-width: 50%`, the pair wraps onto separate lines\n      — the nav keeps its declared `navWidth` on the line above the content,\n      and the content takes the whole next line. No media query; the layout\n      derives its own breakpoint from the container's width.\n    -->\n    <div :class=\"cn('flex flex-1 flex-row')\" :style=\"{ flexWrap: 'wrap' }\">\n      <!--\n        The nav panel: fixed-basis, no growth, no shrink. It does not yield\n        width to the content area and never compresses — when the container\n        is too narrow for both, it wraps to its own line at this declared\n        width rather than shrinking. Sunken elevation marks it as chrome,\n        not work surface.\n      -->\n      <nav\n        :style=\"{\n          flexBasis: navWidth,\n          flexGrow: 0,\n          flexShrink: 0,\n        }\"\n        :class=\"cn('bg-sunken w-full p-2')\"\n      >\n        <slot name=\"nav\" />\n      </nav>\n\n      <!--\n        The content area takes all remaining space (`flex-grow: 999`) when the\n        container is wide enough. Its `min-width: 50%` triggers wrapping below\n        tablet-like widths. It scrolls independently so long settings pages\n        stay navigable without the nav scrolling out of view. Gutters widen at\n        wider breakpoints so ultrawide viewports add whitespace rails rather\n        than stretching lines.\n      -->\n      <div\n        :style=\"{\n          flexBasis: 0,\n          flexGrow: 999,\n          flexShrink: 1,\n          minWidth: '50%',\n        }\"\n        :class=\"cn('bg-background min-w-0 flex-1 overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n      >\n        <slot />\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;GAgCE,OAAA,UAAA,GAAA,mBAuDM,OAAA,EAvDA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,yBAAA,CAAA,EAAA,GAAA,CAKCA,KAAAA,OAAO,UAArB,UAAA,GAAA,mBAES,UAAA,YAAA,CADP,WAAsB,KAAA,QAAA,QAAA,CAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAUxB,mBAsCM,OAAA;IAtCA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,sBAAA,CAAA;IAA2B,OAAO,EAAA,UAAA,OAAA;GAQ/C,GAAA,CAAA,mBASM,OAAA;IARH,OAAK,eAAA;KAAyB,WAAA,QAAA;;;;IAK9B,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,sBAAA,CAAA;GAEV,GAAA,CAAA,WAAmB,KAAA,QAAA,KAAA,CAAA,GAAA,CAAA,GAWrB,mBAUM,OAAA;IATH,OAAO;;;;;IAKP;IACA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,oEAAA,CAAA;GAEV,GAAA,CAAA,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA,CAAA,GAAA,CAAA"}

package/dist/layouts/split-layout/src/SplitLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SplitLayout.js","names":[],"sources":["../../../../packages/layouts/split-layout/src/SplitLayout.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * SplitLayout — full-page two-panel layout with intrinsic collapse.\n *\n * A SplitLayout extends the Split composition primitive's intrinsic collapse\n * into a full-page application shell: a side panel and a main content area,\n * with an optional full-width header above. It is the layout a two-column\n * application reaches for — a settings page with a nav rail, a documentation\n * site with a sidebar, a chat interface with a contact list.\n *\n * The intrinsic collapse from the Split composition primitive is reused\n * directly — `flex-wrap` plus a `min-width: 50%` guard on the content panel —\n * so the layout derives its own breakpoint from the container's width rather\n * than a viewport media query. Below the collapse width the panels stack\n * vertically; the side panel sits above the content when `side` is `\"left\"`,\n * below it when `side` is `\"right\"`.\n *\n * The header slot spans the full width, above the split row, so an application\n * header bar stays visible regardless of collapse state. Both panels carry\n * gutters that widen at wider breakpoints, so ultrawide viewports add\n * whitespace rails rather than stretching lines of text.\n */\nexport type SplitLayoutGap = \"sm\" | \"md\" | \"lg\" | \"none\";\n\nconst gapClass: Record<Exclude<SplitLayoutGap, \"none\">, string> = {\n  sm: \"gap-2 sm:gap-3\",\n  md: \"gap-3 sm:gap-4\",\n  lg: \"gap-4 sm:gap-6\",\n} as const;\n\nexport { gapClass };\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Which side the primary panel sits on. Controls stacking order when collapsed: \"left\" stacks the side panel above, \"right\" stacks it below. */\n    side?: \"left\" | \"right\";\n    /** Minimum width for the side panel (e.g. \"16rem\"). The content area takes the rest. */\n    minSideWidth?: string;\n    /** Gap between panels. Tightens one notch below sm (except \"none\"). */\n    gap?: SplitLayoutGap;\n  }>(),\n  { side: \"left\", minSideWidth: \"16rem\", gap: \"none\" },\n);\n</script>\n\n<template>\n  <!--\n    The root is a full-height column so the header can span the top while the\n    split row fills the rest. `min-h-dvh` makes the layout at least one\n    viewport tall even when content is short, so the side panel background\n    fills the screen rather than stopping at the content's natural height.\n  -->\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header spans the full width, above the split row. It is not sticky\n      here — that is the host's decision, because whether an application\n      header pins depends on the content below it.\n    -->\n    <header v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      `flex-wrap: wrap` is the intrinsic collapse mechanism. When the content\n      panel cannot honour its `min-width: 50%`, both panels wrap to full-width\n      — the side panel stacks above or below the content depending on `side`.\n      No media query; the layout derives its own breakpoint from the\n      container's width.\n    -->\n    <div\n      :class=\"cn('flex flex-1 flex-row', gap !== 'none' ? gapClass[gap] : undefined)\"\n      :style=\"{ flexWrap: 'wrap' }\"\n    >\n      <!--\n        Document order follows `side`, so screen-reader order matches the\n        visual one and the wrapped stack never contradicts the row: content\n        first when `side=\"right\"` (stack: content above, panel below), side\n        first when `side=\"left\"`. flex-row (never reverse) plus this ordering\n        is what makes the wrap produce content-above-panel for `side=\"right\"`.\n      -->\n      <template v-if=\"side === 'right'\">\n        <!-- Content: takes all remaining space (flex-grow: 999); its\n             min-width: 50% triggers wrapping below tablet-like widths. Scrolls\n             independently so long content never pushes the panel off-screen. -->\n        <div\n          :style=\"{\n            flexBasis: 0,\n            flexGrow: 999,\n            flexShrink: 1,\n            minWidth: '50%',\n          }\"\n          :class=\"cn('bg-background overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot />\n        </div>\n        <!-- The side panel holds a fixed basis and does not grow; the sunken\n             elevation makes the content read as the work surface above\n             navigation chrome. -->\n        <div\n          :style=\"{\n            flexBasis: minSideWidth,\n            flexGrow: 0,\n            flexShrink: 0,\n            minWidth: minSideWidth,\n          }\"\n          :class=\"cn('bg-sunken w-full px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot name=\"side\" />\n        </div>\n      </template>\n      <template v-else>\n        <!-- The side panel holds a fixed basis and does not grow; the sunken\n             elevation makes the content read as the work surface above\n             navigation chrome. -->\n        <div\n          :style=\"{\n            flexBasis: minSideWidth,\n            flexGrow: 0,\n            flexShrink: 0,\n            minWidth: minSideWidth,\n          }\"\n          :class=\"cn('bg-sunken w-full px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot name=\"side\" />\n        </div>\n        <!-- Content: takes all remaining space (flex-grow: 999); its\n             min-width: 50% triggers wrapping below tablet-like widths. Scrolls\n             independently so long content never pushes the panel off-screen. -->\n        <div\n          :style=\"{\n            flexBasis: 0,\n            flexGrow: 999,\n            flexShrink: 1,\n            minWidth: '50%',\n          }\"\n          :class=\"cn('bg-background overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot />\n        </div>\n      </template>\n    </div>\n  </div>\n</template>\n"],"mappings":""}

package/dist/layouts/split-layout/src/SplitLayout.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SplitLayout.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../../packages/layouts/split-layout/src/SplitLayout.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * SplitLayout — full-page two-panel layout with intrinsic collapse.\n *\n * A SplitLayout extends the Split composition primitive's intrinsic collapse\n * into a full-page application shell: a side panel and a main content area,\n * with an optional full-width header above. It is the layout a two-column\n * application reaches for — a settings page with a nav rail, a documentation\n * site with a sidebar, a chat interface with a contact list.\n *\n * The intrinsic collapse from the Split composition primitive is reused\n * directly — `flex-wrap` plus a `min-width: 50%` guard on the content panel —\n * so the layout derives its own breakpoint from the container's width rather\n * than a viewport media query. Below the collapse width the panels stack\n * vertically; the side panel sits above the content when `side` is `\"left\"`,\n * below it when `side` is `\"right\"`.\n *\n * The header slot spans the full width, above the split row, so an application\n * header bar stays visible regardless of collapse state. Both panels carry\n * gutters that widen at wider breakpoints, so ultrawide viewports add\n * whitespace rails rather than stretching lines of text.\n */\nexport type SplitLayoutGap = \"sm\" | \"md\" | \"lg\" | \"none\";\n\nconst gapClass: Record<Exclude<SplitLayoutGap, \"none\">, string> = {\n  sm: \"gap-2 sm:gap-3\",\n  md: \"gap-3 sm:gap-4\",\n  lg: \"gap-4 sm:gap-6\",\n} as const;\n\nexport { gapClass };\n</script>\n\n<script setup lang=\"ts\">\nimport { cn } from \"@ecoma-io/loom-core\";\n\nwithDefaults(\n  defineProps<{\n    /** Which side the primary panel sits on. Controls stacking order when collapsed: \"left\" stacks the side panel above, \"right\" stacks it below. */\n    side?: \"left\" | \"right\";\n    /** Minimum width for the side panel (e.g. \"16rem\"). The content area takes the rest. */\n    minSideWidth?: string;\n    /** Gap between panels. Tightens one notch below sm (except \"none\"). */\n    gap?: SplitLayoutGap;\n  }>(),\n  { side: \"left\", minSideWidth: \"16rem\", gap: \"none\" },\n);\n</script>\n\n<template>\n  <!--\n    The root is a full-height column so the header can span the top while the\n    split row fills the rest. `min-h-dvh` makes the layout at least one\n    viewport tall even when content is short, so the side panel background\n    fills the screen rather than stopping at the content's natural height.\n  -->\n  <div :class=\"cn('min-h-dvh flex flex-col')\">\n    <!--\n      The header spans the full width, above the split row. It is not sticky\n      here — that is the host's decision, because whether an application\n      header pins depends on the content below it.\n    -->\n    <header v-if=\"$slots.header\">\n      <slot name=\"header\" />\n    </header>\n\n    <!--\n      `flex-wrap: wrap` is the intrinsic collapse mechanism. When the content\n      panel cannot honour its `min-width: 50%`, both panels wrap to full-width\n      — the side panel stacks above or below the content depending on `side`.\n      No media query; the layout derives its own breakpoint from the\n      container's width.\n    -->\n    <div\n      :class=\"cn('flex flex-1 flex-row', gap !== 'none' ? gapClass[gap] : undefined)\"\n      :style=\"{ flexWrap: 'wrap' }\"\n    >\n      <!--\n        Document order follows `side`, so screen-reader order matches the\n        visual one and the wrapped stack never contradicts the row: content\n        first when `side=\"right\"` (stack: content above, panel below), side\n        first when `side=\"left\"`. flex-row (never reverse) plus this ordering\n        is what makes the wrap produce content-above-panel for `side=\"right\"`.\n      -->\n      <template v-if=\"side === 'right'\">\n        <!-- Content: takes all remaining space (flex-grow: 999); its\n             min-width: 50% triggers wrapping below tablet-like widths. Scrolls\n             independently so long content never pushes the panel off-screen. -->\n        <div\n          :style=\"{\n            flexBasis: 0,\n            flexGrow: 999,\n            flexShrink: 1,\n            minWidth: '50%',\n          }\"\n          :class=\"cn('bg-background overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot />\n        </div>\n        <!-- The side panel holds a fixed basis and does not grow; the sunken\n             elevation makes the content read as the work surface above\n             navigation chrome. -->\n        <div\n          :style=\"{\n            flexBasis: minSideWidth,\n            flexGrow: 0,\n            flexShrink: 0,\n            minWidth: minSideWidth,\n          }\"\n          :class=\"cn('bg-sunken w-full px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot name=\"side\" />\n        </div>\n      </template>\n      <template v-else>\n        <!-- The side panel holds a fixed basis and does not grow; the sunken\n             elevation makes the content read as the work surface above\n             navigation chrome. -->\n        <div\n          :style=\"{\n            flexBasis: minSideWidth,\n            flexGrow: 0,\n            flexShrink: 0,\n            minWidth: minSideWidth,\n          }\"\n          :class=\"cn('bg-sunken w-full px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot name=\"side\" />\n        </div>\n        <!-- Content: takes all remaining space (flex-grow: 999); its\n             min-width: 50% triggers wrapping below tablet-like widths. Scrolls\n             independently so long content never pushes the panel off-screen. -->\n        <div\n          :style=\"{\n            flexBasis: 0,\n            flexGrow: 999,\n            flexShrink: 1,\n            minWidth: '50%',\n          }\"\n          :class=\"cn('bg-background overflow-y-auto px-4 sm:px-6 3xl:px-8')\"\n        >\n          <slot />\n        </div>\n      </template>\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;AAwBA,IAAM,WAA4D;CAChE,IAAI;CACJ,IAAI;CACJ,IAAI;AACN;;;;;;;;;;GA4BE,OAAA,UAAA,GAAA,mBAyFM,OAAA,EAzFA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,yBAAA,CAAA,EAAA,GAAA,CAMCA,KAAAA,OAAO,UAArB,UAAA,GAAA,mBAES,UAAA,YAAA,CADP,WAAsB,KAAA,QAAA,QAAA,CAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAUxB,mBAuEM,OAAA;IAtEH,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,wBAAyB,QAAA,QAAG,SAAc,SAAS,QAAA,OAAO,KAAA,CAAS,CAAA;IAC5E,OAAO,EAAA,UAAA,OAAA;GASQ,GAAA,CAAA,QAAA,SAAI,WAApB,UAAA,GAAA,mBA6BW,UAAA,EAAA,KAAA,EAAA,GAAA,CAzBT,mBAUM,OAAA;IATH,OAAO;;;;;IAKP;IACA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,qDAAA,CAAA;GAEV,GAAA,CAAA,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,GAKV,mBAUM,OAAA;IATH,OAAK,eAAA;KAA2B,WAAA,QAAA;;;KAAwF,UAAA,QAAA;;IAMxH,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,wCAAA,CAAA;GAEV,GAAA,CAAA,WAAoB,KAAA,QAAA,MAAA,CAAA,GAAA,CAAA,CAAA,GAAA,EAAA,MAGxB,UAAA,GAAA,mBA6BW,UAAA,EAAA,KAAA,EAAA,GAAA,CAzBT,mBAUM,OAAA;IATH,OAAK,eAAA;KAA2B,WAAA,QAAA;;;KAAwF,UAAA,QAAA;;IAMxH,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,wCAAA,CAAA;GAEV,GAAA,CAAA,WAAoB,KAAA,QAAA,MAAA,CAAA,GAAA,CAAA,GAKtB,mBAUM,OAAA;IATH,OAAO;;;;;IAKP;IACA,OAAK,eAAE,MAAA,EAAA,CAAE,CAAA,qDAAA,CAAA;GAEV,GAAA,CAAA,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,CAAA,CAAA,GAAA,CAAA"}

package/dist/packages/composition/dashboard-grid/src/DashboardGrid.vue.d.ts

@@ -0,0 +1,26 @@
+/** The gutter step — the same scale Stack's gap steps mirror. */
+export type DashboardGridGap = "sm" | "md" | "lg";
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
+    /** Narrowest a tile may get before the grid drops to fewer columns. Any valid CSS length (e.g. "14rem"). */
+    minTileWidth?: string;
+    /** Row/column gap step — mirrors Surface's `pad` scale at `sm` and up (sm 12px · md 16px · lg 24px); each step drops one notch below `sm`. */
+    gap?: "sm" | "md" | "lg";
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+    /** Narrowest a tile may get before the grid drops to fewer columns. Any valid CSS length (e.g. "14rem"). */
+    minTileWidth?: string;
+    /** Row/column gap step — mirrors Surface's `pad` scale at `sm` and up (sm 12px · md 16px · lg 24px); each step drops one notch below `sm`. */
+    gap?: "sm" | "md" | "lg";
+}> & Readonly<{}>, {
+    gap: "sm" | "md" | "lg";
+    minTileWidth: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {}) => any;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+//# sourceMappingURL=DashboardGrid.vue.d.ts.map

package/dist/packages/composition/dashboard-grid/src/DashboardGrid.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardGrid.vue.d.ts","sourceRoot":"","sources":["../../../../../packages/composition/dashboard-grid/src/DashboardGrid.vue"],"names":[],"mappings":"AA4DA,iEAAiE;AACjE,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;wBAC7B,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAqBd,4GAA4G;mBAC7F,MAAM;IACrB,8IAA8I;UACxI,IAAI,GAAG,IAAI,GAAG,IAAI;;IAHxB,4GAA4G;mBAC7F,MAAM;IACrB,8IAA8I;UACxI,IAAI,GAAG,IAAI,GAAG,IAAI;;SAAlB,IAAI,GAAG,IAAI,GAAG,IAAI;kBAFT,MAAM;;cAiDX,CAAC,KAAK,IAAgB,KAAK,GAAG;EAUxC,CAAC;AAWL,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/packages/composition/dashboard-grid/src/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../packages/composition/dashboard-grid/src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC"}

package/dist/packages/composition/split/src/Split.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Split.vue.d.ts","sourceRoot":"","sources":["../../../../../packages/composition/split/src/Split.vue"],"names":[],"mappings":"AAkIA;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC;AAEzC,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAEnD,QAAA,MAAM,QAAQ,EAAE,MAAM,CAAC,OAAO,CAAC,QAAQ,EAAE,MAAM,CAAC,EAAE,MAAM,CAI9C,CAAC;AAEX,OAAO,EAAE,QAAQ,EAAE,CAAC;wBACC,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAEd,kIAAkI;WAC3H,SAAS;IAChB,wFAAwF;mBACzE,MAAM;IACrB,iFAAiF;UAC3E,QAAQ;;IALd,kIAAkI;WAC3H,SAAS;IAChB,wFAAwF;mBACzE,MAAM;IACrB,iFAAiF;UAC3E,QAAQ;;SAAR,QAAQ;UAJP,SAAS;kBAED,MAAM;;cAiFX,CAAC,KAAK,IAAgB,KAAK,GAAG;;WACjC,CAAC,KAAK,IAAgB,KAAK,GAAG;;WAC9B,CAAC,KAAK,IAAgB,KAAK,GAAG;;cAC3B,CAAC,KAAK,IAAgB,KAAK,GAAG;EAUxC,CAAC;AAWL,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
+{"version":3,"file":"Split.vue.d.ts","sourceRoot":"","sources":["../../../../../packages/composition/split/src/Split.vue"],"names":[],"mappings":"AAwIA;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,OAAO,CAAC;AAEzC,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAEnD,QAAA,MAAM,QAAQ,EAAE,MAAM,CAAC,OAAO,CAAC,QAAQ,EAAE,MAAM,CAAC,EAAE,MAAM,CAI9C,CAAC;AAEX,OAAO,EAAE,QAAQ,EAAE,CAAC;wBACC,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAEd,kIAAkI;WAC3H,SAAS;IAChB,wFAAwF;mBACzE,MAAM;IACrB,iFAAiF;UAC3E,QAAQ;;IALd,kIAAkI;WAC3H,SAAS;IAChB,wFAAwF;mBACzE,MAAM;IACrB,iFAAiF;UAC3E,QAAQ;;SAAR,QAAQ;UAJP,SAAS;kBAED,MAAM;;cAiFX,CAAC,KAAK,IAAgB,KAAK,GAAG;;WACjC,CAAC,KAAK,IAAgB,KAAK,GAAG;;WAC9B,CAAC,KAAK,IAAgB,KAAK,GAAG;;cAC3B,CAAC,KAAK,IAAgB,KAAK,GAAG;EAUxC,CAAC;AAWL,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/packages/core/src/a11y-contract.d.ts

@@ -0,0 +1,417 @@
+/**
+ * The role-aware accessibility evidence contract: what a component OWES, not
+ * what the library asserts.
+ *
+ * `a11y-scope.ts` partitions the 70 WCAG-tagged rules into the tiers that can
+ * judge them. That partition is library-wide — it says nothing about any one
+ * component, and a purely visual span ends up with exactly the evidence
+ * obligation of a focusable, labelled control. This file is the per-component
+ * half: a closed role vocabulary, the evidence tiers a role must answer, and
+ * the matrix binding each role to the requirements its claim has to satisfy.
+ *
+ * Three readers, one source:
+ *
+ * - `tools/check-a11y-evidence.ts` and `tools/check-interaction-evidence.ts`,
+ *   the gates for the two axes, read this file AS DATA — parsed, never
+ *   imported. The tooling layer's boundary row (layer-tooling) forbids
+ *   importing the library it checks, and a checker that executed its subject
+ *   could not report on a tree that will not load. Each parse is fail-closed:
+ *   a contract a gate cannot read is a lint failure, not an empty verdict.
+ * - `packages/loom/src/a11y.ts` re-exports the role vocabulary and the type,
+ *   so a consumer or a docs page reads the same law the gate enforces. The
+ *   interaction vocabulary is not re-exported from the public surface yet —
+ *   its readers today are the gate, the pin test and the docs build, and an
+ *   export nobody consumes is a public promise with no reader.
+ * - `packages/core/tests/a11y-contract.test.ts` pins the law's internal
+ *   consistency on both axes: no matrix row for a role or class outside its
+ *   vocabulary, no requirement id without a definition, no requirement in an
+ *   unknown tier.
+ *
+ * The component's own declaration lives beside it, in
+ * `packages/<tier>/<name>/a11y.json` — one sidecar per component, the sixth
+ * artifact `tools/check-a11y-evidence.ts` asserts. THE CLAIM IS DECLARED, NOT
+ * DERIVED: Reka injects ARIA roles at runtime, so no reader can derive a
+ * component's role from its source with confidence. The sidecar declares it,
+ * cites the rendered evidence for the claim (`basis`), declares the evidence
+ * files that exist today, and records an `exceptions` entry — requirement id
+ * plus reason — for every matrix requirement nothing answers yet. The gate
+ * counts and names those exceptions instead of failing the repository, so the
+ * contract lands truthfully and the exception list shrinks as evidence grows.
+ *
+ * The sidecar now carries a SECOND axis beside the role claim: the
+ * interaction class. Phase 3D reserved room here for exactly this — the same
+ * sidecar, a second axis, not a second file — which is why `role` was held
+ * orthogonal to evidence and exceptions rather than folded into them. The
+ * interaction half is defined at the bottom of this file, and
+ * `tools/check-interaction-evidence.ts` is its validator.
+ *
+ * Every collection below is a flat `as const` array of records — the shape the
+ * gates' parsers and the pin test all rely on. Keep new fields string- or
+ * array-valued and entry objects brace-free.
+ */
+/**
+ * The three evidence tiers, using `a11y-scope.ts`'s own vocabulary for the
+ * same three runtimes: the browserless jsdom demo sweep, the component
+ * harness's browser specs, and the root sweep over the built site.
+ */
+export declare const A11Y_EVIDENCE_TIERS: readonly ["browserless", "harness", "sweep"];
+/**
+ * The closed ARIA role vocabulary a component may claim. Every member is a
+ * real ARIA role — the one whose AT contract the component's own markup
+ * asserts, native or injected: a native `<button>`, Reka's `role="dialog"`
+ * content, an explicit `role="list"` wrapper. Composite widgets claim the
+ * container role (tabs → tablist, select → combobox, tree-view → tree); the
+ * `basis` field of each sidecar names the parts that make the claim true.
+ */
+export declare const ARIA_ROLES: readonly ["alert", "alertdialog", "button", "checkbox", "combobox", "dialog", "grid", "group", "img", "link", "list", "menu", "menubar", "meter", "navigation", "progressbar", "radiogroup", "region", "searchbox", "separator", "slider", "spinbutton", "status", "switch", "tablist", "table", "textbox", "toolbar", "tooltip", "tree"];
+/**
+ * The two non-role members. `none` — the component asserts no ARIA role of
+ * its own: its semantics are native landmarks, flow content or slotted
+ * children. `visual-only` — presentational by design, removed from the
+ * accessibility tree or carrying nothing a reader should hear; its only
+ * obligation is to not assert broken ARIA while hiding.
+ */
+export declare const NON_ROLE_MEMBERS: readonly ["none", "visual-only"];
+/** The role vocabulary the sidecar's `role` field is held to. */
+export declare const A11Y_ROLES: readonly ["alert", "alertdialog", "button", "checkbox", "combobox", "dialog", "grid", "group", "img", "link", "list", "menu", "menubar", "meter", "navigation", "progressbar", "radiogroup", "region", "searchbox", "separator", "slider", "spinbutton", "status", "switch", "tablist", "table", "textbox", "toolbar", "tooltip", "tree", "none", "visual-only"];
+/**
+ * The evidence requirements — one row per family of WCAG-tagged rules, named
+ * for the obligation rather than the implementation so the matrix reads as
+ * law. `tier` is where the claim must be ANSWERED; `answers` names the axe
+ * rules of `a11y-scope.ts` the family covers, or the bespoke suite where axe
+ * ships no rule for the criterion (2.4.11 has none, which is why
+ * `e2e/focus-not-obscured.e2e.ts` exists at all).
+ *
+ * The families deliberately do not cover the whole partition — 27 of the 68
+ * runtime-tier rules are named by no family, and the absence is recorded
+ * rather than hidden, the way TAGGED_BUT_DISABLED_RULES records its own two:
+ *
+ * - host-document facts a consumer's page answers, not a component:
+ *   `aria-hidden-body`, `bypass`, `document-title`, `html-has-lang`,
+ *   `html-lang-valid`, `html-xml-lang-mismatch`, `meta-refresh`,
+ *   `meta-viewport`, `valid-lang`;
+ * - elements no Loom component ships: `blink`, `frame-focusable-content`,
+ *   `frame-title`, `frame-title-unique`, `input-button-name`, `marquee`,
+ *   `no-autoplay-audio`, `object-alt`, `server-side-image-map`,
+ *   `summary-name`, `video-caption`;
+ * - attributes whose truth belongs to the host, not the component:
+ *   `aria-braille-equivalent` (no Loom component emits a braille equivalent
+ *   today) and `autocomplete-valid` (the token is forwarded unchanged by
+ *   combobox, editable, tags-input, text-field and command — the rule judges
+ *   whether the host chose the right token for its field, which no component
+ *   can answer for);
+ * - consumer styling, not component markup: `avoid-inline-spacing`;
+ * - conservative-partial table geometry, run by the sweep site-wide but owed
+ *   by no role's row per-component: `table-fake-caption`, `td-has-header`,
+ *   `td-headers-attr`, `th-has-data-cells`.
+ *
+ * The sweep runs all 68 site-wide regardless, so an uncovered rule is still
+ * exercised on every page — what no role owes is per-component accountability.
+ * The coverage set is pinned by packages/core/tests/a11y-contract.test.ts: a
+ * rule that moves into or out of a family must edit that pin and this list
+ * together.
+ */
+export declare const A11Y_EVIDENCE_REQUIREMENTS: readonly [{
+    readonly id: "semantic-aria";
+    readonly tier: "browserless";
+    readonly answers: readonly ["aria-roles", "aria-required-attr", "aria-valid-attr", "aria-valid-attr-value", "aria-allowed-attr", "aria-conditional-attr", "aria-prohibited-attr", "aria-deprecated-role", "aria-roledescription", "aria-required-children", "aria-required-parent", "duplicate-id-aria", "nested-interactive"];
+}, {
+    readonly id: "name";
+    readonly tier: "browserless";
+    readonly answers: readonly ["button-name", "link-name", "label", "form-field-multiple-labels", "aria-input-field-name", "aria-command-name", "aria-toggle-field-name", "aria-meter-name", "aria-progressbar-name", "aria-tab-name", "aria-tooltip-name", "select-name", "image-alt", "svg-img-alt", "role-img-alt", "input-image-alt", "area-alt"];
+}, {
+    readonly id: "structure";
+    readonly tier: "browserless";
+    readonly answers: readonly ["list", "listitem", "definition-list", "dlitem"];
+}, {
+    readonly id: "keyboard";
+    readonly tier: "harness";
+    readonly answers: readonly ["aria-hidden-focus", "scrollable-region-focusable"];
+}, {
+    readonly id: "contrast";
+    readonly tier: "sweep";
+    readonly answers: readonly ["color-contrast", "link-in-text-block", "p-as-heading", "label-content-name-mismatch"];
+}, {
+    readonly id: "target-size";
+    readonly tier: "sweep";
+    readonly answers: readonly ["target-size"];
+}, {
+    readonly id: "focus-not-obscured";
+    readonly tier: "sweep";
+    readonly answers: readonly ["e2e/focus-not-obscured.e2e.ts (WCAG 2.4.11 — axe-core ships no rule for it)"];
+}];
+/**
+ * The matrix: the role's row is the claim it must satisfy. Shared shapes are
+ * spelled out once per role rather than DRYed into inheritance — the matrix is
+ * law, and a law a reader cannot read whole is a law a reader cannot argue
+ * with. `semantic-aria` is the universal floor: every role owes it, including
+ * visual-only, because an aria-hidden skeleton asserting a broken role is
+ * still a defect.
+ */
+export declare const A11Y_EVIDENCE_MATRIX: readonly [{
+    readonly role: "visual-only";
+    readonly requirements: readonly ["semantic-aria"];
+}, {
+    readonly role: "none";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast"];
+}, {
+    readonly role: "img";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast"];
+}, {
+    readonly role: "separator";
+    readonly requirements: readonly ["semantic-aria", "contrast"];
+}, {
+    readonly role: "alert";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast"];
+}, {
+    readonly role: "status";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast"];
+}, {
+    readonly role: "meter";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast"];
+}, {
+    readonly role: "progressbar";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast"];
+}, {
+    readonly role: "tooltip";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast"];
+}, {
+    readonly role: "list";
+    readonly requirements: readonly ["semantic-aria", "name", "structure", "contrast"];
+}, {
+    readonly role: "tree";
+    readonly requirements: readonly ["semantic-aria", "name", "structure", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "table";
+    readonly requirements: readonly ["semantic-aria", "name", "structure", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "grid";
+    readonly requirements: readonly ["semantic-aria", "name", "structure", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "region";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "navigation";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "button";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "link";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "checkbox";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "switch";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "radiogroup";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "slider";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "spinbutton";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "textbox";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "combobox";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "searchbox";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "menu";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "menubar";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "toolbar";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "tablist";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "dialog";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "alertdialog";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}, {
+    readonly role: "group";
+    readonly requirements: readonly ["semantic-aria", "name", "contrast", "keyboard", "target-size", "focus-not-obscured"];
+}];
+/** A member of the closed role vocabulary. */
+export type A11yRole = (typeof A11Y_ROLES)[number];
+/** A pure ARIA role, as distinct from the non-role members. */
+export type AriaRole = (typeof ARIA_ROLES)[number];
+/** One evidence runtime: browserless jsdom, component harness, or the root sweep. */
+export type A11yEvidenceTier = (typeof A11Y_EVIDENCE_TIERS)[number];
+/** A requirement the matrix can demand. */
+export type A11yRequirementId = (typeof A11Y_EVIDENCE_REQUIREMENTS)[number]["id"];
+/**
+ * One declared piece of evidence. A plain string is a repository-root-relative
+ * path the gate verifies exists; an object is the same path plus the `because`
+ * a tier the role's row does not demand must carry.
+ */
+export type A11yEvidenceEntry = string | {
+    path: string;
+    because?: string;
+};
+/**
+ * The sidecar — the declared claim `packages/<tier>/<name>/a11y.json` must
+ * satisfy. `basis` is the reviewer's handle on the role claim: the rendered
+ * element or injected role that makes it true. `evidence` is keyed by tier,
+ * because the tiers are what the sweep, harness and jsdom run over — a
+ * requirement is answered by its tier's evidence, not by a per-rule file
+ * list. `exceptions` carries the matrix requirements nothing answers yet,
+ * each with the reason it is missing.
+ */
+export interface A11yContract {
+    /** The claimed role, from {@link A11Y_ROLES}. */
+    role: A11yRole;
+    /** The rendered fact the role claim rests on — what a reviewer checks. */
+    basis: string;
+    /** Evidence that exists today, by tier. Paths are repository-root-relative. */
+    evidence: Partial<Record<A11yEvidenceTier, readonly A11yEvidenceEntry[]>>;
+    /** Matrix requirements this component does not answer yet, each with its reason. */
+    exceptions?: readonly {
+        requirement: A11yRequirementId;
+        because: string;
+    }[];
+}
+/**
+ * The closed interaction-class vocabulary — the second axis of the same
+ * sidecar, kept in this file so the two claims cannot drift apart. Each word
+ * names the interaction contract the component OWNS, which is a smaller thing
+ * than the interaction it makes possible: a layout slots buttons into itself,
+ * but it owns none of their contract.
+ *
+ * - `interactive` — ONE operable target of the component's own: activate,
+ *   adjust, type into. A button, a checkbox, a text field, a link.
+ * - `composite` — SEVERAL operable parts the component manages as one: the
+ *   traversal among them, the focus routing, the open/close state. A
+ *   combobox, a tablist, a menu, a dialog, a tree.
+ * - `container` — operates nothing itself; its own contract is the surface it
+ *   puts around operable content. Keyboard passage through it must not trap,
+ *   and its own scroll, collapse or resize behaviour must answer the keyboard
+ *   too. A card, a scroll area, an app shell, a fieldset.
+ * - `visual-only` — presents and wraps; nothing in it operates, takes focus
+ *   or reports an interactive state of its own, by design. A skeleton, a
+ *   badge, a meter, a flex wrapper.
+ *
+ * Two revealed surfaces that look like twins land in different classes on
+ * purpose: a hover-card is `container` and a tooltip is `visual-only`. The
+ * hover-card keeps a real, focusable, dismissible surface around content a
+ * reader operates into; the tooltip is an announcement with nothing inside
+ * it to operate. A component that could sit in either row takes the class
+ * that demands more — the conservative direction costs a duty, the lenient
+ * one forgives one.
+ *
+ * The class is declared, not derived, for the reason the role claim is: the
+ * class is a fact about the contract the component's source owns, and no
+ * reader can reconstruct it with confidence. Each sidecar's interaction claim
+ * carries a `basis` naming the fact that puts the component in its class —
+ * the reviewer's handle, the same one the role claim keeps.
+ */
+export declare const INTERACTION_CLASSES: readonly ["interactive", "composite", "container", "visual-only"];
+/**
+ * The two runtimes that can witness an interaction duty. Same tiers, same
+ * vocabulary, as {@link A11Y_EVIDENCE_TIERS} — a keypress is a browser fact
+ * and a rendered state is a jsdom fact, exactly as the role axis has it. The
+ * sweep tier is absent on purpose: no duty below is a page-geometry fact, so
+ * a sweep citation would be evidence by adjacency, which is the fabricated
+ * kind.
+ */
+export declare const INTERACTION_EVIDENCE_TIERS: readonly ["browserless", "harness"];
+/**
+ * The interaction duties — one row per family of interaction obligations,
+ * named for the obligation rather than the implementation. `tier` is where
+ * the duty must be ANSWERED; `answers` is prose rather than a rule list,
+ * because no axe rule judges an interaction contract — these duties are what
+ * the component's own specs exist to witness.
+ *
+ * Three duties, and no reduced-motion row — a deliberate absence, recorded
+ * rather than hidden. Animation is a per-component fact none of the four
+ * class words carries, and the root reduced-motion suite reaches four pages
+ * today (dialog, drawer, toast, skeleton), so a class row demanding it would
+ * be a duty nothing in the vocabulary could answer honestly. A per-component
+ * motion duty — a declared `animates` fact answered through that suite's
+ * growing population — is the tranche work this axis opens; it lands as a row
+ * edit plus suite growth in one PR, the way every other row change must.
+ */
+export declare const INTERACTION_REQUIREMENTS: readonly [{
+    readonly id: "keyboard-operate";
+    readonly tier: "harness";
+    readonly answers: readonly ["the component's keyboard contract — its own keys, or keyboard passage through its surface — witnessed as gestures in a browser by its own harness spec (WCAG 2.1.1)"];
+}, {
+    readonly id: "state-report";
+    readonly tier: "browserless";
+    readonly answers: readonly ["the states a component renders — disabled, readonly, busy, expanded, selected — reaching the DOM where the unit tier can pin them (WCAG 4.1.2)"];
+}, {
+    readonly id: "keyboard-inert";
+    readonly tier: "browserless";
+    readonly answers: readonly ["the absence of an interaction surface: nothing in a visual-only component takes focus or a key (WCAG 2.1.1 vacuously, 2.4.3 actually) — a pin of absence, worthless asserted in prose"];
+}];
+/**
+ * The interaction matrix: the class's row is the claim it must satisfy, the
+ * role matrix's discipline on the second axis. `keyboard-inert` is
+ * visual-only's whole row because "nothing operates here" is itself a
+ * contract — the one an aria-hidden placeholder that steals a tab stop breaks
+ * — and an absence nobody pins is an absence nobody would notice breaking.
+ */
+export declare const INTERACTION_MATRIX: readonly [{
+    readonly class: "interactive";
+    readonly requirements: readonly ["keyboard-operate", "state-report"];
+}, {
+    readonly class: "composite";
+    readonly requirements: readonly ["keyboard-operate", "state-report"];
+}, {
+    readonly class: "container";
+    readonly requirements: readonly ["keyboard-operate"];
+}, {
+    readonly class: "visual-only";
+    readonly requirements: readonly ["keyboard-inert"];
+}];
+/** A member of the closed interaction-class vocabulary. */
+export type InteractionClass = (typeof INTERACTION_CLASSES)[number];
+/** A runtime that can witness an interaction duty. */
+export type InteractionEvidenceTier = (typeof INTERACTION_EVIDENCE_TIERS)[number];
+/** A duty the interaction matrix can demand. */
+export type InteractionRequirementId = (typeof INTERACTION_REQUIREMENTS)[number]["id"];
+/**
+ * One declared piece of interaction evidence. A plain string is a
+ * repository-root-relative path the gate verifies exists; an object is the
+ * same path plus the `because` that narrows what the file witnesses — and a
+ * qualified entry answers no duty.
+ */
+export type InteractionEvidenceEntry = string | {
+    path: string;
+    because?: string;
+};
+/**
+ * The `interaction` claim `packages/<tier>/<name>/a11y.json` carries beside
+ * its `role` claim — the second axis in the same sidecar, not a second file,
+ * the reservation at the top of this file kept. Same doctrine as the role
+ * claim: declared, cited where the evidence exists, and excepted with a
+ * reason where it does not, so the contract lands truthfully and shrinks as
+ * the harness-spec tranche lands.
+ */
+export interface InteractionContract {
+    /** The claimed interaction class, from {@link INTERACTION_CLASSES}. */
+    class: InteractionClass;
+    /** The fact the class claim rests on — what a reviewer checks. */
+    basis: string;
+    /** Evidence that exists today, by tier. Paths are repository-root-relative. */
+    evidence: Partial<Record<InteractionEvidenceTier, readonly InteractionEvidenceEntry[]>>;
+    /** Matrix duties this component does not answer yet, each with its reason. */
+    exceptions?: readonly {
+        requirement: InteractionRequirementId;
+        because: string;
+    }[];
+}
+//# sourceMappingURL=a11y-contract.d.ts.map

package/dist/packages/core/src/a11y-contract.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"a11y-contract.d.ts","sourceRoot":"","sources":["../../../../packages/core/src/a11y-contract.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkDG;AAEH;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,8CAA+C,CAAC;AAEhF;;;;;;;GAOG;AACH,eAAO,MAAM,UAAU,2UA+Bb,CAAC;AAEX;;;;;;GAMG;AACH,eAAO,MAAM,gBAAgB,kCAAmC,CAAC;AAEjE,iEAAiE;AACjE,eAAO,MAAM,UAAU,kWAAgD,CAAC;AAExE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,eAAO,MAAM,0BAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyE7B,CAAC;AAEX;;;;;;;GAOG;AACH,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuQvB,CAAC;AAEX,8CAA8C;AAC9C,MAAM,MAAM,QAAQ,GAAG,CAAC,OAAO,UAAU,CAAC,CAAC,MAAM,CAAC,CAAC;AAEnD,+DAA+D;AAC/D,MAAM,MAAM,QAAQ,GAAG,CAAC,OAAO,UAAU,CAAC,CAAC,MAAM,CAAC,CAAC;AAEnD,qFAAqF;AACrF,MAAM,MAAM,gBAAgB,GAAG,CAAC,OAAO,mBAAmB,CAAC,CAAC,MAAM,CAAC,CAAC;AAEpE,2CAA2C;AAC3C,MAAM,MAAM,iBAAiB,GAAG,CAAC,OAAO,0BAA0B,CAAC,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC;AAElF;;;;GAIG;AACH,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAE5E;;;;;;;;GAQG;AACH,MAAM,WAAW,YAAY;IAC3B,iDAAiD;IACjD,IAAI,EAAE,QAAQ,CAAC;IACf,0EAA0E;IAC1E,KAAK,EAAE,MAAM,CAAC;IACd,+EAA+E;IAC/E,QAAQ,EAAE,OAAO,CAAC,MAAM,CAAC,gBAAgB,EAAE,SAAS,iBAAiB,EAAE,CAAC,CAAC,CAAC;IAC1E,oFAAoF;IACpF,UAAU,CAAC,EAAE,SAAS;QAAE,WAAW,EAAE,iBAAiB,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CAC7E;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,eAAO,MAAM,mBAAmB,mEAKtB,CAAC;AAEX;;;;;;;GAOG;AACH,eAAO,MAAM,0BAA0B,qCAAsC,CAAC;AAE9E;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,wBAAwB;;;;;;;;;;;;EAsB3B,CAAC;AAEX;;;;;;GAMG;AACH,eAAO,MAAM,kBAAkB;;;;;;;;;;;;EAKrB,CAAC;AAEX,2DAA2D;AAC3D,MAAM,MAAM,gBAAgB,GAAG,CAAC,OAAO,mBAAmB,CAAC,CAAC,MAAM,CAAC,CAAC;AAEpE,sDAAsD;AACtD,MAAM,MAAM,uBAAuB,GAAG,CAAC,OAAO,0BAA0B,CAAC,CAAC,MAAM,CAAC,CAAC;AAElF,gDAAgD;AAChD,MAAM,MAAM,wBAAwB,GAAG,CAAC,OAAO,wBAAwB,CAAC,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC;AAEvF;;;;;GAKG;AACH,MAAM,MAAM,wBAAwB,GAAG,MAAM,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAEnF;;;;;;;GAOG;AACH,MAAM,WAAW,mBAAmB;IAClC,uEAAuE;IACvE,KAAK,EAAE,gBAAgB,CAAC;IACxB,kEAAkE;IAClE,KAAK,EAAE,MAAM,CAAC;IACd,+EAA+E;IAC/E,QAAQ,EAAE,OAAO,CAAC,MAAM,CAAC,uBAAuB,EAAE,SAAS,wBAAwB,EAAE,CAAC,CAAC,CAAC;IACxF,8EAA8E;IAC9E,UAAU,CAAC,EAAE,SAAS;QAAE,WAAW,EAAE,wBAAwB,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CACpF"}