@mirohq/design-system-input 0.0.1-input.0 → 0.0.1
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 +589 -70
- package/dist/main.js.map +1 -1
- package/dist/module.js +591 -73
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +2165 -67
- package/package.json +11 -4
package/dist/types.d.ts
CHANGED
|
@@ -1,13 +1,1970 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import react__default, { ComponentPropsWithRef, DOMAttributes, HTMLProps } from 'react';
|
|
1
3
|
import * as _mirohq_design_system_stitches from '@mirohq/design-system-stitches';
|
|
2
4
|
import * as _stitches_react_types_styled_component from '@stitches/react/types/styled-component';
|
|
3
5
|
import * as _stitches_react_types_css_util from '@stitches/react/types/css-util';
|
|
4
|
-
import * as
|
|
5
|
-
import * as
|
|
6
|
-
import * as
|
|
7
|
-
import
|
|
8
|
-
import
|
|
6
|
+
import * as _mirohq_design_system_components_primitive from '@mirohq/design-system-components/primitive';
|
|
7
|
+
import * as _mirohq_design_system_primitive from '@mirohq/design-system-primitive';
|
|
8
|
+
import * as packages_components_internal_base_button_src_base_button from 'packages/components/internal/base-button/src/base-button';
|
|
9
|
+
import * as _mirohq_design_system_hooks_use_press from '@mirohq/design-system-hooks/use-press';
|
|
10
|
+
import { Booleanish } from '@mirohq/design-system-types';
|
|
9
11
|
|
|
10
|
-
declare const
|
|
12
|
+
declare const StyledIconSlot: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<_stitches_react_types_styled_component.StyledComponent<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {}, {}, _stitches_react_types_css_util.CSS<{}, {
|
|
13
|
+
'border-widths': {
|
|
14
|
+
readonly none: 0;
|
|
15
|
+
readonly sm: "1px";
|
|
16
|
+
readonly md: "2px";
|
|
17
|
+
readonly lg: "4px";
|
|
18
|
+
};
|
|
19
|
+
colors: {
|
|
20
|
+
readonly black: any;
|
|
21
|
+
readonly 'blue-100': any;
|
|
22
|
+
readonly 'blue-200': any;
|
|
23
|
+
readonly 'blue-300': any;
|
|
24
|
+
readonly 'blue-400': any;
|
|
25
|
+
readonly 'blue-500': any;
|
|
26
|
+
readonly 'blue-600': any;
|
|
27
|
+
readonly 'blue-700': any;
|
|
28
|
+
readonly 'blue-800': any;
|
|
29
|
+
readonly 'blue-900': any;
|
|
30
|
+
readonly 'blue-1000': any;
|
|
31
|
+
readonly 'gray-100': any;
|
|
32
|
+
readonly 'gray-200': any;
|
|
33
|
+
readonly 'gray-300': any;
|
|
34
|
+
readonly 'gray-400': any;
|
|
35
|
+
readonly 'gray-500': any;
|
|
36
|
+
readonly 'gray-600': any;
|
|
37
|
+
readonly 'gray-700': any;
|
|
38
|
+
readonly 'gray-800': any;
|
|
39
|
+
readonly 'gray-900': any;
|
|
40
|
+
readonly 'green-100': any;
|
|
41
|
+
readonly 'green-200': any;
|
|
42
|
+
readonly 'green-300': any;
|
|
43
|
+
readonly 'green-400': any;
|
|
44
|
+
readonly 'green-500': any;
|
|
45
|
+
readonly 'green-600': any;
|
|
46
|
+
readonly 'green-700': any;
|
|
47
|
+
readonly 'green-800': any;
|
|
48
|
+
readonly 'green-900': any;
|
|
49
|
+
readonly 'indigo-100': any;
|
|
50
|
+
readonly 'indigo-200': any;
|
|
51
|
+
readonly 'indigo-300': any;
|
|
52
|
+
readonly 'indigo-400': any;
|
|
53
|
+
readonly 'indigo-500': any;
|
|
54
|
+
readonly 'indigo-600': any;
|
|
55
|
+
readonly 'indigo-700': any;
|
|
56
|
+
readonly 'indigo-800': any;
|
|
57
|
+
readonly 'indigo-900': any;
|
|
58
|
+
readonly 'red-100': any;
|
|
59
|
+
readonly 'red-200': any;
|
|
60
|
+
readonly 'red-300': any;
|
|
61
|
+
readonly 'red-400': any;
|
|
62
|
+
readonly 'red-500': any;
|
|
63
|
+
readonly 'red-600': any;
|
|
64
|
+
readonly 'red-700': any;
|
|
65
|
+
readonly 'red-800': any;
|
|
66
|
+
readonly 'red-900': any;
|
|
67
|
+
readonly transparent: any;
|
|
68
|
+
readonly white: any;
|
|
69
|
+
readonly 'yellow-100': any;
|
|
70
|
+
readonly 'yellow-200': any;
|
|
71
|
+
readonly 'yellow-300': any;
|
|
72
|
+
readonly 'yellow-400': any;
|
|
73
|
+
readonly 'yellow-500': any;
|
|
74
|
+
readonly 'yellow-600': any;
|
|
75
|
+
readonly 'yellow-700': any;
|
|
76
|
+
readonly 'yellow-800': any;
|
|
77
|
+
readonly 'yellow-900': any;
|
|
78
|
+
"background-alpha-active"?: any;
|
|
79
|
+
"background-alpha-hover"?: any;
|
|
80
|
+
"background-danger-prominent"?: any;
|
|
81
|
+
"background-danger-prominent-active"?: any;
|
|
82
|
+
"background-danger-prominent-hover"?: any;
|
|
83
|
+
"background-danger-subtle"?: any;
|
|
84
|
+
"background-danger-subtle-active"?: any;
|
|
85
|
+
"background-danger-subtle-hover"?: any;
|
|
86
|
+
"background-neutrals"?: any;
|
|
87
|
+
"background-neutrals-active"?: any;
|
|
88
|
+
"background-neutrals-container"?: any;
|
|
89
|
+
"background-neutrals-controls-disabled"?: any;
|
|
90
|
+
"background-neutrals-disabled"?: any;
|
|
91
|
+
"background-neutrals-hover"?: any;
|
|
92
|
+
"background-neutrals-inactive"?: any;
|
|
93
|
+
"background-neutrals-inactive-hover"?: any;
|
|
94
|
+
"background-neutrals-inverted"?: any;
|
|
95
|
+
"background-neutrals-inverted-subtle"?: any;
|
|
96
|
+
"background-neutrals-page"?: any;
|
|
97
|
+
"background-neutrals-page-subtle"?: any;
|
|
98
|
+
"background-neutrals-scrolls"?: any;
|
|
99
|
+
"background-neutrals-scrolls-expanded"?: any;
|
|
100
|
+
"background-neutrals-scrolls-hover"?: any;
|
|
101
|
+
"background-neutrals-scrolls-pressed"?: any;
|
|
102
|
+
"background-neutrals-scrolls-pressed-hover"?: any;
|
|
103
|
+
"background-neutrals-subtle"?: any;
|
|
104
|
+
"background-neutrals-subtle-active"?: any;
|
|
105
|
+
"background-neutrals-subtle-hover"?: any;
|
|
106
|
+
"background-primary-prominent"?: any;
|
|
107
|
+
"background-primary-prominent-active"?: any;
|
|
108
|
+
"background-primary-prominent-expanded"?: any;
|
|
109
|
+
"background-primary-prominent-hover"?: any;
|
|
110
|
+
"background-primary-prominent-pressed"?: any;
|
|
111
|
+
"background-primary-prominent-pressed-hover"?: any;
|
|
112
|
+
"background-primary-prominent-selected"?: any;
|
|
113
|
+
"background-primary-subtle"?: any;
|
|
114
|
+
"background-primary-subtle-active"?: any;
|
|
115
|
+
"background-primary-subtle-expanded"?: any;
|
|
116
|
+
"background-primary-subtle-hover"?: any;
|
|
117
|
+
"background-primary-subtle-pressed"?: any;
|
|
118
|
+
"background-primary-subtle-pressed-hover"?: any;
|
|
119
|
+
"background-primary-subtle-selected"?: any;
|
|
120
|
+
"background-success"?: any;
|
|
121
|
+
"background-success-prominent"?: any;
|
|
122
|
+
"background-success-prominent-active"?: any;
|
|
123
|
+
"background-success-prominent-hover"?: any;
|
|
124
|
+
"background-warning-prominent"?: any;
|
|
125
|
+
"background-warning-subtle"?: any;
|
|
126
|
+
"border-danger"?: any;
|
|
127
|
+
"border-danger-active"?: any;
|
|
128
|
+
"border-danger-hover"?: any;
|
|
129
|
+
"border-focus-inner"?: any;
|
|
130
|
+
"border-focus-middle"?: any;
|
|
131
|
+
"border-focus-outer"?: any;
|
|
132
|
+
"border-neutrals"?: any;
|
|
133
|
+
"border-neutrals-active"?: any;
|
|
134
|
+
"border-neutrals-controls"?: any;
|
|
135
|
+
"border-neutrals-controls-disabled"?: any;
|
|
136
|
+
"border-neutrals-disabled"?: any;
|
|
137
|
+
"border-neutrals-hover"?: any;
|
|
138
|
+
"border-neutrals-inverted"?: any;
|
|
139
|
+
"border-neutrals-subtle"?: any;
|
|
140
|
+
"border-neutrals-text"?: any;
|
|
141
|
+
"border-neutrals-text-active"?: any;
|
|
142
|
+
"border-neutrals-text-hover"?: any;
|
|
143
|
+
"border-neutrals-text-subtle"?: any;
|
|
144
|
+
"border-neutrals-text-subtle-active"?: any;
|
|
145
|
+
"border-neutrals-text-subtle-hover"?: any;
|
|
146
|
+
"border-neutrals-transparent"?: any;
|
|
147
|
+
"border-primary"?: any;
|
|
148
|
+
"border-primary-active"?: any;
|
|
149
|
+
"border-primary-hover"?: any;
|
|
150
|
+
"border-primary-inverted"?: any;
|
|
151
|
+
"border-success"?: any;
|
|
152
|
+
"border-success-active"?: any;
|
|
153
|
+
"border-success-hover"?: any;
|
|
154
|
+
"border-warning"?: any;
|
|
155
|
+
"icon-danger"?: any;
|
|
156
|
+
"icon-danger-active"?: any;
|
|
157
|
+
"icon-danger-hover"?: any;
|
|
158
|
+
"icon-danger-inverted"?: any;
|
|
159
|
+
"icon-neutrals"?: any;
|
|
160
|
+
"icon-neutrals-disabled"?: any;
|
|
161
|
+
"icon-neutrals-inactive"?: any;
|
|
162
|
+
"icon-neutrals-inactive-hover"?: any;
|
|
163
|
+
"icon-neutrals-inverted"?: any;
|
|
164
|
+
"icon-neutrals-search"?: any;
|
|
165
|
+
"icon-neutrals-subtle"?: any;
|
|
166
|
+
"icon-neutrals-text"?: any;
|
|
167
|
+
"icon-primary"?: any;
|
|
168
|
+
"icon-primary-active"?: any;
|
|
169
|
+
"icon-primary-hover"?: any;
|
|
170
|
+
"icon-primary-inverted"?: any;
|
|
171
|
+
"icon-primary-selected"?: any;
|
|
172
|
+
"icon-success"?: any;
|
|
173
|
+
"icon-success-active"?: any;
|
|
174
|
+
"icon-success-hover"?: any;
|
|
175
|
+
"icon-success-inverted"?: any;
|
|
176
|
+
"icon-warning"?: any;
|
|
177
|
+
"icon-warning-prominent"?: any;
|
|
178
|
+
"icon-warning-subtle"?: any;
|
|
179
|
+
"text-danger"?: any;
|
|
180
|
+
"text-danger-active"?: any;
|
|
181
|
+
"text-danger-hover"?: any;
|
|
182
|
+
"text-danger-inverted"?: any;
|
|
183
|
+
"text-neutrals"?: any;
|
|
184
|
+
"text-neutrals-active"?: any;
|
|
185
|
+
"text-neutrals-disabled"?: any;
|
|
186
|
+
"text-neutrals-hover"?: any;
|
|
187
|
+
"text-neutrals-inverted"?: any;
|
|
188
|
+
"text-neutrals-placeholder"?: any;
|
|
189
|
+
"text-neutrals-placeholder-only"?: any;
|
|
190
|
+
"text-neutrals-subtle"?: any;
|
|
191
|
+
"text-neutrals-subtle-active"?: any;
|
|
192
|
+
"text-neutrals-subtle-hover"?: any;
|
|
193
|
+
"text-primary"?: any;
|
|
194
|
+
"text-primary-active"?: any;
|
|
195
|
+
"text-primary-hover"?: any;
|
|
196
|
+
"text-primary-inverted"?: any;
|
|
197
|
+
"text-primary-inverted-subtle"?: any;
|
|
198
|
+
"text-primary-selected"?: any;
|
|
199
|
+
"text-success"?: any;
|
|
200
|
+
"text-success-active"?: any;
|
|
201
|
+
"text-success-hover"?: any;
|
|
202
|
+
"text-success-inverted"?: any;
|
|
203
|
+
"text-warning"?: any;
|
|
204
|
+
"text-warning-subtle"?: any;
|
|
205
|
+
};
|
|
206
|
+
'font-sizes': {
|
|
207
|
+
readonly 150: "0.75rem";
|
|
208
|
+
readonly 175: "0.875rem";
|
|
209
|
+
readonly 200: "1rem";
|
|
210
|
+
readonly 225: "1.125rem";
|
|
211
|
+
readonly 250: "1.25rem";
|
|
212
|
+
readonly 300: "1.5rem";
|
|
213
|
+
readonly 400: "2rem";
|
|
214
|
+
readonly 500: "2.5rem";
|
|
215
|
+
readonly 600: "3rem";
|
|
216
|
+
readonly 800: "4rem";
|
|
217
|
+
readonly 900: "4.5rem";
|
|
218
|
+
};
|
|
219
|
+
fonts: {
|
|
220
|
+
readonly heading: "Roobert, sans-serif";
|
|
221
|
+
readonly body: "Open Sans, sans-serif";
|
|
222
|
+
};
|
|
223
|
+
radii: {
|
|
224
|
+
readonly none: 0;
|
|
225
|
+
readonly half: "999em";
|
|
226
|
+
readonly 25: "2px";
|
|
227
|
+
readonly 50: "4px";
|
|
228
|
+
readonly 75: "6px";
|
|
229
|
+
readonly 100: "8px";
|
|
230
|
+
readonly 200: "16px";
|
|
231
|
+
};
|
|
232
|
+
shadows: {
|
|
233
|
+
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";
|
|
234
|
+
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";
|
|
235
|
+
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";
|
|
236
|
+
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";
|
|
237
|
+
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";
|
|
238
|
+
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";
|
|
239
|
+
};
|
|
240
|
+
sizes: {
|
|
241
|
+
readonly number: string;
|
|
242
|
+
readonly 'icon-200': "16px";
|
|
243
|
+
readonly 'icon-300': "24px";
|
|
244
|
+
readonly 'icon-400': "32px";
|
|
245
|
+
};
|
|
246
|
+
space: {
|
|
247
|
+
readonly 0: "0px";
|
|
248
|
+
readonly 25: "2px";
|
|
249
|
+
readonly 50: "4px";
|
|
250
|
+
readonly 100: "8px";
|
|
251
|
+
readonly 150: "12px";
|
|
252
|
+
readonly 200: "16px";
|
|
253
|
+
readonly 300: "24px";
|
|
254
|
+
readonly 400: "32px";
|
|
255
|
+
readonly 500: "40px";
|
|
256
|
+
readonly 600: "48px";
|
|
257
|
+
readonly 700: "56px";
|
|
258
|
+
readonly 800: "64px";
|
|
259
|
+
readonly 1200: "96px";
|
|
260
|
+
readonly 1600: "128px";
|
|
261
|
+
};
|
|
262
|
+
'space-gap': {
|
|
263
|
+
readonly 0: any;
|
|
264
|
+
readonly 50: any;
|
|
265
|
+
readonly 100: any;
|
|
266
|
+
readonly 200: any;
|
|
267
|
+
readonly 300: any;
|
|
268
|
+
};
|
|
269
|
+
'space-inset': {
|
|
270
|
+
readonly 0: any;
|
|
271
|
+
readonly 50: any;
|
|
272
|
+
readonly 100: any;
|
|
273
|
+
readonly 150: any;
|
|
274
|
+
readonly 200: any;
|
|
275
|
+
readonly 300: any;
|
|
276
|
+
readonly 400: any;
|
|
277
|
+
readonly 500: any;
|
|
278
|
+
readonly 600: any;
|
|
279
|
+
readonly 700: any;
|
|
280
|
+
readonly 800: any;
|
|
281
|
+
readonly 1200: any;
|
|
282
|
+
readonly 1600: any;
|
|
283
|
+
};
|
|
284
|
+
'space-offset': {
|
|
285
|
+
readonly 0: any;
|
|
286
|
+
readonly 50: any;
|
|
287
|
+
readonly 100: any;
|
|
288
|
+
readonly 150: any;
|
|
289
|
+
readonly 200: any;
|
|
290
|
+
readonly 300: any;
|
|
291
|
+
readonly 400: any;
|
|
292
|
+
readonly 600: any;
|
|
293
|
+
readonly 800: any;
|
|
294
|
+
readonly 1200: any;
|
|
295
|
+
readonly 1600: any;
|
|
296
|
+
readonly 'stacking-0': any;
|
|
297
|
+
readonly 'stacking-100': any;
|
|
298
|
+
readonly 'stacking-200': any;
|
|
299
|
+
readonly 'stacking-300': any;
|
|
300
|
+
readonly 'stacking-400': any;
|
|
301
|
+
readonly 'stacking-500': any;
|
|
302
|
+
readonly 'stacking-800': any;
|
|
303
|
+
};
|
|
304
|
+
'stroke-width': {
|
|
305
|
+
readonly thin: "1.5px";
|
|
306
|
+
readonly normal: "2px";
|
|
307
|
+
readonly bold: "4px";
|
|
308
|
+
};
|
|
309
|
+
'z-indices': {
|
|
310
|
+
readonly dropdownMenu: 100;
|
|
311
|
+
readonly select: 200;
|
|
312
|
+
readonly popover: 300;
|
|
313
|
+
readonly tooltip: 400;
|
|
314
|
+
};
|
|
315
|
+
}, {
|
|
316
|
+
readonly background: "colors";
|
|
317
|
+
readonly backgroundColor: "colors";
|
|
318
|
+
readonly backgroundImage: "colors";
|
|
319
|
+
readonly blockSize: "sizes";
|
|
320
|
+
readonly border: "colors";
|
|
321
|
+
readonly borderBlock: "colors";
|
|
322
|
+
readonly borderBlockEnd: "colors";
|
|
323
|
+
readonly borderBlockStart: "colors";
|
|
324
|
+
readonly borderBottom: "colors";
|
|
325
|
+
readonly borderBottomColor: "colors";
|
|
326
|
+
readonly borderBottomLeftRadius: "radii";
|
|
327
|
+
readonly borderBottomRightRadius: "radii";
|
|
328
|
+
readonly borderBottomStyle: "border-styles";
|
|
329
|
+
readonly borderBottomWidth: "border-widths";
|
|
330
|
+
readonly borderColor: "colors";
|
|
331
|
+
readonly borderImage: "colors";
|
|
332
|
+
readonly borderInline: "colors";
|
|
333
|
+
readonly borderInlineEnd: "colors";
|
|
334
|
+
readonly borderInlineStart: "colors";
|
|
335
|
+
readonly borderLeft: "colors";
|
|
336
|
+
readonly borderLeftColor: "colors";
|
|
337
|
+
readonly borderLeftStyle: "border-styles";
|
|
338
|
+
readonly borderLeftWidth: "border-widths";
|
|
339
|
+
readonly borderRadius: "radii";
|
|
340
|
+
readonly borderRight: "colors";
|
|
341
|
+
readonly borderRightColor: "colors";
|
|
342
|
+
readonly borderRightStyle: "border-styles";
|
|
343
|
+
readonly borderRightWidth: "border-widths";
|
|
344
|
+
readonly borderSpacing: "space-offset";
|
|
345
|
+
readonly borderStyle: "border-styles";
|
|
346
|
+
readonly borderTop: "colors";
|
|
347
|
+
readonly borderTopColor: "colors";
|
|
348
|
+
readonly borderTopLeftRadius: "radii";
|
|
349
|
+
readonly borderTopRightRadius: "radii";
|
|
350
|
+
readonly borderTopStyle: "border-styles";
|
|
351
|
+
readonly borderTopWidth: "border-widths";
|
|
352
|
+
readonly borderWidth: "border-widths";
|
|
353
|
+
readonly bottom: "space";
|
|
354
|
+
readonly boxShadow: "shadows";
|
|
355
|
+
readonly caretColor: "colors";
|
|
356
|
+
readonly color: "colors";
|
|
357
|
+
readonly columnGap: "space-gap";
|
|
358
|
+
readonly columnRuleColor: "colors";
|
|
359
|
+
readonly fill: "colors";
|
|
360
|
+
readonly flexBasis: "sizes";
|
|
361
|
+
readonly fontFamily: "fonts";
|
|
362
|
+
readonly fontSize: "font-sizes";
|
|
363
|
+
readonly fontWeight: "font-weights";
|
|
364
|
+
readonly gap: "space-gap";
|
|
365
|
+
readonly gridColumnGap: "space-gap";
|
|
366
|
+
readonly gridGap: "space-gap";
|
|
367
|
+
readonly gridRowGap: "space-gap";
|
|
368
|
+
readonly gridTemplateColumns: "sizes";
|
|
369
|
+
readonly gridTemplateRows: "sizes";
|
|
370
|
+
readonly height: "sizes";
|
|
371
|
+
readonly inlineSize: "sizes";
|
|
372
|
+
readonly inset: "space-inset";
|
|
373
|
+
readonly insetBlock: "space-inset";
|
|
374
|
+
readonly insetBlockEnd: "space-inset";
|
|
375
|
+
readonly insetBlockStart: "space-inset";
|
|
376
|
+
readonly insetInline: "space-inset";
|
|
377
|
+
readonly insetInlineEnd: "space-inset";
|
|
378
|
+
readonly insetInlineStart: "space-inset";
|
|
379
|
+
readonly left: "space";
|
|
380
|
+
readonly letterSpacing: "letter-spacings";
|
|
381
|
+
readonly lineHeight: "line-heights";
|
|
382
|
+
readonly margin: "space-offset";
|
|
383
|
+
readonly marginBlock: "space-offset";
|
|
384
|
+
readonly marginBlockEnd: "space-offset";
|
|
385
|
+
readonly marginBlockStart: "space-offset";
|
|
386
|
+
readonly marginBottom: "space-offset";
|
|
387
|
+
readonly marginInline: "space-offset";
|
|
388
|
+
readonly marginInlineEnd: "space-offset";
|
|
389
|
+
readonly marginInlineStart: "space-offset";
|
|
390
|
+
readonly marginLeft: "space-offset";
|
|
391
|
+
readonly marginRight: "space-offset";
|
|
392
|
+
readonly marginTop: "space-offset";
|
|
393
|
+
readonly maxBlockSize: "sizes";
|
|
394
|
+
readonly maxHeight: "sizes";
|
|
395
|
+
readonly maxInlineSize: "sizes";
|
|
396
|
+
readonly maxWidth: "sizes";
|
|
397
|
+
readonly minBlockSize: "sizes";
|
|
398
|
+
readonly minHeight: "sizes";
|
|
399
|
+
readonly minInlineSize: "sizes";
|
|
400
|
+
readonly minWidth: "sizes";
|
|
401
|
+
readonly outline: "colors";
|
|
402
|
+
readonly outlineColor: "colors";
|
|
403
|
+
readonly padding: "space-inset";
|
|
404
|
+
readonly paddingBlock: "space-inset";
|
|
405
|
+
readonly paddingBlockEnd: "space-inset";
|
|
406
|
+
readonly paddingBlockStart: "space-inset";
|
|
407
|
+
readonly paddingBottom: "space-inset";
|
|
408
|
+
readonly paddingInline: "space-inset";
|
|
409
|
+
readonly paddingInlineEnd: "space-inset";
|
|
410
|
+
readonly paddingInlineStart: "space-inset";
|
|
411
|
+
readonly paddingLeft: "space-inset";
|
|
412
|
+
readonly paddingRight: "space-inset";
|
|
413
|
+
readonly paddingTop: "space-inset";
|
|
414
|
+
readonly right: "space";
|
|
415
|
+
readonly rowGap: "space-gap";
|
|
416
|
+
readonly scrollMargin: "space-offset";
|
|
417
|
+
readonly scrollMarginBlock: "space-offset";
|
|
418
|
+
readonly scrollMarginBlockEnd: "space-offset";
|
|
419
|
+
readonly scrollMarginBlockStart: "space-offset";
|
|
420
|
+
readonly scrollMarginBottom: "space-offset";
|
|
421
|
+
readonly scrollMarginInline: "space-offset";
|
|
422
|
+
readonly scrollMarginInlineEnd: "space-offset";
|
|
423
|
+
readonly scrollMarginInlineStart: "space-offset";
|
|
424
|
+
readonly scrollMarginLeft: "space-offset";
|
|
425
|
+
readonly scrollMarginRight: "space-offset";
|
|
426
|
+
readonly scrollMarginTop: "space-offset";
|
|
427
|
+
readonly scrollPadding: "space-inset";
|
|
428
|
+
readonly scrollPaddingBlock: "space-inset";
|
|
429
|
+
readonly scrollPaddingBlockEnd: "space-inset";
|
|
430
|
+
readonly scrollPaddingBlockStart: "space-inset";
|
|
431
|
+
readonly scrollPaddingBottom: "space-inset";
|
|
432
|
+
readonly scrollPaddingInline: "space-inset";
|
|
433
|
+
readonly scrollPaddingInlineEnd: "space-inset";
|
|
434
|
+
readonly scrollPaddingInlineStart: "space-inset";
|
|
435
|
+
readonly scrollPaddingLeft: "space-inset";
|
|
436
|
+
readonly scrollPaddingRight: "space-inset";
|
|
437
|
+
readonly scrollPaddingTop: "space-inset";
|
|
438
|
+
readonly stroke: "colors";
|
|
439
|
+
readonly strokeWidth: "stroke-width";
|
|
440
|
+
readonly textDecorationColor: "colors";
|
|
441
|
+
readonly textShadow: "shadows";
|
|
442
|
+
readonly top: "space";
|
|
443
|
+
readonly transition: "transitions";
|
|
444
|
+
readonly width: "sizes";
|
|
445
|
+
readonly zIndex: "z-indices";
|
|
446
|
+
}, {
|
|
447
|
+
paddingX: (value: {
|
|
448
|
+
readonly [$$PropertyValue]: "padding";
|
|
449
|
+
}) => {
|
|
450
|
+
paddingLeft: {
|
|
451
|
+
readonly [$$PropertyValue]: "padding";
|
|
452
|
+
};
|
|
453
|
+
paddingRight: {
|
|
454
|
+
readonly [$$PropertyValue]: "padding";
|
|
455
|
+
};
|
|
456
|
+
};
|
|
457
|
+
paddingY: (value: {
|
|
458
|
+
readonly [$$PropertyValue]: "padding";
|
|
459
|
+
}) => {
|
|
460
|
+
paddingTop: {
|
|
461
|
+
readonly [$$PropertyValue]: "padding";
|
|
462
|
+
};
|
|
463
|
+
paddingBottom: {
|
|
464
|
+
readonly [$$PropertyValue]: "padding";
|
|
465
|
+
};
|
|
466
|
+
};
|
|
467
|
+
marginX: (value: {
|
|
468
|
+
readonly [$$PropertyValue]: "margin";
|
|
469
|
+
}) => {
|
|
470
|
+
marginLeft: {
|
|
471
|
+
readonly [$$PropertyValue]: "margin";
|
|
472
|
+
};
|
|
473
|
+
marginRight: {
|
|
474
|
+
readonly [$$PropertyValue]: "margin";
|
|
475
|
+
};
|
|
476
|
+
};
|
|
477
|
+
marginY: (value: {
|
|
478
|
+
readonly [$$PropertyValue]: "margin";
|
|
479
|
+
}) => {
|
|
480
|
+
marginTop: {
|
|
481
|
+
readonly [$$PropertyValue]: "margin";
|
|
482
|
+
};
|
|
483
|
+
marginBottom: {
|
|
484
|
+
readonly [$$PropertyValue]: "margin";
|
|
485
|
+
};
|
|
486
|
+
};
|
|
487
|
+
square: (value: {
|
|
488
|
+
readonly [$$PropertyValue]: "width";
|
|
489
|
+
}) => {
|
|
490
|
+
width: {
|
|
491
|
+
readonly [$$PropertyValue]: "width";
|
|
492
|
+
};
|
|
493
|
+
height: {
|
|
494
|
+
readonly [$$PropertyValue]: "width";
|
|
495
|
+
};
|
|
496
|
+
};
|
|
497
|
+
}>>>, "disabled"> & _stitches_react_types_styled_component.TransformProps<{
|
|
498
|
+
disabled?: boolean | "true" | undefined;
|
|
499
|
+
}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"div">>, {
|
|
500
|
+
disabled?: boolean | "true" | undefined;
|
|
501
|
+
}, {}>;
|
|
502
|
+
declare type StyledIconSlotProps = ComponentPropsWithRef<typeof StyledIconSlot>;
|
|
503
|
+
|
|
504
|
+
interface IconSlotProps extends StyledIconSlotProps {
|
|
505
|
+
}
|
|
506
|
+
declare const IconSlot: react__default.ForwardRefExoticComponent<Omit<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<_stitches_react_types_styled_component.StyledComponent<react__default.ForwardRefExoticComponent<_mirohq_design_system_components_primitive.PrimitiveProps<"div">>, {}, {}, _stitches_react_types_css_util.CSS<{}, {
|
|
507
|
+
'border-widths': {
|
|
508
|
+
readonly none: 0;
|
|
509
|
+
readonly sm: "1px";
|
|
510
|
+
readonly md: "2px";
|
|
511
|
+
readonly lg: "4px";
|
|
512
|
+
};
|
|
513
|
+
colors: {
|
|
514
|
+
readonly black: any;
|
|
515
|
+
readonly 'blue-100': any;
|
|
516
|
+
readonly 'blue-200': any;
|
|
517
|
+
readonly 'blue-300': any;
|
|
518
|
+
readonly 'blue-400': any;
|
|
519
|
+
readonly 'blue-500': any;
|
|
520
|
+
readonly 'blue-600': any;
|
|
521
|
+
readonly 'blue-700': any;
|
|
522
|
+
readonly 'blue-800': any;
|
|
523
|
+
readonly 'blue-900': any;
|
|
524
|
+
readonly 'blue-1000': any;
|
|
525
|
+
readonly 'gray-100': any;
|
|
526
|
+
readonly 'gray-200': any;
|
|
527
|
+
readonly 'gray-300': any;
|
|
528
|
+
readonly 'gray-400': any;
|
|
529
|
+
readonly 'gray-500': any;
|
|
530
|
+
readonly 'gray-600': any;
|
|
531
|
+
readonly 'gray-700': any;
|
|
532
|
+
readonly 'gray-800': any;
|
|
533
|
+
readonly 'gray-900': any;
|
|
534
|
+
readonly 'green-100': any;
|
|
535
|
+
readonly 'green-200': any;
|
|
536
|
+
readonly 'green-300': any;
|
|
537
|
+
readonly 'green-400': any;
|
|
538
|
+
readonly 'green-500': any;
|
|
539
|
+
readonly 'green-600': any;
|
|
540
|
+
readonly 'green-700': any;
|
|
541
|
+
readonly 'green-800': any;
|
|
542
|
+
readonly 'green-900': any;
|
|
543
|
+
readonly 'indigo-100': any;
|
|
544
|
+
readonly 'indigo-200': any;
|
|
545
|
+
readonly 'indigo-300': any;
|
|
546
|
+
readonly 'indigo-400': any;
|
|
547
|
+
readonly 'indigo-500': any;
|
|
548
|
+
readonly 'indigo-600': any;
|
|
549
|
+
readonly 'indigo-700': any;
|
|
550
|
+
readonly 'indigo-800': any;
|
|
551
|
+
readonly 'indigo-900': any;
|
|
552
|
+
readonly 'red-100': any;
|
|
553
|
+
readonly 'red-200': any;
|
|
554
|
+
readonly 'red-300': any;
|
|
555
|
+
readonly 'red-400': any;
|
|
556
|
+
readonly 'red-500': any;
|
|
557
|
+
readonly 'red-600': any;
|
|
558
|
+
readonly 'red-700': any;
|
|
559
|
+
readonly 'red-800': any;
|
|
560
|
+
readonly 'red-900': any;
|
|
561
|
+
readonly transparent: any;
|
|
562
|
+
readonly white: any;
|
|
563
|
+
readonly 'yellow-100': any;
|
|
564
|
+
readonly 'yellow-200': any;
|
|
565
|
+
readonly 'yellow-300': any;
|
|
566
|
+
readonly 'yellow-400': any;
|
|
567
|
+
readonly 'yellow-500': any;
|
|
568
|
+
readonly 'yellow-600': any;
|
|
569
|
+
readonly 'yellow-700': any;
|
|
570
|
+
readonly 'yellow-800': any;
|
|
571
|
+
readonly 'yellow-900': any;
|
|
572
|
+
"background-alpha-active"?: any;
|
|
573
|
+
"background-alpha-hover"?: any;
|
|
574
|
+
"background-danger-prominent"?: any;
|
|
575
|
+
"background-danger-prominent-active"?: any;
|
|
576
|
+
"background-danger-prominent-hover"?: any;
|
|
577
|
+
"background-danger-subtle"?: any;
|
|
578
|
+
"background-danger-subtle-active"?: any;
|
|
579
|
+
"background-danger-subtle-hover"?: any;
|
|
580
|
+
"background-neutrals"?: any;
|
|
581
|
+
"background-neutrals-active"?: any;
|
|
582
|
+
"background-neutrals-container"?: any;
|
|
583
|
+
"background-neutrals-controls-disabled"?: any;
|
|
584
|
+
"background-neutrals-disabled"?: any;
|
|
585
|
+
"background-neutrals-hover"?: any;
|
|
586
|
+
"background-neutrals-inactive"?: any;
|
|
587
|
+
"background-neutrals-inactive-hover"?: any;
|
|
588
|
+
"background-neutrals-inverted"?: any;
|
|
589
|
+
"background-neutrals-inverted-subtle"?: any;
|
|
590
|
+
"background-neutrals-page"?: any;
|
|
591
|
+
"background-neutrals-page-subtle"?: any;
|
|
592
|
+
"background-neutrals-scrolls"?: any;
|
|
593
|
+
"background-neutrals-scrolls-expanded"?: any;
|
|
594
|
+
"background-neutrals-scrolls-hover"?: any;
|
|
595
|
+
"background-neutrals-scrolls-pressed"?: any;
|
|
596
|
+
"background-neutrals-scrolls-pressed-hover"?: any;
|
|
597
|
+
"background-neutrals-subtle"?: any;
|
|
598
|
+
"background-neutrals-subtle-active"?: any;
|
|
599
|
+
"background-neutrals-subtle-hover"?: any;
|
|
600
|
+
"background-primary-prominent"?: any;
|
|
601
|
+
"background-primary-prominent-active"?: any;
|
|
602
|
+
"background-primary-prominent-expanded"?: any;
|
|
603
|
+
"background-primary-prominent-hover"?: any;
|
|
604
|
+
"background-primary-prominent-pressed"?: any;
|
|
605
|
+
"background-primary-prominent-pressed-hover"?: any;
|
|
606
|
+
"background-primary-prominent-selected"?: any;
|
|
607
|
+
"background-primary-subtle"?: any;
|
|
608
|
+
"background-primary-subtle-active"?: any;
|
|
609
|
+
"background-primary-subtle-expanded"?: any;
|
|
610
|
+
"background-primary-subtle-hover"?: any;
|
|
611
|
+
"background-primary-subtle-pressed"?: any;
|
|
612
|
+
"background-primary-subtle-pressed-hover"?: any;
|
|
613
|
+
"background-primary-subtle-selected"?: any;
|
|
614
|
+
"background-success"?: any;
|
|
615
|
+
"background-success-prominent"?: any;
|
|
616
|
+
"background-success-prominent-active"?: any;
|
|
617
|
+
"background-success-prominent-hover"?: any;
|
|
618
|
+
"background-warning-prominent"?: any;
|
|
619
|
+
"background-warning-subtle"?: any;
|
|
620
|
+
"border-danger"?: any;
|
|
621
|
+
"border-danger-active"?: any;
|
|
622
|
+
"border-danger-hover"?: any;
|
|
623
|
+
"border-focus-inner"?: any;
|
|
624
|
+
"border-focus-middle"?: any;
|
|
625
|
+
"border-focus-outer"?: any;
|
|
626
|
+
"border-neutrals"?: any;
|
|
627
|
+
"border-neutrals-active"?: any;
|
|
628
|
+
"border-neutrals-controls"?: any;
|
|
629
|
+
"border-neutrals-controls-disabled"?: any;
|
|
630
|
+
"border-neutrals-disabled"?: any;
|
|
631
|
+
"border-neutrals-hover"?: any;
|
|
632
|
+
"border-neutrals-inverted"?: any;
|
|
633
|
+
"border-neutrals-subtle"?: any;
|
|
634
|
+
"border-neutrals-text"?: any;
|
|
635
|
+
"border-neutrals-text-active"?: any;
|
|
636
|
+
"border-neutrals-text-hover"?: any;
|
|
637
|
+
"border-neutrals-text-subtle"?: any;
|
|
638
|
+
"border-neutrals-text-subtle-active"?: any;
|
|
639
|
+
"border-neutrals-text-subtle-hover"?: any;
|
|
640
|
+
"border-neutrals-transparent"?: any;
|
|
641
|
+
"border-primary"?: any;
|
|
642
|
+
"border-primary-active"?: any;
|
|
643
|
+
"border-primary-hover"?: any;
|
|
644
|
+
"border-primary-inverted"?: any;
|
|
645
|
+
"border-success"?: any;
|
|
646
|
+
"border-success-active"?: any;
|
|
647
|
+
"border-success-hover"?: any;
|
|
648
|
+
"border-warning"?: any;
|
|
649
|
+
"icon-danger"?: any;
|
|
650
|
+
"icon-danger-active"?: any;
|
|
651
|
+
"icon-danger-hover"?: any;
|
|
652
|
+
"icon-danger-inverted"?: any;
|
|
653
|
+
"icon-neutrals"?: any;
|
|
654
|
+
"icon-neutrals-disabled"?: any;
|
|
655
|
+
"icon-neutrals-inactive"?: any;
|
|
656
|
+
"icon-neutrals-inactive-hover"?: any;
|
|
657
|
+
"icon-neutrals-inverted"?: any;
|
|
658
|
+
"icon-neutrals-search"?: any;
|
|
659
|
+
"icon-neutrals-subtle"?: any;
|
|
660
|
+
"icon-neutrals-text"?: any;
|
|
661
|
+
"icon-primary"?: any;
|
|
662
|
+
"icon-primary-active"?: any;
|
|
663
|
+
"icon-primary-hover"?: any;
|
|
664
|
+
"icon-primary-inverted"?: any;
|
|
665
|
+
"icon-primary-selected"?: any;
|
|
666
|
+
"icon-success"?: any;
|
|
667
|
+
"icon-success-active"?: any;
|
|
668
|
+
"icon-success-hover"?: any;
|
|
669
|
+
"icon-success-inverted"?: any;
|
|
670
|
+
"icon-warning"?: any;
|
|
671
|
+
"icon-warning-prominent"?: any;
|
|
672
|
+
"icon-warning-subtle"?: any;
|
|
673
|
+
"text-danger"?: any;
|
|
674
|
+
"text-danger-active"?: any;
|
|
675
|
+
"text-danger-hover"?: any;
|
|
676
|
+
"text-danger-inverted"?: any;
|
|
677
|
+
"text-neutrals"?: any;
|
|
678
|
+
"text-neutrals-active"?: any;
|
|
679
|
+
"text-neutrals-disabled"?: any;
|
|
680
|
+
"text-neutrals-hover"?: any;
|
|
681
|
+
"text-neutrals-inverted"?: any;
|
|
682
|
+
"text-neutrals-placeholder"?: any;
|
|
683
|
+
"text-neutrals-placeholder-only"?: any;
|
|
684
|
+
"text-neutrals-subtle"?: any;
|
|
685
|
+
"text-neutrals-subtle-active"?: any;
|
|
686
|
+
"text-neutrals-subtle-hover"?: any;
|
|
687
|
+
"text-primary"?: any;
|
|
688
|
+
"text-primary-active"?: any;
|
|
689
|
+
"text-primary-hover"?: any;
|
|
690
|
+
"text-primary-inverted"?: any;
|
|
691
|
+
"text-primary-inverted-subtle"?: any;
|
|
692
|
+
"text-primary-selected"?: any;
|
|
693
|
+
"text-success"?: any;
|
|
694
|
+
"text-success-active"?: any;
|
|
695
|
+
"text-success-hover"?: any;
|
|
696
|
+
"text-success-inverted"?: any;
|
|
697
|
+
"text-warning"?: any;
|
|
698
|
+
"text-warning-subtle"?: any;
|
|
699
|
+
};
|
|
700
|
+
'font-sizes': {
|
|
701
|
+
readonly 150: "0.75rem";
|
|
702
|
+
readonly 175: "0.875rem";
|
|
703
|
+
readonly 200: "1rem";
|
|
704
|
+
readonly 225: "1.125rem";
|
|
705
|
+
readonly 250: "1.25rem";
|
|
706
|
+
readonly 300: "1.5rem";
|
|
707
|
+
readonly 400: "2rem";
|
|
708
|
+
readonly 500: "2.5rem";
|
|
709
|
+
readonly 600: "3rem";
|
|
710
|
+
readonly 800: "4rem";
|
|
711
|
+
readonly 900: "4.5rem";
|
|
712
|
+
};
|
|
713
|
+
fonts: {
|
|
714
|
+
readonly heading: "Roobert, sans-serif";
|
|
715
|
+
readonly body: "Open Sans, sans-serif";
|
|
716
|
+
};
|
|
717
|
+
radii: {
|
|
718
|
+
readonly none: 0;
|
|
719
|
+
readonly half: "999em";
|
|
720
|
+
readonly 25: "2px";
|
|
721
|
+
readonly 50: "4px";
|
|
722
|
+
readonly 75: "6px";
|
|
723
|
+
readonly 100: "8px";
|
|
724
|
+
readonly 200: "16px";
|
|
725
|
+
};
|
|
726
|
+
shadows: {
|
|
727
|
+
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";
|
|
728
|
+
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";
|
|
729
|
+
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";
|
|
730
|
+
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";
|
|
731
|
+
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";
|
|
732
|
+
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";
|
|
733
|
+
};
|
|
734
|
+
sizes: {
|
|
735
|
+
readonly number: string;
|
|
736
|
+
readonly 'icon-200': "16px";
|
|
737
|
+
readonly 'icon-300': "24px";
|
|
738
|
+
readonly 'icon-400': "32px";
|
|
739
|
+
};
|
|
740
|
+
space: {
|
|
741
|
+
readonly 0: "0px";
|
|
742
|
+
readonly 25: "2px";
|
|
743
|
+
readonly 50: "4px";
|
|
744
|
+
readonly 100: "8px";
|
|
745
|
+
readonly 150: "12px";
|
|
746
|
+
readonly 200: "16px";
|
|
747
|
+
readonly 300: "24px";
|
|
748
|
+
readonly 400: "32px";
|
|
749
|
+
readonly 500: "40px";
|
|
750
|
+
readonly 600: "48px";
|
|
751
|
+
readonly 700: "56px";
|
|
752
|
+
readonly 800: "64px";
|
|
753
|
+
readonly 1200: "96px";
|
|
754
|
+
readonly 1600: "128px";
|
|
755
|
+
};
|
|
756
|
+
'space-gap': {
|
|
757
|
+
readonly 0: any;
|
|
758
|
+
readonly 50: any;
|
|
759
|
+
readonly 100: any;
|
|
760
|
+
readonly 200: any;
|
|
761
|
+
readonly 300: any;
|
|
762
|
+
};
|
|
763
|
+
'space-inset': {
|
|
764
|
+
readonly 0: any;
|
|
765
|
+
readonly 50: any;
|
|
766
|
+
readonly 100: any;
|
|
767
|
+
readonly 150: any;
|
|
768
|
+
readonly 200: any;
|
|
769
|
+
readonly 300: any;
|
|
770
|
+
readonly 400: any;
|
|
771
|
+
readonly 500: any;
|
|
772
|
+
readonly 600: any;
|
|
773
|
+
readonly 700: any;
|
|
774
|
+
readonly 800: any;
|
|
775
|
+
readonly 1200: any;
|
|
776
|
+
readonly 1600: any;
|
|
777
|
+
};
|
|
778
|
+
'space-offset': {
|
|
779
|
+
readonly 0: any;
|
|
780
|
+
readonly 50: any;
|
|
781
|
+
readonly 100: any;
|
|
782
|
+
readonly 150: any;
|
|
783
|
+
readonly 200: any;
|
|
784
|
+
readonly 300: any;
|
|
785
|
+
readonly 400: any;
|
|
786
|
+
readonly 600: any;
|
|
787
|
+
readonly 800: any;
|
|
788
|
+
readonly 1200: any;
|
|
789
|
+
readonly 1600: any;
|
|
790
|
+
readonly 'stacking-0': any;
|
|
791
|
+
readonly 'stacking-100': any;
|
|
792
|
+
readonly 'stacking-200': any;
|
|
793
|
+
readonly 'stacking-300': any;
|
|
794
|
+
readonly 'stacking-400': any;
|
|
795
|
+
readonly 'stacking-500': any;
|
|
796
|
+
readonly 'stacking-800': any;
|
|
797
|
+
};
|
|
798
|
+
'stroke-width': {
|
|
799
|
+
readonly thin: "1.5px";
|
|
800
|
+
readonly normal: "2px";
|
|
801
|
+
readonly bold: "4px";
|
|
802
|
+
};
|
|
803
|
+
'z-indices': {
|
|
804
|
+
readonly dropdownMenu: 100;
|
|
805
|
+
readonly select: 200;
|
|
806
|
+
readonly popover: 300;
|
|
807
|
+
readonly tooltip: 400;
|
|
808
|
+
};
|
|
809
|
+
}, {
|
|
810
|
+
readonly background: "colors";
|
|
811
|
+
readonly backgroundColor: "colors";
|
|
812
|
+
readonly backgroundImage: "colors";
|
|
813
|
+
readonly blockSize: "sizes";
|
|
814
|
+
readonly border: "colors";
|
|
815
|
+
readonly borderBlock: "colors";
|
|
816
|
+
readonly borderBlockEnd: "colors";
|
|
817
|
+
readonly borderBlockStart: "colors";
|
|
818
|
+
readonly borderBottom: "colors";
|
|
819
|
+
readonly borderBottomColor: "colors";
|
|
820
|
+
readonly borderBottomLeftRadius: "radii";
|
|
821
|
+
readonly borderBottomRightRadius: "radii";
|
|
822
|
+
readonly borderBottomStyle: "border-styles";
|
|
823
|
+
readonly borderBottomWidth: "border-widths";
|
|
824
|
+
readonly borderColor: "colors";
|
|
825
|
+
readonly borderImage: "colors";
|
|
826
|
+
readonly borderInline: "colors";
|
|
827
|
+
readonly borderInlineEnd: "colors";
|
|
828
|
+
readonly borderInlineStart: "colors";
|
|
829
|
+
readonly borderLeft: "colors";
|
|
830
|
+
readonly borderLeftColor: "colors";
|
|
831
|
+
readonly borderLeftStyle: "border-styles";
|
|
832
|
+
readonly borderLeftWidth: "border-widths";
|
|
833
|
+
readonly borderRadius: "radii";
|
|
834
|
+
readonly borderRight: "colors";
|
|
835
|
+
readonly borderRightColor: "colors";
|
|
836
|
+
readonly borderRightStyle: "border-styles";
|
|
837
|
+
readonly borderRightWidth: "border-widths";
|
|
838
|
+
readonly borderSpacing: "space-offset";
|
|
839
|
+
readonly borderStyle: "border-styles";
|
|
840
|
+
readonly borderTop: "colors";
|
|
841
|
+
readonly borderTopColor: "colors";
|
|
842
|
+
readonly borderTopLeftRadius: "radii";
|
|
843
|
+
readonly borderTopRightRadius: "radii";
|
|
844
|
+
readonly borderTopStyle: "border-styles";
|
|
845
|
+
readonly borderTopWidth: "border-widths";
|
|
846
|
+
readonly borderWidth: "border-widths";
|
|
847
|
+
readonly bottom: "space";
|
|
848
|
+
readonly boxShadow: "shadows";
|
|
849
|
+
readonly caretColor: "colors";
|
|
850
|
+
readonly color: "colors";
|
|
851
|
+
readonly columnGap: "space-gap";
|
|
852
|
+
readonly columnRuleColor: "colors";
|
|
853
|
+
readonly fill: "colors";
|
|
854
|
+
readonly flexBasis: "sizes";
|
|
855
|
+
readonly fontFamily: "fonts";
|
|
856
|
+
readonly fontSize: "font-sizes";
|
|
857
|
+
readonly fontWeight: "font-weights";
|
|
858
|
+
readonly gap: "space-gap";
|
|
859
|
+
readonly gridColumnGap: "space-gap";
|
|
860
|
+
readonly gridGap: "space-gap";
|
|
861
|
+
readonly gridRowGap: "space-gap";
|
|
862
|
+
readonly gridTemplateColumns: "sizes";
|
|
863
|
+
readonly gridTemplateRows: "sizes";
|
|
864
|
+
readonly height: "sizes";
|
|
865
|
+
readonly inlineSize: "sizes";
|
|
866
|
+
readonly inset: "space-inset";
|
|
867
|
+
readonly insetBlock: "space-inset";
|
|
868
|
+
readonly insetBlockEnd: "space-inset";
|
|
869
|
+
readonly insetBlockStart: "space-inset";
|
|
870
|
+
readonly insetInline: "space-inset";
|
|
871
|
+
readonly insetInlineEnd: "space-inset";
|
|
872
|
+
readonly insetInlineStart: "space-inset";
|
|
873
|
+
readonly left: "space";
|
|
874
|
+
readonly letterSpacing: "letter-spacings";
|
|
875
|
+
readonly lineHeight: "line-heights";
|
|
876
|
+
readonly margin: "space-offset";
|
|
877
|
+
readonly marginBlock: "space-offset";
|
|
878
|
+
readonly marginBlockEnd: "space-offset";
|
|
879
|
+
readonly marginBlockStart: "space-offset";
|
|
880
|
+
readonly marginBottom: "space-offset";
|
|
881
|
+
readonly marginInline: "space-offset";
|
|
882
|
+
readonly marginInlineEnd: "space-offset";
|
|
883
|
+
readonly marginInlineStart: "space-offset";
|
|
884
|
+
readonly marginLeft: "space-offset";
|
|
885
|
+
readonly marginRight: "space-offset";
|
|
886
|
+
readonly marginTop: "space-offset";
|
|
887
|
+
readonly maxBlockSize: "sizes";
|
|
888
|
+
readonly maxHeight: "sizes";
|
|
889
|
+
readonly maxInlineSize: "sizes";
|
|
890
|
+
readonly maxWidth: "sizes";
|
|
891
|
+
readonly minBlockSize: "sizes";
|
|
892
|
+
readonly minHeight: "sizes";
|
|
893
|
+
readonly minInlineSize: "sizes";
|
|
894
|
+
readonly minWidth: "sizes";
|
|
895
|
+
readonly outline: "colors";
|
|
896
|
+
readonly outlineColor: "colors";
|
|
897
|
+
readonly padding: "space-inset";
|
|
898
|
+
readonly paddingBlock: "space-inset";
|
|
899
|
+
readonly paddingBlockEnd: "space-inset";
|
|
900
|
+
readonly paddingBlockStart: "space-inset";
|
|
901
|
+
readonly paddingBottom: "space-inset";
|
|
902
|
+
readonly paddingInline: "space-inset";
|
|
903
|
+
readonly paddingInlineEnd: "space-inset";
|
|
904
|
+
readonly paddingInlineStart: "space-inset";
|
|
905
|
+
readonly paddingLeft: "space-inset";
|
|
906
|
+
readonly paddingRight: "space-inset";
|
|
907
|
+
readonly paddingTop: "space-inset";
|
|
908
|
+
readonly right: "space";
|
|
909
|
+
readonly rowGap: "space-gap";
|
|
910
|
+
readonly scrollMargin: "space-offset";
|
|
911
|
+
readonly scrollMarginBlock: "space-offset";
|
|
912
|
+
readonly scrollMarginBlockEnd: "space-offset";
|
|
913
|
+
readonly scrollMarginBlockStart: "space-offset";
|
|
914
|
+
readonly scrollMarginBottom: "space-offset";
|
|
915
|
+
readonly scrollMarginInline: "space-offset";
|
|
916
|
+
readonly scrollMarginInlineEnd: "space-offset";
|
|
917
|
+
readonly scrollMarginInlineStart: "space-offset";
|
|
918
|
+
readonly scrollMarginLeft: "space-offset";
|
|
919
|
+
readonly scrollMarginRight: "space-offset";
|
|
920
|
+
readonly scrollMarginTop: "space-offset";
|
|
921
|
+
readonly scrollPadding: "space-inset";
|
|
922
|
+
readonly scrollPaddingBlock: "space-inset";
|
|
923
|
+
readonly scrollPaddingBlockEnd: "space-inset";
|
|
924
|
+
readonly scrollPaddingBlockStart: "space-inset";
|
|
925
|
+
readonly scrollPaddingBottom: "space-inset";
|
|
926
|
+
readonly scrollPaddingInline: "space-inset";
|
|
927
|
+
readonly scrollPaddingInlineEnd: "space-inset";
|
|
928
|
+
readonly scrollPaddingInlineStart: "space-inset";
|
|
929
|
+
readonly scrollPaddingLeft: "space-inset";
|
|
930
|
+
readonly scrollPaddingRight: "space-inset";
|
|
931
|
+
readonly scrollPaddingTop: "space-inset";
|
|
932
|
+
readonly stroke: "colors";
|
|
933
|
+
readonly strokeWidth: "stroke-width";
|
|
934
|
+
readonly textDecorationColor: "colors";
|
|
935
|
+
readonly textShadow: "shadows";
|
|
936
|
+
readonly top: "space";
|
|
937
|
+
readonly transition: "transitions";
|
|
938
|
+
readonly width: "sizes";
|
|
939
|
+
readonly zIndex: "z-indices";
|
|
940
|
+
}, {
|
|
941
|
+
paddingX: (value: {
|
|
942
|
+
readonly [$$PropertyValue]: "padding";
|
|
943
|
+
}) => {
|
|
944
|
+
paddingLeft: {
|
|
945
|
+
readonly [$$PropertyValue]: "padding";
|
|
946
|
+
};
|
|
947
|
+
paddingRight: {
|
|
948
|
+
readonly [$$PropertyValue]: "padding";
|
|
949
|
+
};
|
|
950
|
+
};
|
|
951
|
+
paddingY: (value: {
|
|
952
|
+
readonly [$$PropertyValue]: "padding";
|
|
953
|
+
}) => {
|
|
954
|
+
paddingTop: {
|
|
955
|
+
readonly [$$PropertyValue]: "padding";
|
|
956
|
+
};
|
|
957
|
+
paddingBottom: {
|
|
958
|
+
readonly [$$PropertyValue]: "padding";
|
|
959
|
+
};
|
|
960
|
+
};
|
|
961
|
+
marginX: (value: {
|
|
962
|
+
readonly [$$PropertyValue]: "margin";
|
|
963
|
+
}) => {
|
|
964
|
+
marginLeft: {
|
|
965
|
+
readonly [$$PropertyValue]: "margin";
|
|
966
|
+
};
|
|
967
|
+
marginRight: {
|
|
968
|
+
readonly [$$PropertyValue]: "margin";
|
|
969
|
+
};
|
|
970
|
+
};
|
|
971
|
+
marginY: (value: {
|
|
972
|
+
readonly [$$PropertyValue]: "margin";
|
|
973
|
+
}) => {
|
|
974
|
+
marginTop: {
|
|
975
|
+
readonly [$$PropertyValue]: "margin";
|
|
976
|
+
};
|
|
977
|
+
marginBottom: {
|
|
978
|
+
readonly [$$PropertyValue]: "margin";
|
|
979
|
+
};
|
|
980
|
+
};
|
|
981
|
+
square: (value: {
|
|
982
|
+
readonly [$$PropertyValue]: "width";
|
|
983
|
+
}) => {
|
|
984
|
+
width: {
|
|
985
|
+
readonly [$$PropertyValue]: "width";
|
|
986
|
+
};
|
|
987
|
+
height: {
|
|
988
|
+
readonly [$$PropertyValue]: "width";
|
|
989
|
+
};
|
|
990
|
+
};
|
|
991
|
+
}>>>, "disabled"> & _stitches_react_types_styled_component.TransformProps<{
|
|
992
|
+
disabled?: boolean | "true" | undefined;
|
|
993
|
+
}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react__default.RefAttributes<HTMLDivElement>, "ref"> & react__default.RefAttributes<HTMLDivElement>>;
|
|
994
|
+
|
|
995
|
+
declare const StyledActionButton: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<_stitches_react_types_styled_component.StyledComponent<react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<_stitches_react_types_styled_component.StyledComponent<react.ForwardRefExoticComponent<_mirohq_design_system_components_primitive.PrimitiveProps<"button">>, {}, {}, _stitches_react_types_css_util.CSS<{}, {
|
|
996
|
+
'border-widths': {
|
|
997
|
+
readonly none: 0;
|
|
998
|
+
readonly sm: "1px";
|
|
999
|
+
readonly md: "2px";
|
|
1000
|
+
readonly lg: "4px";
|
|
1001
|
+
};
|
|
1002
|
+
colors: {
|
|
1003
|
+
readonly black: any;
|
|
1004
|
+
readonly 'blue-100': any;
|
|
1005
|
+
readonly 'blue-200': any;
|
|
1006
|
+
readonly 'blue-300': any;
|
|
1007
|
+
readonly 'blue-400': any;
|
|
1008
|
+
readonly 'blue-500': any;
|
|
1009
|
+
readonly 'blue-600': any;
|
|
1010
|
+
readonly 'blue-700': any;
|
|
1011
|
+
readonly 'blue-800': any;
|
|
1012
|
+
readonly 'blue-900': any;
|
|
1013
|
+
readonly 'blue-1000': any;
|
|
1014
|
+
readonly 'gray-100': any;
|
|
1015
|
+
readonly 'gray-200': any;
|
|
1016
|
+
readonly 'gray-300': any;
|
|
1017
|
+
readonly 'gray-400': any;
|
|
1018
|
+
readonly 'gray-500': any;
|
|
1019
|
+
readonly 'gray-600': any;
|
|
1020
|
+
readonly 'gray-700': any;
|
|
1021
|
+
readonly 'gray-800': any;
|
|
1022
|
+
readonly 'gray-900': any;
|
|
1023
|
+
readonly 'green-100': any;
|
|
1024
|
+
readonly 'green-200': any;
|
|
1025
|
+
readonly 'green-300': any;
|
|
1026
|
+
readonly 'green-400': any;
|
|
1027
|
+
readonly 'green-500': any;
|
|
1028
|
+
readonly 'green-600': any;
|
|
1029
|
+
readonly 'green-700': any;
|
|
1030
|
+
readonly 'green-800': any;
|
|
1031
|
+
readonly 'green-900': any;
|
|
1032
|
+
readonly 'indigo-100': any;
|
|
1033
|
+
readonly 'indigo-200': any;
|
|
1034
|
+
readonly 'indigo-300': any;
|
|
1035
|
+
readonly 'indigo-400': any;
|
|
1036
|
+
readonly 'indigo-500': any;
|
|
1037
|
+
readonly 'indigo-600': any;
|
|
1038
|
+
readonly 'indigo-700': any;
|
|
1039
|
+
readonly 'indigo-800': any;
|
|
1040
|
+
readonly 'indigo-900': any;
|
|
1041
|
+
readonly 'red-100': any;
|
|
1042
|
+
readonly 'red-200': any;
|
|
1043
|
+
readonly 'red-300': any;
|
|
1044
|
+
readonly 'red-400': any;
|
|
1045
|
+
readonly 'red-500': any;
|
|
1046
|
+
readonly 'red-600': any;
|
|
1047
|
+
readonly 'red-700': any;
|
|
1048
|
+
readonly 'red-800': any;
|
|
1049
|
+
readonly 'red-900': any;
|
|
1050
|
+
readonly transparent: any;
|
|
1051
|
+
readonly white: any;
|
|
1052
|
+
readonly 'yellow-100': any;
|
|
1053
|
+
readonly 'yellow-200': any;
|
|
1054
|
+
readonly 'yellow-300': any;
|
|
1055
|
+
readonly 'yellow-400': any;
|
|
1056
|
+
readonly 'yellow-500': any;
|
|
1057
|
+
readonly 'yellow-600': any;
|
|
1058
|
+
readonly 'yellow-700': any;
|
|
1059
|
+
readonly 'yellow-800': any;
|
|
1060
|
+
readonly 'yellow-900': any;
|
|
1061
|
+
"background-alpha-active"?: any;
|
|
1062
|
+
"background-alpha-hover"?: any;
|
|
1063
|
+
"background-danger-prominent"?: any;
|
|
1064
|
+
"background-danger-prominent-active"?: any;
|
|
1065
|
+
"background-danger-prominent-hover"?: any;
|
|
1066
|
+
"background-danger-subtle"?: any;
|
|
1067
|
+
"background-danger-subtle-active"?: any;
|
|
1068
|
+
"background-danger-subtle-hover"?: any;
|
|
1069
|
+
"background-neutrals"?: any;
|
|
1070
|
+
"background-neutrals-active"?: any;
|
|
1071
|
+
"background-neutrals-container"?: any;
|
|
1072
|
+
"background-neutrals-controls-disabled"?: any;
|
|
1073
|
+
"background-neutrals-disabled"?: any;
|
|
1074
|
+
"background-neutrals-hover"?: any;
|
|
1075
|
+
"background-neutrals-inactive"?: any;
|
|
1076
|
+
"background-neutrals-inactive-hover"?: any;
|
|
1077
|
+
"background-neutrals-inverted"?: any;
|
|
1078
|
+
"background-neutrals-inverted-subtle"?: any;
|
|
1079
|
+
"background-neutrals-page"?: any;
|
|
1080
|
+
"background-neutrals-page-subtle"?: any;
|
|
1081
|
+
"background-neutrals-scrolls"?: any;
|
|
1082
|
+
"background-neutrals-scrolls-expanded"?: any;
|
|
1083
|
+
"background-neutrals-scrolls-hover"?: any;
|
|
1084
|
+
"background-neutrals-scrolls-pressed"?: any;
|
|
1085
|
+
"background-neutrals-scrolls-pressed-hover"?: any;
|
|
1086
|
+
"background-neutrals-subtle"?: any;
|
|
1087
|
+
"background-neutrals-subtle-active"?: any;
|
|
1088
|
+
"background-neutrals-subtle-hover"?: any;
|
|
1089
|
+
"background-primary-prominent"?: any;
|
|
1090
|
+
"background-primary-prominent-active"?: any;
|
|
1091
|
+
"background-primary-prominent-expanded"?: any;
|
|
1092
|
+
"background-primary-prominent-hover"?: any;
|
|
1093
|
+
"background-primary-prominent-pressed"?: any;
|
|
1094
|
+
"background-primary-prominent-pressed-hover"?: any;
|
|
1095
|
+
"background-primary-prominent-selected"?: any;
|
|
1096
|
+
"background-primary-subtle"?: any;
|
|
1097
|
+
"background-primary-subtle-active"?: any;
|
|
1098
|
+
"background-primary-subtle-expanded"?: any;
|
|
1099
|
+
"background-primary-subtle-hover"?: any;
|
|
1100
|
+
"background-primary-subtle-pressed"?: any;
|
|
1101
|
+
"background-primary-subtle-pressed-hover"?: any;
|
|
1102
|
+
"background-primary-subtle-selected"?: any;
|
|
1103
|
+
"background-success"?: any;
|
|
1104
|
+
"background-success-prominent"?: any;
|
|
1105
|
+
"background-success-prominent-active"?: any;
|
|
1106
|
+
"background-success-prominent-hover"?: any;
|
|
1107
|
+
"background-warning-prominent"?: any;
|
|
1108
|
+
"background-warning-subtle"?: any;
|
|
1109
|
+
"border-danger"?: any;
|
|
1110
|
+
"border-danger-active"?: any;
|
|
1111
|
+
"border-danger-hover"?: any;
|
|
1112
|
+
"border-focus-inner"?: any;
|
|
1113
|
+
"border-focus-middle"?: any;
|
|
1114
|
+
"border-focus-outer"?: any;
|
|
1115
|
+
"border-neutrals"?: any;
|
|
1116
|
+
"border-neutrals-active"?: any;
|
|
1117
|
+
"border-neutrals-controls"?: any;
|
|
1118
|
+
"border-neutrals-controls-disabled"?: any;
|
|
1119
|
+
"border-neutrals-disabled"?: any;
|
|
1120
|
+
"border-neutrals-hover"?: any;
|
|
1121
|
+
"border-neutrals-inverted"?: any;
|
|
1122
|
+
"border-neutrals-subtle"?: any;
|
|
1123
|
+
"border-neutrals-text"?: any;
|
|
1124
|
+
"border-neutrals-text-active"?: any;
|
|
1125
|
+
"border-neutrals-text-hover"?: any;
|
|
1126
|
+
"border-neutrals-text-subtle"?: any;
|
|
1127
|
+
"border-neutrals-text-subtle-active"?: any;
|
|
1128
|
+
"border-neutrals-text-subtle-hover"?: any;
|
|
1129
|
+
"border-neutrals-transparent"?: any;
|
|
1130
|
+
"border-primary"?: any;
|
|
1131
|
+
"border-primary-active"?: any;
|
|
1132
|
+
"border-primary-hover"?: any;
|
|
1133
|
+
"border-primary-inverted"?: any;
|
|
1134
|
+
"border-success"?: any;
|
|
1135
|
+
"border-success-active"?: any;
|
|
1136
|
+
"border-success-hover"?: any;
|
|
1137
|
+
"border-warning"?: any;
|
|
1138
|
+
"icon-danger"?: any;
|
|
1139
|
+
"icon-danger-active"?: any;
|
|
1140
|
+
"icon-danger-hover"?: any;
|
|
1141
|
+
"icon-danger-inverted"?: any;
|
|
1142
|
+
"icon-neutrals"?: any;
|
|
1143
|
+
"icon-neutrals-disabled"?: any;
|
|
1144
|
+
"icon-neutrals-inactive"?: any;
|
|
1145
|
+
"icon-neutrals-inactive-hover"?: any;
|
|
1146
|
+
"icon-neutrals-inverted"?: any;
|
|
1147
|
+
"icon-neutrals-search"?: any;
|
|
1148
|
+
"icon-neutrals-subtle"?: any;
|
|
1149
|
+
"icon-neutrals-text"?: any;
|
|
1150
|
+
"icon-primary"?: any;
|
|
1151
|
+
"icon-primary-active"?: any;
|
|
1152
|
+
"icon-primary-hover"?: any;
|
|
1153
|
+
"icon-primary-inverted"?: any;
|
|
1154
|
+
"icon-primary-selected"?: any;
|
|
1155
|
+
"icon-success"?: any;
|
|
1156
|
+
"icon-success-active"?: any;
|
|
1157
|
+
"icon-success-hover"?: any;
|
|
1158
|
+
"icon-success-inverted"?: any;
|
|
1159
|
+
"icon-warning"?: any;
|
|
1160
|
+
"icon-warning-prominent"?: any;
|
|
1161
|
+
"icon-warning-subtle"?: any;
|
|
1162
|
+
"text-danger"?: any;
|
|
1163
|
+
"text-danger-active"?: any;
|
|
1164
|
+
"text-danger-hover"?: any;
|
|
1165
|
+
"text-danger-inverted"?: any;
|
|
1166
|
+
"text-neutrals"?: any;
|
|
1167
|
+
"text-neutrals-active"?: any;
|
|
1168
|
+
"text-neutrals-disabled"?: any;
|
|
1169
|
+
"text-neutrals-hover"?: any;
|
|
1170
|
+
"text-neutrals-inverted"?: any;
|
|
1171
|
+
"text-neutrals-placeholder"?: any;
|
|
1172
|
+
"text-neutrals-placeholder-only"?: any;
|
|
1173
|
+
"text-neutrals-subtle"?: any;
|
|
1174
|
+
"text-neutrals-subtle-active"?: any;
|
|
1175
|
+
"text-neutrals-subtle-hover"?: any;
|
|
1176
|
+
"text-primary"?: any;
|
|
1177
|
+
"text-primary-active"?: any;
|
|
1178
|
+
"text-primary-hover"?: any;
|
|
1179
|
+
"text-primary-inverted"?: any;
|
|
1180
|
+
"text-primary-inverted-subtle"?: any;
|
|
1181
|
+
"text-primary-selected"?: any;
|
|
1182
|
+
"text-success"?: any;
|
|
1183
|
+
"text-success-active"?: any;
|
|
1184
|
+
"text-success-hover"?: any;
|
|
1185
|
+
"text-success-inverted"?: any;
|
|
1186
|
+
"text-warning"?: any;
|
|
1187
|
+
"text-warning-subtle"?: any;
|
|
1188
|
+
};
|
|
1189
|
+
'font-sizes': {
|
|
1190
|
+
readonly 150: "0.75rem";
|
|
1191
|
+
readonly 175: "0.875rem";
|
|
1192
|
+
readonly 200: "1rem";
|
|
1193
|
+
readonly 225: "1.125rem";
|
|
1194
|
+
readonly 250: "1.25rem";
|
|
1195
|
+
readonly 300: "1.5rem";
|
|
1196
|
+
readonly 400: "2rem";
|
|
1197
|
+
readonly 500: "2.5rem";
|
|
1198
|
+
readonly 600: "3rem";
|
|
1199
|
+
readonly 800: "4rem";
|
|
1200
|
+
readonly 900: "4.5rem";
|
|
1201
|
+
};
|
|
1202
|
+
fonts: {
|
|
1203
|
+
readonly heading: "Roobert, sans-serif";
|
|
1204
|
+
readonly body: "Open Sans, sans-serif";
|
|
1205
|
+
};
|
|
1206
|
+
radii: {
|
|
1207
|
+
readonly none: 0;
|
|
1208
|
+
readonly half: "999em";
|
|
1209
|
+
readonly 25: "2px";
|
|
1210
|
+
readonly 50: "4px";
|
|
1211
|
+
readonly 75: "6px";
|
|
1212
|
+
readonly 100: "8px";
|
|
1213
|
+
readonly 200: "16px";
|
|
1214
|
+
};
|
|
1215
|
+
shadows: {
|
|
1216
|
+
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";
|
|
1217
|
+
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";
|
|
1218
|
+
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";
|
|
1219
|
+
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";
|
|
1220
|
+
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";
|
|
1221
|
+
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";
|
|
1222
|
+
};
|
|
1223
|
+
sizes: {
|
|
1224
|
+
readonly number: string;
|
|
1225
|
+
readonly 'icon-200': "16px";
|
|
1226
|
+
readonly 'icon-300': "24px";
|
|
1227
|
+
readonly 'icon-400': "32px";
|
|
1228
|
+
};
|
|
1229
|
+
space: {
|
|
1230
|
+
readonly 0: "0px";
|
|
1231
|
+
readonly 25: "2px";
|
|
1232
|
+
readonly 50: "4px";
|
|
1233
|
+
readonly 100: "8px";
|
|
1234
|
+
readonly 150: "12px";
|
|
1235
|
+
readonly 200: "16px";
|
|
1236
|
+
readonly 300: "24px";
|
|
1237
|
+
readonly 400: "32px";
|
|
1238
|
+
readonly 500: "40px";
|
|
1239
|
+
readonly 600: "48px";
|
|
1240
|
+
readonly 700: "56px";
|
|
1241
|
+
readonly 800: "64px";
|
|
1242
|
+
readonly 1200: "96px";
|
|
1243
|
+
readonly 1600: "128px";
|
|
1244
|
+
};
|
|
1245
|
+
'space-gap': {
|
|
1246
|
+
readonly 0: any;
|
|
1247
|
+
readonly 50: any;
|
|
1248
|
+
readonly 100: any;
|
|
1249
|
+
readonly 200: any;
|
|
1250
|
+
readonly 300: any;
|
|
1251
|
+
};
|
|
1252
|
+
'space-inset': {
|
|
1253
|
+
readonly 0: any;
|
|
1254
|
+
readonly 50: any;
|
|
1255
|
+
readonly 100: any;
|
|
1256
|
+
readonly 150: any;
|
|
1257
|
+
readonly 200: any;
|
|
1258
|
+
readonly 300: any;
|
|
1259
|
+
readonly 400: any;
|
|
1260
|
+
readonly 500: any;
|
|
1261
|
+
readonly 600: any;
|
|
1262
|
+
readonly 700: any;
|
|
1263
|
+
readonly 800: any;
|
|
1264
|
+
readonly 1200: any;
|
|
1265
|
+
readonly 1600: any;
|
|
1266
|
+
};
|
|
1267
|
+
'space-offset': {
|
|
1268
|
+
readonly 0: any;
|
|
1269
|
+
readonly 50: any;
|
|
1270
|
+
readonly 100: any;
|
|
1271
|
+
readonly 150: any;
|
|
1272
|
+
readonly 200: any;
|
|
1273
|
+
readonly 300: any;
|
|
1274
|
+
readonly 400: any;
|
|
1275
|
+
readonly 600: any;
|
|
1276
|
+
readonly 800: any;
|
|
1277
|
+
readonly 1200: any;
|
|
1278
|
+
readonly 1600: any;
|
|
1279
|
+
readonly 'stacking-0': any;
|
|
1280
|
+
readonly 'stacking-100': any;
|
|
1281
|
+
readonly 'stacking-200': any;
|
|
1282
|
+
readonly 'stacking-300': any;
|
|
1283
|
+
readonly 'stacking-400': any;
|
|
1284
|
+
readonly 'stacking-500': any;
|
|
1285
|
+
readonly 'stacking-800': any;
|
|
1286
|
+
};
|
|
1287
|
+
'stroke-width': {
|
|
1288
|
+
readonly thin: "1.5px";
|
|
1289
|
+
readonly normal: "2px";
|
|
1290
|
+
readonly bold: "4px";
|
|
1291
|
+
};
|
|
1292
|
+
'z-indices': {
|
|
1293
|
+
readonly dropdownMenu: 100;
|
|
1294
|
+
readonly select: 200;
|
|
1295
|
+
readonly popover: 300;
|
|
1296
|
+
readonly tooltip: 400;
|
|
1297
|
+
};
|
|
1298
|
+
}, {
|
|
1299
|
+
readonly background: "colors";
|
|
1300
|
+
readonly backgroundColor: "colors";
|
|
1301
|
+
readonly backgroundImage: "colors";
|
|
1302
|
+
readonly blockSize: "sizes";
|
|
1303
|
+
readonly border: "colors";
|
|
1304
|
+
readonly borderBlock: "colors";
|
|
1305
|
+
readonly borderBlockEnd: "colors";
|
|
1306
|
+
readonly borderBlockStart: "colors";
|
|
1307
|
+
readonly borderBottom: "colors";
|
|
1308
|
+
readonly borderBottomColor: "colors";
|
|
1309
|
+
readonly borderBottomLeftRadius: "radii";
|
|
1310
|
+
readonly borderBottomRightRadius: "radii";
|
|
1311
|
+
readonly borderBottomStyle: "border-styles";
|
|
1312
|
+
readonly borderBottomWidth: "border-widths";
|
|
1313
|
+
readonly borderColor: "colors";
|
|
1314
|
+
readonly borderImage: "colors";
|
|
1315
|
+
readonly borderInline: "colors";
|
|
1316
|
+
readonly borderInlineEnd: "colors";
|
|
1317
|
+
readonly borderInlineStart: "colors";
|
|
1318
|
+
readonly borderLeft: "colors";
|
|
1319
|
+
readonly borderLeftColor: "colors";
|
|
1320
|
+
readonly borderLeftStyle: "border-styles";
|
|
1321
|
+
readonly borderLeftWidth: "border-widths";
|
|
1322
|
+
readonly borderRadius: "radii";
|
|
1323
|
+
readonly borderRight: "colors";
|
|
1324
|
+
readonly borderRightColor: "colors";
|
|
1325
|
+
readonly borderRightStyle: "border-styles";
|
|
1326
|
+
readonly borderRightWidth: "border-widths";
|
|
1327
|
+
readonly borderSpacing: "space-offset";
|
|
1328
|
+
readonly borderStyle: "border-styles";
|
|
1329
|
+
readonly borderTop: "colors";
|
|
1330
|
+
readonly borderTopColor: "colors";
|
|
1331
|
+
readonly borderTopLeftRadius: "radii";
|
|
1332
|
+
readonly borderTopRightRadius: "radii";
|
|
1333
|
+
readonly borderTopStyle: "border-styles";
|
|
1334
|
+
readonly borderTopWidth: "border-widths";
|
|
1335
|
+
readonly borderWidth: "border-widths";
|
|
1336
|
+
readonly bottom: "space";
|
|
1337
|
+
readonly boxShadow: "shadows";
|
|
1338
|
+
readonly caretColor: "colors";
|
|
1339
|
+
readonly color: "colors";
|
|
1340
|
+
readonly columnGap: "space-gap";
|
|
1341
|
+
readonly columnRuleColor: "colors";
|
|
1342
|
+
readonly fill: "colors";
|
|
1343
|
+
readonly flexBasis: "sizes";
|
|
1344
|
+
readonly fontFamily: "fonts";
|
|
1345
|
+
readonly fontSize: "font-sizes";
|
|
1346
|
+
readonly fontWeight: "font-weights";
|
|
1347
|
+
readonly gap: "space-gap";
|
|
1348
|
+
readonly gridColumnGap: "space-gap";
|
|
1349
|
+
readonly gridGap: "space-gap";
|
|
1350
|
+
readonly gridRowGap: "space-gap";
|
|
1351
|
+
readonly gridTemplateColumns: "sizes";
|
|
1352
|
+
readonly gridTemplateRows: "sizes";
|
|
1353
|
+
readonly height: "sizes";
|
|
1354
|
+
readonly inlineSize: "sizes";
|
|
1355
|
+
readonly inset: "space-inset";
|
|
1356
|
+
readonly insetBlock: "space-inset";
|
|
1357
|
+
readonly insetBlockEnd: "space-inset";
|
|
1358
|
+
readonly insetBlockStart: "space-inset";
|
|
1359
|
+
readonly insetInline: "space-inset";
|
|
1360
|
+
readonly insetInlineEnd: "space-inset";
|
|
1361
|
+
readonly insetInlineStart: "space-inset";
|
|
1362
|
+
readonly left: "space";
|
|
1363
|
+
readonly letterSpacing: "letter-spacings";
|
|
1364
|
+
readonly lineHeight: "line-heights";
|
|
1365
|
+
readonly margin: "space-offset";
|
|
1366
|
+
readonly marginBlock: "space-offset";
|
|
1367
|
+
readonly marginBlockEnd: "space-offset";
|
|
1368
|
+
readonly marginBlockStart: "space-offset";
|
|
1369
|
+
readonly marginBottom: "space-offset";
|
|
1370
|
+
readonly marginInline: "space-offset";
|
|
1371
|
+
readonly marginInlineEnd: "space-offset";
|
|
1372
|
+
readonly marginInlineStart: "space-offset";
|
|
1373
|
+
readonly marginLeft: "space-offset";
|
|
1374
|
+
readonly marginRight: "space-offset";
|
|
1375
|
+
readonly marginTop: "space-offset";
|
|
1376
|
+
readonly maxBlockSize: "sizes";
|
|
1377
|
+
readonly maxHeight: "sizes";
|
|
1378
|
+
readonly maxInlineSize: "sizes";
|
|
1379
|
+
readonly maxWidth: "sizes";
|
|
1380
|
+
readonly minBlockSize: "sizes";
|
|
1381
|
+
readonly minHeight: "sizes";
|
|
1382
|
+
readonly minInlineSize: "sizes";
|
|
1383
|
+
readonly minWidth: "sizes";
|
|
1384
|
+
readonly outline: "colors";
|
|
1385
|
+
readonly outlineColor: "colors";
|
|
1386
|
+
readonly padding: "space-inset";
|
|
1387
|
+
readonly paddingBlock: "space-inset";
|
|
1388
|
+
readonly paddingBlockEnd: "space-inset";
|
|
1389
|
+
readonly paddingBlockStart: "space-inset";
|
|
1390
|
+
readonly paddingBottom: "space-inset";
|
|
1391
|
+
readonly paddingInline: "space-inset";
|
|
1392
|
+
readonly paddingInlineEnd: "space-inset";
|
|
1393
|
+
readonly paddingInlineStart: "space-inset";
|
|
1394
|
+
readonly paddingLeft: "space-inset";
|
|
1395
|
+
readonly paddingRight: "space-inset";
|
|
1396
|
+
readonly paddingTop: "space-inset";
|
|
1397
|
+
readonly right: "space";
|
|
1398
|
+
readonly rowGap: "space-gap";
|
|
1399
|
+
readonly scrollMargin: "space-offset";
|
|
1400
|
+
readonly scrollMarginBlock: "space-offset";
|
|
1401
|
+
readonly scrollMarginBlockEnd: "space-offset";
|
|
1402
|
+
readonly scrollMarginBlockStart: "space-offset";
|
|
1403
|
+
readonly scrollMarginBottom: "space-offset";
|
|
1404
|
+
readonly scrollMarginInline: "space-offset";
|
|
1405
|
+
readonly scrollMarginInlineEnd: "space-offset";
|
|
1406
|
+
readonly scrollMarginInlineStart: "space-offset";
|
|
1407
|
+
readonly scrollMarginLeft: "space-offset";
|
|
1408
|
+
readonly scrollMarginRight: "space-offset";
|
|
1409
|
+
readonly scrollMarginTop: "space-offset";
|
|
1410
|
+
readonly scrollPadding: "space-inset";
|
|
1411
|
+
readonly scrollPaddingBlock: "space-inset";
|
|
1412
|
+
readonly scrollPaddingBlockEnd: "space-inset";
|
|
1413
|
+
readonly scrollPaddingBlockStart: "space-inset";
|
|
1414
|
+
readonly scrollPaddingBottom: "space-inset";
|
|
1415
|
+
readonly scrollPaddingInline: "space-inset";
|
|
1416
|
+
readonly scrollPaddingInlineEnd: "space-inset";
|
|
1417
|
+
readonly scrollPaddingInlineStart: "space-inset";
|
|
1418
|
+
readonly scrollPaddingLeft: "space-inset";
|
|
1419
|
+
readonly scrollPaddingRight: "space-inset";
|
|
1420
|
+
readonly scrollPaddingTop: "space-inset";
|
|
1421
|
+
readonly stroke: "colors";
|
|
1422
|
+
readonly strokeWidth: "stroke-width";
|
|
1423
|
+
readonly textDecorationColor: "colors";
|
|
1424
|
+
readonly textShadow: "shadows";
|
|
1425
|
+
readonly top: "space";
|
|
1426
|
+
readonly transition: "transitions";
|
|
1427
|
+
readonly width: "sizes";
|
|
1428
|
+
readonly zIndex: "z-indices";
|
|
1429
|
+
}, {
|
|
1430
|
+
paddingX: (value: {
|
|
1431
|
+
readonly [$$PropertyValue]: "padding";
|
|
1432
|
+
}) => {
|
|
1433
|
+
paddingLeft: {
|
|
1434
|
+
readonly [$$PropertyValue]: "padding";
|
|
1435
|
+
};
|
|
1436
|
+
paddingRight: {
|
|
1437
|
+
readonly [$$PropertyValue]: "padding";
|
|
1438
|
+
};
|
|
1439
|
+
};
|
|
1440
|
+
paddingY: (value: {
|
|
1441
|
+
readonly [$$PropertyValue]: "padding";
|
|
1442
|
+
}) => {
|
|
1443
|
+
paddingTop: {
|
|
1444
|
+
readonly [$$PropertyValue]: "padding";
|
|
1445
|
+
};
|
|
1446
|
+
paddingBottom: {
|
|
1447
|
+
readonly [$$PropertyValue]: "padding";
|
|
1448
|
+
};
|
|
1449
|
+
};
|
|
1450
|
+
marginX: (value: {
|
|
1451
|
+
readonly [$$PropertyValue]: "margin";
|
|
1452
|
+
}) => {
|
|
1453
|
+
marginLeft: {
|
|
1454
|
+
readonly [$$PropertyValue]: "margin";
|
|
1455
|
+
};
|
|
1456
|
+
marginRight: {
|
|
1457
|
+
readonly [$$PropertyValue]: "margin";
|
|
1458
|
+
};
|
|
1459
|
+
};
|
|
1460
|
+
marginY: (value: {
|
|
1461
|
+
readonly [$$PropertyValue]: "margin";
|
|
1462
|
+
}) => {
|
|
1463
|
+
marginTop: {
|
|
1464
|
+
readonly [$$PropertyValue]: "margin";
|
|
1465
|
+
};
|
|
1466
|
+
marginBottom: {
|
|
1467
|
+
readonly [$$PropertyValue]: "margin";
|
|
1468
|
+
};
|
|
1469
|
+
};
|
|
1470
|
+
square: (value: {
|
|
1471
|
+
readonly [$$PropertyValue]: "width";
|
|
1472
|
+
}) => {
|
|
1473
|
+
width: {
|
|
1474
|
+
readonly [$$PropertyValue]: "width";
|
|
1475
|
+
};
|
|
1476
|
+
height: {
|
|
1477
|
+
readonly [$$PropertyValue]: "width";
|
|
1478
|
+
};
|
|
1479
|
+
};
|
|
1480
|
+
}>>>, 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"> | Omit<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<_stitches_react_types_styled_component.StyledComponent<react.ForwardRefExoticComponent<_mirohq_design_system_components_primitive.PrimitiveProps<"button">>, {}, {}, _stitches_react_types_css_util.CSS<{}, {
|
|
1481
|
+
'border-widths': {
|
|
1482
|
+
readonly none: 0;
|
|
1483
|
+
readonly sm: "1px";
|
|
1484
|
+
readonly md: "2px";
|
|
1485
|
+
readonly lg: "4px";
|
|
1486
|
+
};
|
|
1487
|
+
colors: {
|
|
1488
|
+
readonly black: any;
|
|
1489
|
+
readonly 'blue-100': any;
|
|
1490
|
+
readonly 'blue-200': any;
|
|
1491
|
+
readonly 'blue-300': any;
|
|
1492
|
+
readonly 'blue-400': any;
|
|
1493
|
+
readonly 'blue-500': any;
|
|
1494
|
+
readonly 'blue-600': any;
|
|
1495
|
+
readonly 'blue-700': any;
|
|
1496
|
+
readonly 'blue-800': any;
|
|
1497
|
+
readonly 'blue-900': any;
|
|
1498
|
+
readonly 'blue-1000': any;
|
|
1499
|
+
readonly 'gray-100': any;
|
|
1500
|
+
readonly 'gray-200': any;
|
|
1501
|
+
readonly 'gray-300': any;
|
|
1502
|
+
readonly 'gray-400': any;
|
|
1503
|
+
readonly 'gray-500': any;
|
|
1504
|
+
readonly 'gray-600': any;
|
|
1505
|
+
readonly 'gray-700': any;
|
|
1506
|
+
readonly 'gray-800': any;
|
|
1507
|
+
readonly 'gray-900': any;
|
|
1508
|
+
readonly 'green-100': any;
|
|
1509
|
+
readonly 'green-200': any;
|
|
1510
|
+
readonly 'green-300': any;
|
|
1511
|
+
readonly 'green-400': any;
|
|
1512
|
+
readonly 'green-500': any;
|
|
1513
|
+
readonly 'green-600': any;
|
|
1514
|
+
readonly 'green-700': any;
|
|
1515
|
+
readonly 'green-800': any;
|
|
1516
|
+
readonly 'green-900': any;
|
|
1517
|
+
readonly 'indigo-100': any;
|
|
1518
|
+
readonly 'indigo-200': any;
|
|
1519
|
+
readonly 'indigo-300': any;
|
|
1520
|
+
readonly 'indigo-400': any;
|
|
1521
|
+
readonly 'indigo-500': any;
|
|
1522
|
+
readonly 'indigo-600': any;
|
|
1523
|
+
readonly 'indigo-700': any;
|
|
1524
|
+
readonly 'indigo-800': any;
|
|
1525
|
+
readonly 'indigo-900': any;
|
|
1526
|
+
readonly 'red-100': any;
|
|
1527
|
+
readonly 'red-200': any;
|
|
1528
|
+
readonly 'red-300': any;
|
|
1529
|
+
readonly 'red-400': any;
|
|
1530
|
+
readonly 'red-500': any;
|
|
1531
|
+
readonly 'red-600': any;
|
|
1532
|
+
readonly 'red-700': any;
|
|
1533
|
+
readonly 'red-800': any;
|
|
1534
|
+
readonly 'red-900': any;
|
|
1535
|
+
readonly transparent: any;
|
|
1536
|
+
readonly white: any;
|
|
1537
|
+
readonly 'yellow-100': any;
|
|
1538
|
+
readonly 'yellow-200': any;
|
|
1539
|
+
readonly 'yellow-300': any;
|
|
1540
|
+
readonly 'yellow-400': any;
|
|
1541
|
+
readonly 'yellow-500': any;
|
|
1542
|
+
readonly 'yellow-600': any;
|
|
1543
|
+
readonly 'yellow-700': any;
|
|
1544
|
+
readonly 'yellow-800': any;
|
|
1545
|
+
readonly 'yellow-900': any;
|
|
1546
|
+
"background-alpha-active"?: any;
|
|
1547
|
+
"background-alpha-hover"?: any;
|
|
1548
|
+
"background-danger-prominent"?: any;
|
|
1549
|
+
"background-danger-prominent-active"?: any;
|
|
1550
|
+
"background-danger-prominent-hover"?: any;
|
|
1551
|
+
"background-danger-subtle"?: any;
|
|
1552
|
+
"background-danger-subtle-active"?: any;
|
|
1553
|
+
"background-danger-subtle-hover"?: any;
|
|
1554
|
+
"background-neutrals"?: any;
|
|
1555
|
+
"background-neutrals-active"?: any;
|
|
1556
|
+
"background-neutrals-container"?: any;
|
|
1557
|
+
"background-neutrals-controls-disabled"?: any;
|
|
1558
|
+
"background-neutrals-disabled"?: any;
|
|
1559
|
+
"background-neutrals-hover"?: any;
|
|
1560
|
+
"background-neutrals-inactive"?: any;
|
|
1561
|
+
"background-neutrals-inactive-hover"?: any;
|
|
1562
|
+
"background-neutrals-inverted"?: any;
|
|
1563
|
+
"background-neutrals-inverted-subtle"?: any;
|
|
1564
|
+
"background-neutrals-page"?: any;
|
|
1565
|
+
"background-neutrals-page-subtle"?: any;
|
|
1566
|
+
"background-neutrals-scrolls"?: any;
|
|
1567
|
+
"background-neutrals-scrolls-expanded"?: any;
|
|
1568
|
+
"background-neutrals-scrolls-hover"?: any;
|
|
1569
|
+
"background-neutrals-scrolls-pressed"?: any;
|
|
1570
|
+
"background-neutrals-scrolls-pressed-hover"?: any;
|
|
1571
|
+
"background-neutrals-subtle"?: any;
|
|
1572
|
+
"background-neutrals-subtle-active"?: any;
|
|
1573
|
+
"background-neutrals-subtle-hover"?: any;
|
|
1574
|
+
"background-primary-prominent"?: any;
|
|
1575
|
+
"background-primary-prominent-active"?: any;
|
|
1576
|
+
"background-primary-prominent-expanded"?: any;
|
|
1577
|
+
"background-primary-prominent-hover"?: any;
|
|
1578
|
+
"background-primary-prominent-pressed"?: any;
|
|
1579
|
+
"background-primary-prominent-pressed-hover"?: any;
|
|
1580
|
+
"background-primary-prominent-selected"?: any;
|
|
1581
|
+
"background-primary-subtle"?: any;
|
|
1582
|
+
"background-primary-subtle-active"?: any;
|
|
1583
|
+
"background-primary-subtle-expanded"?: any;
|
|
1584
|
+
"background-primary-subtle-hover"?: any;
|
|
1585
|
+
"background-primary-subtle-pressed"?: any;
|
|
1586
|
+
"background-primary-subtle-pressed-hover"?: any;
|
|
1587
|
+
"background-primary-subtle-selected"?: any;
|
|
1588
|
+
"background-success"?: any;
|
|
1589
|
+
"background-success-prominent"?: any;
|
|
1590
|
+
"background-success-prominent-active"?: any;
|
|
1591
|
+
"background-success-prominent-hover"?: any;
|
|
1592
|
+
"background-warning-prominent"?: any;
|
|
1593
|
+
"background-warning-subtle"?: any;
|
|
1594
|
+
"border-danger"?: any;
|
|
1595
|
+
"border-danger-active"?: any;
|
|
1596
|
+
"border-danger-hover"?: any;
|
|
1597
|
+
"border-focus-inner"?: any;
|
|
1598
|
+
"border-focus-middle"?: any;
|
|
1599
|
+
"border-focus-outer"?: any;
|
|
1600
|
+
"border-neutrals"?: any;
|
|
1601
|
+
"border-neutrals-active"?: any;
|
|
1602
|
+
"border-neutrals-controls"?: any;
|
|
1603
|
+
"border-neutrals-controls-disabled"?: any;
|
|
1604
|
+
"border-neutrals-disabled"?: any;
|
|
1605
|
+
"border-neutrals-hover"?: any;
|
|
1606
|
+
"border-neutrals-inverted"?: any;
|
|
1607
|
+
"border-neutrals-subtle"?: any;
|
|
1608
|
+
"border-neutrals-text"?: any;
|
|
1609
|
+
"border-neutrals-text-active"?: any;
|
|
1610
|
+
"border-neutrals-text-hover"?: any;
|
|
1611
|
+
"border-neutrals-text-subtle"?: any;
|
|
1612
|
+
"border-neutrals-text-subtle-active"?: any;
|
|
1613
|
+
"border-neutrals-text-subtle-hover"?: any;
|
|
1614
|
+
"border-neutrals-transparent"?: any;
|
|
1615
|
+
"border-primary"?: any;
|
|
1616
|
+
"border-primary-active"?: any;
|
|
1617
|
+
"border-primary-hover"?: any;
|
|
1618
|
+
"border-primary-inverted"?: any;
|
|
1619
|
+
"border-success"?: any;
|
|
1620
|
+
"border-success-active"?: any;
|
|
1621
|
+
"border-success-hover"?: any;
|
|
1622
|
+
"border-warning"?: any;
|
|
1623
|
+
"icon-danger"?: any;
|
|
1624
|
+
"icon-danger-active"?: any;
|
|
1625
|
+
"icon-danger-hover"?: any;
|
|
1626
|
+
"icon-danger-inverted"?: any;
|
|
1627
|
+
"icon-neutrals"?: any;
|
|
1628
|
+
"icon-neutrals-disabled"?: any;
|
|
1629
|
+
"icon-neutrals-inactive"?: any;
|
|
1630
|
+
"icon-neutrals-inactive-hover"?: any;
|
|
1631
|
+
"icon-neutrals-inverted"?: any;
|
|
1632
|
+
"icon-neutrals-search"?: any;
|
|
1633
|
+
"icon-neutrals-subtle"?: any;
|
|
1634
|
+
"icon-neutrals-text"?: any;
|
|
1635
|
+
"icon-primary"?: any;
|
|
1636
|
+
"icon-primary-active"?: any;
|
|
1637
|
+
"icon-primary-hover"?: any;
|
|
1638
|
+
"icon-primary-inverted"?: any;
|
|
1639
|
+
"icon-primary-selected"?: any;
|
|
1640
|
+
"icon-success"?: any;
|
|
1641
|
+
"icon-success-active"?: any;
|
|
1642
|
+
"icon-success-hover"?: any;
|
|
1643
|
+
"icon-success-inverted"?: any;
|
|
1644
|
+
"icon-warning"?: any;
|
|
1645
|
+
"icon-warning-prominent"?: any;
|
|
1646
|
+
"icon-warning-subtle"?: any;
|
|
1647
|
+
"text-danger"?: any;
|
|
1648
|
+
"text-danger-active"?: any;
|
|
1649
|
+
"text-danger-hover"?: any;
|
|
1650
|
+
"text-danger-inverted"?: any;
|
|
1651
|
+
"text-neutrals"?: any;
|
|
1652
|
+
"text-neutrals-active"?: any;
|
|
1653
|
+
"text-neutrals-disabled"?: any;
|
|
1654
|
+
"text-neutrals-hover"?: any;
|
|
1655
|
+
"text-neutrals-inverted"?: any;
|
|
1656
|
+
"text-neutrals-placeholder"?: any;
|
|
1657
|
+
"text-neutrals-placeholder-only"?: any;
|
|
1658
|
+
"text-neutrals-subtle"?: any;
|
|
1659
|
+
"text-neutrals-subtle-active"?: any;
|
|
1660
|
+
"text-neutrals-subtle-hover"?: any;
|
|
1661
|
+
"text-primary"?: any;
|
|
1662
|
+
"text-primary-active"?: any;
|
|
1663
|
+
"text-primary-hover"?: any;
|
|
1664
|
+
"text-primary-inverted"?: any;
|
|
1665
|
+
"text-primary-inverted-subtle"?: any;
|
|
1666
|
+
"text-primary-selected"?: any;
|
|
1667
|
+
"text-success"?: any;
|
|
1668
|
+
"text-success-active"?: any;
|
|
1669
|
+
"text-success-hover"?: any;
|
|
1670
|
+
"text-success-inverted"?: any;
|
|
1671
|
+
"text-warning"?: any;
|
|
1672
|
+
"text-warning-subtle"?: any;
|
|
1673
|
+
};
|
|
1674
|
+
'font-sizes': {
|
|
1675
|
+
readonly 150: "0.75rem";
|
|
1676
|
+
readonly 175: "0.875rem";
|
|
1677
|
+
readonly 200: "1rem";
|
|
1678
|
+
readonly 225: "1.125rem";
|
|
1679
|
+
readonly 250: "1.25rem";
|
|
1680
|
+
readonly 300: "1.5rem";
|
|
1681
|
+
readonly 400: "2rem";
|
|
1682
|
+
readonly 500: "2.5rem";
|
|
1683
|
+
readonly 600: "3rem";
|
|
1684
|
+
readonly 800: "4rem";
|
|
1685
|
+
readonly 900: "4.5rem";
|
|
1686
|
+
};
|
|
1687
|
+
fonts: {
|
|
1688
|
+
readonly heading: "Roobert, sans-serif";
|
|
1689
|
+
readonly body: "Open Sans, sans-serif";
|
|
1690
|
+
};
|
|
1691
|
+
radii: {
|
|
1692
|
+
readonly none: 0;
|
|
1693
|
+
readonly half: "999em";
|
|
1694
|
+
readonly 25: "2px";
|
|
1695
|
+
readonly 50: "4px";
|
|
1696
|
+
readonly 75: "6px";
|
|
1697
|
+
readonly 100: "8px";
|
|
1698
|
+
readonly 200: "16px";
|
|
1699
|
+
};
|
|
1700
|
+
shadows: {
|
|
1701
|
+
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";
|
|
1702
|
+
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";
|
|
1703
|
+
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";
|
|
1704
|
+
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";
|
|
1705
|
+
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";
|
|
1706
|
+
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";
|
|
1707
|
+
};
|
|
1708
|
+
sizes: {
|
|
1709
|
+
readonly number: string;
|
|
1710
|
+
readonly 'icon-200': "16px";
|
|
1711
|
+
readonly 'icon-300': "24px";
|
|
1712
|
+
readonly 'icon-400': "32px";
|
|
1713
|
+
};
|
|
1714
|
+
space: {
|
|
1715
|
+
readonly 0: "0px";
|
|
1716
|
+
readonly 25: "2px";
|
|
1717
|
+
readonly 50: "4px";
|
|
1718
|
+
readonly 100: "8px";
|
|
1719
|
+
readonly 150: "12px";
|
|
1720
|
+
readonly 200: "16px";
|
|
1721
|
+
readonly 300: "24px";
|
|
1722
|
+
readonly 400: "32px";
|
|
1723
|
+
readonly 500: "40px";
|
|
1724
|
+
readonly 600: "48px";
|
|
1725
|
+
readonly 700: "56px";
|
|
1726
|
+
readonly 800: "64px";
|
|
1727
|
+
readonly 1200: "96px";
|
|
1728
|
+
readonly 1600: "128px";
|
|
1729
|
+
};
|
|
1730
|
+
'space-gap': {
|
|
1731
|
+
readonly 0: any;
|
|
1732
|
+
readonly 50: any;
|
|
1733
|
+
readonly 100: any;
|
|
1734
|
+
readonly 200: any;
|
|
1735
|
+
readonly 300: any;
|
|
1736
|
+
};
|
|
1737
|
+
'space-inset': {
|
|
1738
|
+
readonly 0: any;
|
|
1739
|
+
readonly 50: any;
|
|
1740
|
+
readonly 100: any;
|
|
1741
|
+
readonly 150: any;
|
|
1742
|
+
readonly 200: any;
|
|
1743
|
+
readonly 300: any;
|
|
1744
|
+
readonly 400: any;
|
|
1745
|
+
readonly 500: any;
|
|
1746
|
+
readonly 600: any;
|
|
1747
|
+
readonly 700: any;
|
|
1748
|
+
readonly 800: any;
|
|
1749
|
+
readonly 1200: any;
|
|
1750
|
+
readonly 1600: any;
|
|
1751
|
+
};
|
|
1752
|
+
'space-offset': {
|
|
1753
|
+
readonly 0: any;
|
|
1754
|
+
readonly 50: any;
|
|
1755
|
+
readonly 100: any;
|
|
1756
|
+
readonly 150: any;
|
|
1757
|
+
readonly 200: any;
|
|
1758
|
+
readonly 300: any;
|
|
1759
|
+
readonly 400: any;
|
|
1760
|
+
readonly 600: any;
|
|
1761
|
+
readonly 800: any;
|
|
1762
|
+
readonly 1200: any;
|
|
1763
|
+
readonly 1600: any;
|
|
1764
|
+
readonly 'stacking-0': any;
|
|
1765
|
+
readonly 'stacking-100': any;
|
|
1766
|
+
readonly 'stacking-200': any;
|
|
1767
|
+
readonly 'stacking-300': any;
|
|
1768
|
+
readonly 'stacking-400': any;
|
|
1769
|
+
readonly 'stacking-500': any;
|
|
1770
|
+
readonly 'stacking-800': any;
|
|
1771
|
+
};
|
|
1772
|
+
'stroke-width': {
|
|
1773
|
+
readonly thin: "1.5px";
|
|
1774
|
+
readonly normal: "2px";
|
|
1775
|
+
readonly bold: "4px";
|
|
1776
|
+
};
|
|
1777
|
+
'z-indices': {
|
|
1778
|
+
readonly dropdownMenu: 100;
|
|
1779
|
+
readonly select: 200;
|
|
1780
|
+
readonly popover: 300;
|
|
1781
|
+
readonly tooltip: 400;
|
|
1782
|
+
};
|
|
1783
|
+
}, {
|
|
1784
|
+
readonly background: "colors";
|
|
1785
|
+
readonly backgroundColor: "colors";
|
|
1786
|
+
readonly backgroundImage: "colors";
|
|
1787
|
+
readonly blockSize: "sizes";
|
|
1788
|
+
readonly border: "colors";
|
|
1789
|
+
readonly borderBlock: "colors";
|
|
1790
|
+
readonly borderBlockEnd: "colors";
|
|
1791
|
+
readonly borderBlockStart: "colors";
|
|
1792
|
+
readonly borderBottom: "colors";
|
|
1793
|
+
readonly borderBottomColor: "colors";
|
|
1794
|
+
readonly borderBottomLeftRadius: "radii";
|
|
1795
|
+
readonly borderBottomRightRadius: "radii";
|
|
1796
|
+
readonly borderBottomStyle: "border-styles";
|
|
1797
|
+
readonly borderBottomWidth: "border-widths";
|
|
1798
|
+
readonly borderColor: "colors";
|
|
1799
|
+
readonly borderImage: "colors";
|
|
1800
|
+
readonly borderInline: "colors";
|
|
1801
|
+
readonly borderInlineEnd: "colors";
|
|
1802
|
+
readonly borderInlineStart: "colors";
|
|
1803
|
+
readonly borderLeft: "colors";
|
|
1804
|
+
readonly borderLeftColor: "colors";
|
|
1805
|
+
readonly borderLeftStyle: "border-styles";
|
|
1806
|
+
readonly borderLeftWidth: "border-widths";
|
|
1807
|
+
readonly borderRadius: "radii";
|
|
1808
|
+
readonly borderRight: "colors";
|
|
1809
|
+
readonly borderRightColor: "colors";
|
|
1810
|
+
readonly borderRightStyle: "border-styles";
|
|
1811
|
+
readonly borderRightWidth: "border-widths";
|
|
1812
|
+
readonly borderSpacing: "space-offset";
|
|
1813
|
+
readonly borderStyle: "border-styles";
|
|
1814
|
+
readonly borderTop: "colors";
|
|
1815
|
+
readonly borderTopColor: "colors";
|
|
1816
|
+
readonly borderTopLeftRadius: "radii";
|
|
1817
|
+
readonly borderTopRightRadius: "radii";
|
|
1818
|
+
readonly borderTopStyle: "border-styles";
|
|
1819
|
+
readonly borderTopWidth: "border-widths";
|
|
1820
|
+
readonly borderWidth: "border-widths";
|
|
1821
|
+
readonly bottom: "space";
|
|
1822
|
+
readonly boxShadow: "shadows";
|
|
1823
|
+
readonly caretColor: "colors";
|
|
1824
|
+
readonly color: "colors";
|
|
1825
|
+
readonly columnGap: "space-gap";
|
|
1826
|
+
readonly columnRuleColor: "colors";
|
|
1827
|
+
readonly fill: "colors";
|
|
1828
|
+
readonly flexBasis: "sizes";
|
|
1829
|
+
readonly fontFamily: "fonts";
|
|
1830
|
+
readonly fontSize: "font-sizes";
|
|
1831
|
+
readonly fontWeight: "font-weights";
|
|
1832
|
+
readonly gap: "space-gap";
|
|
1833
|
+
readonly gridColumnGap: "space-gap";
|
|
1834
|
+
readonly gridGap: "space-gap";
|
|
1835
|
+
readonly gridRowGap: "space-gap";
|
|
1836
|
+
readonly gridTemplateColumns: "sizes";
|
|
1837
|
+
readonly gridTemplateRows: "sizes";
|
|
1838
|
+
readonly height: "sizes";
|
|
1839
|
+
readonly inlineSize: "sizes";
|
|
1840
|
+
readonly inset: "space-inset";
|
|
1841
|
+
readonly insetBlock: "space-inset";
|
|
1842
|
+
readonly insetBlockEnd: "space-inset";
|
|
1843
|
+
readonly insetBlockStart: "space-inset";
|
|
1844
|
+
readonly insetInline: "space-inset";
|
|
1845
|
+
readonly insetInlineEnd: "space-inset";
|
|
1846
|
+
readonly insetInlineStart: "space-inset";
|
|
1847
|
+
readonly left: "space";
|
|
1848
|
+
readonly letterSpacing: "letter-spacings";
|
|
1849
|
+
readonly lineHeight: "line-heights";
|
|
1850
|
+
readonly margin: "space-offset";
|
|
1851
|
+
readonly marginBlock: "space-offset";
|
|
1852
|
+
readonly marginBlockEnd: "space-offset";
|
|
1853
|
+
readonly marginBlockStart: "space-offset";
|
|
1854
|
+
readonly marginBottom: "space-offset";
|
|
1855
|
+
readonly marginInline: "space-offset";
|
|
1856
|
+
readonly marginInlineEnd: "space-offset";
|
|
1857
|
+
readonly marginInlineStart: "space-offset";
|
|
1858
|
+
readonly marginLeft: "space-offset";
|
|
1859
|
+
readonly marginRight: "space-offset";
|
|
1860
|
+
readonly marginTop: "space-offset";
|
|
1861
|
+
readonly maxBlockSize: "sizes";
|
|
1862
|
+
readonly maxHeight: "sizes";
|
|
1863
|
+
readonly maxInlineSize: "sizes";
|
|
1864
|
+
readonly maxWidth: "sizes";
|
|
1865
|
+
readonly minBlockSize: "sizes";
|
|
1866
|
+
readonly minHeight: "sizes";
|
|
1867
|
+
readonly minInlineSize: "sizes";
|
|
1868
|
+
readonly minWidth: "sizes";
|
|
1869
|
+
readonly outline: "colors";
|
|
1870
|
+
readonly outlineColor: "colors";
|
|
1871
|
+
readonly padding: "space-inset";
|
|
1872
|
+
readonly paddingBlock: "space-inset";
|
|
1873
|
+
readonly paddingBlockEnd: "space-inset";
|
|
1874
|
+
readonly paddingBlockStart: "space-inset";
|
|
1875
|
+
readonly paddingBottom: "space-inset";
|
|
1876
|
+
readonly paddingInline: "space-inset";
|
|
1877
|
+
readonly paddingInlineEnd: "space-inset";
|
|
1878
|
+
readonly paddingInlineStart: "space-inset";
|
|
1879
|
+
readonly paddingLeft: "space-inset";
|
|
1880
|
+
readonly paddingRight: "space-inset";
|
|
1881
|
+
readonly paddingTop: "space-inset";
|
|
1882
|
+
readonly right: "space";
|
|
1883
|
+
readonly rowGap: "space-gap";
|
|
1884
|
+
readonly scrollMargin: "space-offset";
|
|
1885
|
+
readonly scrollMarginBlock: "space-offset";
|
|
1886
|
+
readonly scrollMarginBlockEnd: "space-offset";
|
|
1887
|
+
readonly scrollMarginBlockStart: "space-offset";
|
|
1888
|
+
readonly scrollMarginBottom: "space-offset";
|
|
1889
|
+
readonly scrollMarginInline: "space-offset";
|
|
1890
|
+
readonly scrollMarginInlineEnd: "space-offset";
|
|
1891
|
+
readonly scrollMarginInlineStart: "space-offset";
|
|
1892
|
+
readonly scrollMarginLeft: "space-offset";
|
|
1893
|
+
readonly scrollMarginRight: "space-offset";
|
|
1894
|
+
readonly scrollMarginTop: "space-offset";
|
|
1895
|
+
readonly scrollPadding: "space-inset";
|
|
1896
|
+
readonly scrollPaddingBlock: "space-inset";
|
|
1897
|
+
readonly scrollPaddingBlockEnd: "space-inset";
|
|
1898
|
+
readonly scrollPaddingBlockStart: "space-inset";
|
|
1899
|
+
readonly scrollPaddingBottom: "space-inset";
|
|
1900
|
+
readonly scrollPaddingInline: "space-inset";
|
|
1901
|
+
readonly scrollPaddingInlineEnd: "space-inset";
|
|
1902
|
+
readonly scrollPaddingInlineStart: "space-inset";
|
|
1903
|
+
readonly scrollPaddingLeft: "space-inset";
|
|
1904
|
+
readonly scrollPaddingRight: "space-inset";
|
|
1905
|
+
readonly scrollPaddingTop: "space-inset";
|
|
1906
|
+
readonly stroke: "colors";
|
|
1907
|
+
readonly strokeWidth: "stroke-width";
|
|
1908
|
+
readonly textDecorationColor: "colors";
|
|
1909
|
+
readonly textShadow: "shadows";
|
|
1910
|
+
readonly top: "space";
|
|
1911
|
+
readonly transition: "transitions";
|
|
1912
|
+
readonly width: "sizes";
|
|
1913
|
+
readonly zIndex: "z-indices";
|
|
1914
|
+
}, {
|
|
1915
|
+
paddingX: (value: {
|
|
1916
|
+
readonly [$$PropertyValue]: "padding";
|
|
1917
|
+
}) => {
|
|
1918
|
+
paddingLeft: {
|
|
1919
|
+
readonly [$$PropertyValue]: "padding";
|
|
1920
|
+
};
|
|
1921
|
+
paddingRight: {
|
|
1922
|
+
readonly [$$PropertyValue]: "padding";
|
|
1923
|
+
};
|
|
1924
|
+
};
|
|
1925
|
+
paddingY: (value: {
|
|
1926
|
+
readonly [$$PropertyValue]: "padding";
|
|
1927
|
+
}) => {
|
|
1928
|
+
paddingTop: {
|
|
1929
|
+
readonly [$$PropertyValue]: "padding";
|
|
1930
|
+
};
|
|
1931
|
+
paddingBottom: {
|
|
1932
|
+
readonly [$$PropertyValue]: "padding";
|
|
1933
|
+
};
|
|
1934
|
+
};
|
|
1935
|
+
marginX: (value: {
|
|
1936
|
+
readonly [$$PropertyValue]: "margin";
|
|
1937
|
+
}) => {
|
|
1938
|
+
marginLeft: {
|
|
1939
|
+
readonly [$$PropertyValue]: "margin";
|
|
1940
|
+
};
|
|
1941
|
+
marginRight: {
|
|
1942
|
+
readonly [$$PropertyValue]: "margin";
|
|
1943
|
+
};
|
|
1944
|
+
};
|
|
1945
|
+
marginY: (value: {
|
|
1946
|
+
readonly [$$PropertyValue]: "margin";
|
|
1947
|
+
}) => {
|
|
1948
|
+
marginTop: {
|
|
1949
|
+
readonly [$$PropertyValue]: "margin";
|
|
1950
|
+
};
|
|
1951
|
+
marginBottom: {
|
|
1952
|
+
readonly [$$PropertyValue]: "margin";
|
|
1953
|
+
};
|
|
1954
|
+
};
|
|
1955
|
+
square: (value: {
|
|
1956
|
+
readonly [$$PropertyValue]: "width";
|
|
1957
|
+
}) => {
|
|
1958
|
+
width: {
|
|
1959
|
+
readonly [$$PropertyValue]: "width";
|
|
1960
|
+
};
|
|
1961
|
+
height: {
|
|
1962
|
+
readonly [$$PropertyValue]: "width";
|
|
1963
|
+
};
|
|
1964
|
+
};
|
|
1965
|
+
}>>>, 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"> & {
|
|
1966
|
+
href: string;
|
|
1967
|
+
}, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>, {}, {}, _stitches_react_types_css_util.CSS<{}, {
|
|
11
1968
|
'border-widths': {
|
|
12
1969
|
readonly none: 0;
|
|
13
1970
|
readonly sm: "1px";
|
|
@@ -116,6 +2073,9 @@ declare const StyledBaseInput: react.ForwardRefExoticComponent<Omit<Omit<_mirohq
|
|
|
116
2073
|
"background-primary-subtle-pressed-hover"?: any;
|
|
117
2074
|
"background-primary-subtle-selected"?: any;
|
|
118
2075
|
"background-success"?: any;
|
|
2076
|
+
"background-success-prominent"?: any;
|
|
2077
|
+
"background-success-prominent-active"?: any;
|
|
2078
|
+
"background-success-prominent-hover"?: any;
|
|
119
2079
|
"background-warning-prominent"?: any;
|
|
120
2080
|
"background-warning-subtle"?: any;
|
|
121
2081
|
"border-danger"?: any;
|
|
@@ -144,6 +2104,8 @@ declare const StyledBaseInput: react.ForwardRefExoticComponent<Omit<Omit<_mirohq
|
|
|
144
2104
|
"border-primary-hover"?: any;
|
|
145
2105
|
"border-primary-inverted"?: any;
|
|
146
2106
|
"border-success"?: any;
|
|
2107
|
+
"border-success-active"?: any;
|
|
2108
|
+
"border-success-hover"?: any;
|
|
147
2109
|
"border-warning"?: any;
|
|
148
2110
|
"icon-danger"?: any;
|
|
149
2111
|
"icon-danger-active"?: any;
|
|
@@ -163,9 +2125,12 @@ declare const StyledBaseInput: react.ForwardRefExoticComponent<Omit<Omit<_mirohq
|
|
|
163
2125
|
"icon-primary-inverted"?: any;
|
|
164
2126
|
"icon-primary-selected"?: any;
|
|
165
2127
|
"icon-success"?: any;
|
|
2128
|
+
"icon-success-active"?: any;
|
|
2129
|
+
"icon-success-hover"?: any;
|
|
166
2130
|
"icon-success-inverted"?: any;
|
|
167
2131
|
"icon-warning"?: any;
|
|
168
2132
|
"icon-warning-prominent"?: any;
|
|
2133
|
+
"icon-warning-subtle"?: any;
|
|
169
2134
|
"text-danger"?: any;
|
|
170
2135
|
"text-danger-active"?: any;
|
|
171
2136
|
"text-danger-hover"?: any;
|
|
@@ -187,7 +2152,11 @@ declare const StyledBaseInput: react.ForwardRefExoticComponent<Omit<Omit<_mirohq
|
|
|
187
2152
|
"text-primary-inverted-subtle"?: any;
|
|
188
2153
|
"text-primary-selected"?: any;
|
|
189
2154
|
"text-success"?: any;
|
|
2155
|
+
"text-success-active"?: any;
|
|
2156
|
+
"text-success-hover"?: any;
|
|
2157
|
+
"text-success-inverted"?: any;
|
|
190
2158
|
"text-warning"?: any;
|
|
2159
|
+
"text-warning-subtle"?: any;
|
|
191
2160
|
};
|
|
192
2161
|
'font-sizes': {
|
|
193
2162
|
readonly 150: "0.75rem";
|
|
@@ -216,13 +2185,12 @@ declare const StyledBaseInput: react.ForwardRefExoticComponent<Omit<Omit<_mirohq
|
|
|
216
2185
|
readonly 200: "16px";
|
|
217
2186
|
};
|
|
218
2187
|
shadows: {
|
|
219
|
-
readonly 50: "0 4px 16px #05003812";
|
|
220
|
-
readonly 100: "0 8px 32px #05003808";
|
|
221
2188
|
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";
|
|
222
2189
|
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";
|
|
223
2190
|
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";
|
|
224
2191
|
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";
|
|
225
2192
|
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";
|
|
2193
|
+
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";
|
|
226
2194
|
};
|
|
227
2195
|
sizes: {
|
|
228
2196
|
readonly number: string;
|
|
@@ -231,7 +2199,8 @@ declare const StyledBaseInput: react.ForwardRefExoticComponent<Omit<Omit<_mirohq
|
|
|
231
2199
|
readonly 'icon-400': "32px";
|
|
232
2200
|
};
|
|
233
2201
|
space: {
|
|
234
|
-
readonly 0:
|
|
2202
|
+
readonly 0: "0px";
|
|
2203
|
+
readonly 25: "2px";
|
|
235
2204
|
readonly 50: "4px";
|
|
236
2205
|
readonly 100: "8px";
|
|
237
2206
|
readonly 150: "12px";
|
|
@@ -262,6 +2231,7 @@ declare const StyledBaseInput: react.ForwardRefExoticComponent<Omit<Omit<_mirohq
|
|
|
262
2231
|
readonly 400: any;
|
|
263
2232
|
readonly 500: any;
|
|
264
2233
|
readonly 600: any;
|
|
2234
|
+
readonly 700: any;
|
|
265
2235
|
readonly 800: any;
|
|
266
2236
|
readonly 1200: any;
|
|
267
2237
|
readonly 1600: any;
|
|
@@ -326,6 +2296,7 @@ declare const StyledBaseInput: react.ForwardRefExoticComponent<Omit<Omit<_mirohq
|
|
|
326
2296
|
readonly borderRightColor: "colors";
|
|
327
2297
|
readonly borderRightStyle: "border-styles";
|
|
328
2298
|
readonly borderRightWidth: "border-widths";
|
|
2299
|
+
readonly borderSpacing: "space-offset";
|
|
329
2300
|
readonly borderStyle: "border-styles";
|
|
330
2301
|
readonly borderTop: "colors";
|
|
331
2302
|
readonly borderTopColor: "colors";
|
|
@@ -478,32 +2449,10 @@ declare const StyledBaseInput: react.ForwardRefExoticComponent<Omit<Omit<_mirohq
|
|
|
478
2449
|
readonly [$$PropertyValue]: "width";
|
|
479
2450
|
};
|
|
480
2451
|
};
|
|
481
|
-
}>>>, "
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
}, {}>;
|
|
486
|
-
declare type StyledBaseInputProps = ComponentPropsWithRef<typeof StyledBaseInput>;
|
|
487
|
-
|
|
488
|
-
declare type Value$1 = HTMLProps<'input'>['value'];
|
|
489
|
-
interface ClearProps {
|
|
490
|
-
/**
|
|
491
|
-
* Show X button for clearing the input value.
|
|
492
|
-
*/
|
|
493
|
-
clearable: boolean;
|
|
494
|
-
/**
|
|
495
|
-
* Tooltip label for the clear button.
|
|
496
|
-
*/
|
|
497
|
-
clearLabel: string;
|
|
498
|
-
/**
|
|
499
|
-
* Callback event called when clearing the input.
|
|
500
|
-
*/
|
|
501
|
-
onClear?: (value: Value$1) => void;
|
|
502
|
-
}
|
|
503
|
-
declare type InputTextProps = StyledBaseInputProps & ({
|
|
504
|
-
clearable?: never;
|
|
505
|
-
} | ClearProps);
|
|
506
|
-
declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<_stitches_react_types_styled_component.StyledComponent<react__default.ForwardRefExoticComponent<_mirohq_design_system_base_input.BaseInputProps> & packages_components_internal_base_input_src_base_input.Partials, {}, {}, _stitches_react_types_css_util.CSS<{}, {
|
|
2452
|
+
}>>>, "readOnlyAppearance" | "disableAppearance"> & _stitches_react_types_styled_component.TransformProps<{
|
|
2453
|
+
readOnlyAppearance?: boolean | "true" | undefined;
|
|
2454
|
+
disableAppearance?: boolean | "true" | undefined;
|
|
2455
|
+
}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<_stitches_react_types_styled_component.StyledComponent<react.ForwardRefExoticComponent<_mirohq_design_system_components_primitive.PrimitiveProps<"button">>, {}, {}, _stitches_react_types_css_util.CSS<{}, {
|
|
507
2456
|
'border-widths': {
|
|
508
2457
|
readonly none: 0;
|
|
509
2458
|
readonly sm: "1px";
|
|
@@ -612,6 +2561,9 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
612
2561
|
"background-primary-subtle-pressed-hover"?: any;
|
|
613
2562
|
"background-primary-subtle-selected"?: any;
|
|
614
2563
|
"background-success"?: any;
|
|
2564
|
+
"background-success-prominent"?: any;
|
|
2565
|
+
"background-success-prominent-active"?: any;
|
|
2566
|
+
"background-success-prominent-hover"?: any;
|
|
615
2567
|
"background-warning-prominent"?: any;
|
|
616
2568
|
"background-warning-subtle"?: any;
|
|
617
2569
|
"border-danger"?: any;
|
|
@@ -640,6 +2592,8 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
640
2592
|
"border-primary-hover"?: any;
|
|
641
2593
|
"border-primary-inverted"?: any;
|
|
642
2594
|
"border-success"?: any;
|
|
2595
|
+
"border-success-active"?: any;
|
|
2596
|
+
"border-success-hover"?: any;
|
|
643
2597
|
"border-warning"?: any;
|
|
644
2598
|
"icon-danger"?: any;
|
|
645
2599
|
"icon-danger-active"?: any;
|
|
@@ -659,9 +2613,12 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
659
2613
|
"icon-primary-inverted"?: any;
|
|
660
2614
|
"icon-primary-selected"?: any;
|
|
661
2615
|
"icon-success"?: any;
|
|
2616
|
+
"icon-success-active"?: any;
|
|
2617
|
+
"icon-success-hover"?: any;
|
|
662
2618
|
"icon-success-inverted"?: any;
|
|
663
2619
|
"icon-warning"?: any;
|
|
664
2620
|
"icon-warning-prominent"?: any;
|
|
2621
|
+
"icon-warning-subtle"?: any;
|
|
665
2622
|
"text-danger"?: any;
|
|
666
2623
|
"text-danger-active"?: any;
|
|
667
2624
|
"text-danger-hover"?: any;
|
|
@@ -683,7 +2640,11 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
683
2640
|
"text-primary-inverted-subtle"?: any;
|
|
684
2641
|
"text-primary-selected"?: any;
|
|
685
2642
|
"text-success"?: any;
|
|
2643
|
+
"text-success-active"?: any;
|
|
2644
|
+
"text-success-hover"?: any;
|
|
2645
|
+
"text-success-inverted"?: any;
|
|
686
2646
|
"text-warning"?: any;
|
|
2647
|
+
"text-warning-subtle"?: any;
|
|
687
2648
|
};
|
|
688
2649
|
'font-sizes': {
|
|
689
2650
|
readonly 150: "0.75rem";
|
|
@@ -712,13 +2673,12 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
712
2673
|
readonly 200: "16px";
|
|
713
2674
|
};
|
|
714
2675
|
shadows: {
|
|
715
|
-
readonly 50: "0 4px 16px #05003812";
|
|
716
|
-
readonly 100: "0 8px 32px #05003808";
|
|
717
2676
|
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";
|
|
718
2677
|
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";
|
|
719
2678
|
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";
|
|
720
2679
|
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";
|
|
721
2680
|
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";
|
|
2681
|
+
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";
|
|
722
2682
|
};
|
|
723
2683
|
sizes: {
|
|
724
2684
|
readonly number: string;
|
|
@@ -727,7 +2687,8 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
727
2687
|
readonly 'icon-400': "32px";
|
|
728
2688
|
};
|
|
729
2689
|
space: {
|
|
730
|
-
readonly 0:
|
|
2690
|
+
readonly 0: "0px";
|
|
2691
|
+
readonly 25: "2px";
|
|
731
2692
|
readonly 50: "4px";
|
|
732
2693
|
readonly 100: "8px";
|
|
733
2694
|
readonly 150: "12px";
|
|
@@ -758,6 +2719,7 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
758
2719
|
readonly 400: any;
|
|
759
2720
|
readonly 500: any;
|
|
760
2721
|
readonly 600: any;
|
|
2722
|
+
readonly 700: any;
|
|
761
2723
|
readonly 800: any;
|
|
762
2724
|
readonly 1200: any;
|
|
763
2725
|
readonly 1600: any;
|
|
@@ -822,6 +2784,7 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
822
2784
|
readonly borderRightColor: "colors";
|
|
823
2785
|
readonly borderRightStyle: "border-styles";
|
|
824
2786
|
readonly borderRightWidth: "border-widths";
|
|
2787
|
+
readonly borderSpacing: "space-offset";
|
|
825
2788
|
readonly borderStyle: "border-styles";
|
|
826
2789
|
readonly borderTop: "colors";
|
|
827
2790
|
readonly borderTopColor: "colors";
|
|
@@ -974,9 +2937,7 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
974
2937
|
readonly [$$PropertyValue]: "width";
|
|
975
2938
|
};
|
|
976
2939
|
};
|
|
977
|
-
}>>>, "
|
|
978
|
-
size?: "medium" | "large" | undefined;
|
|
979
|
-
}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react__default.RefAttributes<HTMLInputElement> & ClearProps, "ref"> | Omit<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<_stitches_react_types_styled_component.StyledComponent<react__default.ForwardRefExoticComponent<_mirohq_design_system_base_input.BaseInputProps> & packages_components_internal_base_input_src_base_input.Partials, {}, {}, _stitches_react_types_css_util.CSS<{}, {
|
|
2940
|
+
}>>>, 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"> | Omit<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<_stitches_react_types_styled_component.StyledComponent<react.ForwardRefExoticComponent<_mirohq_design_system_components_primitive.PrimitiveProps<"button">>, {}, {}, _stitches_react_types_css_util.CSS<{}, {
|
|
980
2941
|
'border-widths': {
|
|
981
2942
|
readonly none: 0;
|
|
982
2943
|
readonly sm: "1px";
|
|
@@ -1085,6 +3046,9 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
1085
3046
|
"background-primary-subtle-pressed-hover"?: any;
|
|
1086
3047
|
"background-primary-subtle-selected"?: any;
|
|
1087
3048
|
"background-success"?: any;
|
|
3049
|
+
"background-success-prominent"?: any;
|
|
3050
|
+
"background-success-prominent-active"?: any;
|
|
3051
|
+
"background-success-prominent-hover"?: any;
|
|
1088
3052
|
"background-warning-prominent"?: any;
|
|
1089
3053
|
"background-warning-subtle"?: any;
|
|
1090
3054
|
"border-danger"?: any;
|
|
@@ -1113,6 +3077,8 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
1113
3077
|
"border-primary-hover"?: any;
|
|
1114
3078
|
"border-primary-inverted"?: any;
|
|
1115
3079
|
"border-success"?: any;
|
|
3080
|
+
"border-success-active"?: any;
|
|
3081
|
+
"border-success-hover"?: any;
|
|
1116
3082
|
"border-warning"?: any;
|
|
1117
3083
|
"icon-danger"?: any;
|
|
1118
3084
|
"icon-danger-active"?: any;
|
|
@@ -1132,9 +3098,12 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
1132
3098
|
"icon-primary-inverted"?: any;
|
|
1133
3099
|
"icon-primary-selected"?: any;
|
|
1134
3100
|
"icon-success"?: any;
|
|
3101
|
+
"icon-success-active"?: any;
|
|
3102
|
+
"icon-success-hover"?: any;
|
|
1135
3103
|
"icon-success-inverted"?: any;
|
|
1136
3104
|
"icon-warning"?: any;
|
|
1137
3105
|
"icon-warning-prominent"?: any;
|
|
3106
|
+
"icon-warning-subtle"?: any;
|
|
1138
3107
|
"text-danger"?: any;
|
|
1139
3108
|
"text-danger-active"?: any;
|
|
1140
3109
|
"text-danger-hover"?: any;
|
|
@@ -1156,7 +3125,11 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
1156
3125
|
"text-primary-inverted-subtle"?: any;
|
|
1157
3126
|
"text-primary-selected"?: any;
|
|
1158
3127
|
"text-success"?: any;
|
|
3128
|
+
"text-success-active"?: any;
|
|
3129
|
+
"text-success-hover"?: any;
|
|
3130
|
+
"text-success-inverted"?: any;
|
|
1159
3131
|
"text-warning"?: any;
|
|
3132
|
+
"text-warning-subtle"?: any;
|
|
1160
3133
|
};
|
|
1161
3134
|
'font-sizes': {
|
|
1162
3135
|
readonly 150: "0.75rem";
|
|
@@ -1185,13 +3158,12 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
1185
3158
|
readonly 200: "16px";
|
|
1186
3159
|
};
|
|
1187
3160
|
shadows: {
|
|
1188
|
-
readonly 50: "0 4px 16px #05003812";
|
|
1189
|
-
readonly 100: "0 8px 32px #05003808";
|
|
1190
3161
|
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";
|
|
1191
3162
|
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";
|
|
1192
3163
|
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";
|
|
1193
3164
|
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";
|
|
1194
3165
|
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";
|
|
3166
|
+
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";
|
|
1195
3167
|
};
|
|
1196
3168
|
sizes: {
|
|
1197
3169
|
readonly number: string;
|
|
@@ -1200,7 +3172,8 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
1200
3172
|
readonly 'icon-400': "32px";
|
|
1201
3173
|
};
|
|
1202
3174
|
space: {
|
|
1203
|
-
readonly 0:
|
|
3175
|
+
readonly 0: "0px";
|
|
3176
|
+
readonly 25: "2px";
|
|
1204
3177
|
readonly 50: "4px";
|
|
1205
3178
|
readonly 100: "8px";
|
|
1206
3179
|
readonly 150: "12px";
|
|
@@ -1231,6 +3204,7 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
1231
3204
|
readonly 400: any;
|
|
1232
3205
|
readonly 500: any;
|
|
1233
3206
|
readonly 600: any;
|
|
3207
|
+
readonly 700: any;
|
|
1234
3208
|
readonly 800: any;
|
|
1235
3209
|
readonly 1200: any;
|
|
1236
3210
|
readonly 1600: any;
|
|
@@ -1295,6 +3269,7 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
1295
3269
|
readonly borderRightColor: "colors";
|
|
1296
3270
|
readonly borderRightStyle: "border-styles";
|
|
1297
3271
|
readonly borderRightWidth: "border-widths";
|
|
3272
|
+
readonly borderSpacing: "space-offset";
|
|
1298
3273
|
readonly borderStyle: "border-styles";
|
|
1299
3274
|
readonly borderTop: "colors";
|
|
1300
3275
|
readonly borderTopColor: "colors";
|
|
@@ -1447,14 +3422,20 @@ declare const InputText: react__default.ForwardRefExoticComponent<(Omit<Omit<Omi
|
|
|
1447
3422
|
readonly [$$PropertyValue]: "width";
|
|
1448
3423
|
};
|
|
1449
3424
|
};
|
|
1450
|
-
}>>>,
|
|
1451
|
-
|
|
1452
|
-
},
|
|
1453
|
-
|
|
1454
|
-
|
|
3425
|
+
}>>>, 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"> & {
|
|
3426
|
+
href: string;
|
|
3427
|
+
}, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>, {
|
|
3428
|
+
readOnlyAppearance?: boolean | "true" | undefined;
|
|
3429
|
+
disableAppearance?: boolean | "true" | undefined;
|
|
3430
|
+
}, {}>;
|
|
3431
|
+
declare type StyledActionButtonProps = ComponentPropsWithRef<typeof StyledActionButton>;
|
|
3432
|
+
|
|
3433
|
+
interface ActionButtonProps extends StyledActionButtonProps {
|
|
3434
|
+
label: string;
|
|
3435
|
+
}
|
|
3436
|
+
declare const ActionButton: react__default.ForwardRefExoticComponent<Omit<ActionButtonProps, "ref"> & react__default.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
|
|
1455
3437
|
|
|
1456
|
-
declare
|
|
1457
|
-
declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<_stitches_react_types_styled_component.StyledComponent<react.ForwardRefExoticComponent<_mirohq_design_system_components_internal_base_input.BaseInputProps> & packages_components_internal_base_input_src_base_input.Partials, {}, {}, _stitches_react_types_css_util.CSS<{}, {
|
|
3438
|
+
declare const StyledInput: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<_stitches_react_types_styled_component.StyledComponent<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"input">>, {}, {}, _stitches_react_types_css_util.CSS<{}, {
|
|
1458
3439
|
'border-widths': {
|
|
1459
3440
|
readonly none: 0;
|
|
1460
3441
|
readonly sm: "1px";
|
|
@@ -1563,6 +3544,9 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
1563
3544
|
"background-primary-subtle-pressed-hover"?: any;
|
|
1564
3545
|
"background-primary-subtle-selected"?: any;
|
|
1565
3546
|
"background-success"?: any;
|
|
3547
|
+
"background-success-prominent"?: any;
|
|
3548
|
+
"background-success-prominent-active"?: any;
|
|
3549
|
+
"background-success-prominent-hover"?: any;
|
|
1566
3550
|
"background-warning-prominent"?: any;
|
|
1567
3551
|
"background-warning-subtle"?: any;
|
|
1568
3552
|
"border-danger"?: any;
|
|
@@ -1591,6 +3575,8 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
1591
3575
|
"border-primary-hover"?: any;
|
|
1592
3576
|
"border-primary-inverted"?: any;
|
|
1593
3577
|
"border-success"?: any;
|
|
3578
|
+
"border-success-active"?: any;
|
|
3579
|
+
"border-success-hover"?: any;
|
|
1594
3580
|
"border-warning"?: any;
|
|
1595
3581
|
"icon-danger"?: any;
|
|
1596
3582
|
"icon-danger-active"?: any;
|
|
@@ -1610,9 +3596,12 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
1610
3596
|
"icon-primary-inverted"?: any;
|
|
1611
3597
|
"icon-primary-selected"?: any;
|
|
1612
3598
|
"icon-success"?: any;
|
|
3599
|
+
"icon-success-active"?: any;
|
|
3600
|
+
"icon-success-hover"?: any;
|
|
1613
3601
|
"icon-success-inverted"?: any;
|
|
1614
3602
|
"icon-warning"?: any;
|
|
1615
3603
|
"icon-warning-prominent"?: any;
|
|
3604
|
+
"icon-warning-subtle"?: any;
|
|
1616
3605
|
"text-danger"?: any;
|
|
1617
3606
|
"text-danger-active"?: any;
|
|
1618
3607
|
"text-danger-hover"?: any;
|
|
@@ -1634,7 +3623,11 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
1634
3623
|
"text-primary-inverted-subtle"?: any;
|
|
1635
3624
|
"text-primary-selected"?: any;
|
|
1636
3625
|
"text-success"?: any;
|
|
3626
|
+
"text-success-active"?: any;
|
|
3627
|
+
"text-success-hover"?: any;
|
|
3628
|
+
"text-success-inverted"?: any;
|
|
1637
3629
|
"text-warning"?: any;
|
|
3630
|
+
"text-warning-subtle"?: any;
|
|
1638
3631
|
};
|
|
1639
3632
|
'font-sizes': {
|
|
1640
3633
|
readonly 150: "0.75rem";
|
|
@@ -1663,13 +3656,12 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
1663
3656
|
readonly 200: "16px";
|
|
1664
3657
|
};
|
|
1665
3658
|
shadows: {
|
|
1666
|
-
readonly 50: "0 4px 16px #05003812";
|
|
1667
|
-
readonly 100: "0 8px 32px #05003808";
|
|
1668
3659
|
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";
|
|
1669
3660
|
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";
|
|
1670
3661
|
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";
|
|
1671
3662
|
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";
|
|
1672
3663
|
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";
|
|
3664
|
+
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";
|
|
1673
3665
|
};
|
|
1674
3666
|
sizes: {
|
|
1675
3667
|
readonly number: string;
|
|
@@ -1678,7 +3670,8 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
1678
3670
|
readonly 'icon-400': "32px";
|
|
1679
3671
|
};
|
|
1680
3672
|
space: {
|
|
1681
|
-
readonly 0:
|
|
3673
|
+
readonly 0: "0px";
|
|
3674
|
+
readonly 25: "2px";
|
|
1682
3675
|
readonly 50: "4px";
|
|
1683
3676
|
readonly 100: "8px";
|
|
1684
3677
|
readonly 150: "12px";
|
|
@@ -1709,6 +3702,7 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
1709
3702
|
readonly 400: any;
|
|
1710
3703
|
readonly 500: any;
|
|
1711
3704
|
readonly 600: any;
|
|
3705
|
+
readonly 700: any;
|
|
1712
3706
|
readonly 800: any;
|
|
1713
3707
|
readonly 1200: any;
|
|
1714
3708
|
readonly 1600: any;
|
|
@@ -1773,6 +3767,7 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
1773
3767
|
readonly borderRightColor: "colors";
|
|
1774
3768
|
readonly borderRightStyle: "border-styles";
|
|
1775
3769
|
readonly borderRightWidth: "border-widths";
|
|
3770
|
+
readonly borderSpacing: "space-offset";
|
|
1776
3771
|
readonly borderStyle: "border-styles";
|
|
1777
3772
|
readonly borderTop: "colors";
|
|
1778
3773
|
readonly borderTopColor: "colors";
|
|
@@ -1925,9 +3920,13 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
1925
3920
|
readonly [$$PropertyValue]: "width";
|
|
1926
3921
|
};
|
|
1927
3922
|
};
|
|
1928
|
-
}>>>,
|
|
1929
|
-
|
|
1930
|
-
|
|
3923
|
+
}>>>, never> & _stitches_react_types_styled_component.TransformProps<{}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLInputElement>> & _mirohq_design_system_stitches.StitchesInternals<react.ForwardRefExoticComponent<_mirohq_design_system_primitive.PrimitiveProps<"input">>, {}, {}>;
|
|
3924
|
+
declare type StyledInputProps = ComponentPropsWithRef<typeof StyledInput>;
|
|
3925
|
+
|
|
3926
|
+
interface InputProps$1 extends StyledInputProps {
|
|
3927
|
+
}
|
|
3928
|
+
|
|
3929
|
+
declare const StyledBaseInput: react.ForwardRefExoticComponent<Omit<Omit<_mirohq_design_system_stitches.StyledComponentProps<_stitches_react_types_styled_component.StyledComponent<"div", {}, {}, _stitches_react_types_css_util.CSS<{}, {
|
|
1931
3930
|
'border-widths': {
|
|
1932
3931
|
readonly none: 0;
|
|
1933
3932
|
readonly sm: "1px";
|
|
@@ -2036,6 +4035,9 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
2036
4035
|
"background-primary-subtle-pressed-hover"?: any;
|
|
2037
4036
|
"background-primary-subtle-selected"?: any;
|
|
2038
4037
|
"background-success"?: any;
|
|
4038
|
+
"background-success-prominent"?: any;
|
|
4039
|
+
"background-success-prominent-active"?: any;
|
|
4040
|
+
"background-success-prominent-hover"?: any;
|
|
2039
4041
|
"background-warning-prominent"?: any;
|
|
2040
4042
|
"background-warning-subtle"?: any;
|
|
2041
4043
|
"border-danger"?: any;
|
|
@@ -2064,6 +4066,8 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
2064
4066
|
"border-primary-hover"?: any;
|
|
2065
4067
|
"border-primary-inverted"?: any;
|
|
2066
4068
|
"border-success"?: any;
|
|
4069
|
+
"border-success-active"?: any;
|
|
4070
|
+
"border-success-hover"?: any;
|
|
2067
4071
|
"border-warning"?: any;
|
|
2068
4072
|
"icon-danger"?: any;
|
|
2069
4073
|
"icon-danger-active"?: any;
|
|
@@ -2083,9 +4087,12 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
2083
4087
|
"icon-primary-inverted"?: any;
|
|
2084
4088
|
"icon-primary-selected"?: any;
|
|
2085
4089
|
"icon-success"?: any;
|
|
4090
|
+
"icon-success-active"?: any;
|
|
4091
|
+
"icon-success-hover"?: any;
|
|
2086
4092
|
"icon-success-inverted"?: any;
|
|
2087
4093
|
"icon-warning"?: any;
|
|
2088
4094
|
"icon-warning-prominent"?: any;
|
|
4095
|
+
"icon-warning-subtle"?: any;
|
|
2089
4096
|
"text-danger"?: any;
|
|
2090
4097
|
"text-danger-active"?: any;
|
|
2091
4098
|
"text-danger-hover"?: any;
|
|
@@ -2107,7 +4114,11 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
2107
4114
|
"text-primary-inverted-subtle"?: any;
|
|
2108
4115
|
"text-primary-selected"?: any;
|
|
2109
4116
|
"text-success"?: any;
|
|
4117
|
+
"text-success-active"?: any;
|
|
4118
|
+
"text-success-hover"?: any;
|
|
4119
|
+
"text-success-inverted"?: any;
|
|
2110
4120
|
"text-warning"?: any;
|
|
4121
|
+
"text-warning-subtle"?: any;
|
|
2111
4122
|
};
|
|
2112
4123
|
'font-sizes': {
|
|
2113
4124
|
readonly 150: "0.75rem";
|
|
@@ -2136,13 +4147,12 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
2136
4147
|
readonly 200: "16px";
|
|
2137
4148
|
};
|
|
2138
4149
|
shadows: {
|
|
2139
|
-
readonly 50: "0 4px 16px #05003812";
|
|
2140
|
-
readonly 100: "0 8px 32px #05003808";
|
|
2141
4150
|
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";
|
|
2142
4151
|
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";
|
|
2143
4152
|
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";
|
|
2144
4153
|
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";
|
|
2145
4154
|
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";
|
|
4155
|
+
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";
|
|
2146
4156
|
};
|
|
2147
4157
|
sizes: {
|
|
2148
4158
|
readonly number: string;
|
|
@@ -2151,7 +4161,8 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
2151
4161
|
readonly 'icon-400': "32px";
|
|
2152
4162
|
};
|
|
2153
4163
|
space: {
|
|
2154
|
-
readonly 0:
|
|
4164
|
+
readonly 0: "0px";
|
|
4165
|
+
readonly 25: "2px";
|
|
2155
4166
|
readonly 50: "4px";
|
|
2156
4167
|
readonly 100: "8px";
|
|
2157
4168
|
readonly 150: "12px";
|
|
@@ -2182,6 +4193,7 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
2182
4193
|
readonly 400: any;
|
|
2183
4194
|
readonly 500: any;
|
|
2184
4195
|
readonly 600: any;
|
|
4196
|
+
readonly 700: any;
|
|
2185
4197
|
readonly 800: any;
|
|
2186
4198
|
readonly 1200: any;
|
|
2187
4199
|
readonly 1600: any;
|
|
@@ -2246,6 +4258,7 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
2246
4258
|
readonly borderRightColor: "colors";
|
|
2247
4259
|
readonly borderRightStyle: "border-styles";
|
|
2248
4260
|
readonly borderRightWidth: "border-widths";
|
|
4261
|
+
readonly borderSpacing: "space-offset";
|
|
2249
4262
|
readonly borderStyle: "border-styles";
|
|
2250
4263
|
readonly borderTop: "colors";
|
|
2251
4264
|
readonly borderTopColor: "colors";
|
|
@@ -2398,14 +4411,83 @@ declare const Input: react.ForwardRefExoticComponent<(Omit<Omit<Omit<_mirohq_des
|
|
|
2398
4411
|
readonly [$$PropertyValue]: "width";
|
|
2399
4412
|
};
|
|
2400
4413
|
};
|
|
2401
|
-
}>>>, "size"> & _stitches_react_types_styled_component.TransformProps<{
|
|
2402
|
-
size?: "
|
|
2403
|
-
|
|
2404
|
-
|
|
2405
|
-
|
|
4414
|
+
}>>>, "size" | "disabled" | "readOnly" | "ariaDisabled" | "valid" | "hovered" | "focused"> & _stitches_react_types_styled_component.TransformProps<{
|
|
4415
|
+
size?: "large" | "x-large" | undefined;
|
|
4416
|
+
hovered?: boolean | "false" | "true" | undefined;
|
|
4417
|
+
focused?: boolean | "false" | "true" | undefined;
|
|
4418
|
+
valid?: boolean | "false" | "true" | undefined;
|
|
4419
|
+
readOnly?: boolean | "false" | "true" | undefined;
|
|
4420
|
+
disabled?: boolean | "false" | "true" | undefined;
|
|
4421
|
+
ariaDisabled?: boolean | "false" | "true" | undefined;
|
|
4422
|
+
}, {}> & _mirohq_design_system_stitches.CustomStylesProps, "ref"> & react.RefAttributes<HTMLDivElement>> & _mirohq_design_system_stitches.StitchesInternals<"div", {
|
|
4423
|
+
size?: "large" | "x-large" | undefined;
|
|
4424
|
+
hovered?: boolean | "false" | "true" | undefined;
|
|
4425
|
+
focused?: boolean | "false" | "true" | undefined;
|
|
4426
|
+
valid?: boolean | "false" | "true" | undefined;
|
|
4427
|
+
readOnly?: boolean | "false" | "true" | undefined;
|
|
4428
|
+
disabled?: boolean | "false" | "true" | undefined;
|
|
4429
|
+
ariaDisabled?: boolean | "false" | "true" | undefined;
|
|
4430
|
+
}, {}>;
|
|
4431
|
+
declare type StyledBaseInputProps = ComponentPropsWithRef<typeof StyledBaseInput>;
|
|
4432
|
+
|
|
4433
|
+
interface BaseInputProps extends Omit<StyledBaseInputProps, keyof DOMAttributes<Element>> {
|
|
4434
|
+
'aria-disabled'?: Booleanish | undefined;
|
|
4435
|
+
disabled?: boolean | undefined;
|
|
4436
|
+
readOnly?: boolean | undefined;
|
|
4437
|
+
valid?: boolean | undefined;
|
|
4438
|
+
hovered?: boolean | undefined;
|
|
4439
|
+
focused?: boolean | undefined;
|
|
4440
|
+
children: react__default.ReactNode;
|
|
4441
|
+
}
|
|
4442
|
+
|
|
4443
|
+
interface InputSharedProps extends Omit<InputProps$1, 'size'> {
|
|
4444
|
+
/** The input's state is indicated by both an icon and border color. A
|
|
4445
|
+
* green check mark signifies valid input, while a red warning icon denotes
|
|
4446
|
+
* invalid input. In both cases, the border color mirrors the icon: green for
|
|
4447
|
+
* valid, red for invalid.
|
|
4448
|
+
* */
|
|
4449
|
+
valid?: BaseInputProps['valid'];
|
|
4450
|
+
/**
|
|
4451
|
+
* The size of the input.
|
|
4452
|
+
*/
|
|
4453
|
+
size?: BaseInputProps['size'];
|
|
4454
|
+
/**
|
|
4455
|
+
* Input's content.
|
|
4456
|
+
*/
|
|
4457
|
+
children?: React.ReactNode;
|
|
4458
|
+
}
|
|
4459
|
+
|
|
4460
|
+
declare type Value$1 = HTMLProps<'input'>['value'];
|
|
4461
|
+
interface ClearProps {
|
|
4462
|
+
/**
|
|
4463
|
+
* Show X button for clearing the input value.
|
|
4464
|
+
*/
|
|
4465
|
+
clearable: boolean;
|
|
4466
|
+
/**
|
|
4467
|
+
* Tooltip label for the clear button.
|
|
4468
|
+
*/
|
|
4469
|
+
clearLabel: string;
|
|
4470
|
+
/**
|
|
4471
|
+
* Callback event called when clearing the input.
|
|
4472
|
+
*/
|
|
4473
|
+
onClear?: (value: Value$1) => void;
|
|
4474
|
+
/**
|
|
4475
|
+
* The controlled input's value.
|
|
4476
|
+
*/
|
|
4477
|
+
value?: Value$1;
|
|
4478
|
+
}
|
|
4479
|
+
|
|
4480
|
+
declare type InputProps = InputSharedProps & ({
|
|
4481
|
+
clearable?: never;
|
|
4482
|
+
} | ClearProps);
|
|
4483
|
+
declare const Input: react__default.ForwardRefExoticComponent<InputProps> & Partials$2;
|
|
4484
|
+
interface Partials$2 {
|
|
4485
|
+
ActionButton: typeof ActionButton;
|
|
4486
|
+
IconSlot: typeof IconSlot;
|
|
4487
|
+
}
|
|
2406
4488
|
|
|
2407
4489
|
declare type Value = HTMLProps<'input'>['value'];
|
|
2408
|
-
interface InputPasswordProps extends Omit<
|
|
4490
|
+
interface InputPasswordProps extends Omit<InputSharedProps, 'type' | 'children'> {
|
|
2409
4491
|
/**
|
|
2410
4492
|
* A boolean for the default password state (visible or masked).
|
|
2411
4493
|
*/
|
|
@@ -2433,4 +4515,20 @@ interface InputPasswordProps extends Omit<StyledBaseInputProps, 'type'> {
|
|
|
2433
4515
|
}
|
|
2434
4516
|
declare const InputPassword: react__default.ForwardRefExoticComponent<Omit<InputPasswordProps, "ref"> & react__default.RefAttributes<HTMLInputElement>>;
|
|
2435
4517
|
|
|
2436
|
-
|
|
4518
|
+
declare type InputEmailProps = InputSharedProps & ({
|
|
4519
|
+
clearable?: never;
|
|
4520
|
+
} | ClearProps);
|
|
4521
|
+
declare const InputEmail: react__default.ForwardRefExoticComponent<InputEmailProps> & Partials$1;
|
|
4522
|
+
interface Partials$1 {
|
|
4523
|
+
ActionButton: typeof ActionButton;
|
|
4524
|
+
}
|
|
4525
|
+
|
|
4526
|
+
declare type InputSearchProps = InputSharedProps & ({
|
|
4527
|
+
clearable?: never;
|
|
4528
|
+
} | ClearProps);
|
|
4529
|
+
declare const InputSearch: react__default.ForwardRefExoticComponent<InputSearchProps> & Partials;
|
|
4530
|
+
interface Partials {
|
|
4531
|
+
ActionButton: typeof ActionButton;
|
|
4532
|
+
}
|
|
4533
|
+
|
|
4534
|
+
export { Input, ActionButtonProps as InputActionButtonProps, InputEmail, InputEmailProps, IconSlotProps as InputIconSlotProps, InputPassword, InputPasswordProps, InputProps, InputSearch, InputSearchProps };
|