niuma-ui 1.1.12 → 1.2.0

package/dist/composables/useTableCellTooltip.js

@@ -0,0 +1,177 @@
+import { nextTick, onUnmounted, ref } from "vue";
+//#region src/composables/useTableCellTooltip.ts
+var RS_TABLE_TIP_ATTR = "data-rs-table-tip";
+var RS_TABLE_TIP_MODE_ATTR = "data-rs-table-tip-mode";
+var RS_TABLE_TIP_TEXT_ATTR = "data-rs-table-tip-text";
+/** 列头 headerTip：整表共享浮层，悬停 th-label 显示 */
+var RS_TABLE_HEADER_TIP_ATTR = "data-rs-table-header-tip";
+var TIP_SIDE_OFFSET = 6;
+var TIP_VIEWPORT_PAD = 8;
+var TIP_HIDE_GRACE_MS = 80;
+function isHeaderTipHost(host) {
+	return host.hasAttribute(RS_TABLE_HEADER_TIP_ATTR);
+}
+function findTipHost(target) {
+	const el = target instanceof Element ? target : target instanceof Node ? target.parentElement : null;
+	if (!el) return null;
+	const header = el.closest(`[${RS_TABLE_HEADER_TIP_ATTR}]`);
+	if (header instanceof HTMLElement) return header;
+	const cell = el.closest(`[${RS_TABLE_TIP_ATTR}], .rs-table__cell-tip`);
+	return cell instanceof HTMLElement ? cell : null;
+}
+function resolveMeasureEl(host) {
+	if (host.classList.contains("rs-table__ellipsis-text")) return host;
+	const inner = host.querySelector(".rs-table__ellipsis-text");
+	return inner instanceof HTMLElement ? inner : host;
+}
+function resolveTipText(host) {
+	if (isHeaderTipHost(host)) return host.getAttribute("data-rs-table-header-tip")?.trim() || null;
+	if (host.hasAttribute("data-rs-table-tip")) return host.getAttribute("data-rs-table-tip")?.trim() || null;
+	const mode = host.getAttribute(RS_TABLE_TIP_MODE_ATTR);
+	if (!mode) return null;
+	const text = host.getAttribute("data-rs-table-tip-text")?.trim() ?? "";
+	if (mode === "always") return text || null;
+	if (mode === "overflow") {
+		const measure = resolveMeasureEl(host);
+		if (measure.scrollWidth <= measure.clientWidth) return null;
+		return text || measure.textContent?.trim() || null;
+	}
+	return null;
+}
+function clamp(value, min, max) {
+	return Math.min(Math.max(value, min), max);
+}
+function useTableCellTooltip(options) {
+	const state = ref({
+		visible: false,
+		ready: false,
+		text: "",
+		kind: "cell",
+		style: {
+			left: "0",
+			top: "0"
+		}
+	});
+	let tipHost = null;
+	let showTimer = 0;
+	let hideTimer = 0;
+	let positionRaf = 0;
+	function clearTimers() {
+		if (showTimer) {
+			clearTimeout(showTimer);
+			showTimer = 0;
+		}
+		if (hideTimer) {
+			clearTimeout(hideTimer);
+			hideTimer = 0;
+		}
+	}
+	function cancelPositionRaf() {
+		if (positionRaf) {
+			cancelAnimationFrame(positionRaf);
+			positionRaf = 0;
+		}
+	}
+	function positionTip(host) {
+		const tipEl = options.tipRef.value;
+		if (!tipEl) return;
+		const hostRect = host.getBoundingClientRect();
+		const tipRect = tipEl.getBoundingClientRect();
+		const vw = window.innerWidth;
+		const vh = window.innerHeight;
+		let left;
+		let top;
+		if (isHeaderTipHost(host)) {
+			left = hostRect.left;
+			top = hostRect.bottom + TIP_SIDE_OFFSET;
+			if (top + tipRect.height > vh - TIP_VIEWPORT_PAD) top = hostRect.top - tipRect.height - TIP_SIDE_OFFSET;
+		} else {
+			left = hostRect.left + hostRect.width / 2 - tipRect.width / 2;
+			top = hostRect.top - tipRect.height - TIP_SIDE_OFFSET;
+			if (top < TIP_VIEWPORT_PAD) top = hostRect.bottom + TIP_SIDE_OFFSET;
+		}
+		left = clamp(left, TIP_VIEWPORT_PAD, Math.max(TIP_VIEWPORT_PAD, vw - tipRect.width - TIP_VIEWPORT_PAD));
+		top = clamp(top, TIP_VIEWPORT_PAD, Math.max(TIP_VIEWPORT_PAD, vh - tipRect.height - TIP_VIEWPORT_PAD));
+		state.value.style = {
+			left: `${left}px`,
+			top: `${top}px`
+		};
+		state.value.ready = true;
+	}
+	function hide() {
+		clearTimers();
+		cancelPositionRaf();
+		tipHost = null;
+		state.value.visible = false;
+		state.value.ready = false;
+		state.value.text = "";
+		state.value.kind = "cell";
+	}
+	function show(host, text) {
+		tipHost = host;
+		state.value.text = text;
+		state.value.kind = isHeaderTipHost(host) ? "header" : "cell";
+		state.value.ready = false;
+		state.value.visible = true;
+		cancelPositionRaf();
+		nextTick(() => {
+			positionRaf = requestAnimationFrame(() => {
+				positionRaf = 0;
+				if (tipHost === host) positionTip(host);
+			});
+		});
+	}
+	function scheduleShow(host) {
+		if (isHeaderTipHost(host)) {
+			if (options.headerEnabled && !options.headerEnabled()) return;
+		} else if (!options.enabled()) return;
+		const text = resolveTipText(host);
+		if (!text) {
+			hide();
+			return;
+		}
+		clearTimers();
+		if (tipHost !== host) tipHost = host;
+		const delay = options.delay();
+		if (delay <= 0) {
+			show(host, text);
+			return;
+		}
+		showTimer = window.setTimeout(() => {
+			showTimer = 0;
+			if (tipHost === host) show(host, text);
+		}, delay);
+	}
+	function scheduleHide() {
+		clearTimers();
+		hideTimer = window.setTimeout(hide, TIP_HIDE_GRACE_MS);
+	}
+	function onPointerOver(event) {
+		if (event.pointerType === "touch") return;
+		const host = findTipHost(event.target);
+		if (!host) {
+			if (tipHost) scheduleHide();
+			return;
+		}
+		if (host === tipHost && state.value.visible) return;
+		if (tipHost && host !== tipHost) hide();
+		scheduleShow(host);
+	}
+	function onPointerOut(event) {
+		const related = event.relatedTarget;
+		if (related instanceof Element && findTipHost(related)) return;
+		scheduleHide();
+	}
+	onUnmounted(() => {
+		clearTimers();
+		cancelPositionRaf();
+	});
+	return {
+		state,
+		onPointerOver,
+		onPointerOut,
+		hide
+	};
+}
+//#endregion
+export { RS_TABLE_HEADER_TIP_ATTR, RS_TABLE_TIP_ATTR, RS_TABLE_TIP_MODE_ATTR, RS_TABLE_TIP_TEXT_ATTR, useTableCellTooltip };

package/dist/composables/useTableEdit.d.ts

@@ -0,0 +1,63 @@
+import { type Ref } from 'vue';
+export interface RsTableEditingCell {
+    rowKey: string;
+    colKey: string;
+    rowIndex: number;
+}
+export interface RsTableStagedCell {
+    rowKey: string;
+    colKey: string;
+    rowIndex: number;
+    draft: string;
+    original: unknown;
+}
+export interface RsTableFocusCell {
+    rowKey: string;
+    colKey: string;
+    rowIndex: number;
+}
+export interface RsTableUndoEntry {
+    items: Array<{
+        rowKey: string;
+        colKey: string;
+        rowIndex: number;
+        previous: unknown;
+        next: unknown;
+    }>;
+}
+export declare function useTableEdit(options: {
+    enabled: () => boolean;
+    undoLimit?: () => number | undefined;
+}): {
+    editingCell: Ref<RsTableEditingCell | null>;
+    editingDraft: Ref<string>;
+    focusCell: Ref<RsTableFocusCell | null>;
+    stagedMap: Ref<Map<string, RsTableStagedCell>>;
+    errorMap: Ref<Map<string, string>>;
+    validatingMap: Ref<Map<string, boolean>>;
+    undoStack: Ref<RsTableUndoEntry[]>;
+    redoStack: Ref<RsTableUndoEntry[]>;
+    isEditing: (rowKey: string, colKey: string) => boolean;
+    isFocused: (rowKey: string, colKey: string) => boolean;
+    getDraft: (rowKey: string, colKey: string) => string | undefined;
+    isDirty: (rowKey: string, colKey: string) => boolean;
+    isRowDirty: (rowKey: string) => boolean;
+    getCellError: (rowKey: string, colKey: string) => string | undefined;
+    setCellError: (rowKey: string, colKey: string, message: string | null) => void;
+    clearCellError: (rowKey: string, colKey: string) => void;
+    isValidating: (rowKey: string, colKey: string) => boolean;
+    setValidating: (rowKey: string, colKey: string, value: boolean) => void;
+    getRowStagedCells: (rowKey: string) => RsTableStagedCell[];
+    startEdit: (cell: RsTableEditingCell, initialText: string) => void;
+    updateDraft: (text: string) => void;
+    cancelEdit: () => void;
+    cancelAll: () => void;
+    setFocusCell: (cell: RsTableFocusCell | null) => void;
+    stageCell: (cell: RsTableStagedCell) => void;
+    unstageCell: (rowKey: string, colKey: string) => void;
+    rollbackRow: (rowKey: string) => void;
+    commitRow: (rowKey: string) => RsTableStagedCell[];
+    pushUndo: (entry: RsTableUndoEntry | RsTableUndoEntry['items'][number]) => void;
+    undo: () => RsTableUndoEntry | null;
+    redo: () => RsTableUndoEntry | null;
+};

package/dist/composables/useTableEdit.js

@@ -0,0 +1,176 @@
+import { makeCellKey } from "../components/table/table-keys.js";
+import { ref, shallowRef } from "vue";
+//#region src/composables/useTableEdit.ts
+function useTableEdit(options) {
+	const editingCell = ref(null);
+	const editingDraft = ref("");
+	const focusCell = ref(null);
+	const stagedMap = shallowRef(/* @__PURE__ */ new Map());
+	const errorMap = shallowRef(/* @__PURE__ */ new Map());
+	const validatingMap = shallowRef(/* @__PURE__ */ new Map());
+	const undoStack = shallowRef([]);
+	const redoStack = shallowRef([]);
+	function isEditing(rowKey, colKey) {
+		const active = editingCell.value;
+		return active?.rowKey === rowKey && active.colKey === colKey;
+	}
+	function isFocused(rowKey, colKey) {
+		const active = focusCell.value;
+		return active?.rowKey === rowKey && active.colKey === colKey;
+	}
+	function getDraft(rowKey, colKey) {
+		const staged = stagedMap.value.get(makeCellKey(rowKey, colKey));
+		if (staged) return staged.draft;
+		if (isEditing(rowKey, colKey)) return editingDraft.value;
+	}
+	function isDirty(rowKey, colKey) {
+		return stagedMap.value.has(makeCellKey(rowKey, colKey));
+	}
+	function getRowStagedCells(rowKey) {
+		return [...stagedMap.value.values()].filter((item) => item.rowKey === rowKey);
+	}
+	function isRowDirty(rowKey) {
+		return getRowStagedCells(rowKey).length > 0;
+	}
+	function getCellError(rowKey, colKey) {
+		return errorMap.value.get(makeCellKey(rowKey, colKey));
+	}
+	function setCellError(rowKey, colKey, message) {
+		const key = makeCellKey(rowKey, colKey);
+		const next = new Map(errorMap.value);
+		if (!message) next.delete(key);
+		else next.set(key, message);
+		errorMap.value = next;
+	}
+	function clearCellError(rowKey, colKey) {
+		setCellError(rowKey, colKey, null);
+	}
+	function isValidating(rowKey, colKey) {
+		return validatingMap.value.get(makeCellKey(rowKey, colKey)) === true;
+	}
+	function setValidating(rowKey, colKey, value) {
+		const key = makeCellKey(rowKey, colKey);
+		const next = new Map(validatingMap.value);
+		if (!value) next.delete(key);
+		else next.set(key, true);
+		validatingMap.value = next;
+	}
+	function startEdit(cell, initialText) {
+		if (!options.enabled()) return;
+		editingCell.value = cell;
+		focusCell.value = cell;
+		const staged = stagedMap.value.get(makeCellKey(cell.rowKey, cell.colKey));
+		editingDraft.value = staged?.draft ?? initialText;
+		clearCellError(cell.rowKey, cell.colKey);
+	}
+	function updateDraft(text) {
+		if (!editingCell.value) return;
+		editingDraft.value = text;
+	}
+	function cancelEdit() {
+		editingCell.value = null;
+		editingDraft.value = "";
+	}
+	function cancelAll() {
+		editingCell.value = null;
+		editingDraft.value = "";
+		stagedMap.value = /* @__PURE__ */ new Map();
+		errorMap.value = /* @__PURE__ */ new Map();
+		validatingMap.value = /* @__PURE__ */ new Map();
+	}
+	function setFocusCell(cell) {
+		focusCell.value = cell;
+	}
+	function stageCell(cell) {
+		const key = makeCellKey(cell.rowKey, cell.colKey);
+		const next = new Map(stagedMap.value);
+		next.set(key, cell);
+		stagedMap.value = next;
+		clearCellError(cell.rowKey, cell.colKey);
+		if (editingCell.value?.rowKey === cell.rowKey && editingCell.value.colKey === cell.colKey) {
+			editingCell.value = null;
+			editingDraft.value = "";
+		}
+	}
+	function removeStagedKeys(keys) {
+		if (!keys.length) return;
+		const next = new Map(stagedMap.value);
+		for (const key of keys) next.delete(key);
+		stagedMap.value = next;
+	}
+	function unstageCell(rowKey, colKey) {
+		removeStagedKeys([makeCellKey(rowKey, colKey)]);
+	}
+	function rollbackRow(rowKey) {
+		removeStagedKeys([...stagedMap.value.keys()].filter((key) => key.startsWith(`${rowKey}:`)));
+		const errNext = new Map(errorMap.value);
+		for (const key of [...errNext.keys()]) if (key.startsWith(`${rowKey}:`)) errNext.delete(key);
+		errorMap.value = errNext;
+		if (editingCell.value?.rowKey === rowKey) cancelEdit();
+	}
+	function commitRow(rowKey) {
+		const changes = getRowStagedCells(rowKey);
+		rollbackRow(rowKey);
+		return changes;
+	}
+	function normalizeUndo(entry) {
+		if ("items" in entry) return entry;
+		return { items: [entry] };
+	}
+	function pushUndo(entry) {
+		const limit = options.undoLimit?.() ?? 50;
+		undoStack.value = [...undoStack.value, normalizeUndo(entry)].slice(-Math.max(1, limit));
+		redoStack.value = [];
+	}
+	function undo() {
+		const stack = undoStack.value;
+		if (!stack.length) return null;
+		const entry = stack[stack.length - 1];
+		undoStack.value = stack.slice(0, -1);
+		redoStack.value = [...redoStack.value, entry];
+		return entry;
+	}
+	function redo() {
+		const stack = redoStack.value;
+		if (!stack.length) return null;
+		const entry = stack[stack.length - 1];
+		redoStack.value = stack.slice(0, -1);
+		undoStack.value = [...undoStack.value, entry];
+		return entry;
+	}
+	return {
+		editingCell,
+		editingDraft,
+		focusCell,
+		stagedMap,
+		errorMap,
+		validatingMap,
+		undoStack,
+		redoStack,
+		isEditing,
+		isFocused,
+		getDraft,
+		isDirty,
+		isRowDirty,
+		getCellError,
+		setCellError,
+		clearCellError,
+		isValidating,
+		setValidating,
+		getRowStagedCells,
+		startEdit,
+		updateDraft,
+		cancelEdit,
+		cancelAll,
+		setFocusCell,
+		stageCell,
+		unstageCell,
+		rollbackRow,
+		commitRow,
+		pushUndo,
+		undo,
+		redo
+	};
+}
+//#endregion
+export { useTableEdit };

package/dist/composables/useTableRowHighlight.d.ts

@@ -0,0 +1,14 @@
+import { type ComputedRef } from 'vue';
+export declare function useTableRowHighlight(options: {
+    enabled: () => boolean;
+    highlightRowOnClick: () => boolean;
+    isControlled: () => boolean;
+    highlightedRowKey: () => string | undefined;
+    defaultHighlightedRowKey: () => string | undefined;
+    onUpdate: (value: string | undefined) => void;
+}): {
+    highlightedKey: ComputedRef<string | undefined>;
+    setHighlightedKey: (value: string | undefined) => void;
+    isHighlighted: (rowKey: string) => boolean;
+    applyRowClickHighlight: (rowKey: string) => void;
+};

package/dist/composables/useTableRowHighlight.js

@@ -0,0 +1,35 @@
+import { computed, ref } from "vue";
+//#region src/composables/useTableRowHighlight.ts
+function useTableRowHighlight(options) {
+	const internalHighlightedKey = ref(options.defaultHighlightedRowKey());
+	const highlightedKey = computed({
+		get: () => options.isControlled() ? options.highlightedRowKey() : internalHighlightedKey.value,
+		set: (value) => {
+			if (options.isControlled()) {
+				options.onUpdate(value);
+				return;
+			}
+			internalHighlightedKey.value = value;
+			options.onUpdate(value);
+		}
+	});
+	function setHighlightedKey(value) {
+		highlightedKey.value = value;
+	}
+	function isHighlighted(rowKey) {
+		if (!options.enabled()) return false;
+		return highlightedKey.value === rowKey;
+	}
+	function applyRowClickHighlight(rowKey) {
+		if (!options.enabled() || !options.highlightRowOnClick()) return;
+		setHighlightedKey(rowKey);
+	}
+	return {
+		highlightedKey,
+		setHighlightedKey,
+		isHighlighted,
+		applyRowClickHighlight
+	};
+}
+//#endregion
+export { useTableRowHighlight };

package/dist/dev/vite-codemirror-deps.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Vite optimizeDeps 扫描入口：在 dev server 启动时预构建全部 CodeMirror 语言包，
+ * 避免辅助窗口动态 import 命中过期 hash 导致 504 (Outdated Optimize Dep)。
+ */
+import 'codemirror';
+import '@codemirror/lang-cpp';
+import '@codemirror/lang-css';
+import '@codemirror/lang-go';
+import '@codemirror/lang-html';
+import '@codemirror/lang-java';
+import '@codemirror/lang-javascript';
+import '@codemirror/lang-json';
+import '@codemirror/lang-markdown';
+import '@codemirror/lang-python';
+import '@codemirror/lang-rust';
+import '@codemirror/lang-sql';
+import '@codemirror/lang-xml';
+import '@codemirror/lang-yaml';
+import '@codemirror/language';
+import '@codemirror/legacy-modes/mode/shell';

package/dist/dev/vite-codemirror-deps.js

@@ -0,0 +1,16 @@
+import "codemirror";
+import "@codemirror/lang-cpp";
+import "@codemirror/lang-css";
+import "@codemirror/lang-go";
+import "@codemirror/lang-html";
+import "@codemirror/lang-java";
+import "@codemirror/lang-javascript";
+import "@codemirror/lang-json";
+import "@codemirror/lang-markdown";
+import "@codemirror/lang-python";
+import "@codemirror/lang-rust";
+import "@codemirror/lang-sql";
+import "@codemirror/lang-xml";
+import "@codemirror/lang-yaml";
+import "@codemirror/language";
+import "@codemirror/legacy-modes/mode/shell";

package/dist/dev/vite-xterm-deps.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Vite optimizeDeps 扫描入口：在 dev server 启动时预构建 xterm，
+ * 避免 SSH / Redis / Mongo 控制台首次加载命中过期 hash 导致 504 (Outdated Optimize Dep)。
+ * CSS 一并扫描，防止 JS 预构建后样式副作用丢失。
+ */
+import '@xterm/addon-fit';
+import '@xterm/xterm';
+import '@xterm/xterm/css/xterm.css';

package/dist/dev/vite-xterm-deps.js

@@ -0,0 +1,3 @@
+import "@xterm/addon-fit";
+import "@xterm/xterm";
+import "@xterm/xterm/css/xterm.css";

package/dist/icons/custom/api.d.ts

@@ -0,0 +1,37 @@
+import { type PropType } from 'vue';
+/**
+ * Activity Bar「API」字标 — 粗圆角字重，随 currentColor 着色。
+ */
+export declare const ApiIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    size: {
+        type: PropType<number | string>;
+        default: number;
+    };
+    strokeWidth: {
+        type: PropType<number | string>;
+        default: number;
+    };
+    color: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    size: {
+        type: PropType<number | string>;
+        default: number;
+    };
+    strokeWidth: {
+        type: PropType<number | string>;
+        default: number;
+    };
+    color: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{}>, {
+    size: string | number;
+    strokeWidth: string | number;
+    color: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/icons/custom/api.js

@@ -0,0 +1,56 @@
+import { defineComponent, h } from "vue";
+//#region src/icons/custom/api.ts
+/**
+* Activity Bar「API」字标 — 粗圆角字重，随 currentColor 着色。
+*/
+var ApiIcon = defineComponent({
+	name: "ApiIcon",
+	inheritAttrs: false,
+	props: {
+		size: {
+			type: [Number, String],
+			default: 24
+		},
+		strokeWidth: {
+			type: [Number, String],
+			default: 2
+		},
+		color: {
+			type: String,
+			default: "currentColor"
+		}
+	},
+	setup(props, { attrs }) {
+		return () => {
+			const size = Number(props.size) || 24;
+			const { class: attrClass, style: attrStyle, ...restAttrs } = attrs;
+			const style = {
+				...typeof attrStyle === "object" && attrStyle && !Array.isArray(attrStyle) ? attrStyle : {},
+				color: props.color || "currentColor"
+			};
+			return h("svg", {
+				...restAttrs,
+				xmlns: "http://www.w3.org/2000/svg",
+				width: size,
+				height: size,
+				viewBox: "0 0 24 24",
+				fill: "none",
+				overflow: "visible",
+				style,
+				class: [
+					"lucide",
+					"lucide-api-icon",
+					attrClass
+				].filter(Boolean)
+			}, [h("text", {
+				class: "api-icon__label",
+				x: 12,
+				y: 12,
+				textAnchor: "middle",
+				dy: "0.35em"
+			}, "API")]);
+		};
+	}
+});
+//#endregion
+export { ApiIcon };

package/dist/icons/custom/clickhouse.d.ts

@@ -0,0 +1,37 @@
+import { type PropType } from 'vue';
+/**
+ * NiuMa ClickHouse —— 官方品牌 mark，单色填充，默认走 ClickHouse 黄并随主题明暗自动调整对比度。
+ */
+export declare const ClickhouseIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    size: {
+        type: PropType<number | string>;
+        default: number;
+    };
+    strokeWidth: {
+        type: PropType<number | string>;
+        default: number;
+    };
+    color: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    size: {
+        type: PropType<number | string>;
+        default: number;
+    };
+    strokeWidth: {
+        type: PropType<number | string>;
+        default: number;
+    };
+    color: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{}>, {
+    size: string | number;
+    strokeWidth: string | number;
+    color: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;