@ux-builder/ui 0.6.0 → 0.6.2

package/AGENTS.md

@@ -77,7 +77,7 @@ import { ThemeProvider } from "@ux-builder/ui";
 <!-- catalogue:start -->
 ## Reference (generated from the SDK; do not edit by hand)
 
-@ux-builder/ui 0.6.0, @ux-builder/tokens 1.4.1. The full catalogue, with every token and prop, is `@ux-builder/ui/catalogue.json`.
+@ux-builder/ui 0.6.2, @ux-builder/tokens 1.6.0. The full catalogue, with every token and prop, is `@ux-builder/ui/catalogue.json`.
 
 ### Components
 
@@ -271,4 +271,5 @@ The page's favicon follows the theme too: the top-level `ThemeProvider` sets it
 | `praxis-material` | material | dark, light (default dark) |
 | `praxis-v2-databricks` | databricks | dark, light (default light) |
 | `synaptiq` | own anatomy | dark, light (default light) |
+| `ux-builder-databricks` | databricks | dark, light (default light) |
 <!-- catalogue:end -->

package/catalogue.json

@@ -1,8 +1,8 @@
 {
   "$description": "Generated by tools/gen-catalogue.mjs from source (FEAT-004 SDK-13). Do not edit; run npm run catalogue.",
   "packages": {
-    "@ux-builder/ui": "0.6.0",
-    "@ux-builder/tokens": "1.4.1"
+    "@ux-builder/ui": "0.6.2",
+    "@ux-builder/tokens": "1.6.0"
   },
   "rules": [
     "Use the SDK's widgets (@ux-builder/ui) for buttons, fields, choices, tables, menus, tabs, breadcrumbs, sheets, notices, status pills, toasts, progress bars, spinners, skeletons, icons and the logo; do not build your own. Icons beyond the shared names come from @ux-builder/ui/icons, never hand-drawn.",
@@ -130,6 +130,19 @@
       "default": "light",
       "css": "@ux-builder/tokens/themes/synaptiq.css",
       "fonts": "@ux-builder/tokens/fonts/synaptiq.css"
+    },
+    {
+      "name": "ux-builder-databricks",
+      "title": "UX Builder Databricks",
+      "brand": "ux-builder",
+      "designSystem": "databricks",
+      "appearances": [
+        "dark",
+        "light"
+      ],
+      "default": "light",
+      "css": "@ux-builder/tokens/themes/ux-builder-databricks.css",
+      "fonts": "@ux-builder/tokens/fonts/ux-builder-databricks.css"
     }
   ],
   "designSystems": [

package/dist/index.js

@@ -1,4 +1,4 @@
-import { A as e, C as t, D as n, E as r, O as i, S as a, T as o, _ as s, a as c, b as l, c as u, d, f, g as p, h as m, i as h, j as g, k as _, l as v, m as y, n as b, o as x, p as S, r as C, s as w, t as T, u as E, v as D, w as ee, x as O, y as k } from "./shared-DspdvNFe.js";
+import { A as e, C as t, D as n, E as r, O as i, S as a, T as o, _ as s, a as c, b as l, c as u, d, f, g as p, h as m, i as h, j as g, k as _, l as v, m as y, n as b, o as x, p as S, r as C, s as w, t as T, u as E, v as D, w as ee, x as O, y as k } from "./shared-CAXoQbx9.js";
 import { UC as A, Wu as te, lP as ne } from "./shared-Bom_GJww.js";
 import { cloneElement as re, createContext as ie, useCallback as j, useContext as M, useEffect as N, useId as P, useLayoutEffect as ae, useMemo as oe, useRef as F, useState as I } from "react";
 import { jsx as L, jsxs as R } from "react/jsx-runtime";

package/dist/patterns.js

@@ -1,4 +1,4 @@
-import { _ as e, a as t, b as n, d as r, f as i, g as a, h as o, i as s, l as c, m as l, n as u, p as d, r as f, s as p, t as m, u as h } from "./shared-DspdvNFe.js";
+import { _ as e, a as t, b as n, d as r, f as i, g as a, h as o, i as s, l as c, m as l, n as u, p as d, r as f, s as p, t as m, u as h } from "./shared-CAXoQbx9.js";
 import { Fragment as g, cloneElement as _, useCallback as v, useEffect as y, useId as b, useLayoutEffect as x, useMemo as S, useRef as C, useState as w } from "react";
 import { Fragment as T, jsx as E, jsxs as D } from "react/jsx-runtime";
 //#region src/patterns/Layout.jsx

package/dist/{shared-DspdvNFe.js → shared-CAXoQbx9.js}

@@ -65,6 +65,14 @@ var f = [
 		designSystem: null,
 		default: "light",
 		appearances: ["dark", "light"]
+	},
+	{
+		name: "ux-builder-databricks",
+		title: "UX Builder Databricks",
+		brand: "ux-builder",
+		designSystem: "databricks",
+		default: "light",
+		appearances: ["dark", "light"]
 	}
 ], p = [
 	{
@@ -91,32 +99,37 @@ var f = [
 		name: "synaptiq",
 		title: "Synaptiq",
 		appearances: ["light", "dark"]
+	},
+	{
+		name: "ux-builder",
+		title: "UX Builder",
+		appearances: ["light", "dark"]
 	}
 ], m = /* @__PURE__ */ "accent.badge-bg.badge-fg.badge-radius.badge-size.body.border.btn-focus-offset.btn-focus-ring.btn-hover-mix.btn-lift.btn-lift-hover.btn-lift-press.btn-lift-quiet.btn-min-height.btn-pad-x.btn-press-mix.btn-radius.btn-secondary-bg.btn-secondary-border.btn-secondary-fg.btn-shift-hover.btn-shift-press.btn-size.btn-text-fg.btn-weight.card-bg.card-border.card-pad.check-border.check-on-bg.check-on-fg.check-radius.check-size.favicon.field-bg.field-border.field-border-bottom.field-focus-offset.field-focus-outline.field-focus-shadow.field-height.field-hover-edge.field-invalid-shadow.field-label-fg.field-label-size.field-label-tracking.field-label-transform.field-label-weight.field-pad-x.field-radius.font-body.font-display.font-heading.font-mono.ink.leading-body.leading-tight.logo-aspect.logo-bg.logo-height.logo-height-sm.logo-image.logo-mask.logo-paint.mark-bg.mark-image.mark-mask.measure.menu-bg.menu-border.menu-item-height.menu-item-hover.menu-item-on-bg.menu-item-on-fg.menu-item-on-mark.menu-item-on-weight.menu-pad-y.menu-radius.menu-shadow.muted.muted-2.navy.notice-bg.notice-border-width.notice-edge-mix.notice-radius.notice-stripe.notice-tint.paper.pill-bg.pill-border.pill-dot-size.pill-gap.pill-pad.pill-radius.pill-size.pill-tracking.pill-transform.pill-weight.piq-badge-bg.piq-badge-fg.piq-badge-font-size.piq-badge-radius.piq-border-default.piq-brand-favicon.piq-brand-logo-aspect.piq-brand-logo-bg.piq-brand-logo-height.piq-brand-logo-height-sm.piq-brand-logo-image.piq-brand-logo-mask.piq-brand-logo-paint.piq-brand-mark-bg.piq-brand-mark-image.piq-brand-mark-mask.piq-button-font-size.piq-button-font-weight.piq-button-ghost-fg.piq-button-height.piq-button-offset-hover.piq-button-offset-press.piq-button-padding-x.piq-button-radius.piq-button-secondary-bg.piq-button-secondary-border.piq-button-secondary-fg.piq-button-shadow.piq-button-shadow-flat.piq-button-shadow-hover.piq-button-shadow-press.piq-card-bg.piq-card-border.piq-card-padding.piq-check-border.piq-check-checked-bg.piq-check-checked-fg.piq-check-radius.piq-check-size.piq-choice-picker-border.piq-choice-picker-divider.piq-choice-picker-font-size.piq-choice-picker-font-weight.piq-choice-picker-gap.piq-choice-picker-height.piq-choice-picker-option-bg.piq-choice-picker-option-border.piq-choice-picker-option-fg.piq-choice-picker-option-hover-bg.piq-choice-picker-option-radius.piq-choice-picker-option-selected-bg.piq-choice-picker-option-selected-check.piq-choice-picker-option-selected-fg.piq-choice-picker-padding-x.piq-choice-picker-radius.piq-color-accent.piq-color-border.piq-color-ground.piq-color-ground-recessed.piq-color-on-accent.piq-color-structure.piq-color-surface.piq-color-surface-sunken.piq-color-text.piq-color-text-muted.piq-color-text-strong.piq-color-text-subtle.piq-field-bg.piq-field-border.piq-field-border-bottom.piq-field-border-hover.piq-field-focus-offset.piq-field-focus-outline.piq-field-focus-shadow.piq-field-height.piq-field-invalid-shadow.piq-field-label-fg.piq-field-label-font-size.piq-field-label-font-weight.piq-field-label-letter-spacing.piq-field-label-text-transform.piq-field-padding-x.piq-field-radius.piq-focus-offset.piq-focus-ring.piq-font-body.piq-font-display.piq-font-heading.piq-font-mono.piq-font-size-body.piq-font-size-display.piq-font-size-heading.piq-font-size-label.piq-font-size-lead.piq-font-size-small.piq-font-size-title.piq-font-weight-regular.piq-font-weight-strong.piq-icon-set.piq-letter-spacing-eyebrow.piq-letter-spacing-label.piq-line-height-body.piq-line-height-tight.piq-menu-bg.piq-menu-border.piq-menu-item-height.piq-menu-item-hover-bg.piq-menu-item-selected-bg.piq-menu-item-selected-fg.piq-menu-item-selected-font-weight.piq-menu-item-selected-indicator.piq-menu-padding-y.piq-menu-radius.piq-menu-shadow.piq-nav-bar-height.piq-nav-item-direction.piq-nav-item-gap.piq-nav-item-label-font-size.piq-nav-item-selected-bg.piq-nav-item-selected-border.piq-nav-width.piq-notice-bg.piq-notice-border-tone-mix.piq-notice-border-width.piq-notice-radius.piq-notice-stripe-width.piq-notice-tone-mix.piq-page-header-gap.piq-page-header-padding-y.piq-page-header-title-font-size.piq-pill-bg.piq-pill-border.piq-pill-dot-size.piq-pill-font-size.piq-pill-font-weight.piq-pill-gap.piq-pill-letter-spacing.piq-pill-padding.piq-pill-radius.piq-pill-text-transform.piq-progress-fill-bg.piq-progress-height.piq-progress-radius.piq-progress-track-bg.piq-radius-card.piq-radius-control.piq-shadow-card.piq-shadow-overlay.piq-size-breakpoint-expanded.piq-size-breakpoint-extra-large.piq-size-breakpoint-large.piq-size-breakpoint-medium.piq-size-content-form.piq-size-content-page.piq-size-measure.piq-size-target-minimum.piq-size-target-touch.piq-skeleton-bg.piq-skeleton-effect.piq-skeleton-radius.piq-space-1.piq-space-2.piq-space-3.piq-space-4.piq-space-5.piq-space-6.piq-space-7.piq-space-8.piq-space-gutter-compact.piq-space-gutter-expanded.piq-space-gutter-extra-large.piq-space-gutter-large.piq-space-gutter-medium.piq-spinner-line-cap.piq-spinner-stroke-width.piq-spinner-track-color.piq-state-closed.piq-state-evaluation.piq-state-layer-hover.piq-state-layer-press.piq-state-limited.piq-state-live.piq-state-purchasing.piq-switch-checked-thumb-bg.piq-switch-checked-thumb-size.piq-switch-checked-track-bg.piq-switch-height.piq-switch-radius.piq-switch-thumb-bg.piq-switch-thumb-inset.piq-switch-thumb-size.piq-switch-track-bg.piq-switch-track-border.piq-switch-width.piq-table-cell-padding-x.piq-table-cell-padding-y.piq-table-font-size.piq-table-header-bg.piq-table-header-border.piq-table-header-fg.piq-table-header-font-size.piq-table-header-font-weight.piq-table-header-height.piq-table-header-letter-spacing.piq-table-header-text-transform.piq-table-row-border.piq-table-row-height.piq-table-row-hover-bg.piq-table-row-stripe-bg.piq-tabs-indicator-height.piq-tabs-list-border.piq-tabs-tab-bg-selected.piq-tabs-tab-padding-x.piq-tabs-tab-radius.piq-toast-action-fg.piq-toast-bg.piq-toast-fg.piq-toast-radius.piq-toast-shadow.piq-toast-stripe-width.radius.radius-card.rail.rule.seg-bg.seg-divider.seg-fg.seg-gap.seg-height.seg-hover-bg.seg-on-bg.seg-on-fg.seg-opt-border.seg-opt-radius.seg-outline.seg-pad-x.seg-radius.seg-size.seg-tick.seg-weight.shadow-card.shadow-raised.size-body.size-display.size-heading.size-intro.size-label.size-small.size-title.space-1.space-2.space-3.space-4.space-5.space-6.space-7.space-8.state-closed.state-evaluation.state-limited.state-live.state-purchasing.surface.surface-sunken.switch-height.switch-inset.switch-off-bg.switch-off-border.switch-on-bg.switch-radius.switch-thumb-off.switch-thumb-off-bg.switch-thumb-on.switch-thumb-on-bg.switch-width.table-head-bg.table-head-border.table-head-fg.table-head-height.table-head-size.table-head-tracking.table-head-transform.table-head-weight.table-pad-x.table-pad-y.table-row-height.table-row-hover.table-size.toast-action-fg.toast-bg.toast-fg.toast-radius.toast-shadow.toast-stripe.tracking-kicker.tracking-label.weight-bold.weight-normal".split("."), h = "data-piq-favicon", g = {
 	svg: "image/svg+xml",
 	png: "image/png",
 	webp: "image/webp",
 	ico: "image/x-icon"
-};
-function _(e) {
+}, _ = /url\(\s*(?:"((?:[^"\\]|\\.)*)"|'((?:[^'\\]|\\.)*)'|([^\s"'()]+))\s*\)/;
+function v(e) {
 	if (typeof window > "u" || !e) return null;
-	let t = getComputedStyle(e).getPropertyValue("--piq-brand-favicon").trim();
-	return /url\(\s*["']?([^"')]+)["']?\s*\)/.exec(t)?.[1] ?? null;
+	let t = getComputedStyle(e).getPropertyValue("--piq-brand-favicon").trim(), n = _.exec(t);
+	return n ? (n[1] ?? n[2] ?? n[3]).replace(/\\(.)/g, "$1") : null;
 }
-function v(e = typeof document > "u" ? null : document.documentElement) {
+function y(e = typeof document > "u" ? null : document.documentElement) {
 	if (typeof document > "u" || !e) return null;
-	let t = _(e), n = document.head.querySelector(`link[${h}]`);
+	let t = v(e), n = document.head.querySelector(`link[${h}]`);
 	if (!t) return n?.remove(), null;
 	n || (n = document.createElement("link"), n.rel = "icon", n.setAttribute(h, ""));
-	let r = g[/\.(\w+)(?:[?#].*)?$/.exec(t)?.[1]?.toLowerCase()];
+	let r = /^data:([^;,]+)/.exec(t)?.[1] ?? g[/\.(\w+)(?:[?#].*)?$/.exec(t)?.[1]?.toLowerCase()];
 	return r ? n.type = r : n.removeAttribute("type"), n.getAttribute("href") !== t && n.setAttribute("href", t), document.head.appendChild(n), t;
 }
-function y() {
+function b() {
 	typeof document < "u" && document.head.querySelector(`link[${h}]`)?.remove();
 }
-function b() {
+function x() {
 	return r(() => {
-		let e = document.documentElement, t = () => v(e);
+		let e = document.documentElement, t = () => y(e);
 		t();
 		let n = new MutationObserver(t);
 		n.observe(e, {
@@ -125,119 +138,119 @@ function b() {
 		});
 		let r = window.matchMedia?.("(prefers-color-scheme: dark)");
 		return r?.addEventListener("change", t), () => {
-			n.disconnect(), r?.removeEventListener("change", t), y();
+			n.disconnect(), r?.removeEventListener("change", t), b();
 		};
 	}, []), null;
 }
 //#endregion
 //#region src/ThemeProvider.jsx
-var x = e(null), S = new Map(f.map((e) => [e.name, e])), C = "(prefers-color-scheme: dark)", w = "piq:set-theme", T = !0;
+var S = e(null), C = new Map(f.map((e) => [e.name, e])), w = "(prefers-color-scheme: dark)", T = "piq:set-theme", E = !0;
 try {
-	T = process.env.NODE_ENV !== "production";
+	E = process.env.NODE_ENV !== "production";
 } catch {}
-var E = (e) => {
-	T && console.warn(`@ux-builder/ui ThemeProvider: ${e}`);
+var D = (e) => {
+	E && console.warn(`@ux-builder/ui ThemeProvider: ${e}`);
 };
-function D() {
-	return typeof window > "u" || !window.matchMedia ? null : window.matchMedia(C).matches ? "dark" : "light";
+function O() {
+	return typeof window > "u" || !window.matchMedia ? null : window.matchMedia(w).matches ? "dark" : "light";
 }
-function O(e, t, n = D()) {
-	let r = t === "system" ? n : t, i = S.get(e);
+function k(e, t, n = O()) {
+	let r = t === "system" ? n : t, i = C.get(e);
 	return i ? r && i.appearances.includes(r) ? r : i.default : r ?? null;
 }
-var k = typeof window > "u" ? r : a, A = (e) => ({
+var A = typeof window > "u" ? r : a, ee = (e) => ({
 	...Object.fromEntries(m.map((e) => [`--${e}`, "initial"])),
 	...Object.fromEntries(Object.entries(e).filter(([, e]) => !String(e).startsWith("url(")).map(([e, t]) => [`--${e}`, t]))
 });
 function j({ theme: e, appearance: i = "system", tokens: a, favicon: l = !0, onChange: d, as: p = "div", style: m, children: h, ...g }) {
-	let _ = n(x), b = s(null), [T, j] = c(e), [M, N] = c(i), [P, F] = c(D);
-	r(() => j(e), [e]), r(() => N(i), [i]), k(() => {
-		if (M !== "system" || typeof window > "u" || !window.matchMedia) return;
-		let e = window.matchMedia(C), t = () => F(e.matches ? "dark" : "light");
+	let _ = n(S), v = s(null), [x, E] = c(e), [j, M] = c(i), [N, P] = c(O);
+	r(() => E(e), [e]), r(() => M(i), [i]), A(() => {
+		if (j !== "system" || typeof window > "u" || !window.matchMedia) return;
+		let e = window.matchMedia(w), t = () => P(e.matches ? "dark" : "light");
 		return t(), e.addEventListener("change", t), () => e.removeEventListener("change", t);
-	}, [M]);
-	let I = a ? M === "system" ? P ?? "light" : M : O(T, M, P);
+	}, [j]);
+	let F = a ? j === "system" ? N ?? "light" : j : k(x, j, N);
 	r(() => {
-		a || (T && !S.has(T) ? E(`unknown theme "${T}"; known: ${[...S.keys()].join(", ")}`) : T && M !== "system" && I !== M && E(`theme "${T}" has no ${M} appearance; using ${I}`));
+		a || (x && !C.has(x) ? D(`unknown theme "${x}"; known: ${[...C.keys()].join(", ")}`) : x && j !== "system" && F !== j && D(`theme "${x}" has no ${j} appearance; using ${F}`));
 	}, [
-		T,
-		M,
-		I,
+		x,
+		j,
+		F,
 		a
 	]);
-	let L = l && !a && !_;
-	k(() => {
-		L && v(b.current);
+	let I = l && !a && !_;
+	A(() => {
+		I && y(v.current);
 	}, [
-		L,
-		T,
-		I
-	]), r(() => L ? y : void 0, [L]);
-	let R = t((e) => {
-		j(e), d?.({
+		I,
+		x,
+		F
+	]), r(() => I ? b : void 0, [I]);
+	let L = t((e) => {
+		E(e), d?.({
 			theme: e,
-			appearance: M
+			appearance: j
 		});
-	}, [d, M]), z = t((e) => {
-		N(e), d?.({
-			theme: T,
+	}, [d, j]), R = t((e) => {
+		M(e), d?.({
+			theme: x,
 			appearance: e
 		});
-	}, [d, T]), B = !a && !_;
+	}, [d, x]), z = !a && !_;
 	r(() => {
-		if (!B || typeof window > "u") return;
+		if (!z || typeof window > "u") return;
 		let e = (e) => {
 			let { theme: t, appearance: n } = e.detail ?? {};
-			t && j(t), n && N(n), (t || n) && d?.({
-				theme: t ?? T,
-				appearance: n ?? M
+			t && E(t), n && M(n), (t || n) && d?.({
+				theme: t ?? x,
+				appearance: n ?? j
 			});
 		};
-		return window.addEventListener(w, e), () => window.removeEventListener(w, e);
+		return window.addEventListener(T, e), () => window.removeEventListener(T, e);
 	}, [
-		B,
+		z,
 		d,
-		T,
-		M
+		x,
+		j
 	]);
-	let V = o(() => ({
-		theme: a ? null : T,
-		appearance: I,
-		preference: M,
+	let B = o(() => ({
+		theme: a ? null : x,
+		appearance: F,
+		preference: j,
 		themes: f,
-		setTheme: R,
-		setAppearance: z
+		setTheme: L,
+		setAppearance: R
 	}), [
-		T,
-		I,
-		M,
+		x,
+		F,
+		j,
 		a,
-		R,
-		z
-	]), H = a ? { style: {
-		...A(a),
-		colorScheme: I ?? void 0,
+		L,
+		R
+	]), V = a ? { style: {
+		...ee(a),
+		colorScheme: F ?? void 0,
 		...m
 	} } : {
-		"data-theme": T,
-		...I && { "data-appearance": I },
+		"data-theme": x,
+		...F && { "data-appearance": F },
 		style: {
-			colorScheme: I ?? void 0,
+			colorScheme: F ?? void 0,
 			...m
 		}
 	};
-	return /* @__PURE__ */ u(x.Provider, {
-		value: V,
+	return /* @__PURE__ */ u(S.Provider, {
+		value: B,
 		children: /* @__PURE__ */ u(p, {
-			ref: b,
+			ref: v,
 			...g,
-			...H,
+			...V,
 			children: h
 		})
 	});
 }
 function M() {
-	let e = n(x);
+	let e = n(S);
 	if (!e) throw Error("useTheme() needs a <ThemeProvider> above it");
 	return e;
 }
@@ -826,14 +839,14 @@ function z(e) {
 function B(e, t, n = P) {
 	return n[t]?.[e] ? [n[t][e], t] : n.lucide?.[e] ? [n.lucide[e], "lucide"] : [null, null];
 }
-var V = /* @__PURE__ */ new Map(), H = /<script|\son\w+\s*=|\shref\s*=|<foreignObject/i, ee = (e, t) => {
+var V = /* @__PURE__ */ new Map(), H = /<script|\son\w+\s*=|\shref\s*=|<foreignObject/i, U = (e, t) => {
 	let n = e.glyphs;
 	if (n[t]) return [n[t], t];
 	if (n.lucide) return [n.lucide, "lucide"];
 	let r = Object.keys(N).find((e) => n[e]);
 	return r ? [n[r], r] : [null, null];
 };
-function te(...e) {
+function W(...e) {
 	let t = [];
 	for (let n of e.flat()) {
 		if (!(n && typeof n.name == "string" && n.glyphs && Object.keys(n.glyphs).length > 0 && Object.keys(n.glyphs).every((e) => N[e]))) throw Error(`@ux-builder/ui registerIcons: an icon is { name, glyphs: { ${Object.keys(N).join(" | ")}: { viewBox, body } } }`);
@@ -842,17 +855,17 @@ function te(...e) {
 	}
 	return t;
 }
-var ne = (e) => e.replace(/-([a-z])/g, (e, t) => t.toUpperCase()), U = Object.fromEntries(Object.entries(N).map(([e, t]) => [e, Object.fromEntries(Object.entries(t.svg).map(([e, t]) => [ne(e), t]))])), W = typeof window > "u" ? r : a;
+var te = (e) => e.replace(/-([a-z])/g, (e, t) => t.toUpperCase()), ne = Object.fromEntries(Object.entries(N).map(([e, t]) => [e, Object.fromEntries(Object.entries(t.svg).map(([e, t]) => [te(e), t]))])), re = typeof window > "u" ? r : a;
 function G({ name: e, icon: t, set: r, size: i = "1em", label: a, className: o = "", ...l }) {
-	let d = n(x), f = s(null), [p, m] = c(null), [h, g] = c(null);
-	W(() => {
+	let d = n(S), f = s(null), [p, m] = c(null), [h, g] = c(null);
+	re(() => {
 		if (r || !f.current) return;
 		let e = getComputedStyle(f.current).getPropertyValue("--piq-icon-set").trim().replace(/^["']|["']$/g, "");
 		g(P[e] ? e : null), d?.theme || m(f.current.closest?.("[data-theme]")?.getAttribute("data-theme") ?? null);
 	});
-	let _ = r ?? h ?? z(d?.theme ?? p), v = t ?? (P.lucide[e] ? null : V.get(e)), [y, b] = v ? ee(v, _) : B(e, _);
+	let _ = r ?? h ?? z(d?.theme ?? p), v = t ?? (P.lucide[e] ? null : V.get(e)), [y, b] = v ? U(v, _) : B(e, _);
 	if (!y) return R && console.warn(`@ux-builder/ui Icon: no icon "${e}". Shared names: ${L.join(", ")}. Every Lucide icon is in @ux-builder/ui/icons: import it (e.g. import { iconPin } from "@ux-builder/ui/icons") and pass icon={iconPin}, or registerIcons(iconPin) once.`), null;
-	let S = a ? {
+	let x = a ? {
 		role: "img",
 		"aria-label": a
 	} : {
@@ -868,17 +881,17 @@ function G({ name: e, icon: t, set: r, size: i = "1em", label: a, className: o =
 		className: `piq-icon${o ? ` ${o}` : ""}`,
 		"data-icon": v?.name ?? e,
 		"data-icon-set": b,
-		...U[b],
-		...S,
+		...ne[b],
+		...x,
 		...l,
 		dangerouslySetInnerHTML: { __html: y.body }
 	});
 }
 //#endregion
 //#region src/widgets/Loading.jsx
-var re = (e, t, n) => Math.min(n, Math.max(t, e)), K = (e) => typeof e == "number" ? `${e}px` : e;
-function ie({ label: e, value: t, max: n = 100, valueText: r, showValue: a = !1, hideLabel: o = !1, className: s = "", ...c }) {
-	let l = i(), f = n > 0 ? n : 100, p = typeof t == "number" && Number.isFinite(t), m = p ? re(t, 0, f) : null, h = p ? Math.round(m / f * 100) : null;
+var ie = (e, t, n) => Math.min(n, Math.max(t, e)), K = (e) => typeof e == "number" ? `${e}px` : e;
+function ae({ label: e, value: t, max: n = 100, valueText: r, showValue: a = !1, hideLabel: o = !1, className: s = "", ...c }) {
+	let l = i(), f = n > 0 ? n : 100, p = typeof t == "number" && Number.isFinite(t), m = p ? ie(t, 0, f) : null, h = p ? Math.round(m / f * 100) : null;
 	return /* @__PURE__ */ d("div", {
 		className: `piq-progress${p ? "" : " piq-progress--indeterminate"}${s ? ` ${s}` : ""}`,
 		...c,
@@ -930,7 +943,7 @@ function q() {
 		})]
 	});
 }
-function ae({ size: e = "md", label: t = "Loading", showLabel: n = !1, className: r = "", ...i }) {
+function oe({ size: e = "md", label: t = "Loading", showLabel: n = !1, className: r = "", ...i }) {
 	return /* @__PURE__ */ d("span", {
 		className: `piq-spinner piq-spinner--${e}${r ? ` ${r}` : ""}`,
 		role: "status",
@@ -941,7 +954,7 @@ function ae({ size: e = "md", label: t = "Loading", showLabel: n = !1, className
 		})]
 	});
 }
-function oe({ variant: e = "text", lines: t = 1, width: n, height: r, className: i = "", style: a, ...o }) {
+function se({ variant: e = "text", lines: t = 1, width: n, height: r, className: i = "", style: a, ...o }) {
 	let s = `piq-skeleton piq-skeleton--${e}${i ? ` ${i}` : ""}`;
 	if (e === "text") {
 		let e = Math.max(1, Math.floor(t));
@@ -975,13 +988,13 @@ function oe({ variant: e = "text", lines: t = 1, width: n, height: r, className:
 }
 //#endregion
 //#region src/widgets/Button.jsx
-var se = {
+var ce = {
 	primary: "",
 	secondary: " piq-btn--secondary",
 	text: " piq-btn--text"
 };
 function J({ variant: e = "primary", size: t, badge: n, busy: r = !1, type: i = "button", className: a = "", onClick: o, children: s, ...c }) {
-	let f = `piq-btn${se[e] ?? ""}${t === "sm" ? " piq-btn--sm" : ""}${r ? " piq-btn--busy" : ""}${a ? ` ${a}` : ""}`, p = /* @__PURE__ */ d(l, { children: [s, n != null && /* @__PURE__ */ u("span", {
+	let f = `piq-btn${ce[e] ?? ""}${t === "sm" ? " piq-btn--sm" : ""}${r ? " piq-btn--busy" : ""}${a ? ` ${a}` : ""}`, p = /* @__PURE__ */ d(l, { children: [s, n != null && /* @__PURE__ */ u("span", {
 		className: "piq-btn__badge",
 		children: n
 	})] });
@@ -1009,7 +1022,7 @@ function J({ variant: e = "primary", size: t, badge: n, busy: r = !1, type: i =
 }
 //#endregion
 //#region src/widgets/Choice.jsx
-function ce({ label: e, className: t = "", ...n }) {
+function le({ label: e, className: t = "", ...n }) {
 	return /* @__PURE__ */ d("label", {
 		className: `piq-check${t ? ` ${t}` : ""}`,
 		children: [/* @__PURE__ */ u("input", {
@@ -1019,7 +1032,7 @@ function ce({ label: e, className: t = "", ...n }) {
 		}), /* @__PURE__ */ u("span", { children: e })]
 	});
 }
-function le({ label: e, className: t = "", ...n }) {
+function ue({ label: e, className: t = "", ...n }) {
 	return /* @__PURE__ */ d("label", {
 		className: `piq-check piq-switch${t ? ` ${t}` : ""}`,
 		children: [/* @__PURE__ */ u("input", {
@@ -1030,7 +1043,7 @@ function le({ label: e, className: t = "", ...n }) {
 		}), /* @__PURE__ */ u("span", { children: e })]
 	});
 }
-function ue({ label: e, options: t, name: n, value: r, defaultValue: a, onChange: o, disabled: s }) {
+function de({ label: e, options: t, name: n, value: r, defaultValue: a, onChange: o, disabled: s }) {
 	let c = i(), l = n ?? c;
 	return /* @__PURE__ */ d("fieldset", {
 		className: "piq-radios",
@@ -1099,7 +1112,7 @@ function X({ label: e, hint: t, error: n, id: r, className: i = "", ...a }) {
 		})
 	});
 }
-function de({ label: e, hint: t, error: n, id: r, className: i = "", rows: a = 4, ...o }) {
+function fe({ label: e, hint: t, error: n, id: r, className: i = "", rows: a = 4, ...o }) {
 	return /* @__PURE__ */ u(Y, {
 		label: e,
 		hint: t,
@@ -1156,7 +1169,7 @@ function Q({ label: e, value: t, onChange: n, min: r, max: i, hint: a, error: o,
 		onChange: (e) => n?.(e.target.value)
 	});
 }
-function fe({ label: e, from: t, to: n, onChange: r, min: a, max: o, fromLabel: s = "From", toLabel: c = "To", className: l }) {
+function pe({ label: e, from: t, to: n, onChange: r, min: a, max: o, fromLabel: s = "From", toLabel: c = "To", className: l }) {
 	let f = i();
 	return /* @__PURE__ */ d("fieldset", {
 		className: `piq-date-range${l ? ` ${l}` : ""}`,
@@ -1202,7 +1215,7 @@ function $(e, t) {
 }
 //#endregion
 //#region src/widgets/Dialog.jsx
-function pe({ open: e = !1, onClose: t, title: n, description: r, actions: a, closeLabel: o = "Close", initialFocus: s, role: c, className: l, children: f, ...p }) {
+function me({ open: e = !1, onClose: t, title: n, description: r, actions: a, closeLabel: o = "Close", initialFocus: s, role: c, className: l, children: f, ...p }) {
 	let m = $(e, s), h = i(), g = i();
 	return /* @__PURE__ */ d("dialog", {
 		ref: m,
@@ -1247,7 +1260,7 @@ function pe({ open: e = !1, onClose: t, title: n, description: r, actions: a, cl
 }
 //#endregion
 //#region src/widgets/MenuButton.jsx
-function me({ label: e, items: t = [], icon: n, variant: a = "secondary", size: o, align: l = "start", buttonLabel: f, className: p, ...m }) {
+function he({ label: e, items: t = [], icon: n, variant: a = "secondary", size: o, align: l = "start", buttonLabel: f, className: p, ...m }) {
 	let [h, g] = c(!1), [_, v] = c(-1), y = s(null), b = s(null), x = i(), S = t.map((e, t) => e.disabled ? -1 : t).filter((e) => e >= 0), C = (e) => {
 		g(!0), v(e === "last" ? S.at(-1) : S[0]);
 	}, w = (e = !0) => {
@@ -1347,7 +1360,7 @@ function me({ label: e, items: t = [], icon: n, variant: a = "secondary", size:
 }
 //#endregion
 //#region src/widgets/Pagination.jsx
-function he({ page: e = 1, pageSize: t = 20, total: n = 0, onPageChange: r, pageSizes: i = [
+function ge({ page: e = 1, pageSize: t = 20, total: n = 0, onPageChange: r, pageSizes: i = [
 	10,
 	20,
 	50,
@@ -1396,7 +1409,7 @@ function he({ page: e = 1, pageSize: t = 20, total: n = 0, onPageChange: r, page
 }
 //#endregion
 //#region src/widgets/Sheet.jsx
-function ge({ open: e = !1, onClose: t, title: n, label: r, side: a = "start", closeLabel: o = "Close", initialFocus: s, className: c, children: l, ...f }) {
+function _e({ open: e = !1, onClose: t, title: n, label: r, side: a = "start", closeLabel: o = "Close", initialFocus: s, className: c, children: l, ...f }) {
 	let p = $(e, s), m = i();
 	return /* @__PURE__ */ u("dialog", {
 		ref: p,
@@ -1432,7 +1445,7 @@ function ge({ open: e = !1, onClose: t, title: n, label: r, side: a = "start", c
 }
 //#endregion
 //#region src/widgets/Tabs.jsx
-function _e({ tabs: e = [], value: t, defaultValue: n, onChange: r, label: a, className: o, ...l }) {
+function ve({ tabs: e = [], value: t, defaultValue: n, onChange: r, label: a, className: o, ...l }) {
 	let [f, p] = c(n ?? e[0]?.id), m = t ?? f, h = i(), g = s(null);
 	function _(e, n) {
 		t === void 0 && p(e), e !== m && r?.(e), n && [...g.current?.querySelectorAll("[role=\"tab\"]") ?? []].find((t) => t.dataset.tab === String(e))?.focus();
@@ -1483,6 +1496,6 @@ function _e({ tabs: e = [], value: t, defaultValue: n, onChange: r, label: a, cl
 	});
 }
 //#endregion
-export { p as A, te as C, M as D, O as E, b as O, B as S, j as T, oe as _, pe as a, G as b, Y as c, X as d, ce as f, ie as g, J as h, me as i, f as j, v as k, Z as l, le as m, ge as n, Q as o, ue as p, he as r, fe as s, _e as t, de as u, ae as v, x as w, z as x, L as y };
+export { p as A, W as C, M as D, k as E, x as O, B as S, j as T, se as _, me as a, G as b, Y as c, X as d, le as f, ae as g, J as h, he as i, f as j, y as k, Z as l, ue as m, _e as n, Q as o, de as p, ge as r, pe as s, ve as t, fe as u, oe as v, S as w, z as x, L as y };
 
-//# sourceMappingURL=shared-DspdvNFe.js.map
+//# sourceMappingURL=shared-CAXoQbx9.js.map