@hsu-react/ui 2.4.8 → 2.4.9
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.
- package/es/components/Chat/ChatHistory/_components/HistoryGroup/index.module.scss +2 -1
- package/es/components/Chat/ChatList/_components/Assistant/AssistantItem/_components/QuoteList/index.module.scss +2 -1
- package/es/components/Pagination/index.module.scss +2 -1
- package/es/components/Panel/ListPanel/_components/ColumnMgt/index.module.scss +2 -1
- package/es/components/SecondConf/index.module.scss +3 -1
- package/es/components/TabBar/index.module.scss +4 -1
- package/es/styles/antd-overload.scss +27 -1
- package/es/styles/tokens.js +10 -1
- package/es/styles/tokens.json +1 -1
- package/es/styles/tokens.scss +1 -1
- package/lib/components/Chat/ChatHistory/_components/HistoryGroup/index.module.scss +2 -1
- package/lib/components/Chat/ChatList/_components/Assistant/AssistantItem/_components/QuoteList/index.module.scss +2 -1
- package/lib/components/Pagination/index.module.scss +2 -1
- package/lib/components/Panel/ListPanel/_components/ColumnMgt/index.module.scss +2 -1
- package/lib/components/SecondConf/index.module.scss +3 -1
- package/lib/components/TabBar/index.module.scss +4 -1
- package/lib/styles/antd-overload.scss +27 -1
- package/lib/styles/tokens.js +10 -1
- package/lib/styles/tokens.json +1 -1
- package/lib/styles/tokens.scss +1 -1
- package/package.json +1 -1
- package/src/components/Chat/ChatHistory/_components/HistoryGroup/index.module.scss +2 -1
- package/src/components/Chat/ChatList/_components/Assistant/AssistantItem/_components/QuoteList/index.module.scss +2 -1
- package/src/components/Pagination/index.module.scss +2 -1
- package/src/components/Panel/ListPanel/_components/ColumnMgt/index.module.scss +2 -1
- package/src/components/SecondConf/index.module.scss +3 -1
- package/src/components/TabBar/index.module.scss +4 -1
- package/src/styles/antd-overload.scss +27 -1
- package/src/styles/tokens.json +1 -1
- package/src/styles/tokens.scss +1 -1
- package/src/styles/tokens.ts +10 -1
|
@@ -51,7 +51,10 @@
|
|
|
51
51
|
&.active {
|
|
52
52
|
background: var(--vita-primary);
|
|
53
53
|
|
|
54
|
-
|
|
54
|
+
// 压在主色实底上的前景色走配对令牌，不要写死白：--vita-primary 是可配置的，
|
|
55
|
+
// 消费方把它换成近白的中性色时（shadcn 那种 primary/primary-foreground 配法），
|
|
56
|
+
// 写死的白就是白压白。默认值仍是 #ffffff，彩色品牌色的消费方不受影响
|
|
57
|
+
color: var(--vita-primary-foreground);
|
|
55
58
|
|
|
56
59
|
z-index: 2;
|
|
57
60
|
}
|
|
@@ -127,7 +127,14 @@ textarea,
|
|
|
127
127
|
line-height: 1.4;
|
|
128
128
|
text-transform: uppercase;
|
|
129
129
|
|
|
130
|
-
|
|
130
|
+
// 注释写的就是 muted，值却落在 subtle —— 那一档是「占位 / 禁用文字」，
|
|
131
|
+
// 浅色下 #a1a1aa 压白只有 2.6:1。这是分组导航的标题，是要被读的内容，
|
|
132
|
+
// 而且 11px 粗体在 WCAG 里仍按正文算（大字号要 18.66px 粗体起），得够 4.5:1。
|
|
133
|
+
// muted(#71717a) 约 4.8:1，字号与字重维持不变。
|
|
134
|
+
//
|
|
135
|
+
// 同一类错在 tokens.ts 的 colorTextTertiary 上刚修过一次：可读的归 muted，
|
|
136
|
+
// 只有占位/禁用留在 subtle。这里是被本文件的单类选择器盖掉的第二处。
|
|
137
|
+
color: var(--vita-muted-foreground);
|
|
131
138
|
}
|
|
132
139
|
|
|
133
140
|
// Items within a group use more restrained left-aligned indentation (closer to CF)
|
|
@@ -193,3 +200,22 @@ textarea,
|
|
|
193
200
|
.ant-modal-mask {
|
|
194
201
|
pointer-events: auto !important;
|
|
195
202
|
}
|
|
203
|
+
|
|
204
|
+
// =============================================================
|
|
205
|
+
// Alert 圆角：补 antd 没注入的那个变量
|
|
206
|
+
//
|
|
207
|
+
// antd 的 Alert 样式写的是 `border-radius: var(--ant-alert-border-radius)`，但在
|
|
208
|
+
// CSS-var 模式下它**从不注入**这个变量 —— 实测该变量读出来是「未定义」，
|
|
209
|
+
// 于是圆角回退成 0，四角是直的。
|
|
210
|
+
//
|
|
211
|
+
// 走组件令牌修不了：`Alert: { borderRadiusLG }` 注入的是 `--ant-border-radius-lg`
|
|
212
|
+
// （Alert 一次都没引用），改成 `borderRadius` 也一样不生成该变量（两种都实测过）。
|
|
213
|
+
// 对照组是 Table —— 它的 `--ant-table-border-radius` 同样未定义，但圆角正常 8px，
|
|
214
|
+
// 因为 Table 的圆角来自本库自己的 scss，不依赖 antd 那条规则。
|
|
215
|
+
//
|
|
216
|
+
// 所以只能在样式层直接给。`.ant-alert-banner` 自带 `border-radius: 0`，
|
|
217
|
+
// 且选择器更具体，通栏提示条不受影响。
|
|
218
|
+
// =============================================================
|
|
219
|
+
.ant-alert {
|
|
220
|
+
border-radius: var(--vita-radius);
|
|
221
|
+
}
|
package/es/styles/tokens.js
CHANGED
|
@@ -114,7 +114,16 @@ export var toAntdTheme = function toAntdTheme(options) {
|
|
|
114
114
|
colorInfo: primary,
|
|
115
115
|
colorText: t.foreground,
|
|
116
116
|
colorTextSecondary: t.mutedForeground,
|
|
117
|
-
|
|
117
|
+
// antd 有四档文字色，本套令牌只有三档，压缩时分界线要放对：
|
|
118
|
+
// tertiary 在 antd 里是**描述性的可读文字**（面包屑、表单 extra、Descriptions 的
|
|
119
|
+
// 标签都吃它），quaternary 才是占位与禁用。原来两档都指向 subtleForeground，
|
|
120
|
+
// 于是面包屑拿到了占位级的对比度 —— 浅色下 #a1a1aa 压白只有 2.56:1，
|
|
121
|
+
// 14px 正文按 WCAG AA 要 4.5:1，连大字号的 3:1 都不到（消费方实测）。
|
|
122
|
+
//
|
|
123
|
+
// 压深 subtleForeground 治不了：要够 4.5:1 得到 #767676，那已经和
|
|
124
|
+
// mutedForeground(#71717a, 4.83:1) 几乎同色，第三档等于不存在。
|
|
125
|
+
// 所以按语义分流 —— 可读的归 muted，只有占位/禁用留在 subtle。
|
|
126
|
+
colorTextTertiary: t.mutedForeground,
|
|
118
127
|
colorTextQuaternary: t.subtleForeground,
|
|
119
128
|
colorBgContainer: t.surface,
|
|
120
129
|
colorBgElevated: t.surface,
|
package/es/styles/tokens.json
CHANGED
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
"hover": "#f4f4f5",
|
|
28
28
|
"success": "#16a34a",
|
|
29
29
|
"warning": "#f59e0b",
|
|
30
|
-
"error": "#
|
|
30
|
+
"error": "#dc2626",
|
|
31
31
|
"shadow1": "0 1px 2px 0 rgba(9, 9, 11, 0.05)",
|
|
32
32
|
"shadow2": "0 4px 6px -1px rgba(9, 9, 11, 0.08), 0 2px 4px -2px rgba(9, 9, 11, 0.06)",
|
|
33
33
|
"shadow3": "0 10px 15px -3px rgba(9, 9, 11, 0.1), 0 4px 6px -4px rgba(9, 9, 11, 0.08)"
|
package/es/styles/tokens.scss
CHANGED
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
--vita-hover: #f4f4f5; // 行 / 项 hover 背景
|
|
34
34
|
--vita-success: #16a34a;
|
|
35
35
|
--vita-warning: #f59e0b;
|
|
36
|
-
--vita-error: #
|
|
36
|
+
--vita-error: #dc2626;
|
|
37
37
|
--vita-shadow-1: 0 1px 2px 0 rgba(9, 9, 11, 0.05); // 浮层阴影 - 弱
|
|
38
38
|
--vita-shadow-2: 0 4px 6px -1px rgba(9, 9, 11, 0.08), 0 2px 4px -2px rgba(9, 9, 11, 0.06); // 浮层阴影 - 中
|
|
39
39
|
--vita-shadow-3: 0 10px 15px -3px rgba(9, 9, 11, 0.1), 0 4px 6px -4px rgba(9, 9, 11, 0.08); // 浮层阴影 - 强
|
|
@@ -51,7 +51,10 @@
|
|
|
51
51
|
&.active {
|
|
52
52
|
background: var(--vita-primary);
|
|
53
53
|
|
|
54
|
-
|
|
54
|
+
// 压在主色实底上的前景色走配对令牌，不要写死白：--vita-primary 是可配置的，
|
|
55
|
+
// 消费方把它换成近白的中性色时（shadcn 那种 primary/primary-foreground 配法），
|
|
56
|
+
// 写死的白就是白压白。默认值仍是 #ffffff，彩色品牌色的消费方不受影响
|
|
57
|
+
color: var(--vita-primary-foreground);
|
|
55
58
|
|
|
56
59
|
z-index: 2;
|
|
57
60
|
}
|
|
@@ -127,7 +127,14 @@ textarea,
|
|
|
127
127
|
line-height: 1.4;
|
|
128
128
|
text-transform: uppercase;
|
|
129
129
|
|
|
130
|
-
|
|
130
|
+
// 注释写的就是 muted，值却落在 subtle —— 那一档是「占位 / 禁用文字」，
|
|
131
|
+
// 浅色下 #a1a1aa 压白只有 2.6:1。这是分组导航的标题，是要被读的内容，
|
|
132
|
+
// 而且 11px 粗体在 WCAG 里仍按正文算（大字号要 18.66px 粗体起），得够 4.5:1。
|
|
133
|
+
// muted(#71717a) 约 4.8:1，字号与字重维持不变。
|
|
134
|
+
//
|
|
135
|
+
// 同一类错在 tokens.ts 的 colorTextTertiary 上刚修过一次：可读的归 muted，
|
|
136
|
+
// 只有占位/禁用留在 subtle。这里是被本文件的单类选择器盖掉的第二处。
|
|
137
|
+
color: var(--vita-muted-foreground);
|
|
131
138
|
}
|
|
132
139
|
|
|
133
140
|
// Items within a group use more restrained left-aligned indentation (closer to CF)
|
|
@@ -193,3 +200,22 @@ textarea,
|
|
|
193
200
|
.ant-modal-mask {
|
|
194
201
|
pointer-events: auto !important;
|
|
195
202
|
}
|
|
203
|
+
|
|
204
|
+
// =============================================================
|
|
205
|
+
// Alert 圆角：补 antd 没注入的那个变量
|
|
206
|
+
//
|
|
207
|
+
// antd 的 Alert 样式写的是 `border-radius: var(--ant-alert-border-radius)`，但在
|
|
208
|
+
// CSS-var 模式下它**从不注入**这个变量 —— 实测该变量读出来是「未定义」，
|
|
209
|
+
// 于是圆角回退成 0，四角是直的。
|
|
210
|
+
//
|
|
211
|
+
// 走组件令牌修不了：`Alert: { borderRadiusLG }` 注入的是 `--ant-border-radius-lg`
|
|
212
|
+
// （Alert 一次都没引用），改成 `borderRadius` 也一样不生成该变量（两种都实测过）。
|
|
213
|
+
// 对照组是 Table —— 它的 `--ant-table-border-radius` 同样未定义，但圆角正常 8px，
|
|
214
|
+
// 因为 Table 的圆角来自本库自己的 scss，不依赖 antd 那条规则。
|
|
215
|
+
//
|
|
216
|
+
// 所以只能在样式层直接给。`.ant-alert-banner` 自带 `border-radius: 0`，
|
|
217
|
+
// 且选择器更具体，通栏提示条不受影响。
|
|
218
|
+
// =============================================================
|
|
219
|
+
.ant-alert {
|
|
220
|
+
border-radius: var(--vita-radius);
|
|
221
|
+
}
|
package/lib/styles/tokens.js
CHANGED
|
@@ -99,7 +99,16 @@ const toAntdTheme = options => {
|
|
|
99
99
|
colorInfo: primary,
|
|
100
100
|
colorText: t.foreground,
|
|
101
101
|
colorTextSecondary: t.mutedForeground,
|
|
102
|
-
|
|
102
|
+
// antd 有四档文字色，本套令牌只有三档，压缩时分界线要放对：
|
|
103
|
+
// tertiary 在 antd 里是**描述性的可读文字**（面包屑、表单 extra、Descriptions 的
|
|
104
|
+
// 标签都吃它），quaternary 才是占位与禁用。原来两档都指向 subtleForeground，
|
|
105
|
+
// 于是面包屑拿到了占位级的对比度 —— 浅色下 #a1a1aa 压白只有 2.56:1，
|
|
106
|
+
// 14px 正文按 WCAG AA 要 4.5:1，连大字号的 3:1 都不到（消费方实测）。
|
|
107
|
+
//
|
|
108
|
+
// 压深 subtleForeground 治不了：要够 4.5:1 得到 #767676，那已经和
|
|
109
|
+
// mutedForeground(#71717a, 4.83:1) 几乎同色，第三档等于不存在。
|
|
110
|
+
// 所以按语义分流 —— 可读的归 muted，只有占位/禁用留在 subtle。
|
|
111
|
+
colorTextTertiary: t.mutedForeground,
|
|
103
112
|
colorTextQuaternary: t.subtleForeground,
|
|
104
113
|
colorBgContainer: t.surface,
|
|
105
114
|
colorBgElevated: t.surface,
|
package/lib/styles/tokens.json
CHANGED
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
"hover": "#f4f4f5",
|
|
28
28
|
"success": "#16a34a",
|
|
29
29
|
"warning": "#f59e0b",
|
|
30
|
-
"error": "#
|
|
30
|
+
"error": "#dc2626",
|
|
31
31
|
"shadow1": "0 1px 2px 0 rgba(9, 9, 11, 0.05)",
|
|
32
32
|
"shadow2": "0 4px 6px -1px rgba(9, 9, 11, 0.08), 0 2px 4px -2px rgba(9, 9, 11, 0.06)",
|
|
33
33
|
"shadow3": "0 10px 15px -3px rgba(9, 9, 11, 0.1), 0 4px 6px -4px rgba(9, 9, 11, 0.08)"
|
package/lib/styles/tokens.scss
CHANGED
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
--vita-hover: #f4f4f5; // 行 / 项 hover 背景
|
|
34
34
|
--vita-success: #16a34a;
|
|
35
35
|
--vita-warning: #f59e0b;
|
|
36
|
-
--vita-error: #
|
|
36
|
+
--vita-error: #dc2626;
|
|
37
37
|
--vita-shadow-1: 0 1px 2px 0 rgba(9, 9, 11, 0.05); // 浮层阴影 - 弱
|
|
38
38
|
--vita-shadow-2: 0 4px 6px -1px rgba(9, 9, 11, 0.08), 0 2px 4px -2px rgba(9, 9, 11, 0.06); // 浮层阴影 - 中
|
|
39
39
|
--vita-shadow-3: 0 10px 15px -3px rgba(9, 9, 11, 0.1), 0 4px 6px -4px rgba(9, 9, 11, 0.08); // 浮层阴影 - 强
|
package/package.json
CHANGED
|
@@ -51,7 +51,10 @@
|
|
|
51
51
|
&.active {
|
|
52
52
|
background: var(--vita-primary);
|
|
53
53
|
|
|
54
|
-
|
|
54
|
+
// 压在主色实底上的前景色走配对令牌，不要写死白：--vita-primary 是可配置的，
|
|
55
|
+
// 消费方把它换成近白的中性色时（shadcn 那种 primary/primary-foreground 配法），
|
|
56
|
+
// 写死的白就是白压白。默认值仍是 #ffffff，彩色品牌色的消费方不受影响
|
|
57
|
+
color: var(--vita-primary-foreground);
|
|
55
58
|
|
|
56
59
|
z-index: 2;
|
|
57
60
|
}
|
|
@@ -127,7 +127,14 @@ textarea,
|
|
|
127
127
|
line-height: 1.4;
|
|
128
128
|
text-transform: uppercase;
|
|
129
129
|
|
|
130
|
-
|
|
130
|
+
// 注释写的就是 muted，值却落在 subtle —— 那一档是「占位 / 禁用文字」，
|
|
131
|
+
// 浅色下 #a1a1aa 压白只有 2.6:1。这是分组导航的标题，是要被读的内容，
|
|
132
|
+
// 而且 11px 粗体在 WCAG 里仍按正文算（大字号要 18.66px 粗体起），得够 4.5:1。
|
|
133
|
+
// muted(#71717a) 约 4.8:1，字号与字重维持不变。
|
|
134
|
+
//
|
|
135
|
+
// 同一类错在 tokens.ts 的 colorTextTertiary 上刚修过一次：可读的归 muted，
|
|
136
|
+
// 只有占位/禁用留在 subtle。这里是被本文件的单类选择器盖掉的第二处。
|
|
137
|
+
color: var(--vita-muted-foreground);
|
|
131
138
|
}
|
|
132
139
|
|
|
133
140
|
// Items within a group use more restrained left-aligned indentation (closer to CF)
|
|
@@ -193,3 +200,22 @@ textarea,
|
|
|
193
200
|
.ant-modal-mask {
|
|
194
201
|
pointer-events: auto !important;
|
|
195
202
|
}
|
|
203
|
+
|
|
204
|
+
// =============================================================
|
|
205
|
+
// Alert 圆角：补 antd 没注入的那个变量
|
|
206
|
+
//
|
|
207
|
+
// antd 的 Alert 样式写的是 `border-radius: var(--ant-alert-border-radius)`，但在
|
|
208
|
+
// CSS-var 模式下它**从不注入**这个变量 —— 实测该变量读出来是「未定义」，
|
|
209
|
+
// 于是圆角回退成 0，四角是直的。
|
|
210
|
+
//
|
|
211
|
+
// 走组件令牌修不了：`Alert: { borderRadiusLG }` 注入的是 `--ant-border-radius-lg`
|
|
212
|
+
// （Alert 一次都没引用），改成 `borderRadius` 也一样不生成该变量（两种都实测过）。
|
|
213
|
+
// 对照组是 Table —— 它的 `--ant-table-border-radius` 同样未定义，但圆角正常 8px，
|
|
214
|
+
// 因为 Table 的圆角来自本库自己的 scss，不依赖 antd 那条规则。
|
|
215
|
+
//
|
|
216
|
+
// 所以只能在样式层直接给。`.ant-alert-banner` 自带 `border-radius: 0`，
|
|
217
|
+
// 且选择器更具体，通栏提示条不受影响。
|
|
218
|
+
// =============================================================
|
|
219
|
+
.ant-alert {
|
|
220
|
+
border-radius: var(--vita-radius);
|
|
221
|
+
}
|
package/src/styles/tokens.json
CHANGED
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
"hover": "#f4f4f5",
|
|
28
28
|
"success": "#16a34a",
|
|
29
29
|
"warning": "#f59e0b",
|
|
30
|
-
"error": "#
|
|
30
|
+
"error": "#dc2626",
|
|
31
31
|
"shadow1": "0 1px 2px 0 rgba(9, 9, 11, 0.05)",
|
|
32
32
|
"shadow2": "0 4px 6px -1px rgba(9, 9, 11, 0.08), 0 2px 4px -2px rgba(9, 9, 11, 0.06)",
|
|
33
33
|
"shadow3": "0 10px 15px -3px rgba(9, 9, 11, 0.1), 0 4px 6px -4px rgba(9, 9, 11, 0.08)"
|
package/src/styles/tokens.scss
CHANGED
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
--vita-hover: #f4f4f5; // 行 / 项 hover 背景
|
|
34
34
|
--vita-success: #16a34a;
|
|
35
35
|
--vita-warning: #f59e0b;
|
|
36
|
-
--vita-error: #
|
|
36
|
+
--vita-error: #dc2626;
|
|
37
37
|
--vita-shadow-1: 0 1px 2px 0 rgba(9, 9, 11, 0.05); // 浮层阴影 - 弱
|
|
38
38
|
--vita-shadow-2: 0 4px 6px -1px rgba(9, 9, 11, 0.08), 0 2px 4px -2px rgba(9, 9, 11, 0.06); // 浮层阴影 - 中
|
|
39
39
|
--vita-shadow-3: 0 10px 15px -3px rgba(9, 9, 11, 0.1), 0 4px 6px -4px rgba(9, 9, 11, 0.08); // 浮层阴影 - 强
|
package/src/styles/tokens.ts
CHANGED
|
@@ -145,7 +145,16 @@ export const toAntdTheme = (options?: {
|
|
|
145
145
|
|
|
146
146
|
colorText: t.foreground,
|
|
147
147
|
colorTextSecondary: t.mutedForeground,
|
|
148
|
-
|
|
148
|
+
// antd 有四档文字色，本套令牌只有三档，压缩时分界线要放对：
|
|
149
|
+
// tertiary 在 antd 里是**描述性的可读文字**（面包屑、表单 extra、Descriptions 的
|
|
150
|
+
// 标签都吃它），quaternary 才是占位与禁用。原来两档都指向 subtleForeground，
|
|
151
|
+
// 于是面包屑拿到了占位级的对比度 —— 浅色下 #a1a1aa 压白只有 2.56:1，
|
|
152
|
+
// 14px 正文按 WCAG AA 要 4.5:1，连大字号的 3:1 都不到（消费方实测）。
|
|
153
|
+
//
|
|
154
|
+
// 压深 subtleForeground 治不了：要够 4.5:1 得到 #767676，那已经和
|
|
155
|
+
// mutedForeground(#71717a, 4.83:1) 几乎同色，第三档等于不存在。
|
|
156
|
+
// 所以按语义分流 —— 可读的归 muted，只有占位/禁用留在 subtle。
|
|
157
|
+
colorTextTertiary: t.mutedForeground,
|
|
149
158
|
colorTextQuaternary: t.subtleForeground,
|
|
150
159
|
|
|
151
160
|
colorBgContainer: t.surface,
|