@indielayer/ui 1.18.1 → 2.1.0

package/lib/components/qrCode/theme/QrCode.base.theme.js

@@ -1,8 +1,4 @@
-const e = {
-  classes: {
-    wrapper: "rounded-md"
-  }
-}, s = e;
-export {
-  s as default
-};
+//#region src/components/qrCode/theme/QrCode.base.theme.ts
+var e = { classes: { wrapper: "rounded-md" } };
+//#endregion
+export { e as default };

package/lib/components/qrCode/theme/QrCode.carbon.theme.js

@@ -1,5 +1,5 @@
 import e from "./QrCode.base.theme.js";
-const t = e, o = t;
-export {
-  o as default
-};
+//#region src/components/qrCode/theme/QrCode.carbon.theme.ts
+var t = e;
+//#endregion
+export { t as default };

package/lib/components/radio/Radio.js

@@ -0,0 +1,6 @@
+import e from "../../_virtual/_plugin-vue_export-helper.js";
+import t from "./Radio.vue_vue_type_script_setup_true_lang.js";
+import n from "./Radio.vue_vue_type_style_index_0_lang.module.js";
+var r = /* @__PURE__ */ e(t, [["__cssModules", { $style: n }]]);
+//#endregion
+export { r as default };

package/lib/components/radio/Radio.vue.d.ts

@@ -1,45 +1,93 @@
 import { type ExtractPublicPropTypes, type Ref } from 'vue';
 import { type ThemeComponent } from '../../composables/useTheme';
 declare const radioProps: {
-    value: (StringConstructor | NumberConstructor)[];
-    glow: BooleanConstructor;
+    value: {
+        type: (StringConstructor | NumberConstructor)[];
+        description: string;
+    };
+    glow: import("vue").Prop<boolean | undefined>;
     modelValue: {
         readonly type: import("vue").PropType<string | number | boolean | object | any[] | undefined>;
         readonly default: undefined;
+        readonly description: "Bound value (v-model).";
+    };
+    id: {
+        readonly type: StringConstructor;
+        readonly description: "Native id attribute for the input element.";
+    };
+    name: {
+        readonly type: StringConstructor;
+        readonly description: "Native name attribute for form submission.";
+    };
+    readonly: {
+        readonly type: BooleanConstructor;
+        readonly description: "Makes the field read-only without disabling it.";
+    };
+    required: {
+        readonly type: BooleanConstructor;
+        readonly description: "Marks the field as required for validation.";
     };
-    id: StringConstructor;
-    name: StringConstructor;
-    readonly: BooleanConstructor;
-    required: BooleanConstructor;
     validateOnInput: {
         readonly type: BooleanConstructor;
         readonly default: true;
+        readonly description: "Runs validation on each input event when true.";
+    };
+    label: {
+        readonly type: StringConstructor;
+        readonly description: "Visible label text for the field.";
+    };
+    helper: {
+        readonly type: StringConstructor;
+        readonly description: "Helper text shown below the field.";
+    };
+    error: {
+        readonly type: StringConstructor;
+        readonly description: "External error message; overrides rule errors when set.";
+    };
+    hideFooter: {
+        readonly type: BooleanConstructor;
+        readonly description: "Hides the footer area (helper / error).";
     };
-    label: StringConstructor;
-    helper: StringConstructor;
-    error: StringConstructor;
-    hideFooter: BooleanConstructor;
     rules: {
         readonly type: ArrayConstructor;
         readonly default: () => never[];
+        readonly description: "Validation rule functions or rule descriptors.";
+    };
+    tooltip: {
+        readonly type: StringConstructor;
+        readonly description: "Optional tooltip text next to the label.";
+    };
+    skipFormRegistry: {
+        readonly type: BooleanConstructor;
+        readonly description: "Skips registering this field with a parent x-form.";
+    };
+    disabled: {
+        readonly type: BooleanConstructor;
+        readonly description: "Disables interaction and applies disabled styling.";
+    };
+    loading: {
+        readonly type: BooleanConstructor;
+        readonly description: "Shows a loading indicator and blocks interaction.";
+    };
+    loadingLabel: {
+        readonly type: StringConstructor;
+        readonly description: "Accessible label announced while loading.";
     };
-    tooltip: StringConstructor;
-    skipFormRegistry: BooleanConstructor;
-    disabled: BooleanConstructor;
-    loading: BooleanConstructor;
-    loadingLabel: StringConstructor;
     loadingStatus: {
         readonly type: import("vue").PropType<import("../loader/Loader.vue").LoaderStatus>;
         readonly default: "active";
+        readonly description: "Loader visual status (for example active or indeterminate).";
     };
     color: {
         readonly type: StringConstructor;
         readonly default: string | undefined;
+        readonly description: "Theme or CSS color used for the control accents.";
     };
     size: {
         readonly type: import("vue").PropType<import("../../composables/useCommon").Size>;
         readonly default: "md";
         readonly validator: (value: string) => boolean;
+        readonly description: "Control size. One of xs, sm, md, lg, xl.";
     };
 };
 export type RadioProps = ExtractPublicPropTypes<typeof radioProps>;
@@ -52,45 +100,93 @@ type InternalExtraData = {
 export interface RadioTheme extends ThemeComponent<RadioProps, InternalClasses, InternalExtraData> {
 }
 declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    value: (StringConstructor | NumberConstructor)[];
-    glow: BooleanConstructor;
+    value: {
+        type: (StringConstructor | NumberConstructor)[];
+        description: string;
+    };
+    glow: import("vue").Prop<boolean | undefined>;
     modelValue: {
         readonly type: import("vue").PropType<string | number | boolean | object | any[] | undefined>;
         readonly default: undefined;
+        readonly description: "Bound value (v-model).";
+    };
+    id: {
+        readonly type: StringConstructor;
+        readonly description: "Native id attribute for the input element.";
+    };
+    name: {
+        readonly type: StringConstructor;
+        readonly description: "Native name attribute for form submission.";
+    };
+    readonly: {
+        readonly type: BooleanConstructor;
+        readonly description: "Makes the field read-only without disabling it.";
+    };
+    required: {
+        readonly type: BooleanConstructor;
+        readonly description: "Marks the field as required for validation.";
     };
-    id: StringConstructor;
-    name: StringConstructor;
-    readonly: BooleanConstructor;
-    required: BooleanConstructor;
     validateOnInput: {
         readonly type: BooleanConstructor;
         readonly default: true;
+        readonly description: "Runs validation on each input event when true.";
+    };
+    label: {
+        readonly type: StringConstructor;
+        readonly description: "Visible label text for the field.";
+    };
+    helper: {
+        readonly type: StringConstructor;
+        readonly description: "Helper text shown below the field.";
+    };
+    error: {
+        readonly type: StringConstructor;
+        readonly description: "External error message; overrides rule errors when set.";
+    };
+    hideFooter: {
+        readonly type: BooleanConstructor;
+        readonly description: "Hides the footer area (helper / error).";
     };
-    label: StringConstructor;
-    helper: StringConstructor;
-    error: StringConstructor;
-    hideFooter: BooleanConstructor;
     rules: {
         readonly type: ArrayConstructor;
         readonly default: () => never[];
+        readonly description: "Validation rule functions or rule descriptors.";
+    };
+    tooltip: {
+        readonly type: StringConstructor;
+        readonly description: "Optional tooltip text next to the label.";
+    };
+    skipFormRegistry: {
+        readonly type: BooleanConstructor;
+        readonly description: "Skips registering this field with a parent x-form.";
+    };
+    disabled: {
+        readonly type: BooleanConstructor;
+        readonly description: "Disables interaction and applies disabled styling.";
+    };
+    loading: {
+        readonly type: BooleanConstructor;
+        readonly description: "Shows a loading indicator and blocks interaction.";
+    };
+    loadingLabel: {
+        readonly type: StringConstructor;
+        readonly description: "Accessible label announced while loading.";
     };
-    tooltip: StringConstructor;
-    skipFormRegistry: BooleanConstructor;
-    disabled: BooleanConstructor;
-    loading: BooleanConstructor;
-    loadingLabel: StringConstructor;
     loadingStatus: {
         readonly type: import("vue").PropType<import("../loader/Loader.vue").LoaderStatus>;
         readonly default: "active";
+        readonly description: "Loader visual status (for example active or indeterminate).";
     };
     color: {
         readonly type: StringConstructor;
         readonly default: string | undefined;
+        readonly description: "Theme or CSS color used for the control accents.";
     };
     size: {
         readonly type: import("vue").PropType<import("../../composables/useCommon").Size>;
         readonly default: "md";
         readonly validator: (value: string) => boolean;
+        readonly description: "Control size. One of xs, sm, md, lg, xl.";
     };
 }>, {
     focus: () => void | undefined;
@@ -99,51 +195,98 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<im
     validate: (val?: any) => boolean;
     setError: (val: string) => void;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, string[], string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    value: (StringConstructor | NumberConstructor)[];
-    glow: BooleanConstructor;
+    value: {
+        type: (StringConstructor | NumberConstructor)[];
+        description: string;
+    };
+    glow: import("vue").Prop<boolean | undefined>;
     modelValue: {
         readonly type: import("vue").PropType<string | number | boolean | object | any[] | undefined>;
         readonly default: undefined;
+        readonly description: "Bound value (v-model).";
+    };
+    id: {
+        readonly type: StringConstructor;
+        readonly description: "Native id attribute for the input element.";
+    };
+    name: {
+        readonly type: StringConstructor;
+        readonly description: "Native name attribute for form submission.";
+    };
+    readonly: {
+        readonly type: BooleanConstructor;
+        readonly description: "Makes the field read-only without disabling it.";
+    };
+    required: {
+        readonly type: BooleanConstructor;
+        readonly description: "Marks the field as required for validation.";
     };
-    id: StringConstructor;
-    name: StringConstructor;
-    readonly: BooleanConstructor;
-    required: BooleanConstructor;
     validateOnInput: {
         readonly type: BooleanConstructor;
         readonly default: true;
+        readonly description: "Runs validation on each input event when true.";
+    };
+    label: {
+        readonly type: StringConstructor;
+        readonly description: "Visible label text for the field.";
+    };
+    helper: {
+        readonly type: StringConstructor;
+        readonly description: "Helper text shown below the field.";
+    };
+    error: {
+        readonly type: StringConstructor;
+        readonly description: "External error message; overrides rule errors when set.";
+    };
+    hideFooter: {
+        readonly type: BooleanConstructor;
+        readonly description: "Hides the footer area (helper / error).";
     };
-    label: StringConstructor;
-    helper: StringConstructor;
-    error: StringConstructor;
-    hideFooter: BooleanConstructor;
     rules: {
         readonly type: ArrayConstructor;
         readonly default: () => never[];
+        readonly description: "Validation rule functions or rule descriptors.";
+    };
+    tooltip: {
+        readonly type: StringConstructor;
+        readonly description: "Optional tooltip text next to the label.";
+    };
+    skipFormRegistry: {
+        readonly type: BooleanConstructor;
+        readonly description: "Skips registering this field with a parent x-form.";
+    };
+    disabled: {
+        readonly type: BooleanConstructor;
+        readonly description: "Disables interaction and applies disabled styling.";
+    };
+    loading: {
+        readonly type: BooleanConstructor;
+        readonly description: "Shows a loading indicator and blocks interaction.";
+    };
+    loadingLabel: {
+        readonly type: StringConstructor;
+        readonly description: "Accessible label announced while loading.";
     };
-    tooltip: StringConstructor;
-    skipFormRegistry: BooleanConstructor;
-    disabled: BooleanConstructor;
-    loading: BooleanConstructor;
-    loadingLabel: StringConstructor;
     loadingStatus: {
         readonly type: import("vue").PropType<import("../loader/Loader.vue").LoaderStatus>;
         readonly default: "active";
+        readonly description: "Loader visual status (for example active or indeterminate).";
     };
     color: {
         readonly type: StringConstructor;
         readonly default: string | undefined;
+        readonly description: "Theme or CSS color used for the control accents.";
     };
     size: {
         readonly type: import("vue").PropType<import("../../composables/useCommon").Size>;
         readonly default: "md";
         readonly validator: (value: string) => boolean;
+        readonly description: "Control size. One of xs, sm, md, lg, xl.";
     };
 }>> & Readonly<{
     [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
 }>, {
     disabled: boolean;
-    glow: boolean;
     color: string;
     size: import("../../composables/useCommon").Size;
     loading: boolean;

package/lib/components/radio/Radio.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,124 @@
+import { useColors as e } from "../../composables/useColors.js";
+import { useTheme as t } from "../../composables/useTheme.js";
+import { optionalBooleanProp as n } from "../../common/props.js";
+import { useCommon as r } from "../../composables/useCommon.js";
+import { useInteractive as i } from "../../composables/useInteractive.js";
+import a from "../spinner/Spinner.js";
+import { useInputtable as o } from "../../composables/useInputtable.js";
+import s from "../inputFooter/InputFooter.js";
+import { computed as c, createBlock as l, createCommentVNode as u, createElementBlock as d, createElementVNode as f, defineComponent as p, mergeProps as m, normalizeClass as h, normalizeStyle as g, openBlock as _, ref as v, renderSlot as y, toDisplayString as b, toHandlers as x, unref as S, vModelRadio as C, withDirectives as w, withKeys as T, withModifiers as E } from "vue";
+//#region src/components/radio/Radio.vue?vue&type=script&setup=true&lang.ts
+var D = [
+	"aria-selected",
+	"aria-disabled",
+	"onKeypress"
+], O = [
+	"id",
+	"name",
+	"required",
+	"disabled"
+], k = ["textContent"], A = {
+	...r.props(),
+	...e.props("primary"),
+	...i.props(),
+	...o.props(),
+	value: {
+		type: [String, Number],
+		description: "Value emitted when this option is selected (v-model / form-group)."
+	},
+	glow: n("Soft colored glow behind the control.")
+}, j = /* @__PURE__ */ p({
+	name: "XRadio",
+	validators: { ...r.validators() },
+	docs: {
+		slots: { default: "Optional content shown below the label." },
+		emits: { ...o.emitDocs(!1) },
+		methods: { ...o.methodDocs() }
+	},
+	props: A,
+	emits: o.emits(!1),
+	setup(e, { expose: n, emit: r }) {
+		let p = e, A = r, j = v(null), { focus: M, blur: N } = i(j), { errorInternal: P, hideFooterInternal: F, isInsideForm: I, isInsideFormGroup: L, isFirstValidation: R, formGroup: z, reset: B, validate: V, setError: H } = o(p, {
+			focus: M,
+			emit: A,
+			withListeners: !1
+		}), U = c({
+			get() {
+				let e = S(z.value);
+				return L ? e === p.value : p.value === p.modelValue;
+			},
+			set() {
+				A("update:modelValue", p.value), z.setValue(p.value);
+			}
+		});
+		function W() {
+			A("update:modelValue", p.value), z.setValue(p.value);
+		}
+		let G = { input: () => {
+			L || setTimeout(() => {
+				p.validateOnInput && !R.value && V(p.modelValue);
+			}, 0);
+		} }, { styles: K, classes: q, className: J } = t("Radio", {}, p, {
+			selected: U,
+			isInsideForm: I,
+			isInsideFormGroup: L
+		});
+		return n({
+			focus: M,
+			blur: N,
+			reset: B,
+			validate: V,
+			setError: H
+		}), (e, t) => (_(), d("label", {
+			ref_key: "elRef",
+			ref: j,
+			tabindex: "0",
+			"aria-selected": U.value ? "true" : "false",
+			"aria-disabled": e.disabled || e.loading ? "true" : void 0,
+			style: g(S(K)),
+			class: h([S(J), S(q).wrapper]),
+			onKeypress: T(E(W, ["prevent", "stop"]), ["space"])
+		}, [f("div", { class: h(["flex items-center", { "cursor-not-allowed": e.disabled }]) }, [
+			w(f("input", m({
+				id: e.id,
+				"onUpdate:modelValue": t[0] ||= (e) => U.value = e,
+				name: e.name,
+				required: e.required,
+				disabled: e.disabled || e.loading,
+				type: "radio",
+				class: "invisible absolute"
+			}, x(G, !0)), null, 16, O), [[C, U.value]]),
+			f("div", { class: h([
+				e.$style.radio,
+				S(q).circle,
+				[e.glow && !e.disabled && !e.loading ? e.$style["radio--glow"] : ""]
+			]) }, [e.loading ? (_(), l(a, {
+				key: 0,
+				size: e.size,
+				class: "absolute"
+			}, null, 8, ["size"])) : (_(), d("svg", {
+				key: 1,
+				viewBox: "0 0 20 20",
+				class: h(["fill-current w-full", [S(q).circleIcon, e.$style.radio_circle]])
+			}, [...t[1] ||= [f("circle", {
+				cx: "10",
+				cy: "10",
+				r: "10"
+			}, null, -1)]], 2))], 2),
+			f("div", null, [e.label ? (_(), d("div", {
+				key: 0,
+				class: h(S(q).label),
+				textContent: b(e.label)
+			}, null, 10, k)) : u("", !0), e.$slots.default ? (_(), d("div", {
+				key: 1,
+				class: h(S(q).content)
+			}, [y(e.$slots, "default")], 2)) : u("", !0)])
+		], 2), S(F) ? u("", !0) : (_(), l(s, {
+			key: 0,
+			error: S(P),
+			helper: e.helper
+		}, null, 8, ["error", "helper"]))], 46, D));
+	}
+});
+//#endregion
+export { j as default };

package/lib/components/radio/Radio.vue_vue_type_style_index_0_lang.module.js

@@ -0,0 +1,7 @@
+var e = {
+	radio: "_radio_ptmyo_2",
+	"radio--glow": "_radio--glow_ptmyo_7",
+	radio_circle: "_radio_circle_ptmyo_11"
+};
+//#endregion
+export { e as default };

package/lib/components/radio/theme/Radio.base.theme.js

@@ -1,70 +1,70 @@
-const a = {
-  classes: {
-    wrapper: ({ data: e }) => {
-      const t = ["inline-block relative cursor-pointer focus:outline-none group"];
-      return e.isInsideForm && !e.isInsideFormGroup && t.push("mb-5"), t;
-    },
-    circle: ({ props: e }) => {
-      const t = ["rounded-full flex justify-center items-center shrink-0 border outline-offset-2 outline-slate-300 dark:outline-slate-500 group-focus-visible:outline-1 group-focus-visible:outline"];
-      return e.size === "lg" ? t.push("h-5 w-5") : e.size === "xl" ? t.push("h-6 w-6") : t.push("h-4 w-4"), t;
-    },
-    circleIcon: ({ props: e, data: t }) => {
-      const s = [];
-      return t.selected || s.push("opacity-0"), e.size === "sm" || e.size === "xs" ? s.push("h-2") : e.size === "lg" ? s.push("h-2.5") : e.size === "xl" ? s.push("h-3") : s.push("h-2"), s;
-    },
-    label: ({ props: e, data: t }) => {
-      let s = "text-secondary-800 dark:text-secondary-200 pl-2";
-      return s += t.isInsideFormGroup ? " font-normal" : " font-medium", e.size === "xs" ? s += " text-xs" : e.size === "sm" ? s += " text-sm" : e.size === "lg" ? s += " text-lg" : e.size === "xl" && (s += " text-xl"), s;
-    },
-    content: ({ props: e }) => {
-      let t = "pl-2";
-      return e.size === "xs" ? t += " text-xs" : e.size === "sm" ? t += " text-sm" : e.size === "lg" ? t += " text-lg" : e.size === "xl" && (t += " text-xl"), t;
-    }
-  },
-  styles: ({ props: e, colors: t, css: s, data: n }) => {
-    const r = t.getPalette("gray"), l = t.getPalette(e.color), i = [];
-    return e.loading ? s.variables({
-      bg: "transparent",
-      border: "transparent",
-      dark: {
-        bg: "transparent",
-        border: "transparent"
-      }
-    }) : (e.disabled ? n.selected ? i.push(s.variables({
-      bg: "transparent",
-      border: r[200],
-      circle: r[200],
-      dark: {
-        bg: "transparent",
-        border: r[700],
-        circle: r[700]
-      }
-    })) : i.push(s.variables({
-      bg: r[200],
-      border: r[200],
-      dark: {
-        bg: r[700],
-        border: r[700]
-      }
-    })) : (n.selected ? i.push(s.variables({
-      bg: "transparent",
-      border: l[500],
-      circle: l[500],
-      dark: {
-        bg: "transparent",
-        border: l[500],
-        circle: l[500]
-      }
-    })) : i.push(s.variables({
-      bg: "#fff",
-      border: e.glow ? l[300] : r[300],
-      dark: {
-        bg: r[900],
-        border: e.glow ? l[300] : r[400]
-      }
-    })), e.glow && i.push(s.get("glow", t.getColorOpacity(l[500], 0.5)))), i);
-  }
-}, o = a;
-export {
-  o as default
+//#region src/components/radio/theme/Radio.base.theme.ts
+var e = {
+	classes: {
+		wrapper: ({ data: e }) => {
+			let t = ["inline-block relative cursor-pointer focus:outline-hidden group"];
+			return e.isInsideForm && !e.isInsideFormGroup && t.push("mb-5"), t;
+		},
+		circle: ({ props: e }) => {
+			let t = ["rounded-full flex justify-center items-center shrink-0 border outline-offset-2 outline-slate-300 dark:outline-slate-500 group-focus-visible:outline-1 group-focus-visible:outline"];
+			return e.size === "lg" ? t.push("h-5 w-5") : e.size === "xl" ? t.push("h-6 w-6") : t.push("h-4 w-4"), t;
+		},
+		circleIcon: ({ props: e, data: t }) => {
+			let n = [];
+			return t.selected || n.push("opacity-0"), e.size === "sm" || e.size === "xs" ? n.push("h-2") : e.size === "lg" ? n.push("h-2.5") : e.size === "xl" ? n.push("h-3") : n.push("h-2"), n;
+		},
+		label: ({ props: e, data: t }) => {
+			let n = "text-secondary-800 dark:text-secondary-200 pl-2";
+			return n += t.isInsideFormGroup ? " font-normal" : " font-medium", e.size === "xs" ? n += " text-xs" : e.size === "sm" ? n += " text-sm" : e.size === "lg" ? n += " text-lg" : e.size === "xl" && (n += " text-xl"), n;
+		},
+		content: ({ props: e }) => {
+			let t = "pl-2";
+			return e.size === "xs" ? t += " text-xs" : e.size === "sm" ? t += " text-sm" : e.size === "lg" ? t += " text-lg" : e.size === "xl" && (t += " text-xl"), t;
+		}
+	},
+	styles: ({ props: e, colors: t, css: n, data: r }) => {
+		let i = t.getPalette("gray"), a = t.getPalette(e.color), o = [];
+		return e.loading ? n.variables({
+			bg: "transparent",
+			border: "transparent",
+			dark: {
+				bg: "transparent",
+				border: "transparent"
+			}
+		}) : (e.disabled ? r.selected ? o.push(n.variables({
+			bg: "transparent",
+			border: i[200],
+			circle: i[200],
+			dark: {
+				bg: "transparent",
+				border: i[700],
+				circle: i[700]
+			}
+		})) : o.push(n.variables({
+			bg: i[200],
+			border: i[200],
+			dark: {
+				bg: i[700],
+				border: i[700]
+			}
+		})) : (r.selected ? o.push(n.variables({
+			bg: "transparent",
+			border: a[500],
+			circle: a[500],
+			dark: {
+				bg: "transparent",
+				border: a[500],
+				circle: a[500]
+			}
+		})) : o.push(n.variables({
+			bg: "#fff",
+			border: e.glow ? a[300] : i[300],
+			dark: {
+				bg: i[900],
+				border: e.glow ? a[300] : i[400]
+			}
+		})), e.glow && o.push(n.get("glow", t.getColorOpacity(a[500], .5)))), o);
+	}
 };
+//#endregion
+export { e as default };