niuma-ui 1.3.8 → 2.0.0

package/dist/components/sidebar/src/RsSidebar.impl.js

@@ -0,0 +1,63 @@
+import { createCommentVNode, createElementBlock, createElementVNode, defineComponent, mergeModels, normalizeClass, openBlock, renderSlot, toDisplayString, useModel } from "vue";
+//#region src/components/sidebar/src/RsSidebar.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	key: 0,
+	class: "rs-sidebar__header"
+};
+var _hoisted_2 = { class: "rs-sidebar__title-wrap" };
+var _hoisted_3 = {
+	key: 0,
+	class: "rs-sidebar__title"
+};
+var _hoisted_4 = {
+	key: 1,
+	class: "rs-sidebar__subtitle"
+};
+var _hoisted_5 = { class: "rs-sidebar__body" };
+var _hoisted_6 = {
+	key: 1,
+	class: "rs-sidebar__footer"
+};
+var RsSidebar_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "RsSidebar",
+	props: /*@__PURE__*/ mergeModels({
+		title: {},
+		subtitle: {},
+		collapsible: {
+			type: Boolean,
+			default: false
+		},
+		width: { default: "md" },
+		orientation: { default: "vertical" },
+		placement: { default: "left" }
+	}, {
+		"collapsed": {
+			type: Boolean,
+			default: false
+		},
+		"collapsedModifiers": {}
+	}),
+	emits: ["update:collapsed"],
+	setup(__props) {
+		const collapsed = useModel(__props, "collapsed");
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("aside", { class: normalizeClass(["rs-sidebar", [
+				`rs-sidebar--${__props.width}`,
+				`rs-sidebar--${__props.orientation}`,
+				`rs-sidebar--${__props.placement}`,
+				{ "rs-sidebar--collapsed": collapsed.value }
+			]]) }, [
+				__props.title || __props.subtitle || __props.collapsible || _ctx.$slots.header ? (openBlock(), createElementBlock("header", _hoisted_1, [renderSlot(_ctx.$slots, "header", {}, () => [createElementVNode("div", _hoisted_2, [__props.title ? (openBlock(), createElementBlock("strong", _hoisted_3, toDisplayString(__props.title), 1)) : createCommentVNode("", true), __props.subtitle && !collapsed.value ? (openBlock(), createElementBlock("span", _hoisted_4, toDisplayString(__props.subtitle), 1)) : createCommentVNode("", true)]), __props.collapsible ? (openBlock(), createElementBlock("button", {
+					key: 0,
+					type: "button",
+					class: "rs-sidebar__collapse",
+					onClick: _cache[0] || (_cache[0] = ($event) => collapsed.value = !collapsed.value)
+				}, toDisplayString(collapsed.value ? ">" : "<"), 1)) : createCommentVNode("", true)], true)])) : createCommentVNode("", true),
+				createElementVNode("div", _hoisted_5, [renderSlot(_ctx.$slots, "default", { collapsed: collapsed.value }, void 0, true)]),
+				_ctx.$slots.footer ? (openBlock(), createElementBlock("footer", _hoisted_6, [renderSlot(_ctx.$slots, "footer", { collapsed: collapsed.value }, void 0, true)])) : createCommentVNode("", true)
+			], 2);
+		};
+	}
+});
+//#endregion
+export { RsSidebar_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/sidebar/src/RsSidebar.js

@@ -0,0 +1,8 @@
+import './RsSidebar.css'
+import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.js";
+import RsSidebar_vue_vue_type_script_setup_true_lang_default from "./RsSidebar.impl.js";
+
+//#region src/components/sidebar/src/RsSidebar.vue
+var RsSidebar_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsSidebar_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-784314c9"]]);
+//#endregion
+export { RsSidebar_default as default };

package/dist/components/sidebar/src/RsSidebarGroup.css

@@ -0,0 +1,15 @@
+
+.rs-sidebar-group + .rs-sidebar-group[data-v-15de96fa] {
+  margin-top: var(--rs-space-md);
+}
+.rs-sidebar-group__title[data-v-15de96fa] {
+  padding: var(--rs-space-xs) var(--rs-space-sm);
+  color: var(--rs-muted);
+  font-size: var(--rs-font-size-xs);
+  font-weight: var(--rs-font-weight-semibold);
+  letter-spacing: 0.04em;
+}
+.rs-sidebar-group__body[data-v-15de96fa] {
+  display: grid;
+  gap: var(--rs-space-xs);
+}

package/dist/components/sidebar/src/RsSidebarGroup.impl.js

@@ -0,0 +1,22 @@
+import { createCommentVNode, createElementBlock, createElementVNode, defineComponent, openBlock, renderSlot, toDisplayString } from "vue";
+//#region src/components/sidebar/src/RsSidebarGroup.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "rs-sidebar-group" };
+var _hoisted_2 = {
+	key: 0,
+	class: "rs-sidebar-group__title"
+};
+var _hoisted_3 = { class: "rs-sidebar-group__body" };
+var RsSidebarGroup_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "RsSidebarGroup",
+	props: {
+		title: {},
+		collapsed: { type: Boolean }
+	},
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("section", _hoisted_1, [__props.title && !__props.collapsed ? (openBlock(), createElementBlock("div", _hoisted_2, toDisplayString(__props.title), 1)) : createCommentVNode("", true), createElementVNode("div", _hoisted_3, [renderSlot(_ctx.$slots, "default", {}, void 0, true)])]);
+		};
+	}
+});
+//#endregion
+export { RsSidebarGroup_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/sidebar/src/RsSidebarGroup.js

@@ -0,0 +1,8 @@
+import './RsSidebarGroup.css'
+import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.js";
+import RsSidebarGroup_vue_vue_type_script_setup_true_lang_default from "./RsSidebarGroup.impl.js";
+
+//#region src/components/sidebar/src/RsSidebarGroup.vue
+var RsSidebarGroup_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsSidebarGroup_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-15de96fa"]]);
+//#endregion
+export { RsSidebarGroup_default as default };

package/dist/components/sidebar/src/RsSidebarItem.css

@@ -0,0 +1,45 @@
+
+.rs-sidebar-item[data-v-0c539439] {
+  display: flex;
+  align-items: center;
+  gap: var(--rs-space-sm);
+  width: 100%;
+  min-height: var(--rs-control-height-md);
+  box-sizing: border-box;
+  padding: 0 var(--rs-space-sm);
+  border: 1px solid transparent;
+  border-radius: var(--rs-radius-sm);
+  background: transparent;
+  color: var(--rs-muted);
+  font: inherit;
+  cursor: pointer;
+  transition:
+    background var(--rs-transition-fast),
+    border-color var(--rs-transition-fast),
+    color var(--rs-transition-fast);
+}
+.rs-sidebar-item[data-v-0c539439]:hover:not(:disabled) {
+  background: var(--rs-item-hover);
+  color: var(--rs-text);
+}
+.rs-sidebar-item--active[data-v-0c539439] {
+  background: color-mix(in srgb, var(--rs-primary) 12%, transparent);
+  color: var(--rs-primary);
+}
+.rs-sidebar-item--collapsed[data-v-0c539439] {
+  justify-content: center;
+  padding: 0;
+}
+.rs-sidebar-item[data-v-0c539439]:disabled {
+  opacity: 0.38;
+  cursor: not-allowed;
+}
+.rs-sidebar-item__icon[data-v-0c539439] {
+  flex: 0 0 auto;
+}
+.rs-sidebar-item__label[data-v-0c539439] {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}

package/dist/components/sidebar/src/RsSidebarItem.impl.js

@@ -0,0 +1,41 @@
+import RsIcon_default from "../../icon/src/RsIcon.js";
+import { createBlock, createCommentVNode, createElementBlock, defineComponent, normalizeClass, openBlock, renderSlot, toDisplayString } from "vue";
+//#region src/components/sidebar/src/RsSidebarItem.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["disabled", "title"];
+var _hoisted_2 = {
+	key: 1,
+	class: "rs-sidebar-item__label"
+};
+var RsSidebarItem_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "RsSidebarItem",
+	props: {
+		label: {},
+		icon: {},
+		active: { type: Boolean },
+		disabled: { type: Boolean },
+		collapsed: { type: Boolean }
+	},
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("button", {
+				type: "button",
+				class: normalizeClass(["rs-sidebar-item", {
+					"rs-sidebar-item--active": __props.active,
+					"rs-sidebar-item--collapsed": __props.collapsed
+				}]),
+				disabled: __props.disabled,
+				title: __props.collapsed ? __props.label : void 0
+			}, [
+				__props.icon ? (openBlock(), createBlock(RsIcon_default, {
+					key: 0,
+					name: __props.icon,
+					class: "rs-sidebar-item__icon"
+				}, null, 8, ["name"])) : createCommentVNode("", true),
+				!__props.collapsed ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(__props.label), 1)) : createCommentVNode("", true),
+				renderSlot(_ctx.$slots, "default", {}, void 0, true)
+			], 10, _hoisted_1);
+		};
+	}
+});
+//#endregion
+export { RsSidebarItem_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/sidebar/src/RsSidebarItem.js

@@ -0,0 +1,8 @@
+import './RsSidebarItem.css'
+import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.js";
+import RsSidebarItem_vue_vue_type_script_setup_true_lang_default from "./RsSidebarItem.impl.js";
+
+//#region src/components/sidebar/src/RsSidebarItem.vue
+var RsSidebarItem_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsSidebarItem_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-0c539439"]]);
+//#endregion
+export { RsSidebarItem_default as default };

package/dist/components/split-pane/index.d.ts

@@ -0,0 +1,3 @@
+export { default as RsSplitPane } from './src/RsSplitPane.js';
+export type { RsSplitConstraint, RsSplitOrientation, RsSplitPaneExpose, RsSplitPaneInstance, RsSplitPaneItem, RsSplitPaneSize, } from './src/split-pane-utils';
+export { applySplitResize, collapseSplitPane, expandSplitPane, isRsSplitPaneAutoSize, isSplitPaneCollapsed, normalizeSplitSizes, resolveSplitAutoFlags, resolveSplitConstraints, splitSizesEqual, } from './src/split-pane-utils';

package/dist/components/split-pane/src/RsSplitPane.impl.js

@@ -0,0 +1,419 @@
+import { useRsI18n } from "../../../composables/useRsI18n.js";
+import RsIcon_default from "../../icon/src/RsIcon.js";
+import { applySplitResize, collapseSplitPane, expandSplitPane, isSplitPaneCollapsed, normalizeSplitSizes, resolveSplitAutoFlags, resolveSplitConstraints, roundSize, splitSizesEqual } from "./split-pane-utils.js";
+import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, mergeModels, normalizeClass, normalizeStyle, openBlock, ref, renderList, renderSlot, unref, useModel, watch } from "vue";
+//#region src/components/split-pane/src/RsSplitPane.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["data-pane-key"];
+var _hoisted_2 = [
+	"data-resizer-index",
+	"onPointerdown",
+	"onPointermove",
+	"onPointerup",
+	"onPointercancel"
+];
+var _hoisted_3 = [
+	"tabindex",
+	"aria-orientation",
+	"aria-valuenow",
+	"aria-valuemin",
+	"aria-valuemax",
+	"aria-label",
+	"aria-disabled",
+	"onKeydown",
+	"onDblclick"
+];
+var _hoisted_4 = {
+	key: 0,
+	class: "rs-split__grip",
+	"aria-hidden": "true"
+};
+var RsSplitPane_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "RsSplitPane",
+	props: /*@__PURE__*/ mergeModels({
+		panes: {},
+		orientation: { default: "horizontal" },
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		keyboardStep: { default: 4 },
+		withHandle: {
+			type: Boolean,
+			default: false
+		},
+		fill: {
+			type: Boolean,
+			default: false
+		}
+	}, {
+		"sizes": { default: () => [] },
+		"sizesModifiers": {}
+	}),
+	emits: /*@__PURE__*/ mergeModels([
+		"resize",
+		"resize-end",
+		"collapse",
+		"expand"
+	], ["update:sizes"]),
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		/** 各面板尺寸（百分比，总和 100） */
+		const model = useModel(__props, "sizes");
+		const emit = __emit;
+		const { t } = useRsI18n();
+		const rootRef = ref(null);
+		const sizes = ref([]);
+		const constraints = computed(() => resolveSplitConstraints(props.panes));
+		const resizerCount = computed(() => Math.max(0, props.panes.length - 1));
+		/** 内容自适应面板标记；首次拖拽/键盘调整时会物化为百分比并清空 */
+		const autoFlags = ref(resolveSplitAutoFlags(props.panes));
+		/** 归一化初始值，作为双击复位的基准 */
+		let initialSizes = normalizeSplitSizes(props.panes, modelSeed());
+		sizes.value = initialSizes.slice();
+		function modelSeed() {
+			return model.value && model.value.length === props.panes.length ? model.value : void 0;
+		}
+		function paneKeySignature() {
+			return props.panes.map((pane) => pane.key).join("|");
+		}
+		watch(() => paneKeySignature(), () => {
+			const provided = sizes.value.length === props.panes.length ? sizes.value : void 0;
+			autoFlags.value = resolveSplitAutoFlags(props.panes);
+			initialSizes = normalizeSplitSizes(props.panes, provided);
+			sizes.value = initialSizes.slice();
+			syncModel(sizes.value);
+		});
+		watch(() => props.panes.map((pane) => pane.size).join("|"), () => {
+			autoFlags.value = resolveSplitAutoFlags(props.panes);
+			initialSizes = normalizeSplitSizes(props.panes, modelSeed());
+			if (!autoFlags.value.some(Boolean)) {
+				sizes.value = initialSizes.slice();
+				syncModel(sizes.value);
+			}
+		});
+		watch(model, (value) => {
+			if (!value || value.length !== props.panes.length) return;
+			if (splitSizesEqual(value, sizes.value)) return;
+			autoFlags.value = props.panes.map(() => false);
+			sizes.value = normalizeSplitSizes(props.panes, value);
+		});
+		function syncModel(next) {
+			if (!splitSizesEqual(model.value ?? [], next)) model.value = next.slice();
+		}
+		function commit(next) {
+			sizes.value = next;
+			syncModel(next);
+			emit("resize", next.slice());
+		}
+		/** pane key → 折叠前尺寸；expand 未显式传 toSize 时还原 */
+		const sizeBeforeCollapse = /* @__PURE__ */ new Map();
+		function emitBoundaryTransitions(before, after) {
+			props.panes.forEach((pane, index) => {
+				const constraint = constraints.value[index];
+				const wasCollapsed = isSplitPaneCollapsed(before[index] ?? 0, constraint);
+				const nowCollapsed = isSplitPaneCollapsed(after[index] ?? 0, constraint);
+				if (!wasCollapsed && nowCollapsed) {
+					const prev = before[index];
+					if (prev !== void 0) sizeBeforeCollapse.set(pane.key, prev);
+					emit("collapse", pane.key);
+				} else if (wasCollapsed && !nowCollapsed) emit("expand", pane.key);
+			});
+		}
+		/** 展开目标：显式 toSize > 折叠前记忆 > 初始 size */
+		function resolveExpandSize(key, index, toSize) {
+			if (toSize !== void 0) return toSize;
+			return sizeBeforeCollapse.get(key) ?? initialSizes[index];
+		}
+		let dragIndex = null;
+		let dragOrigin = 0;
+		let dragStartSizes = [];
+		let flexPx = 0;
+		let pendingDragSizes = null;
+		let dragFrame = 0;
+		function directPaneElements(root) {
+			return [...root.children].filter((el) => el instanceof HTMLElement && el.classList.contains("rs-split__pane"));
+		}
+		function paneElements() {
+			const root = rootRef.value;
+			if (!root) return [];
+			return directPaneElements(root);
+		}
+		/** 拖拽过程中直接写 flex-grow，避免每帧触发 Vue 重渲染 */
+		function applyDragToDom(next) {
+			const panes = paneElements();
+			next.forEach((size, i) => {
+				panes[i]?.style.setProperty("flex-grow", String(size));
+			});
+		}
+		function setDraggingUi(active, index) {
+			const root = rootRef.value;
+			if (!root) return;
+			root.classList.toggle("rs-split--dragging", active);
+			const host = root.querySelector(`[data-resizer-index="${index}"]`);
+			if (!host) return;
+			if (active) host.setAttribute("data-active", "");
+			else host.removeAttribute("data-active");
+		}
+		function scheduleDragApply(next) {
+			pendingDragSizes = next;
+			if (dragFrame) return;
+			dragFrame = requestAnimationFrame(() => {
+				dragFrame = 0;
+				if (pendingDragSizes) applyDragToDom(pendingDragSizes);
+			});
+		}
+		function finishDrag(index) {
+			if (dragIndex !== index) return;
+			dragIndex = null;
+			if (dragFrame) {
+				cancelAnimationFrame(dragFrame);
+				dragFrame = 0;
+			}
+			setDraggingUi(false, index);
+			const final = pendingDragSizes ?? sizes.value;
+			pendingDragSizes = null;
+			paneElements().forEach((el) => {
+				el.style.removeProperty("flex-grow");
+			});
+			commit(final);
+			emitBoundaryTransitions(dragStartSizes, final);
+			emit("resize-end", final.slice());
+		}
+		function axisSize(el) {
+			return props.orientation === "horizontal" ? el.offsetWidth : el.offsetHeight;
+		}
+		/** 可伸缩空间的像素总量（不含分隔条），用于像素→百分比换算 */
+		function measureFlexPx() {
+			const root = rootRef.value;
+			if (!root) return 0;
+			let sum = 0;
+			directPaneElements(root).forEach((el) => {
+				sum += axisSize(el);
+			});
+			return sum;
+		}
+		function onResizerPointerDown(index, event) {
+			if (props.disabled) return;
+			if (event.pointerType === "mouse" && event.button !== 0) return;
+			materializeAutoPanes();
+			event.currentTarget.setPointerCapture?.(event.pointerId);
+			dragIndex = index;
+			dragOrigin = props.orientation === "horizontal" ? event.clientX : event.clientY;
+			dragStartSizes = sizes.value.slice();
+			pendingDragSizes = dragStartSizes;
+			flexPx = measureFlexPx();
+			setDraggingUi(true, index);
+			event.preventDefault();
+		}
+		function onResizerPointerMove(index, event) {
+			if (dragIndex !== index || flexPx <= 0) return;
+			const deltaPercent = ((props.orientation === "horizontal" ? event.clientX : event.clientY) - dragOrigin) / flexPx * 100;
+			scheduleDragApply(applySplitResize(dragStartSizes, constraints.value, index, deltaPercent));
+		}
+		function endDrag(index, event) {
+			if (dragIndex !== index) return;
+			event.currentTarget.releasePointerCapture?.(event.pointerId);
+			finishDrag(index);
+		}
+		function onResizerKeydown(index, event) {
+			if (props.disabled) return;
+			materializeAutoPanes();
+			const horizontal = props.orientation === "horizontal";
+			const step = props.keyboardStep;
+			let delta = 0;
+			switch (event.key) {
+				case "ArrowLeft":
+					if (horizontal) delta = -step;
+					break;
+				case "ArrowRight":
+					if (horizontal) delta = step;
+					break;
+				case "ArrowUp":
+					if (!horizontal) delta = -step;
+					break;
+				case "ArrowDown":
+					if (!horizontal) delta = step;
+					break;
+				case "Home":
+					delta = -100;
+					break;
+				case "End":
+					delta = 100;
+					break;
+				case "Enter":
+				case " ":
+					event.preventDefault();
+					toggleCollapseAt(index);
+					return;
+				default: return;
+			}
+			if (delta === 0) return;
+			event.preventDefault();
+			const before = sizes.value.slice();
+			commit(applySplitResize(sizes.value, constraints.value, index, delta));
+			emitBoundaryTransitions(before, sizes.value);
+			emit("resize-end", sizes.value.slice());
+		}
+		function onResizerDblClick(index) {
+			if (props.disabled) return;
+			materializeAutoPanes();
+			const a = sizes.value[index];
+			const b = sizes.value[index + 1];
+			const initA = initialSizes[index];
+			const initB = initialSizes[index + 1];
+			if (a === void 0 || b === void 0 || initA === void 0 || initB === void 0) return;
+			const total = a + b;
+			const initTotal = initA + initB;
+			const targetA = initTotal > 0 ? initA / initTotal * total : total / 2;
+			const next = sizes.value.slice();
+			next[index] = roundSize(targetA);
+			next[index + 1] = roundSize(total - targetA);
+			const before = sizes.value.slice();
+			commit(next);
+			emitBoundaryTransitions(before, sizes.value);
+			emit("resize-end", sizes.value.slice());
+		}
+		/** 分隔条 index 两侧择一可折叠面板进行折叠/展开切换 */
+		function collapsibleCandidate(index) {
+			if (constraints.value[index]?.collapsible) return index;
+			if (constraints.value[index + 1]?.collapsible) return index + 1;
+			return -1;
+		}
+		function toggleCollapseAt(index) {
+			const candidate = collapsibleCandidate(index);
+			if (candidate < 0) return;
+			const before = sizes.value.slice();
+			const collapsed = isSplitPaneCollapsed(sizes.value[candidate] ?? 0, constraints.value[candidate]);
+			const key = props.panes[candidate]?.key;
+			commit(collapsed ? expandSplitPane(sizes.value, constraints.value, candidate, key ? resolveExpandSize(key, candidate) : void 0) : collapseSplitPane(sizes.value, constraints.value, candidate));
+			emitBoundaryTransitions(before, sizes.value);
+			emit("resize-end", sizes.value.slice());
+		}
+		/** 将 auto 面板按当前像素占比物化为百分比，之后走统一拖拽逻辑 */
+		function materializeAutoPanes() {
+			if (!autoFlags.value.some(Boolean)) return;
+			const total = measureFlexPx();
+			if (total <= 0) return;
+			const measured = paneElements().map((el) => axisSize(el) / total * 100);
+			const next = normalizeSplitSizes(props.panes.map((pane) => ({
+				...pane,
+				size: typeof pane.size === "number" ? pane.size : void 0
+			})), measured);
+			autoFlags.value = props.panes.map(() => false);
+			sizes.value = next;
+			syncModel(next);
+		}
+		function paneStyle(index) {
+			if (autoFlags.value[index]) {
+				const pane = props.panes[index];
+				const vertical = props.orientation === "vertical";
+				const style = {
+					flexGrow: "0",
+					flexShrink: "0",
+					flexBasis: "auto",
+					[vertical ? "minHeight" : "minWidth"]: "min-content"
+				};
+				if (typeof pane?.min === "number" && pane.min > 0) style[vertical ? "minHeight" : "minWidth"] = `${pane.min}%`;
+				if (typeof pane?.max === "number" && pane.max < 100) style[vertical ? "maxHeight" : "maxWidth"] = `${pane.max}%`;
+				return style;
+			}
+			const size = sizes.value[index] ?? 0;
+			return {
+				flexGrow: String(size),
+				flexShrink: "1",
+				flexBasis: "0%"
+			};
+		}
+		function paneCollapsed(index) {
+			if (autoFlags.value[index]) return false;
+			return isSplitPaneCollapsed(sizes.value[index] ?? 0, constraints.value[index]);
+		}
+		/** 分隔条 index（位于 panes[index] 与 panes[index+1] 之间）是否显示抓手 */
+		function resizerShowsHandle(index) {
+			const pane = props.panes[index];
+			if (pane?.resizerHandle !== void 0) return pane.resizerHandle;
+			return props.withHandle;
+		}
+		function indexOfKey(key) {
+			return props.panes.findIndex((pane) => pane.key === key);
+		}
+		function collapse(key) {
+			const index = indexOfKey(key);
+			if (index < 0) return;
+			const before = sizes.value.slice();
+			const next = collapseSplitPane(sizes.value, constraints.value, index);
+			if (splitSizesEqual(before, next)) return;
+			commit(next);
+			emitBoundaryTransitions(before, sizes.value);
+			emit("resize-end", sizes.value.slice());
+		}
+		function expand(key, toSize) {
+			const index = indexOfKey(key);
+			if (index < 0) return;
+			const before = sizes.value.slice();
+			const next = expandSplitPane(sizes.value, constraints.value, index, resolveExpandSize(key, index, toSize));
+			if (splitSizesEqual(before, next)) return;
+			commit(next);
+			emitBoundaryTransitions(before, sizes.value);
+			emit("resize-end", sizes.value.slice());
+		}
+		function reset() {
+			autoFlags.value = resolveSplitAutoFlags(props.panes);
+			initialSizes = normalizeSplitSizes(props.panes);
+			commit(initialSizes.slice());
+			emit("resize-end", sizes.value.slice());
+		}
+		__expose({
+			collapse,
+			expand,
+			reset,
+			getSizes: () => sizes.value.slice()
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				ref_key: "rootRef",
+				ref: rootRef,
+				class: normalizeClass(["rs-split", [`rs-split--${__props.orientation}`, {
+					"rs-split--disabled": __props.disabled,
+					"rs-split--fill": __props.fill
+				}]])
+			}, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.panes, (pane, index) => {
+				return openBlock(), createElementBlock(Fragment, { key: pane.key }, [createElementVNode("div", {
+					class: normalizeClass(["rs-split__pane", {
+						"rs-split__pane--collapsed": paneCollapsed(index),
+						"rs-split__pane--auto": autoFlags.value[index]
+					}]),
+					style: normalizeStyle(paneStyle(index)),
+					"data-pane-key": pane.key
+				}, [renderSlot(_ctx.$slots, pane.key, {
+					size: sizes.value[index],
+					collapsed: paneCollapsed(index)
+				})], 14, _hoisted_1), index < resizerCount.value ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					class: normalizeClass(["rs-split__resizer-host", { "rs-split__resizer-host--handle": resizerShowsHandle(index) }]),
+					"data-resizer-index": index,
+					onPointerdown: ($event) => onResizerPointerDown(index, $event),
+					onPointermove: ($event) => onResizerPointerMove(index, $event),
+					onPointerup: ($event) => endDrag(index, $event),
+					onPointercancel: ($event) => endDrag(index, $event)
+				}, [createElementVNode("hr", {
+					class: normalizeClass(["rs-split__resizer", { "rs-split__resizer--handle": resizerShowsHandle(index) }]),
+					tabindex: __props.disabled ? -1 : 0,
+					"aria-orientation": __props.orientation === "horizontal" ? "vertical" : "horizontal",
+					"aria-valuenow": Math.round(sizes.value[index] ?? 0),
+					"aria-valuemin": Math.round(constraints.value[index]?.min ?? 0),
+					"aria-valuemax": Math.round(constraints.value[index]?.max ?? 100),
+					"aria-label": unref(t)("split.resize"),
+					"aria-disabled": __props.disabled || void 0,
+					onKeydown: ($event) => onResizerKeydown(index, $event),
+					onDblclick: ($event) => onResizerDblClick(index)
+				}, null, 42, _hoisted_3), resizerShowsHandle(index) ? (openBlock(), createElementBlock("span", _hoisted_4, [createVNode(RsIcon_default, {
+					name: __props.orientation === "horizontal" ? "grip-vertical" : "grip-horizontal",
+					size: 12
+				}, null, 8, ["name"])])) : createCommentVNode("", true)], 42, _hoisted_2)) : createCommentVNode("", true)], 64);
+			}), 128))], 2);
+		};
+	}
+});
+//#endregion
+export { RsSplitPane_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/split-pane/src/RsSplitPane.js

@@ -0,0 +1,7 @@
+import './RsSplitPane.css'
+import RsSplitPane_vue_vue_type_script_setup_true_lang_default from "./RsSplitPane.impl.js";
+
+//#region src/components/split-pane/src/RsSplitPane.vue
+var RsSplitPane_default = RsSplitPane_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { RsSplitPane_default as default };