@feugene/granularity 0.1.0

package/dist/chunks/DsSelect-DEHGeICn.js

@@ -0,0 +1,304 @@
+import { vClickOutside as e } from "../directives/clickOutside.js";
+import { t } from "./DsInput-DeoAkT6R.js";
+import { i as n, n as r, t as i } from "./dsSelectStyles-Bym0uW4f.js";
+import { Fragment as a, Teleport as ee, Transition as te, computed as o, createBlock as ne, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createVNode as u, defineComponent as d, nextTick as f, normalizeClass as p, normalizeStyle as m, onUnmounted as h, openBlock as g, ref as _, renderList as v, renderSlot as y, toDisplayString as b, unref as re, vShow as ie, watch as ae, withCtx as oe, withDirectives as x, withKeys as se, withModifiers as S } from "vue";
+//#region src/components/DsSelect/DsSelect.vue?vue&type=script&setup=true&lang.ts
+var ce = [
+	"value",
+	"multiple",
+	"disabled",
+	"aria-label"
+], C = {
+	key: 0,
+	value: ""
+}, w = ["value"], T = ["value"], le = {
+	key: 0,
+	"data-testid": "ds-select-chevron",
+	class: "absolute top-1/2 -translate-y-1/2 right-3 text-[var(--muted-fg)] pointer-events-none"
+}, ue = [
+	"disabled",
+	"aria-label",
+	"aria-expanded"
+], de = { class: "min-w-0 flex-1" }, fe = {
+	key: 0,
+	class: "shrink-0 h-4 w-4",
+	"aria-hidden": "true"
+}, pe = {
+	key: 1,
+	"data-testid": "ds-select-chevron",
+	class: "shrink-0 text-[var(--muted-fg)] pointer-events-none"
+}, me = ["disabled"], he = {
+	key: 0,
+	class: "p-2 border-b border-[var(--brd)]"
+}, ge = ["aria-multiselectable"], _e = ["aria-selected", "onClick"], ve = { class: "flex items-center gap-2 min-w-0" }, ye = { class: "truncate" }, E = /* @__PURE__ */ d({
+	__name: "DsSelect",
+	props: {
+		modelValue: {},
+		options: { default: void 0 },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		ariaLabel: { default: void 0 },
+		view: { default: "default" },
+		size: { default: "md" },
+		placeholder: { default: void 0 },
+		multiple: {
+			type: Boolean,
+			default: !1
+		},
+		optionsView: { default: "native" },
+		allowCustomValue: {
+			type: Boolean,
+			default: !1
+		},
+		customValuePlaceholder: { default: "Add value…" },
+		dropdownMaxHeight: { default: 280 },
+		closeOnSelect: {
+			type: Boolean,
+			default: !0
+		},
+		clearable: {
+			type: Boolean,
+			default: !1
+		},
+		variant: { default: "primary" },
+		underline: { default: "auto" }
+	},
+	emits: ["update:modelValue"],
+	setup(d, { emit: E }) {
+		let D = d, O = E, k = o(() => D.options ?? []);
+		function A(e) {
+			return Array.isArray(e) ? e : e ? [e] : [];
+		}
+		let j = o(() => Array.isArray(D.modelValue) ? D.modelValue[0] ?? "" : D.modelValue), M = o(() => A(D.modelValue)), N = o(() => D.multiple ? M.value : j.value ? [j.value] : []), P = o(() => N.value.length > 0), F = o(() => {
+			let e = new Map(k.value.map((e) => [e.value, e]));
+			return N.value.map((t) => e.get(t) ?? {
+				value: t,
+				label: t
+			});
+		}), I = o(() => D.multiple ? !1 : k.value.some((e) => e.value === j.value)), L = o(() => D.multiple ? N.value.length ? N.value.map((e) => k.value.find((t) => t.value === e)?.label ?? e).join(", ") : "" : k.value.find((e) => e.value === j.value)?.label ?? j.value), be = o(() => P.value ? L.value : D.placeholder ?? ""), xe = o(() => !D.allowCustomValue || D.optionsView !== "native" || D.multiple || !D.options || j.value === "" ? !1 : !I.value), R = _(""), z = _(!1), B = _(null), V = _(null), H = _(null), Se = [() => V.value], U = _({
+			left: "0px",
+			top: "0px",
+			width: "0px",
+			zIndex: "2147483647"
+		});
+		function W() {
+			if (typeof window > "u") return;
+			let e = B.value;
+			if (!e) return;
+			let t = e.getBoundingClientRect();
+			U.value = {
+				left: `${t.left}px`,
+				top: `${t.bottom + 8}px`,
+				width: `${t.width}px`,
+				zIndex: "2147483647"
+			};
+		}
+		function Ce() {
+			typeof window > "u" || (window.addEventListener("resize", W), window.addEventListener("scroll", W, !0));
+		}
+		function G() {
+			typeof window > "u" || (window.removeEventListener("resize", W), window.removeEventListener("scroll", W, !0));
+		}
+		function K() {
+			z.value = !1;
+		}
+		function we() {
+			D.disabled || (z.value = !z.value);
+		}
+		function q(e) {
+			e.key === "Escape" && K();
+		}
+		ae(z, async (e) => {
+			if (!(typeof document > "u")) {
+				if (document.removeEventListener("keydown", q), G(), e && document.addEventListener("keydown", q), !e) {
+					R.value = "";
+					return;
+				}
+				Ce(), await f(), W(), D.allowCustomValue && H.value?.focus();
+			}
+		}, { immediate: !0 }), h(() => {
+			typeof document > "u" || (document.removeEventListener("keydown", q), G());
+		});
+		let Te = o(() => r), Ee = o(() => {
+			let e = k.value, t = !D.allowCustomValue || D.multiple || j.value === "" || I.value ? e : [{
+				value: j.value,
+				label: j.value
+			}, ...e];
+			if (!D.allowCustomValue) return t;
+			let n = R.value.trim().toLowerCase();
+			return n ? t.filter((e) => e.label.toLowerCase().includes(n) || e.value.toLowerCase().includes(n)) : t;
+		}), De = o(() => {
+			if (!D.allowCustomValue || D.optionsView !== "panel") return !1;
+			let e = R.value.trim();
+			return e ? D.multiple ? N.value.includes(e) ? !1 : !k.value.some((t) => t.value === e) : e === j.value ? !1 : !k.value.some((t) => t.value === e) : !1;
+		});
+		function J(e) {
+			O("update:modelValue", e);
+		}
+		function Y(e) {
+			return N.value.includes(e);
+		}
+		function Oe(e) {
+			J(e), D.closeOnSelect && K();
+		}
+		function X(e) {
+			if (!D.multiple) {
+				Oe(e);
+				return;
+			}
+			let t = N.value.slice(), n = t.indexOf(e);
+			n >= 0 ? t.splice(n, 1) : t.push(e), J(t), D.closeOnSelect && K();
+		}
+		function Z() {
+			let e = R.value.trim();
+			e && X(e);
+		}
+		let Q = o(() => D.optionsView === "native" && D.view !== "link" && !D.multiple), ke = o(() => !D.clearable || D.optionsView !== "native" || D.multiple ? !1 : D.options ? !D.options.some((e) => e.value === "") : !0), $ = o(() => !D.clearable || D.optionsView !== "panel" || D.view === "link" ? !1 : P.value), Ae = o(() => i({
+			view: D.view,
+			size: D.size,
+			disabled: D.disabled,
+			variant: D.variant,
+			underline: D.underline,
+			showNativeChevron: Q.value
+		})), je = o(() => n({
+			view: D.view,
+			optionsView: D.optionsView,
+			size: D.size,
+			disabled: D.disabled,
+			variant: D.variant,
+			underline: D.underline
+		}));
+		function Me(e) {
+			let t = e.target;
+			if (D.multiple) {
+				O("update:modelValue", Array.from(t.selectedOptions, (e) => e.value));
+				return;
+			}
+			O("update:modelValue", t.value);
+		}
+		function Ne() {
+			D.disabled || J(D.multiple ? [] : "");
+		}
+		return (n, r) => D.optionsView === "native" ? (g(), c("div", {
+			key: 0,
+			class: p(D.view === "link" ? "relative inline-block align-baseline" : "relative w-full")
+		}, [l("select", {
+			value: D.multiple ? M.value : j.value,
+			multiple: D.multiple,
+			disabled: D.disabled,
+			"aria-label": D.ariaLabel,
+			class: p([D.view === "link" ? "cursor-pointer inline-block w-auto align-baseline appearance-none bg-transparent border border-transparent px-0 py-0 rounded-[6px] transition-colors duration-150 focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]" : "w-full rounded-md border border-[var(--brd)] bg-[var(--bg)] text-[var(--fg)] transition-colors duration-150 focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]", Ae.value]),
+			onChange: Me
+		}, [ke.value ? (g(), c("option", C)) : s("", !0), y(n.$slots, "default", {}, () => [xe.value ? (g(), c("option", {
+			key: 0,
+			value: j.value
+		}, b(j.value), 9, w)) : s("", !0), (g(!0), c(a, null, v(D.options, (e) => (g(), c("option", {
+			key: e.value,
+			value: e.value
+		}, b(e.label), 9, T))), 128))])], 42, ce), Q.value ? (g(), c("span", le, [...r[1] ||= [l("span", {
+			class: "i-lucide-chevron-down h-4 w-4",
+			"aria-hidden": "true"
+		}, null, -1)]])) : s("", !0)], 2)) : x((g(), c("div", {
+			key: 1,
+			ref_key: "rootEl",
+			ref: B,
+			class: p(D.view === "link" ? "relative inline-block align-baseline" : "relative w-full")
+		}, [
+			l("button", {
+				"data-testid": "ds-select-trigger",
+				type: "button",
+				disabled: D.disabled,
+				"aria-label": D.ariaLabel,
+				role: "combobox",
+				"aria-readonly": "true",
+				"aria-expanded": z.value ? "true" : "false",
+				class: p([D.view === "link" ? "cursor-pointer inline-block w-auto align-baseline appearance-none bg-transparent border border-transparent px-0 py-0 rounded-[6px] transition-colors duration-150 focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]" : "w-full rounded-md border border-[var(--brd)] bg-[var(--bg)] text-[var(--fg)] transition-colors duration-150 focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]", je.value]),
+				onClick: we
+			}, [l("span", de, [y(n.$slots, "value", {
+				selectedOptions: F.value,
+				selectedValues: N.value,
+				displayLabel: L.value,
+				placeholder: D.placeholder,
+				hasSelection: P.value
+			}, () => [l("span", { class: p(["block truncate", P.value ? "" : "text-[var(--muted-fg)]"]) }, b(be.value), 3)])]), $.value ? (g(), c("span", fe)) : (g(), c("span", pe, [...r[2] ||= [l("span", {
+				class: "i-lucide-chevron-down h-4 w-4",
+				"aria-hidden": "true"
+			}, null, -1)]]))], 10, ue),
+			$.value ? (g(), c("button", {
+				key: 0,
+				"data-testid": "ds-select-clear",
+				type: "button",
+				class: "absolute top-1/2 -translate-y-1/2 right-3 h-6 w-6 inline-flex items-center justify-center rounded-md text-[var(--muted-fg)] hover:text-[var(--fg)] hover:bg-[color-mix(in_srgb,var(--muted)_25%,transparent)] disabled:opacity-50",
+				disabled: D.disabled,
+				"aria-label": "Clear",
+				onClick: S(Ne, ["stop"])
+			}, [...r[3] ||= [l("span", {
+				class: "i-lucide-x h-4 w-4",
+				"aria-hidden": "true"
+			}, null, -1)]], 8, me)) : s("", !0),
+			(g(), ne(ee, { to: "body" }, [u(te, {
+				"enter-active-class": "transition ease-out duration-150",
+				"enter-from-class": "transform opacity-0 scale-95",
+				"enter-to-class": "transform opacity-100 scale-100",
+				"leave-active-class": "transition ease-in duration-100",
+				"leave-from-class": "transform opacity-100 scale-100",
+				"leave-to-class": "transform opacity-0 scale-95"
+			}, {
+				default: oe(() => [x(l("div", {
+					ref_key: "panelEl",
+					ref: V,
+					"data-testid": "ds-select-panel",
+					class: "fixed w-full",
+					style: m(U.value)
+				}, [l("div", { class: p(Te.value) }, [D.allowCustomValue ? (g(), c("div", he, [u(t, {
+					ref_key: "customInputRef",
+					ref: H,
+					modelValue: R.value,
+					"onUpdate:modelValue": r[0] ||= (e) => R.value = e,
+					"data-testid": "ds-select-custom-input",
+					type: "text",
+					placeholder: D.customValuePlaceholder,
+					size: "sm",
+					onKeydown: se(S(Z, ["prevent"]), ["enter"])
+				}, null, 8, [
+					"modelValue",
+					"placeholder",
+					"onKeydown"
+				])])) : s("", !0), l("div", {
+					class: "p-1 overflow-auto",
+					style: m({ maxHeight: `${D.dropdownMaxHeight}px` }),
+					role: "listbox",
+					"aria-multiselectable": D.multiple ? "true" : void 0
+				}, [De.value ? (g(), c("button", {
+					key: 0,
+					"data-testid": "ds-select-add-option",
+					type: "button",
+					class: "w-full rounded-[10px] px-3 py-2 text-left text-[13px] hover:bg-[color-mix(in_srgb,var(--muted)_30%,transparent)]",
+					onClick: Z
+				}, " Add “" + b(R.value.trim()) + "” ", 1)) : s("", !0), (g(!0), c(a, null, v(Ee.value, (e) => (g(), c("button", {
+					key: e.value,
+					type: "button",
+					role: "option",
+					"aria-selected": Y(e.value) ? "true" : "false",
+					class: "w-full rounded-[10px] px-3 py-2 text-left text-[13px] hover:bg-[color-mix(in_srgb,var(--muted)_30%,transparent)]",
+					onClick: (t) => X(e.value)
+				}, [y(n.$slots, "option", {
+					option: e,
+					selected: Y(e.value)
+				}, () => [l("span", ve, [l("span", {
+					class: p(["h-4 w-4 shrink-0", Y(e.value) ? "i-lucide-check text-[var(--primary)]" : ""]),
+					"aria-hidden": "true"
+				}, null, 2), l("span", ye, b(e.label), 1)])])], 8, _e))), 128))], 12, ge)], 2)], 4), [[ie, z.value]])]),
+				_: 3
+			})]))
+		], 2)), [[re(e), {
+			handler: K,
+			enabled: z.value,
+			exclude: Se
+		}]]);
+	}
+});
+//#endregion
+export { E as t };

package/dist/chunks/DsSidebar-BNLaBCYD.js

@@ -0,0 +1,18 @@
+import { createCommentVNode as e, createElementBlock as t, createElementVNode as n, defineComponent as r, openBlock as i, renderSlot as a, toDisplayString as o } from "vue";
+//#region src/components/DsSidebar/DsSidebar.vue?vue&type=script&setup=true&lang.ts
+var s = { class: "border-r border-[var(--sidebar-brd)] bg-[var(--sidebar)] text-[var(--sidebar-fg)]" }, c = { class: "border-b border-[var(--sidebar-brd)] px-4 py-4" }, l = {
+	key: 0,
+	class: "text-[14px] ds-muted"
+}, u = { class: "text-[18px] font-700" }, d = { class: "p-3" }, f = /* @__PURE__ */ r({
+	__name: "DsSidebar",
+	props: {
+		title: {},
+		subtitle: { default: void 0 }
+	},
+	setup(r) {
+		let f = r;
+		return (r, p) => (i(), t("aside", s, [n("div", c, [f.subtitle ? (i(), t("div", l, o(f.subtitle), 1)) : e("", !0), n("div", u, o(f.title), 1)]), n("div", d, [a(r.$slots, "default")])]));
+	}
+});
+//#endregion
+export { f as t };

package/dist/chunks/DsSkeleton-BcXabaQ7.js

@@ -0,0 +1,25 @@
+import { createElementBlock as e, defineComponent as t, normalizeStyle as n, openBlock as r } from "vue";
+//#endregion
+//#region src/components/DsSkeleton/DsSkeleton.vue
+var i = /* @__PURE__ */ t({
+	__name: "DsSkeleton",
+	props: {
+		height: { default: "12px" },
+		width: { default: "100%" },
+		rounded: { default: "9999px" }
+	},
+	setup(t) {
+		let i = t;
+		return (t, a) => (r(), e("div", {
+			class: "animate-pulse bg-[var(--muted)] border border-[var(--brd)]",
+			style: n({
+				height: i.height,
+				width: i.width,
+				borderRadius: i.rounded
+			}),
+			"aria-hidden": "true"
+		}, null, 4));
+	}
+});
+//#endregion
+export { i as t };

package/dist/chunks/DsSwitch-DBdjltGz.js

@@ -0,0 +1,60 @@
+import { a as e, i as t, n } from "./config-B-tMv4PT.js";
+import { computed as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, defineComponent as s, normalizeClass as c, normalizeStyle as l, openBlock as u, renderSlot as d } from "vue";
+//#region src/components/DsSwitch/DsSwitch.vue?vue&type=script&setup=true&lang.ts
+var f = [
+	"aria-checked",
+	"aria-label",
+	"disabled"
+], p = /* @__PURE__ */ s({
+	__name: "DsSwitch",
+	props: {
+		modelValue: { type: Boolean },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		ariaLabel: { default: void 0 },
+		size: { default: "md" },
+		activeBackgroundColor: { default: void 0 },
+		inactiveBackgroundColor: { default: void 0 }
+	},
+	emits: ["update:modelValue"],
+	setup(s, { emit: p }) {
+		let m = (e) => e?.trim() || void 0, h = s, g = p, _ = r(() => e(h.size)), v = r(() => {
+			let e = h.modelValue, t = e ? "var(--primary)" : "var(--muted)", n = m(e ? h.activeBackgroundColor : h.inactiveBackgroundColor), r = n ?? t;
+			return {
+				"--ds-switch-track-bg": r,
+				"--ds-switch-track-brd": n ? r : e ? "var(--primary)" : "var(--brd)",
+				backgroundColor: "var(--ds-switch-track-bg)"
+			};
+		}), y = r(() => t({
+			size: h.size,
+			checked: h.modelValue
+		})), b = r(() => n(h.size));
+		function x() {
+			h.disabled || g("update:modelValue", !h.modelValue);
+		}
+		return (e, t) => (u(), a("button", {
+			type: "button",
+			role: "switch",
+			"aria-checked": h.modelValue ? "true" : "false",
+			"aria-label": h.ariaLabel,
+			disabled: h.disabled,
+			class: "inline-flex items-center gap-2 select-none disabled:opacity-50 disabled:cursor-not-allowed",
+			onClick: x
+		}, [o("span", {
+			"data-testid": "ds-switch-track",
+			class: c(_.value),
+			style: l(v.value)
+		}, [o("span", {
+			"data-testid": "ds-switch-thumb",
+			class: c(y.value),
+			"aria-hidden": "true"
+		}, null, 2)], 6), e.$slots.default ? (u(), a("span", {
+			key: 0,
+			class: c(b.value)
+		}, [d(e.$slots, "default")], 2)) : i("", !0)], 8, f));
+	}
+});
+//#endregion
+export { p as t };

package/dist/chunks/DsTable-apqrsbxV.js

@@ -0,0 +1,10 @@
+import { t as e } from "./_plugin-vue_export-helper-DOgycIVc.js";
+import { createElementBlock as t, createElementVNode as n, openBlock as r, renderSlot as i } from "vue";
+//#region src/components/DsTable/DsTable.vue
+var a = {}, o = { class: "overflow-x-auto rounded-[var(--ds-radius-lg)] border border-[var(--brd)] bg-[var(--card)]" }, s = { class: "min-w-full text-sm" }, c = { class: "bg-[var(--muted)] text-[var(--muted-fg)]" }, l = { class: "text-[var(--fg)]" };
+function u(e, a) {
+	return r(), t("div", o, [n("table", s, [n("thead", c, [i(e.$slots, "head")]), n("tbody", l, [i(e.$slots, "default")])])]);
+}
+var d = /* @__PURE__ */ e(a, [["render", u]]);
+//#endregion
+export { d as t };

package/dist/chunks/DsTabs-B1kkklFS.js

@@ -0,0 +1,47 @@
+import { Fragment as e, computed as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, defineComponent as a, normalizeClass as o, openBlock as s, renderList as c, toDisplayString as l } from "vue";
+//#region src/components/DsTabs/DsTabs.vue?vue&type=script&setup=true&lang.ts
+var u = ["aria-selected", "onClick"], d = { class: "inline-flex items-center gap-2" }, f = {
+	key: 0,
+	class: "text-[11px] px-1.5 py-0.5 rounded-full bg-[var(--secondary)] text-[var(--secondary-fg)]"
+}, p = /* @__PURE__ */ a({
+	__name: "DsTabs",
+	props: {
+		modelValue: {},
+		tabs: {}
+	},
+	emits: ["update:modelValue"],
+	setup(a, { emit: p }) {
+		let m = a, h = p, g = t(() => m.tabs.findIndex((e) => e.value === m.modelValue));
+		function _(e) {
+			h("update:modelValue", e);
+		}
+		function v(e) {
+			if (m.tabs.length === 0) return;
+			let t = g.value < 0 ? 0 : g.value;
+			if (e.key === "ArrowRight") {
+				e.preventDefault();
+				let n = m.tabs[(t + 1) % m.tabs.length];
+				n && _(n.value);
+			}
+			if (e.key === "ArrowLeft") {
+				e.preventDefault();
+				let n = m.tabs[(t - 1 + m.tabs.length) % m.tabs.length];
+				n && _(n.value);
+			}
+		}
+		return (t, a) => (s(), r("div", {
+			role: "tablist",
+			class: "inline-flex flex-wrap gap-1 rounded-[var(--ds-radius-lg)] border border-[var(--brd)] bg-[var(--muted)] p-1",
+			onKeydown: v
+		}, [(s(!0), r(e, null, c(m.tabs, (e) => (s(), r("button", {
+			key: e.value,
+			type: "button",
+			role: "tab",
+			"aria-selected": e.value === m.modelValue ? "true" : "false",
+			class: o(["h-9 px-3 rounded-[10px] text-sm font-600 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)]", e.value === m.modelValue ? "bg-[var(--card)] text-[var(--fg)] border border-[var(--brd)]" : "text-[var(--muted-fg)] hover:text-[var(--fg)] hover:bg-[color-mix(in_srgb,var(--card)_70%,transparent)]"]),
+			onClick: (t) => _(e.value)
+		}, [i("span", d, [i("span", null, l(e.label), 1), e.badge ? (s(), r("span", f, l(e.badge), 1)) : n("", !0)])], 10, u))), 128))], 32));
+	}
+});
+//#endregion
+export { p as t };

package/dist/chunks/DsTextarea-DVSsoqi3.js

@@ -0,0 +1,56 @@
+import { n as e } from "./config-B75oSW74.js";
+import { computed as t, createElementBlock as n, defineComponent as r, normalizeClass as i, openBlock as a } from "vue";
+//#region src/components/DsTextarea/DsTextarea.vue?vue&type=script&setup=true&lang.ts
+var o = [
+	"id",
+	"name",
+	"rows",
+	"autocomplete",
+	"placeholder",
+	"disabled",
+	"value",
+	"aria-invalid"
+], s = /* @__PURE__ */ r({
+	__name: "DsTextarea",
+	props: {
+		modelValue: {},
+		placeholder: { default: void 0 },
+		autocomplete: { default: void 0 },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		invalid: {
+			type: Boolean,
+			default: !1
+		},
+		state: { default: "default" },
+		name: { default: void 0 },
+		id: { default: void 0 },
+		rows: { default: 4 }
+	},
+	emits: ["update:modelValue"],
+	setup(r, { emit: s }) {
+		let c = r, l = s, u = t(() => e({
+			state: c.state,
+			invalid: c.invalid
+		}));
+		function d(e) {
+			l("update:modelValue", e.target.value);
+		}
+		return (e, t) => (a(), n("textarea", {
+			id: c.id,
+			name: c.name,
+			rows: c.rows,
+			autocomplete: c.autocomplete,
+			placeholder: c.placeholder,
+			disabled: c.disabled,
+			value: c.modelValue,
+			"aria-invalid": c.invalid ? "true" : void 0,
+			class: i(["w-full rounded-md border bg-[var(--bg)] px-3 py-2 text-[14px] text-[var(--fg)] placeholder:text-[var(--muted-fg)] transition-colors duration-150 focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] disabled:opacity-50 disabled:cursor-not-allowed", u.value]),
+			onInput: d
+		}, null, 42, o));
+	}
+});
+//#endregion
+export { s as t };

package/dist/chunks/DsToaster-B9u2x_Ii.js

@@ -0,0 +1,48 @@
+import { n as e, r as t, t as n } from "./x-circle-BZnfL2nz.js";
+import { t as r } from "./info-CmLOtVnO.js";
+import { t as i } from "./x-dGjszOU2.js";
+import { t as a } from "./DsButton-CA18Fha-.js";
+import { useToast as o } from "../composables/useToast.js";
+import { Fragment as s, Teleport as c, computed as l, createBlock as u, createCommentVNode as d, createElementBlock as f, createElementVNode as p, createVNode as m, defineComponent as h, normalizeStyle as g, openBlock as _, renderList as v, resolveDynamicComponent as y, toDisplayString as b, unref as x, withCtx as S } from "vue";
+//#region src/components/DsToaster/DsToaster.vue?vue&type=script&setup=true&lang.ts
+var C = { class: "fixed right-4 top-4 z-50 grid w-[360px] max-w-[calc(100vw-2rem)] gap-3" }, w = { class: "flex items-start gap-3" }, T = { class: "min-w-0 flex-1" }, E = { class: "text-[13px] font-700" }, D = {
+	key: 0,
+	class: "mt-0.5 text-[13px] ds-muted"
+}, O = /* @__PURE__ */ h({
+	__name: "DsToaster",
+	setup(h) {
+		let { list: O, dismiss: k } = o(), A = l(() => O.value);
+		function j(i) {
+			return i === "success" ? e : i === "warning" ? t : i === "danger" ? n : r;
+		}
+		function M(e) {
+			return e === "success" ? "var(--ds-success)" : e === "warning" ? "var(--ds-warning)" : e === "danger" ? "var(--ds-danger)" : "var(--ds-info)";
+		}
+		return (e, t) => (_(), u(c, { to: "body" }, [p("div", C, [(_(!0), f(s, null, v(A.value, (e) => (_(), f("div", {
+			key: e.id,
+			class: "rounded-[var(--ds-radius-lg)] border border-[var(--brd)] bg-[var(--card)] px-4 py-3 shadow-[var(--ds-shadow-2)]"
+		}, [p("div", w, [
+			(_(), u(y(j(e.variant)), {
+				class: "mt-0.5 h-5 w-5",
+				style: g({ color: M(e.variant) }),
+				"aria-hidden": "true"
+			}, null, 8, ["style"])),
+			p("div", T, [p("div", E, b(e.title), 1), e.message ? (_(), f("div", D, b(e.message), 1)) : d("", !0)]),
+			m(x(a), {
+				variant: "ghost",
+				size: "sm",
+				square: "",
+				"aria-label": "Dismiss",
+				onClick: (t) => x(k)(e.id)
+			}, {
+				default: S(() => [m(x(i), {
+					class: "h-4 w-4",
+					"aria-hidden": "true"
+				})]),
+				_: 1
+			}, 8, ["onClick"])
+		])]))), 128))])]));
+	}
+});
+//#endregion
+export { O as t };

package/dist/chunks/DsTooltip-BqNVJw2f.js

@@ -0,0 +1,27 @@
+import { t as e } from "./info-CmLOtVnO.js";
+import { createElementBlock as t, createElementVNode as n, createVNode as r, defineComponent as i, openBlock as a, renderSlot as o, toDisplayString as s, unref as c } from "vue";
+//#region src/components/DsTooltip/DsTooltip.vue?vue&type=script&setup=true&lang.ts
+var l = { class: "group relative inline-flex" }, u = {
+	role: "tooltip",
+	class: "pointer-events-none absolute bottom-[calc(100%+8px)] left-1/2 z-10 -translate-x-1/2 whitespace-nowrap rounded-md border border-[var(--brd)] bg-[var(--popover)] px-2 py-1 text-[12px] text-[var(--popover-fg)] opacity-0 shadow-[var(--ds-shadow-1)] transition-opacity duration-150 group-hover:opacity-100 group-focus-within:opacity-100"
+}, d = /* @__PURE__ */ i({
+	__name: "DsTooltip",
+	props: {
+		text: {},
+		iconColor: { default: "var(--muted-fg)" }
+	},
+	setup(i) {
+		let d = i, f = { "--ds-tooltip-icon-color": d.iconColor };
+		return (i, p) => (a(), t("span", l, [n("span", {
+			tabindex: "0",
+			class: "inline-flex items-center justify-center text-[var(--ds-tooltip-icon-color)] focus:outline-none",
+			"data-testid": "ds-tooltip-trigger",
+			style: f
+		}, [o(i.$slots, "default", {}, () => [r(c(e), {
+			class: "h-4 w-4",
+			"aria-hidden": "true"
+		})])]), n("span", u, s(d.text), 1)]));
+	}
+});
+//#endregion
+export { d as t };