@tutti-os/ui-rich-text 0.0.53 → 0.0.54

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.
@@ -0,0 +1,871 @@
1
+ /* src/at-panel/mentionPalette.css */
2
+ .rich-text-at-mention-palette-scroll-region {
3
+ scrollbar-width: none !important;
4
+ -ms-overflow-style: none !important;
5
+ scrollbar-gutter: auto;
6
+ }
7
+ .rich-text-at-mention-palette-scroll-region::-webkit-scrollbar {
8
+ display: none !important;
9
+ width: 0 !important;
10
+ height: 0 !important;
11
+ }
12
+ .rich-text-at-mention-palette-scrollbar {
13
+ position: absolute;
14
+ top: 4px;
15
+ right: 4px;
16
+ bottom: 4px;
17
+ width: 4px;
18
+ cursor: pointer;
19
+ opacity: 0;
20
+ pointer-events: auto;
21
+ transition: opacity 160ms ease-in-out;
22
+ }
23
+ .rich-text-at-mention-palette-scrollbar-thumb {
24
+ width: 4px;
25
+ min-height: 24px;
26
+ border-radius: 999px;
27
+ background: var(--transparency-block);
28
+ cursor: grab;
29
+ transition: background-color 160ms ease-in-out;
30
+ will-change: transform;
31
+ }
32
+ .rich-text-at-mention-palette-scrollbar:hover .rich-text-at-mention-palette-scrollbar-thumb {
33
+ background: var(--transparency-hover);
34
+ }
35
+ .rich-text-at-mention-palette-scrollbar[data-dragging=true] {
36
+ opacity: 1;
37
+ }
38
+ .rich-text-at-mention-palette-scrollbar[data-dragging=true] .rich-text-at-mention-palette-scrollbar-thumb {
39
+ background: var(--transparency-hover);
40
+ cursor: grabbing;
41
+ }
42
+ .rich-text-at-mention-palette {
43
+ box-sizing: border-box;
44
+ container-type: inline-size;
45
+ width: 100%;
46
+ max-width: 100%;
47
+ min-width: 0;
48
+ --rich-text-at-mention-bg: var( --background-fronted, var(--panel, var(--background-panel, #fff)) );
49
+ --rich-text-at-mention-text-primary: var( --text-primary, var(--text, #171717) );
50
+ --rich-text-at-mention-text-secondary: var( --text-secondary, var(--muted, #737373) );
51
+ --rich-text-at-mention-text-tertiary: var( --text-tertiary, var(--muted, #8a8a8a) );
52
+ --rich-text-at-mention-line-1: var(--line-1, var(--border, #0000001a));
53
+ --rich-text-at-mention-line-2: var(--line-2, var(--border, #00000014));
54
+ --rich-text-at-mention-hover: var( --transparency-block, var(--accent-soft, var(--sidebar-hover, #0000000d)) );
55
+ --rich-text-at-mention-active: var( --transparency-active, var(--accent-hover, #00000014) );
56
+ --rich-text-at-mention-accent: var(--tutti-purple, var(--accent, #5f5cf0));
57
+ --rich-text-at-mention-danger-bg: var(--on-danger, #fee2e2);
58
+ --rich-text-at-mention-danger-fg: var(--state-danger, #dc2626);
59
+ --rich-text-at-mention-success-fg: var(--state-success, #16a34a);
60
+ --rich-text-at-mention-success-bg: color-mix( in srgb, var(--rich-text-at-mention-success-fg) 12%, transparent );
61
+ --rich-text-at-mention-warning-fg: var(--state-warning, rgb(234 121 8));
62
+ --rich-text-at-mention-warning-bg: color-mix( in srgb, var(--rich-text-at-mention-warning-fg) 12%, transparent );
63
+ --rich-text-at-mention-info-fg: var(--status-running, rgb(65 130 245));
64
+ --rich-text-at-mention-info-bg: color-mix( in srgb, var(--rich-text-at-mention-info-fg) 12%, transparent );
65
+ }
66
+ .rich-text-at-mention-palette__shell {
67
+ box-sizing: border-box;
68
+ display: grid;
69
+ grid-template-rows: auto minmax(0, 1fr) auto;
70
+ width: 100%;
71
+ max-width: 100%;
72
+ height: 100%;
73
+ max-height: 320px;
74
+ min-height: 0;
75
+ min-width: 0;
76
+ overflow: hidden;
77
+ color: var(--rich-text-at-mention-text-primary);
78
+ font-size: 13px;
79
+ -webkit-app-region: no-drag;
80
+ }
81
+ .rich-text-at-mention-palette__header {
82
+ position: relative;
83
+ z-index: 10;
84
+ box-sizing: border-box;
85
+ width: 100%;
86
+ max-width: 100%;
87
+ min-width: 0;
88
+ flex-shrink: 0;
89
+ }
90
+ .rich-text-at-mention-palette__footer {
91
+ box-sizing: border-box;
92
+ width: 100%;
93
+ max-width: 100%;
94
+ min-width: 0;
95
+ flex-shrink: 0;
96
+ }
97
+ .rich-text-at-mention-palette__scroll-shell {
98
+ position: relative;
99
+ box-sizing: border-box;
100
+ width: 100%;
101
+ max-width: 100%;
102
+ min-height: 0;
103
+ min-width: 0;
104
+ overflow: hidden;
105
+ }
106
+ .rich-text-at-mention-palette__scroll-body {
107
+ box-sizing: border-box;
108
+ width: 100%;
109
+ max-width: 100%;
110
+ height: 100%;
111
+ min-height: 0;
112
+ min-width: 0;
113
+ padding: 8px 4px 4px;
114
+ overflow-x: hidden;
115
+ overflow-y: auto;
116
+ overscroll-behavior: contain;
117
+ }
118
+ .rich-text-at-mention-palette__groups,
119
+ .rich-text-at-mention-palette__group,
120
+ .rich-text-at-mention-palette__group-items {
121
+ box-sizing: border-box;
122
+ display: grid;
123
+ width: 100%;
124
+ min-width: 0;
125
+ }
126
+ .rich-text-at-mention-palette__groups {
127
+ gap: 12px;
128
+ }
129
+ .rich-text-at-mention-palette__group,
130
+ .rich-text-at-mention-palette__group-items {
131
+ gap: 4px;
132
+ }
133
+ .rich-text-at-mention-palette__group-divider {
134
+ margin: 0 12px 8px;
135
+ border-top: 1px solid var(--rich-text-at-mention-line-1);
136
+ }
137
+ .rich-text-at-mention-palette__group-label,
138
+ .rich-text-at-mention-palette__group-empty {
139
+ padding-inline: 12px;
140
+ font-size: 13px;
141
+ font-weight: 400;
142
+ }
143
+ .rich-text-at-mention-palette__group-label {
144
+ color: var(--rich-text-at-mention-text-secondary);
145
+ }
146
+ .rich-text-at-mention-palette__group-empty {
147
+ padding-block: 4px;
148
+ color: var(--rich-text-at-mention-text-tertiary);
149
+ }
150
+ .rich-text-at-mention-palette__row-button,
151
+ .rich-text-at-mention-palette__expand-button {
152
+ appearance: none;
153
+ -webkit-app-region: no-drag;
154
+ border: 0;
155
+ background: transparent;
156
+ color: inherit;
157
+ font: inherit;
158
+ cursor: pointer;
159
+ outline: none;
160
+ }
161
+ .rich-text-at-mention-palette__row-button {
162
+ position: relative;
163
+ display: flex;
164
+ align-items: center;
165
+ gap: 6px;
166
+ width: 100%;
167
+ min-width: 0;
168
+ min-height: 36px;
169
+ padding: 8px 10px;
170
+ overflow: hidden;
171
+ border-radius: 6px;
172
+ color: var(--rich-text-at-mention-text-primary);
173
+ text-align: left;
174
+ user-select: none;
175
+ transition: background-color 200ms ease, color 200ms ease;
176
+ }
177
+ .rich-text-at-mention-palette__row-button > svg,
178
+ .rich-text-at-mention-palette__row-button svg {
179
+ flex-shrink: 0;
180
+ pointer-events: none;
181
+ }
182
+ .rich-text-at-mention-palette__row-button > svg:not([class*=size-]) {
183
+ width: 16px;
184
+ height: 16px;
185
+ }
186
+ .rich-text-at-mention-palette__row-button[data-highlighted],
187
+ .rich-text-at-mention-palette__expand-button[data-highlighted] {
188
+ background: var(--rich-text-at-mention-hover);
189
+ color: var(--rich-text-at-mention-text-primary);
190
+ }
191
+ .rich-text-at-mention-palette__row-button:active,
192
+ .rich-text-at-mention-palette__expand-button:active {
193
+ background: var(--rich-text-at-mention-active);
194
+ }
195
+ .rich-text-at-mention-palette__expand-button {
196
+ display: flex;
197
+ align-items: center;
198
+ justify-content: center;
199
+ width: 100%;
200
+ padding: 8px 12px;
201
+ border-radius: 6px;
202
+ color: var(--rich-text-at-mention-text-secondary);
203
+ font-size: 13px;
204
+ font-weight: 500;
205
+ transition: background-color 160ms ease, color 160ms ease;
206
+ }
207
+ .rich-text-at-mention-palette__empty-state {
208
+ box-sizing: border-box;
209
+ display: flex;
210
+ align-items: center;
211
+ justify-content: center;
212
+ width: 100%;
213
+ max-width: 100%;
214
+ min-width: 0;
215
+ min-height: 0;
216
+ height: 100%;
217
+ padding: 24px 16px;
218
+ color: var(--rich-text-at-mention-text-tertiary);
219
+ font-size: 13px;
220
+ text-align: center;
221
+ }
222
+ .rich-text-at-mention-palette__empty-state-inner {
223
+ box-sizing: border-box;
224
+ display: flex;
225
+ flex-direction: column;
226
+ align-items: center;
227
+ justify-content: center;
228
+ gap: 12px;
229
+ width: min(100%, 28ch);
230
+ max-width: 100%;
231
+ min-width: 0;
232
+ }
233
+ .rich-text-at-mention-palette__empty-state-icon {
234
+ width: 24px;
235
+ height: 24px;
236
+ color: var(--rich-text-at-mention-text-tertiary);
237
+ }
238
+ .rich-text-at-mention-palette__empty-state-text {
239
+ display: block;
240
+ max-width: 100%;
241
+ min-width: 0;
242
+ color: var(--rich-text-at-mention-text-tertiary);
243
+ line-height: 20px;
244
+ overflow-wrap: anywhere;
245
+ }
246
+ .rich-text-at-mention-palette__loading {
247
+ display: flex;
248
+ align-items: center;
249
+ gap: 8px;
250
+ min-height: 52px;
251
+ padding-inline: 12px;
252
+ border-radius: 12px;
253
+ color: var(--rich-text-at-mention-text-secondary);
254
+ font-size: 13px;
255
+ }
256
+ .rich-text-at-mention-palette__loading-spinner {
257
+ width: 16px;
258
+ height: 16px;
259
+ border: 2px solid color-mix(in srgb, currentColor 28%, transparent);
260
+ border-top-color: currentColor;
261
+ border-radius: 999px;
262
+ animation: rich-text-at-mention-spin 820ms linear infinite;
263
+ }
264
+ @keyframes rich-text-at-mention-spin {
265
+ to {
266
+ transform: rotate(360deg);
267
+ }
268
+ }
269
+ .tsh-underline-tabs.rich-text-at-mention-palette-tabs {
270
+ height: 41px;
271
+ padding: 8px 16px 0;
272
+ }
273
+ .rich-text-at-mention-palette [data-slot=underline-tabs] {
274
+ position: relative;
275
+ box-sizing: border-box;
276
+ min-width: 0;
277
+ height: 33px;
278
+ padding-inline: 16px;
279
+ border-bottom: 1px solid var(--rich-text-at-mention-line-1);
280
+ }
281
+ .rich-text-at-mention-palette [data-slot=underline-tabs-viewport] {
282
+ height: 32px;
283
+ overflow-x: auto;
284
+ overflow-y: hidden;
285
+ scrollbar-width: none;
286
+ }
287
+ .rich-text-at-mention-palette [data-slot=underline-tabs-viewport]::-webkit-scrollbar {
288
+ display: none;
289
+ }
290
+ .rich-text-at-mention-palette [data-slot=underline-tabs-viewport] > div {
291
+ position: relative;
292
+ display: flex;
293
+ align-items: center;
294
+ gap: 14px;
295
+ width: max-content;
296
+ min-width: 100%;
297
+ height: 32px;
298
+ padding-bottom: 8px;
299
+ }
300
+ .rich-text-at-mention-palette [data-slot=underline-tabs-tab] {
301
+ appearance: none;
302
+ position: relative;
303
+ display: inline-flex;
304
+ align-items: center;
305
+ flex-shrink: 0;
306
+ gap: 6px;
307
+ height: 24px;
308
+ padding: 0;
309
+ border: 0;
310
+ background: transparent;
311
+ color: var(--rich-text-at-mention-text-secondary);
312
+ font: inherit;
313
+ font-size: 13px;
314
+ font-weight: 600;
315
+ line-height: 24px;
316
+ white-space: nowrap;
317
+ cursor: pointer;
318
+ transition: color 160ms ease;
319
+ }
320
+ .rich-text-at-mention-palette [data-slot=underline-tabs-tab]:hover,
321
+ .rich-text-at-mention-palette [data-slot=underline-tabs-tab]:focus-visible {
322
+ color: var(--rich-text-at-mention-text-primary);
323
+ outline: none;
324
+ }
325
+ .rich-text-at-mention-palette [data-slot=underline-tabs-tab][data-active=true] {
326
+ color: var(--rich-text-at-mention-accent);
327
+ }
328
+ .rich-text-at-mention-palette [data-slot=underline-tabs-indicator] {
329
+ position: absolute;
330
+ bottom: 0;
331
+ left: 0;
332
+ z-index: 1;
333
+ height: 2px;
334
+ border-radius: 1px;
335
+ background: var(--rich-text-at-mention-accent);
336
+ transition: transform 220ms cubic-bezier(0.4, 0, 0.2, 1), width 220ms cubic-bezier(0.4, 0, 0.2, 1);
337
+ }
338
+ .rich-text-at-mention-palette [data-slot=underline-tabs-scroll-left],
339
+ .rich-text-at-mention-palette [data-slot=underline-tabs-scroll-right] {
340
+ appearance: none;
341
+ pointer-events: none;
342
+ position: absolute;
343
+ top: 12px;
344
+ z-index: 3;
345
+ display: inline-flex;
346
+ align-items: center;
347
+ justify-content: center;
348
+ width: 24px;
349
+ height: 24px;
350
+ padding: 0;
351
+ border: 0;
352
+ border-radius: 999px;
353
+ background: var(--rich-text-at-mention-bg);
354
+ color: var(--rich-text-at-mention-text-secondary);
355
+ opacity: 0;
356
+ box-shadow: 0 4px 16px rgb(15 23 42 / 12%);
357
+ transform: translateY(-50%) scale(0.94);
358
+ transition:
359
+ opacity 160ms ease,
360
+ transform 160ms ease,
361
+ background-color 160ms ease,
362
+ color 160ms ease;
363
+ }
364
+ .rich-text-at-mention-palette [data-slot=underline-tabs-scroll-left] {
365
+ left: 16px;
366
+ }
367
+ .rich-text-at-mention-palette [data-slot=underline-tabs-scroll-right] {
368
+ right: 16px;
369
+ }
370
+ .rich-text-at-mention-palette:hover [data-slot=underline-tabs-scroll-left][data-visible=true],
371
+ .rich-text-at-mention-palette:hover [data-slot=underline-tabs-scroll-right][data-visible=true],
372
+ .rich-text-at-mention-palette:focus-within [data-slot=underline-tabs-scroll-left][data-visible=true],
373
+ .rich-text-at-mention-palette:focus-within [data-slot=underline-tabs-scroll-right][data-visible=true] {
374
+ pointer-events: auto;
375
+ opacity: 1;
376
+ transform: translateY(-50%) scale(1);
377
+ }
378
+ .rich-text-at-mention-palette-header {
379
+ padding: 8px 0 0;
380
+ }
381
+ .rich-text-at-mention-palette-footer {
382
+ min-height: 36px;
383
+ border-top: 1px solid var(--line-2, var(--tutti-line-2));
384
+ background: var(--background-fronted, var(--background-panel));
385
+ }
386
+ .rich-text-at-mention-palette-hint {
387
+ display: flex;
388
+ align-items: center;
389
+ justify-content: flex-end;
390
+ gap: 8px;
391
+ width: 100%;
392
+ height: 36px;
393
+ padding: 0 16px 1px;
394
+ color: var(--rich-text-at-mention-text-secondary);
395
+ font-size: 13px;
396
+ font-weight: 500;
397
+ line-height: 20px;
398
+ pointer-events: auto;
399
+ }
400
+ .rich-text-at-mention-palette-hint-item {
401
+ display: inline-flex;
402
+ align-items: center;
403
+ gap: 5px;
404
+ white-space: nowrap;
405
+ }
406
+ .rich-text-at-mention-palette-hint-button,
407
+ .rich-text-at-mention-palette-shortcut-button {
408
+ appearance: none;
409
+ border: 0;
410
+ font: inherit;
411
+ cursor: pointer;
412
+ }
413
+ .rich-text-at-mention-palette-hint-button {
414
+ padding: 0;
415
+ background: transparent;
416
+ color: inherit;
417
+ }
418
+ .rich-text-at-mention-palette-hint-button > span:last-child,
419
+ .rich-text-at-mention-palette-hint-item > span:last-child {
420
+ color: var(--rich-text-at-mention-text-secondary);
421
+ }
422
+ .rich-text-at-mention-palette-shortcut {
423
+ display: inline-flex;
424
+ align-items: center;
425
+ justify-content: center;
426
+ height: 20px;
427
+ min-width: 20px;
428
+ border: 1px solid var(--rich-text-at-mention-line-2);
429
+ border-radius: 5px;
430
+ background: var(--rich-text-at-mention-hover);
431
+ color: var(--rich-text-at-mention-text-primary);
432
+ box-shadow: inset 0 -1px 0 rgb(0 0 0 / 4%);
433
+ font-size: 12px;
434
+ font-weight: 650;
435
+ line-height: 1;
436
+ padding: 3px 6px;
437
+ }
438
+ .rich-text-at-mention-palette-hint-button:hover .rich-text-at-mention-palette-shortcut,
439
+ .rich-text-at-mention-palette-hint-button:focus-visible .rich-text-at-mention-palette-shortcut,
440
+ .rich-text-at-mention-palette-shortcut-button:hover,
441
+ .rich-text-at-mention-palette-shortcut-button:focus-visible {
442
+ border-color: var(--rich-text-at-mention-line-1);
443
+ background: var(--rich-text-at-mention-active);
444
+ }
445
+ .rich-text-at-mention-palette-hint-button:focus-visible,
446
+ .rich-text-at-mention-palette-shortcut-button:focus-visible {
447
+ outline: 2px solid var(--rich-text-at-mention-line-1);
448
+ outline-offset: 2px;
449
+ }
450
+ .rich-text-at-mention-palette-shortcut--arrow {
451
+ width: 20px;
452
+ min-width: 20px;
453
+ font-size: 13px;
454
+ line-height: 1;
455
+ padding: 0;
456
+ }
457
+ .rich-text-at-mention-palette-shortcut-group {
458
+ display: inline-flex;
459
+ align-items: center;
460
+ gap: 5px;
461
+ }
462
+ .rich-text-at-mention-palette-hint-separator {
463
+ color: var(--rich-text-at-mention-line-1);
464
+ }
465
+ .rich-text-at-mention-palette:hover .rich-text-at-mention-palette-scrollbar[data-scrollable=true] {
466
+ opacity: 1;
467
+ }
468
+ .rich-text-at-mention-palette {
469
+ --agent-mention-file-icon-size: 16px;
470
+ }
471
+ .rich-text-at-mention-row {
472
+ display: flex;
473
+ align-items: center;
474
+ gap: 8px;
475
+ min-width: 0;
476
+ width: 100%;
477
+ overflow: hidden;
478
+ }
479
+ .rich-text-at-mention-row--session {
480
+ display: grid;
481
+ grid-template-columns: minmax(0, 1fr) auto;
482
+ gap: 12px;
483
+ }
484
+ .rich-text-at-mention-row--issue {
485
+ display: grid;
486
+ grid-template-columns: minmax(0, 1fr) auto auto;
487
+ }
488
+ .rich-text-at-mention-row--app,
489
+ .rich-text-at-mention-row--file {
490
+ display: grid;
491
+ grid-template-columns: auto minmax(0, 1fr) auto;
492
+ }
493
+ .rich-text-at-mention-row--plain > :not(.rich-text-at-mention-row__text-stack) {
494
+ flex: 0 0 auto;
495
+ }
496
+ .rich-text-at-mention-row__leading,
497
+ .rich-text-at-mention-row__inline,
498
+ .rich-text-at-mention-row__file-text,
499
+ .rich-text-at-mention-row__app-text {
500
+ display: flex;
501
+ min-width: 0;
502
+ overflow: hidden;
503
+ }
504
+ .rich-text-at-mention-row__leading {
505
+ align-items: center;
506
+ gap: 8px;
507
+ width: 100%;
508
+ }
509
+ .rich-text-at-mention-row--session .rich-text-at-mention-row__leading {
510
+ display: grid;
511
+ grid-template-columns: auto minmax(0, 1fr);
512
+ }
513
+ .rich-text-at-mention-row__inline {
514
+ display: grid;
515
+ grid-template-columns: minmax(0, 1fr);
516
+ align-items: center;
517
+ gap: 8px;
518
+ width: 100%;
519
+ }
520
+ .rich-text-at-mention-row__file-text,
521
+ .rich-text-at-mention-row__app-text {
522
+ align-items: baseline;
523
+ gap: 4px;
524
+ }
525
+ .rich-text-at-mention-row__session-title {
526
+ display: grid;
527
+ grid-template-columns: minmax(0, max-content) minmax(0, 1fr);
528
+ align-items: baseline;
529
+ gap: 4px;
530
+ width: 100%;
531
+ }
532
+ .rich-text-at-mention-row__file-text {
533
+ flex: 1 1 0;
534
+ }
535
+ .rich-text-at-mention-row__app-text {
536
+ flex: 1 1 0;
537
+ }
538
+ .rich-text-at-mention-row__text-stack {
539
+ display: grid;
540
+ gap: 2px;
541
+ min-width: 0;
542
+ overflow: hidden;
543
+ }
544
+ .rich-text-at-mention-row__text-stack--fill {
545
+ flex: 1 1 auto;
546
+ width: 100%;
547
+ }
548
+ .rich-text-at-mention-row__title,
549
+ .rich-text-at-mention-row__app-name,
550
+ .rich-text-at-mention-row__session-title,
551
+ .rich-text-at-mention-row__description,
552
+ .rich-text-at-mention-row__app-description,
553
+ .rich-text-at-mention-row__file-count,
554
+ .rich-text-at-mention-row__session-participant,
555
+ .rich-text-at-mention-row__session-summary {
556
+ min-width: 0;
557
+ overflow: hidden;
558
+ text-overflow: ellipsis;
559
+ white-space: nowrap;
560
+ font-size: 13px;
561
+ }
562
+ .rich-text-at-mention-row__title,
563
+ .rich-text-at-mention-row__app-name,
564
+ .rich-text-at-mention-row__session-title,
565
+ .rich-text-at-mention-row__session-participant {
566
+ color: var(--rich-text-at-mention-text-primary);
567
+ font-weight: 600;
568
+ }
569
+ .rich-text-at-mention-row__title,
570
+ .rich-text-at-mention-row__app-name {
571
+ flex: 0 1 auto;
572
+ }
573
+ .rich-text-at-mention-row__app-name {
574
+ flex-shrink: 1;
575
+ }
576
+ .rich-text-at-mention-row__description,
577
+ .rich-text-at-mention-row__app-description,
578
+ .rich-text-at-mention-row__file-count,
579
+ .rich-text-at-mention-row__session-summary {
580
+ color: var(--rich-text-at-mention-text-secondary);
581
+ font-weight: 400;
582
+ }
583
+ .rich-text-at-mention-row__app-description {
584
+ flex: 1 1 0;
585
+ }
586
+ .rich-text-at-mention-row__description,
587
+ .rich-text-at-mention-row__session-summary {
588
+ flex: 1 1 0;
589
+ }
590
+ .rich-text-at-mention-row__file-count {
591
+ flex: 0 0 auto;
592
+ }
593
+ .rich-text-at-mention-row__session-title,
594
+ .rich-text-at-mention-row__session-participant,
595
+ .rich-text-at-mention-row__session-summary {
596
+ line-height: 16px;
597
+ }
598
+ .rich-text-at-mention-row__session-participant {
599
+ flex: 0 0 auto;
600
+ }
601
+ .rich-text-at-mention-row__session-summary {
602
+ min-width: 0;
603
+ }
604
+ .rich-text-at-mention-row__media {
605
+ display: block;
606
+ width: 100%;
607
+ height: 100%;
608
+ object-fit: cover;
609
+ }
610
+ .rich-text-at-mention-row__open-references,
611
+ .rich-text-at-mention-row__navigate-into {
612
+ appearance: none;
613
+ display: grid;
614
+ place-items: center;
615
+ height: 24px;
616
+ margin-left: auto;
617
+ justify-self: end;
618
+ padding: 0;
619
+ border: 0;
620
+ border-radius: 5px;
621
+ background: transparent;
622
+ color: var(--rich-text-at-mention-text-tertiary);
623
+ cursor: pointer;
624
+ outline: none;
625
+ transition: background-color 160ms ease, color 160ms ease;
626
+ }
627
+ .rich-text-at-mention-row__open-references {
628
+ width: auto;
629
+ min-width: max-content;
630
+ flex: 0 0 auto;
631
+ padding-inline: 8px;
632
+ font-size: 12px;
633
+ font-weight: 600;
634
+ line-height: 24px;
635
+ white-space: nowrap;
636
+ }
637
+ .rich-text-at-mention-row__navigate-into {
638
+ width: 24px;
639
+ flex: 0 0 24px;
640
+ }
641
+ .rich-text-at-mention-row__open-references:hover,
642
+ .rich-text-at-mention-row__navigate-into:hover,
643
+ .rich-text-at-mention-row__open-references:focus-visible,
644
+ .rich-text-at-mention-row__navigate-into:focus-visible {
645
+ background: var(--rich-text-at-mention-active);
646
+ color: var(--rich-text-at-mention-text-secondary);
647
+ }
648
+ .rich-text-at-mention-file-icon--glyph {
649
+ display: grid;
650
+ place-items: center;
651
+ color: var(--rich-text-at-mention-text-secondary);
652
+ }
653
+ .rich-text-at-mention-app-icon {
654
+ display: grid;
655
+ place-items: center;
656
+ width: 20px;
657
+ height: 20px;
658
+ flex: 0 0 20px;
659
+ overflow: hidden;
660
+ border-radius: 5px;
661
+ background: var(--bg-block, var(--block, #0000000a));
662
+ color: var(--rich-text-at-mention-text-secondary);
663
+ }
664
+ .rich-text-at-mention-kind-icon--app {
665
+ width: 16px;
666
+ height: 16px;
667
+ }
668
+ .rich-text-at-mention-avatar-stack {
669
+ position: relative;
670
+ isolation: isolate;
671
+ display: block;
672
+ width: 36px;
673
+ height: 20px;
674
+ flex: 0 0 36px;
675
+ }
676
+ .rich-text-at-mention-avatar-stack--agent-only {
677
+ width: 20px;
678
+ flex: 0 0 20px;
679
+ }
680
+ .rich-text-at-mention-avatar-stack--agent-only .rich-text-at-mention-avatar--agent {
681
+ left: 0;
682
+ }
683
+ .rich-text-at-mention-avatar {
684
+ position: absolute;
685
+ top: 0;
686
+ display: grid;
687
+ width: 20px;
688
+ height: 20px;
689
+ overflow: hidden;
690
+ border-radius: 999px;
691
+ background: var(--bg-block, var(--block, #0000000a));
692
+ }
693
+ .rich-text-at-mention-avatar--user {
694
+ left: 0;
695
+ z-index: 0;
696
+ }
697
+ .rich-text-at-mention-avatar--agent {
698
+ left: 16px;
699
+ z-index: 10;
700
+ }
701
+ .rich-text-at-mention-status {
702
+ display: inline-flex;
703
+ align-items: center;
704
+ justify-content: center;
705
+ flex: 0 0 auto;
706
+ gap: 4px;
707
+ width: fit-content;
708
+ border: 1px solid transparent;
709
+ white-space: nowrap;
710
+ }
711
+ .rich-text-at-mention-status[data-tone=blue] {
712
+ background: var(--rich-text-at-mention-info-bg);
713
+ color: var(--rich-text-at-mention-info-fg);
714
+ }
715
+ .rich-text-at-mention-status[data-tone=amber] {
716
+ background: var(--rich-text-at-mention-warning-bg);
717
+ color: var(--rich-text-at-mention-warning-fg);
718
+ }
719
+ .rich-text-at-mention-status[data-tone=green] {
720
+ background: var(--rich-text-at-mention-success-bg);
721
+ color: var(--rich-text-at-mention-success-fg);
722
+ }
723
+ .rich-text-at-mention-status[data-tone=purple] {
724
+ background: color-mix(in srgb, var(--rich-text-at-mention-accent) 12%, transparent);
725
+ color: var(--rich-text-at-mention-accent);
726
+ }
727
+ .rich-text-at-mention-status[data-tone=red] {
728
+ background: var(--rich-text-at-mention-danger-bg);
729
+ color: var(--rich-text-at-mention-danger-fg);
730
+ }
731
+ .rich-text-at-mention-status[data-tone=neutral] {
732
+ background: var(--rich-text-at-mention-hover);
733
+ color: var(--rich-text-at-mention-text-secondary);
734
+ }
735
+ .rich-text-at-mention-status--activity {
736
+ padding-inline: 0;
737
+ background: transparent;
738
+ }
739
+ .rich-text-at-mention-status--activity[data-tone] {
740
+ background: transparent;
741
+ }
742
+ .rich-text-at-mention-status [data-slot=status-dot] {
743
+ display: inline-flex;
744
+ width: 6px;
745
+ height: 6px;
746
+ flex: 0 0 6px;
747
+ border-radius: 999px;
748
+ background: currentColor;
749
+ }
750
+ .rich-text-at-mention-status [data-slot=status-dot][data-pulse=true] {
751
+ animation: rich-text-at-mention-pulse 1.4s ease-in-out infinite;
752
+ }
753
+ @keyframes rich-text-at-mention-pulse {
754
+ 50% {
755
+ opacity: 0.45;
756
+ }
757
+ }
758
+ .rich-text-at-mention-select-indicator {
759
+ display: grid;
760
+ place-items: center;
761
+ width: 18px;
762
+ height: 18px;
763
+ flex: 0 0 18px;
764
+ border: 1px solid var(--border, var(--rich-text-at-mention-line-1));
765
+ border-radius: 5px;
766
+ background: #fff;
767
+ color: transparent;
768
+ }
769
+ .rich-text-at-mention-select-indicator[data-selected=true] {
770
+ border-color: #171717;
771
+ background: #171717;
772
+ color: #fff;
773
+ }
774
+ .rich-text-at-mention-multiselect-footer {
775
+ display: flex;
776
+ align-items: center;
777
+ justify-content: space-between;
778
+ gap: 8px;
779
+ padding: 8px 10px;
780
+ border-top: 1px solid var(--border, var(--rich-text-at-mention-line-1));
781
+ background: var(--panel, var(--rich-text-at-mention-bg));
782
+ }
783
+ .rich-text-at-mention-multiselect-footer__count {
784
+ color: var(--rich-text-at-mention-text-secondary);
785
+ font-size: 12px;
786
+ font-weight: 600;
787
+ }
788
+ .rich-text-at-mention-multiselect-footer__actions {
789
+ display: flex;
790
+ gap: 8px;
791
+ }
792
+ .rich-text-at-mention-multiselect-footer__button {
793
+ appearance: none;
794
+ height: 30px;
795
+ padding-inline: 12px;
796
+ border-radius: 8px;
797
+ font: inherit;
798
+ font-size: 12px;
799
+ font-weight: 700;
800
+ cursor: pointer;
801
+ }
802
+ .rich-text-at-mention-multiselect-footer__button--secondary {
803
+ border: 1px solid var(--border, var(--rich-text-at-mention-line-1));
804
+ background: #fff;
805
+ color: var(--text, var(--rich-text-at-mention-text-primary));
806
+ }
807
+ .rich-text-at-mention-multiselect-footer__button--primary {
808
+ border: 0;
809
+ background: #171717;
810
+ color: #fff;
811
+ }
812
+ .rich-text-at-mention-multiselect-footer__button:disabled {
813
+ opacity: 0.45;
814
+ cursor: default;
815
+ }
816
+ .rich-text-at-mention-file-thumb {
817
+ display: inline-flex;
818
+ align-items: center;
819
+ justify-content: center;
820
+ width: var(--agent-mention-file-icon-size, 16px);
821
+ height: var(--agent-mention-file-icon-size, 16px);
822
+ flex: 0 0 var(--agent-mention-file-icon-size, 16px);
823
+ overflow: hidden;
824
+ border-radius: 4px;
825
+ background-color: var(--bg-block, var(--block));
826
+ vertical-align: middle;
827
+ }
828
+ .rich-text-at-mention-file-thumb img {
829
+ display: block;
830
+ width: 100%;
831
+ height: 100%;
832
+ object-fit: cover;
833
+ }
834
+ .rich-text-at-mention-file-icon {
835
+ width: var(--agent-mention-file-icon-size, 16px);
836
+ height: var(--agent-mention-file-icon-size, 16px);
837
+ flex: 0 0 var(--agent-mention-file-icon-size, 16px);
838
+ background-color: var(--folder);
839
+ border-radius: 4px;
840
+ }
841
+ .rich-text-at-mention-kind-icon {
842
+ display: block;
843
+ width: 16px;
844
+ height: 16px;
845
+ flex: 0 0 16px;
846
+ background-color: currentColor;
847
+ border-radius: 22.5%;
848
+ }
849
+ .rich-text-at-mention-avatar-img--user-placeholder {
850
+ background-color: var(--muted);
851
+ }
852
+ [data-workspace-app-icon=true] {
853
+ display: inline-grid;
854
+ min-width: 0;
855
+ min-height: 0;
856
+ place-items: center;
857
+ overflow: hidden;
858
+ border-radius: 22.5%;
859
+ background: var(--workspace-app-icon-bg, transparent);
860
+ }
861
+ [data-workspace-app-icon=true] > img {
862
+ display: block;
863
+ width: 100%;
864
+ height: 100%;
865
+ object-fit: cover;
866
+ object-position: center;
867
+ }
868
+ [data-workspace-app-icon=true] > .rich-text-at-mention-kind-icon {
869
+ display: block;
870
+ }
871
+ /*# sourceMappingURL=index.css.map */