@pactor-app/chat 1.43.0 → 1.46.0
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/dist/chunk-TBPUSGKL.js +2633 -0
- package/dist/components/index.cjs +2651 -0
- package/dist/components/index.d.cts +793 -0
- package/dist/components/index.d.ts +793 -0
- package/dist/components/index.js +52 -0
- package/dist/download-DnP2uArc.d.cts +134 -0
- package/dist/download-DnP2uArc.d.ts +134 -0
- package/dist/index.cjs +3876 -1685
- package/dist/index.d.cts +41 -69
- package/dist/index.d.ts +41 -69
- package/dist/index.js +624 -1002
- package/package.json +28 -10
- package/styles.css +1154 -844
package/styles.css
CHANGED
|
@@ -1,32 +1,902 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
1
|
+
/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
|
|
2
|
+
@layer properties;
|
|
3
|
+
@layer theme {
|
|
4
|
+
:root, :host {
|
|
5
|
+
--spacing: 0.25rem;
|
|
6
|
+
--container-xl: 36rem;
|
|
7
|
+
--text-xs: 0.75rem;
|
|
8
|
+
--text-xs--line-height: calc(1 / 0.75);
|
|
9
|
+
--text-sm: 0.875rem;
|
|
10
|
+
--text-sm--line-height: calc(1.25 / 0.875);
|
|
11
|
+
--text-xl: 1.25rem;
|
|
12
|
+
--text-xl--line-height: calc(1.75 / 1.25);
|
|
13
|
+
--font-weight-medium: 500;
|
|
14
|
+
--font-weight-semibold: 600;
|
|
15
|
+
--animate-spin: spin 1s linear infinite;
|
|
16
|
+
--animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
|
|
17
|
+
--default-transition-duration: 150ms;
|
|
18
|
+
--default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
@layer utilities {
|
|
22
|
+
.\@container {
|
|
23
|
+
container-type: inline-size;
|
|
24
|
+
}
|
|
25
|
+
.pointer-events-none {
|
|
26
|
+
pointer-events: none;
|
|
27
|
+
}
|
|
28
|
+
.visible {
|
|
29
|
+
visibility: visible;
|
|
30
|
+
}
|
|
31
|
+
.absolute {
|
|
32
|
+
position: absolute;
|
|
33
|
+
}
|
|
34
|
+
.fixed {
|
|
35
|
+
position: fixed;
|
|
36
|
+
}
|
|
37
|
+
.relative {
|
|
38
|
+
position: relative;
|
|
39
|
+
}
|
|
40
|
+
.static {
|
|
41
|
+
position: static;
|
|
42
|
+
}
|
|
43
|
+
.inset-0 {
|
|
44
|
+
inset: 0px;
|
|
45
|
+
}
|
|
46
|
+
.top-0 {
|
|
47
|
+
top: 0px;
|
|
48
|
+
}
|
|
49
|
+
.top-1\/2 {
|
|
50
|
+
top: calc(1 / 2 * 100%);
|
|
51
|
+
}
|
|
52
|
+
.top-3 {
|
|
53
|
+
top: calc(var(--spacing) * 3);
|
|
54
|
+
}
|
|
55
|
+
.right-0 {
|
|
56
|
+
right: 0px;
|
|
57
|
+
}
|
|
58
|
+
.right-full {
|
|
59
|
+
right: 100%;
|
|
60
|
+
}
|
|
61
|
+
.bottom-full {
|
|
62
|
+
bottom: 100%;
|
|
63
|
+
}
|
|
64
|
+
.left-0 {
|
|
65
|
+
left: 0px;
|
|
66
|
+
}
|
|
67
|
+
.left-2 {
|
|
68
|
+
left: calc(var(--spacing) * 2);
|
|
69
|
+
}
|
|
70
|
+
.left-4 {
|
|
71
|
+
left: calc(var(--spacing) * 4);
|
|
72
|
+
}
|
|
73
|
+
.left-auto {
|
|
74
|
+
left: auto;
|
|
75
|
+
}
|
|
76
|
+
.z-10 {
|
|
77
|
+
z-index: 10;
|
|
78
|
+
}
|
|
79
|
+
.z-40 {
|
|
80
|
+
z-index: 40;
|
|
81
|
+
}
|
|
82
|
+
.z-50 {
|
|
83
|
+
z-index: 50;
|
|
84
|
+
}
|
|
85
|
+
.container {
|
|
86
|
+
width: 100%;
|
|
87
|
+
@media (width >= 40rem) {
|
|
88
|
+
max-width: 40rem;
|
|
89
|
+
}
|
|
90
|
+
@media (width >= 48rem) {
|
|
91
|
+
max-width: 48rem;
|
|
92
|
+
}
|
|
93
|
+
@media (width >= 64rem) {
|
|
94
|
+
max-width: 64rem;
|
|
95
|
+
}
|
|
96
|
+
@media (width >= 80rem) {
|
|
97
|
+
max-width: 80rem;
|
|
98
|
+
}
|
|
99
|
+
@media (width >= 96rem) {
|
|
100
|
+
max-width: 96rem;
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
.mx-0\.5 {
|
|
104
|
+
margin-inline: calc(var(--spacing) * 0.5);
|
|
105
|
+
}
|
|
106
|
+
.mx-auto {
|
|
107
|
+
margin-inline: auto;
|
|
108
|
+
}
|
|
109
|
+
.mt-0\.5 {
|
|
110
|
+
margin-top: calc(var(--spacing) * 0.5);
|
|
111
|
+
}
|
|
112
|
+
.mt-1 {
|
|
113
|
+
margin-top: var(--spacing);
|
|
114
|
+
}
|
|
115
|
+
.mt-2 {
|
|
116
|
+
margin-top: calc(var(--spacing) * 2);
|
|
117
|
+
}
|
|
118
|
+
.mr-2 {
|
|
119
|
+
margin-right: calc(var(--spacing) * 2);
|
|
120
|
+
}
|
|
121
|
+
.mb-1 {
|
|
122
|
+
margin-bottom: var(--spacing);
|
|
123
|
+
}
|
|
124
|
+
.mb-2 {
|
|
125
|
+
margin-bottom: calc(var(--spacing) * 2);
|
|
126
|
+
}
|
|
127
|
+
.ml-0\.5 {
|
|
128
|
+
margin-left: calc(var(--spacing) * 0.5);
|
|
129
|
+
}
|
|
130
|
+
.ml-5 {
|
|
131
|
+
margin-left: calc(var(--spacing) * 5);
|
|
132
|
+
}
|
|
133
|
+
.line-clamp-3 {
|
|
134
|
+
overflow: hidden;
|
|
135
|
+
display: -webkit-box;
|
|
136
|
+
-webkit-box-orient: vertical;
|
|
137
|
+
-webkit-line-clamp: 3;
|
|
138
|
+
}
|
|
139
|
+
.block {
|
|
140
|
+
display: block;
|
|
141
|
+
}
|
|
142
|
+
.flex {
|
|
143
|
+
display: flex;
|
|
144
|
+
}
|
|
145
|
+
.grid {
|
|
146
|
+
display: grid;
|
|
147
|
+
}
|
|
148
|
+
.hidden {
|
|
149
|
+
display: none;
|
|
150
|
+
}
|
|
151
|
+
.inline {
|
|
152
|
+
display: inline;
|
|
153
|
+
}
|
|
154
|
+
.inline-block {
|
|
155
|
+
display: inline-block;
|
|
156
|
+
}
|
|
157
|
+
.inline-flex {
|
|
158
|
+
display: inline-flex;
|
|
159
|
+
}
|
|
160
|
+
.table {
|
|
161
|
+
display: table;
|
|
162
|
+
}
|
|
163
|
+
.scrollbar-subtle {
|
|
164
|
+
scrollbar-width: thin;
|
|
165
|
+
scrollbar-color: var(--muted-foreground) transparent;
|
|
166
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
167
|
+
scrollbar-color: color-mix(in oklch, var(--muted-foreground) 30%, transparent) transparent;
|
|
168
|
+
}
|
|
169
|
+
&::-webkit-scrollbar {
|
|
170
|
+
width: 6px;
|
|
171
|
+
height: 6px;
|
|
172
|
+
}
|
|
173
|
+
&::-webkit-scrollbar-track {
|
|
174
|
+
background: transparent;
|
|
175
|
+
}
|
|
176
|
+
&::-webkit-scrollbar-thumb {
|
|
177
|
+
background: var(--muted-foreground);
|
|
178
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
179
|
+
background: color-mix(in oklch, var(--muted-foreground) 25%, transparent);
|
|
180
|
+
}
|
|
181
|
+
border-radius: 999px;
|
|
182
|
+
}
|
|
183
|
+
&::-webkit-scrollbar-thumb:hover {
|
|
184
|
+
background: var(--muted-foreground);
|
|
185
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
186
|
+
background: color-mix(in oklch, var(--muted-foreground) 45%, transparent);
|
|
187
|
+
}
|
|
188
|
+
}
|
|
189
|
+
&::-webkit-scrollbar-corner {
|
|
190
|
+
background: transparent;
|
|
191
|
+
}
|
|
192
|
+
}
|
|
193
|
+
.size-1\.5 {
|
|
194
|
+
width: calc(var(--spacing) * 1.5);
|
|
195
|
+
height: calc(var(--spacing) * 1.5);
|
|
196
|
+
}
|
|
197
|
+
.size-7 {
|
|
198
|
+
width: calc(var(--spacing) * 7);
|
|
199
|
+
height: calc(var(--spacing) * 7);
|
|
200
|
+
}
|
|
201
|
+
.h-1 {
|
|
202
|
+
height: var(--spacing);
|
|
203
|
+
}
|
|
204
|
+
.h-5 {
|
|
205
|
+
height: calc(var(--spacing) * 5);
|
|
206
|
+
}
|
|
207
|
+
.h-8 {
|
|
208
|
+
height: calc(var(--spacing) * 8);
|
|
209
|
+
}
|
|
210
|
+
.h-full {
|
|
211
|
+
height: 100%;
|
|
212
|
+
}
|
|
213
|
+
.max-h-72 {
|
|
214
|
+
max-height: calc(var(--spacing) * 72);
|
|
215
|
+
}
|
|
216
|
+
.max-h-\[40\%\] {
|
|
217
|
+
max-height: 40%;
|
|
218
|
+
}
|
|
219
|
+
.min-h-0 {
|
|
220
|
+
min-height: 0px;
|
|
221
|
+
}
|
|
222
|
+
.min-h-\[60px\] {
|
|
223
|
+
min-height: 60px;
|
|
224
|
+
}
|
|
225
|
+
.w-\(--pactor-chat-rail-width\) {
|
|
226
|
+
width: var(--pactor-chat-rail-width);
|
|
227
|
+
}
|
|
228
|
+
.w-1 {
|
|
229
|
+
width: var(--spacing);
|
|
230
|
+
}
|
|
231
|
+
.w-4 {
|
|
232
|
+
width: calc(var(--spacing) * 4);
|
|
233
|
+
}
|
|
234
|
+
.w-48 {
|
|
235
|
+
width: calc(var(--spacing) * 48);
|
|
236
|
+
}
|
|
237
|
+
.w-56 {
|
|
238
|
+
width: calc(var(--spacing) * 56);
|
|
239
|
+
}
|
|
240
|
+
.w-64 {
|
|
241
|
+
width: calc(var(--spacing) * 64);
|
|
242
|
+
}
|
|
243
|
+
.w-72 {
|
|
244
|
+
width: calc(var(--spacing) * 72);
|
|
245
|
+
}
|
|
246
|
+
.w-\[52px\] {
|
|
247
|
+
width: 52px;
|
|
248
|
+
}
|
|
249
|
+
.w-\[61\.8cqw\] {
|
|
250
|
+
width: 61.8cqw;
|
|
251
|
+
}
|
|
252
|
+
.w-\[250px\] {
|
|
253
|
+
width: 250px;
|
|
254
|
+
}
|
|
255
|
+
.w-fit {
|
|
256
|
+
width: fit-content;
|
|
257
|
+
}
|
|
258
|
+
.w-full {
|
|
259
|
+
width: 100%;
|
|
260
|
+
}
|
|
261
|
+
.max-w-full {
|
|
262
|
+
max-width: 100%;
|
|
263
|
+
}
|
|
264
|
+
.max-w-xl {
|
|
265
|
+
max-width: var(--container-xl);
|
|
266
|
+
}
|
|
267
|
+
.min-w-0 {
|
|
268
|
+
min-width: 0px;
|
|
269
|
+
}
|
|
270
|
+
.flex-1 {
|
|
271
|
+
flex: 1;
|
|
272
|
+
}
|
|
273
|
+
.shrink-0 {
|
|
274
|
+
flex-shrink: 0;
|
|
275
|
+
}
|
|
276
|
+
.-translate-y-1\/2 {
|
|
277
|
+
--tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
|
|
278
|
+
translate: var(--tw-translate-x) var(--tw-translate-y);
|
|
279
|
+
}
|
|
280
|
+
.animate-pulse {
|
|
281
|
+
animation: var(--animate-pulse);
|
|
282
|
+
}
|
|
283
|
+
.animate-spin {
|
|
284
|
+
animation: var(--animate-spin);
|
|
285
|
+
}
|
|
286
|
+
.cursor-col-resize {
|
|
287
|
+
cursor: col-resize;
|
|
288
|
+
}
|
|
289
|
+
.cursor-pointer {
|
|
290
|
+
cursor: pointer;
|
|
291
|
+
}
|
|
292
|
+
.touch-none {
|
|
293
|
+
touch-action: none;
|
|
294
|
+
}
|
|
295
|
+
.grid-cols-1 {
|
|
296
|
+
grid-template-columns: repeat(1, minmax(0, 1fr));
|
|
297
|
+
}
|
|
298
|
+
.flex-col {
|
|
299
|
+
flex-direction: column;
|
|
300
|
+
}
|
|
301
|
+
.flex-row-reverse {
|
|
302
|
+
flex-direction: row-reverse;
|
|
303
|
+
}
|
|
304
|
+
.flex-wrap {
|
|
305
|
+
flex-wrap: wrap;
|
|
306
|
+
}
|
|
307
|
+
.items-baseline {
|
|
308
|
+
align-items: baseline;
|
|
309
|
+
}
|
|
310
|
+
.items-center {
|
|
311
|
+
align-items: center;
|
|
312
|
+
}
|
|
313
|
+
.items-end {
|
|
314
|
+
align-items: flex-end;
|
|
315
|
+
}
|
|
316
|
+
.items-start {
|
|
317
|
+
align-items: flex-start;
|
|
318
|
+
}
|
|
319
|
+
.justify-between {
|
|
320
|
+
justify-content: space-between;
|
|
321
|
+
}
|
|
322
|
+
.justify-center {
|
|
323
|
+
justify-content: center;
|
|
324
|
+
}
|
|
325
|
+
.justify-end {
|
|
326
|
+
justify-content: flex-end;
|
|
327
|
+
}
|
|
328
|
+
.gap-0\.5 {
|
|
329
|
+
gap: calc(var(--spacing) * 0.5);
|
|
330
|
+
}
|
|
331
|
+
.gap-1 {
|
|
332
|
+
gap: var(--spacing);
|
|
333
|
+
}
|
|
334
|
+
.gap-1\.5 {
|
|
335
|
+
gap: calc(var(--spacing) * 1.5);
|
|
336
|
+
}
|
|
337
|
+
.gap-2 {
|
|
338
|
+
gap: calc(var(--spacing) * 2);
|
|
339
|
+
}
|
|
340
|
+
.gap-2\.5 {
|
|
341
|
+
gap: calc(var(--spacing) * 2.5);
|
|
342
|
+
}
|
|
343
|
+
.gap-3 {
|
|
344
|
+
gap: calc(var(--spacing) * 3);
|
|
345
|
+
}
|
|
346
|
+
.gap-4 {
|
|
347
|
+
gap: calc(var(--spacing) * 4);
|
|
348
|
+
}
|
|
349
|
+
.truncate {
|
|
350
|
+
overflow: hidden;
|
|
351
|
+
text-overflow: ellipsis;
|
|
352
|
+
white-space: nowrap;
|
|
353
|
+
}
|
|
354
|
+
.overflow-auto {
|
|
355
|
+
overflow: auto;
|
|
356
|
+
}
|
|
357
|
+
.overflow-hidden {
|
|
358
|
+
overflow: hidden;
|
|
359
|
+
}
|
|
360
|
+
.overflow-x-auto {
|
|
361
|
+
overflow-x: auto;
|
|
362
|
+
}
|
|
363
|
+
.overflow-y-auto {
|
|
364
|
+
overflow-y: auto;
|
|
365
|
+
}
|
|
366
|
+
.rounded-full {
|
|
367
|
+
border-radius: calc(infinity * 1px);
|
|
368
|
+
}
|
|
369
|
+
.rounded-lg {
|
|
370
|
+
border-radius: var(--radius);
|
|
371
|
+
}
|
|
372
|
+
.rounded-md {
|
|
373
|
+
border-radius: calc(var(--radius) * 0.8);
|
|
374
|
+
}
|
|
375
|
+
.rounded-sm {
|
|
376
|
+
border-radius: calc(var(--radius) * 0.6);
|
|
377
|
+
}
|
|
378
|
+
.rounded-xl {
|
|
379
|
+
border-radius: calc(var(--radius) * 1.4);
|
|
380
|
+
}
|
|
381
|
+
.border {
|
|
382
|
+
border-style: var(--tw-border-style);
|
|
383
|
+
border-width: 1px;
|
|
384
|
+
}
|
|
385
|
+
.border-t {
|
|
386
|
+
border-top-style: var(--tw-border-style);
|
|
387
|
+
border-top-width: 1px;
|
|
388
|
+
}
|
|
389
|
+
.border-r {
|
|
390
|
+
border-right-style: var(--tw-border-style);
|
|
391
|
+
border-right-width: 1px;
|
|
392
|
+
}
|
|
393
|
+
.border-b {
|
|
394
|
+
border-bottom-style: var(--tw-border-style);
|
|
395
|
+
border-bottom-width: 1px;
|
|
396
|
+
}
|
|
397
|
+
.border-l {
|
|
398
|
+
border-left-style: var(--tw-border-style);
|
|
399
|
+
border-left-width: 1px;
|
|
400
|
+
}
|
|
401
|
+
.border-dashed {
|
|
402
|
+
--tw-border-style: dashed;
|
|
403
|
+
border-style: dashed;
|
|
404
|
+
}
|
|
405
|
+
.border-border {
|
|
406
|
+
border-color: var(--border);
|
|
407
|
+
}
|
|
408
|
+
.bg-accent {
|
|
409
|
+
background-color: var(--accent);
|
|
410
|
+
}
|
|
411
|
+
.bg-background {
|
|
412
|
+
background-color: var(--background);
|
|
413
|
+
}
|
|
414
|
+
.bg-muted {
|
|
415
|
+
background-color: var(--muted);
|
|
416
|
+
}
|
|
417
|
+
.bg-muted-foreground\/50 {
|
|
418
|
+
background-color: var(--muted-foreground);
|
|
419
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
420
|
+
background-color: color-mix(in oklab, var(--muted-foreground) 50%, transparent);
|
|
421
|
+
}
|
|
422
|
+
}
|
|
423
|
+
.bg-popover {
|
|
424
|
+
background-color: var(--popover);
|
|
425
|
+
}
|
|
426
|
+
.bg-primary {
|
|
427
|
+
background-color: var(--primary);
|
|
428
|
+
}
|
|
429
|
+
.p-1 {
|
|
430
|
+
padding: var(--spacing);
|
|
431
|
+
}
|
|
432
|
+
.p-1\.5 {
|
|
433
|
+
padding: calc(var(--spacing) * 1.5);
|
|
434
|
+
}
|
|
435
|
+
.p-2 {
|
|
436
|
+
padding: calc(var(--spacing) * 2);
|
|
437
|
+
}
|
|
438
|
+
.p-3 {
|
|
439
|
+
padding: calc(var(--spacing) * 3);
|
|
440
|
+
}
|
|
441
|
+
.p-4 {
|
|
442
|
+
padding: calc(var(--spacing) * 4);
|
|
443
|
+
}
|
|
444
|
+
.px-1 {
|
|
445
|
+
padding-inline: var(--spacing);
|
|
446
|
+
}
|
|
447
|
+
.px-1\.5 {
|
|
448
|
+
padding-inline: calc(var(--spacing) * 1.5);
|
|
449
|
+
}
|
|
450
|
+
.px-2 {
|
|
451
|
+
padding-inline: calc(var(--spacing) * 2);
|
|
452
|
+
}
|
|
453
|
+
.px-3 {
|
|
454
|
+
padding-inline: calc(var(--spacing) * 3);
|
|
455
|
+
}
|
|
456
|
+
.px-3\.5 {
|
|
457
|
+
padding-inline: calc(var(--spacing) * 3.5);
|
|
458
|
+
}
|
|
459
|
+
.px-4 {
|
|
460
|
+
padding-inline: calc(var(--spacing) * 4);
|
|
461
|
+
}
|
|
462
|
+
.py-0\.5 {
|
|
463
|
+
padding-block: calc(var(--spacing) * 0.5);
|
|
464
|
+
}
|
|
465
|
+
.py-1 {
|
|
466
|
+
padding-block: var(--spacing);
|
|
467
|
+
}
|
|
468
|
+
.py-1\.5 {
|
|
469
|
+
padding-block: calc(var(--spacing) * 1.5);
|
|
470
|
+
}
|
|
471
|
+
.py-2 {
|
|
472
|
+
padding-block: calc(var(--spacing) * 2);
|
|
473
|
+
}
|
|
474
|
+
.py-2\.5 {
|
|
475
|
+
padding-block: calc(var(--spacing) * 2.5);
|
|
476
|
+
}
|
|
477
|
+
.py-3 {
|
|
478
|
+
padding-block: calc(var(--spacing) * 3);
|
|
479
|
+
}
|
|
480
|
+
.py-4 {
|
|
481
|
+
padding-block: calc(var(--spacing) * 4);
|
|
482
|
+
}
|
|
483
|
+
.py-10 {
|
|
484
|
+
padding-block: calc(var(--spacing) * 10);
|
|
485
|
+
}
|
|
486
|
+
.pt-2 {
|
|
487
|
+
padding-top: calc(var(--spacing) * 2);
|
|
488
|
+
}
|
|
489
|
+
.pt-3 {
|
|
490
|
+
padding-top: calc(var(--spacing) * 3);
|
|
491
|
+
}
|
|
492
|
+
.pr-2 {
|
|
493
|
+
padding-right: calc(var(--spacing) * 2);
|
|
494
|
+
}
|
|
495
|
+
.pb-1 {
|
|
496
|
+
padding-bottom: var(--spacing);
|
|
497
|
+
}
|
|
498
|
+
.pb-2 {
|
|
499
|
+
padding-bottom: calc(var(--spacing) * 2);
|
|
500
|
+
}
|
|
501
|
+
.pl-4 {
|
|
502
|
+
padding-left: calc(var(--spacing) * 4);
|
|
503
|
+
}
|
|
504
|
+
.pl-5 {
|
|
505
|
+
padding-left: calc(var(--spacing) * 5);
|
|
506
|
+
}
|
|
507
|
+
.pl-6 {
|
|
508
|
+
padding-left: calc(var(--spacing) * 6);
|
|
509
|
+
}
|
|
510
|
+
.pl-7 {
|
|
511
|
+
padding-left: calc(var(--spacing) * 7);
|
|
512
|
+
}
|
|
513
|
+
.text-center {
|
|
514
|
+
text-align: center;
|
|
515
|
+
}
|
|
516
|
+
.text-left {
|
|
517
|
+
text-align: left;
|
|
518
|
+
}
|
|
519
|
+
.align-middle {
|
|
520
|
+
vertical-align: middle;
|
|
521
|
+
}
|
|
522
|
+
.align-super {
|
|
523
|
+
vertical-align: super;
|
|
524
|
+
}
|
|
525
|
+
.text-sm {
|
|
526
|
+
font-size: var(--text-sm);
|
|
527
|
+
line-height: var(--tw-leading, var(--text-sm--line-height));
|
|
528
|
+
}
|
|
529
|
+
.text-xl {
|
|
530
|
+
font-size: var(--text-xl);
|
|
531
|
+
line-height: var(--tw-leading, var(--text-xl--line-height));
|
|
532
|
+
}
|
|
533
|
+
.text-xs {
|
|
534
|
+
font-size: var(--text-xs);
|
|
535
|
+
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
536
|
+
}
|
|
537
|
+
.text-\[13px\] {
|
|
538
|
+
font-size: 13px;
|
|
539
|
+
}
|
|
540
|
+
.leading-4 {
|
|
541
|
+
--tw-leading: calc(var(--spacing) * 4);
|
|
542
|
+
line-height: calc(var(--spacing) * 4);
|
|
543
|
+
}
|
|
544
|
+
.leading-5 {
|
|
545
|
+
--tw-leading: calc(var(--spacing) * 5);
|
|
546
|
+
line-height: calc(var(--spacing) * 5);
|
|
547
|
+
}
|
|
548
|
+
.leading-\[18px\] {
|
|
549
|
+
--tw-leading: 18px;
|
|
550
|
+
line-height: 18px;
|
|
551
|
+
}
|
|
552
|
+
.font-medium {
|
|
553
|
+
--tw-font-weight: var(--font-weight-medium);
|
|
554
|
+
font-weight: var(--font-weight-medium);
|
|
555
|
+
}
|
|
556
|
+
.font-semibold {
|
|
557
|
+
--tw-font-weight: var(--font-weight-semibold);
|
|
558
|
+
font-weight: var(--font-weight-semibold);
|
|
559
|
+
}
|
|
560
|
+
.break-words {
|
|
561
|
+
overflow-wrap: break-word;
|
|
562
|
+
}
|
|
563
|
+
.whitespace-pre-wrap {
|
|
564
|
+
white-space: pre-wrap;
|
|
565
|
+
}
|
|
566
|
+
.text-accent-foreground {
|
|
567
|
+
color: var(--accent-foreground);
|
|
568
|
+
}
|
|
569
|
+
.text-destructive {
|
|
570
|
+
color: var(--destructive);
|
|
571
|
+
}
|
|
572
|
+
.text-foreground {
|
|
573
|
+
color: var(--foreground);
|
|
574
|
+
}
|
|
575
|
+
.text-info {
|
|
576
|
+
color: var(--info);
|
|
577
|
+
}
|
|
578
|
+
.text-muted-foreground {
|
|
579
|
+
color: var(--muted-foreground);
|
|
580
|
+
}
|
|
581
|
+
.text-popover-foreground {
|
|
582
|
+
color: var(--popover-foreground);
|
|
583
|
+
}
|
|
584
|
+
.text-primary {
|
|
585
|
+
color: var(--primary);
|
|
586
|
+
}
|
|
587
|
+
.text-success {
|
|
588
|
+
color: var(--success);
|
|
589
|
+
}
|
|
590
|
+
.text-warning {
|
|
591
|
+
color: var(--warning);
|
|
592
|
+
}
|
|
593
|
+
.opacity-0 {
|
|
594
|
+
opacity: 0%;
|
|
595
|
+
}
|
|
596
|
+
.shadow-md {
|
|
597
|
+
--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
|
|
598
|
+
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
599
|
+
}
|
|
600
|
+
.ring-2 {
|
|
601
|
+
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
|
|
602
|
+
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
603
|
+
}
|
|
604
|
+
.ring-ring\/50 {
|
|
605
|
+
--tw-ring-color: var(--ring);
|
|
606
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
607
|
+
--tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
|
|
608
|
+
}
|
|
609
|
+
}
|
|
610
|
+
.outline {
|
|
611
|
+
outline-style: var(--tw-outline-style);
|
|
612
|
+
outline-width: 1px;
|
|
613
|
+
}
|
|
614
|
+
.blur {
|
|
615
|
+
--tw-blur: blur(8px);
|
|
616
|
+
filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
|
|
617
|
+
}
|
|
618
|
+
.transition-\[width\] {
|
|
619
|
+
transition-property: width;
|
|
620
|
+
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
621
|
+
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
622
|
+
}
|
|
623
|
+
.transition-colors {
|
|
624
|
+
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
|
|
625
|
+
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
626
|
+
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
627
|
+
}
|
|
628
|
+
.transition-transform {
|
|
629
|
+
transition-property: transform, translate, scale, rotate;
|
|
630
|
+
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
631
|
+
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
632
|
+
}
|
|
633
|
+
.outline-none {
|
|
634
|
+
--tw-outline-style: none;
|
|
635
|
+
outline-style: none;
|
|
636
|
+
}
|
|
637
|
+
@media (hover: hover) {
|
|
638
|
+
.group-hover\:opacity-100:is(:where(.group):hover *) {
|
|
639
|
+
opacity: 100%;
|
|
640
|
+
}
|
|
641
|
+
}
|
|
642
|
+
.not-last\:before\:absolute:not(:last-child)::before {
|
|
643
|
+
content: var(--tw-content);
|
|
644
|
+
position: absolute;
|
|
645
|
+
}
|
|
646
|
+
.not-last\:before\:top-7:not(:last-child)::before {
|
|
647
|
+
content: var(--tw-content);
|
|
648
|
+
top: calc(var(--spacing) * 7);
|
|
649
|
+
}
|
|
650
|
+
.not-last\:before\:-bottom-1:not(:last-child)::before {
|
|
651
|
+
content: var(--tw-content);
|
|
652
|
+
bottom: calc(var(--spacing) * -1);
|
|
653
|
+
}
|
|
654
|
+
.not-last\:before\:left-\[7\.5px\]:not(:last-child)::before {
|
|
655
|
+
content: var(--tw-content);
|
|
656
|
+
left: 7.5px;
|
|
657
|
+
}
|
|
658
|
+
.not-last\:before\:w-px:not(:last-child)::before {
|
|
659
|
+
content: var(--tw-content);
|
|
660
|
+
width: 1px;
|
|
661
|
+
}
|
|
662
|
+
.not-last\:before\:bg-border:not(:last-child)::before {
|
|
663
|
+
content: var(--tw-content);
|
|
664
|
+
background-color: var(--border);
|
|
665
|
+
}
|
|
666
|
+
.not-last\:before\:content-\[\"\"\]:not(:last-child)::before {
|
|
667
|
+
--tw-content: "";
|
|
668
|
+
content: var(--tw-content);
|
|
669
|
+
}
|
|
670
|
+
@media (hover: hover) {
|
|
671
|
+
.hover\:border-primary:hover {
|
|
672
|
+
border-color: var(--primary);
|
|
673
|
+
}
|
|
674
|
+
.hover\:bg-accent:hover {
|
|
675
|
+
background-color: var(--accent);
|
|
676
|
+
}
|
|
677
|
+
.hover\:text-destructive:hover {
|
|
678
|
+
color: var(--destructive);
|
|
679
|
+
}
|
|
680
|
+
.hover\:text-foreground:hover {
|
|
681
|
+
color: var(--foreground);
|
|
682
|
+
}
|
|
683
|
+
.hover\:underline:hover {
|
|
684
|
+
text-decoration-line: underline;
|
|
685
|
+
}
|
|
686
|
+
.hover\:opacity-80:hover {
|
|
687
|
+
opacity: 80%;
|
|
688
|
+
}
|
|
689
|
+
}
|
|
690
|
+
.focus-visible\:ring-\[3px\]:focus-visible {
|
|
691
|
+
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
|
|
692
|
+
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
693
|
+
}
|
|
694
|
+
.focus-visible\:ring-ring\/50:focus-visible {
|
|
695
|
+
--tw-ring-color: var(--ring);
|
|
696
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
697
|
+
--tw-ring-color: color-mix(in oklab, var(--ring) 50%, transparent);
|
|
698
|
+
}
|
|
699
|
+
}
|
|
700
|
+
.disabled\:pointer-events-none:disabled {
|
|
701
|
+
pointer-events: none;
|
|
702
|
+
}
|
|
703
|
+
.disabled\:opacity-50:disabled {
|
|
704
|
+
opacity: 50%;
|
|
705
|
+
}
|
|
706
|
+
.data-\[active\=true\]\:bg-accent[data-active="true"] {
|
|
707
|
+
background-color: var(--accent);
|
|
708
|
+
}
|
|
709
|
+
.data-\[open\=true\]\:rotate-90[data-open="true"] {
|
|
710
|
+
rotate: 90deg;
|
|
711
|
+
}
|
|
712
|
+
@media (prefers-reduced-motion: reduce) {
|
|
713
|
+
.motion-reduce\:animate-none {
|
|
714
|
+
animation: none;
|
|
715
|
+
}
|
|
716
|
+
}
|
|
717
|
+
@media (width >= 40rem) {
|
|
718
|
+
.sm\:grid-cols-2 {
|
|
719
|
+
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
720
|
+
}
|
|
721
|
+
}
|
|
722
|
+
}
|
|
723
|
+
.pactor-markdown {
|
|
724
|
+
--pactor-markdown-fg: var(--foreground, light-dark(#1f2328, #e6edf3));
|
|
725
|
+
--pactor-markdown-muted-fg: var(--muted-foreground, light-dark(#59636e, #9198a1));
|
|
726
|
+
--pactor-markdown-border: var(--border, light-dark(#d1d9e0, #3d444d));
|
|
727
|
+
--pactor-markdown-muted-bg: var(--muted, light-dark(#f6f8fa, #262c36));
|
|
728
|
+
--pactor-markdown-code-bg: var(--muted, light-dark(#eff1f3, #2a3139));
|
|
729
|
+
--pactor-markdown-link: var(--primary, light-dark(#0969da, #4493f8));
|
|
730
|
+
--pactor-markdown-quote-border: var(--border, light-dark(#d1d9e0, #3d444d));
|
|
731
|
+
--pactor-markdown-radius: var(--radius, 6px);
|
|
732
|
+
color: var(--pactor-markdown-fg);
|
|
733
|
+
line-height: 1.75;
|
|
734
|
+
overflow-wrap: break-word;
|
|
735
|
+
}
|
|
736
|
+
.pactor-markdown > :first-child {
|
|
737
|
+
margin-top: 0;
|
|
738
|
+
}
|
|
739
|
+
.pactor-markdown > :last-child {
|
|
740
|
+
margin-bottom: 0;
|
|
741
|
+
}
|
|
742
|
+
.pactor-markdown h1, .pactor-markdown h2, .pactor-markdown h3, .pactor-markdown h4, .pactor-markdown h5, .pactor-markdown h6 {
|
|
743
|
+
margin: 1.4em 0 0.6em;
|
|
744
|
+
font-weight: 600;
|
|
745
|
+
line-height: 1.35;
|
|
746
|
+
}
|
|
747
|
+
.pactor-markdown h1 {
|
|
748
|
+
font-size: 1.5em;
|
|
749
|
+
padding-bottom: 0.3em;
|
|
750
|
+
border-bottom: 1px solid var(--pactor-markdown-border);
|
|
751
|
+
}
|
|
752
|
+
.pactor-markdown h2 {
|
|
753
|
+
font-size: 1.3em;
|
|
754
|
+
padding-bottom: 0.25em;
|
|
755
|
+
border-bottom: 1px solid var(--pactor-markdown-border);
|
|
756
|
+
}
|
|
757
|
+
.pactor-markdown h3 {
|
|
758
|
+
font-size: 1.15em;
|
|
759
|
+
}
|
|
760
|
+
.pactor-markdown h4 {
|
|
761
|
+
font-size: 1.05em;
|
|
762
|
+
}
|
|
763
|
+
.pactor-markdown h5, .pactor-markdown h6 {
|
|
764
|
+
font-size: 1em;
|
|
765
|
+
}
|
|
766
|
+
.pactor-markdown h6 {
|
|
767
|
+
color: var(--pactor-markdown-muted-fg);
|
|
768
|
+
}
|
|
769
|
+
.pactor-markdown p {
|
|
770
|
+
margin: 0.75em 0;
|
|
771
|
+
}
|
|
772
|
+
.pactor-markdown ul, .pactor-markdown ol {
|
|
773
|
+
margin: 0.75em 0;
|
|
774
|
+
padding-left: 1.6em;
|
|
775
|
+
}
|
|
776
|
+
.pactor-markdown ul {
|
|
777
|
+
list-style: disc;
|
|
778
|
+
}
|
|
779
|
+
.pactor-markdown ul ul {
|
|
780
|
+
list-style: circle;
|
|
781
|
+
}
|
|
782
|
+
.pactor-markdown ul ul ul {
|
|
783
|
+
list-style: square;
|
|
784
|
+
}
|
|
785
|
+
.pactor-markdown ol {
|
|
786
|
+
list-style: decimal;
|
|
787
|
+
}
|
|
788
|
+
.pactor-markdown li::marker {
|
|
789
|
+
color: var(--pactor-markdown-muted-fg);
|
|
790
|
+
}
|
|
791
|
+
.pactor-markdown li + li {
|
|
792
|
+
margin-top: 0.3em;
|
|
793
|
+
}
|
|
794
|
+
.pactor-markdown li > ul, .pactor-markdown li > ol {
|
|
795
|
+
margin: 0.3em 0;
|
|
796
|
+
}
|
|
797
|
+
.pactor-markdown li input[type='checkbox'] {
|
|
798
|
+
margin: 0 0.45em 0 0;
|
|
799
|
+
vertical-align: -0.1em;
|
|
800
|
+
}
|
|
801
|
+
.pactor-markdown li:has(> input[type='checkbox']:first-child) {
|
|
802
|
+
list-style: none;
|
|
803
|
+
margin-left: -1.6em;
|
|
804
|
+
}
|
|
805
|
+
.pactor-markdown blockquote {
|
|
806
|
+
margin: 0.75em 0;
|
|
807
|
+
padding: 0.4em 1em;
|
|
808
|
+
border-left: 3px solid var(--pactor-markdown-quote-border);
|
|
809
|
+
border-radius: 0 var(--pactor-markdown-radius) var(--pactor-markdown-radius) 0;
|
|
810
|
+
background: var(--pactor-markdown-muted-bg);
|
|
811
|
+
color: var(--pactor-markdown-muted-fg);
|
|
812
|
+
}
|
|
813
|
+
.pactor-markdown blockquote > :first-child {
|
|
814
|
+
margin-top: 0;
|
|
815
|
+
}
|
|
816
|
+
.pactor-markdown blockquote > :last-child {
|
|
817
|
+
margin-bottom: 0;
|
|
818
|
+
}
|
|
819
|
+
.pactor-markdown hr {
|
|
820
|
+
margin: 1.5em 0;
|
|
821
|
+
border: 0;
|
|
822
|
+
border-top: 1px solid var(--pactor-markdown-border);
|
|
823
|
+
}
|
|
824
|
+
.pactor-markdown a {
|
|
825
|
+
color: var(--pactor-markdown-link);
|
|
826
|
+
text-decoration: none;
|
|
827
|
+
}
|
|
828
|
+
.pactor-markdown a:hover {
|
|
829
|
+
text-decoration: underline;
|
|
830
|
+
}
|
|
831
|
+
.pactor-markdown strong {
|
|
832
|
+
font-weight: 600;
|
|
833
|
+
}
|
|
834
|
+
.pactor-markdown mark {
|
|
835
|
+
padding: 0 0.2em;
|
|
836
|
+
border-radius: 3px;
|
|
837
|
+
}
|
|
838
|
+
.pactor-markdown code, .pactor-markdown pre {
|
|
839
|
+
font-family: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace;
|
|
840
|
+
}
|
|
841
|
+
.pactor-markdown :not(pre) > code {
|
|
842
|
+
padding: 0.15em 0.4em;
|
|
843
|
+
border-radius: 4px;
|
|
844
|
+
background: var(--pactor-markdown-code-bg);
|
|
845
|
+
font-size: 0.875em;
|
|
846
|
+
}
|
|
847
|
+
.pactor-markdown pre {
|
|
848
|
+
margin: 0.85em 0;
|
|
849
|
+
padding: 12px 14px;
|
|
850
|
+
border: 1px solid var(--pactor-markdown-border);
|
|
851
|
+
border-radius: var(--pactor-markdown-radius);
|
|
852
|
+
background: var(--pactor-markdown-muted-bg);
|
|
853
|
+
font-size: 0.875em;
|
|
854
|
+
line-height: 1.6;
|
|
855
|
+
overflow-x: auto;
|
|
856
|
+
}
|
|
857
|
+
.pactor-markdown pre > code {
|
|
858
|
+
padding: 0;
|
|
859
|
+
border: 0;
|
|
860
|
+
background: transparent;
|
|
861
|
+
font-size: inherit;
|
|
862
|
+
}
|
|
863
|
+
.pactor-markdown table {
|
|
864
|
+
display: block;
|
|
865
|
+
width: max-content;
|
|
866
|
+
max-width: 100%;
|
|
867
|
+
margin: 0.85em 0;
|
|
868
|
+
border-collapse: collapse;
|
|
869
|
+
overflow-x: auto;
|
|
870
|
+
font-size: 0.925em;
|
|
871
|
+
}
|
|
872
|
+
.pactor-markdown th, .pactor-markdown td {
|
|
873
|
+
padding: 6px 14px;
|
|
874
|
+
border: 1px solid var(--pactor-markdown-border);
|
|
875
|
+
}
|
|
876
|
+
.pactor-markdown th {
|
|
877
|
+
background: var(--pactor-markdown-muted-bg);
|
|
878
|
+
font-weight: 600;
|
|
879
|
+
}
|
|
880
|
+
.pactor-markdown tr:nth-child(even) td {
|
|
881
|
+
background: var(--pactor-markdown-muted-bg);
|
|
882
|
+
}
|
|
883
|
+
.pactor-markdown img {
|
|
884
|
+
max-width: 100%;
|
|
885
|
+
border-radius: var(--pactor-markdown-radius);
|
|
886
|
+
box-sizing: border-box;
|
|
887
|
+
}
|
|
888
|
+
.pactor-markdown .katex {
|
|
889
|
+
font-size: 1.05em;
|
|
890
|
+
}
|
|
891
|
+
.pactor-markdown .katex-display {
|
|
892
|
+
margin: 0.85em 0;
|
|
893
|
+
padding: 4px 0;
|
|
894
|
+
overflow-x: auto;
|
|
895
|
+
overflow-y: hidden;
|
|
896
|
+
}
|
|
27
897
|
:root {
|
|
28
|
-
|
|
29
|
-
|
|
898
|
+
--pactor-chat-rail-width: 40px;
|
|
899
|
+
--pactor-chat-rail-popover-width: 320px;
|
|
30
900
|
--pactor-chat-bg: var(--background, #f7f6f4);
|
|
31
901
|
--pactor-chat-sidebar-bg: var(--sidebar, #efedea);
|
|
32
902
|
--pactor-chat-fg: var(--foreground, #1a1d26);
|
|
@@ -37,26 +907,32 @@
|
|
|
37
907
|
--pactor-chat-primary: var(--primary, #3c47dd);
|
|
38
908
|
--pactor-chat-primary-fg: var(--primary-foreground, #ffffff);
|
|
39
909
|
--pactor-chat-danger: var(--destructive, #d4380d);
|
|
40
|
-
--pactor-chat-danger-bg:
|
|
910
|
+
--pactor-chat-danger-bg: var(--destructive, #d4380d);
|
|
911
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
912
|
+
--pactor-chat-danger-bg: color-mix(
|
|
41
913
|
in oklab,
|
|
42
914
|
var(--destructive, #d4380d) 8%,
|
|
43
915
|
var(--background, #fff)
|
|
44
916
|
);
|
|
917
|
+
}
|
|
45
918
|
--pactor-chat-success: var(--success, #389e0d);
|
|
46
|
-
--pactor-chat-user-bubble-bg:
|
|
919
|
+
--pactor-chat-user-bubble-bg: var(--primary, #3c47dd);
|
|
920
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
921
|
+
--pactor-chat-user-bubble-bg: color-mix(
|
|
47
922
|
in oklab,
|
|
48
923
|
var(--primary, #3c47dd) 7%,
|
|
49
924
|
var(--background, #fff)
|
|
50
925
|
);
|
|
51
|
-
|
|
926
|
+
}
|
|
927
|
+
--pactor-chat-user-bubble-border: var(--primary, #3c47dd);
|
|
928
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
929
|
+
--pactor-chat-user-bubble-border: color-mix(
|
|
52
930
|
in oklab,
|
|
53
931
|
var(--primary, #3c47dd) 35%,
|
|
54
932
|
transparent
|
|
55
933
|
);
|
|
934
|
+
}
|
|
56
935
|
--pactor-chat-code-bg: var(--muted, #f6f7f9);
|
|
57
|
-
/* 产出物卡片图标盒 tone 配色（表格 green / 数据 amber / 代码 blue /
|
|
58
|
-
图片 violet；文档与兜底走 --pactor-chat-muted(-fg) 不入列）。
|
|
59
|
-
暗色值见下方 [data-pactor-theme='dark'] 载体块 */
|
|
60
936
|
--pactor-chat-artifact-tone-green-fg: #16a34a;
|
|
61
937
|
--pactor-chat-artifact-tone-green-bg: #dcfce7;
|
|
62
938
|
--pactor-chat-artifact-tone-blue-fg: #2563eb;
|
|
@@ -65,53 +941,34 @@
|
|
|
65
941
|
--pactor-chat-artifact-tone-amber-bg: #fef3c7;
|
|
66
942
|
--pactor-chat-artifact-tone-violet-fg: #7c3aed;
|
|
67
943
|
--pactor-chat-artifact-tone-violet-bg: #ede9fe;
|
|
68
|
-
/* 旧通用圆角令牌（保留兼容）；新组件改用下方圆角阶梯 */
|
|
69
944
|
--pactor-chat-radius: 12px;
|
|
70
|
-
/* 圆角阶梯：sm 控件 / md 卡片 / lg 气泡 / xl composer */
|
|
71
945
|
--pactor-chat-radius-sm: 6px;
|
|
72
946
|
--pactor-chat-radius-md: 8px;
|
|
73
947
|
--pactor-chat-radius-lg: 16px;
|
|
74
948
|
--pactor-chat-radius-xl: 26px;
|
|
75
|
-
/* 投影：sm 气泡/卡片轻投影；composer 柔和分层投影 */
|
|
76
949
|
--pactor-chat-shadow-sm: 0 1px 2px rgb(0 0 0 / 4%);
|
|
77
|
-
--pactor-chat-shadow-composer:
|
|
78
|
-
0 1px 2px rgb(0 0 0 / 3%),
|
|
950
|
+
--pactor-chat-shadow-composer: 0 1px 2px rgb(0 0 0 / 3%),
|
|
79
951
|
0 10px 28px -10px rgb(0 0 0 / 8%);
|
|
80
|
-
/* 衬线展示字体栈：空状态问候 / chat 布局标题 */
|
|
81
952
|
--pactor-chat-font-display: 'Songti SC', 'Noto Serif SC', Georgia,
|
|
82
953
|
'Times New Roman', serif;
|
|
83
|
-
/* AppShell：移动端顶栏高度 / 抽屉遮罩色。
|
|
84
|
-
侧栏宽度不走 chat 私有令牌——统一由 ui 皮肤令牌驱动：
|
|
85
|
-
--sidebar-width（展开，默认 16rem）/ --sidebar-width-icon（折叠 icon rail，
|
|
86
|
-
默认 3rem），theme-studio 生成的皮肤可直接覆盖两者 */
|
|
87
954
|
--pactor-chat-shell-topbar-height: 44px;
|
|
88
955
|
--pactor-chat-shell-scrim: rgb(0 0 0 / 40%);
|
|
89
|
-
/* 产出物面板（spec: chat-artifact-panel）：桌面固定宽右栏。
|
|
90
|
-
默认宽与对话列一致（--pactor-chat-content-width），
|
|
91
|
-
宽度夹取 [--pactor-chat-inspector-min-width,
|
|
92
|
-
min(--pactor-chat-inspector-max-width, host 宽 2/3)]；
|
|
93
|
-
背景略深于聊天区底色，视觉上与消息流区分 */
|
|
94
956
|
--pactor-chat-inspector-width: var(--pactor-chat-content-width);
|
|
95
957
|
--pactor-chat-inspector-min-width: 480px;
|
|
96
958
|
--pactor-chat-inspector-max-width: 600px;
|
|
97
|
-
--pactor-chat-inspector-bg:
|
|
959
|
+
--pactor-chat-inspector-bg: var(--pactor-chat-bg);
|
|
960
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
961
|
+
--pactor-chat-inspector-bg: color-mix(
|
|
98
962
|
in srgb,
|
|
99
963
|
var(--pactor-chat-bg) 96%,
|
|
100
964
|
black
|
|
101
965
|
);
|
|
102
|
-
|
|
966
|
+
}
|
|
103
967
|
--pactor-chat-content-width: 768px;
|
|
104
|
-
/* 对话列左右最小内间距（spec: chat-artifact-panel / 拖拽调宽）：
|
|
105
|
-
面板调宽挤压剩余空间时，对话列左右始终保留该间距 */
|
|
106
968
|
--pactor-chat-content-gutter: 16px;
|
|
107
|
-
/* 聊天区 header 与产物面板 header 的公共高度（min-height，border-box）：
|
|
108
|
-
两边内容自然高度不同（面板侧 menu-trigger 更高），经统一 min-height
|
|
109
|
-
对齐，面板打开时两条分隔线同高；内容更高时自然撑开 */
|
|
110
969
|
--pactor-chat-header-height: 48px;
|
|
111
970
|
}
|
|
112
|
-
|
|
113
971
|
.pactor-chat-view {
|
|
114
|
-
|
|
115
972
|
display: flex;
|
|
116
973
|
flex-direction: column;
|
|
117
974
|
height: 100%;
|
|
@@ -120,19 +977,11 @@
|
|
|
120
977
|
font-size: 14px;
|
|
121
978
|
line-height: 1.6;
|
|
122
979
|
}
|
|
123
|
-
|
|
124
|
-
/* 暗色皮肤：data-pactor-theme="dark"（html 或任意祖先容器）。
|
|
125
|
-
颜色令牌经 var() 桥接 pactor-ui 语义令牌，暗色自动翻转，无需覆盖；
|
|
126
|
-
这里只保留投影与遮罩的暗色值（组件规则不区分主题）。
|
|
127
|
-
声明落在属性载体元素上（后代继承），与皮肤暗色块同优先级（0,1,0）、
|
|
128
|
-
皮肤后加载胜出——皮肤的暗色精调优先生效。 */
|
|
129
980
|
[data-pactor-theme='dark'] {
|
|
130
981
|
--pactor-chat-shadow-sm: 0 1px 2px rgb(0 0 0 / 35%);
|
|
131
|
-
--pactor-chat-shadow-composer:
|
|
132
|
-
0 1px 2px rgb(0 0 0 / 4%),
|
|
982
|
+
--pactor-chat-shadow-composer: 0 1px 2px rgb(0 0 0 / 4%),
|
|
133
983
|
0 12px 32px -10px rgb(0 0 0 / 55%);
|
|
134
984
|
--pactor-chat-shell-scrim: rgb(0 0 0 / 55%);
|
|
135
|
-
/* 产出物卡片图标盒 tone 配色（暗色） */
|
|
136
985
|
--pactor-chat-artifact-tone-green-fg: #4ade80;
|
|
137
986
|
--pactor-chat-artifact-tone-green-bg: #14532d;
|
|
138
987
|
--pactor-chat-artifact-tone-blue-fg: #93c5fd;
|
|
@@ -142,18 +991,12 @@
|
|
|
142
991
|
--pactor-chat-artifact-tone-violet-fg: #c4b5fd;
|
|
143
992
|
--pactor-chat-artifact-tone-violet-bg: #2e1065;
|
|
144
993
|
}
|
|
145
|
-
|
|
146
|
-
/* 系统偏好暗色兜底：未显式设置 data-pactor-theme 时跟随系统
|
|
147
|
-
（与上方 [data-pactor-theme='dark'] 块一致——仅投影与遮罩）。
|
|
148
|
-
:where() 降优先级为 (0,1,0)：皮肤亮色块（0,2,0）加载后不被压盖 */
|
|
149
994
|
@media (prefers-color-scheme: dark) {
|
|
150
995
|
:root:where(:not([data-pactor-theme='light']):not([data-pactor-theme='dark'])) {
|
|
151
996
|
--pactor-chat-shadow-sm: 0 1px 2px rgb(0 0 0 / 35%);
|
|
152
|
-
--pactor-chat-shadow-composer:
|
|
153
|
-
0 1px 2px rgb(0 0 0 / 4%),
|
|
997
|
+
--pactor-chat-shadow-composer: 0 1px 2px rgb(0 0 0 / 4%),
|
|
154
998
|
0 12px 32px -10px rgb(0 0 0 / 55%);
|
|
155
999
|
--pactor-chat-shell-scrim: rgb(0 0 0 / 55%);
|
|
156
|
-
/* 产出物卡片图标盒 tone 配色（暗色） */
|
|
157
1000
|
--pactor-chat-artifact-tone-green-fg: #4ade80;
|
|
158
1001
|
--pactor-chat-artifact-tone-green-bg: #14532d;
|
|
159
1002
|
--pactor-chat-artifact-tone-blue-fg: #93c5fd;
|
|
@@ -164,16 +1007,6 @@
|
|
|
164
1007
|
--pactor-chat-artifact-tone-violet-bg: #2e1065;
|
|
165
1008
|
}
|
|
166
1009
|
}
|
|
167
|
-
|
|
168
|
-
/* ------------------------------------------------------------
|
|
169
|
-
* chrome DSL 渲染层（spec: chat-chrome-dsl / chrome 令牌映射）：
|
|
170
|
-
* DSL 渲染的 chrome 子树（宿主 @pactor-app/ui 组件消费 shadcn
|
|
171
|
-
* 语义令牌）统一包在本容器内，把 --pactor-chat-* 映射为 shadcn
|
|
172
|
-
* 语义令牌——--pactor-chat-* 仍为皮肤唯一配置入口，暗色经上方
|
|
173
|
-
* [data-pactor-theme='dark'] 覆盖链自动生效。
|
|
174
|
-
* display:contents 使容器不参与布局；自定义属性沿 DOM 树继承，
|
|
175
|
-
* 不受 display:contents 影响。
|
|
176
|
-
* ------------------------------------------------------------ */
|
|
177
1010
|
.pactor-chat-chrome {
|
|
178
1011
|
display: contents;
|
|
179
1012
|
--background: var(--pactor-chat-bg);
|
|
@@ -195,11 +1028,6 @@
|
|
|
195
1028
|
--input: var(--pactor-chat-border);
|
|
196
1029
|
--ring: var(--pactor-chat-primary);
|
|
197
1030
|
}
|
|
198
|
-
|
|
199
|
-
/* ============================================================
|
|
200
|
-
* 2. 布局（chat 布局 + 消息区）
|
|
201
|
-
* ============================================================ */
|
|
202
|
-
|
|
203
1031
|
.pactor-chat-layout {
|
|
204
1032
|
display: flex;
|
|
205
1033
|
flex-direction: column;
|
|
@@ -207,7 +1035,6 @@
|
|
|
207
1035
|
background: var(--pactor-chat-bg);
|
|
208
1036
|
color: var(--pactor-chat-fg);
|
|
209
1037
|
}
|
|
210
|
-
|
|
211
1038
|
.pactor-chat-layout__header {
|
|
212
1039
|
padding: 12px 16px;
|
|
213
1040
|
border-bottom: 1px solid var(--pactor-chat-border);
|
|
@@ -215,7 +1042,6 @@
|
|
|
215
1042
|
font-size: 15px;
|
|
216
1043
|
font-weight: 600;
|
|
217
1044
|
}
|
|
218
|
-
|
|
219
1045
|
.pactor-chat-layout__main {
|
|
220
1046
|
flex: 1;
|
|
221
1047
|
min-height: 0;
|
|
@@ -223,25 +1049,11 @@
|
|
|
223
1049
|
display: flex;
|
|
224
1050
|
flex-direction: column;
|
|
225
1051
|
}
|
|
226
|
-
|
|
227
|
-
/* ------------------------------------------------------------
|
|
228
|
-
* ChatWorkspace（spec: chat-dsl-page）：createChatWorkspace 工厂
|
|
229
|
-
* 返回组件的外层容器 = 对话列（ChatView）；工作区头部（header）
|
|
230
|
-
* 收进面板 host 的 __main 左列——面板打开时随 __main 通栏（左贴
|
|
231
|
-
* 宿主边缘、右贴面板分隔线，不覆盖面板上方），不随对话列限宽。
|
|
232
|
-
* ------------------------------------------------------------ */
|
|
233
|
-
|
|
234
1052
|
.pactor-chat-workspace {
|
|
235
1053
|
display: flex;
|
|
236
1054
|
flex-direction: column;
|
|
237
1055
|
height: 100%;
|
|
238
1056
|
min-height: 0;
|
|
239
|
-
/* 对话列缺省限宽居中（spec: chat-app-shell 嵌入契约）：
|
|
240
|
-
* shell content / 面板 host / 独立块级容器三场景统一生效。
|
|
241
|
-
* width 用 calc 预留 gutter——对话列包含块是 __main 左列（面板
|
|
242
|
-
* 宽度不计入 100% 基准），产物栏调宽挤压、max-width 限宽失效
|
|
243
|
-
* （剩余空间不足）后左右仍恒保留 --pactor-chat-content-gutter
|
|
244
|
-
* 内间距，不会贴到容器边缘或面板分隔线 */
|
|
245
1057
|
width: calc(100% - 2 * var(--pactor-chat-content-gutter));
|
|
246
1058
|
max-width: var(--pactor-chat-content-width);
|
|
247
1059
|
margin-inline: auto;
|
|
@@ -249,21 +1061,16 @@
|
|
|
249
1061
|
font-size: 14px;
|
|
250
1062
|
line-height: 1.6;
|
|
251
1063
|
}
|
|
252
|
-
|
|
253
|
-
/* header 承载容器（无产物面板路径）：header 通栏 + 主区填满剩余高度 */
|
|
254
1064
|
.pactor-chat-with-header {
|
|
255
1065
|
display: flex;
|
|
256
1066
|
flex-direction: column;
|
|
257
1067
|
height: 100%;
|
|
258
1068
|
min-height: 0;
|
|
259
1069
|
}
|
|
260
|
-
|
|
261
|
-
.pactor-chat-with-header > .pactor-chat-shell,
|
|
262
|
-
.pactor-chat-with-header > .pactor-chat-workspace {
|
|
1070
|
+
.pactor-chat-with-header > .pactor-chat-shell, .pactor-chat-with-header > .pactor-chat-workspace {
|
|
263
1071
|
flex: 1;
|
|
264
1072
|
min-height: 0;
|
|
265
1073
|
}
|
|
266
|
-
|
|
267
1074
|
.pactor-chat-workspace__header {
|
|
268
1075
|
display: flex;
|
|
269
1076
|
align-items: center;
|
|
@@ -272,43 +1079,29 @@
|
|
|
272
1079
|
padding: 10px 16px;
|
|
273
1080
|
border-bottom: 1px solid var(--pactor-chat-border);
|
|
274
1081
|
flex-shrink: 0;
|
|
275
|
-
/* 与产物面板 header 等高（--pactor-chat-header-height） */
|
|
276
1082
|
box-sizing: border-box;
|
|
277
1083
|
min-height: var(--pactor-chat-header-height);
|
|
278
1084
|
}
|
|
279
|
-
|
|
280
1085
|
.pactor-chat-workspace__title {
|
|
281
1086
|
font-family: var(--pactor-chat-font-display);
|
|
282
1087
|
font-size: 15px;
|
|
283
1088
|
font-weight: 600;
|
|
284
1089
|
}
|
|
285
|
-
|
|
286
1090
|
.pactor-chat-workspace__header-extra {
|
|
287
1091
|
display: flex;
|
|
288
1092
|
align-items: center;
|
|
289
1093
|
gap: 8px;
|
|
290
1094
|
}
|
|
291
|
-
|
|
292
1095
|
.pactor-chat-workspace > .pactor-chat-view {
|
|
293
1096
|
flex: 1;
|
|
294
1097
|
min-height: 0;
|
|
295
1098
|
}
|
|
296
|
-
|
|
297
|
-
/* ------------------------------------------------------------
|
|
298
|
-
* AppShell（spec: chat-app-shell / chat-on-ui-sidebar）：外壳结构与
|
|
299
|
-
* 交互由 ui Sidebar 承担（data-slot 结构），chat 侧仅做令牌映射与
|
|
300
|
-
* 尺寸对齐——--pactor-chat-* 仍为皮肤唯一配置入口，暗色经覆盖链
|
|
301
|
-
* 自动生效。高度填满父容器（AppShell 传入 h-full min-h-0）。
|
|
302
|
-
* ------------------------------------------------------------ */
|
|
303
|
-
|
|
304
1099
|
.pactor-chat-shell {
|
|
305
1100
|
overflow: hidden;
|
|
306
1101
|
background: var(--pactor-chat-bg);
|
|
307
1102
|
color: var(--pactor-chat-fg);
|
|
308
1103
|
font-size: 14px;
|
|
309
1104
|
line-height: 1.6;
|
|
310
|
-
/* ui Sidebar 消费的 sidebar 系列语义令牌 → chat 令牌（映射手法与
|
|
311
|
-
.pactor-chat-chrome 一致） */
|
|
312
1105
|
--sidebar: var(--pactor-chat-sidebar-bg);
|
|
313
1106
|
--sidebar-foreground: var(--pactor-chat-fg);
|
|
314
1107
|
--sidebar-border: var(--pactor-chat-border);
|
|
@@ -318,59 +1111,27 @@
|
|
|
318
1111
|
--sidebar-primary-foreground: var(--pactor-chat-primary-fg);
|
|
319
1112
|
--sidebar-ring: var(--pactor-chat-primary);
|
|
320
1113
|
}
|
|
321
|
-
|
|
322
|
-
/* 侧栏宽度由 ui 皮肤令牌驱动（--sidebar-width / --sidebar-width-icon，
|
|
323
|
-
经 ui Sidebar 的 gap / 固定容器工具类引用），chat 不再单独覆盖；
|
|
324
|
-
原 chat 私有侧栏宽度令牌与 [data-collapsed] 规则一并移除——
|
|
325
|
-
后者自 chat-on-ui-sidebar 重构后等的是不存在的属性，从未生效 */
|
|
326
|
-
|
|
327
|
-
/* 移动端顶栏高度与遮罩色对齐令牌 */
|
|
328
1114
|
.pactor-chat-shell [data-slot='sidebar-topbar'] {
|
|
329
1115
|
height: var(--pactor-chat-shell-topbar-height);
|
|
330
1116
|
}
|
|
331
|
-
|
|
332
1117
|
.pactor-chat-shell [data-slot='sidebar-scrim'] {
|
|
333
1118
|
background: var(--pactor-chat-shell-scrim);
|
|
334
1119
|
}
|
|
335
|
-
|
|
336
|
-
/* 桌面折叠（icon rail，决策 D3）：fallback 手写菜单降级为仅图标
|
|
337
|
-
* （DSL 路径的 ui Menu 经 useSidebarDrawer().collapsed 自感知，
|
|
338
|
-
* data-collapsed 仅在桌面折叠时出现，无需媒体查询） */
|
|
339
1120
|
.pactor-chat-shell [data-slot='sidebar'][data-collapsed] .pactor-chat-menu {
|
|
340
1121
|
padding-inline: 8px;
|
|
341
1122
|
}
|
|
342
|
-
|
|
343
1123
|
.pactor-chat-shell [data-slot='sidebar'][data-collapsed] .pactor-chat-menu__item {
|
|
344
1124
|
justify-content: center;
|
|
345
1125
|
padding-inline: 0;
|
|
346
1126
|
}
|
|
347
|
-
|
|
348
|
-
.pactor-chat-shell [data-slot='sidebar'][data-collapsed] .pactor-chat-menu__label,
|
|
349
|
-
.pactor-chat-shell [data-slot='sidebar'][data-collapsed] .pactor-chat-menu__badge,
|
|
350
|
-
.pactor-chat-shell [data-slot='sidebar'][data-collapsed] .pactor-chat-menu__dot,
|
|
351
|
-
.pactor-chat-shell [data-slot='sidebar'][data-collapsed] .pactor-chat-menu__group {
|
|
1127
|
+
.pactor-chat-shell [data-slot='sidebar'][data-collapsed] .pactor-chat-menu__label, .pactor-chat-shell [data-slot='sidebar'][data-collapsed] .pactor-chat-menu__badge, .pactor-chat-shell [data-slot='sidebar'][data-collapsed] .pactor-chat-menu__dot, .pactor-chat-shell [data-slot='sidebar'][data-collapsed] .pactor-chat-menu__group {
|
|
352
1128
|
display: none;
|
|
353
1129
|
}
|
|
354
|
-
|
|
355
|
-
/* 产出物面板打开（spec: chat-artifact-panel）：面板贴容器右缘——
|
|
356
|
-
* 内容区右/上/下 padding 归零，面板 border-left 作分隔线 */
|
|
357
1130
|
.pactor-chat-shell [data-slot='sidebar-content']:has(> .pactor-chat-inspector-host) {
|
|
358
1131
|
padding-top: 0;
|
|
359
1132
|
padding-right: 0;
|
|
360
1133
|
padding-bottom: 0;
|
|
361
1134
|
}
|
|
362
|
-
|
|
363
|
-
/* ------------------------------------------------------------
|
|
364
|
-
* ArtifactPanel（spec: chat-artifact-panel，设计决策 D2）：
|
|
365
|
-
* 产出物预览面板。桌面（≥768px）为工作区右侧固定宽栏（flex 同行，
|
|
366
|
-
* 宽度经 --pactor-chat-inspector-width 可调）；移动端（<768px）
|
|
367
|
-
* 退化为右侧覆盖抽屉（遮罩点击关闭），与 AppShell 同一断点。
|
|
368
|
-
* 面板关闭 / 未配置时不渲染 DOM（组合层保证）。
|
|
369
|
-
* ------------------------------------------------------------ */
|
|
370
|
-
|
|
371
|
-
/* 面板打开时的容器：行内容器 __row 承载左右两列——__main 左列
|
|
372
|
-
* （header + 对话区纵向堆叠；header 通栏、不覆盖面板上方）与面板
|
|
373
|
-
* 右列（独占全高）；host 在 shell content 内撑满剩余高度与宽度 */
|
|
374
1135
|
.pactor-chat-inspector-host {
|
|
375
1136
|
display: flex;
|
|
376
1137
|
flex-direction: column;
|
|
@@ -380,20 +1141,12 @@
|
|
|
380
1141
|
overflow: hidden;
|
|
381
1142
|
background: var(--pactor-chat-bg);
|
|
382
1143
|
}
|
|
383
|
-
|
|
384
|
-
/* host 行内容器：__main 左列与面板的 flex 行。对话列 gutter 契约
|
|
385
|
-
* 由对话列自身 calc 宽度保证（见 .pactor-chat-workspace）——容器侧
|
|
386
|
-
* 不加 padding/margin，否则 __main 内的 header 会被内缩，两端无法
|
|
387
|
-
* 贴到宿主边缘与面板分隔线 */
|
|
388
1144
|
.pactor-chat-inspector-host__row {
|
|
389
1145
|
display: flex;
|
|
390
1146
|
flex: 1;
|
|
391
1147
|
width: 100%;
|
|
392
1148
|
min-height: 0;
|
|
393
1149
|
}
|
|
394
|
-
|
|
395
|
-
/* __main 左列：header + 主区（AppShell / workspace）纵向堆叠，
|
|
396
|
-
* 宽度 = 行宽减去面板宽（header 通栏：左贴宿主边缘、右贴面板分隔线） */
|
|
397
1150
|
.pactor-chat-inspector-host__main {
|
|
398
1151
|
display: flex;
|
|
399
1152
|
flex-direction: column;
|
|
@@ -401,27 +1154,16 @@
|
|
|
401
1154
|
min-width: 0;
|
|
402
1155
|
min-height: 0;
|
|
403
1156
|
}
|
|
404
|
-
|
|
405
|
-
.pactor-chat-inspector-host__main > .pactor-chat-shell,
|
|
406
|
-
.pactor-chat-inspector-host__main > .pactor-chat-workspace {
|
|
1157
|
+
.pactor-chat-inspector-host__main > .pactor-chat-shell, .pactor-chat-inspector-host__main > .pactor-chat-workspace {
|
|
407
1158
|
flex: 1;
|
|
408
1159
|
min-height: 0;
|
|
409
1160
|
min-width: 0;
|
|
410
1161
|
}
|
|
411
|
-
|
|
412
1162
|
.pactor-chat-inspector {
|
|
413
1163
|
position: relative;
|
|
414
1164
|
display: flex;
|
|
415
1165
|
flex-direction: column;
|
|
416
|
-
|
|
417
|
-
* 下限 min-width 令牌。
|
|
418
|
-
* max-width 是拖拽 inline 宽度的硬兜底：inline width 不能覆盖 max-width，
|
|
419
|
-
* 拖拽夹取偏差 / 拖拽后窗口尺寸变化时面板也不会突破上限 */
|
|
420
|
-
width: min(
|
|
421
|
-
var(--pactor-chat-inspector-width),
|
|
422
|
-
var(--pactor-chat-inspector-max-width),
|
|
423
|
-
calc(100% * 2 / 3)
|
|
424
|
-
);
|
|
1166
|
+
width: min( var(--pactor-chat-inspector-width), var(--pactor-chat-inspector-max-width), calc(100% * 2 / 3) );
|
|
425
1167
|
max-width: min(var(--pactor-chat-inspector-max-width), calc(100% * 2 / 3));
|
|
426
1168
|
min-width: var(--pactor-chat-inspector-min-width);
|
|
427
1169
|
flex-shrink: 0;
|
|
@@ -432,20 +1174,6 @@
|
|
|
432
1174
|
line-height: 1.6;
|
|
433
1175
|
overflow: hidden;
|
|
434
1176
|
}
|
|
435
|
-
|
|
436
|
-
/* 拖拽调宽手柄（spec: chat-artifact-panel / 拖拽调宽）：
|
|
437
|
-
* 面板左缘内覆 8px 热区（overflow:hidden 会裁掉负偏移，故内覆而非外探） */
|
|
438
|
-
.pactor-chat-inspector__resize {
|
|
439
|
-
position: absolute;
|
|
440
|
-
left: 0;
|
|
441
|
-
top: 0;
|
|
442
|
-
bottom: 0;
|
|
443
|
-
width: 8px;
|
|
444
|
-
cursor: col-resize;
|
|
445
|
-
z-index: 1;
|
|
446
|
-
touch-action: none;
|
|
447
|
-
}
|
|
448
|
-
|
|
449
1177
|
.pactor-chat-inspector__header {
|
|
450
1178
|
display: flex;
|
|
451
1179
|
align-items: center;
|
|
@@ -453,11 +1181,9 @@
|
|
|
453
1181
|
padding: 10px 12px;
|
|
454
1182
|
border-bottom: 1px solid var(--pactor-chat-border);
|
|
455
1183
|
flex-shrink: 0;
|
|
456
|
-
/* 与聊天区 header 等高（--pactor-chat-header-height） */
|
|
457
1184
|
box-sizing: border-box;
|
|
458
1185
|
min-height: var(--pactor-chat-header-height);
|
|
459
1186
|
}
|
|
460
|
-
|
|
461
1187
|
.pactor-chat-inspector__title {
|
|
462
1188
|
flex: 1;
|
|
463
1189
|
min-width: 0;
|
|
@@ -468,8 +1194,6 @@
|
|
|
468
1194
|
font-size: 14px;
|
|
469
1195
|
font-weight: 600;
|
|
470
1196
|
}
|
|
471
|
-
|
|
472
|
-
/* kind 角标 */
|
|
473
1197
|
.pactor-chat-inspector__kind {
|
|
474
1198
|
flex-shrink: 0;
|
|
475
1199
|
padding: 0 6px;
|
|
@@ -479,156 +1203,34 @@
|
|
|
479
1203
|
font-size: 11px;
|
|
480
1204
|
line-height: 18px;
|
|
481
1205
|
}
|
|
482
|
-
|
|
483
1206
|
.pactor-chat-inspector__close {
|
|
484
1207
|
flex-shrink: 0;
|
|
485
1208
|
}
|
|
486
|
-
|
|
487
1209
|
.pactor-chat-inspector__list-toggle {
|
|
488
1210
|
flex-shrink: 0;
|
|
489
1211
|
}
|
|
490
|
-
|
|
491
|
-
/* 产物切换下拉（spec: chat-artifact-panel / 多产物切换）：
|
|
492
|
-
* header 文件名处触发器（图标 + 名称 + chevron），占用标题区剩余宽度 */
|
|
493
1212
|
.pactor-chat-inspector__header .dropdown-menu-trigger-wrap {
|
|
494
1213
|
flex: 1;
|
|
495
1214
|
min-width: 0;
|
|
496
1215
|
display: flex;
|
|
497
1216
|
}
|
|
498
|
-
|
|
499
1217
|
.pactor-chat-inspector__menu-trigger {
|
|
500
1218
|
display: inline-flex;
|
|
501
1219
|
align-items: center;
|
|
502
1220
|
gap: 6px;
|
|
503
1221
|
min-width: 0;
|
|
504
1222
|
max-width: 100%;
|
|
505
|
-
/* 纵向 padding 2px：自身 26.4px + header padding 20px + border 1px
|
|
506
|
-
* ≤ --pactor-chat-header-height（48px），不撑破两侧 header 等高 */
|
|
507
1223
|
padding: 2px 6px;
|
|
508
1224
|
border-radius: var(--pactor-chat-radius-sm);
|
|
509
1225
|
cursor: pointer;
|
|
510
1226
|
color: var(--pactor-chat-fg);
|
|
511
1227
|
}
|
|
512
|
-
|
|
513
1228
|
.pactor-chat-inspector__menu-trigger:hover {
|
|
514
1229
|
background: var(--pactor-chat-muted);
|
|
515
1230
|
}
|
|
516
|
-
|
|
517
1231
|
.pactor-chat-inspector__menu-trigger .pactor-chat-inspector__title {
|
|
518
1232
|
min-width: 0;
|
|
519
1233
|
}
|
|
520
|
-
|
|
521
|
-
/* 产物目录列表视图（spec: chat-artifact-panel / 产物目录）：
|
|
522
|
-
* 目录（可折叠）+ 产物行（kind 图标 + 名称 + kind 角标） */
|
|
523
|
-
.pactor-chat-inspector__list {
|
|
524
|
-
list-style: none;
|
|
525
|
-
margin: 0;
|
|
526
|
-
padding: 0;
|
|
527
|
-
}
|
|
528
|
-
|
|
529
|
-
.pactor-chat-inspector__list-children {
|
|
530
|
-
padding-left: 18px;
|
|
531
|
-
}
|
|
532
|
-
|
|
533
|
-
.pactor-chat-inspector__list-folder,
|
|
534
|
-
.pactor-chat-inspector__list-item {
|
|
535
|
-
display: flex;
|
|
536
|
-
align-items: center;
|
|
537
|
-
gap: 8px;
|
|
538
|
-
width: 100%;
|
|
539
|
-
padding: 7px 8px;
|
|
540
|
-
border: none;
|
|
541
|
-
border-radius: var(--pactor-chat-radius-sm);
|
|
542
|
-
background: transparent;
|
|
543
|
-
color: var(--pactor-chat-fg);
|
|
544
|
-
font-size: 13px;
|
|
545
|
-
text-align: left;
|
|
546
|
-
cursor: pointer;
|
|
547
|
-
}
|
|
548
|
-
|
|
549
|
-
.pactor-chat-inspector__list-folder {
|
|
550
|
-
color: var(--pactor-chat-muted-fg);
|
|
551
|
-
}
|
|
552
|
-
|
|
553
|
-
.pactor-chat-inspector__list-folder:hover,
|
|
554
|
-
.pactor-chat-inspector__list-item:hover {
|
|
555
|
-
background: var(--pactor-chat-muted);
|
|
556
|
-
}
|
|
557
|
-
|
|
558
|
-
.pactor-chat-inspector__list-item[data-active='true'] {
|
|
559
|
-
background: var(--pactor-chat-muted);
|
|
560
|
-
font-weight: 600;
|
|
561
|
-
}
|
|
562
|
-
|
|
563
|
-
.pactor-chat-inspector__list-folder[data-open='true'] .pactor-chat-trace__chevron {
|
|
564
|
-
transform: rotate(90deg);
|
|
565
|
-
}
|
|
566
|
-
|
|
567
|
-
.pactor-chat-inspector__list-item-title {
|
|
568
|
-
flex: 1;
|
|
569
|
-
min-width: 0;
|
|
570
|
-
overflow: hidden;
|
|
571
|
-
text-overflow: ellipsis;
|
|
572
|
-
white-space: nowrap;
|
|
573
|
-
}
|
|
574
|
-
|
|
575
|
-
.pactor-chat-inspector__body {
|
|
576
|
-
flex: 1;
|
|
577
|
-
min-height: 0;
|
|
578
|
-
overflow-y: auto;
|
|
579
|
-
padding: 12px;
|
|
580
|
-
}
|
|
581
|
-
|
|
582
|
-
/* code 产出物：只读代码块（language 右上角标，不引高亮依赖） */
|
|
583
|
-
.pactor-chat-inspector__code {
|
|
584
|
-
position: relative;
|
|
585
|
-
}
|
|
586
|
-
|
|
587
|
-
/* 图片类产出物（spec: chat-artifact-panel / 常见文件预览）：
|
|
588
|
-
* 居中自适应面板宽；svg 原始标记经 data URL 呈现 */
|
|
589
|
-
.pactor-chat-inspector__image {
|
|
590
|
-
display: flex;
|
|
591
|
-
justify-content: center;
|
|
592
|
-
align-items: flex-start;
|
|
593
|
-
}
|
|
594
|
-
|
|
595
|
-
.pactor-chat-inspector__image img {
|
|
596
|
-
max-width: 100%;
|
|
597
|
-
height: auto;
|
|
598
|
-
border-radius: var(--pactor-chat-radius-sm);
|
|
599
|
-
}
|
|
600
|
-
|
|
601
|
-
.pactor-chat-inspector__code pre {
|
|
602
|
-
margin: 0;
|
|
603
|
-
padding: 10px 12px;
|
|
604
|
-
border: 1px solid var(--pactor-chat-border);
|
|
605
|
-
border-radius: var(--pactor-chat-radius-md);
|
|
606
|
-
background: var(--pactor-chat-code-bg);
|
|
607
|
-
overflow-x: auto;
|
|
608
|
-
font-size: 12.5px;
|
|
609
|
-
}
|
|
610
|
-
|
|
611
|
-
.pactor-chat-inspector__code-lang {
|
|
612
|
-
position: absolute;
|
|
613
|
-
top: 6px;
|
|
614
|
-
right: 8px;
|
|
615
|
-
padding: 0 6px;
|
|
616
|
-
border-radius: 999px;
|
|
617
|
-
background: var(--pactor-chat-muted);
|
|
618
|
-
color: var(--pactor-chat-muted-fg);
|
|
619
|
-
font-size: 11px;
|
|
620
|
-
line-height: 18px;
|
|
621
|
-
}
|
|
622
|
-
|
|
623
|
-
/* text 产出物：预格式文本 */
|
|
624
|
-
.pactor-chat-inspector__text {
|
|
625
|
-
margin: 0;
|
|
626
|
-
white-space: pre-wrap;
|
|
627
|
-
word-break: break-word;
|
|
628
|
-
font-size: 13px;
|
|
629
|
-
}
|
|
630
|
-
|
|
631
|
-
/* 窄屏覆盖抽屉遮罩：仅面板打开时渲染；桌面隐藏（同 AppShell scrim 模式） */
|
|
632
1234
|
.pactor-chat-inspector__scrim {
|
|
633
1235
|
display: none;
|
|
634
1236
|
position: fixed;
|
|
@@ -636,7 +1238,6 @@
|
|
|
636
1238
|
z-index: 40;
|
|
637
1239
|
background: var(--pactor-chat-shell-scrim);
|
|
638
1240
|
}
|
|
639
|
-
|
|
640
1241
|
@media (max-width: 767px) {
|
|
641
1242
|
.pactor-chat-inspector {
|
|
642
1243
|
position: fixed;
|
|
@@ -645,30 +1246,17 @@
|
|
|
645
1246
|
right: 0;
|
|
646
1247
|
z-index: 50;
|
|
647
1248
|
box-shadow: var(--pactor-chat-shadow-composer);
|
|
648
|
-
/* 抽屉形态：宽度不超出视口，下限令牌不适用；
|
|
649
|
-
* max-width 兜底拖拽残留的 inline 宽度（桌面拖拽后切窄屏） */
|
|
650
1249
|
width: min(var(--pactor-chat-inspector-width), 92vw);
|
|
651
1250
|
max-width: 92vw;
|
|
652
1251
|
min-width: 0;
|
|
653
1252
|
}
|
|
654
|
-
|
|
655
|
-
/* 窄屏覆盖抽屉形态：不显示拖拽手柄（spec scenario: 窄屏无拖拽手柄） */
|
|
656
|
-
.pactor-chat-inspector__resize {
|
|
1253
|
+
.pactor-chat-inspector [data-slot='artifact-panel-resize'] {
|
|
657
1254
|
display: none;
|
|
658
1255
|
}
|
|
659
|
-
|
|
660
1256
|
.pactor-chat-inspector__scrim {
|
|
661
1257
|
display: block;
|
|
662
1258
|
}
|
|
663
1259
|
}
|
|
664
|
-
|
|
665
|
-
/* ------------------------------------------------------------
|
|
666
|
-
* 产出物卡片（spec: chat-artifact-panel / artifact 消息 part）：
|
|
667
|
-
* 消息流内 artifact part 的内联呈现——整卡可点击：着色图标盒
|
|
668
|
-
* （按文件类型 tone 取色）+ 标题 + 元信息行（尺寸 · 类型）+
|
|
669
|
-
* 右上箭头。结构与 ChatArtifactCard 内部组件一一对应。
|
|
670
|
-
* ------------------------------------------------------------ */
|
|
671
|
-
|
|
672
1260
|
.pactor-chat-artifact-card {
|
|
673
1261
|
display: flex;
|
|
674
1262
|
align-items: center;
|
|
@@ -687,12 +1275,9 @@
|
|
|
687
1275
|
text-align: left;
|
|
688
1276
|
transition: background-color 0.15s ease;
|
|
689
1277
|
}
|
|
690
|
-
|
|
691
1278
|
.pactor-chat-artifact-card:hover {
|
|
692
1279
|
background: var(--pactor-chat-muted);
|
|
693
1280
|
}
|
|
694
|
-
|
|
695
|
-
/* 着色图标盒（36px 圆角盒；tone 着色，暗色值见下方覆盖块） */
|
|
696
1281
|
.pactor-chat-artifact-card__icon {
|
|
697
1282
|
display: inline-flex;
|
|
698
1283
|
align-items: center;
|
|
@@ -704,30 +1289,22 @@
|
|
|
704
1289
|
background: var(--pactor-chat-muted);
|
|
705
1290
|
color: var(--pactor-chat-muted-fg);
|
|
706
1291
|
}
|
|
707
|
-
|
|
708
|
-
/* 按文件类型着色（tone 见 artifact.ts resolveArtifactIcon；色值走
|
|
709
|
-
* --pactor-chat-artifact-tone-* 令牌，暗色经载体块覆盖、皮肤可精调）：
|
|
710
|
-
* 表格 green / 数据 amber / 代码 blue / 图片 violet / 文档与兜底 slate */
|
|
711
1292
|
.pactor-chat-artifact-card--green .pactor-chat-artifact-card__icon {
|
|
712
1293
|
color: var(--pactor-chat-artifact-tone-green-fg);
|
|
713
1294
|
background: var(--pactor-chat-artifact-tone-green-bg);
|
|
714
1295
|
}
|
|
715
|
-
|
|
716
1296
|
.pactor-chat-artifact-card--blue .pactor-chat-artifact-card__icon {
|
|
717
1297
|
color: var(--pactor-chat-artifact-tone-blue-fg);
|
|
718
1298
|
background: var(--pactor-chat-artifact-tone-blue-bg);
|
|
719
1299
|
}
|
|
720
|
-
|
|
721
1300
|
.pactor-chat-artifact-card--amber .pactor-chat-artifact-card__icon {
|
|
722
1301
|
color: var(--pactor-chat-artifact-tone-amber-fg);
|
|
723
1302
|
background: var(--pactor-chat-artifact-tone-amber-bg);
|
|
724
1303
|
}
|
|
725
|
-
|
|
726
1304
|
.pactor-chat-artifact-card--violet .pactor-chat-artifact-card__icon {
|
|
727
1305
|
color: var(--pactor-chat-artifact-tone-violet-fg);
|
|
728
1306
|
background: var(--pactor-chat-artifact-tone-violet-bg);
|
|
729
1307
|
}
|
|
730
|
-
|
|
731
1308
|
.pactor-chat-artifact-card__text {
|
|
732
1309
|
display: flex;
|
|
733
1310
|
flex-direction: column;
|
|
@@ -735,7 +1312,6 @@
|
|
|
735
1312
|
flex: 1 1 auto;
|
|
736
1313
|
min-width: 0;
|
|
737
1314
|
}
|
|
738
|
-
|
|
739
1315
|
.pactor-chat-artifact-card__title {
|
|
740
1316
|
min-width: 0;
|
|
741
1317
|
overflow: hidden;
|
|
@@ -744,22 +1320,14 @@
|
|
|
744
1320
|
font-weight: 600;
|
|
745
1321
|
font-size: 13px;
|
|
746
1322
|
}
|
|
747
|
-
|
|
748
|
-
/* 元信息行（尺寸 · 类型标签） */
|
|
749
1323
|
.pactor-chat-artifact-card__meta {
|
|
750
1324
|
font-size: 11px;
|
|
751
1325
|
color: var(--pactor-chat-muted-fg);
|
|
752
1326
|
}
|
|
753
|
-
|
|
754
|
-
/* 右上箭头（打开面板暗示） */
|
|
755
1327
|
.pactor-chat-artifact-card__arrow {
|
|
756
1328
|
flex: none;
|
|
757
1329
|
color: var(--pactor-chat-muted-fg);
|
|
758
1330
|
}
|
|
759
|
-
|
|
760
|
-
/* 连续产物卡片组（spec: chat-artifact-panel / 卡片区收起）：
|
|
761
|
-
* 同一消息内连续 artifact part 合组；超 4 个收起，footer 右端
|
|
762
|
-
* 「展开 / 收起」+「查看所有产物(n) ›」（打开面板产物目录视图） */
|
|
763
1331
|
.pactor-chat-artifact-group__footer {
|
|
764
1332
|
display: flex;
|
|
765
1333
|
justify-content: flex-end;
|
|
@@ -767,9 +1335,7 @@
|
|
|
767
1335
|
gap: 12px;
|
|
768
1336
|
margin: -2px 0 8px;
|
|
769
1337
|
}
|
|
770
|
-
|
|
771
|
-
.pactor-chat-artifact-group__toggle,
|
|
772
|
-
.pactor-chat-artifact-group__all {
|
|
1338
|
+
.pactor-chat-artifact-group__toggle, .pactor-chat-artifact-group__all {
|
|
773
1339
|
display: inline-flex;
|
|
774
1340
|
align-items: center;
|
|
775
1341
|
gap: 3px;
|
|
@@ -781,19 +1347,9 @@
|
|
|
781
1347
|
font-size: 12px;
|
|
782
1348
|
cursor: pointer;
|
|
783
1349
|
}
|
|
784
|
-
|
|
785
|
-
.pactor-chat-artifact-group__toggle:hover,
|
|
786
|
-
.pactor-chat-artifact-group__all:hover {
|
|
1350
|
+
.pactor-chat-artifact-group__toggle:hover, .pactor-chat-artifact-group__all:hover {
|
|
787
1351
|
background: var(--pactor-chat-muted);
|
|
788
1352
|
}
|
|
789
|
-
|
|
790
|
-
/* ------------------------------------------------------------
|
|
791
|
-
* Chat 组件内建侧栏菜单（spec: chat-dsl-component）：
|
|
792
|
-
* menu 数据驱动的导航项（图标 + 分组标题 + badge + disabled），
|
|
793
|
-
* 承载于 AppShell 侧栏；颜色全部经 --pactor-chat-* 令牌，
|
|
794
|
-
* 暗色由令牌覆盖自动生效。
|
|
795
|
-
* ------------------------------------------------------------ */
|
|
796
|
-
|
|
797
1353
|
.pactor-chat-menu {
|
|
798
1354
|
display: flex;
|
|
799
1355
|
flex-direction: column;
|
|
@@ -803,13 +1359,11 @@
|
|
|
803
1359
|
overflow-y: auto;
|
|
804
1360
|
box-sizing: border-box;
|
|
805
1361
|
}
|
|
806
|
-
|
|
807
1362
|
.pactor-chat-menu__group {
|
|
808
1363
|
padding: 10px 10px 4px;
|
|
809
1364
|
color: var(--pactor-chat-muted-fg);
|
|
810
1365
|
font-size: 12px;
|
|
811
1366
|
}
|
|
812
|
-
|
|
813
1367
|
.pactor-chat-menu__item {
|
|
814
1368
|
display: flex;
|
|
815
1369
|
align-items: center;
|
|
@@ -826,31 +1380,24 @@
|
|
|
826
1380
|
cursor: pointer;
|
|
827
1381
|
transition: background 0.15s ease;
|
|
828
1382
|
}
|
|
829
|
-
|
|
830
1383
|
.pactor-chat-menu__item:hover {
|
|
831
1384
|
background: var(--pactor-chat-muted);
|
|
832
1385
|
}
|
|
833
|
-
|
|
834
|
-
.pactor-chat-menu__item--active,
|
|
835
|
-
.pactor-chat-menu__item--active:hover {
|
|
1386
|
+
.pactor-chat-menu__item--active, .pactor-chat-menu__item--active:hover {
|
|
836
1387
|
background: var(--pactor-chat-user-bubble-bg);
|
|
837
1388
|
color: var(--pactor-chat-primary);
|
|
838
1389
|
}
|
|
839
|
-
|
|
840
|
-
.pactor-chat-menu__item:disabled,
|
|
841
|
-
.pactor-chat-menu__item:disabled:hover {
|
|
1390
|
+
.pactor-chat-menu__item:disabled, .pactor-chat-menu__item:disabled:hover {
|
|
842
1391
|
background: transparent;
|
|
843
1392
|
color: var(--pactor-chat-muted-fg);
|
|
844
1393
|
opacity: 0.6;
|
|
845
1394
|
cursor: not-allowed;
|
|
846
1395
|
}
|
|
847
|
-
|
|
848
1396
|
.pactor-chat-menu__icon {
|
|
849
1397
|
display: inline-flex;
|
|
850
1398
|
flex-shrink: 0;
|
|
851
1399
|
align-items: center;
|
|
852
1400
|
}
|
|
853
|
-
|
|
854
1401
|
.pactor-chat-menu__label {
|
|
855
1402
|
flex: 1;
|
|
856
1403
|
min-width: 0;
|
|
@@ -858,7 +1405,6 @@
|
|
|
858
1405
|
text-overflow: ellipsis;
|
|
859
1406
|
white-space: nowrap;
|
|
860
1407
|
}
|
|
861
|
-
|
|
862
1408
|
.pactor-chat-menu__badge {
|
|
863
1409
|
flex-shrink: 0;
|
|
864
1410
|
padding: 0 6px;
|
|
@@ -868,14 +1414,10 @@
|
|
|
868
1414
|
font-size: 12px;
|
|
869
1415
|
line-height: 18px;
|
|
870
1416
|
}
|
|
871
|
-
|
|
872
1417
|
.pactor-chat-menu__item--active .pactor-chat-menu__badge {
|
|
873
1418
|
background: var(--pactor-chat-user-bubble-bg);
|
|
874
1419
|
color: var(--pactor-chat-primary);
|
|
875
1420
|
}
|
|
876
|
-
|
|
877
|
-
/* 菜单项状态圆点（spec: chat-dsl-component / 菜单项状态点，决策 D4）：
|
|
878
|
-
* label 右侧的 danger 系小圆点（参考图红点），与 badge 可共存 */
|
|
879
1421
|
.pactor-chat-menu__dot {
|
|
880
1422
|
flex-shrink: 0;
|
|
881
1423
|
width: 6px;
|
|
@@ -883,8 +1425,6 @@
|
|
|
883
1425
|
border-radius: 50%;
|
|
884
1426
|
background: var(--pactor-chat-danger);
|
|
885
1427
|
}
|
|
886
|
-
|
|
887
|
-
/* Chat 服务缺失的受控提示块（未配置 ChatServicesProvider 时渲染） */
|
|
888
1428
|
.pactor-chat-notice {
|
|
889
1429
|
padding: 24px 16px;
|
|
890
1430
|
border: 1px dashed var(--pactor-chat-border);
|
|
@@ -895,11 +1435,6 @@
|
|
|
895
1435
|
line-height: 1.6;
|
|
896
1436
|
text-align: center;
|
|
897
1437
|
}
|
|
898
|
-
|
|
899
|
-
|
|
900
|
-
/* 消息滚动区：overflow-anchor none 配合 useChatAutoScroll（防浏览器
|
|
901
|
-
滚动锚定与贴底跟随互相拉扯）；上下 mask 渐隐 + 6px 细滚动条；
|
|
902
|
-
顶部留 24px 内边距（与 mask 渐隐带同宽，首条消息不贴顶） */
|
|
903
1438
|
.pactor-chat-messages {
|
|
904
1439
|
position: relative;
|
|
905
1440
|
flex: 1;
|
|
@@ -912,47 +1447,27 @@
|
|
|
912
1447
|
padding: 24px 2px;
|
|
913
1448
|
scrollbar-width: thin;
|
|
914
1449
|
scrollbar-color: var(--pactor-chat-border) transparent;
|
|
915
|
-
-webkit-mask-image: linear-gradient(
|
|
916
|
-
|
|
917
|
-
transparent,
|
|
918
|
-
#000 24px,
|
|
919
|
-
#000 calc(100% - 24px),
|
|
920
|
-
transparent
|
|
921
|
-
);
|
|
922
|
-
mask-image: linear-gradient(
|
|
923
|
-
to bottom,
|
|
924
|
-
transparent,
|
|
925
|
-
#000 24px,
|
|
926
|
-
#000 calc(100% - 24px),
|
|
927
|
-
transparent
|
|
928
|
-
);
|
|
1450
|
+
-webkit-mask-image: linear-gradient( to bottom, transparent, #000 24px, #000 calc(100% - 24px), transparent );
|
|
1451
|
+
mask-image: linear-gradient( to bottom, transparent, #000 24px, #000 calc(100% - 24px), transparent );
|
|
929
1452
|
}
|
|
930
|
-
|
|
931
1453
|
.pactor-chat-messages::-webkit-scrollbar {
|
|
932
1454
|
width: 6px;
|
|
933
1455
|
height: 6px;
|
|
934
1456
|
}
|
|
935
|
-
|
|
936
1457
|
.pactor-chat-messages::-webkit-scrollbar-track {
|
|
937
1458
|
background: transparent;
|
|
938
1459
|
}
|
|
939
|
-
|
|
940
1460
|
.pactor-chat-messages::-webkit-scrollbar-thumb {
|
|
941
1461
|
background: var(--pactor-chat-border);
|
|
942
1462
|
border-radius: 3px;
|
|
943
1463
|
}
|
|
944
|
-
|
|
945
1464
|
.pactor-chat-messages::-webkit-scrollbar-thumb:hover {
|
|
946
1465
|
background: var(--pactor-chat-muted-fg);
|
|
947
1466
|
}
|
|
948
|
-
|
|
949
|
-
/* Composer 承载坞（空态居中组与钉底位共用）：padding-bottom 为钉底态
|
|
950
|
-
* 与页面底部留出空白；composerBottom 槽（未提供不渲染）居中弱提示 */
|
|
951
1467
|
.pactor-chat-view__composer-dock {
|
|
952
1468
|
width: 100%;
|
|
953
1469
|
padding-bottom: 12px;
|
|
954
1470
|
}
|
|
955
|
-
|
|
956
1471
|
.pactor-chat-view__composer-bottom {
|
|
957
1472
|
margin-top: 8px;
|
|
958
1473
|
text-align: center;
|
|
@@ -960,15 +1475,6 @@
|
|
|
960
1475
|
font-size: 12px;
|
|
961
1476
|
line-height: 1.5;
|
|
962
1477
|
}
|
|
963
|
-
|
|
964
|
-
/* ============================================================
|
|
965
|
-
* 3. 空状态（spec: chat-empty-state）
|
|
966
|
-
* ============================================================ */
|
|
967
|
-
|
|
968
|
-
/* 空态居中组（决策 D1）：EmptyState 与 Composer 同一垂直居中列。
|
|
969
|
-
* margin auto 在消息区（flex 列容器）内双向居中；内容高于视口时
|
|
970
|
-
* auto 边距归零，配合消息区 overflow-y auto 从顶部自然滚动
|
|
971
|
-
* （极矮视口不裁切） */
|
|
972
1478
|
.pactor-chat-view__empty-stack {
|
|
973
1479
|
display: flex;
|
|
974
1480
|
flex-direction: column;
|
|
@@ -978,11 +1484,9 @@
|
|
|
978
1484
|
margin: auto;
|
|
979
1485
|
padding: 16px 0;
|
|
980
1486
|
}
|
|
981
|
-
|
|
982
1487
|
.pactor-chat-view__empty-stack .pactor-chat-empty {
|
|
983
1488
|
flex: none;
|
|
984
1489
|
}
|
|
985
|
-
|
|
986
1490
|
.pactor-chat-empty {
|
|
987
1491
|
flex: 1;
|
|
988
1492
|
display: flex;
|
|
@@ -993,19 +1497,16 @@
|
|
|
993
1497
|
padding: 32px 16px;
|
|
994
1498
|
text-align: center;
|
|
995
1499
|
}
|
|
996
|
-
|
|
997
1500
|
.pactor-chat-empty__greeting {
|
|
998
1501
|
font-family: var(--pactor-chat-font-display);
|
|
999
1502
|
font-size: 26px;
|
|
1000
1503
|
font-weight: 500;
|
|
1001
1504
|
line-height: 1.4;
|
|
1002
1505
|
}
|
|
1003
|
-
|
|
1004
1506
|
.pactor-chat-empty__subtitle {
|
|
1005
1507
|
color: var(--pactor-chat-muted-fg);
|
|
1006
1508
|
font-size: 13px;
|
|
1007
1509
|
}
|
|
1008
|
-
|
|
1009
1510
|
.pactor-chat-empty__suggestions {
|
|
1010
1511
|
display: flex;
|
|
1011
1512
|
flex-wrap: wrap;
|
|
@@ -1013,139 +1514,53 @@
|
|
|
1013
1514
|
gap: 8px;
|
|
1014
1515
|
margin-top: 8px;
|
|
1015
1516
|
}
|
|
1016
|
-
|
|
1017
|
-
.pactor-chat-empty__suggestion {
|
|
1018
|
-
padding: 6px 14px;
|
|
1019
|
-
border: 1px solid var(--pactor-chat-border);
|
|
1020
|
-
border-radius: 999px;
|
|
1021
|
-
background: var(--pactor-chat-card);
|
|
1022
|
-
color: var(--pactor-chat-fg);
|
|
1023
|
-
font-size: 13px;
|
|
1024
|
-
cursor: pointer;
|
|
1025
|
-
transition:
|
|
1026
|
-
border-color 0.15s ease,
|
|
1027
|
-
background 0.15s ease;
|
|
1028
|
-
}
|
|
1029
|
-
|
|
1030
|
-
.pactor-chat-empty__suggestion:hover {
|
|
1031
|
-
border-color: var(--pactor-chat-primary);
|
|
1032
|
-
background: var(--pactor-chat-muted);
|
|
1033
|
-
}
|
|
1034
|
-
|
|
1035
|
-
/* ============================================================
|
|
1036
|
-
* 4. 消息气泡
|
|
1037
|
-
* ============================================================ */
|
|
1038
|
-
|
|
1039
1517
|
.pactor-chat-message {
|
|
1040
1518
|
display: flex;
|
|
1041
1519
|
flex-direction: column;
|
|
1042
1520
|
gap: 4px;
|
|
1043
1521
|
max-width: 100%;
|
|
1044
1522
|
}
|
|
1045
|
-
|
|
1046
1523
|
.pactor-chat-message__body {
|
|
1047
1524
|
display: flex;
|
|
1048
1525
|
flex-direction: column;
|
|
1049
1526
|
gap: 8px;
|
|
1050
1527
|
min-width: 0;
|
|
1051
1528
|
}
|
|
1052
|
-
|
|
1053
|
-
/* user：右侧圆角气泡（16px 圆角 + 轻投影） */
|
|
1054
1529
|
.pactor-chat-message--user {
|
|
1055
1530
|
align-items: flex-end;
|
|
1056
1531
|
}
|
|
1057
|
-
|
|
1058
|
-
.pactor-chat-message--user .pactor-chat-message__body {
|
|
1059
|
-
max-width: 75%;
|
|
1060
|
-
padding: 10px 16px;
|
|
1061
|
-
border-radius: var(--pactor-chat-radius-lg);
|
|
1062
|
-
border: 1px solid var(--pactor-chat-user-bubble-border);
|
|
1063
|
-
background: var(--pactor-chat-user-bubble-bg);
|
|
1064
|
-
box-shadow: var(--pactor-chat-shadow-sm);
|
|
1065
|
-
}
|
|
1066
|
-
|
|
1067
|
-
/* assistant：左侧通栏排版（无气泡底色） */
|
|
1068
1532
|
.pactor-chat-message--assistant {
|
|
1069
1533
|
align-items: stretch;
|
|
1070
1534
|
}
|
|
1071
|
-
|
|
1072
|
-
/* assistant 消息顶部 Agent 身份行：图标 + 加粗名称 */
|
|
1073
|
-
.pactor-chat-message__agent {
|
|
1074
|
-
display: flex;
|
|
1075
|
-
align-items: center;
|
|
1076
|
-
gap: 6px;
|
|
1077
|
-
min-width: 0;
|
|
1078
|
-
font-size: 13px;
|
|
1079
|
-
line-height: 18px;
|
|
1080
|
-
color: var(--pactor-chat-fg);
|
|
1081
|
-
}
|
|
1082
|
-
|
|
1083
|
-
.pactor-chat-message__agent-icon {
|
|
1084
|
-
display: inline-flex;
|
|
1085
|
-
align-items: center;
|
|
1086
|
-
justify-content: center;
|
|
1087
|
-
flex-shrink: 0;
|
|
1088
|
-
width: 1.1em;
|
|
1089
|
-
height: 1.1em;
|
|
1090
|
-
color: var(--pactor-chat-muted-fg);
|
|
1091
|
-
}
|
|
1092
|
-
|
|
1093
|
-
img.pactor-chat-message__agent-icon {
|
|
1094
|
-
border-radius: var(--pactor-chat-radius-sm, 4px);
|
|
1095
|
-
object-fit: cover;
|
|
1096
|
-
}
|
|
1097
|
-
|
|
1098
|
-
.pactor-chat-message__agent-name {
|
|
1099
|
-
font-size: 1.1em;
|
|
1100
|
-
font-weight: 600;
|
|
1101
|
-
overflow: hidden;
|
|
1102
|
-
text-overflow: ellipsis;
|
|
1103
|
-
white-space: nowrap;
|
|
1104
|
-
}
|
|
1105
|
-
|
|
1106
|
-
/* system：居中弱提示 */
|
|
1107
1535
|
.pactor-chat-message--system {
|
|
1108
1536
|
align-items: center;
|
|
1109
1537
|
color: var(--pactor-chat-muted-fg);
|
|
1110
1538
|
font-size: 12px;
|
|
1111
1539
|
}
|
|
1112
|
-
|
|
1113
|
-
/* 待响应占位 */
|
|
1114
1540
|
.pactor-chat-message__pending {
|
|
1115
1541
|
color: var(--pactor-chat-muted-fg);
|
|
1116
1542
|
}
|
|
1117
|
-
|
|
1118
|
-
/* hover 操作条（assistant） */
|
|
1119
1543
|
.pactor-chat-message__actions {
|
|
1120
1544
|
display: flex;
|
|
1121
1545
|
gap: 4px;
|
|
1122
1546
|
transition: opacity 0.15s ease;
|
|
1123
1547
|
}
|
|
1124
|
-
|
|
1125
|
-
.pactor-chat-message:hover .pactor-chat-message__actions,
|
|
1126
|
-
.pactor-chat-message__actions:focus-within {
|
|
1548
|
+
.pactor-chat-message:hover .pactor-chat-message__actions, .pactor-chat-message__actions:focus-within {
|
|
1127
1549
|
opacity: 1;
|
|
1128
1550
|
}
|
|
1129
|
-
|
|
1130
|
-
/* error 消息的重试入口常显（不依赖 hover） */
|
|
1131
1551
|
.pactor-chat-message__actions--visible {
|
|
1132
1552
|
opacity: 1;
|
|
1133
1553
|
}
|
|
1134
|
-
|
|
1135
|
-
/* assistant 终态消息底部行：操作条 + 常显时间戳 */
|
|
1136
1554
|
.pactor-chat-message__footer {
|
|
1137
1555
|
display: flex;
|
|
1138
1556
|
align-items: center;
|
|
1139
1557
|
gap: 8px;
|
|
1140
1558
|
}
|
|
1141
|
-
|
|
1142
1559
|
.pactor-chat-message__time {
|
|
1143
1560
|
flex-shrink: 0;
|
|
1144
1561
|
color: var(--pactor-chat-muted-fg);
|
|
1145
1562
|
line-height: 18px;
|
|
1146
1563
|
}
|
|
1147
|
-
|
|
1148
|
-
/* user 消息内联编辑框（编辑重发） */
|
|
1149
1564
|
.pactor-chat-message__edit {
|
|
1150
1565
|
display: flex;
|
|
1151
1566
|
flex-direction: column;
|
|
@@ -1157,7 +1572,6 @@ img.pactor-chat-message__agent-icon {
|
|
|
1157
1572
|
border-radius: var(--pactor-chat-radius-lg);
|
|
1158
1573
|
background: var(--pactor-chat-user-bubble-bg);
|
|
1159
1574
|
}
|
|
1160
|
-
|
|
1161
1575
|
.pactor-chat-message__edit-input {
|
|
1162
1576
|
border: none;
|
|
1163
1577
|
outline: none;
|
|
@@ -1167,13 +1581,11 @@ img.pactor-chat-message__agent-icon {
|
|
|
1167
1581
|
font: inherit;
|
|
1168
1582
|
line-height: 1.6;
|
|
1169
1583
|
}
|
|
1170
|
-
|
|
1171
1584
|
.pactor-chat-message__edit-actions {
|
|
1172
1585
|
display: flex;
|
|
1173
1586
|
justify-content: flex-end;
|
|
1174
1587
|
gap: 8px;
|
|
1175
1588
|
}
|
|
1176
|
-
|
|
1177
1589
|
.pactor-chat-message__edit-button {
|
|
1178
1590
|
padding: 4px 12px;
|
|
1179
1591
|
border: 1px solid var(--pactor-chat-border);
|
|
@@ -1183,18 +1595,11 @@ img.pactor-chat-message__agent-icon {
|
|
|
1183
1595
|
font-size: 12.5px;
|
|
1184
1596
|
cursor: pointer;
|
|
1185
1597
|
}
|
|
1186
|
-
|
|
1187
1598
|
.pactor-chat-message__edit-button--confirm {
|
|
1188
1599
|
border-color: var(--pactor-chat-primary);
|
|
1189
1600
|
background: var(--pactor-chat-primary);
|
|
1190
1601
|
color: var(--pactor-chat-primary-fg);
|
|
1191
1602
|
}
|
|
1192
|
-
|
|
1193
|
-
/* ============================================================
|
|
1194
|
-
* 5. 图标按钮 / 浮动按钮
|
|
1195
|
-
* ============================================================ */
|
|
1196
|
-
|
|
1197
|
-
/* quiet 图标按钮：透明底，hover 增亮；图标统一 15px */
|
|
1198
1603
|
.pactor-chat-icon-button {
|
|
1199
1604
|
display: inline-flex;
|
|
1200
1605
|
align-items: center;
|
|
@@ -1205,27 +1610,19 @@ img.pactor-chat-message__agent-icon {
|
|
|
1205
1610
|
background: transparent;
|
|
1206
1611
|
color: var(--pactor-chat-muted-fg);
|
|
1207
1612
|
cursor: pointer;
|
|
1208
|
-
transition:
|
|
1209
|
-
background 0.15s ease,
|
|
1210
|
-
color 0.15s ease,
|
|
1211
|
-
transform 0.1s ease;
|
|
1613
|
+
transition: background 0.15s ease, color 0.15s ease, transform 0.1s ease;
|
|
1212
1614
|
}
|
|
1213
|
-
|
|
1214
1615
|
.pactor-chat-icon-button svg {
|
|
1215
1616
|
width: 15px;
|
|
1216
1617
|
height: 15px;
|
|
1217
1618
|
}
|
|
1218
|
-
|
|
1219
1619
|
.pactor-chat-icon-button:hover {
|
|
1220
1620
|
background: var(--pactor-chat-muted);
|
|
1221
1621
|
color: var(--pactor-chat-fg);
|
|
1222
1622
|
}
|
|
1223
|
-
|
|
1224
1623
|
.pactor-chat-icon-button:active {
|
|
1225
1624
|
transform: scale(0.92);
|
|
1226
1625
|
}
|
|
1227
|
-
|
|
1228
|
-
/* "回到底部"浮动按钮（bottom 避开滚动区底部 mask 渐隐带） */
|
|
1229
1626
|
.pactor-chat-scroll-bottom {
|
|
1230
1627
|
position: sticky;
|
|
1231
1628
|
bottom: 28px;
|
|
@@ -1242,26 +1639,16 @@ img.pactor-chat-message__agent-icon {
|
|
|
1242
1639
|
cursor: pointer;
|
|
1243
1640
|
box-shadow: var(--pactor-chat-shadow-composer);
|
|
1244
1641
|
}
|
|
1245
|
-
|
|
1246
1642
|
.pactor-chat-scroll-bottom:hover {
|
|
1247
1643
|
color: var(--pactor-chat-fg);
|
|
1248
1644
|
}
|
|
1249
|
-
|
|
1250
|
-
/* ============================================================
|
|
1251
|
-
* 6. 活动轨迹（spec: chat-activity-trace）：状态头 + 轨迹条目 + thinking
|
|
1252
|
-
* ============================================================ */
|
|
1253
|
-
|
|
1254
1645
|
.pactor-chat-trace {
|
|
1255
1646
|
display: flex;
|
|
1256
1647
|
flex-direction: column;
|
|
1257
1648
|
gap: 2px;
|
|
1258
1649
|
font-size: 12.5px;
|
|
1259
1650
|
}
|
|
1260
|
-
|
|
1261
|
-
/* 状态头 / 条目头 / thinking 头共用的单行按钮形态 */
|
|
1262
|
-
.pactor-chat-trace__header,
|
|
1263
|
-
.pactor-chat-trace__entry-header,
|
|
1264
|
-
.pactor-chat-thinking__header {
|
|
1651
|
+
.pactor-chat-trace__header, .pactor-chat-trace__entry-header, .pactor-chat-thinking__header {
|
|
1265
1652
|
display: flex;
|
|
1266
1653
|
align-items: center;
|
|
1267
1654
|
gap: 6px;
|
|
@@ -1273,94 +1660,61 @@ img.pactor-chat-message__agent-icon {
|
|
|
1273
1660
|
font-size: inherit;
|
|
1274
1661
|
text-align: left;
|
|
1275
1662
|
}
|
|
1276
|
-
|
|
1277
|
-
button.pactor-chat-trace__header,
|
|
1278
|
-
.pactor-chat-trace__entry-header,
|
|
1279
|
-
.pactor-chat-thinking__header {
|
|
1663
|
+
button.pactor-chat-trace__header, .pactor-chat-trace__entry-header, .pactor-chat-thinking__header {
|
|
1280
1664
|
cursor: pointer;
|
|
1281
1665
|
}
|
|
1282
|
-
|
|
1283
|
-
button.pactor-chat-trace__header:hover,
|
|
1284
|
-
.pactor-chat-trace__entry-header:hover,
|
|
1285
|
-
.pactor-chat-thinking__header:hover {
|
|
1666
|
+
button.pactor-chat-trace__header:hover, .pactor-chat-trace__entry-header:hover, .pactor-chat-thinking__header:hover {
|
|
1286
1667
|
color: var(--pactor-chat-fg);
|
|
1287
1668
|
}
|
|
1288
|
-
|
|
1289
|
-
/* 头部内图标/文字统一 flex 对齐（svg 默认按基线对齐会下沉） */
|
|
1290
|
-
.pactor-chat-trace__header > span,
|
|
1291
|
-
.pactor-chat-trace__entry-header > span,
|
|
1292
|
-
.pactor-chat-thinking__header > span {
|
|
1669
|
+
.pactor-chat-trace__header > span, .pactor-chat-trace__entry-header > span, .pactor-chat-thinking__header > span {
|
|
1293
1670
|
display: inline-flex;
|
|
1294
1671
|
align-items: center;
|
|
1295
1672
|
line-height: 1;
|
|
1296
1673
|
min-width: 0;
|
|
1297
1674
|
}
|
|
1298
|
-
|
|
1299
|
-
/* 状态文案：流式期间呼吸动画（纯 CSS） */
|
|
1300
1675
|
.pactor-chat-trace__status-text--breathing {
|
|
1301
1676
|
animation: pactor-chat-breathing 1.8s cubic-bezier(0.4, 0, 0.6, 1) infinite;
|
|
1302
1677
|
}
|
|
1303
|
-
|
|
1304
1678
|
@keyframes pactor-chat-breathing {
|
|
1305
|
-
0%,
|
|
1306
|
-
100% {
|
|
1679
|
+
0%, 100% {
|
|
1307
1680
|
opacity: 1;
|
|
1308
1681
|
}
|
|
1309
1682
|
50% {
|
|
1310
1683
|
opacity: 0.45;
|
|
1311
1684
|
}
|
|
1312
1685
|
}
|
|
1313
|
-
|
|
1314
|
-
/* 状态图标脉冲：流式期间（图标为 spinner 时）轻微缩放逐帧"呼吸"，
|
|
1315
|
-
与文案呼吸不同周期，避免机械同步感 */
|
|
1316
|
-
.pactor-chat-trace__status-icon:has(.pactor-chat-spin),
|
|
1317
|
-
.pactor-chat-thinking[data-streaming='true'] .pactor-chat-thinking__icon {
|
|
1686
|
+
.pactor-chat-trace__status-icon:has(.pactor-chat-spin), .pactor-chat-thinking[data-streaming='true'] .pactor-chat-thinking__icon {
|
|
1318
1687
|
animation: pactor-chat-mark-pulse 2.4s cubic-bezier(0.4, 0, 0.6, 1) infinite;
|
|
1319
1688
|
transform-origin: center;
|
|
1320
1689
|
}
|
|
1321
|
-
|
|
1322
1690
|
@keyframes pactor-chat-mark-pulse {
|
|
1323
|
-
0%,
|
|
1324
|
-
100% {
|
|
1691
|
+
0%, 100% {
|
|
1325
1692
|
transform: scale(0.9);
|
|
1326
1693
|
}
|
|
1327
1694
|
50% {
|
|
1328
1695
|
transform: scale(1.08);
|
|
1329
1696
|
}
|
|
1330
1697
|
}
|
|
1331
|
-
|
|
1332
1698
|
.pactor-chat-trace__elapsed {
|
|
1333
1699
|
color: var(--pactor-chat-muted-fg);
|
|
1334
1700
|
font-variant-numeric: tabular-nums;
|
|
1335
1701
|
}
|
|
1336
|
-
|
|
1337
|
-
/* chevron 展开旋转（状态头 / 条目 / thinking 共用） */
|
|
1338
1702
|
.pactor-chat-trace__chevron {
|
|
1339
1703
|
display: inline-flex;
|
|
1340
1704
|
flex-shrink: 0;
|
|
1341
1705
|
transition: transform 0.15s ease;
|
|
1342
1706
|
}
|
|
1343
|
-
|
|
1344
|
-
.pactor-chat-trace[data-open='true'] > .pactor-chat-trace__header
|
|
1345
|
-
.pactor-chat-trace__chevron,
|
|
1346
|
-
.pactor-chat-trace__entry[data-open='true'] .pactor-chat-trace__chevron,
|
|
1347
|
-
.pactor-chat-thinking[data-open='true'] .pactor-chat-trace__chevron {
|
|
1707
|
+
.pactor-chat-trace[data-open='true'] > .pactor-chat-trace__header .pactor-chat-trace__chevron, .pactor-chat-trace__entry[data-open='true'] .pactor-chat-trace__chevron, .pactor-chat-thinking[data-open='true'] .pactor-chat-trace__chevron {
|
|
1348
1708
|
transform: rotate(90deg);
|
|
1349
1709
|
}
|
|
1350
|
-
|
|
1351
|
-
/* 轨迹条目列表：缩进对齐状态头文本 */
|
|
1352
1710
|
.pactor-chat-trace__entries {
|
|
1353
1711
|
display: flex;
|
|
1354
1712
|
flex-direction: column;
|
|
1355
1713
|
gap: 2px;
|
|
1356
|
-
/* margin-left: 4px; */
|
|
1357
1714
|
}
|
|
1358
|
-
|
|
1359
1715
|
.pactor-chat-trace__entry-title {
|
|
1360
1716
|
flex-shrink: 0;
|
|
1361
1717
|
}
|
|
1362
|
-
|
|
1363
|
-
/* 参数摘要：单行省略 */
|
|
1364
1718
|
.pactor-chat-trace__entry-args {
|
|
1365
1719
|
flex: 1;
|
|
1366
1720
|
overflow: hidden;
|
|
@@ -1369,83 +1723,59 @@ button.pactor-chat-trace__header:hover,
|
|
|
1369
1723
|
color: var(--pactor-chat-muted-fg);
|
|
1370
1724
|
opacity: 0.8;
|
|
1371
1725
|
}
|
|
1372
|
-
|
|
1373
|
-
/* 条目状态色 */
|
|
1374
1726
|
.pactor-chat-trace__entry[data-status='running'] .pactor-chat-trace__entry-icon {
|
|
1375
1727
|
color: var(--pactor-chat-primary);
|
|
1376
1728
|
}
|
|
1377
|
-
|
|
1378
1729
|
.pactor-chat-trace__entry[data-status='success'] .pactor-chat-trace__entry-icon {
|
|
1379
1730
|
color: var(--pactor-chat-success);
|
|
1380
1731
|
}
|
|
1381
|
-
|
|
1382
1732
|
.pactor-chat-trace__entry[data-status='failed'] .pactor-chat-trace__entry-icon {
|
|
1383
1733
|
color: var(--pactor-chat-danger);
|
|
1384
1734
|
}
|
|
1385
|
-
|
|
1386
|
-
/* 展开详情：参数与结果/错误 */
|
|
1387
1735
|
.pactor-chat-trace__entry-body {
|
|
1388
1736
|
padding: 2px 0 6px 24px;
|
|
1389
1737
|
color: var(--pactor-chat-muted-fg);
|
|
1390
1738
|
}
|
|
1391
|
-
|
|
1392
1739
|
.pactor-chat-trace__entry-detail {
|
|
1393
1740
|
margin: 0;
|
|
1394
1741
|
font-size: 12px;
|
|
1395
1742
|
white-space: pre-wrap;
|
|
1396
1743
|
word-break: break-word;
|
|
1397
1744
|
}
|
|
1398
|
-
|
|
1399
|
-
/* thinking 折叠卡：进行中指示（图标旋转沿用 .pactor-chat-spin） */
|
|
1400
1745
|
.pactor-chat-thinking__icon {
|
|
1401
1746
|
color: var(--pactor-chat-muted-fg);
|
|
1402
1747
|
}
|
|
1403
|
-
|
|
1404
1748
|
.pactor-chat-thinking[data-streaming='true'] .pactor-chat-thinking__icon {
|
|
1405
1749
|
color: var(--pactor-chat-primary);
|
|
1406
1750
|
}
|
|
1407
|
-
|
|
1408
1751
|
.pactor-chat-thinking__body {
|
|
1409
1752
|
padding: 2px 0 6px 24px;
|
|
1410
1753
|
color: var(--pactor-chat-muted-fg);
|
|
1411
1754
|
}
|
|
1412
|
-
|
|
1413
|
-
/* 流式期间的纯文本正文（结束后回切 markdown 渲染） */
|
|
1414
1755
|
.pactor-chat-thinking__text {
|
|
1415
1756
|
white-space: pre-wrap;
|
|
1416
1757
|
word-break: break-word;
|
|
1417
1758
|
font-size: 13px;
|
|
1418
1759
|
line-height: 1.6;
|
|
1419
1760
|
}
|
|
1420
|
-
|
|
1421
1761
|
.pactor-chat-thinking__body .pactor-markdown > :first-child {
|
|
1422
1762
|
margin-top: 0;
|
|
1423
1763
|
}
|
|
1424
|
-
|
|
1425
1764
|
.pactor-chat-thinking__body .pactor-markdown > :last-child {
|
|
1426
1765
|
margin-bottom: 0;
|
|
1427
1766
|
}
|
|
1428
|
-
|
|
1429
|
-
/* running 旋转 */
|
|
1430
1767
|
.pactor-chat-spin {
|
|
1431
1768
|
animation: pactor-chat-spin 1s linear infinite;
|
|
1432
1769
|
}
|
|
1433
|
-
|
|
1434
1770
|
@keyframes pactor-chat-spin {
|
|
1435
1771
|
to {
|
|
1436
1772
|
transform: rotate(360deg);
|
|
1437
1773
|
}
|
|
1438
1774
|
}
|
|
1439
|
-
|
|
1440
|
-
/* ============================================================
|
|
1441
|
-
* 7. 其他 part
|
|
1442
|
-
* ============================================================ */
|
|
1443
|
-
|
|
1444
1775
|
.pactor-chat-text {
|
|
1445
1776
|
white-space: pre-wrap;
|
|
1446
1777
|
word-break: break-word;
|
|
1447
1778
|
}
|
|
1448
|
-
|
|
1449
1779
|
.pactor-chat-error {
|
|
1450
1780
|
display: flex;
|
|
1451
1781
|
align-items: flex-start;
|
|
@@ -1457,24 +1787,19 @@ button.pactor-chat-trace__header:hover,
|
|
|
1457
1787
|
color: var(--pactor-chat-danger);
|
|
1458
1788
|
font-size: 12.5px;
|
|
1459
1789
|
}
|
|
1460
|
-
|
|
1461
|
-
/* 图标与首行文字对齐（svg 默认按基线对齐会下沉） */
|
|
1462
1790
|
.pactor-chat-error > svg {
|
|
1463
1791
|
flex-shrink: 0;
|
|
1464
1792
|
margin-top: 3px;
|
|
1465
1793
|
display: block;
|
|
1466
1794
|
}
|
|
1467
|
-
|
|
1468
1795
|
.pactor-chat-status {
|
|
1469
1796
|
color: var(--pactor-chat-muted-fg);
|
|
1470
1797
|
font-size: 12px;
|
|
1471
1798
|
}
|
|
1472
|
-
|
|
1473
1799
|
.pactor-chat-dsl-pending {
|
|
1474
1800
|
color: var(--pactor-chat-muted-fg);
|
|
1475
1801
|
font-size: 12px;
|
|
1476
1802
|
}
|
|
1477
|
-
|
|
1478
1803
|
.pactor-chat-denied {
|
|
1479
1804
|
border: 1px dashed var(--pactor-chat-border);
|
|
1480
1805
|
border-radius: var(--pactor-chat-radius-sm);
|
|
@@ -1482,19 +1807,12 @@ button.pactor-chat-trace__header:hover,
|
|
|
1482
1807
|
color: var(--pactor-chat-muted-fg);
|
|
1483
1808
|
font-size: 12px;
|
|
1484
1809
|
}
|
|
1485
|
-
|
|
1486
|
-
/* ============================================================
|
|
1487
|
-
* 8. Markdown 排版（chat 作为 pactor-markdown 的宿主主题）
|
|
1488
|
-
* ============================================================ */
|
|
1489
|
-
|
|
1490
1810
|
.pactor-chat-view .pactor-markdown > :first-child {
|
|
1491
1811
|
margin-top: 0;
|
|
1492
1812
|
}
|
|
1493
|
-
|
|
1494
1813
|
.pactor-chat-view .pactor-markdown > :last-child {
|
|
1495
1814
|
margin-bottom: 0;
|
|
1496
1815
|
}
|
|
1497
|
-
|
|
1498
1816
|
.pactor-chat-view .pactor-markdown pre {
|
|
1499
1817
|
margin: 8px 0;
|
|
1500
1818
|
padding: 10px 12px;
|
|
@@ -1504,98 +1822,40 @@ button.pactor-chat-trace__header:hover,
|
|
|
1504
1822
|
overflow-x: auto;
|
|
1505
1823
|
font-size: 12.5px;
|
|
1506
1824
|
}
|
|
1507
|
-
|
|
1508
1825
|
.pactor-chat-view .pactor-markdown :not(pre) > code {
|
|
1509
1826
|
padding: 2px 5px;
|
|
1510
1827
|
border-radius: 4px;
|
|
1511
1828
|
background: var(--pactor-chat-code-bg);
|
|
1512
1829
|
font-size: 0.9em;
|
|
1513
1830
|
}
|
|
1514
|
-
|
|
1515
1831
|
.pactor-chat-view .pactor-markdown table {
|
|
1516
1832
|
border-collapse: collapse;
|
|
1517
1833
|
margin: 8px 0;
|
|
1518
1834
|
}
|
|
1519
|
-
|
|
1520
|
-
.pactor-chat-view .pactor-markdown th,
|
|
1521
|
-
.pactor-chat-view .pactor-markdown td {
|
|
1835
|
+
.pactor-chat-view .pactor-markdown th, .pactor-chat-view .pactor-markdown td {
|
|
1522
1836
|
padding: 6px 12px;
|
|
1523
1837
|
border: 1px solid var(--pactor-chat-border);
|
|
1524
1838
|
}
|
|
1525
|
-
|
|
1526
1839
|
.pactor-chat-view .pactor-markdown th {
|
|
1527
1840
|
background: var(--pactor-chat-muted);
|
|
1528
1841
|
}
|
|
1529
|
-
|
|
1530
1842
|
.pactor-chat-view .pactor-markdown a {
|
|
1531
1843
|
color: var(--pactor-chat-primary);
|
|
1532
1844
|
}
|
|
1533
|
-
|
|
1534
1845
|
.pactor-chat-view .pactor-markdown blockquote {
|
|
1535
1846
|
margin: 8px 0;
|
|
1536
1847
|
padding: 2px 12px;
|
|
1537
1848
|
border-left: 3px solid var(--pactor-chat-border);
|
|
1538
1849
|
color: var(--pactor-chat-muted-fg);
|
|
1539
1850
|
}
|
|
1540
|
-
|
|
1541
1851
|
.pactor-chat-view .pactor-markdown img {
|
|
1542
1852
|
max-width: 100%;
|
|
1543
1853
|
}
|
|
1544
|
-
|
|
1545
|
-
/* ============================================================
|
|
1546
|
-
* 9. Composer
|
|
1547
|
-
* ============================================================ */
|
|
1548
|
-
|
|
1549
1854
|
.pactor-chat-composer {
|
|
1550
1855
|
display: flex;
|
|
1551
1856
|
flex-direction: column;
|
|
1552
1857
|
gap: 8px;
|
|
1553
|
-
padding: 12px 14px;
|
|
1554
|
-
border: 1px solid var(--pactor-chat-border);
|
|
1555
|
-
border-radius: var(--pactor-chat-radius-xl);
|
|
1556
|
-
background: var(--pactor-chat-card);
|
|
1557
|
-
box-shadow: var(--pactor-chat-shadow-composer);
|
|
1558
|
-
transition: border-color 0.15s ease;
|
|
1559
|
-
}
|
|
1560
|
-
|
|
1561
|
-
.pactor-chat-composer:focus-within {
|
|
1562
|
-
border-color: var(--pactor-chat-primary);
|
|
1563
|
-
}
|
|
1564
|
-
|
|
1565
|
-
/* 拖拽悬停视觉态（附件拖入时） */
|
|
1566
|
-
.pactor-chat-composer--dragover {
|
|
1567
|
-
border-color: var(--pactor-chat-primary);
|
|
1568
|
-
background: var(--pactor-chat-muted);
|
|
1569
|
-
}
|
|
1570
|
-
|
|
1571
|
-
/* 输入行：textarea + 发送/停止按钮 */
|
|
1572
|
-
.pactor-chat-composer__row {
|
|
1573
|
-
display: flex;
|
|
1574
|
-
gap: 8px;
|
|
1575
|
-
align-items: flex-end;
|
|
1576
1858
|
}
|
|
1577
|
-
|
|
1578
|
-
.pactor-chat-composer__input {
|
|
1579
|
-
flex: 1;
|
|
1580
|
-
min-width: 0;
|
|
1581
|
-
border: none;
|
|
1582
|
-
outline: none;
|
|
1583
|
-
resize: none;
|
|
1584
|
-
background: transparent;
|
|
1585
|
-
color: var(--pactor-chat-fg);
|
|
1586
|
-
font: inherit;
|
|
1587
|
-
line-height: 22px;
|
|
1588
|
-
/* 单行时与 32px 发送按钮等高，文字（含 placeholder）垂直居中 */
|
|
1589
|
-
min-height: 32px;
|
|
1590
|
-
padding: 5px 0;
|
|
1591
|
-
max-height: 200px;
|
|
1592
|
-
}
|
|
1593
|
-
|
|
1594
|
-
.pactor-chat-composer__input::placeholder {
|
|
1595
|
-
color: var(--pactor-chat-muted-fg);
|
|
1596
|
-
}
|
|
1597
|
-
|
|
1598
|
-
/* 发送 / 停止按钮：圆形主按钮 */
|
|
1599
1859
|
.pactor-chat-composer__button {
|
|
1600
1860
|
position: relative;
|
|
1601
1861
|
display: inline-flex;
|
|
@@ -1611,17 +1871,13 @@ button.pactor-chat-trace__header:hover,
|
|
|
1611
1871
|
cursor: pointer;
|
|
1612
1872
|
transition: opacity 0.15s ease;
|
|
1613
1873
|
}
|
|
1614
|
-
|
|
1615
1874
|
.pactor-chat-composer__button:disabled {
|
|
1616
1875
|
opacity: 0.4;
|
|
1617
1876
|
cursor: not-allowed;
|
|
1618
1877
|
}
|
|
1619
|
-
|
|
1620
1878
|
.pactor-chat-composer__button--stop {
|
|
1621
1879
|
background: var(--pactor-chat-danger);
|
|
1622
1880
|
}
|
|
1623
|
-
|
|
1624
|
-
/* 停止态进行中光环（纯 CSS keyframes，随按钮圆形） */
|
|
1625
1881
|
.pactor-chat-composer__button--stop::after {
|
|
1626
1882
|
content: '';
|
|
1627
1883
|
position: absolute;
|
|
@@ -1631,7 +1887,6 @@ button.pactor-chat-trace__header:hover,
|
|
|
1631
1887
|
pointer-events: none;
|
|
1632
1888
|
animation: pactor-chat-ring 1.4s ease-out infinite;
|
|
1633
1889
|
}
|
|
1634
|
-
|
|
1635
1890
|
@keyframes pactor-chat-ring {
|
|
1636
1891
|
0% {
|
|
1637
1892
|
transform: scale(0.92);
|
|
@@ -1642,14 +1897,11 @@ button.pactor-chat-trace__header:hover,
|
|
|
1642
1897
|
opacity: 0;
|
|
1643
1898
|
}
|
|
1644
1899
|
}
|
|
1645
|
-
|
|
1646
|
-
/* 附件卡片区 */
|
|
1647
1900
|
.pactor-chat-composer__attachments {
|
|
1648
1901
|
display: flex;
|
|
1649
1902
|
flex-wrap: wrap;
|
|
1650
1903
|
gap: 8px;
|
|
1651
1904
|
}
|
|
1652
|
-
|
|
1653
1905
|
.pactor-chat-composer__attachment {
|
|
1654
1906
|
position: relative;
|
|
1655
1907
|
display: inline-flex;
|
|
@@ -1659,7 +1911,6 @@ button.pactor-chat-trace__header:hover,
|
|
|
1659
1911
|
background: var(--pactor-chat-muted);
|
|
1660
1912
|
cursor: pointer;
|
|
1661
1913
|
}
|
|
1662
|
-
|
|
1663
1914
|
.pactor-chat-composer__attachment-thumb img {
|
|
1664
1915
|
display: block;
|
|
1665
1916
|
width: 40px;
|
|
@@ -1667,7 +1918,6 @@ button.pactor-chat-trace__header:hover,
|
|
|
1667
1918
|
object-fit: cover;
|
|
1668
1919
|
border-radius: 7px;
|
|
1669
1920
|
}
|
|
1670
|
-
|
|
1671
1921
|
.pactor-chat-composer__attachment-info {
|
|
1672
1922
|
display: inline-flex;
|
|
1673
1923
|
align-items: center;
|
|
@@ -1676,18 +1926,15 @@ button.pactor-chat-trace__header:hover,
|
|
|
1676
1926
|
font-size: 12.5px;
|
|
1677
1927
|
color: var(--pactor-chat-fg);
|
|
1678
1928
|
}
|
|
1679
|
-
|
|
1680
1929
|
.pactor-chat-composer__attachment-name {
|
|
1681
1930
|
max-width: 160px;
|
|
1682
1931
|
overflow: hidden;
|
|
1683
1932
|
text-overflow: ellipsis;
|
|
1684
1933
|
white-space: nowrap;
|
|
1685
1934
|
}
|
|
1686
|
-
|
|
1687
1935
|
.pactor-chat-composer__attachment-size {
|
|
1688
1936
|
color: var(--pactor-chat-muted-fg);
|
|
1689
1937
|
}
|
|
1690
|
-
|
|
1691
1938
|
.pactor-chat-composer__attachment-remove {
|
|
1692
1939
|
position: absolute;
|
|
1693
1940
|
top: -6px;
|
|
@@ -1697,79 +1944,25 @@ button.pactor-chat-trace__header:hover,
|
|
|
1697
1944
|
border-radius: 50%;
|
|
1698
1945
|
background: var(--pactor-chat-card);
|
|
1699
1946
|
}
|
|
1700
|
-
|
|
1701
|
-
/* 移除按钮是微型圆形按钮，保持 12px 小图标 */
|
|
1702
1947
|
.pactor-chat-composer__attachment-remove svg {
|
|
1703
1948
|
width: 12px;
|
|
1704
1949
|
height: 12px;
|
|
1705
1950
|
}
|
|
1706
|
-
|
|
1707
|
-
/* 工具栏：渲染槽 + "+" / 附件入口 */
|
|
1708
|
-
.pactor-chat-composer__toolbar {
|
|
1709
|
-
display: flex;
|
|
1710
|
-
align-items: center;
|
|
1711
|
-
flex-wrap: wrap;
|
|
1712
|
-
gap: 6px;
|
|
1713
|
-
}
|
|
1714
|
-
|
|
1715
|
-
.pactor-chat-composer__toolbar-spacer {
|
|
1716
|
-
flex: 1;
|
|
1717
|
-
}
|
|
1718
|
-
|
|
1719
|
-
/* Composer footer 槽（spec: chat-composer-slots / Composer footer 槽）：
|
|
1720
|
-
工具栏下方的自定义区域，结构与 ChatInput footer 一致（border-t 分隔） */
|
|
1721
|
-
.pactor-chat-composer__footer {
|
|
1722
|
-
display: flex;
|
|
1723
|
-
align-items: center;
|
|
1724
|
-
flex-wrap: wrap;
|
|
1725
|
-
gap: 6px;
|
|
1726
|
-
margin: 0 -14px -12px;
|
|
1727
|
-
padding: 8px 12px 0;
|
|
1728
|
-
border-top: 1px solid var(--pactor-chat-border);
|
|
1729
|
-
}
|
|
1730
|
-
|
|
1731
|
-
/* ------------------------------------------------------------
|
|
1732
|
-
* Composer DSL 呈现路径（spec: chat-composer-on-chatinput）：
|
|
1733
|
-
* 盒模型让位 ChatInput 容器（边框 / 圆角 / 阴影 / 内边距由
|
|
1734
|
-
* ChatInput 承担，经 pactor-chat-chrome 令牌映射着色），本容器
|
|
1735
|
-
* 只保留布局与拖放态；focus 高亮由 ChatInput 自身 focus-within
|
|
1736
|
-
* ring 承担，避免双层描边。
|
|
1737
|
-
* ------------------------------------------------------------ */
|
|
1738
1951
|
.pactor-chat-composer--dsl {
|
|
1739
|
-
|
|
1740
|
-
border-
|
|
1741
|
-
background: transparent;
|
|
1742
|
-
box-shadow: none;
|
|
1743
|
-
}
|
|
1744
|
-
|
|
1745
|
-
.pactor-chat-composer--dsl:focus-within {
|
|
1746
|
-
border-color: transparent;
|
|
1952
|
+
border: 1px solid transparent;
|
|
1953
|
+
border-radius: var(--pactor-chat-radius-xl);
|
|
1747
1954
|
}
|
|
1748
|
-
|
|
1749
1955
|
.pactor-chat-composer--dsl.pactor-chat-composer--dragover {
|
|
1750
1956
|
border-color: var(--pactor-chat-primary);
|
|
1751
|
-
|
|
1957
|
+
background: var(--pactor-chat-muted);
|
|
1752
1958
|
}
|
|
1753
|
-
|
|
1754
|
-
/* 输入高度下限 / 上限（与 ChatInput textarea 的 min-h-[60px] 一致；
|
|
1755
|
-
自适应由 field-sizing-content 承担，超上限内部滚动） */
|
|
1756
1959
|
.pactor-chat-composer--dsl [data-slot='chat-input'] textarea {
|
|
1757
1960
|
min-height: 60px;
|
|
1758
1961
|
max-height: 200px;
|
|
1759
1962
|
}
|
|
1760
|
-
|
|
1761
|
-
/* header 槽空态（无附件无 chips）时收起包装，避免多余上间距 */
|
|
1762
1963
|
.pactor-chat-composer--dsl [data-slot='chat-input'] > .px-3.pt-3:empty {
|
|
1763
1964
|
display: none;
|
|
1764
1965
|
}
|
|
1765
|
-
|
|
1766
|
-
/* ------------------------------------------------------------
|
|
1767
|
-
* 内建锚定弹层 AnchoredPopover（chat-builtin-features 设计决策 D3）：
|
|
1768
|
-
* position: fixed，top/bottom/left 由 JS 按锚点计算（上方优先、
|
|
1769
|
-
* 空间不足翻转为 --below）；首帧 visibility:hidden 量高后显示。
|
|
1770
|
-
* 浮于 chat 内其它浮层之上（侧栏抽屉 50 / 遮罩 40 之上）。
|
|
1771
|
-
* ------------------------------------------------------------ */
|
|
1772
|
-
|
|
1773
1966
|
.pactor-chat-popover {
|
|
1774
1967
|
position: fixed;
|
|
1775
1968
|
z-index: 60;
|
|
@@ -1786,14 +1979,6 @@ button.pactor-chat-trace__header:hover,
|
|
|
1786
1979
|
scrollbar-width: thin;
|
|
1787
1980
|
scrollbar-color: var(--pactor-chat-border) transparent;
|
|
1788
1981
|
}
|
|
1789
|
-
|
|
1790
|
-
/* ------------------------------------------------------------
|
|
1791
|
-
* 内建特性（chat-builtin-features）：模型 chip / 上下文 chips /
|
|
1792
|
-
* 弹层候选列表 / header 操作组与可编辑标题。全部只用既有
|
|
1793
|
-
* --pactor-chat-* 语义令牌，暗色经令牌覆盖自动生效。
|
|
1794
|
-
* ------------------------------------------------------------ */
|
|
1795
|
-
|
|
1796
|
-
/* 弹层候选行（模型列表 / 上下文候选共用） */
|
|
1797
1982
|
.pactor-chat-popover__item {
|
|
1798
1983
|
display: flex;
|
|
1799
1984
|
align-items: center;
|
|
@@ -1810,11 +1995,9 @@ button.pactor-chat-trace__header:hover,
|
|
|
1810
1995
|
cursor: pointer;
|
|
1811
1996
|
transition: background 0.15s ease;
|
|
1812
1997
|
}
|
|
1813
|
-
|
|
1814
1998
|
.pactor-chat-popover__item:hover {
|
|
1815
1999
|
background: var(--pactor-chat-muted);
|
|
1816
2000
|
}
|
|
1817
|
-
|
|
1818
2001
|
.pactor-chat-popover__item-label {
|
|
1819
2002
|
flex: 1;
|
|
1820
2003
|
min-width: 0;
|
|
@@ -1822,47 +2005,36 @@ button.pactor-chat-trace__header:hover,
|
|
|
1822
2005
|
text-overflow: ellipsis;
|
|
1823
2006
|
white-space: nowrap;
|
|
1824
2007
|
}
|
|
1825
|
-
|
|
1826
|
-
/* 选中项勾选标记 */
|
|
1827
2008
|
.pactor-chat-popover__item-check {
|
|
1828
2009
|
flex-shrink: 0;
|
|
1829
2010
|
color: var(--pactor-chat-primary);
|
|
1830
2011
|
}
|
|
1831
|
-
|
|
1832
|
-
/* 上下文候选列表：分组头 / loading 与空态提示 / 内联错误 */
|
|
1833
2012
|
.pactor-chat-source-list {
|
|
1834
2013
|
display: flex;
|
|
1835
2014
|
flex-direction: column;
|
|
1836
2015
|
gap: 2px;
|
|
1837
2016
|
min-width: 180px;
|
|
1838
2017
|
}
|
|
1839
|
-
|
|
1840
2018
|
.pactor-chat-source-list__group {
|
|
1841
2019
|
display: flex;
|
|
1842
2020
|
flex-direction: column;
|
|
1843
2021
|
gap: 2px;
|
|
1844
2022
|
}
|
|
1845
|
-
|
|
1846
2023
|
.pactor-chat-source-list__group-label {
|
|
1847
2024
|
padding: 6px 10px 2px;
|
|
1848
2025
|
color: var(--pactor-chat-muted-fg);
|
|
1849
2026
|
font-size: 12px;
|
|
1850
2027
|
}
|
|
1851
|
-
|
|
1852
2028
|
.pactor-chat-source-list__hint {
|
|
1853
2029
|
padding: 6px 10px;
|
|
1854
2030
|
color: var(--pactor-chat-muted-fg);
|
|
1855
2031
|
font-size: 12.5px;
|
|
1856
2032
|
}
|
|
1857
|
-
|
|
1858
2033
|
.pactor-chat-source-list__error {
|
|
1859
2034
|
padding: 6px 10px;
|
|
1860
2035
|
color: var(--pactor-chat-danger);
|
|
1861
2036
|
font-size: 12.5px;
|
|
1862
2037
|
}
|
|
1863
|
-
|
|
1864
|
-
/* 内建模型 chip（Composer 工具栏右端，toolbarEnd 槽内容之前）：
|
|
1865
|
-
无边框 ghost 形态（边框在工具栏里显脏），hover 以浅底反馈 */
|
|
1866
2038
|
.pactor-chat-model-chip {
|
|
1867
2039
|
display: inline-flex;
|
|
1868
2040
|
align-items: center;
|
|
@@ -1874,26 +2046,17 @@ button.pactor-chat-trace__header:hover,
|
|
|
1874
2046
|
color: var(--pactor-chat-muted-fg);
|
|
1875
2047
|
font-size: 12.5px;
|
|
1876
2048
|
cursor: pointer;
|
|
1877
|
-
transition:
|
|
1878
|
-
background-color 0.15s ease,
|
|
1879
|
-
color 0.15s ease;
|
|
2049
|
+
transition: background-color 0.15s ease, color 0.15s ease;
|
|
1880
2050
|
}
|
|
1881
|
-
|
|
1882
2051
|
.pactor-chat-model-chip:hover {
|
|
1883
2052
|
background: var(--pactor-chat-muted);
|
|
1884
2053
|
color: var(--pactor-chat-fg);
|
|
1885
2054
|
}
|
|
1886
|
-
|
|
1887
|
-
/* ModelSelect DSL 路径（spec: chat-on-ui-components）：ui Select
|
|
1888
|
-
收敛到工具栏节奏（触发器尺寸与 chip 相当，颜色经 chrome 令牌映射）；
|
|
1889
|
-
触发器同为无边框 ghost 形态（覆盖 shadcn Select 的表单边框/阴影），
|
|
1890
|
-
与 fallback chip 视觉一致 */
|
|
1891
2055
|
.pactor-chat-model-select {
|
|
1892
2056
|
width: auto;
|
|
1893
2057
|
min-width: 112px;
|
|
1894
2058
|
font-size: 12.5px;
|
|
1895
2059
|
}
|
|
1896
|
-
|
|
1897
2060
|
.pactor-chat-model-select [data-slot='select-trigger'] {
|
|
1898
2061
|
height: auto;
|
|
1899
2062
|
gap: 4px;
|
|
@@ -1903,42 +2066,29 @@ button.pactor-chat-trace__header:hover,
|
|
|
1903
2066
|
box-shadow: none;
|
|
1904
2067
|
color: var(--pactor-chat-muted-fg);
|
|
1905
2068
|
font-size: 12.5px;
|
|
1906
|
-
transition:
|
|
1907
|
-
background-color 0.15s ease,
|
|
1908
|
-
color 0.15s ease;
|
|
2069
|
+
transition: background-color 0.15s ease, color 0.15s ease;
|
|
1909
2070
|
}
|
|
1910
|
-
|
|
1911
2071
|
.pactor-chat-model-select [data-slot='select-trigger']:hover {
|
|
1912
2072
|
background: var(--pactor-chat-muted);
|
|
1913
2073
|
color: var(--pactor-chat-fg);
|
|
1914
2074
|
}
|
|
1915
|
-
|
|
1916
|
-
/* 实心图标（spec: chat-icon-convergence）：停止钮方形等需 fill 的
|
|
1917
|
-
图标（ui Icon 走描边体系，fill 经 CSS 覆盖 lucide svg 的 fill=none） */
|
|
1918
2075
|
.pactor-chat-icon-fill {
|
|
1919
2076
|
fill: currentColor;
|
|
1920
2077
|
}
|
|
1921
|
-
|
|
1922
|
-
/* ArtifactPanel 标题栏 DSL 路径（spec: chat-on-ui-components）：
|
|
1923
|
-
chrome 容器 display:contents，DSL Flex 占满标题行 */
|
|
1924
2078
|
.pactor-chat-inspector__header-dsl {
|
|
1925
2079
|
width: 100%;
|
|
1926
2080
|
}
|
|
1927
|
-
|
|
1928
2081
|
.pactor-chat-model-chip__label {
|
|
1929
2082
|
max-width: 160px;
|
|
1930
2083
|
overflow: hidden;
|
|
1931
2084
|
text-overflow: ellipsis;
|
|
1932
2085
|
white-space: nowrap;
|
|
1933
2086
|
}
|
|
1934
|
-
|
|
1935
|
-
/* 上下文 chips 区（输入区上方） */
|
|
1936
2087
|
.pactor-chat-composer__contexts {
|
|
1937
2088
|
display: flex;
|
|
1938
2089
|
flex-wrap: wrap;
|
|
1939
2090
|
gap: 6px;
|
|
1940
2091
|
}
|
|
1941
|
-
|
|
1942
2092
|
.pactor-chat-context-chip {
|
|
1943
2093
|
display: inline-flex;
|
|
1944
2094
|
align-items: center;
|
|
@@ -1950,46 +2100,35 @@ button.pactor-chat-trace__header:hover,
|
|
|
1950
2100
|
color: var(--pactor-chat-fg);
|
|
1951
2101
|
font-size: 12.5px;
|
|
1952
2102
|
}
|
|
1953
|
-
|
|
1954
2103
|
.pactor-chat-context-chip__label {
|
|
1955
2104
|
max-width: 180px;
|
|
1956
2105
|
overflow: hidden;
|
|
1957
2106
|
text-overflow: ellipsis;
|
|
1958
2107
|
white-space: nowrap;
|
|
1959
2108
|
}
|
|
1960
|
-
|
|
1961
2109
|
.pactor-chat-context-chip__remove {
|
|
1962
2110
|
padding: 2px;
|
|
1963
2111
|
}
|
|
1964
|
-
|
|
1965
2112
|
.pactor-chat-context-chip__remove svg {
|
|
1966
2113
|
width: 12px;
|
|
1967
2114
|
height: 12px;
|
|
1968
2115
|
}
|
|
1969
|
-
|
|
1970
|
-
/* 内建 header 操作组 + 可编辑标题（spec: chat-dsl-component / Header 配置） */
|
|
1971
|
-
/* header 位模型 chip（spec: chat-model-selector，决策 D2）：chip + title
|
|
1972
|
-
* 组成左端组（chip 在 title 之前）；未配置 headerStart 槽时不渲染本容器 */
|
|
1973
2116
|
.pactor-chat-workspace__header-left {
|
|
1974
2117
|
display: flex;
|
|
1975
2118
|
align-items: center;
|
|
1976
2119
|
gap: 10px;
|
|
1977
2120
|
min-width: 0;
|
|
1978
2121
|
}
|
|
1979
|
-
|
|
1980
2122
|
.pactor-chat-workspace__header-right {
|
|
1981
2123
|
display: flex;
|
|
1982
2124
|
align-items: center;
|
|
1983
2125
|
gap: 8px;
|
|
1984
2126
|
}
|
|
1985
|
-
|
|
1986
2127
|
.pactor-chat-workspace__header-actions {
|
|
1987
2128
|
display: flex;
|
|
1988
2129
|
align-items: center;
|
|
1989
2130
|
gap: 4px;
|
|
1990
2131
|
}
|
|
1991
|
-
|
|
1992
|
-
/* 可编辑标题：按钮形态继承标题排版，hover 提示可点击 */
|
|
1993
2132
|
.pactor-chat-workspace__title--editable {
|
|
1994
2133
|
border: none;
|
|
1995
2134
|
border-radius: var(--pactor-chat-radius-sm);
|
|
@@ -1998,11 +2137,9 @@ button.pactor-chat-trace__header:hover,
|
|
|
1998
2137
|
cursor: pointer;
|
|
1999
2138
|
padding: 2px 6px;
|
|
2000
2139
|
}
|
|
2001
|
-
|
|
2002
2140
|
.pactor-chat-workspace__title--editable:hover {
|
|
2003
2141
|
background: var(--pactor-chat-muted);
|
|
2004
2142
|
}
|
|
2005
|
-
|
|
2006
2143
|
.pactor-chat-workspace__title-input {
|
|
2007
2144
|
border: 1px solid var(--pactor-chat-border);
|
|
2008
2145
|
border-radius: var(--pactor-chat-radius-sm);
|
|
@@ -2013,76 +2150,249 @@ button.pactor-chat-trace__header:hover,
|
|
|
2013
2150
|
padding: 2px 8px;
|
|
2014
2151
|
outline: none;
|
|
2015
2152
|
}
|
|
2016
|
-
|
|
2017
2153
|
.pactor-chat-workspace__title-input:focus {
|
|
2018
2154
|
border-color: var(--pactor-chat-primary);
|
|
2019
2155
|
}
|
|
2020
|
-
|
|
2021
|
-
/* ============================================================
|
|
2022
|
-
* 10. 动效降级（prefers-reduced-motion）
|
|
2023
|
-
* ============================================================ */
|
|
2024
|
-
|
|
2025
|
-
/* 遵循系统级减弱动效设置：过渡缩短到近乎即时；循环动画（呼吸文案、
|
|
2026
|
-
停止光环、状态图标脉冲、spinner 旋转）整体移除，保留静态色态指示 */
|
|
2027
2156
|
@media (prefers-reduced-motion: reduce) {
|
|
2028
|
-
.pactor-chat-view *,
|
|
2029
|
-
.pactor-chat-view *::before,
|
|
2030
|
-
.pactor-chat-view *::after,
|
|
2031
|
-
.pactor-chat-layout *,
|
|
2032
|
-
.pactor-chat-layout *::before,
|
|
2033
|
-
.pactor-chat-layout *::after,
|
|
2034
|
-
.pactor-chat-shell *,
|
|
2035
|
-
.pactor-chat-shell *::before,
|
|
2036
|
-
.pactor-chat-shell *::after {
|
|
2157
|
+
.pactor-chat-view *, .pactor-chat-view *::before, .pactor-chat-view *::after, .pactor-chat-layout *, .pactor-chat-layout *::before, .pactor-chat-layout *::after, .pactor-chat-shell *, .pactor-chat-shell *::before, .pactor-chat-shell *::after {
|
|
2037
2158
|
animation-duration: 0.001ms !important;
|
|
2038
2159
|
animation-iteration-count: 1 !important;
|
|
2039
2160
|
transition-duration: 0.001ms !important;
|
|
2040
2161
|
}
|
|
2041
|
-
|
|
2042
|
-
.pactor-chat-trace__status-text--breathing,
|
|
2043
|
-
.pactor-chat-trace__status-icon:has(.pactor-chat-spin),
|
|
2044
|
-
.pactor-chat-thinking[data-streaming='true'] .pactor-chat-thinking__icon,
|
|
2045
|
-
.pactor-chat-spin,
|
|
2046
|
-
.pactor-chat-composer__button--stop::after {
|
|
2162
|
+
.pactor-chat-trace__status-text--breathing, .pactor-chat-trace__status-icon:has(.pactor-chat-spin), .pactor-chat-thinking[data-streaming='true'] .pactor-chat-thinking__icon, .pactor-chat-spin, .pactor-chat-composer__button--stop::after {
|
|
2047
2163
|
animation: none !important;
|
|
2048
2164
|
}
|
|
2049
2165
|
}
|
|
2050
|
-
|
|
2051
2166
|
.pactor-markdown {
|
|
2052
2167
|
line-height: 2;
|
|
2053
2168
|
}
|
|
2054
|
-
|
|
2055
2169
|
.pactor-markdown hr {
|
|
2056
2170
|
margin: 1em 0;
|
|
2057
2171
|
}
|
|
2058
|
-
|
|
2059
2172
|
.pactor-markdown h3 {
|
|
2060
2173
|
font-size: 1.1em;
|
|
2061
2174
|
}
|
|
2062
|
-
|
|
2063
2175
|
.pactor-markdown h2 {
|
|
2064
2176
|
font-size: 1.2em;
|
|
2065
2177
|
}
|
|
2066
|
-
|
|
2067
2178
|
.pactor-markdown h1 {
|
|
2068
2179
|
font-size: 1.3rem;
|
|
2069
2180
|
}
|
|
2070
|
-
|
|
2071
|
-
.pactor-markdown h1,
|
|
2072
|
-
.pactor-markdown h2,
|
|
2073
|
-
.pactor-markdown h3,
|
|
2074
|
-
.pactor-markdown h4,
|
|
2075
|
-
.pactor-markdown h5,
|
|
2076
|
-
.pactor-markdown h6 {
|
|
2181
|
+
.pactor-markdown h1, .pactor-markdown h2, .pactor-markdown h3, .pactor-markdown h4, .pactor-markdown h5, .pactor-markdown h6 {
|
|
2077
2182
|
font-weight: 600;
|
|
2078
2183
|
margin-top: .5em;
|
|
2079
2184
|
margin-bottom: .5em;
|
|
2080
2185
|
}
|
|
2081
|
-
|
|
2082
2186
|
.pactor-chat-thinking {
|
|
2083
2187
|
margin-top: 8px;
|
|
2084
2188
|
}
|
|
2085
|
-
|
|
2086
2189
|
.pactor-chat-thinking__body .pactor-markdown {
|
|
2087
2190
|
line-height: 1.5;
|
|
2088
2191
|
}
|
|
2192
|
+
@property --tw-translate-x {
|
|
2193
|
+
syntax: "*";
|
|
2194
|
+
inherits: false;
|
|
2195
|
+
initial-value: 0;
|
|
2196
|
+
}
|
|
2197
|
+
@property --tw-translate-y {
|
|
2198
|
+
syntax: "*";
|
|
2199
|
+
inherits: false;
|
|
2200
|
+
initial-value: 0;
|
|
2201
|
+
}
|
|
2202
|
+
@property --tw-translate-z {
|
|
2203
|
+
syntax: "*";
|
|
2204
|
+
inherits: false;
|
|
2205
|
+
initial-value: 0;
|
|
2206
|
+
}
|
|
2207
|
+
@property --tw-border-style {
|
|
2208
|
+
syntax: "*";
|
|
2209
|
+
inherits: false;
|
|
2210
|
+
initial-value: solid;
|
|
2211
|
+
}
|
|
2212
|
+
@property --tw-leading {
|
|
2213
|
+
syntax: "*";
|
|
2214
|
+
inherits: false;
|
|
2215
|
+
}
|
|
2216
|
+
@property --tw-font-weight {
|
|
2217
|
+
syntax: "*";
|
|
2218
|
+
inherits: false;
|
|
2219
|
+
}
|
|
2220
|
+
@property --tw-shadow {
|
|
2221
|
+
syntax: "*";
|
|
2222
|
+
inherits: false;
|
|
2223
|
+
initial-value: 0 0 #0000;
|
|
2224
|
+
}
|
|
2225
|
+
@property --tw-shadow-color {
|
|
2226
|
+
syntax: "*";
|
|
2227
|
+
inherits: false;
|
|
2228
|
+
}
|
|
2229
|
+
@property --tw-shadow-alpha {
|
|
2230
|
+
syntax: "<percentage>";
|
|
2231
|
+
inherits: false;
|
|
2232
|
+
initial-value: 100%;
|
|
2233
|
+
}
|
|
2234
|
+
@property --tw-inset-shadow {
|
|
2235
|
+
syntax: "*";
|
|
2236
|
+
inherits: false;
|
|
2237
|
+
initial-value: 0 0 #0000;
|
|
2238
|
+
}
|
|
2239
|
+
@property --tw-inset-shadow-color {
|
|
2240
|
+
syntax: "*";
|
|
2241
|
+
inherits: false;
|
|
2242
|
+
}
|
|
2243
|
+
@property --tw-inset-shadow-alpha {
|
|
2244
|
+
syntax: "<percentage>";
|
|
2245
|
+
inherits: false;
|
|
2246
|
+
initial-value: 100%;
|
|
2247
|
+
}
|
|
2248
|
+
@property --tw-ring-color {
|
|
2249
|
+
syntax: "*";
|
|
2250
|
+
inherits: false;
|
|
2251
|
+
}
|
|
2252
|
+
@property --tw-ring-shadow {
|
|
2253
|
+
syntax: "*";
|
|
2254
|
+
inherits: false;
|
|
2255
|
+
initial-value: 0 0 #0000;
|
|
2256
|
+
}
|
|
2257
|
+
@property --tw-inset-ring-color {
|
|
2258
|
+
syntax: "*";
|
|
2259
|
+
inherits: false;
|
|
2260
|
+
}
|
|
2261
|
+
@property --tw-inset-ring-shadow {
|
|
2262
|
+
syntax: "*";
|
|
2263
|
+
inherits: false;
|
|
2264
|
+
initial-value: 0 0 #0000;
|
|
2265
|
+
}
|
|
2266
|
+
@property --tw-ring-inset {
|
|
2267
|
+
syntax: "*";
|
|
2268
|
+
inherits: false;
|
|
2269
|
+
}
|
|
2270
|
+
@property --tw-ring-offset-width {
|
|
2271
|
+
syntax: "<length>";
|
|
2272
|
+
inherits: false;
|
|
2273
|
+
initial-value: 0px;
|
|
2274
|
+
}
|
|
2275
|
+
@property --tw-ring-offset-color {
|
|
2276
|
+
syntax: "*";
|
|
2277
|
+
inherits: false;
|
|
2278
|
+
initial-value: #fff;
|
|
2279
|
+
}
|
|
2280
|
+
@property --tw-ring-offset-shadow {
|
|
2281
|
+
syntax: "*";
|
|
2282
|
+
inherits: false;
|
|
2283
|
+
initial-value: 0 0 #0000;
|
|
2284
|
+
}
|
|
2285
|
+
@property --tw-outline-style {
|
|
2286
|
+
syntax: "*";
|
|
2287
|
+
inherits: false;
|
|
2288
|
+
initial-value: solid;
|
|
2289
|
+
}
|
|
2290
|
+
@property --tw-blur {
|
|
2291
|
+
syntax: "*";
|
|
2292
|
+
inherits: false;
|
|
2293
|
+
}
|
|
2294
|
+
@property --tw-brightness {
|
|
2295
|
+
syntax: "*";
|
|
2296
|
+
inherits: false;
|
|
2297
|
+
}
|
|
2298
|
+
@property --tw-contrast {
|
|
2299
|
+
syntax: "*";
|
|
2300
|
+
inherits: false;
|
|
2301
|
+
}
|
|
2302
|
+
@property --tw-grayscale {
|
|
2303
|
+
syntax: "*";
|
|
2304
|
+
inherits: false;
|
|
2305
|
+
}
|
|
2306
|
+
@property --tw-hue-rotate {
|
|
2307
|
+
syntax: "*";
|
|
2308
|
+
inherits: false;
|
|
2309
|
+
}
|
|
2310
|
+
@property --tw-invert {
|
|
2311
|
+
syntax: "*";
|
|
2312
|
+
inherits: false;
|
|
2313
|
+
}
|
|
2314
|
+
@property --tw-opacity {
|
|
2315
|
+
syntax: "*";
|
|
2316
|
+
inherits: false;
|
|
2317
|
+
}
|
|
2318
|
+
@property --tw-saturate {
|
|
2319
|
+
syntax: "*";
|
|
2320
|
+
inherits: false;
|
|
2321
|
+
}
|
|
2322
|
+
@property --tw-sepia {
|
|
2323
|
+
syntax: "*";
|
|
2324
|
+
inherits: false;
|
|
2325
|
+
}
|
|
2326
|
+
@property --tw-drop-shadow {
|
|
2327
|
+
syntax: "*";
|
|
2328
|
+
inherits: false;
|
|
2329
|
+
}
|
|
2330
|
+
@property --tw-drop-shadow-color {
|
|
2331
|
+
syntax: "*";
|
|
2332
|
+
inherits: false;
|
|
2333
|
+
}
|
|
2334
|
+
@property --tw-drop-shadow-alpha {
|
|
2335
|
+
syntax: "<percentage>";
|
|
2336
|
+
inherits: false;
|
|
2337
|
+
initial-value: 100%;
|
|
2338
|
+
}
|
|
2339
|
+
@property --tw-drop-shadow-size {
|
|
2340
|
+
syntax: "*";
|
|
2341
|
+
inherits: false;
|
|
2342
|
+
}
|
|
2343
|
+
@property --tw-content {
|
|
2344
|
+
syntax: "*";
|
|
2345
|
+
initial-value: "";
|
|
2346
|
+
inherits: false;
|
|
2347
|
+
}
|
|
2348
|
+
@keyframes spin {
|
|
2349
|
+
to {
|
|
2350
|
+
transform: rotate(360deg);
|
|
2351
|
+
}
|
|
2352
|
+
}
|
|
2353
|
+
@keyframes pulse {
|
|
2354
|
+
50% {
|
|
2355
|
+
opacity: 0.5;
|
|
2356
|
+
}
|
|
2357
|
+
}
|
|
2358
|
+
@layer properties {
|
|
2359
|
+
@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
|
|
2360
|
+
*, ::before, ::after, ::backdrop {
|
|
2361
|
+
--tw-translate-x: 0;
|
|
2362
|
+
--tw-translate-y: 0;
|
|
2363
|
+
--tw-translate-z: 0;
|
|
2364
|
+
--tw-border-style: solid;
|
|
2365
|
+
--tw-leading: initial;
|
|
2366
|
+
--tw-font-weight: initial;
|
|
2367
|
+
--tw-shadow: 0 0 #0000;
|
|
2368
|
+
--tw-shadow-color: initial;
|
|
2369
|
+
--tw-shadow-alpha: 100%;
|
|
2370
|
+
--tw-inset-shadow: 0 0 #0000;
|
|
2371
|
+
--tw-inset-shadow-color: initial;
|
|
2372
|
+
--tw-inset-shadow-alpha: 100%;
|
|
2373
|
+
--tw-ring-color: initial;
|
|
2374
|
+
--tw-ring-shadow: 0 0 #0000;
|
|
2375
|
+
--tw-inset-ring-color: initial;
|
|
2376
|
+
--tw-inset-ring-shadow: 0 0 #0000;
|
|
2377
|
+
--tw-ring-inset: initial;
|
|
2378
|
+
--tw-ring-offset-width: 0px;
|
|
2379
|
+
--tw-ring-offset-color: #fff;
|
|
2380
|
+
--tw-ring-offset-shadow: 0 0 #0000;
|
|
2381
|
+
--tw-outline-style: solid;
|
|
2382
|
+
--tw-blur: initial;
|
|
2383
|
+
--tw-brightness: initial;
|
|
2384
|
+
--tw-contrast: initial;
|
|
2385
|
+
--tw-grayscale: initial;
|
|
2386
|
+
--tw-hue-rotate: initial;
|
|
2387
|
+
--tw-invert: initial;
|
|
2388
|
+
--tw-opacity: initial;
|
|
2389
|
+
--tw-saturate: initial;
|
|
2390
|
+
--tw-sepia: initial;
|
|
2391
|
+
--tw-drop-shadow: initial;
|
|
2392
|
+
--tw-drop-shadow-color: initial;
|
|
2393
|
+
--tw-drop-shadow-alpha: 100%;
|
|
2394
|
+
--tw-drop-shadow-size: initial;
|
|
2395
|
+
--tw-content: "";
|
|
2396
|
+
}
|
|
2397
|
+
}
|
|
2398
|
+
}
|