ensis-ui 0.0.0-stage → 3.0.0

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

@@ -0,0 +1,122 @@
+//#region src/components/loading/src/loading-utils.ts
+var SIZES = /* @__PURE__ */ new Set([
+	"sm",
+	"md",
+	"lg"
+]);
+var TONES = /* @__PURE__ */ new Set([
+	"default",
+	"neutral",
+	"primary",
+	"success",
+	"warning",
+	"danger",
+	"info"
+]);
+var VARIANTS = /* @__PURE__ */ new Set([
+	"spinner",
+	"dots",
+	"skeleton"
+]);
+/** delay / minDuration 上限（毫秒）。非法值或非有限数视为 0。 */
+var RS_LOADING_MAX_MS = 6e4;
+function resolveRsLoadingSize(size) {
+	if (size && SIZES.has(size)) return size;
+	return "md";
+}
+function resolveRsLoadingTone(tone) {
+	if (tone && TONES.has(tone)) return tone;
+	return "primary";
+}
+function resolveRsLoadingVariant(variant) {
+	if (variant && VARIANTS.has(variant)) return variant;
+	return "spinner";
+}
+function resolveRsLoadingSkeletonCount(lines, fallback = 4) {
+	return Math.min(12, Math.max(1, typeof lines === "number" && Number.isFinite(lines) ? Math.floor(lines) : fallback));
+}
+function clampRsLoadingDuration(value) {
+	if (typeof value !== "number" || !Number.isFinite(value) || value <= 0) return 0;
+	return Math.min(value, RS_LOADING_MAX_MS);
+}
+/**
+* 纯函数：决定指示器现在出现、消失，还是再等一会儿。
+* 组件负责定时器，并在卸载时清掉。
+*/
+function planRsLoadingVisibility(input) {
+	const delay = clampRsLoadingDuration(input.delayMs);
+	const minDuration = clampRsLoadingDuration(input.minDurationMs);
+	if (input.loading) {
+		if (input.visible) return { action: "keep" };
+		if (delay <= 0) return {
+			action: "show",
+			shownAt: input.now
+		};
+		return {
+			action: "wait",
+			ms: delay,
+			then: "show"
+		};
+	}
+	if (!input.visible) return { action: "idle" };
+	if (input.shownAt == null || minDuration <= 0) return { action: "hide" };
+	const remaining = minDuration - (input.now - input.shownAt);
+	if (remaining <= 0) return { action: "hide" };
+	return {
+		action: "wait",
+		ms: remaining,
+		then: "hide"
+	};
+}
+function isElementNode(value) {
+	return Boolean(value) && typeof value === "object" && value.nodeType === 1;
+}
+/** 全屏传送目标。非全屏不调用 getContainer。失败或空节点回退 body。 */
+function resolveRsLoadingTeleportTarget(fullscreen, getContainer) {
+	if (!fullscreen || !getContainer) return "body";
+	try {
+		const target = getContainer();
+		if (typeof target === "string" && target.trim()) return target;
+		if (isElementNode(target)) return target;
+	} catch {
+		return "body";
+	}
+	return "body";
+}
+var lockCount = 0;
+var previousOverflow = null;
+var previousPointer = null;
+var previousBusy = null;
+/**
+* 全屏锁滚动，并暂时挡住页面点击。引用计数，释放函数可重复调用。
+* 不改焦点陷阱。无 document 时返回空操作（SSR）。
+*/
+function acquireRsLoadingScrollLock() {
+	if (typeof document === "undefined" || !document.body) return () => {};
+	if (lockCount === 0) {
+		previousOverflow = document.body.style.overflow;
+		previousPointer = document.body.style.pointerEvents;
+		previousBusy = document.documentElement.getAttribute("aria-busy");
+		document.body.style.overflow = "hidden";
+		document.body.style.pointerEvents = "none";
+		document.documentElement.setAttribute("aria-busy", "true");
+	}
+	lockCount += 1;
+	let released = false;
+	return () => {
+		if (released) return;
+		released = true;
+		lockCount = Math.max(0, lockCount - 1);
+		if (lockCount === 0 && document.body) {
+			document.body.style.overflow = previousOverflow ?? "";
+			document.body.style.pointerEvents = previousPointer ?? "";
+			if (previousBusy == null) document.documentElement.removeAttribute("aria-busy");
+			else document.documentElement.setAttribute("aria-busy", previousBusy);
+			previousOverflow = null;
+			previousPointer = null;
+			previousBusy = null;
+		}
+	};
+}
+//#endregion
+export { RS_LOADING_MAX_MS, acquireRsLoadingScrollLock, clampRsLoadingDuration, planRsLoadingVisibility, resolveRsLoadingSize, resolveRsLoadingSkeletonCount, resolveRsLoadingTeleportTarget, resolveRsLoadingTone, resolveRsLoadingVariant };

package/dist/components/loading-bar/index.d.ts

@@ -0,0 +1,2 @@
+export { default as RsLoadingBar } from './src/RsLoadingBar.js';
+export type { RsLoadingBarAttach, RsLoadingBarExpose, RsLoadingBarInstance, RsLoadingBarPosition, RsLoadingBarTone, } from './src/loading-bar-utils';

package/dist/components/loading-bar/src/RsLoadingBar.css

@@ -0,0 +1,83 @@
+
+.rs-loading-bar[data-v-aff2ed50] {
+  position: fixed;
+  inset-block-start: 0;
+  inset-inline: 0;
+  z-index: var(--rs-z-loading-bar);
+  height: var(--rs-loading-bar-size, 2px);
+  overflow: hidden;
+  pointer-events: none;
+  opacity: 0;
+  transition: opacity var(--rs-transition-normal);
+}
+.rs-loading-bar--bottom[data-v-aff2ed50] {
+  inset-block-start: auto;
+  inset-block-end: 0;
+}
+.rs-loading-bar--parent[data-v-aff2ed50] {
+  position: absolute;
+}
+.rs-loading-bar--visible[data-v-aff2ed50] {
+  opacity: 1;
+}
+.rs-loading-bar--neutral[data-v-aff2ed50] {
+  --rs-loading-bar-color: var(--rs-text-secondary);
+}
+.rs-loading-bar--info[data-v-aff2ed50] {
+  --rs-loading-bar-color: var(--rs-info);
+}
+.rs-loading-bar--success[data-v-aff2ed50] {
+  --rs-loading-bar-color: var(--rs-success);
+}
+.rs-loading-bar--warning[data-v-aff2ed50] {
+  --rs-loading-bar-color: var(--rs-warning);
+}
+.rs-loading-bar--danger[data-v-aff2ed50] {
+  --rs-loading-bar-color: var(--rs-danger);
+}
+.rs-loading-bar__peg[data-v-aff2ed50] {
+  height: 100%;
+  width: var(--rs-loading-bar-progress, 0%);
+  background-color: var(--rs-loading-bar-color, var(--rs-primary));
+  transition:
+    width var(--rs-transition-normal),
+    background-color var(--rs-transition-normal);
+}
+.rs-loading-bar--error .rs-loading-bar__peg[data-v-aff2ed50] {
+  background-color: var(--rs-loading-bar-error, var(--rs-danger));
+}
+.rs-loading-bar--indeterminate .rs-loading-bar__peg[data-v-aff2ed50] {
+  position: absolute;
+  inset-block: 0;
+  width: 38%;
+  transition: none;
+  animation: rs-loading-bar-slide-aff2ed50 1.15s ease-in-out infinite;
+}
+@keyframes rs-loading-bar-slide-aff2ed50 {
+from {
+    inset-inline-start: -40%;
+}
+to {
+    inset-inline-start: 100%;
+}
+}
+@media (prefers-reduced-motion: reduce) {
+.rs-loading-bar[data-v-aff2ed50],
+  .rs-loading-bar__peg[data-v-aff2ed50] {
+    transition: none;
+    animation: none;
+}
+.rs-loading-bar--indeterminate .rs-loading-bar__peg[data-v-aff2ed50] {
+    width: 100%;
+    inset-inline-start: 0;
+}
+}
+@media (forced-colors: active) {
+.rs-loading-bar__peg[data-v-aff2ed50] {
+    forced-color-adjust: none;
+    background-color: Highlight;
+}
+.rs-loading-bar--error .rs-loading-bar__peg[data-v-aff2ed50] {
+    background-color: Mark;
+}
+}

package/dist/components/loading-bar/src/RsLoadingBar.d.ts

@@ -0,0 +1,75 @@
+import { type RsLoadingBarAttach, type RsLoadingBarPosition, type RsLoadingBarTone } from './loading-bar-utils';
+type __VLS_Props = {
+    /** 受控进度 0–100。传入后显隐只跟这个值，命令式 API 不再改这条。 */
+    progress?: number;
+    /** 条高（px）。默认 2，与 --rs-loading-bar-size 一致；未改默认时不写内联，方便覆盖 token。 */
+    height?: number;
+    /** 进度色。未传走 tone / --rs-loading-bar-color。 */
+    color?: string;
+    /** 失败色。未传走 --rs-loading-bar-error。 */
+    errorColor?: string;
+    /** 色相。color 传入时以 color 为准。 */
+    tone?: RsLoadingBarTone;
+    /** 贴上沿或下沿。 */
+    position?: RsLoadingBarPosition;
+    /** viewport 固定在窗口；parent 绝对定位到最近的定位祖先。 */
+    attach?: RsLoadingBarAttach;
+    /** 是否自动向 maximum 蠕动。 */
+    trickle?: boolean;
+    /** trickle 间隔（ms）。小于 16 回落 200。 */
+    trickleSpeed?: number;
+    /** start 的起步进度。 */
+    minimum?: number;
+    /** trickle 停住的上限，finish 才会到 100。 */
+    maximum?: number;
+    /** 短请求不闪条。delay 内 finish 则从不显示。0 与历史行为一致。 */
+    delay?: number;
+    /** finish 后淡出毫秒。 */
+    finishDuration?: number;
+    /** error 后淡出毫秒。 */
+    errorDuration?: number;
+    /** 重叠的 start/finish 计数。默认关闭，每次 start 仍会回到 minimum。 */
+    nesting?: boolean;
+    /** 未知进度：滑动条，不报 aria-valuenow。 */
+    indeterminate?: boolean;
+    /** 覆盖可访问名称。未传走 loadingBar.label / loadingBar.error。 */
+    ariaLabel?: string;
+    id?: string;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, import("./loading-bar-utils").RsLoadingBarExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    change: (progress: number) => any;
+    error: () => any;
+    start: (pending: number) => any;
+    finish: (pending: number) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onChange?: ((progress: number) => any) | undefined;
+    onError?: (() => any) | undefined;
+    onStart?: ((pending: number) => any) | undefined;
+    onFinish?: ((pending: number) => any) | undefined;
+}>, {
+    height: number;
+    tone: RsLoadingBarTone;
+    indeterminate: boolean;
+    position: RsLoadingBarPosition;
+    attach: RsLoadingBarAttach;
+    trickle: boolean;
+    trickleSpeed: number;
+    minimum: number;
+    maximum: number;
+    delay: number;
+    finishDuration: number;
+    errorDuration: number;
+    nesting: 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/loading-bar/src/RsLoadingBar.impl.js

@@ -0,0 +1,352 @@
+import { useRsI18n } from "../../../composables/useRsI18n.js";
+import { RS_LOADING_BAR_KEY } from "../../../composables/useRsLoadingBar.js";
+import { advanceLoadingBar, clampLoadingBar, loadingBarHasTimerHost, nextLoadingBarInc, resolveLoadingBarAttach, resolveLoadingBarDelay, resolveLoadingBarDuration, resolveLoadingBarHeight, resolveLoadingBarPosition, resolveLoadingBarRange, resolveLoadingBarSpeed, resolveLoadingBarTone } from "./loading-bar-utils.js";
+import { Fragment, computed, createElementBlock, createElementVNode, defineComponent, normalizeClass, normalizeStyle, onBeforeUnmount, openBlock, provide, ref, renderSlot, shallowRef, watch } from "vue";
+//#region src/components/loading-bar/src/RsLoadingBar.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = [
+	"id",
+	"role",
+	"aria-hidden",
+	"aria-label",
+	"aria-valuemin",
+	"aria-valuemax",
+	"aria-valuenow",
+	"aria-valuetext"
+];
+var RsLoadingBar_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "RsLoadingBar",
+	__name: "RsLoadingBar",
+	props: {
+		progress: {},
+		height: { default: 2 },
+		color: {},
+		errorColor: {},
+		tone: { default: "primary" },
+		position: { default: "top" },
+		attach: { default: "viewport" },
+		trickle: {
+			type: Boolean,
+			default: true
+		},
+		trickleSpeed: { default: 200 },
+		minimum: { default: 8 },
+		maximum: { default: 92 },
+		delay: { default: 0 },
+		finishDuration: { default: 280 },
+		errorDuration: { default: 400 },
+		nesting: {
+			type: Boolean,
+			default: false
+		},
+		indeterminate: {
+			type: Boolean,
+			default: false
+		},
+		ariaLabel: {},
+		id: {}
+	},
+	emits: [
+		"start",
+		"finish",
+		"error",
+		"change"
+	],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const { t } = useRsI18n();
+		const internalProgress = ref(0);
+		const visible = ref(false);
+		const errored = ref(false);
+		let pending = 0;
+		let waiting = false;
+		let lastPublished = -1;
+		let trickleTimer = null;
+		let hideTimer = null;
+		let delayTimer = null;
+		const tone = computed(() => resolveLoadingBarTone(props.tone));
+		const position = computed(() => resolveLoadingBarPosition(props.position));
+		const attach = computed(() => resolveLoadingBarAttach(props.attach));
+		const controlled = computed(() => props.progress !== void 0);
+		const indeterminateActive = computed(() => props.indeterminate && !controlled.value && !errored.value);
+		const displayProgress = computed(() => controlled.value ? clampLoadingBar(props.progress ?? 0) : internalProgress.value);
+		const label = computed(() => {
+			if (props.ariaLabel) return props.ariaLabel;
+			if (errored.value) return t("loadingBar.error");
+			if (indeterminateActive.value) return t("loadingBar.indeterminate");
+			return t("loadingBar.label");
+		});
+		const valueNow = computed(() => {
+			if (!visible.value || indeterminateActive.value) return void 0;
+			return Math.round(displayProgress.value);
+		});
+		const valueText = computed(() => {
+			if (!visible.value) return void 0;
+			if (errored.value) return t("loadingBar.error");
+			if (indeterminateActive.value) return t("loadingBar.indeterminate");
+		});
+		const rootStyle = computed(() => {
+			const style = {};
+			const height = resolveLoadingBarHeight(props.height);
+			if (height !== 2) style["--rs-loading-bar-size"] = `${height}px`;
+			if (props.color) style["--rs-loading-bar-color"] = props.color;
+			if (props.errorColor) style["--rs-loading-bar-error"] = props.errorColor;
+			if (!indeterminateActive.value) style["--rs-loading-bar-progress"] = `${displayProgress.value}%`;
+			return style;
+		});
+		function timerHost() {
+			if (typeof window === "undefined") return null;
+			return loadingBarHasTimerHost(window) ? window : null;
+		}
+		function publish(value) {
+			if (controlled.value || props.indeterminate) return;
+			const rounded = Math.round(value);
+			if (rounded === lastPublished) return;
+			lastPublished = rounded;
+			emit("change", rounded);
+		}
+		function clearTrickle() {
+			const host = timerHost();
+			if (trickleTimer !== null && host) host.clearInterval(trickleTimer);
+			trickleTimer = null;
+		}
+		function clearHide() {
+			const host = timerHost();
+			if (hideTimer !== null && host) host.clearTimeout(hideTimer);
+			hideTimer = null;
+		}
+		function clearDelay() {
+			const host = timerHost();
+			if (delayTimer !== null && host) host.clearTimeout(delayTimer);
+			delayTimer = null;
+			waiting = false;
+		}
+		function clearTimers() {
+			clearTrickle();
+			clearHide();
+			clearDelay();
+		}
+		function armHide(ms, done) {
+			clearHide();
+			const host = timerHost();
+			if (!host) {
+				done();
+				return;
+			}
+			hideTimer = host.setTimeout(() => {
+				hideTimer = null;
+				done();
+			}, ms);
+		}
+		function hideLater(ms) {
+			armHide(ms, () => {
+				visible.value = false;
+				errored.value = false;
+				internalProgress.value = 0;
+				lastPublished = -1;
+			});
+		}
+		function ensureTrickle() {
+			if (controlled.value || !props.trickle || props.indeterminate) {
+				clearTrickle();
+				return;
+			}
+			const { maximum } = resolveLoadingBarRange(props.minimum, props.maximum);
+			if (internalProgress.value >= maximum) {
+				clearTrickle();
+				return;
+			}
+			if (trickleTimer) return;
+			const host = timerHost();
+			if (!host) return;
+			trickleTimer = host.setInterval(() => {
+				const cap = resolveLoadingBarRange(props.minimum, props.maximum).maximum;
+				if (internalProgress.value >= cap) {
+					clearTrickle();
+					return;
+				}
+				const next = advanceLoadingBar(internalProgress.value, cap);
+				internalProgress.value = next;
+				publish(next);
+				if (next >= cap) clearTrickle();
+			}, resolveLoadingBarSpeed(props.trickleSpeed));
+		}
+		function reveal(value) {
+			errored.value = false;
+			visible.value = true;
+			if (props.indeterminate) {
+				clearTrickle();
+				return;
+			}
+			internalProgress.value = value;
+			publish(value);
+			ensureTrickle();
+		}
+		function complete(erroredNext) {
+			pending = 0;
+			waiting = false;
+			clearTrickle();
+			clearDelay();
+			errored.value = erroredNext;
+			visible.value = true;
+			if (!props.indeterminate || erroredNext) {
+				internalProgress.value = 100;
+				if (!props.indeterminate) publish(100);
+			}
+			hideLater(resolveLoadingBarDuration(erroredNext ? props.errorDuration : props.finishDuration, erroredNext ? 400 : 280));
+		}
+		function start() {
+			if (controlled.value) return;
+			clearHide();
+			errored.value = false;
+			if (props.nesting && pending > 0) {
+				pending += 1;
+				emit("start", pending);
+				return;
+			}
+			pending = 1;
+			clearTrickle();
+			clearDelay();
+			const delay = resolveLoadingBarDelay(props.delay);
+			const minimum = resolveLoadingBarRange(props.minimum, props.maximum).minimum;
+			if (delay > 0) {
+				const host = timerHost();
+				if (!host) {
+					reveal(minimum);
+					emit("start", pending);
+					return;
+				}
+				waiting = true;
+				delayTimer = host.setTimeout(() => {
+					delayTimer = null;
+					waiting = false;
+					if (pending <= 0) return;
+					reveal(minimum);
+				}, delay);
+				emit("start", pending);
+				return;
+			}
+			reveal(minimum);
+			emit("start", pending);
+		}
+		function finish() {
+			if (controlled.value) return;
+			if (props.nesting && pending > 1) {
+				pending -= 1;
+				emit("finish", pending);
+				return;
+			}
+			if (waiting) {
+				clearDelay();
+				pending = 0;
+				emit("finish", 0);
+				return;
+			}
+			complete(false);
+			emit("finish", 0);
+		}
+		function error() {
+			if (controlled.value) return;
+			complete(true);
+			emit("error");
+		}
+		function set(progress) {
+			if (controlled.value || props.indeterminate) return;
+			const next = clampLoadingBar(progress);
+			clearHide();
+			clearDelay();
+			errored.value = false;
+			if (next >= 100) {
+				complete(false);
+				emit("finish", 0);
+				return;
+			}
+			if (next <= 0) {
+				pending = 0;
+				clearTrickle();
+				visible.value = false;
+				internalProgress.value = 0;
+				publish(0);
+				return;
+			}
+			if (pending === 0) pending = 1;
+			visible.value = true;
+			internalProgress.value = next;
+			publish(next);
+			ensureTrickle();
+		}
+		function inc(amount) {
+			if (controlled.value || props.indeterminate) return;
+			if (pending <= 0 && !visible.value) {
+				start();
+				return;
+			}
+			set(nextLoadingBarInc(internalProgress.value, amount));
+		}
+		function getProgress() {
+			return Math.round(displayProgress.value);
+		}
+		function isStarted() {
+			return pending > 0;
+		}
+		const api = shallowRef({
+			start,
+			finish,
+			error,
+			set,
+			inc,
+			getProgress,
+			isStarted
+		});
+		provide(RS_LOADING_BAR_KEY, api);
+		watch(() => props.progress, (value) => {
+			if (value === void 0) return;
+			clearHide();
+			clearTrickle();
+			const next = clampLoadingBar(value);
+			if (next <= 0) {
+				visible.value = false;
+				return;
+			}
+			visible.value = true;
+			if (next >= 100) hideLater(resolveLoadingBarDuration(props.finishDuration, 280));
+		}, { immediate: true });
+		onBeforeUnmount(() => {
+			clearTimers();
+			pending = 0;
+			api.value = null;
+		});
+		__expose({
+			start,
+			finish,
+			error,
+			set,
+			inc,
+			getProgress,
+			isStarted
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock(Fragment, null, [createElementVNode("div", {
+				id: __props.id || void 0,
+				class: normalizeClass(["rs-loading-bar", {
+					"rs-loading-bar--visible": visible.value,
+					"rs-loading-bar--bottom": position.value === "bottom",
+					"rs-loading-bar--parent": attach.value === "parent",
+					"rs-loading-bar--error": errored.value,
+					"rs-loading-bar--indeterminate": indeterminateActive.value,
+					[`rs-loading-bar--${tone.value}`]: true
+				}]),
+				style: normalizeStyle(rootStyle.value),
+				role: visible.value ? "progressbar" : void 0,
+				"aria-hidden": visible.value ? void 0 : "true",
+				"aria-label": visible.value ? label.value : void 0,
+				"aria-valuemin": valueNow.value !== void 0 ? 0 : void 0,
+				"aria-valuemax": valueNow.value !== void 0 ? 100 : void 0,
+				"aria-valuenow": valueNow.value,
+				"aria-valuetext": valueText.value
+			}, [..._cache[0] || (_cache[0] = [createElementVNode("div", { class: "rs-loading-bar__peg" }, null, -1)])], 14, _hoisted_1), renderSlot(_ctx.$slots, "default", {}, void 0, true)], 64);
+		};
+	}
+});
+//#endregion
+export { RsLoadingBar_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/loading-bar/src/RsLoadingBar.js

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