@indielayer/ui 1.18.1 → 2.1.0

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

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

package/lib/components/radioButton/RadioButton.js

@@ -0,0 +1,6 @@
+import e from "../../_virtual/_plugin-vue_export-helper.js";
+import t from "./RadioButton.vue_vue_type_script_setup_true_lang.js";
+import n from "./RadioButton.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/radioButton/RadioButton.vue.d.ts

@@ -0,0 +1,326 @@
+import { type ExtractPublicPropTypes, type Ref } from 'vue';
+import { type ThemeComponent } from '../../composables/useTheme';
+declare const radioButtonProps: {
+    outlined: import("vue").Prop<boolean | undefined>;
+    rounded: import("vue").Prop<boolean | undefined>;
+    glow: import("vue").Prop<boolean | undefined>;
+    ghost: import("vue").Prop<boolean | undefined>;
+    light: import("vue").Prop<boolean | undefined>;
+    flat: import("vue").Prop<boolean | undefined>;
+    block: import("vue").Prop<boolean | undefined>;
+    value: {
+        type: (StringConstructor | NumberConstructor)[];
+        description: string;
+    };
+    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.";
+    };
+    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).";
+    };
+    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.";
+    };
+    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 RadioButtonProps = ExtractPublicPropTypes<typeof radioButtonProps>;
+type InternalClasses = 'wrapper';
+type InternalExtraData = {
+    selected: Ref<boolean>;
+    isInsideFormGroup: boolean;
+};
+export interface RadioButtonTheme extends ThemeComponent<RadioButtonProps, InternalClasses, InternalExtraData> {
+}
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    outlined: import("vue").Prop<boolean | undefined>;
+    rounded: import("vue").Prop<boolean | undefined>;
+    glow: import("vue").Prop<boolean | undefined>;
+    ghost: import("vue").Prop<boolean | undefined>;
+    light: import("vue").Prop<boolean | undefined>;
+    flat: import("vue").Prop<boolean | undefined>;
+    block: import("vue").Prop<boolean | undefined>;
+    value: {
+        type: (StringConstructor | NumberConstructor)[];
+        description: string;
+    };
+    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.";
+    };
+    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).";
+    };
+    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.";
+    };
+    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;
+    blur: () => void | undefined;
+    reset: () => void;
+    validate: (val?: any) => boolean;
+    setError: (val: string) => void;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, string[], string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    outlined: import("vue").Prop<boolean | undefined>;
+    rounded: import("vue").Prop<boolean | undefined>;
+    glow: import("vue").Prop<boolean | undefined>;
+    ghost: import("vue").Prop<boolean | undefined>;
+    light: import("vue").Prop<boolean | undefined>;
+    flat: import("vue").Prop<boolean | undefined>;
+    block: import("vue").Prop<boolean | undefined>;
+    value: {
+        type: (StringConstructor | NumberConstructor)[];
+        description: string;
+    };
+    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.";
+    };
+    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).";
+    };
+    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.";
+    };
+    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;
+    color: string;
+    size: import("../../composables/useCommon").Size;
+    loading: boolean;
+    loadingStatus: import("../loader/Loader.vue").LoaderStatus;
+    modelValue: string | number | boolean | object | any[] | undefined;
+    readonly: boolean;
+    required: boolean;
+    validateOnInput: boolean;
+    hideFooter: boolean;
+    rules: unknown[];
+    skipFormRegistry: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, {
+    default?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/lib/components/radioButton/RadioButton.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,91 @@
+import { useColors as e } from "../../composables/useColors.js";
+import { useTheme as t } from "../../composables/useTheme.js";
+import { variantBooleanProps as n } from "../../common/props.js";
+import { useCommon as r } from "../../composables/useCommon.js";
+import { useInteractive as i } from "../../composables/useInteractive.js";
+import { useInputtable as a } from "../../composables/useInputtable.js";
+import { computed as o, createElementBlock as s, createElementVNode as c, createTextVNode as l, defineComponent as u, normalizeClass as d, normalizeStyle as f, openBlock as p, ref as m, renderSlot as h, toDisplayString as g, unref as _, vModelRadio as v, withDirectives as y, withKeys as b, withModifiers as x } from "vue";
+//#region src/components/radioButton/RadioButton.vue?vue&type=script&setup=true&lang.ts
+var S = [
+	"aria-pressed",
+	"aria-disabled",
+	"onKeypress"
+], C = [
+	"name",
+	"required",
+	"disabled"
+], w = {
+	...r.props(),
+	...e.props("primary"),
+	...i.props(),
+	...a.props(),
+	value: {
+		type: [String, Number],
+		description: "Value emitted when this option is selected (v-model / form-group)."
+	},
+	...n()
+}, T = /* @__PURE__ */ u({
+	name: "XRadioButton",
+	validators: { ...r.validators() },
+	docs: {
+		slots: { default: "Button label; falls back to the `label` prop." },
+		emits: { ...a.emitDocs(!1) },
+		methods: { ...a.methodDocs() }
+	},
+	props: w,
+	emits: a.emits(!1),
+	setup(e, { expose: n, emit: r }) {
+		let u = e, w = r, T = m(null), { focus: E, blur: D } = i(T), { errorInternal: O, hideFooterInternal: k, isInsideForm: A, isInsideFormGroup: j, isFirstValidation: M, formGroup: N, reset: P, validate: F, setError: I } = a(u, {
+			focus: E,
+			emit: w,
+			withListeners: !1,
+			formGroupJoined: !0
+		}), L = o({
+			get() {
+				let e = _(N.value);
+				return j ? e === u.value : u.value === u.modelValue;
+			},
+			set() {
+				w("update:modelValue", u.value), N.setValue(u.value);
+			}
+		});
+		function R() {
+			u.disabled || u.loading || (w("update:modelValue", u.value), N.setValue(u.value));
+		}
+		let { styles: z, classes: B, className: V } = t("RadioButton", {}, u, {
+			selected: L,
+			isInsideFormGroup: j
+		});
+		return n({
+			focus: E,
+			blur: D,
+			reset: P,
+			validate: F,
+			setError: I
+		}), (e, t) => (p(), s("label", {
+			ref_key: "elRef",
+			ref: T,
+			tabindex: "0",
+			"aria-pressed": L.value ? "true" : "false",
+			"aria-disabled": e.disabled || e.loading ? "true" : void 0,
+			style: f(_(z)),
+			class: d([
+				_(V),
+				e.$style.btn,
+				_(j) ? e.$style["btn--grouped"] : "",
+				_(B).wrapper
+			]),
+			onClick: R,
+			onKeypress: b(x(R, ["prevent", "stop"]), ["space"])
+		}, [y(c("input", {
+			"onUpdate:modelValue": t[0] ||= (e) => L.value = e,
+			name: e.name,
+			required: e.required,
+			disabled: e.disabled || e.loading,
+			type: "radio",
+			class: "invisible absolute"
+		}, null, 8, C), [[v, L.value]]), h(e.$slots, "default", {}, () => [l(g(e.label), 1)])], 46, S));
+	}
+});
+//#endregion
+export { T as default };

package/lib/components/radioButton/RadioButton.vue_vue_type_style_index_0_lang.module.js

@@ -0,0 +1,6 @@
+var e = {
+	btn: "_btn_d9ydo_2",
+	"btn--grouped": "_btn--grouped_d9ydo_14"
+};
+//#endregion
+export { e as default };

package/lib/components/radioButton/index.d.ts

@@ -0,0 +1,2 @@
+export { default as XRadioButton } from './RadioButton.vue';
+export type { RadioButtonProps, RadioButtonTheme } from './RadioButton.vue';

package/lib/components/radioButton/theme/RadioButton.base.theme.d.ts

@@ -0,0 +1,3 @@
+import type { RadioButtonTheme } from '../RadioButton.vue';
+declare const theme: RadioButtonTheme;
+export default theme;

package/lib/components/radioButton/theme/RadioButton.base.theme.js

@@ -0,0 +1,110 @@
+//#region src/components/radioButton/theme/RadioButton.base.theme.ts
+var e = {
+	classes: { wrapper({ props: e, data: t }) {
+		let n = [
+			"relative inline-flex items-center justify-center cursor-pointer select-none",
+			"transition duration-150 font-medium whitespace-nowrap border",
+			"focus-visible:outline focus-visible:outline-1 focus-visible:outline-offset-2 focus-visible:outline-secondary-300",
+			"active:!shadow-none"
+		];
+		return e.size === "xs" ? n.push("py-1 px-2 text-xs") : e.size === "sm" ? n.push("py-1.5 px-3 text-sm") : e.size === "lg" ? n.push("py-3 px-5 text-lg") : e.size === "xl" ? n.push("py-4 px-6 text-xl") : n.push("py-2 px-4 text-sm"), t.isInsideFormGroup || n.push(e.rounded ? "rounded-full" : "rounded-md"), !e.flat && !e.light && !e.ghost && !e.disabled && !e.loading && n.push("shadow-xs"), e.disabled ? n.push("cursor-not-allowed") : e.loading && n.push("cursor-default"), n;
+	} },
+	styles({ props: e, colors: t, css: n, data: r }) {
+		let i = t.getPalette("gray"), a = t.getPalette(e.color), o = e.color && e.light;
+		return e.disabled ? o ? n.variables({
+			bg: a[50],
+			text: a[200],
+			border: "transparent",
+			dark: {
+				bg: i[800],
+				text: a[900],
+				border: "transparent"
+			}
+		}) : n.variables({
+			bg: i[50],
+			text: i[300],
+			border: i[200],
+			dark: {
+				bg: i[900],
+				text: i[600],
+				border: i[700]
+			}
+		}) : o ? r.selected ? n.variables({
+			bg: a[500],
+			text: "#fff",
+			border: e.outlined ? a[600] : "transparent",
+			hover: { bg: a[600] },
+			dark: {
+				bg: a[600],
+				text: "#fff",
+				border: e.outlined ? a[700] : "transparent",
+				hover: { bg: a[700] }
+			}
+		}) : n.variables({
+			bg: a[50],
+			text: a[600],
+			border: e.outlined ? a[500] : "transparent",
+			hover: { bg: a[100] },
+			active: { bg: a[200] },
+			dark: {
+				bg: a[900],
+				text: a[200],
+				border: e.outlined ? a[500] : "transparent",
+				hover: { bg: a[800] },
+				active: { bg: a[700] }
+			}
+		}) : e.outlined ? r.selected ? n.variables({
+			bg: a[500],
+			text: "#fff",
+			border: a[600],
+			hover: { bg: a[600] },
+			dark: {
+				bg: a[600],
+				text: "#fff",
+				border: a[700],
+				hover: { bg: a[700] }
+			}
+		}) : n.variables({
+			text: a[600],
+			border: a[600],
+			hover: { bg: a[100] },
+			active: { bg: a[200] },
+			dark: {
+				text: a[500],
+				border: a[500],
+				hover: { bg: i[800] },
+				active: { bg: i[700] }
+			}
+		}) : r.selected ? n.variables({
+			bg: a[500],
+			text: "#fff",
+			border: a[600],
+			hover: { bg: a[600] },
+			dark: {
+				bg: a[600],
+				text: "#fff",
+				border: a[700],
+				hover: { bg: a[700] }
+			}
+		}) : n.variables({
+			bg: "#fff",
+			text: i[700],
+			border: i[300],
+			hover: {
+				bg: i[50],
+				border: i[400]
+			},
+			dark: {
+				bg: i[800],
+				text: i[300],
+				border: i[600],
+				hover: {
+					bg: i[700],
+					border: i[500]
+				}
+			}
+		});
+	}
+};
+//#endregion
+export { e as default };