dawn-ui-react 1.0.0-alpha.16 → 1.0.0-alpha.18

package/dist/{Input--h5J-IHe.js → Input-CXejdMdw.js}

@@ -1,5 +1,5 @@
-import { V as e, X as t, Z as n } from "./form-context-D2zlNF0l.js";
-import { F as r, K as i, c as a, i as o, n as s, o as c, p as l, r as u, s as d, t as f } from "./useLabelableId-C8TWIYiH.js";
+import { V as e, X as t, Z as n } from "./form-context-CB4ds-qf.js";
+import { F as r, K as i, c as a, i as o, n as s, o as c, p as l, r as u, s as d, t as f } from "./useLabelableId-u8XPP_En.js";
 import * as p from "react";
 import { jsx as m } from "react/jsx-runtime";
 //#region node_modules/.pnpm/@base-ui+react@1.4.1_@types+react@19.2.14_react-dom@19.2.6_react@19.2.6__react@19.2.6/node_modules/@base-ui/react/esm/field/control/FieldControl.js

package/dist/{clamp-XXDcNhZ7.js → clamp-Dc75Pf2J.js}

@@ -1,5 +1,5 @@
-import { A as e, C as t, D as n, E as r, F as i, G as a, I as o, J as s, K as c, L as l, M as u, N as d, O as f, P as p, Q as m, R as h, S as g, T as _, V as v, W as y, X as b, Z as x, j as S, k as C, w, x as T, z as E } from "./form-context-D2zlNF0l.js";
-import { C as D, I as ee, W as O, c as k, f as A, l as j, p as M, s as N, u as te } from "./useLabelableId-C8TWIYiH.js";
+import { A as e, C as t, D as n, E as r, F as i, G as a, I as o, J as s, K as c, L as l, M as u, N as d, O as f, P as p, Q as m, R as h, S as g, T as _, V as v, W as y, X as b, Z as x, j as S, k as C, w, x as T, z as E } from "./form-context-CB4ds-qf.js";
+import { C as D, I as ee, W as O, c as k, f as A, l as j, p as M, s as N, u as te } from "./useLabelableId-u8XPP_En.js";
 import * as P from "react";
 import { useLayoutEffect as ne } from "react";
 import { jsx as F, jsxs as I } from "react/jsx-runtime";

package/dist/components/input/input.d.ts

@@ -1,2 +1,2 @@
 import { InputProps } from './input.types';
-export declare const Input: ({ variant, size, className, ref, ...props }: InputProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Input: ({ compact, variant, size, className, ref, ...props }: InputProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/input/input.types.d.ts

@@ -5,4 +5,6 @@ export declare const inputVariants: (props?: ({
     variant?: "primary" | "secondary" | null | undefined;
     size?: "small" | "large" | "medium" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
-export type InputProps = VariantProps<typeof inputVariants> & Omit<ComponentProps<typeof BaseInput>, 'size'>;
+export type InputProps = VariantProps<typeof inputVariants> & Omit<ComponentProps<typeof BaseInput>, 'size'> & {
+    compact?: boolean;
+};

package/dist/components/number-field/number-field.d.ts

@@ -1,2 +1,2 @@
 import { NumberFieldTypesProps } from './number-field.types';
-export declare const NumberField: ({ label, size, className, ref, ...props }: NumberFieldTypesProps) => import("react/jsx-runtime").JSX.Element;
+export declare const NumberField: ({ children, label, size, className, ref, ...props }: NumberFieldTypesProps) => import("react/jsx-runtime").JSX.Element;

package/dist/dawn-ui-react.js

@@ -1,11 +1,11 @@
-import { $ as e, B as t, F as n, G as r, H as i, I as a, J as o, K as s, M as c, N as l, O as u, Q as d, T as f, U as p, V as m, W as h, X as g, Y as _, Z as v, _ as y, a as b, b as x, c as S, d as C, f as w, g as T, h as E, i as D, j as O, k, l as A, m as j, n as M, o as N, p as P, q as F, r as I, s as L, t as R, u as z, v as ee, x as B, y as te } from "./form-context-D2zlNF0l.js";
-import { A as ne, B as re, C as V, D as H, E as ie, F as U, G as W, H as ae, K as oe, M as se, N as ce, O as le, P as ue, R as de, S as fe, T as pe, U as me, V as he, W as ge, _ as _e, a as ve, b as ye, c as be, d as xe, f as Se, g as Ce, h as we, i as Te, j as Ee, k as De, l as Oe, m as ke, n as Ae, o as je, p as G, r as Me, s as Ne, t as Pe, u as Fe, v as Ie, w as Le, x as Re, y as ze, z as Be } from "./useLabelableId-C8TWIYiH.js";
-import { $ as Ve, $t as He, A as Ue, At as We, B as Ge, Bt as Ke, C as qe, Ct as Je, D as Ye, Dt as Xe, E as Ze, Et as Qe, F as $e, Ft as et, G as tt, Gt as nt, H as rt, Ht as it, I as at, It as ot, J as st, Jt as ct, K as lt, Kt as ut, L as dt, Lt as ft, M as pt, Mt as mt, N as ht, Nt as gt, O as _t, Ot as vt, P as yt, Pt as bt, Q as xt, Qt as St, R as Ct, Rt as wt, S as K, St as Tt, T as q, Tt as Et, U as Dt, Ut as Ot, V as kt, Vt as At, W as jt, Wt as Mt, X as Nt, Xt as Pt, Y as Ft, Yt as It, Z as Lt, Zt as Rt, _ as zt, _t as Bt, a as Vt, an as Ht, at as Ut, b as Wt, bt as Gt, c as Kt, cn as qt, ct as Jt, d as Yt, dn as Xt, dt as Zt, en as Qt, et as $t, f as en, fn as tn, ft as nn, g as rn, gn as an, gt as on, h as sn, hn as cn, ht as ln, i as un, in as dn, it as fn, j as pn, jt as mn, k as hn, kt as gn, l as _n, ln as vn, lt as yn, m as bn, mn as xn, mt as Sn, n as Cn, nn as wn, nt as Tn, o as En, on as Dn, ot as On, p as kn, pn as An, pt as jn, q as Mn, qt as Nn, r as Pn, rn as Fn, rt as In, s as Ln, sn as Rn, st as zn, t as Bn, tn as Vn, tt as Hn, u as Un, un as Wn, ut as Gn, v as Kn, vt as qn, w as Jn, wt as Yn, x as Xn, xt as Zn, y as Qn, yt as $n, z as er, zt as tr } from "./clamp-XXDcNhZ7.js";
+import { $ as e, B as t, F as n, G as r, H as i, I as a, J as o, K as s, M as c, N as l, O as u, Q as d, T as f, U as p, V as m, W as h, X as g, Y as _, Z as v, _ as y, a as b, b as x, c as S, d as C, f as w, g as T, h as E, i as D, j as O, k, l as A, m as j, n as M, o as N, p as P, q as F, r as I, s as L, t as R, u as z, v as ee, x as B, y as te } from "./form-context-CB4ds-qf.js";
+import { A as ne, B as re, C as V, D as H, E as ie, F as U, G as W, H as ae, K as oe, M as se, N as ce, O as le, P as ue, R as de, S as fe, T as pe, U as me, V as he, W as ge, _ as _e, a as ve, b as ye, c as be, d as xe, f as Se, g as Ce, h as we, i as Te, j as Ee, k as De, l as Oe, m as ke, n as Ae, o as je, p as G, r as Me, s as Ne, t as Pe, u as Fe, v as Ie, w as Le, x as Re, y as ze, z as Be } from "./useLabelableId-u8XPP_En.js";
+import { $ as Ve, $t as He, A as Ue, At as We, B as Ge, Bt as Ke, C as qe, Ct as Je, D as Ye, Dt as Xe, E as Ze, Et as Qe, F as $e, Ft as et, G as tt, Gt as nt, H as rt, Ht as it, I as at, It as ot, J as st, Jt as ct, K as lt, Kt as ut, L as dt, Lt as ft, M as pt, Mt as mt, N as ht, Nt as gt, O as _t, Ot as vt, P as yt, Pt as bt, Q as xt, Qt as St, R as Ct, Rt as wt, S as K, St as Tt, T as q, Tt as Et, U as Dt, Ut as Ot, V as kt, Vt as At, W as jt, Wt as Mt, X as Nt, Xt as Pt, Y as Ft, Yt as It, Z as Lt, Zt as Rt, _ as zt, _t as Bt, a as Vt, an as Ht, at as Ut, b as Wt, bt as Gt, c as Kt, cn as qt, ct as Jt, d as Yt, dn as Xt, dt as Zt, en as Qt, et as $t, f as en, fn as tn, ft as nn, g as rn, gn as an, gt as on, h as sn, hn as cn, ht as ln, i as un, in as dn, it as fn, j as pn, jt as mn, k as hn, kt as gn, l as _n, ln as vn, lt as yn, m as bn, mn as xn, mt as Sn, n as Cn, nn as wn, nt as Tn, o as En, on as Dn, ot as On, p as kn, pn as An, pt as jn, q as Mn, qt as Nn, r as Pn, rn as Fn, rt as In, s as Ln, sn as Rn, st as zn, t as Bn, tn as Vn, tt as Hn, u as Un, un as Wn, ut as Gn, v as Kn, vt as qn, w as Jn, wt as Yn, x as Xn, xt as Zn, y as Qn, yt as $n, z as er, zt as tr } from "./clamp-Dc75Pf2J.js";
 import { n as nr, t as J } from "./cn-DWnOBdrm.js";
-import { t as rr } from "./Input--h5J-IHe.js";
-import { t as ir } from "./input.types-oyKEbsbD.js";
-import { t as ar } from "./input-group-Ddhxk-gp.js";
-import { t as or } from "./input-group-input-iCeN23U6.js";
+import { t as rr } from "./Input-CXejdMdw.js";
+import { t as ir } from "./input.types-B721AivD.js";
+import { t as ar } from "./input-group-Bla-ghcN.js";
+import { t as or } from "./input-group-input-BAoqWXrN.js";
 import * as Y from "react";
 import sr, { cloneElement as cr, createContext as lr, createElement as ur, forwardRef as dr, isValidElement as fr, memo as pr, startTransition as mr, useCallback as hr, useContext as gr, useEffect as _r, useId as vr, useImperativeHandle as yr, useInsertionEffect as br, useLayoutEffect as xr, useMemo as Sr, useRef as Cr, useState as wr } from "react";
 import { Fragment as Tr, jsx as X, jsxs as Z } from "react/jsx-runtime";
@@ -28708,39 +28708,73 @@ var wW = xc, TW = ({ open: e, virtualizerRef: t, estimateSize: n = 32, overscan:
 			children: e
 		}, `${e}-${t}`)), t]
 	});
-}, XW = ({ variant: e, size: t, className: n, ref: r, ...i }) => {
-	let a = Cr(null), [o, s] = wr(i.defaultValue || "#000000");
-	return i.type === "color" ? /* @__PURE__ */ Z("button", {
-		"aria-label": "Open color picker",
-		className: "relative h-xl w-[calc(var(--spacing-3xl)+5rem)] items-center rounded-xl pl-xs transition-all peer-focus:outline-brand-default hover:cursor-pointer",
-		onClick: () => a.current?.click(),
-		type: "button",
-		children: [
-			/* @__PURE__ */ X("div", {
-				className: J("absolute top-1/2 left-[0px] aspect-square h-full -translate-y-1/2 rounded-l-xl"),
-				style: { backgroundColor: o }
-			}),
-			/* @__PURE__ */ X(rr, {
-				className: "peer pointer-events-none invisible absolute top-lg",
-				defaultValue: o,
-				onChange: (e) => s(e.currentTarget.value),
-				ref: a,
+}, XW = ({ compact: e, variant: t, size: n, className: r, ref: i, ...a }) => {
+	let o = Cr(null), [s, c] = wr(a.defaultValue || a.value || "#000000");
+	if (a.type === "color") {
+		let l = a.value !== void 0, u = (l ? a.value : s) || "#000000", { onChange: d, defaultValue: f, value: p, ...m } = a, h = (e) => {
+			l || c(e.currentTarget.value), d?.(e);
+		}, g = (e) => {
+			if (o.current = e, typeof i == "function") {
+				i(e);
+				return;
+			}
+			i && typeof i == "object" && (i.current = e);
+		};
+		return e ? /* @__PURE__ */ Z("button", {
+			"aria-label": "Open color picker",
+			className: J("relative rounded-full outline-2 outline-transparent transition-colors focus-within:outline-border hover:cursor-pointer", n === "small" && "size-lg -outline-offset-2", n === "medium" && "size-xl -outline-offset-4", n === "large" && "size-2xl -outline-offset-6", r),
+			disabled: a.disabled,
+			onClick: () => o.current?.click(),
+			type: "button",
+			children: [/* @__PURE__ */ X("div", {
+				className: J("size-full rounded-full"),
+				style: { backgroundColor: u }
+			}), /* @__PURE__ */ X(rr, {
+				className: "peer pointer-events-none invisible absolute",
+				defaultValue: l ? void 0 : u,
+				onChange: h,
+				ref: g,
 				type: "color",
-				value: o,
-				...i
-			}),
-			/* @__PURE__ */ X("p", {
-				className: "pl-xl text-left style-text-default-0",
-				children: o
-			})
-		]
-	}) : /* @__PURE__ */ X(rr, {
+				value: l ? u : void 0,
+				...m
+			})]
+		}) : /* @__PURE__ */ Z("button", {
+			"aria-label": "Open color picker",
+			className: J("relative hover:cursor-pointer", ir({
+				variant: t,
+				size: n
+			}), r),
+			disabled: a.disabled,
+			onClick: () => o.current?.click(),
+			type: "button",
+			children: [
+				/* @__PURE__ */ X("div", {
+					className: J("absolute top-1/2 left-xs aspect-square h-7/12 -translate-y-1/2 rounded-full"),
+					style: { backgroundColor: u }
+				}),
+				/* @__PURE__ */ X(rr, {
+					className: "peer pointer-events-none invisible absolute top-lg",
+					defaultValue: l ? void 0 : u,
+					onChange: h,
+					ref: g,
+					type: "color",
+					value: l ? u : void 0,
+					...m
+				}),
+				/* @__PURE__ */ X("p", {
+					className: "pl-lg text-left style-text-default-0",
+					children: u
+				})
+			]
+		});
+	}
+	return /* @__PURE__ */ X(rr, {
 		className: J(ir({
-			variant: e,
-			size: t
-		}), n),
-		ref: r,
-		...i
+			variant: t,
+			size: n
+		}), r),
+		ref: i,
+		...a
 	});
 }, ZW = ({ className: e, children: t, ref: n, ...r }) => {
 	let i = D();
@@ -33334,19 +33368,19 @@ var M2 = ({ row: e, className: t, children: n, ref: r, ...i }) => /* @__PURE__ *
 	ref: n,
 	...r,
 	children: t
-}), u4 = y("flex flex-col gap-3xs data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50 [&_[role=\"group\"]]:rounded-full [&_[role=\"group\"]]:bg-surface [&_[role=\"group\"]]:p-3xs [&_[role=\"group\"]]:shadow-2xs [&_[role=\"group\"]]:outline [&_[role=\"group\"]]:outline-transparent [&_[role=\"group\"]]:transition-all aria-invalid:[&_[role=\"group\"]]:bg-error-container aria-invalid:[&_[role=\"group\"]]:outline-error-border aria-invalid:[&_[role=\"group\"]]:focus-within:outline-error-border-strong aria-invalid:[&_[role=\"group\"]]:not-focus-within:hover:outline-error-border data-[disabled]:[&_[role=\"group\"]]:cursor-not-allowed data-[invalid]:[&_[role=\"group\"]]:bg-error-container data-[invalid]:[&_[role=\"group\"]]:outline-error-border data-[invalid]:[&_[role=\"group\"]]:focus-within:outline-error-border-strong data-[invalid]:[&_[role=\"group\"]]:not-focus-within:hover:outline-error-border aria-invalid:[&_input]:text-error-on-container aria-invalid:[&_input]:caret-error-border-strong data-[invalid]:[&_input]:text-error-on-container data-[invalid]:[&_input]:caret-error-border-strong", {
+}), u4 = y("flex flex-col gap-3xs data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50 [&_[role=\"group\"]]:rounded-full [&_[role=\"group\"]]:bg-surface [&_[role=\"group\"]]:shadow-2xs [&_[role=\"group\"]]:outline [&_[role=\"group\"]]:outline-transparent [&_[role=\"group\"]]:transition-all aria-invalid:[&_[role=\"group\"]]:bg-error-container aria-invalid:[&_[role=\"group\"]]:outline-error-border aria-invalid:[&_[role=\"group\"]]:focus-within:outline-error-border-strong aria-invalid:[&_[role=\"group\"]]:not-focus-within:hover:outline-error-border data-[disabled]:[&_[role=\"group\"]]:cursor-not-allowed data-[invalid]:[&_[role=\"group\"]]:bg-error-container data-[invalid]:[&_[role=\"group\"]]:outline-error-border data-[invalid]:[&_[role=\"group\"]]:focus-within:outline-error-border-strong data-[invalid]:[&_[role=\"group\"]]:not-focus-within:hover:outline-error-border aria-invalid:[&_input]:text-error-on-container aria-invalid:[&_input]:caret-error-border-strong data-[invalid]:[&_input]:text-error-on-container data-[invalid]:[&_input]:caret-error-border-strong", {
 	variants: { size: {
-		small: "[&_input]:style-text-default-0",
-		medium: "[&_input]:style-text-default-1",
-		large: "[&_input]:style-text-default-2"
+		small: "h-lg [&_input]:style-text-default--1",
+		medium: "h-xl [&_input]:style-text-default-0",
+		large: "h-2xl [&_input]:style-text-default-1"
 	} },
 	defaultVariants: { size: "medium" }
-}), d4 = ({ label: e, size: t, className: n, ref: r, ...i }) => {
-	let a = sr.useId(), { min: o, max: s, value: c, defaultValue: l, onValueChange: u, "aria-invalid": d, ...f } = i, [p, m] = sr.useState(() => typeof l == "number" ? l : null), h = typeof c == "number" || c === null ? c : p, g = !!(d || typeof h == "number" && (typeof o == "number" && h < o || typeof s == "number" && h > s)), _ = (...e) => {
+}), d4 = ({ children: e, label: t, size: n, className: r, ref: i, ...a }) => {
+	let o = sr.useId(), { min: s, max: c, value: l, defaultValue: u, onValueChange: d, "aria-invalid": f, ...p } = a, [m, h] = sr.useState(() => typeof u == "number" ? u : null), g = typeof l == "number" || l === null ? l : m, _ = !!(f || typeof g == "number" && (typeof s == "number" && g < s || typeof c == "number" && g > c)), v = (...e) => {
 		let [t] = e;
-		typeof c != "number" && c !== null && m(t), u?.(...e);
-	}, v = () => {
-		switch (t) {
+		typeof l != "number" && l !== null && h(t), d?.(...e);
+	}, y = () => {
+		switch (n) {
 			case "small": return "iconSmall";
 			case "medium": return "iconMedium";
 			case "large": return "iconLarge";
@@ -33355,43 +33389,47 @@ var M2 = ({ row: e, className: t, children: n, ref: r, ...i }) => /* @__PURE__ *
 	};
 	return /* @__PURE__ */ Z(lp, {
 		className: J(u4({
-			size: t,
-			className: n
+			size: n,
+			className: r
 		})),
-		ref: r,
-		"aria-invalid": g,
-		"data-invalid": g ? "" : void 0,
-		defaultValue: l,
-		id: a,
-		max: s,
-		min: o,
-		onValueChange: _,
-		value: c,
-		...f,
+		ref: i,
+		"aria-invalid": _,
+		"data-invalid": _ ? "" : void 0,
+		defaultValue: u,
+		id: o,
+		max: c,
+		min: s,
+		onValueChange: v,
+		value: l,
+		...p,
 		children: [/* @__PURE__ */ Z(Np, {
 			className: "cursor-ew-resize",
 			children: [/* @__PURE__ */ X("label", {
 				className: "cursor-ew-resize style-text-default--1",
-				htmlFor: a,
-				children: e
+				htmlFor: o,
+				children: t
 			}), /* @__PURE__ */ X(Pp, { children: /* @__PURE__ */ X(f4, {}) })]
 		}), /* @__PURE__ */ Z(dp, {
-			className: "flex w-full items-center",
+			className: "relative flex w-full items-center gap-3xs",
 			children: [
 				/* @__PURE__ */ X(Tp, { render: (e) => /* @__PURE__ */ X(P, {
 					...e,
 					tone: "error",
 					variant: "ghost",
-					size: v(),
+					size: y(),
 					className: "shrink-0",
 					children: /* @__PURE__ */ X(Vy, { weight: "bold" })
 				}) }),
 				/* @__PURE__ */ X(Op, { className: "w-full text-center style-text-default-0 focus:outline-none" }),
+				/* @__PURE__ */ X("div", {
+					className: "absolute right-2xl style-text-default-0 text-on-surface-variant",
+					children: e
+				}),
 				/* @__PURE__ */ X(wp, { render: (e) => /* @__PURE__ */ X(P, {
 					...e,
 					tone: "success",
 					variant: "ghost",
-					size: v(),
+					size: y(),
 					className: "shrink-0",
 					children: /* @__PURE__ */ X(Hy, { weight: "bold" })
 				}) })