@ponchia/ui 0.6.7 → 0.6.9

package/glyphs/glyphs.js

@@ -1518,17 +1518,34 @@ export function renderGlyph(name, options = {}) {
   if (!rows) return '';
   const { grid = true, solid = false, anim, label, dot, gap, render, size } = options;
 
+  if (render === 'mask') return renderMaskGlyph(rows, { label, size });
+
+  const cells = glyphCells(name);
+  const style = dotmatrixStyle({ solid, dot, gap });
+  const cls = dotmatrixClass(anim);
+  const stagger = anim === 'reveal';
+  const showPanel = grid && !solid;
+  const inner = cells
+    .map((cell, index) => renderGlyphCell(cell, index, { showPanel, stagger }))
+    .join('');
+
+  // A `<span>` (not `<div>`): it's phrasing content, so the glyph is valid
+  // inline and inside a `<button>` (its content model is phrasing-only) — the
+  // inline-icon use. `.ui-dotmatrix`'s `display: grid` works on a span.
+  return `<span class="${cls}" style="${style.join(';')}" ${a11yAttrs(label)}>${inner}</span>`;
+}
+
+function renderMaskGlyph(rows, { label, size }) {
   // One-node icon: a single `.ui-icon` span masked by the glyph's bitmap, so
   // it scales to any font-size and inherits `currentColor` — for icon-at-scale
   // (e.g. one in every table row) where the GLYPH_SIZE²-cell path is too heavy.
-  if (render === 'mask') {
-    const a11yM = label ? `role="img" aria-label="${esc(label)}"` : 'aria-hidden="true"';
-    const sz = size && cssLen(size) ? `--icon-size:${cssLen(size)};` : '';
-    return `<span class="ui-icon" style="${sz}--icon-mask:${maskUrl(rows)}" ${a11yM}></span>`;
-  }
-
-  const cells = glyphCells(name);
+  const iconSize = size && cssLen(size) ? `--icon-size:${cssLen(size)};` : '';
+  return `<span class="ui-icon" style="${iconSize}--icon-mask:${maskUrl(rows)}" ${a11yAttrs(
+    label,
+  )}></span>`;
+}
 
+function dotmatrixStyle({ solid, dot, gap }) {
   const style = [`--dotmatrix-cols:${GLYPH_SIZE}`];
   const dotLen = dot && cssLen(dot);
   const gapLen = gap && cssLen(gap);
@@ -1537,42 +1554,35 @@ export function renderGlyph(name, options = {}) {
   // `minmax(0, 1fr)` and the 16×16 matrix balloons to fill its container
   // (full-bleed, ~1250px) — the string API would then render an icon-intent call
   // very differently from the DOM `initDotGlyph` path, which already defaults to
-  // 0.08em. Mirror that default here so both paths render the same icon. (C7.)
+  // 0.08em. Mirror that default here so both paths render the same icon.
   style.push(`--dotmatrix-dot:${dotLen || '0.08em'}`);
   // Solid mode fuses the dots into a crisp pixel glyph: square cells, no gap.
   if (solid) style.push('--dotmatrix-dot-radius:0', '--dotmatrix-gap:0');
   else if (gapLen) style.push(`--dotmatrix-gap:${gapLen}`);
+  return style;
+}
 
-  const cls =
-    anim === 'reveal'
-      ? 'ui-dotmatrix ui-dotmatrix--reveal'
-      : anim === 'pulse'
-        ? 'ui-dotmatrix ui-dotmatrix--pulse'
-        : 'ui-dotmatrix';
-  // `reveal` staggers each cell by its row-major index via `--i`.
-  const stagger = anim === 'reveal';
-
-  const a11y = label ? `role="img" aria-label="${esc(label)}"` : 'aria-hidden="true"';
+function dotmatrixClass(anim) {
+  if (anim === 'reveal') return 'ui-dotmatrix ui-dotmatrix--reveal';
+  if (anim === 'pulse') return 'ui-dotmatrix ui-dotmatrix--pulse';
+  return 'ui-dotmatrix';
+}
 
+function renderGlyphCell(cell, index, { showPanel, stagger }) {
+  const cl = cell.on ? cellClass(cell) : 'ui-dotmatrix__cell';
+  const cellStyle = [];
   // Off cells keep the cell class (so they hold their grid track and 1:1
   // aspect-ratio); `grid: false` (implied by `solid`) only drops their lit
   // background, for the glyph-only look, without collapsing all-off rows.
-  const showPanel = grid && !solid;
-  const inner = cells
-    .map((c, i) => {
-      const cl = c.on ? cellClass(c) : 'ui-dotmatrix__cell';
-      const cellStyle = [];
-      if (!c.on && !showPanel) cellStyle.push('background:transparent');
-      if (stagger) cellStyle.push(`--i:${i}`);
-      const s = cellStyle.length ? ` style="${cellStyle.join(';')}"` : '';
-      return `<span class="${cl}"${s}></span>`;
-    })
-    .join('');
+  if (!cell.on && !showPanel) cellStyle.push('background:transparent');
+  // `reveal` staggers each cell by its row-major index via `--i`.
+  if (stagger) cellStyle.push(`--i:${index}`);
+  const style = cellStyle.length ? ` style="${cellStyle.join(';')}"` : '';
+  return `<span class="${cl}"${style}></span>`;
+}
 
-  // A `<span>` (not `<div>`): it's phrasing content, so the glyph is valid
-  // inline and inside a `<button>` (its content model is phrasing-only) — the
-  // inline-icon use. `.ui-dotmatrix`'s `display: grid` works on a span.
-  return `<span class="${cls}" style="${style.join(';')}" ${a11y}>${inner}</span>`;
+function a11yAttrs(label) {
+  return label ? `role="img" aria-label="${esc(label)}"` : 'aria-hidden="true"';
 }
 
 // Character → glyph name for renderReadout. Punctuation reuses the readout face

package/llms.txt

@@ -44,7 +44,7 @@ the path changes from source `css/` to built `dist/css/`:
 <!-- installed locally -->
 <link rel="stylesheet" href="./node_modules/@ponchia/ui/dist/css/<leaf>.css" />
 <!-- or from a CDN; pin the version (pre-1.0, breaking changes ship in the minor) -->
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.6.7/dist/css/<leaf>.css" />
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ponchia/ui@0.6.9/dist/css/<leaf>.css" />
 ```
 
 The flattened default bundle is `dist/bronto.css` (bundler shorthand
@@ -84,13 +84,17 @@ matching `.ui-source-card`, seed lightweight preview metadata, and emit
 `bronto:source:focus`; the host still owns numbering, fetching, trust decisions,
 and any rich preview popover.
 
-For React/Solid/Qwik, optional thin hook bindings over those behaviors (peer
-deps `react` / `solid-js` / `@builder.io/qwik`, optional — core stays zero-dep):
+Optional lifecycle adapters wrap those behaviors without owning markup or state.
+React/Solid/Qwik use hook bindings (peer deps `react` / `solid-js` /
+`@builder.io/qwik`, optional — core stays zero-dep); Svelte uses dependency-free
+actions, and Vue uses dependency-free directives/plugin helpers:
 
 ```js
 import { useDialog, useToast } from '@ponchia/ui/react'; // or '@ponchia/ui/solid' or '@ponchia/ui/qwik'
 // React: scope with { root: reactRef } or a resolver, not { root: ref.current } during render.
 // Qwik: hooks run in useVisibleTask$; scope with a Qwik signal — useDialog({ root: useSignal() }).
+// Svelte: import { dialog, toast } from '@ponchia/ui/svelte'.
+// Vue: import { vDialog, useToast } from '@ponchia/ui/vue', or app.use(brontoVue).
 ```
 
 Optional display glyphs — dot-matrix bitmaps on the `.ui-dotmatrix` primitive
@@ -240,7 +244,10 @@ chart rendering, overlay content, and accessibility text. Details:
 
 Optional SVG annotations for charts/reports — opt-in, never in the default
 bundle. This is Bronto's subject / connector / note grammar inspired by
-d3-annotation, not an authoring engine:
+d3-annotation, not an authoring engine. For placement, collision handling,
+renderers, editing, and chart/diagram adapters, use the sibling
+`@ponchia/annotations` package; `@ponchia/ui/annotations` stays a
+dependency-free Bronto static-helper compatibility surface:
 
 ```html
 <link rel="stylesheet" href="@ponchia/ui/css/annotations.css" />
@@ -618,7 +625,8 @@ behavior. Filter + keyboard-navigate a DOM-authored command list:
 Enter→`bronto:command:select` ({value,label}) and Escape→`bronto:command:close`.
 The HOST owns the action registry + execution; NO global Cmd/Ctrl+K (open it
 yourself, e.g. a <dialog> via initDialog). Pairs with `ui-shortcut`. Binding:
-`useCommand()` (react/solid/qwik). Details: `docs/command.md`.
+`useCommand()` (React/Solid/Qwik), `command` / `useCommand` (Svelte), and
+`vCommand` / `brontoVue` (Vue). Details: `docs/command.md`.
 
 Optional static report layer for LLM-authored HTML reports — opt-in, never in
 the default bundle. Pair it with the normal bundle, and add data-viz only when
@@ -745,7 +753,8 @@ Read these from `node_modules/@ponchia/ui/` — no network needed:
 - `schemas/report-claims.v1.schema.json` — declarative JSON Schema for
   `claims.json` sidecars that map report claims to source IDs and relations.
 - `docs/annotations.md` — SVG annotation recipes and helper guidance for
-  analytical figures.
+  analytical figures, plus the boundary with the sibling `@ponchia/annotations`
+  engine package.
 - `docs/mermaid.md` — theme Mermaid diagrams from bronto tokens (resolved
   `base` themeVariables, gated) and annotate the rendered SVG.
 - `docs/d2.md` — theme D2 diagrams from bronto tokens (theme-override slots,
@@ -770,14 +779,16 @@ Read these from `node_modules/@ponchia/ui/` — no network needed:
   `glyphCells` signatures for the display glyphs. (The DOM form,
   `initDotGlyph`, is declared in `behaviors/index.d.ts`.)
 - `annotations/index.d.ts` — no-dependency SVG path helpers for Bronto
-  annotation geometry.
+  annotation geometry. Do not add placement/collision/renderers/adapters here;
+  that belongs in `@ponchia/annotations`; do not import or type-reference that
+  sibling package from `@ponchia/ui` code or declarations.
 - `classes/vscode.css-custom-data.json` — editor autocomplete for tokens.
 
 ## External web references
 
 - Live kitchen-sink demo (every component, light/dark, RTL): https://ponchia.github.io/bronto-ui/
 - Architecture & the CSS-first decision: https://github.com/Ponchia/bronto-ui/blob/main/docs/architecture.md
-- Framework integration guides (Astro / SvelteKit / React-Solid-Qwik / vanilla):
+- Framework integration guides (Astro / SvelteKit / Vue / React-Solid-Qwik / vanilla):
   https://github.com/Ponchia/bronto-ui/tree/main/docs/getting-started
 
 ## Rules an agent should respect

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ponchia/ui",
-  "version": "0.6.7",
+  "version": "0.6.9",
   "type": "module",
   "description": "CSS-first identity and UI layer for services, tools, sites, and reports — works in HTML, every framework, and PDF, no component runtime. Shared app shell, forms, tables, workflow chrome, plus opt-in analytical/report primitives. Monochrome with one rationed accent. Zero runtime dependencies.",
   "keywords": [
@@ -102,6 +102,7 @@
     "docs/workbench.md",
     "docs/command.md",
     "docs/interop/tailwind.md",
+    "docs/interop/react-flow.md",
     "docs/migrations/0.2-to-0.3.md",
     "docs/migrations/0.3-to-0.4.md",
     "docs/migrations/0.4-to-0.5.md",
@@ -146,7 +147,8 @@
     "check:fresh": "node scripts/check-fresh.mjs",
     "check:classes": "node scripts/check-classes.mjs",
     "check:recipe-types": "node scripts/check-recipe-types.mjs",
-    "check:dead": "knip",
+    "check:dead": "knip --treat-config-hints-as-errors",
+    "check:complexity": "node scripts/check-complexity.mjs",
     "check:chain": "node scripts/check-chain.mjs",
     "check:dts-emit": "node scripts/check-dts-emit.mjs",
     "check:glyphs": "node scripts/check-glyphs.mjs",
@@ -159,37 +161,53 @@
     "check:report": "node scripts/check-report.mjs",
     "check:legend": "node scripts/check-legend.mjs",
     "check:types": "tsc -p tsconfig.json",
+    "check:unit": "npm test",
     "check:shiki": "node scripts/check-shiki.mjs",
     "check:dist": "node scripts/check-dist.mjs",
     "check:pack": "node scripts/check-pack.mjs",
+    "check:consumer-surface": "node scripts/check-consumer-surface.mjs",
+    "check:consumer-types": "node scripts/check-consumer-types.mjs",
+    "check:component-matrix": "node scripts/check-component-matrix.mjs",
+    "check:behavior-matrix": "node scripts/check-behavior-matrix.mjs",
+    "check:helper-matrix": "node scripts/check-helper-matrix.mjs",
+    "check:binding-matrix": "node scripts/check-binding-matrix.mjs",
     "check:examples": "node scripts/check-examples.mjs",
+    "check:visual-baselines": "node scripts/check-visual-baselines.mjs",
+    "check:playwright-container": "node scripts/check-playwright-container.mjs",
+    "check:schemas": "node scripts/check-schemas.mjs",
     "check:release": "node scripts/check-release.mjs",
     "check:versions": "node scripts/check-versions.mjs",
     "check:migrations": "node scripts/check-migrations.mjs",
     "check:public-metadata": "node scripts/check-public-metadata.mjs",
     "check:public-hygiene": "node scripts/check-public-hygiene.mjs",
+    "check:doc-links": "node scripts/check-doc-links.mjs",
     "check:doc-recipes": "node scripts/check-doc-recipes.mjs",
     "check:contract": "node scripts/check-contract.mjs",
     "check:variables": "node scripts/check-variables.mjs",
     "check:contrast": "node scripts/check-contrast.mjs",
     "check:publint": "publint --strict",
     "check:attw": "attw --pack --ignore-rules no-resolution cjs-resolves-to-esm",
-    "check": "npm run lint && npm run check:format && npm run check:exports && npm run check:fresh && npm run check:classes && npm run check:recipe-types && npm run check:dead && npm run check:types && npm run check:shiki && npm run check:dist && npm run check:pack && npm run check:examples && npm run check:publint && npm run check:attw && npm run check:release && npm run check:versions && npm run check:migrations && npm run check:public-metadata && npm run check:public-hygiene && npm run check:doc-recipes && npm run check:contract && npm run check:variables && npm run check:contrast && npm run check:dts-emit && npm run check:glyphs && npm run check:color-policy && npm run check:skins && npm run check:charts && npm run check:mermaid && npm run check:d2 && npm run check:vega && npm run check:report && npm run check:legend && npm run check:chain",
+    "check:workflows": "github-actionlint .github/workflows/*.yml",
+    "check": "npm run lint && npm run check:format && npm run check:exports && npm run check:fresh && npm run check:classes && npm run check:recipe-types && npm run check:dead && npm run check:complexity && npm run check:types && npm run check:unit && npm run check:shiki && npm run check:dist && npm run check:pack && npm run check:consumer-surface && npm run check:consumer-types && npm run check:component-matrix && npm run check:behavior-matrix && npm run check:helper-matrix && npm run check:binding-matrix && npm run check:examples && npm run check:visual-baselines && npm run check:playwright-container && npm run check:schemas && npm run check:publint && npm run check:attw && npm run check:workflows && npm run check:release && npm run check:versions && npm run check:migrations && npm run check:public-metadata && npm run check:public-hygiene && npm run check:doc-links && npm run check:doc-recipes && npm run check:contract && npm run check:variables && npm run check:contrast && npm run check:dts-emit && npm run check:glyphs && npm run check:color-policy && npm run check:skins && npm run check:charts && npm run check:mermaid && npm run check:d2 && npm run check:vega && npm run check:report && npm run check:legend && npm run check:chain",
     "test": "node --test \"test/*.test.mjs\"",
     "test:e2e": "playwright test",
     "test:e2e:chromium": "playwright test --project=chromium",
     "test:e2e:nonpixel": "node scripts/test-e2e-nonpixel.mjs",
+    "test:e2e:visual:container": "node scripts/test-visual-container.mjs",
     "test:examples": "node scripts/test-examples.mjs",
+    "test:examples:cross-browser": "node scripts/test-examples.mjs --browsers=chromium,firefox,webkit",
+    "test:examples:visual": "node scripts/test-examples.mjs --visual",
     "build:artifacts": "npm run tokens:css:build && npm run tokens:build && npm run dtcg:build && npm run resolved:build && npm run figma:variables:build && npm run dts:build && npm run dts:emit && npm run reference:build && npm run package-contract:build && npm run classes:json:build && npm run contrast:build && npm run vscode:build && npm run skins:build && npm run charts:build && npm run mermaid:build && npm run d2:build && npm run vega:build && npm run dist:build && npm run glyphs:build",
     "verify:artifacts": "npm run check:fresh && npm run check:dist && npm run check:dts-emit && npm run check:glyphs && npm run check:skins && npm run check:charts && npm run check:mermaid && npm run check:d2 && npm run check:vega && npm run check:pack",
     "prepack": "npm run build:artifacts && npm run verify:artifacts",
-    "prepublishOnly": "npm run build:artifacts && npm run check && npm test"
+    "prepublishOnly": "npm run build:artifacts && npm run check"
   },
   "devDependencies": {
     "@arethetypeswrong/cli": "^0.18.3",
     "@axe-core/playwright": "^4.11.3",
     "@builder.io/qwik": "^1.20.0",
     "@playwright/test": "1.60.0",
+    "github-actionlint": "^1.7.12",
     "jsdom": "^29.1.1",
     "knip": "^6.16.1",
     "pdfjs-dist": "^6.0.227",
@@ -372,6 +390,7 @@
     "./docs/workbench.md": "./docs/workbench.md",
     "./docs/command.md": "./docs/command.md",
     "./docs/interop/tailwind.md": "./docs/interop/tailwind.md",
+    "./docs/interop/react-flow.md": "./docs/interop/react-flow.md",
     "./docs/migrations/0.2-to-0.3.md": "./docs/migrations/0.2-to-0.3.md",
     "./docs/migrations/0.3-to-0.4.md": "./docs/migrations/0.3-to-0.4.md",
     "./docs/migrations/0.4-to-0.5.md": "./docs/migrations/0.4-to-0.5.md",

package/schemas/report-claims.v1.schema.json

@@ -56,7 +56,7 @@
     },
     "hash": {
       "type": "string",
-      "pattern": "^(sha256|sha384|sha512):[A-Fa-f0-9]+$"
+      "pattern": "^(sha256:[A-Fa-f0-9]{64}|sha384:[A-Fa-f0-9]{96}|sha512:[A-Fa-f0-9]{128})$"
     },
     "claimStatus": {
       "enum": ["supported", "partial", "disputed", "unsupported", "unknown"]

package/svelte/index.d.ts

@@ -2,9 +2,9 @@
  * Create a Svelte action from any Bronto delegated behavior initializer.
  *
  * @param {(opts?: DelegateOpts) => Cleanup | void} init
- * @returns {(node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn}
+ * @returns {BrontoAction}
  */
-export function createBrontoAction(init: (opts?: DelegateOpts) => Cleanup | void): (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
+export function createBrontoAction(init: (opts?: DelegateOpts) => Cleanup | void): BrontoAction;
 /**
  * Generic escape hatch for custom behavior initializers.
  *
@@ -21,49 +21,70 @@ export function brontoBehavior(node: Element, params: BrontoBehaviorParams | nul
  * @returns {SvelteActionReturn}
  */
 export function useBrontoBehavior(node: Element, params: BrontoBehaviorParams | null | undefined): SvelteActionReturn;
-/** @type {(node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn} */
-export const themeToggle: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const dismissible: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const disabledGuard: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const disclosure: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const menu: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const formValidation: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const combobox: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const popover: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const tableSort: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const tabs: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const dialog: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const modal: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const carousel: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const dotGlyph: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const legend: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const connectors: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const spotlight: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const crosshair: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const command: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const sources: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const splitter: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useThemeToggle: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useDismissible: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useDisabledGuard: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useDisclosure: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useMenu: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useFormValidation: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useCombobox: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const usePopover: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useTableSort: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useTabs: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useDialog: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useModal: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useCarousel: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useDotGlyph: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useLegend: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useConnectors: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useSpotlight: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useCrosshair: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useCommand: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useSources: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
-export const useSplitter: (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
+/** @type {BrontoThemeAction} */
+export const themeToggle: BrontoThemeAction;
+/** @type {BrontoAction} */
+export const dismissible: BrontoAction;
+/** @type {BrontoAction} */
+export const disabledGuard: BrontoAction;
+/** @type {BrontoAction} */
+export const disclosure: BrontoAction;
+/** @type {BrontoAction} */
+export const menu: BrontoAction;
+/** @type {BrontoAction} */
+export const formValidation: BrontoAction;
+/** @type {BrontoAction} */
+export const combobox: BrontoAction;
+/** @type {BrontoAction} */
+export const popover: BrontoAction;
+/** @type {BrontoAction} */
+export const tableSort: BrontoAction;
+/** @type {BrontoAction} */
+export const tabs: BrontoAction;
+/** @type {BrontoAction} */
+export const dialog: BrontoAction;
+/** @type {BrontoAction} */
+export const modal: BrontoAction;
+/** @type {BrontoAction} */
+export const carousel: BrontoAction;
+/** @type {BrontoAction} */
+export const dotGlyph: BrontoAction;
+/** @type {BrontoAction} */
+export const legend: BrontoAction;
+/** @type {BrontoAction} */
+export const connectors: BrontoAction;
+/** @type {BrontoAction} */
+export const spotlight: BrontoAction;
+/** @type {BrontoAction} */
+export const crosshair: BrontoAction;
+/** @type {BrontoAction} */
+export const command: BrontoAction;
+/** @type {BrontoAction} */
+export const sources: BrontoAction;
+/** @type {BrontoAction} */
+export const splitter: BrontoAction;
+/** @type {BrontoThemeAction} */
+export const useThemeToggle: BrontoThemeAction;
+export const useDismissible: BrontoAction;
+export const useDisabledGuard: BrontoAction;
+export const useDisclosure: BrontoAction;
+export const useMenu: BrontoAction;
+export const useFormValidation: BrontoAction;
+export const useCombobox: BrontoAction;
+export const usePopover: BrontoAction;
+export const useTableSort: BrontoAction;
+export const useTabs: BrontoAction;
+export const useDialog: BrontoAction;
+export const useModal: BrontoAction;
+export const useCarousel: BrontoAction;
+export const useDotGlyph: BrontoAction;
+export const useLegend: BrontoAction;
+export const useConnectors: BrontoAction;
+export const useSpotlight: BrontoAction;
+export const useCrosshair: BrontoAction;
+export const useCommand: BrontoAction;
+export const useSources: BrontoAction;
+export const useSplitter: BrontoAction;
 export function useToast(): (message: string, opts?: ToastOpts) => Cleanup;
 export type Cleanup = import("../behaviors/index.js").Cleanup;
 export type DelegateOpts = import("../behaviors/index.js").DelegateOpts;
@@ -73,10 +94,15 @@ export type BrontoActionRoot = Document | Element | null | undefined;
 export type BrontoActionOpts = Omit<DelegateOpts, "root"> & {
     root?: BrontoActionRoot;
 };
+export type BrontoThemeActionOpts = Omit<ThemeStorageOpts & DelegateOpts, "root"> & {
+    root?: BrontoActionRoot;
+};
 export type BrontoBehaviorParams = {
     init: (opts?: DelegateOpts) => Cleanup | void;
     opts?: BrontoActionOpts | null | undefined;
 };
+export type BrontoAction = (node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn;
+export type BrontoThemeAction = (node: Element, opts?: BrontoThemeActionOpts | null | undefined) => SvelteActionReturn;
 export type SvelteActionReturn = {
     update?: (next?: unknown) => void;
     destroy: () => void;

package/svelte/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.js"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.js"],"names":[],"mappings":"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"}

package/svelte/index.js

@@ -23,8 +23,14 @@
  *
  * @typedef {Omit<DelegateOpts, 'root'> & { root?: BrontoActionRoot }} BrontoActionOpts
  *
+ * @typedef {Omit<ThemeStorageOpts & DelegateOpts, 'root'> & { root?: BrontoActionRoot }} BrontoThemeActionOpts
+ *
  * @typedef {{ init: (opts?: DelegateOpts) => Cleanup | void, opts?: BrontoActionOpts | null | undefined }} BrontoBehaviorParams
  *
+ * @typedef {(node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn} BrontoAction
+ *
+ * @typedef {(node: Element, opts?: BrontoThemeActionOpts | null | undefined) => SvelteActionReturn} BrontoThemeAction
+ *
  * @typedef {{ update?: (next?: unknown) => void, destroy: () => void }} SvelteActionReturn
  */
 import {
@@ -73,7 +79,7 @@ function run(node, init, opts) {
  * Create a Svelte action from any Bronto delegated behavior initializer.
  *
  * @param {(opts?: DelegateOpts) => Cleanup | void} init
- * @returns {(node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn}
+ * @returns {BrontoAction}
  */
 export function createBrontoAction(init) {
   return (node, opts) => {
@@ -112,30 +118,51 @@ export function brontoBehavior(node, params) {
 
 export const useBrontoBehavior = brontoBehavior;
 
-/** @type {(node: Element, opts?: BrontoActionOpts | null | undefined) => SvelteActionReturn} */
+/** @type {BrontoThemeAction} */
 export const themeToggle = createBrontoAction(initThemeToggle);
+/** @type {BrontoAction} */
 export const dismissible = createBrontoAction(initDismissible);
+/** @type {BrontoAction} */
 export const disabledGuard = createBrontoAction(initDisabledGuard);
+/** @type {BrontoAction} */
 export const disclosure = createBrontoAction(initDisclosure);
+/** @type {BrontoAction} */
 export const menu = createBrontoAction(initMenu);
+/** @type {BrontoAction} */
 export const formValidation = createBrontoAction(initFormValidation);
+/** @type {BrontoAction} */
 export const combobox = createBrontoAction(initCombobox);
+/** @type {BrontoAction} */
 export const popover = createBrontoAction(initPopover);
+/** @type {BrontoAction} */
 export const tableSort = createBrontoAction(initTableSort);
+/** @type {BrontoAction} */
 export const tabs = createBrontoAction(initTabs);
+/** @type {BrontoAction} */
 export const dialog = createBrontoAction(initDialog);
+/** @type {BrontoAction} */
 export const modal = createBrontoAction(initModal);
+/** @type {BrontoAction} */
 export const carousel = createBrontoAction(initCarousel);
+/** @type {BrontoAction} */
 export const dotGlyph = createBrontoAction(initDotGlyph);
+/** @type {BrontoAction} */
 export const legend = createBrontoAction(initLegend);
+/** @type {BrontoAction} */
 export const connectors = createBrontoAction(initConnectors);
+/** @type {BrontoAction} */
 export const spotlight = createBrontoAction(initSpotlight);
+/** @type {BrontoAction} */
 export const crosshair = createBrontoAction(initCrosshair);
+/** @type {BrontoAction} */
 export const command = createBrontoAction(initCommand);
+/** @type {BrontoAction} */
 export const sources = createBrontoAction(initSources);
+/** @type {BrontoAction} */
 export const splitter = createBrontoAction(initSplitter);
 
 // Hook-style aliases keep this action surface parallel with React/Solid/Qwik.
+/** @type {BrontoThemeAction} */
 export const useThemeToggle = themeToggle;
 export const useDismissible = dismissible;
 export const useDisabledGuard = disabledGuard;

package/tokens/index.js

@@ -115,7 +115,7 @@ export const cssVars = {
     // (D2/Mermaid/Vega labels on an accent fill — see tokens/*.json). In-DOM
     // components paint their own on-accent ink from `--button-text`; overriding
     // `--on-accent` in CSS does NOT change a button/chip. To re-ink in-DOM
-    // accent fills, set `--button-text`. (tokens review C7.)
+    // accent fills, set `--button-text`.
     '--on-accent': 'var(--button-text)',
     '--accent-soft': 'color-mix(in srgb, var(--accent) 10%, transparent)',
     '--success': '#2f7d4f',
@@ -156,7 +156,7 @@ export const cssVars = {
     // (D2/Mermaid/Vega labels on an accent fill — see tokens/*.json). In-DOM
     // components paint their own on-accent ink from `--button-text`; overriding
     // `--on-accent` in CSS does NOT change a button/chip. To re-ink in-DOM
-    // accent fills, set `--button-text`. (tokens review C7.)
+    // accent fills, set `--button-text`.
     '--on-accent': 'var(--button-text)',
     '--accent-soft': 'color-mix(in srgb, var(--accent) 14%, transparent)',
     '--success': '#4ec27e',