@zerodep-dev/vue-tsx-pro-ui 0.0.0-stage → 0.2.0

package/dist/config/theme/boot.d.ts

@@ -0,0 +1,97 @@
+import type { ColorSchemes } from './theme';
+/** 跟随系统的取值 */
+export declare const SYSTEM_THEME = "system";
+/** 记住主题选择的默认 localStorage 键（createThemePreference 与 themeBootScript 共用） */
+export declare const DEFAULT_THEME_STORAGE_KEY = "vue-tsx-pro-theme";
+/** themeBootScript 要知道的每套主题的取值：主题的颜色编译后是 CSS 变量，脚本在应用加载前拿不到 */
+export interface ThemeBootColors {
+    /** 页面背景色 */
+    background: string;
+    /** 文字色 */
+    text: string;
+    /** 浏览器配色方案 */
+    colorScheme: keyof ColorSchemes;
+}
+/**
+ * 防闪烁：生成一段内联到 HTML <head> 的脚本，应用加载前按记住的偏好设好页面底色、文字色与配色方案，
+ * 并写上 data-theme。应用挂载后 createUi 接手（paintDocument 时去掉这里写的行内颜色）。
+ */
+export declare function themeBootScript<Name extends string>(options: {
+    /** 各主题的取值 */
+    themes: Record<Name, ThemeBootColors>;
+    /** 跟随系统时用哪两套，默认 light、dark */
+    system?: {
+        light: Name;
+        dark: Name;
+    };
+    /** 与 createThemePreference 相同的存储键 */
+    storageKey?: string;
+    /** 没记过时的偏好，默认跟随系统 */
+    fallback?: Name | typeof SYSTEM_THEME;
+}): string;
+/**
+ * 内置主题（builtinThemes）的底色、文字色与配色方案，给 themeBootScript 用。
+ * 与主题文件里的 background、text 一致（pnpm themes:check 核对）
+ */
+export declare const builtinThemeBootColors: {
+    readonly light: {
+        readonly background: '#fcfcfd';
+        readonly text: '#1c2024';
+        readonly colorScheme: 'light';
+    };
+    readonly dark: {
+        readonly background: '#111113';
+        readonly text: '#edeef0';
+        readonly colorScheme: 'dark';
+    };
+    readonly paper: {
+        readonly background: '#f5efdf';
+        readonly text: '#3b2f20';
+        readonly colorScheme: 'light';
+    };
+    readonly midnight: {
+        readonly background: '#0d1321';
+        readonly text: '#eef2fa';
+        readonly colorScheme: 'dark';
+    };
+    readonly 'high-contrast': {
+        readonly background: '#ffffff';
+        readonly text: '#000000';
+        readonly colorScheme: 'light';
+    };
+    readonly ocean: {
+        readonly background: '#f7fdff';
+        readonly text: '#10222c';
+        readonly colorScheme: 'light';
+    };
+    readonly forest: {
+        readonly background: '#f9fef9';
+        readonly text: '#182318';
+        readonly colorScheme: 'light';
+    };
+    readonly lemon: {
+        readonly background: '#fefdf2';
+        readonly text: '#232010';
+        readonly colorScheme: 'light';
+    };
+    readonly sakura: {
+        readonly background: '#fffafc';
+        readonly text: '#281b20';
+        readonly colorScheme: 'light';
+    };
+    readonly festive: {
+        readonly background: '#fffaf6';
+        readonly text: '#2c1b13';
+        readonly colorScheme: 'light';
+    };
+    readonly cyberpunk: {
+        readonly background: '#110e20';
+        readonly text: '#ede9ff';
+        readonly colorScheme: 'dark';
+    };
+    readonly coffee: {
+        readonly background: '#180f0a';
+        readonly text: '#ffe9dc';
+        readonly colorScheme: 'dark';
+    };
+};

package/dist/config/theme/boot.js

@@ -0,0 +1,90 @@
+//#region src/config/theme/boot.ts
+/** 跟随系统的取值 */
+var SYSTEM_THEME = "system";
+/** 记住主题选择的默认 localStorage 键（createThemePreference 与 themeBootScript 共用） */
+var DEFAULT_THEME_STORAGE_KEY = "vue-tsx-pro-theme";
+/**
+* 防闪烁：生成一段内联到 HTML <head> 的脚本，应用加载前按记住的偏好设好页面底色、文字色与配色方案，
+* 并写上 data-theme。应用挂载后 createUi 接手（paintDocument 时去掉这里写的行内颜色）。
+*/
+function themeBootScript(options) {
+	return `(()=>{const c=${JSON.stringify({
+		themes: options.themes,
+		system: options.system ?? {
+			light: "light",
+			dark: "dark"
+		},
+		key: options.storageKey ?? "vue-tsx-pro-theme",
+		fallback: options.fallback ?? "system"
+	})};let p;try{p=localStorage.getItem(c.key)}catch(e){}if(p!=='system'&&!c.themes[p])p=c.fallback;const n=p==='system'?(matchMedia('(prefers-color-scheme: dark)').matches?c.system.dark:c.system.light):p;const t=c.themes[n];if(!t)return;const r=document.documentElement;r.dataset.theme=n;r.style.colorScheme=t.colorScheme;r.style.backgroundColor=t.background;r.style.color=t.text})()`;
+}
+/**
+* 内置主题（builtinThemes）的底色、文字色与配色方案，给 themeBootScript 用。
+* 与主题文件里的 background、text 一致（pnpm themes:check 核对）
+*/
+var builtinThemeBootColors = {
+	light: {
+		background: "#fcfcfd",
+		text: "#1c2024",
+		colorScheme: "light"
+	},
+	dark: {
+		background: "#111113",
+		text: "#edeef0",
+		colorScheme: "dark"
+	},
+	paper: {
+		background: "#f5efdf",
+		text: "#3b2f20",
+		colorScheme: "light"
+	},
+	midnight: {
+		background: "#0d1321",
+		text: "#eef2fa",
+		colorScheme: "dark"
+	},
+	"high-contrast": {
+		background: "#ffffff",
+		text: "#000000",
+		colorScheme: "light"
+	},
+	ocean: {
+		background: "#f7fdff",
+		text: "#10222c",
+		colorScheme: "light"
+	},
+	forest: {
+		background: "#f9fef9",
+		text: "#182318",
+		colorScheme: "light"
+	},
+	lemon: {
+		background: "#fefdf2",
+		text: "#232010",
+		colorScheme: "light"
+	},
+	sakura: {
+		background: "#fffafc",
+		text: "#281b20",
+		colorScheme: "light"
+	},
+	festive: {
+		background: "#fffaf6",
+		text: "#2c1b13",
+		colorScheme: "light"
+	},
+	cyberpunk: {
+		background: "#110e20",
+		text: "#ede9ff",
+		colorScheme: "dark"
+	},
+	coffee: {
+		background: "#180f0a",
+		text: "#ffe9dc",
+		colorScheme: "dark"
+	}
+};
+//#endregion
+export { DEFAULT_THEME_STORAGE_KEY, SYSTEM_THEME, builtinThemeBootColors, themeBootScript };
+
+//# sourceMappingURL=boot.js.map

package/dist/config/theme/boot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"boot.js","names":[],"sources":["../../../src/config/theme/boot.ts"],"sourcesContent":["/**\n * 防闪烁脚本与内置主题的底色：生成 HTML 时（构建脚本、服务端模板）在 Node 里调用，所以这个模块不依赖样式引擎与 Vue，\n * 另有子路径入口 `@zerodep-dev/vue-tsx-pro-ui/theme-boot`。\n *\n *   import { builtinThemeBootColors, themeBootScript } from '@zerodep-dev/vue-tsx-pro-ui/theme-boot';\n *   const html = `<script>${themeBootScript({ themes: builtinThemeBootColors })}</script>`;\n */\n// 只取类型：这个模块要在 Node 里运行，不能带上主题文件（样式引擎）\nimport type { BuiltinThemeName } from './builtin';\nimport type { ColorSchemes } from './theme';\n\n/** 跟随系统的取值 */\nexport const SYSTEM_THEME = 'system';\n\n/** 记住主题选择的默认 localStorage 键（createThemePreference 与 themeBootScript 共用） */\nexport const DEFAULT_THEME_STORAGE_KEY = 'vue-tsx-pro-theme';\n\n/** themeBootScript 要知道的每套主题的取值：主题的颜色编译后是 CSS 变量，脚本在应用加载前拿不到 */\nexport interface ThemeBootColors {\n  /** 页面背景色 */\n  background: string;\n  /** 文字色 */\n  text: string;\n  /** 浏览器配色方案 */\n  colorScheme: keyof ColorSchemes;\n}\n\n/**\n * 防闪烁：生成一段内联到 HTML <head> 的脚本，应用加载前按记住的偏好设好页面底色、文字色与配色方案，\n * 并写上 data-theme。应用挂载后 createUi 接手（paintDocument 时去掉这里写的行内颜色）。\n */\nexport function themeBootScript<Name extends string>(options: {\n  /** 各主题的取值 */\n  themes: Record<Name, ThemeBootColors>;\n  /** 跟随系统时用哪两套，默认 light、dark */\n  system?: { light: Name; dark: Name };\n  /** 与 createThemePreference 相同的存储键 */\n  storageKey?: string;\n  /** 没记过时的偏好，默认跟随系统 */\n  fallback?: Name | typeof SYSTEM_THEME;\n}): string {\n  const config = JSON.stringify({\n    themes: options.themes,\n    system: options.system ?? { light: 'light', dark: 'dark' },\n    key: options.storageKey ?? DEFAULT_THEME_STORAGE_KEY,\n    fallback: options.fallback ?? SYSTEM_THEME,\n  });\n  return `(()=>{const c=${config};let p;try{p=localStorage.getItem(c.key)}catch(e){}if(p!=='system'&&!c.themes[p])p=c.fallback;const n=p==='system'?(matchMedia('(prefers-color-scheme: dark)').matches?c.system.dark:c.system.light):p;const t=c.themes[n];if(!t)return;const r=document.documentElement;r.dataset.theme=n;r.style.colorScheme=t.colorScheme;r.style.backgroundColor=t.background;r.style.color=t.text})()`;\n}\n\n/**\n * 内置主题（builtinThemes）的底色、文字色与配色方案，给 themeBootScript 用。\n * 与主题文件里的 background、text 一致（pnpm themes:check 核对）\n */\nexport const builtinThemeBootColors = {\n  light: { background: '#fcfcfd', text: '#1c2024', colorScheme: 'light' },\n  dark: { background: '#111113', text: '#edeef0', colorScheme: 'dark' },\n  paper: { background: '#f5efdf', text: '#3b2f20', colorScheme: 'light' },\n  midnight: { background: '#0d1321', text: '#eef2fa', colorScheme: 'dark' },\n  'high-contrast': { background: '#ffffff', text: '#000000', colorScheme: 'light' },\n  ocean: { background: '#f7fdff', text: '#10222c', colorScheme: 'light' },\n  forest: { background: '#f9fef9', text: '#182318', colorScheme: 'light' },\n  lemon: { background: '#fefdf2', text: '#232010', colorScheme: 'light' },\n  sakura: { background: '#fffafc', text: '#281b20', colorScheme: 'light' },\n  festive: { background: '#fffaf6', text: '#2c1b13', colorScheme: 'light' },\n  cyberpunk: { background: '#110e20', text: '#ede9ff', colorScheme: 'dark' },\n  coffee: { background: '#180f0a', text: '#ffe9dc', colorScheme: 'dark' },\n} as const satisfies Record<BuiltinThemeName, ThemeBootColors>;\n"],"mappings":";;AAYA,IAAa,eAAe;;AAG5B,IAAa,4BAA4B;;;;;AAgBzC,SAAgB,gBAAqC,SAS1C;CAOT,OAAO,iBANQ,KAAK,UAAU;EAC5B,QAAQ,QAAQ;EAChB,QAAQ,QAAQ,UAAU;GAAE,OAAO;GAAS,MAAM;EAAO;EACzD,KAAK,QAAQ,cAAA;EACb,UAAU,QAAQ,YAAA;CACpB,CACwB,EAAO;AACjC;;;;;AAMA,IAAa,yBAAyB;CACpC,OAAO;EAAE,YAAY;EAAW,MAAM;EAAW,aAAa;CAAQ;CACtE,MAAM;EAAE,YAAY;EAAW,MAAM;EAAW,aAAa;CAAO;CACpE,OAAO;EAAE,YAAY;EAAW,MAAM;EAAW,aAAa;CAAQ;CACtE,UAAU;EAAE,YAAY;EAAW,MAAM;EAAW,aAAa;CAAO;CACxE,iBAAiB;EAAE,YAAY;EAAW,MAAM;EAAW,aAAa;CAAQ;CAChF,OAAO;EAAE,YAAY;EAAW,MAAM;EAAW,aAAa;CAAQ;CACtE,QAAQ;EAAE,YAAY;EAAW,MAAM;EAAW,aAAa;CAAQ;CACvE,OAAO;EAAE,YAAY;EAAW,MAAM;EAAW,aAAa;CAAQ;CACtE,QAAQ;EAAE,YAAY;EAAW,MAAM;EAAW,aAAa;CAAQ;CACvE,SAAS;EAAE,YAAY;EAAW,MAAM;EAAW,aAAa;CAAQ;CACxE,WAAW;EAAE,YAAY;EAAW,MAAM;EAAW,aAAa;CAAO;CACzE,QAAQ;EAAE,YAAY;EAAW,MAAM;EAAW,aAAa;CAAO;AACxE"}

package/dist/config/theme/builtin.d.ts

@@ -0,0 +1,21 @@
+import type { Lang } from '../lang/lang';
+import type { Theme } from './theme';
+/** 全部内置主题，按亮色、暗色、纸张、午夜、高对比，再到各风格主题排列（ThemeSwitcher 按这个顺序列出） */
+export declare const builtinThemes: {
+    readonly light: Theme;
+    readonly dark: Theme;
+    readonly paper: Theme;
+    readonly midnight: Theme;
+    readonly 'high-contrast': Theme;
+    readonly ocean: Theme;
+    readonly forest: Theme;
+    readonly lemon: Theme;
+    readonly sakura: Theme;
+    readonly festive: Theme;
+    readonly cyberpunk: Theme;
+    readonly coffee: Theme;
+};
+/** 内置主题的名字 */
+export type BuiltinThemeName = keyof typeof builtinThemes;
+/** 内置主题在当前语言下的名字：`builtinThemeLabel(lang, 'high-contrast')` → “高对比” */
+export declare function builtinThemeLabel(lang: Lang, name: BuiltinThemeName): string;

package/dist/config/theme/builtin.js

@@ -0,0 +1,58 @@
+import { lightTheme } from "./light.js";
+import { darkTheme } from "./dark.js";
+import { paperTheme } from "./paper.js";
+import { coffeeTheme } from "./coffee.js";
+import { cyberpunkTheme } from "./cyberpunk.js";
+import { festiveTheme } from "./festive.js";
+import { forestTheme } from "./forest.js";
+import { highContrastTheme } from "./high-contrast.js";
+import { lemonTheme } from "./lemon.js";
+import { midnightTheme } from "./midnight.js";
+import { oceanTheme } from "./ocean.js";
+import { sakuraTheme } from "./sakura.js";
+//#region src/config/theme/builtin.ts
+/**
+* 内置主题：名字 → 主题。createThemePreference 的 themes 可以直接用它，也可以挑几套：
+*
+*   createThemePreference({ themes: builtinThemes })
+*   createThemePreference({ themes: { light: lightTheme, dark: darkTheme, ocean: oceanTheme } })
+*
+* 加一套内置主题：在这里登记，再补上语言包里的名字（builtinThemeLabel）、boot.ts 的底色、ThemeSwitcher 的图标——
+* 后三处按 BuiltinThemeName 写成完整的表，漏了类型检查会报错；pnpm themes:check 从这里读出主题文件核对颜色。
+*/
+/** 全部内置主题，按亮色、暗色、纸张、午夜、高对比，再到各风格主题排列（ThemeSwitcher 按这个顺序列出） */
+var builtinThemes = {
+	light: lightTheme,
+	dark: darkTheme,
+	paper: paperTheme,
+	midnight: midnightTheme,
+	"high-contrast": highContrastTheme,
+	ocean: oceanTheme,
+	forest: forestTheme,
+	lemon: lemonTheme,
+	sakura: sakuraTheme,
+	festive: festiveTheme,
+	cyberpunk: cyberpunkTheme,
+	coffee: coffeeTheme
+};
+/** 内置主题在当前语言下的名字：`builtinThemeLabel(lang, 'high-contrast')` → “高对比” */
+function builtinThemeLabel(lang, name) {
+	return {
+		light: lang.themeLight,
+		dark: lang.themeDark,
+		paper: lang.themePaper,
+		midnight: lang.themeMidnight,
+		"high-contrast": lang.themeHighContrast,
+		ocean: lang.themeOcean,
+		forest: lang.themeForest,
+		lemon: lang.themeLemon,
+		sakura: lang.themeSakura,
+		festive: lang.themeFestive,
+		cyberpunk: lang.themeCyberpunk,
+		coffee: lang.themeCoffee
+	}[name];
+}
+//#endregion
+export { builtinThemeLabel, builtinThemes };
+
+//# sourceMappingURL=builtin.js.map

package/dist/config/theme/builtin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"builtin.js","names":[],"sources":["../../../src/config/theme/builtin.ts"],"sourcesContent":["/**\n * 内置主题：名字 → 主题。createThemePreference 的 themes 可以直接用它，也可以挑几套：\n *\n *   createThemePreference({ themes: builtinThemes })\n *   createThemePreference({ themes: { light: lightTheme, dark: darkTheme, ocean: oceanTheme } })\n *\n * 加一套内置主题：在这里登记，再补上语言包里的名字（builtinThemeLabel）、boot.ts 的底色、ThemeSwitcher 的图标——\n * 后三处按 BuiltinThemeName 写成完整的表，漏了类型检查会报错；pnpm themes:check 从这里读出主题文件核对颜色。\n */\nimport { coffeeTheme } from './coffee';\nimport { cyberpunkTheme } from './cyberpunk';\nimport { darkTheme } from './dark';\nimport { festiveTheme } from './festive';\nimport { forestTheme } from './forest';\nimport { highContrastTheme } from './high-contrast';\nimport { lemonTheme } from './lemon';\nimport { lightTheme } from './light';\nimport { midnightTheme } from './midnight';\nimport { oceanTheme } from './ocean';\nimport { paperTheme } from './paper';\nimport { sakuraTheme } from './sakura';\nimport type { Lang } from '../lang/lang';\nimport type { Theme } from './theme';\n\n/** 全部内置主题，按亮色、暗色、纸张、午夜、高对比，再到各风格主题排列（ThemeSwitcher 按这个顺序列出） */\nexport const builtinThemes = {\n  light: lightTheme,\n  dark: darkTheme,\n  paper: paperTheme,\n  midnight: midnightTheme,\n  'high-contrast': highContrastTheme,\n  ocean: oceanTheme,\n  forest: forestTheme,\n  lemon: lemonTheme,\n  sakura: sakuraTheme,\n  festive: festiveTheme,\n  cyberpunk: cyberpunkTheme,\n  coffee: coffeeTheme,\n} as const satisfies Record<string, Theme>;\n\n/** 内置主题的名字 */\nexport type BuiltinThemeName = keyof typeof builtinThemes;\n\n/** 内置主题在当前语言下的名字：`builtinThemeLabel(lang, 'high-contrast')` → “高对比” */\nexport function builtinThemeLabel(lang: Lang, name: BuiltinThemeName): string {\n  const labels: Record<BuiltinThemeName, string> = {\n    light: lang.themeLight,\n    dark: lang.themeDark,\n    paper: lang.themePaper,\n    midnight: lang.themeMidnight,\n    'high-contrast': lang.themeHighContrast,\n    ocean: lang.themeOcean,\n    forest: lang.themeForest,\n    lemon: lang.themeLemon,\n    sakura: lang.themeSakura,\n    festive: lang.themeFestive,\n    cyberpunk: lang.themeCyberpunk,\n    coffee: lang.themeCoffee,\n  };\n  return labels[name];\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAyBA,IAAa,gBAAgB;CAC3B,OAAO;CACP,MAAM;CACN,OAAO;CACP,UAAU;CACV,iBAAiB;CACjB,OAAO;CACP,QAAQ;CACR,OAAO;CACP,QAAQ;CACR,SAAS;CACT,WAAW;CACX,QAAQ;AACV;;AAMA,SAAgB,kBAAkB,MAAY,MAAgC;CAe5E,OAAO;EAbL,OAAO,KAAK;EACZ,MAAM,KAAK;EACX,OAAO,KAAK;EACZ,UAAU,KAAK;EACf,iBAAiB,KAAK;EACtB,OAAO,KAAK;EACZ,QAAQ,KAAK;EACb,OAAO,KAAK;EACZ,QAAQ,KAAK;EACb,SAAS,KAAK;EACd,WAAW,KAAK;EAChB,QAAQ,KAAK;CAER,EAAO;AAChB"}

package/dist/config/theme/coffee.d.ts

@@ -0,0 +1,84 @@
+import * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';
+import type { Theme } from './theme';
+/**
+ * 咖啡主题的颜色：浓缩咖啡色的页面、焦糖色的品牌色 `#c8915a`（配深色字）、奶泡色的文字。中性色按 slate 暗色各级亮度换成暖棕色相（oklch 55°），品牌色取 Radix brown 色阶。
+ * 先按风格取色，再按对比度要求调深浅（pnpm themes:check 校验）
+ */
+export declare const coffeeColors: css.Theme<css.VarGroup<{
+    readonly background: "#fcfcfd";
+    readonly surface: "#fcfcfd";
+    readonly surfaceMuted: "#f9f9fb";
+    readonly surfaceRaised: "#fcfcfd";
+    readonly fill: "#f0f0f3";
+    readonly fillHover: "#e8e8ec";
+    readonly fillActive: "#e0e1e6";
+    readonly text: "#1c2024";
+    readonly textMuted: "#60646c";
+    readonly textPlaceholder: "#80838d";
+    readonly textDisabled: "#b9bbc6";
+    readonly borderMuted: "#d9d9e0";
+    readonly border: "#cdced6";
+    readonly borderStrong: "#b9bbc6";
+    readonly accent: "#3e63dd";
+    readonly accentHover: "#3358d4";
+    readonly accentContrast: "#ffffff";
+    readonly accentText: "#3a5bc7";
+    readonly accentSoft: "#edf2fe";
+    readonly accentSoftHover: "#e1e9ff";
+    readonly accentBorder: "#abbdf9";
+    readonly danger: "#ce2c31";
+    readonly dangerHover: "#b8272c";
+    readonly dangerContrast: "#ffffff";
+    readonly dangerText: "#b8272c";
+    readonly dangerSoft: "#feebec";
+    readonly dangerSoftHover: "#ffdbdc";
+    readonly dangerBorder: "#f4a9aa";
+    readonly successText: "#193b2d";
+    readonly successSoft: "#e6f6eb";
+    readonly successBorder: "#8eceaa";
+    readonly success: "#008751";
+    readonly successHover: "#007143";
+    readonly successContrast: "#ffffff";
+    readonly successSoftHover: "#d6f1df";
+    readonly warningText: "#4f3422";
+    readonly warningSoft: "#fff7c2";
+    readonly warningBorder: "#e9c162";
+    readonly warning: "#ffc53d";
+    readonly warningHover: "#ffcd5f";
+    readonly warningContrast: "#4f3422";
+    readonly warningSoftHover: "#ffee9c";
+    readonly infoText: "#113264";
+    readonly infoSoft: "#e6f4fe";
+    readonly infoBorder: "#8ec8f6";
+    readonly info: "#0073e0";
+    readonly infoHover: "#0060bd";
+    readonly infoContrast: "#ffffff";
+    readonly infoSoftHover: "#d5efff";
+    readonly inverseSurface: "#1c2024";
+    readonly inverseText: "#fcfcfd";
+    readonly focusRing: "#3e63dd";
+    readonly overlay: "rgba(0, 0, 0, 0.4)";
+    readonly selection: "#d2deff";
+    readonly highlight: "#ffee9c";
+    readonly surfaceTranslucent: "rgba(252, 252, 253, 0.8)";
+    readonly codeKeyword: "#3a5bc7";
+    readonly codeString: "#1c7a51";
+    readonly codeNumber: "#bb4500";
+    readonly codeFunction: "#6550b9";
+    readonly codeType: "#007590";
+    readonly codeComment: "#60646c";
+    readonly codeTag: "#cb1d63";
+    readonly codeAttribute: "#815e46";
+    readonly codeInserted: "#e6f6eb";
+    readonly codeDeleted: "#feebec";
+    readonly chart1: "#3e63dd";
+    readonly chart2: "#0d9b8a";
+    readonly chart3: "#ef5f00";
+    readonly chart4: "#e93d82";
+    readonly chart5: "#6e56cf";
+    readonly chart6: "#0797b9";
+    readonly chart7: "#3e9b4f";
+    readonly chart8: "#ab6400";
+}>>;
+/** 咖啡主题：浓缩咖啡底、焦糖品牌色、暖色的深阴影、衬线标题；浏览器配色按暗色 */
+export declare const coffeeTheme: Theme;

package/dist/config/theme/coffee.js

@@ -0,0 +1,102 @@
+import { colors } from "./tokens.js";
+import { defaultRadii } from "./light.js";
+import { darkShadows } from "./dark.js";
+import { paperFonts } from "./paper.js";
+import * as css from "@zerodep-dev/vue-tsx-pro-tsx/styles";
+//#region src/config/theme/coffee.ts
+/**
+* 咖啡主题的颜色：浓缩咖啡色的页面、焦糖色的品牌色 `#c8915a`（配深色字）、奶泡色的文字。中性色按 slate 暗色各级亮度换成暖棕色相（oklch 55°），品牌色取 Radix brown 色阶。
+* 先按风格取色，再按对比度要求调深浅（pnpm themes:check 校验）
+*/
+var coffeeColors = css.createTheme(colors, {
+	background: "#180f0a",
+	surface: "#201711",
+	surfaceMuted: "#201711",
+	surfaceRaised: "#201711",
+	fill: "#2c1f16",
+	fillHover: "#34261d",
+	fillActive: "#3b2d24",
+	text: "#ffe9dc",
+	textMuted: "#c4afa2",
+	textPlaceholder: "#8a776a",
+	textDisabled: "#6c5d52",
+	borderMuted: "#45362d",
+	border: "#53443a",
+	borderStrong: "#6c5d52",
+	accent: "#c8915a",
+	accentHover: "#cf9e6e",
+	accentContrast: "#180f0a",
+	accentText: "#e3b98c",
+	accentSoft: "#28211d",
+	accentSoftHover: "#322922",
+	accentBorder: "#614a39",
+	danger: "#b54548",
+	dangerHover: "#98393b",
+	dangerContrast: "#ffffff",
+	dangerText: "#ff9592",
+	dangerSoft: "#3b1219",
+	dangerSoftHover: "#500f1c",
+	dangerBorder: "#8c333a",
+	successText: "#3dd68c",
+	successSoft: "#132d21",
+	successBorder: "#28684a",
+	success: "#30a46c",
+	successHover: "#52af7d",
+	successContrast: "#180f0a",
+	successSoftHover: "#113b29",
+	warningText: "#ffca16",
+	warningSoft: "#302008",
+	warningBorder: "#714f19",
+	warning: "#ffc53d",
+	warningHover: "#ffcd5f",
+	warningContrast: "#180f0a",
+	warningSoftHover: "#3f2700",
+	infoText: "#70b8ff",
+	infoSoft: "#0d2847",
+	infoBorder: "#205d9e",
+	info: "#0090ff",
+	infoHover: "#3d9fff",
+	infoContrast: "#180f0a",
+	infoSoftHover: "#003362",
+	inverseSurface: "#ffe9dc",
+	inverseText: "#180f0a",
+	focusRing: "#c8915a",
+	overlay: "rgba(0, 0, 0, 0.6)",
+	selection: "#3e3128",
+	highlight: "#302008",
+	surfaceTranslucent: "rgba(24, 15, 10, 0.8)",
+	codeKeyword: "#e3b98c",
+	codeString: "#3dd68c",
+	codeNumber: "#ffa057",
+	codeFunction: "#baa7ff",
+	codeType: "#4ccce6",
+	codeComment: "#c4afa2",
+	codeTag: "#ff92ad",
+	codeAttribute: "#dbb594",
+	codeInserted: "#132d21",
+	codeDeleted: "#3b1219",
+	chart1: "#c8915a",
+	chart2: "#ffc53d",
+	chart3: "#f76b15",
+	chart4: "#a18072",
+	chart5: "#978365",
+	chart6: "#e54d2e",
+	chart7: "#46a758",
+	chart8: "#7ce2fe"
+});
+/** 咖啡主题：浓缩咖啡底、焦糖品牌色、暖色的深阴影、衬线标题；浏览器配色按暗色 */
+var coffeeTheme = {
+	name: "coffee",
+	colorScheme: "dark",
+	styles: [
+		coffeeColors,
+		darkShadows,
+		paperFonts,
+		defaultRadii
+	],
+	overrides: {}
+};
+//#endregion
+export { coffeeColors, coffeeTheme };
+
+//# sourceMappingURL=coffee.js.map

package/dist/config/theme/coffee.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"coffee.js","names":[],"sources":["../../../src/config/theme/coffee.ts"],"sourcesContent":["import * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { darkShadows } from './dark';\nimport { paperFonts } from './paper';\nimport { defaultRadii } from './light';\nimport type { Theme } from './theme';\nimport { colors } from './tokens';\n\n/**\n * 咖啡主题的颜色：浓缩咖啡色的页面、焦糖色的品牌色 `#c8915a`（配深色字）、奶泡色的文字。中性色按 slate 暗色各级亮度换成暖棕色相（oklch 55°），品牌色取 Radix brown 色阶。\n * 先按风格取色，再按对比度要求调深浅（pnpm themes:check 校验）\n */\nexport const coffeeColors = css.createTheme(colors, {\n  background: '#180f0a',\n  surface: '#201711',\n  surfaceMuted: '#201711',\n  surfaceRaised: '#201711',\n  fill: '#2c1f16',\n  fillHover: '#34261d',\n  fillActive: '#3b2d24',\n  text: '#ffe9dc',\n  textMuted: '#c4afa2',\n  textPlaceholder: '#8a776a',\n  textDisabled: '#6c5d52',\n  borderMuted: '#45362d',\n  border: '#53443a',\n  borderStrong: '#6c5d52',\n  accent: '#c8915a',\n  accentHover: '#cf9e6e',\n  accentContrast: '#180f0a',\n  accentText: '#e3b98c',\n  accentSoft: '#28211d',\n  accentSoftHover: '#322922',\n  accentBorder: '#614a39',\n  danger: '#b54548',\n  dangerHover: '#98393b',\n  dangerContrast: '#ffffff',\n  dangerText: '#ff9592',\n  dangerSoft: '#3b1219',\n  dangerSoftHover: '#500f1c',\n  dangerBorder: '#8c333a',\n  successText: '#3dd68c',\n  successSoft: '#132d21',\n  successBorder: '#28684a',\n  success: '#30a46c',\n  successHover: '#52af7d',\n  successContrast: '#180f0a',\n  successSoftHover: '#113b29',\n  warningText: '#ffca16',\n  warningSoft: '#302008',\n  warningBorder: '#714f19',\n  warning: '#ffc53d',\n  warningHover: '#ffcd5f',\n  warningContrast: '#180f0a',\n  warningSoftHover: '#3f2700',\n  infoText: '#70b8ff',\n  infoSoft: '#0d2847',\n  infoBorder: '#205d9e',\n  info: '#0090ff',\n  infoHover: '#3d9fff',\n  infoContrast: '#180f0a',\n  infoSoftHover: '#003362',\n  inverseSurface: '#ffe9dc',\n  inverseText: '#180f0a',\n  focusRing: '#c8915a',\n  overlay: 'rgba(0, 0, 0, 0.6)',\n  selection: '#3e3128',\n  highlight: '#302008',\n  surfaceTranslucent: 'rgba(24, 15, 10, 0.8)',\n  codeKeyword: '#e3b98c',\n  codeString: '#3dd68c',\n  codeNumber: '#ffa057',\n  codeFunction: '#baa7ff',\n  codeType: '#4ccce6',\n  codeComment: '#c4afa2',\n  codeTag: '#ff92ad',\n  codeAttribute: '#dbb594',\n  codeInserted: '#132d21',\n  codeDeleted: '#3b1219',\n  chart1: '#c8915a',\n  chart2: '#ffc53d',\n  chart3: '#f76b15',\n  chart4: '#a18072',\n  chart5: '#978365',\n  chart6: '#e54d2e',\n  chart7: '#46a758',\n  chart8: '#7ce2fe',\n});\n\n/** 咖啡主题：浓缩咖啡底、焦糖品牌色、暖色的深阴影、衬线标题；浏览器配色按暗色 */\nexport const coffeeTheme: Theme = {\n  name: 'coffee',\n  colorScheme: 'dark',\n  styles: [coffeeColors, darkShadows, paperFonts, defaultRadii],\n  overrides: {},\n};\n"],"mappings":";;;;;;;;;;AAWA,IAAa,eAAe,IAAI,YAAY,QAAQ;CAClD,YAAY;CACZ,SAAS;CACT,cAAc;CACd,eAAe;CACf,MAAM;CACN,WAAW;CACX,YAAY;CACZ,MAAM;CACN,WAAW;CACX,iBAAiB;CACjB,cAAc;CACd,aAAa;CACb,QAAQ;CACR,cAAc;CACd,QAAQ;CACR,aAAa;CACb,gBAAgB;CAChB,YAAY;CACZ,YAAY;CACZ,iBAAiB;CACjB,cAAc;CACd,QAAQ;CACR,aAAa;CACb,gBAAgB;CAChB,YAAY;CACZ,YAAY;CACZ,iBAAiB;CACjB,cAAc;CACd,aAAa;CACb,aAAa;CACb,eAAe;CACf,SAAS;CACT,cAAc;CACd,iBAAiB;CACjB,kBAAkB;CAClB,aAAa;CACb,aAAa;CACb,eAAe;CACf,SAAS;CACT,cAAc;CACd,iBAAiB;CACjB,kBAAkB;CAClB,UAAU;CACV,UAAU;CACV,YAAY;CACZ,MAAM;CACN,WAAW;CACX,cAAc;CACd,eAAe;CACf,gBAAgB;CAChB,aAAa;CACb,WAAW;CACX,SAAS;CACT,WAAW;CACX,WAAW;CACX,oBAAoB;CACpB,aAAa;CACb,YAAY;CACZ,YAAY;CACZ,cAAc;CACd,UAAU;CACV,aAAa;CACb,SAAS;CACT,eAAe;CACf,cAAc;CACd,aAAa;CACb,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;AACV,CAAC;;AAGD,IAAa,cAAqB;CAChC,MAAM;CACN,aAAa;CACb,QAAQ;EAAC;EAAc;EAAa;EAAY;CAAY;CAC5D,WAAW,CAAC;AACd"}

package/dist/config/theme/cyberpunk.d.ts

@@ -0,0 +1,110 @@
+import * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';
+import type { Theme } from './theme';
+/**
+ * 赛博朋克主题的颜色：深紫黑的页面、霓虹品红的品牌色 `#ff2bd6`（配深色字）、霓虹青的焦点环与信息色。中性色按 slate 暗色各级亮度换成紫色相（oklch 290°）并加大色度；图表与代码高亮用荧光色。
+ * 先按风格取色，再按对比度要求调深浅（pnpm themes:check 校验）
+ */
+export declare const cyberpunkColors: css.Theme<css.VarGroup<{
+    readonly background: "#fcfcfd";
+    readonly surface: "#fcfcfd";
+    readonly surfaceMuted: "#f9f9fb";
+    readonly surfaceRaised: "#fcfcfd";
+    readonly fill: "#f0f0f3";
+    readonly fillHover: "#e8e8ec";
+    readonly fillActive: "#e0e1e6";
+    readonly text: "#1c2024";
+    readonly textMuted: "#60646c";
+    readonly textPlaceholder: "#80838d";
+    readonly textDisabled: "#b9bbc6";
+    readonly borderMuted: "#d9d9e0";
+    readonly border: "#cdced6";
+    readonly borderStrong: "#b9bbc6";
+    readonly accent: "#3e63dd";
+    readonly accentHover: "#3358d4";
+    readonly accentContrast: "#ffffff";
+    readonly accentText: "#3a5bc7";
+    readonly accentSoft: "#edf2fe";
+    readonly accentSoftHover: "#e1e9ff";
+    readonly accentBorder: "#abbdf9";
+    readonly danger: "#ce2c31";
+    readonly dangerHover: "#b8272c";
+    readonly dangerContrast: "#ffffff";
+    readonly dangerText: "#b8272c";
+    readonly dangerSoft: "#feebec";
+    readonly dangerSoftHover: "#ffdbdc";
+    readonly dangerBorder: "#f4a9aa";
+    readonly successText: "#193b2d";
+    readonly successSoft: "#e6f6eb";
+    readonly successBorder: "#8eceaa";
+    readonly success: "#008751";
+    readonly successHover: "#007143";
+    readonly successContrast: "#ffffff";
+    readonly successSoftHover: "#d6f1df";
+    readonly warningText: "#4f3422";
+    readonly warningSoft: "#fff7c2";
+    readonly warningBorder: "#e9c162";
+    readonly warning: "#ffc53d";
+    readonly warningHover: "#ffcd5f";
+    readonly warningContrast: "#4f3422";
+    readonly warningSoftHover: "#ffee9c";
+    readonly infoText: "#113264";
+    readonly infoSoft: "#e6f4fe";
+    readonly infoBorder: "#8ec8f6";
+    readonly info: "#0073e0";
+    readonly infoHover: "#0060bd";
+    readonly infoContrast: "#ffffff";
+    readonly infoSoftHover: "#d5efff";
+    readonly inverseSurface: "#1c2024";
+    readonly inverseText: "#fcfcfd";
+    readonly focusRing: "#3e63dd";
+    readonly overlay: "rgba(0, 0, 0, 0.4)";
+    readonly selection: "#d2deff";
+    readonly highlight: "#ffee9c";
+    readonly surfaceTranslucent: "rgba(252, 252, 253, 0.8)";
+    readonly codeKeyword: "#3a5bc7";
+    readonly codeString: "#1c7a51";
+    readonly codeNumber: "#bb4500";
+    readonly codeFunction: "#6550b9";
+    readonly codeType: "#007590";
+    readonly codeComment: "#60646c";
+    readonly codeTag: "#cb1d63";
+    readonly codeAttribute: "#815e46";
+    readonly codeInserted: "#e6f6eb";
+    readonly codeDeleted: "#feebec";
+    readonly chart1: "#3e63dd";
+    readonly chart2: "#0d9b8a";
+    readonly chart3: "#ef5f00";
+    readonly chart4: "#e93d82";
+    readonly chart5: "#6e56cf";
+    readonly chart6: "#0797b9";
+    readonly chart7: "#3e9b4f";
+    readonly chart8: "#ab6400";
+}>>;
+/** 赛博朋克主题的阴影：一圈霓虹光晕加深色投影，浮层像在发光 */
+export declare const cyberpunkShadows: css.Theme<css.VarGroup<{
+    readonly none: "none";
+    readonly xs: "0 1px 1px 0 #00005506, 0 2px 1px -1px rgba(0, 0, 0, 0.05), 0 1px 3px 0 rgba(0, 0, 0, 0.05)";
+    readonly sm: "0 2px 3px -2px #0000330f, 0 3px 12px -4px rgba(0, 0, 0, 0.1), 0 4px 16px -8px rgba(0, 0, 0, 0.1)";
+    readonly md: "0 8px 40px rgba(0, 0, 0, 0.05), 0 12px 32px -16px #0000330f";
+    readonly lg: "0 12px 60px rgba(0, 0, 0, 0.15), 0 12px 32px -16px #0009321f";
+    readonly xl: "0 12px 60px rgba(0, 0, 0, 0.15), 0 16px 64px #00005506, 0 16px 36px -20px #00062e32";
+}>>;
+/** 赛博朋克主题的字体：标题用等宽字体，像终端与仪表盘；写全每个变量（嵌套在别的主题里时不继承外层的），正文、等宽、衬线与默认相同 */
+export declare const cyberpunkFonts: css.Theme<css.VarGroup<{
+    readonly sans: "system-ui, -apple-system, \"Segoe UI\", \"PingFang SC\", \"Hiragino Sans GB\", \"Microsoft YaHei UI\", \"Microsoft YaHei\", \"Noto Sans SC\", \"Source Han Sans SC\", sans-serif";
+    readonly mono: "ui-monospace, \"Cascadia Code\", \"JetBrains Mono\", \"SFMono-Regular\", Consolas, \"Liberation Mono\", monospace";
+    readonly serif: "\"Noto Serif SC\", \"Source Han Serif SC\", \"Songti SC\", STSong, \"SimSun\", Georgia, serif";
+    readonly heading: "system-ui, -apple-system, \"Segoe UI\", \"PingFang SC\", \"Hiragino Sans GB\", \"Microsoft YaHei UI\", \"Microsoft YaHei\", \"Noto Sans SC\", \"Source Han Sans SC\", sans-serif";
+}>>;
+/** 赛博朋克主题的圆角：几乎是直角，线条硬朗 */
+export declare const cyberpunkRadii: css.Theme<css.VarGroup<{
+    readonly none: "0";
+    readonly xs: "0.15em";
+    readonly sm: "0.25em";
+    readonly md: "0.4em";
+    readonly lg: "0.7em";
+    readonly xl: "1em";
+    readonly full: "9999px";
+}>>;
+/** 赛博朋克主题：深紫黑底、霓虹品红与青色、发光的阴影、近乎直角、等宽字体的标题；浏览器配色按暗色 */
+export declare const cyberpunkTheme: Theme;