@anguszhu/kroma-ui 0.1.0 → 0.2.0

package/dist/kroma-vue.js

@@ -1,4 +1,4 @@
-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";
+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, resolveDynamicComponent as b, toDisplayString as x, unref as S, vModelCheckbox as C, vModelText as w, vShow as T, watch as ee, 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({
@@ -44,10 +44,10 @@ var A = /* @__PURE__ */ l({
 			_: 3
 		}, 8, ["name"]));
 	}
-}), ee = { class: "kr-section" }, te = {
+}), te = { class: "kr-section" }, ne = {
 	key: 0,
 	class: "kr-section__header"
-}, ne = {
+}, re = {
 	key: 0,
 	class: "kr-section__title"
 }, M = {
@@ -60,7 +60,7 @@ var A = /* @__PURE__ */ l({
 		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")])]));
+		return (t, n) => (h(), a("section", te, [e.title || e.subtitle ? (h(), a("header", ne, [e.title ? (h(), a("h1", re, x(e.title), 1)) : i("", !0), e.subtitle ? (h(), a("h2", M, x(e.subtitle), 1)) : i("", !0)])) : i("", !0), o("div", N, [y(t.$slots, "default")])]));
 	}
 }), F = ["title"], I = [
 	"name",
@@ -109,7 +109,7 @@ var A = /* @__PURE__ */ l({
 			o("input", {
 				class: "kr-select-item__input",
 				type: "radio",
-				name: x(c)?.name,
+				name: S(c)?.name,
 				value: e.value,
 				checked: l.value,
 				disabled: e.disabled,
@@ -117,7 +117,7 @@ var A = /* @__PURE__ */ l({
 				onChange: g
 			}, null, 40, I),
 			o("div", L, [y(t.$slots, "default")]),
-			m.value ? (h(), a("div", R, b(m.value), 1)) : i("", !0)
+			m.value ? (h(), a("div", R, x(m.value), 1)) : i("", !0)
 		], 10, F));
 	}
 }), B = {
@@ -175,7 +175,7 @@ var A = /* @__PURE__ */ l({
 			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", {
+		}), (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, x(t.title), 1)) : i("", !0), t.subtitle ? (h(), a("div", H, x(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", {
@@ -198,7 +198,7 @@ var A = /* @__PURE__ */ l({
 				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))]),
+			}, 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(x(n.label), 1)], 64))]),
 			_: 2
 		}, 1032, [
 			"value",
@@ -238,10 +238,10 @@ var A = /* @__PURE__ */ l({
 }), J = ["disabled", "aria-label"], Y = { class: "kr-toggle-row__label" }, X = {
 	key: 0,
 	class: "kr-toggle-row__title"
-}, Z = {
+}, ie = {
 	key: 1,
 	class: "kr-toggle-row__subtitle"
-}, re = /* @__PURE__ */ l({
+}, ae = /* @__PURE__ */ l({
 	__name: "KrToggleRow",
 	props: {
 		modelValue: {
@@ -280,18 +280,333 @@ var A = /* @__PURE__ */ l({
 				"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)]),
+			}, null, 8, J), [[C, l.value]]),
+			o("div", Y, [e.title ? (h(), a("div", X, x(e.title), 1)) : i("", !0), e.subtitle ? (h(), a("div", ie, x(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 = {
+}), oe = [
+	"name",
+	"value",
+	"checked",
+	"disabled",
+	"aria-label"
+], se = { class: "kr-radio-row__label" }, ce = {
+	key: 0,
+	class: "kr-radio-row__title"
+}, le = {
+	key: 1,
+	class: "kr-radio-row__subtitle"
+}, ue = /* @__PURE__ */ l({
+	__name: "KrRadioRow",
+	props: {
+		modelValue: {
+			type: Boolean,
+			default: !1
+		},
+		name: {},
+		value: {},
+		title: {},
+		subtitle: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		hideSeparator: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["update:modelValue"],
+	setup(e, { emit: t }) {
+		let n = t;
+		function r(e) {
+			n("update:modelValue", e.target.checked);
+		}
+		return (t, n) => (h(), a("label", { class: f(["kr-radio-row", {
+			"kr-radio-row--with-separator": !e.hideSeparator,
+			"kr-radio-row--checked": e.modelValue,
+			"kr-radio-row--disabled": e.disabled
+		}]) }, [
+			o("input", {
+				class: "kr-radio-row__native",
+				type: "radio",
+				name: e.name,
+				value: e.value,
+				checked: e.modelValue,
+				disabled: e.disabled,
+				"aria-label": e.title,
+				onChange: r
+			}, null, 40, oe),
+			n[0] ||= o("div", {
+				class: "kr-radio-row__radio",
+				"aria-hidden": "true"
+			}, [o("div", { class: "kr-radio-row__radio-dot" })], -1),
+			o("div", se, [e.title ? (h(), a("div", ce, x(e.title), 1)) : i("", !0), e.subtitle ? (h(), a("div", le, x(e.subtitle), 1)) : i("", !0)])
+		], 2));
+	}
+}), de = [
+	"name",
+	"value",
+	"checked",
+	".indeterminate",
+	"disabled",
+	"aria-label"
+], fe = {
+	class: "kr-checkbox-row__checkbox",
+	"aria-hidden": "true"
+}, pe = {
+	class: "kr-checkbox-row__check",
+	viewBox: "0 0 24 24",
+	fill: "none"
+}, me = {
+	key: 0,
+	d: "M5 12h14",
+	stroke: "currentColor",
+	"stroke-width": "3",
+	"stroke-linecap": "round"
+}, he = {
+	key: 1,
+	d: "M20 6L9 17l-5-5",
+	stroke: "currentColor",
+	"stroke-width": "3",
+	"stroke-linecap": "round",
+	"stroke-linejoin": "round"
+}, ge = { class: "kr-checkbox-row__label" }, _e = {
+	key: 0,
+	class: "kr-checkbox-row__title"
+}, ve = {
+	key: 1,
+	class: "kr-checkbox-row__subtitle"
+}, ye = /* @__PURE__ */ l({
+	__name: "KrCheckboxRow",
+	props: {
+		modelValue: {
+			type: Boolean,
+			default: !1
+		},
+		indeterminate: {
+			type: Boolean,
+			default: !1
+		},
+		name: {},
+		value: {},
+		title: {},
+		subtitle: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		hideSeparator: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["update:modelValue"],
+	setup(e, { emit: t }) {
+		let n = t;
+		function r(e) {
+			n("update:modelValue", e.target.checked);
+		}
+		return (t, n) => (h(), a("label", { class: f(["kr-checkbox-row", {
+			"kr-checkbox-row--with-separator": !e.hideSeparator,
+			"kr-checkbox-row--checked": e.modelValue,
+			"kr-checkbox-row--indeterminate": e.indeterminate,
+			"kr-checkbox-row--disabled": e.disabled
+		}]) }, [
+			o("input", {
+				class: "kr-checkbox-row__native",
+				type: "checkbox",
+				name: e.name,
+				value: e.value,
+				checked: e.modelValue,
+				".indeterminate": e.indeterminate,
+				disabled: e.disabled,
+				"aria-label": e.title,
+				onChange: r
+			}, null, 40, de),
+			o("div", fe, [(h(), a("svg", pe, [e.indeterminate ? (h(), a("path", me)) : (h(), a("path", he))]))]),
+			o("div", ge, [e.title ? (h(), a("div", _e, x(e.title), 1)) : i("", !0), e.subtitle ? (h(), a("div", ve, x(e.subtitle), 1)) : i("", !0)])
+		], 2));
+	}
+}), be = { class: "kr-button-row__label" }, xe = {
+	key: 0,
+	class: "kr-button-row__title"
+}, Se = {
+	key: 1,
+	class: "kr-button-row__subtitle"
+}, Ce = /* @__PURE__ */ l({
+	__name: "KrButtonRow",
+	props: {
+		title: {},
+		subtitle: {},
+		buttonLabel: {},
+		buttonType: { default: "secondary" },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		hideSeparator: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["buttonClick"],
+	setup(e, { emit: t }) {
+		let n = t;
+		function r(e) {
+			n("buttonClick", e);
+		}
+		return (t, n) => (h(), a("div", { class: f(["kr-button-row", {
+			"kr-button-row--with-separator": !e.hideSeparator,
+			"kr-button-row--disabled": e.disabled
+		}]) }, [o("div", be, [e.title ? (h(), a("div", xe, x(e.title), 1)) : i("", !0), e.subtitle ? (h(), a("div", Se, x(e.subtitle), 1)) : i("", !0)]), c(A, {
+			class: "kr-button-row__button",
+			type: e.buttonType,
+			disabled: e.disabled,
+			onClick: r
+		}, {
+			default: E(() => [s(x(e.buttonLabel), 1)]),
+			_: 1
+		}, 8, ["type", "disabled"])], 2));
+	}
+}), we = { class: "kr-link-row__label" }, Te = {
+	key: 0,
+	class: "kr-link-row__title"
+}, Ee = {
+	key: 1,
+	class: "kr-link-row__subtitle"
+}, De = {
+	class: "kr-link-row__icon",
+	"aria-hidden": "true"
+}, Oe = /* @__PURE__ */ l({
+	__name: "KrLinkRow",
+	props: {
+		title: {},
+		subtitle: {},
+		href: {},
+		target: { default: "_blank" },
+		rel: { default: "noopener noreferrer" },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		hideSeparator: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["click"],
+	setup(e, { emit: t }) {
+		let s = e, c = t, l = n(() => s.href ? "a" : "button");
+		function u(e) {
+			c("click", e);
+		}
+		return (t, n) => (h(), r(b(l.value), {
+			class: f(["kr-link-row", {
+				"kr-link-row--with-separator": !e.hideSeparator,
+				"kr-link-row--disabled": e.disabled
+			}]),
+			type: e.href ? void 0 : "button",
+			href: e.href && !e.disabled ? e.href : void 0,
+			target: e.href ? e.target : void 0,
+			rel: e.href ? e.rel : void 0,
+			disabled: e.href ? void 0 : e.disabled,
+			"aria-disabled": e.href ? e.disabled : void 0,
+			onClick: u
+		}, {
+			default: E(() => [o("div", we, [e.title ? (h(), a("div", Te, x(e.title), 1)) : i("", !0), e.subtitle ? (h(), a("div", Ee, x(e.subtitle), 1)) : i("", !0)]), o("div", De, [y(t.$slots, "icon", {}, () => [n[0] ||= o("svg", {
+				viewBox: "0 0 24 24",
+				fill: "none",
+				width: "1em",
+				height: "1em"
+			}, [
+				o("path", {
+					d: "M15 3h6v6",
+					stroke: "currentColor",
+					"stroke-width": "2",
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}),
+				o("path", {
+					d: "M10 14L21 3",
+					stroke: "currentColor",
+					"stroke-width": "2",
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				}),
+				o("path", {
+					d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6",
+					stroke: "currentColor",
+					"stroke-width": "2",
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round"
+				})
+			], -1)])])]),
+			_: 3
+		}, 8, [
+			"class",
+			"type",
+			"href",
+			"target",
+			"rel",
+			"disabled",
+			"aria-disabled"
+		]));
+	}
+}), ke = { class: "kr-chevron" }, Z = /* @__PURE__ */ l({
+	__name: "KrChevron",
+	setup(e) {
+		return (e, t) => (h(), a("div", ke));
+	}
+}), Ae = ["disabled"], je = { class: "kr-navigation-row__label" }, Me = {
+	key: 0,
+	class: "kr-navigation-row__title"
+}, Ne = {
+	key: 1,
+	class: "kr-navigation-row__subtitle"
+}, Pe = /* @__PURE__ */ l({
+	__name: "KrNavigationRow",
+	props: {
+		title: {},
+		subtitle: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		hideSeparator: {
+			type: Boolean,
+			default: !1
+		},
+		destructive: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["click"],
+	setup(e, { emit: t }) {
+		let n = t;
+		function r(e) {
+			n("click", e);
+		}
+		return (t, n) => (h(), a("button", {
+			type: "button",
+			class: f(["kr-navigation-row", {
+				"kr-navigation-row--with-separator": !e.hideSeparator,
+				"kr-navigation-row--destructive": e.destructive,
+				"kr-navigation-row--disabled": e.disabled
+			}]),
+			disabled: e.disabled,
+			onClick: r
+		}, [o("div", je, [e.title ? (h(), a("div", Me, x(e.title), 1)) : i("", !0), e.subtitle ? (h(), a("div", Ne, x(e.subtitle), 1)) : i("", !0)]), c(Z, { class: "kr-navigation-row__chevron" })], 10, Ae));
+	}
+}), Fe = { class: "kr-textfield" }, Ie = {
 	key: 0,
 	class: "kr-textfield__label-text"
-}, oe = /* @__PURE__ */ l({
+}, Le = /* @__PURE__ */ l({
 	__name: "KrTextField",
 	props: {
 		modelValue: {},
@@ -309,18 +624,18 @@ var A = /* @__PURE__ */ l({
 				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({
+		return (t, n) => (h(), a("label", Fe, [e.label ? (h(), a("span", Ie, x(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,
+			w,
 			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({
+}), Re = { class: "kr-search-input" }, ze = { class: "kr-search-input__icon" }, Be = ["autofocus", "aria-label"], Ve = ["aria-label"], He = /* @__PURE__ */ l({
 	__name: "KrSearchInput",
 	props: {
 		modelValue: { default: "" },
@@ -344,8 +659,8 @@ var A = /* @__PURE__ */ l({
 		function l() {
 			c.value = "";
 		}
-		return (t, n) => (h(), a("div", se, [
-			o("div", ce, [y(t.$slots, "icon", {}, () => [n[1] ||= o("svg", {
+		return (t, n) => (h(), a("div", Re, [
+			o("div", ze, [y(t.$slots, "icon", {}, () => [n[1] ||= o("svg", {
 				viewBox: "0 0 24 24",
 				fill: "none",
 				width: "1em",
@@ -370,7 +685,7 @@ var A = /* @__PURE__ */ l({
 				"onUpdate:modelValue": n[0] ||= (e) => c.value = e,
 				autofocus: e.autofocus,
 				"aria-label": e.label
-			}, null, 8, le), [[C, c.value]]),
+			}, null, 8, Be), [[w, c.value]]),
 			D(o("div", {
 				class: "kr-search-input__icon kr-search-input__icon--clear",
 				onClick: l,
@@ -388,13 +703,13 @@ var A = /* @__PURE__ */ l({
 				stroke: "currentColor",
 				"stroke-width": "2",
 				"stroke-linecap": "round"
-			})], -1)])], 40, ue), [[w, c.value]])
+			})], -1)])], 40, Ve), [[T, c.value]])
 		]));
 	}
 });
 //#endregion
 //#region src/core/toastTimer.ts
-function fe(e) {
+function Ue(e) {
 	let t, n;
 	function r() {
 		t !== void 0 && (clearTimeout(t), t = void 0), n !== void 0 && (clearInterval(n), n = void 0);
@@ -415,29 +730,29 @@ function fe(e) {
 }
 //#endregion
 //#region src/vue/components/KrToast.vue?vue&type=script&setup=true&lang.ts
-var pe = {
+var We = {
 	key: 0,
 	class: "kr-toast__icon"
-}, me = {
+}, Ge = {
 	key: 0,
 	viewBox: "0 0 24 24",
 	fill: "none",
 	width: "1em",
 	height: "1em"
-}, he = {
+}, Ke = {
 	key: 1,
 	viewBox: "0 0 24 24",
 	fill: "none",
 	width: "1em",
 	height: "1em"
-}, ge = { class: "kr-toast__text" }, _e = {
+}, qe = { class: "kr-toast__text" }, Je = {
 	key: 1,
 	class: "kr-toast__actions"
-}, ve = {
+}, Ye = {
 	key: 0,
 	class: "kr-toast__countdown",
 	"aria-hidden": "true"
-}, ye = /* @__PURE__ */ l({
+}, Xe = /* @__PURE__ */ l({
 	__name: "KrToast",
 	props: {
 		show: {
@@ -459,7 +774,7 @@ var pe = {
 			set(e) {
 				l("update:show", e);
 			}
-		}), d = _(c.timeout), f = fe({
+		}), d = _(c.timeout), f = Ue({
 			onTick: (e) => {
 				d.value = e;
 			},
@@ -473,7 +788,7 @@ var pe = {
 		function g() {
 			c.actionText || (u.value = !1);
 		}
-		return T(() => c.show, (e) => {
+		return ee(() => c.show, (e) => {
 			e ? f.start({
 				timeoutSeconds: c.timeout,
 				showCountdown: c.showCountdown
@@ -486,13 +801,13 @@ var pe = {
 				"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", {
+				e.icon ? (h(), a("div", We, [y(n.$slots, "icon", {}, () => [e.icon === "success" ? (h(), a("svg", Ge, [...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] ||= [
+				}, null, -1)]])) : (h(), a("svg", Ke, [...s[1] ||= [
 					o("circle", {
 						cx: "12",
 						cy: "12",
@@ -513,25 +828,25 @@ var pe = {
 						fill: "currentColor"
 					}, null, -1)
 				]]))])])) : i("", !0),
-				o("div", ge, b(e.text), 1),
-				e.actionText ? (h(), a("div", _e, [o("button", {
+				o("div", qe, x(e.text), 1),
+				e.actionText ? (h(), a("div", Je, [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)
+				}, x(e.actionText), 1), e.showCountdown ? (h(), a("span", Ye, x(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({
+}), Ze = { class: "kr-empty" }, Qe = { class: "kr-empty__icon" }, $e = { class: "kr-empty__title" }, et = { class: "kr-empty__description" }, tt = /* @__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", {
+		return (t, n) => (h(), a("div", Ze, [
+			o("div", Qe, [y(t.$slots, "icon", {}, () => [n[0] ||= o("svg", {
 				viewBox: "0 0 64 64",
 				fill: "none",
 				xmlns: "http://www.w3.org/2000/svg"
@@ -558,18 +873,18 @@ var pe = {
 					"stroke-linecap": "round"
 				})
 			], -1)])]),
-			o("h1", Se, b(e.title), 1),
-			o("p", Ce, b(e.description), 1)
+			o("h1", $e, x(e.title), 1),
+			o("p", et, x(e.description), 1)
 		]));
 	}
-}), Te = {
+}), nt = {
 	key: 0,
 	class: "kr-menu-item--divider"
-}, Ee = ["disabled"], De = { class: "kr-menu-item__content" }, Oe = {
+}, Q = ["disabled"], rt = { class: "kr-menu-item__content" }, it = {
 	key: 0,
 	class: "kr-menu-item__icon",
 	"aria-hidden": "true"
-}, Q = /* @__PURE__ */ l({
+}, at = /* @__PURE__ */ l({
 	__name: "KrMenuItem",
 	props: {
 		title: {},
@@ -578,12 +893,12 @@ var pe = {
 		type: {}
 	},
 	setup(e) {
-		return (t, n) => e.type === "divider" ? (h(), a("hr", Te)) : (h(), a("button", {
+		return (t, n) => e.type === "divider" ? (h(), a("hr", nt)) : (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));
+		}, [o("div", rt, x(e.title), 1), t.$slots.icon ? (h(), a("div", it, [y(t.$slots, "icon")])) : i("", !0)], 8, Q));
 	}
 });
 //#endregion
@@ -591,26 +906,26 @@ var pe = {
 function $(e) {
 	return Array.from(e?.querySelectorAll("button:not([disabled]), input:not([disabled])") ?? []);
 }
-function ke(e) {
+function ot(e) {
 	let t = $(e), n = t.findIndex((e) => e === document.activeElement);
 	(n === t.length - 1 ? t[0] : t[n + 1])?.focus();
 }
-function Ae(e) {
+function st(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 = {
+var ct = ["open", "onKeydown"], lt = {
 	key: 0,
 	class: "kr-dialog__title"
-}, Ne = { class: "kr-dialog__content" }, Pe = {
+}, ut = { class: "kr-dialog__content" }, dt = {
 	key: 0,
 	class: "kr-dialog__content__text"
-}, Fe = {
+}, ft = {
 	key: 1,
 	class: "kr-dialog__content__form"
-}, Ie = { class: "kr-dialog__actions" }, Le = /* @__PURE__ */ l({
+}, pt = { class: "kr-dialog__actions" }, mt = /* @__PURE__ */ l({
 	__name: "KrDialog",
 	props: {
 		show: {
@@ -650,11 +965,11 @@ var je = ["open", "onKeydown"], Me = {
 			}
 		}
 		let g = _(null);
-		function x(e) {
-			e.preventDefault(), ke(g.value);
+		function b(e) {
+			e.preventDefault(), ot(g.value);
 		}
 		function S(e) {
-			e.preventDefault(), Ae(g.value);
+			e.preventDefault(), st(g.value);
 		}
 		return (n, c) => (h(), r(j, {
 			modelValue: f.value,
@@ -668,39 +983,34 @@ var je = ["open", "onKeydown"], Me = {
 				open: f.value,
 				onKeydown: [
 					c[0] ||= O(k((e) => f.value = !1, ["prevent"]), ["esc"]),
-					O(k(x, ["exact"]), ["tab"]),
+					O(k(b, ["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, {
+				t.title ? (h(), a("h2", lt, x(t.title), 1)) : i("", !0),
+				o("div", ut, [t.text ? (h(), a("div", dt, x(t.text), 1)) : i("", !0), n.$slots.default ? (h(), a("div", ft, [y(n.$slots, "default")])) : i("", !0)]),
+				o("div", pt, [t.hideCancel ? i("", !0) : (h(), r(A, {
 					key: 0,
 					type: "secondary",
 					disabled: d.value,
 					onClick: p
 				}, {
-					default: E(() => [s(b(t.cancelText), 1)]),
+					default: E(() => [s(x(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)]),
+					default: E(() => [s(x(e.text), 1)]),
 					_: 2
 				}, 1032, ["disabled", "onClick"]))), 128))])
-			], 40, je)]),
+			], 40, ct)]),
 			_: 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 };
+export { A as KrButton, Ce as KrButtonRow, ye as KrCheckboxRow, Z as KrChevron, mt as KrDialog, tt as KrEmpty, Oe as KrLinkRow, at as KrMenuItem, Pe as KrNavigationRow, j as KrOverlay, ue as KrRadioRow, He as KrSearchInput, P as KrSection, G as KrSelectGroup, z as KrSelectItem, q as KrSwitch, Le as KrTextField, Xe as KrToast, ae as KrToggleRow };
 
 //# sourceMappingURL=kroma-vue.js.map