@mirohq/design-system-combobox 0.1.0-combobox.1 → 0.1.0-combobox.10
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/main.js +714 -83
- package/dist/main.js.map +1 -1
- package/dist/module.js +700 -88
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +271 -2470
- package/package.json +18 -14
package/dist/types.d.ts
CHANGED
|
@@ -1,509 +1,81 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
|
-
import react__default, { ReactNode } from 'react';
|
|
3
|
-
import
|
|
2
|
+
import react__default, { ReactNode, FC, ComponentPropsWithRef } from 'react';
|
|
3
|
+
import * as packages_components_input_src_types from 'packages/components/input/src/types';
|
|
4
|
+
import { InputProps } from '@mirohq/design-system-input';
|
|
5
|
+
import * as packages_components_internal_base_button_src_base_button from 'packages/components/internal/base-button/src/base-button';
|
|
6
|
+
import * as _mirohq_design_system_hooks_use_press from '@mirohq/design-system-hooks/use-press';
|
|
7
|
+
import * as _stitches_react_types_styled_component from '@stitches/react/types/styled-component';
|
|
4
8
|
import * as _mirohq_design_system_stitches from '@mirohq/design-system-stitches';
|
|
5
9
|
import { StrictComponentProps } from '@mirohq/design-system-stitches';
|
|
6
|
-
import * as
|
|
7
|
-
import
|
|
8
|
-
import * as
|
|
9
|
-
import * as packages_components_input_src_types from 'packages/components/input/src/types';
|
|
10
|
-
import * as _mirohq_design_system_primitive from '@mirohq/design-system-primitive';
|
|
10
|
+
import * as _mirohq_design_system_components_primitive from '@mirohq/design-system-components/primitive';
|
|
11
|
+
import { CSSProperties } from '@stitches/react';
|
|
12
|
+
import * as RadixPopover from '@radix-ui/react-popover';
|
|
11
13
|
import { PopoverPortalProps } from '@radix-ui/react-popover';
|
|
12
14
|
import * as _ariakit_react from '@ariakit/react';
|
|
15
|
+
import * as _mirohq_design_system_primitive from '@mirohq/design-system-primitive';
|
|
13
16
|
import { FormElementProps } from '@mirohq/design-system-base-form';
|
|
14
17
|
|
|
15
|
-
declare const
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
readonly 'indigo-800': any;
|
|
60
|
-
readonly 'indigo-900': any;
|
|
61
|
-
readonly 'red-100': any;
|
|
62
|
-
readonly 'red-200': any;
|
|
63
|
-
readonly 'red-300': any;
|
|
64
|
-
readonly 'red-400': any;
|
|
65
|
-
readonly 'red-500': any;
|
|
66
|
-
readonly 'red-600': any;
|
|
67
|
-
readonly 'red-700': any;
|
|
68
|
-
readonly 'red-800': any;
|
|
69
|
-
readonly 'red-900': any;
|
|
70
|
-
readonly transparent: any;
|
|
71
|
-
readonly white: any;
|
|
72
|
-
readonly 'yellow-100': any;
|
|
73
|
-
readonly 'yellow-200': any;
|
|
74
|
-
readonly 'yellow-300': any;
|
|
75
|
-
readonly 'yellow-400': any;
|
|
76
|
-
readonly 'yellow-500': any;
|
|
77
|
-
readonly 'yellow-600': any;
|
|
78
|
-
readonly 'yellow-700': any;
|
|
79
|
-
readonly 'yellow-800': any;
|
|
80
|
-
readonly 'yellow-900': any;
|
|
81
|
-
"background-alpha-active"?: any;
|
|
82
|
-
"background-alpha-hover"?: any;
|
|
83
|
-
"background-danger-prominent"?: any;
|
|
84
|
-
"background-danger-prominent-active"?: any;
|
|
85
|
-
"background-danger-prominent-hover"?: any;
|
|
86
|
-
"background-danger-subtle"?: any;
|
|
87
|
-
"background-danger-subtle-active"?: any;
|
|
88
|
-
"background-danger-subtle-hover"?: any;
|
|
89
|
-
"background-neutrals"?: any;
|
|
90
|
-
"background-neutrals-active"?: any;
|
|
91
|
-
"background-neutrals-container"?: any;
|
|
92
|
-
"background-neutrals-controls-disabled"?: any;
|
|
93
|
-
"background-neutrals-disabled"?: any;
|
|
94
|
-
"background-neutrals-hover"?: any;
|
|
95
|
-
"background-neutrals-inactive"?: any;
|
|
96
|
-
"background-neutrals-inactive-hover"?: any;
|
|
97
|
-
"background-neutrals-inverted"?: any;
|
|
98
|
-
"background-neutrals-inverted-subtle"?: any;
|
|
99
|
-
"background-neutrals-page"?: any;
|
|
100
|
-
"background-neutrals-page-subtle"?: any;
|
|
101
|
-
"background-neutrals-scrolls"?: any;
|
|
102
|
-
"background-neutrals-scrolls-expanded"?: any;
|
|
103
|
-
"background-neutrals-scrolls-hover"?: any;
|
|
104
|
-
"background-neutrals-scrolls-pressed"?: any;
|
|
105
|
-
"background-neutrals-scrolls-pressed-hover"?: any;
|
|
106
|
-
"background-neutrals-subtle"?: any;
|
|
107
|
-
"background-neutrals-subtle-active"?: any;
|
|
108
|
-
"background-neutrals-subtle-hover"?: any;
|
|
109
|
-
"background-primary-prominent"?: any;
|
|
110
|
-
"background-primary-prominent-active"?: any;
|
|
111
|
-
"background-primary-prominent-expanded"?: any;
|
|
112
|
-
"background-primary-prominent-hover"?: any;
|
|
113
|
-
"background-primary-prominent-pressed"?: any;
|
|
114
|
-
"background-primary-prominent-pressed-hover"?: any;
|
|
115
|
-
"background-primary-prominent-selected"?: any;
|
|
116
|
-
"background-primary-subtle"?: any;
|
|
117
|
-
"background-primary-subtle-active"?: any;
|
|
118
|
-
"background-primary-subtle-expanded"?: any;
|
|
119
|
-
"background-primary-subtle-hover"?: any;
|
|
120
|
-
"background-primary-subtle-pressed"?: any;
|
|
121
|
-
"background-primary-subtle-pressed-hover"?: any;
|
|
122
|
-
"background-primary-subtle-selected"?: any;
|
|
123
|
-
"background-success"?: any;
|
|
124
|
-
"background-success-prominent"?: any;
|
|
125
|
-
"background-success-prominent-active"?: any;
|
|
126
|
-
"background-success-prominent-hover"?: any;
|
|
127
|
-
"background-warning-prominent"?: any;
|
|
128
|
-
"background-warning-subtle"?: any;
|
|
129
|
-
"border-danger"?: any;
|
|
130
|
-
"border-danger-active"?: any;
|
|
131
|
-
"border-danger-hover"?: any;
|
|
132
|
-
"border-focus-inner"?: any;
|
|
133
|
-
"border-focus-middle"?: any;
|
|
134
|
-
"border-focus-outer"?: any;
|
|
135
|
-
"border-neutrals"?: any;
|
|
136
|
-
"border-neutrals-active"?: any;
|
|
137
|
-
"border-neutrals-controls"?: any;
|
|
138
|
-
"border-neutrals-controls-disabled"?: any;
|
|
139
|
-
"border-neutrals-disabled"?: any;
|
|
140
|
-
"border-neutrals-hover"?: any;
|
|
141
|
-
"border-neutrals-inverted"?: any;
|
|
142
|
-
"border-neutrals-subtle"?: any;
|
|
143
|
-
"border-neutrals-text"?: any;
|
|
144
|
-
"border-neutrals-text-active"?: any;
|
|
145
|
-
"border-neutrals-text-hover"?: any;
|
|
146
|
-
"border-neutrals-text-subtle"?: any;
|
|
147
|
-
"border-neutrals-text-subtle-active"?: any;
|
|
148
|
-
"border-neutrals-text-subtle-hover"?: any;
|
|
149
|
-
"border-neutrals-transparent"?: any;
|
|
150
|
-
"border-primary"?: any;
|
|
151
|
-
"border-primary-active"?: any;
|
|
152
|
-
"border-primary-hover"?: any;
|
|
153
|
-
"border-primary-inverted"?: any;
|
|
154
|
-
"border-success"?: any;
|
|
155
|
-
"border-success-active"?: any;
|
|
156
|
-
"border-success-hover"?: any;
|
|
157
|
-
"border-warning"?: any;
|
|
158
|
-
"icon-danger"?: any;
|
|
159
|
-
"icon-danger-active"?: any;
|
|
160
|
-
"icon-danger-hover"?: any;
|
|
161
|
-
"icon-danger-inverted"?: any;
|
|
162
|
-
"icon-neutrals"?: any;
|
|
163
|
-
"icon-neutrals-disabled"?: any;
|
|
164
|
-
"icon-neutrals-inactive"?: any;
|
|
165
|
-
"icon-neutrals-inactive-hover"?: any;
|
|
166
|
-
"icon-neutrals-inverted"?: any;
|
|
167
|
-
"icon-neutrals-search"?: any;
|
|
168
|
-
"icon-neutrals-subtle"?: any;
|
|
169
|
-
"icon-neutrals-text"?: any;
|
|
170
|
-
"icon-primary"?: any;
|
|
171
|
-
"icon-primary-active"?: any;
|
|
172
|
-
"icon-primary-hover"?: any;
|
|
173
|
-
"icon-primary-inverted"?: any;
|
|
174
|
-
"icon-primary-selected"?: any;
|
|
175
|
-
"icon-success"?: any;
|
|
176
|
-
"icon-success-active"?: any;
|
|
177
|
-
"icon-success-hover"?: any;
|
|
178
|
-
"icon-success-inverted"?: any;
|
|
179
|
-
"icon-warning"?: any;
|
|
180
|
-
"icon-warning-prominent"?: any;
|
|
181
|
-
"icon-warning-subtle"?: any;
|
|
182
|
-
"text-danger"?: any;
|
|
183
|
-
"text-danger-active"?: any;
|
|
184
|
-
"text-danger-hover"?: any;
|
|
185
|
-
"text-danger-inverted"?: any;
|
|
186
|
-
"text-neutrals"?: any;
|
|
187
|
-
"text-neutrals-active"?: any;
|
|
188
|
-
"text-neutrals-disabled"?: any;
|
|
189
|
-
"text-neutrals-hover"?: any;
|
|
190
|
-
"text-neutrals-inverted"?: any;
|
|
191
|
-
"text-neutrals-placeholder"?: any;
|
|
192
|
-
"text-neutrals-placeholder-only"?: any;
|
|
193
|
-
"text-neutrals-subtle"?: any;
|
|
194
|
-
"text-neutrals-subtle-active"?: any;
|
|
195
|
-
"text-neutrals-subtle-hover"?: any;
|
|
196
|
-
"text-primary"?: any;
|
|
197
|
-
"text-primary-active"?: any;
|
|
198
|
-
"text-primary-hover"?: any;
|
|
199
|
-
"text-primary-inverted"?: any;
|
|
200
|
-
"text-primary-inverted-subtle"?: any;
|
|
201
|
-
"text-primary-selected"?: any;
|
|
202
|
-
"text-success"?: any;
|
|
203
|
-
"text-success-active"?: any;
|
|
204
|
-
"text-success-hover"?: any;
|
|
205
|
-
"text-success-inverted"?: any;
|
|
206
|
-
"text-warning"?: any;
|
|
207
|
-
"text-warning-subtle"?: any;
|
|
208
|
-
};
|
|
209
|
-
'font-sizes': {
|
|
210
|
-
readonly 150: "0.75rem";
|
|
211
|
-
readonly 175: "0.875rem";
|
|
212
|
-
readonly 200: "1rem";
|
|
213
|
-
readonly 225: "1.125rem";
|
|
214
|
-
readonly 250: "1.25rem";
|
|
215
|
-
readonly 300: "1.5rem";
|
|
216
|
-
readonly 400: "2rem";
|
|
217
|
-
readonly 500: "2.5rem";
|
|
218
|
-
readonly 600: "3rem";
|
|
219
|
-
readonly 800: "4rem";
|
|
220
|
-
readonly 900: "4.5rem";
|
|
221
|
-
};
|
|
222
|
-
fonts: {
|
|
223
|
-
readonly heading: "Roobert, sans-serif";
|
|
224
|
-
readonly body: "Open Sans, sans-serif";
|
|
225
|
-
};
|
|
226
|
-
radii: {
|
|
227
|
-
readonly none: 0;
|
|
228
|
-
readonly half: "999em";
|
|
229
|
-
readonly 25: "2px";
|
|
230
|
-
readonly 50: "4px";
|
|
231
|
-
readonly 75: "6px";
|
|
232
|
-
readonly 100: "8px";
|
|
233
|
-
readonly 200: "16px";
|
|
234
|
-
};
|
|
235
|
-
shadows: {
|
|
236
|
-
readonly 'focus-small': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-inner";
|
|
237
|
-
readonly 'focus-small-outline': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 1px $colors$border-focus-middle, inset 0 0 0 2px $colors$border-focus-inner";
|
|
238
|
-
readonly 'focus-large': "0 0 0 4px $colors$border-focus-inner, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-outer";
|
|
239
|
-
readonly 'focus-controls': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-focus-middle, 0 0 0 5px $colors$border-focus-outer";
|
|
240
|
-
readonly 'focus-controls-error': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-danger, 0 0 0 5px $colors$background-danger-subtle-hover";
|
|
241
|
-
readonly 'focus-controls-success': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$background-success-prominent, 0 0 0 5px $colors$background-success";
|
|
242
|
-
};
|
|
243
|
-
sizes: {
|
|
244
|
-
readonly number: string;
|
|
245
|
-
readonly 'icon-200': "16px";
|
|
246
|
-
readonly 'icon-300': "24px";
|
|
247
|
-
readonly 'icon-400': "32px";
|
|
248
|
-
};
|
|
249
|
-
space: {
|
|
250
|
-
readonly 0: "0px";
|
|
251
|
-
readonly 25: "2px";
|
|
252
|
-
readonly 50: "4px";
|
|
253
|
-
readonly 100: "8px";
|
|
254
|
-
readonly 150: "12px";
|
|
255
|
-
readonly 200: "16px";
|
|
256
|
-
readonly 300: "24px";
|
|
257
|
-
readonly 400: "32px";
|
|
258
|
-
readonly 500: "40px";
|
|
259
|
-
readonly 600: "48px";
|
|
260
|
-
readonly 700: "56px";
|
|
261
|
-
readonly 800: "64px";
|
|
262
|
-
readonly 1200: "96px";
|
|
263
|
-
readonly 1600: "128px";
|
|
264
|
-
};
|
|
265
|
-
'space-gap': {
|
|
266
|
-
readonly 0: any;
|
|
267
|
-
readonly 50: any;
|
|
268
|
-
readonly 100: any;
|
|
269
|
-
readonly 200: any;
|
|
270
|
-
readonly 300: any;
|
|
271
|
-
};
|
|
272
|
-
'space-inset': {
|
|
273
|
-
readonly 0: any;
|
|
274
|
-
readonly 50: any;
|
|
275
|
-
readonly 100: any;
|
|
276
|
-
readonly 150: any;
|
|
277
|
-
readonly 200: any;
|
|
278
|
-
readonly 300: any;
|
|
279
|
-
readonly 400: any;
|
|
280
|
-
readonly 500: any;
|
|
281
|
-
readonly 600: any;
|
|
282
|
-
readonly 700: any;
|
|
283
|
-
readonly 800: any;
|
|
284
|
-
readonly 1200: any;
|
|
285
|
-
readonly 1600: any;
|
|
286
|
-
};
|
|
287
|
-
'space-offset': {
|
|
288
|
-
readonly 0: any;
|
|
289
|
-
readonly 50: any;
|
|
290
|
-
readonly 100: any;
|
|
291
|
-
readonly 150: any;
|
|
292
|
-
readonly 200: any;
|
|
293
|
-
readonly 300: any;
|
|
294
|
-
readonly 400: any;
|
|
295
|
-
readonly 600: any;
|
|
296
|
-
readonly 800: any;
|
|
297
|
-
readonly 1200: any;
|
|
298
|
-
readonly 1600: any;
|
|
299
|
-
readonly 'stacking-0': any;
|
|
300
|
-
readonly 'stacking-100': any;
|
|
301
|
-
readonly 'stacking-200': any;
|
|
302
|
-
readonly 'stacking-300': any;
|
|
303
|
-
readonly 'stacking-400': any;
|
|
304
|
-
readonly 'stacking-500': any;
|
|
305
|
-
readonly 'stacking-800': any;
|
|
306
|
-
};
|
|
307
|
-
'stroke-width': {
|
|
308
|
-
readonly thin: "1.5px";
|
|
309
|
-
readonly normal: "2px";
|
|
310
|
-
readonly bold: "4px";
|
|
311
|
-
};
|
|
312
|
-
'z-indices': {
|
|
313
|
-
readonly dropdownMenu: 100;
|
|
314
|
-
readonly select: 200;
|
|
315
|
-
readonly popover: 300;
|
|
316
|
-
readonly tooltip: 400;
|
|
317
|
-
};
|
|
318
|
-
}, {
|
|
319
|
-
readonly background: "colors";
|
|
320
|
-
readonly backgroundColor: "colors";
|
|
321
|
-
readonly backgroundImage: "colors";
|
|
322
|
-
readonly blockSize: "sizes";
|
|
323
|
-
readonly border: "colors";
|
|
324
|
-
readonly borderBlock: "colors";
|
|
325
|
-
readonly borderBlockEnd: "colors";
|
|
326
|
-
readonly borderBlockStart: "colors";
|
|
327
|
-
readonly borderBottom: "colors";
|
|
328
|
-
readonly borderBottomColor: "colors";
|
|
329
|
-
readonly borderBottomLeftRadius: "radii";
|
|
330
|
-
readonly borderBottomRightRadius: "radii";
|
|
331
|
-
readonly borderBottomStyle: "border-styles";
|
|
332
|
-
readonly borderBottomWidth: "border-widths";
|
|
333
|
-
readonly borderColor: "colors";
|
|
334
|
-
readonly borderImage: "colors";
|
|
335
|
-
readonly borderInline: "colors";
|
|
336
|
-
readonly borderInlineEnd: "colors";
|
|
337
|
-
readonly borderInlineStart: "colors";
|
|
338
|
-
readonly borderLeft: "colors";
|
|
339
|
-
readonly borderLeftColor: "colors";
|
|
340
|
-
readonly borderLeftStyle: "border-styles";
|
|
341
|
-
readonly borderLeftWidth: "border-widths";
|
|
342
|
-
readonly borderRadius: "radii";
|
|
343
|
-
readonly borderRight: "colors";
|
|
344
|
-
readonly borderRightColor: "colors";
|
|
345
|
-
readonly borderRightStyle: "border-styles";
|
|
346
|
-
readonly borderRightWidth: "border-widths";
|
|
347
|
-
readonly borderSpacing: "space-offset";
|
|
348
|
-
readonly borderStyle: "border-styles";
|
|
349
|
-
readonly borderTop: "colors";
|
|
350
|
-
readonly borderTopColor: "colors";
|
|
351
|
-
readonly borderTopLeftRadius: "radii";
|
|
352
|
-
readonly borderTopRightRadius: "radii";
|
|
353
|
-
readonly borderTopStyle: "border-styles";
|
|
354
|
-
readonly borderTopWidth: "border-widths";
|
|
355
|
-
readonly borderWidth: "border-widths";
|
|
356
|
-
readonly bottom: "space";
|
|
357
|
-
readonly boxShadow: "shadows";
|
|
358
|
-
readonly caretColor: "colors";
|
|
359
|
-
readonly color: "colors";
|
|
360
|
-
readonly columnGap: "space-gap";
|
|
361
|
-
readonly columnRuleColor: "colors";
|
|
362
|
-
readonly fill: "colors";
|
|
363
|
-
readonly flexBasis: "sizes";
|
|
364
|
-
readonly fontFamily: "fonts";
|
|
365
|
-
readonly fontSize: "font-sizes";
|
|
366
|
-
readonly fontWeight: "font-weights";
|
|
367
|
-
readonly gap: "space-gap";
|
|
368
|
-
readonly gridColumnGap: "space-gap";
|
|
369
|
-
readonly gridGap: "space-gap";
|
|
370
|
-
readonly gridRowGap: "space-gap";
|
|
371
|
-
readonly gridTemplateColumns: "sizes";
|
|
372
|
-
readonly gridTemplateRows: "sizes";
|
|
373
|
-
readonly height: "sizes";
|
|
374
|
-
readonly inlineSize: "sizes";
|
|
375
|
-
readonly inset: "space-inset";
|
|
376
|
-
readonly insetBlock: "space-inset";
|
|
377
|
-
readonly insetBlockEnd: "space-inset";
|
|
378
|
-
readonly insetBlockStart: "space-inset";
|
|
379
|
-
readonly insetInline: "space-inset";
|
|
380
|
-
readonly insetInlineEnd: "space-inset";
|
|
381
|
-
readonly insetInlineStart: "space-inset";
|
|
382
|
-
readonly left: "space";
|
|
383
|
-
readonly letterSpacing: "letter-spacings";
|
|
384
|
-
readonly lineHeight: "line-heights";
|
|
385
|
-
readonly margin: "space-offset";
|
|
386
|
-
readonly marginBlock: "space-offset";
|
|
387
|
-
readonly marginBlockEnd: "space-offset";
|
|
388
|
-
readonly marginBlockStart: "space-offset";
|
|
389
|
-
readonly marginBottom: "space-offset";
|
|
390
|
-
readonly marginInline: "space-offset";
|
|
391
|
-
readonly marginInlineEnd: "space-offset";
|
|
392
|
-
readonly marginInlineStart: "space-offset";
|
|
393
|
-
readonly marginLeft: "space-offset";
|
|
394
|
-
readonly marginRight: "space-offset";
|
|
395
|
-
readonly marginTop: "space-offset";
|
|
396
|
-
readonly maxBlockSize: "sizes";
|
|
397
|
-
readonly maxHeight: "sizes";
|
|
398
|
-
readonly maxInlineSize: "sizes";
|
|
399
|
-
readonly maxWidth: "sizes";
|
|
400
|
-
readonly minBlockSize: "sizes";
|
|
401
|
-
readonly minHeight: "sizes";
|
|
402
|
-
readonly minInlineSize: "sizes";
|
|
403
|
-
readonly minWidth: "sizes";
|
|
404
|
-
readonly outline: "colors";
|
|
405
|
-
readonly outlineColor: "colors";
|
|
406
|
-
readonly padding: "space-inset";
|
|
407
|
-
readonly paddingBlock: "space-inset";
|
|
408
|
-
readonly paddingBlockEnd: "space-inset";
|
|
409
|
-
readonly paddingBlockStart: "space-inset";
|
|
410
|
-
readonly paddingBottom: "space-inset";
|
|
411
|
-
readonly paddingInline: "space-inset";
|
|
412
|
-
readonly paddingInlineEnd: "space-inset";
|
|
413
|
-
readonly paddingInlineStart: "space-inset";
|
|
414
|
-
readonly paddingLeft: "space-inset";
|
|
415
|
-
readonly paddingRight: "space-inset";
|
|
416
|
-
readonly paddingTop: "space-inset";
|
|
417
|
-
readonly right: "space";
|
|
418
|
-
readonly rowGap: "space-gap";
|
|
419
|
-
readonly scrollMargin: "space-offset";
|
|
420
|
-
readonly scrollMarginBlock: "space-offset";
|
|
421
|
-
readonly scrollMarginBlockEnd: "space-offset";
|
|
422
|
-
readonly scrollMarginBlockStart: "space-offset";
|
|
423
|
-
readonly scrollMarginBottom: "space-offset";
|
|
424
|
-
readonly scrollMarginInline: "space-offset";
|
|
425
|
-
readonly scrollMarginInlineEnd: "space-offset";
|
|
426
|
-
readonly scrollMarginInlineStart: "space-offset";
|
|
427
|
-
readonly scrollMarginLeft: "space-offset";
|
|
428
|
-
readonly scrollMarginRight: "space-offset";
|
|
429
|
-
readonly scrollMarginTop: "space-offset";
|
|
430
|
-
readonly scrollPadding: "space-inset";
|
|
431
|
-
readonly scrollPaddingBlock: "space-inset";
|
|
432
|
-
readonly scrollPaddingBlockEnd: "space-inset";
|
|
433
|
-
readonly scrollPaddingBlockStart: "space-inset";
|
|
434
|
-
readonly scrollPaddingBottom: "space-inset";
|
|
435
|
-
readonly scrollPaddingInline: "space-inset";
|
|
436
|
-
readonly scrollPaddingInlineEnd: "space-inset";
|
|
437
|
-
readonly scrollPaddingInlineStart: "space-inset";
|
|
438
|
-
readonly scrollPaddingLeft: "space-inset";
|
|
439
|
-
readonly scrollPaddingRight: "space-inset";
|
|
440
|
-
readonly scrollPaddingTop: "space-inset";
|
|
441
|
-
readonly stroke: "colors";
|
|
442
|
-
readonly strokeWidth: "stroke-width";
|
|
443
|
-
readonly textDecorationColor: "colors";
|
|
444
|
-
readonly textShadow: "shadows";
|
|
445
|
-
readonly top: "space";
|
|
446
|
-
readonly transition: "transitions";
|
|
447
|
-
readonly width: "sizes";
|
|
448
|
-
readonly zIndex: "z-indices";
|
|
449
|
-
}, {
|
|
450
|
-
paddingX: (value: {
|
|
451
|
-
readonly [$$PropertyValue]: "padding";
|
|
452
|
-
}) => {
|
|
453
|
-
paddingLeft: {
|
|
454
|
-
readonly [$$PropertyValue]: "padding";
|
|
455
|
-
};
|
|
456
|
-
paddingRight: {
|
|
457
|
-
readonly [$$PropertyValue]: "padding";
|
|
458
|
-
};
|
|
459
|
-
};
|
|
460
|
-
paddingY: (value: {
|
|
461
|
-
readonly [$$PropertyValue]: "padding";
|
|
462
|
-
}) => {
|
|
463
|
-
paddingTop: {
|
|
464
|
-
readonly [$$PropertyValue]: "padding";
|
|
465
|
-
};
|
|
466
|
-
paddingBottom: {
|
|
467
|
-
readonly [$$PropertyValue]: "padding";
|
|
468
|
-
};
|
|
469
|
-
};
|
|
470
|
-
marginX: (value: {
|
|
471
|
-
readonly [$$PropertyValue]: "margin";
|
|
472
|
-
}) => {
|
|
473
|
-
marginLeft: {
|
|
474
|
-
readonly [$$PropertyValue]: "margin";
|
|
475
|
-
};
|
|
476
|
-
marginRight: {
|
|
477
|
-
readonly [$$PropertyValue]: "margin";
|
|
478
|
-
};
|
|
479
|
-
};
|
|
480
|
-
marginY: (value: {
|
|
481
|
-
readonly [$$PropertyValue]: "margin";
|
|
482
|
-
}) => {
|
|
483
|
-
marginTop: {
|
|
484
|
-
readonly [$$PropertyValue]: "margin";
|
|
485
|
-
};
|
|
486
|
-
marginBottom: {
|
|
487
|
-
readonly [$$PropertyValue]: "margin";
|
|
488
|
-
};
|
|
489
|
-
};
|
|
490
|
-
square: (value: {
|
|
491
|
-
readonly [$$PropertyValue]: "width";
|
|
492
|
-
}) => {
|
|
493
|
-
width: {
|
|
494
|
-
readonly [$$PropertyValue]: "width";
|
|
495
|
-
};
|
|
496
|
-
height: {
|
|
497
|
-
readonly [$$PropertyValue]: "width";
|
|
498
|
-
};
|
|
499
|
-
};
|
|
500
|
-
_hover: (css: _stitches_react_types_css_util.CSSProperties) => {
|
|
501
|
-
'&:hover, &[data-hovered]': _stitches_react_types_css_util.CSSProperties;
|
|
502
|
-
};
|
|
503
|
-
}>>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLInputElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<packages_components_input_src_types.ClearableInputProps> & packages_components_input_src_input.Partials, {}, {}>;
|
|
504
|
-
declare type StyledTriggerProps = StrictComponentProps<typeof StyledTrigger>;
|
|
18
|
+
declare const StyledActionButton: react.ForwardRefExoticComponent<(Omit<Omit<Omit<Omit<Omit<Omit<Omit<Omit<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_components_primitive.PrimitiveProps<"button">>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLButtonElement> & _mirohq_design_system_hooks_use_press.PressProps & packages_components_internal_base_button_src_base_button.HoverEvents, "ref"> & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>, _mirohq_design_system_stitches.ForbiddenProps> & {
|
|
19
|
+
children?: react.ReactNode;
|
|
20
|
+
}, "readOnlyAppearance" | "disableAppearance"> & _stitches_react_types_styled_component.TransformProps<{
|
|
21
|
+
readOnlyAppearance?: boolean | "true" | undefined;
|
|
22
|
+
disableAppearance?: boolean | "true" | undefined;
|
|
23
|
+
}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement> & {
|
|
24
|
+
label: string;
|
|
25
|
+
}, "ref"> & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>, _mirohq_design_system_stitches.ForbiddenProps> & {
|
|
26
|
+
children?: react.ReactNode;
|
|
27
|
+
}, "size"> & _stitches_react_types_styled_component.TransformProps<{
|
|
28
|
+
size?: "large" | "x-large" | undefined;
|
|
29
|
+
}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> | Omit<Omit<Omit<Omit<Omit<Omit<Omit<Omit<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_components_primitive.PrimitiveProps<"button">>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLButtonElement> & _mirohq_design_system_hooks_use_press.PressProps & packages_components_internal_base_button_src_base_button.HoverEvents & react.AnchorHTMLAttributes<"a"> & {
|
|
30
|
+
href: string;
|
|
31
|
+
}, "ref"> & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>, _mirohq_design_system_stitches.ForbiddenProps> & {
|
|
32
|
+
children?: react.ReactNode;
|
|
33
|
+
}, "readOnlyAppearance" | "disableAppearance"> & _stitches_react_types_styled_component.TransformProps<{
|
|
34
|
+
readOnlyAppearance?: boolean | "true" | undefined;
|
|
35
|
+
disableAppearance?: boolean | "true" | undefined;
|
|
36
|
+
}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement> & {
|
|
37
|
+
label: string;
|
|
38
|
+
}, "ref"> & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>, _mirohq_design_system_stitches.ForbiddenProps> & {
|
|
39
|
+
children?: react.ReactNode;
|
|
40
|
+
}, "size"> & _stitches_react_types_styled_component.TransformProps<{
|
|
41
|
+
size?: "large" | "x-large" | undefined;
|
|
42
|
+
}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<(Omit<Omit<Omit<Omit<Omit<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_components_primitive.PrimitiveProps<"button">>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLButtonElement> & _mirohq_design_system_hooks_use_press.PressProps & packages_components_internal_base_button_src_base_button.HoverEvents, "ref"> & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>, _mirohq_design_system_stitches.ForbiddenProps> & {
|
|
43
|
+
children?: react.ReactNode;
|
|
44
|
+
}, "readOnlyAppearance" | "disableAppearance"> & _stitches_react_types_styled_component.TransformProps<{
|
|
45
|
+
readOnlyAppearance?: boolean | "true" | undefined;
|
|
46
|
+
disableAppearance?: boolean | "true" | undefined;
|
|
47
|
+
}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement> & {
|
|
48
|
+
label: string;
|
|
49
|
+
}, "ref"> | Omit<Omit<Omit<Omit<Omit<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_components_primitive.PrimitiveProps<"button">>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLButtonElement> & _mirohq_design_system_hooks_use_press.PressProps & packages_components_internal_base_button_src_base_button.HoverEvents & react.AnchorHTMLAttributes<"a"> & {
|
|
50
|
+
href: string;
|
|
51
|
+
}, "ref"> & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>, _mirohq_design_system_stitches.ForbiddenProps> & {
|
|
52
|
+
children?: react.ReactNode;
|
|
53
|
+
}, "readOnlyAppearance" | "disableAppearance"> & _stitches_react_types_styled_component.TransformProps<{
|
|
54
|
+
readOnlyAppearance?: boolean | "true" | undefined;
|
|
55
|
+
disableAppearance?: boolean | "true" | undefined;
|
|
56
|
+
}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement> & {
|
|
57
|
+
label: string;
|
|
58
|
+
}, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>, {
|
|
59
|
+
size?: "large" | "x-large" | undefined;
|
|
60
|
+
}, {}>;
|
|
61
|
+
declare type StyledActionButtonProps = StrictComponentProps<typeof StyledActionButton>;
|
|
505
62
|
|
|
506
|
-
|
|
63
|
+
declare type TriggerActionButtonProps = Omit<StyledActionButtonProps, 'label'> & {
|
|
64
|
+
/**
|
|
65
|
+
* The label text for Trigger's action button when Combobox is empty and closed. Will be rendered in a Tooltip.
|
|
66
|
+
*/
|
|
67
|
+
openActionLabel: string;
|
|
68
|
+
/**
|
|
69
|
+
* The label text for Trigger's action button when Combobox is empty and open. Will be rendered in a Tooltip.
|
|
70
|
+
*/
|
|
71
|
+
closeActionLabel: string;
|
|
72
|
+
/**
|
|
73
|
+
* The label text for Trigger's action button when Combobox has values selected. Will be rendered in a Tooltip.
|
|
74
|
+
*/
|
|
75
|
+
clearActionLabel: string;
|
|
76
|
+
};
|
|
77
|
+
|
|
78
|
+
declare type TriggerProps = InputProps & Pick<TriggerActionButtonProps, 'openActionLabel' | 'closeActionLabel' | 'clearActionLabel'> & {
|
|
507
79
|
/**
|
|
508
80
|
* The content.
|
|
509
81
|
*/
|
|
@@ -512,1003 +84,167 @@ interface TriggerProps extends StyledTriggerProps, HoverEvents {
|
|
|
512
84
|
* The size of the trigger.
|
|
513
85
|
* @default 'large'
|
|
514
86
|
*/
|
|
515
|
-
size?:
|
|
87
|
+
size?: InputProps['size'];
|
|
516
88
|
/**
|
|
517
89
|
* The content that will be rendered inside the Combobox.Trigger when no value or
|
|
518
90
|
* defaultValue is set.
|
|
519
91
|
*/
|
|
520
92
|
placeholder?: string;
|
|
521
|
-
}
|
|
522
|
-
declare const Trigger: react__default.ForwardRefExoticComponent<Omit<
|
|
93
|
+
};
|
|
94
|
+
declare const Trigger: react__default.ForwardRefExoticComponent<(Omit<packages_components_input_src_types.InputSharedProps & packages_components_input_src_types.ClearProps & Pick<TriggerActionButtonProps, "openActionLabel" | "closeActionLabel" | "clearActionLabel"> & {
|
|
95
|
+
/**
|
|
96
|
+
* The content.
|
|
97
|
+
*/
|
|
98
|
+
children?: react__default.ReactNode;
|
|
99
|
+
/**
|
|
100
|
+
* The size of the trigger.
|
|
101
|
+
* @default 'large'
|
|
102
|
+
*/
|
|
103
|
+
size?: InputProps['size'];
|
|
104
|
+
/**
|
|
105
|
+
* The content that will be rendered inside the Combobox.Trigger when no value or
|
|
106
|
+
* defaultValue is set.
|
|
107
|
+
*/
|
|
108
|
+
placeholder?: string | undefined;
|
|
109
|
+
}, "ref"> | Omit<packages_components_input_src_types.InputSharedProps & {
|
|
110
|
+
clearable?: undefined;
|
|
111
|
+
} & Pick<TriggerActionButtonProps, "openActionLabel" | "closeActionLabel" | "clearActionLabel"> & {
|
|
112
|
+
/**
|
|
113
|
+
* The content.
|
|
114
|
+
*/
|
|
115
|
+
children?: react__default.ReactNode;
|
|
116
|
+
/**
|
|
117
|
+
* The size of the trigger.
|
|
118
|
+
* @default 'large'
|
|
119
|
+
*/
|
|
120
|
+
size?: InputProps['size'];
|
|
121
|
+
/**
|
|
122
|
+
* The content that will be rendered inside the Combobox.Trigger when no value or
|
|
123
|
+
* defaultValue is set.
|
|
124
|
+
*/
|
|
125
|
+
placeholder?: string | undefined;
|
|
126
|
+
}, "ref">) & react__default.RefAttributes<HTMLInputElement>>;
|
|
523
127
|
|
|
524
|
-
declare const StyledContent: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<
|
|
525
|
-
'border-widths': {
|
|
526
|
-
readonly none: 0;
|
|
527
|
-
readonly sm: "1px";
|
|
528
|
-
readonly md: "2px";
|
|
529
|
-
readonly lg: "4px";
|
|
530
|
-
};
|
|
531
|
-
colors: {
|
|
532
|
-
readonly black: any;
|
|
533
|
-
readonly 'blue-100': any;
|
|
534
|
-
readonly 'blue-200': any;
|
|
535
|
-
readonly 'blue-300': any;
|
|
536
|
-
readonly 'blue-400': any;
|
|
537
|
-
readonly 'blue-500': any;
|
|
538
|
-
readonly 'blue-600': any;
|
|
539
|
-
readonly 'blue-700': any;
|
|
540
|
-
readonly 'blue-800': any;
|
|
541
|
-
readonly 'blue-900': any;
|
|
542
|
-
readonly 'blue-1000': any;
|
|
543
|
-
readonly 'gray-100': any;
|
|
544
|
-
readonly 'gray-200': any;
|
|
545
|
-
readonly 'gray-300': any;
|
|
546
|
-
readonly 'gray-400': any;
|
|
547
|
-
readonly 'gray-500': any;
|
|
548
|
-
readonly 'gray-600': any;
|
|
549
|
-
readonly 'gray-700': any;
|
|
550
|
-
readonly 'gray-800': any;
|
|
551
|
-
readonly 'gray-900': any;
|
|
552
|
-
readonly 'green-100': any;
|
|
553
|
-
readonly 'green-200': any;
|
|
554
|
-
readonly 'green-300': any;
|
|
555
|
-
readonly 'green-400': any;
|
|
556
|
-
readonly 'green-500': any;
|
|
557
|
-
readonly 'green-600': any;
|
|
558
|
-
readonly 'green-700': any;
|
|
559
|
-
readonly 'green-800': any;
|
|
560
|
-
readonly 'green-900': any;
|
|
561
|
-
readonly 'indigo-100': any;
|
|
562
|
-
readonly 'indigo-200': any;
|
|
563
|
-
readonly 'indigo-300': any;
|
|
564
|
-
readonly 'indigo-400': any;
|
|
565
|
-
readonly 'indigo-500': any;
|
|
566
|
-
readonly 'indigo-600': any;
|
|
567
|
-
readonly 'indigo-700': any;
|
|
568
|
-
readonly 'indigo-800': any;
|
|
569
|
-
readonly 'indigo-900': any;
|
|
570
|
-
readonly 'red-100': any;
|
|
571
|
-
readonly 'red-200': any;
|
|
572
|
-
readonly 'red-300': any;
|
|
573
|
-
readonly 'red-400': any;
|
|
574
|
-
readonly 'red-500': any;
|
|
575
|
-
readonly 'red-600': any;
|
|
576
|
-
readonly 'red-700': any;
|
|
577
|
-
readonly 'red-800': any;
|
|
578
|
-
readonly 'red-900': any;
|
|
579
|
-
readonly transparent: any;
|
|
580
|
-
readonly white: any;
|
|
581
|
-
readonly 'yellow-100': any;
|
|
582
|
-
readonly 'yellow-200': any;
|
|
583
|
-
readonly 'yellow-300': any;
|
|
584
|
-
readonly 'yellow-400': any;
|
|
585
|
-
readonly 'yellow-500': any;
|
|
586
|
-
readonly 'yellow-600': any;
|
|
587
|
-
readonly 'yellow-700': any;
|
|
588
|
-
readonly 'yellow-800': any;
|
|
589
|
-
readonly 'yellow-900': any;
|
|
590
|
-
"background-alpha-active"?: any;
|
|
591
|
-
"background-alpha-hover"?: any;
|
|
592
|
-
"background-danger-prominent"?: any;
|
|
593
|
-
"background-danger-prominent-active"?: any;
|
|
594
|
-
"background-danger-prominent-hover"?: any;
|
|
595
|
-
"background-danger-subtle"?: any;
|
|
596
|
-
"background-danger-subtle-active"?: any;
|
|
597
|
-
"background-danger-subtle-hover"?: any;
|
|
598
|
-
"background-neutrals"?: any;
|
|
599
|
-
"background-neutrals-active"?: any;
|
|
600
|
-
"background-neutrals-container"?: any;
|
|
601
|
-
"background-neutrals-controls-disabled"?: any;
|
|
602
|
-
"background-neutrals-disabled"?: any;
|
|
603
|
-
"background-neutrals-hover"?: any;
|
|
604
|
-
"background-neutrals-inactive"?: any;
|
|
605
|
-
"background-neutrals-inactive-hover"?: any;
|
|
606
|
-
"background-neutrals-inverted"?: any;
|
|
607
|
-
"background-neutrals-inverted-subtle"?: any;
|
|
608
|
-
"background-neutrals-page"?: any;
|
|
609
|
-
"background-neutrals-page-subtle"?: any;
|
|
610
|
-
"background-neutrals-scrolls"?: any;
|
|
611
|
-
"background-neutrals-scrolls-expanded"?: any;
|
|
612
|
-
"background-neutrals-scrolls-hover"?: any;
|
|
613
|
-
"background-neutrals-scrolls-pressed"?: any;
|
|
614
|
-
"background-neutrals-scrolls-pressed-hover"?: any;
|
|
615
|
-
"background-neutrals-subtle"?: any;
|
|
616
|
-
"background-neutrals-subtle-active"?: any;
|
|
617
|
-
"background-neutrals-subtle-hover"?: any;
|
|
618
|
-
"background-primary-prominent"?: any;
|
|
619
|
-
"background-primary-prominent-active"?: any;
|
|
620
|
-
"background-primary-prominent-expanded"?: any;
|
|
621
|
-
"background-primary-prominent-hover"?: any;
|
|
622
|
-
"background-primary-prominent-pressed"?: any;
|
|
623
|
-
"background-primary-prominent-pressed-hover"?: any;
|
|
624
|
-
"background-primary-prominent-selected"?: any;
|
|
625
|
-
"background-primary-subtle"?: any;
|
|
626
|
-
"background-primary-subtle-active"?: any;
|
|
627
|
-
"background-primary-subtle-expanded"?: any;
|
|
628
|
-
"background-primary-subtle-hover"?: any;
|
|
629
|
-
"background-primary-subtle-pressed"?: any;
|
|
630
|
-
"background-primary-subtle-pressed-hover"?: any;
|
|
631
|
-
"background-primary-subtle-selected"?: any;
|
|
632
|
-
"background-success"?: any;
|
|
633
|
-
"background-success-prominent"?: any;
|
|
634
|
-
"background-success-prominent-active"?: any;
|
|
635
|
-
"background-success-prominent-hover"?: any;
|
|
636
|
-
"background-warning-prominent"?: any;
|
|
637
|
-
"background-warning-subtle"?: any;
|
|
638
|
-
"border-danger"?: any;
|
|
639
|
-
"border-danger-active"?: any;
|
|
640
|
-
"border-danger-hover"?: any;
|
|
641
|
-
"border-focus-inner"?: any;
|
|
642
|
-
"border-focus-middle"?: any;
|
|
643
|
-
"border-focus-outer"?: any;
|
|
644
|
-
"border-neutrals"?: any;
|
|
645
|
-
"border-neutrals-active"?: any;
|
|
646
|
-
"border-neutrals-controls"?: any;
|
|
647
|
-
"border-neutrals-controls-disabled"?: any;
|
|
648
|
-
"border-neutrals-disabled"?: any;
|
|
649
|
-
"border-neutrals-hover"?: any;
|
|
650
|
-
"border-neutrals-inverted"?: any;
|
|
651
|
-
"border-neutrals-subtle"?: any;
|
|
652
|
-
"border-neutrals-text"?: any;
|
|
653
|
-
"border-neutrals-text-active"?: any;
|
|
654
|
-
"border-neutrals-text-hover"?: any;
|
|
655
|
-
"border-neutrals-text-subtle"?: any;
|
|
656
|
-
"border-neutrals-text-subtle-active"?: any;
|
|
657
|
-
"border-neutrals-text-subtle-hover"?: any;
|
|
658
|
-
"border-neutrals-transparent"?: any;
|
|
659
|
-
"border-primary"?: any;
|
|
660
|
-
"border-primary-active"?: any;
|
|
661
|
-
"border-primary-hover"?: any;
|
|
662
|
-
"border-primary-inverted"?: any;
|
|
663
|
-
"border-success"?: any;
|
|
664
|
-
"border-success-active"?: any;
|
|
665
|
-
"border-success-hover"?: any;
|
|
666
|
-
"border-warning"?: any;
|
|
667
|
-
"icon-danger"?: any;
|
|
668
|
-
"icon-danger-active"?: any;
|
|
669
|
-
"icon-danger-hover"?: any;
|
|
670
|
-
"icon-danger-inverted"?: any;
|
|
671
|
-
"icon-neutrals"?: any;
|
|
672
|
-
"icon-neutrals-disabled"?: any;
|
|
673
|
-
"icon-neutrals-inactive"?: any;
|
|
674
|
-
"icon-neutrals-inactive-hover"?: any;
|
|
675
|
-
"icon-neutrals-inverted"?: any;
|
|
676
|
-
"icon-neutrals-search"?: any;
|
|
677
|
-
"icon-neutrals-subtle"?: any;
|
|
678
|
-
"icon-neutrals-text"?: any;
|
|
679
|
-
"icon-primary"?: any;
|
|
680
|
-
"icon-primary-active"?: any;
|
|
681
|
-
"icon-primary-hover"?: any;
|
|
682
|
-
"icon-primary-inverted"?: any;
|
|
683
|
-
"icon-primary-selected"?: any;
|
|
684
|
-
"icon-success"?: any;
|
|
685
|
-
"icon-success-active"?: any;
|
|
686
|
-
"icon-success-hover"?: any;
|
|
687
|
-
"icon-success-inverted"?: any;
|
|
688
|
-
"icon-warning"?: any;
|
|
689
|
-
"icon-warning-prominent"?: any;
|
|
690
|
-
"icon-warning-subtle"?: any;
|
|
691
|
-
"text-danger"?: any;
|
|
692
|
-
"text-danger-active"?: any;
|
|
693
|
-
"text-danger-hover"?: any;
|
|
694
|
-
"text-danger-inverted"?: any;
|
|
695
|
-
"text-neutrals"?: any;
|
|
696
|
-
"text-neutrals-active"?: any;
|
|
697
|
-
"text-neutrals-disabled"?: any;
|
|
698
|
-
"text-neutrals-hover"?: any;
|
|
699
|
-
"text-neutrals-inverted"?: any;
|
|
700
|
-
"text-neutrals-placeholder"?: any;
|
|
701
|
-
"text-neutrals-placeholder-only"?: any;
|
|
702
|
-
"text-neutrals-subtle"?: any;
|
|
703
|
-
"text-neutrals-subtle-active"?: any;
|
|
704
|
-
"text-neutrals-subtle-hover"?: any;
|
|
705
|
-
"text-primary"?: any;
|
|
706
|
-
"text-primary-active"?: any;
|
|
707
|
-
"text-primary-hover"?: any;
|
|
708
|
-
"text-primary-inverted"?: any;
|
|
709
|
-
"text-primary-inverted-subtle"?: any;
|
|
710
|
-
"text-primary-selected"?: any;
|
|
711
|
-
"text-success"?: any;
|
|
712
|
-
"text-success-active"?: any;
|
|
713
|
-
"text-success-hover"?: any;
|
|
714
|
-
"text-success-inverted"?: any;
|
|
715
|
-
"text-warning"?: any;
|
|
716
|
-
"text-warning-subtle"?: any;
|
|
717
|
-
};
|
|
718
|
-
'font-sizes': {
|
|
719
|
-
readonly 150: "0.75rem";
|
|
720
|
-
readonly 175: "0.875rem";
|
|
721
|
-
readonly 200: "1rem";
|
|
722
|
-
readonly 225: "1.125rem";
|
|
723
|
-
readonly 250: "1.25rem";
|
|
724
|
-
readonly 300: "1.5rem";
|
|
725
|
-
readonly 400: "2rem";
|
|
726
|
-
readonly 500: "2.5rem";
|
|
727
|
-
readonly 600: "3rem";
|
|
728
|
-
readonly 800: "4rem";
|
|
729
|
-
readonly 900: "4.5rem";
|
|
730
|
-
};
|
|
731
|
-
fonts: {
|
|
732
|
-
readonly heading: "Roobert, sans-serif";
|
|
733
|
-
readonly body: "Open Sans, sans-serif";
|
|
734
|
-
};
|
|
735
|
-
radii: {
|
|
736
|
-
readonly none: 0;
|
|
737
|
-
readonly half: "999em";
|
|
738
|
-
readonly 25: "2px";
|
|
739
|
-
readonly 50: "4px";
|
|
740
|
-
readonly 75: "6px";
|
|
741
|
-
readonly 100: "8px";
|
|
742
|
-
readonly 200: "16px";
|
|
743
|
-
};
|
|
744
|
-
shadows: {
|
|
745
|
-
readonly 'focus-small': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-inner";
|
|
746
|
-
readonly 'focus-small-outline': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 1px $colors$border-focus-middle, inset 0 0 0 2px $colors$border-focus-inner";
|
|
747
|
-
readonly 'focus-large': "0 0 0 4px $colors$border-focus-inner, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-outer";
|
|
748
|
-
readonly 'focus-controls': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-focus-middle, 0 0 0 5px $colors$border-focus-outer";
|
|
749
|
-
readonly 'focus-controls-error': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-danger, 0 0 0 5px $colors$background-danger-subtle-hover";
|
|
750
|
-
readonly 'focus-controls-success': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$background-success-prominent, 0 0 0 5px $colors$background-success";
|
|
751
|
-
};
|
|
752
|
-
sizes: {
|
|
753
|
-
readonly number: string;
|
|
754
|
-
readonly 'icon-200': "16px";
|
|
755
|
-
readonly 'icon-300': "24px";
|
|
756
|
-
readonly 'icon-400': "32px";
|
|
757
|
-
};
|
|
758
|
-
space: {
|
|
759
|
-
readonly 0: "0px";
|
|
760
|
-
readonly 25: "2px";
|
|
761
|
-
readonly 50: "4px";
|
|
762
|
-
readonly 100: "8px";
|
|
763
|
-
readonly 150: "12px";
|
|
764
|
-
readonly 200: "16px";
|
|
765
|
-
readonly 300: "24px";
|
|
766
|
-
readonly 400: "32px";
|
|
767
|
-
readonly 500: "40px";
|
|
768
|
-
readonly 600: "48px";
|
|
769
|
-
readonly 700: "56px";
|
|
770
|
-
readonly 800: "64px";
|
|
771
|
-
readonly 1200: "96px";
|
|
772
|
-
readonly 1600: "128px";
|
|
773
|
-
};
|
|
774
|
-
'space-gap': {
|
|
775
|
-
readonly 0: any;
|
|
776
|
-
readonly 50: any;
|
|
777
|
-
readonly 100: any;
|
|
778
|
-
readonly 200: any;
|
|
779
|
-
readonly 300: any;
|
|
780
|
-
};
|
|
781
|
-
'space-inset': {
|
|
782
|
-
readonly 0: any;
|
|
783
|
-
readonly 50: any;
|
|
784
|
-
readonly 100: any;
|
|
785
|
-
readonly 150: any;
|
|
786
|
-
readonly 200: any;
|
|
787
|
-
readonly 300: any;
|
|
788
|
-
readonly 400: any;
|
|
789
|
-
readonly 500: any;
|
|
790
|
-
readonly 600: any;
|
|
791
|
-
readonly 700: any;
|
|
792
|
-
readonly 800: any;
|
|
793
|
-
readonly 1200: any;
|
|
794
|
-
readonly 1600: any;
|
|
795
|
-
};
|
|
796
|
-
'space-offset': {
|
|
797
|
-
readonly 0: any;
|
|
798
|
-
readonly 50: any;
|
|
799
|
-
readonly 100: any;
|
|
800
|
-
readonly 150: any;
|
|
801
|
-
readonly 200: any;
|
|
802
|
-
readonly 300: any;
|
|
803
|
-
readonly 400: any;
|
|
804
|
-
readonly 600: any;
|
|
805
|
-
readonly 800: any;
|
|
806
|
-
readonly 1200: any;
|
|
807
|
-
readonly 1600: any;
|
|
808
|
-
readonly 'stacking-0': any;
|
|
809
|
-
readonly 'stacking-100': any;
|
|
810
|
-
readonly 'stacking-200': any;
|
|
811
|
-
readonly 'stacking-300': any;
|
|
812
|
-
readonly 'stacking-400': any;
|
|
813
|
-
readonly 'stacking-500': any;
|
|
814
|
-
readonly 'stacking-800': any;
|
|
815
|
-
};
|
|
816
|
-
'stroke-width': {
|
|
817
|
-
readonly thin: "1.5px";
|
|
818
|
-
readonly normal: "2px";
|
|
819
|
-
readonly bold: "4px";
|
|
820
|
-
};
|
|
821
|
-
'z-indices': {
|
|
822
|
-
readonly dropdownMenu: 100;
|
|
823
|
-
readonly select: 200;
|
|
824
|
-
readonly popover: 300;
|
|
825
|
-
readonly tooltip: 400;
|
|
826
|
-
};
|
|
827
|
-
}, {
|
|
828
|
-
readonly background: "colors";
|
|
829
|
-
readonly backgroundColor: "colors";
|
|
830
|
-
readonly backgroundImage: "colors";
|
|
831
|
-
readonly blockSize: "sizes";
|
|
832
|
-
readonly border: "colors";
|
|
833
|
-
readonly borderBlock: "colors";
|
|
834
|
-
readonly borderBlockEnd: "colors";
|
|
835
|
-
readonly borderBlockStart: "colors";
|
|
836
|
-
readonly borderBottom: "colors";
|
|
837
|
-
readonly borderBottomColor: "colors";
|
|
838
|
-
readonly borderBottomLeftRadius: "radii";
|
|
839
|
-
readonly borderBottomRightRadius: "radii";
|
|
840
|
-
readonly borderBottomStyle: "border-styles";
|
|
841
|
-
readonly borderBottomWidth: "border-widths";
|
|
842
|
-
readonly borderColor: "colors";
|
|
843
|
-
readonly borderImage: "colors";
|
|
844
|
-
readonly borderInline: "colors";
|
|
845
|
-
readonly borderInlineEnd: "colors";
|
|
846
|
-
readonly borderInlineStart: "colors";
|
|
847
|
-
readonly borderLeft: "colors";
|
|
848
|
-
readonly borderLeftColor: "colors";
|
|
849
|
-
readonly borderLeftStyle: "border-styles";
|
|
850
|
-
readonly borderLeftWidth: "border-widths";
|
|
851
|
-
readonly borderRadius: "radii";
|
|
852
|
-
readonly borderRight: "colors";
|
|
853
|
-
readonly borderRightColor: "colors";
|
|
854
|
-
readonly borderRightStyle: "border-styles";
|
|
855
|
-
readonly borderRightWidth: "border-widths";
|
|
856
|
-
readonly borderSpacing: "space-offset";
|
|
857
|
-
readonly borderStyle: "border-styles";
|
|
858
|
-
readonly borderTop: "colors";
|
|
859
|
-
readonly borderTopColor: "colors";
|
|
860
|
-
readonly borderTopLeftRadius: "radii";
|
|
861
|
-
readonly borderTopRightRadius: "radii";
|
|
862
|
-
readonly borderTopStyle: "border-styles";
|
|
863
|
-
readonly borderTopWidth: "border-widths";
|
|
864
|
-
readonly borderWidth: "border-widths";
|
|
865
|
-
readonly bottom: "space";
|
|
866
|
-
readonly boxShadow: "shadows";
|
|
867
|
-
readonly caretColor: "colors";
|
|
868
|
-
readonly color: "colors";
|
|
869
|
-
readonly columnGap: "space-gap";
|
|
870
|
-
readonly columnRuleColor: "colors";
|
|
871
|
-
readonly fill: "colors";
|
|
872
|
-
readonly flexBasis: "sizes";
|
|
873
|
-
readonly fontFamily: "fonts";
|
|
874
|
-
readonly fontSize: "font-sizes";
|
|
875
|
-
readonly fontWeight: "font-weights";
|
|
876
|
-
readonly gap: "space-gap";
|
|
877
|
-
readonly gridColumnGap: "space-gap";
|
|
878
|
-
readonly gridGap: "space-gap";
|
|
879
|
-
readonly gridRowGap: "space-gap";
|
|
880
|
-
readonly gridTemplateColumns: "sizes";
|
|
881
|
-
readonly gridTemplateRows: "sizes";
|
|
882
|
-
readonly height: "sizes";
|
|
883
|
-
readonly inlineSize: "sizes";
|
|
884
|
-
readonly inset: "space-inset";
|
|
885
|
-
readonly insetBlock: "space-inset";
|
|
886
|
-
readonly insetBlockEnd: "space-inset";
|
|
887
|
-
readonly insetBlockStart: "space-inset";
|
|
888
|
-
readonly insetInline: "space-inset";
|
|
889
|
-
readonly insetInlineEnd: "space-inset";
|
|
890
|
-
readonly insetInlineStart: "space-inset";
|
|
891
|
-
readonly left: "space";
|
|
892
|
-
readonly letterSpacing: "letter-spacings";
|
|
893
|
-
readonly lineHeight: "line-heights";
|
|
894
|
-
readonly margin: "space-offset";
|
|
895
|
-
readonly marginBlock: "space-offset";
|
|
896
|
-
readonly marginBlockEnd: "space-offset";
|
|
897
|
-
readonly marginBlockStart: "space-offset";
|
|
898
|
-
readonly marginBottom: "space-offset";
|
|
899
|
-
readonly marginInline: "space-offset";
|
|
900
|
-
readonly marginInlineEnd: "space-offset";
|
|
901
|
-
readonly marginInlineStart: "space-offset";
|
|
902
|
-
readonly marginLeft: "space-offset";
|
|
903
|
-
readonly marginRight: "space-offset";
|
|
904
|
-
readonly marginTop: "space-offset";
|
|
905
|
-
readonly maxBlockSize: "sizes";
|
|
906
|
-
readonly maxHeight: "sizes";
|
|
907
|
-
readonly maxInlineSize: "sizes";
|
|
908
|
-
readonly maxWidth: "sizes";
|
|
909
|
-
readonly minBlockSize: "sizes";
|
|
910
|
-
readonly minHeight: "sizes";
|
|
911
|
-
readonly minInlineSize: "sizes";
|
|
912
|
-
readonly minWidth: "sizes";
|
|
913
|
-
readonly outline: "colors";
|
|
914
|
-
readonly outlineColor: "colors";
|
|
915
|
-
readonly padding: "space-inset";
|
|
916
|
-
readonly paddingBlock: "space-inset";
|
|
917
|
-
readonly paddingBlockEnd: "space-inset";
|
|
918
|
-
readonly paddingBlockStart: "space-inset";
|
|
919
|
-
readonly paddingBottom: "space-inset";
|
|
920
|
-
readonly paddingInline: "space-inset";
|
|
921
|
-
readonly paddingInlineEnd: "space-inset";
|
|
922
|
-
readonly paddingInlineStart: "space-inset";
|
|
923
|
-
readonly paddingLeft: "space-inset";
|
|
924
|
-
readonly paddingRight: "space-inset";
|
|
925
|
-
readonly paddingTop: "space-inset";
|
|
926
|
-
readonly right: "space";
|
|
927
|
-
readonly rowGap: "space-gap";
|
|
928
|
-
readonly scrollMargin: "space-offset";
|
|
929
|
-
readonly scrollMarginBlock: "space-offset";
|
|
930
|
-
readonly scrollMarginBlockEnd: "space-offset";
|
|
931
|
-
readonly scrollMarginBlockStart: "space-offset";
|
|
932
|
-
readonly scrollMarginBottom: "space-offset";
|
|
933
|
-
readonly scrollMarginInline: "space-offset";
|
|
934
|
-
readonly scrollMarginInlineEnd: "space-offset";
|
|
935
|
-
readonly scrollMarginInlineStart: "space-offset";
|
|
936
|
-
readonly scrollMarginLeft: "space-offset";
|
|
937
|
-
readonly scrollMarginRight: "space-offset";
|
|
938
|
-
readonly scrollMarginTop: "space-offset";
|
|
939
|
-
readonly scrollPadding: "space-inset";
|
|
940
|
-
readonly scrollPaddingBlock: "space-inset";
|
|
941
|
-
readonly scrollPaddingBlockEnd: "space-inset";
|
|
942
|
-
readonly scrollPaddingBlockStart: "space-inset";
|
|
943
|
-
readonly scrollPaddingBottom: "space-inset";
|
|
944
|
-
readonly scrollPaddingInline: "space-inset";
|
|
945
|
-
readonly scrollPaddingInlineEnd: "space-inset";
|
|
946
|
-
readonly scrollPaddingInlineStart: "space-inset";
|
|
947
|
-
readonly scrollPaddingLeft: "space-inset";
|
|
948
|
-
readonly scrollPaddingRight: "space-inset";
|
|
949
|
-
readonly scrollPaddingTop: "space-inset";
|
|
950
|
-
readonly stroke: "colors";
|
|
951
|
-
readonly strokeWidth: "stroke-width";
|
|
952
|
-
readonly textDecorationColor: "colors";
|
|
953
|
-
readonly textShadow: "shadows";
|
|
954
|
-
readonly top: "space";
|
|
955
|
-
readonly transition: "transitions";
|
|
956
|
-
readonly width: "sizes";
|
|
957
|
-
readonly zIndex: "z-indices";
|
|
958
|
-
}, {
|
|
959
|
-
paddingX: (value: {
|
|
960
|
-
readonly [$$PropertyValue]: "padding";
|
|
961
|
-
}) => {
|
|
962
|
-
paddingLeft: {
|
|
963
|
-
readonly [$$PropertyValue]: "padding";
|
|
964
|
-
};
|
|
965
|
-
paddingRight: {
|
|
966
|
-
readonly [$$PropertyValue]: "padding";
|
|
967
|
-
};
|
|
968
|
-
};
|
|
969
|
-
paddingY: (value: {
|
|
970
|
-
readonly [$$PropertyValue]: "padding";
|
|
971
|
-
}) => {
|
|
972
|
-
paddingTop: {
|
|
973
|
-
readonly [$$PropertyValue]: "padding";
|
|
974
|
-
};
|
|
975
|
-
paddingBottom: {
|
|
976
|
-
readonly [$$PropertyValue]: "padding";
|
|
977
|
-
};
|
|
978
|
-
};
|
|
979
|
-
marginX: (value: {
|
|
980
|
-
readonly [$$PropertyValue]: "margin";
|
|
981
|
-
}) => {
|
|
982
|
-
marginLeft: {
|
|
983
|
-
readonly [$$PropertyValue]: "margin";
|
|
984
|
-
};
|
|
985
|
-
marginRight: {
|
|
986
|
-
readonly [$$PropertyValue]: "margin";
|
|
987
|
-
};
|
|
988
|
-
};
|
|
989
|
-
marginY: (value: {
|
|
990
|
-
readonly [$$PropertyValue]: "margin";
|
|
991
|
-
}) => {
|
|
992
|
-
marginTop: {
|
|
993
|
-
readonly [$$PropertyValue]: "margin";
|
|
994
|
-
};
|
|
995
|
-
marginBottom: {
|
|
996
|
-
readonly [$$PropertyValue]: "margin";
|
|
997
|
-
};
|
|
998
|
-
};
|
|
999
|
-
square: (value: {
|
|
1000
|
-
readonly [$$PropertyValue]: "width";
|
|
1001
|
-
}) => {
|
|
1002
|
-
width: {
|
|
1003
|
-
readonly [$$PropertyValue]: "width";
|
|
1004
|
-
};
|
|
1005
|
-
height: {
|
|
1006
|
-
readonly [$$PropertyValue]: "width";
|
|
1007
|
-
};
|
|
1008
|
-
};
|
|
1009
|
-
_hover: (css: _stitches_react_types_css_util.CSSProperties) => {
|
|
1010
|
-
'&:hover, &[data-hovered]': _stitches_react_types_css_util.CSSProperties;
|
|
1011
|
-
};
|
|
1012
|
-
}>>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {}, {}>;
|
|
128
|
+
declare const StyledContent: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<RadixPopover.PopoverContentProps & react.RefAttributes<HTMLDivElement>>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<RadixPopover.PopoverContentProps & react.RefAttributes<HTMLDivElement>>, {}, {}>;
|
|
1013
129
|
declare type StyledContentProps = StrictComponentProps<typeof StyledContent>;
|
|
1014
130
|
|
|
131
|
+
declare type PointerDownOutsideEvent = CustomEvent<{
|
|
132
|
+
originalEvent: PointerEvent;
|
|
133
|
+
}>;
|
|
134
|
+
declare type Side = 'top' | 'right' | 'bottom' | 'left';
|
|
135
|
+
declare type Align = 'start' | 'center' | 'end';
|
|
136
|
+
declare type Direction = 'ltr' | 'rtl';
|
|
137
|
+
declare type Overflow = 'auto' | 'visible';
|
|
138
|
+
declare type Sticky = 'partial' | 'always';
|
|
139
|
+
|
|
140
|
+
type types_PointerDownOutsideEvent = PointerDownOutsideEvent;
|
|
141
|
+
type types_Side = Side;
|
|
142
|
+
type types_Align = Align;
|
|
143
|
+
type types_Direction = Direction;
|
|
144
|
+
type types_Overflow = Overflow;
|
|
145
|
+
type types_Sticky = Sticky;
|
|
146
|
+
declare namespace types {
|
|
147
|
+
export {
|
|
148
|
+
types_PointerDownOutsideEvent as PointerDownOutsideEvent,
|
|
149
|
+
types_Side as Side,
|
|
150
|
+
types_Align as Align,
|
|
151
|
+
types_Direction as Direction,
|
|
152
|
+
types_Overflow as Overflow,
|
|
153
|
+
types_Sticky as Sticky,
|
|
154
|
+
};
|
|
155
|
+
}
|
|
156
|
+
|
|
1015
157
|
interface ContentProps extends StyledContentProps {
|
|
1016
158
|
/**
|
|
1017
159
|
* Combobox's content.
|
|
1018
160
|
*/
|
|
1019
161
|
children?: ReactNode;
|
|
162
|
+
/**
|
|
163
|
+
* Event handler called when focus moves to the trigger after closing. It can
|
|
164
|
+
* be prevented by calling event.preventDefault.
|
|
165
|
+
*/
|
|
166
|
+
onCloseAutoFocus?: (event: Event) => void;
|
|
167
|
+
/**
|
|
168
|
+
* Event handler called when focus moves to the trigger after closing. It can
|
|
169
|
+
* be prevented by calling event.preventDefault.
|
|
170
|
+
*/
|
|
171
|
+
onEscapeKeyDown?: (event: KeyboardEvent) => void;
|
|
172
|
+
/**
|
|
173
|
+
* Event handler called when a pointer event occurs outside the bounds of the
|
|
174
|
+
* component. It can be prevented by calling event.preventDefault.
|
|
175
|
+
*/
|
|
176
|
+
onPointerDownOutside?: (event: PointerDownOutsideEvent) => void;
|
|
177
|
+
/**
|
|
178
|
+
* The preferred side of the anchor to render against when open. Will be
|
|
179
|
+
* reversed when collisions occur and avoidCollisions is enabled.
|
|
180
|
+
* @default 'bottom'
|
|
181
|
+
*/
|
|
182
|
+
side?: Side;
|
|
183
|
+
/**
|
|
184
|
+
* The distance in pixels from the anchor.
|
|
185
|
+
* @default CONTENT_OFFSET
|
|
186
|
+
*/
|
|
187
|
+
sideOffset?: number;
|
|
188
|
+
/**
|
|
189
|
+
* The preferred alignment against the anchor. May change when collisions
|
|
190
|
+
* occur.
|
|
191
|
+
* @default 'center'
|
|
192
|
+
*/
|
|
193
|
+
align?: Align;
|
|
194
|
+
/**
|
|
195
|
+
* An offset in pixels from the "start" or "end" alignment options.
|
|
196
|
+
* @default 0
|
|
197
|
+
*/
|
|
198
|
+
alignOffset?: number;
|
|
199
|
+
/**
|
|
200
|
+
* When true, overrides the side and align preferences to prevent collisions
|
|
201
|
+
* with boundary edges.
|
|
202
|
+
* @default true
|
|
203
|
+
*/
|
|
204
|
+
avoidCollisions?: boolean;
|
|
205
|
+
/**
|
|
206
|
+
* The element used as the collision boundary. By default this is the
|
|
207
|
+
* viewport, though you can provide additional element(s) to be included in
|
|
208
|
+
* this check.
|
|
209
|
+
*/
|
|
210
|
+
collisionBoundary?: Element | null;
|
|
211
|
+
/**
|
|
212
|
+
* The distance in pixels from the boundary edges where collision detection
|
|
213
|
+
* should occur. Accepts a number (same for all sides), or a partial padding
|
|
214
|
+
* object, for example: { top: 20, left: 20 }.
|
|
215
|
+
* @default 0
|
|
216
|
+
*/
|
|
217
|
+
collisionPadding?: number | Partial<Record<Side, number>>;
|
|
218
|
+
/**
|
|
219
|
+
* The sticky behavior on the align axis. "partial" will keep the content in the
|
|
220
|
+
* boundary as long as the trigger is at least partially in the boundary whilst
|
|
221
|
+
* "always" will keep the content in the boundary regardless.
|
|
222
|
+
* @default 'partial'
|
|
223
|
+
*/
|
|
224
|
+
sticky?: Sticky;
|
|
225
|
+
/**
|
|
226
|
+
* Whether to hide the content when the trigger becomes fully occluded.
|
|
227
|
+
* @default true
|
|
228
|
+
*/
|
|
229
|
+
hideWhenDetached?: boolean;
|
|
230
|
+
/**
|
|
231
|
+
* The max height for the content.
|
|
232
|
+
*/
|
|
233
|
+
maxHeight?: CSSProperties['maxHeight'];
|
|
234
|
+
/**
|
|
235
|
+
* Setting overflow as "visible" means that the content can extend beyond
|
|
236
|
+
* its collision boundary without any clipping or scrolling being
|
|
237
|
+
* applied.
|
|
238
|
+
* When set to "auto," a scrollbar is added if the content exceeds its
|
|
239
|
+
* boundaries. If no maxHeight is defined, it will be automatically adjusted
|
|
240
|
+
* to fit the remaining space between the trigger and the boundary edge.
|
|
241
|
+
* @default 'visible'
|
|
242
|
+
*/
|
|
243
|
+
overflow?: Overflow;
|
|
1020
244
|
}
|
|
1021
245
|
declare const Content: react__default.ForwardRefExoticComponent<Omit<ContentProps, "ref"> & react__default.RefAttributes<HTMLDivElement>>;
|
|
1022
246
|
|
|
1023
|
-
declare const StyledItem: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<
|
|
1024
|
-
'border-widths': {
|
|
1025
|
-
readonly none: 0;
|
|
1026
|
-
readonly sm: "1px";
|
|
1027
|
-
readonly md: "2px";
|
|
1028
|
-
readonly lg: "4px";
|
|
1029
|
-
};
|
|
1030
|
-
colors: {
|
|
1031
|
-
readonly black: any;
|
|
1032
|
-
readonly 'blue-100': any;
|
|
1033
|
-
readonly 'blue-200': any;
|
|
1034
|
-
readonly 'blue-300': any;
|
|
1035
|
-
readonly 'blue-400': any;
|
|
1036
|
-
readonly 'blue-500': any;
|
|
1037
|
-
readonly 'blue-600': any;
|
|
1038
|
-
readonly 'blue-700': any;
|
|
1039
|
-
readonly 'blue-800': any;
|
|
1040
|
-
readonly 'blue-900': any;
|
|
1041
|
-
readonly 'blue-1000': any;
|
|
1042
|
-
readonly 'gray-100': any;
|
|
1043
|
-
readonly 'gray-200': any;
|
|
1044
|
-
readonly 'gray-300': any;
|
|
1045
|
-
readonly 'gray-400': any;
|
|
1046
|
-
readonly 'gray-500': any;
|
|
1047
|
-
readonly 'gray-600': any;
|
|
1048
|
-
readonly 'gray-700': any;
|
|
1049
|
-
readonly 'gray-800': any;
|
|
1050
|
-
readonly 'gray-900': any;
|
|
1051
|
-
readonly 'green-100': any;
|
|
1052
|
-
readonly 'green-200': any;
|
|
1053
|
-
readonly 'green-300': any;
|
|
1054
|
-
readonly 'green-400': any;
|
|
1055
|
-
readonly 'green-500': any;
|
|
1056
|
-
readonly 'green-600': any;
|
|
1057
|
-
readonly 'green-700': any;
|
|
1058
|
-
readonly 'green-800': any;
|
|
1059
|
-
readonly 'green-900': any;
|
|
1060
|
-
readonly 'indigo-100': any;
|
|
1061
|
-
readonly 'indigo-200': any;
|
|
1062
|
-
readonly 'indigo-300': any;
|
|
1063
|
-
readonly 'indigo-400': any;
|
|
1064
|
-
readonly 'indigo-500': any;
|
|
1065
|
-
readonly 'indigo-600': any;
|
|
1066
|
-
readonly 'indigo-700': any;
|
|
1067
|
-
readonly 'indigo-800': any;
|
|
1068
|
-
readonly 'indigo-900': any;
|
|
1069
|
-
readonly 'red-100': any;
|
|
1070
|
-
readonly 'red-200': any;
|
|
1071
|
-
readonly 'red-300': any;
|
|
1072
|
-
readonly 'red-400': any;
|
|
1073
|
-
readonly 'red-500': any;
|
|
1074
|
-
readonly 'red-600': any;
|
|
1075
|
-
readonly 'red-700': any;
|
|
1076
|
-
readonly 'red-800': any;
|
|
1077
|
-
readonly 'red-900': any;
|
|
1078
|
-
readonly transparent: any;
|
|
1079
|
-
readonly white: any;
|
|
1080
|
-
readonly 'yellow-100': any;
|
|
1081
|
-
readonly 'yellow-200': any;
|
|
1082
|
-
readonly 'yellow-300': any;
|
|
1083
|
-
readonly 'yellow-400': any;
|
|
1084
|
-
readonly 'yellow-500': any;
|
|
1085
|
-
readonly 'yellow-600': any;
|
|
1086
|
-
readonly 'yellow-700': any;
|
|
1087
|
-
readonly 'yellow-800': any;
|
|
1088
|
-
readonly 'yellow-900': any;
|
|
1089
|
-
"background-alpha-active"?: any;
|
|
1090
|
-
"background-alpha-hover"?: any;
|
|
1091
|
-
"background-danger-prominent"?: any;
|
|
1092
|
-
"background-danger-prominent-active"?: any;
|
|
1093
|
-
"background-danger-prominent-hover"?: any;
|
|
1094
|
-
"background-danger-subtle"?: any;
|
|
1095
|
-
"background-danger-subtle-active"?: any;
|
|
1096
|
-
"background-danger-subtle-hover"?: any;
|
|
1097
|
-
"background-neutrals"?: any;
|
|
1098
|
-
"background-neutrals-active"?: any;
|
|
1099
|
-
"background-neutrals-container"?: any;
|
|
1100
|
-
"background-neutrals-controls-disabled"?: any;
|
|
1101
|
-
"background-neutrals-disabled"?: any;
|
|
1102
|
-
"background-neutrals-hover"?: any;
|
|
1103
|
-
"background-neutrals-inactive"?: any;
|
|
1104
|
-
"background-neutrals-inactive-hover"?: any;
|
|
1105
|
-
"background-neutrals-inverted"?: any;
|
|
1106
|
-
"background-neutrals-inverted-subtle"?: any;
|
|
1107
|
-
"background-neutrals-page"?: any;
|
|
1108
|
-
"background-neutrals-page-subtle"?: any;
|
|
1109
|
-
"background-neutrals-scrolls"?: any;
|
|
1110
|
-
"background-neutrals-scrolls-expanded"?: any;
|
|
1111
|
-
"background-neutrals-scrolls-hover"?: any;
|
|
1112
|
-
"background-neutrals-scrolls-pressed"?: any;
|
|
1113
|
-
"background-neutrals-scrolls-pressed-hover"?: any;
|
|
1114
|
-
"background-neutrals-subtle"?: any;
|
|
1115
|
-
"background-neutrals-subtle-active"?: any;
|
|
1116
|
-
"background-neutrals-subtle-hover"?: any;
|
|
1117
|
-
"background-primary-prominent"?: any;
|
|
1118
|
-
"background-primary-prominent-active"?: any;
|
|
1119
|
-
"background-primary-prominent-expanded"?: any;
|
|
1120
|
-
"background-primary-prominent-hover"?: any;
|
|
1121
|
-
"background-primary-prominent-pressed"?: any;
|
|
1122
|
-
"background-primary-prominent-pressed-hover"?: any;
|
|
1123
|
-
"background-primary-prominent-selected"?: any;
|
|
1124
|
-
"background-primary-subtle"?: any;
|
|
1125
|
-
"background-primary-subtle-active"?: any;
|
|
1126
|
-
"background-primary-subtle-expanded"?: any;
|
|
1127
|
-
"background-primary-subtle-hover"?: any;
|
|
1128
|
-
"background-primary-subtle-pressed"?: any;
|
|
1129
|
-
"background-primary-subtle-pressed-hover"?: any;
|
|
1130
|
-
"background-primary-subtle-selected"?: any;
|
|
1131
|
-
"background-success"?: any;
|
|
1132
|
-
"background-success-prominent"?: any;
|
|
1133
|
-
"background-success-prominent-active"?: any;
|
|
1134
|
-
"background-success-prominent-hover"?: any;
|
|
1135
|
-
"background-warning-prominent"?: any;
|
|
1136
|
-
"background-warning-subtle"?: any;
|
|
1137
|
-
"border-danger"?: any;
|
|
1138
|
-
"border-danger-active"?: any;
|
|
1139
|
-
"border-danger-hover"?: any;
|
|
1140
|
-
"border-focus-inner"?: any;
|
|
1141
|
-
"border-focus-middle"?: any;
|
|
1142
|
-
"border-focus-outer"?: any;
|
|
1143
|
-
"border-neutrals"?: any;
|
|
1144
|
-
"border-neutrals-active"?: any;
|
|
1145
|
-
"border-neutrals-controls"?: any;
|
|
1146
|
-
"border-neutrals-controls-disabled"?: any;
|
|
1147
|
-
"border-neutrals-disabled"?: any;
|
|
1148
|
-
"border-neutrals-hover"?: any;
|
|
1149
|
-
"border-neutrals-inverted"?: any;
|
|
1150
|
-
"border-neutrals-subtle"?: any;
|
|
1151
|
-
"border-neutrals-text"?: any;
|
|
1152
|
-
"border-neutrals-text-active"?: any;
|
|
1153
|
-
"border-neutrals-text-hover"?: any;
|
|
1154
|
-
"border-neutrals-text-subtle"?: any;
|
|
1155
|
-
"border-neutrals-text-subtle-active"?: any;
|
|
1156
|
-
"border-neutrals-text-subtle-hover"?: any;
|
|
1157
|
-
"border-neutrals-transparent"?: any;
|
|
1158
|
-
"border-primary"?: any;
|
|
1159
|
-
"border-primary-active"?: any;
|
|
1160
|
-
"border-primary-hover"?: any;
|
|
1161
|
-
"border-primary-inverted"?: any;
|
|
1162
|
-
"border-success"?: any;
|
|
1163
|
-
"border-success-active"?: any;
|
|
1164
|
-
"border-success-hover"?: any;
|
|
1165
|
-
"border-warning"?: any;
|
|
1166
|
-
"icon-danger"?: any;
|
|
1167
|
-
"icon-danger-active"?: any;
|
|
1168
|
-
"icon-danger-hover"?: any;
|
|
1169
|
-
"icon-danger-inverted"?: any;
|
|
1170
|
-
"icon-neutrals"?: any;
|
|
1171
|
-
"icon-neutrals-disabled"?: any;
|
|
1172
|
-
"icon-neutrals-inactive"?: any;
|
|
1173
|
-
"icon-neutrals-inactive-hover"?: any;
|
|
1174
|
-
"icon-neutrals-inverted"?: any;
|
|
1175
|
-
"icon-neutrals-search"?: any;
|
|
1176
|
-
"icon-neutrals-subtle"?: any;
|
|
1177
|
-
"icon-neutrals-text"?: any;
|
|
1178
|
-
"icon-primary"?: any;
|
|
1179
|
-
"icon-primary-active"?: any;
|
|
1180
|
-
"icon-primary-hover"?: any;
|
|
1181
|
-
"icon-primary-inverted"?: any;
|
|
1182
|
-
"icon-primary-selected"?: any;
|
|
1183
|
-
"icon-success"?: any;
|
|
1184
|
-
"icon-success-active"?: any;
|
|
1185
|
-
"icon-success-hover"?: any;
|
|
1186
|
-
"icon-success-inverted"?: any;
|
|
1187
|
-
"icon-warning"?: any;
|
|
1188
|
-
"icon-warning-prominent"?: any;
|
|
1189
|
-
"icon-warning-subtle"?: any;
|
|
1190
|
-
"text-danger"?: any;
|
|
1191
|
-
"text-danger-active"?: any;
|
|
1192
|
-
"text-danger-hover"?: any;
|
|
1193
|
-
"text-danger-inverted"?: any;
|
|
1194
|
-
"text-neutrals"?: any;
|
|
1195
|
-
"text-neutrals-active"?: any;
|
|
1196
|
-
"text-neutrals-disabled"?: any;
|
|
1197
|
-
"text-neutrals-hover"?: any;
|
|
1198
|
-
"text-neutrals-inverted"?: any;
|
|
1199
|
-
"text-neutrals-placeholder"?: any;
|
|
1200
|
-
"text-neutrals-placeholder-only"?: any;
|
|
1201
|
-
"text-neutrals-subtle"?: any;
|
|
1202
|
-
"text-neutrals-subtle-active"?: any;
|
|
1203
|
-
"text-neutrals-subtle-hover"?: any;
|
|
1204
|
-
"text-primary"?: any;
|
|
1205
|
-
"text-primary-active"?: any;
|
|
1206
|
-
"text-primary-hover"?: any;
|
|
1207
|
-
"text-primary-inverted"?: any;
|
|
1208
|
-
"text-primary-inverted-subtle"?: any;
|
|
1209
|
-
"text-primary-selected"?: any;
|
|
1210
|
-
"text-success"?: any;
|
|
1211
|
-
"text-success-active"?: any;
|
|
1212
|
-
"text-success-hover"?: any;
|
|
1213
|
-
"text-success-inverted"?: any;
|
|
1214
|
-
"text-warning"?: any;
|
|
1215
|
-
"text-warning-subtle"?: any;
|
|
1216
|
-
};
|
|
1217
|
-
'font-sizes': {
|
|
1218
|
-
readonly 150: "0.75rem";
|
|
1219
|
-
readonly 175: "0.875rem";
|
|
1220
|
-
readonly 200: "1rem";
|
|
1221
|
-
readonly 225: "1.125rem";
|
|
1222
|
-
readonly 250: "1.25rem";
|
|
1223
|
-
readonly 300: "1.5rem";
|
|
1224
|
-
readonly 400: "2rem";
|
|
1225
|
-
readonly 500: "2.5rem";
|
|
1226
|
-
readonly 600: "3rem";
|
|
1227
|
-
readonly 800: "4rem";
|
|
1228
|
-
readonly 900: "4.5rem";
|
|
1229
|
-
};
|
|
1230
|
-
fonts: {
|
|
1231
|
-
readonly heading: "Roobert, sans-serif";
|
|
1232
|
-
readonly body: "Open Sans, sans-serif";
|
|
1233
|
-
};
|
|
1234
|
-
radii: {
|
|
1235
|
-
readonly none: 0;
|
|
1236
|
-
readonly half: "999em";
|
|
1237
|
-
readonly 25: "2px";
|
|
1238
|
-
readonly 50: "4px";
|
|
1239
|
-
readonly 75: "6px";
|
|
1240
|
-
readonly 100: "8px";
|
|
1241
|
-
readonly 200: "16px";
|
|
1242
|
-
};
|
|
1243
|
-
shadows: {
|
|
1244
|
-
readonly 'focus-small': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-inner";
|
|
1245
|
-
readonly 'focus-small-outline': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 1px $colors$border-focus-middle, inset 0 0 0 2px $colors$border-focus-inner";
|
|
1246
|
-
readonly 'focus-large': "0 0 0 4px $colors$border-focus-inner, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-outer";
|
|
1247
|
-
readonly 'focus-controls': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-focus-middle, 0 0 0 5px $colors$border-focus-outer";
|
|
1248
|
-
readonly 'focus-controls-error': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-danger, 0 0 0 5px $colors$background-danger-subtle-hover";
|
|
1249
|
-
readonly 'focus-controls-success': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$background-success-prominent, 0 0 0 5px $colors$background-success";
|
|
1250
|
-
};
|
|
1251
|
-
sizes: {
|
|
1252
|
-
readonly number: string;
|
|
1253
|
-
readonly 'icon-200': "16px";
|
|
1254
|
-
readonly 'icon-300': "24px";
|
|
1255
|
-
readonly 'icon-400': "32px";
|
|
1256
|
-
};
|
|
1257
|
-
space: {
|
|
1258
|
-
readonly 0: "0px";
|
|
1259
|
-
readonly 25: "2px";
|
|
1260
|
-
readonly 50: "4px";
|
|
1261
|
-
readonly 100: "8px";
|
|
1262
|
-
readonly 150: "12px";
|
|
1263
|
-
readonly 200: "16px";
|
|
1264
|
-
readonly 300: "24px";
|
|
1265
|
-
readonly 400: "32px";
|
|
1266
|
-
readonly 500: "40px";
|
|
1267
|
-
readonly 600: "48px";
|
|
1268
|
-
readonly 700: "56px";
|
|
1269
|
-
readonly 800: "64px";
|
|
1270
|
-
readonly 1200: "96px";
|
|
1271
|
-
readonly 1600: "128px";
|
|
1272
|
-
};
|
|
1273
|
-
'space-gap': {
|
|
1274
|
-
readonly 0: any;
|
|
1275
|
-
readonly 50: any;
|
|
1276
|
-
readonly 100: any;
|
|
1277
|
-
readonly 200: any;
|
|
1278
|
-
readonly 300: any;
|
|
1279
|
-
};
|
|
1280
|
-
'space-inset': {
|
|
1281
|
-
readonly 0: any;
|
|
1282
|
-
readonly 50: any;
|
|
1283
|
-
readonly 100: any;
|
|
1284
|
-
readonly 150: any;
|
|
1285
|
-
readonly 200: any;
|
|
1286
|
-
readonly 300: any;
|
|
1287
|
-
readonly 400: any;
|
|
1288
|
-
readonly 500: any;
|
|
1289
|
-
readonly 600: any;
|
|
1290
|
-
readonly 700: any;
|
|
1291
|
-
readonly 800: any;
|
|
1292
|
-
readonly 1200: any;
|
|
1293
|
-
readonly 1600: any;
|
|
1294
|
-
};
|
|
1295
|
-
'space-offset': {
|
|
1296
|
-
readonly 0: any;
|
|
1297
|
-
readonly 50: any;
|
|
1298
|
-
readonly 100: any;
|
|
1299
|
-
readonly 150: any;
|
|
1300
|
-
readonly 200: any;
|
|
1301
|
-
readonly 300: any;
|
|
1302
|
-
readonly 400: any;
|
|
1303
|
-
readonly 600: any;
|
|
1304
|
-
readonly 800: any;
|
|
1305
|
-
readonly 1200: any;
|
|
1306
|
-
readonly 1600: any;
|
|
1307
|
-
readonly 'stacking-0': any;
|
|
1308
|
-
readonly 'stacking-100': any;
|
|
1309
|
-
readonly 'stacking-200': any;
|
|
1310
|
-
readonly 'stacking-300': any;
|
|
1311
|
-
readonly 'stacking-400': any;
|
|
1312
|
-
readonly 'stacking-500': any;
|
|
1313
|
-
readonly 'stacking-800': any;
|
|
1314
|
-
};
|
|
1315
|
-
'stroke-width': {
|
|
1316
|
-
readonly thin: "1.5px";
|
|
1317
|
-
readonly normal: "2px";
|
|
1318
|
-
readonly bold: "4px";
|
|
1319
|
-
};
|
|
1320
|
-
'z-indices': {
|
|
1321
|
-
readonly dropdownMenu: 100;
|
|
1322
|
-
readonly select: 200;
|
|
1323
|
-
readonly popover: 300;
|
|
1324
|
-
readonly tooltip: 400;
|
|
1325
|
-
};
|
|
1326
|
-
}, {
|
|
1327
|
-
readonly background: "colors";
|
|
1328
|
-
readonly backgroundColor: "colors";
|
|
1329
|
-
readonly backgroundImage: "colors";
|
|
1330
|
-
readonly blockSize: "sizes";
|
|
1331
|
-
readonly border: "colors";
|
|
1332
|
-
readonly borderBlock: "colors";
|
|
1333
|
-
readonly borderBlockEnd: "colors";
|
|
1334
|
-
readonly borderBlockStart: "colors";
|
|
1335
|
-
readonly borderBottom: "colors";
|
|
1336
|
-
readonly borderBottomColor: "colors";
|
|
1337
|
-
readonly borderBottomLeftRadius: "radii";
|
|
1338
|
-
readonly borderBottomRightRadius: "radii";
|
|
1339
|
-
readonly borderBottomStyle: "border-styles";
|
|
1340
|
-
readonly borderBottomWidth: "border-widths";
|
|
1341
|
-
readonly borderColor: "colors";
|
|
1342
|
-
readonly borderImage: "colors";
|
|
1343
|
-
readonly borderInline: "colors";
|
|
1344
|
-
readonly borderInlineEnd: "colors";
|
|
1345
|
-
readonly borderInlineStart: "colors";
|
|
1346
|
-
readonly borderLeft: "colors";
|
|
1347
|
-
readonly borderLeftColor: "colors";
|
|
1348
|
-
readonly borderLeftStyle: "border-styles";
|
|
1349
|
-
readonly borderLeftWidth: "border-widths";
|
|
1350
|
-
readonly borderRadius: "radii";
|
|
1351
|
-
readonly borderRight: "colors";
|
|
1352
|
-
readonly borderRightColor: "colors";
|
|
1353
|
-
readonly borderRightStyle: "border-styles";
|
|
1354
|
-
readonly borderRightWidth: "border-widths";
|
|
1355
|
-
readonly borderSpacing: "space-offset";
|
|
1356
|
-
readonly borderStyle: "border-styles";
|
|
1357
|
-
readonly borderTop: "colors";
|
|
1358
|
-
readonly borderTopColor: "colors";
|
|
1359
|
-
readonly borderTopLeftRadius: "radii";
|
|
1360
|
-
readonly borderTopRightRadius: "radii";
|
|
1361
|
-
readonly borderTopStyle: "border-styles";
|
|
1362
|
-
readonly borderTopWidth: "border-widths";
|
|
1363
|
-
readonly borderWidth: "border-widths";
|
|
1364
|
-
readonly bottom: "space";
|
|
1365
|
-
readonly boxShadow: "shadows";
|
|
1366
|
-
readonly caretColor: "colors";
|
|
1367
|
-
readonly color: "colors";
|
|
1368
|
-
readonly columnGap: "space-gap";
|
|
1369
|
-
readonly columnRuleColor: "colors";
|
|
1370
|
-
readonly fill: "colors";
|
|
1371
|
-
readonly flexBasis: "sizes";
|
|
1372
|
-
readonly fontFamily: "fonts";
|
|
1373
|
-
readonly fontSize: "font-sizes";
|
|
1374
|
-
readonly fontWeight: "font-weights";
|
|
1375
|
-
readonly gap: "space-gap";
|
|
1376
|
-
readonly gridColumnGap: "space-gap";
|
|
1377
|
-
readonly gridGap: "space-gap";
|
|
1378
|
-
readonly gridRowGap: "space-gap";
|
|
1379
|
-
readonly gridTemplateColumns: "sizes";
|
|
1380
|
-
readonly gridTemplateRows: "sizes";
|
|
1381
|
-
readonly height: "sizes";
|
|
1382
|
-
readonly inlineSize: "sizes";
|
|
1383
|
-
readonly inset: "space-inset";
|
|
1384
|
-
readonly insetBlock: "space-inset";
|
|
1385
|
-
readonly insetBlockEnd: "space-inset";
|
|
1386
|
-
readonly insetBlockStart: "space-inset";
|
|
1387
|
-
readonly insetInline: "space-inset";
|
|
1388
|
-
readonly insetInlineEnd: "space-inset";
|
|
1389
|
-
readonly insetInlineStart: "space-inset";
|
|
1390
|
-
readonly left: "space";
|
|
1391
|
-
readonly letterSpacing: "letter-spacings";
|
|
1392
|
-
readonly lineHeight: "line-heights";
|
|
1393
|
-
readonly margin: "space-offset";
|
|
1394
|
-
readonly marginBlock: "space-offset";
|
|
1395
|
-
readonly marginBlockEnd: "space-offset";
|
|
1396
|
-
readonly marginBlockStart: "space-offset";
|
|
1397
|
-
readonly marginBottom: "space-offset";
|
|
1398
|
-
readonly marginInline: "space-offset";
|
|
1399
|
-
readonly marginInlineEnd: "space-offset";
|
|
1400
|
-
readonly marginInlineStart: "space-offset";
|
|
1401
|
-
readonly marginLeft: "space-offset";
|
|
1402
|
-
readonly marginRight: "space-offset";
|
|
1403
|
-
readonly marginTop: "space-offset";
|
|
1404
|
-
readonly maxBlockSize: "sizes";
|
|
1405
|
-
readonly maxHeight: "sizes";
|
|
1406
|
-
readonly maxInlineSize: "sizes";
|
|
1407
|
-
readonly maxWidth: "sizes";
|
|
1408
|
-
readonly minBlockSize: "sizes";
|
|
1409
|
-
readonly minHeight: "sizes";
|
|
1410
|
-
readonly minInlineSize: "sizes";
|
|
1411
|
-
readonly minWidth: "sizes";
|
|
1412
|
-
readonly outline: "colors";
|
|
1413
|
-
readonly outlineColor: "colors";
|
|
1414
|
-
readonly padding: "space-inset";
|
|
1415
|
-
readonly paddingBlock: "space-inset";
|
|
1416
|
-
readonly paddingBlockEnd: "space-inset";
|
|
1417
|
-
readonly paddingBlockStart: "space-inset";
|
|
1418
|
-
readonly paddingBottom: "space-inset";
|
|
1419
|
-
readonly paddingInline: "space-inset";
|
|
1420
|
-
readonly paddingInlineEnd: "space-inset";
|
|
1421
|
-
readonly paddingInlineStart: "space-inset";
|
|
1422
|
-
readonly paddingLeft: "space-inset";
|
|
1423
|
-
readonly paddingRight: "space-inset";
|
|
1424
|
-
readonly paddingTop: "space-inset";
|
|
1425
|
-
readonly right: "space";
|
|
1426
|
-
readonly rowGap: "space-gap";
|
|
1427
|
-
readonly scrollMargin: "space-offset";
|
|
1428
|
-
readonly scrollMarginBlock: "space-offset";
|
|
1429
|
-
readonly scrollMarginBlockEnd: "space-offset";
|
|
1430
|
-
readonly scrollMarginBlockStart: "space-offset";
|
|
1431
|
-
readonly scrollMarginBottom: "space-offset";
|
|
1432
|
-
readonly scrollMarginInline: "space-offset";
|
|
1433
|
-
readonly scrollMarginInlineEnd: "space-offset";
|
|
1434
|
-
readonly scrollMarginInlineStart: "space-offset";
|
|
1435
|
-
readonly scrollMarginLeft: "space-offset";
|
|
1436
|
-
readonly scrollMarginRight: "space-offset";
|
|
1437
|
-
readonly scrollMarginTop: "space-offset";
|
|
1438
|
-
readonly scrollPadding: "space-inset";
|
|
1439
|
-
readonly scrollPaddingBlock: "space-inset";
|
|
1440
|
-
readonly scrollPaddingBlockEnd: "space-inset";
|
|
1441
|
-
readonly scrollPaddingBlockStart: "space-inset";
|
|
1442
|
-
readonly scrollPaddingBottom: "space-inset";
|
|
1443
|
-
readonly scrollPaddingInline: "space-inset";
|
|
1444
|
-
readonly scrollPaddingInlineEnd: "space-inset";
|
|
1445
|
-
readonly scrollPaddingInlineStart: "space-inset";
|
|
1446
|
-
readonly scrollPaddingLeft: "space-inset";
|
|
1447
|
-
readonly scrollPaddingRight: "space-inset";
|
|
1448
|
-
readonly scrollPaddingTop: "space-inset";
|
|
1449
|
-
readonly stroke: "colors";
|
|
1450
|
-
readonly strokeWidth: "stroke-width";
|
|
1451
|
-
readonly textDecorationColor: "colors";
|
|
1452
|
-
readonly textShadow: "shadows";
|
|
1453
|
-
readonly top: "space";
|
|
1454
|
-
readonly transition: "transitions";
|
|
1455
|
-
readonly width: "sizes";
|
|
1456
|
-
readonly zIndex: "z-indices";
|
|
1457
|
-
}, {
|
|
1458
|
-
paddingX: (value: {
|
|
1459
|
-
readonly [$$PropertyValue]: "padding";
|
|
1460
|
-
}) => {
|
|
1461
|
-
paddingLeft: {
|
|
1462
|
-
readonly [$$PropertyValue]: "padding";
|
|
1463
|
-
};
|
|
1464
|
-
paddingRight: {
|
|
1465
|
-
readonly [$$PropertyValue]: "padding";
|
|
1466
|
-
};
|
|
1467
|
-
};
|
|
1468
|
-
paddingY: (value: {
|
|
1469
|
-
readonly [$$PropertyValue]: "padding";
|
|
1470
|
-
}) => {
|
|
1471
|
-
paddingTop: {
|
|
1472
|
-
readonly [$$PropertyValue]: "padding";
|
|
1473
|
-
};
|
|
1474
|
-
paddingBottom: {
|
|
1475
|
-
readonly [$$PropertyValue]: "padding";
|
|
1476
|
-
};
|
|
1477
|
-
};
|
|
1478
|
-
marginX: (value: {
|
|
1479
|
-
readonly [$$PropertyValue]: "margin";
|
|
1480
|
-
}) => {
|
|
1481
|
-
marginLeft: {
|
|
1482
|
-
readonly [$$PropertyValue]: "margin";
|
|
1483
|
-
};
|
|
1484
|
-
marginRight: {
|
|
1485
|
-
readonly [$$PropertyValue]: "margin";
|
|
1486
|
-
};
|
|
1487
|
-
};
|
|
1488
|
-
marginY: (value: {
|
|
1489
|
-
readonly [$$PropertyValue]: "margin";
|
|
1490
|
-
}) => {
|
|
1491
|
-
marginTop: {
|
|
1492
|
-
readonly [$$PropertyValue]: "margin";
|
|
1493
|
-
};
|
|
1494
|
-
marginBottom: {
|
|
1495
|
-
readonly [$$PropertyValue]: "margin";
|
|
1496
|
-
};
|
|
1497
|
-
};
|
|
1498
|
-
square: (value: {
|
|
1499
|
-
readonly [$$PropertyValue]: "width";
|
|
1500
|
-
}) => {
|
|
1501
|
-
width: {
|
|
1502
|
-
readonly [$$PropertyValue]: "width";
|
|
1503
|
-
};
|
|
1504
|
-
height: {
|
|
1505
|
-
readonly [$$PropertyValue]: "width";
|
|
1506
|
-
};
|
|
1507
|
-
};
|
|
1508
|
-
_hover: (css: _stitches_react_types_css_util.CSSProperties) => {
|
|
1509
|
-
'&:hover, &[data-hovered]': _stitches_react_types_css_util.CSSProperties;
|
|
1510
|
-
};
|
|
1511
|
-
}>>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {}, {}>;
|
|
247
|
+
declare const StyledItem: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<(props: _ariakit_react.ComboboxItemProps<"div">) => react.ReactElement<any, string | react.JSXElementConstructor<any>>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<(props: _ariakit_react.ComboboxItemProps<"div">) => react.ReactElement<any, string | react.JSXElementConstructor<any>>, {}, {}>;
|
|
1512
248
|
declare type StyledItemProps = StrictComponentProps<typeof StyledItem>;
|
|
1513
249
|
|
|
1514
250
|
interface ItemProps extends StyledItemProps {
|
|
@@ -1527,6 +263,10 @@ interface ItemProps extends StyledItemProps {
|
|
|
1527
263
|
* complex, or you have non-textual content inside.
|
|
1528
264
|
*/
|
|
1529
265
|
textValue?: string;
|
|
266
|
+
/**
|
|
267
|
+
* Item's content.
|
|
268
|
+
*/
|
|
269
|
+
children?: ReactNode;
|
|
1530
270
|
}
|
|
1531
271
|
declare const Item: react__default.ForwardRefExoticComponent<Omit<ItemProps, "ref"> & react__default.RefAttributes<HTMLDivElement>>;
|
|
1532
272
|
|
|
@@ -1538,1025 +278,71 @@ interface PortalProps extends PopoverPortalProps {
|
|
|
1538
278
|
}
|
|
1539
279
|
declare const Portal: react__default.FC<PortalProps>;
|
|
1540
280
|
|
|
1541
|
-
declare const StyledGroup: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<
|
|
1542
|
-
'border-widths': {
|
|
1543
|
-
readonly none: 0;
|
|
1544
|
-
readonly sm: "1px";
|
|
1545
|
-
readonly md: "2px";
|
|
1546
|
-
readonly lg: "4px";
|
|
1547
|
-
};
|
|
1548
|
-
colors: {
|
|
1549
|
-
readonly black: any;
|
|
1550
|
-
readonly 'blue-100': any;
|
|
1551
|
-
readonly 'blue-200': any;
|
|
1552
|
-
readonly 'blue-300': any;
|
|
1553
|
-
readonly 'blue-400': any;
|
|
1554
|
-
readonly 'blue-500': any;
|
|
1555
|
-
readonly 'blue-600': any;
|
|
1556
|
-
readonly 'blue-700': any;
|
|
1557
|
-
readonly 'blue-800': any;
|
|
1558
|
-
readonly 'blue-900': any;
|
|
1559
|
-
readonly 'blue-1000': any;
|
|
1560
|
-
readonly 'gray-100': any;
|
|
1561
|
-
readonly 'gray-200': any;
|
|
1562
|
-
readonly 'gray-300': any;
|
|
1563
|
-
readonly 'gray-400': any;
|
|
1564
|
-
readonly 'gray-500': any;
|
|
1565
|
-
readonly 'gray-600': any;
|
|
1566
|
-
readonly 'gray-700': any;
|
|
1567
|
-
readonly 'gray-800': any;
|
|
1568
|
-
readonly 'gray-900': any;
|
|
1569
|
-
readonly 'green-100': any;
|
|
1570
|
-
readonly 'green-200': any;
|
|
1571
|
-
readonly 'green-300': any;
|
|
1572
|
-
readonly 'green-400': any;
|
|
1573
|
-
readonly 'green-500': any;
|
|
1574
|
-
readonly 'green-600': any;
|
|
1575
|
-
readonly 'green-700': any;
|
|
1576
|
-
readonly 'green-800': any;
|
|
1577
|
-
readonly 'green-900': any;
|
|
1578
|
-
readonly 'indigo-100': any;
|
|
1579
|
-
readonly 'indigo-200': any;
|
|
1580
|
-
readonly 'indigo-300': any;
|
|
1581
|
-
readonly 'indigo-400': any;
|
|
1582
|
-
readonly 'indigo-500': any;
|
|
1583
|
-
readonly 'indigo-600': any;
|
|
1584
|
-
readonly 'indigo-700': any;
|
|
1585
|
-
readonly 'indigo-800': any;
|
|
1586
|
-
readonly 'indigo-900': any;
|
|
1587
|
-
readonly 'red-100': any;
|
|
1588
|
-
readonly 'red-200': any;
|
|
1589
|
-
readonly 'red-300': any;
|
|
1590
|
-
readonly 'red-400': any;
|
|
1591
|
-
readonly 'red-500': any;
|
|
1592
|
-
readonly 'red-600': any;
|
|
1593
|
-
readonly 'red-700': any;
|
|
1594
|
-
readonly 'red-800': any;
|
|
1595
|
-
readonly 'red-900': any;
|
|
1596
|
-
readonly transparent: any;
|
|
1597
|
-
readonly white: any;
|
|
1598
|
-
readonly 'yellow-100': any;
|
|
1599
|
-
readonly 'yellow-200': any;
|
|
1600
|
-
readonly 'yellow-300': any;
|
|
1601
|
-
readonly 'yellow-400': any;
|
|
1602
|
-
readonly 'yellow-500': any;
|
|
1603
|
-
readonly 'yellow-600': any;
|
|
1604
|
-
readonly 'yellow-700': any;
|
|
1605
|
-
readonly 'yellow-800': any;
|
|
1606
|
-
readonly 'yellow-900': any;
|
|
1607
|
-
"background-alpha-active"?: any;
|
|
1608
|
-
"background-alpha-hover"?: any;
|
|
1609
|
-
"background-danger-prominent"?: any;
|
|
1610
|
-
"background-danger-prominent-active"?: any;
|
|
1611
|
-
"background-danger-prominent-hover"?: any;
|
|
1612
|
-
"background-danger-subtle"?: any;
|
|
1613
|
-
"background-danger-subtle-active"?: any;
|
|
1614
|
-
"background-danger-subtle-hover"?: any;
|
|
1615
|
-
"background-neutrals"?: any;
|
|
1616
|
-
"background-neutrals-active"?: any;
|
|
1617
|
-
"background-neutrals-container"?: any;
|
|
1618
|
-
"background-neutrals-controls-disabled"?: any;
|
|
1619
|
-
"background-neutrals-disabled"?: any;
|
|
1620
|
-
"background-neutrals-hover"?: any;
|
|
1621
|
-
"background-neutrals-inactive"?: any;
|
|
1622
|
-
"background-neutrals-inactive-hover"?: any;
|
|
1623
|
-
"background-neutrals-inverted"?: any;
|
|
1624
|
-
"background-neutrals-inverted-subtle"?: any;
|
|
1625
|
-
"background-neutrals-page"?: any;
|
|
1626
|
-
"background-neutrals-page-subtle"?: any;
|
|
1627
|
-
"background-neutrals-scrolls"?: any;
|
|
1628
|
-
"background-neutrals-scrolls-expanded"?: any;
|
|
1629
|
-
"background-neutrals-scrolls-hover"?: any;
|
|
1630
|
-
"background-neutrals-scrolls-pressed"?: any;
|
|
1631
|
-
"background-neutrals-scrolls-pressed-hover"?: any;
|
|
1632
|
-
"background-neutrals-subtle"?: any;
|
|
1633
|
-
"background-neutrals-subtle-active"?: any;
|
|
1634
|
-
"background-neutrals-subtle-hover"?: any;
|
|
1635
|
-
"background-primary-prominent"?: any;
|
|
1636
|
-
"background-primary-prominent-active"?: any;
|
|
1637
|
-
"background-primary-prominent-expanded"?: any;
|
|
1638
|
-
"background-primary-prominent-hover"?: any;
|
|
1639
|
-
"background-primary-prominent-pressed"?: any;
|
|
1640
|
-
"background-primary-prominent-pressed-hover"?: any;
|
|
1641
|
-
"background-primary-prominent-selected"?: any;
|
|
1642
|
-
"background-primary-subtle"?: any;
|
|
1643
|
-
"background-primary-subtle-active"?: any;
|
|
1644
|
-
"background-primary-subtle-expanded"?: any;
|
|
1645
|
-
"background-primary-subtle-hover"?: any;
|
|
1646
|
-
"background-primary-subtle-pressed"?: any;
|
|
1647
|
-
"background-primary-subtle-pressed-hover"?: any;
|
|
1648
|
-
"background-primary-subtle-selected"?: any;
|
|
1649
|
-
"background-success"?: any;
|
|
1650
|
-
"background-success-prominent"?: any;
|
|
1651
|
-
"background-success-prominent-active"?: any;
|
|
1652
|
-
"background-success-prominent-hover"?: any;
|
|
1653
|
-
"background-warning-prominent"?: any;
|
|
1654
|
-
"background-warning-subtle"?: any;
|
|
1655
|
-
"border-danger"?: any;
|
|
1656
|
-
"border-danger-active"?: any;
|
|
1657
|
-
"border-danger-hover"?: any;
|
|
1658
|
-
"border-focus-inner"?: any;
|
|
1659
|
-
"border-focus-middle"?: any;
|
|
1660
|
-
"border-focus-outer"?: any;
|
|
1661
|
-
"border-neutrals"?: any;
|
|
1662
|
-
"border-neutrals-active"?: any;
|
|
1663
|
-
"border-neutrals-controls"?: any;
|
|
1664
|
-
"border-neutrals-controls-disabled"?: any;
|
|
1665
|
-
"border-neutrals-disabled"?: any;
|
|
1666
|
-
"border-neutrals-hover"?: any;
|
|
1667
|
-
"border-neutrals-inverted"?: any;
|
|
1668
|
-
"border-neutrals-subtle"?: any;
|
|
1669
|
-
"border-neutrals-text"?: any;
|
|
1670
|
-
"border-neutrals-text-active"?: any;
|
|
1671
|
-
"border-neutrals-text-hover"?: any;
|
|
1672
|
-
"border-neutrals-text-subtle"?: any;
|
|
1673
|
-
"border-neutrals-text-subtle-active"?: any;
|
|
1674
|
-
"border-neutrals-text-subtle-hover"?: any;
|
|
1675
|
-
"border-neutrals-transparent"?: any;
|
|
1676
|
-
"border-primary"?: any;
|
|
1677
|
-
"border-primary-active"?: any;
|
|
1678
|
-
"border-primary-hover"?: any;
|
|
1679
|
-
"border-primary-inverted"?: any;
|
|
1680
|
-
"border-success"?: any;
|
|
1681
|
-
"border-success-active"?: any;
|
|
1682
|
-
"border-success-hover"?: any;
|
|
1683
|
-
"border-warning"?: any;
|
|
1684
|
-
"icon-danger"?: any;
|
|
1685
|
-
"icon-danger-active"?: any;
|
|
1686
|
-
"icon-danger-hover"?: any;
|
|
1687
|
-
"icon-danger-inverted"?: any;
|
|
1688
|
-
"icon-neutrals"?: any;
|
|
1689
|
-
"icon-neutrals-disabled"?: any;
|
|
1690
|
-
"icon-neutrals-inactive"?: any;
|
|
1691
|
-
"icon-neutrals-inactive-hover"?: any;
|
|
1692
|
-
"icon-neutrals-inverted"?: any;
|
|
1693
|
-
"icon-neutrals-search"?: any;
|
|
1694
|
-
"icon-neutrals-subtle"?: any;
|
|
1695
|
-
"icon-neutrals-text"?: any;
|
|
1696
|
-
"icon-primary"?: any;
|
|
1697
|
-
"icon-primary-active"?: any;
|
|
1698
|
-
"icon-primary-hover"?: any;
|
|
1699
|
-
"icon-primary-inverted"?: any;
|
|
1700
|
-
"icon-primary-selected"?: any;
|
|
1701
|
-
"icon-success"?: any;
|
|
1702
|
-
"icon-success-active"?: any;
|
|
1703
|
-
"icon-success-hover"?: any;
|
|
1704
|
-
"icon-success-inverted"?: any;
|
|
1705
|
-
"icon-warning"?: any;
|
|
1706
|
-
"icon-warning-prominent"?: any;
|
|
1707
|
-
"icon-warning-subtle"?: any;
|
|
1708
|
-
"text-danger"?: any;
|
|
1709
|
-
"text-danger-active"?: any;
|
|
1710
|
-
"text-danger-hover"?: any;
|
|
1711
|
-
"text-danger-inverted"?: any;
|
|
1712
|
-
"text-neutrals"?: any;
|
|
1713
|
-
"text-neutrals-active"?: any;
|
|
1714
|
-
"text-neutrals-disabled"?: any;
|
|
1715
|
-
"text-neutrals-hover"?: any;
|
|
1716
|
-
"text-neutrals-inverted"?: any;
|
|
1717
|
-
"text-neutrals-placeholder"?: any;
|
|
1718
|
-
"text-neutrals-placeholder-only"?: any;
|
|
1719
|
-
"text-neutrals-subtle"?: any;
|
|
1720
|
-
"text-neutrals-subtle-active"?: any;
|
|
1721
|
-
"text-neutrals-subtle-hover"?: any;
|
|
1722
|
-
"text-primary"?: any;
|
|
1723
|
-
"text-primary-active"?: any;
|
|
1724
|
-
"text-primary-hover"?: any;
|
|
1725
|
-
"text-primary-inverted"?: any;
|
|
1726
|
-
"text-primary-inverted-subtle"?: any;
|
|
1727
|
-
"text-primary-selected"?: any;
|
|
1728
|
-
"text-success"?: any;
|
|
1729
|
-
"text-success-active"?: any;
|
|
1730
|
-
"text-success-hover"?: any;
|
|
1731
|
-
"text-success-inverted"?: any;
|
|
1732
|
-
"text-warning"?: any;
|
|
1733
|
-
"text-warning-subtle"?: any;
|
|
1734
|
-
};
|
|
1735
|
-
'font-sizes': {
|
|
1736
|
-
readonly 150: "0.75rem";
|
|
1737
|
-
readonly 175: "0.875rem";
|
|
1738
|
-
readonly 200: "1rem";
|
|
1739
|
-
readonly 225: "1.125rem";
|
|
1740
|
-
readonly 250: "1.25rem";
|
|
1741
|
-
readonly 300: "1.5rem";
|
|
1742
|
-
readonly 400: "2rem";
|
|
1743
|
-
readonly 500: "2.5rem";
|
|
1744
|
-
readonly 600: "3rem";
|
|
1745
|
-
readonly 800: "4rem";
|
|
1746
|
-
readonly 900: "4.5rem";
|
|
1747
|
-
};
|
|
1748
|
-
fonts: {
|
|
1749
|
-
readonly heading: "Roobert, sans-serif";
|
|
1750
|
-
readonly body: "Open Sans, sans-serif";
|
|
1751
|
-
};
|
|
1752
|
-
radii: {
|
|
1753
|
-
readonly none: 0;
|
|
1754
|
-
readonly half: "999em";
|
|
1755
|
-
readonly 25: "2px";
|
|
1756
|
-
readonly 50: "4px";
|
|
1757
|
-
readonly 75: "6px";
|
|
1758
|
-
readonly 100: "8px";
|
|
1759
|
-
readonly 200: "16px";
|
|
1760
|
-
};
|
|
1761
|
-
shadows: {
|
|
1762
|
-
readonly 'focus-small': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-inner";
|
|
1763
|
-
readonly 'focus-small-outline': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 1px $colors$border-focus-middle, inset 0 0 0 2px $colors$border-focus-inner";
|
|
1764
|
-
readonly 'focus-large': "0 0 0 4px $colors$border-focus-inner, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-outer";
|
|
1765
|
-
readonly 'focus-controls': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-focus-middle, 0 0 0 5px $colors$border-focus-outer";
|
|
1766
|
-
readonly 'focus-controls-error': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-danger, 0 0 0 5px $colors$background-danger-subtle-hover";
|
|
1767
|
-
readonly 'focus-controls-success': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$background-success-prominent, 0 0 0 5px $colors$background-success";
|
|
1768
|
-
};
|
|
1769
|
-
sizes: {
|
|
1770
|
-
readonly number: string;
|
|
1771
|
-
readonly 'icon-200': "16px";
|
|
1772
|
-
readonly 'icon-300': "24px";
|
|
1773
|
-
readonly 'icon-400': "32px";
|
|
1774
|
-
};
|
|
1775
|
-
space: {
|
|
1776
|
-
readonly 0: "0px";
|
|
1777
|
-
readonly 25: "2px";
|
|
1778
|
-
readonly 50: "4px";
|
|
1779
|
-
readonly 100: "8px";
|
|
1780
|
-
readonly 150: "12px";
|
|
1781
|
-
readonly 200: "16px";
|
|
1782
|
-
readonly 300: "24px";
|
|
1783
|
-
readonly 400: "32px";
|
|
1784
|
-
readonly 500: "40px";
|
|
1785
|
-
readonly 600: "48px";
|
|
1786
|
-
readonly 700: "56px";
|
|
1787
|
-
readonly 800: "64px";
|
|
1788
|
-
readonly 1200: "96px";
|
|
1789
|
-
readonly 1600: "128px";
|
|
1790
|
-
};
|
|
1791
|
-
'space-gap': {
|
|
1792
|
-
readonly 0: any;
|
|
1793
|
-
readonly 50: any;
|
|
1794
|
-
readonly 100: any;
|
|
1795
|
-
readonly 200: any;
|
|
1796
|
-
readonly 300: any;
|
|
1797
|
-
};
|
|
1798
|
-
'space-inset': {
|
|
1799
|
-
readonly 0: any;
|
|
1800
|
-
readonly 50: any;
|
|
1801
|
-
readonly 100: any;
|
|
1802
|
-
readonly 150: any;
|
|
1803
|
-
readonly 200: any;
|
|
1804
|
-
readonly 300: any;
|
|
1805
|
-
readonly 400: any;
|
|
1806
|
-
readonly 500: any;
|
|
1807
|
-
readonly 600: any;
|
|
1808
|
-
readonly 700: any;
|
|
1809
|
-
readonly 800: any;
|
|
1810
|
-
readonly 1200: any;
|
|
1811
|
-
readonly 1600: any;
|
|
1812
|
-
};
|
|
1813
|
-
'space-offset': {
|
|
1814
|
-
readonly 0: any;
|
|
1815
|
-
readonly 50: any;
|
|
1816
|
-
readonly 100: any;
|
|
1817
|
-
readonly 150: any;
|
|
1818
|
-
readonly 200: any;
|
|
1819
|
-
readonly 300: any;
|
|
1820
|
-
readonly 400: any;
|
|
1821
|
-
readonly 600: any;
|
|
1822
|
-
readonly 800: any;
|
|
1823
|
-
readonly 1200: any;
|
|
1824
|
-
readonly 1600: any;
|
|
1825
|
-
readonly 'stacking-0': any;
|
|
1826
|
-
readonly 'stacking-100': any;
|
|
1827
|
-
readonly 'stacking-200': any;
|
|
1828
|
-
readonly 'stacking-300': any;
|
|
1829
|
-
readonly 'stacking-400': any;
|
|
1830
|
-
readonly 'stacking-500': any;
|
|
1831
|
-
readonly 'stacking-800': any;
|
|
1832
|
-
};
|
|
1833
|
-
'stroke-width': {
|
|
1834
|
-
readonly thin: "1.5px";
|
|
1835
|
-
readonly normal: "2px";
|
|
1836
|
-
readonly bold: "4px";
|
|
1837
|
-
};
|
|
1838
|
-
'z-indices': {
|
|
1839
|
-
readonly dropdownMenu: 100;
|
|
1840
|
-
readonly select: 200;
|
|
1841
|
-
readonly popover: 300;
|
|
1842
|
-
readonly tooltip: 400;
|
|
1843
|
-
};
|
|
1844
|
-
}, {
|
|
1845
|
-
readonly background: "colors";
|
|
1846
|
-
readonly backgroundColor: "colors";
|
|
1847
|
-
readonly backgroundImage: "colors";
|
|
1848
|
-
readonly blockSize: "sizes";
|
|
1849
|
-
readonly border: "colors";
|
|
1850
|
-
readonly borderBlock: "colors";
|
|
1851
|
-
readonly borderBlockEnd: "colors";
|
|
1852
|
-
readonly borderBlockStart: "colors";
|
|
1853
|
-
readonly borderBottom: "colors";
|
|
1854
|
-
readonly borderBottomColor: "colors";
|
|
1855
|
-
readonly borderBottomLeftRadius: "radii";
|
|
1856
|
-
readonly borderBottomRightRadius: "radii";
|
|
1857
|
-
readonly borderBottomStyle: "border-styles";
|
|
1858
|
-
readonly borderBottomWidth: "border-widths";
|
|
1859
|
-
readonly borderColor: "colors";
|
|
1860
|
-
readonly borderImage: "colors";
|
|
1861
|
-
readonly borderInline: "colors";
|
|
1862
|
-
readonly borderInlineEnd: "colors";
|
|
1863
|
-
readonly borderInlineStart: "colors";
|
|
1864
|
-
readonly borderLeft: "colors";
|
|
1865
|
-
readonly borderLeftColor: "colors";
|
|
1866
|
-
readonly borderLeftStyle: "border-styles";
|
|
1867
|
-
readonly borderLeftWidth: "border-widths";
|
|
1868
|
-
readonly borderRadius: "radii";
|
|
1869
|
-
readonly borderRight: "colors";
|
|
1870
|
-
readonly borderRightColor: "colors";
|
|
1871
|
-
readonly borderRightStyle: "border-styles";
|
|
1872
|
-
readonly borderRightWidth: "border-widths";
|
|
1873
|
-
readonly borderSpacing: "space-offset";
|
|
1874
|
-
readonly borderStyle: "border-styles";
|
|
1875
|
-
readonly borderTop: "colors";
|
|
1876
|
-
readonly borderTopColor: "colors";
|
|
1877
|
-
readonly borderTopLeftRadius: "radii";
|
|
1878
|
-
readonly borderTopRightRadius: "radii";
|
|
1879
|
-
readonly borderTopStyle: "border-styles";
|
|
1880
|
-
readonly borderTopWidth: "border-widths";
|
|
1881
|
-
readonly borderWidth: "border-widths";
|
|
1882
|
-
readonly bottom: "space";
|
|
1883
|
-
readonly boxShadow: "shadows";
|
|
1884
|
-
readonly caretColor: "colors";
|
|
1885
|
-
readonly color: "colors";
|
|
1886
|
-
readonly columnGap: "space-gap";
|
|
1887
|
-
readonly columnRuleColor: "colors";
|
|
1888
|
-
readonly fill: "colors";
|
|
1889
|
-
readonly flexBasis: "sizes";
|
|
1890
|
-
readonly fontFamily: "fonts";
|
|
1891
|
-
readonly fontSize: "font-sizes";
|
|
1892
|
-
readonly fontWeight: "font-weights";
|
|
1893
|
-
readonly gap: "space-gap";
|
|
1894
|
-
readonly gridColumnGap: "space-gap";
|
|
1895
|
-
readonly gridGap: "space-gap";
|
|
1896
|
-
readonly gridRowGap: "space-gap";
|
|
1897
|
-
readonly gridTemplateColumns: "sizes";
|
|
1898
|
-
readonly gridTemplateRows: "sizes";
|
|
1899
|
-
readonly height: "sizes";
|
|
1900
|
-
readonly inlineSize: "sizes";
|
|
1901
|
-
readonly inset: "space-inset";
|
|
1902
|
-
readonly insetBlock: "space-inset";
|
|
1903
|
-
readonly insetBlockEnd: "space-inset";
|
|
1904
|
-
readonly insetBlockStart: "space-inset";
|
|
1905
|
-
readonly insetInline: "space-inset";
|
|
1906
|
-
readonly insetInlineEnd: "space-inset";
|
|
1907
|
-
readonly insetInlineStart: "space-inset";
|
|
1908
|
-
readonly left: "space";
|
|
1909
|
-
readonly letterSpacing: "letter-spacings";
|
|
1910
|
-
readonly lineHeight: "line-heights";
|
|
1911
|
-
readonly margin: "space-offset";
|
|
1912
|
-
readonly marginBlock: "space-offset";
|
|
1913
|
-
readonly marginBlockEnd: "space-offset";
|
|
1914
|
-
readonly marginBlockStart: "space-offset";
|
|
1915
|
-
readonly marginBottom: "space-offset";
|
|
1916
|
-
readonly marginInline: "space-offset";
|
|
1917
|
-
readonly marginInlineEnd: "space-offset";
|
|
1918
|
-
readonly marginInlineStart: "space-offset";
|
|
1919
|
-
readonly marginLeft: "space-offset";
|
|
1920
|
-
readonly marginRight: "space-offset";
|
|
1921
|
-
readonly marginTop: "space-offset";
|
|
1922
|
-
readonly maxBlockSize: "sizes";
|
|
1923
|
-
readonly maxHeight: "sizes";
|
|
1924
|
-
readonly maxInlineSize: "sizes";
|
|
1925
|
-
readonly maxWidth: "sizes";
|
|
1926
|
-
readonly minBlockSize: "sizes";
|
|
1927
|
-
readonly minHeight: "sizes";
|
|
1928
|
-
readonly minInlineSize: "sizes";
|
|
1929
|
-
readonly minWidth: "sizes";
|
|
1930
|
-
readonly outline: "colors";
|
|
1931
|
-
readonly outlineColor: "colors";
|
|
1932
|
-
readonly padding: "space-inset";
|
|
1933
|
-
readonly paddingBlock: "space-inset";
|
|
1934
|
-
readonly paddingBlockEnd: "space-inset";
|
|
1935
|
-
readonly paddingBlockStart: "space-inset";
|
|
1936
|
-
readonly paddingBottom: "space-inset";
|
|
1937
|
-
readonly paddingInline: "space-inset";
|
|
1938
|
-
readonly paddingInlineEnd: "space-inset";
|
|
1939
|
-
readonly paddingInlineStart: "space-inset";
|
|
1940
|
-
readonly paddingLeft: "space-inset";
|
|
1941
|
-
readonly paddingRight: "space-inset";
|
|
1942
|
-
readonly paddingTop: "space-inset";
|
|
1943
|
-
readonly right: "space";
|
|
1944
|
-
readonly rowGap: "space-gap";
|
|
1945
|
-
readonly scrollMargin: "space-offset";
|
|
1946
|
-
readonly scrollMarginBlock: "space-offset";
|
|
1947
|
-
readonly scrollMarginBlockEnd: "space-offset";
|
|
1948
|
-
readonly scrollMarginBlockStart: "space-offset";
|
|
1949
|
-
readonly scrollMarginBottom: "space-offset";
|
|
1950
|
-
readonly scrollMarginInline: "space-offset";
|
|
1951
|
-
readonly scrollMarginInlineEnd: "space-offset";
|
|
1952
|
-
readonly scrollMarginInlineStart: "space-offset";
|
|
1953
|
-
readonly scrollMarginLeft: "space-offset";
|
|
1954
|
-
readonly scrollMarginRight: "space-offset";
|
|
1955
|
-
readonly scrollMarginTop: "space-offset";
|
|
1956
|
-
readonly scrollPadding: "space-inset";
|
|
1957
|
-
readonly scrollPaddingBlock: "space-inset";
|
|
1958
|
-
readonly scrollPaddingBlockEnd: "space-inset";
|
|
1959
|
-
readonly scrollPaddingBlockStart: "space-inset";
|
|
1960
|
-
readonly scrollPaddingBottom: "space-inset";
|
|
1961
|
-
readonly scrollPaddingInline: "space-inset";
|
|
1962
|
-
readonly scrollPaddingInlineEnd: "space-inset";
|
|
1963
|
-
readonly scrollPaddingInlineStart: "space-inset";
|
|
1964
|
-
readonly scrollPaddingLeft: "space-inset";
|
|
1965
|
-
readonly scrollPaddingRight: "space-inset";
|
|
1966
|
-
readonly scrollPaddingTop: "space-inset";
|
|
1967
|
-
readonly stroke: "colors";
|
|
1968
|
-
readonly strokeWidth: "stroke-width";
|
|
1969
|
-
readonly textDecorationColor: "colors";
|
|
1970
|
-
readonly textShadow: "shadows";
|
|
1971
|
-
readonly top: "space";
|
|
1972
|
-
readonly transition: "transitions";
|
|
1973
|
-
readonly width: "sizes";
|
|
1974
|
-
readonly zIndex: "z-indices";
|
|
1975
|
-
}, {
|
|
1976
|
-
paddingX: (value: {
|
|
1977
|
-
readonly [$$PropertyValue]: "padding";
|
|
1978
|
-
}) => {
|
|
1979
|
-
paddingLeft: {
|
|
1980
|
-
readonly [$$PropertyValue]: "padding";
|
|
1981
|
-
};
|
|
1982
|
-
paddingRight: {
|
|
1983
|
-
readonly [$$PropertyValue]: "padding";
|
|
1984
|
-
};
|
|
1985
|
-
};
|
|
1986
|
-
paddingY: (value: {
|
|
1987
|
-
readonly [$$PropertyValue]: "padding";
|
|
1988
|
-
}) => {
|
|
1989
|
-
paddingTop: {
|
|
1990
|
-
readonly [$$PropertyValue]: "padding";
|
|
1991
|
-
};
|
|
1992
|
-
paddingBottom: {
|
|
1993
|
-
readonly [$$PropertyValue]: "padding";
|
|
1994
|
-
};
|
|
1995
|
-
};
|
|
1996
|
-
marginX: (value: {
|
|
1997
|
-
readonly [$$PropertyValue]: "margin";
|
|
1998
|
-
}) => {
|
|
1999
|
-
marginLeft: {
|
|
2000
|
-
readonly [$$PropertyValue]: "margin";
|
|
2001
|
-
};
|
|
2002
|
-
marginRight: {
|
|
2003
|
-
readonly [$$PropertyValue]: "margin";
|
|
2004
|
-
};
|
|
2005
|
-
};
|
|
2006
|
-
marginY: (value: {
|
|
2007
|
-
readonly [$$PropertyValue]: "margin";
|
|
2008
|
-
}) => {
|
|
2009
|
-
marginTop: {
|
|
2010
|
-
readonly [$$PropertyValue]: "margin";
|
|
2011
|
-
};
|
|
2012
|
-
marginBottom: {
|
|
2013
|
-
readonly [$$PropertyValue]: "margin";
|
|
2014
|
-
};
|
|
2015
|
-
};
|
|
2016
|
-
square: (value: {
|
|
2017
|
-
readonly [$$PropertyValue]: "width";
|
|
2018
|
-
}) => {
|
|
2019
|
-
width: {
|
|
2020
|
-
readonly [$$PropertyValue]: "width";
|
|
2021
|
-
};
|
|
2022
|
-
height: {
|
|
2023
|
-
readonly [$$PropertyValue]: "width";
|
|
2024
|
-
};
|
|
2025
|
-
};
|
|
2026
|
-
_hover: (css: _stitches_react_types_css_util.CSSProperties) => {
|
|
2027
|
-
'&:hover, &[data-hovered]': _stitches_react_types_css_util.CSSProperties;
|
|
2028
|
-
};
|
|
2029
|
-
}>>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<(props: _ariakit_react.GroupProps<"div">) => react.ReactElement<any, string | react.JSXElementConstructor<any>>, {}, {}>;
|
|
281
|
+
declare const StyledGroup: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<(props: _ariakit_react.GroupProps<"div">) => react.ReactElement<any, string | react.JSXElementConstructor<any>>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<(props: _ariakit_react.GroupProps<"div">) => react.ReactElement<any, string | react.JSXElementConstructor<any>>, {}, {}>;
|
|
2030
282
|
declare type StyledGroupProps = StrictComponentProps<typeof StyledGroup>;
|
|
2031
283
|
|
|
2032
|
-
|
|
2033
|
-
|
|
2034
|
-
declare const Group: react__default.ForwardRefExoticComponent<Omit<GroupProps, "ref"> & react__default.RefAttributes<HTMLDivElement>>;
|
|
284
|
+
declare type GroupProps = StyledGroupProps;
|
|
285
|
+
declare const Group: react__default.ForwardRefExoticComponent<Omit<StyledGroupProps, "ref"> & react__default.RefAttributes<HTMLDivElement>>;
|
|
2035
286
|
|
|
2036
|
-
declare const StyledGroupLabel: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<
|
|
2037
|
-
'border-widths': {
|
|
2038
|
-
readonly none: 0;
|
|
2039
|
-
readonly sm: "1px";
|
|
2040
|
-
readonly md: "2px";
|
|
2041
|
-
readonly lg: "4px";
|
|
2042
|
-
};
|
|
2043
|
-
colors: {
|
|
2044
|
-
readonly black: any;
|
|
2045
|
-
readonly 'blue-100': any;
|
|
2046
|
-
readonly 'blue-200': any;
|
|
2047
|
-
readonly 'blue-300': any;
|
|
2048
|
-
readonly 'blue-400': any;
|
|
2049
|
-
readonly 'blue-500': any;
|
|
2050
|
-
readonly 'blue-600': any;
|
|
2051
|
-
readonly 'blue-700': any;
|
|
2052
|
-
readonly 'blue-800': any;
|
|
2053
|
-
readonly 'blue-900': any;
|
|
2054
|
-
readonly 'blue-1000': any;
|
|
2055
|
-
readonly 'gray-100': any;
|
|
2056
|
-
readonly 'gray-200': any;
|
|
2057
|
-
readonly 'gray-300': any;
|
|
2058
|
-
readonly 'gray-400': any;
|
|
2059
|
-
readonly 'gray-500': any;
|
|
2060
|
-
readonly 'gray-600': any;
|
|
2061
|
-
readonly 'gray-700': any;
|
|
2062
|
-
readonly 'gray-800': any;
|
|
2063
|
-
readonly 'gray-900': any;
|
|
2064
|
-
readonly 'green-100': any;
|
|
2065
|
-
readonly 'green-200': any;
|
|
2066
|
-
readonly 'green-300': any;
|
|
2067
|
-
readonly 'green-400': any;
|
|
2068
|
-
readonly 'green-500': any;
|
|
2069
|
-
readonly 'green-600': any;
|
|
2070
|
-
readonly 'green-700': any;
|
|
2071
|
-
readonly 'green-800': any;
|
|
2072
|
-
readonly 'green-900': any;
|
|
2073
|
-
readonly 'indigo-100': any;
|
|
2074
|
-
readonly 'indigo-200': any;
|
|
2075
|
-
readonly 'indigo-300': any;
|
|
2076
|
-
readonly 'indigo-400': any;
|
|
2077
|
-
readonly 'indigo-500': any;
|
|
2078
|
-
readonly 'indigo-600': any;
|
|
2079
|
-
readonly 'indigo-700': any;
|
|
2080
|
-
readonly 'indigo-800': any;
|
|
2081
|
-
readonly 'indigo-900': any;
|
|
2082
|
-
readonly 'red-100': any;
|
|
2083
|
-
readonly 'red-200': any;
|
|
2084
|
-
readonly 'red-300': any;
|
|
2085
|
-
readonly 'red-400': any;
|
|
2086
|
-
readonly 'red-500': any;
|
|
2087
|
-
readonly 'red-600': any;
|
|
2088
|
-
readonly 'red-700': any;
|
|
2089
|
-
readonly 'red-800': any;
|
|
2090
|
-
readonly 'red-900': any;
|
|
2091
|
-
readonly transparent: any;
|
|
2092
|
-
readonly white: any;
|
|
2093
|
-
readonly 'yellow-100': any;
|
|
2094
|
-
readonly 'yellow-200': any;
|
|
2095
|
-
readonly 'yellow-300': any;
|
|
2096
|
-
readonly 'yellow-400': any;
|
|
2097
|
-
readonly 'yellow-500': any;
|
|
2098
|
-
readonly 'yellow-600': any;
|
|
2099
|
-
readonly 'yellow-700': any;
|
|
2100
|
-
readonly 'yellow-800': any;
|
|
2101
|
-
readonly 'yellow-900': any;
|
|
2102
|
-
"background-alpha-active"?: any;
|
|
2103
|
-
"background-alpha-hover"?: any;
|
|
2104
|
-
"background-danger-prominent"?: any;
|
|
2105
|
-
"background-danger-prominent-active"?: any;
|
|
2106
|
-
"background-danger-prominent-hover"?: any;
|
|
2107
|
-
"background-danger-subtle"?: any;
|
|
2108
|
-
"background-danger-subtle-active"?: any;
|
|
2109
|
-
"background-danger-subtle-hover"?: any;
|
|
2110
|
-
"background-neutrals"?: any;
|
|
2111
|
-
"background-neutrals-active"?: any;
|
|
2112
|
-
"background-neutrals-container"?: any;
|
|
2113
|
-
"background-neutrals-controls-disabled"?: any;
|
|
2114
|
-
"background-neutrals-disabled"?: any;
|
|
2115
|
-
"background-neutrals-hover"?: any;
|
|
2116
|
-
"background-neutrals-inactive"?: any;
|
|
2117
|
-
"background-neutrals-inactive-hover"?: any;
|
|
2118
|
-
"background-neutrals-inverted"?: any;
|
|
2119
|
-
"background-neutrals-inverted-subtle"?: any;
|
|
2120
|
-
"background-neutrals-page"?: any;
|
|
2121
|
-
"background-neutrals-page-subtle"?: any;
|
|
2122
|
-
"background-neutrals-scrolls"?: any;
|
|
2123
|
-
"background-neutrals-scrolls-expanded"?: any;
|
|
2124
|
-
"background-neutrals-scrolls-hover"?: any;
|
|
2125
|
-
"background-neutrals-scrolls-pressed"?: any;
|
|
2126
|
-
"background-neutrals-scrolls-pressed-hover"?: any;
|
|
2127
|
-
"background-neutrals-subtle"?: any;
|
|
2128
|
-
"background-neutrals-subtle-active"?: any;
|
|
2129
|
-
"background-neutrals-subtle-hover"?: any;
|
|
2130
|
-
"background-primary-prominent"?: any;
|
|
2131
|
-
"background-primary-prominent-active"?: any;
|
|
2132
|
-
"background-primary-prominent-expanded"?: any;
|
|
2133
|
-
"background-primary-prominent-hover"?: any;
|
|
2134
|
-
"background-primary-prominent-pressed"?: any;
|
|
2135
|
-
"background-primary-prominent-pressed-hover"?: any;
|
|
2136
|
-
"background-primary-prominent-selected"?: any;
|
|
2137
|
-
"background-primary-subtle"?: any;
|
|
2138
|
-
"background-primary-subtle-active"?: any;
|
|
2139
|
-
"background-primary-subtle-expanded"?: any;
|
|
2140
|
-
"background-primary-subtle-hover"?: any;
|
|
2141
|
-
"background-primary-subtle-pressed"?: any;
|
|
2142
|
-
"background-primary-subtle-pressed-hover"?: any;
|
|
2143
|
-
"background-primary-subtle-selected"?: any;
|
|
2144
|
-
"background-success"?: any;
|
|
2145
|
-
"background-success-prominent"?: any;
|
|
2146
|
-
"background-success-prominent-active"?: any;
|
|
2147
|
-
"background-success-prominent-hover"?: any;
|
|
2148
|
-
"background-warning-prominent"?: any;
|
|
2149
|
-
"background-warning-subtle"?: any;
|
|
2150
|
-
"border-danger"?: any;
|
|
2151
|
-
"border-danger-active"?: any;
|
|
2152
|
-
"border-danger-hover"?: any;
|
|
2153
|
-
"border-focus-inner"?: any;
|
|
2154
|
-
"border-focus-middle"?: any;
|
|
2155
|
-
"border-focus-outer"?: any;
|
|
2156
|
-
"border-neutrals"?: any;
|
|
2157
|
-
"border-neutrals-active"?: any;
|
|
2158
|
-
"border-neutrals-controls"?: any;
|
|
2159
|
-
"border-neutrals-controls-disabled"?: any;
|
|
2160
|
-
"border-neutrals-disabled"?: any;
|
|
2161
|
-
"border-neutrals-hover"?: any;
|
|
2162
|
-
"border-neutrals-inverted"?: any;
|
|
2163
|
-
"border-neutrals-subtle"?: any;
|
|
2164
|
-
"border-neutrals-text"?: any;
|
|
2165
|
-
"border-neutrals-text-active"?: any;
|
|
2166
|
-
"border-neutrals-text-hover"?: any;
|
|
2167
|
-
"border-neutrals-text-subtle"?: any;
|
|
2168
|
-
"border-neutrals-text-subtle-active"?: any;
|
|
2169
|
-
"border-neutrals-text-subtle-hover"?: any;
|
|
2170
|
-
"border-neutrals-transparent"?: any;
|
|
2171
|
-
"border-primary"?: any;
|
|
2172
|
-
"border-primary-active"?: any;
|
|
2173
|
-
"border-primary-hover"?: any;
|
|
2174
|
-
"border-primary-inverted"?: any;
|
|
2175
|
-
"border-success"?: any;
|
|
2176
|
-
"border-success-active"?: any;
|
|
2177
|
-
"border-success-hover"?: any;
|
|
2178
|
-
"border-warning"?: any;
|
|
2179
|
-
"icon-danger"?: any;
|
|
2180
|
-
"icon-danger-active"?: any;
|
|
2181
|
-
"icon-danger-hover"?: any;
|
|
2182
|
-
"icon-danger-inverted"?: any;
|
|
2183
|
-
"icon-neutrals"?: any;
|
|
2184
|
-
"icon-neutrals-disabled"?: any;
|
|
2185
|
-
"icon-neutrals-inactive"?: any;
|
|
2186
|
-
"icon-neutrals-inactive-hover"?: any;
|
|
2187
|
-
"icon-neutrals-inverted"?: any;
|
|
2188
|
-
"icon-neutrals-search"?: any;
|
|
2189
|
-
"icon-neutrals-subtle"?: any;
|
|
2190
|
-
"icon-neutrals-text"?: any;
|
|
2191
|
-
"icon-primary"?: any;
|
|
2192
|
-
"icon-primary-active"?: any;
|
|
2193
|
-
"icon-primary-hover"?: any;
|
|
2194
|
-
"icon-primary-inverted"?: any;
|
|
2195
|
-
"icon-primary-selected"?: any;
|
|
2196
|
-
"icon-success"?: any;
|
|
2197
|
-
"icon-success-active"?: any;
|
|
2198
|
-
"icon-success-hover"?: any;
|
|
2199
|
-
"icon-success-inverted"?: any;
|
|
2200
|
-
"icon-warning"?: any;
|
|
2201
|
-
"icon-warning-prominent"?: any;
|
|
2202
|
-
"icon-warning-subtle"?: any;
|
|
2203
|
-
"text-danger"?: any;
|
|
2204
|
-
"text-danger-active"?: any;
|
|
2205
|
-
"text-danger-hover"?: any;
|
|
2206
|
-
"text-danger-inverted"?: any;
|
|
2207
|
-
"text-neutrals"?: any;
|
|
2208
|
-
"text-neutrals-active"?: any;
|
|
2209
|
-
"text-neutrals-disabled"?: any;
|
|
2210
|
-
"text-neutrals-hover"?: any;
|
|
2211
|
-
"text-neutrals-inverted"?: any;
|
|
2212
|
-
"text-neutrals-placeholder"?: any;
|
|
2213
|
-
"text-neutrals-placeholder-only"?: any;
|
|
2214
|
-
"text-neutrals-subtle"?: any;
|
|
2215
|
-
"text-neutrals-subtle-active"?: any;
|
|
2216
|
-
"text-neutrals-subtle-hover"?: any;
|
|
2217
|
-
"text-primary"?: any;
|
|
2218
|
-
"text-primary-active"?: any;
|
|
2219
|
-
"text-primary-hover"?: any;
|
|
2220
|
-
"text-primary-inverted"?: any;
|
|
2221
|
-
"text-primary-inverted-subtle"?: any;
|
|
2222
|
-
"text-primary-selected"?: any;
|
|
2223
|
-
"text-success"?: any;
|
|
2224
|
-
"text-success-active"?: any;
|
|
2225
|
-
"text-success-hover"?: any;
|
|
2226
|
-
"text-success-inverted"?: any;
|
|
2227
|
-
"text-warning"?: any;
|
|
2228
|
-
"text-warning-subtle"?: any;
|
|
2229
|
-
};
|
|
2230
|
-
'font-sizes': {
|
|
2231
|
-
readonly 150: "0.75rem";
|
|
2232
|
-
readonly 175: "0.875rem";
|
|
2233
|
-
readonly 200: "1rem";
|
|
2234
|
-
readonly 225: "1.125rem";
|
|
2235
|
-
readonly 250: "1.25rem";
|
|
2236
|
-
readonly 300: "1.5rem";
|
|
2237
|
-
readonly 400: "2rem";
|
|
2238
|
-
readonly 500: "2.5rem";
|
|
2239
|
-
readonly 600: "3rem";
|
|
2240
|
-
readonly 800: "4rem";
|
|
2241
|
-
readonly 900: "4.5rem";
|
|
2242
|
-
};
|
|
2243
|
-
fonts: {
|
|
2244
|
-
readonly heading: "Roobert, sans-serif";
|
|
2245
|
-
readonly body: "Open Sans, sans-serif";
|
|
2246
|
-
};
|
|
2247
|
-
radii: {
|
|
2248
|
-
readonly none: 0;
|
|
2249
|
-
readonly half: "999em";
|
|
2250
|
-
readonly 25: "2px";
|
|
2251
|
-
readonly 50: "4px";
|
|
2252
|
-
readonly 75: "6px";
|
|
2253
|
-
readonly 100: "8px";
|
|
2254
|
-
readonly 200: "16px";
|
|
2255
|
-
};
|
|
2256
|
-
shadows: {
|
|
2257
|
-
readonly 'focus-small': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-inner";
|
|
2258
|
-
readonly 'focus-small-outline': "0 0 0 2px $colors$border-focus-outer, inset 0 0 0 1px $colors$border-focus-middle, inset 0 0 0 2px $colors$border-focus-inner";
|
|
2259
|
-
readonly 'focus-large': "0 0 0 4px $colors$border-focus-inner, inset 0 0 0 2px $colors$border-focus-middle, inset 0 0 0 3px $colors$border-focus-outer";
|
|
2260
|
-
readonly 'focus-controls': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-focus-middle, 0 0 0 5px $colors$border-focus-outer";
|
|
2261
|
-
readonly 'focus-controls-error': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$border-danger, 0 0 0 5px $colors$background-danger-subtle-hover";
|
|
2262
|
-
readonly 'focus-controls-success': "0 0 0 1px $colors$border-focus-inner, 0 0 0 3px $colors$background-success-prominent, 0 0 0 5px $colors$background-success";
|
|
2263
|
-
};
|
|
2264
|
-
sizes: {
|
|
2265
|
-
readonly number: string;
|
|
2266
|
-
readonly 'icon-200': "16px";
|
|
2267
|
-
readonly 'icon-300': "24px";
|
|
2268
|
-
readonly 'icon-400': "32px";
|
|
2269
|
-
};
|
|
2270
|
-
space: {
|
|
2271
|
-
readonly 0: "0px";
|
|
2272
|
-
readonly 25: "2px";
|
|
2273
|
-
readonly 50: "4px";
|
|
2274
|
-
readonly 100: "8px";
|
|
2275
|
-
readonly 150: "12px";
|
|
2276
|
-
readonly 200: "16px";
|
|
2277
|
-
readonly 300: "24px";
|
|
2278
|
-
readonly 400: "32px";
|
|
2279
|
-
readonly 500: "40px";
|
|
2280
|
-
readonly 600: "48px";
|
|
2281
|
-
readonly 700: "56px";
|
|
2282
|
-
readonly 800: "64px";
|
|
2283
|
-
readonly 1200: "96px";
|
|
2284
|
-
readonly 1600: "128px";
|
|
2285
|
-
};
|
|
2286
|
-
'space-gap': {
|
|
2287
|
-
readonly 0: any;
|
|
2288
|
-
readonly 50: any;
|
|
2289
|
-
readonly 100: any;
|
|
2290
|
-
readonly 200: any;
|
|
2291
|
-
readonly 300: any;
|
|
2292
|
-
};
|
|
2293
|
-
'space-inset': {
|
|
2294
|
-
readonly 0: any;
|
|
2295
|
-
readonly 50: any;
|
|
2296
|
-
readonly 100: any;
|
|
2297
|
-
readonly 150: any;
|
|
2298
|
-
readonly 200: any;
|
|
2299
|
-
readonly 300: any;
|
|
2300
|
-
readonly 400: any;
|
|
2301
|
-
readonly 500: any;
|
|
2302
|
-
readonly 600: any;
|
|
2303
|
-
readonly 700: any;
|
|
2304
|
-
readonly 800: any;
|
|
2305
|
-
readonly 1200: any;
|
|
2306
|
-
readonly 1600: any;
|
|
2307
|
-
};
|
|
2308
|
-
'space-offset': {
|
|
2309
|
-
readonly 0: any;
|
|
2310
|
-
readonly 50: any;
|
|
2311
|
-
readonly 100: any;
|
|
2312
|
-
readonly 150: any;
|
|
2313
|
-
readonly 200: any;
|
|
2314
|
-
readonly 300: any;
|
|
2315
|
-
readonly 400: any;
|
|
2316
|
-
readonly 600: any;
|
|
2317
|
-
readonly 800: any;
|
|
2318
|
-
readonly 1200: any;
|
|
2319
|
-
readonly 1600: any;
|
|
2320
|
-
readonly 'stacking-0': any;
|
|
2321
|
-
readonly 'stacking-100': any;
|
|
2322
|
-
readonly 'stacking-200': any;
|
|
2323
|
-
readonly 'stacking-300': any;
|
|
2324
|
-
readonly 'stacking-400': any;
|
|
2325
|
-
readonly 'stacking-500': any;
|
|
2326
|
-
readonly 'stacking-800': any;
|
|
2327
|
-
};
|
|
2328
|
-
'stroke-width': {
|
|
2329
|
-
readonly thin: "1.5px";
|
|
2330
|
-
readonly normal: "2px";
|
|
2331
|
-
readonly bold: "4px";
|
|
2332
|
-
};
|
|
2333
|
-
'z-indices': {
|
|
2334
|
-
readonly dropdownMenu: 100;
|
|
2335
|
-
readonly select: 200;
|
|
2336
|
-
readonly popover: 300;
|
|
2337
|
-
readonly tooltip: 400;
|
|
2338
|
-
};
|
|
2339
|
-
}, {
|
|
2340
|
-
readonly background: "colors";
|
|
2341
|
-
readonly backgroundColor: "colors";
|
|
2342
|
-
readonly backgroundImage: "colors";
|
|
2343
|
-
readonly blockSize: "sizes";
|
|
2344
|
-
readonly border: "colors";
|
|
2345
|
-
readonly borderBlock: "colors";
|
|
2346
|
-
readonly borderBlockEnd: "colors";
|
|
2347
|
-
readonly borderBlockStart: "colors";
|
|
2348
|
-
readonly borderBottom: "colors";
|
|
2349
|
-
readonly borderBottomColor: "colors";
|
|
2350
|
-
readonly borderBottomLeftRadius: "radii";
|
|
2351
|
-
readonly borderBottomRightRadius: "radii";
|
|
2352
|
-
readonly borderBottomStyle: "border-styles";
|
|
2353
|
-
readonly borderBottomWidth: "border-widths";
|
|
2354
|
-
readonly borderColor: "colors";
|
|
2355
|
-
readonly borderImage: "colors";
|
|
2356
|
-
readonly borderInline: "colors";
|
|
2357
|
-
readonly borderInlineEnd: "colors";
|
|
2358
|
-
readonly borderInlineStart: "colors";
|
|
2359
|
-
readonly borderLeft: "colors";
|
|
2360
|
-
readonly borderLeftColor: "colors";
|
|
2361
|
-
readonly borderLeftStyle: "border-styles";
|
|
2362
|
-
readonly borderLeftWidth: "border-widths";
|
|
2363
|
-
readonly borderRadius: "radii";
|
|
2364
|
-
readonly borderRight: "colors";
|
|
2365
|
-
readonly borderRightColor: "colors";
|
|
2366
|
-
readonly borderRightStyle: "border-styles";
|
|
2367
|
-
readonly borderRightWidth: "border-widths";
|
|
2368
|
-
readonly borderSpacing: "space-offset";
|
|
2369
|
-
readonly borderStyle: "border-styles";
|
|
2370
|
-
readonly borderTop: "colors";
|
|
2371
|
-
readonly borderTopColor: "colors";
|
|
2372
|
-
readonly borderTopLeftRadius: "radii";
|
|
2373
|
-
readonly borderTopRightRadius: "radii";
|
|
2374
|
-
readonly borderTopStyle: "border-styles";
|
|
2375
|
-
readonly borderTopWidth: "border-widths";
|
|
2376
|
-
readonly borderWidth: "border-widths";
|
|
2377
|
-
readonly bottom: "space";
|
|
2378
|
-
readonly boxShadow: "shadows";
|
|
2379
|
-
readonly caretColor: "colors";
|
|
2380
|
-
readonly color: "colors";
|
|
2381
|
-
readonly columnGap: "space-gap";
|
|
2382
|
-
readonly columnRuleColor: "colors";
|
|
2383
|
-
readonly fill: "colors";
|
|
2384
|
-
readonly flexBasis: "sizes";
|
|
2385
|
-
readonly fontFamily: "fonts";
|
|
2386
|
-
readonly fontSize: "font-sizes";
|
|
2387
|
-
readonly fontWeight: "font-weights";
|
|
2388
|
-
readonly gap: "space-gap";
|
|
2389
|
-
readonly gridColumnGap: "space-gap";
|
|
2390
|
-
readonly gridGap: "space-gap";
|
|
2391
|
-
readonly gridRowGap: "space-gap";
|
|
2392
|
-
readonly gridTemplateColumns: "sizes";
|
|
2393
|
-
readonly gridTemplateRows: "sizes";
|
|
2394
|
-
readonly height: "sizes";
|
|
2395
|
-
readonly inlineSize: "sizes";
|
|
2396
|
-
readonly inset: "space-inset";
|
|
2397
|
-
readonly insetBlock: "space-inset";
|
|
2398
|
-
readonly insetBlockEnd: "space-inset";
|
|
2399
|
-
readonly insetBlockStart: "space-inset";
|
|
2400
|
-
readonly insetInline: "space-inset";
|
|
2401
|
-
readonly insetInlineEnd: "space-inset";
|
|
2402
|
-
readonly insetInlineStart: "space-inset";
|
|
2403
|
-
readonly left: "space";
|
|
2404
|
-
readonly letterSpacing: "letter-spacings";
|
|
2405
|
-
readonly lineHeight: "line-heights";
|
|
2406
|
-
readonly margin: "space-offset";
|
|
2407
|
-
readonly marginBlock: "space-offset";
|
|
2408
|
-
readonly marginBlockEnd: "space-offset";
|
|
2409
|
-
readonly marginBlockStart: "space-offset";
|
|
2410
|
-
readonly marginBottom: "space-offset";
|
|
2411
|
-
readonly marginInline: "space-offset";
|
|
2412
|
-
readonly marginInlineEnd: "space-offset";
|
|
2413
|
-
readonly marginInlineStart: "space-offset";
|
|
2414
|
-
readonly marginLeft: "space-offset";
|
|
2415
|
-
readonly marginRight: "space-offset";
|
|
2416
|
-
readonly marginTop: "space-offset";
|
|
2417
|
-
readonly maxBlockSize: "sizes";
|
|
2418
|
-
readonly maxHeight: "sizes";
|
|
2419
|
-
readonly maxInlineSize: "sizes";
|
|
2420
|
-
readonly maxWidth: "sizes";
|
|
2421
|
-
readonly minBlockSize: "sizes";
|
|
2422
|
-
readonly minHeight: "sizes";
|
|
2423
|
-
readonly minInlineSize: "sizes";
|
|
2424
|
-
readonly minWidth: "sizes";
|
|
2425
|
-
readonly outline: "colors";
|
|
2426
|
-
readonly outlineColor: "colors";
|
|
2427
|
-
readonly padding: "space-inset";
|
|
2428
|
-
readonly paddingBlock: "space-inset";
|
|
2429
|
-
readonly paddingBlockEnd: "space-inset";
|
|
2430
|
-
readonly paddingBlockStart: "space-inset";
|
|
2431
|
-
readonly paddingBottom: "space-inset";
|
|
2432
|
-
readonly paddingInline: "space-inset";
|
|
2433
|
-
readonly paddingInlineEnd: "space-inset";
|
|
2434
|
-
readonly paddingInlineStart: "space-inset";
|
|
2435
|
-
readonly paddingLeft: "space-inset";
|
|
2436
|
-
readonly paddingRight: "space-inset";
|
|
2437
|
-
readonly paddingTop: "space-inset";
|
|
2438
|
-
readonly right: "space";
|
|
2439
|
-
readonly rowGap: "space-gap";
|
|
2440
|
-
readonly scrollMargin: "space-offset";
|
|
2441
|
-
readonly scrollMarginBlock: "space-offset";
|
|
2442
|
-
readonly scrollMarginBlockEnd: "space-offset";
|
|
2443
|
-
readonly scrollMarginBlockStart: "space-offset";
|
|
2444
|
-
readonly scrollMarginBottom: "space-offset";
|
|
2445
|
-
readonly scrollMarginInline: "space-offset";
|
|
2446
|
-
readonly scrollMarginInlineEnd: "space-offset";
|
|
2447
|
-
readonly scrollMarginInlineStart: "space-offset";
|
|
2448
|
-
readonly scrollMarginLeft: "space-offset";
|
|
2449
|
-
readonly scrollMarginRight: "space-offset";
|
|
2450
|
-
readonly scrollMarginTop: "space-offset";
|
|
2451
|
-
readonly scrollPadding: "space-inset";
|
|
2452
|
-
readonly scrollPaddingBlock: "space-inset";
|
|
2453
|
-
readonly scrollPaddingBlockEnd: "space-inset";
|
|
2454
|
-
readonly scrollPaddingBlockStart: "space-inset";
|
|
2455
|
-
readonly scrollPaddingBottom: "space-inset";
|
|
2456
|
-
readonly scrollPaddingInline: "space-inset";
|
|
2457
|
-
readonly scrollPaddingInlineEnd: "space-inset";
|
|
2458
|
-
readonly scrollPaddingInlineStart: "space-inset";
|
|
2459
|
-
readonly scrollPaddingLeft: "space-inset";
|
|
2460
|
-
readonly scrollPaddingRight: "space-inset";
|
|
2461
|
-
readonly scrollPaddingTop: "space-inset";
|
|
2462
|
-
readonly stroke: "colors";
|
|
2463
|
-
readonly strokeWidth: "stroke-width";
|
|
2464
|
-
readonly textDecorationColor: "colors";
|
|
2465
|
-
readonly textShadow: "shadows";
|
|
2466
|
-
readonly top: "space";
|
|
2467
|
-
readonly transition: "transitions";
|
|
2468
|
-
readonly width: "sizes";
|
|
2469
|
-
readonly zIndex: "z-indices";
|
|
2470
|
-
}, {
|
|
2471
|
-
paddingX: (value: {
|
|
2472
|
-
readonly [$$PropertyValue]: "padding";
|
|
2473
|
-
}) => {
|
|
2474
|
-
paddingLeft: {
|
|
2475
|
-
readonly [$$PropertyValue]: "padding";
|
|
2476
|
-
};
|
|
2477
|
-
paddingRight: {
|
|
2478
|
-
readonly [$$PropertyValue]: "padding";
|
|
2479
|
-
};
|
|
2480
|
-
};
|
|
2481
|
-
paddingY: (value: {
|
|
2482
|
-
readonly [$$PropertyValue]: "padding";
|
|
2483
|
-
}) => {
|
|
2484
|
-
paddingTop: {
|
|
2485
|
-
readonly [$$PropertyValue]: "padding";
|
|
2486
|
-
};
|
|
2487
|
-
paddingBottom: {
|
|
2488
|
-
readonly [$$PropertyValue]: "padding";
|
|
2489
|
-
};
|
|
2490
|
-
};
|
|
2491
|
-
marginX: (value: {
|
|
2492
|
-
readonly [$$PropertyValue]: "margin";
|
|
2493
|
-
}) => {
|
|
2494
|
-
marginLeft: {
|
|
2495
|
-
readonly [$$PropertyValue]: "margin";
|
|
2496
|
-
};
|
|
2497
|
-
marginRight: {
|
|
2498
|
-
readonly [$$PropertyValue]: "margin";
|
|
2499
|
-
};
|
|
2500
|
-
};
|
|
2501
|
-
marginY: (value: {
|
|
2502
|
-
readonly [$$PropertyValue]: "margin";
|
|
2503
|
-
}) => {
|
|
2504
|
-
marginTop: {
|
|
2505
|
-
readonly [$$PropertyValue]: "margin";
|
|
2506
|
-
};
|
|
2507
|
-
marginBottom: {
|
|
2508
|
-
readonly [$$PropertyValue]: "margin";
|
|
2509
|
-
};
|
|
2510
|
-
};
|
|
2511
|
-
square: (value: {
|
|
2512
|
-
readonly [$$PropertyValue]: "width";
|
|
2513
|
-
}) => {
|
|
2514
|
-
width: {
|
|
2515
|
-
readonly [$$PropertyValue]: "width";
|
|
2516
|
-
};
|
|
2517
|
-
height: {
|
|
2518
|
-
readonly [$$PropertyValue]: "width";
|
|
2519
|
-
};
|
|
2520
|
-
};
|
|
2521
|
-
_hover: (css: _stitches_react_types_css_util.CSSProperties) => {
|
|
2522
|
-
'&:hover, &[data-hovered]': _stitches_react_types_css_util.CSSProperties;
|
|
2523
|
-
};
|
|
2524
|
-
}>>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<(props: _ariakit_react.GroupLabelProps<"div">) => react.ReactElement<any, string | react.JSXElementConstructor<any>>, {}, {}>;
|
|
287
|
+
declare const StyledGroupLabel: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<(props: _ariakit_react.GroupLabelProps<"div">) => react.ReactElement<any, string | react.JSXElementConstructor<any>>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<(props: _ariakit_react.GroupLabelProps<"div">) => react.ReactElement<any, string | react.JSXElementConstructor<any>>, {}, {}>;
|
|
2525
288
|
declare type StyledGroupLabelProps = StrictComponentProps<typeof StyledGroupLabel>;
|
|
2526
289
|
|
|
2527
290
|
interface GroupLabelProps extends StyledGroupLabelProps {
|
|
2528
291
|
}
|
|
2529
292
|
declare const GroupLabel: react__default.ForwardRefExoticComponent<Omit<GroupLabelProps, "ref"> & react__default.RefAttributes<HTMLDivElement>>;
|
|
2530
293
|
|
|
2531
|
-
|
|
294
|
+
interface ValueProps {
|
|
295
|
+
/**
|
|
296
|
+
* The label to make the remove button recognizable by the screen readers.
|
|
297
|
+
*/
|
|
298
|
+
unselectAriaLabel: string;
|
|
299
|
+
}
|
|
300
|
+
declare const Value: FC<ValueProps>;
|
|
2532
301
|
|
|
2533
|
-
declare
|
|
302
|
+
declare const StyledSeparator: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {}, {}>;
|
|
303
|
+
declare type StyledSeparatorProps = StrictComponentProps<typeof StyledSeparator>;
|
|
304
|
+
|
|
305
|
+
interface SeparatorProps extends StyledSeparatorProps {
|
|
306
|
+
}
|
|
307
|
+
declare const Separator: react__default.ForwardRefExoticComponent<Omit<SeparatorProps, "ref"> & react__default.RefAttributes<HTMLDivElement>>;
|
|
308
|
+
|
|
309
|
+
declare const StyledComboboxContent: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {}, {}>;
|
|
310
|
+
declare type StyledComboboxProps = ComponentPropsWithRef<typeof StyledComboboxContent>;
|
|
2534
311
|
|
|
2535
312
|
interface ComboboxProps$1 extends FormElementProps {
|
|
2536
313
|
open?: boolean;
|
|
2537
314
|
defaultOpen?: boolean;
|
|
2538
|
-
|
|
2539
|
-
|
|
2540
|
-
|
|
315
|
+
onOpen?: () => void;
|
|
316
|
+
onClose?: () => void;
|
|
317
|
+
value?: string[];
|
|
318
|
+
defaultValue?: string[];
|
|
319
|
+
onValueChange?: (value: string[]) => void;
|
|
320
|
+
onSearchValueChange?: (value: string) => void;
|
|
2541
321
|
direction?: Direction;
|
|
322
|
+
autoFilter?: boolean;
|
|
323
|
+
noResultsText?: ReactNode;
|
|
2542
324
|
}
|
|
2543
325
|
declare type ComboboxProviderProps = ComboboxProps$1;
|
|
2544
326
|
|
|
2545
|
-
interface ComboboxProps extends ComboboxProviderProps {
|
|
327
|
+
interface ComboboxProps extends ComboboxProviderProps, StyledComboboxProps {
|
|
2546
328
|
/**
|
|
2547
329
|
* The value of the combobox when initially rendered. Use when you do not need
|
|
2548
330
|
* to control the state of the combobox.
|
|
2549
331
|
*/
|
|
2550
|
-
defaultValue?: string;
|
|
332
|
+
defaultValue?: string[];
|
|
2551
333
|
/**
|
|
2552
334
|
* The controlled value of the combobox. Should be used in conjunction with
|
|
2553
335
|
* onValueChange.
|
|
2554
336
|
*/
|
|
2555
|
-
value?: string;
|
|
337
|
+
value?: string[];
|
|
2556
338
|
/**
|
|
2557
339
|
* Event handler called when the value changes.
|
|
2558
340
|
*/
|
|
2559
|
-
onValueChange?: (value: string) => void;
|
|
341
|
+
onValueChange?: (value: string[]) => void;
|
|
342
|
+
/**
|
|
343
|
+
* Event handler called when the trigger input value changes.
|
|
344
|
+
*/
|
|
345
|
+
onSearchValueChange?: (value: string) => void;
|
|
2560
346
|
/**
|
|
2561
347
|
* The open state of the combobox when it is initially rendered. Use when you do
|
|
2562
348
|
* not need to control its open state.
|
|
@@ -2587,6 +373,20 @@ interface ComboboxProps extends ComboboxProviderProps {
|
|
|
2587
373
|
* The content of the combobox
|
|
2588
374
|
*/
|
|
2589
375
|
children?: react__default.ReactNode;
|
|
376
|
+
/**
|
|
377
|
+
* Enables/disabled automatic filtering.
|
|
378
|
+
* @default true
|
|
379
|
+
*/
|
|
380
|
+
autoFilter?: boolean;
|
|
381
|
+
/**
|
|
382
|
+
* Text that is displayed when there are no items to display.
|
|
383
|
+
*/
|
|
384
|
+
noResultsText: ReactNode;
|
|
385
|
+
/**
|
|
386
|
+
* The name of the combobox. Submitted with its owning form as part of a
|
|
387
|
+
* name/value pair.
|
|
388
|
+
*/
|
|
389
|
+
name?: string;
|
|
2590
390
|
}
|
|
2591
391
|
declare const Combobox: react__default.ForwardRefExoticComponent<ComboboxProps> & Partials;
|
|
2592
392
|
interface Partials {
|
|
@@ -2597,6 +397,7 @@ interface Partials {
|
|
|
2597
397
|
Group: typeof Group;
|
|
2598
398
|
GroupLabel: typeof GroupLabel;
|
|
2599
399
|
Value: typeof Value;
|
|
400
|
+
Separator: typeof Separator;
|
|
2600
401
|
}
|
|
2601
402
|
|
|
2602
|
-
export { Combobox, ComboboxProps };
|
|
403
|
+
export { Combobox, ContentProps as ComboboxContentProps, GroupLabelProps as ComboboxGroupLabelProps, GroupProps as ComboboxGroupProps, ItemProps as ComboboxItemProps, PortalProps as ComboboxPortalProps, ComboboxProps, SeparatorProps as ComboboxSeparatorProps, TriggerProps as ComboboxTriggerProps, types as ComboboxTypes, ValueProps as ComboboxValueProps };
|