@anguszhu/kroma-ui 0.1.0

package/dist/kroma-vue.js

@@ -0,0 +1,706 @@
+import { Fragment as e, Transition as t, computed as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createTextVNode as s, createVNode as c, defineComponent as l, inject as u, mergeProps as d, normalizeClass as f, normalizeStyle as p, onBeforeUnmount as m, openBlock as h, provide as g, ref as _, renderList as v, renderSlot as y, toDisplayString as b, unref as x, vModelCheckbox as S, vModelText as C, vShow as w, watch as T, withCtx as E, withDirectives as D, withKeys as O, withModifiers as k } from "vue";
+//#endregion
+//#region src/vue/components/KrButton.vue
+var A = /* @__PURE__ */ l({
+	__name: "KrButton",
+	props: { type: { default: "primary" } },
+	setup(e) {
+		return (t, n) => (h(), a("button", { class: f(["kr-button", "kr-button--" + e.type]) }, [y(t.$slots, "default")], 2));
+	}
+}), j = /* @__PURE__ */ l({
+	__name: "KrOverlay",
+	props: {
+		modelValue: { type: Boolean },
+		centered: {
+			type: Boolean,
+			default: !1
+		},
+		background: {},
+		contentStyle: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] },
+		contentTransition: { default: "fade-in" }
+	},
+	emits: ["update:modelValue"],
+	setup(e, { emit: n }) {
+		let s = n;
+		return (n, c) => (h(), r(t, { name: `kr-${e.contentTransition}-content` }, {
+			default: E(() => [e.modelValue ? (h(), a("div", {
+				key: 0,
+				class: f(["kr-overlay", { "kr-overlay--centered": e.centered }]),
+				style: p({ "--kr-overlay-background": e.background }),
+				role: "application"
+			}, [o("div", {
+				class: "kr-overlay__scrim",
+				onClick: c[0] ||= (e) => s("update:modelValue", !1)
+			}), o("div", {
+				class: "kr-overlay__content",
+				style: p(e.contentStyle)
+			}, [y(n.$slots, "default")], 4)], 6)) : i("", !0)]),
+			_: 3
+		}, 8, ["name"]));
+	}
+}), ee = { class: "kr-section" }, te = {
+	key: 0,
+	class: "kr-section__header"
+}, ne = {
+	key: 0,
+	class: "kr-section__title"
+}, M = {
+	key: 1,
+	class: "kr-section__subtitle"
+}, N = { class: "kr-section__content" }, P = /* @__PURE__ */ l({
+	__name: "KrSection",
+	props: {
+		title: {},
+		subtitle: {}
+	},
+	setup(e) {
+		return (t, n) => (h(), a("section", ee, [e.title || e.subtitle ? (h(), a("header", te, [e.title ? (h(), a("h1", ne, b(e.title), 1)) : i("", !0), e.subtitle ? (h(), a("h2", M, b(e.subtitle), 1)) : i("", !0)])) : i("", !0), o("div", N, [y(t.$slots, "default")])]));
+	}
+}), F = ["title"], I = [
+	"name",
+	"value",
+	"checked",
+	"disabled",
+	"aria-label"
+], L = { class: "kr-select-item__content" }, R = {
+	key: 0,
+	class: "kr-select-item__label"
+}, z = /* @__PURE__ */ l({
+	__name: "KrSelectItem",
+	props: {
+		value: {},
+		label: {},
+		title: {},
+		selected: {},
+		disabled: { type: Boolean },
+		variant: { default: "default" },
+		shape: { default: "rounded" },
+		circle: { type: Boolean },
+		stretch: { type: Boolean },
+		showItemLabel: {
+			type: Boolean,
+			default: !0
+		}
+	},
+	emits: ["update:selected", "select"],
+	setup(e, { emit: t }) {
+		let r = e, s = t, c = u("krSelectGroupContext", null), l = n(() => (c?.modelValue?.value ?? r.selected) === r.value), d = n(() => c?.variant?.value ?? r.variant), p = n(() => r.circle ? "circle" : c?.shape?.value ?? r.shape), m = n(() => c?.showItemLabel?.value ?? r.showItemLabel ? r.label ?? r.title : "");
+		function g() {
+			r.disabled || (s("update:selected", r.value), s("select", r.value), c?.onSelect?.(r.value));
+		}
+		let _ = n(() => ({
+			"kr-select-item": !0,
+			"kr-select-item--selected": l.value,
+			"kr-select-item--disabled": r.disabled,
+			"kr-select-item--stretch": r.stretch,
+			[`kr-select-item--${d.value}`]: !0,
+			[`kr-select-item--${p.value}`]: !0
+		}));
+		return (t, n) => (h(), a("label", {
+			class: f(["kr-select-item", _.value]),
+			title: e.title
+		}, [
+			o("input", {
+				class: "kr-select-item__input",
+				type: "radio",
+				name: x(c)?.name,
+				value: e.value,
+				checked: l.value,
+				disabled: e.disabled,
+				"aria-label": e.label || e.title || String(e.value),
+				onChange: g
+			}, null, 40, I),
+			o("div", L, [y(t.$slots, "default")]),
+			m.value ? (h(), a("div", R, b(m.value), 1)) : i("", !0)
+		], 10, F));
+	}
+}), B = {
+	key: 0,
+	class: "kr-select-group__header"
+}, V = {
+	key: 0,
+	class: "kr-select-group__header__title"
+}, H = {
+	key: 1,
+	class: "kr-select-group__header__subtitle"
+}, U = {
+	key: 1,
+	class: "kr-select-item-icon",
+	viewBox: "0 0 32 32"
+}, W = ["d"], G = /* @__PURE__ */ l({
+	__name: "KrSelectGroup",
+	props: {
+		title: {},
+		subtitle: {},
+		items: {},
+		showItemLabel: {
+			type: Boolean,
+			default: !0
+		},
+		showTooltip: {
+			type: Boolean,
+			default: !0
+		},
+		modelValue: {},
+		hideSeparator: { type: Boolean },
+		columns: { default: "auto" },
+		gap: { default: "12px" },
+		variant: { default: "default" },
+		shape: { default: "rounded" }
+	},
+	emits: ["update:modelValue"],
+	setup(t, { emit: c }) {
+		let l = t, u = c, d = `kr-select-group-${Math.random().toString(36).slice(2)}`, m = n(() => l.columns === "auto" ? {
+			display: "flex",
+			flexWrap: "wrap",
+			gap: l.gap
+		} : {
+			display: "grid",
+			gridTemplateColumns: `repeat(${l.columns}, 1fr)`,
+			gap: l.gap
+		});
+		function _(e) {
+			u("update:modelValue", e);
+		}
+		return g("krSelectGroupContext", {
+			modelValue: n(() => l.modelValue),
+			variant: n(() => l.variant),
+			shape: n(() => l.shape),
+			showItemLabel: n(() => l.showItemLabel),
+			name: d,
+			onSelect: _
+		}), (n, c) => (h(), a("div", { class: f(["kr-select-group", { "kr-select-group--with-separator": !t.hideSeparator }]) }, [t.title || t.subtitle ? (h(), a("div", B, [t.title ? (h(), a("div", V, b(t.title), 1)) : i("", !0), t.subtitle ? (h(), a("div", H, b(t.subtitle), 1)) : i("", !0)])) : i("", !0), o("div", {
+			class: "kr-select-group__items",
+			style: p(m.value)
+		}, [n.$slots.item ? (h(!0), a(e, { key: 0 }, v(t.items, (e) => y(n.$slots, "item", {
+			item: e,
+			selected: t.modelValue === e.value,
+			setSelected: _
+		}, void 0, void 0, e.value)), 128)) : (h(!0), a(e, { key: 1 }, v(t.items, (n) => (h(), r(z, {
+			key: n.value,
+			value: n.value,
+			label: n.label,
+			selected: t.modelValue,
+			disabled: n.disabled,
+			variant: t.variant,
+			shape: t.shape,
+			"show-item-label": t.showItemLabel,
+			title: t.showTooltip ? n.label : void 0,
+			onSelect: _
+		}, {
+			default: E(() => [t.variant === "color" ? (h(), a("div", {
+				key: 0,
+				class: "kr-color-swatch",
+				style: p({ background: n.hex })
+			}, null, 4)) : t.variant === "icon" && n.icon ? (h(), a("svg", U, [o("path", { d: n.icon }, null, 8, W)])) : (h(), a(e, { key: 2 }, [s(b(n.label), 1)], 64))]),
+			_: 2
+		}, 1032, [
+			"value",
+			"label",
+			"selected",
+			"disabled",
+			"variant",
+			"shape",
+			"show-item-label",
+			"title"
+		]))), 128))], 4)], 2));
+	}
+}), K = ["data-checked", "data-disabled"], q = /* @__PURE__ */ l({
+	__name: "KrSwitch",
+	props: {
+		modelValue: {
+			type: Boolean,
+			default: !1
+		},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		inset: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	setup(e) {
+		return (t, n) => (h(), a("div", {
+			class: f(["kr-switch", { "kr-switch--inset": e.inset }]),
+			"data-checked": e.modelValue,
+			"data-disabled": e.disabled,
+			"aria-hidden": "true"
+		}, [...n[0] ||= [o("div", { class: "kr-switch__track" }, null, -1), o("div", { class: "kr-switch__thumb" }, null, -1)]], 10, K));
+	}
+}), J = ["disabled", "aria-label"], Y = { class: "kr-toggle-row__label" }, X = {
+	key: 0,
+	class: "kr-toggle-row__title"
+}, Z = {
+	key: 1,
+	class: "kr-toggle-row__subtitle"
+}, re = /* @__PURE__ */ l({
+	__name: "KrToggleRow",
+	props: {
+		modelValue: {
+			type: Boolean,
+			default: !1
+		},
+		title: {},
+		subtitle: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		hideSeparator: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["update:modelValue"],
+	setup(e, { emit: t }) {
+		let r = e, s = t, l = n({
+			get() {
+				return r.modelValue;
+			},
+			set(e) {
+				s("update:modelValue", e);
+			}
+		});
+		return (t, n) => (h(), a("label", { class: f(["kr-toggle-row", {
+			"kr-toggle-row--with-separator": !e.hideSeparator,
+			"kr-toggle-row--disabled": e.disabled
+		}]) }, [
+			D(o("input", {
+				class: "kr-toggle-row__native",
+				type: "checkbox",
+				role: "switch",
+				"onUpdate:modelValue": n[0] ||= (e) => l.value = e,
+				disabled: e.disabled,
+				"aria-label": e.title
+			}, null, 8, J), [[S, l.value]]),
+			o("div", Y, [e.title ? (h(), a("div", X, b(e.title), 1)) : i("", !0), e.subtitle ? (h(), a("div", Z, b(e.subtitle), 1)) : i("", !0)]),
+			c(q, {
+				"model-value": l.value,
+				disabled: e.disabled
+			}, null, 8, ["model-value", "disabled"])
+		], 2));
+	}
+}), ie = { class: "kr-textfield" }, ae = {
+	key: 0,
+	class: "kr-textfield__label-text"
+}, oe = /* @__PURE__ */ l({
+	__name: "KrTextField",
+	props: {
+		modelValue: {},
+		label: {},
+		error: { type: Boolean },
+		autofocus: { type: Boolean }
+	},
+	emits: ["update:modelValue"],
+	setup(e, { emit: t }) {
+		let r = e, s = t, c = n({
+			get() {
+				return r.modelValue;
+			},
+			set(e) {
+				s("update:modelValue", e);
+			}
+		}), l = { mounted: (e) => r.autofocus && e.focus() };
+		return (t, n) => (h(), a("label", ie, [e.label ? (h(), a("span", ae, b(e.label), 1)) : i("", !0), D(o("input", d({
+			type: "text",
+			class: ["kr-textfield__input", { "kr-textfield__input--error": e.error }],
+			"onUpdate:modelValue": n[0] ||= (e) => c.value = e
+		}, t.$attrs), null, 16), [[
+			C,
+			c.value,
+			void 0,
+			{ trim: !0 }
+		], [l]])]));
+	}
+}), se = { class: "kr-search-input" }, ce = { class: "kr-search-input__icon" }, le = ["autofocus", "aria-label"], ue = ["aria-label"], de = /* @__PURE__ */ l({
+	__name: "KrSearchInput",
+	props: {
+		modelValue: { default: "" },
+		autofocus: {
+			type: Boolean,
+			default: !0
+		},
+		label: { default: "Search" },
+		clearLabel: { default: "Clear" }
+	},
+	emits: ["update:modelValue"],
+	setup(e, { emit: t }) {
+		let r = e, i = _(null), s = t, c = n({
+			get() {
+				return r.modelValue;
+			},
+			set(e) {
+				s("update:modelValue", e), r.autofocus && i.value?.focus();
+			}
+		});
+		function l() {
+			c.value = "";
+		}
+		return (t, n) => (h(), a("div", se, [
+			o("div", ce, [y(t.$slots, "icon", {}, () => [n[1] ||= o("svg", {
+				viewBox: "0 0 24 24",
+				fill: "none",
+				width: "1em",
+				height: "1em"
+			}, [o("circle", {
+				cx: "11",
+				cy: "11",
+				r: "7",
+				stroke: "currentColor",
+				"stroke-width": "2"
+			}), o("path", {
+				d: "M20 20L16.65 16.65",
+				stroke: "currentColor",
+				"stroke-width": "2",
+				"stroke-linecap": "round"
+			})], -1)])]),
+			D(o("input", {
+				ref_key: "inputRef",
+				ref: i,
+				class: "kr-search-input__input",
+				type: "text",
+				"onUpdate:modelValue": n[0] ||= (e) => c.value = e,
+				autofocus: e.autofocus,
+				"aria-label": e.label
+			}, null, 8, le), [[C, c.value]]),
+			D(o("div", {
+				class: "kr-search-input__icon kr-search-input__icon--clear",
+				onClick: l,
+				role: "button",
+				tabindex: "0",
+				"aria-label": e.clearLabel,
+				onKeydown: O(l, ["enter"])
+			}, [y(t.$slots, "clear-icon", {}, () => [n[2] ||= o("svg", {
+				viewBox: "0 0 24 24",
+				fill: "none",
+				width: "1em",
+				height: "1em"
+			}, [o("path", {
+				d: "M6 6L18 18M18 6L6 18",
+				stroke: "currentColor",
+				"stroke-width": "2",
+				"stroke-linecap": "round"
+			})], -1)])], 40, ue), [[w, c.value]])
+		]));
+	}
+});
+//#endregion
+//#region src/core/toastTimer.ts
+function fe(e) {
+	let t, n;
+	function r() {
+		t !== void 0 && (clearTimeout(t), t = void 0), n !== void 0 && (clearInterval(n), n = void 0);
+	}
+	function i({ timeoutSeconds: i, showCountdown: a }) {
+		if (r(), e.onTick?.(Math.max(0, Math.ceil(i))), i <= 0) return;
+		let o = Date.now() + i * 1e3;
+		t = setTimeout(() => {
+			e.onDismiss();
+		}, i * 1e3), a && (n = setInterval(() => {
+			e.onTick?.(Math.max(0, Math.ceil((o - Date.now()) / 1e3)));
+		}, 200));
+	}
+	return {
+		start: i,
+		clear: r
+	};
+}
+//#endregion
+//#region src/vue/components/KrToast.vue?vue&type=script&setup=true&lang.ts
+var pe = {
+	key: 0,
+	class: "kr-toast__icon"
+}, me = {
+	key: 0,
+	viewBox: "0 0 24 24",
+	fill: "none",
+	width: "1em",
+	height: "1em"
+}, he = {
+	key: 1,
+	viewBox: "0 0 24 24",
+	fill: "none",
+	width: "1em",
+	height: "1em"
+}, ge = { class: "kr-toast__text" }, _e = {
+	key: 1,
+	class: "kr-toast__actions"
+}, ve = {
+	key: 0,
+	class: "kr-toast__countdown",
+	"aria-hidden": "true"
+}, ye = /* @__PURE__ */ l({
+	__name: "KrToast",
+	props: {
+		show: {
+			type: Boolean,
+			default: !1
+		},
+		text: {},
+		icon: {},
+		timeout: { default: 3 },
+		actionText: {},
+		showCountdown: { type: Boolean }
+	},
+	emits: ["update:show", "action"],
+	setup(e, { emit: s }) {
+		let c = e, l = s, u = n({
+			get() {
+				return c.show;
+			},
+			set(e) {
+				l("update:show", e);
+			}
+		}), d = _(c.timeout), f = fe({
+			onTick: (e) => {
+				d.value = e;
+			},
+			onDismiss: () => {
+				u.value = !1;
+			}
+		});
+		function p() {
+			l("action"), u.value = !1;
+		}
+		function g() {
+			c.actionText || (u.value = !1);
+		}
+		return T(() => c.show, (e) => {
+			e ? f.start({
+				timeoutSeconds: c.timeout,
+				showCountdown: c.showCountdown
+			}) : f.clear();
+		}, { immediate: !0 }), m(f.clear), (n, s) => (h(), r(t, { name: "kr-fade-in-up" }, {
+			default: E(() => [u.value ? (h(), a("div", {
+				key: 0,
+				class: "kr-toast",
+				role: "status",
+				"aria-live": "polite",
+				onClick: g
+			}, [
+				e.icon ? (h(), a("div", pe, [y(n.$slots, "icon", {}, () => [e.icon === "success" ? (h(), a("svg", me, [...s[0] ||= [o("path", {
+					d: "M20 6L9 17L4 12",
+					stroke: "currentColor",
+					"stroke-width": "2",
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}, null, -1)]])) : (h(), a("svg", he, [...s[1] ||= [
+					o("circle", {
+						cx: "12",
+						cy: "12",
+						r: "9",
+						stroke: "currentColor",
+						"stroke-width": "2"
+					}, null, -1),
+					o("path", {
+						d: "M12 8V13",
+						stroke: "currentColor",
+						"stroke-width": "2",
+						"stroke-linecap": "round"
+					}, null, -1),
+					o("circle", {
+						cx: "12",
+						cy: "16",
+						r: "1",
+						fill: "currentColor"
+					}, null, -1)
+				]]))])])) : i("", !0),
+				o("div", ge, b(e.text), 1),
+				e.actionText ? (h(), a("div", _e, [o("button", {
+					class: "kr-toast__action",
+					type: "button",
+					onClick: k(p, ["stop"])
+				}, b(e.actionText), 1), e.showCountdown ? (h(), a("span", ve, b(d.value) + "s", 1)) : i("", !0)])) : i("", !0)
+			])) : i("", !0)]),
+			_: 3
+		}));
+	}
+}), be = { class: "kr-empty" }, xe = { class: "kr-empty__icon" }, Se = { class: "kr-empty__title" }, Ce = { class: "kr-empty__description" }, we = /* @__PURE__ */ l({
+	__name: "KrEmpty",
+	props: {
+		title: {},
+		description: {}
+	},
+	setup(e) {
+		return (t, n) => (h(), a("div", be, [
+			o("div", xe, [y(t.$slots, "icon", {}, () => [n[0] ||= o("svg", {
+				viewBox: "0 0 64 64",
+				fill: "none",
+				xmlns: "http://www.w3.org/2000/svg"
+			}, [
+				o("rect", {
+					x: "10",
+					y: "24",
+					width: "44",
+					height: "30",
+					rx: "4",
+					stroke: "var(--kr-on-surface-tertiary)",
+					"stroke-width": "2"
+				}),
+				o("path", {
+					d: "M10 26L18 10H46L54 26",
+					stroke: "var(--kr-on-surface-tertiary)",
+					"stroke-width": "2",
+					"stroke-linejoin": "round"
+				}),
+				o("path", {
+					d: "M24 34H40",
+					stroke: "var(--kr-theme)",
+					"stroke-width": "2",
+					"stroke-linecap": "round"
+				})
+			], -1)])]),
+			o("h1", Se, b(e.title), 1),
+			o("p", Ce, b(e.description), 1)
+		]));
+	}
+}), Te = {
+	key: 0,
+	class: "kr-menu-item--divider"
+}, Ee = ["disabled"], De = { class: "kr-menu-item__content" }, Oe = {
+	key: 0,
+	class: "kr-menu-item__icon",
+	"aria-hidden": "true"
+}, Q = /* @__PURE__ */ l({
+	__name: "KrMenuItem",
+	props: {
+		title: {},
+		value: {},
+		disabled: { type: Boolean },
+		type: {}
+	},
+	setup(e) {
+		return (t, n) => e.type === "divider" ? (h(), a("hr", Te)) : (h(), a("button", {
+			key: 1,
+			class: "kr-menu-item",
+			disabled: e.disabled,
+			role: "menuitem"
+		}, [o("div", De, b(e.title), 1), t.$slots.icon ? (h(), a("div", Oe, [y(t.$slots, "icon")])) : i("", !0)], 8, Ee));
+	}
+});
+//#endregion
+//#region src/core/focusTrap.ts
+function $(e) {
+	return Array.from(e?.querySelectorAll("button:not([disabled]), input:not([disabled])") ?? []);
+}
+function ke(e) {
+	let t = $(e), n = t.findIndex((e) => e === document.activeElement);
+	(n === t.length - 1 ? t[0] : t[n + 1])?.focus();
+}
+function Ae(e) {
+	let t = $(e), n = t.findIndex((e) => e === document.activeElement);
+	(n <= 0 ? t[t.length - 1] : t[n - 1])?.focus();
+}
+//#endregion
+//#region src/vue/components/KrDialog.vue?vue&type=script&setup=true&lang.ts
+var je = ["open", "onKeydown"], Me = {
+	key: 0,
+	class: "kr-dialog__title"
+}, Ne = { class: "kr-dialog__content" }, Pe = {
+	key: 0,
+	class: "kr-dialog__content__text"
+}, Fe = {
+	key: 1,
+	class: "kr-dialog__content__form"
+}, Ie = { class: "kr-dialog__actions" }, Le = /* @__PURE__ */ l({
+	__name: "KrDialog",
+	props: {
+		show: {
+			type: Boolean,
+			default: !1
+		},
+		title: { default: "" },
+		text: { default: "" },
+		actions: { default: () => [] },
+		cancelText: { default: "Cancel" },
+		hideCancel: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["update:show"],
+	setup(t, { emit: c }) {
+		let l = t, u = c, d = _(!1), f = n({
+			get() {
+				return l.show;
+			},
+			set(e) {
+				u("update:show", e);
+			}
+		});
+		function p() {
+			u("update:show", !1);
+		}
+		async function m(e) {
+			if (!d.value) {
+				d.value = !0;
+				try {
+					await e();
+				} finally {
+					d.value = !1;
+				}
+			}
+		}
+		let g = _(null);
+		function x(e) {
+			e.preventDefault(), ke(g.value);
+		}
+		function S(e) {
+			e.preventDefault(), Ae(g.value);
+		}
+		return (n, c) => (h(), r(j, {
+			modelValue: f.value,
+			"onUpdate:modelValue": c[1] ||= (e) => f.value = e,
+			centered: ""
+		}, {
+			default: E(() => [o("dialog", {
+				ref_key: "dialogRef",
+				ref: g,
+				class: "kr-dialog",
+				open: f.value,
+				onKeydown: [
+					c[0] ||= O(k((e) => f.value = !1, ["prevent"]), ["esc"]),
+					O(k(x, ["exact"]), ["tab"]),
+					O(k(S, ["shift"]), ["tab"])
+				]
+			}, [
+				t.title ? (h(), a("h2", Me, b(t.title), 1)) : i("", !0),
+				o("div", Ne, [t.text ? (h(), a("div", Pe, b(t.text), 1)) : i("", !0), n.$slots.default ? (h(), a("div", Fe, [y(n.$slots, "default")])) : i("", !0)]),
+				o("div", Ie, [t.hideCancel ? i("", !0) : (h(), r(A, {
+					key: 0,
+					type: "secondary",
+					disabled: d.value,
+					onClick: p
+				}, {
+					default: E(() => [s(b(t.cancelText), 1)]),
+					_: 1
+				}, 8, ["disabled"])), (h(!0), a(e, null, v(t.actions, (e) => (h(), r(A, {
+					key: e.text,
+					disabled: d.value || e.disabled,
+					onClick: (t) => m(e.action)
+				}, {
+					default: E(() => [s(b(e.text), 1)]),
+					_: 2
+				}, 1032, ["disabled", "onClick"]))), 128))])
+			], 40, je)]),
+			_: 3
+		}, 8, ["modelValue"]));
+	}
+}), Re = { class: "kr-chevron" }, ze = /* @__PURE__ */ l({
+	__name: "KrChevron",
+	setup(e) {
+		return (e, t) => (h(), a("div", Re));
+	}
+});
+//#endregion
+export { A as KrButton, ze as KrChevron, Le as KrDialog, we as KrEmpty, Q as KrMenuItem, j as KrOverlay, de as KrSearchInput, P as KrSection, G as KrSelectGroup, z as KrSelectItem, q as KrSwitch, oe as KrTextField, ye as KrToast, re as KrToggleRow };
+
+//# sourceMappingURL=kroma-vue.js.map