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