tembro 2.0.5 → 2.1.0

package/dist/components/ui/select/index.js

@@ -1,98 +1,209 @@
 "use client";
-import { cn as e } from "../../../lib/utils.js";
-import "react";
-import { CheckIcon as t, ChevronDownIcon as n, ChevronUpIcon as r } from "lucide-react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
-import { Select as o } from "@base-ui/react/select";
+import { cn as e, stopInteractivePropagation as t } from "../../../lib/utils.js";
+import * as n from "react";
+import { CheckIcon as r, ChevronDownIcon as i, ChevronUpIcon as a, LoaderCircleIcon as o, SearchIcon as s, XIcon as c } from "lucide-react";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { Select as d } from "@base-ui/react/select";
 //#region src/components/ui/select/index.tsx
-var s = o.Root;
-function c({ className: t, ...n }) {
-	return /* @__PURE__ */ i(o.Group, {
+var f = d.Root;
+function p(e, t) {
+	let n = t.trim().toLowerCase();
+	return n ? [
+		typeof e.label == "string" || typeof e.label == "number" ? String(e.label) : e.value,
+		e.value,
+		...e.keywords ?? []
+	].join(" ").toLowerCase().includes(n) : !0;
+}
+function m({ value: i, defaultValue: a, onValueChange: d, options: m, groups: x, placeholder: S = "Select", searchPlaceholder: C = "Search options...", emptyLabel: w = "No options found", emptyMessage: T, clearLabel: E = "Clear selection", size: D = "default", clearable: O = !1, searchable: k = !1, loading: A = !1, loadingLabel: j = "Loading options...", disabled: M = !1, showSelectedDescription: N = !0, triggerClassName: P, contentClassName: F, itemClassName: I, searchClassName: L, renderOption: R, invalid: z, children: B, onOpenChange: V, onSearchChange: H, ...U }) {
+	if (!m && !x) return /* @__PURE__ */ l(f, {
+		value: i ?? void 0,
+		defaultValue: a ?? void 0,
+		onValueChange: (e) => d?.(e ?? void 0),
+		onOpenChange: V,
+		disabled: M,
+		...U,
+		children: B
+	});
+	let [W, G] = n.useState(""), K = n.useMemo(() => x ?? [{ options: m ?? [] }], [x, m]), q = n.useMemo(() => K.flatMap((e) => e.options), [K]).find((e) => e.value === i), J = K.map((e) => ({
+		...e,
+		options: e.options.filter((e) => p(e, W))
+	})).filter((e) => e.options.length > 0), Y = J.reduce((e, t) => e + t.options.length, 0);
+	return /* @__PURE__ */ u(f, {
+		value: i ?? void 0,
+		defaultValue: a ?? void 0,
+		onValueChange: (e) => d?.(e ?? void 0),
+		disabled: M || A,
+		onOpenChange: (e, t) => {
+			e || G(""), V?.(e, t);
+		},
+		...U,
+		children: [/* @__PURE__ */ u(_, {
+			size: D,
+			"aria-invalid": z || void 0,
+			className: e("w-full", P),
+			children: [
+				/* @__PURE__ */ l(g, {
+					placeholder: S,
+					children: q ? /* @__PURE__ */ u("span", {
+						className: "flex min-w-0 flex-col items-start",
+						children: [/* @__PURE__ */ l("span", {
+							className: "truncate",
+							children: q.label
+						}), N && q.description ? /* @__PURE__ */ l("span", {
+							className: "truncate text-[11px] font-medium text-muted-foreground",
+							children: q.description
+						}) : null]
+					}) : null
+				}),
+				A ? /* @__PURE__ */ l(o, { className: "size-4 animate-spin text-muted-foreground" }) : null,
+				O && i && !M && !A ? /* @__PURE__ */ l("span", {
+					role: "button",
+					tabIndex: 0,
+					"aria-label": E,
+					className: "ml-1 rounded-[var(--radius-sm)] border border-border/65 p-1 text-muted-foreground transition-colors hover:border-border hover:bg-muted/55 hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+					onClick: (e) => {
+						e.preventDefault(), t(e), d?.(void 0);
+					},
+					onMouseDown: t,
+					onDoubleClick: t,
+					onKeyDown: (e) => {
+						(e.key === "Enter" || e.key === " ") && (e.preventDefault(), d?.(void 0));
+					},
+					children: /* @__PURE__ */ l(c, { className: "size-3.5" })
+				}) : null
+			]
+		}), /* @__PURE__ */ u(v, {
+			className: e("w-(--anchor-width)", F),
+			children: [k ? /* @__PURE__ */ u("div", {
+				"data-slot": "select-search",
+				className: "sticky top-0 z-10 mb-1 flex items-center gap-2 rounded-[var(--radius-md)] border border-[color:var(--aui-card-border,var(--border))] bg-popover px-2.5 py-2 text-sm",
+				children: [/* @__PURE__ */ l(s, { className: "size-4 text-muted-foreground" }), /* @__PURE__ */ l("input", {
+					value: W,
+					onChange: (e) => {
+						G(e.target.value), H?.(e.target.value);
+					},
+					placeholder: C,
+					className: e("min-w-0 flex-1 bg-transparent outline-none placeholder:text-muted-foreground", L)
+				})]
+			}) : null, A ? /* @__PURE__ */ u("div", {
+				"data-slot": "select-state",
+				className: "flex items-center gap-2 rounded-[var(--radius-md)] border border-[color:var(--aui-card-border,var(--border))] bg-[color:color-mix(in_oklch,var(--muted),transparent_55%)] px-3 py-2.5 text-sm text-muted-foreground",
+				children: [/* @__PURE__ */ l(o, { className: "size-4 animate-spin" }), j]
+			}) : Y === 0 ? /* @__PURE__ */ l("div", {
+				"data-slot": "select-state",
+				className: "rounded-[var(--radius-md)] border border-[color:var(--aui-card-border,var(--border))] bg-[color:color-mix(in_oklch,var(--muted),transparent_55%)] px-3 py-2.5 text-sm text-muted-foreground",
+				children: T ?? w
+			}) : J.map((t, n) => /* @__PURE__ */ u(h, { children: [t.label ? /* @__PURE__ */ l(y, { children: t.label }) : null, t.options.map((t) => {
+				let n = t.value === i;
+				return /* @__PURE__ */ l(b, {
+					value: t.value,
+					disabled: t.disabled,
+					className: e("rounded-[var(--radius-md)]", I),
+					children: R ? R(t, { selected: n }) : /* @__PURE__ */ u("span", {
+						className: "flex min-w-0 flex-1 flex-col",
+						children: [/* @__PURE__ */ u("span", {
+							className: "flex min-w-0 items-center gap-2",
+							children: [/* @__PURE__ */ l("span", {
+								className: "truncate",
+								children: t.label
+							}), n ? /* @__PURE__ */ l(r, { className: "ml-auto size-3.5 text-primary" }) : null]
+						}), t.description ? /* @__PURE__ */ l("span", {
+							className: "truncate text-xs text-muted-foreground",
+							children: t.description
+						}) : null]
+					})
+				}, t.value);
+			})] }, n))]
+		})]
+	});
+}
+function h({ className: t, ...n }) {
+	return /* @__PURE__ */ l(d.Group, {
 		"data-slot": "select-group",
 		className: e("scroll-my-1 p-1", t),
 		...n
 	});
 }
-function l({ className: t, ...n }) {
-	return /* @__PURE__ */ i(o.Value, {
+function g({ className: t, ...n }) {
+	return /* @__PURE__ */ l(d.Value, {
 		"data-slot": "select-value",
 		className: e("flex flex-1 text-left", t),
 		...n
 	});
 }
-function u({ className: t, size: r = "default", children: s, ...c }) {
-	return /* @__PURE__ */ a(o.Trigger, {
+function _({ className: t, size: n = "default", children: r, ...a }) {
+	return /* @__PURE__ */ u(d.Trigger, {
 		"data-slot": "select-trigger",
-		"data-size": r,
+		"data-size": n,
 		className: e("flex w-full min-w-0 items-center justify-between gap-2 rounded-[var(--aui-control-radius,var(--radius-md))] border border-[color:var(--aui-control-border-strong,var(--input))] bg-[color:var(--aui-control-surface,var(--background))] pr-3 pl-3 text-sm whitespace-nowrap text-foreground shadow-[var(--aui-control-shadow,0_1px_2px_rgba(15,23,42,0.04))] transition-[background-color,border-color,box-shadow,color] outline-none select-none hover:border-[color:var(--aui-control-hover-border,var(--ring))] hover:bg-[color:var(--aui-control-surface-hover,var(--background))] hover:shadow-[var(--aui-control-shadow-hover,0_2px_6px_rgba(15,23,42,0.06))] focus-visible:border-[color:var(--ring)] focus-visible:ring-0 focus-visible:shadow-[var(--aui-control-shadow,0_1px_2px_rgba(15,23,42,0.04)),0_0_0_1px_var(--aui-focus-ring,var(--ring)),0_0_0_4px_var(--aui-focus-ring-soft,transparent)] disabled:cursor-not-allowed disabled:border-[color:color-mix(in_oklch,var(--border),transparent_18%)] disabled:bg-[color:var(--aui-control-surface-disabled,var(--muted))] disabled:text-muted-foreground disabled:opacity-100 aria-invalid:border-destructive aria-invalid:shadow-[var(--aui-control-shadow,0_1px_2px_rgba(15,23,42,0.04)),0_0_0_1px_var(--aui-danger-ring,var(--destructive)),0_0_0_4px_var(--aui-danger-ring-soft,transparent)] data-placeholder:text-muted-foreground/74 data-[size=default]:h-11 data-[size=lg]:h-12 data-[size=sm]:h-9 data-[size=sm]:rounded-[var(--radius-sm)] *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:min-w-0 *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", t),
-		...c,
-		children: [s, /* @__PURE__ */ i(o.Icon, { render: /* @__PURE__ */ i(n, { className: "pointer-events-none size-4 text-muted-foreground" }) })]
+		...a,
+		children: [r, /* @__PURE__ */ l(d.Icon, { render: /* @__PURE__ */ l(i, { className: "pointer-events-none size-4 text-muted-foreground" }) })]
 	});
 }
-function d({ className: t, children: n, side: r = "bottom", sideOffset: s = 4, align: c = "center", alignOffset: l = 0, alignItemWithTrigger: u = !0, ...d }) {
-	return /* @__PURE__ */ i(o.Portal, { children: /* @__PURE__ */ i(o.Positioner, {
+function v({ className: t, children: n, side: r = "bottom", sideOffset: i = 4, align: a = "center", alignOffset: o = 0, alignItemWithTrigger: s = !0, ...c }) {
+	return /* @__PURE__ */ l(d.Portal, { children: /* @__PURE__ */ l(d.Positioner, {
 		side: r,
-		sideOffset: s,
-		align: c,
-		alignOffset: l,
-		alignItemWithTrigger: u,
+		sideOffset: i,
+		align: a,
+		alignOffset: o,
+		alignItemWithTrigger: s,
 		className: "isolate z-50",
-		children: /* @__PURE__ */ a(o.Popup, {
+		children: /* @__PURE__ */ u(d.Popup, {
 			"data-slot": "select-content",
-			"data-align-trigger": u,
+			"data-align-trigger": s,
 			className: e("relative isolate z-50 max-h-(--available-height) w-(--anchor-width) min-w-52 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-[var(--aui-card-radius,var(--radius-lg))] border border-[color:var(--aui-card-border,var(--border))] bg-popover p-1.5 text-popover-foreground shadow-[var(--aui-control-panel-shadow,0_18px_40px_rgba(15,23,42,0.14))] backdrop-blur duration-100 data-[align-trigger=true]:animate-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", t),
-			...d,
+			...c,
 			children: [
-				/* @__PURE__ */ i(h, {}),
-				/* @__PURE__ */ i(o.List, { children: n }),
-				/* @__PURE__ */ i(g, {})
+				/* @__PURE__ */ l(S, {}),
+				/* @__PURE__ */ l(d.List, { children: n }),
+				/* @__PURE__ */ l(C, {})
 			]
 		})
 	}) });
 }
-function f({ className: t, ...n }) {
-	return /* @__PURE__ */ i(o.GroupLabel, {
+function y({ className: t, ...n }) {
+	return /* @__PURE__ */ l(d.GroupLabel, {
 		"data-slot": "select-label",
 		className: e("px-2 py-1.5 text-[11px] font-semibold tracking-[0.14em] uppercase text-muted-foreground/90", t),
 		...n
 	});
 }
-function p({ className: n, children: r, ...s }) {
-	return /* @__PURE__ */ a(o.Item, {
+function b({ className: t, children: n, ...i }) {
+	return /* @__PURE__ */ u(d.Item, {
 		"data-slot": "select-item",
-		className: e("relative flex w-full cursor-default items-center gap-2 rounded-[var(--radius-md)] border border-transparent py-2.5 pr-9 pl-3 text-sm text-[color:var(--aui-page-muted-strong,var(--foreground))] outline-hidden select-none transition-[background-color,border-color,color,box-shadow,transform] data-[highlighted]:border-[color:color-mix(in_oklch,var(--primary),transparent_72%)] data-[highlighted]:bg-[color:color-mix(in_oklch,var(--primary),transparent_92%)] data-[highlighted]:text-foreground data-[selected]:border-[color:color-mix(in_oklch,var(--primary),transparent_70%)] data-[selected]:bg-[color:color-mix(in_oklch,var(--primary),transparent_90%)] data-[selected]:font-semibold data-[selected]:text-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:min-w-0 *:[span]:last:items-center *:[span]:last:gap-2", n),
-		...s,
-		children: [/* @__PURE__ */ i(o.ItemText, {
+		className: e("relative flex w-full cursor-default items-center gap-2 rounded-[var(--radius-md)] border border-transparent py-2.5 pr-9 pl-3 text-sm text-[color:var(--aui-page-muted-strong,var(--foreground))] outline-hidden select-none transition-[background-color,border-color,color,box-shadow,transform] data-[highlighted]:border-[color:color-mix(in_oklch,var(--primary),transparent_72%)] data-[highlighted]:bg-[color:color-mix(in_oklch,var(--primary),transparent_92%)] data-[highlighted]:text-foreground data-[selected]:border-[color:color-mix(in_oklch,var(--primary),transparent_70%)] data-[selected]:bg-[color:color-mix(in_oklch,var(--primary),transparent_90%)] data-[selected]:font-semibold data-[selected]:text-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:min-w-0 *:[span]:last:items-center *:[span]:last:gap-2", t),
+		...i,
+		children: [/* @__PURE__ */ l(d.ItemText, {
 			className: "flex flex-1 shrink-0 gap-2 whitespace-nowrap",
-			children: r
-		}), /* @__PURE__ */ i(o.ItemIndicator, {
-			render: /* @__PURE__ */ i("span", { className: "pointer-events-none absolute right-2 flex size-4 items-center justify-center" }),
-			children: /* @__PURE__ */ i(t, { className: "pointer-events-none" })
+			children: n
+		}), /* @__PURE__ */ l(d.ItemIndicator, {
+			render: /* @__PURE__ */ l("span", { className: "pointer-events-none absolute right-2 flex size-4 items-center justify-center" }),
+			children: /* @__PURE__ */ l(r, { className: "pointer-events-none" })
 		})]
 	});
 }
-function m({ className: t, ...n }) {
-	return /* @__PURE__ */ i(o.Separator, {
+function x({ className: t, ...n }) {
+	return /* @__PURE__ */ l(d.Separator, {
 		"data-slot": "select-separator",
 		className: e("pointer-events-none -mx-1 my-1.5 h-px bg-border/80", t),
 		...n
 	});
 }
-function h({ className: t, ...n }) {
-	return /* @__PURE__ */ i(o.ScrollUpArrow, {
+function S({ className: t, ...n }) {
+	return /* @__PURE__ */ l(d.ScrollUpArrow, {
 		"data-slot": "select-scroll-up-button",
 		className: e("top-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 text-muted-foreground [&_svg:not([class*='size-'])]:size-4", t),
 		...n,
-		children: /* @__PURE__ */ i(r, {})
+		children: /* @__PURE__ */ l(a, {})
 	});
 }
-function g({ className: t, ...r }) {
-	return /* @__PURE__ */ i(o.ScrollDownArrow, {
+function C({ className: t, ...n }) {
+	return /* @__PURE__ */ l(d.ScrollDownArrow, {
 		"data-slot": "select-scroll-down-button",
 		className: e("bottom-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 text-muted-foreground [&_svg:not([class*='size-'])]:size-4", t),
-		...r,
-		children: /* @__PURE__ */ i(n, {})
+		...n,
+		children: /* @__PURE__ */ l(i, {})
 	});
 }
 //#endregion
-export { s as Select, d as SelectContent, c as SelectGroup, p as SelectItem, f as SelectLabel, g as SelectScrollDownButton, h as SelectScrollUpButton, m as SelectSeparator, u as SelectTrigger, l as SelectValue };
+export { m as Select, v as SelectContent, h as SelectGroup, b as SelectItem, y as SelectLabel, C as SelectScrollDownButton, S as SelectScrollUpButton, x as SelectSeparator, _ as SelectTrigger, g as SelectValue };

package/dist/components/ui/switch/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");var i=n.forwardRef(({className:e,checked:i,defaultChecked:a=!1,onCheckedChange:o,disabled:s,onClick:c,...l},u)=>{let d=i!==void 0,[f,p]=n.useState(a),m=d?i:f;return(0,r.jsx)(`button`,{ref:u,type:`button`,role:`switch`,"aria-checked":m,"data-state":m?`checked`:`unchecked`,"data-slot":`switch`,disabled:s,className:t.cn(`peer inline-flex h-6.5 w-11.5 shrink-0 cursor-pointer items-center rounded-full border border-border/78 bg-input/70 shadow-[inset_0_1px_0_rgba(255,255,255,0.08)] transition-[background-color,border-color,box-shadow] outline-none hover:border-ring/30 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/45 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:border-primary/22 data-[state=checked]:bg-primary data-[state=checked]:shadow-[0_10px_22px_color-mix(in_oklch,var(--primary),transparent_82%)] dark:border-white/10 dark:bg-white/[0.08]`,e),onClick:e=>{let t=!m;d||p(t),o?.(t),c?.(e)},...l,children:(0,r.jsx)(`span`,{"data-slot":`switch-thumb`,"data-state":m?`checked`:`unchecked`,className:t.cn(`pointer-events-none block size-5 rounded-full bg-white shadow-[0_2px_10px_color-mix(in_oklch,var(--foreground),transparent_88%)] ring-1 ring-foreground/6 transition-transform data-[state=checked]:translate-x-5.5 data-[state=unchecked]:translate-x-0.5 dark:bg-[rgba(255,255,255,0.96)]`)})})});i.displayName=`Switch`,exports.Switch=i;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("lucide-react"),i=require("react/jsx-runtime");var a={sm:`h-5 w-9`,md:`h-6.5 w-11.5`,lg:`h-8 w-14`},o={sm:`size-4 data-[state=checked]:translate-x-4.5 data-[state=unchecked]:translate-x-0.5`,md:`size-5 data-[state=checked]:translate-x-5.5 data-[state=unchecked]:translate-x-0.5`,lg:`size-6 data-[state=checked]:translate-x-7 data-[state=unchecked]:translate-x-1`},s=n.forwardRef(({className:e,checked:s,defaultChecked:c=!1,onCheckedChange:l,size:u=`md`,loading:d=!1,invalid:f=!1,label:p,description:m,labelPlacement:h=`end`,switchClassName:g,labelClassName:_,descriptionClassName:v,disabled:y,onClick:b,...x},S)=>{let C=s!==void 0,[w,T]=n.useState(c),E=C?s:w,D=y||d,O=(0,i.jsx)(`button`,{ref:S,type:`button`,role:`switch`,"aria-checked":E,"aria-invalid":f||void 0,"aria-busy":d||void 0,"data-state":E?`checked`:`unchecked`,"data-size":u,"data-slot":`switch`,disabled:D,className:t.cn(`peer inline-flex shrink-0 cursor-pointer items-center rounded-full border border-border/78 bg-input/70 shadow-[inset_0_1px_0_rgba(255,255,255,0.08)] transition-[background-color,border-color,box-shadow] outline-none hover:border-ring/30 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/45 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-[state=checked]:border-primary/22 data-[state=checked]:bg-primary data-[state=checked]:shadow-[0_10px_22px_color-mix(in_oklch,var(--primary),transparent_82%)] dark:border-white/10 dark:bg-white/[0.08]`,a[u],g,!p&&e),onClick:e=>{if(D)return;let t=!E;C||T(t),l?.(t),b?.(e)},...x,children:(0,i.jsx)(`span`,{"data-slot":`switch-thumb`,"data-state":E?`checked`:`unchecked`,className:t.cn(`pointer-events-none flex items-center justify-center rounded-full bg-white shadow-[0_2px_10px_color-mix(in_oklch,var(--foreground),transparent_88%)] ring-1 ring-foreground/6 transition-transform dark:bg-[rgba(255,255,255,0.96)]`,o[u]),children:d?(0,i.jsx)(r.Loader2Icon,{className:`size-3 animate-spin text-muted-foreground`}):null})});if(!p&&!m)return O;let k=(0,i.jsxs)(`span`,{className:`grid min-w-0 gap-0.5`,children:[p?(0,i.jsx)(`span`,{className:t.cn(`text-sm font-medium leading-5 text-foreground`,_),children:p}):null,m?(0,i.jsx)(`span`,{className:t.cn(`text-xs leading-5 text-muted-foreground`,v),children:m}):null]});return(0,i.jsx)(`label`,{"data-slot":`switch-field`,"data-label-placement":h,className:t.cn(`inline-flex min-w-0 gap-3`,h===`top`||h===`bottom`?`flex-col`:`items-start`,h===`start`&&`flex-row-reverse justify-end`,e),children:h===`bottom`?(0,i.jsxs)(i.Fragment,{children:[O,k]}):(0,i.jsxs)(i.Fragment,{children:[k,O]})})});s.displayName=`Switch`,exports.Switch=s;

package/dist/components/ui/switch/index.d.ts

@@ -3,10 +3,28 @@ export type SwitchProps = Omit<React.ComponentPropsWithoutRef<"button">, "onChan
     checked?: boolean;
     defaultChecked?: boolean;
     onCheckedChange?: (checked: boolean) => void;
+    size?: "sm" | "md" | "lg";
+    loading?: boolean;
+    invalid?: boolean;
+    label?: React.ReactNode;
+    description?: React.ReactNode;
+    labelPlacement?: "start" | "end" | "top" | "bottom";
+    switchClassName?: string;
+    labelClassName?: string;
+    descriptionClassName?: string;
 };
 declare const Switch: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "value" | "onChange"> & {
     checked?: boolean;
     defaultChecked?: boolean;
     onCheckedChange?: (checked: boolean) => void;
+    size?: "sm" | "md" | "lg";
+    loading?: boolean;
+    invalid?: boolean;
+    label?: React.ReactNode;
+    description?: React.ReactNode;
+    labelPlacement?: "start" | "end" | "top" | "bottom";
+    switchClassName?: string;
+    labelClassName?: string;
+    descriptionClassName?: string;
 } & React.RefAttributes<HTMLButtonElement>>;
 export { Switch };

package/dist/components/ui/switch/index.js

@@ -1,30 +1,60 @@
 import { cn as e } from "../../../lib/utils.js";
 import * as t from "react";
-import { jsx as n } from "react/jsx-runtime";
+import { Loader2Icon as n } from "lucide-react";
+import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region src/components/ui/switch/index.tsx
-var r = t.forwardRef(({ className: r, checked: i, defaultChecked: a = !1, onCheckedChange: o, disabled: s, onClick: c, ...l }, u) => {
-	let d = i !== void 0, [f, p] = t.useState(a), m = d ? i : f;
-	return /* @__PURE__ */ n("button", {
-		ref: u,
+var o = {
+	sm: "h-5 w-9",
+	md: "h-6.5 w-11.5",
+	lg: "h-8 w-14"
+}, s = {
+	sm: "size-4 data-[state=checked]:translate-x-4.5 data-[state=unchecked]:translate-x-0.5",
+	md: "size-5 data-[state=checked]:translate-x-5.5 data-[state=unchecked]:translate-x-0.5",
+	lg: "size-6 data-[state=checked]:translate-x-7 data-[state=unchecked]:translate-x-1"
+}, c = t.forwardRef(({ className: c, checked: l, defaultChecked: u = !1, onCheckedChange: d, size: f = "md", loading: p = !1, invalid: m = !1, label: h, description: g, labelPlacement: _ = "end", switchClassName: v, labelClassName: y, descriptionClassName: b, disabled: x, onClick: S, ...C }, w) => {
+	let T = l !== void 0, [E, D] = t.useState(u), O = T ? l : E, k = x || p, A = /* @__PURE__ */ i("button", {
+		ref: w,
 		type: "button",
 		role: "switch",
-		"aria-checked": m,
-		"data-state": m ? "checked" : "unchecked",
+		"aria-checked": O,
+		"aria-invalid": m || void 0,
+		"aria-busy": p || void 0,
+		"data-state": O ? "checked" : "unchecked",
+		"data-size": f,
 		"data-slot": "switch",
-		disabled: s,
-		className: e("peer inline-flex h-6.5 w-11.5 shrink-0 cursor-pointer items-center rounded-full border border-border/78 bg-input/70 shadow-[inset_0_1px_0_rgba(255,255,255,0.08)] transition-[background-color,border-color,box-shadow] outline-none hover:border-ring/30 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/45 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:border-primary/22 data-[state=checked]:bg-primary data-[state=checked]:shadow-[0_10px_22px_color-mix(in_oklch,var(--primary),transparent_82%)] dark:border-white/10 dark:bg-white/[0.08]", r),
+		disabled: k,
+		className: e("peer inline-flex shrink-0 cursor-pointer items-center rounded-full border border-border/78 bg-input/70 shadow-[inset_0_1px_0_rgba(255,255,255,0.08)] transition-[background-color,border-color,box-shadow] outline-none hover:border-ring/30 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/45 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-[state=checked]:border-primary/22 data-[state=checked]:bg-primary data-[state=checked]:shadow-[0_10px_22px_color-mix(in_oklch,var(--primary),transparent_82%)] dark:border-white/10 dark:bg-white/[0.08]", o[f], v, !h && c),
 		onClick: (e) => {
-			let t = !m;
-			d || p(t), o?.(t), c?.(e);
+			if (k) return;
+			let t = !O;
+			T || D(t), d?.(t), S?.(e);
 		},
-		...l,
-		children: /* @__PURE__ */ n("span", {
+		...C,
+		children: /* @__PURE__ */ i("span", {
 			"data-slot": "switch-thumb",
-			"data-state": m ? "checked" : "unchecked",
-			className: e("pointer-events-none block size-5 rounded-full bg-white shadow-[0_2px_10px_color-mix(in_oklch,var(--foreground),transparent_88%)] ring-1 ring-foreground/6 transition-transform data-[state=checked]:translate-x-5.5 data-[state=unchecked]:translate-x-0.5 dark:bg-[rgba(255,255,255,0.96)]")
+			"data-state": O ? "checked" : "unchecked",
+			className: e("pointer-events-none flex items-center justify-center rounded-full bg-white shadow-[0_2px_10px_color-mix(in_oklch,var(--foreground),transparent_88%)] ring-1 ring-foreground/6 transition-transform dark:bg-[rgba(255,255,255,0.96)]", s[f]),
+			children: p ? /* @__PURE__ */ i(n, { className: "size-3 animate-spin text-muted-foreground" }) : null
 		})
 	});
+	if (!h && !g) return A;
+	let j = /* @__PURE__ */ a("span", {
+		className: "grid min-w-0 gap-0.5",
+		children: [h ? /* @__PURE__ */ i("span", {
+			className: e("text-sm font-medium leading-5 text-foreground", y),
+			children: h
+		}) : null, g ? /* @__PURE__ */ i("span", {
+			className: e("text-xs leading-5 text-muted-foreground", b),
+			children: g
+		}) : null]
+	});
+	return /* @__PURE__ */ i("label", {
+		"data-slot": "switch-field",
+		"data-label-placement": _,
+		className: e("inline-flex min-w-0 gap-3", _ === "top" || _ === "bottom" ? "flex-col" : "items-start", _ === "start" && "flex-row-reverse justify-end", c),
+		children: _ === "bottom" ? /* @__PURE__ */ a(r, { children: [A, j] }) : /* @__PURE__ */ a(r, { children: [j, A] })
+	});
 });
-r.displayName = "Switch";
+c.displayName = "Switch";
 //#endregion
-export { r as Switch };
+export { c as Switch };

package/dist/components/ui/tabs/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime"),i=require("@base-ui/react/tabs");var a=i.Tabs.Root,o=n.forwardRef(({className:e,...n},a)=>(0,r.jsx)(i.Tabs.List,{ref:a,"data-slot":`tabs-list`,className:t.cn(`inline-flex min-h-11 items-center justify-center gap-1 rounded-[var(--aui-card-radius,var(--radius-xl))] border border-[color:color-mix(in_oklch,var(--border),white_4%)] bg-[color:var(--aui-control-panel-bg,var(--muted))] p-1 text-muted-foreground shadow-[var(--aui-control-panel-shadow,var(--aui-control-shadow,none))] backdrop-blur`,e),...n}));o.displayName=`TabsList`;var s=n.forwardRef(({className:e,...n},a)=>(0,r.jsx)(i.Tabs.Tab,{ref:a,"data-slot":`tabs-trigger`,className:t.cn(`inline-flex min-h-9 items-center justify-center whitespace-nowrap rounded-[var(--radius-md)] border border-transparent px-3.5 py-1.5 text-sm font-medium text-muted-foreground ring-offset-background transition-[background-color,color,box-shadow,border-color] hover:bg-[color:color-mix(in_oklch,var(--background),transparent_18%)] hover:text-foreground data-[selected]:border-[color:color-mix(in_oklch,var(--border),var(--foreground)_8%)] data-[selected]:bg-[color:var(--aui-control-surface,var(--background))] data-[selected]:text-foreground data-[selected]:shadow-[var(--aui-control-shadow,none)] aria-selected:border-[color:color-mix(in_oklch,var(--border),var(--foreground)_8%)] aria-selected:bg-[color:var(--aui-control-surface,var(--background))] aria-selected:text-foreground aria-selected:shadow-[var(--aui-control-shadow,none)] focus-visible:outline-none focus-visible:ring-0 focus-visible:shadow-[var(--aui-control-shadow,none),0_0_0_1px_var(--aui-focus-ring,var(--ring)),0_0_0_5px_var(--aui-focus-ring-soft,transparent)] disabled:pointer-events-none disabled:opacity-50`,e),...n}));s.displayName=`TabsTrigger`;var c=n.forwardRef(({className:e,...n},a)=>(0,r.jsx)(i.Tabs.Panel,{ref:a,"data-slot":`tabs-content`,className:t.cn(`mt-3 ring-offset-background focus-visible:outline-none focus-visible:ring-0 focus-visible:shadow-[0_0_0_1px_var(--aui-focus-ring,var(--ring)),0_0_0_5px_var(--aui-focus-ring-soft,transparent)]`,e),...n}));c.displayName=`TabsContent`,exports.Tabs=a,exports.TabsContent=c,exports.TabsList=o,exports.TabsTrigger=s;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime"),i=require("@base-ui/react/tabs");var a=i.Tabs.Root,o=n.forwardRef(({className:e,variant:n=`default`,overflow:a=`scroll`,...o},s)=>(0,r.jsx)(i.Tabs.List,{ref:s,"data-slot":`tabs-list`,"data-variant":n,"data-overflow":a,className:t.cn(`inline-flex max-w-full min-h-11 items-center justify-start gap-1 rounded-[var(--aui-card-radius,var(--radius-xl))] border border-[color:color-mix(in_oklch,var(--border),white_4%)] bg-[color:var(--aui-control-panel-bg,var(--muted))] p-1 text-muted-foreground shadow-[var(--aui-control-panel-shadow,var(--aui-control-shadow,none))] backdrop-blur`,a===`scroll`&&`overflow-x-auto overflow-y-hidden overscroll-x-contain [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden`,a===`wrap`&&`flex-wrap`,n===`underline`&&`min-h-10 rounded-none border-x-0 border-t-0 bg-transparent p-0 shadow-none`,n===`compact`&&`min-h-9 rounded-[var(--radius-lg)] p-0.5`,n===`pills`&&`rounded-full`,e),...o}));o.displayName=`TabsList`;var s=n.forwardRef(({className:e,variant:n=`default`,...a},o)=>(0,r.jsx)(i.Tabs.Tab,{ref:o,"data-slot":`tabs-trigger`,"data-variant":n,className:t.cn(`inline-flex min-h-9 shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-[var(--radius-md)] border border-transparent px-3.5 py-1.5 text-sm font-medium text-muted-foreground ring-offset-background transition-[background-color,color,box-shadow,border-color] hover:bg-[color:color-mix(in_oklch,var(--background),transparent_18%)] hover:text-foreground data-[selected]:border-[color:color-mix(in_oklch,var(--border),var(--foreground)_8%)] data-[selected]:bg-[color:var(--aui-control-surface,var(--background))] data-[selected]:text-foreground data-[selected]:shadow-[var(--aui-control-shadow,none)] aria-selected:border-[color:color-mix(in_oklch,var(--border),var(--foreground)_8%)] aria-selected:bg-[color:var(--aui-control-surface,var(--background))] aria-selected:text-foreground aria-selected:shadow-[var(--aui-control-shadow,none)] focus-visible:outline-none focus-visible:ring-0 focus-visible:shadow-[var(--aui-control-shadow,none),0_0_0_1px_var(--aui-focus-ring,var(--ring)),0_0_0_5px_var(--aui-focus-ring-soft,transparent)] disabled:pointer-events-none disabled:opacity-50 [&_svg]:size-4 [&_svg]:shrink-0`,n===`underline`&&`min-h-10 rounded-none border-b-2 px-2 shadow-none data-[selected]:border-b-primary data-[selected]:bg-transparent data-[selected]:shadow-none aria-selected:border-b-primary aria-selected:bg-transparent aria-selected:shadow-none`,n===`pills`&&`rounded-full`,n===`compact`&&`min-h-8 px-2.5 text-xs`,e),...a}));s.displayName=`TabsTrigger`;var c=n.forwardRef(({className:e,...n},a)=>(0,r.jsx)(i.Tabs.Panel,{ref:a,"data-slot":`tabs-content`,className:t.cn(`mt-3 ring-offset-background focus-visible:outline-none focus-visible:ring-0 focus-visible:shadow-[0_0_0_1px_var(--aui-focus-ring,var(--ring)),0_0_0_5px_var(--aui-focus-ring-soft,transparent)]`,e),...n}));c.displayName=`TabsContent`,exports.Tabs=a,exports.TabsContent=c,exports.TabsList=o,exports.TabsTrigger=s;

package/dist/components/ui/tabs/index.d.ts

@@ -1,11 +1,21 @@
 import * as React from "react";
 import { Tabs as BaseTabs } from "@base-ui/react/tabs";
 export type TabsRootProps = React.ComponentPropsWithoutRef<typeof BaseTabs.Root>;
-export type TabsListProps = React.ComponentPropsWithoutRef<typeof BaseTabs.List>;
-export type TabsTriggerProps = React.ComponentPropsWithoutRef<typeof BaseTabs.Tab>;
+export type TabsListProps = React.ComponentPropsWithoutRef<typeof BaseTabs.List> & {
+    variant?: "default" | "pills" | "underline" | "compact";
+    overflow?: "wrap" | "scroll";
+};
+export type TabsTriggerProps = React.ComponentPropsWithoutRef<typeof BaseTabs.Tab> & {
+    variant?: "default" | "pills" | "underline" | "compact";
+};
 export type TabsContentProps = React.ComponentPropsWithoutRef<typeof BaseTabs.Panel>;
 declare const Tabs: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").TabsRootProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const TabsList: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").TabsListProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const TabsTrigger: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").TabsTabProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLElement>>;
+declare const TabsList: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").TabsListProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    variant?: "default" | "pills" | "underline" | "compact";
+    overflow?: "wrap" | "scroll";
+} & React.RefAttributes<HTMLDivElement>>;
+declare const TabsTrigger: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").TabsTabProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & {
+    variant?: "default" | "pills" | "underline" | "compact";
+} & React.RefAttributes<HTMLElement>>;
 declare const TabsContent: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").TabsPanelProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export { Tabs, TabsList, TabsTrigger, TabsContent };

package/dist/components/ui/tabs/index.js

@@ -3,18 +3,21 @@ import * as t from "react";
 import { jsx as n } from "react/jsx-runtime";
 import { Tabs as r } from "@base-ui/react/tabs";
 //#region src/components/ui/tabs/index.tsx
-var i = r.Root, a = t.forwardRef(({ className: t, ...i }, a) => /* @__PURE__ */ n(r.List, {
-	ref: a,
+var i = r.Root, a = t.forwardRef(({ className: t, variant: i = "default", overflow: a = "scroll", ...o }, s) => /* @__PURE__ */ n(r.List, {
+	ref: s,
 	"data-slot": "tabs-list",
-	className: e("inline-flex min-h-11 items-center justify-center gap-1 rounded-[var(--aui-card-radius,var(--radius-xl))] border border-[color:color-mix(in_oklch,var(--border),white_4%)] bg-[color:var(--aui-control-panel-bg,var(--muted))] p-1 text-muted-foreground shadow-[var(--aui-control-panel-shadow,var(--aui-control-shadow,none))] backdrop-blur", t),
-	...i
+	"data-variant": i,
+	"data-overflow": a,
+	className: e("inline-flex max-w-full min-h-11 items-center justify-start gap-1 rounded-[var(--aui-card-radius,var(--radius-xl))] border border-[color:color-mix(in_oklch,var(--border),white_4%)] bg-[color:var(--aui-control-panel-bg,var(--muted))] p-1 text-muted-foreground shadow-[var(--aui-control-panel-shadow,var(--aui-control-shadow,none))] backdrop-blur", a === "scroll" && "overflow-x-auto overflow-y-hidden overscroll-x-contain [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden", a === "wrap" && "flex-wrap", i === "underline" && "min-h-10 rounded-none border-x-0 border-t-0 bg-transparent p-0 shadow-none", i === "compact" && "min-h-9 rounded-[var(--radius-lg)] p-0.5", i === "pills" && "rounded-full", t),
+	...o
 }));
 a.displayName = "TabsList";
-var o = t.forwardRef(({ className: t, ...i }, a) => /* @__PURE__ */ n(r.Tab, {
-	ref: a,
+var o = t.forwardRef(({ className: t, variant: i = "default", ...a }, o) => /* @__PURE__ */ n(r.Tab, {
+	ref: o,
 	"data-slot": "tabs-trigger",
-	className: e("inline-flex min-h-9 items-center justify-center whitespace-nowrap rounded-[var(--radius-md)] border border-transparent px-3.5 py-1.5 text-sm font-medium text-muted-foreground ring-offset-background transition-[background-color,color,box-shadow,border-color] hover:bg-[color:color-mix(in_oklch,var(--background),transparent_18%)] hover:text-foreground data-[selected]:border-[color:color-mix(in_oklch,var(--border),var(--foreground)_8%)] data-[selected]:bg-[color:var(--aui-control-surface,var(--background))] data-[selected]:text-foreground data-[selected]:shadow-[var(--aui-control-shadow,none)] aria-selected:border-[color:color-mix(in_oklch,var(--border),var(--foreground)_8%)] aria-selected:bg-[color:var(--aui-control-surface,var(--background))] aria-selected:text-foreground aria-selected:shadow-[var(--aui-control-shadow,none)] focus-visible:outline-none focus-visible:ring-0 focus-visible:shadow-[var(--aui-control-shadow,none),0_0_0_1px_var(--aui-focus-ring,var(--ring)),0_0_0_5px_var(--aui-focus-ring-soft,transparent)] disabled:pointer-events-none disabled:opacity-50", t),
-	...i
+	"data-variant": i,
+	className: e("inline-flex min-h-9 shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-[var(--radius-md)] border border-transparent px-3.5 py-1.5 text-sm font-medium text-muted-foreground ring-offset-background transition-[background-color,color,box-shadow,border-color] hover:bg-[color:color-mix(in_oklch,var(--background),transparent_18%)] hover:text-foreground data-[selected]:border-[color:color-mix(in_oklch,var(--border),var(--foreground)_8%)] data-[selected]:bg-[color:var(--aui-control-surface,var(--background))] data-[selected]:text-foreground data-[selected]:shadow-[var(--aui-control-shadow,none)] aria-selected:border-[color:color-mix(in_oklch,var(--border),var(--foreground)_8%)] aria-selected:bg-[color:var(--aui-control-surface,var(--background))] aria-selected:text-foreground aria-selected:shadow-[var(--aui-control-shadow,none)] focus-visible:outline-none focus-visible:ring-0 focus-visible:shadow-[var(--aui-control-shadow,none),0_0_0_1px_var(--aui-focus-ring,var(--ring)),0_0_0_5px_var(--aui-focus-ring-soft,transparent)] disabled:pointer-events-none disabled:opacity-50 [&_svg]:size-4 [&_svg]:shrink-0", i === "underline" && "min-h-10 rounded-none border-b-2 px-2 shadow-none data-[selected]:border-b-primary data-[selected]:bg-transparent data-[selected]:shadow-none aria-selected:border-b-primary aria-selected:bg-transparent aria-selected:shadow-none", i === "pills" && "rounded-full", i === "compact" && "min-h-8 px-2.5 text-xs", t),
+	...a
 }));
 o.displayName = "TabsTrigger";
 var s = t.forwardRef(({ className: t, ...i }, a) => /* @__PURE__ */ n(r.Panel, {

package/dist/components/ui/textarea/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");function i({className:e,...n}){return(0,r.jsx)(`textarea`,{"data-slot":`textarea`,className:t.cn(`flex field-sizing-content min-h-28 w-full rounded-[var(--aui-control-radius,var(--radius-lg))] border border-[color:var(--aui-control-border-strong,var(--input))] bg-[color:var(--aui-control-surface,var(--background))] px-4 py-3.5 text-sm font-medium text-foreground shadow-[var(--aui-shadow-xs,0_1px_2px_rgba(15,23,42,0.04))] transition-[background-color,border-color,box-shadow,color] outline-none placeholder:text-muted-foreground/78 hover:border-[color:var(--aui-control-hover-border,var(--ring))] hover:bg-[color:var(--aui-control-surface-hover,var(--background))] focus-visible:border-[color:var(--ring)] focus-visible:ring-0 focus-visible:shadow-[var(--aui-shadow-xs,0_1px_2px_rgba(15,23,42,0.04)),0_0_0_1px_var(--aui-focus-ring,var(--ring)),0_0_0_5px_var(--aui-focus-ring-soft,transparent)] disabled:cursor-not-allowed disabled:border-[color:color-mix(in_oklch,var(--border),transparent_18%)] disabled:bg-[color:var(--aui-control-surface-disabled,var(--muted))] disabled:text-muted-foreground disabled:shadow-none disabled:opacity-100 aria-invalid:border-destructive aria-invalid:shadow-[0_0_0_1px_color-mix(in_oklch,var(--destructive),transparent_32%)] read-only:bg-[color:var(--aui-control-surface-readonly,var(--muted))]`,e),...n})}exports.Textarea=i;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");function i(e){return typeof e==`string`?e.length:typeof e==`number`?String(e).length:Array.isArray(e)?e.join(``).length:0}var a=n.forwardRef(({className:e,value:a,defaultValue:o,onChange:s,onValueChange:c,helperText:l,errorText:u,showCharacterCount:d=!1,countFormatter:f,wrapperClassName:p,textareaClassName:m,maxLength:h,"aria-invalid":g,..._},v)=>{let y=a!==void 0,[b,x]=n.useState(()=>i(o)),S=y?i(a):b,C=u??l,w=!!u||g===!0||g===`true`,T=(0,r.jsx)(`textarea`,{"data-slot":`textarea`,value:a,defaultValue:y?void 0:o,maxLength:h,"aria-invalid":w||void 0,className:t.cn(`flex field-sizing-content min-h-28 w-full rounded-[var(--aui-control-radius,var(--radius-lg))] border border-[color:var(--aui-control-border-strong,var(--input))] bg-[color:var(--aui-control-surface,var(--background))] px-4 py-3.5 text-sm font-medium text-foreground shadow-[var(--aui-shadow-xs,0_1px_2px_rgba(15,23,42,0.04))] transition-[background-color,border-color,box-shadow,color] outline-none placeholder:text-muted-foreground/78 hover:border-[color:var(--aui-control-hover-border,var(--ring))] hover:bg-[color:var(--aui-control-surface-hover,var(--background))] focus-visible:border-[color:var(--ring)] focus-visible:ring-0 focus-visible:shadow-[var(--aui-shadow-xs,0_1px_2px_rgba(15,23,42,0.04)),0_0_0_1px_var(--aui-focus-ring,var(--ring)),0_0_0_5px_var(--aui-focus-ring-soft,transparent)] disabled:cursor-not-allowed disabled:border-[color:color-mix(in_oklch,var(--border),transparent_18%)] disabled:bg-[color:var(--aui-control-surface-disabled,var(--muted))] disabled:text-muted-foreground disabled:shadow-none disabled:opacity-100 aria-invalid:border-destructive aria-invalid:shadow-[0_0_0_1px_color-mix(in_oklch,var(--destructive),transparent_32%)] read-only:bg-[color:var(--aui-control-surface-readonly,var(--muted))]`,m,e),onChange:e=>{y||x(e.target.value.length),s?.(e),c?.(e.target.value)},ref:v,..._});return!C&&!d?T:(0,r.jsxs)(`div`,{"data-slot":`textarea-field`,className:t.cn(`grid gap-1.5`,p),children:[T,(0,r.jsxs)(`div`,{"data-slot":`textarea-meta`,className:`flex items-start justify-between gap-3 px-1`,children:[(0,r.jsx)(`div`,{"data-slot":`textarea-helper`,className:t.cn(`min-w-0 text-xs leading-5`,u?`text-destructive`:`text-muted-foreground`),children:C}),d?(0,r.jsx)(`div`,{"data-slot":`textarea-count`,className:t.cn(`shrink-0 text-[11px] font-medium tabular-nums`,u?`text-destructive`:`text-muted-foreground`),children:f?.(S,h)??(typeof h==`number`?`${S}/${h}`:S)}):null]})]})});a.displayName=`Textarea`,exports.Textarea=a;

package/dist/components/ui/textarea/index.d.ts

@@ -1,4 +1,12 @@
 import * as React from "react";
-export type TextareaProps = React.ComponentProps<"textarea">;
-declare function Textarea({ className, ...props }: TextareaProps): React.JSX.Element;
+export type TextareaProps = React.ComponentProps<"textarea"> & {
+    onValueChange?: (value: string) => void;
+    helperText?: React.ReactNode;
+    errorText?: React.ReactNode;
+    showCharacterCount?: boolean;
+    countFormatter?: (currentLength: number, maxLength?: number) => React.ReactNode;
+    wrapperClassName?: string;
+    textareaClassName?: string;
+};
+declare const Textarea: React.ForwardRefExoticComponent<Omit<TextareaProps, "ref"> & React.RefAttributes<HTMLTextAreaElement>>;
 export { Textarea };

package/dist/components/ui/textarea/index.js

@@ -1,13 +1,42 @@
 import { cn as e } from "../../../lib/utils.js";
-import "react";
-import { jsx as t } from "react/jsx-runtime";
+import * as t from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
 //#region src/components/ui/textarea/index.tsx
-function n({ className: n, ...r }) {
-	return /* @__PURE__ */ t("textarea", {
+function i(e) {
+	return typeof e == "string" ? e.length : typeof e == "number" ? String(e).length : Array.isArray(e) ? e.join("").length : 0;
+}
+var a = t.forwardRef(({ className: a, value: o, defaultValue: s, onChange: c, onValueChange: l, helperText: u, errorText: d, showCharacterCount: f = !1, countFormatter: p, wrapperClassName: m, textareaClassName: h, maxLength: g, "aria-invalid": _, ...v }, y) => {
+	let b = o !== void 0, [x, S] = t.useState(() => i(s)), C = b ? i(o) : x, w = d ?? u, T = /* @__PURE__ */ n("textarea", {
 		"data-slot": "textarea",
-		className: e("flex field-sizing-content min-h-28 w-full rounded-[var(--aui-control-radius,var(--radius-lg))] border border-[color:var(--aui-control-border-strong,var(--input))] bg-[color:var(--aui-control-surface,var(--background))] px-4 py-3.5 text-sm font-medium text-foreground shadow-[var(--aui-shadow-xs,0_1px_2px_rgba(15,23,42,0.04))] transition-[background-color,border-color,box-shadow,color] outline-none placeholder:text-muted-foreground/78 hover:border-[color:var(--aui-control-hover-border,var(--ring))] hover:bg-[color:var(--aui-control-surface-hover,var(--background))] focus-visible:border-[color:var(--ring)] focus-visible:ring-0 focus-visible:shadow-[var(--aui-shadow-xs,0_1px_2px_rgba(15,23,42,0.04)),0_0_0_1px_var(--aui-focus-ring,var(--ring)),0_0_0_5px_var(--aui-focus-ring-soft,transparent)] disabled:cursor-not-allowed disabled:border-[color:color-mix(in_oklch,var(--border),transparent_18%)] disabled:bg-[color:var(--aui-control-surface-disabled,var(--muted))] disabled:text-muted-foreground disabled:shadow-none disabled:opacity-100 aria-invalid:border-destructive aria-invalid:shadow-[0_0_0_1px_color-mix(in_oklch,var(--destructive),transparent_32%)] read-only:bg-[color:var(--aui-control-surface-readonly,var(--muted))]", n),
-		...r
+		value: o,
+		defaultValue: b ? void 0 : s,
+		maxLength: g,
+		"aria-invalid": !!d || _ === !0 || _ === "true" || void 0,
+		className: e("flex field-sizing-content min-h-28 w-full rounded-[var(--aui-control-radius,var(--radius-lg))] border border-[color:var(--aui-control-border-strong,var(--input))] bg-[color:var(--aui-control-surface,var(--background))] px-4 py-3.5 text-sm font-medium text-foreground shadow-[var(--aui-shadow-xs,0_1px_2px_rgba(15,23,42,0.04))] transition-[background-color,border-color,box-shadow,color] outline-none placeholder:text-muted-foreground/78 hover:border-[color:var(--aui-control-hover-border,var(--ring))] hover:bg-[color:var(--aui-control-surface-hover,var(--background))] focus-visible:border-[color:var(--ring)] focus-visible:ring-0 focus-visible:shadow-[var(--aui-shadow-xs,0_1px_2px_rgba(15,23,42,0.04)),0_0_0_1px_var(--aui-focus-ring,var(--ring)),0_0_0_5px_var(--aui-focus-ring-soft,transparent)] disabled:cursor-not-allowed disabled:border-[color:color-mix(in_oklch,var(--border),transparent_18%)] disabled:bg-[color:var(--aui-control-surface-disabled,var(--muted))] disabled:text-muted-foreground disabled:shadow-none disabled:opacity-100 aria-invalid:border-destructive aria-invalid:shadow-[0_0_0_1px_color-mix(in_oklch,var(--destructive),transparent_32%)] read-only:bg-[color:var(--aui-control-surface-readonly,var(--muted))]", h, a),
+		onChange: (e) => {
+			b || S(e.target.value.length), c?.(e), l?.(e.target.value);
+		},
+		ref: y,
+		...v
 	});
-}
+	return !w && !f ? T : /* @__PURE__ */ r("div", {
+		"data-slot": "textarea-field",
+		className: e("grid gap-1.5", m),
+		children: [T, /* @__PURE__ */ r("div", {
+			"data-slot": "textarea-meta",
+			className: "flex items-start justify-between gap-3 px-1",
+			children: [/* @__PURE__ */ n("div", {
+				"data-slot": "textarea-helper",
+				className: e("min-w-0 text-xs leading-5", d ? "text-destructive" : "text-muted-foreground"),
+				children: w
+			}), f ? /* @__PURE__ */ n("div", {
+				"data-slot": "textarea-count",
+				className: e("shrink-0 text-[11px] font-medium tabular-nums", d ? "text-destructive" : "text-muted-foreground"),
+				children: p?.(C, g) ?? (typeof g == "number" ? `${C}/${g}` : C)
+			}) : null]
+		})]
+	});
+});
+a.displayName = "Textarea";
 //#endregion
-export { n as Textarea };
+export { a as Textarea };

package/dist/components/ui/textarea.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./textarea/index.cjs");exports.Textarea=e.Textarea;

package/dist/components/ui/textarea.d.ts

@@ -0,0 +1 @@
+export * from "./textarea/index";

package/dist/components/ui/textarea.js

@@ -0,0 +1,2 @@
+import { Textarea as e } from "./textarea/index.js";
+export { e as Textarea };

package/dist/components/ui/tooltip/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime");var i={top:`bottom-full left-1/2 mb-2 -translate-x-1/2`,bottom:`left-1/2 top-full mt-2 -translate-x-1/2`,left:`right-full top-1/2 mr-2 -translate-y-1/2`,right:`left-full top-1/2 ml-2 -translate-y-1/2`};function a({content:e,side:n=`top`,disabled:a=!1,className:o,children:s,...c}){return(0,r.jsxs)(`span`,{"data-slot":`tooltip`,className:t.cn(`group/tooltip relative inline-flex`,o),...c,children:[s,!a&&(0,r.jsx)(`span`,{"data-slot":`tooltip-content`,role:`tooltip`,className:t.cn(`pointer-events-none absolute z-50 hidden max-w-64 whitespace-nowrap rounded-xl border border-border/75 bg-popover/98 px-2.5 py-1.5 text-[11px] font-medium text-popover-foreground shadow-[0_16px_42px_color-mix(in_oklch,var(--foreground),transparent_86%)] backdrop-blur group-hover/tooltip:block group-focus-within/tooltip:block`,i[n]),children:e})]})}exports.Tooltip=a;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("react/jsx-runtime"),i=require("@base-ui/react/tooltip");function a(e){return typeof e==`string`||typeof e==`number`?String(e):Array.isArray(e)?e.map(a).join(``):n.isValidElement(e)?a(e.props.children):``}function o({content:e,side:o=`top`,align:s=`center`,sideOffset:c=8,alignOffset:l=0,collisionPadding:u=8,delay:d=500,closeDelay:f=0,disabled:p=!1,className:m,children:h,...g}){let _=n.isValidElement(h)?h:(0,r.jsx)(`span`,{className:`inline-flex`,children:h}),v=a(e),y=!p&&v.length>0&&!a(h).includes(v);return(0,r.jsxs)(i.Tooltip.Root,{disabled:p,children:[(0,r.jsxs)(i.Tooltip.Trigger,{"data-slot":`tooltip-trigger`,delay:d,closeDelay:f,disabled:p,render:(0,r.jsx)(`span`,{"data-slot":`tooltip`,className:t.cn(`inline-flex`,m),...g}),children:[_,y?(0,r.jsx)(`span`,{className:`sr-only`,children:e}):null]}),(0,r.jsx)(i.Tooltip.Portal,{children:(0,r.jsx)(i.Tooltip.Positioner,{className:`isolate z-50`,side:o,align:s,sideOffset:c,alignOffset:l,collisionPadding:u,children:(0,r.jsx)(i.Tooltip.Popup,{"data-slot":`tooltip-content`,className:`z-50 max-w-64 origin-(--transform-origin) rounded-[var(--radius-lg)] border border-border/75 bg-popover/98 px-2.5 py-1.5 text-[11px] font-medium leading-4 text-popover-foreground shadow-[0_16px_42px_color-mix(in_oklch,var(--foreground),transparent_86%)] outline-hidden backdrop-blur duration-100 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95`,children:e})})})]})}exports.Tooltip=o;

package/dist/components/ui/tooltip/index.d.ts

@@ -1,8 +1,16 @@
 import * as React from "react";
-export type TooltipProps = Omit<React.ComponentProps<"span">, "content"> & {
+import { Tooltip as TooltipPrimitive } from "@base-ui/react/tooltip";
+export type TooltipProps = Omit<TooltipPrimitive.Root.Props, "children"> & Omit<React.ComponentProps<"span">, "content" | "children"> & {
     content: React.ReactNode;
-    side?: "top" | "bottom" | "left" | "right";
+    children: React.ReactNode;
+    side?: TooltipPrimitive.Positioner.Props["side"];
+    align?: TooltipPrimitive.Positioner.Props["align"];
+    sideOffset?: TooltipPrimitive.Positioner.Props["sideOffset"];
+    alignOffset?: TooltipPrimitive.Positioner.Props["alignOffset"];
+    collisionPadding?: TooltipPrimitive.Positioner.Props["collisionPadding"];
+    delay?: TooltipPrimitive.Trigger.Props["delay"];
+    closeDelay?: TooltipPrimitive.Trigger.Props["closeDelay"];
     disabled?: boolean;
 };
-declare function Tooltip({ content, side, disabled, className, children, ...props }: TooltipProps): React.JSX.Element;
+declare function Tooltip({ content, side, align, sideOffset, alignOffset, collisionPadding, delay, closeDelay, disabled, className, children, ...props }: TooltipProps): React.JSX.Element;
 export { Tooltip };