@ponchia/ui 0.3.6 → 0.4.1

package/glyphs/glyphs.js

@@ -25,6 +25,96 @@ export const GLYPH_SIZE = 16;
 // `.` off · `#` hot · `*` accent. Only `spark` uses accent dots — it is the
 // canonical two-tone demo; the gate in check-glyphs.mjs enforces the shape.
 const RAW = {
+  circle: [
+    '................',
+    '.....######.....',
+    '....########....',
+    '...###....###...',
+    '..##........##..',
+    '.###........###.',
+    '.##..........##.',
+    '.##..........##.',
+    '.##..........##.',
+    '.##..........##.',
+    '.###........###.',
+    '..##........##..',
+    '...###....###...',
+    '....########....',
+    '.....######.....',
+    '................',
+  ],
+  'check-circle': [
+    '................',
+    '.....######.....',
+    '....########....',
+    '...###....###...',
+    '..##........##..',
+    '.###........###.',
+    '.##........####.',
+    '.##..##...##.##.',
+    '.##...##.##..##.',
+    '.##....###...##.',
+    '.###...##...###.',
+    '..##........##..',
+    '...###....###...',
+    '....########....',
+    '.....######.....',
+    '................',
+  ],
+  'x-circle': [
+    '................',
+    '.....######.....',
+    '....########....',
+    '...###....###...',
+    '..##........##..',
+    '.###.##..##.###.',
+    '.##...####...##.',
+    '.##....##....##.',
+    '.##...####...##.',
+    '.##..##..##..##.',
+    '.#####....#####.',
+    '..##........##..',
+    '...###....###...',
+    '....########....',
+    '.....######.....',
+    '................',
+  ],
+  'plus-circle': [
+    '................',
+    '.....######.....',
+    '....########....',
+    '...###....###...',
+    '..##........##..',
+    '.###...##...###.',
+    '.##....##....##.',
+    '.##..######..##.',
+    '.##..######..##.',
+    '.##....##....##.',
+    '.###...##...###.',
+    '..##........##..',
+    '...###....###...',
+    '....########....',
+    '.....######.....',
+    '................',
+  ],
+  'minus-circle': [
+    '................',
+    '.....######.....',
+    '....########....',
+    '...###....###...',
+    '..##........##..',
+    '.###........###.',
+    '.##..........##.',
+    '.##..######..##.',
+    '.##..######..##.',
+    '.##..........##.',
+    '.###........###.',
+    '..##........##..',
+    '...###....###...',
+    '....########....',
+    '.....######.....',
+    '................',
+  ],
   'arrow-down': [
     '................',
     '......####......',
@@ -860,6 +950,40 @@ function cssLen(v) {
   return /^[\w.%+\-*/()\s,]+$/.test(v) ? v : '';
 }
 
+/**
+ * Build a CSS `mask-image` `url()` of an inline SVG for a glyph's lit cells —
+ * the basis of the one-node `render: 'mask'` path. Horizontal runs are merged
+ * into single `<rect>`s (fewer nodes, no seams). The SVG is alpha-masked, so
+ * the element's `currentColor` background shows through only the lit cells —
+ * one DOM node instead of GLYPH_SIZE² (256), for an icon at any size/colour.
+ */
+function maskUrl(rows) {
+  let rects = '';
+  rows.forEach((row, y) => {
+    let run = 0;
+    for (let x = 0; x <= GLYPH_SIZE; x++) {
+      const on = x < GLYPH_SIZE && row[x] !== '.';
+      if (on) run++;
+      else if (run) {
+        rects += `<rect x='${x - run}' y='${y}' width='${run}' height='1'/>`;
+        run = 0;
+      }
+    }
+  });
+  // The url() lands unquoted inside an HTML `style="…"` attribute, so it must
+  // carry no spaces or quotes of its own — encode them (and `<>#`) so it stays
+  // a single CSS url-token and can't break out of the attribute.
+  const svg = `<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 ${GLYPH_SIZE} ${GLYPH_SIZE}'>${rects}</svg>`;
+  const enc = svg
+    .replace(/%/g, '%25')
+    .replace(/</g, '%3C')
+    .replace(/>/g, '%3E')
+    .replace(/#/g, '%23')
+    .replace(/'/g, '%27')
+    .replace(/ /g, '%20');
+  return `url(data:image/svg+xml,${enc})`;
+}
+
 /**
  * A full `.ui-dotmatrix` HTML string for a glyph (`''` if the name is
  * unknown). Decorative by default (`aria-hidden`); pass `label` to expose it
@@ -875,11 +999,28 @@ function cssLen(v) {
  * `anim` opts into a decorative animation (disabled under reduced-motion;
  * the static frame + `label` still carry the meaning): `'reveal'` powers the
  * cells on in a scan, `'pulse'` makes the glyph breathe.
+ *
+ * `render: 'mask'` returns a single `.ui-icon` element masked by the glyph
+ * bitmap (one DOM node, not GLYPH_SIZE²) — the icon-at-scale path: it sizes to
+ * `size` (or `--icon-size` / `1em`) and inherits `currentColor`. The
+ * cell-mode options (grid/solid/anim/dot/gap) don't apply; `label` does.
+ * Needs `@ponchia/ui/css` (the `.ui-icon` rule).
  */
 export function renderGlyph(name, options = {}) {
+  const rows = GLYPHS[name];
+  if (!rows) return '';
+  const { grid = true, solid = false, anim, label, dot, gap, render, size } = options;
+
+  // 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);
-  if (!cells.length) return '';
-  const { grid = true, solid = false, anim, label, dot, gap } = options;
 
   const style = [`--dotmatrix-cols:${GLYPH_SIZE}`];
   const dotLen = dot && cssLen(dot);

package/llms.txt

@@ -2,8 +2,9 @@
 
 > CSS-first, framework-agnostic UI framework. Zero runtime dependencies.
 > One `@layer bronto` cascade, a typed class vocabulary, design tokens as
-> data, and optional SSR-safe vanilla behaviors. Nothing-inspired:
-> monochrome surfaces, a single rationed accent, dot-matrix display type.
+> data, and optional SSR-safe vanilla behaviors. Token-driven restraint:
+> monochrome by default, one rationed accent, dot-matrix display type, with
+> opt-in colorways + a colourblind-safe data-viz palette layered on top.
 >
 > This file orients an LLM/agent. The authoritative, always-correct API
 > is the TypeScript declarations shipped in this package (paths below):
@@ -19,6 +20,12 @@ CSS (pick one; do not import both):
 @import '@ponchia/ui/css';    /* css/core.css — @import fan-out, needs a bundler */
 ```
 
+`import '@ponchia/ui'` is supported only as a CSS side-effect import in a
+CSS-aware bundler. Do not import the package root from Node/runtime JS; use the
+explicit JS subpaths below.
+
+JS subpaths are ESM-only. In CommonJS, use dynamic `import()`.
+
 Everything lands in `@layer bronto`. Consumer styles in no layer (or a
 later layer) always win over framework styles regardless of selector
 specificity — this is the intended override mechanism; do not fight it
@@ -45,6 +52,15 @@ Optional vanilla behaviors (theme toggle, etc. — SSR-safe, tree-shakeable):
 import { applyStoredTheme } from '@ponchia/ui/behaviors';
 ```
 
+For React/Solid/Qwik, optional thin hook bindings over those behaviors (peer
+deps `react` / `solid-js` / `@builder.io/qwik`, optional — core stays zero-dep):
+
+```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() }).
+```
+
 Optional display glyphs — dot-matrix bitmaps on the `.ui-dotmatrix` primitive
 (decorative by default; `renderGlyph` is SSR-safe, `initDotGlyph` is the DOM form):
 
@@ -53,6 +69,75 @@ import { renderGlyph, GLYPH_NAMES } from '@ponchia/ui/glyphs';
 el.innerHTML = renderGlyph('check', { label: 'Done' });
 ```
 
+Optional display colorways — opt-in, never in the default bundle. Root-level,
+like `data-theme` (the derived accent family only recomputes at `:root`):
+
+```html
+<link rel="stylesheet" href="@ponchia/ui/css/skins.css" />
+<html data-bronto-skin="amber-crt | phosphor-green | e-ink">
+```
+
+Each re-points the one `--accent` (OKLCH, per-theme, contrast-gated); status
+colours and the neutral canvas are untouched. Details in `docs/theming.md`.
+
+Optional data-viz palette for dashboards — opt-in, charts-only (never UI
+chrome), never in the default bundle:
+
+```html
+<link rel="stylesheet" href="@ponchia/ui/css/dataviz.css" />
+```
+
+```js
+import charts from '@ponchia/ui/charts.json' with { type: 'json' };
+// charts.dark.categorical → ['#ff3b41', …] (series 0 = the resolved accent)
+```
+
+`--chart-1..8` (categorical; series 1 = accent; colourblind-safe, gated under
+simulated protan/deutan/tritan), `--chart-seq-*` (sequential), `--chart-div-*`
+(diverging), and `--chart-pattern-1..8` (dot-matrix fills — pair colour N with
+pattern N; colour is never the sole signal). Details in `docs/theming.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
+the report contains charts. For standalone browser HTML, use real URLs; package
+specifiers only work after a bundler rewrites them:
+
+```html
+<link rel="stylesheet" href="./node_modules/@ponchia/ui/dist/bronto.css" />
+<link rel="stylesheet" href="./node_modules/@ponchia/ui/dist/css/report.css" />
+<link rel="stylesheet" href="./node_modules/@ponchia/ui/dist/css/dataviz.css" />
+```
+
+In Vite/webpack/etc., import `@ponchia/ui`, `@ponchia/ui/css/report.css`, and
+`@ponchia/ui/css/dataviz.css` instead.
+
+Canonical report skeleton:
+
+```html
+<main class="ui-report ui-report--numbered">
+  <header class="ui-report__cover">
+    <p class="ui-eyebrow">Report</p>
+    <h1 class="ui-report__title">System review</h1>
+    <p class="ui-report__subtitle">Static HTML, Chromium PDF-ready.</p>
+    <ol class="ui-report__meta"><li>2026-06-01</li><li>Generated</li></ol>
+  </header>
+  <section class="ui-report__section">
+    <h2 class="ui-report__section-head">Executive summary</h2>
+    <div class="ui-report__summary">
+      <div class="ui-prose"><p>Use prose only for narrative body content.</p></div>
+    </div>
+  </section>
+</main>
+```
+
+Report rules for agents: static output by default; do not initialize behaviors
+over untrusted generated content; sanitize arbitrary LLM/CMS/user HTML before
+rendering; use semantic headings; give tables captions and header cells; give
+charts captions, legends/direct labels, and fallback data; use
+`ui-chart__plot`/`ui-chart__bar`/`ui-chart__fill` for simple static bar charts;
+use `ui-report__section--unnumbered` for appendices in numbered reports; never
+use raw chromatic inline colors. Full cookbook: `docs/reporting.md`.
+
 ## Authoritative offline references (shipped in this package)
 
 Read these from `node_modules/@ponchia/ui/` — no network needed:
@@ -65,9 +150,14 @@ Read these from `node_modules/@ponchia/ui/` — no network needed:
   the same source as the types and CI-drift-checked.
 - `docs/theming.md` — the token contract: which tokens to override, the
   light/dark model, and the rationed-accent rule.
+- `docs/stability.md` — the public API matrix: stable vs internal surfaces,
+  root-import contract, behavior trust boundary, and glyph-mask CSP note.
 - `docs/usage.md` — the decision guide: badge vs chip vs dot, default
   density, prose-in-card, when to add a behavior. Read this before
   re-implementing UI the framework already has an opinion about.
+- `docs/reporting.md` — static/PDF-first report cookbook for LLM-authored
+  reports, including report skeletons, chart rules, print utilities, and safety
+  boundaries.
 - `docs/contrast.md` — the published, CI-gated WCAG 2.1 contrast matrix
   for every contractual token pairing, per theme. Generated from the
   resolved palette; the build fails below the declared floor.
@@ -87,7 +177,7 @@ Read these from `node_modules/@ponchia/ui/` — no network needed:
 
 - 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 / vanilla):
+- Framework integration guides (Astro / SvelteKit / React-Solid-Qwik / vanilla):
   https://github.com/Ponchia/bronto-ui/tree/main/docs/getting-started
 
 ## Rules an agent should respect
@@ -95,8 +185,14 @@ Read these from `node_modules/@ponchia/ui/` — no network needed:
 - Never invent `ui-*` class names. Every valid class is a member of
   `cls` in `classes/index.d.ts`; if it is not there, it does not exist.
 - Prefer the `ui.*()` recipes over hand-concatenating modifier strings.
+  Report/layout classes added in 0.4.1 are the exception: use `cls.report*`,
+  `cls.chart*`, `cls.printOnly`, or literal documented class names because
+  there are no `ui.report()` / `ui.chart()` recipes yet.
 - Override framework styles by writing your own rules outside
   `@layer bronto` — not with higher specificity or `!important`.
-- The accent color is deliberately rationed (monochrome + one accent).
-  Do not introduce new hues; theme via the documented tokens only.
+- Color is tiered (ADR-0001): neutral canvas · one rationed accent · locked
+  status · display expression · opt-in data-viz. Theme via the documented
+  tokens — re-point `--accent` (or a `data-bronto-skin` colorway), use status
+  tokens for status, and `--chart-*` (from `css/dataviz.css`) for charts only.
+  Don't add raw hues to components; `check:color-policy` enforces this.
 - Pre-1.0 SemVer: breaking changes ship in the *minor*. Pin `~0.x`.

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@ponchia/ui",
-  "version": "0.3.6",
+  "version": "0.4.1",
   "type": "module",
-  "description": "Nothing-inspired, CSS-first UI framework — monochrome design tokens, one rationed accent, dot-matrix motifs, zero runtime dependencies, framework-agnostic.",
+  "description": "CSS-first, framework-agnostic UI framework — token-driven restraint (monochrome by default, one rationed accent), OKLCH colorways, a dot-matrix icon set, a colourblind-safe data-viz palette, dot-matrix motifs, zero runtime dependencies.",
   "keywords": [
     "css",
     "ui",
@@ -13,6 +13,11 @@
     "css-layers",
     "nothing",
     "monochrome",
+    "oklch",
+    "colorways",
+    "icons",
+    "data-visualization",
+    "wcag",
     "framework-agnostic",
     "zero-dependencies",
     "dark-mode",
@@ -41,12 +46,21 @@
     "classes",
     "behaviors",
     "glyphs",
+    "react",
+    "solid",
+    "qwik",
     "shiki",
     "llms.txt",
+    "CHANGELOG.md",
     "docs/reference.md",
     "docs/theming.md",
     "docs/contrast.md",
-    "docs/usage.md"
+    "docs/stability.md",
+    "docs/usage.md",
+    "docs/reporting.md",
+    "docs/adr/0001-color-system.md",
+    "docs/adr/0002-scope-and-2026-baseline.md",
+    "docs/adr/0003-theme-model.md"
   ],
   "style": "./dist/bronto.css",
   "scripts": {
@@ -54,11 +68,14 @@
     "lint:fix": "stylelint \"css/**/*.css\" --fix",
     "format": "prettier --write .",
     "check:format": "prettier --check .",
+    "size:report": "node scripts/size-report.mjs",
     "tokens:build": "node scripts/gen-tokens-json.mjs",
     "dtcg:build": "node scripts/gen-dtcg.mjs",
     "resolved:build": "node scripts/gen-resolved.mjs",
     "dts:build": "node scripts/gen-dts.mjs",
     "glyphs:build": "node scripts/gen-glyphs.mjs",
+    "skins:build": "node scripts/gen-skins.mjs",
+    "charts:build": "node scripts/gen-charts.mjs",
     "reference:build": "node scripts/gen-reference.mjs",
     "contrast:build": "node scripts/gen-contrast.mjs",
     "vscode:build": "node scripts/gen-vscode-data.mjs",
@@ -68,7 +85,12 @@
     "check:classes": "node scripts/check-classes.mjs",
     "check:dts": "node scripts/check-dts.mjs",
     "check:behaviors": "node scripts/check-behaviors.mjs",
+    "check:bindings": "node scripts/check-bindings.mjs",
     "check:glyphs": "node scripts/check-glyphs.mjs",
+    "check:color-policy": "node scripts/check-color-policy.mjs",
+    "check:skins": "node scripts/check-skins.mjs",
+    "check:charts": "node scripts/check-charts.mjs",
+    "check:report": "node scripts/check-report.mjs",
     "check:types": "tsc -p tsconfig.json",
     "check:dtcg": "node scripts/check-dtcg.mjs",
     "check:resolved": "node scripts/check-resolved.mjs",
@@ -79,21 +101,41 @@
     "check:reference": "node scripts/check-reference.mjs",
     "check:contrast": "node scripts/check-contrast.mjs",
     "check:vscode": "node scripts/check-vscode-data.mjs",
-    "check": "npm run lint && npm run check:format && npm run check:exports && npm run check:tokens && npm run check:classes && npm run check:dts && npm run check:types && npm run check:dtcg && npm run check:resolved && npm run check:shiki && npm run check:dist && npm run check:pack && npm run check:release && npm run check:reference && npm run check:contrast && npm run check:vscode && npm run check:behaviors && npm run check:glyphs",
+    "check": "npm run lint && npm run check:format && npm run check:exports && npm run check:tokens && npm run check:classes && npm run check:dts && npm run check:types && npm run check:dtcg && npm run check:resolved && npm run check:shiki && npm run check:dist && npm run check:pack && npm run check:release && npm run check:reference && npm run check:contrast && npm run check:vscode && npm run check:behaviors && npm run check:bindings && npm run check:glyphs && npm run check:color-policy && npm run check:skins && npm run check:charts && npm run check:report",
     "test": "node --test \"test/*.test.mjs\"",
-    "prepack": "npm run tokens:build && npm run dtcg:build && npm run resolved:build && npm run dts:build && npm run reference:build && npm run contrast:build && npm run vscode:build && npm run dist:build && npm run glyphs:build",
+    "prepack": "npm run tokens:build && npm run dtcg:build && npm run resolved:build && npm run dts:build && npm run reference:build && npm run contrast:build && npm run vscode:build && npm run skins:build && npm run charts:build && npm run dist:build && npm run glyphs:build",
     "prepublishOnly": "npm run check && npm test"
   },
   "devDependencies": {
     "@axe-core/playwright": "^4.11.3",
+    "@builder.io/qwik": "^1.20.0",
     "@playwright/test": "^1.60.0",
     "jsdom": "^29.1.1",
     "prettier": "^3.8.3",
+    "react": "^19.2.6",
+    "react-dom": "^19.2.6",
+    "solid-js": "^1.9.13",
     "stylelint": "^17.11.1",
     "stylelint-config-standard": "^40.0.0",
     "stylelint-use-logical": "^2.1.3",
     "typescript": "^6.0.3"
   },
+  "peerDependencies": {
+    "@builder.io/qwik": ">=1.5",
+    "react": ">=18",
+    "solid-js": ">=1.6"
+  },
+  "peerDependenciesMeta": {
+    "@builder.io/qwik": {
+      "optional": true
+    },
+    "react": {
+      "optional": true
+    },
+    "solid-js": {
+      "optional": true
+    }
+  },
   "exports": {
     ".": {
       "style": "./dist/bronto.css",
@@ -117,6 +159,9 @@
     "./css/disclosure.css": "./dist/css/disclosure.css",
     "./css/table.css": "./dist/css/table.css",
     "./css/app.css": "./dist/css/app.css",
+    "./css/skins.css": "./dist/css/skins.css",
+    "./css/dataviz.css": "./dist/css/dataviz.css",
+    "./css/report.css": "./dist/css/report.css",
     "./css/unlayered/tokens.css": "./css/tokens.css",
     "./css/unlayered/fonts.css": "./css/fonts.css",
     "./css/unlayered/base.css": "./css/base.css",
@@ -132,6 +177,9 @@
     "./css/unlayered/disclosure.css": "./css/disclosure.css",
     "./css/unlayered/table.css": "./css/table.css",
     "./css/unlayered/app.css": "./css/app.css",
+    "./css/unlayered/skins.css": "./css/skins.css",
+    "./css/unlayered/dataviz.css": "./css/dataviz.css",
+    "./css/unlayered/report.css": "./css/report.css",
     "./tokens": {
       "types": "./tokens/index.d.ts",
       "default": "./tokens/index.js"
@@ -145,7 +193,12 @@
     "./docs/reference.md": "./docs/reference.md",
     "./docs/theming.md": "./docs/theming.md",
     "./docs/contrast.md": "./docs/contrast.md",
+    "./docs/stability.md": "./docs/stability.md",
     "./docs/usage.md": "./docs/usage.md",
+    "./docs/reporting.md": "./docs/reporting.md",
+    "./docs/adr/0001-color-system.md": "./docs/adr/0001-color-system.md",
+    "./docs/adr/0002-scope-and-2026-baseline.md": "./docs/adr/0002-scope-and-2026-baseline.md",
+    "./docs/adr/0003-theme-model.md": "./docs/adr/0003-theme-model.md",
     "./classes": {
       "types": "./classes/index.d.ts",
       "default": "./classes/index.js"
@@ -158,6 +211,27 @@
       "types": "./glyphs/glyphs.d.ts",
       "default": "./glyphs/glyphs.js"
     },
+    "./react": {
+      "types": "./react/index.d.ts",
+      "default": "./react/index.js"
+    },
+    "./solid": {
+      "types": "./solid/index.d.ts",
+      "default": "./solid/index.js"
+    },
+    "./qwik": {
+      "types": "./qwik/index.d.ts",
+      "default": "./qwik/index.js"
+    },
+    "./skins": {
+      "types": "./tokens/skins.d.ts",
+      "default": "./tokens/skins.js"
+    },
+    "./charts": {
+      "types": "./tokens/charts.d.ts",
+      "default": "./tokens/charts.js"
+    },
+    "./charts.json": "./tokens/charts.json",
     "./fonts/*": "./fonts/*"
   }
 }

package/qwik/index.d.ts

@@ -0,0 +1,55 @@
+/** @ponchia/ui/qwik — thin Qwik bindings over the SSR-safe behaviors.
+ *  Optional peer dep `@builder.io/qwik`. Hooks run a delegated behavior on
+ *  visible and register cleanup on dispose (via `useVisibleTask$`); they take
+ *  the same options as the behavior and return void. See behaviors/index.d.ts. */
+import type { Cleanup, DelegateOpts, ThemeStorageOpts, ToastOpts } from '../behaviors/index.js';
+
+export type BrontoBindingRoot =
+  | Document
+  | Element
+  // Qwik `useSignal()` (and any { value } / { current } ref shape).
+  | { value: Document | Element | null | undefined }
+  | { current: Document | Element | null | undefined }
+  | (() => Document | Element | null | undefined)
+  | null
+  | undefined;
+
+export type BrontoBindingOpts<T extends DelegateOpts = DelegateOpts> = Omit<T, 'root'> & {
+  root?: BrontoBindingRoot;
+};
+
+export type BrontoBindingOptsResolver<T extends DelegateOpts = DelegateOpts> =
+  | BrontoBindingOpts<T>
+  | (() => BrontoBindingOpts<T> | null | undefined)
+  | null
+  | undefined;
+
+/** Run any delegated behavior for the component's lifetime (init on visible,
+ *  its returned cleanup on dispose). Prefer the specific `use*` hooks in Qwik
+ *  so the optimizer can serialize the task; this generic form is safe only with
+ *  an optimizer-visible (module-imported) behavior. */
+export declare function useBrontoBehavior(
+  init: (opts?: DelegateOpts) => Cleanup | void,
+  opts?: BrontoBindingOptsResolver,
+): void;
+
+export declare function useThemeToggle(
+  opts?: BrontoBindingOptsResolver<ThemeStorageOpts & DelegateOpts>,
+): void;
+export declare function useDismissible(opts?: BrontoBindingOptsResolver): void;
+export declare function useDisclosure(opts?: BrontoBindingOptsResolver): void;
+export declare function useMenu(opts?: BrontoBindingOptsResolver): void;
+export declare function useFormValidation(opts?: BrontoBindingOptsResolver): void;
+export declare function useCombobox(opts?: BrontoBindingOptsResolver): void;
+export declare function usePopover(opts?: BrontoBindingOptsResolver): void;
+export declare function useTableSort(opts?: BrontoBindingOptsResolver): void;
+export declare function useTabs(opts?: BrontoBindingOptsResolver): void;
+export declare function useDialog(opts?: BrontoBindingOptsResolver): void;
+export declare function useCarousel(opts?: BrontoBindingOptsResolver): void;
+export declare function useDotGlyph(opts?: BrontoBindingOptsResolver): void;
+
+/** The `toast()` imperative (no lifecycle of its own). */
+export declare function useToast(): (message: string, opts?: ToastOpts) => Cleanup;
+
+export { applyStoredTheme } from '../behaviors/index.js';
+export { cls, ui, cx } from '../classes/index.js';