ensis-ui 0.0.0-stage → 3.0.0

package/dist/components/dynamic-tags/src/RsDynamicTags.impl.js

@@ -0,0 +1,476 @@
+import { useRsI18n } from "../../../composables/useRsI18n.js";
+import RsIcon_default from "../../icon/src/RsIcon.js";
+import { buildLocalInputRules, runFormFieldRules } from "../../form/src/form-rules.js";
+import { isRsFormItemBoundControl, useRsFormContext, useRsFormField, useRsFormItemContext } from "../../form/src/form-utils.js";
+import { useResolvedRsComponentSize } from "../../_shared/src/resolve-size.js";
+import { rsRadiusCss, useResolvedRsRadius } from "../../_shared/src/resolve-radius.js";
+import RsTag_default from "../../tag/src/RsTag.js";
+import { canAcceptRsDynamicTag, coerceRsDynamicTagsValue, draftHasRsDynamicTagsSeparator, normalizeRsDynamicTagsSeparators, parseRsDynamicTag, splitRsDynamicTagsDraft } from "./dynamic-tags-utils.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeModels, nextTick, normalizeClass, normalizeStyle, onBeforeUnmount, openBlock, ref, renderList, renderSlot, toDisplayString, unref, useId, useModel, vModelText, watch, withCtx, withDirectives, withModifiers } from "vue";
+//#region src/components/dynamic-tags/src/RsDynamicTags.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "rs-dynamic-tags-field" };
+var _hoisted_2 = [
+	"disabled",
+	"aria-readonly",
+	"aria-invalid",
+	"aria-describedby"
+];
+var _hoisted_3 = { class: "rs-dynamic-tags-field__sr-only" };
+var _hoisted_4 = [
+	"id",
+	"placeholder",
+	"disabled",
+	"readonly",
+	"maxlength",
+	"aria-label",
+	"aria-invalid",
+	"aria-describedby"
+];
+var _hoisted_5 = ["aria-label"];
+var _hoisted_6 = ["aria-label"];
+var _hoisted_7 = ["id"];
+var _hoisted_8 = ["id"];
+var RsDynamicTags_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "RsDynamicTags",
+	__name: "RsDynamicTags",
+	props: /*@__PURE__*/ mergeModels({
+		name: {},
+		id: {},
+		invalid: { type: Boolean },
+		placeholder: {},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		readonly: {
+			type: Boolean,
+			default: false
+		},
+		required: {
+			type: Boolean,
+			default: false
+		},
+		max: {},
+		maxlength: {},
+		allowDuplicate: {
+			type: Boolean,
+			default: false
+		},
+		inputMode: { default: "trigger" },
+		commitOnBlur: {
+			type: Boolean,
+			default: true
+		},
+		separators: {},
+		parse: {},
+		allowClear: {
+			type: Boolean,
+			default: false
+		},
+		size: {},
+		radius: {},
+		tagVariant: { default: "default" },
+		round: {
+			type: Boolean,
+			default: false
+		},
+		ariaLabel: {}
+	}, {
+		"modelValue": { default: () => [] },
+		"modelModifiers": {}
+	}),
+	emits: /*@__PURE__*/ mergeModels([
+		"create",
+		"remove",
+		"reject",
+		"clear",
+		"focus",
+		"blur"
+	], ["update:modelValue"]),
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const model = useModel(__props, "modelValue");
+		const props = __props;
+		const emit = __emit;
+		const { t } = useRsI18n();
+		const formContext = useRsFormContext();
+		const formItem = useRsFormItemContext();
+		const boundToItem = computed(() => isRsFormItemBoundControl(formItem, {
+			id: props.id,
+			name: props.name
+		}));
+		const draft = ref("");
+		const editing = ref(props.inputMode === "always");
+		const composing = ref(false);
+		const feedback = ref(null);
+		const autoMessage = ref("");
+		const inputRef = ref(null);
+		const autoId = useId();
+		let feedbackTimer = null;
+		const inputId = computed(() => props.id || autoId);
+		const errorId = computed(() => `${inputId.value}-error`);
+		const feedbackId = computed(() => `${inputId.value}-feedback`);
+		const resolvedSize = useResolvedRsComponentSize(() => props.size);
+		const resolvedRadius = useResolvedRsRadius(() => props.radius, "md");
+		const resolvedDisabled = computed(() => props.disabled || Boolean(formContext?.disabled.value));
+		const resolvedReadonly = computed(() => props.readonly);
+		const isInteractive = computed(() => !resolvedDisabled.value && !resolvedReadonly.value);
+		const resolvedSeparators = computed(() => normalizeRsDynamicTagsSeparators(props.separators));
+		const resolvedPlaceholder = computed(() => props.placeholder ?? t("dynamicTags.placeholder"));
+		const groupLabel = computed(() => props.ariaLabel || t("dynamicTags.label"));
+		const canAddMore = computed(() => props.max === void 0 || model.value.length < props.max);
+		const showInput = computed(() => isInteractive.value && canAddMore.value && (props.inputMode === "always" || editing.value));
+		const showTrigger = computed(() => isInteractive.value && canAddMore.value && props.inputMode === "trigger" && !editing.value);
+		const showClear = computed(() => props.allowClear && model.value.length > 0 && isInteractive.value);
+		const hasError = computed(() => Boolean(props.invalid || boundToItem.value && formItem?.invalid.value || autoMessage.value));
+		const visibleMessage = computed(() => boundToItem.value ? "" : autoMessage.value);
+		const describedBy = computed(() => {
+			if (boundToItem.value) return formItem?.describedBy.value;
+			const ids = [visibleMessage.value ? errorId.value : "", feedback.value ? feedbackId.value : ""].filter(Boolean);
+			return ids.length ? ids.join(" ") : void 0;
+		});
+		const feedbackMessage = computed(() => {
+			if (feedback.value === "duplicate") return t("dynamicTags.duplicate");
+			if (feedback.value === "max") return t("dynamicTags.maxReached");
+			if (feedback.value === "invalid") return t("dynamicTags.invalid");
+			return "";
+		});
+		const rootClass = computed(() => [
+			"rs-dynamic-tags",
+			`rs-dynamic-tags--${resolvedSize.value}`,
+			{
+				"rs-dynamic-tags--disabled": resolvedDisabled.value,
+				"rs-dynamic-tags--readonly": resolvedReadonly.value && !resolvedDisabled.value,
+				"rs-dynamic-tags--editing": showInput.value,
+				"rs-dynamic-tags--feedback": feedback.value != null,
+				"rs-dynamic-tags--invalid": hasError.value
+			}
+		]);
+		const rootStyle = computed(() => ({ "--rs-dynamic-tags-radius-local": rsRadiusCss(resolvedRadius.value) }));
+		function clearFeedbackTimer() {
+			if (feedbackTimer) {
+				clearTimeout(feedbackTimer);
+				feedbackTimer = null;
+			}
+		}
+		function flashFeedback(reason, value) {
+			feedback.value = reason;
+			emit("reject", reason, value);
+			clearFeedbackTimer();
+			feedbackTimer = setTimeout(() => {
+				feedback.value = null;
+				feedbackTimer = null;
+			}, 520);
+		}
+		async function focusInput() {
+			await nextTick();
+			inputRef.value?.focus();
+		}
+		function startEdit() {
+			if (!isInteractive.value || !canAddMore.value) {
+				if (!canAddMore.value) flashFeedback("max", draft.value);
+				return;
+			}
+			editing.value = true;
+			focusInput();
+		}
+		function stopEdit() {
+			draft.value = "";
+			if (props.inputMode === "trigger") editing.value = false;
+		}
+		function addParsed(value) {
+			const parsed = parseRsDynamicTag(value, props.parse);
+			if (parsed === false) {
+				if (value.trim()) flashFeedback("invalid", value.trim());
+				return false;
+			}
+			const reason = canAcceptRsDynamicTag(model.value, parsed, {
+				allowDuplicate: props.allowDuplicate,
+				max: props.max
+			});
+			if (reason !== "ok") {
+				flashFeedback(reason, parsed);
+				return false;
+			}
+			model.value = [...model.value, parsed];
+			emit("create", parsed);
+			return true;
+		}
+		function addMany(values) {
+			let added = false;
+			for (const value of values) if (addParsed(value)) added = true;
+			else if (!canAddMore.value) break;
+			if (added) runValidate("change");
+			return added;
+		}
+		function commitDraft(raw, includeRest) {
+			if (!raw.trim()) return false;
+			if (resolvedSeparators.value.length && draftHasRsDynamicTagsSeparator(raw, resolvedSeparators.value)) {
+				const { tokens, rest } = splitRsDynamicTagsDraft(raw, resolvedSeparators.value);
+				const added = addMany(includeRest && rest.trim() ? [...tokens, rest.trim()] : tokens);
+				draft.value = includeRest ? "" : rest;
+				return added;
+			}
+			const ok = addParsed(raw);
+			if (ok) {
+				draft.value = "";
+				runValidate("change");
+			}
+			return ok;
+		}
+		function commit() {
+			if (composing.value) return;
+			const value = draft.value;
+			if (!value.trim()) {
+				if (props.inputMode === "trigger") stopEdit();
+				return;
+			}
+			commitDraft(value, true);
+			if (props.inputMode === "trigger" && !canAddMore.value) stopEdit();
+			else focusInput();
+		}
+		function onDraftInput() {
+			if (composing.value) return;
+			if (!resolvedSeparators.value.length) return;
+			if (!draftHasRsDynamicTagsSeparator(draft.value, resolvedSeparators.value)) return;
+			const { tokens, rest } = splitRsDynamicTagsDraft(draft.value, resolvedSeparators.value);
+			if (!tokens.length) return;
+			addMany(tokens);
+			draft.value = rest;
+		}
+		function onCompositionEnd() {
+			composing.value = false;
+			onDraftInput();
+		}
+		function onPaste(event) {
+			if (!isInteractive.value || composing.value) return;
+			if (!resolvedSeparators.value.length) return;
+			const text = event.clipboardData?.getData("text") ?? "";
+			if (!text || !draftHasRsDynamicTagsSeparator(text, resolvedSeparators.value)) return;
+			event.preventDefault();
+			const { tokens, rest } = splitRsDynamicTagsDraft(`${draft.value}${text}`, resolvedSeparators.value);
+			const pasted = rest.trim() ? [...tokens, rest.trim()] : tokens;
+			if (pasted.length) addMany(pasted);
+			draft.value = "";
+		}
+		function removeTag(index) {
+			if (!isInteractive.value) return;
+			const next = [...model.value];
+			const [removed] = next.splice(index, 1);
+			model.value = next;
+			if (removed !== void 0) emit("remove", removed, index);
+			runValidate("change");
+		}
+		function clearAll() {
+			if (!isInteractive.value || !model.value.length) return;
+			model.value = [];
+			draft.value = "";
+			emit("clear");
+			runValidate("change");
+		}
+		function onKeydown(event) {
+			if (event.isComposing || composing.value) return;
+			if (event.key === "Enter") {
+				event.preventDefault();
+				commit();
+				return;
+			}
+			if (event.key === "Tab" && draft.value.trim()) {
+				event.preventDefault();
+				commit();
+				return;
+			}
+			if (event.key === "Escape") {
+				event.preventDefault();
+				stopEdit();
+				return;
+			}
+			if (event.key === "Backspace" && !draft.value && model.value.length > 0) removeTag(model.value.length - 1);
+		}
+		function onFocus(event) {
+			emit("focus", event);
+		}
+		function onBlur(event) {
+			if (composing.value) {
+				emit("blur", event);
+				return;
+			}
+			if (props.commitOnBlur && draft.value.trim()) commit();
+			else if (props.inputMode === "trigger") stopEdit();
+			runValidate("blur");
+			emit("blur", event);
+		}
+		async function runValidate(trigger = "submit") {
+			const formRules = formContext?.getFieldRules(props.name) ?? [];
+			const localRules = buildLocalInputRules({ required: props.required });
+			const rules = [...formRules, ...localRules];
+			if (!rules.length) {
+				autoMessage.value = "";
+				return {
+					valid: true,
+					name: props.name
+				};
+			}
+			const result = await runFormFieldRules(model.value, rules, { trigger });
+			autoMessage.value = result.message ?? "";
+			return {
+				valid: result.valid,
+				message: result.message,
+				name: props.name
+			};
+		}
+		function setValue(value) {
+			model.value = coerceRsDynamicTagsValue(value);
+		}
+		function setError(message) {
+			autoMessage.value = message;
+		}
+		function clearValidation() {
+			autoMessage.value = "";
+		}
+		function focus() {
+			if (resolvedDisabled.value) return;
+			if (resolvedReadonly.value) return;
+			if (showInput.value) {
+				focusInput();
+				return;
+			}
+			if (showTrigger.value) startEdit();
+		}
+		function blur() {
+			inputRef.value?.blur();
+		}
+		useRsFormField(() => ({
+			get name() {
+				return props.name;
+			},
+			getValue: () => model.value,
+			setValue,
+			validate: (trigger) => runValidate(trigger ?? "submit"),
+			clearValidation,
+			setError
+		}));
+		watch(() => model.value, () => {
+			if (autoMessage.value) runValidate("change");
+		});
+		watch(() => props.inputMode, (mode) => {
+			editing.value = mode === "always";
+			if (mode === "trigger") draft.value = "";
+		});
+		__expose({
+			validate: runValidate,
+			clearValidation,
+			setValue,
+			setError,
+			focus,
+			blur
+		});
+		function onRootPointerDown(event) {
+			if (!isInteractive.value) return;
+			const target = event.target;
+			if (!target) return;
+			if (target.closest(".rs-tag__close, .rs-dynamic-tags__trigger, .rs-dynamic-tags__input, .rs-dynamic-tags__clear")) return;
+			if (showInput.value) focusInput();
+			else if (showTrigger.value) startEdit();
+		}
+		onBeforeUnmount(() => {
+			clearFeedbackTimer();
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", _hoisted_1, [
+				createElementVNode("fieldset", {
+					class: normalizeClass(rootClass.value),
+					style: normalizeStyle(rootStyle.value),
+					disabled: resolvedDisabled.value || void 0,
+					"aria-readonly": resolvedReadonly.value || void 0,
+					"aria-invalid": hasError.value || void 0,
+					"aria-describedby": describedBy.value,
+					onPointerdown: onRootPointerDown
+				}, [
+					createElementVNode("legend", _hoisted_3, toDisplayString(groupLabel.value), 1),
+					(openBlock(true), createElementBlock(Fragment, null, renderList(model.value, (tag, index) => {
+						return openBlock(), createBlock(RsTag_default, {
+							key: `${tag}-${index}`,
+							closable: isInteractive.value,
+							size: unref(resolvedSize),
+							radius: unref(resolvedRadius),
+							variant: __props.tagVariant,
+							round: __props.round,
+							onClose: ($event) => removeTag(index)
+						}, {
+							default: withCtx(() => [renderSlot(_ctx.$slots, "tag", {
+								tag,
+								index
+							}, () => [createTextVNode(toDisplayString(tag), 1)], true)]),
+							_: 2
+						}, 1032, [
+							"closable",
+							"size",
+							"radius",
+							"variant",
+							"round",
+							"onClose"
+						]);
+					}), 128)),
+					showInput.value ? withDirectives((openBlock(), createElementBlock("input", {
+						key: 0,
+						id: inputId.value,
+						ref_key: "inputRef",
+						ref: inputRef,
+						"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => draft.value = $event),
+						class: "rs-dynamic-tags__input",
+						type: "text",
+						placeholder: resolvedPlaceholder.value,
+						disabled: resolvedDisabled.value,
+						readonly: resolvedReadonly.value,
+						maxlength: __props.maxlength,
+						"aria-label": resolvedPlaceholder.value,
+						"aria-invalid": hasError.value || void 0,
+						"aria-describedby": describedBy.value,
+						onInput: onDraftInput,
+						onPaste,
+						onKeydown,
+						onFocus,
+						onBlur,
+						onCompositionstart: _cache[1] || (_cache[1] = ($event) => composing.value = true),
+						onCompositionend: onCompositionEnd
+					}, null, 40, _hoisted_4)), [[vModelText, draft.value]]) : showTrigger.value ? (openBlock(), createElementBlock("button", {
+						key: 1,
+						type: "button",
+						class: "rs-dynamic-tags__trigger",
+						"aria-label": unref(t)("dynamicTags.add"),
+						onClick: withModifiers(startEdit, ["stop"])
+					}, [renderSlot(_ctx.$slots, "trigger", {}, () => [createVNode(RsIcon_default, {
+						name: "plus",
+						size: 14
+					})], true)], 8, _hoisted_5)) : createCommentVNode("", true),
+					showClear.value ? (openBlock(), createElementBlock("button", {
+						key: 2,
+						type: "button",
+						class: "rs-dynamic-tags__clear",
+						tabindex: "-1",
+						"aria-label": unref(t)("dynamicTags.clear"),
+						onPointerdown: _cache[2] || (_cache[2] = withModifiers(() => {}, ["prevent"])),
+						onClick: withModifiers(clearAll, ["stop"])
+					}, [createVNode(RsIcon_default, {
+						name: "x",
+						size: 14
+					})], 40, _hoisted_6)) : createCommentVNode("", true)
+				], 46, _hoisted_2),
+				visibleMessage.value ? (openBlock(), createElementBlock("p", {
+					key: 0,
+					id: errorId.value,
+					class: "rs-dynamic-tags-field__error",
+					role: "alert"
+				}, toDisplayString(visibleMessage.value), 9, _hoisted_7)) : createCommentVNode("", true),
+				feedbackMessage.value ? (openBlock(), createElementBlock("span", {
+					key: 1,
+					id: feedbackId.value,
+					class: "rs-dynamic-tags-field__sr-only",
+					"aria-live": "polite"
+				}, toDisplayString(feedbackMessage.value), 9, _hoisted_8)) : createCommentVNode("", true)
+			]);
+		};
+	}
+});
+//#endregion
+export { RsDynamicTags_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/dynamic-tags/src/RsDynamicTags.js

@@ -0,0 +1,8 @@
+import './RsDynamicTags.css'
+import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.js";
+import RsDynamicTags_vue_vue_type_script_setup_true_lang_default from "./RsDynamicTags.impl.js";
+
+//#region src/components/dynamic-tags/src/RsDynamicTags.vue
+var RsDynamicTags_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsDynamicTags_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-2213feb0"]]);
+//#endregion
+export { RsDynamicTags_default as default };

package/dist/components/dynamic-tags/src/dynamic-tags-utils.d.ts

@@ -0,0 +1,19 @@
+/** 提交前变换或拒绝草稿。false 表示不写入。 */
+export type RsDynamicTagsParse = (value: string) => string | false;
+export type RsDynamicTagsRejectReason = 'duplicate' | 'max' | 'invalid';
+export declare function normalizeRsDynamicTagsSeparators(separators?: string | readonly string[]): string[];
+/**
+ * 按分隔符切开草稿。最后一段是尚未提交的 rest（可能为空）。
+ * 多字符分隔符按长度优先匹配。
+ */
+export declare function splitRsDynamicTagsDraft(draft: string, separators: readonly string[]): {
+    tokens: string[];
+    rest: string;
+};
+export declare function draftHasRsDynamicTagsSeparator(draft: string, separators: readonly string[]): boolean;
+export declare function parseRsDynamicTag(value: string, parse?: RsDynamicTagsParse): string | false;
+export declare function canAcceptRsDynamicTag(tags: readonly string[], value: string, options: {
+    allowDuplicate?: boolean;
+    max?: number;
+}): 'ok' | RsDynamicTagsRejectReason;
+export declare function coerceRsDynamicTagsValue(value: unknown): string[];

package/dist/components/dynamic-tags/src/dynamic-tags-utils.js

@@ -0,0 +1,60 @@
+//#region src/components/dynamic-tags/src/dynamic-tags-utils.ts
+function normalizeRsDynamicTagsSeparators(separators) {
+	if (separators == null) return [];
+	return (typeof separators === "string" ? [separators] : [...separators]).filter((item) => item.length > 0);
+}
+function escapeRegExp(value) {
+	return value.replace(/[.*+?^${}()|[\]\\]/g, String.raw`\$&`);
+}
+/**
+* 按分隔符切开草稿。最后一段是尚未提交的 rest（可能为空）。
+* 多字符分隔符按长度优先匹配。
+*/
+function splitRsDynamicTagsDraft(draft, separators) {
+	if (!draft) return {
+		tokens: [],
+		rest: ""
+	};
+	if (!separators.length) return {
+		tokens: [],
+		rest: draft
+	};
+	const sorted = [...separators].sort((a, b) => b.length - a.length);
+	const re = new RegExp(sorted.map(escapeRegExp).join("|"));
+	const parts = draft.split(re);
+	const rest = parts.pop() ?? "";
+	return {
+		tokens: parts.map((item) => item.trim()).filter((item) => item.length > 0),
+		rest
+	};
+}
+function draftHasRsDynamicTagsSeparator(draft, separators) {
+	if (!draft || !separators.length) return false;
+	return separators.some((item) => draft.includes(item));
+}
+function parseRsDynamicTag(value, parse) {
+	const trimmed = value.trim();
+	if (!trimmed) return false;
+	if (!parse) return trimmed;
+	const next = parse(trimmed);
+	if (next === false) return false;
+	const out = String(next).trim();
+	return out.length > 0 ? out : false;
+}
+function canAcceptRsDynamicTag(tags, value, options) {
+	if (options.max !== void 0 && tags.length >= options.max) return "max";
+	if (!options.allowDuplicate && tags.includes(value)) return "duplicate";
+	return "ok";
+}
+function asTagText(value) {
+	if (typeof value === "string") return value;
+	if (typeof value === "number" || typeof value === "boolean" || typeof value === "bigint") return String(value);
+	return "";
+}
+function coerceRsDynamicTagsValue(value) {
+	if (Array.isArray(value)) return value.map(asTagText).filter((item) => item.length > 0);
+	const text = asTagText(value).trim();
+	return text ? [text] : [];
+}
+//#endregion
+export { canAcceptRsDynamicTag, coerceRsDynamicTagsValue, draftHasRsDynamicTagsSeparator, normalizeRsDynamicTagsSeparators, parseRsDynamicTag, splitRsDynamicTagsDraft };

package/dist/components/empty/index.d.ts

@@ -0,0 +1,2 @@
+export { default as RsEmpty } from './src/RsEmpty.js';
+export type { RsEmptyPreset, RsEmptySize } from './src/empty-utils';

package/dist/components/empty/src/RsEmpty.css

@@ -0,0 +1,134 @@
+
+.rs-empty[data-v-15fa5815] {
+  --rs-empty-pad-block: calc(var(--rs-space-xl) + var(--rs-space-xl) + var(--rs-space-sm));
+  --rs-empty-pad-inline: var(--rs-space-xl);
+  --rs-empty-gap: var(--rs-space-md);
+  --rs-empty-border: var(--rs-border);
+  --rs-empty-bg: color-mix(in srgb, var(--rs-surface) 80%, var(--rs-bg));
+  --rs-empty-title: var(--rs-text-primary);
+  --rs-empty-description: var(--rs-text-secondary);
+  --rs-empty-icon-border: var(--rs-border);
+  --rs-empty-icon-bg: var(--rs-surface);
+  --rs-empty-icon-fg: var(--rs-text-secondary);
+  --rs-empty-icon-shadow: var(--rs-shadow-sm);
+  --rs-empty-icon-size: 3.5rem;
+  --rs-empty-figure-size: 5rem;
+  --rs-empty-title-size: var(--rs-font-size-sm);
+  --rs-empty-title-weight: var(--rs-font-weight-medium);
+  --rs-empty-desc-size: var(--rs-font-size-sm);
+  --rs-empty-illustration: var(--rs-text-tertiary);
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: var(--rs-empty-gap);
+  padding-block: var(--rs-empty-pad-block);
+  padding-inline: var(--rs-empty-pad-inline);
+  border-radius: var(--rs-empty-radius, var(--rs-radius));
+  border: 1px dashed var(--rs-empty-border);
+  background: var(--rs-empty-bg);
+  color: var(--rs-empty-description);
+  text-align: center;
+}
+.rs-empty--sm[data-v-15fa5815] {
+  --rs-empty-pad-block: var(--rs-space-xl);
+  --rs-empty-gap: var(--rs-space-sm);
+  --rs-empty-icon-size: 2.5rem;
+  --rs-empty-figure-size: 3.5rem;
+  --rs-empty-title-size: var(--rs-font-size-xs);
+  --rs-empty-desc-size: var(--rs-font-size-xs);
+}
+.rs-empty--lg[data-v-15fa5815] {
+  --rs-empty-pad-block: calc(var(--rs-space-xl) * 3);
+  --rs-empty-gap: var(--rs-space-lg);
+  --rs-empty-icon-size: 4.5rem;
+  --rs-empty-figure-size: 6.5rem;
+  --rs-empty-title-size: var(--rs-font-size-base);
+  --rs-empty-desc-size: var(--rs-font-size-base);
+}
+.rs-empty--fill[data-v-15fa5815] {
+  flex: 1 1 auto;
+  align-self: stretch;
+  width: 100%;
+  height: 100%;
+  min-width: 0;
+  min-height: 0;
+  border-radius: 0;
+  border-color: transparent;
+  background: transparent;
+}
+.rs-empty__icon[data-v-15fa5815] {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--rs-empty-icon-fg);
+}
+.rs-empty__icon--badge[data-v-15fa5815] {
+  width: var(--rs-empty-icon-size);
+  height: var(--rs-empty-icon-size);
+  border-radius: var(--rs-empty-icon-radius, var(--rs-radius-full));
+  border: 1px solid var(--rs-empty-icon-border);
+  background: var(--rs-empty-icon-bg);
+  box-shadow: var(--rs-empty-icon-shadow);
+}
+.rs-empty__icon--figure[data-v-15fa5815] {
+  width: var(--rs-empty-figure-size);
+  height: var(--rs-empty-figure-size);
+  color: var(--rs-empty-illustration);
+}
+.rs-empty__svg[data-v-15fa5815],
+.rs-empty__remote[data-v-15fa5815] {
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+.rs-empty__remote[data-v-15fa5815] {
+  object-fit: contain;
+}
+.rs-empty__text[data-v-15fa5815] {
+  max-width: 28rem;
+}
+.rs-empty__title[data-v-15fa5815] {
+  margin: 0;
+  font-size: var(--rs-empty-title-size);
+  font-weight: var(--rs-empty-title-weight);
+  color: var(--rs-empty-title);
+}
+.rs-empty__description[data-v-15fa5815] {
+  margin: 0;
+  font-size: var(--rs-empty-desc-size);
+  color: var(--rs-empty-description);
+  line-height: var(--rs-line-height-normal);
+}
+.rs-empty__description--offset[data-v-15fa5815] {
+  margin-block-start: var(--rs-space-xs);
+}
+.rs-empty__actions[data-v-15fa5815] {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  align-items: center;
+  gap: var(--rs-space-sm);
+}
+@media (forced-colors: active) {
+.rs-empty[data-v-15fa5815] {
+    border-color: CanvasText;
+    background: Canvas;
+    color: CanvasText;
+}
+.rs-empty--fill[data-v-15fa5815] {
+    border-color: transparent;
+    background: transparent;
+}
+.rs-empty__icon--badge[data-v-15fa5815] {
+    border-color: CanvasText;
+    background: Canvas;
+    box-shadow: none;
+}
+.rs-empty__title[data-v-15fa5815],
+  .rs-empty__description[data-v-15fa5815],
+  .rs-empty__icon[data-v-15fa5815] {
+    color: CanvasText;
+}
+}