@ovotech/element-native 5.6.0 → 5.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (102) hide show
  1. package/dist/components/Accordion/styles.d.ts +3 -1734
  2. package/dist/components/ActionList/ActionListItems/DataListItem.js +3 -1
  3. package/dist/components/ActionList/ActionListItems/ToggleListItem.js +3 -4
  4. package/dist/components/ActionList/ActionListItems/styles.d.ts +22 -10404
  5. package/dist/components/ActionList/ActionListItems/styles.js +18 -16
  6. package/dist/components/ActionList/styled.d.ts +12 -6936
  7. package/dist/components/Badge/Badge.d.ts +1 -578
  8. package/dist/components/BottomActionBar/BottomActionBar.d.ts +12 -0
  9. package/dist/components/BottomActionBar/BottomActionBar.js +80 -0
  10. package/dist/components/BottomActionBar/OverlayProvider.d.ts +8 -0
  11. package/dist/components/BottomActionBar/OverlayProvider.js +38 -0
  12. package/dist/components/BottomActionBar/index.d.ts +2 -0
  13. package/dist/components/BottomActionBar/index.js +7 -0
  14. package/dist/components/Button/Button.styles.d.ts +5 -2312
  15. package/dist/components/Card/Card.styles.d.ts +3 -1734
  16. package/dist/components/Cards/AccountCard/AccountCard.styles.d.ts +8 -4624
  17. package/dist/components/Cards/BalanceCard/BalanceCard.styles.d.ts +15 -8670
  18. package/dist/components/Cards/DisruptiveCard/DisruptiveCard.styles.d.ts +1 -578
  19. package/dist/components/Cards/HeroImageCard/HeroImageCard.styles.d.ts +3 -1734
  20. package/dist/components/Cards/IconDataCard/IconDataCard.styles.d.ts +4 -2312
  21. package/dist/components/Cards/IconTextCard/IconTextCard.styles.d.ts +3 -1734
  22. package/dist/components/Cards/IllustrationTextCard/IllustrationTextCard.styles.d.ts +5 -2890
  23. package/dist/components/Cards/IllustrationTextCard/IllustrationTextCard.styles.js +1 -2
  24. package/dist/components/Cards/LinkTextCard/LinkTextCard.styles.d.ts +5 -2890
  25. package/dist/components/Cards/OfferCard/OfferCard.d.ts +22 -0
  26. package/dist/components/Cards/OfferCard/OfferCard.js +36 -0
  27. package/dist/components/Cards/OfferCard/OfferCard.styles.d.ts +34 -0
  28. package/dist/components/Cards/OfferCard/OfferCard.styles.js +61 -0
  29. package/dist/components/Cards/OfferCard/index.d.ts +1 -0
  30. package/dist/components/Cards/OfferCard/index.js +17 -0
  31. package/dist/components/Cards/ProgressBarCard/ProgressBarCard.styles.d.ts +9 -5202
  32. package/dist/components/Cards/QuickLinkCard/QuickLinkCard.styles.d.ts +5 -2890
  33. package/dist/components/Cards/ServicesImageCard/ServicesImageCard.styles.d.ts +5 -2890
  34. package/dist/components/Cards/shared.styles.d.ts +10 -5780
  35. package/dist/components/Checkbox/styled.d.ts +6 -3468
  36. package/dist/components/CurrencyInput/styled.d.ts +4 -2312
  37. package/dist/components/DataTable/styles.d.ts +13 -7514
  38. package/dist/components/Disclosure/Disclosure.d.ts +1 -578
  39. package/dist/components/Em/Em.d.ts +1 -578
  40. package/dist/components/EmptyState/styles.d.ts +2 -1156
  41. package/dist/components/ErrorText/ErrorText.d.ts +1 -578
  42. package/dist/components/Grid/Col.d.ts +1 -578
  43. package/dist/components/HintText/HintText.d.ts +1 -578
  44. package/dist/components/Input/styled.d.ts +3 -1734
  45. package/dist/components/LabelText/LabelText.d.ts +1 -578
  46. package/dist/components/LargeValueReference/styles.d.ts +3 -1734
  47. package/dist/components/LineThrough/LineThrough.d.ts +1 -578
  48. package/dist/components/List/styled.d.ts +4 -2312
  49. package/dist/components/Margin/Margin.d.ts +1 -578
  50. package/dist/components/NavHeader/NavHeader.styles.d.ts +11 -6358
  51. package/dist/components/Notification/Notification.d.ts +2 -2
  52. package/dist/components/Notification/Notification.js +20 -12
  53. package/dist/components/Notification/Notification.styles.d.ts +13 -5202
  54. package/dist/components/Notification/Notification.styles.js +21 -2
  55. package/dist/components/PasswordInput/PasswordInput.styled.d.ts +1 -578
  56. package/dist/components/Radio/Radio.d.ts +2 -2
  57. package/dist/components/Radio/Radio.js +5 -43
  58. package/dist/components/Radio/Radio.styles.d.ts +9 -0
  59. package/dist/components/Radio/Radio.styles.js +74 -0
  60. package/dist/components/RadioCard/RadioCard.styles.d.ts +5 -2890
  61. package/dist/components/Rail/Rail.d.ts +12 -0
  62. package/dist/components/Rail/Rail.js +58 -0
  63. package/dist/components/Rail/RailIndicator.d.ts +7 -0
  64. package/dist/components/Rail/RailIndicator.js +81 -0
  65. package/dist/components/Rail/index.d.ts +1 -0
  66. package/dist/components/Rail/index.js +5 -0
  67. package/dist/components/Rail/styles.d.ts +13 -0
  68. package/dist/components/Rail/styles.js +55 -0
  69. package/dist/components/Rail/useRailPaging.d.ts +13 -0
  70. package/dist/components/Rail/useRailPaging.js +95 -0
  71. package/dist/components/SelectField/styled.d.ts +8 -4624
  72. package/dist/components/Strong/Strong.d.ts +1 -578
  73. package/dist/components/SubLabelText/SubLabelText.d.ts +1 -578
  74. package/dist/components/Tabs/Tab.d.ts +1 -578
  75. package/dist/components/Toast/Toast.d.ts +10 -4
  76. package/dist/components/Toast/Toast.js +40 -27
  77. package/dist/components/Toggle/styles.d.ts +4 -2312
  78. package/dist/components/index.d.ts +2 -0
  79. package/dist/components/index.js +2 -0
  80. package/dist/esm/components/ActionList/ActionListItems/DataListItem.js +3 -1
  81. package/dist/esm/components/ActionList/ActionListItems/ToggleListItem.js +5 -6
  82. package/dist/esm/components/ActionList/ActionListItems/styles.js +17 -15
  83. package/dist/esm/components/BottomActionBar/BottomActionBar.js +40 -0
  84. package/dist/esm/components/BottomActionBar/OverlayProvider.js +30 -0
  85. package/dist/esm/components/BottomActionBar/index.js +2 -0
  86. package/dist/esm/components/Cards/IllustrationTextCard/IllustrationTextCard.styles.js +1 -2
  87. package/dist/esm/components/Cards/OfferCard/OfferCard.js +32 -0
  88. package/dist/esm/components/Cards/OfferCard/OfferCard.styles.js +55 -0
  89. package/dist/esm/components/Cards/OfferCard/index.js +1 -0
  90. package/dist/esm/components/Notification/Notification.js +21 -13
  91. package/dist/esm/components/Notification/Notification.styles.js +20 -1
  92. package/dist/esm/components/Radio/Radio.js +4 -39
  93. package/dist/esm/components/Radio/Radio.styles.js +38 -0
  94. package/dist/esm/components/Rail/Rail.js +21 -0
  95. package/dist/esm/components/Rail/RailIndicator.js +44 -0
  96. package/dist/esm/components/Rail/index.js +1 -0
  97. package/dist/esm/components/Rail/styles.js +49 -0
  98. package/dist/esm/components/Rail/useRailPaging.js +92 -0
  99. package/dist/esm/components/Toast/Toast.js +40 -27
  100. package/dist/esm/components/index.js +2 -0
  101. package/dist/styled.native.d.ts +1 -3463
  102. package/package.json +2 -2
@@ -1,1747 +1,16 @@
1
1
  import { Breakpoints } from '../../hooks';
2
2
  export declare const ICON_SIZE = 20;
3
- export declare const StyledInputWrapper: import("styled-components").StyledComponent<typeof import("react-native").View, {
4
- color: {
5
- neutral: {
6
- "20": string;
7
- "30": string;
8
- "40": string;
9
- "50": string;
10
- "60": string;
11
- "70": string;
12
- "80": string;
13
- white: string;
14
- black: string;
15
- };
16
- red: {
17
- "20": string;
18
- "30": string;
19
- "40": string;
20
- "50": string;
21
- "60": string;
22
- "70": string;
23
- "80": string;
24
- };
25
- orange: {
26
- "20": string;
27
- "30": string;
28
- "40": string;
29
- "50": string;
30
- "60": string;
31
- "70": string;
32
- };
33
- yellow: {
34
- "70": string;
35
- "80": string;
36
- };
37
- green: {
38
- "20": string;
39
- "30": string;
40
- "40": string;
41
- "50": string;
42
- "55": string;
43
- "56": string;
44
- "60": string;
45
- "70": string;
46
- "80": string;
47
- "90": string;
48
- };
49
- blue: {
50
- "20": string;
51
- "30": string;
52
- "40": string;
53
- "50": string;
54
- "60": string;
55
- "70": string;
56
- };
57
- alert: {
58
- success: string;
59
- successTint: string;
60
- warning: string;
61
- warningTint: string;
62
- error: string;
63
- errorTint: string;
64
- info: string;
65
- infoTint: string;
66
- neutral: string;
67
- neutralTint: string;
68
- border: string;
69
- };
70
- input: {
71
- borderDim: string;
72
- };
73
- brand: {
74
- brand: string;
75
- dark: string;
76
- dim: string;
77
- bold: string;
78
- bright: string;
79
- gradientFrom: string;
80
- gradientTo: string;
81
- onBrand: string;
82
- onBrandVariant: string;
83
- aiGradientFrom: string;
84
- aiGradientTo: string;
85
- accessible: string;
86
- fixed: {
87
- brand: string;
88
- dark: string;
89
- dim: string;
90
- bold: string;
91
- bright: string;
92
- onBrand: string;
93
- onBrandVariant: string;
94
- accessible: string;
95
- };
96
- };
97
- outline: {
98
- outer: string;
99
- inner: string;
100
- };
101
- surface: {
102
- surface: string;
103
- bright: string;
104
- dim: string;
105
- onSurface: string;
106
- onSurfaceVariant: string;
107
- border: string;
108
- borderDim: string;
109
- link: string;
110
- electricity: string;
111
- gas: string;
112
- fadeFrom: string;
113
- fadeTo: string;
114
- fixed: {
115
- onSurface: string;
116
- bright: string;
117
- };
118
- };
119
- };
120
- transition: {
121
- duration: {
122
- fast: number;
123
- medium: number;
124
- slow: number;
125
- };
126
- };
127
- unit: {
128
- "0": number;
129
- "25": number;
130
- "50": number;
131
- "100": number;
132
- "200": number;
133
- "300": number;
134
- "350": number;
135
- "400": number;
136
- "450": number;
137
- "500": number;
138
- "550": number;
139
- "600": number;
140
- "700": number;
141
- "800": number;
142
- "900": number;
143
- "1000": number;
144
- "1100": number;
145
- "1200": number;
146
- "1300": number;
147
- "1400": number;
148
- "1500": number;
149
- "1600": number;
150
- "1800": number;
151
- "2000": number;
152
- "2400": number;
153
- "3000": number;
154
- "3500": number;
155
- };
156
- border: {
157
- radius: {
158
- xs: number;
159
- sm: number;
160
- md: number;
161
- lg: number;
162
- xl: number;
163
- "2xl": number;
164
- "3xl": number;
165
- };
166
- width: {
167
- sm: number;
168
- md: number;
169
- lg: number;
170
- };
171
- };
172
- breakpoint: {
173
- xsmall: number;
174
- small: number;
175
- medium: number;
176
- large: number;
177
- };
178
- native: {
179
- font: {
180
- family: {
181
- black: string;
182
- book: string;
183
- bold: string;
184
- };
185
- };
186
- };
187
- web: {
188
- font: {
189
- family: string;
190
- };
191
- };
192
- font: {
193
- letterSpacing: {
194
- d1: {
195
- mediaQuery: {
196
- sm: number;
197
- lg: number;
198
- };
199
- };
200
- d2: {
201
- mediaQuery: {
202
- sm: number;
203
- lg: number;
204
- };
205
- };
206
- d3: {
207
- mediaQuery: {
208
- sm: number;
209
- lg: number;
210
- };
211
- };
212
- d4: {
213
- mediaQuery: {
214
- sm: number;
215
- lg: number;
216
- };
217
- };
218
- "4xl": {
219
- mediaQuery: {
220
- sm: number;
221
- lg: number;
222
- };
223
- };
224
- "3xl": {
225
- mediaQuery: {
226
- sm: number;
227
- lg: number;
228
- };
229
- };
230
- "2xl": {
231
- mediaQuery: {
232
- sm: number;
233
- lg: number;
234
- };
235
- };
236
- xl: {
237
- mediaQuery: {
238
- sm: number;
239
- lg: number;
240
- };
241
- };
242
- lg: {
243
- mediaQuery: {
244
- sm: number;
245
- lg: number;
246
- };
247
- };
248
- md: {
249
- mediaQuery: {
250
- sm: number;
251
- lg: number;
252
- };
253
- };
254
- sm: {
255
- mediaQuery: {
256
- sm: number;
257
- lg: number;
258
- };
259
- };
260
- xs: {
261
- mediaQuery: {
262
- sm: number;
263
- lg: number;
264
- };
265
- };
266
- };
267
- lineHeight: {
268
- d1: {
269
- mediaQuery: {
270
- sm: number;
271
- lg: number;
272
- };
273
- };
274
- d2: {
275
- mediaQuery: {
276
- sm: number;
277
- lg: number;
278
- };
279
- };
280
- d3: {
281
- mediaQuery: {
282
- sm: number;
283
- lg: number;
284
- };
285
- };
286
- d4: {
287
- mediaQuery: {
288
- sm: number;
289
- lg: number;
290
- };
291
- };
292
- "4xl": {
293
- mediaQuery: {
294
- sm: number;
295
- lg: number;
296
- };
297
- };
298
- "3xl": {
299
- mediaQuery: {
300
- sm: number;
301
- lg: number;
302
- };
303
- };
304
- "2xl": {
305
- mediaQuery: {
306
- sm: number;
307
- lg: number;
308
- };
309
- };
310
- xl: {
311
- mediaQuery: {
312
- sm: number;
313
- lg: number;
314
- };
315
- };
316
- lg: {
317
- mediaQuery: {
318
- sm: number;
319
- lg: number;
320
- };
321
- };
322
- md: {
323
- mediaQuery: {
324
- sm: number;
325
- lg: number;
326
- };
327
- };
328
- sm: {
329
- mediaQuery: {
330
- sm: number;
331
- lg: number;
332
- };
333
- };
334
- xs: {
335
- mediaQuery: {
336
- sm: number;
337
- lg: number;
338
- };
339
- };
340
- };
341
- paragraphSpace: {
342
- d1: {
343
- mediaQuery: {
344
- sm: number;
345
- lg: number;
346
- };
347
- };
348
- d2: {
349
- mediaQuery: {
350
- sm: number;
351
- lg: number;
352
- };
353
- };
354
- d3: {
355
- mediaQuery: {
356
- sm: number;
357
- lg: number;
358
- };
359
- };
360
- d4: {
361
- mediaQuery: {
362
- sm: number;
363
- lg: number;
364
- };
365
- };
366
- "4xl": {
367
- mediaQuery: {
368
- sm: number;
369
- lg: number;
370
- };
371
- };
372
- "3xl": {
373
- mediaQuery: {
374
- sm: number;
375
- lg: number;
376
- };
377
- };
378
- "2xl": {
379
- mediaQuery: {
380
- sm: number;
381
- lg: number;
382
- };
383
- };
384
- xl: {
385
- mediaQuery: {
386
- sm: number;
387
- lg: number;
388
- };
389
- };
390
- lg: {
391
- mediaQuery: {
392
- sm: number;
393
- lg: number;
394
- };
395
- };
396
- md: {
397
- mediaQuery: {
398
- sm: number;
399
- lg: number;
400
- };
401
- };
402
- sm: {
403
- mediaQuery: {
404
- sm: number;
405
- lg: number;
406
- };
407
- };
408
- xs: {
409
- mediaQuery: {
410
- sm: number;
411
- lg: number;
412
- };
413
- };
414
- };
415
- size: {
416
- d1: {
417
- mediaQuery: {
418
- sm: number;
419
- lg: number;
420
- };
421
- };
422
- d2: {
423
- mediaQuery: {
424
- sm: number;
425
- lg: number;
426
- };
427
- };
428
- d3: {
429
- mediaQuery: {
430
- sm: number;
431
- lg: number;
432
- };
433
- };
434
- d4: {
435
- mediaQuery: {
436
- sm: number;
437
- lg: number;
438
- };
439
- };
440
- "4xl": {
441
- mediaQuery: {
442
- sm: number;
443
- lg: number;
444
- };
445
- };
446
- "3xl": {
447
- mediaQuery: {
448
- sm: number;
449
- lg: number;
450
- };
451
- };
452
- "2xl": {
453
- mediaQuery: {
454
- sm: number;
455
- lg: number;
456
- };
457
- };
458
- xl: {
459
- mediaQuery: {
460
- sm: number;
461
- lg: number;
462
- };
463
- };
464
- lg: {
465
- mediaQuery: {
466
- sm: number;
467
- lg: number;
468
- };
469
- };
470
- md: {
471
- mediaQuery: {
472
- sm: number;
473
- lg: number;
474
- };
475
- };
476
- sm: {
477
- mediaQuery: {
478
- sm: number;
479
- lg: number;
480
- };
481
- };
482
- xs: {
483
- mediaQuery: {
484
- sm: number;
485
- lg: number;
486
- };
487
- };
488
- };
489
- weight: {
490
- book: number;
491
- bold: number;
492
- black: number;
493
- };
494
- };
495
- mediaQuery: {
496
- xsmall: number;
497
- small: number;
498
- medium: number;
499
- large: number;
500
- };
501
- customMediaQuery: {
502
- "xsmall-and-up": number;
503
- "small-and-up": number;
504
- "medium-and-up": number;
505
- "large-and-up": number;
506
- };
507
- opacity: {
508
- solid: number;
509
- translucent: number;
510
- transparent: number;
511
- };
512
- space: {
513
- "0": number;
514
- "25": number;
515
- "50": number;
516
- "100": number;
517
- "150": number;
518
- "200": number;
519
- "250": number;
520
- "300": number;
521
- "350": number;
522
- "400": number;
523
- "450": number;
524
- "500": number;
525
- "550": number;
526
- "600": number;
527
- "700": number;
528
- "800": number;
529
- "900": number;
530
- "1000": number;
531
- "1100": number;
532
- "1200": number;
533
- "1300": number;
534
- "1400": number;
535
- "1500": number;
536
- "1600": number;
537
- "1800": number;
538
- "2000": number;
539
- "2400": number;
540
- "3000": number;
541
- "3500": number;
542
- base: number;
543
- };
544
- button: {
545
- color: {
546
- focus: {
547
- blue: string;
548
- white: string;
549
- };
550
- };
551
- surface: {
552
- color: {
553
- fg: string;
554
- bg: string;
555
- bgVariant: string;
556
- bgHover: string;
557
- fgInverted: string;
558
- bgInverted: string;
559
- bgInvertedHover: string;
560
- };
561
- };
562
- destructive: {
563
- color: {
564
- fg: string;
565
- bg: string;
566
- bgHover: string;
567
- };
568
- };
569
- };
570
- input: {
571
- color: {
572
- label: string;
573
- border: string;
574
- borderError: string;
575
- hint: string;
576
- selected: string;
577
- selectedTint: string;
578
- };
579
- };
580
- }, {
3
+ export declare const StyledInputWrapper: import("styled-components").StyledComponent<typeof import("react-native").View, import("@ovotech/element-core/dist/tokens-build/theme-native.types").ThemeNative, {
581
4
  focused: boolean;
582
5
  hasError: boolean;
583
6
  isSelected?: boolean;
584
7
  }, never>;
585
- export declare const StyledInput: import("styled-components").StyledComponent<typeof import("react-native").TextInput, {
586
- color: {
587
- neutral: {
588
- "20": string;
589
- "30": string;
590
- "40": string;
591
- "50": string;
592
- "60": string;
593
- "70": string;
594
- "80": string;
595
- white: string;
596
- black: string;
597
- };
598
- red: {
599
- "20": string;
600
- "30": string;
601
- "40": string;
602
- "50": string;
603
- "60": string;
604
- "70": string;
605
- "80": string;
606
- };
607
- orange: {
608
- "20": string;
609
- "30": string;
610
- "40": string;
611
- "50": string;
612
- "60": string;
613
- "70": string;
614
- };
615
- yellow: {
616
- "70": string;
617
- "80": string;
618
- };
619
- green: {
620
- "20": string;
621
- "30": string;
622
- "40": string;
623
- "50": string;
624
- "55": string;
625
- "56": string;
626
- "60": string;
627
- "70": string;
628
- "80": string;
629
- "90": string;
630
- };
631
- blue: {
632
- "20": string;
633
- "30": string;
634
- "40": string;
635
- "50": string;
636
- "60": string;
637
- "70": string;
638
- };
639
- alert: {
640
- success: string;
641
- successTint: string;
642
- warning: string;
643
- warningTint: string;
644
- error: string;
645
- errorTint: string;
646
- info: string;
647
- infoTint: string;
648
- neutral: string;
649
- neutralTint: string;
650
- border: string;
651
- };
652
- input: {
653
- borderDim: string;
654
- };
655
- brand: {
656
- brand: string;
657
- dark: string;
658
- dim: string;
659
- bold: string;
660
- bright: string;
661
- gradientFrom: string;
662
- gradientTo: string;
663
- onBrand: string;
664
- onBrandVariant: string;
665
- aiGradientFrom: string;
666
- aiGradientTo: string;
667
- accessible: string;
668
- fixed: {
669
- brand: string;
670
- dark: string;
671
- dim: string;
672
- bold: string;
673
- bright: string;
674
- onBrand: string;
675
- onBrandVariant: string;
676
- accessible: string;
677
- };
678
- };
679
- outline: {
680
- outer: string;
681
- inner: string;
682
- };
683
- surface: {
684
- surface: string;
685
- bright: string;
686
- dim: string;
687
- onSurface: string;
688
- onSurfaceVariant: string;
689
- border: string;
690
- borderDim: string;
691
- link: string;
692
- electricity: string;
693
- gas: string;
694
- fadeFrom: string;
695
- fadeTo: string;
696
- fixed: {
697
- onSurface: string;
698
- bright: string;
699
- };
700
- };
701
- };
702
- transition: {
703
- duration: {
704
- fast: number;
705
- medium: number;
706
- slow: number;
707
- };
708
- };
709
- unit: {
710
- "0": number;
711
- "25": number;
712
- "50": number;
713
- "100": number;
714
- "200": number;
715
- "300": number;
716
- "350": number;
717
- "400": number;
718
- "450": number;
719
- "500": number;
720
- "550": number;
721
- "600": number;
722
- "700": number;
723
- "800": number;
724
- "900": number;
725
- "1000": number;
726
- "1100": number;
727
- "1200": number;
728
- "1300": number;
729
- "1400": number;
730
- "1500": number;
731
- "1600": number;
732
- "1800": number;
733
- "2000": number;
734
- "2400": number;
735
- "3000": number;
736
- "3500": number;
737
- };
738
- border: {
739
- radius: {
740
- xs: number;
741
- sm: number;
742
- md: number;
743
- lg: number;
744
- xl: number;
745
- "2xl": number;
746
- "3xl": number;
747
- };
748
- width: {
749
- sm: number;
750
- md: number;
751
- lg: number;
752
- };
753
- };
754
- breakpoint: {
755
- xsmall: number;
756
- small: number;
757
- medium: number;
758
- large: number;
759
- };
760
- native: {
761
- font: {
762
- family: {
763
- black: string;
764
- book: string;
765
- bold: string;
766
- };
767
- };
768
- };
769
- web: {
770
- font: {
771
- family: string;
772
- };
773
- };
774
- font: {
775
- letterSpacing: {
776
- d1: {
777
- mediaQuery: {
778
- sm: number;
779
- lg: number;
780
- };
781
- };
782
- d2: {
783
- mediaQuery: {
784
- sm: number;
785
- lg: number;
786
- };
787
- };
788
- d3: {
789
- mediaQuery: {
790
- sm: number;
791
- lg: number;
792
- };
793
- };
794
- d4: {
795
- mediaQuery: {
796
- sm: number;
797
- lg: number;
798
- };
799
- };
800
- "4xl": {
801
- mediaQuery: {
802
- sm: number;
803
- lg: number;
804
- };
805
- };
806
- "3xl": {
807
- mediaQuery: {
808
- sm: number;
809
- lg: number;
810
- };
811
- };
812
- "2xl": {
813
- mediaQuery: {
814
- sm: number;
815
- lg: number;
816
- };
817
- };
818
- xl: {
819
- mediaQuery: {
820
- sm: number;
821
- lg: number;
822
- };
823
- };
824
- lg: {
825
- mediaQuery: {
826
- sm: number;
827
- lg: number;
828
- };
829
- };
830
- md: {
831
- mediaQuery: {
832
- sm: number;
833
- lg: number;
834
- };
835
- };
836
- sm: {
837
- mediaQuery: {
838
- sm: number;
839
- lg: number;
840
- };
841
- };
842
- xs: {
843
- mediaQuery: {
844
- sm: number;
845
- lg: number;
846
- };
847
- };
848
- };
849
- lineHeight: {
850
- d1: {
851
- mediaQuery: {
852
- sm: number;
853
- lg: number;
854
- };
855
- };
856
- d2: {
857
- mediaQuery: {
858
- sm: number;
859
- lg: number;
860
- };
861
- };
862
- d3: {
863
- mediaQuery: {
864
- sm: number;
865
- lg: number;
866
- };
867
- };
868
- d4: {
869
- mediaQuery: {
870
- sm: number;
871
- lg: number;
872
- };
873
- };
874
- "4xl": {
875
- mediaQuery: {
876
- sm: number;
877
- lg: number;
878
- };
879
- };
880
- "3xl": {
881
- mediaQuery: {
882
- sm: number;
883
- lg: number;
884
- };
885
- };
886
- "2xl": {
887
- mediaQuery: {
888
- sm: number;
889
- lg: number;
890
- };
891
- };
892
- xl: {
893
- mediaQuery: {
894
- sm: number;
895
- lg: number;
896
- };
897
- };
898
- lg: {
899
- mediaQuery: {
900
- sm: number;
901
- lg: number;
902
- };
903
- };
904
- md: {
905
- mediaQuery: {
906
- sm: number;
907
- lg: number;
908
- };
909
- };
910
- sm: {
911
- mediaQuery: {
912
- sm: number;
913
- lg: number;
914
- };
915
- };
916
- xs: {
917
- mediaQuery: {
918
- sm: number;
919
- lg: number;
920
- };
921
- };
922
- };
923
- paragraphSpace: {
924
- d1: {
925
- mediaQuery: {
926
- sm: number;
927
- lg: number;
928
- };
929
- };
930
- d2: {
931
- mediaQuery: {
932
- sm: number;
933
- lg: number;
934
- };
935
- };
936
- d3: {
937
- mediaQuery: {
938
- sm: number;
939
- lg: number;
940
- };
941
- };
942
- d4: {
943
- mediaQuery: {
944
- sm: number;
945
- lg: number;
946
- };
947
- };
948
- "4xl": {
949
- mediaQuery: {
950
- sm: number;
951
- lg: number;
952
- };
953
- };
954
- "3xl": {
955
- mediaQuery: {
956
- sm: number;
957
- lg: number;
958
- };
959
- };
960
- "2xl": {
961
- mediaQuery: {
962
- sm: number;
963
- lg: number;
964
- };
965
- };
966
- xl: {
967
- mediaQuery: {
968
- sm: number;
969
- lg: number;
970
- };
971
- };
972
- lg: {
973
- mediaQuery: {
974
- sm: number;
975
- lg: number;
976
- };
977
- };
978
- md: {
979
- mediaQuery: {
980
- sm: number;
981
- lg: number;
982
- };
983
- };
984
- sm: {
985
- mediaQuery: {
986
- sm: number;
987
- lg: number;
988
- };
989
- };
990
- xs: {
991
- mediaQuery: {
992
- sm: number;
993
- lg: number;
994
- };
995
- };
996
- };
997
- size: {
998
- d1: {
999
- mediaQuery: {
1000
- sm: number;
1001
- lg: number;
1002
- };
1003
- };
1004
- d2: {
1005
- mediaQuery: {
1006
- sm: number;
1007
- lg: number;
1008
- };
1009
- };
1010
- d3: {
1011
- mediaQuery: {
1012
- sm: number;
1013
- lg: number;
1014
- };
1015
- };
1016
- d4: {
1017
- mediaQuery: {
1018
- sm: number;
1019
- lg: number;
1020
- };
1021
- };
1022
- "4xl": {
1023
- mediaQuery: {
1024
- sm: number;
1025
- lg: number;
1026
- };
1027
- };
1028
- "3xl": {
1029
- mediaQuery: {
1030
- sm: number;
1031
- lg: number;
1032
- };
1033
- };
1034
- "2xl": {
1035
- mediaQuery: {
1036
- sm: number;
1037
- lg: number;
1038
- };
1039
- };
1040
- xl: {
1041
- mediaQuery: {
1042
- sm: number;
1043
- lg: number;
1044
- };
1045
- };
1046
- lg: {
1047
- mediaQuery: {
1048
- sm: number;
1049
- lg: number;
1050
- };
1051
- };
1052
- md: {
1053
- mediaQuery: {
1054
- sm: number;
1055
- lg: number;
1056
- };
1057
- };
1058
- sm: {
1059
- mediaQuery: {
1060
- sm: number;
1061
- lg: number;
1062
- };
1063
- };
1064
- xs: {
1065
- mediaQuery: {
1066
- sm: number;
1067
- lg: number;
1068
- };
1069
- };
1070
- };
1071
- weight: {
1072
- book: number;
1073
- bold: number;
1074
- black: number;
1075
- };
1076
- };
1077
- mediaQuery: {
1078
- xsmall: number;
1079
- small: number;
1080
- medium: number;
1081
- large: number;
1082
- };
1083
- customMediaQuery: {
1084
- "xsmall-and-up": number;
1085
- "small-and-up": number;
1086
- "medium-and-up": number;
1087
- "large-and-up": number;
1088
- };
1089
- opacity: {
1090
- solid: number;
1091
- translucent: number;
1092
- transparent: number;
1093
- };
1094
- space: {
1095
- "0": number;
1096
- "25": number;
1097
- "50": number;
1098
- "100": number;
1099
- "150": number;
1100
- "200": number;
1101
- "250": number;
1102
- "300": number;
1103
- "350": number;
1104
- "400": number;
1105
- "450": number;
1106
- "500": number;
1107
- "550": number;
1108
- "600": number;
1109
- "700": number;
1110
- "800": number;
1111
- "900": number;
1112
- "1000": number;
1113
- "1100": number;
1114
- "1200": number;
1115
- "1300": number;
1116
- "1400": number;
1117
- "1500": number;
1118
- "1600": number;
1119
- "1800": number;
1120
- "2000": number;
1121
- "2400": number;
1122
- "3000": number;
1123
- "3500": number;
1124
- base: number;
1125
- };
1126
- button: {
1127
- color: {
1128
- focus: {
1129
- blue: string;
1130
- white: string;
1131
- };
1132
- };
1133
- surface: {
1134
- color: {
1135
- fg: string;
1136
- bg: string;
1137
- bgVariant: string;
1138
- bgHover: string;
1139
- fgInverted: string;
1140
- bgInverted: string;
1141
- bgInvertedHover: string;
1142
- };
1143
- };
1144
- destructive: {
1145
- color: {
1146
- fg: string;
1147
- bg: string;
1148
- bgHover: string;
1149
- };
1150
- };
1151
- };
1152
- input: {
1153
- color: {
1154
- label: string;
1155
- border: string;
1156
- borderError: string;
1157
- hint: string;
1158
- selected: string;
1159
- selectedTint: string;
1160
- };
1161
- };
1162
- }, Breakpoints & {
8
+ export declare const StyledInput: import("styled-components").StyledComponent<typeof import("react-native").TextInput, import("@ovotech/element-core/dist/tokens-build/theme-native.types").ThemeNative, Breakpoints & {
1163
9
  invalid?: boolean;
1164
10
  iconLeft?: boolean;
1165
11
  iconRight?: boolean;
1166
12
  hasRightSlot?: boolean;
1167
13
  }, never>;
1168
- export declare const StyledIcon: import("styled-components").StyledComponent<({ name, size, color, testID, ...rest }: import("../Icon/Icon").IconProps) => import("react/jsx-runtime").JSX.Element | null, {
1169
- color: {
1170
- neutral: {
1171
- "20": string;
1172
- "30": string;
1173
- "40": string;
1174
- "50": string;
1175
- "60": string;
1176
- "70": string;
1177
- "80": string;
1178
- white: string;
1179
- black: string;
1180
- };
1181
- red: {
1182
- "20": string;
1183
- "30": string;
1184
- "40": string;
1185
- "50": string;
1186
- "60": string;
1187
- "70": string;
1188
- "80": string;
1189
- };
1190
- orange: {
1191
- "20": string;
1192
- "30": string;
1193
- "40": string;
1194
- "50": string;
1195
- "60": string;
1196
- "70": string;
1197
- };
1198
- yellow: {
1199
- "70": string;
1200
- "80": string;
1201
- };
1202
- green: {
1203
- "20": string;
1204
- "30": string;
1205
- "40": string;
1206
- "50": string;
1207
- "55": string;
1208
- "56": string;
1209
- "60": string;
1210
- "70": string;
1211
- "80": string;
1212
- "90": string;
1213
- };
1214
- blue: {
1215
- "20": string;
1216
- "30": string;
1217
- "40": string;
1218
- "50": string;
1219
- "60": string;
1220
- "70": string;
1221
- };
1222
- alert: {
1223
- success: string;
1224
- successTint: string;
1225
- warning: string;
1226
- warningTint: string;
1227
- error: string;
1228
- errorTint: string;
1229
- info: string;
1230
- infoTint: string;
1231
- neutral: string;
1232
- neutralTint: string;
1233
- border: string;
1234
- };
1235
- input: {
1236
- borderDim: string;
1237
- };
1238
- brand: {
1239
- brand: string;
1240
- dark: string;
1241
- dim: string;
1242
- bold: string;
1243
- bright: string;
1244
- gradientFrom: string;
1245
- gradientTo: string;
1246
- onBrand: string;
1247
- onBrandVariant: string;
1248
- aiGradientFrom: string;
1249
- aiGradientTo: string;
1250
- accessible: string;
1251
- fixed: {
1252
- brand: string;
1253
- dark: string;
1254
- dim: string;
1255
- bold: string;
1256
- bright: string;
1257
- onBrand: string;
1258
- onBrandVariant: string;
1259
- accessible: string;
1260
- };
1261
- };
1262
- outline: {
1263
- outer: string;
1264
- inner: string;
1265
- };
1266
- surface: {
1267
- surface: string;
1268
- bright: string;
1269
- dim: string;
1270
- onSurface: string;
1271
- onSurfaceVariant: string;
1272
- border: string;
1273
- borderDim: string;
1274
- link: string;
1275
- electricity: string;
1276
- gas: string;
1277
- fadeFrom: string;
1278
- fadeTo: string;
1279
- fixed: {
1280
- onSurface: string;
1281
- bright: string;
1282
- };
1283
- };
1284
- };
1285
- transition: {
1286
- duration: {
1287
- fast: number;
1288
- medium: number;
1289
- slow: number;
1290
- };
1291
- };
1292
- unit: {
1293
- "0": number;
1294
- "25": number;
1295
- "50": number;
1296
- "100": number;
1297
- "200": number;
1298
- "300": number;
1299
- "350": number;
1300
- "400": number;
1301
- "450": number;
1302
- "500": number;
1303
- "550": number;
1304
- "600": number;
1305
- "700": number;
1306
- "800": number;
1307
- "900": number;
1308
- "1000": number;
1309
- "1100": number;
1310
- "1200": number;
1311
- "1300": number;
1312
- "1400": number;
1313
- "1500": number;
1314
- "1600": number;
1315
- "1800": number;
1316
- "2000": number;
1317
- "2400": number;
1318
- "3000": number;
1319
- "3500": number;
1320
- };
1321
- border: {
1322
- radius: {
1323
- xs: number;
1324
- sm: number;
1325
- md: number;
1326
- lg: number;
1327
- xl: number;
1328
- "2xl": number;
1329
- "3xl": number;
1330
- };
1331
- width: {
1332
- sm: number;
1333
- md: number;
1334
- lg: number;
1335
- };
1336
- };
1337
- breakpoint: {
1338
- xsmall: number;
1339
- small: number;
1340
- medium: number;
1341
- large: number;
1342
- };
1343
- native: {
1344
- font: {
1345
- family: {
1346
- black: string;
1347
- book: string;
1348
- bold: string;
1349
- };
1350
- };
1351
- };
1352
- web: {
1353
- font: {
1354
- family: string;
1355
- };
1356
- };
1357
- font: {
1358
- letterSpacing: {
1359
- d1: {
1360
- mediaQuery: {
1361
- sm: number;
1362
- lg: number;
1363
- };
1364
- };
1365
- d2: {
1366
- mediaQuery: {
1367
- sm: number;
1368
- lg: number;
1369
- };
1370
- };
1371
- d3: {
1372
- mediaQuery: {
1373
- sm: number;
1374
- lg: number;
1375
- };
1376
- };
1377
- d4: {
1378
- mediaQuery: {
1379
- sm: number;
1380
- lg: number;
1381
- };
1382
- };
1383
- "4xl": {
1384
- mediaQuery: {
1385
- sm: number;
1386
- lg: number;
1387
- };
1388
- };
1389
- "3xl": {
1390
- mediaQuery: {
1391
- sm: number;
1392
- lg: number;
1393
- };
1394
- };
1395
- "2xl": {
1396
- mediaQuery: {
1397
- sm: number;
1398
- lg: number;
1399
- };
1400
- };
1401
- xl: {
1402
- mediaQuery: {
1403
- sm: number;
1404
- lg: number;
1405
- };
1406
- };
1407
- lg: {
1408
- mediaQuery: {
1409
- sm: number;
1410
- lg: number;
1411
- };
1412
- };
1413
- md: {
1414
- mediaQuery: {
1415
- sm: number;
1416
- lg: number;
1417
- };
1418
- };
1419
- sm: {
1420
- mediaQuery: {
1421
- sm: number;
1422
- lg: number;
1423
- };
1424
- };
1425
- xs: {
1426
- mediaQuery: {
1427
- sm: number;
1428
- lg: number;
1429
- };
1430
- };
1431
- };
1432
- lineHeight: {
1433
- d1: {
1434
- mediaQuery: {
1435
- sm: number;
1436
- lg: number;
1437
- };
1438
- };
1439
- d2: {
1440
- mediaQuery: {
1441
- sm: number;
1442
- lg: number;
1443
- };
1444
- };
1445
- d3: {
1446
- mediaQuery: {
1447
- sm: number;
1448
- lg: number;
1449
- };
1450
- };
1451
- d4: {
1452
- mediaQuery: {
1453
- sm: number;
1454
- lg: number;
1455
- };
1456
- };
1457
- "4xl": {
1458
- mediaQuery: {
1459
- sm: number;
1460
- lg: number;
1461
- };
1462
- };
1463
- "3xl": {
1464
- mediaQuery: {
1465
- sm: number;
1466
- lg: number;
1467
- };
1468
- };
1469
- "2xl": {
1470
- mediaQuery: {
1471
- sm: number;
1472
- lg: number;
1473
- };
1474
- };
1475
- xl: {
1476
- mediaQuery: {
1477
- sm: number;
1478
- lg: number;
1479
- };
1480
- };
1481
- lg: {
1482
- mediaQuery: {
1483
- sm: number;
1484
- lg: number;
1485
- };
1486
- };
1487
- md: {
1488
- mediaQuery: {
1489
- sm: number;
1490
- lg: number;
1491
- };
1492
- };
1493
- sm: {
1494
- mediaQuery: {
1495
- sm: number;
1496
- lg: number;
1497
- };
1498
- };
1499
- xs: {
1500
- mediaQuery: {
1501
- sm: number;
1502
- lg: number;
1503
- };
1504
- };
1505
- };
1506
- paragraphSpace: {
1507
- d1: {
1508
- mediaQuery: {
1509
- sm: number;
1510
- lg: number;
1511
- };
1512
- };
1513
- d2: {
1514
- mediaQuery: {
1515
- sm: number;
1516
- lg: number;
1517
- };
1518
- };
1519
- d3: {
1520
- mediaQuery: {
1521
- sm: number;
1522
- lg: number;
1523
- };
1524
- };
1525
- d4: {
1526
- mediaQuery: {
1527
- sm: number;
1528
- lg: number;
1529
- };
1530
- };
1531
- "4xl": {
1532
- mediaQuery: {
1533
- sm: number;
1534
- lg: number;
1535
- };
1536
- };
1537
- "3xl": {
1538
- mediaQuery: {
1539
- sm: number;
1540
- lg: number;
1541
- };
1542
- };
1543
- "2xl": {
1544
- mediaQuery: {
1545
- sm: number;
1546
- lg: number;
1547
- };
1548
- };
1549
- xl: {
1550
- mediaQuery: {
1551
- sm: number;
1552
- lg: number;
1553
- };
1554
- };
1555
- lg: {
1556
- mediaQuery: {
1557
- sm: number;
1558
- lg: number;
1559
- };
1560
- };
1561
- md: {
1562
- mediaQuery: {
1563
- sm: number;
1564
- lg: number;
1565
- };
1566
- };
1567
- sm: {
1568
- mediaQuery: {
1569
- sm: number;
1570
- lg: number;
1571
- };
1572
- };
1573
- xs: {
1574
- mediaQuery: {
1575
- sm: number;
1576
- lg: number;
1577
- };
1578
- };
1579
- };
1580
- size: {
1581
- d1: {
1582
- mediaQuery: {
1583
- sm: number;
1584
- lg: number;
1585
- };
1586
- };
1587
- d2: {
1588
- mediaQuery: {
1589
- sm: number;
1590
- lg: number;
1591
- };
1592
- };
1593
- d3: {
1594
- mediaQuery: {
1595
- sm: number;
1596
- lg: number;
1597
- };
1598
- };
1599
- d4: {
1600
- mediaQuery: {
1601
- sm: number;
1602
- lg: number;
1603
- };
1604
- };
1605
- "4xl": {
1606
- mediaQuery: {
1607
- sm: number;
1608
- lg: number;
1609
- };
1610
- };
1611
- "3xl": {
1612
- mediaQuery: {
1613
- sm: number;
1614
- lg: number;
1615
- };
1616
- };
1617
- "2xl": {
1618
- mediaQuery: {
1619
- sm: number;
1620
- lg: number;
1621
- };
1622
- };
1623
- xl: {
1624
- mediaQuery: {
1625
- sm: number;
1626
- lg: number;
1627
- };
1628
- };
1629
- lg: {
1630
- mediaQuery: {
1631
- sm: number;
1632
- lg: number;
1633
- };
1634
- };
1635
- md: {
1636
- mediaQuery: {
1637
- sm: number;
1638
- lg: number;
1639
- };
1640
- };
1641
- sm: {
1642
- mediaQuery: {
1643
- sm: number;
1644
- lg: number;
1645
- };
1646
- };
1647
- xs: {
1648
- mediaQuery: {
1649
- sm: number;
1650
- lg: number;
1651
- };
1652
- };
1653
- };
1654
- weight: {
1655
- book: number;
1656
- bold: number;
1657
- black: number;
1658
- };
1659
- };
1660
- mediaQuery: {
1661
- xsmall: number;
1662
- small: number;
1663
- medium: number;
1664
- large: number;
1665
- };
1666
- customMediaQuery: {
1667
- "xsmall-and-up": number;
1668
- "small-and-up": number;
1669
- "medium-and-up": number;
1670
- "large-and-up": number;
1671
- };
1672
- opacity: {
1673
- solid: number;
1674
- translucent: number;
1675
- transparent: number;
1676
- };
1677
- space: {
1678
- "0": number;
1679
- "25": number;
1680
- "50": number;
1681
- "100": number;
1682
- "150": number;
1683
- "200": number;
1684
- "250": number;
1685
- "300": number;
1686
- "350": number;
1687
- "400": number;
1688
- "450": number;
1689
- "500": number;
1690
- "550": number;
1691
- "600": number;
1692
- "700": number;
1693
- "800": number;
1694
- "900": number;
1695
- "1000": number;
1696
- "1100": number;
1697
- "1200": number;
1698
- "1300": number;
1699
- "1400": number;
1700
- "1500": number;
1701
- "1600": number;
1702
- "1800": number;
1703
- "2000": number;
1704
- "2400": number;
1705
- "3000": number;
1706
- "3500": number;
1707
- base: number;
1708
- };
1709
- button: {
1710
- color: {
1711
- focus: {
1712
- blue: string;
1713
- white: string;
1714
- };
1715
- };
1716
- surface: {
1717
- color: {
1718
- fg: string;
1719
- bg: string;
1720
- bgVariant: string;
1721
- bgHover: string;
1722
- fgInverted: string;
1723
- bgInverted: string;
1724
- bgInvertedHover: string;
1725
- };
1726
- };
1727
- destructive: {
1728
- color: {
1729
- fg: string;
1730
- bg: string;
1731
- bgHover: string;
1732
- };
1733
- };
1734
- };
1735
- input: {
1736
- color: {
1737
- label: string;
1738
- border: string;
1739
- borderError: string;
1740
- hint: string;
1741
- selected: string;
1742
- selectedTint: string;
1743
- };
1744
- };
1745
- }, {
14
+ export declare const StyledIcon: import("styled-components").StyledComponent<({ name, size, color, testID, ...rest }: import("../Icon/Icon").IconProps) => import("react/jsx-runtime").JSX.Element | null, import("@ovotech/element-core/dist/tokens-build/theme-native.types").ThemeNative, {
1746
15
  side: "left" | "right";
1747
16
  }, never>;