@veltra/styles 1.7.3 → 1.7.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -58,6 +58,19 @@ const componentCssVarsLight = {
|
|
|
58
58
|
"--u-tree-node-selected-color": T("color", "primary"),
|
|
59
59
|
"--u-cascade-node-active-bg": T("color", "primary", "light", "9"),
|
|
60
60
|
"--u-cascade-node-active-color": T("color", "primary"),
|
|
61
|
+
"--u-select-option-hover-bg": T("bg-color", "hover"),
|
|
62
|
+
"--u-select-option-hover-color": T("text-color", "title"),
|
|
63
|
+
"--u-select-option-selected-bg": T("color", "primary", "light", "9"),
|
|
64
|
+
"--u-select-option-selected-color": T("color", "primary"),
|
|
65
|
+
"--u-auto-complete-option-hover-bg": T("bg-color", "hover"),
|
|
66
|
+
"--u-auto-complete-option-hover-color": T("text-color", "title"),
|
|
67
|
+
"--u-auto-complete-option-selected-bg": T("color", "primary", "light", "9"),
|
|
68
|
+
"--u-auto-complete-option-selected-color": T("color", "primary"),
|
|
69
|
+
"--u-contextmenu-item-hover-bg": T("bg-color", "hover"),
|
|
70
|
+
"--u-contextmenu-item-hover-color": T("text-color", "title"),
|
|
71
|
+
"--u-contextmenu-item-height-small": "24px",
|
|
72
|
+
"--u-contextmenu-item-height-default": "28px",
|
|
73
|
+
"--u-contextmenu-item-height-large": "32px",
|
|
61
74
|
"--u-expression-editor-chip-bg": T("color", "primary", "light", "9"),
|
|
62
75
|
"--u-expression-editor-chip-color": T("color", "primary"),
|
|
63
76
|
"--u-paginator-btn-hover-bg": T("color", "primary", "light", "9"),
|
|
@@ -120,6 +133,19 @@ const componentCssVarsDark = {
|
|
|
120
133
|
"--u-tree-node-selected-color": T("color", "primary"),
|
|
121
134
|
"--u-cascade-node-active-bg": T("color", "primary", "dark", "9"),
|
|
122
135
|
"--u-cascade-node-active-color": T("color", "primary"),
|
|
136
|
+
"--u-select-option-hover-bg": T("bg-color", "hover"),
|
|
137
|
+
"--u-select-option-hover-color": T("text-color", "title"),
|
|
138
|
+
"--u-select-option-selected-bg": T("color", "primary", "dark", "9"),
|
|
139
|
+
"--u-select-option-selected-color": T("color", "primary"),
|
|
140
|
+
"--u-auto-complete-option-hover-bg": T("bg-color", "hover"),
|
|
141
|
+
"--u-auto-complete-option-hover-color": T("text-color", "title"),
|
|
142
|
+
"--u-auto-complete-option-selected-bg": T("color", "primary", "dark", "9"),
|
|
143
|
+
"--u-auto-complete-option-selected-color": T("color", "primary"),
|
|
144
|
+
"--u-contextmenu-item-hover-bg": T("bg-color", "hover"),
|
|
145
|
+
"--u-contextmenu-item-hover-color": T("text-color", "title"),
|
|
146
|
+
"--u-contextmenu-item-height-small": "24px",
|
|
147
|
+
"--u-contextmenu-item-height-default": "28px",
|
|
148
|
+
"--u-contextmenu-item-height-large": "32px",
|
|
123
149
|
"--u-expression-editor-chip-bg": T("color", "primary", "dark", "9"),
|
|
124
150
|
"--u-expression-editor-chip-color": T("color", "primary"),
|
|
125
151
|
"--u-paginator-btn-hover-bg": T("color", "primary", "dark", "9"),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"component-css-vars.js","names":[],"sources":["../../src/theme/component-css-vars.ts"],"sourcesContent":["/**\n * 桌面组件级 `--u-*` token，随 `UITheme.render()` 按主题系列（light/dark）注入 `html`。\n * 修改此处即可在 TS 侧统一调整组件外观，无需在各组件 `style.scss` 重复声明。\n * nav 系列：外观（底色/前景）不在此列表，由 `navSidebarCssVars` 按主题 `nav.variant`\n * （dark 深底浅字 / light 浅底深字，默认 dark）与 `nav` 覆盖项注入，见 `ui-theme.ts`。\n */\n\n/** 与 SCSS `fn.use-var($basename, $nodes...)` 输出一致 */\nexport function themeTokenVar(basename: string, ...nodes: Array<string | number>): string {\n const suffix = nodes.length ? `-${nodes.map(String).join('-')}` : ''\n return `var(--u-${basename}${suffix})`\n}\n\nconst T = themeTokenVar\n\n/** 亮色（及与暗色相同的尺寸类）下组件 token */\nexport const componentCssVarsLight: Record<string, string> = {\n '--u-focus-ring': `0 0 0 3px ${T('color', 'primary', 'a', '28')}`,\n '--u-table-border-color': T('border', 'color'),\n '--u-table-header-bg': T('bg-color', 'hover'),\n '--u-table-header-color': T('text-color', 'title'),\n '--u-table-stripe-bg': T('bg-color', 'middle'),\n '--u-table-stripe-color': 'inherit',\n '--u-table-hover-bg': T('bg-color', 'hover'),\n '--u-table-hover-color': 'inherit',\n '--u-table-current-bg': T('bg-color', 'hover'),\n '--u-table-current-color': 'inherit',\n '--u-table-checked-bg': T('color', 'primary', 'light-9'),\n '--u-table-checked-color': 'inherit',\n // ─── Nav 系列（nav / dual-nav / group-nav）尺寸与资源类；外观见文件底部 navSidebarCssVars ───\n '--u-nav-height-small': '32px',\n '--u-nav-height-default': '36px',\n '--u-nav-height-large': '40px',\n '--u-nav-bg-image': 'none',\n '--u-nav-rail-width': '56px',\n '--u-nav-rail-labeled-width': '72px',\n '--u-tag-small': '20px',\n '--u-tag-default': '24px',\n '--u-tag-large': '28px',\n '--u-switch-height-small': '18px',\n '--u-switch-height-default': '20px',\n '--u-switch-height-large': '24px',\n '--u-breadcrumb-small': '20px',\n '--u-breadcrumb-default': '22px',\n '--u-breadcrumb-large': '24px',\n\n // ─── Button (default & plain states) ───\n '--u-button-default-bg': T('bg-color', 'top'),\n '--u-button-default-border': T('border', 'color'),\n '--u-button-default-color': T('text-color', 'main'),\n '--u-button-default-hover-bg': T('bg-color', 'hover'),\n '--u-button-default-hover-border': T('border', 'color'),\n '--u-button-primary-plain-bg': T('color', 'primary', 'light', '9'),\n '--u-button-primary-plain-shadow': T('color', 'primary', 'light', '5'),\n '--u-button-success-plain-bg': T('color', 'success', 'light', '9'),\n '--u-button-success-plain-shadow': T('color', 'success', 'light', '5'),\n '--u-button-warning-plain-bg': T('color', 'warning', 'light', '9'),\n '--u-button-warning-plain-shadow': T('color', 'warning', 'light', '5'),\n '--u-button-danger-plain-bg': T('color', 'danger', 'light', '9'),\n '--u-button-danger-plain-shadow': T('color', 'danger', 'light', '5'),\n '--u-button-info-plain-bg': T('color', 'info', 'light', '9'),\n '--u-button-info-plain-shadow': T('color', 'info', 'light', '5'),\n\n // ─── Tree selection ───\n '--u-tree-node-selected-bg': T('color', 'primary', 'light', '9'),\n '--u-tree-node-selected-color': T('color', 'primary'),\n\n // ─── Cascade option active ───\n '--u-cascade-node-active-bg': T('color', 'primary', 'light', '9'),\n '--u-cascade-node-active-color': T('color', 'primary'),\n\n // ─── Expression Editor Chip ───\n '--u-expression-editor-chip-bg': T('color', 'primary', 'light', '9'),\n '--u-expression-editor-chip-color': T('color', 'primary'),\n\n // ─── Paginator active buttons ───\n '--u-paginator-btn-hover-bg': T('color', 'primary', 'light', '9'),\n '--u-paginator-btn-hover-color': T('text-color', 'title'),\n '--u-paginator-btn-active-bg': T('color', 'primary', 'light', '9'),\n '--u-paginator-btn-active-color': T('color', 'primary'),\n\n // ─── Tabs List background ───\n '--u-tabs-bar-bg': T('bg-color', 'hover'),\n '--u-tabs-active-bg': T('bg-color', 'top'),\n\n // ─── Tag Component Colors ───\n '--u-tag-primary-bg': T('color', 'primary', 'light', '9'),\n '--u-tag-primary-color': T('color', 'primary'),\n '--u-tag-primary-border': T('color', 'primary'),\n '--u-tag-success-bg': T('color', 'success', 'light', '9'),\n '--u-tag-success-color': T('color', 'success'),\n '--u-tag-success-border': T('color', 'success'),\n '--u-tag-warning-bg': T('color', 'warning', 'light', '9'),\n '--u-tag-warning-color': T('color', 'warning'),\n '--u-tag-warning-border': T('color', 'warning'),\n '--u-tag-danger-bg': T('color', 'danger', 'light', '9'),\n '--u-tag-danger-color': T('color', 'danger'),\n '--u-tag-danger-border': T('color', 'danger'),\n '--u-tag-info-bg': T('color', 'info', 'light', '9'),\n '--u-tag-info-color': T('color', 'info'),\n '--u-tag-info-border': T('color', 'info'),\n\n // ─── File Picker Colors ───\n '--u-file-picker-hover-bg': T('color', 'primary', 'light', '9'),\n '--u-card-header-bg': 'rgba(0, 0, 0, 0.015)',\n '--u-card-action-bg': 'rgba(0, 0, 0, 0.015)',\n '--u-card-padding-small': '8px',\n '--u-card-padding-default': '12px',\n '--u-card-padding-large': '16px',\n '--u-card-radius': T('radius', 'large')\n}\n\n/** 暗色下组件 token（含与亮色相同的尺寸项，保证暗色 html 块自洽） */\nexport const componentCssVarsDark: Record<string, string> = {\n ...componentCssVarsLight,\n '--u-focus-ring': `0 0 0 3px ${T('color', 'primary', 'a', '35')}`,\n '--u-table-border-color': T('border', 'color'),\n '--u-table-header-bg': T('bg-color', 'hover'),\n '--u-table-header-color': T('text-color', 'main'),\n '--u-table-stripe-bg': T('bg-color', 'middle'),\n '--u-table-stripe-color': T('text-color', 'main'),\n '--u-table-hover-bg': T('text-color', 'title', 'a', '5'),\n '--u-table-hover-color': T('text-color', 'title'),\n '--u-table-current-bg': T('bg-color', 'hover'),\n '--u-table-current-color': 'inherit',\n '--u-table-checked-bg': T('color', 'primary', 'dark', '1'),\n '--u-table-checked-color': 'inherit',\n '--u-radio-border': '#595959',\n '--u-checkbox-border': '#595959',\n\n // ─── Button (plain & text colors in dark mode) ───\n '--u-button-primary-plain-bg': T('color', 'primary', 'dark', '9'),\n '--u-button-primary-plain-shadow': T('color', 'primary', 'dark', '7'),\n '--u-button-success-plain-bg': T('color', 'success', 'dark', '9'),\n '--u-button-success-plain-shadow': T('color', 'success', 'dark', '7'),\n '--u-button-warning-plain-bg': T('color', 'warning', 'dark', '9'),\n '--u-button-warning-plain-shadow': T('color', 'warning', 'dark', '7'),\n '--u-button-danger-plain-bg': T('color', 'danger', 'dark', '9'),\n '--u-button-danger-plain-shadow': T('color', 'danger', 'dark', '7'),\n '--u-button-info-plain-bg': T('color', 'info', 'dark', '9'),\n '--u-button-info-plain-shadow': T('color', 'info', 'dark', '7'),\n\n // ─── Tree selection ───\n '--u-tree-node-selected-bg': T('color', 'primary', 'dark', '9'),\n '--u-tree-node-selected-color': T('color', 'primary'),\n\n // ─── Cascade option active ───\n '--u-cascade-node-active-bg': T('color', 'primary', 'dark', '9'),\n '--u-cascade-node-active-color': T('color', 'primary'),\n\n // ─── Expression Editor Chip ───\n '--u-expression-editor-chip-bg': T('color', 'primary', 'dark', '9'),\n '--u-expression-editor-chip-color': T('color', 'primary'),\n\n // ─── Paginator active buttons ───\n '--u-paginator-btn-hover-bg': T('color', 'primary', 'dark', '9'),\n '--u-paginator-btn-hover-color': T('color', 'primary'),\n '--u-paginator-btn-active-bg': T('color', 'primary', 'dark', '9'),\n '--u-paginator-btn-active-color': T('color', 'primary'),\n\n // ─── Tabs List background (improved dark contrast) ───\n '--u-tabs-bar-bg': T('bg-color', 'bottom'),\n '--u-tabs-active-bg': T('bg-color', 'top'),\n\n // ─── Tag Component Colors ───\n '--u-tag-primary-bg': T('color', 'primary', 'dark', '9'),\n '--u-tag-primary-color': T('color', 'primary'),\n '--u-tag-primary-border': T('color', 'primary'),\n '--u-tag-success-bg': T('color', 'success', 'dark', '9'),\n '--u-tag-success-color': T('color', 'success'),\n '--u-tag-success-border': T('color', 'success'),\n '--u-tag-warning-bg': T('color', 'warning', 'dark', '9'),\n '--u-tag-warning-color': T('color', 'warning'),\n '--u-tag-warning-border': T('color', 'warning'),\n '--u-tag-danger-bg': T('color', 'danger', 'dark', '9'),\n '--u-tag-danger-color': T('color', 'danger'),\n '--u-tag-danger-border': T('color', 'danger'),\n '--u-tag-info-bg': T('color', 'info', 'dark', '9'),\n '--u-tag-info-color': T('color', 'info'),\n '--u-tag-info-border': T('color', 'info'),\n\n // ─── File Picker Colors ───\n '--u-file-picker-hover-bg': T('color', 'primary', 'dark', '9'),\n '--u-card-header-bg': 'rgba(255, 255, 255, 0.015)',\n '--u-card-action-bg': 'rgba(255, 255, 255, 0.015)'\n}\n\nfunction recordToDeclList(record: Record<string, string>): string[] {\n return Object.entries(record).map(([k, v]) => `${k}: ${v}`)\n}\n\nexport const componentCssVarsLightDecls: string[] = recordToDeclList(componentCssVarsLight)\n\nexport const componentCssVarsDarkDecls: string[] = recordToDeclList(componentCssVarsDark)\n\n// ─── Nav 侧栏外观：深/浅变体 × 明/暗主题系列 ───\n// 由 UITheme 按主题 `nav.variant`（默认 dark）选择注入，主题 `nav` 的其余键可逐项覆盖。\n\n/** 侧栏外观变体：dark 深底浅字 / light 浅底深字 */\nexport type NavSidebarVariant = 'dark' | 'light'\n\n/** 深侧栏 · 浅色主题下：深底（text-color.title）+ 浅前景，与浅色内容区拉开区分度 */\nconst navSidebarDarkInLight: Record<string, string> = {\n '--u-nav-bg-color': T('text-color', 'title'),\n '--u-nav-color': 'rgba(255, 255, 255, 0.72)',\n '--u-nav-hover-bg': 'rgba(255, 255, 255, 0.08)',\n '--u-nav-hover-color': T('text-color', 'white'),\n '--u-nav-active-bg': T('color', 'primary', 'a', '22'),\n '--u-nav-active-color': T('text-color', 'white'),\n '--u-nav-strong-color': T('text-color', 'white'),\n '--u-nav-second-color': 'rgba(255, 255, 255, 0.45)',\n '--u-nav-sub-border-color': 'rgba(255, 255, 255, 0.15)',\n '--u-nav-rail-bg': 'rgba(0, 0, 0, 0.2)'\n}\n\n/** 浅侧栏 · 浅色主题下：比内容区 top 低一档的浅底 + 深前景 */\nconst navSidebarLightInLight: Record<string, string> = {\n '--u-nav-bg-color': T('bg-color', 'middle'),\n '--u-nav-color': T('text-color', 'title'),\n '--u-nav-hover-bg': T('text-color', 'title', 'a', '8'),\n '--u-nav-hover-color': T('text-color', 'title'),\n '--u-nav-active-bg': T('color', 'primary', 'a', '10'),\n '--u-nav-active-color': T('color', 'primary', 'dark', '1'),\n '--u-nav-strong-color': T('text-color', 'title'),\n '--u-nav-second-color': T('text-color', 'second'),\n '--u-nav-sub-border-color': T('border', 'color', 'a', '52'),\n '--u-nav-rail-bg': T('bg-color', 'bottom')\n}\n\n/** 深侧栏 · 深色主题下：比内容区 top 深一档 */\nconst navSidebarDarkInDark: Record<string, string> = {\n '--u-nav-bg-color': T('bg-color', 'middle'),\n '--u-nav-color': T('text-color', 'main'),\n '--u-nav-hover-bg': T('text-color', 'title', 'a', '8'),\n '--u-nav-hover-color': T('text-color', 'title'),\n '--u-nav-active-bg': T('color', 'primary', 'a', '16'),\n '--u-nav-active-color': T('text-color', 'white'),\n '--u-nav-strong-color': T('text-color', 'title'),\n '--u-nav-second-color': T('text-color', 'second'),\n '--u-nav-sub-border-color': T('border', 'color', 'a', '52'),\n '--u-nav-rail-bg': T('bg-color', 'bottom')\n}\n\n/** 浅侧栏 · 深色主题下：提亮侧栏（与深色内容区反向对比） */\nconst navSidebarLightInDark: Record<string, string> = {\n '--u-nav-bg-color': T('bg-color', 'top'),\n '--u-nav-color': T('text-color', 'title'),\n '--u-nav-hover-bg': T('text-color', 'title', 'a', '8'),\n '--u-nav-hover-color': T('text-color', 'title'),\n '--u-nav-active-bg': T('color', 'primary', 'a', '22'),\n '--u-nav-active-color': T('color', 'primary'),\n '--u-nav-strong-color': T('text-color', 'title'),\n '--u-nav-second-color': T('text-color', 'second'),\n '--u-nav-sub-border-color': T('border', 'color', 'a', '52'),\n '--u-nav-rail-bg': T('bg-color', 'middle')\n}\n\nconst navSidebarCssVars: Record<\n 'light' | 'dark',\n Record<NavSidebarVariant, Record<string, string>>\n> = {\n light: { dark: navSidebarDarkInLight, light: navSidebarLightInLight },\n dark: { dark: navSidebarDarkInDark, light: navSidebarLightInDark }\n}\n\n/** 某主题系列 + 侧栏变体下的 nav 外观 token（键为 `--u-nav-*`） */\nexport function navSidebarTokens(\n series: 'light' | 'dark',\n variant: NavSidebarVariant\n): Record<string, string> {\n return { ...navSidebarCssVars[series][variant] }\n}\n\n/** 解析某主题系列 + 侧栏变体下的 nav 外观 token 声明列表 */\nexport function resolveNavSidebarDecls(\n series: 'light' | 'dark',\n variant: NavSidebarVariant\n): string[] {\n return recordToDeclList(navSidebarCssVars[series][variant])\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"component-css-vars.js","names":[],"sources":["../../src/theme/component-css-vars.ts"],"sourcesContent":["/**\n * 桌面组件级 `--u-*` token，随 `UITheme.render()` 按主题系列（light/dark）注入 `html`。\n * 修改此处即可在 TS 侧统一调整组件外观，无需在各组件 `style.scss` 重复声明。\n * nav 系列：外观（底色/前景）不在此列表，由 `navSidebarCssVars` 按主题 `nav.variant`\n * （dark 深底浅字 / light 浅底深字，默认 dark）与 `nav` 覆盖项注入，见 `ui-theme.ts`。\n */\n\n/** 与 SCSS `fn.use-var($basename, $nodes...)` 输出一致 */\nexport function themeTokenVar(basename: string, ...nodes: Array<string | number>): string {\n const suffix = nodes.length ? `-${nodes.map(String).join('-')}` : ''\n return `var(--u-${basename}${suffix})`\n}\n\nconst T = themeTokenVar\n\n/** 亮色（及与暗色相同的尺寸类）下组件 token */\nexport const componentCssVarsLight: Record<string, string> = {\n '--u-focus-ring': `0 0 0 3px ${T('color', 'primary', 'a', '28')}`,\n '--u-table-border-color': T('border', 'color'),\n '--u-table-header-bg': T('bg-color', 'hover'),\n '--u-table-header-color': T('text-color', 'title'),\n '--u-table-stripe-bg': T('bg-color', 'middle'),\n '--u-table-stripe-color': 'inherit',\n '--u-table-hover-bg': T('bg-color', 'hover'),\n '--u-table-hover-color': 'inherit',\n '--u-table-current-bg': T('bg-color', 'hover'),\n '--u-table-current-color': 'inherit',\n '--u-table-checked-bg': T('color', 'primary', 'light-9'),\n '--u-table-checked-color': 'inherit',\n // ─── Nav 系列（nav / dual-nav / group-nav）尺寸与资源类；外观见文件底部 navSidebarCssVars ───\n '--u-nav-height-small': '32px',\n '--u-nav-height-default': '36px',\n '--u-nav-height-large': '40px',\n '--u-nav-bg-image': 'none',\n '--u-nav-rail-width': '56px',\n '--u-nav-rail-labeled-width': '72px',\n '--u-tag-small': '20px',\n '--u-tag-default': '24px',\n '--u-tag-large': '28px',\n '--u-switch-height-small': '18px',\n '--u-switch-height-default': '20px',\n '--u-switch-height-large': '24px',\n '--u-breadcrumb-small': '20px',\n '--u-breadcrumb-default': '22px',\n '--u-breadcrumb-large': '24px',\n\n // ─── Button (default & plain states) ───\n '--u-button-default-bg': T('bg-color', 'top'),\n '--u-button-default-border': T('border', 'color'),\n '--u-button-default-color': T('text-color', 'main'),\n '--u-button-default-hover-bg': T('bg-color', 'hover'),\n '--u-button-default-hover-border': T('border', 'color'),\n '--u-button-primary-plain-bg': T('color', 'primary', 'light', '9'),\n '--u-button-primary-plain-shadow': T('color', 'primary', 'light', '5'),\n '--u-button-success-plain-bg': T('color', 'success', 'light', '9'),\n '--u-button-success-plain-shadow': T('color', 'success', 'light', '5'),\n '--u-button-warning-plain-bg': T('color', 'warning', 'light', '9'),\n '--u-button-warning-plain-shadow': T('color', 'warning', 'light', '5'),\n '--u-button-danger-plain-bg': T('color', 'danger', 'light', '9'),\n '--u-button-danger-plain-shadow': T('color', 'danger', 'light', '5'),\n '--u-button-info-plain-bg': T('color', 'info', 'light', '9'),\n '--u-button-info-plain-shadow': T('color', 'info', 'light', '5'),\n\n // ─── Tree selection ───\n '--u-tree-node-selected-bg': T('color', 'primary', 'light', '9'),\n '--u-tree-node-selected-color': T('color', 'primary'),\n\n // ─── Cascade option active ───\n '--u-cascade-node-active-bg': T('color', 'primary', 'light', '9'),\n '--u-cascade-node-active-color': T('color', 'primary'),\n\n // ─── Select option ───\n '--u-select-option-hover-bg': T('bg-color', 'hover'),\n '--u-select-option-hover-color': T('text-color', 'title'),\n '--u-select-option-selected-bg': T('color', 'primary', 'light', '9'),\n '--u-select-option-selected-color': T('color', 'primary'),\n\n // ─── Auto Complete option ───\n '--u-auto-complete-option-hover-bg': T('bg-color', 'hover'),\n '--u-auto-complete-option-hover-color': T('text-color', 'title'),\n '--u-auto-complete-option-selected-bg': T('color', 'primary', 'light', '9'),\n '--u-auto-complete-option-selected-color': T('color', 'primary'),\n\n // ─── Contextmenu item ───\n '--u-contextmenu-item-hover-bg': T('bg-color', 'hover'),\n '--u-contextmenu-item-hover-color': T('text-color', 'title'),\n '--u-contextmenu-item-height-small': '24px',\n '--u-contextmenu-item-height-default': '28px',\n '--u-contextmenu-item-height-large': '32px',\n\n // ─── Expression Editor Chip ───\n '--u-expression-editor-chip-bg': T('color', 'primary', 'light', '9'),\n '--u-expression-editor-chip-color': T('color', 'primary'),\n\n // ─── Paginator active buttons ───\n '--u-paginator-btn-hover-bg': T('color', 'primary', 'light', '9'),\n '--u-paginator-btn-hover-color': T('text-color', 'title'),\n '--u-paginator-btn-active-bg': T('color', 'primary', 'light', '9'),\n '--u-paginator-btn-active-color': T('color', 'primary'),\n\n // ─── Tabs List background ───\n '--u-tabs-bar-bg': T('bg-color', 'hover'),\n '--u-tabs-active-bg': T('bg-color', 'top'),\n\n // ─── Tag Component Colors ───\n '--u-tag-primary-bg': T('color', 'primary', 'light', '9'),\n '--u-tag-primary-color': T('color', 'primary'),\n '--u-tag-primary-border': T('color', 'primary'),\n '--u-tag-success-bg': T('color', 'success', 'light', '9'),\n '--u-tag-success-color': T('color', 'success'),\n '--u-tag-success-border': T('color', 'success'),\n '--u-tag-warning-bg': T('color', 'warning', 'light', '9'),\n '--u-tag-warning-color': T('color', 'warning'),\n '--u-tag-warning-border': T('color', 'warning'),\n '--u-tag-danger-bg': T('color', 'danger', 'light', '9'),\n '--u-tag-danger-color': T('color', 'danger'),\n '--u-tag-danger-border': T('color', 'danger'),\n '--u-tag-info-bg': T('color', 'info', 'light', '9'),\n '--u-tag-info-color': T('color', 'info'),\n '--u-tag-info-border': T('color', 'info'),\n\n // ─── File Picker Colors ───\n '--u-file-picker-hover-bg': T('color', 'primary', 'light', '9'),\n '--u-card-header-bg': 'rgba(0, 0, 0, 0.015)',\n '--u-card-action-bg': 'rgba(0, 0, 0, 0.015)',\n '--u-card-padding-small': '8px',\n '--u-card-padding-default': '12px',\n '--u-card-padding-large': '16px',\n '--u-card-radius': T('radius', 'large')\n}\n\n/** 暗色下组件 token（含与亮色相同的尺寸项，保证暗色 html 块自洽） */\nexport const componentCssVarsDark: Record<string, string> = {\n ...componentCssVarsLight,\n '--u-focus-ring': `0 0 0 3px ${T('color', 'primary', 'a', '35')}`,\n '--u-table-border-color': T('border', 'color'),\n '--u-table-header-bg': T('bg-color', 'hover'),\n '--u-table-header-color': T('text-color', 'main'),\n '--u-table-stripe-bg': T('bg-color', 'middle'),\n '--u-table-stripe-color': T('text-color', 'main'),\n '--u-table-hover-bg': T('text-color', 'title', 'a', '5'),\n '--u-table-hover-color': T('text-color', 'title'),\n '--u-table-current-bg': T('bg-color', 'hover'),\n '--u-table-current-color': 'inherit',\n '--u-table-checked-bg': T('color', 'primary', 'dark', '1'),\n '--u-table-checked-color': 'inherit',\n '--u-radio-border': '#595959',\n '--u-checkbox-border': '#595959',\n\n // ─── Button (plain & text colors in dark mode) ───\n '--u-button-primary-plain-bg': T('color', 'primary', 'dark', '9'),\n '--u-button-primary-plain-shadow': T('color', 'primary', 'dark', '7'),\n '--u-button-success-plain-bg': T('color', 'success', 'dark', '9'),\n '--u-button-success-plain-shadow': T('color', 'success', 'dark', '7'),\n '--u-button-warning-plain-bg': T('color', 'warning', 'dark', '9'),\n '--u-button-warning-plain-shadow': T('color', 'warning', 'dark', '7'),\n '--u-button-danger-plain-bg': T('color', 'danger', 'dark', '9'),\n '--u-button-danger-plain-shadow': T('color', 'danger', 'dark', '7'),\n '--u-button-info-plain-bg': T('color', 'info', 'dark', '9'),\n '--u-button-info-plain-shadow': T('color', 'info', 'dark', '7'),\n\n // ─── Tree selection ───\n '--u-tree-node-selected-bg': T('color', 'primary', 'dark', '9'),\n '--u-tree-node-selected-color': T('color', 'primary'),\n\n // ─── Cascade option active ───\n '--u-cascade-node-active-bg': T('color', 'primary', 'dark', '9'),\n '--u-cascade-node-active-color': T('color', 'primary'),\n\n // ─── Select option ───\n '--u-select-option-hover-bg': T('bg-color', 'hover'),\n '--u-select-option-hover-color': T('text-color', 'title'),\n '--u-select-option-selected-bg': T('color', 'primary', 'dark', '9'),\n '--u-select-option-selected-color': T('color', 'primary'),\n\n // ─── Auto Complete option ───\n '--u-auto-complete-option-hover-bg': T('bg-color', 'hover'),\n '--u-auto-complete-option-hover-color': T('text-color', 'title'),\n '--u-auto-complete-option-selected-bg': T('color', 'primary', 'dark', '9'),\n '--u-auto-complete-option-selected-color': T('color', 'primary'),\n\n // ─── Contextmenu item ───\n '--u-contextmenu-item-hover-bg': T('bg-color', 'hover'),\n '--u-contextmenu-item-hover-color': T('text-color', 'title'),\n '--u-contextmenu-item-height-small': '24px',\n '--u-contextmenu-item-height-default': '28px',\n '--u-contextmenu-item-height-large': '32px',\n\n // ─── Expression Editor Chip ───\n '--u-expression-editor-chip-bg': T('color', 'primary', 'dark', '9'),\n '--u-expression-editor-chip-color': T('color', 'primary'),\n\n // ─── Paginator active buttons ───\n '--u-paginator-btn-hover-bg': T('color', 'primary', 'dark', '9'),\n '--u-paginator-btn-hover-color': T('color', 'primary'),\n '--u-paginator-btn-active-bg': T('color', 'primary', 'dark', '9'),\n '--u-paginator-btn-active-color': T('color', 'primary'),\n\n // ─── Tabs List background (improved dark contrast) ───\n '--u-tabs-bar-bg': T('bg-color', 'bottom'),\n '--u-tabs-active-bg': T('bg-color', 'top'),\n\n // ─── Tag Component Colors ───\n '--u-tag-primary-bg': T('color', 'primary', 'dark', '9'),\n '--u-tag-primary-color': T('color', 'primary'),\n '--u-tag-primary-border': T('color', 'primary'),\n '--u-tag-success-bg': T('color', 'success', 'dark', '9'),\n '--u-tag-success-color': T('color', 'success'),\n '--u-tag-success-border': T('color', 'success'),\n '--u-tag-warning-bg': T('color', 'warning', 'dark', '9'),\n '--u-tag-warning-color': T('color', 'warning'),\n '--u-tag-warning-border': T('color', 'warning'),\n '--u-tag-danger-bg': T('color', 'danger', 'dark', '9'),\n '--u-tag-danger-color': T('color', 'danger'),\n '--u-tag-danger-border': T('color', 'danger'),\n '--u-tag-info-bg': T('color', 'info', 'dark', '9'),\n '--u-tag-info-color': T('color', 'info'),\n '--u-tag-info-border': T('color', 'info'),\n\n // ─── File Picker Colors ───\n '--u-file-picker-hover-bg': T('color', 'primary', 'dark', '9'),\n '--u-card-header-bg': 'rgba(255, 255, 255, 0.015)',\n '--u-card-action-bg': 'rgba(255, 255, 255, 0.015)'\n}\n\nfunction recordToDeclList(record: Record<string, string>): string[] {\n return Object.entries(record).map(([k, v]) => `${k}: ${v}`)\n}\n\nexport const componentCssVarsLightDecls: string[] = recordToDeclList(componentCssVarsLight)\n\nexport const componentCssVarsDarkDecls: string[] = recordToDeclList(componentCssVarsDark)\n\n// ─── Nav 侧栏外观：深/浅变体 × 明/暗主题系列 ───\n// 由 UITheme 按主题 `nav.variant`（默认 dark）选择注入，主题 `nav` 的其余键可逐项覆盖。\n\n/** 侧栏外观变体：dark 深底浅字 / light 浅底深字 */\nexport type NavSidebarVariant = 'dark' | 'light'\n\n/** 深侧栏 · 浅色主题下：深底（text-color.title）+ 浅前景，与浅色内容区拉开区分度 */\nconst navSidebarDarkInLight: Record<string, string> = {\n '--u-nav-bg-color': T('text-color', 'title'),\n '--u-nav-color': 'rgba(255, 255, 255, 0.72)',\n '--u-nav-hover-bg': 'rgba(255, 255, 255, 0.08)',\n '--u-nav-hover-color': T('text-color', 'white'),\n '--u-nav-active-bg': T('color', 'primary', 'a', '22'),\n '--u-nav-active-color': T('text-color', 'white'),\n '--u-nav-strong-color': T('text-color', 'white'),\n '--u-nav-second-color': 'rgba(255, 255, 255, 0.45)',\n '--u-nav-sub-border-color': 'rgba(255, 255, 255, 0.15)',\n '--u-nav-rail-bg': 'rgba(0, 0, 0, 0.2)'\n}\n\n/** 浅侧栏 · 浅色主题下：比内容区 top 低一档的浅底 + 深前景 */\nconst navSidebarLightInLight: Record<string, string> = {\n '--u-nav-bg-color': T('bg-color', 'middle'),\n '--u-nav-color': T('text-color', 'title'),\n '--u-nav-hover-bg': T('text-color', 'title', 'a', '8'),\n '--u-nav-hover-color': T('text-color', 'title'),\n '--u-nav-active-bg': T('color', 'primary', 'a', '10'),\n '--u-nav-active-color': T('color', 'primary', 'dark', '1'),\n '--u-nav-strong-color': T('text-color', 'title'),\n '--u-nav-second-color': T('text-color', 'second'),\n '--u-nav-sub-border-color': T('border', 'color', 'a', '52'),\n '--u-nav-rail-bg': T('bg-color', 'bottom')\n}\n\n/** 深侧栏 · 深色主题下：比内容区 top 深一档 */\nconst navSidebarDarkInDark: Record<string, string> = {\n '--u-nav-bg-color': T('bg-color', 'middle'),\n '--u-nav-color': T('text-color', 'main'),\n '--u-nav-hover-bg': T('text-color', 'title', 'a', '8'),\n '--u-nav-hover-color': T('text-color', 'title'),\n '--u-nav-active-bg': T('color', 'primary', 'a', '16'),\n '--u-nav-active-color': T('text-color', 'white'),\n '--u-nav-strong-color': T('text-color', 'title'),\n '--u-nav-second-color': T('text-color', 'second'),\n '--u-nav-sub-border-color': T('border', 'color', 'a', '52'),\n '--u-nav-rail-bg': T('bg-color', 'bottom')\n}\n\n/** 浅侧栏 · 深色主题下：提亮侧栏（与深色内容区反向对比） */\nconst navSidebarLightInDark: Record<string, string> = {\n '--u-nav-bg-color': T('bg-color', 'top'),\n '--u-nav-color': T('text-color', 'title'),\n '--u-nav-hover-bg': T('text-color', 'title', 'a', '8'),\n '--u-nav-hover-color': T('text-color', 'title'),\n '--u-nav-active-bg': T('color', 'primary', 'a', '22'),\n '--u-nav-active-color': T('color', 'primary'),\n '--u-nav-strong-color': T('text-color', 'title'),\n '--u-nav-second-color': T('text-color', 'second'),\n '--u-nav-sub-border-color': T('border', 'color', 'a', '52'),\n '--u-nav-rail-bg': T('bg-color', 'middle')\n}\n\nconst navSidebarCssVars: Record<\n 'light' | 'dark',\n Record<NavSidebarVariant, Record<string, string>>\n> = {\n light: { dark: navSidebarDarkInLight, light: navSidebarLightInLight },\n dark: { dark: navSidebarDarkInDark, light: navSidebarLightInDark }\n}\n\n/** 某主题系列 + 侧栏变体下的 nav 外观 token（键为 `--u-nav-*`） */\nexport function navSidebarTokens(\n series: 'light' | 'dark',\n variant: NavSidebarVariant\n): Record<string, string> {\n return { ...navSidebarCssVars[series][variant] }\n}\n\n/** 解析某主题系列 + 侧栏变体下的 nav 外观 token 声明列表 */\nexport function resolveNavSidebarDecls(\n series: 'light' | 'dark',\n variant: NavSidebarVariant\n): string[] {\n return recordToDeclList(navSidebarCssVars[series][variant])\n}\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@veltra/styles",
|
|
3
|
-
"version": "1.7.
|
|
3
|
+
"version": "1.7.5",
|
|
4
4
|
"homepage": "https://github.com/cabinet-fe/ultra-ui#readme",
|
|
5
5
|
"bugs": {
|
|
6
6
|
"url": "https://github.com/cabinet-fe/ultra-ui/issues"
|
|
@@ -51,8 +51,8 @@
|
|
|
51
51
|
},
|
|
52
52
|
"peerDependencies": {
|
|
53
53
|
"@cat-kit/core": ">=1.2.1",
|
|
54
|
-
"@veltra/compositions": "^1.7.
|
|
55
|
-
"@veltra/utils": "^1.7.
|
|
54
|
+
"@veltra/compositions": "^1.7.5",
|
|
55
|
+
"@veltra/utils": "^1.7.5",
|
|
56
56
|
"vue": ">=3.5.42"
|
|
57
57
|
}
|
|
58
58
|
}
|
|
@@ -82,6 +82,24 @@ describe('UITheme', () => {
|
|
|
82
82
|
expect(componentCssVarsDark['--u-focus-ring']).toContain('--u-color-primary-a-')
|
|
83
83
|
})
|
|
84
84
|
|
|
85
|
+
it('emits select, auto-complete, and contextmenu component vars', () => {
|
|
86
|
+
expect(componentCssVarsLight['--u-select-option-hover-bg']).toBe('var(--u-bg-color-hover)')
|
|
87
|
+
expect(componentCssVarsLight['--u-select-option-selected-bg']).toBe(
|
|
88
|
+
'var(--u-color-primary-light-9)'
|
|
89
|
+
)
|
|
90
|
+
expect(componentCssVarsDark['--u-select-option-selected-bg']).toBe(
|
|
91
|
+
'var(--u-color-primary-dark-9)'
|
|
92
|
+
)
|
|
93
|
+
expect(componentCssVarsLight['--u-auto-complete-option-selected-bg']).toBe(
|
|
94
|
+
'var(--u-color-primary-light-9)'
|
|
95
|
+
)
|
|
96
|
+
expect(componentCssVarsDark['--u-auto-complete-option-selected-bg']).toBe(
|
|
97
|
+
'var(--u-color-primary-dark-9)'
|
|
98
|
+
)
|
|
99
|
+
expect(componentCssVarsLight['--u-contextmenu-item-hover-bg']).toBe('var(--u-bg-color-hover)')
|
|
100
|
+
expect(componentCssVarsLight['--u-contextmenu-item-height-default']).toBe('28px')
|
|
101
|
+
})
|
|
102
|
+
|
|
85
103
|
it('nav sidebar defaults to dark variant, resolved per series', () => {
|
|
86
104
|
// light 系列：深底（text-color.title）+ 浅前景，与浅色内容区拉开区分度
|
|
87
105
|
const lightDecls = lightTheme.navSidebarDecls(lightTheme.theme)
|
|
@@ -69,6 +69,25 @@ export const componentCssVarsLight: Record<string, string> = {
|
|
|
69
69
|
'--u-cascade-node-active-bg': T('color', 'primary', 'light', '9'),
|
|
70
70
|
'--u-cascade-node-active-color': T('color', 'primary'),
|
|
71
71
|
|
|
72
|
+
// ─── Select option ───
|
|
73
|
+
'--u-select-option-hover-bg': T('bg-color', 'hover'),
|
|
74
|
+
'--u-select-option-hover-color': T('text-color', 'title'),
|
|
75
|
+
'--u-select-option-selected-bg': T('color', 'primary', 'light', '9'),
|
|
76
|
+
'--u-select-option-selected-color': T('color', 'primary'),
|
|
77
|
+
|
|
78
|
+
// ─── Auto Complete option ───
|
|
79
|
+
'--u-auto-complete-option-hover-bg': T('bg-color', 'hover'),
|
|
80
|
+
'--u-auto-complete-option-hover-color': T('text-color', 'title'),
|
|
81
|
+
'--u-auto-complete-option-selected-bg': T('color', 'primary', 'light', '9'),
|
|
82
|
+
'--u-auto-complete-option-selected-color': T('color', 'primary'),
|
|
83
|
+
|
|
84
|
+
// ─── Contextmenu item ───
|
|
85
|
+
'--u-contextmenu-item-hover-bg': T('bg-color', 'hover'),
|
|
86
|
+
'--u-contextmenu-item-hover-color': T('text-color', 'title'),
|
|
87
|
+
'--u-contextmenu-item-height-small': '24px',
|
|
88
|
+
'--u-contextmenu-item-height-default': '28px',
|
|
89
|
+
'--u-contextmenu-item-height-large': '32px',
|
|
90
|
+
|
|
72
91
|
// ─── Expression Editor Chip ───
|
|
73
92
|
'--u-expression-editor-chip-bg': T('color', 'primary', 'light', '9'),
|
|
74
93
|
'--u-expression-editor-chip-color': T('color', 'primary'),
|
|
@@ -148,6 +167,25 @@ export const componentCssVarsDark: Record<string, string> = {
|
|
|
148
167
|
'--u-cascade-node-active-bg': T('color', 'primary', 'dark', '9'),
|
|
149
168
|
'--u-cascade-node-active-color': T('color', 'primary'),
|
|
150
169
|
|
|
170
|
+
// ─── Select option ───
|
|
171
|
+
'--u-select-option-hover-bg': T('bg-color', 'hover'),
|
|
172
|
+
'--u-select-option-hover-color': T('text-color', 'title'),
|
|
173
|
+
'--u-select-option-selected-bg': T('color', 'primary', 'dark', '9'),
|
|
174
|
+
'--u-select-option-selected-color': T('color', 'primary'),
|
|
175
|
+
|
|
176
|
+
// ─── Auto Complete option ───
|
|
177
|
+
'--u-auto-complete-option-hover-bg': T('bg-color', 'hover'),
|
|
178
|
+
'--u-auto-complete-option-hover-color': T('text-color', 'title'),
|
|
179
|
+
'--u-auto-complete-option-selected-bg': T('color', 'primary', 'dark', '9'),
|
|
180
|
+
'--u-auto-complete-option-selected-color': T('color', 'primary'),
|
|
181
|
+
|
|
182
|
+
// ─── Contextmenu item ───
|
|
183
|
+
'--u-contextmenu-item-hover-bg': T('bg-color', 'hover'),
|
|
184
|
+
'--u-contextmenu-item-hover-color': T('text-color', 'title'),
|
|
185
|
+
'--u-contextmenu-item-height-small': '24px',
|
|
186
|
+
'--u-contextmenu-item-height-default': '28px',
|
|
187
|
+
'--u-contextmenu-item-height-large': '32px',
|
|
188
|
+
|
|
151
189
|
// ─── Expression Editor Chip ───
|
|
152
190
|
'--u-expression-editor-chip-bg': T('color', 'primary', 'dark', '9'),
|
|
153
191
|
'--u-expression-editor-chip-color': T('color', 'primary'),
|