ensis-ui 0.0.0-stage → 3.0.1

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

@@ -0,0 +1,125 @@
+//#region src/components/anchor/src/anchor-utils.ts
+/** `#overview` / `path#overview` / `#%E6%A6%82%E8%BF%B0` → `overview` / `概述` */
+function hrefToAnchorId(href) {
+	const raw = href.trim();
+	const id = (raw.includes("#") ? raw.slice(raw.indexOf("#") + 1) : raw).replace(/^#/, "");
+	if (!id) return "";
+	try {
+		return decodeURIComponent(id);
+	} catch {
+		return id;
+	}
+}
+function flattenAnchorItems(items, depth = 0) {
+	const out = [];
+	for (const item of items) {
+		out.push({
+			href: item.href,
+			title: item.title,
+			depth,
+			disabled: item.disabled
+		});
+		if (item.children?.length) out.push(...flattenAnchorItems(item.children, depth + 1));
+	}
+	return out;
+}
+/**
+* 滚动监听：取最后一个 top <= offset 的标题。
+* entries 须按文档顺序（与 DOM 一致），top 为相对滚动容器顶部的距离。
+* atEnd：容器已贴底时最后一节往往到不了判定线，仍应高亮最后一项。
+*/
+function pickActiveAnchorHref(entries, offset, options) {
+	if (entries.length === 0) return "";
+	if (options?.atEnd) return entries[entries.length - 1]?.href ?? "";
+	let active = entries[0]?.href ?? "";
+	for (const entry of entries) if (entry.top <= offset) active = entry.href;
+	return active;
+}
+/** 用 scrollY / nodeType 判断，避免跨 iframe 的 `instanceof Window`。 */
+function isAnchorWindow(container) {
+	return Boolean(container && typeof container === "object" && "scrollY" in container && !("nodeType" in container));
+}
+function resolveAnchorContainer(getContainer) {
+	try {
+		const resolved = getContainer?.();
+		if (resolved) return resolved;
+	} catch {}
+	if (typeof window !== "undefined") return window;
+	return null;
+}
+function readContainerScrollTop(container) {
+	if (isAnchorWindow(container)) return container.scrollY;
+	return container.scrollTop;
+}
+function readContainerScrollExtent(container) {
+	if (isAnchorWindow(container)) {
+		const root = typeof document === "undefined" ? null : document.scrollingElement || document.documentElement;
+		return {
+			top: container.scrollY,
+			max: root ? Math.max(0, root.scrollHeight - container.innerHeight) : 0
+		};
+	}
+	return {
+		top: container.scrollTop,
+		max: Math.max(0, container.scrollHeight - container.clientHeight)
+	};
+}
+/** 贴底判定。slack 吃掉亚像素，避免最后一项永远亮不起来。 */
+function isAnchorScrolledToEnd(container, slack = 4) {
+	const { top, max } = readContainerScrollExtent(container);
+	return max > 0 && top >= max - slack;
+}
+function targetTopInContainer(target, container) {
+	const targetRect = target.getBoundingClientRect();
+	if (isAnchorWindow(container)) return targetRect.top;
+	return targetRect.top - container.getBoundingClientRect().top;
+}
+function prefersAnchorReducedMotion() {
+	if (typeof matchMedia === "undefined") return false;
+	return matchMedia("(prefers-reduced-motion: reduce)").matches;
+}
+function resolveAnchorScrollBehavior(behavior) {
+	if (behavior) return behavior;
+	return prefersAnchorReducedMotion() ? "auto" : "smooth";
+}
+function scrollContainerTo(container, top, behavior) {
+	const resolved = resolveAnchorScrollBehavior(behavior);
+	container.scrollTo({
+		top,
+		behavior: resolved
+	});
+}
+function computeScrollTopForTarget(target, container, targetOffset) {
+	const current = readContainerScrollTop(container);
+	const relativeTop = targetTopInContainer(target, container);
+	return Math.max(0, current + relativeTop - targetOffset);
+}
+function collectAnchorTops(items, container, findTarget) {
+	const windowLike = isAnchorWindow(container);
+	const containerTop = windowLike ? 0 : container.getBoundingClientRect().top;
+	const out = [];
+	for (const item of items) {
+		const el = findTarget(item.href);
+		if (!el) continue;
+		const top = windowLike ? el.getBoundingClientRect().top : el.getBoundingClientRect().top - containerTop;
+		out.push({
+			href: item.href,
+			top
+		});
+	}
+	return out;
+}
+function writeAnchorHash(href, replace) {
+	if (typeof history === "undefined" || typeof window === "undefined") return;
+	const id = hrefToAnchorId(href);
+	if (!id) return;
+	const url = new URL(window.location.href);
+	const next = `${url.pathname}${url.search}#${id}`;
+	if (replace) {
+		history.replaceState(history.state, "", next);
+		return;
+	}
+	history.pushState(history.state, "", next);
+}
+//#endregion
+export { collectAnchorTops, computeScrollTopForTarget, flattenAnchorItems, hrefToAnchorId, isAnchorScrolledToEnd, isAnchorWindow, pickActiveAnchorHref, prefersAnchorReducedMotion, readContainerScrollExtent, readContainerScrollTop, resolveAnchorContainer, resolveAnchorScrollBehavior, scrollContainerTo, targetTopInContainer, writeAnchorHash };

package/dist/components/auto-complete/index.d.ts

@@ -0,0 +1,3 @@
+export { default as RsAutoComplete } from './src/RsAutoComplete.js';
+export type { RsAutoCompleteExpose, RsAutoCompleteInstance, } from './src/RsAutoComplete.js';
+export type { RsAutoCompleteFilterOption, RsAutoCompleteOption, RsAutoCompleteOptionInput, } from './src/auto-complete-utils';

package/dist/components/auto-complete/src/RsAutoComplete.css

@@ -0,0 +1,122 @@
+
+.rs-auto-complete[data-v-a95db999] {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  width: 100%;
+  max-width: 100%;
+  box-sizing: border-box;
+  vertical-align: middle;
+  color-scheme: inherit;
+}
+.rs-auto-complete__input[data-v-a95db999] {
+  box-sizing: border-box;
+  width: 100%;
+  height: var(--rs-control-height-md);
+  padding: 0 var(--rs-space-md);
+  border: 1px solid var(--rs-input-border, var(--rs-border));
+  border-radius: var(--rs-select-radius, var(--rs-radius-sm));
+  background: var(--rs-input-bg);
+  color: var(--rs-text);
+  font-family: inherit;
+  font-size: var(--rs-font-size-sm);
+  line-height: var(--rs-line-height-tight);
+  outline: none;
+  box-shadow: var(--rs-input-shadow, none);
+  transition:
+    border-color var(--rs-transition-fast),
+    box-shadow var(--rs-transition-fast),
+    background var(--rs-transition-fast);
+}
+.rs-auto-complete--ssm .rs-auto-complete__input[data-v-a95db999] {
+  height: var(--rs-control-height-ssm);
+  padding: 0 var(--rs-space-sm);
+  font-size: var(--rs-font-size-xs);
+}
+.rs-auto-complete--sm .rs-auto-complete__input[data-v-a95db999] {
+  height: var(--rs-control-height-sm);
+  padding: 0 var(--rs-space-sm);
+  font-size: var(--rs-font-size-xs);
+}
+.rs-auto-complete--lg .rs-auto-complete__input[data-v-a95db999] {
+  height: var(--rs-control-height-lg);
+  padding: 0 var(--rs-space-lg);
+  font-size: var(--rs-font-size-base);
+}
+.rs-auto-complete--clearable .rs-auto-complete__input[data-v-a95db999] {
+  padding-inline-end: calc(var(--rs-space-md) + 1.25rem);
+}
+.rs-auto-complete__input[data-v-a95db999]::placeholder {
+  color: var(--rs-placeholder);
+}
+.rs-auto-complete__input[data-v-a95db999]:hover:not(:disabled) {
+  border-color: var(--rs-input-border-hover, var(--rs-border));
+}
+.rs-auto-complete__input[data-v-a95db999]:focus {
+  border-color: var(--rs-focus-border, var(--rs-primary));
+  background: var(--rs-input-bg);
+  box-shadow:
+    var(--rs-input-shadow, none),
+    0 0 0 var(--rs-focus-ring-width, 2px) var(--rs-focus-ring);
+}
+.rs-auto-complete__input[data-v-a95db999]:disabled {
+  opacity: 0.38;
+  cursor: not-allowed;
+  background: var(--rs-surface-hover);
+}
+.rs-auto-complete__clear[data-v-a95db999] {
+  position: absolute;
+  top: 50%;
+  inset-inline-end: var(--rs-space-sm);
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 1.25rem;
+  height: 1.25rem;
+  padding: 0;
+  border: 0;
+  border-radius: var(--rs-radius-xs);
+  background: transparent;
+  color: var(--rs-muted);
+  transform: translateY(-50%);
+  cursor: pointer;
+}
+.rs-auto-complete__clear[data-v-a95db999]:hover {
+  color: var(--rs-text);
+  background: var(--rs-item-hover);
+}
+.rs-auto-complete__list[data-v-a95db999] {
+  appearance: none;
+  color-scheme: inherit;
+  z-index: calc(var(--rs-z-modal) + 2);
+  box-sizing: border-box;
+  min-width: 8rem;
+  max-width: min(24rem, calc(100vw - 1rem));
+  max-height: 16rem;
+  margin: 0;
+  padding: var(--rs-space-xs);
+  overflow: auto;
+  border: 1px solid var(--rs-dialog-border, var(--rs-border));
+  border-radius: var(--rs-radius);
+  background: var(--rs-surface-elevated);
+  box-shadow: var(--rs-shadow-lg);
+  color: var(--rs-text);
+  font: inherit;
+  font-size: var(--rs-font-size-sm);
+  line-height: var(--rs-line-height-tight);
+  outline: none;
+}
+.rs-auto-complete__item[data-v-a95db999] {
+  padding: var(--rs-space-sm) var(--rs-space-md);
+  border-radius: var(--rs-radius-sm);
+  color: var(--rs-text);
+  background: transparent;
+}
+.rs-auto-complete__item--active[data-v-a95db999],
+.rs-auto-complete__list option[data-v-a95db999]:checked,
+.rs-auto-complete__list option[data-v-a95db999]:hover:not(:disabled) {
+  background: var(--rs-item-hover);
+}
+.rs-auto-complete__list option[data-v-a95db999]:disabled {
+  color: var(--rs-muted);
+}

package/dist/components/auto-complete/src/RsAutoComplete.d.ts

@@ -0,0 +1,79 @@
+import type { RsComponentSize } from '../../../theme/types';
+import { type RsAutoCompleteFilterOption, type RsAutoCompleteOption, type RsAutoCompleteOptionInput } from './auto-complete-utils';
+/**
+ * RsAutoComplete 模板 ref 请用此类型。
+ * 不要写 `InstanceType<typeof RsAutoComplete>`：组件实例类型过深，vue-tsc 会报 Excessive stack depth。
+ */
+export interface RsAutoCompleteExpose {
+    focus: () => void;
+    blur: () => void;
+}
+/** 模板 ref 实例：expose + 根节点 */
+export type RsAutoCompleteInstance = RsAutoCompleteExpose & {
+    $el: HTMLElement;
+};
+export type { RsAutoCompleteFilterOption, RsAutoCompleteOption, RsAutoCompleteOptionInput };
+type __VLS_Props = {
+    options?: ReadonlyArray<RsAutoCompleteOptionInput>;
+    placeholder?: string;
+    disabled?: boolean;
+    size?: RsComponentSize;
+    allowClear?: boolean;
+    filterOption?: RsAutoCompleteFilterOption | boolean;
+    debounce?: number;
+    emptyText?: string;
+    /** 远程搜索进行中。列表空时显示 loadingText。 */
+    loading?: boolean;
+    loadingText?: string;
+    id?: string;
+    name?: string;
+    /** 无障碍名称。旁边已有可见 label 时可省略。 */
+    ariaLabel?: string;
+};
+type __VLS_ModelProps = {
+    modelValue?: string;
+    'open'?: boolean;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare var __VLS_12: {}, __VLS_14: {
+    option: import("../../select").RsSelectOption;
+    active: boolean;
+};
+type __VLS_Slots = {} & {
+    empty?: (props: typeof __VLS_12) => any;
+} & {
+    option?: (props: typeof __VLS_14) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, RsAutoCompleteExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    search: (query: string) => any;
+    select: (value: string) => any;
+    clear: () => any;
+    blur: (event: FocusEvent) => any;
+    focus: (event: FocusEvent) => any;
+    "update:modelValue": (value: string) => any;
+    "update:open": (value: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onSearch?: ((query: string) => any) | undefined;
+    onSelect?: ((value: string) => any) | undefined;
+    onClear?: (() => any) | undefined;
+    onBlur?: ((event: FocusEvent) => any) | undefined;
+    onFocus?: ((event: FocusEvent) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+}>, {
+    disabled: boolean;
+    loading: boolean;
+    allowClear: boolean;
+    emptyText: string;
+    options: ReadonlyArray<RsAutoCompleteOptionInput>;
+    filterOption: RsAutoCompleteFilterOption | boolean;
+    debounce: number;
+}, {}, {}, {}, 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;
+    };
+};