niuma-ui 2.0.3 → 2.0.9

package/dist/components/steps/src/RsSteps.d.ts

@@ -1,22 +1,86 @@
-import type { RsStepItem, RsStepsOrientation, RsStepsSize } from './steps-utils';
+import type { RsStepItem, RsStepStatus, RsStepsLabelPlacement, RsStepsOrientation, RsStepsSize, RsStepsType } from './steps-utils';
 type __VLS_Props = {
     items: RsStepItem[];
     orientation?: RsStepsOrientation;
     size?: RsStepsSize;
     clickable?: boolean;
+    /** 标题在指示器旁（end）或下方（bottom）。竖排时仍在旁。 */
+    labelPlacement?: RsStepsLabelPlacement;
+    /** default 数字/图标；dot 圆点。 */
+    type?: RsStepsType;
+    /** 覆盖当前步状态（单项 status 仍优先）。 */
+    status?: RsStepStatus;
+    /** 当前步完成百分比 0–100。只影响 default + process 指示器。 */
+    percent?: number;
+    ariaLabel?: string;
+    id?: string;
 };
+declare function goTo(value: string): boolean;
+declare function next(): string | undefined;
+declare function prev(): string | undefined;
+declare function focus(value?: string): void;
 type __VLS_ModelProps = {
     modelValue?: string;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: string | undefined) => any;
+declare var __VLS_9: {
+    item: RsStepItem;
+    index: number;
+    status: RsStepStatus;
+    active: boolean;
+    disabled: boolean;
+}, __VLS_11: {
+    item: RsStepItem;
+    index: number;
+    status: RsStepStatus;
+    active: boolean;
+    disabled: boolean;
+}, __VLS_28: {
+    item: RsStepItem;
+    index: number;
+    status: RsStepStatus;
+    active: boolean;
+    disabled: boolean;
+}, __VLS_30: {
+    item: RsStepItem;
+    index: number;
+    status: RsStepStatus;
+    active: boolean;
+    disabled: boolean;
+};
+type __VLS_Slots = {} & {
+    item?: (props: typeof __VLS_9) => any;
+} & {
+    icon?: (props: typeof __VLS_11) => any;
+} & {
+    title?: (props: typeof __VLS_28) => any;
+} & {
+    description?: (props: typeof __VLS_30) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {
+    next: typeof next;
+    prev: typeof prev;
+    goTo: typeof goTo;
+    focus: typeof focus;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    change: (value: string, item: RsStepItem) => any;
+    click: (item: RsStepItem, event: MouseEvent) => any;
+    "update:modelValue": (value: string) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:modelValue"?: ((value: string | undefined) => any) | undefined;
+    onChange?: ((value: string, item: RsStepItem) => any) | undefined;
+    onClick?: ((item: RsStepItem, event: MouseEvent) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
 }>, {
-    size: RsStepsSize;
+    type: RsStepsType;
     orientation: RsStepsOrientation;
+    labelPlacement: RsStepsLabelPlacement;
     clickable: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/steps/src/RsSteps.impl.js

@@ -1,53 +1,193 @@
-import { resolveStepStatus } from "./steps-utils.js";
-import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, mergeModels, normalizeClass, openBlock, renderList, toDisplayString, unref, useModel } from "vue";
+import { useRsConfigOptional } from "../../../composables/useRsConfig.js";
+import { resolveDirMode } from "../../../locale/apply.js";
+import { useRsI18n } from "../../../composables/useRsI18n.js";
+import RsIcon_default from "../../icon/src/RsIcon.js";
+import { useResolvedRsComponentSize } from "../../_shared/src/resolve-size.js";
+import { buildStepRenderItems, clampStepPercent, resolveActiveStepIndex, resolveAdjacentStepValue, resolveSelectableStepValues, resolveStepKeyboardMove } from "./steps-utils.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, mergeModels, mergeProps, normalizeClass, normalizeStyle, openBlock, ref, renderList, renderSlot, resolveDynamicComponent, toDisplayString, unref, useModel, withCtx } from "vue";
 //#region src/components/steps/src/RsSteps.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = ["disabled", "onClick"];
-var _hoisted_2 = { class: "rs-steps__indicator" };
-var _hoisted_3 = { class: "rs-steps__body" };
-var _hoisted_4 = { class: "rs-steps__title" };
-var _hoisted_5 = {
+var _hoisted_1 = ["id", "aria-label"];
+var _hoisted_2 = { class: "rs-steps__list" };
+var _hoisted_3 = ["aria-current"];
+var _hoisted_4 = { class: "rs-steps__mark" };
+var _hoisted_5 = { class: "rs-steps__body" };
+var _hoisted_6 = { class: "rs-steps__title" };
+var _hoisted_7 = {
 	key: 0,
 	class: "rs-steps__description"
 };
-var _hoisted_6 = {
-	key: 0,
-	class: "rs-steps__separator"
-};
+var _hoisted_8 = { class: "rs-steps__status" };
 var RsSteps_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "RsSteps",
 	__name: "RsSteps",
 	props: /*@__PURE__*/ mergeModels({
 		items: {},
 		orientation: { default: "horizontal" },
-		size: { default: "md" },
+		size: {},
 		clickable: {
 			type: Boolean,
 			default: false
-		}
+		},
+		labelPlacement: { default: "end" },
+		type: { default: "default" },
+		status: {},
+		percent: {},
+		ariaLabel: {},
+		id: {}
 	}, {
-		"modelValue": {},
+		"modelValue": { default: "" },
 		"modelModifiers": {}
 	}),
-	emits: ["update:modelValue"],
-	setup(__props) {
+	emits: /*@__PURE__*/ mergeModels(["change", "click"], ["update:modelValue"]),
+	setup(__props, { expose: __expose, emit: __emit }) {
 		const model = useModel(__props, "modelValue");
 		const props = __props;
-		const activeIndex = computed(() => Math.max(0, props.items.findIndex((item) => item.value === model.value)));
-		function selectStep(item) {
+		const emit = __emit;
+		const { t, locale } = useRsI18n();
+		const config = useRsConfigOptional();
+		const rootRef = ref(null);
+		const resolvedSize = useResolvedRsComponentSize(() => props.size);
+		const writingDir = computed(() => resolveDirMode(config?.dir.value ?? "auto", locale.value));
+		const activeIndex = computed(() => resolveActiveStepIndex(props.items, model.value));
+		const rows = computed(() => buildStepRenderItems(props.items, activeIndex.value, props.type, props.status));
+		const selectableValues = computed(() => resolveSelectableStepValues(props.items));
+		const resolvedPercent = computed(() => clampStepPercent(props.percent));
+		const navLabel = computed(() => props.ariaLabel || t("steps.label"));
+		const currentValue = computed(() => props.items[activeIndex.value]?.value);
+		function statusLabel(status) {
+			return t(`steps.${status}`);
+		}
+		function slotProps(row) {
+			return {
+				item: row.item,
+				index: row.index,
+				status: row.status,
+				active: row.active,
+				disabled: row.disabled
+			};
+		}
+		function showPercent(row) {
+			return props.type === "default" && row.status === "process" && resolvedPercent.value != null;
+		}
+		function findTrigger(value) {
+			const root = rootRef.value;
+			if (!root) return null;
+			const nodes = root.querySelectorAll("[data-rs-step]");
+			for (const node of nodes) if (node.dataset.rsStep === value) return node;
+			return null;
+		}
+		function goTo(value) {
+			const item = props.items.find((entry) => entry.value === value);
+			if (!item || item.disabled) return false;
+			if (model.value === value) return true;
+			model.value = value;
+			emit("change", value, item);
+			return true;
+		}
+		function next() {
+			const value = resolveAdjacentStepValue(selectableValues.value, currentValue.value, 1);
+			return value && goTo(value) ? value : void 0;
+		}
+		function prev() {
+			const value = resolveAdjacentStepValue(selectableValues.value, currentValue.value, -1);
+			return value && goTo(value) ? value : void 0;
+		}
+		function focus(value) {
+			const target = value || currentValue.value || selectableValues.value[0];
+			if (!target) return;
+			findTrigger(target)?.focus();
+		}
+		function selectStep(item, event) {
+			emit("click", item, event);
 			if (!props.clickable || item.disabled) return;
-			model.value = item.value;
+			goTo(item.value);
+		}
+		function onKeydown(event) {
+			if (!props.clickable) return;
+			const target = event.target;
+			if (!(target instanceof HTMLElement) || !target.closest("[data-rs-step]")) return;
+			if (target.closest("input, textarea, select, [contenteditable=\"true\"]")) return;
+			const move = resolveStepKeyboardMove(event.key, props.orientation, writingDir.value === "rtl");
+			if (move == null) return;
+			const values = selectableValues.value;
+			if (values.length === 0) return;
+			event.preventDefault();
+			const focused = target.closest("[data-rs-step]")?.dataset.rsStep;
+			let nextValue;
+			if (move === "start") nextValue = values[0];
+			else if (move === "end") nextValue = values[values.length - 1];
+			else nextValue = resolveAdjacentStepValue(values, focused, move);
+			if (nextValue) focus(nextValue);
 		}
+		__expose({
+			next,
+			prev,
+			goTo,
+			focus
+		});
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("ol", { class: normalizeClass(["rs-steps", [`rs-steps--${__props.orientation}`, `rs-steps--${__props.size}`]]) }, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.items, (item, index) => {
+			return openBlock(), createElementBlock("nav", {
+				id: __props.id,
+				ref_key: "rootRef",
+				ref: rootRef,
+				class: normalizeClass(["rs-steps", [
+					`rs-steps--${__props.orientation}`,
+					`rs-steps--${unref(resolvedSize)}`,
+					`rs-steps--label-${__props.labelPlacement}`,
+					`rs-steps--${__props.type}`,
+					{ "rs-steps--clickable": __props.clickable }
+				]]),
+				"aria-label": navLabel.value,
+				onKeydown
+			}, [createElementVNode("ol", _hoisted_2, [(openBlock(true), createElementBlock(Fragment, null, renderList(rows.value, (row, index) => {
 				return openBlock(), createElementBlock("li", {
-					key: item.value,
-					class: normalizeClass(["rs-steps__item", `rs-steps__item--${unref(resolveStepStatus)(index, activeIndex.value, item.status)}`])
-				}, [createElementVNode("button", {
-					type: "button",
+					key: row.item.value,
+					class: normalizeClass(["rs-steps__item", [`rs-steps__item--${row.status}`, {
+						"rs-steps__item--active": row.active,
+						"rs-steps__item--disabled": row.disabled
+					}]]),
+					"aria-current": row.active ? "step" : void 0
+				}, [(openBlock(), createBlock(resolveDynamicComponent(__props.clickable ? "button" : "div"), {
+					type: __props.clickable ? "button" : void 0,
 					class: "rs-steps__trigger",
-					disabled: !__props.clickable || item.disabled,
-					onClick: ($event) => selectStep(item)
-				}, [createElementVNode("span", _hoisted_2, toDisplayString(index + 1), 1), createElementVNode("span", _hoisted_3, [createElementVNode("span", _hoisted_4, toDisplayString(item.title), 1), item.description ? (openBlock(), createElementBlock("span", _hoisted_5, toDisplayString(item.description), 1)) : createCommentVNode("", true)])], 8, _hoisted_1), index < __props.items.length - 1 ? (openBlock(), createElementBlock("span", _hoisted_6)) : createCommentVNode("", true)], 2);
-			}), 128))], 2);
+					"data-rs-step": row.item.value,
+					tabindex: __props.clickable && !row.disabled ? 0 : -1,
+					"aria-disabled": row.disabled ? "true" : void 0,
+					onClick: ($event) => selectStep(row.item, $event)
+				}, {
+					default: withCtx(() => [renderSlot(_ctx.$slots, "item", mergeProps({ ref_for: true }, slotProps(row)), () => [createElementVNode("span", {
+						class: normalizeClass(["rs-steps__indicator", { "rs-steps__indicator--percent": showPercent(row) }]),
+						style: normalizeStyle(showPercent(row) ? { "--rs-steps-percent": String(resolvedPercent.value) } : void 0)
+					}, [createElementVNode("span", _hoisted_4, [renderSlot(_ctx.$slots, "icon", mergeProps({ ref_for: true }, slotProps(row)), () => [row.indicator === "icon" && row.item.icon ? (openBlock(), createBlock(RsIcon_default, {
+						key: 0,
+						name: row.item.icon,
+						size: unref(resolvedSize)
+					}, null, 8, ["name", "size"])) : row.indicator === "check" ? (openBlock(), createBlock(RsIcon_default, {
+						key: 1,
+						name: "check",
+						size: unref(resolvedSize)
+					}, null, 8, ["size"])) : row.indicator === "error" ? (openBlock(), createBlock(RsIcon_default, {
+						key: 2,
+						name: "x",
+						size: unref(resolvedSize)
+					}, null, 8, ["size"])) : row.indicator !== "dot" ? (openBlock(), createElementBlock(Fragment, { key: 3 }, [createTextVNode(toDisplayString(row.index + 1), 1)], 64)) : createCommentVNode("", true)], true)])], 6), createElementVNode("span", _hoisted_5, [
+						createElementVNode("span", _hoisted_6, [renderSlot(_ctx.$slots, "title", mergeProps({ ref_for: true }, slotProps(row)), () => [createTextVNode(toDisplayString(row.item.title), 1)], true)]),
+						row.item.description || _ctx.$slots.description ? (openBlock(), createElementBlock("span", _hoisted_7, [renderSlot(_ctx.$slots, "description", mergeProps({ ref_for: true }, slotProps(row)), () => [createTextVNode(toDisplayString(row.item.description), 1)], true)])) : createCommentVNode("", true),
+						createElementVNode("span", _hoisted_8, toDisplayString(statusLabel(row.status)), 1)
+					])], true)]),
+					_: 2
+				}, 1032, [
+					"type",
+					"data-rs-step",
+					"tabindex",
+					"aria-disabled",
+					"onClick"
+				])), index < rows.value.length - 1 ? (openBlock(), createElementBlock("span", {
+					key: 0,
+					class: normalizeClass(["rs-steps__separator", { "rs-steps__separator--finish": row.completedSeparator }]),
+					"aria-hidden": "true"
+				}, null, 2)) : createCommentVNode("", true)], 10, _hoisted_3);
+			}), 128))])], 42, _hoisted_1);
 		};
 	}
 });

package/dist/components/steps/src/RsSteps.js

@@ -3,6 +3,6 @@ import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_exp
 import RsSteps_vue_vue_type_script_setup_true_lang_default from "./RsSteps.impl.js";
 
 //#region src/components/steps/src/RsSteps.vue
-var RsSteps_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsSteps_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-b7fdd868"]]);
+var RsSteps_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsSteps_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-773a38b0"]]);
 //#endregion
 export { RsSteps_default as default };

package/dist/components/steps/src/steps-utils.d.ts

@@ -1,12 +1,62 @@
+import type { RsComponentSize } from '../../../theme/types';
 export type RsStepStatus = 'wait' | 'process' | 'finish' | 'error';
 export type RsStepsOrientation = 'horizontal' | 'vertical';
-export type RsStepsSize = 'sm' | 'md';
+export type RsStepsSize = RsComponentSize;
+export type RsStepsLabelPlacement = 'end' | 'bottom';
+export type RsStepsType = 'default' | 'dot';
 export interface RsStepItem {
     value: string;
     title: string;
     description?: string;
     status?: RsStepStatus;
     disabled?: boolean;
+    /** Lucide kebab-case。有值时覆盖默认数字 / 勾 / 叉。 */
+    icon?: string;
 }
+export interface RsStepsRenderItem {
+    item: RsStepItem;
+    index: number;
+    status: RsStepStatus;
+    active: boolean;
+    disabled: boolean;
+    completedSeparator: boolean;
+    indicator: 'number' | 'icon' | 'check' | 'error' | 'dot';
+}
+export interface RsStepsItemSlot {
+    item: RsStepItem;
+    index: number;
+    status: RsStepStatus;
+    active: boolean;
+    disabled: boolean;
+}
+export interface RsStepsExpose {
+    /** 跳到下一个未禁用步骤。已在末级或没有可选项时返回 undefined。 */
+    next: () => string | undefined;
+    /** 跳到上一个未禁用步骤。已在首级或没有可选项时返回 undefined。 */
+    prev: () => string | undefined;
+    /** 跳到指定 value。找不到或禁用时返回 false。 */
+    goTo: (value: string) => boolean;
+    /** 焦点落到指定步骤；未传则落到当前步。不可点时也能落（tabindex=-1）。 */
+    focus: (value?: string) => void;
+}
+export type RsStepsInstance = RsStepsExpose & {
+    $el: HTMLElement;
+};
 export declare function resolveStepStatus(index: number, activeIndex: number, explicit?: RsStepStatus): RsStepStatus;
 export declare function isStepSeparatorCompleted(status: RsStepStatus): boolean;
+/** model 对不上任一项时回退 0，与原先 Math.max(0, findIndex) 一致。 */
+export declare function resolveActiveStepIndex(items: readonly RsStepItem[], value?: string): number;
+/**
+ * 单项 status 优先；当前步可用组件级 status 覆盖自动推导（对标 Ant Design status）。
+ */
+export declare function resolveCurrentStepStatus(index: number, activeIndex: number, itemStatus?: RsStepStatus, currentStatus?: RsStepStatus): RsStepStatus;
+export declare function clampStepPercent(percent?: number): number | undefined;
+export declare function resolveSelectableStepValues(items: readonly RsStepItem[]): string[];
+export declare function resolveAdjacentStepValue(values: readonly string[], current: string | undefined, delta: number): string | undefined;
+/**
+ * 可点步骤的键盘位移。竖排只用上下；横排左右在 RTL 下对调。
+ * Home / End 返回端点；不处理的键返回 null。
+ */
+export declare function resolveStepKeyboardMove(key: string, orientation: RsStepsOrientation, rtl?: boolean): number | 'start' | 'end' | null;
+export declare function resolveStepIndicator(status: RsStepStatus, type: RsStepsType, icon?: string): RsStepsRenderItem['indicator'];
+export declare function buildStepRenderItems(items: readonly RsStepItem[], activeIndex: number, type?: RsStepsType, currentStatus?: RsStepStatus): RsStepsRenderItem[];

package/dist/components/steps/src/steps-utils.js

@@ -8,5 +8,71 @@ function resolveStepStatus(index, activeIndex, explicit) {
 function isStepSeparatorCompleted(status) {
 	return status === "finish";
 }
+/** model 对不上任一项时回退 0，与原先 Math.max(0, findIndex) 一致。 */
+function resolveActiveStepIndex(items, value) {
+	return Math.max(0, items.findIndex((item) => item.value === value));
+}
+/**
+* 单项 status 优先；当前步可用组件级 status 覆盖自动推导（对标 Ant Design status）。
+*/
+function resolveCurrentStepStatus(index, activeIndex, itemStatus, currentStatus) {
+	if (itemStatus) return itemStatus;
+	if (index === activeIndex && currentStatus) return currentStatus;
+	return resolveStepStatus(index, activeIndex);
+}
+function clampStepPercent(percent) {
+	if (percent == null || Number.isNaN(Number(percent))) return void 0;
+	return Math.min(100, Math.max(0, Number(percent)));
+}
+function resolveSelectableStepValues(items) {
+	const values = [];
+	for (const item of items) if (!item.disabled) values.push(item.value);
+	return values;
+}
+function resolveAdjacentStepValue(values, current, delta) {
+	if (values.length === 0) return void 0;
+	const index = current ? values.indexOf(current) : -1;
+	let next = index + delta;
+	if (index < 0) next = delta > 0 ? 0 : values.length - 1;
+	if (next < 0 || next >= values.length) return void 0;
+	return values[next];
+}
+/**
+* 可点步骤的键盘位移。竖排只用上下；横排左右在 RTL 下对调。
+* Home / End 返回端点；不处理的键返回 null。
+*/
+function resolveStepKeyboardMove(key, orientation, rtl = false) {
+	if (key === "Home") return "start";
+	if (key === "End") return "end";
+	if (orientation === "vertical") {
+		if (key === "ArrowUp") return -1;
+		if (key === "ArrowDown") return 1;
+		return null;
+	}
+	if (key === "ArrowLeft") return rtl ? 1 : -1;
+	if (key === "ArrowRight") return rtl ? -1 : 1;
+	return null;
+}
+function resolveStepIndicator(status, type, icon) {
+	if (type === "dot") return "dot";
+	if (icon) return "icon";
+	if (status === "finish") return "check";
+	if (status === "error") return "error";
+	return "number";
+}
+function buildStepRenderItems(items, activeIndex, type = "default", currentStatus) {
+	return items.map((item, index) => {
+		const status = resolveCurrentStepStatus(index, activeIndex, item.status, currentStatus);
+		return {
+			item,
+			index,
+			status,
+			active: index === activeIndex,
+			disabled: Boolean(item.disabled),
+			completedSeparator: isStepSeparatorCompleted(status),
+			indicator: resolveStepIndicator(status, type, item.icon)
+		};
+	});
+}
 //#endregion
-export { isStepSeparatorCompleted, resolveStepStatus };
+export { buildStepRenderItems, clampStepPercent, isStepSeparatorCompleted, resolveActiveStepIndex, resolveAdjacentStepValue, resolveCurrentStepStatus, resolveSelectableStepValues, resolveStepIndicator, resolveStepKeyboardMove, resolveStepStatus };

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

@@ -1,2 +1,3 @@
 export { default as RsSwitch } from './src/RsSwitch.js';
-export type { RsSwitchValue } from './src/RsSwitch.js';
+export type { RsSwitchExpose, RsSwitchInstance } from './src/RsSwitch.js';
+export type { RsSwitchValue } from './src/switch-utils';

package/dist/components/switch/src/RsSwitch.css

@@ -1,13 +1,14 @@
 
 /**
- * 轨道高度 = control-height * 2/3（对齐 Ant：Input SM 24 / Switch SM 16）。
+ * 轨道高度 = control-height * 2/3（与 Input SM 24 / Switch SM 16 同比例）。
  * 宽高、内边距、滑块均由 token / calc 推导，不写死档位 px。
  * 外层 min-height = control-height，保证与同排输入垂直居中对齐。
  */
-.rs-switch {
+.rs-switch[data-v-ba0ee1d6] {
   --rs-switch-pad: calc(var(--rs-switch-track-h) * 0.12);
   --rs-switch-track-w: calc(var(--rs-switch-track-h) * 1.75);
   --rs-switch-thumb: calc(var(--rs-switch-track-h) - var(--rs-switch-pad) * 2 - 2px);
+  position: relative;
   display: inline-flex;
   align-items: center;
   gap: var(--rs-space-xs);
@@ -17,11 +18,22 @@
   user-select: none;
   color: var(--rs-text);
 }
-.rs-switch--disabled {
+.rs-switch--disabled[data-v-ba0ee1d6] {
   cursor: not-allowed;
   opacity: 0.55;
 }
-.rs-switch__root {
+.rs-switch__input[data-v-ba0ee1d6] {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  margin: -1px;
+  padding: 0;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+.rs-switch__root[data-v-ba0ee1d6] {
   position: relative;
   display: inline-flex;
   flex-shrink: 0;
@@ -39,36 +51,36 @@
     background-color var(--rs-transition-fast),
     border-color var(--rs-transition-fast);
 }
-.rs-switch--disabled .rs-switch__root {
+.rs-switch--disabled .rs-switch__root[data-v-ba0ee1d6] {
   cursor: not-allowed;
 }
-.rs-switch:hover:not(.rs-switch--disabled):not(.rs-switch--checked) .rs-switch__root {
+.rs-switch:hover:not(.rs-switch--disabled):not(.rs-switch--checked) .rs-switch__root[data-v-ba0ee1d6] {
   border-color: var(--rs-primary);
 }
-.rs-switch__root:focus-visible {
+.rs-switch__input:focus-visible + .rs-switch__root[data-v-ba0ee1d6] {
   box-shadow: 0 0 0 var(--rs-focus-ring-width, 2px) var(--rs-focus-ring);
 }
-.rs-switch--checked .rs-switch__root {
+.rs-switch--checked .rs-switch__root[data-v-ba0ee1d6] {
   background: var(--rs-primary);
   border-color: var(--rs-primary);
 }
-.rs-switch--ssm {
+.rs-switch--ssm[data-v-ba0ee1d6] {
   --rs-switch-track-h: calc(var(--rs-control-height-ssm) * 2 / 3);
   min-height: var(--rs-control-height-ssm);
 }
-.rs-switch--sm {
+.rs-switch--sm[data-v-ba0ee1d6] {
   --rs-switch-track-h: calc(var(--rs-control-height-sm) * 2 / 3);
   min-height: var(--rs-control-height-sm);
 }
-.rs-switch--md {
+.rs-switch--md[data-v-ba0ee1d6] {
   --rs-switch-track-h: calc(var(--rs-control-height-md) * 2 / 3);
   min-height: var(--rs-control-height-md);
 }
-.rs-switch--lg {
+.rs-switch--lg[data-v-ba0ee1d6] {
   --rs-switch-track-h: calc(var(--rs-control-height-lg) * 2 / 3);
   min-height: var(--rs-control-height-lg);
 }
-.rs-switch__thumb {
+.rs-switch__thumb[data-v-ba0ee1d6] {
   position: absolute;
   top: 50%;
   inset-inline-start: var(--rs-switch-pad);
@@ -81,19 +93,25 @@
   transform: translateY(-50%);
   transition: inset-inline var(--rs-transition-fast);
 }
-.rs-switch--checked .rs-switch__thumb {
+.rs-switch--checked .rs-switch__thumb[data-v-ba0ee1d6] {
   inset-inline-start: auto;
   inset-inline-end: var(--rs-switch-pad);
 }
-.rs-switch__label {
+.rs-switch__label[data-v-ba0ee1d6] {
   font-size: var(--rs-font-size-sm);
   line-height: var(--rs-line-height-normal);
   cursor: pointer;
 }
-.rs-switch--disabled .rs-switch__label {
+.rs-switch--disabled .rs-switch__label[data-v-ba0ee1d6] {
   cursor: not-allowed;
 }
-.rs-switch--ssm .rs-switch__label,
-.rs-switch--sm .rs-switch__label {
+.rs-switch--ssm .rs-switch__label[data-v-ba0ee1d6],
+.rs-switch--sm .rs-switch__label[data-v-ba0ee1d6] {
   font-size: var(--rs-font-size-xs);
 }
+@media (prefers-reduced-motion: reduce) {
+.rs-switch__root[data-v-ba0ee1d6],
+  .rs-switch__thumb[data-v-ba0ee1d6] {
+    transition: none;
+}
+}

package/dist/components/switch/src/RsSwitch.d.ts

@@ -1,12 +1,25 @@
 import type { RsComponentSize } from '../../../theme/types';
-/** Switch v-model 取值：默认 boolean，也可为业务码如 'Y'/'N'、1/0 */
-export type RsSwitchValue = boolean | string | number;
+import { type RsSwitchValue } from './switch-utils';
+export type { RsSwitchValue };
+/**
+ * RsSwitch 模板 ref 请用此类型。
+ * 不要写 `InstanceType<typeof RsSwitch>`：组件实例类型过深，vue-tsc 会报 Excessive stack depth。
+ */
+export interface RsSwitchExpose {
+    focus: () => void;
+}
+/** 模板 ref 实例：expose + 根节点 */
+export type RsSwitchInstance = RsSwitchExpose & {
+    $el: HTMLElement;
+};
 type __VLS_Props = {
     disabled?: boolean;
     size?: RsComponentSize;
     /** 无障碍名称；有默认插槽文案时可省略 */
     ariaLabel?: string;
     id?: string;
+    /** 原生 name，供表单提交 */
+    name?: string;
     /** 打开时写入 v-model 的值，默认 true */
     checkedValue?: RsSwitchValue;
     /** 关闭时写入 v-model 的值，默认 false */
@@ -16,11 +29,11 @@ type __VLS_ModelProps = {
     modelValue?: RsSwitchValue;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare var __VLS_14: {};
+declare var __VLS_1: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_14) => any;
+    default?: (props: typeof __VLS_1) => any;
 };
-declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, RsSwitchExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     change: (value: RsSwitchValue) => any;
     "update:modelValue": (value: RsSwitchValue) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{