niuma-ui 2.1.0 → 2.1.3

package/dist/styles.css

@@ -360,29 +360,33 @@ html {
   --rs-dropdown-max-height: 16rem;
   --rs-dropdown-disabled-opacity: 0.38;
 
-  /* Context menu。尺寸在此；颜色别名语义 token，随 data-rs-theme。挂到 body 须盖住 Dialog。 */
+  /*
+   * Context menu。macOS 菜单：12px 面板、6px 选中条、约 26px 行、13px 字。
+   * 选中用主题色铺底、文字反白。颜色别名语义 token，随 data-rs-theme。
+   * 挂到 body 须盖住 Dialog。实色底，不用 backdrop-filter。
+   */
   --rs-ctx-z: calc(var(--rs-z-modal) + 2);
-  --rs-ctx-min-width: 11rem;
+  --rs-ctx-min-width: 11.5rem;
   --rs-ctx-max-width: 22rem;
   --rs-ctx-pad: 5px;
-  --rs-ctx-radius: 10px;
-  --rs-ctx-item-height: 1.5rem;
+  --rs-ctx-radius: 12px;
+  --rs-ctx-item-height: 1.625rem;
   --rs-ctx-item-radius: 6px;
-  --rs-ctx-font-size: var(--rs-font-size-xs);
-  --rs-ctx-icon-col: 28px;
+  --rs-ctx-font-size: 0.8125rem;
+  --rs-ctx-icon-col: 1.75rem;
   --rs-ctx-disabled-opacity: 0.38;
-  --rs-ctx-motion-in: 0.13s;
+  --rs-ctx-motion-in: 0.14s;
   --rs-ctx-motion-sub: 0.1s;
   --rs-ctx-bg: var(--rs-surface-elevated);
   --rs-ctx-fg: var(--rs-text-primary);
   --rs-ctx-muted: var(--rs-text-tertiary);
-  --rs-ctx-border: var(--rs-border);
-  --rs-ctx-separator: var(--rs-border-subtle);
-  --rs-ctx-shadow: var(--rs-shadow-lg);
+  --rs-ctx-border: color-mix(in srgb, var(--rs-text-primary) 8%, transparent);
+  --rs-ctx-separator: color-mix(in srgb, var(--rs-text-primary) 10%, transparent);
+  --rs-ctx-shadow: 0 16px 40px rgb(0 0 0 / 0.12), 0 2px 8px rgb(0 0 0 / 0.06);
   --rs-ctx-danger: var(--rs-danger);
   --rs-ctx-item-active-bg: var(--rs-primary);
   --rs-ctx-item-active-fg: var(--rs-primary-foreground);
-  --rs-ctx-item-active-muted: color-mix(in srgb, var(--rs-primary-foreground) 75%, transparent);
+  --rs-ctx-item-active-muted: color-mix(in srgb, var(--rs-primary-foreground) 78%, transparent);
 
   /* Popover（气泡卡片）。尺寸静态；颜色在主题块内。 */
   --rs-popover-pad: 0.75rem;
@@ -977,6 +981,7 @@ html {
   --rs-shadow-sm: 0 1px 3px rgb(0 0 0 / 0.4);
   --rs-shadow: 0 4px 16px rgb(0 0 0 / 0.45), 0 0 0 0.5px rgb(255 255 255 / 0.08);
   --rs-shadow-lg: 0 12px 32px rgb(0 0 0 / 0.5), 0 0 0 0.5px rgb(255 255 255 / 0.1);
+  --rs-ctx-shadow: 0 16px 40px rgb(0 0 0 / 0.46), 0 2px 8px rgb(0 0 0 / 0.28);
 }
 
 /* ── 公共亮色：无属性 = light，避免盖住后面的 dark（:root 与属性选择器同权）── */
@@ -1362,6 +1367,7 @@ html {
   --rs-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.04), 0 0 0 0.5px rgb(0 0 0 / 0.04);
   --rs-shadow: 0 4px 16px rgb(0 0 0 / 0.08), 0 0 0 0.5px rgb(0 0 0 / 0.06);
   --rs-shadow-lg: 0 12px 32px rgb(0 0 0 / 0.12), 0 0 0 0.5px rgb(0 0 0 / 0.08);
+  --rs-ctx-shadow: 0 16px 40px rgb(0 0 0 / 0.12), 0 2px 8px rgb(0 0 0 / 0.06);
 }
 
 /**
@@ -1419,6 +1425,16 @@ html {
     --rs-shadow-sm: none;
     --rs-shadow: none;
     --rs-shadow-lg: none;
+    --rs-ctx-bg: Canvas;
+    --rs-ctx-fg: CanvasText;
+    --rs-ctx-muted: GrayText;
+    --rs-ctx-border: CanvasText;
+    --rs-ctx-separator: CanvasText;
+    --rs-ctx-shadow: none;
+    --rs-ctx-danger: Mark;
+    --rs-ctx-item-active-bg: Highlight;
+    --rs-ctx-item-active-fg: HighlightText;
+    --rs-ctx-item-active-muted: HighlightText;
     --rs-card-border: CanvasText;
     --rs-card-separator: CanvasText;
     --rs-card-header-bg: Canvas;

package/dist/theme/color-theme.d.ts

@@ -0,0 +1,64 @@
+import { type RsResolvedTheme } from './types';
+/**
+ * 颜色主题身份。只标记当前皮肤，组件样式不要用它做选择器。
+ * 明暗仍只写 `data-rs-theme="light|dark"`。
+ */
+export declare const colorThemeAttribute = "data-rs-color-theme";
+/** 文档级编辑器要同时观察明暗和颜色主题，否则同为暗色时换皮肤不会重读 token。 */
+export declare const documentThemeAttributes: readonly ["data-rs-theme", "data-rs-color-theme"];
+/**
+ * 主题包可以覆盖的语义令牌。表格、树、按钮等已用 var() 指向这些名字。
+ * 键是主题文件里的字段，值是要写到元素上的 CSS 变量。
+ */
+export declare const RS_COLOR_THEME_VARS: {
+    readonly primary: "--rs-primary";
+    readonly primaryHover: "--rs-primary-hover";
+    readonly primaryForeground: "--rs-primary-foreground";
+    readonly primaryContainer: "--rs-primary-container";
+    readonly onPrimaryContainer: "--rs-on-primary-container";
+    readonly bg: "--rs-bg";
+    readonly surface: "--rs-surface";
+    readonly surfaceElevated: "--rs-surface-elevated";
+    readonly surfaceHover: "--rs-surface-hover";
+    readonly itemHover: "--rs-item-hover";
+    readonly inputBg: "--rs-input-bg";
+    readonly inputBorder: "--rs-input-border";
+    readonly inputBorderHover: "--rs-input-border-hover";
+    readonly border: "--rs-border";
+    readonly borderSubtle: "--rs-border-subtle";
+    readonly text: "--rs-text-primary";
+    readonly muted: "--rs-text-secondary";
+    readonly placeholder: "--rs-text-tertiary";
+    readonly textDisabled: "--rs-text-disabled";
+    readonly textInverse: "--rs-text-inverse";
+    readonly danger: "--rs-danger";
+    readonly dangerContainer: "--rs-danger-container";
+    readonly onDangerContainer: "--rs-on-danger-container";
+    readonly success: "--rs-success";
+    readonly successContainer: "--rs-success-container";
+    readonly onSuccessContainer: "--rs-on-success-container";
+    readonly warning: "--rs-warning";
+    readonly warningContainer: "--rs-warning-container";
+    readonly onWarningContainer: "--rs-on-warning-container";
+    readonly info: "--rs-info";
+    readonly infoContainer: "--rs-info-container";
+    readonly onInfoContainer: "--rs-on-info-container";
+};
+export type RsColorThemeToken = keyof typeof RS_COLOR_THEME_VARS;
+/** 一份可安装的颜色主题。`id` 不翻译；`label` 用英文，宿主自己做语言包。 */
+export interface RsColorTheme {
+    id: string;
+    label: string;
+    uiTheme: RsResolvedTheme;
+    colors: Partial<Record<RsColorThemeToken, string>>;
+}
+/** 拒绝能逃出自定义属性、注入样式或外链的值。允许 hex、函数色和 var()。 */
+export declare function isSafeColorThemeValue(value: string): boolean;
+export declare function isSafeColorThemeId(id: string): boolean;
+/**
+ * 把主题包写到元素的内联 `--rs-*` 上，盖过 styles.css 与 brand.css。
+ * 未列出的字段保持样式表原值。非法 id 或没有目标元素时不改 DOM。
+ */
+export declare function applyColorTheme(theme: RsColorTheme, el?: HTMLElement | null): boolean;
+/** 去掉该元素上由颜色主题写上的变量，回到样式表。 */
+export declare function clearColorTheme(el?: HTMLElement | null): void;

package/dist/theme/color-theme.js

@@ -0,0 +1,100 @@
+import { themeAttribute } from "./types.js";
+//#region src/theme/color-theme.ts
+/**
+* 颜色主题身份。只标记当前皮肤，组件样式不要用它做选择器。
+* 明暗仍只写 `data-rs-theme="light|dark"`。
+*/
+var colorThemeAttribute = "data-rs-color-theme";
+/** 文档级编辑器要同时观察明暗和颜色主题，否则同为暗色时换皮肤不会重读 token。 */
+var documentThemeAttributes = [themeAttribute, colorThemeAttribute];
+/**
+* 主题包可以覆盖的语义令牌。表格、树、按钮等已用 var() 指向这些名字。
+* 键是主题文件里的字段，值是要写到元素上的 CSS 变量。
+*/
+var RS_COLOR_THEME_VARS = {
+	primary: "--rs-primary",
+	primaryHover: "--rs-primary-hover",
+	primaryForeground: "--rs-primary-foreground",
+	primaryContainer: "--rs-primary-container",
+	onPrimaryContainer: "--rs-on-primary-container",
+	bg: "--rs-bg",
+	surface: "--rs-surface",
+	surfaceElevated: "--rs-surface-elevated",
+	surfaceHover: "--rs-surface-hover",
+	itemHover: "--rs-item-hover",
+	inputBg: "--rs-input-bg",
+	inputBorder: "--rs-input-border",
+	inputBorderHover: "--rs-input-border-hover",
+	border: "--rs-border",
+	borderSubtle: "--rs-border-subtle",
+	text: "--rs-text-primary",
+	muted: "--rs-text-secondary",
+	placeholder: "--rs-text-tertiary",
+	textDisabled: "--rs-text-disabled",
+	textInverse: "--rs-text-inverse",
+	danger: "--rs-danger",
+	dangerContainer: "--rs-danger-container",
+	onDangerContainer: "--rs-on-danger-container",
+	success: "--rs-success",
+	successContainer: "--rs-success-container",
+	onSuccessContainer: "--rs-on-success-container",
+	warning: "--rs-warning",
+	warningContainer: "--rs-warning-container",
+	onWarningContainer: "--rs-on-warning-container",
+	info: "--rs-info",
+	infoContainer: "--rs-info-container",
+	onInfoContainer: "--rs-on-info-container"
+};
+var THEME_ID = /^[A-Za-z0-9][A-Za-z0-9._-]{0,127}$/;
+var appliedVars = /* @__PURE__ */ new WeakMap();
+function themeTarget(el) {
+	if (el) return el;
+	if (typeof document === "undefined") return null;
+	return document.documentElement;
+}
+/** 拒绝能逃出自定义属性、注入样式或外链的值。允许 hex、函数色和 var()。 */
+function isSafeColorThemeValue(value) {
+	const raw = value.trim();
+	if (!raw || raw.length > 240) return false;
+	if (/[;{}<>]|url\s*\(|expression\s*\(|@import|\/\*|\*\//i.test(raw)) return false;
+	return true;
+}
+function isSafeColorThemeId(id) {
+	return THEME_ID.test(id);
+}
+/**
+* 把主题包写到元素的内联 `--rs-*` 上，盖过 styles.css 与 brand.css。
+* 未列出的字段保持样式表原值。非法 id 或没有目标元素时不改 DOM。
+*/
+function applyColorTheme(theme, el) {
+	const target = themeTarget(el);
+	if (!target || !isSafeColorThemeId(theme.id)) return false;
+	const previous = appliedVars.get(target) ?? /* @__PURE__ */ new Set();
+	const next = /* @__PURE__ */ new Set();
+	for (const key of Object.keys(RS_COLOR_THEME_VARS)) {
+		const value = theme.colors[key];
+		if (value == null) continue;
+		const raw = String(value).trim();
+		if (!isSafeColorThemeValue(raw)) continue;
+		const prop = RS_COLOR_THEME_VARS[key];
+		target.style.setProperty(prop, raw);
+		next.add(prop);
+	}
+	for (const prop of previous) if (!next.has(prop)) target.style.removeProperty(prop);
+	appliedVars.set(target, next);
+	target.setAttribute(colorThemeAttribute, theme.id);
+	return true;
+}
+/** 去掉该元素上由颜色主题写上的变量，回到样式表。 */
+function clearColorTheme(el) {
+	const target = themeTarget(el);
+	if (!target) return;
+	const previous = appliedVars.get(target);
+	if (previous) {
+		for (const prop of previous) target.style.removeProperty(prop);
+		appliedVars.delete(target);
+	}
+	target.removeAttribute(colorThemeAttribute);
+}
+//#endregion
+export { RS_COLOR_THEME_VARS, applyColorTheme, clearColorTheme, colorThemeAttribute, documentThemeAttributes, isSafeColorThemeId, isSafeColorThemeValue };

package/dist/utils/rs-clipboard.d.ts

@@ -13,7 +13,7 @@ export declare function writeClipboardText(text: string): Promise<boolean>;
 export declare function copyTextWithExecCommand(text: string): boolean;
 /** HTTP / 非安全上下文没有 Clipboard API，writeText 会 SecurityError。 */
 export declare function isInsecureClipboardContext(): boolean;
-/** 写入系统剪贴板。HTTP 先同步 execCommand，避免 await 丢掉用户手势。 */
+/** 写入系统剪贴板。先同步 execCommand，避免 await 丢掉点击手势；对话框里也要在这一拍写完。 */
 export declare function copyTextToClipboard(text: string): Promise<boolean>;
 /** @internal vitest 用 */
 export declare function __resetClipboardStateForTests(): void;

package/dist/utils/rs-clipboard.js

@@ -158,6 +158,19 @@ async function writeClipboardText(text) {
 		return false;
 	}
 }
+/** 打开的 dialog 会把焦点留在框内。临时输入框必须挂在这个 dialog 里，挂到 body 上选不中，复制是空的。 */
+function clipboardMount() {
+	const active = document.activeElement;
+	if (active instanceof Element) {
+		const dialog = active.closest("dialog");
+		if (dialog instanceof HTMLElement) return dialog;
+	}
+	if (typeof document.querySelector === "function") {
+		const open = document.querySelector("dialog[open]");
+		if (open instanceof HTMLElement) return open;
+	}
+	return document.body;
+}
 /** execCommand 兜底：CEF / 无 Clipboard API 权限时菜单复制仍可用 */
 function copyTextWithExecCommand(text) {
 	if (!text || typeof document === "undefined") return false;
@@ -166,7 +179,7 @@ function copyTextWithExecCommand(text) {
 		textarea.value = text;
 		textarea.setAttribute("readonly", "");
 		textarea.style.cssText = "position:fixed;left:0;top:0;width:1px;height:1px;padding:0;border:0;opacity:0.01";
-		document.body.appendChild(textarea);
+		clipboardMount().appendChild(textarea);
 		if (typeof textarea.focus === "function") textarea.focus();
 		textarea.select();
 		if (typeof textarea.setSelectionRange === "function") textarea.setSelectionRange(0, text.length);
@@ -181,16 +194,13 @@ function copyTextWithExecCommand(text) {
 function isInsecureClipboardContext() {
 	return typeof globalThis !== "undefined" && globalThis.isSecureContext === false;
 }
-/** 写入系统剪贴板。HTTP 先同步 execCommand，避免 await 丢掉用户手势。 */
+/** 写入系统剪贴板。先同步 execCommand，避免 await 丢掉点击手势；对话框里也要在这一拍写完。 */
 async function copyTextToClipboard(text) {
 	if (!text) return false;
-	if (isInsecureClipboardContext()) {
-		if (copyTextWithExecCommand(text)) return true;
-		return writeClipboardViaShell(text);
-	}
+	if (copyTextWithExecCommand(text)) return true;
+	if (isInsecureClipboardContext()) return writeClipboardViaShell(text);
 	await syncClipboardPermissionState();
 	if (!writeApiBlocked && await writeClipboardText(text)) return true;
-	if (copyTextWithExecCommand(text)) return true;
 	return writeClipboardViaShell(text);
 }
 //#endregion

package/dist/vite-plugins/niuma-ui-host.d.ts

@@ -64,7 +64,8 @@ export declare function emitLiveReexportIndex(map: Map<string, NiumaUiBinding>):
  */
 export declare function parseRuntimeBindings(source: string): Map<string, NiumaUiBinding>;
 /**
- * FollowSourceBarrels 把 `./components/button` 这类目录再导出展开到实现文件。
+ * FollowSourceBarrels 把目录 index，以及 `icons/registry.ts` 这类纯再导出，展开到实现文件。
  * 只跟一层，避免评估整桶 `src/index.ts`。
+ * 非 index 只有名字本身是 `export { x } from` 时才改指向，这样 `isRsBrandIconName` 落到 `brand.ts`，不会把同文件再导出的 Lucide 一起求值。
  */
 export declare function followSourceBarrels(root: string, map: Map<string, NiumaUiBinding>): Map<string, NiumaUiBinding>;

package/dist/vite-plugins/niuma-ui-host.js

@@ -123,7 +123,16 @@ function niumaUiHostRewrite(ctx) {
                 return null;
             if (!code.includes('@niuma/ui') && !code.includes('niuma-ui'))
                 return null;
-            return rewriteHostModule(code, id, ctx.map, (from, spec) => resolveTarget(from, spec, ctx.root, ctx.useSource));
+            const rewrite = () => rewriteHostModule(code, id, ctx.map, (from, spec) => resolveTarget(from, spec, ctx.root, ctx.useSource));
+            try {
+                return await rewrite();
+            }
+            catch (err) {
+                if (!(err instanceof Error) || !err.message.includes('未找到运行时导出'))
+                    throw err;
+                ctx.map = loadRuntimeBindings(ctx.root, ctx.useSource);
+                return rewrite();
+            }
         },
     };
 }
@@ -400,21 +409,31 @@ function loadRuntimeBindings(root, useSource) {
     return map;
 }
 /**
- * FollowSourceBarrels 把 `./components/button` 这类目录再导出展开到实现文件。
+ * FollowSourceBarrels 把目录 index，以及 `icons/registry.ts` 这类纯再导出，展开到实现文件。
  * 只跟一层，避免评估整桶 `src/index.ts`。
+ * 非 index 只有名字本身是 `export { x } from` 时才改指向，这样 `isRsBrandIconName` 落到 `brand.ts`，不会把同文件再导出的 Lucide 一起求值。
  */
 export function followSourceBarrels(root, map) {
     const next = new Map();
+    const parsed = new Map();
+    const bindingsIn = (file) => {
+        const cached = parsed.get(file);
+        if (cached)
+            return cached;
+        const child = parseRuntimeBindings(readFileSync(file, 'utf8'));
+        parsed.set(file, child);
+        return child;
+    };
     for (const [name, binding] of map) {
         const file = resolveSourceModule(root, binding.from);
-        if (!file || !/[/\\]index\.(ts|js)$/.test(file)) {
+        if (!file) {
             next.set(name, binding);
             continue;
         }
-        const child = parseRuntimeBindings(readFileSync(file, 'utf8'));
-        const inner = child.get(name);
+        const barrel = /[/\\]index\.(ts|js)$/.test(file);
+        const inner = bindingsIn(file).get(name);
         if (!inner) {
-            next.set(name, { ...binding, from: toSrcRel(root, file) });
+            next.set(name, barrel ? { ...binding, from: toSrcRel(root, file) } : binding);
             continue;
         }
         const innerAbs = resolveRelativeModule(file, inner.from);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "niuma-ui",
-  "version": "2.1.0",
+  "version": "2.1.3",
   "license": "Apache-2.0",
   "type": "module",
   "description": "Vue 3 workbench design system — Rs* components, --rs-* tokens, optional Monaco / CodeMirror / xterm",