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

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,872 @@
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
+ color: var(--text-secondary);
633
+ font-size: 12px;
634
+ font-weight: 600;
635
+ line-height: 24px;
636
+ white-space: nowrap;
637
+ }
638
+ .rich-text-at-mention-row__navigate-into {
639
+ width: 24px;
640
+ flex: 0 0 24px;
641
+ }
642
+ .rich-text-at-mention-row__open-references:hover,
643
+ .rich-text-at-mention-row__navigate-into:hover,
644
+ .rich-text-at-mention-row__open-references:focus-visible,
645
+ .rich-text-at-mention-row__navigate-into:focus-visible {
646
+ background: var(--rich-text-at-mention-active);
647
+ color: var(--rich-text-at-mention-text-secondary);
648
+ }
649
+ .rich-text-at-mention-file-icon--glyph {
650
+ display: grid;
651
+ place-items: center;
652
+ color: var(--rich-text-at-mention-text-secondary);
653
+ }
654
+ .rich-text-at-mention-app-icon {
655
+ display: grid;
656
+ place-items: center;
657
+ width: 20px;
658
+ height: 20px;
659
+ flex: 0 0 20px;
660
+ overflow: hidden;
661
+ border-radius: 5px;
662
+ background: var(--bg-block, var(--block, #0000000a));
663
+ color: var(--rich-text-at-mention-text-secondary);
664
+ }
665
+ .rich-text-at-mention-kind-icon--app {
666
+ width: 16px;
667
+ height: 16px;
668
+ }
669
+ .rich-text-at-mention-avatar-stack {
670
+ position: relative;
671
+ isolation: isolate;
672
+ display: block;
673
+ width: 36px;
674
+ height: 20px;
675
+ flex: 0 0 36px;
676
+ }
677
+ .rich-text-at-mention-avatar-stack--agent-only {
678
+ width: 20px;
679
+ flex: 0 0 20px;
680
+ }
681
+ .rich-text-at-mention-avatar-stack--agent-only .rich-text-at-mention-avatar--agent {
682
+ left: 0;
683
+ }
684
+ .rich-text-at-mention-avatar {
685
+ position: absolute;
686
+ top: 0;
687
+ display: grid;
688
+ width: 20px;
689
+ height: 20px;
690
+ overflow: hidden;
691
+ border-radius: 999px;
692
+ background: var(--bg-block, var(--block, #0000000a));
693
+ }
694
+ .rich-text-at-mention-avatar--user {
695
+ left: 0;
696
+ z-index: 0;
697
+ }
698
+ .rich-text-at-mention-avatar--agent {
699
+ left: 16px;
700
+ z-index: 10;
701
+ }
702
+ .rich-text-at-mention-status {
703
+ display: inline-flex;
704
+ align-items: center;
705
+ justify-content: center;
706
+ flex: 0 0 auto;
707
+ gap: 4px;
708
+ width: fit-content;
709
+ border: 1px solid transparent;
710
+ white-space: nowrap;
711
+ }
712
+ .rich-text-at-mention-status[data-tone=blue] {
713
+ background: var(--rich-text-at-mention-info-bg);
714
+ color: var(--rich-text-at-mention-info-fg);
715
+ }
716
+ .rich-text-at-mention-status[data-tone=amber] {
717
+ background: var(--rich-text-at-mention-warning-bg);
718
+ color: var(--rich-text-at-mention-warning-fg);
719
+ }
720
+ .rich-text-at-mention-status[data-tone=green] {
721
+ background: var(--rich-text-at-mention-success-bg);
722
+ color: var(--rich-text-at-mention-success-fg);
723
+ }
724
+ .rich-text-at-mention-status[data-tone=purple] {
725
+ background: color-mix(in srgb, var(--rich-text-at-mention-accent) 12%, transparent);
726
+ color: var(--rich-text-at-mention-accent);
727
+ }
728
+ .rich-text-at-mention-status[data-tone=red] {
729
+ background: var(--rich-text-at-mention-danger-bg);
730
+ color: var(--rich-text-at-mention-danger-fg);
731
+ }
732
+ .rich-text-at-mention-status[data-tone=neutral] {
733
+ background: var(--rich-text-at-mention-hover);
734
+ color: var(--rich-text-at-mention-text-secondary);
735
+ }
736
+ .rich-text-at-mention-status--activity {
737
+ padding-inline: 0;
738
+ background: transparent;
739
+ }
740
+ .rich-text-at-mention-status--activity[data-tone] {
741
+ background: transparent;
742
+ }
743
+ .rich-text-at-mention-status [data-slot=status-dot] {
744
+ display: inline-flex;
745
+ width: 6px;
746
+ height: 6px;
747
+ flex: 0 0 6px;
748
+ border-radius: 999px;
749
+ background: currentColor;
750
+ }
751
+ .rich-text-at-mention-status [data-slot=status-dot][data-pulse=true] {
752
+ animation: rich-text-at-mention-pulse 1.4s ease-in-out infinite;
753
+ }
754
+ @keyframes rich-text-at-mention-pulse {
755
+ 50% {
756
+ opacity: 0.45;
757
+ }
758
+ }
759
+ .rich-text-at-mention-select-indicator {
760
+ display: grid;
761
+ place-items: center;
762
+ width: 18px;
763
+ height: 18px;
764
+ flex: 0 0 18px;
765
+ border: 1px solid var(--border, var(--rich-text-at-mention-line-1));
766
+ border-radius: 5px;
767
+ background: #fff;
768
+ color: transparent;
769
+ }
770
+ .rich-text-at-mention-select-indicator[data-selected=true] {
771
+ border-color: #171717;
772
+ background: #171717;
773
+ color: #fff;
774
+ }
775
+ .rich-text-at-mention-multiselect-footer {
776
+ display: flex;
777
+ align-items: center;
778
+ justify-content: space-between;
779
+ gap: 8px;
780
+ padding: 8px 10px;
781
+ border-top: 1px solid var(--border, var(--rich-text-at-mention-line-1));
782
+ background: var(--panel, var(--rich-text-at-mention-bg));
783
+ }
784
+ .rich-text-at-mention-multiselect-footer__count {
785
+ color: var(--rich-text-at-mention-text-secondary);
786
+ font-size: 12px;
787
+ font-weight: 600;
788
+ }
789
+ .rich-text-at-mention-multiselect-footer__actions {
790
+ display: flex;
791
+ gap: 8px;
792
+ }
793
+ .rich-text-at-mention-multiselect-footer__button {
794
+ appearance: none;
795
+ height: 30px;
796
+ padding-inline: 12px;
797
+ border-radius: 8px;
798
+ font: inherit;
799
+ font-size: 12px;
800
+ font-weight: 700;
801
+ cursor: pointer;
802
+ }
803
+ .rich-text-at-mention-multiselect-footer__button--secondary {
804
+ border: 1px solid var(--border, var(--rich-text-at-mention-line-1));
805
+ background: #fff;
806
+ color: var(--text, var(--rich-text-at-mention-text-primary));
807
+ }
808
+ .rich-text-at-mention-multiselect-footer__button--primary {
809
+ border: 0;
810
+ background: #171717;
811
+ color: #fff;
812
+ }
813
+ .rich-text-at-mention-multiselect-footer__button:disabled {
814
+ opacity: 0.45;
815
+ cursor: default;
816
+ }
817
+ .rich-text-at-mention-file-thumb {
818
+ display: inline-flex;
819
+ align-items: center;
820
+ justify-content: center;
821
+ width: var(--agent-mention-file-icon-size, 16px);
822
+ height: var(--agent-mention-file-icon-size, 16px);
823
+ flex: 0 0 var(--agent-mention-file-icon-size, 16px);
824
+ overflow: hidden;
825
+ border-radius: 4px;
826
+ background-color: var(--bg-block, var(--block));
827
+ vertical-align: middle;
828
+ }
829
+ .rich-text-at-mention-file-thumb img {
830
+ display: block;
831
+ width: 100%;
832
+ height: 100%;
833
+ object-fit: cover;
834
+ }
835
+ .rich-text-at-mention-file-icon {
836
+ width: var(--agent-mention-file-icon-size, 16px);
837
+ height: var(--agent-mention-file-icon-size, 16px);
838
+ flex: 0 0 var(--agent-mention-file-icon-size, 16px);
839
+ background-color: var(--folder);
840
+ border-radius: 4px;
841
+ }
842
+ .rich-text-at-mention-kind-icon {
843
+ display: block;
844
+ width: 16px;
845
+ height: 16px;
846
+ flex: 0 0 16px;
847
+ background-color: currentColor;
848
+ border-radius: 22.5%;
849
+ }
850
+ .rich-text-at-mention-avatar-img--user-placeholder {
851
+ background-color: var(--muted);
852
+ }
853
+ [data-workspace-app-icon=true] {
854
+ display: inline-grid;
855
+ min-width: 0;
856
+ min-height: 0;
857
+ place-items: center;
858
+ overflow: hidden;
859
+ border-radius: 22.5%;
860
+ background: var(--workspace-app-icon-bg, transparent);
861
+ }
862
+ [data-workspace-app-icon=true] > img {
863
+ display: block;
864
+ width: 100%;
865
+ height: 100%;
866
+ object-fit: cover;
867
+ object-position: center;
868
+ }
869
+ [data-workspace-app-icon=true] > .rich-text-at-mention-kind-icon {
870
+ display: block;
871
+ }
872
+ /*# sourceMappingURL=index.css.map */