tembro 6.0.3 → 6.1.1

package/dist/src/components/feedback/async-boundary.js

@@ -0,0 +1,22 @@
+"use client";
+import { StateView as e } from "./state-view.js";
+import "react";
+import { Fragment as t, jsx as n } from "react/jsx-runtime";
+//#region src/components/feedback/async-boundary.tsx
+function r({ loading: r, error: i, empty: a, loadingTitle: o = "Loading", errorTitle: s = "Unable to load", emptyTitle: c = "No data", onRetry: l, children: u }) {
+	return r ? /* @__PURE__ */ n(e, {
+		status: "loading",
+		title: o,
+		loadingVariant: "skeleton"
+	}) : i ? /* @__PURE__ */ n(e, {
+		status: "error",
+		title: s,
+		description: i instanceof Error ? i.message : "Try again or check the request.",
+		onRetry: l
+	}) : a ? /* @__PURE__ */ n(e, {
+		status: "empty",
+		title: c
+	}) : /* @__PURE__ */ n(t, { children: u });
+}
+//#endregion
+export { r as AsyncBoundary };

package/dist/src/components/feedback/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./state-view.cjs"),t=require("./alert.cjs");exports.Alert=t.Alert,exports.StateView=e.StateView;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./state-view.cjs"),t=require("./alert.cjs"),n=require("./async-boundary.cjs");exports.Alert=t.Alert,exports.AsyncBoundary=n.AsyncBoundary,exports.StateView=e.StateView;

package/dist/src/components/feedback/index.js

@@ -1,3 +1,4 @@
 import { StateView as e } from "./state-view.js";
 import { Alert as t } from "./alert.js";
-export { t as Alert, e as StateView };
+import { AsyncBoundary as n } from "./async-boundary.js";
+export { t as Alert, n as AsyncBoundary, e as StateView };

package/dist/src/components/filters/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./filter-bar.cjs"),t=require("./saved-filter-select.cjs");exports.FilterBar=e.FilterBar,exports.SavedFilterSelect=t.SavedFilterSelect;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./saved-filter-select.cjs");exports.SavedFilterSelect=e.SavedFilterSelect;

package/dist/src/components/filters/index.js

@@ -1,3 +1,2 @@
-import { FilterBar as e } from "./filter-bar.js";
-import { SavedFilterSelect as t } from "./saved-filter-select.js";
-export { e as FilterBar, t as SavedFilterSelect };
+import { SavedFilterSelect as e } from "./saved-filter-select.js";
+export { e as SavedFilterSelect };

package/dist/src/components/inputs/color-picker.cjs

@@ -1 +1 @@
-"use client";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=/^#?([0-9a-f]{6})([0-9a-f]{2})?$/i;function a(e,t=`#000000`){let n=e.trim().match(i);return n?`#${n[1].toLowerCase()}${n[2]?.toLowerCase()??``}`:t}function o(e){return a(e).slice(0,7)}function s(e){let t=a(e);return t.length===9?Math.round(Number.parseInt(t.slice(7,9),16)/255*100):100}function c(e,t,n){let r=o(e);return n?`${r}${Math.round(Math.min(100,Math.max(0,t))/100*255).toString(16).padStart(2,`0`)}`:r}function l({value:e,defaultValue:a=`#2563eb`,onValueChange:l,swatches:u=[`#0f172a`,`#2563eb`,`#059669`,`#d97706`,`#dc2626`,`#7c3aed`],showAlpha:d=!1,disabled:f=!1,label:p,labels:m,className:h,...g}){let[_,v]=n.useState(()=>c(a,s(a),d)),y=c(e??_,s(e??_),d),[b,x]=n.useState(y);n.useEffect(()=>x(y),[y]);let S=t=>{let n=c(t,s(t),d);e===void 0&&v(n),l?.(n)},C=()=>{if(!i.test(b.trim())){x(y);return}S(b)};return(0,r.jsxs)(`div`,{"data-slot":`color-picker`,className:t.cn(`grid gap-3`,h),...g,children:[p?(0,r.jsx)(`div`,{className:`text-sm font-medium text-foreground`,children:p}):null,(0,r.jsxs)(`div`,{className:`flex min-w-0 items-center gap-2`,children:[(0,r.jsxs)(`label`,{className:`relative size-10 shrink-0 overflow-hidden rounded-md border bg-background shadow-sm focus-within:ring-2 focus-within:ring-ring`,children:[(0,r.jsx)(`span`,{className:`sr-only`,children:m?.color??`Choose color`}),(0,r.jsx)(`input`,{type:`color`,"aria-label":m?.color??`Choose color`,value:o(y),disabled:f,className:`absolute -inset-2 size-14 cursor-pointer border-0 bg-transparent p-0 disabled:cursor-not-allowed`,onChange:e=>S(c(e.target.value,s(y),d))})]}),(0,r.jsx)(`input`,{"aria-label":m?.hex??`Hex color`,value:b,disabled:f,spellCheck:!1,className:`h-10 min-w-0 flex-1 rounded-md border bg-background px-3 font-mono text-sm uppercase outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50`,onChange:e=>x(e.target.value),onBlur:C,onKeyDown:e=>{e.key===`Enter`&&(e.preventDefault(),C()),e.key===`Escape`&&x(y)}})]}),d?(0,r.jsxs)(`label`,{className:`grid grid-cols-[1fr_auto] items-center gap-3 text-xs text-muted-foreground`,children:[(0,r.jsx)(`span`,{className:`sr-only`,children:m?.alpha??`Opacity`}),(0,r.jsx)(`input`,{type:`range`,min:`0`,max:`100`,value:s(y),disabled:f,"aria-label":m?.alpha??`Opacity`,className:`w-full accent-foreground disabled:cursor-not-allowed`,onChange:e=>S(c(y,Number(e.target.value),!0))}),(0,r.jsxs)(`span`,{className:`w-10 text-right tabular-nums`,children:[s(y),`%`]})]}):null,u.length>0?(0,r.jsx)(`div`,{role:`list`,"aria-label":`Color swatches`,className:`flex flex-wrap gap-2`,children:u.map(e=>{let t=c(e,s(y),d),n=o(t)===o(y);return(0,r.jsx)(`button`,{type:`button`,role:`listitem`,"aria-label":`Use ${e}`,"aria-pressed":n,disabled:f,className:`size-7 rounded-md border border-black/10 shadow-sm outline-none ring-offset-2 focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50`,style:{backgroundColor:o(t)},onClick:()=>S(t)},e)})}):null]})}exports.ColorPicker=l,exports.getAlphaPercent=s,exports.normalizeHexColor=a,exports.withAlpha=c;
+"use client";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=/^#?([0-9a-f]{6})([0-9a-f]{2})?$/i;function a(e,t=`#000000`){let n=e.trim().match(i);return n?`#${n[1].toLowerCase()}${n[2]?.toLowerCase()??``}`:t}function o(e){return a(e).slice(0,7)}function s(e){let t=a(e);return t.length===9?Math.round(Number.parseInt(t.slice(7,9),16)/255*100):100}function c(e,t,n){let r=o(e);return n?`${r}${Math.round(Math.min(100,Math.max(0,t))/100*255).toString(16).padStart(2,`0`)}`:r}function l(e){let t=o(e);return{background:`linear-gradient(90deg, ${t}00 0%, ${t}ff 100%)`}}function u({value:e,defaultValue:a=`#2563eb`,onValueChange:u,swatches:d=[`#0f172a`,`#2563eb`,`#059669`,`#d97706`,`#dc2626`,`#7c3aed`],showAlpha:f=!1,disabled:p=!1,label:m,labels:h,className:g,..._}){let[v,y]=n.useState(()=>c(a,s(a),f)),b=c(e??v,s(e??v),f),[x,S]=n.useState(b);n.useEffect(()=>S(b),[b]);let C=t=>{let n=c(t,s(t),f);e===void 0&&y(n),u?.(n)},w=()=>{if(!i.test(x.trim())){S(b);return}C(x)};return(0,r.jsxs)(`div`,{"data-slot":`color-picker`,className:t.cn(`grid gap-3`,g),..._,children:[m?(0,r.jsx)(`div`,{className:`text-sm font-medium text-foreground`,children:m}):null,(0,r.jsxs)(`div`,{className:`flex min-w-0 items-center gap-2`,children:[(0,r.jsxs)(`label`,{className:`relative size-10 shrink-0 overflow-hidden rounded-md border bg-background shadow-sm focus-within:ring-2 focus-within:ring-ring`,children:[(0,r.jsx)(`span`,{"aria-hidden":`true`,className:`absolute inset-0 bg-[linear-gradient(45deg,#e2e8f0_25%,transparent_25%),linear-gradient(-45deg,#e2e8f0_25%,transparent_25%),linear-gradient(45deg,transparent_75%,#e2e8f0_75%),linear-gradient(-45deg,transparent_75%,#e2e8f0_75%)] bg-[length:10px_10px] bg-[position:0_0,0_5px,5px_-5px,-5px_0]`}),(0,r.jsx)(`span`,{"aria-hidden":`true`,className:`absolute inset-0`,style:{backgroundColor:b}}),(0,r.jsx)(`span`,{className:`sr-only`,children:h?.color??`Choose color`}),(0,r.jsx)(`input`,{type:`color`,"aria-label":h?.color??`Choose color`,value:o(b),disabled:p,className:`absolute -inset-2 size-14 cursor-pointer border-0 bg-transparent p-0 disabled:cursor-not-allowed`,onChange:e=>C(c(e.target.value,s(b),f))})]}),(0,r.jsx)(`input`,{"aria-label":h?.hex??`Hex color`,value:x,disabled:p,spellCheck:!1,className:`h-10 min-w-0 flex-1 rounded-md border bg-background px-3 font-mono text-sm uppercase outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50`,onChange:e=>S(e.target.value),onBlur:w,onKeyDown:e=>{e.key===`Enter`&&(e.preventDefault(),w()),e.key===`Escape`&&S(b)}})]}),f?(0,r.jsxs)(`label`,{className:`grid grid-cols-[1fr_auto] items-center gap-3 text-xs text-muted-foreground`,children:[(0,r.jsx)(`span`,{className:`sr-only`,children:h?.alpha??`Opacity`}),(0,r.jsx)(`input`,{type:`range`,min:`0`,max:`100`,value:s(b),disabled:p,"aria-label":h?.alpha??`Opacity`,style:l(b),className:`h-2 w-full cursor-pointer appearance-none rounded-full border border-border/70 outline-none focus-visible:ring-4 focus-visible:ring-ring/20 disabled:cursor-not-allowed [&::-webkit-slider-thumb]:size-4 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-2 [&::-webkit-slider-thumb]:border-background [&::-webkit-slider-thumb]:bg-foreground [&::-webkit-slider-thumb]:shadow-sm`,onChange:e=>C(c(b,Number(e.target.value),!0))}),(0,r.jsxs)(`span`,{className:`w-10 text-right tabular-nums`,children:[s(b),`%`]})]}):null,d.length>0?(0,r.jsx)(`div`,{role:`list`,"aria-label":`Color swatches`,className:`flex flex-wrap gap-2`,children:d.map(e=>{let t=c(e,s(b),f),n=o(t)===o(b);return(0,r.jsx)(`button`,{type:`button`,role:`listitem`,"aria-label":`Use ${e}`,"aria-pressed":n,disabled:p,className:`size-7 rounded-md border border-black/10 shadow-sm outline-none ring-offset-2 focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50`,style:{backgroundColor:o(t)},onClick:()=>C(t)},e)})}):null]})}exports.ColorPicker=u,exports.getAlphaPercent=s,exports.normalizeHexColor=a,exports.withAlpha=c;

package/dist/src/components/inputs/color-picker.js

@@ -19,101 +19,118 @@ function c(e, t, n) {
 	let r = o(e);
 	return n ? `${r}${Math.round(Math.min(100, Math.max(0, t)) / 100 * 255).toString(16).padStart(2, "0")}` : r;
 }
-function l({ value: a, defaultValue: l = "#2563eb", onValueChange: u, swatches: d = [
+function l(e) {
+	let t = o(e);
+	return { background: `linear-gradient(90deg, ${t}00 0%, ${t}ff 100%)` };
+}
+function u({ value: a, defaultValue: u = "#2563eb", onValueChange: d, swatches: f = [
 	"#0f172a",
 	"#2563eb",
 	"#059669",
 	"#d97706",
 	"#dc2626",
 	"#7c3aed"
-], showAlpha: f = !1, disabled: p = !1, label: m, labels: h, className: g, ..._ }) {
-	let [v, y] = t.useState(() => c(l, s(l), f)), b = c(a ?? v, s(a ?? v), f), [x, S] = t.useState(b);
-	t.useEffect(() => S(b), [b]);
-	let C = (e) => {
-		let t = c(e, s(e), f);
-		a === void 0 && y(t), u?.(t);
-	}, w = () => {
-		if (!i.test(x.trim())) {
-			S(b);
+], showAlpha: p = !1, disabled: m = !1, label: h, labels: g, className: _, ...v }) {
+	let [y, b] = t.useState(() => c(u, s(u), p)), x = c(a ?? y, s(a ?? y), p), [S, C] = t.useState(x);
+	t.useEffect(() => C(x), [x]);
+	let w = (e) => {
+		let t = c(e, s(e), p);
+		a === void 0 && b(t), d?.(t);
+	}, T = () => {
+		if (!i.test(S.trim())) {
+			C(x);
 			return;
 		}
-		C(x);
+		w(S);
 	};
 	return /* @__PURE__ */ r("div", {
 		"data-slot": "color-picker",
-		className: e("grid gap-3", g),
-		..._,
+		className: e("grid gap-3", _),
+		...v,
 		children: [
-			m ? /* @__PURE__ */ n("div", {
+			h ? /* @__PURE__ */ n("div", {
 				className: "text-sm font-medium text-foreground",
-				children: m
+				children: h
 			}) : null,
 			/* @__PURE__ */ r("div", {
 				className: "flex min-w-0 items-center gap-2",
 				children: [/* @__PURE__ */ r("label", {
 					className: "relative size-10 shrink-0 overflow-hidden rounded-md border bg-background shadow-sm focus-within:ring-2 focus-within:ring-ring",
-					children: [/* @__PURE__ */ n("span", {
-						className: "sr-only",
-						children: h?.color ?? "Choose color"
-					}), /* @__PURE__ */ n("input", {
-						type: "color",
-						"aria-label": h?.color ?? "Choose color",
-						value: o(b),
-						disabled: p,
-						className: "absolute -inset-2 size-14 cursor-pointer border-0 bg-transparent p-0 disabled:cursor-not-allowed",
-						onChange: (e) => C(c(e.target.value, s(b), f))
-					})]
+					children: [
+						/* @__PURE__ */ n("span", {
+							"aria-hidden": "true",
+							className: "absolute inset-0 bg-[linear-gradient(45deg,#e2e8f0_25%,transparent_25%),linear-gradient(-45deg,#e2e8f0_25%,transparent_25%),linear-gradient(45deg,transparent_75%,#e2e8f0_75%),linear-gradient(-45deg,transparent_75%,#e2e8f0_75%)] bg-[length:10px_10px] bg-[position:0_0,0_5px,5px_-5px,-5px_0]"
+						}),
+						/* @__PURE__ */ n("span", {
+							"aria-hidden": "true",
+							className: "absolute inset-0",
+							style: { backgroundColor: x }
+						}),
+						/* @__PURE__ */ n("span", {
+							className: "sr-only",
+							children: g?.color ?? "Choose color"
+						}),
+						/* @__PURE__ */ n("input", {
+							type: "color",
+							"aria-label": g?.color ?? "Choose color",
+							value: o(x),
+							disabled: m,
+							className: "absolute -inset-2 size-14 cursor-pointer border-0 bg-transparent p-0 disabled:cursor-not-allowed",
+							onChange: (e) => w(c(e.target.value, s(x), p))
+						})
+					]
 				}), /* @__PURE__ */ n("input", {
-					"aria-label": h?.hex ?? "Hex color",
-					value: x,
-					disabled: p,
+					"aria-label": g?.hex ?? "Hex color",
+					value: S,
+					disabled: m,
 					spellCheck: !1,
 					className: "h-10 min-w-0 flex-1 rounded-md border bg-background px-3 font-mono text-sm uppercase outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
-					onChange: (e) => S(e.target.value),
-					onBlur: w,
+					onChange: (e) => C(e.target.value),
+					onBlur: T,
 					onKeyDown: (e) => {
-						e.key === "Enter" && (e.preventDefault(), w()), e.key === "Escape" && S(b);
+						e.key === "Enter" && (e.preventDefault(), T()), e.key === "Escape" && C(x);
 					}
 				})]
 			}),
-			f ? /* @__PURE__ */ r("label", {
+			p ? /* @__PURE__ */ r("label", {
 				className: "grid grid-cols-[1fr_auto] items-center gap-3 text-xs text-muted-foreground",
 				children: [
 					/* @__PURE__ */ n("span", {
 						className: "sr-only",
-						children: h?.alpha ?? "Opacity"
+						children: g?.alpha ?? "Opacity"
 					}),
 					/* @__PURE__ */ n("input", {
 						type: "range",
 						min: "0",
 						max: "100",
-						value: s(b),
-						disabled: p,
-						"aria-label": h?.alpha ?? "Opacity",
-						className: "w-full accent-foreground disabled:cursor-not-allowed",
-						onChange: (e) => C(c(b, Number(e.target.value), !0))
+						value: s(x),
+						disabled: m,
+						"aria-label": g?.alpha ?? "Opacity",
+						style: l(x),
+						className: "h-2 w-full cursor-pointer appearance-none rounded-full border border-border/70 outline-none focus-visible:ring-4 focus-visible:ring-ring/20 disabled:cursor-not-allowed [&::-webkit-slider-thumb]:size-4 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-2 [&::-webkit-slider-thumb]:border-background [&::-webkit-slider-thumb]:bg-foreground [&::-webkit-slider-thumb]:shadow-sm",
+						onChange: (e) => w(c(x, Number(e.target.value), !0))
 					}),
 					/* @__PURE__ */ r("span", {
 						className: "w-10 text-right tabular-nums",
-						children: [s(b), "%"]
+						children: [s(x), "%"]
 					})
 				]
 			}) : null,
-			d.length > 0 ? /* @__PURE__ */ n("div", {
+			f.length > 0 ? /* @__PURE__ */ n("div", {
 				role: "list",
 				"aria-label": "Color swatches",
 				className: "flex flex-wrap gap-2",
-				children: d.map((e) => {
-					let t = c(e, s(b), f), r = o(t) === o(b);
+				children: f.map((e) => {
+					let t = c(e, s(x), p), r = o(t) === o(x);
 					return /* @__PURE__ */ n("button", {
 						type: "button",
 						role: "listitem",
 						"aria-label": `Use ${e}`,
 						"aria-pressed": r,
-						disabled: p,
+						disabled: m,
 						className: "size-7 rounded-md border border-black/10 shadow-sm outline-none ring-offset-2 focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
 						style: { backgroundColor: o(t) },
-						onClick: () => C(t)
+						onClick: () => w(t)
 					}, e);
 				})
 			}) : null
@@ -121,4 +138,4 @@ function l({ value: a, defaultValue: l = "#2563eb", onValueChange: u, swatches:
 	});
 }
 //#endregion
-export { l as ColorPicker, s as getAlphaPercent, a as normalizeHexColor, c as withAlpha };
+export { u as ColorPicker, s as getAlphaPercent, a as normalizeHexColor, c as withAlpha };

package/dist/src/components/inputs/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./async-select.cjs"),t=require("./color-picker.cjs"),n=require("./combobox.cjs"),r=require("./otp-input.cjs"),i=require("./rating.cjs"),a=require("./json-input.cjs"),o=require("./time-picker.cjs"),s=require("./slider.cjs"),c=require("./tag-input.cjs"),l=require("./inline-editable.cjs"),u=require("./signature-pad.cjs");exports.AsyncMultiSelect=e.AsyncMultiSelect,exports.AsyncSelect=e.AsyncSelect,exports.ColorPicker=t.ColorPicker,exports.Combobox=n.Combobox,exports.DateTimePicker=o.DateTimePicker,exports.InlineEditable=l.InlineEditable,exports.JsonInput=a.JsonInput,exports.OtpInput=r.OtpInput,exports.RangeSlider=s.RangeSlider,exports.Rating=i.Rating,exports.SignaturePad=u.SignaturePad,exports.Slider=s.Slider,exports.TagInput=c.TagInput,exports.TimePicker=o.TimePicker,exports.TimeRangePicker=o.TimeRangePicker,exports.drawSignature=u.drawSignature,exports.getAlphaPercent=t.getAlphaPercent,exports.normalizeHexColor=t.normalizeHexColor,exports.withAlpha=t.withAlpha;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./time-picker.cjs"),t=require("./async-select.cjs"),n=require("./color-picker.cjs"),r=require("./combobox.cjs"),i=require("./multi-select.cjs"),a=require("./otp-input.cjs"),o=require("./rating.cjs"),s=require("./json-input.cjs"),c=require("./slider.cjs"),l=require("./tag-input.cjs"),u=require("./inline-editable.cjs"),d=require("./signature-pad.cjs");exports.AsyncMultiSelect=t.AsyncMultiSelect,exports.AsyncSelect=t.AsyncSelect,exports.ColorPicker=n.ColorPicker,exports.Combobox=r.Combobox,exports.DateTimePicker=e.DateTimePicker,exports.InlineEditable=u.InlineEditable,exports.JsonInput=s.JsonInput,exports.MultiSelect=i.MultiSelect,exports.OtpInput=a.OtpInput,exports.RangeSlider=c.RangeSlider,exports.Rating=o.Rating,exports.SignaturePad=d.SignaturePad,exports.Slider=c.Slider,exports.TagInput=l.TagInput,exports.TimePicker=e.TimePicker,exports.TimeRangePicker=e.TimeRangePicker,exports.drawSignature=d.drawSignature,exports.getAlphaPercent=n.getAlphaPercent,exports.normalizeHexColor=n.normalizeHexColor,exports.withAlpha=n.withAlpha;

package/dist/src/components/inputs/index.js

@@ -1,12 +1,13 @@
-import { AsyncMultiSelect as e, AsyncSelect as t } from "./async-select.js";
-import { ColorPicker as n, getAlphaPercent as r, normalizeHexColor as i, withAlpha as a } from "./color-picker.js";
-import { Combobox as o } from "./combobox.js";
-import { OtpInput as s } from "./otp-input.js";
-import { Rating as c } from "./rating.js";
-import { JsonInput as l } from "./json-input.js";
-import { DateTimePicker as u, TimePicker as d, TimeRangePicker as f } from "./time-picker.js";
-import { RangeSlider as p, Slider as m } from "./slider.js";
-import { TagInput as h } from "./tag-input.js";
-import { InlineEditable as g } from "./inline-editable.js";
-import { SignaturePad as _, drawSignature as v } from "./signature-pad.js";
-export { e as AsyncMultiSelect, t as AsyncSelect, n as ColorPicker, o as Combobox, u as DateTimePicker, g as InlineEditable, l as JsonInput, s as OtpInput, p as RangeSlider, c as Rating, _ as SignaturePad, m as Slider, h as TagInput, d as TimePicker, f as TimeRangePicker, v as drawSignature, r as getAlphaPercent, i as normalizeHexColor, a as withAlpha };
+import { DateTimePicker as e, TimePicker as t, TimeRangePicker as n } from "./time-picker.js";
+import { AsyncMultiSelect as r, AsyncSelect as i } from "./async-select.js";
+import { ColorPicker as a, getAlphaPercent as o, normalizeHexColor as s, withAlpha as c } from "./color-picker.js";
+import { Combobox as l } from "./combobox.js";
+import { MultiSelect as u } from "./multi-select.js";
+import { OtpInput as d } from "./otp-input.js";
+import { Rating as f } from "./rating.js";
+import { JsonInput as p } from "./json-input.js";
+import { RangeSlider as m, Slider as h } from "./slider.js";
+import { TagInput as g } from "./tag-input.js";
+import { InlineEditable as _ } from "./inline-editable.js";
+import { SignaturePad as v, drawSignature as y } from "./signature-pad.js";
+export { r as AsyncMultiSelect, i as AsyncSelect, a as ColorPicker, l as Combobox, e as DateTimePicker, _ as InlineEditable, p as JsonInput, u as MultiSelect, d as OtpInput, m as RangeSlider, f as Rating, v as SignaturePad, h as Slider, g as TagInput, t as TimePicker, n as TimeRangePicker, y as drawSignature, o as getAlphaPercent, s as normalizeHexColor, c as withAlpha };

package/dist/src/components/inputs/multi-select.cjs

@@ -0,0 +1 @@
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/button/index.cjs"),r=require("../ui/badge/index.cjs"),i=require("../ui/popover/index.cjs");let a=require("react");a=e.__toESM(a,1);let o=require("lucide-react"),s=require("react/jsx-runtime");function c({options:e,value:c=[],onValueChange:l,placeholder:u=`Select options`,maxVisibleTags:d=3,className:f,...p}){let[m,h]=a.useState(!1),g=e.filter(e=>c.includes(e.value)),_=Math.max(0,g.length-d),v=e=>{l?.(c.includes(e)?c.filter(t=>t!==e):[...c,e])};return(0,s.jsx)(`div`,{"data-slot":`multi-select`,className:t.cn(`w-full`,f),...p,children:(0,s.jsxs)(i.Popover,{open:m,onOpenChange:h,children:[(0,s.jsxs)(i.PopoverTrigger,{render:(0,s.jsx)(n.Button,{type:`button`,variant:`outline`,className:`min-h-10 w-full justify-between`}),children:[(0,s.jsxs)(`span`,{className:`flex min-w-0 flex-1 flex-wrap gap-1`,children:[g.length?g.slice(0,d).map(e=>(0,s.jsx)(r.Badge,{label:e.label,variant:`secondary`},e.value)):(0,s.jsx)(`span`,{className:`text-muted-foreground`,children:u}),_?(0,s.jsx)(r.Badge,{label:`+${_}`,variant:`secondary`}):null]}),(0,s.jsx)(o.ChevronDownIcon,{className:`size-4 opacity-70`})]}),(0,s.jsx)(i.PopoverContent,{align:`start`,className:`w-[var(--anchor-width)] p-1`,children:(0,s.jsxs)(`div`,{className:`grid gap-1`,children:[e.map(e=>{let t=c.includes(e.value);return(0,s.jsxs)(`button`,{type:`button`,disabled:e.disabled,className:`flex items-start gap-2 rounded-md px-2 py-2 text-left text-sm hover:bg-muted disabled:pointer-events-none disabled:opacity-50`,onClick:()=>v(e.value),children:[(0,s.jsx)(`span`,{className:`mt-0.5 grid size-4 place-items-center rounded border`,children:t?(0,s.jsx)(o.CheckIcon,{className:`size-3`}):null}),(0,s.jsxs)(`span`,{className:`grid min-w-0 flex-1`,children:[(0,s.jsx)(`span`,{className:`truncate font-medium`,children:e.label}),e.description?(0,s.jsx)(`span`,{className:`truncate text-xs text-muted-foreground`,children:e.description}):null]})]},e.value)}),c.length?(0,s.jsx)(n.Button,{type:`button`,size:`sm`,variant:`ghost`,leftIcon:(0,s.jsx)(o.XIcon,{className:`size-3.5`}),onClick:()=>l?.([]),children:`Clear`}):null]})})]})})}exports.MultiSelect=c;

package/dist/src/components/inputs/multi-select.js

@@ -0,0 +1,80 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { Button as t } from "../ui/button/index.js";
+import { Badge as n } from "../ui/badge/index.js";
+import { Popover as r, PopoverContent as i, PopoverTrigger as a } from "../ui/popover/index.js";
+import * as o from "react";
+import { CheckIcon as s, ChevronDownIcon as c, XIcon as l } from "lucide-react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/components/inputs/multi-select.tsx
+function f({ options: f, value: p = [], onValueChange: m, placeholder: h = "Select options", maxVisibleTags: g = 3, className: _, ...v }) {
+	let [y, b] = o.useState(!1), x = f.filter((e) => p.includes(e.value)), S = Math.max(0, x.length - g), C = (e) => {
+		m?.(p.includes(e) ? p.filter((t) => t !== e) : [...p, e]);
+	};
+	return /* @__PURE__ */ u("div", {
+		"data-slot": "multi-select",
+		className: e("w-full", _),
+		...v,
+		children: /* @__PURE__ */ d(r, {
+			open: y,
+			onOpenChange: b,
+			children: [/* @__PURE__ */ d(a, {
+				render: /* @__PURE__ */ u(t, {
+					type: "button",
+					variant: "outline",
+					className: "min-h-10 w-full justify-between"
+				}),
+				children: [/* @__PURE__ */ d("span", {
+					className: "flex min-w-0 flex-1 flex-wrap gap-1",
+					children: [x.length ? x.slice(0, g).map((e) => /* @__PURE__ */ u(n, {
+						label: e.label,
+						variant: "secondary"
+					}, e.value)) : /* @__PURE__ */ u("span", {
+						className: "text-muted-foreground",
+						children: h
+					}), S ? /* @__PURE__ */ u(n, {
+						label: `+${S}`,
+						variant: "secondary"
+					}) : null]
+				}), /* @__PURE__ */ u(c, { className: "size-4 opacity-70" })]
+			}), /* @__PURE__ */ u(i, {
+				align: "start",
+				className: "w-[var(--anchor-width)] p-1",
+				children: /* @__PURE__ */ d("div", {
+					className: "grid gap-1",
+					children: [f.map((e) => {
+						let t = p.includes(e.value);
+						return /* @__PURE__ */ d("button", {
+							type: "button",
+							disabled: e.disabled,
+							className: "flex items-start gap-2 rounded-md px-2 py-2 text-left text-sm hover:bg-muted disabled:pointer-events-none disabled:opacity-50",
+							onClick: () => C(e.value),
+							children: [/* @__PURE__ */ u("span", {
+								className: "mt-0.5 grid size-4 place-items-center rounded border",
+								children: t ? /* @__PURE__ */ u(s, { className: "size-3" }) : null
+							}), /* @__PURE__ */ d("span", {
+								className: "grid min-w-0 flex-1",
+								children: [/* @__PURE__ */ u("span", {
+									className: "truncate font-medium",
+									children: e.label
+								}), e.description ? /* @__PURE__ */ u("span", {
+									className: "truncate text-xs text-muted-foreground",
+									children: e.description
+								}) : null]
+							})]
+						}, e.value);
+					}), p.length ? /* @__PURE__ */ u(t, {
+						type: "button",
+						size: "sm",
+						variant: "ghost",
+						leftIcon: /* @__PURE__ */ u(l, { className: "size-3.5" }),
+						onClick: () => m?.([]),
+						children: "Clear"
+					}) : null]
+				})
+			})]
+		})
+	});
+}
+//#endregion
+export { f as MultiSelect };

package/dist/src/components/inputs/public.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./async-select.cjs"),t=require("./color-picker.cjs"),n=require("./combobox.cjs"),r=require("./otp-input.cjs"),i=require("./rating.cjs"),a=require("./json-input.cjs"),o=require("./time-picker.cjs"),s=require("./slider.cjs"),c=require("./tag-input.cjs"),l=require("./inline-editable.cjs"),u=require("./signature-pad.cjs");exports.AsyncMultiSelect=e.AsyncMultiSelect,exports.AsyncSelect=e.AsyncSelect,exports.ColorPicker=t.ColorPicker,exports.Combobox=n.Combobox,exports.DateTimePicker=o.DateTimePicker,exports.InlineEditable=l.InlineEditable,exports.JsonInput=a.JsonInput,exports.OtpInput=r.OtpInput,exports.RangeSlider=s.RangeSlider,exports.Rating=i.Rating,exports.SignaturePad=u.SignaturePad,exports.Slider=s.Slider,exports.TagInput=c.TagInput,exports.TimePicker=o.TimePicker,exports.TimeRangePicker=o.TimeRangePicker,exports.drawSignature=u.drawSignature,exports.getAlphaPercent=t.getAlphaPercent,exports.normalizeHexColor=t.normalizeHexColor,exports.withAlpha=t.withAlpha;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./time-picker.cjs"),t=require("./async-select.cjs"),n=require("./color-picker.cjs"),r=require("./combobox.cjs"),i=require("./multi-select.cjs"),a=require("./otp-input.cjs"),o=require("./rating.cjs"),s=require("./json-input.cjs"),c=require("./slider.cjs"),l=require("./tag-input.cjs"),u=require("./inline-editable.cjs"),d=require("./signature-pad.cjs");exports.AsyncMultiSelect=t.AsyncMultiSelect,exports.AsyncSelect=t.AsyncSelect,exports.ColorPicker=n.ColorPicker,exports.Combobox=r.Combobox,exports.DateTimePicker=e.DateTimePicker,exports.InlineEditable=u.InlineEditable,exports.JsonInput=s.JsonInput,exports.MultiSelect=i.MultiSelect,exports.OtpInput=a.OtpInput,exports.RangeSlider=c.RangeSlider,exports.Rating=o.Rating,exports.SignaturePad=d.SignaturePad,exports.Slider=c.Slider,exports.TagInput=l.TagInput,exports.TimePicker=e.TimePicker,exports.TimeRangePicker=e.TimeRangePicker,exports.drawSignature=d.drawSignature,exports.getAlphaPercent=n.getAlphaPercent,exports.normalizeHexColor=n.normalizeHexColor,exports.withAlpha=n.withAlpha;

package/dist/src/components/inputs/public.js

@@ -1,12 +1,13 @@
-import { AsyncMultiSelect as e, AsyncSelect as t } from "./async-select.js";
-import { ColorPicker as n, getAlphaPercent as r, normalizeHexColor as i, withAlpha as a } from "./color-picker.js";
-import { Combobox as o } from "./combobox.js";
-import { OtpInput as s } from "./otp-input.js";
-import { Rating as c } from "./rating.js";
-import { JsonInput as l } from "./json-input.js";
-import { DateTimePicker as u, TimePicker as d, TimeRangePicker as f } from "./time-picker.js";
-import { RangeSlider as p, Slider as m } from "./slider.js";
-import { TagInput as h } from "./tag-input.js";
-import { InlineEditable as g } from "./inline-editable.js";
-import { SignaturePad as _, drawSignature as v } from "./signature-pad.js";
-export { e as AsyncMultiSelect, t as AsyncSelect, n as ColorPicker, o as Combobox, u as DateTimePicker, g as InlineEditable, l as JsonInput, s as OtpInput, p as RangeSlider, c as Rating, _ as SignaturePad, m as Slider, h as TagInput, d as TimePicker, f as TimeRangePicker, v as drawSignature, r as getAlphaPercent, i as normalizeHexColor, a as withAlpha };
+import { DateTimePicker as e, TimePicker as t, TimeRangePicker as n } from "./time-picker.js";
+import { AsyncMultiSelect as r, AsyncSelect as i } from "./async-select.js";
+import { ColorPicker as a, getAlphaPercent as o, normalizeHexColor as s, withAlpha as c } from "./color-picker.js";
+import { Combobox as l } from "./combobox.js";
+import { MultiSelect as u } from "./multi-select.js";
+import { OtpInput as d } from "./otp-input.js";
+import { Rating as f } from "./rating.js";
+import { JsonInput as p } from "./json-input.js";
+import { RangeSlider as m, Slider as h } from "./slider.js";
+import { TagInput as g } from "./tag-input.js";
+import { InlineEditable as _ } from "./inline-editable.js";
+import { SignaturePad as v, drawSignature as y } from "./signature-pad.js";
+export { r as AsyncMultiSelect, i as AsyncSelect, a as ColorPicker, l as Combobox, e as DateTimePicker, _ as InlineEditable, p as JsonInput, u as MultiSelect, d as OtpInput, m as RangeSlider, f as Rating, v as SignaturePad, h as Slider, g as TagInput, t as TimePicker, n as TimeRangePicker, y as drawSignature, o as getAlphaPercent, s as normalizeHexColor, c as withAlpha };

package/dist/src/components/inputs/slider.cjs

@@ -1 +1 @@
-"use client";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,t,n){return Math.min(Math.max(e,t),n)}function a(e,t,n){return n<=t?0:(e-t)/(n-t)*100}function o(e,t,n){let r=a(i(e,t,n),t,n);return{background:`linear-gradient(90deg, var(--aui-brand-strong) 0%, var(--aui-brand-strong) ${r}%, var(--aui-control-bg) ${r}%, var(--aui-control-bg) 100%)`}}function s({value:e,defaultValue:i=0,onValueChange:a,min:s=0,max:c=100,step:l=1,label:u,description:d,showValue:f=!1,formatValue:p,className:m,disabled:h,...g}){let[_,v]=n.useState(i),y=e??_,b=p?.(y)??y,x=t=>{e===void 0&&v(t),a?.(t)};return(0,r.jsxs)(`div`,{"data-slot":`slider`,className:t.cn(`grid gap-3`,m),children:[(u||d||f)&&(0,r.jsxs)(`div`,{className:`flex items-start justify-between gap-3`,children:[(0,r.jsxs)(`div`,{className:`grid gap-1`,children:[u&&(0,r.jsx)(`label`,{className:`text-sm font-semibold tracking-tight text-foreground`,children:u}),d&&(0,r.jsx)(`div`,{className:`text-xs leading-5 text-muted-foreground`,children:d})]}),f&&(0,r.jsx)(`div`,{className:`inline-flex min-h-8 items-center rounded-full border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-control-bg)] px-3 text-sm font-semibold text-foreground shadow-sm`,children:b})]}),(0,r.jsx)(`input`,{"data-slot":`slider-input`,type:`range`,value:y,min:s,max:c,step:l,disabled:h,style:o(y,s,c),className:`h-3 w-full cursor-pointer appearance-none rounded-full border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-control-bg)] shadow-[inset_0_1px_2px_rgba(15,23,42,0.08)] outline-none transition hover:brightness-[1.02] disabled:cursor-not-allowed disabled:opacity-50 [&::-moz-range-thumb]:size-5 [&::-moz-range-thumb]:rounded-full [&::-moz-range-thumb]:border-[3px] [&::-moz-range-thumb]:border-[color:var(--aui-page-bg)] [&::-moz-range-thumb]:bg-[color:var(--aui-brand-strong)] [&::-moz-range-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-moz-range-thumb]:transition [&::-moz-range-track]:h-3 [&::-moz-range-track]:rounded-full [&::-webkit-slider-runnable-track]:h-3 [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-thumb]:mt-[-5px] [&::-webkit-slider-thumb]:size-5 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-[3px] [&::-webkit-slider-thumb]:border-[color:var(--aui-page-bg)] [&::-webkit-slider-thumb]:bg-[color:var(--aui-brand-strong)] [&::-webkit-slider-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)]`,onChange:e=>x(e.currentTarget.valueAsNumber),...g})]})}function c(e,t,n){let r=a(i(e[0],t,n),t,n),o=a(i(e[1],t,n),t,n);return{left:`${r}%`,width:`${Math.max(o-r,0)}%`}}function l({value:e,defaultValue:i=[0,100],onValueChange:a,min:o=0,max:s=100,step:l=1,label:u,description:d,showValue:f=!1,formatValue:p,className:m,disabled:h,...g}){let[_,v]=n.useState(i),y=e??_,b=p?.(y)??`${y[0]} - ${y[1]}`,x=(t,n)=>{let r=t===0?[Math.min(n,y[1]),y[1]]:[y[0],Math.max(n,y[0])];e===void 0&&v(r),a?.(r)};return(0,r.jsxs)(`div`,{"data-slot":`range-slider`,className:t.cn(`grid gap-3`,m),children:[(u||d||f)&&(0,r.jsxs)(`div`,{className:`flex items-start justify-between gap-3`,children:[(0,r.jsxs)(`div`,{className:`grid gap-1`,children:[u&&(0,r.jsx)(`label`,{className:`text-sm font-semibold tracking-tight text-foreground`,children:u}),d&&(0,r.jsx)(`div`,{className:`text-xs leading-5 text-muted-foreground`,children:d})]}),f&&(0,r.jsx)(`div`,{className:`inline-flex min-h-8 items-center rounded-full border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-control-bg)] px-3 text-sm font-semibold text-foreground shadow-sm`,children:b})]}),(0,r.jsxs)(`div`,{className:`grid gap-3 rounded-2xl border border-[color:var(--aui-surface-border)] bg-[color:color-mix(in_srgb,var(--aui-control-bg)_82%,white_18%)] px-4 py-4 shadow-[inset_0_1px_0_rgba(255,255,255,0.3)] dark:bg-[color:color-mix(in_srgb,var(--aui-control-bg)_90%,black_10%)]`,children:[(0,r.jsxs)(`div`,{className:`relative h-6`,children:[(0,r.jsx)(`div`,{className:`absolute top-1/2 h-3 w-full -translate-y-1/2 rounded-full border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-control-bg)] shadow-[inset_0_1px_2px_rgba(15,23,42,0.08)]`}),(0,r.jsx)(`div`,{className:`absolute top-1/2 h-3 -translate-y-1/2 rounded-full bg-[color:var(--aui-brand-strong)] shadow-[0_8px_24px_rgba(16,185,129,0.18)]`,style:c(y,o,s)})]}),(0,r.jsxs)(`div`,{className:`relative -mt-8 h-6`,children:[(0,r.jsx)(`input`,{type:`range`,value:y[0],min:o,max:s,step:l,disabled:h,className:`pointer-events-none absolute inset-0 h-6 w-full cursor-pointer appearance-none bg-transparent outline-none disabled:cursor-not-allowed disabled:opacity-50 [&::-moz-range-thumb]:pointer-events-auto [&::-moz-range-thumb]:size-5 [&::-moz-range-thumb]:rounded-full [&::-moz-range-thumb]:border-[3px] [&::-moz-range-thumb]:border-[color:var(--aui-page-bg)] [&::-moz-range-thumb]:bg-[color:var(--aui-brand-strong)] [&::-moz-range-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-moz-range-track]:h-3 [&::-moz-range-track]:rounded-full [&::-moz-range-track]:bg-transparent [&::-webkit-slider-runnable-track]:h-3 [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:bg-transparent [&::-webkit-slider-thumb]:pointer-events-auto [&::-webkit-slider-thumb]:mt-[-5px] [&::-webkit-slider-thumb]:size-5 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-[3px] [&::-webkit-slider-thumb]:border-[color:var(--aui-page-bg)] [&::-webkit-slider-thumb]:bg-[color:var(--aui-brand-strong)] [&::-webkit-slider-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)]`,onChange:e=>x(0,e.currentTarget.valueAsNumber),...g}),(0,r.jsx)(`input`,{type:`range`,value:y[1],min:o,max:s,step:l,disabled:h,className:`pointer-events-none absolute inset-0 h-6 w-full cursor-pointer appearance-none bg-transparent outline-none disabled:cursor-not-allowed disabled:opacity-50 [&::-moz-range-thumb]:pointer-events-auto [&::-moz-range-thumb]:size-5 [&::-moz-range-thumb]:rounded-full [&::-moz-range-thumb]:border-[3px] [&::-moz-range-thumb]:border-[color:var(--aui-page-bg)] [&::-moz-range-thumb]:bg-[color:var(--aui-brand-strong)] [&::-moz-range-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-moz-range-track]:h-3 [&::-moz-range-track]:rounded-full [&::-moz-range-track]:bg-transparent [&::-webkit-slider-runnable-track]:h-3 [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:bg-transparent [&::-webkit-slider-thumb]:pointer-events-auto [&::-webkit-slider-thumb]:mt-[-5px] [&::-webkit-slider-thumb]:size-5 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-[3px] [&::-webkit-slider-thumb]:border-[color:var(--aui-page-bg)] [&::-webkit-slider-thumb]:bg-[color:var(--aui-brand-strong)] [&::-webkit-slider-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)]`,onChange:e=>x(1,e.currentTarget.valueAsNumber),...g})]})]})]})}exports.RangeSlider=l,exports.Slider=s;
+"use client";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,t,n){return Math.min(Math.max(e,t),n)}function a(e,t,n){return n<=t?0:(e-t)/(n-t)*100}function o(e,t,n){let r=a(i(e,t,n),t,n);return{background:`linear-gradient(90deg, var(--aui-brand-strong) 0%, var(--aui-brand-strong) ${r}%, var(--aui-control-bg) ${r}%, var(--aui-control-bg) 100%)`}}function s({value:e,defaultValue:i=0,onValueChange:a,min:s=0,max:c=100,step:l=1,label:u,description:d,showValue:f=!1,formatValue:p,className:m,disabled:h,...g}){let[_,v]=n.useState(i),y=e??_,b=p?.(y)??y,x=t=>{e===void 0&&v(t),a?.(t)};return(0,r.jsxs)(`div`,{"data-slot":`slider`,className:t.cn(`grid gap-3`,m),children:[(u||d||f)&&(0,r.jsxs)(`div`,{className:`flex items-start justify-between gap-3`,children:[(0,r.jsxs)(`div`,{className:`grid gap-1`,children:[u&&(0,r.jsx)(`label`,{className:`text-sm font-semibold tracking-tight text-foreground`,children:u}),d&&(0,r.jsx)(`div`,{className:`text-xs leading-5 text-muted-foreground`,children:d})]}),f&&(0,r.jsx)(`div`,{className:`inline-flex min-h-8 items-center rounded-full border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-control-bg)] px-3 text-sm font-semibold text-foreground shadow-sm`,children:b})]}),(0,r.jsx)(`input`,{"data-slot":`slider-input`,type:`range`,value:y,min:s,max:c,step:l,disabled:h,style:o(y,s,c),className:`h-3 w-full cursor-pointer appearance-none rounded-full border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-control-bg)] shadow-[inset_0_1px_2px_rgba(15,23,42,0.08)] outline-none transition hover:brightness-[1.02] focus-visible:ring-4 focus-visible:ring-[color:color-mix(in_oklch,var(--aui-brand-strong),transparent_78%)] disabled:cursor-not-allowed disabled:opacity-50 [&::-moz-range-thumb]:size-5 [&::-moz-range-thumb]:rounded-full [&::-moz-range-thumb]:border-[3px] [&::-moz-range-thumb]:border-[color:var(--aui-page-bg)] [&::-moz-range-thumb]:bg-[color:var(--aui-brand-strong)] [&::-moz-range-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-moz-range-thumb]:transition [&::-moz-range-track]:h-3 [&::-moz-range-track]:rounded-full [&::-webkit-slider-runnable-track]:h-3 [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-thumb]:mt-[-5px] [&::-webkit-slider-thumb]:size-5 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-[3px] [&::-webkit-slider-thumb]:border-[color:var(--aui-page-bg)] [&::-webkit-slider-thumb]:bg-[color:var(--aui-brand-strong)] [&::-webkit-slider-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-webkit-slider-thumb]:transition-transform hover:[&::-webkit-slider-thumb]:scale-105`,onChange:e=>x(e.currentTarget.valueAsNumber),...g})]})}function c(e,t,n){let r=a(i(e[0],t,n),t,n),o=a(i(e[1],t,n),t,n);return{left:`${r}%`,width:`${Math.max(o-r,0)}%`}}function l({value:e,defaultValue:i=[0,100],onValueChange:a,min:o=0,max:s=100,step:l=1,label:u,description:d,showValue:f=!1,formatValue:p,className:m,disabled:h,...g}){let[_,v]=n.useState(i),y=e??_,b=p?.(y)??`${y[0]} - ${y[1]}`,x=(t,n)=>{let r=t===0?[Math.min(n,y[1]),y[1]]:[y[0],Math.max(n,y[0])];e===void 0&&v(r),a?.(r)};return(0,r.jsxs)(`div`,{"data-slot":`range-slider`,className:t.cn(`grid gap-3`,m),children:[(u||d||f)&&(0,r.jsxs)(`div`,{className:`flex items-start justify-between gap-3`,children:[(0,r.jsxs)(`div`,{className:`grid gap-1`,children:[u&&(0,r.jsx)(`label`,{className:`text-sm font-semibold tracking-tight text-foreground`,children:u}),d&&(0,r.jsx)(`div`,{className:`text-xs leading-5 text-muted-foreground`,children:d})]}),f&&(0,r.jsx)(`div`,{className:`inline-flex min-h-8 items-center rounded-full border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-control-bg)] px-3 text-sm font-semibold text-foreground shadow-sm`,children:b})]}),(0,r.jsxs)(`div`,{className:`grid gap-3 rounded-2xl border border-[color:var(--aui-surface-border)] bg-[color:color-mix(in_srgb,var(--aui-control-bg)_82%,white_18%)] px-4 py-4 shadow-[inset_0_1px_0_rgba(255,255,255,0.3)] dark:bg-[color:color-mix(in_srgb,var(--aui-control-bg)_90%,black_10%)]`,children:[(0,r.jsxs)(`div`,{className:`relative h-6`,children:[(0,r.jsx)(`div`,{className:`absolute top-1/2 h-3 w-full -translate-y-1/2 rounded-full border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-control-bg)] shadow-[inset_0_1px_2px_rgba(15,23,42,0.08)]`}),(0,r.jsx)(`div`,{className:`absolute top-1/2 h-3 -translate-y-1/2 rounded-full bg-[color:var(--aui-brand-strong)] shadow-[0_8px_24px_rgba(16,185,129,0.18)]`,style:c(y,o,s)})]}),(0,r.jsxs)(`div`,{className:`relative -mt-8 h-6`,children:[(0,r.jsx)(`input`,{type:`range`,value:y[0],min:o,max:s,step:l,disabled:h,className:`pointer-events-none absolute inset-0 h-6 w-full cursor-pointer appearance-none bg-transparent outline-none focus-visible:ring-4 focus-visible:ring-[color:color-mix(in_oklch,var(--aui-brand-strong),transparent_78%)] disabled:cursor-not-allowed disabled:opacity-50 [&::-moz-range-thumb]:pointer-events-auto [&::-moz-range-thumb]:size-5 [&::-moz-range-thumb]:rounded-full [&::-moz-range-thumb]:border-[3px] [&::-moz-range-thumb]:border-[color:var(--aui-page-bg)] [&::-moz-range-thumb]:bg-[color:var(--aui-brand-strong)] [&::-moz-range-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-moz-range-track]:h-3 [&::-moz-range-track]:rounded-full [&::-moz-range-track]:bg-transparent [&::-webkit-slider-runnable-track]:h-3 [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:bg-transparent [&::-webkit-slider-thumb]:pointer-events-auto [&::-webkit-slider-thumb]:mt-[-5px] [&::-webkit-slider-thumb]:size-5 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-[3px] [&::-webkit-slider-thumb]:border-[color:var(--aui-page-bg)] [&::-webkit-slider-thumb]:bg-[color:var(--aui-brand-strong)] [&::-webkit-slider-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-webkit-slider-thumb]:transition-transform hover:[&::-webkit-slider-thumb]:scale-105`,onChange:e=>x(0,e.currentTarget.valueAsNumber),...g}),(0,r.jsx)(`input`,{type:`range`,value:y[1],min:o,max:s,step:l,disabled:h,className:`pointer-events-none absolute inset-0 h-6 w-full cursor-pointer appearance-none bg-transparent outline-none focus-visible:ring-4 focus-visible:ring-[color:color-mix(in_oklch,var(--aui-brand-strong),transparent_78%)] disabled:cursor-not-allowed disabled:opacity-50 [&::-moz-range-thumb]:pointer-events-auto [&::-moz-range-thumb]:size-5 [&::-moz-range-thumb]:rounded-full [&::-moz-range-thumb]:border-[3px] [&::-moz-range-thumb]:border-[color:var(--aui-page-bg)] [&::-moz-range-thumb]:bg-[color:var(--aui-brand-strong)] [&::-moz-range-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-moz-range-track]:h-3 [&::-moz-range-track]:rounded-full [&::-moz-range-track]:bg-transparent [&::-webkit-slider-runnable-track]:h-3 [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:bg-transparent [&::-webkit-slider-thumb]:pointer-events-auto [&::-webkit-slider-thumb]:mt-[-5px] [&::-webkit-slider-thumb]:size-5 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-[3px] [&::-webkit-slider-thumb]:border-[color:var(--aui-page-bg)] [&::-webkit-slider-thumb]:bg-[color:var(--aui-brand-strong)] [&::-webkit-slider-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-webkit-slider-thumb]:transition-transform hover:[&::-webkit-slider-thumb]:scale-105`,onChange:e=>x(1,e.currentTarget.valueAsNumber),...g})]})]})]})}exports.RangeSlider=l,exports.Slider=s;

package/dist/src/components/inputs/slider.js

@@ -44,7 +44,7 @@ function s({ value: i, defaultValue: a = 0, onValueChange: s, min: c = 0, max: l
 			step: u,
 			disabled: g,
 			style: o(b, c, l),
-			className: "h-3 w-full cursor-pointer appearance-none rounded-full border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-control-bg)] shadow-[inset_0_1px_2px_rgba(15,23,42,0.08)] outline-none transition hover:brightness-[1.02] disabled:cursor-not-allowed disabled:opacity-50 [&::-moz-range-thumb]:size-5 [&::-moz-range-thumb]:rounded-full [&::-moz-range-thumb]:border-[3px] [&::-moz-range-thumb]:border-[color:var(--aui-page-bg)] [&::-moz-range-thumb]:bg-[color:var(--aui-brand-strong)] [&::-moz-range-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-moz-range-thumb]:transition [&::-moz-range-track]:h-3 [&::-moz-range-track]:rounded-full [&::-webkit-slider-runnable-track]:h-3 [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-thumb]:mt-[-5px] [&::-webkit-slider-thumb]:size-5 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-[3px] [&::-webkit-slider-thumb]:border-[color:var(--aui-page-bg)] [&::-webkit-slider-thumb]:bg-[color:var(--aui-brand-strong)] [&::-webkit-slider-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)]",
+			className: "h-3 w-full cursor-pointer appearance-none rounded-full border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-control-bg)] shadow-[inset_0_1px_2px_rgba(15,23,42,0.08)] outline-none transition hover:brightness-[1.02] focus-visible:ring-4 focus-visible:ring-[color:color-mix(in_oklch,var(--aui-brand-strong),transparent_78%)] disabled:cursor-not-allowed disabled:opacity-50 [&::-moz-range-thumb]:size-5 [&::-moz-range-thumb]:rounded-full [&::-moz-range-thumb]:border-[3px] [&::-moz-range-thumb]:border-[color:var(--aui-page-bg)] [&::-moz-range-thumb]:bg-[color:var(--aui-brand-strong)] [&::-moz-range-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-moz-range-thumb]:transition [&::-moz-range-track]:h-3 [&::-moz-range-track]:rounded-full [&::-webkit-slider-runnable-track]:h-3 [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-thumb]:mt-[-5px] [&::-webkit-slider-thumb]:size-5 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-[3px] [&::-webkit-slider-thumb]:border-[color:var(--aui-page-bg)] [&::-webkit-slider-thumb]:bg-[color:var(--aui-brand-strong)] [&::-webkit-slider-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-webkit-slider-thumb]:transition-transform hover:[&::-webkit-slider-thumb]:scale-105",
 			onChange: (e) => S(e.currentTarget.valueAsNumber),
 			..._
 		})]
@@ -97,7 +97,7 @@ function l({ value: i, defaultValue: a = [0, 100], onValueChange: o, min: s = 0,
 					max: l,
 					step: u,
 					disabled: g,
-					className: "pointer-events-none absolute inset-0 h-6 w-full cursor-pointer appearance-none bg-transparent outline-none disabled:cursor-not-allowed disabled:opacity-50 [&::-moz-range-thumb]:pointer-events-auto [&::-moz-range-thumb]:size-5 [&::-moz-range-thumb]:rounded-full [&::-moz-range-thumb]:border-[3px] [&::-moz-range-thumb]:border-[color:var(--aui-page-bg)] [&::-moz-range-thumb]:bg-[color:var(--aui-brand-strong)] [&::-moz-range-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-moz-range-track]:h-3 [&::-moz-range-track]:rounded-full [&::-moz-range-track]:bg-transparent [&::-webkit-slider-runnable-track]:h-3 [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:bg-transparent [&::-webkit-slider-thumb]:pointer-events-auto [&::-webkit-slider-thumb]:mt-[-5px] [&::-webkit-slider-thumb]:size-5 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-[3px] [&::-webkit-slider-thumb]:border-[color:var(--aui-page-bg)] [&::-webkit-slider-thumb]:bg-[color:var(--aui-brand-strong)] [&::-webkit-slider-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)]",
+					className: "pointer-events-none absolute inset-0 h-6 w-full cursor-pointer appearance-none bg-transparent outline-none focus-visible:ring-4 focus-visible:ring-[color:color-mix(in_oklch,var(--aui-brand-strong),transparent_78%)] disabled:cursor-not-allowed disabled:opacity-50 [&::-moz-range-thumb]:pointer-events-auto [&::-moz-range-thumb]:size-5 [&::-moz-range-thumb]:rounded-full [&::-moz-range-thumb]:border-[3px] [&::-moz-range-thumb]:border-[color:var(--aui-page-bg)] [&::-moz-range-thumb]:bg-[color:var(--aui-brand-strong)] [&::-moz-range-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-moz-range-track]:h-3 [&::-moz-range-track]:rounded-full [&::-moz-range-track]:bg-transparent [&::-webkit-slider-runnable-track]:h-3 [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:bg-transparent [&::-webkit-slider-thumb]:pointer-events-auto [&::-webkit-slider-thumb]:mt-[-5px] [&::-webkit-slider-thumb]:size-5 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-[3px] [&::-webkit-slider-thumb]:border-[color:var(--aui-page-bg)] [&::-webkit-slider-thumb]:bg-[color:var(--aui-brand-strong)] [&::-webkit-slider-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-webkit-slider-thumb]:transition-transform hover:[&::-webkit-slider-thumb]:scale-105",
 					onChange: (e) => S(0, e.currentTarget.valueAsNumber),
 					..._
 				}), /* @__PURE__ */ n("input", {
@@ -107,7 +107,7 @@ function l({ value: i, defaultValue: a = [0, 100], onValueChange: o, min: s = 0,
 					max: l,
 					step: u,
 					disabled: g,
-					className: "pointer-events-none absolute inset-0 h-6 w-full cursor-pointer appearance-none bg-transparent outline-none disabled:cursor-not-allowed disabled:opacity-50 [&::-moz-range-thumb]:pointer-events-auto [&::-moz-range-thumb]:size-5 [&::-moz-range-thumb]:rounded-full [&::-moz-range-thumb]:border-[3px] [&::-moz-range-thumb]:border-[color:var(--aui-page-bg)] [&::-moz-range-thumb]:bg-[color:var(--aui-brand-strong)] [&::-moz-range-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-moz-range-track]:h-3 [&::-moz-range-track]:rounded-full [&::-moz-range-track]:bg-transparent [&::-webkit-slider-runnable-track]:h-3 [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:bg-transparent [&::-webkit-slider-thumb]:pointer-events-auto [&::-webkit-slider-thumb]:mt-[-5px] [&::-webkit-slider-thumb]:size-5 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-[3px] [&::-webkit-slider-thumb]:border-[color:var(--aui-page-bg)] [&::-webkit-slider-thumb]:bg-[color:var(--aui-brand-strong)] [&::-webkit-slider-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)]",
+					className: "pointer-events-none absolute inset-0 h-6 w-full cursor-pointer appearance-none bg-transparent outline-none focus-visible:ring-4 focus-visible:ring-[color:color-mix(in_oklch,var(--aui-brand-strong),transparent_78%)] disabled:cursor-not-allowed disabled:opacity-50 [&::-moz-range-thumb]:pointer-events-auto [&::-moz-range-thumb]:size-5 [&::-moz-range-thumb]:rounded-full [&::-moz-range-thumb]:border-[3px] [&::-moz-range-thumb]:border-[color:var(--aui-page-bg)] [&::-moz-range-thumb]:bg-[color:var(--aui-brand-strong)] [&::-moz-range-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-moz-range-track]:h-3 [&::-moz-range-track]:rounded-full [&::-moz-range-track]:bg-transparent [&::-webkit-slider-runnable-track]:h-3 [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:bg-transparent [&::-webkit-slider-thumb]:pointer-events-auto [&::-webkit-slider-thumb]:mt-[-5px] [&::-webkit-slider-thumb]:size-5 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-[3px] [&::-webkit-slider-thumb]:border-[color:var(--aui-page-bg)] [&::-webkit-slider-thumb]:bg-[color:var(--aui-brand-strong)] [&::-webkit-slider-thumb]:shadow-[0_8px_24px_rgba(16,185,129,0.24)] [&::-webkit-slider-thumb]:transition-transform hover:[&::-webkit-slider-thumb]:scale-105",
 					onChange: (e) => S(1, e.currentTarget.valueAsNumber),
 					..._
 				})]

package/dist/src/components/inputs/tag-input.cjs

@@ -1 +1 @@
-"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/badge/index.cjs"),r=require("../ui/input/index.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("lucide-react"),o=require("react/jsx-runtime");function s({value:e,defaultValue:s=[],onValueChange:c,placeholder:l=`Add tag...`,disabled:u=!1,readOnly:d=!1,maxTags:f,allowDuplicates:p=!1,separators:m=[`,`,`Enter`],normalizeTag:h=e=>e.trim(),className:g,..._}){let v=e!==void 0,[y,b]=i.useState(s),[x,S]=i.useState(``),C=v?e:y,w=f!==void 0&&C.length>=f,T=i.useCallback(e=>{v||b(e),c?.(e)},[v,c]),E=i.useCallback(e=>{let t=h(e);t&&(f!==void 0&&C.length>=f||!p&&C.includes(t)||(T([...C,t]),S(``)))},[p,f,h,T,C]),D=i.useCallback(e=>{T(C.filter(t=>t!==e))},[T,C]);return(0,o.jsx)(`div`,{"data-slot":`tag-input`,className:t.cn(`grid gap-2`,g),..._,children:(0,o.jsxs)(`div`,{className:t.cn(`flex min-h-12 flex-wrap items-center gap-2 rounded-2xl border border-[color:var(--aui-surface-border)] bg-[color:color-mix(in_srgb,var(--aui-control-bg)_78%,white_22%)] px-3 py-2.5 shadow-sm transition focus-within:border-[color:var(--aui-brand-strong)] focus-within:ring-4 focus-within:ring-[color:color-mix(in_srgb,var(--aui-brand-strong)_14%,transparent)] dark:bg-[color:color-mix(in_srgb,var(--aui-control-bg)_90%,black_10%)]`,u&&`opacity-60`,d&&`bg-muted/30`),children:[C.map(e=>(0,o.jsxs)(n.Badge,{variant:`secondary`,className:`h-8 gap-1 rounded-full border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg)] px-3 pr-1 text-[13px] font-medium shadow-sm`,children:[e,!d&&!u&&(0,o.jsx)(`button`,{type:`button`,className:`grid size-5 shrink-0 place-items-center rounded-full p-0 leading-none text-muted-foreground transition hover:bg-[color:var(--aui-control-bg)] hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/40`,"aria-label":`Remove ${e}`,onClick:n=>{t.stopInteractivePropagation(n),D(e)},onMouseDown:t.stopInteractivePropagation,onDoubleClick:t.stopInteractivePropagation,children:(0,o.jsx)(a.XIcon,{className:`size-3`,strokeWidth:2})})]},e)),!d&&(0,o.jsx)(r.Input,{value:x,disabled:u||w,placeholder:l,className:`h-8 min-w-32 flex-1 border-0 bg-transparent px-1 text-sm shadow-none placeholder:text-[color:var(--aui-text-muted)] focus-visible:ring-0`,onChange:e=>S(e.target.value),onBlur:()=>E(x),onKeyDown:e=>{m.includes(e.key)&&(e.preventDefault(),E(x)),e.key===`Backspace`&&!x&&C.length&&D(C[C.length-1])}}),f!==void 0&&(0,o.jsxs)(`span`,{className:`ml-auto text-xs font-medium text-muted-foreground`,children:[C.length,`/`,f]})]})})}exports.TagInput=s;
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../lib/utils.cjs"),n=require("../ui/badge/index.cjs"),r=require("../ui/input/index.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("lucide-react"),o=require("react/jsx-runtime");function s({value:e,defaultValue:s=[],onValueChange:c,placeholder:l=`Add tag...`,disabled:u=!1,readOnly:d=!1,maxTags:f,allowDuplicates:p=!1,separators:m=[`,`,`Enter`],normalizeTag:h=e=>e.trim(),className:g,..._}){let v=e!==void 0,[y,b]=i.useState(s),[x,S]=i.useState(``),C=v?e:y,w=f!==void 0&&C.length>=f,T=i.useCallback(e=>{v||b(e),c?.(e)},[v,c]),E=i.useCallback(e=>{let t=h(e);t&&(f!==void 0&&C.length>=f||!p&&C.includes(t)||(T([...C,t]),S(``)))},[p,f,h,T,C]),D=i.useCallback(e=>{T(C.filter(t=>t!==e))},[T,C]);return(0,o.jsx)(`div`,{"data-slot":`tag-input`,className:t.cn(`grid gap-2`,g),..._,children:(0,o.jsxs)(`div`,{className:t.cn(`flex min-h-12 flex-wrap items-center gap-2 rounded-2xl border border-[color:var(--aui-surface-border)] bg-[color:color-mix(in_srgb,var(--aui-control-bg)_78%,white_22%)] px-3 py-2.5 shadow-sm transition focus-within:border-[color:var(--aui-brand-strong)] focus-within:ring-4 focus-within:ring-[color:color-mix(in_srgb,var(--aui-brand-strong)_14%,transparent)] dark:bg-[color:color-mix(in_srgb,var(--aui-control-bg)_90%,black_10%)]`,u&&`opacity-60`,d&&`bg-muted/30`),children:[C.map(e=>(0,o.jsxs)(n.Badge,{variant:`secondary`,className:`h-8 gap-1.5 rounded-full border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg)] px-3 pr-1.5 text-[13px] font-medium leading-none shadow-sm`,children:[(0,o.jsx)(`span`,{className:`leading-none`,children:e}),!d&&!u&&(0,o.jsx)(`button`,{type:`button`,className:`inline-flex size-5 shrink-0 items-center justify-center rounded-full p-0 leading-none text-muted-foreground transition hover:bg-[color:var(--aui-control-bg)] hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/40`,"aria-label":`Remove ${e}`,onClick:n=>{t.stopInteractivePropagation(n),D(e)},onMouseDown:t.stopInteractivePropagation,onDoubleClick:t.stopInteractivePropagation,children:(0,o.jsx)(a.XIcon,{className:`size-3`,strokeWidth:2.25})})]},e)),!d&&(0,o.jsx)(r.Input,{value:x,disabled:u||w,placeholder:l,className:`h-8 min-w-32 flex-1 border-0 bg-transparent px-1 text-sm shadow-none placeholder:text-[color:var(--aui-text-muted)] focus-visible:ring-0`,onChange:e=>S(e.target.value),onBlur:()=>E(x),onKeyDown:e=>{m.includes(e.key)&&(e.preventDefault(),E(x)),e.key===`Backspace`&&!x&&C.length&&D(C[C.length-1])}}),f!==void 0&&(0,o.jsxs)(`span`,{className:`ml-auto text-xs font-medium text-muted-foreground`,children:[C.length,`/`,f]})]})})}exports.TagInput=s;

package/dist/src/components/inputs/tag-input.js

@@ -30,10 +30,13 @@ function c({ value: c, defaultValue: l = [], onValueChange: u, placeholder: d =
 			children: [
 				T.map((e) => /* @__PURE__ */ s(n, {
 					variant: "secondary",
-					className: "h-8 gap-1 rounded-full border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg)] px-3 pr-1 text-[13px] font-medium shadow-sm",
-					children: [e, !p && !f && /* @__PURE__ */ o("button", {
+					className: "h-8 gap-1.5 rounded-full border border-[color:var(--aui-surface-border)] bg-[color:var(--aui-page-bg)] px-3 pr-1.5 text-[13px] font-medium leading-none shadow-sm",
+					children: [/* @__PURE__ */ o("span", {
+						className: "leading-none",
+						children: e
+					}), !p && !f && /* @__PURE__ */ o("button", {
 						type: "button",
-						className: "grid size-5 shrink-0 place-items-center rounded-full p-0 leading-none text-muted-foreground transition hover:bg-[color:var(--aui-control-bg)] hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/40",
+						className: "inline-flex size-5 shrink-0 items-center justify-center rounded-full p-0 leading-none text-muted-foreground transition hover:bg-[color:var(--aui-control-bg)] hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/40",
 						"aria-label": `Remove ${e}`,
 						onClick: (n) => {
 							t(n), k(e);
@@ -42,7 +45,7 @@ function c({ value: c, defaultValue: l = [], onValueChange: u, placeholder: d =
 						onDoubleClick: t,
 						children: /* @__PURE__ */ o(a, {
 							className: "size-3",
-							strokeWidth: 2
+							strokeWidth: 2.25
 						})
 					})]
 				}, e)),

package/dist/src/components/inputs/time-picker.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({label:e,className:n,children:i}){return(0,r.jsxs)(`label`,{className:t.cn(`grid gap-1.5 text-sm`,n),children:[e&&(0,r.jsx)(`span`,{className:`font-medium`,children:e}),i]})}function a({label:e,className:n,...a}){return(0,r.jsx)(i,{label:e,children:(0,r.jsx)(`input`,{type:`time`,className:t.cn(`h-10 rounded-md border bg-background px-3 text-sm outline-none ring-offset-background focus-visible:ring-2 focus-visible:ring-ring`,n),...a})})}function o({label:e,className:n,...a}){return(0,r.jsx)(i,{label:e,children:(0,r.jsx)(`input`,{type:`datetime-local`,className:t.cn(`h-10 rounded-md border bg-background px-3 text-sm outline-none ring-offset-background focus-visible:ring-2 focus-visible:ring-ring`,n),...a})})}function s({from:e,to:n,onFromChange:i,onToChange:o,disabled:s,className:c,...l}){return(0,r.jsxs)(`div`,{"data-slot":`time-range-picker`,className:t.cn(`grid gap-2 sm:grid-cols-2`,c),...l,children:[(0,r.jsx)(a,{value:e,disabled:s,onChange:e=>i?.(e.target.value)}),(0,r.jsx)(a,{value:n,disabled:s,onChange:e=>o?.(e.target.value)})]})}exports.DateTimePicker=o,exports.TimePicker=a,exports.TimeRangePicker=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("lucide-react"),i=require("react/jsx-runtime");function a({label:e,className:n,children:r}){return(0,i.jsxs)(`label`,{className:t.cn(`grid gap-1.5 text-sm`,n),children:[e&&(0,i.jsx)(`span`,{className:`font-medium`,children:e}),r]})}function o(e,t,n){e.preventDefault(),e.stopPropagation(),t?.({target:{value:``},currentTarget:{value:``}}),n?.()}function s({label:e,className:n,clearable:s=!1,onClear:c,value:l,defaultValue:u,disabled:d,onChange:f,...p}){let m=l===void 0?u!==void 0&&String(u).length>0:String(l).length>0;return(0,i.jsx)(a,{label:e,children:(0,i.jsxs)(`span`,{className:`relative grid`,children:[(0,i.jsx)(r.ClockIcon,{className:`pointer-events-none absolute left-3 top-1/2 size-4 -translate-y-1/2 text-muted-foreground`}),(0,i.jsx)(`input`,{type:`time`,value:l,defaultValue:u,disabled:d,onChange:f,className:t.cn(`h-11 rounded-[var(--aui-control-radius,var(--radius-md))] border border-input/82 bg-background px-10 text-sm tabular-nums outline-none transition-[border-color,box-shadow] hover:border-ring/30 focus-visible:border-ring focus-visible:ring-4 focus-visible:ring-ring/16 disabled:cursor-not-allowed disabled:bg-muted disabled:text-muted-foreground`,n),...p}),s&&m&&!d?(0,i.jsx)(`button`,{type:`button`,"aria-label":`Clear time`,className:`absolute right-2 top-1/2 grid size-7 -translate-y-1/2 place-items-center rounded-md text-muted-foreground hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring`,onClick:e=>o(e,f,c),children:(0,i.jsx)(r.XIcon,{className:`size-3.5`})}):null]})})}function c({label:e,className:n,clearable:s=!1,onClear:c,value:l,defaultValue:u,disabled:d,onChange:f,...p}){let m=l===void 0?u!==void 0&&String(u).length>0:String(l).length>0;return(0,i.jsx)(a,{label:e,children:(0,i.jsxs)(`span`,{className:`relative grid`,children:[(0,i.jsx)(r.CalendarClockIcon,{className:`pointer-events-none absolute left-3 top-1/2 size-4 -translate-y-1/2 text-muted-foreground`}),(0,i.jsx)(`input`,{type:`datetime-local`,value:l,defaultValue:u,disabled:d,onChange:f,className:t.cn(`h-11 rounded-[var(--aui-control-radius,var(--radius-md))] border border-input/82 bg-background px-10 text-sm tabular-nums outline-none transition-[border-color,box-shadow] hover:border-ring/30 focus-visible:border-ring focus-visible:ring-4 focus-visible:ring-ring/16 disabled:cursor-not-allowed disabled:bg-muted disabled:text-muted-foreground`,n),...p}),s&&m&&!d?(0,i.jsx)(`button`,{type:`button`,"aria-label":`Clear date and time`,className:`absolute right-2 top-1/2 grid size-7 -translate-y-1/2 place-items-center rounded-md text-muted-foreground hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring`,onClick:e=>o(e,f,c),children:(0,i.jsx)(r.XIcon,{className:`size-3.5`})}):null]})})}function l({from:e,to:n,onFromChange:r,onToChange:a,disabled:o,labels:c,className:l,...u}){return(0,i.jsxs)(`div`,{"data-slot":`time-range-picker`,className:t.cn(`grid gap-2 sm:grid-cols-[1fr_auto_1fr] sm:items-end`,l),...u,children:[(0,i.jsx)(s,{label:c?.from,value:e,clearable:!0,disabled:o,onChange:e=>r?.(e.target.value),onClear:()=>r?.(``)}),(0,i.jsx)(`span`,{className:`hidden h-11 items-center text-sm text-muted-foreground sm:inline-flex`,children:`to`}),(0,i.jsx)(s,{label:c?.to,value:n,clearable:!0,disabled:o,onChange:e=>a?.(e.target.value),onClear:()=>a?.(``)})]})}exports.DateTimePicker=c,exports.TimePicker=s,exports.TimeRangePicker=l;