@vizejs/ui 0.386.0 → 0.388.0

package/dist/theme-preset-midnight.css

@@ -0,0 +1 @@
+@layer vize.tokens,vize.ui,vize.preset,vize.policy;@layer vize.preset{:where([data-vize-theme~=midnight],:host([data-vize-theme~=midnight])){--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--vize-ui-color-canvas:var(--lightningcss-light,oklch(96.5% .006 252))var(--lightningcss-dark,oklch(13.5% .02 265));--vize-ui-color-surface:var(--lightningcss-light,oklch(100% .002 252))var(--lightningcss-dark,oklch(20.5% .026 265));--vize-ui-color-text:var(--lightningcss-light,oklch(22% .02 260))var(--lightningcss-dark,oklch(94% .01 255));--vize-ui-color-text-muted:var(--lightningcss-light,oklab(53.29% -.00279304 -.0138204))var(--lightningcss-dark,oklab(65.02% -.00228396 -.0133545));--vize-ui-color-accent:var(--lightningcss-light,oklch(53% .18 268))var(--lightningcss-dark,oklch(76% .14 265));--vize-ui-color-accent-contrast:var(--lightningcss-light,oklch(100% 0 0))var(--lightningcss-dark,oklch(13% .03 265));--vize-ui-color-border:var(--lightningcss-light,oklch(85.5% .006 252))var(--lightningcss-dark,oklch(33% .034 265));--vize-ui-color-neutral:var(--lightningcss-light,oklch(46% .02 260))var(--lightningcss-dark,oklch(79% .024 260));--vize-ui-color-neutral-contrast:var(--lightningcss-light,oklch(100% 0 0))var(--lightningcss-dark,oklch(13% .02 265));--vize-ui-color-info:var(--lightningcss-light,oklch(50% .16 248))var(--lightningcss-dark,oklch(78% .14 245));--vize-ui-color-info-contrast:var(--lightningcss-light,oklch(100% 0 0))var(--lightningcss-dark,oklch(12% .03 248));--vize-ui-color-success:var(--lightningcss-light,oklch(48% .13 152))var(--lightningcss-dark,oklch(76% .13 152));--vize-ui-color-success-contrast:var(--lightningcss-light,oklch(100% 0 0))var(--lightningcss-dark,oklch(12% .028 152));--vize-ui-color-warning:var(--lightningcss-light,oklch(61% .15 80))var(--lightningcss-dark,oklch(86% .14 82));--vize-ui-color-warning-contrast:var(--lightningcss-light,oklch(16% .02 80))var(--lightningcss-dark,oklch(16% .02 82));--vize-ui-color-danger:var(--lightningcss-light,oklch(55% .19 25))var(--lightningcss-dark,oklch(74% .16 21));--vize-ui-color-danger-contrast:var(--lightningcss-light,oklch(100% 0 0))var(--lightningcss-dark,oklch(14% .03 21));--vize-ui-opacity-muted:.78;--vize-ui-z-overlay:1400;--vize-ui-elevation-raised:0 1px 2px oklch(8% .02 265/.28), 0 0 0 1px oklch(80% .04 265/.05);--vize-ui-elevation-overlay:0 10px 26px oklch(6% .02 265/.38), 0 3px 10px oklch(6% .02 265/.3);--vize-ui-elevation-floating:0 24px 60px oklch(4% .02 265/.46), 0 8px 22px oklch(6% .02 265/.34)}@media (prefers-color-scheme:dark){:where([data-vize-theme~=midnight],:host([data-vize-theme~=midnight])){--lightningcss-light: ;--lightningcss-dark:initial}}}

package/dist/theme-preset-paper.css

@@ -0,0 +1 @@
+@layer vize.tokens,vize.ui,vize.preset,vize.policy;@layer vize.preset{:where([data-vize-theme~=paper],:host([data-vize-theme~=paper])){--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--vize-ui-color-canvas:var(--lightningcss-light,oklch(98.5% .018 92))var(--lightningcss-dark,oklch(17% .018 82));--vize-ui-color-surface:var(--lightningcss-light,oklch(100% .011 96))var(--lightningcss-dark,oklch(23.5% .019 82));--vize-ui-color-text:var(--lightningcss-light,oklch(25% .026 235))var(--lightningcss-dark,oklch(94% .012 90));--vize-ui-color-text-muted:var(--lightningcss-light,oklab(52.93% -.00948476 -.0063689))var(--lightningcss-dark,oklab(67.82% .000851739 .0139804));--vize-ui-color-accent:var(--lightningcss-light,oklch(52% .11 185))var(--lightningcss-dark,oklch(74% .095 185));--vize-ui-color-accent-contrast:var(--lightningcss-light,oklch(99% .008 96))var(--lightningcss-dark,oklch(15% .02 185));--vize-ui-color-border:var(--lightningcss-light,oklch(85.5% .018 92))var(--lightningcss-dark,oklch(34% .021 82));--vize-ui-color-neutral:var(--lightningcss-light,oklch(47% .026 235))var(--lightningcss-dark,oklch(79% .017 90));--vize-ui-color-neutral-contrast:var(--lightningcss-light,oklch(100% .011 96))var(--lightningcss-dark,oklch(17% .018 82));--vize-ui-color-info:var(--lightningcss-light,oklch(48% .12 220))var(--lightningcss-dark,oklch(76% .11 215));--vize-ui-color-info-contrast:var(--lightningcss-light,oklch(100% .011 96))var(--lightningcss-dark,oklch(14% .026 220));--vize-ui-color-success:var(--lightningcss-light,oklch(47% .12 152))var(--lightningcss-dark,oklch(75% .11 150));--vize-ui-color-success-contrast:var(--lightningcss-light,oklch(100% .011 96))var(--lightningcss-dark,oklch(14% .026 150));--vize-ui-color-warning:var(--lightningcss-light,oklch(58% .14 75))var(--lightningcss-dark,oklch(83% .13 76));--vize-ui-color-warning-contrast:var(--lightningcss-light,oklch(18% .03 75))var(--lightningcss-dark,oklch(18% .03 76));--vize-ui-color-danger:var(--lightningcss-light,oklch(54% .17 31))var(--lightningcss-dark,oklch(72% .15 28));--vize-ui-color-danger-contrast:var(--lightningcss-light,oklch(100% .011 96))var(--lightningcss-dark,oklch(16% .03 28));--vize-ui-type-leading-normal:1.6;--vize-ui-radius-md:.375rem;--vize-ui-radius-lg:.75rem;--vize-ui-elevation-raised:0 1px 2px oklch(25% .026 235/.07), 0 1px 4px oklch(25% .026 235/.08);--vize-ui-elevation-overlay:0 6px 18px oklch(25% .026 235/.13), 0 2px 6px oklch(25% .026 235/.09);--vize-ui-elevation-floating:0 18px 44px oklch(25% .026 235/.16), 0 6px 16px oklch(25% .026 235/.1)}@media (prefers-color-scheme:dark){:where([data-vize-theme~=paper],:host([data-vize-theme~=paper])){--lightningcss-light: ;--lightningcss-dark:initial}}}

package/dist/theme-preset-play.css

@@ -0,0 +1 @@
+@layer vize.tokens,vize.ui,vize.preset,vize.policy;@layer vize.preset{:where([data-vize-theme~=play],:host([data-vize-theme~=play])){--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--vize-ui-color-canvas:var(--lightningcss-light,oklch(97.3% .032 330))var(--lightningcss-dark,oklch(17% .035 296));--vize-ui-color-surface:var(--lightningcss-light,oklch(99.8% .015 88))var(--lightningcss-dark,oklch(23.5% .042 303));--vize-ui-color-text:var(--lightningcss-light,oklch(22% .035 286))var(--lightningcss-dark,oklch(94.5% .016 84));--vize-ui-color-text-muted:var(--lightningcss-light,oklab(53.626% .0172348 -.0262336))var(--lightningcss-dark,oklab(66.6% .00659385 -.0011409));--vize-ui-color-accent:var(--lightningcss-light,oklch(61% .205 355))var(--lightningcss-dark,oklch(78% .17 18));--vize-ui-color-accent-contrast:var(--lightningcss-light,oklch(100% 0 0))var(--lightningcss-dark,oklch(16% .035 18));--vize-ui-color-border:var(--lightningcss-light,oklch(86.3% .032 330))var(--lightningcss-dark,oklch(39% .046 303));--vize-ui-color-neutral:var(--lightningcss-light,oklch(47% .04 286))var(--lightningcss-dark,oklch(82% .035 84));--vize-ui-color-neutral-contrast:var(--lightningcss-light,oklch(100% .015 88))var(--lightningcss-dark,oklch(17% .035 296));--vize-ui-color-info:var(--lightningcss-light,oklch(55% .16 235))var(--lightningcss-dark,oklch(80% .14 232));--vize-ui-color-info-contrast:var(--lightningcss-light,oklch(100% 0 0))var(--lightningcss-dark,oklch(14% .04 235));--vize-ui-color-success:var(--lightningcss-light,oklch(52% .15 148))var(--lightningcss-dark,oklch(78% .14 150));--vize-ui-color-success-contrast:var(--lightningcss-light,oklch(100% 0 0))var(--lightningcss-dark,oklch(14% .04 150));--vize-ui-color-warning:var(--lightningcss-light,oklch(68% .17 82))var(--lightningcss-dark,oklch(88% .15 86));--vize-ui-color-warning-contrast:var(--lightningcss-light,oklch(18% .04 82))var(--lightningcss-dark,oklch(18% .04 86));--vize-ui-color-danger:var(--lightningcss-light,oklch(55% .2 28))var(--lightningcss-dark,oklch(76% .16 32));--vize-ui-color-danger-contrast:var(--lightningcss-light,oklch(100% 0 0))var(--lightningcss-dark,oklch(16% .04 32));--vize-ui-type-leading-normal:1.55;--vize-ui-radius-md:.75rem;--vize-ui-radius-lg:1.25rem;--vize-ui-z-toast:1600;--vize-ui-elevation-raised:0 2px 4px oklch(25% .06 310/.1), 0 8px 18px oklch(55% .16 355/.1);--vize-ui-elevation-overlay:0 8px 24px oklch(25% .06 310/.16), 0 3px 8px oklch(62% .18 24/.12);--vize-ui-elevation-floating:0 20px 54px oklch(25% .06 310/.22), 0 8px 22px oklch(62% .18 24/.14)}@media (prefers-color-scheme:dark){:where([data-vize-theme~=play],:host([data-vize-theme~=play])){--lightningcss-light: ;--lightningcss-dark:initial}}}

package/dist/theme-preset-signal.css

@@ -0,0 +1 @@
+@layer vize.tokens,vize.ui,vize.preset,vize.policy;@layer vize.preset{:where([data-vize-theme~=signal],:host([data-vize-theme~=signal])){--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--vize-ui-color-canvas:var(--lightningcss-light,oklch(97.5% .004 225))var(--lightningcss-dark,oklch(16% .012 230));--vize-ui-color-surface:var(--lightningcss-light,oklch(99.5% .002 225))var(--lightningcss-dark,oklch(21.5% .014 230));--vize-ui-color-text:var(--lightningcss-light,oklch(21% .013 230))var(--lightningcss-dark,oklch(92% .007 225));--vize-ui-color-text-muted:var(--lightningcss-light,oklab(51.6% -.00614511 -.00710652))var(--lightningcss-dark,oklab(63.12% -.00599996 -.00656201));--vize-ui-color-accent:var(--lightningcss-light,oklch(49% .11 184))var(--lightningcss-dark,oklch(78% .105 176));--vize-ui-color-accent-contrast:var(--lightningcss-light,oklch(100% 0 0))var(--lightningcss-dark,oklch(13% .025 180));--vize-ui-color-border:var(--lightningcss-light,oklch(85.5% .004 225))var(--lightningcss-dark,oklch(36% .016 230));--vize-ui-color-neutral:var(--lightningcss-light,oklch(45% .014 230))var(--lightningcss-dark,oklch(77% .014 225));--vize-ui-color-neutral-contrast:var(--lightningcss-light,oklch(100% 0 0))var(--lightningcss-dark,oklch(15% .012 230));--vize-ui-color-info:var(--lightningcss-light,oklch(48% .115 210))var(--lightningcss-dark,oklch(78% .11 205));--vize-ui-color-info-contrast:var(--lightningcss-light,oklch(100% 0 0))var(--lightningcss-dark,oklch(12% .026 210));--vize-ui-color-success:var(--lightningcss-light,oklch(46% .12 154))var(--lightningcss-dark,oklch(76% .11 154));--vize-ui-color-success-contrast:var(--lightningcss-light,oklch(100% 0 0))var(--lightningcss-dark,oklch(12% .026 154));--vize-ui-color-warning:var(--lightningcss-light,oklch(57% .13 80))var(--lightningcss-dark,oklch(84% .12 82));--vize-ui-color-warning-contrast:var(--lightningcss-light,oklch(16% .02 80))var(--lightningcss-dark,oklch(16% .02 82));--vize-ui-color-danger:var(--lightningcss-light,oklch(53% .17 30))var(--lightningcss-dark,oklch(73% .14 27));--vize-ui-color-danger-contrast:var(--lightningcss-light,oklch(100% 0 0))var(--lightningcss-dark,oklch(14% .026 27));--vize-ui-type-leading-normal:1.42;--vize-ui-radius-md:.3125rem;--vize-ui-opacity-muted:.82;--vize-ui-elevation-raised:0 1px 1px oklch(12% .012 230/.08), 0 0 0 1px oklch(12% .012 230/.06);--vize-ui-elevation-overlay:0 6px 16px oklch(10% .012 230/.18), 0 0 0 1px oklch(10% .012 230/.08);--vize-ui-elevation-floating:0 16px 36px oklch(8% .012 230/.24), 0 3px 10px oklch(8% .012 230/.16)}@media (prefers-color-scheme:dark){:where([data-vize-theme~=signal],:host([data-vize-theme~=signal])){--lightningcss-light: ;--lightningcss-dark:initial}}}

package/dist/theme-scope.d.mts

@@ -0,0 +1,25 @@
+import { f as ThemeScopeAttributeName, h as ThemeScopeStorageKeyName, i as ThemeDensityScale, l as ThemePresetName, m as ThemeScopeOptions, p as ThemeScopeAttributes, t as ThemeBootstrapOptions } from "./theme-types-CkIa4Sa3.mjs";
+
+//#region src/families/foundations/theme/theme-scope.d.ts
+/** Storage keys read by {@link createThemeBootstrapScript}. */
+declare const themeScopeStorageKeys: Readonly<Record<ThemeScopeStorageKeyName, string>>;
+/** Normalize theme scope options into renderable attributes. */
+declare function themeScopeAttributes(scope?: ThemeScopeOptions): Readonly<ThemeScopeAttributes>;
+/**
+ * Apply theme scope attributes to one element and return a restorer.
+ *
+ * This is the imperative counterpart to rendering {@link themeScopeAttributes}
+ * in Vue. Only provided attributes are touched; unrelated consumer attributes
+ * and nested scopes remain owned by the application.
+ */
+declare function applyThemeScope(element: Element, scope: ThemeScopeOptions): () => void;
+/**
+ * Create a small inline script that applies persisted theme attributes before paint.
+ *
+ * The script validates stored values against this package's published preset
+ * and density lists, falls back to server-rendered defaults when storage is
+ * empty or blocked, and otherwise does nothing on non-browser runtimes.
+ */
+declare function createThemeBootstrapScript(options?: ThemeBootstrapOptions): string;
+//#endregion
+export { type ThemeBootstrapOptions, type ThemeDensityScale, type ThemePresetName, type ThemeScopeAttributeName, type ThemeScopeAttributes, type ThemeScopeOptions, type ThemeScopeStorageKeyName, applyThemeScope, createThemeBootstrapScript, themeScopeAttributes, themeScopeStorageKeys };

package/dist/theme-scope.mjs

@@ -0,0 +1,89 @@
+import { a as themePresets, i as themePresetAttribute, n as themeDensityAttribute, r as themeDensityScales } from "./theme-constants-DAwnxG-P.mjs";
+//#region src/families/foundations/theme/theme-scope.ts
+const invalidScopeDiagnostic = "VIZE_UI_THEME_SCOPE";
+/** Storage keys read by {@link createThemeBootstrapScript}. */
+const themeScopeStorageKeys = Object.freeze({
+	presets: "vize-ui-theme",
+	density: "vize-ui-density"
+});
+function assertPresetName(name) {
+	if (!themePresets.includes(name)) throw new TypeError(`${invalidScopeDiagnostic}: unknown theme preset "${name}"`);
+}
+function assertDensityName(name) {
+	if (!Object.hasOwn(themeDensityScales, name)) throw new TypeError(`${invalidScopeDiagnostic}: unknown theme density "${name}"`);
+}
+function assertStorageKey(name, value) {
+	if (typeof value !== "string" || value.trim().length === 0) throw new TypeError(`${invalidScopeDiagnostic}: ${name} storage key needs a non-empty string`);
+}
+function normalizePresets(presets) {
+	if (presets === void 0) return void 0;
+	const values = typeof presets === "string" ? presets.trim().split(/\s+/) : [...presets];
+	const normalized = [];
+	const seen = /* @__PURE__ */ new Set();
+	for (const value of values) {
+		if (typeof value !== "string" || value.trim().length === 0) continue;
+		const preset = value.trim();
+		assertPresetName(preset);
+		if (!seen.has(preset)) {
+			seen.add(preset);
+			normalized.push(preset);
+		}
+	}
+	return normalized.length === 0 ? void 0 : normalized.join(" ");
+}
+function normalizeDensity(density) {
+	if (density === void 0) return void 0;
+	assertDensityName(density);
+	return density;
+}
+/** Normalize theme scope options into renderable attributes. */
+function themeScopeAttributes(scope = {}) {
+	const attributes = {};
+	const presets = normalizePresets(scope.presets);
+	const density = normalizeDensity(scope.density);
+	if (presets !== void 0) attributes[themePresetAttribute] = presets;
+	if (density !== void 0) attributes[themeDensityAttribute] = density;
+	return Object.freeze(attributes);
+}
+/**
+* Apply theme scope attributes to one element and return a restorer.
+*
+* This is the imperative counterpart to rendering {@link themeScopeAttributes}
+* in Vue. Only provided attributes are touched; unrelated consumer attributes
+* and nested scopes remain owned by the application.
+*/
+function applyThemeScope(element, scope) {
+	if (typeof element?.setAttribute !== "function" || typeof element?.removeAttribute !== "function" || typeof element?.getAttribute !== "function") throw new TypeError(`${invalidScopeDiagnostic}: theme scopes need an Element`);
+	const attributes = themeScopeAttributes(scope);
+	const previous = /* @__PURE__ */ new Map();
+	for (const [attribute, value] of Object.entries(attributes)) {
+		previous.set(attribute, element.getAttribute(attribute));
+		element.setAttribute(attribute, value);
+	}
+	return () => {
+		for (const [attribute, value] of previous) if (value === null) element.removeAttribute(attribute);
+		else element.setAttribute(attribute, value);
+		previous.clear();
+	};
+}
+/**
+* Create a small inline script that applies persisted theme attributes before paint.
+*
+* The script validates stored values against this package's published preset
+* and density lists, falls back to server-rendered defaults when storage is
+* empty or blocked, and otherwise does nothing on non-browser runtimes.
+*/
+function createThemeBootstrapScript(options = {}) {
+	const storageKeys = {
+		...themeScopeStorageKeys,
+		...options.storageKeys
+	};
+	assertStorageKey("presets", storageKeys.presets);
+	assertStorageKey("density", storageKeys.density);
+	const fallback = themeScopeAttributes(options.fallback);
+	const fallbackPresets = fallback["data-vize-theme"] ?? "";
+	const fallbackDensity = fallback["data-vize-density"] ?? "";
+	return `(function(){try{var root=document.documentElement;if(!root)return;var presets=${JSON.stringify(themePresets)};var densities=${JSON.stringify(Object.keys(themeDensityScales))};function read(key){try{return globalThis.localStorage&&globalThis.localStorage.getItem(key)||""}catch(_){return""}}function normalizeTheme(value){var out=[];var seen=Object.create(null);String(value||"").trim().split(/\\s+/).forEach(function(part){if(!part)return;if(presets.indexOf(part)<0){out=[];seen=null;return}if(seen&&!seen[part]){seen[part]=1;out.push(part)}});return seen?out.join(" "):""}var theme=normalizeTheme(read(${JSON.stringify(storageKeys.presets)}))||${JSON.stringify(fallbackPresets)};if(theme)root.setAttribute(${JSON.stringify(themePresetAttribute)},theme);var density=read(${JSON.stringify(storageKeys.density)});if(densities.indexOf(density)<0)density=${JSON.stringify(fallbackDensity)};if(density)root.setAttribute(${JSON.stringify(themeDensityAttribute)},density)}catch(_){}})();`;
+}
+//#endregion
+export { applyThemeScope, createThemeBootstrapScript, themeScopeAttributes, themeScopeStorageKeys };

package/dist/theme-types-CkIa4Sa3.d.mts

@@ -0,0 +1,71 @@
+//#region src/families/foundations/theme/theme-types.d.ts
+/** Feedback semantic tone roles and their readable foreground pairings. */
+type ThemeFeedbackToneToken = "neutral" | "neutral-contrast" | "info" | "info-contrast" | "success" | "success-contrast" | "warning" | "warning-contrast" | "danger" | "danger-contrast";
+/** Semantic color roles. */
+type ThemeColorToken = "canvas" | "surface" | "text" | "text-muted" | "accent" | "accent-contrast" | "border" | ThemeFeedbackToneToken;
+/** Typography tokens: families, the size scale, line heights, and weights. */
+type ThemeTypeToken = "family-sans" | "family-mono" | `size-${"xs" | "sm" | "md" | "lg" | "xl" | "2xl"}` | `leading-${"tight" | "normal" | "loose"}` | `weight-${"regular" | "medium" | "bold"}`;
+/** Named steps on the density-responsive space scale. */
+type ThemeSpaceToken = "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
+/** Density-responsive control sizes. */
+type ThemeSizeToken = "control-sm" | "control-md" | "control-lg";
+/** Corner radii. */
+type ThemeRadiusToken = "sm" | "md" | "lg" | "full";
+/** Border widths. */
+type ThemeBorderToken = "width-thin" | "width-thick";
+/** Elevation roles rendered as box shadows. */
+type ThemeElevationToken = "raised" | "overlay" | "floating";
+/** Opacity roles. */
+type ThemeOpacityToken = "muted" | "disabled";
+/** Layered-surface slots on the shared z-index registry. */
+type ThemeZIndexToken = "sticky" | "dropdown" | "overlay" | "toast";
+/** Focus-ring geometry and color. */
+type ThemeFocusToken = "ring-width" | "ring-offset" | "ring-color";
+/** Independent token groups that can be composed with any preset. */
+type ThemeTokenPackName = "color" | "typography" | "space" | "size" | "radius" | "border" | "elevation" | "opacity" | "z-index" | "focus" | "density";
+/** Suffix of one `--vize-ui-*` theme custom property. */
+type ThemeTokenName = `color-${ThemeColorToken}` | `type-${ThemeTypeToken}` | `space-${ThemeSpaceToken}` | `size-${ThemeSizeToken}` | `radius-${ThemeRadiusToken}` | `border-${ThemeBorderToken}` | `elevation-${ThemeElevationToken}` | `opacity-${ThemeOpacityToken}` | `z-${ThemeZIndexToken}` | `focus-${ThemeFocusToken}` | "density";
+/** Custom-property overrides applied by {@link setThemeTokens}. */
+type ThemeTokenOverrides = { readonly [Name in ThemeTokenName]?: string };
+/** Presets accepted in the space-separated `data-vize-theme` attribute. */
+type ThemePresetName = "headless" | "atelier" | "midnight" | "paper" | "play" | "signal" | "high-contrast";
+/** CSS-only package export that ships semantic tokens and accessibility policy. */
+type ThemeTokenStylesheetSpecifier = "./theme.css";
+/** CSS-only package export for one opt-in visual preset. */
+type ThemePresetStylesheetSpecifier<Name extends ThemePresetName = ThemePresetName> = `./theme-preset-${Name}.css`;
+/** Density scopes accepted in the `data-vize-density` attribute. */
+type ThemeDensityScale = "compact" | "comfortable";
+/** Attribute names owned by the theme scope helpers. */
+type ThemeScopeAttributeName = "data-vize-theme" | "data-vize-density";
+/** Serialized attributes that can be rendered on any Vue root or nested scope. */
+type ThemeScopeAttributes = Partial<Record<ThemeScopeAttributeName, string>>;
+/** Options for a declarative theme scope. */
+interface ThemeScopeOptions {
+  /** Opt-in preset name or array-composed preset names. */
+  readonly presets?: ThemePresetName | readonly ThemePresetName[];
+  /**
+   * Density scale applied through inherited custom properties.
+   *
+   * @default undefined
+   */
+  readonly density?: ThemeDensityScale;
+}
+/** Storage keys consumed by the no-flash theme bootstrap script. */
+type ThemeScopeStorageKeyName = "presets" | "density";
+/** Options for {@link createThemeBootstrapScript}. */
+interface ThemeBootstrapOptions {
+  /**
+   * Storage keys to read before first paint.
+   *
+   * @default { presets: "vize-ui-theme", density: "vize-ui-density" }
+   */
+  readonly storageKeys?: Partial<Record<ThemeScopeStorageKeyName, string>>;
+  /**
+   * Server-rendered fallback attributes used when storage is empty or blocked.
+   *
+   * @default undefined
+   */
+  readonly fallback?: ThemeScopeOptions;
+}
+//#endregion
+export { ThemeZIndexToken as C, ThemeTypeToken as S, ThemeSpaceToken as _, ThemeElevationToken as a, ThemeTokenPackName as b, ThemeOpacityToken as c, ThemeRadiusToken as d, ThemeScopeAttributeName as f, ThemeSizeToken as g, ThemeScopeStorageKeyName as h, ThemeDensityScale as i, ThemePresetName as l, ThemeScopeOptions as m, ThemeBorderToken as n, ThemeFeedbackToneToken as o, ThemeScopeAttributes as p, ThemeColorToken as r, ThemeFocusToken as s, ThemeBootstrapOptions as t, ThemePresetStylesheetSpecifier as u, ThemeTokenName as v, ThemeTokenStylesheetSpecifier as x, ThemeTokenOverrides as y };

package/dist/theme.css

@@ -0,0 +1 @@
+@layer vize.tokens,vize.ui,vize.preset,vize.policy;@layer vize.tokens{:where(:root,:host){--vize-ui-color-canvas:Canvas;--vize-ui-color-surface:Canvas;--vize-ui-color-text:CanvasText;--vize-ui-color-text-muted:GrayText;--vize-ui-color-accent:LinkText;--vize-ui-color-accent-contrast:Canvas;--vize-ui-color-border:GrayText;--vize-ui-color-neutral:CanvasText;--vize-ui-color-neutral-contrast:Canvas;--vize-ui-color-info:LinkText;--vize-ui-color-info-contrast:Canvas;--vize-ui-color-success:CanvasText;--vize-ui-color-success-contrast:Canvas;--vize-ui-color-warning:CanvasText;--vize-ui-color-warning-contrast:Canvas;--vize-ui-color-danger:#d92d20;--vize-ui-color-danger-contrast:Canvas;--vize-ui-type-family-sans:system-ui, sans-serif;--vize-ui-type-family-mono:ui-monospace, monospace;--vize-ui-type-size-xs:.75rem;--vize-ui-type-size-sm:.875rem;--vize-ui-type-size-md:1rem;--vize-ui-type-size-lg:1.125rem;--vize-ui-type-size-xl:1.25rem;--vize-ui-type-size-2xl:1.5rem;--vize-ui-type-leading-tight:1.25;--vize-ui-type-leading-normal:1.5;--vize-ui-type-leading-loose:1.75;--vize-ui-type-weight-regular:400;--vize-ui-type-weight-medium:500;--vize-ui-type-weight-bold:700;--vize-ui-density:1;--vize-ui-space-xs:calc(.25rem * var(--vize-ui-density));--vize-ui-space-sm:calc(.5rem * var(--vize-ui-density));--vize-ui-space-md:calc(.75rem * var(--vize-ui-density));--vize-ui-space-lg:calc(1rem * var(--vize-ui-density));--vize-ui-space-xl:calc(1.5rem * var(--vize-ui-density));--vize-ui-space-2xl:calc(2rem * var(--vize-ui-density));--vize-ui-space-3xl:calc(3rem * var(--vize-ui-density));--vize-ui-size-control-sm:calc(1.75rem * var(--vize-ui-density));--vize-ui-size-control-md:calc(2.25rem * var(--vize-ui-density));--vize-ui-size-control-lg:calc(2.75rem * var(--vize-ui-density));--vize-ui-radius-sm:.25rem;--vize-ui-radius-md:.5rem;--vize-ui-radius-lg:1rem;--vize-ui-radius-full:9999px;--vize-ui-border-width-thin:1px;--vize-ui-border-width-thick:2px;--vize-ui-elevation-raised:none;--vize-ui-elevation-overlay:none;--vize-ui-elevation-floating:none;--vize-ui-opacity-muted:.7;--vize-ui-opacity-disabled:.45;--vize-ui-z-sticky:100;--vize-ui-z-dropdown:600;--vize-ui-z-overlay:1000;--vize-ui-z-toast:1200;--vize-ui-focus-ring-width:2px;--vize-ui-focus-ring-offset:2px;--vize-ui-focus-ring-color:var(--vize-ui-color-accent)}:where([data-vize-density]):where([data-vize-density=compact]){--vize-ui-density:.85}:where([data-vize-density]):where([data-vize-density=comfortable]){--vize-ui-density:1.15}}@layer vize.ui,vize.preset;@layer vize.policy{@media (forced-colors:active){:where(:root,:host,[data-vize-theme]){--vize-ui-color-canvas:Canvas;--vize-ui-color-surface:Canvas;--vize-ui-color-text:CanvasText;--vize-ui-color-text-muted:GrayText;--vize-ui-color-accent:Highlight;--vize-ui-color-accent-contrast:HighlightText;--vize-ui-color-border:ButtonBorder;--vize-ui-color-neutral:CanvasText;--vize-ui-color-neutral-contrast:Canvas;--vize-ui-color-info:Highlight;--vize-ui-color-info-contrast:HighlightText;--vize-ui-color-success:CanvasText;--vize-ui-color-success-contrast:Canvas;--vize-ui-color-warning:CanvasText;--vize-ui-color-warning-contrast:Canvas;--vize-ui-color-danger:CanvasText;--vize-ui-color-danger-contrast:Canvas;--vize-ui-elevation-raised:none;--vize-ui-elevation-overlay:none;--vize-ui-elevation-floating:none;--vize-ui-focus-ring-color:Highlight}}}

package/dist/theme.d.mts

@@ -0,0 +1,3 @@
+import { C as ThemeZIndexToken, S as ThemeTypeToken, _ as ThemeSpaceToken, a as ThemeElevationToken, b as ThemeTokenPackName, c as ThemeOpacityToken, d as ThemeRadiusToken, g as ThemeSizeToken, i as ThemeDensityScale, l as ThemePresetName, n as ThemeBorderToken, o as ThemeFeedbackToneToken, r as ThemeColorToken, s as ThemeFocusToken, u as ThemePresetStylesheetSpecifier, v as ThemeTokenName, x as ThemeTokenStylesheetSpecifier, y as ThemeTokenOverrides } from "./theme-types-CkIa4Sa3.mjs";
+import { a as themeTokens, c as themeDensityAttribute, d as themePresets, i as themeTokenVar, l as themeDensityScales, n as themeTokenPackNames, o as themeTokensForPack, r as themeTokenProperty, s as themeCascadeLayerOrder, t as setThemeTokens, u as themePresetAttribute } from "./theme-CNK06Pja.mjs";
+export { type ThemeBorderToken, type ThemeColorToken, type ThemeDensityScale, type ThemeElevationToken, type ThemeFeedbackToneToken, type ThemeFocusToken, type ThemeOpacityToken, type ThemePresetName, type ThemePresetStylesheetSpecifier, type ThemeRadiusToken, type ThemeSizeToken, type ThemeSpaceToken, type ThemeTokenName, type ThemeTokenOverrides, type ThemeTokenPackName, type ThemeTokenStylesheetSpecifier, type ThemeTypeToken, type ThemeZIndexToken, setThemeTokens, themeCascadeLayerOrder, themeDensityAttribute, themeDensityScales, themePresetAttribute, themePresets, themeTokenPackNames, themeTokenProperty, themeTokenVar, themeTokens, themeTokensForPack };

package/dist/theme.mjs

@@ -0,0 +1,3 @@
+import { a as themeTokens, i as themeTokenVar, n as themeTokenPackNames, o as themeTokensForPack, r as themeTokenProperty, t as setThemeTokens } from "./theme-C8Crmb8V.mjs";
+import { a as themePresets, i as themePresetAttribute, n as themeDensityAttribute, r as themeDensityScales, t as themeCascadeLayerOrder } from "./theme-constants-DAwnxG-P.mjs";
+export { setThemeTokens, themeCascadeLayerOrder, themeDensityAttribute, themeDensityScales, themePresetAttribute, themePresets, themeTokenPackNames, themeTokenProperty, themeTokenVar, themeTokens, themeTokensForPack };

package/dist/toggle-CBTXzwze.mjs

@@ -0,0 +1,141 @@
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
+import { useControllableState } from "./controllable-state.mjs";
+import { computed, createBlock, defineComponent, openBlock, renderSlot, resolveDynamicComponent, unref, useTemplateRef, withCtx } from "vue";
+//#endregion
+//#region src/families/selection/toggle/toggle-button.vue
+var toggle_button_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "toggle-button",
+	props: {
+		as: {
+			type: null,
+			required: false,
+			default: "button"
+		},
+		native: {
+			type: Boolean,
+			required: false,
+			default: () => void 0
+		},
+		type: {
+			type: String,
+			required: false,
+			default: "button"
+		},
+		modelValue: {
+			type: Boolean,
+			required: false,
+			default: () => void 0
+		},
+		defaultPressed: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		ariaLabel: {
+			type: String,
+			required: false
+		}
+	},
+	emits: ["update:modelValue", "change"],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		function getToggleKeyboardAction(key, phase) {
+			if (key === "Enter") return phase === "keydown" ? "activate" : "ignore";
+			if (key === " ") return phase === "keydown" ? "prevent" : "activate";
+			return "ignore";
+		}
+		const emit = __emit;
+		const element = useTemplateRef("element");
+		const isNativeButton = computed(() => __props.native ?? __props.as === "button");
+		const state = useControllableState({
+			value: () => __props.modelValue,
+			defaultValue: () => __props.defaultPressed,
+			onChange: (value) => emit("update:modelValue", value)
+		});
+		const pressed = state.value;
+		const tabIndex = computed(() => {
+			if (isNativeButton.value) return void 0;
+			return __props.disabled ? -1 : 0;
+		});
+		function onClick(event) {
+			if (__props.disabled) {
+				event.preventDefault();
+				event.stopImmediatePropagation();
+				return;
+			}
+			const next = !pressed.value;
+			state.set(next);
+			emit("change", next, event);
+		}
+		function onKeyboard(event, phase) {
+			if (isNativeButton.value) return;
+			const action = getToggleKeyboardAction(event.key, phase);
+			if (action === "ignore") return;
+			event.preventDefault();
+			if (__props.disabled) {
+				event.stopImmediatePropagation();
+				return;
+			}
+			if (action === "activate" && event.currentTarget instanceof HTMLElement) event.currentTarget.click();
+		}
+		function onKeydown(event) {
+			onKeyboard(event, "keydown");
+		}
+		function onKeyup(event) {
+			onKeyboard(event, "keyup");
+		}
+		/** Move focus to the rendered control when it exposes a focus method. */
+		function focus(options) {
+			focusTarget(element.value, options);
+		}
+		function focusTarget(target, options) {
+			if (typeof target === "object" && target !== null && "focus" in target && typeof target.focus === "function") target.focus(options);
+		}
+		__expose({
+			element,
+			focus,
+			pressed,
+			reset: state.reset,
+			setPressed: state.set
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(resolveDynamicComponent(__props.as), {
+				ref_key: "element",
+				ref: element,
+				type: isNativeButton.value ? __props.type : void 0,
+				disabled: isNativeButton.value ? __props.disabled : void 0,
+				role: isNativeButton.value ? void 0 : "button",
+				tabindex: tabIndex.value,
+				"aria-label": __props.ariaLabel,
+				"aria-disabled": __props.disabled && !isNativeButton.value ? "true" : void 0,
+				"aria-pressed": unref(pressed) ? "true" : "false",
+				"data-vize-ui": "toggle",
+				"data-state": __props.disabled ? "disabled" : unref(pressed) ? "pressed" : "unpressed",
+				onClick,
+				onKeydown,
+				onKeyup
+			}, {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", {
+					disabled: __props.disabled,
+					pressed: unref(pressed)
+				}, void 0, true)]),
+				_: 3
+			}, 40, [
+				"type",
+				"disabled",
+				"role",
+				"tabindex",
+				"aria-label",
+				"aria-disabled",
+				"aria-pressed",
+				"data-state"
+			]);
+		};
+	}
+}), [["__scopeId", "data-v-0ac488b9"]]);
+//#endregion
+export { toggle_button_default as t };

package/dist/toggle-group-DO7eGEs3.d.mts

@@ -0,0 +1,147 @@
+import { n as PrimitiveElement, t as PrimitiveAs } from "./primitive-BE2mdUcw.mjs";
+import { ComputedRef } from "vue";
+
+//#region src/families/selection/toggle-group/toggle-group-types.d.ts
+/** Selection mode owned by the ToggleGroup root. */
+type ToggleGroupType = "single" | "multiple";
+/** Controlled or uncontrolled ToggleGroup value. */
+type ToggleGroupValue = string | readonly string[] | null;
+/** Directional layout hint used for roving keyboard focus. */
+type ToggleGroupOrientation = "horizontal" | "vertical";
+/** State exposed by the ToggleGroup root data contract. */
+type ToggleGroupState = "disabled" | "empty" | "selected";
+/** State exposed by each ToggleGroup item data contract. */
+type ToggleGroupItemState = "disabled" | "pressed" | "unpressed";
+/** State exposed to the ToggleGroup default slot. */
+interface ToggleGroupSlotState {
+  /** Current selected value: a string, an array for multiple mode, or null for no single selection. */
+  readonly value: ToggleGroupValue;
+  /** Current pressed values normalized to an immutable array. */
+  readonly pressedValues: readonly string[];
+  /** Whether the group suppresses every item activation. */
+  readonly disabled: boolean;
+  /** Selection mode used by item activation. */
+  readonly type: ToggleGroupType;
+  /** Directional layout hint used by roving focus. */
+  readonly orientation: ToggleGroupOrientation;
+  /** Stable state token for styling and tests. */
+  readonly state: ToggleGroupState;
+}
+/** Public instance exposed by ToggleGroup. */
+interface ToggleGroupExpose extends ToggleGroupSlotState {
+  /** Rendered root element or component instance. */
+  readonly element: PrimitiveElement | null;
+  /** Move focus to the active, selected, or first enabled item. */
+  readonly focus: (options?: FocusOptions) => void;
+  /** Request a group value update and report whether it differs. */
+  readonly setValue: (value: ToggleGroupValue) => boolean;
+  /** Toggle one item value programmatically and report whether it differs. */
+  readonly toggleValue: (value: string, pressed?: boolean) => boolean;
+  /** Restore the current default value and report whether it changed. */
+  readonly reset: () => boolean;
+}
+/** State exposed to a ToggleGroupItem slot. */
+interface ToggleGroupItemSlotState {
+  /** Item value used by the group selection model. */
+  readonly value: string;
+  /** Whether this item is pressed by the group. */
+  readonly pressed: boolean;
+  /** Whether this item or its group suppresses activation. */
+  readonly disabled: boolean;
+  /** Directional layout hint inherited from the group. */
+  readonly orientation: ToggleGroupOrientation;
+  /** Stable state token for styling and tests. */
+  readonly state: ToggleGroupItemState;
+}
+/** Public instance exposed by ToggleGroupItem. */
+interface ToggleGroupItemExpose extends ToggleGroupItemSlotState {
+  /** Rendered item element or component instance. */
+  readonly element: PrimitiveElement | null;
+  /** Move focus to the rendered item. */
+  readonly focus: (options?: FocusOptions) => void;
+}
+//#endregion
+//#region src/families/selection/toggle-group/toggle-group.vue.d.ts
+type __VLS_Props$1 = {
+  /** Native element, custom element, or component to render. @default "div" */readonly as?: PrimitiveAs; /** Selection mode for item activation. @default "single" */
+  readonly type?: ToggleGroupType; /** Controlled selected value. `undefined` selects uncontrolled behavior. @default undefined */
+  readonly modelValue?: ToggleGroupValue; /** Initial value for uncontrolled use and the value restored by reset. @default undefined */
+  readonly defaultValue?: ToggleGroupValue; /** Disable every item and remove the group from roving focus. @default false */
+  readonly disabled?: boolean; /** Directional layout hint used by arrow-key roving focus. @default "horizontal" */
+  readonly orientation?: ToggleGroupOrientation; /** Whether arrow-key navigation wraps at the first and last enabled item. @default true */
+  readonly loop?: boolean; /** Whether items participate in a single-tabstop roving focus model. @default true */
+  readonly rovingFocus?: boolean; /** Accessible name when no visible label or `aria-labelledby` supplies one. @default undefined */
+  readonly ariaLabel?: string; /** Space-separated ids that label the group. @default undefined */
+  readonly ariaLabelledby?: string; /** Space-separated ids that describe the group. @default undefined */
+  readonly ariaDescribedby?: string;
+};
+type __VLS_Slots$1 = {
+  /** Compound ToggleGroup items. Receives normalized selection and navigation state. */default(props: ToggleGroupSlotState): unknown;
+};
+declare function focus$1(options?: FocusOptions): void;
+declare function setValue(next: ToggleGroupValue): boolean;
+declare function toggleValue(itemValue: string, pressed?: boolean): boolean;
+declare const __VLS_base$1: import("vue").DefineComponent<__VLS_Props$1, {
+  disabled: ComputedRef<boolean>;
+  element: Readonly<import("vue").ShallowRef<PrimitiveElement | null>>;
+  focus: typeof focus$1;
+  orientation: ComputedRef<ToggleGroupOrientation>;
+  pressedValues: ComputedRef<readonly string[]>;
+  reset: () => boolean;
+  setValue: typeof setValue;
+  state: ComputedRef<ToggleGroupState>;
+  toggleValue: typeof toggleValue;
+  type: ComputedRef<ToggleGroupType>;
+  value: ComputedRef<ToggleGroupValue>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+  "update:modelValue": (value: ToggleGroupValue) => any;
+  change: (value: ToggleGroupValue, previous: ToggleGroupValue, nativeEvent: MouseEvent) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props$1> & Readonly<{
+  "onUpdate:modelValue"?: (value: ToggleGroupValue) => any;
+  onChange?: (value: ToggleGroupValue, previous: ToggleGroupValue, nativeEvent: MouseEvent) => any;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export$1: __VLS_WithSlots$1<typeof __VLS_base$1, __VLS_Slots$1>;
+declare const _default$1: typeof __VLS_export$1;
+type __VLS_WithSlots$1<T, S> = T & {
+  new (): {
+    $slots: S;
+  };
+};
+//#endregion
+//#region src/families/selection/toggle-group/toggle-group-item.vue.d.ts
+type __VLS_Props = {
+  /** Native element, custom element, or component to render. @default "button" */readonly as?: PrimitiveAs; /** Whether the rendered target already implements native button semantics. @default auto */
+  readonly native?: boolean; /** Native button submission behavior. @default "button" */
+  readonly type?: "button" | "reset" | "submit"; /** Item value used by the group selection model. @default required */
+  readonly value: string; /** Disable this item while preserving the rest of the group. @default false */
+  readonly disabled?: boolean; /** Accessible name when no visible label or `aria-labelledby` supplies one. @default undefined */
+  readonly ariaLabel?: string; /** Space-separated ids that label this item. @default undefined */
+  readonly ariaLabelledby?: string; /** Space-separated ids that describe this item. @default undefined */
+  readonly ariaDescribedby?: string;
+};
+type __VLS_Slots = {
+  /** Renders item contents with current pressed and availability state. */default(props: ToggleGroupItemSlotState): unknown;
+};
+declare function focus(options?: FocusOptions): void;
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
+  disabled: ComputedRef<boolean>;
+  element: Readonly<import("vue").ShallowRef<PrimitiveElement | null>>;
+  focus: typeof focus;
+  orientation: ComputedRef<ToggleGroupOrientation>;
+  pressed: ComputedRef<boolean>;
+  state: ComputedRef<ToggleGroupItemState>;
+  value: string;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+  press: (value: string, pressed: boolean, nativeEvent: MouseEvent) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+  onPress?: (value: string, pressed: boolean, nativeEvent: MouseEvent) => any;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+type __VLS_WithSlots<T, S> = T & {
+  new (): {
+    $slots: S;
+  };
+};
+//#endregion
+export { ToggleGroupItemSlotState as a, ToggleGroupSlotState as c, ToggleGroupValue as d, ToggleGroupItemExpose as i, ToggleGroupState as l, _default$1 as n, ToggleGroupItemState as o, ToggleGroupExpose as r, ToggleGroupOrientation as s, _default as t, ToggleGroupType as u };