@fragments-sdk/ui 0.9.1 → 0.9.3

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.
Files changed (70) hide show
  1. package/dist/assets/ui.css +10324 -0
  2. package/fragments.json +1 -1
  3. package/package.json +119 -98
  4. package/src/components/Loading/Loading.fragment.tsx +1 -1
  5. package/src/components/Sidebar/Sidebar.fragment.tsx +138 -109
  6. package/dist/assets/components/Accordion/Accordion.module.css +0 -107
  7. package/dist/assets/components/Alert/Alert.module.css +0 -158
  8. package/dist/assets/components/AppShell/AppShell.module.css +0 -156
  9. package/dist/assets/components/Avatar/Avatar.module.css +0 -109
  10. package/dist/assets/components/Badge/Badge.module.css +0 -117
  11. package/dist/assets/components/BentoGrid/BentoGrid.module.css +0 -113
  12. package/dist/assets/components/Box/Box.module.css +0 -341
  13. package/dist/assets/components/Breadcrumbs/Breadcrumbs.module.css +0 -108
  14. package/dist/assets/components/Button/Button.module.css +0 -153
  15. package/dist/assets/components/ButtonGroup/ButtonGroup.module.css +0 -32
  16. package/dist/assets/components/Card/Card.module.css +0 -131
  17. package/dist/assets/components/Chart/Chart.module.css +0 -122
  18. package/dist/assets/components/Checkbox/Checkbox.module.css +0 -129
  19. package/dist/assets/components/Chip/Chip.module.css +0 -248
  20. package/dist/assets/components/CodeBlock/CodeBlock.module.css +0 -309
  21. package/dist/assets/components/Collapsible/Collapsible.module.css +0 -103
  22. package/dist/assets/components/ColorPicker/ColorPicker.module.css +0 -140
  23. package/dist/assets/components/Combobox/Combobox.module.css +0 -278
  24. package/dist/assets/components/Command/Command.module.css +0 -132
  25. package/dist/assets/components/ConversationList/ConversationList.module.css +0 -138
  26. package/dist/assets/components/DatePicker/DatePicker.module.css +0 -388
  27. package/dist/assets/components/Dialog/Dialog.module.css +0 -170
  28. package/dist/assets/components/Drawer/Drawer.module.css +0 -214
  29. package/dist/assets/components/EmptyState/EmptyState.module.css +0 -100
  30. package/dist/assets/components/Field/Field.module.css +0 -30
  31. package/dist/assets/components/Fieldset/Fieldset.module.css +0 -21
  32. package/dist/assets/components/Form/Form.module.css +0 -5
  33. package/dist/assets/components/Grid/Grid.module.css +0 -249
  34. package/dist/assets/components/Header/Header.module.css +0 -332
  35. package/dist/assets/components/Icon/Icon.module.css +0 -35
  36. package/dist/assets/components/Image/Image.module.css +0 -71
  37. package/dist/assets/components/Input/Input.module.css +0 -135
  38. package/dist/assets/components/Link/Link.module.css +0 -66
  39. package/dist/assets/components/List/List.module.css +0 -66
  40. package/dist/assets/components/Listbox/Listbox.module.css +0 -99
  41. package/dist/assets/components/Loading/Loading.module.css +0 -210
  42. package/dist/assets/components/Markdown/Markdown.module.css +0 -149
  43. package/dist/assets/components/Menu/Menu.module.css +0 -182
  44. package/dist/assets/components/Message/Message.module.css +0 -175
  45. package/dist/assets/components/NavigationMenu/NavigationMenu.module.css +0 -553
  46. package/dist/assets/components/Pagination/Pagination.module.css +0 -92
  47. package/dist/assets/components/Popover/Popover.module.css +0 -168
  48. package/dist/assets/components/Progress/Progress.module.css +0 -166
  49. package/dist/assets/components/Prompt/Prompt.module.css +0 -262
  50. package/dist/assets/components/RadioGroup/RadioGroup.module.css +0 -152
  51. package/dist/assets/components/ScrollArea/ScrollArea.module.css +0 -89
  52. package/dist/assets/components/Select/Select.module.css +0 -206
  53. package/dist/assets/components/Separator/Separator.module.css +0 -71
  54. package/dist/assets/components/Sidebar/Sidebar.module.css +0 -683
  55. package/dist/assets/components/Skeleton/Skeleton.module.css +0 -134
  56. package/dist/assets/components/Slider/Slider.module.css +0 -83
  57. package/dist/assets/components/Stack/Stack.module.css +0 -132
  58. package/dist/assets/components/Table/Table.module.css +0 -230
  59. package/dist/assets/components/TableOfContents/TableOfContents.module.css +0 -53
  60. package/dist/assets/components/Tabs/Tabs.module.css +0 -142
  61. package/dist/assets/components/Text/Text.module.css +0 -85
  62. package/dist/assets/components/Textarea/Textarea.module.css +0 -96
  63. package/dist/assets/components/Theme/ThemeToggle.module.css +0 -85
  64. package/dist/assets/components/ThinkingIndicator/ThinkingIndicator.module.css +0 -201
  65. package/dist/assets/components/Toast/Toast.module.css +0 -199
  66. package/dist/assets/components/Toggle/Toggle.module.css +0 -133
  67. package/dist/assets/components/ToggleGroup/ToggleGroup.module.css +0 -122
  68. package/dist/assets/components/Tooltip/Tooltip.module.css +0 -64
  69. package/dist/assets/components/VisuallyHidden/VisuallyHidden.module.css +0 -11
  70. package/dist/assets/styles/globals.css +0 -355
@@ -1,32 +0,0 @@
1
- ._group_vdlw7_1 {
2
- display: flex;
3
- flex-direction: row;
4
- }
5
-
6
- ._gap-xs_vdlw7_6 {
7
- gap: var(--fui-space-1, 0.5rem);
8
- }
9
-
10
- ._gap-sm_vdlw7_10 {
11
- gap: var(--fui-space-2, 1rem);
12
- }
13
-
14
- ._gap-md_vdlw7_14 {
15
- gap: var(--fui-space-3, 1.5rem);
16
- }
17
-
18
- ._wrap_vdlw7_18 {
19
- flex-wrap: wrap;
20
- }
21
-
22
- ._align-start_vdlw7_22 {
23
- justify-content: flex-start;
24
- }
25
-
26
- ._align-center_vdlw7_26 {
27
- justify-content: center;
28
- }
29
-
30
- ._align-end_vdlw7_30 {
31
- justify-content: flex-end;
32
- }
@@ -1,131 +0,0 @@
1
- ._card_1ysig_1 {
2
- background-color: var(--fui-bg-elevated, #ffffff);
3
- border: 1px solid var(--fui-border, rgba(0, 0, 0, 0.08));
4
- border-radius: var(--fui-radius-lg, 0.571rem);
5
- font-family: var(--fui-font-sans, "Geist Sans", "Geist", Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
6
- transition: box-shadow var(--fui-transition-fast, 150ms ease), border-color var(--fui-transition-fast, 150ms ease), transform var(--fui-transition-fast, 150ms ease);
7
- }
8
-
9
- ._default_1ysig_9 {
10
- box-shadow: var(--fui-shadow-sm, 0 1px 2px 0 rgba(0, 0, 0, 0.03));
11
- }
12
-
13
- ._outlined_1ysig_13 {
14
- border-color: var(--fui-border-strong, rgba(0, 0, 0, 0.14));
15
- box-shadow: none;
16
- }
17
-
18
- ._elevated_1ysig_18 {
19
- box-shadow: var(--fui-shadow-md, 0 2px 4px -1px rgba(0, 0, 0, 0.06), 0 1px 3px -2px rgba(0, 0, 0, 0.04));
20
- }
21
-
22
- ._paddingNone_1ysig_22 {
23
- padding: 0;
24
- }
25
-
26
- ._paddingSm_1ysig_26 {
27
- padding: var(--fui-padding-container-sm, 1.5rem);
28
- }
29
-
30
- ._paddingMd_1ysig_30 {
31
- padding: var(--fui-padding-container-md, 2rem);
32
- }
33
-
34
- ._paddingLg_1ysig_34 {
35
- padding: var(--fui-padding-container-lg, 3rem);
36
- }
37
-
38
- ._interactive_1ysig_38 {
39
- appearance: none;
40
- background: transparent;
41
- border: none;
42
- padding: 0;
43
- margin: 0;
44
- font: inherit;
45
- color: inherit;
46
- cursor: pointer;
47
- }
48
- ._interactive_1ysig_38:disabled {
49
- cursor: not-allowed;
50
- }
51
- ._interactive_1ysig_38 {
52
- transition: background-color var(--fui-transition-fast, 150ms ease), border-color var(--fui-transition-fast, 150ms ease), box-shadow var(--fui-transition-fast, 150ms ease), opacity var(--fui-transition-fast, 150ms ease);
53
- }
54
- ._interactive_1ysig_38:focus-visible {
55
- outline: none;
56
- box-shadow: 0 0 0 var(--fui-focus-ring-offset, 2px) var(--fui-bg-primary, #ffffff), 0 0 0 calc(var(--fui-focus-ring-offset, 2px) + var(--fui-focus-ring-width, 2px)) var(--fui-focus-ring-color, #18181b);
57
- }
58
- ._interactive_1ysig_38:disabled, ._interactive_1ysig_38[data-disabled] {
59
- opacity: 0.5;
60
- pointer-events: none;
61
- }
62
- ._interactive_1ysig_38 {
63
- display: block;
64
- width: 100%;
65
- text-align: left;
66
- cursor: pointer;
67
- }
68
- ._interactive_1ysig_38:hover {
69
- border-color: var(--fui-border-strong, rgba(0, 0, 0, 0.14));
70
- box-shadow: var(--fui-shadow-md, 0 2px 4px -1px rgba(0, 0, 0, 0.06), 0 1px 3px -2px rgba(0, 0, 0, 0.04));
71
- transform: translateY(-2px);
72
- }
73
- ._interactive_1ysig_38:active {
74
- box-shadow: var(--fui-shadow-sm, 0 1px 2px 0 rgba(0, 0, 0, 0.03));
75
- transform: translateY(0);
76
- }
77
-
78
- ._header_1ysig_78 {
79
- margin-bottom: var(--fui-space-3, 1.5rem);
80
- }
81
-
82
- ._title_1ysig_82 {
83
- margin: 0;
84
- font-size: var(--fui-font-size-base, 1.143rem);
85
- font-weight: var(--fui-font-weight-semibold, 600);
86
- color: var(--fui-text-primary, #18181b);
87
- line-height: var(--fui-line-height-tight, 1.25);
88
- }
89
-
90
- ._description_1ysig_90 {
91
- margin: var(--fui-space-1, 0.5rem) 0 0;
92
- font-size: var(--fui-font-size-sm, 1rem);
93
- color: var(--fui-text-secondary, #52525b);
94
- line-height: var(--fui-line-height-normal, 1.5);
95
- }
96
-
97
- ._body_1ysig_97 {
98
- color: var(--fui-text-primary, #18181b);
99
- font-size: var(--fui-font-size-sm, 1rem);
100
- line-height: var(--fui-line-height-normal, 1.5);
101
- }
102
-
103
- ._footer_1ysig_103 {
104
- display: flex;
105
- align-items: center;
106
- gap: var(--fui-space-2, 1rem);
107
- margin-top: var(--fui-space-4, 2rem);
108
- padding-top: var(--fui-space-4, 2rem);
109
- border-top: 1px solid var(--fui-border, rgba(0, 0, 0, 0.08));
110
- }
111
-
112
- @media (prefers-reduced-motion: reduce) {
113
- ._card_1ysig_1 {
114
- transition: none;
115
- }
116
- ._interactive_1ysig_38:hover {
117
- transform: none;
118
- }
119
- ._interactive_1ysig_38:active {
120
- transform: none;
121
- }
122
- }
123
- @media (prefers-contrast: more) {
124
- ._card_1ysig_1 {
125
- border-width: 2px;
126
- border-color: var(--fui-text-primary, #18181b);
127
- }
128
- ._footer_1ysig_103 {
129
- border-top-width: 2px;
130
- }
131
- }
@@ -1,122 +0,0 @@
1
- ._container_1kdlo_1 {
2
- width: 100%;
3
- height: 100%;
4
- font-family: var(--fui-font-sans, "Geist Sans", "Geist", Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
5
- }
6
- ._container_1kdlo_1 .recharts-text {
7
- fill: var(--fui-text-secondary, #52525b);
8
- font-size: var(--fui-font-size-xs, 0.857rem);
9
- }
10
- ._container_1kdlo_1 .recharts-cartesian-grid line {
11
- stroke: var(--fui-border, rgba(0, 0, 0, 0.08));
12
- }
13
- ._container_1kdlo_1 .recharts-cartesian-axis-line,
14
- ._container_1kdlo_1 .recharts-cartesian-axis-tick-line {
15
- stroke: var(--fui-border, rgba(0, 0, 0, 0.08));
16
- }
17
- ._container_1kdlo_1 .recharts-curve.recharts-tooltip-cursor {
18
- stroke: var(--fui-border, rgba(0, 0, 0, 0.08));
19
- }
20
- ._container_1kdlo_1 .recharts-rectangle.recharts-tooltip-cursor {
21
- fill: var(--fui-bg-hover, rgba(0, 0, 0, 0.04));
22
- }
23
-
24
- ._srOnly_1kdlo_24 {
25
- position: absolute;
26
- width: 1px;
27
- height: 1px;
28
- padding: 0;
29
- margin: -1px;
30
- overflow: hidden;
31
- clip: rect(0, 0, 0, 0);
32
- white-space: nowrap;
33
- border: 0;
34
- }
35
-
36
- ._tooltip_1kdlo_36 {
37
- background: var(--fui-bg-elevated, #ffffff);
38
- border: 1px solid var(--fui-border, rgba(0, 0, 0, 0.08));
39
- border-radius: var(--fui-radius-md, 0.429rem);
40
- box-shadow: var(--fui-shadow-md, 0 2px 4px -1px rgba(0, 0, 0, 0.06), 0 1px 3px -2px rgba(0, 0, 0, 0.04));
41
- padding: var(--fui-space-2, 1rem) var(--fui-space-3, 1.5rem);
42
- font-family: var(--fui-font-sans, "Geist Sans", "Geist", Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
43
- }
44
-
45
- ._tooltipLabel_1kdlo_45 {
46
- font-size: var(--fui-font-size-xs, 0.857rem);
47
- font-weight: var(--fui-font-weight-medium, 500);
48
- color: var(--fui-text-primary, #18181b);
49
- margin-bottom: var(--fui-space-1, 0.5rem);
50
- }
51
-
52
- ._tooltipItems_1kdlo_52 {
53
- display: flex;
54
- flex-direction: column;
55
- gap: 2px;
56
- }
57
-
58
- ._tooltipItem_1kdlo_52 {
59
- display: flex;
60
- align-items: center;
61
- gap: var(--fui-space-2, 1rem);
62
- justify-content: space-between;
63
- min-width: 100px;
64
- }
65
-
66
- ._tooltipIndicator_1kdlo_66 {
67
- width: 8px;
68
- height: 8px;
69
- border-radius: 50%;
70
- flex-shrink: 0;
71
- }
72
- ._tooltipIndicator_1kdlo_66._tooltipIndicatorLine_1kdlo_72 {
73
- width: 12px;
74
- height: 2px;
75
- border-radius: var(--fui-radius-full, 9999px);
76
- }
77
- ._tooltipIndicator_1kdlo_66._tooltipIndicatorDashed_1kdlo_77 {
78
- width: 12px;
79
- height: 0;
80
- border-top: 2px dashed;
81
- border-radius: 0;
82
- }
83
-
84
- ._tooltipItemLabel_1kdlo_84 {
85
- font-size: var(--fui-font-size-xs, 0.857rem);
86
- color: var(--fui-text-secondary, #52525b);
87
- }
88
-
89
- ._tooltipItemValue_1kdlo_89 {
90
- font-size: var(--fui-font-size-xs, 0.857rem);
91
- font-weight: var(--fui-font-weight-medium, 500);
92
- color: var(--fui-text-primary, #18181b);
93
- font-variant-numeric: tabular-nums;
94
- margin-left: auto;
95
- }
96
-
97
- ._legend_1kdlo_97 {
98
- display: flex;
99
- flex-wrap: wrap;
100
- align-items: center;
101
- justify-content: center;
102
- gap: var(--fui-space-3, 1.5rem);
103
- padding-top: var(--fui-space-2, 1rem);
104
- }
105
-
106
- ._legendItem_1kdlo_106 {
107
- display: flex;
108
- align-items: center;
109
- gap: var(--fui-space-1, 0.5rem);
110
- }
111
-
112
- ._legendDot_1kdlo_112 {
113
- width: 8px;
114
- height: 8px;
115
- border-radius: 50%;
116
- flex-shrink: 0;
117
- }
118
-
119
- ._legendLabel_1kdlo_119 {
120
- font-size: var(--fui-font-size-xs, 0.857rem);
121
- color: var(--fui-text-secondary, #52525b);
122
- }
@@ -1,129 +0,0 @@
1
- ._wrapper_34t3o_1 {
2
- display: inline-flex;
3
- align-items: center;
4
- gap: var(--fui-space-2, 1rem);
5
- cursor: pointer;
6
- font-family: var(--fui-font-sans, "Geist Sans", "Geist", Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
7
- }
8
- ._wrapper_34t3o_1[data-has-description] {
9
- align-items: flex-start;
10
- }
11
- ._wrapper_34t3o_1[data-disabled] {
12
- cursor: not-allowed;
13
- opacity: 0.5;
14
- }
15
-
16
- ._checkbox_34t3o_16 {
17
- transition: background-color var(--fui-transition-fast, 150ms ease), border-color var(--fui-transition-fast, 150ms ease), box-shadow var(--fui-transition-fast, 150ms ease), opacity var(--fui-transition-fast, 150ms ease);
18
- }
19
- ._checkbox_34t3o_16:focus-visible {
20
- outline: none;
21
- box-shadow: 0 0 0 var(--fui-focus-ring-offset, 2px) var(--fui-bg-primary, #ffffff), 0 0 0 calc(var(--fui-focus-ring-offset, 2px) + var(--fui-focus-ring-width, 2px)) var(--fui-focus-ring-color, #18181b);
22
- }
23
- ._checkbox_34t3o_16:disabled, ._checkbox_34t3o_16[data-disabled] {
24
- opacity: 0.5;
25
- pointer-events: none;
26
- }
27
- ._checkbox_34t3o_16 {
28
- min-width: var(--fui-target-size-min, 1.714rem);
29
- min-height: var(--fui-target-size-min, 1.714rem);
30
- display: inline-flex;
31
- align-items: center;
32
- justify-content: center;
33
- position: relative;
34
- flex-shrink: 0;
35
- width: 1rem;
36
- height: 1rem;
37
- margin-top: 0;
38
- background-color: var(--fui-bg-elevated, #ffffff);
39
- border: 1px solid var(--fui-border-strong, rgba(0, 0, 0, 0.14));
40
- border-radius: var(--fui-radius-sm, 0.25rem);
41
- cursor: inherit;
42
- }
43
- ._checkbox_34t3o_16:hover:not([data-disabled]) {
44
- border-color: var(--fui-text-tertiary, #71717a);
45
- }
46
- ._checkbox_34t3o_16[data-checked], ._checkbox_34t3o_16[data-indeterminate] {
47
- background-color: var(--fui-color-accent, #18181b);
48
- border-color: var(--fui-color-accent, #18181b);
49
- }
50
- ._checkbox_34t3o_16[data-checked]:hover:not([data-disabled]), ._checkbox_34t3o_16[data-indeterminate]:hover:not([data-disabled]) {
51
- background-color: var(--fui-color-accent-hover, rgb(62.88, 62.88, 70.74));
52
- border-color: var(--fui-color-accent-hover, rgb(62.88, 62.88, 70.74));
53
- }
54
- ._checkbox_34t3o_16[data-invalid] {
55
- border-color: var(--fui-color-danger, #ef4444);
56
- }
57
- ._checkbox_34t3o_16[data-invalid][data-checked], ._checkbox_34t3o_16[data-invalid][data-indeterminate] {
58
- background-color: var(--fui-color-danger, #ef4444);
59
- border-color: var(--fui-color-danger, #ef4444);
60
- }
61
-
62
- ._sm_34t3o_62 {
63
- width: 0.875rem;
64
- height: 0.875rem;
65
- border-radius: var(--fui-space-0-75, 0.215rem);
66
- }
67
-
68
- ._lg_34t3o_68 {
69
- width: 1.25rem;
70
- height: 1.25rem;
71
- }
72
-
73
- ._indicator_34t3o_73 {
74
- display: flex;
75
- align-items: center;
76
- justify-content: center;
77
- color: var(--fui-text-inverse, #f4f4f5);
78
- }
79
- ._indicator_34t3o_73 svg {
80
- width: 0.75rem;
81
- height: 0.75rem;
82
- }
83
- ._indicator_34t3o_73 {
84
- opacity: 0;
85
- transform: scale(0.8);
86
- transition: opacity var(--fui-transition-fast, 150ms ease), transform var(--fui-transition-fast, 150ms ease);
87
- }
88
- [data-checked] > ._indicator_34t3o_73, [data-indeterminate] > ._indicator_34t3o_73 {
89
- opacity: 1;
90
- transform: scale(1);
91
- }
92
-
93
- ._sm_34t3o_62 ._indicator_34t3o_73 svg {
94
- width: 0.625rem;
95
- height: 0.625rem;
96
- }
97
-
98
- ._lg_34t3o_68 ._indicator_34t3o_73 svg {
99
- width: 0.875rem;
100
- height: 0.875rem;
101
- }
102
-
103
- ._content_34t3o_103 {
104
- display: flex;
105
- flex-direction: column;
106
- gap: var(--fui-space-0-5, 0.15rem);
107
- }
108
-
109
- ._label_34t3o_109 {
110
- font-size: var(--fui-font-size-sm, 1rem);
111
- font-weight: var(--fui-font-weight-medium, 500);
112
- color: var(--fui-text-primary, #18181b);
113
- line-height: var(--fui-line-height-tight, 1.25);
114
- user-select: none;
115
- }
116
-
117
- ._labelSm_34t3o_117 {
118
- font-size: var(--fui-font-size-xs, 0.857rem);
119
- }
120
-
121
- ._labelLg_34t3o_121 {
122
- font-size: var(--fui-font-size-base, 1.143rem);
123
- }
124
-
125
- ._description_34t3o_125 {
126
- font-size: var(--fui-font-size-xs, 0.857rem);
127
- color: var(--fui-text-secondary, #52525b);
128
- line-height: var(--fui-line-height-normal, 1.5);
129
- }
@@ -1,248 +0,0 @@
1
- ._chip_169ej_1 {
2
- appearance: none;
3
- background: transparent;
4
- border: none;
5
- padding: 0;
6
- margin: 0;
7
- font: inherit;
8
- color: inherit;
9
- cursor: pointer;
10
- }
11
- ._chip_169ej_1:disabled {
12
- cursor: not-allowed;
13
- }
14
- ._chip_169ej_1 {
15
- transition: background-color var(--fui-transition-fast, 150ms ease), border-color var(--fui-transition-fast, 150ms ease), box-shadow var(--fui-transition-fast, 150ms ease), opacity var(--fui-transition-fast, 150ms ease);
16
- }
17
- ._chip_169ej_1:focus-visible {
18
- outline: none;
19
- box-shadow: 0 0 0 var(--fui-focus-ring-offset, 2px) var(--fui-bg-primary, #ffffff), 0 0 0 calc(var(--fui-focus-ring-offset, 2px) + var(--fui-focus-ring-width, 2px)) var(--fui-focus-ring-color, #18181b);
20
- }
21
- ._chip_169ej_1:disabled, ._chip_169ej_1[data-disabled] {
22
- opacity: 0.5;
23
- pointer-events: none;
24
- }
25
- ._chip_169ej_1 {
26
- display: inline-flex;
27
- align-items: center;
28
- gap: var(--fui-space-1, 0.5rem);
29
- border-radius: var(--fui-radius-full, 9999px);
30
- font-family: var(--fui-font-sans, "Geist Sans", "Geist", Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
31
- font-weight: var(--fui-font-weight-medium, 500);
32
- line-height: 1;
33
- white-space: nowrap;
34
- user-select: none;
35
- }
36
-
37
- ._withRemove_169ej_37 {
38
- border-top-right-radius: 0;
39
- border-bottom-right-radius: 0;
40
- }
41
-
42
- ._sm_169ej_42 {
43
- height: var(--fui-button-height-sm, 2rem);
44
- padding: 0 var(--fui-space-2, 1rem);
45
- font-size: var(--fui-font-size-xs, 0.857rem);
46
- }
47
-
48
- ._md_169ej_48 {
49
- height: var(--fui-button-height-md, 2.5714285714rem);
50
- padding: 0 var(--fui-space-3, 1.5rem);
51
- font-size: var(--fui-font-size-sm, 1rem);
52
- }
53
-
54
- ._lg_169ej_54 {
55
- height: var(--fui-button-height-lg, 3.1428571429rem);
56
- padding: 0 var(--fui-space-4, 2rem);
57
- font-size: var(--fui-font-size-base, 1.143rem);
58
- }
59
-
60
- ._filled_169ej_60 {
61
- background-color: var(--fui-bg-tertiary, #f4f4f5);
62
- color: var(--fui-text-primary, #18181b);
63
- }
64
- ._filled_169ej_60:hover:not(:disabled) {
65
- background-color: var(--fui-bg-hover, rgba(0, 0, 0, 0.04));
66
- }
67
- ._filled_169ej_60:active:not(:disabled) {
68
- background-color: var(--fui-bg-active, rgba(0, 0, 0, 0.06));
69
- }
70
- ._filled_169ej_60._selected_169ej_70 {
71
- background-color: var(--fui-color-accent, #18181b);
72
- color: var(--fui-text-inverse, #f4f4f5);
73
- }
74
- ._filled_169ej_60._selected_169ej_70:hover:not(:disabled) {
75
- background-color: var(--fui-color-accent-hover, rgb(62.88, 62.88, 70.74));
76
- }
77
- ._filled_169ej_60._selected_169ej_70:active:not(:disabled) {
78
- background-color: var(--fui-color-accent-active, rgb(84.48, 84.48, 95.04));
79
- }
80
-
81
- ._outlined_169ej_81 {
82
- background-color: transparent;
83
- color: var(--fui-text-primary, #18181b);
84
- border: 1px solid var(--fui-border, rgba(0, 0, 0, 0.08));
85
- }
86
- ._outlined_169ej_81:hover:not(:disabled) {
87
- background-color: var(--fui-bg-hover, rgba(0, 0, 0, 0.04));
88
- border-color: var(--fui-border-strong, rgba(0, 0, 0, 0.14));
89
- }
90
- ._outlined_169ej_81:active:not(:disabled) {
91
- background-color: var(--fui-bg-active, rgba(0, 0, 0, 0.06));
92
- }
93
- ._outlined_169ej_81._selected_169ej_70 {
94
- background-color: var(--fui-color-accent, #18181b);
95
- color: var(--fui-text-inverse, #f4f4f5);
96
- border-color: var(--fui-color-accent, #18181b);
97
- }
98
- ._outlined_169ej_81._selected_169ej_70:hover:not(:disabled) {
99
- background-color: var(--fui-color-accent-hover, rgb(62.88, 62.88, 70.74));
100
- border-color: var(--fui-color-accent-hover, rgb(62.88, 62.88, 70.74));
101
- }
102
- ._outlined_169ej_81._selected_169ej_70:active:not(:disabled) {
103
- background-color: var(--fui-color-accent-active, rgb(84.48, 84.48, 95.04));
104
- border-color: var(--fui-color-accent-active, rgb(84.48, 84.48, 95.04));
105
- }
106
-
107
- ._soft_169ej_107 {
108
- background-color: var(--fui-color-info-bg, rgba(59, 130, 246, 0.1));
109
- color: var(--fui-color-info-text, rgb(9.807804878, 87.1804878049, 213.592195122));
110
- }
111
- ._soft_169ej_107:hover:not(:disabled) {
112
- background-color: var(--fui-bg-hover, rgba(0, 0, 0, 0.04));
113
- }
114
- ._soft_169ej_107:active:not(:disabled) {
115
- background-color: var(--fui-bg-active, rgba(0, 0, 0, 0.06));
116
- }
117
- ._soft_169ej_107._selected_169ej_70 {
118
- background-color: var(--fui-color-accent, #18181b);
119
- color: var(--fui-text-inverse, #f4f4f5);
120
- }
121
- ._soft_169ej_107._selected_169ej_70:hover:not(:disabled) {
122
- background-color: var(--fui-color-accent-hover, rgb(62.88, 62.88, 70.74));
123
- }
124
- ._soft_169ej_107._selected_169ej_70:active:not(:disabled) {
125
- background-color: var(--fui-color-accent-active, rgb(84.48, 84.48, 95.04));
126
- }
127
-
128
- ._avatar_169ej_128 {
129
- display: flex;
130
- align-items: center;
131
- margin-left: calc(-1 * var(--fui-space-1, 0.5rem));
132
- }
133
- ._avatar_169ej_128 img {
134
- width: var(--fui-icon-md, 1.143rem);
135
- height: var(--fui-icon-md, 1.143rem);
136
- border-radius: var(--fui-radius-full, 9999px);
137
- object-fit: cover;
138
- }
139
- ._sm_169ej_42 ._avatar_169ej_128 img {
140
- width: var(--fui-icon-sm, 1rem);
141
- height: var(--fui-icon-sm, 1rem);
142
- }
143
-
144
- ._icon_169ej_144 {
145
- display: flex;
146
- align-items: center;
147
- }
148
-
149
- ._removableChip_169ej_149 {
150
- display: inline-flex;
151
- align-items: stretch;
152
- }
153
-
154
- ._remove_169ej_154 {
155
- appearance: none;
156
- background: transparent;
157
- border: none;
158
- padding: 0;
159
- margin: 0;
160
- font: inherit;
161
- color: inherit;
162
- cursor: pointer;
163
- }
164
- ._remove_169ej_154:disabled {
165
- cursor: not-allowed;
166
- }
167
- ._remove_169ej_154 {
168
- transition: background-color var(--fui-transition-fast, 150ms ease), border-color var(--fui-transition-fast, 150ms ease), box-shadow var(--fui-transition-fast, 150ms ease), opacity var(--fui-transition-fast, 150ms ease);
169
- }
170
- ._remove_169ej_154:focus-visible {
171
- outline: none;
172
- box-shadow: 0 0 0 var(--fui-focus-ring-offset, 2px) var(--fui-bg-primary, #ffffff), 0 0 0 calc(var(--fui-focus-ring-offset, 2px) + var(--fui-focus-ring-width, 2px)) var(--fui-focus-ring-color, #18181b);
173
- }
174
- ._remove_169ej_154:disabled, ._remove_169ej_154[data-disabled] {
175
- opacity: 0.5;
176
- pointer-events: none;
177
- }
178
- ._remove_169ej_154 {
179
- display: flex;
180
- align-items: center;
181
- justify-content: center;
182
- padding: 0 var(--fui-space-1, 0.5rem);
183
- font-size: var(--fui-font-size-sm, 1rem);
184
- color: var(--fui-text-secondary, #52525b);
185
- line-height: 1;
186
- border-top-right-radius: var(--fui-radius-full, 9999px);
187
- border-bottom-right-radius: var(--fui-radius-full, 9999px);
188
- border-top-left-radius: 0;
189
- border-bottom-left-radius: 0;
190
- background-color: transparent;
191
- border: 1px solid transparent;
192
- border-left-color: var(--fui-border, rgba(0, 0, 0, 0.08));
193
- }
194
- ._sm_169ej_42 ._remove_169ej_154 {
195
- font-size: var(--fui-font-size-xs, 0.857rem);
196
- }
197
- ._remove_169ej_154:hover:not(:disabled) {
198
- background-color: var(--fui-bg-hover, rgba(0, 0, 0, 0.04));
199
- }
200
-
201
- ._filled_169ej_60 + ._remove_169ej_154 {
202
- background-color: var(--fui-bg-tertiary, #f4f4f5);
203
- }
204
- ._filled_169ej_60 + ._remove_169ej_154:hover:not(:disabled) {
205
- background-color: var(--fui-bg-hover, rgba(0, 0, 0, 0.04));
206
- }
207
- ._filled_169ej_60 + ._remove_169ej_154:active:not(:disabled) {
208
- background-color: var(--fui-bg-active, rgba(0, 0, 0, 0.06));
209
- }
210
-
211
- ._outlined_169ej_81 + ._remove_169ej_154 {
212
- background-color: transparent;
213
- }
214
- ._outlined_169ej_81 + ._remove_169ej_154:hover:not(:disabled) {
215
- background-color: var(--fui-bg-hover, rgba(0, 0, 0, 0.04));
216
- }
217
- ._outlined_169ej_81 + ._remove_169ej_154:active:not(:disabled) {
218
- background-color: var(--fui-bg-active, rgba(0, 0, 0, 0.06));
219
- }
220
-
221
- ._soft_169ej_107 + ._remove_169ej_154 {
222
- background-color: var(--fui-color-info-bg, rgba(59, 130, 246, 0.1));
223
- color: var(--fui-color-info-text, rgb(9.807804878, 87.1804878049, 213.592195122));
224
- }
225
- ._soft_169ej_107 + ._remove_169ej_154:hover:not(:disabled) {
226
- background-color: var(--fui-bg-hover, rgba(0, 0, 0, 0.04));
227
- }
228
- ._soft_169ej_107 + ._remove_169ej_154:active:not(:disabled) {
229
- background-color: var(--fui-bg-active, rgba(0, 0, 0, 0.06));
230
- }
231
-
232
- ._selected_169ej_70 + ._remove_169ej_154 {
233
- background-color: var(--fui-color-accent, #18181b);
234
- color: var(--fui-text-inverse, #f4f4f5);
235
- border-left-color: transparent;
236
- }
237
- ._selected_169ej_70 + ._remove_169ej_154:hover:not(:disabled) {
238
- background-color: var(--fui-color-accent-hover, rgb(62.88, 62.88, 70.74));
239
- }
240
- ._selected_169ej_70 + ._remove_169ej_154:active:not(:disabled) {
241
- background-color: var(--fui-color-accent-active, rgb(84.48, 84.48, 95.04));
242
- }
243
-
244
- ._group_169ej_244 {
245
- display: flex;
246
- flex-wrap: wrap;
247
- gap: var(--fui-space-2, 1rem);
248
- }