iryx-ui 0.6.0 → 0.8.0

package/dist/packages/iryx-ui/src/components/DateRangePicker.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,210 @@
+import { ArrowLeft01Icon as e, ArrowRight01Icon as t, Calendar03Icon as n } from "../../../../node_modules/.pnpm/@hugeicons_core-free-icons@4.2.3/node_modules/@hugeicons/core-free-icons/dist/esm/index.js";
+import { useIryxUiConfig as r } from "../config.js";
+import i from "./Icon.js";
+import { useFormField as a } from "../composables/form.js";
+import { formatIsoDate as o, toCalendarDate as s, toIsoDate as c } from "../composables/date.js";
+import { datePickerTheme as ee } from "../theme/date-picker.js";
+import { Fragment as l, computed as u, createBlock as d, createCommentVNode as te, createElementBlock as f, createElementVNode as p, createTextVNode as m, createVNode as h, defineComponent as g, mergeModels as _, normalizeClass as v, openBlock as y, ref as b, renderList as x, shallowRef as S, toDisplayString as C, unref as w, useModel as ne, watch as T, withCtx as E } from "vue";
+import { PopoverContent as D, PopoverPortal as O, PopoverRoot as k, PopoverTrigger as A, RangeCalendarCell as re, RangeCalendarCellTrigger as j, RangeCalendarGrid as M, RangeCalendarGridBody as N, RangeCalendarGridHead as P, RangeCalendarGridRow as F, RangeCalendarHeadCell as I, RangeCalendarHeader as L, RangeCalendarHeading as R, RangeCalendarNext as z, RangeCalendarPrev as B, RangeCalendarRoot as V } from "reka-ui";
+//#region src/components/DateRangePicker.vue?vue&type=script&setup=true&lang.ts
+var H = [
+	"id",
+	"disabled",
+	"aria-invalid",
+	"aria-describedby"
+], U = { key: 0 }, W = /*@__PURE__*/ g({
+	__name: "DateRangePicker",
+	props: /*@__PURE__*/ _({
+		size: {},
+		placeholder: { default: "Pick a date range" },
+		disabled: { type: Boolean },
+		invalid: {
+			type: Boolean,
+			default: void 0
+		},
+		id: {},
+		min: {},
+		max: {},
+		locale: {},
+		format: {},
+		weekStartsOn: {},
+		months: { default: 2 },
+		clearable: { type: Boolean },
+		separator: { default: " – " },
+		clearLabel: { default: "Clear" },
+		previousLabel: { default: "Previous month" },
+		nextLabel: { default: "Next month" },
+		unstyled: {
+			type: Boolean,
+			default: void 0
+		},
+		class: {},
+		ui: {}
+	}, {
+		modelValue: { default: () => ({
+			start: null,
+			end: null
+		}) },
+		modelModifiers: {}
+	}),
+	emits: ["update:modelValue"],
+	setup(g) {
+		let _ = g, W = ne(g, "modelValue"), G = b(!1), K = a(), q = u(() => _.id ?? K?.id.value), J = u(() => _.invalid ?? K?.invalid.value ?? !1), Y = r(), ie = u(() => _.unstyled ?? Y.unstyled), X = S({
+			start: s(W.value?.start),
+			end: s(W.value?.end)
+		});
+		function Z(e) {
+			return c(e.start) === (W.value?.start ?? null) && c(e.end) === (W.value?.end ?? null);
+		}
+		T(W, () => {
+			Z(X.value) || (X.value = {
+				start: s(W.value?.start),
+				end: s(W.value?.end)
+			});
+		}, { deep: !0 }), T(X, (e) => {
+			Z(e) || (W.value = {
+				start: c(e.start),
+				end: c(e.end)
+			});
+		});
+		let ae = u(() => s(_.min)), oe = u(() => s(_.max)), Q = u(() => {
+			let e = o(W.value?.start, _.locale, _.format), t = o(W.value?.end, _.locale, _.format);
+			return !e && !t ? "" : t ? `${e}${_.separator}${t}` : e;
+		});
+		T(W, (e) => {
+			G.value && e?.start && e?.end && (G.value = !1);
+		}, { deep: !0 });
+		function se() {
+			W.value = {
+				start: null,
+				end: null
+			}, G.value = !1;
+		}
+		let ce = u(() => ee({
+			size: _.size,
+			invalid: J.value,
+			range: !0
+		}));
+		function $(e, t) {
+			let n = _.ui?.[e];
+			return ie.value ? [n, t] : ce.value[e]({ class: [n, t] });
+		}
+		return (r, a) => (y(), d(w(k), {
+			open: G.value,
+			"onUpdate:open": a[1] ||= (e) => G.value = e
+		}, {
+			default: E(() => [h(w(A), { "as-child": "" }, {
+				default: E(() => [p("button", {
+					id: q.value,
+					type: "button",
+					disabled: _.disabled,
+					"aria-invalid": J.value || void 0,
+					"aria-describedby": w(K)?.describedBy.value,
+					class: v($("trigger", _.class))
+				}, [Q.value ? (y(), f("span", U, C(Q.value), 1)) : (y(), f("span", {
+					key: 1,
+					class: v($("placeholder"))
+				}, C(_.placeholder), 3)), h(i, { icon: w(n) }, null, 8, ["icon"])], 10, H)]),
+				_: 1
+			}), h(w(O), null, {
+				default: E(() => [h(w(D), {
+					class: v($("content")),
+					"side-offset": 4,
+					align: "start"
+				}, {
+					default: E(() => [h(w(V), {
+						modelValue: X.value,
+						"onUpdate:modelValue": a[0] ||= (e) => X.value = e,
+						"min-value": ae.value,
+						"max-value": oe.value,
+						locale: _.locale,
+						"week-starts-on": _.weekStartsOn,
+						"number-of-months": _.months,
+						"fixed-weeks": "",
+						"initial-focus": ""
+					}, {
+						default: E(({ grid: n, weekDays: r }) => [h(w(L), { class: v($("header")) }, {
+							default: E(() => [
+								h(w(B), {
+									"aria-label": _.previousLabel,
+									class: v($("nav"))
+								}, {
+									default: E(() => [h(i, { icon: w(e) }, null, 8, ["icon"])]),
+									_: 1
+								}, 8, ["aria-label", "class"]),
+								h(w(R), { class: v($("heading")) }, null, 8, ["class"]),
+								h(w(z), {
+									"aria-label": _.nextLabel,
+									class: v($("nav"))
+								}, {
+									default: E(() => [h(i, { icon: w(t) }, null, 8, ["icon"])]),
+									_: 1
+								}, 8, ["aria-label", "class"])
+							]),
+							_: 1
+						}, 8, ["class"]), p("div", { class: v($("months")) }, [(y(!0), f(l, null, x(n, (e) => (y(), d(w(M), {
+							key: e.value.toString(),
+							class: v($("grid"))
+						}, {
+							default: E(() => [h(w(P), null, {
+								default: E(() => [h(w(F), null, {
+									default: E(() => [(y(!0), f(l, null, x(r, (e) => (y(), d(w(I), {
+										key: e,
+										class: v($("headCell"))
+									}, {
+										default: E(() => [m(C(e), 1)]),
+										_: 2
+									}, 1032, ["class"]))), 128))]),
+									_: 2
+								}, 1024)]),
+								_: 2
+							}, 1024), h(w(N), null, {
+								default: E(() => [(y(!0), f(l, null, x(e.rows, (t, n) => (y(), d(w(F), { key: `week-${n}` }, {
+									default: E(() => [(y(!0), f(l, null, x(t, (t) => (y(), d(w(re), {
+										key: t.toString(),
+										date: t,
+										class: v($("cell"))
+									}, {
+										default: E(() => [h(w(j), {
+											day: t,
+											month: e.value,
+											class: v($("cellTrigger"))
+										}, null, 8, [
+											"day",
+											"month",
+											"class"
+										])]),
+										_: 2
+									}, 1032, ["date", "class"]))), 128))]),
+									_: 2
+								}, 1024))), 128))]),
+								_: 2
+							}, 1024)]),
+							_: 2
+						}, 1032, ["class"]))), 128))], 2)]),
+						_: 1
+					}, 8, [
+						"modelValue",
+						"min-value",
+						"max-value",
+						"locale",
+						"week-starts-on",
+						"number-of-months"
+					]), _.clearable ? (y(), f("div", {
+						key: 0,
+						class: v($("footer"))
+					}, [p("button", {
+						type: "button",
+						class: v($("action")),
+						onClick: se
+					}, C(_.clearLabel), 3)], 2)) : te("", !0)]),
+					_: 1
+				}, 8, ["class"])]),
+				_: 1
+			})]),
+			_: 1
+		}, 8, ["open"]));
+	}
+});
+//#endregion
+export { W as default };

package/dist/packages/iryx-ui/src/components/FileUpload.js

@@ -0,0 +1,5 @@
+import e from "./FileUpload.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/FileUpload.vue
+var t = e;
+//#endregion
+export { t as default };

package/dist/packages/iryx-ui/src/components/FileUpload.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,209 @@
+import { Delete02Icon as e, File01Icon as t, Upload05Icon as n } from "../../../../node_modules/.pnpm/@hugeicons_core-free-icons@4.2.3/node_modules/@hugeicons/core-free-icons/dist/esm/index.js";
+import { useIryxUiConfig as r } from "../config.js";
+import i from "./Icon.js";
+import a from "./Button.js";
+import { useFormField as o } from "../composables/form.js";
+import { fileUploadTheme as s } from "../theme/file-upload.js";
+import { Fragment as c, computed as l, createCommentVNode as u, createElementBlock as d, createElementVNode as f, createTextVNode as p, createVNode as m, defineComponent as h, mergeModels as g, normalizeClass as _, onBeforeUnmount as v, openBlock as y, ref as b, renderList as x, toDisplayString as S, unref as C, useModel as w, watch as T, withCtx as E, withModifiers as D } from "vue";
+//#region src/components/FileUpload.vue?vue&type=script&setup=true&lang.ts
+var O = [
+	"id",
+	"multiple",
+	"accept",
+	"disabled",
+	"aria-invalid",
+	"aria-describedby"
+], k = ["src"], A = [
+	"aria-label",
+	"disabled",
+	"onClick"
+], j = /*@__PURE__*/ h({
+	__name: "FileUpload",
+	props: /*@__PURE__*/ g({
+		multiple: { type: Boolean },
+		accept: {},
+		maxSize: {},
+		maxFiles: {},
+		disabled: { type: Boolean },
+		invalid: {
+			type: Boolean,
+			default: void 0
+		},
+		id: {},
+		label: { default: "Drag and drop a file here" },
+		hint: {},
+		browseLabel: { default: "Browse files" },
+		removeLabel: { default: "Remove" },
+		tooLargeText: { default: "is too large" },
+		wrongTypeText: { default: "is not an accepted type" },
+		tooManyText: { default: "exceeds the file limit" },
+		unstyled: {
+			type: Boolean,
+			default: void 0
+		},
+		class: {},
+		ui: {}
+	}, {
+		modelValue: { default: () => [] },
+		modelModifiers: {}
+	}),
+	emits: /*@__PURE__*/ g(["reject"], ["update:modelValue"]),
+	setup(h, { emit: g }) {
+		let j = h, ee = g, M = w(h, "modelValue"), N = o(), P = l(() => j.id ?? N?.id.value), F = l(() => j.invalid ?? N?.invalid.value ?? !1), I = r(), L = l(() => j.unstyled ?? I.unstyled), R = b([]);
+		function z(e) {
+			if (!j.accept) return !0;
+			let t = e.name.toLowerCase(), n = e.type.toLowerCase();
+			return j.accept.split(",").map((e) => e.trim().toLowerCase()).filter(Boolean).some((e) => e.startsWith(".") ? t.endsWith(e) : e.endsWith("/*") ? n.startsWith(e.slice(0, -1)) : n === e);
+		}
+		function B(e) {
+			let t = [], n = [], r = j.multiple ? M.value : [];
+			for (let i of e) {
+				if (!z(i)) {
+					n.push({
+						file: i,
+						reason: "type"
+					});
+					continue;
+				}
+				if (j.maxSize != null && i.size > j.maxSize) {
+					n.push({
+						file: i,
+						reason: "size"
+					});
+					continue;
+				}
+				let e = j.multiple ? j.maxFiles : 1;
+				if (e != null && r.length + t.length >= e) {
+					n.push({
+						file: i,
+						reason: "count"
+					});
+					continue;
+				}
+				t.push(i);
+			}
+			R.value = n, n.length && ee("reject", n), t.length && (M.value = [...r, ...t]);
+		}
+		let V = b();
+		function H(e) {
+			let t = e.target;
+			B([...t.files ?? []]), t.value = "";
+		}
+		function U(e) {
+			M.value = M.value.filter((t, n) => n !== e);
+		}
+		let W = b(0), G = l(() => W.value > 0);
+		function K() {
+			j.disabled || W.value++;
+		}
+		function q() {
+			W.value > 0 && W.value--;
+		}
+		function J(e) {
+			W.value = 0, !j.disabled && B([...e.dataTransfer?.files ?? []]);
+		}
+		let Y = b(/* @__PURE__ */ new Map());
+		T(M, (e) => {
+			for (let [t, n] of Y.value) e.includes(t) || (URL.revokeObjectURL(n), Y.value.delete(t));
+			for (let t of e) t.type.startsWith("image/") && !Y.value.has(t) && Y.value.set(t, URL.createObjectURL(t));
+		}, {
+			immediate: !0,
+			deep: !0
+		}), v(() => {
+			for (let e of Y.value.values()) URL.revokeObjectURL(e);
+		});
+		function X(e) {
+			let t = [
+				"B",
+				"kB",
+				"MB",
+				"GB"
+			], n = e, r = 0;
+			for (; n >= 1024 && r < t.length - 1;) n /= 1024, r++;
+			return `${r === 0 ? n : Math.round(n * 10) / 10} ${t[r]}`;
+		}
+		function Z(e) {
+			let t = e.reason === "size" ? j.tooLargeText : e.reason === "type" ? j.wrongTypeText : j.tooManyText;
+			return `${e.file.name} ${t}`;
+		}
+		let Q = l(() => s({
+			dragging: G.value,
+			invalid: F.value,
+			disabled: j.disabled
+		}));
+		function $(e, t) {
+			let n = j.ui?.[e];
+			return L.value ? [n, t] : Q.value[e]({ class: [n, t] });
+		}
+		let te = l(() => L.value ? j.ui?.browse : Q.value.browse({ class: j.ui?.browse }));
+		return (r, o) => (y(), d("div", { class: _($("root", j.class)) }, [
+			f("label", {
+				class: _($("dropzone")),
+				onDragenter: D(K, ["prevent"]),
+				onDragover: o[0] ||= D(() => {}, ["prevent"]),
+				onDragleave: D(q, ["prevent"]),
+				onDrop: D(J, ["prevent"])
+			}, [
+				f("input", {
+					id: P.value,
+					ref_key: "inputEl",
+					ref: V,
+					type: "file",
+					multiple: j.multiple,
+					accept: j.accept,
+					disabled: j.disabled,
+					"aria-invalid": F.value || void 0,
+					"aria-describedby": C(N)?.describedBy.value,
+					class: _($("input")),
+					onChange: H
+				}, null, 42, O),
+				f("span", { class: _($("icon")) }, [m(i, { icon: C(n) }, null, 8, ["icon"])], 2),
+				f("span", { class: _($("label")) }, S(j.label), 3),
+				j.hint ? (y(), d("span", {
+					key: 0,
+					class: _($("hint"))
+				}, S(j.hint), 3)) : u("", !0),
+				m(a, {
+					as: "span",
+					variant: "outline",
+					size: "sm",
+					class: _(te.value)
+				}, {
+					default: E(() => [p(S(j.browseLabel), 1)]),
+					_: 1
+				}, 8, ["class"])
+			], 34),
+			(y(!0), d(c, null, x(R.value, (e) => (y(), d("p", {
+				key: e.file.name,
+				class: _($("error"))
+			}, S(Z(e)), 3))), 128)),
+			M.value.length ? (y(), d("ul", {
+				key: 0,
+				class: _($("list"))
+			}, [(y(!0), d(c, null, x(M.value, (n, r) => (y(), d("li", {
+				key: `${n.name}-${r}`,
+				class: _($("item"))
+			}, [
+				Y.value.get(n) ? (y(), d("img", {
+					key: 0,
+					src: Y.value.get(n),
+					alt: "",
+					class: _($("thumbnail"))
+				}, null, 10, k)) : (y(), d("span", {
+					key: 1,
+					class: _($("placeholder"))
+				}, [m(i, { icon: C(t) }, null, 8, ["icon"])], 2)),
+				f("span", { class: _($("details")) }, [f("span", { class: _($("name")) }, S(n.name), 3), f("span", { class: _($("meta")) }, S(X(n.size)), 3)], 2),
+				f("button", {
+					type: "button",
+					"aria-label": `${j.removeLabel} ${n.name}`,
+					disabled: j.disabled,
+					class: _($("remove")),
+					onClick: (e) => U(r)
+				}, [m(i, { icon: C(e) }, null, 8, ["icon"])], 10, A)
+			], 2))), 128))], 2)) : u("", !0)
+		], 2));
+	}
+});
+//#endregion
+export { j as default };

package/dist/packages/iryx-ui/src/components/Input.vue_vue_type_script_setup_true_lang.js

@@ -1,19 +1,23 @@
-import { useIryxUiConfig as e } from "../config.js";
-import { useFormField as t } from "../composables/form.js";
-import { inputTheme as n } from "../theme/input.js";
-import { computed as r, createElementBlock as i, defineComponent as a, mergeModels as o, normalizeClass as s, openBlock as c, unref as l, useModel as u, vModelDynamic as d, withDirectives as f } from "vue";
+import { Cancel01Icon as e, Loading03Icon as t } from "../../../../node_modules/.pnpm/@hugeicons_core-free-icons@4.2.3/node_modules/@hugeicons/core-free-icons/dist/esm/index.js";
+import { useIryxUiConfig as n } from "../config.js";
+import r from "./Icon.js";
+import { useFormField as i } from "../composables/form.js";
+import { inputTheme as a } from "../theme/input.js";
+import { computed as o, createBlock as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createVNode as d, defineComponent as f, mergeModels as p, mergeProps as m, normalizeClass as h, onBeforeUnmount as g, openBlock as _, ref as v, renderSlot as y, unref as b, useModel as x, useSlots as S, watch as C, withKeys as w } from "vue";
 //#region src/components/Input.vue?vue&type=script&setup=true&lang.ts
-var p = [
+var T = [
 	"id",
+	"value",
 	"type",
 	"placeholder",
 	"disabled",
 	"required",
 	"aria-invalid",
 	"aria-describedby"
-], m = /*@__PURE__*/ a({
+], E = ["aria-label"], D = /*@__PURE__*/ f({
+	inheritAttrs: !1,
 	__name: "Input",
-	props: /*@__PURE__*/ o({
+	props: /*@__PURE__*/ p({
 		type: { default: "text" },
 		size: {},
 		placeholder: {},
@@ -24,34 +28,99 @@ var p = [
 			default: void 0
 		},
 		id: {},
+		clearable: { type: Boolean },
+		loading: { type: Boolean },
+		debounce: { default: 0 },
+		clearLabel: { default: "Clear" },
 		unstyled: {
 			type: Boolean,
 			default: void 0
 		},
-		class: {}
+		class: {},
+		ui: {}
 	}, {
 		modelValue: {},
 		modelModifiers: {}
 	}),
 	emits: ["update:modelValue"],
-	setup(a) {
-		let o = a, m = u(a, "modelValue"), h = t(), g = r(() => o.id ?? h?.id.value), _ = r(() => o.invalid ?? h?.invalid.value ?? !1), v = e(), y = r(() => o.unstyled ?? v.unstyled), b = r(() => y.value ? o.class : n({
-			size: o.size,
-			invalid: _.value,
-			class: o.class
+	setup(f, { expose: p }) {
+		let D = f, O = x(f, "modelValue"), k = S(), A = i(), j = o(() => D.id ?? A?.id.value), M = o(() => D.invalid ?? A?.invalid.value ?? !1), N = n(), P = o(() => D.unstyled ?? N.unstyled), F = v(O.value), I;
+		function L() {
+			I !== void 0 && (clearTimeout(I), I = void 0);
+		}
+		C(O, (e) => {
+			L(), F.value = e;
+		});
+		function R(e) {
+			let t = e.target.value;
+			if (F.value = t, L(), !D.debounce) {
+				O.value = t;
+				return;
+			}
+			I = setTimeout(() => {
+				I = void 0, O.value = t;
+			}, D.debounce);
+		}
+		function z() {
+			I !== void 0 && (L(), O.value = F.value);
+		}
+		g(L);
+		let B = v();
+		function V() {
+			L(), F.value = "", O.value = "", B.value?.focus();
+		}
+		p({ input: B });
+		let H = o(() => F.value !== "" && F.value != null), U = o(() => D.clearable && H.value && !D.disabled), W = o(() => D.loading || U.value || !!k.trailing), G = o(() => a({
+			size: D.size,
+			invalid: M.value
 		}));
-		return (e, t) => f((c(), i("input", {
-			id: g.value,
-			"onUpdate:modelValue": t[0] ||= (e) => m.value = e,
-			type: o.type,
-			placeholder: o.placeholder,
-			disabled: o.disabled,
-			required: o.required,
-			"aria-invalid": _.value || void 0,
-			"aria-describedby": l(h)?.describedBy.value,
-			class: s(b.value)
-		}, null, 10, p)), [[d, m.value]]);
+		function K(e, t) {
+			let n = D.ui?.[e];
+			return P.value ? [n, t] : G.value[e]({ class: [n, t] });
+		}
+		return (n, i) => (_(), l("div", { class: h(K("root", D.class)) }, [
+			b(k).leading ? (_(), l("span", {
+				key: 0,
+				class: h(K("leading"))
+			}, [y(n.$slots, "leading")], 2)) : c("", !0),
+			u("input", m({
+				id: j.value,
+				ref_key: "inputEl",
+				ref: B,
+				value: F.value,
+				type: D.type,
+				placeholder: D.placeholder,
+				disabled: D.disabled,
+				required: D.required,
+				"aria-invalid": M.value || void 0,
+				"aria-describedby": b(A)?.describedBy.value,
+				class: K("input")
+			}, n.$attrs, {
+				onInput: R,
+				onBlur: z,
+				onKeydown: w(z, ["enter"])
+			}), null, 16, T),
+			W.value ? (_(), l("span", {
+				key: 1,
+				class: h(K("trailing"))
+			}, [
+				y(n.$slots, "trailing"),
+				U.value ? (_(), l("button", {
+					key: 0,
+					type: "button",
+					tabindex: "-1",
+					"aria-label": D.clearLabel,
+					class: h(K("clear")),
+					onClick: V
+				}, [d(r, { icon: b(e) }, null, 8, ["icon"])], 10, E)) : c("", !0),
+				D.loading ? (_(), s(r, {
+					key: 1,
+					icon: b(t),
+					class: "animate-spin"
+				}, null, 8, ["icon"])) : c("", !0)
+			], 2)) : c("", !0)
+		], 2));
 	}
 });
 //#endregion
-export { m as default };
+export { D as default };

package/dist/packages/iryx-ui/src/components/PasswordInput.js

@@ -0,0 +1,5 @@
+import e from "./PasswordInput.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/PasswordInput.vue
+var t = e;
+//#endregion
+export { t as default };

package/dist/packages/iryx-ui/src/components/PasswordInput.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,113 @@
+import { ViewIcon as e, ViewOffIcon as t } from "../../../../node_modules/.pnpm/@hugeicons_core-free-icons@4.2.3/node_modules/@hugeicons/core-free-icons/dist/esm/index.js";
+import { useIryxUiConfig as n } from "../config.js";
+import r from "./Icon.js";
+import i from "./Input.js";
+import { passwordInputTheme as a } from "../theme/password-input.js";
+import { Fragment as o, computed as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createSlots as d, createVNode as f, defineComponent as p, mergeModels as m, mergeProps as h, normalizeClass as g, openBlock as _, ref as v, renderList as y, toDisplayString as b, unref as x, useModel as S, withCtx as C } from "vue";
+//#region src/components/PasswordInput.vue?vue&type=script&setup=true&lang.ts
+var w = [
+	"aria-label",
+	"aria-pressed",
+	"disabled"
+], T = ["data-filled"], E = /*@__PURE__*/ p({
+	inheritAttrs: !1,
+	__name: "PasswordInput",
+	props: /*@__PURE__*/ m({
+		size: {},
+		placeholder: {},
+		disabled: { type: Boolean },
+		required: { type: Boolean },
+		invalid: {
+			type: Boolean,
+			default: void 0
+		},
+		id: {},
+		toggle: {
+			type: Boolean,
+			default: !0
+		},
+		strength: { type: Boolean },
+		showLabel: { default: "Show password" },
+		hideLabel: { default: "Hide password" },
+		strengthLabels: { default: () => [
+			"Weak",
+			"Fair",
+			"Good",
+			"Strong"
+		] },
+		unstyled: {
+			type: Boolean,
+			default: void 0
+		},
+		class: {},
+		ui: {}
+	}, {
+		modelValue: { default: "" },
+		modelModifiers: {}
+	}),
+	emits: ["update:modelValue"],
+	setup(p) {
+		let m = p, E = S(p, "modelValue"), D = n(), O = s(() => m.unstyled ?? D.unstyled), k = v(!1), A = s(() => {
+			let e = E.value;
+			if (!e) return 0;
+			let t = 0;
+			return e.length >= 8 && t++, e.length >= 12 && t++, /[a-z]/.test(e) && /[A-Z]/.test(e) && t++, /\d/.test(e) && t++, /[^\w\s]/.test(e) && t++, Math.max(1, Math.min(t, 4));
+		}), j = s(() => m.strength && E.value.length > 0), M = s(() => a({ score: A.value })), N = s(() => O.value ? m.ui?.input : M.value.input({ class: m.ui?.input }));
+		function P(e, t) {
+			let n = m.ui?.[e];
+			return O.value ? [n, t] : M.value[e]({ class: [n, t] });
+		}
+		return (n, a) => (_(), l("div", { class: g(P("root", m.class)) }, [f(i, h({
+			id: m.id,
+			modelValue: E.value,
+			"onUpdate:modelValue": a[1] ||= (e) => E.value = e,
+			type: k.value ? "text" : "password",
+			size: m.size,
+			placeholder: m.placeholder,
+			disabled: m.disabled,
+			required: m.required,
+			invalid: m.invalid,
+			unstyled: m.unstyled,
+			ui: { input: N.value },
+			autocomplete: "current-password"
+		}, n.$attrs), d({ _: 2 }, [m.toggle ? {
+			name: "trailing",
+			fn: C(() => [u("button", {
+				type: "button",
+				tabindex: "-1",
+				"aria-label": k.value ? m.hideLabel : m.showLabel,
+				"aria-pressed": k.value,
+				disabled: m.disabled,
+				class: g(P("toggle")),
+				onClick: a[0] ||= (e) => k.value = !k.value
+			}, [f(r, { icon: k.value ? x(t) : x(e) }, null, 8, ["icon"])], 10, w)]),
+			key: "0"
+		} : void 0]), 1040, [
+			"id",
+			"modelValue",
+			"type",
+			"size",
+			"placeholder",
+			"disabled",
+			"required",
+			"invalid",
+			"unstyled",
+			"ui"
+		]), j.value ? (_(), l("div", {
+			key: 0,
+			class: g(P("meter"))
+		}, [u("div", {
+			class: g(P("track")),
+			"aria-hidden": "true"
+		}, [(_(), l(o, null, y(4, (e) => u("span", {
+			key: e,
+			"data-filled": e <= A.value ? "" : void 0,
+			class: g(P("segment"))
+		}, null, 10, T)), 64))], 2), u("span", {
+			class: g(P("label")),
+			role: "status"
+		}, b(m.strengthLabels[A.value - 1]), 3)], 2)) : c("", !0)], 2));
+	}
+});
+//#endregion
+export { E as default };