@ovotech/element-native 2.0.4 → 2.2.0-canary-1cac2ba-73

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 (183) hide show
  1. package/dist/components/Accordion/Accordion.js +23 -22
  2. package/dist/components/Accordion/Icon.js +7 -10
  3. package/dist/components/Accordion/styles.d.ts +688 -46
  4. package/dist/components/Accordion/styles.js +56 -49
  5. package/dist/components/Accordion/types.d.ts +1 -0
  6. package/dist/components/Badge/Badge.d.ts +238 -8
  7. package/dist/components/Badge/Badge.js +35 -14
  8. package/dist/components/CTAButton/CTAButton.d.ts +7 -12
  9. package/dist/components/CTAButton/CTAButton.js +18 -19
  10. package/dist/components/CTALink/CTALink.d.ts +3 -4
  11. package/dist/components/Card/Card.d.ts +228 -5
  12. package/dist/components/Card/Card.js +5 -25
  13. package/dist/components/Checkbox/Checkbox.js +19 -26
  14. package/dist/components/DataTable/DataTable.d.ts +3 -12
  15. package/dist/components/DataTable/DataTable.js +8 -71
  16. package/dist/components/DataTable/TableRow.d.ts +2 -0
  17. package/dist/components/DataTable/TableRow.js +33 -0
  18. package/dist/components/DataTable/index.d.ts +2 -0
  19. package/dist/components/DataTable/index.js +16 -0
  20. package/dist/components/DataTable/styles.d.ts +2517 -0
  21. package/dist/components/DataTable/styles.js +77 -0
  22. package/dist/components/DataTable/types.d.ts +15 -0
  23. package/dist/components/DataTable/types.js +2 -0
  24. package/dist/components/DateField/DateField.js +9 -9
  25. package/dist/components/DescriptionList/DescriptionList.d.ts +10 -0
  26. package/dist/components/DescriptionList/DescriptionList.js +66 -0
  27. package/dist/components/DescriptionList/index.d.ts +1 -0
  28. package/dist/components/DescriptionList/index.js +6 -0
  29. package/dist/components/DescriptionList/styled.d.ts +241 -0
  30. package/dist/components/DescriptionList/styled.js +88 -0
  31. package/dist/components/Disclosure/Disclosure.js +7 -10
  32. package/dist/components/Divider/Divider.d.ts +5 -0
  33. package/dist/components/Divider/Divider.js +45 -0
  34. package/dist/components/Divider/index.d.ts +1 -0
  35. package/dist/components/Divider/index.js +5 -0
  36. package/dist/components/ErrorSummaryNotification/ErrorSummaryNotification.d.ts +1 -1
  37. package/dist/components/ErrorText/ErrorText.d.ts +228 -1
  38. package/dist/components/ErrorText/ErrorText.js +1 -1
  39. package/dist/components/Field/Field.js +3 -3
  40. package/dist/components/Grid/Col.d.ts +229 -2
  41. package/dist/components/Grid/Row.d.ts +228 -1
  42. package/dist/components/Heading/Heading.js +8 -24
  43. package/dist/components/HintText/HintText.d.ts +228 -1
  44. package/dist/components/HintText/HintText.js +1 -1
  45. package/dist/components/Icon/Icon.d.ts +2 -3
  46. package/dist/components/Icon/Icon.js +2 -2
  47. package/dist/components/Input/CurrencyInput.d.ts +2 -1
  48. package/dist/components/Input/EmailInput.d.ts +2 -1
  49. package/dist/components/Input/Input.d.ts +4 -2
  50. package/dist/components/Input/Input.js +16 -18
  51. package/dist/components/Input/NumberInput.d.ts +2 -1
  52. package/dist/components/Input/PasswordInput.d.ts +4 -1
  53. package/dist/components/Input/PasswordInput.js +4 -2
  54. package/dist/components/Input/PasswordInput.styled.d.ts +231 -0
  55. package/dist/components/Input/PasswordInput.styled.js +37 -0
  56. package/dist/components/Input/PasswordVisibilityToggle.d.ts +11 -0
  57. package/dist/components/Input/PasswordVisibilityToggle.js +51 -0
  58. package/dist/components/Input/{TelInput.d.ts → PhoneInput.d.ts} +3 -2
  59. package/dist/components/Input/{TelInput.js → PhoneInput.js} +3 -3
  60. package/dist/components/Input/TextInput.d.ts +2 -1
  61. package/dist/components/Input/TextareaInput.d.ts +2 -1
  62. package/dist/components/Input/TextareaInput.js +11 -9
  63. package/dist/components/Input/index.d.ts +1 -1
  64. package/dist/components/Input/index.js +3 -3
  65. package/dist/components/LabelText/LabelText.d.ts +228 -1
  66. package/dist/components/LabelText/LabelText.js +1 -1
  67. package/dist/components/List/List.d.ts +706 -3
  68. package/dist/components/List/List.js +18 -5
  69. package/dist/components/Margin/Margin.d.ts +228 -1
  70. package/dist/components/NavHeader/NavHeader.d.ts +1 -0
  71. package/dist/components/NavHeader/NavHeader.js +11 -13
  72. package/dist/components/Notification/Notification.d.ts +466 -20
  73. package/dist/components/Notification/Notification.js +32 -44
  74. package/dist/components/Radio/Radio.js +18 -36
  75. package/dist/components/SelectField/Select.d.ts +244 -0
  76. package/dist/components/SelectField/Select.js +101 -0
  77. package/dist/components/SelectField/SelectField.d.ts +7 -0
  78. package/dist/components/SelectField/SelectField.js +38 -0
  79. package/dist/components/SelectField/index.d.ts +1 -0
  80. package/dist/components/SelectField/index.js +5 -0
  81. package/dist/components/SkeletonLoading/Skeleton.d.ts +228 -1
  82. package/dist/components/SkeletonLoading/SkeletonAnimation.d.ts +6 -0
  83. package/dist/components/SkeletonLoading/SkeletonAnimation.js +57 -0
  84. package/dist/components/SkeletonLoading/SkeletonCTA.js +3 -1
  85. package/dist/components/SkeletonLoading/SkeletonCircle.js +4 -2
  86. package/dist/components/SkeletonLoading/SkeletonHeading.js +3 -1
  87. package/dist/components/SkeletonLoading/SkeletonText.js +2 -2
  88. package/dist/components/SubLabelText/SubLabelText.d.ts +228 -1
  89. package/dist/components/SubLabelText/SubLabelText.js +1 -1
  90. package/dist/components/SummaryList/SummaryList.d.ts +4 -0
  91. package/dist/components/SummaryList/SummaryList.js +5 -0
  92. package/dist/components/Tabs/Tab.js +22 -19
  93. package/dist/components/Tabs/TabList.d.ts +11 -1
  94. package/dist/components/Tabs/TabList.js +19 -16
  95. package/dist/components/Tabs/TabPanel.js +32 -6
  96. package/dist/components/Tabs/Tabs.d.ts +8 -6
  97. package/dist/components/Tabs/Tabs.js +10 -6
  98. package/dist/components/Text/Text.d.ts +1140 -5
  99. package/dist/components/Text/Text.js +6 -10
  100. package/dist/components/TextField/CurrencyField.d.ts +2 -1
  101. package/dist/components/TextField/EmailField.d.ts +2 -1
  102. package/dist/components/TextField/NumberField.d.ts +2 -1
  103. package/dist/components/TextField/PasswordField.d.ts +4 -1
  104. package/dist/components/TextField/PasswordField.js +2 -2
  105. package/dist/components/TextField/PhoneField.d.ts +10 -0
  106. package/dist/components/TextField/PhoneField.js +56 -0
  107. package/dist/components/TextField/TelField.d.ts +6 -1
  108. package/dist/components/TextField/TelField.js +7 -2
  109. package/dist/components/TextField/TextField.d.ts +2 -1
  110. package/dist/components/TextField/TextareaField.d.ts +2 -1
  111. package/dist/components/TextField/index.d.ts +1 -0
  112. package/dist/components/TextField/index.js +3 -1
  113. package/dist/components/TextLink/TextLink.js +2 -2
  114. package/dist/components/index.d.ts +3 -0
  115. package/dist/components/index.js +3 -0
  116. package/dist/esm/components/Accordion/Accordion.js +26 -25
  117. package/dist/esm/components/Accordion/Icon.js +8 -8
  118. package/dist/esm/components/Accordion/styles.js +29 -48
  119. package/dist/esm/components/Badge/Badge.js +35 -14
  120. package/dist/esm/components/CTAButton/CTAButton.js +20 -21
  121. package/dist/esm/components/Card/Card.js +5 -25
  122. package/dist/esm/components/Checkbox/Checkbox.js +17 -27
  123. package/dist/esm/components/DataTable/DataTable.js +3 -66
  124. package/dist/esm/components/DataTable/TableRow.js +26 -0
  125. package/dist/esm/components/DataTable/index.js +2 -0
  126. package/dist/esm/components/DataTable/styles.js +51 -0
  127. package/dist/esm/components/DataTable/types.js +1 -0
  128. package/dist/esm/components/DateField/DateField.js +9 -9
  129. package/dist/esm/components/DescriptionList/DescriptionList.js +39 -0
  130. package/dist/esm/components/DescriptionList/index.js +1 -0
  131. package/dist/esm/components/DescriptionList/styled.js +57 -0
  132. package/dist/esm/components/Disclosure/Disclosure.js +9 -12
  133. package/dist/esm/components/Divider/Divider.js +15 -0
  134. package/dist/esm/components/Divider/index.js +1 -0
  135. package/dist/esm/components/ErrorText/ErrorText.js +1 -1
  136. package/dist/esm/components/Field/Field.js +3 -3
  137. package/dist/esm/components/Heading/Heading.js +8 -24
  138. package/dist/esm/components/HintText/HintText.js +1 -1
  139. package/dist/esm/components/Icon/Icon.js +2 -2
  140. package/dist/esm/components/Input/Input.js +18 -20
  141. package/dist/esm/components/Input/PasswordInput.js +4 -2
  142. package/dist/esm/components/Input/PasswordInput.styled.js +11 -0
  143. package/dist/esm/components/Input/PasswordVisibilityToggle.js +23 -0
  144. package/dist/esm/components/Input/{TelInput.js → PhoneInput.js} +2 -2
  145. package/dist/esm/components/Input/TextareaInput.js +11 -9
  146. package/dist/esm/components/Input/index.js +1 -1
  147. package/dist/esm/components/LabelText/LabelText.js +1 -1
  148. package/dist/esm/components/List/List.js +17 -5
  149. package/dist/esm/components/NavHeader/NavHeader.js +12 -14
  150. package/dist/esm/components/Notification/Notification.js +34 -46
  151. package/dist/esm/components/Radio/Radio.js +18 -36
  152. package/dist/esm/components/SelectField/Select.js +74 -0
  153. package/dist/esm/components/SelectField/SelectField.js +31 -0
  154. package/dist/esm/components/SelectField/index.js +1 -0
  155. package/dist/esm/components/SkeletonLoading/SkeletonAnimation.js +30 -0
  156. package/dist/esm/components/SkeletonLoading/SkeletonCTA.js +3 -1
  157. package/dist/esm/components/SkeletonLoading/SkeletonCircle.js +4 -2
  158. package/dist/esm/components/SkeletonLoading/SkeletonHeading.js +3 -1
  159. package/dist/esm/components/SkeletonLoading/SkeletonText.js +2 -2
  160. package/dist/esm/components/SubLabelText/SubLabelText.js +1 -1
  161. package/dist/esm/components/SummaryList/SummaryList.js +5 -0
  162. package/dist/esm/components/Tabs/Tab.js +22 -16
  163. package/dist/esm/components/Tabs/TabList.js +18 -16
  164. package/dist/esm/components/Tabs/TabPanel.js +9 -6
  165. package/dist/esm/components/Tabs/Tabs.js +9 -6
  166. package/dist/esm/components/Text/Text.js +6 -10
  167. package/dist/esm/components/TextField/PasswordField.js +2 -2
  168. package/dist/esm/components/TextField/PhoneField.js +30 -0
  169. package/dist/esm/components/TextField/TelField.js +7 -2
  170. package/dist/esm/components/TextField/index.js +1 -0
  171. package/dist/esm/components/TextLink/TextLink.js +2 -2
  172. package/dist/esm/components/index.js +3 -0
  173. package/dist/esm/providers/icons/Logo.js +6 -3
  174. package/dist/esm/theme/create-theme.js +2 -176
  175. package/dist/esm/theme/index.js +13 -2
  176. package/dist/providers/icons/Logo.js +5 -2
  177. package/dist/styled.native.d.ts +1363 -1
  178. package/dist/theme/create-theme.d.ts +1 -1
  179. package/dist/theme/create-theme.js +2 -176
  180. package/dist/theme/index.d.ts +228 -2
  181. package/dist/theme/index.js +13 -2
  182. package/dist/theme/theme.d.ts +1 -110
  183. package/package.json +12 -10
@@ -5,7 +5,234 @@ declare const LabelText: import("react").ForwardRefExoticComponent<Pick<Omit<{
5
5
  [x: number]: any;
6
6
  [x: symbol]: any;
7
7
  } & {
8
- theme?: import("../../theme/theme").Theme | undefined;
8
+ theme?: (import("../../theme/theme").Theme & {
9
+ core: {
10
+ radius: Record<"small" | "medium" | "large" | "max", string>;
11
+ borderWidth: Record<"small" | "medium" | "large", string>;
12
+ breakpoint: Record<"small" | "medium" | "large", string | number>;
13
+ mediaQuery: Record<"small" | "medium" | "large", string>;
14
+ space: Record<0 | 2 | 1 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15, string>;
15
+ transition: Record<"medium" | "slow" | "fast", string>;
16
+ opacity: Record<"solid" | "transparent" | "translucent", string | number>;
17
+ color: Record<"neutral" | "red" | "orange" | "yellow" | "green" | "blue", {
18
+ lightest: string;
19
+ lighter: string;
20
+ light: string;
21
+ base: string;
22
+ dark: string;
23
+ darker: string;
24
+ darkest: string;
25
+ }> & {
26
+ brand: Record<string, string>;
27
+ };
28
+ fontFamily: Record<"heading" | "body" | "mono" | "bodyBold", {
29
+ native: string;
30
+ web: string;
31
+ }>;
32
+ fontWeight: Record<"bold" | "book" | "black", string | number>;
33
+ fontSize: Record<"small" | "body" | "label" | "lead" | "heading1" | "heading2" | "heading3" | "heading4", {
34
+ small: string | number;
35
+ large: string | number;
36
+ }>;
37
+ lineHeight: Record<"small" | "body" | "label" | "lead" | "heading1" | "heading2" | "heading3" | "heading4", {
38
+ small: string | number;
39
+ large: string | number;
40
+ }>;
41
+ letterSpacing: Record<"base" | "compressed" | "extraCompressed", number>;
42
+ };
43
+ semantic: {
44
+ surface: Record<"base" | "cutout" | "elevated", string>;
45
+ message: Record<"base" | "link" | "error" | "secondary" | "branded", string>;
46
+ border: Record<"graphic" | "differentiated" | "functional", string>;
47
+ focus: Record<"surface" | "outline" | "hover", string>;
48
+ inverted: Record<"border" | "surface", string> & {
49
+ message: Record<"base" | "link" | "secondary" | "branded", string>;
50
+ };
51
+ success: {
52
+ border: string;
53
+ surface: string;
54
+ surfaceEmphasis: string;
55
+ message: string;
56
+ messageOnEmphasis: string;
57
+ };
58
+ warning: {
59
+ border: string;
60
+ surface: string;
61
+ surfaceEmphasis: string;
62
+ message: string;
63
+ messageOnEmphasis: string;
64
+ };
65
+ error: {
66
+ border: string;
67
+ surface: string;
68
+ surfaceEmphasis: string;
69
+ message: string;
70
+ messageOnEmphasis: string;
71
+ };
72
+ info: {
73
+ border: string;
74
+ surface: string;
75
+ surfaceEmphasis: string;
76
+ message: string;
77
+ messageOnEmphasis: string;
78
+ };
79
+ data: Record<"gas" | "branded" | "electric", Record<2 | 1 | 3 | 4, string>>;
80
+ };
81
+ component: {
82
+ heading1: {
83
+ fontFamily: string;
84
+ fontWeight: string | number;
85
+ fontSize: {
86
+ small: string | number;
87
+ large: string | number;
88
+ };
89
+ lineHeight: {
90
+ small: string | number;
91
+ large: string | number;
92
+ };
93
+ };
94
+ heading2: {
95
+ fontFamily: string;
96
+ fontWeight: string | number;
97
+ fontSize: {
98
+ small: string | number;
99
+ large: string | number;
100
+ };
101
+ lineHeight: {
102
+ small: string | number;
103
+ large: string | number;
104
+ };
105
+ };
106
+ heading3: {
107
+ fontFamily: string;
108
+ fontWeight: string | number;
109
+ fontSize: {
110
+ small: string | number;
111
+ large: string | number;
112
+ };
113
+ lineHeight: {
114
+ small: string | number;
115
+ large: string | number;
116
+ };
117
+ };
118
+ heading4: {
119
+ fontFamily: string;
120
+ fontWeight: string | number;
121
+ fontSize: {
122
+ small: string | number;
123
+ large: string | number;
124
+ };
125
+ lineHeight: {
126
+ small: string | number;
127
+ large: string | number;
128
+ };
129
+ };
130
+ lead: {
131
+ fontFamily: string;
132
+ fontWeight: string | number;
133
+ fontSize: {
134
+ small: string | number;
135
+ large: string | number;
136
+ };
137
+ lineHeight: {
138
+ small: string | number;
139
+ large: string | number;
140
+ };
141
+ };
142
+ body: {
143
+ fontFamily: string;
144
+ fontWeight: string | number;
145
+ fontSize: {
146
+ small: string | number;
147
+ large: string | number;
148
+ };
149
+ lineHeight: {
150
+ small: string | number;
151
+ large: string | number;
152
+ };
153
+ };
154
+ small: {
155
+ fontFamily: string;
156
+ fontWeight: string | number;
157
+ fontSize: {
158
+ small: string | number;
159
+ large: string | number;
160
+ };
161
+ lineHeight: {
162
+ small: string | number;
163
+ large: string | number;
164
+ };
165
+ };
166
+ label: {
167
+ fontFamily: string;
168
+ fontWeight: string | number;
169
+ fontSize: {
170
+ small: string | number;
171
+ large: string | number;
172
+ };
173
+ lineHeight: {
174
+ small: string | number;
175
+ large: string | number;
176
+ };
177
+ };
178
+ cta: {
179
+ primary: {
180
+ message: string;
181
+ surface: string;
182
+ messageHover: string;
183
+ surfaceHover: string;
184
+ messageFocused: string;
185
+ surfaceFocused: string;
186
+ outlineFocused: string;
187
+ backgroundFocused: string;
188
+ };
189
+ secondary: {
190
+ message: string;
191
+ surface: string;
192
+ messageHover: string;
193
+ surfaceHover: string;
194
+ messageFocused: string;
195
+ surfaceFocused: string;
196
+ outlineFocused: string;
197
+ backgroundFocused: string;
198
+ };
199
+ destructive: {
200
+ message: string;
201
+ surface: string;
202
+ messageHover: string;
203
+ surfaceHover: string;
204
+ messageFocused: string;
205
+ surfaceFocused: string;
206
+ outlineFocused: string;
207
+ backgroundFocused: string;
208
+ };
209
+ };
210
+ badge: {
211
+ variants: {
212
+ red: {
213
+ foreground: string;
214
+ background: string;
215
+ };
216
+ orange: {
217
+ foreground: string;
218
+ background: string;
219
+ };
220
+ yellow: {
221
+ foreground: string;
222
+ background: string;
223
+ };
224
+ green: {
225
+ foreground: string;
226
+ background: string;
227
+ };
228
+ blue: {
229
+ foreground: string;
230
+ background: string;
231
+ };
232
+ };
233
+ };
234
+ };
235
+ }) | undefined;
9
236
  } & {
10
237
  as?: string | import("react").ComponentType<any> | undefined;
11
238
  forwardedAs?: string | import("react").ComponentType<any> | undefined;
@@ -34,7 +34,7 @@ var utils_1 = require("../../utils");
34
34
  var StyledLabelText = styled_native_1.default.Text(function (_a) {
35
35
  var field = _a.theme.field, smallAndUp = _a.smallAndUp;
36
36
  var fontSize = smallAndUp ? field.fontSize[1] : field.fontSize[0];
37
- return (0, styled_native_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n font-family: ", ";\n line-height: ", ";\n font-weight: ", ";\n color: ", ";\n font-size: ", ";\n "], ["\n font-family: ", ";\n line-height: ", ";\n font-weight: ", ";\n color: ", ";\n font-size: ", ";\n "])), field.label.fontFamily, (0, theme_1.calculateLineHeight)(fontSize, field.lineHeight), field.label.fontWeight, field.label.color, fontSize);
37
+ return (0, styled_native_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n font-size: ", ";\n "], ["\n font-family: ", ";\n line-height: ", ";\n color: ", ";\n font-size: ", ";\n "])), field.label.fontFamily, (0, theme_1.calculateLineHeight)(fontSize, field.lineHeight), field.label.color, fontSize);
38
38
  });
39
39
  var LabelText = (0, utils_1.styledComponentWithBreakpoints)(StyledLabelText);
40
40
  exports.LabelText = LabelText;