kui-basic 1.1.30 → 1.1.32
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/AccordionSummary/index.js.map +1 -1
- package/dist/cjs/index.js +4 -4
- package/dist/cjs/index.js.map +1 -1
- package/dist/index.d.ts +453 -453
- package/dist/index.js +4 -4
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -1,241 +1,241 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { HTMLInputTypeAttribute, ReactElement, SyntheticEvent, RefObject, ReactNode } from 'react';
|
|
3
3
|
|
|
4
|
-
interface BrandColors {
|
|
5
|
-
main: string
|
|
6
|
-
pressed: string
|
|
7
|
-
hover: string
|
|
8
|
-
light: string
|
|
9
|
-
background: string
|
|
10
|
-
}
|
|
11
|
-
interface ColorOption {
|
|
12
|
-
fiftyP: string
|
|
13
|
-
seventy: string
|
|
14
|
-
sixty: string
|
|
15
|
-
ten: string
|
|
16
|
-
five: string
|
|
17
|
-
}
|
|
18
|
-
interface GreyColors {
|
|
19
|
-
seventy: string
|
|
20
|
-
sixty: string
|
|
21
|
-
fiftyP: string
|
|
22
|
-
fourty: string
|
|
23
|
-
thirty: string
|
|
24
|
-
fifteenB: string
|
|
25
|
-
zero: string
|
|
26
|
-
}
|
|
27
|
-
interface BackgroundColors {
|
|
28
|
-
light1: string
|
|
29
|
-
light2: string
|
|
30
|
-
light3: string
|
|
31
|
-
light4: string
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
type PrimaryColorsType = {
|
|
35
|
-
main: string
|
|
36
|
-
pressed: string
|
|
37
|
-
hover: string
|
|
38
|
-
light: string
|
|
39
|
-
light2: string
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
type SecondaryColorsType = {
|
|
43
|
-
main: string
|
|
44
|
-
gray60: string
|
|
45
|
-
gray50: string
|
|
46
|
-
gray40: string
|
|
47
|
-
gray30: string
|
|
48
|
-
gray15: string
|
|
49
|
-
white: string
|
|
50
|
-
light: string
|
|
51
|
-
disabled: string
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
type BackgroundColorsType = {
|
|
55
|
-
main: string
|
|
56
|
-
light2: string
|
|
57
|
-
light3: string
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
type SuccessColorsType = {
|
|
61
|
-
green70: string
|
|
62
|
-
green60: string
|
|
63
|
-
main: string
|
|
64
|
-
green10: string
|
|
65
|
-
green5: string
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
type ErrorColorsType = {
|
|
69
|
-
red70: string
|
|
70
|
-
red60: string
|
|
71
|
-
main: string
|
|
72
|
-
red10: string
|
|
73
|
-
red5: string
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
type InfoColorsType = {
|
|
77
|
-
blue70: string
|
|
78
|
-
blue60: string
|
|
79
|
-
main: string
|
|
80
|
-
blue10: string
|
|
81
|
-
blue5: string
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
type PurpleColorsType = {
|
|
85
|
-
purple70: string
|
|
86
|
-
purple60: string
|
|
87
|
-
main: string
|
|
88
|
-
purple10: string
|
|
89
|
-
purple5: string
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
type ColorsType = {
|
|
93
|
-
primary: PrimaryColorsType
|
|
94
|
-
secondary: SecondaryColorsType
|
|
95
|
-
background: BackgroundColorsType
|
|
96
|
-
success: SuccessColorsType
|
|
97
|
-
error: ErrorColorsType
|
|
98
|
-
info: InfoColorsType
|
|
99
|
-
purple: PurpleColorsType
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
type ShadowsType = {
|
|
103
|
-
shadow1: string
|
|
104
|
-
shadow2: string
|
|
105
|
-
shadow3: string
|
|
106
|
-
shadow4: string
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
type BreakpointsType = {
|
|
110
|
-
xxs: number
|
|
111
|
-
xs: number
|
|
112
|
-
sm: number
|
|
113
|
-
md: number
|
|
114
|
-
lg: number
|
|
115
|
-
xl: number
|
|
116
|
-
}
|
|
117
|
-
|
|
118
|
-
type SettingsType = {
|
|
119
|
-
spacing: number
|
|
120
|
-
columns: number
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
type ThemeType = {
|
|
124
|
-
palette: ColorsType
|
|
125
|
-
shadows: ShadowsType
|
|
126
|
-
breakpoints: BreakpointsType
|
|
127
|
-
settings: SettingsType
|
|
128
|
-
}
|
|
129
|
-
|
|
130
|
-
type Palette = {
|
|
131
|
-
brand: BrandColors
|
|
132
|
-
green: ColorOption
|
|
133
|
-
red: ColorOption
|
|
134
|
-
blue: ColorOption
|
|
135
|
-
purple: ColorOption
|
|
136
|
-
grey: GreyColors
|
|
137
|
-
background: BackgroundColors
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
type ThemeInterface = {
|
|
141
|
-
palette: Palette
|
|
142
|
-
shadows: ShadowsType
|
|
143
|
-
breakpoints: BreakpointsType
|
|
144
|
-
settings: SettingsType
|
|
145
|
-
}
|
|
146
|
-
|
|
147
|
-
declare const themeOld: ThemeType
|
|
4
|
+
interface BrandColors {
|
|
5
|
+
main: string
|
|
6
|
+
pressed: string
|
|
7
|
+
hover: string
|
|
8
|
+
light: string
|
|
9
|
+
background: string
|
|
10
|
+
}
|
|
11
|
+
interface ColorOption {
|
|
12
|
+
fiftyP: string
|
|
13
|
+
seventy: string
|
|
14
|
+
sixty: string
|
|
15
|
+
ten: string
|
|
16
|
+
five: string
|
|
17
|
+
}
|
|
18
|
+
interface GreyColors {
|
|
19
|
+
seventy: string
|
|
20
|
+
sixty: string
|
|
21
|
+
fiftyP: string
|
|
22
|
+
fourty: string
|
|
23
|
+
thirty: string
|
|
24
|
+
fifteenB: string
|
|
25
|
+
zero: string
|
|
26
|
+
}
|
|
27
|
+
interface BackgroundColors {
|
|
28
|
+
light1: string
|
|
29
|
+
light2: string
|
|
30
|
+
light3: string
|
|
31
|
+
light4: string
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
type PrimaryColorsType = {
|
|
35
|
+
main: string
|
|
36
|
+
pressed: string
|
|
37
|
+
hover: string
|
|
38
|
+
light: string
|
|
39
|
+
light2: string
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
type SecondaryColorsType = {
|
|
43
|
+
main: string
|
|
44
|
+
gray60: string
|
|
45
|
+
gray50: string
|
|
46
|
+
gray40: string
|
|
47
|
+
gray30: string
|
|
48
|
+
gray15: string
|
|
49
|
+
white: string
|
|
50
|
+
light: string
|
|
51
|
+
disabled: string
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
type BackgroundColorsType = {
|
|
55
|
+
main: string
|
|
56
|
+
light2: string
|
|
57
|
+
light3: string
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
type SuccessColorsType = {
|
|
61
|
+
green70: string
|
|
62
|
+
green60: string
|
|
63
|
+
main: string
|
|
64
|
+
green10: string
|
|
65
|
+
green5: string
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
type ErrorColorsType = {
|
|
69
|
+
red70: string
|
|
70
|
+
red60: string
|
|
71
|
+
main: string
|
|
72
|
+
red10: string
|
|
73
|
+
red5: string
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
type InfoColorsType = {
|
|
77
|
+
blue70: string
|
|
78
|
+
blue60: string
|
|
79
|
+
main: string
|
|
80
|
+
blue10: string
|
|
81
|
+
blue5: string
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
type PurpleColorsType = {
|
|
85
|
+
purple70: string
|
|
86
|
+
purple60: string
|
|
87
|
+
main: string
|
|
88
|
+
purple10: string
|
|
89
|
+
purple5: string
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
type ColorsType = {
|
|
93
|
+
primary: PrimaryColorsType
|
|
94
|
+
secondary: SecondaryColorsType
|
|
95
|
+
background: BackgroundColorsType
|
|
96
|
+
success: SuccessColorsType
|
|
97
|
+
error: ErrorColorsType
|
|
98
|
+
info: InfoColorsType
|
|
99
|
+
purple: PurpleColorsType
|
|
100
|
+
}
|
|
101
|
+
|
|
102
|
+
type ShadowsType = {
|
|
103
|
+
shadow1: string
|
|
104
|
+
shadow2: string
|
|
105
|
+
shadow3: string
|
|
106
|
+
shadow4: string
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
type BreakpointsType = {
|
|
110
|
+
xxs: number
|
|
111
|
+
xs: number
|
|
112
|
+
sm: number
|
|
113
|
+
md: number
|
|
114
|
+
lg: number
|
|
115
|
+
xl: number
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
type SettingsType = {
|
|
119
|
+
spacing: number
|
|
120
|
+
columns: number
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
type ThemeType = {
|
|
124
|
+
palette: ColorsType
|
|
125
|
+
shadows: ShadowsType
|
|
126
|
+
breakpoints: BreakpointsType
|
|
127
|
+
settings: SettingsType
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
type Palette = {
|
|
131
|
+
brand: BrandColors
|
|
132
|
+
green: ColorOption
|
|
133
|
+
red: ColorOption
|
|
134
|
+
blue: ColorOption
|
|
135
|
+
purple: ColorOption
|
|
136
|
+
grey: GreyColors
|
|
137
|
+
background: BackgroundColors
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
type ThemeInterface = {
|
|
141
|
+
palette: Palette
|
|
142
|
+
shadows: ShadowsType
|
|
143
|
+
breakpoints: BreakpointsType
|
|
144
|
+
settings: SettingsType
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
declare const themeOld: ThemeType
|
|
148
148
|
declare const theme: ThemeInterface
|
|
149
149
|
|
|
150
|
-
type CaptionSizes = "xs" | "sm" | "s" | "m" | "l"
|
|
151
|
-
|
|
152
|
-
type CaptionVariants = "default" | "high"
|
|
153
|
-
|
|
154
|
-
type CaptionWeight = 300 | 400 | 500 | 600 | 700
|
|
155
|
-
|
|
156
|
-
type CaptionAlign = "center" | "right" | "left"
|
|
157
|
-
|
|
158
|
-
type CaptionColorGroups = keyof Palette
|
|
159
|
-
|
|
160
|
-
type CaptionColors =
|
|
161
|
-
| keyof GreyColors
|
|
162
|
-
| keyof BrandColors
|
|
163
|
-
| keyof ColorOption
|
|
164
|
-
| keyof BackgroundColors
|
|
165
|
-
|
|
166
|
-
interface CaptionProps
|
|
167
|
-
extends React.DetailedHTMLProps<
|
|
168
|
-
React.HTMLAttributes<HTMLParagraphElement>,
|
|
169
|
-
HTMLParagraphElement
|
|
170
|
-
>,
|
|
171
|
-
React.AriaAttributes {
|
|
172
|
-
size?: CaptionSizes
|
|
173
|
-
weight?: CaptionWeight
|
|
174
|
-
color?: CaptionColors
|
|
175
|
-
disableUserSelect?: boolean
|
|
176
|
-
align?: CaptionAlign
|
|
177
|
-
colorGroup?: CaptionColorGroups
|
|
178
|
-
variant?: CaptionVariants
|
|
179
|
-
}
|
|
180
|
-
|
|
181
|
-
type CaptionType = (props: CaptionProps) => React.ReactElement
|
|
182
|
-
|
|
150
|
+
type CaptionSizes = "xs" | "sm" | "s" | "m" | "l"
|
|
151
|
+
|
|
152
|
+
type CaptionVariants = "default" | "high"
|
|
153
|
+
|
|
154
|
+
type CaptionWeight = 300 | 400 | 500 | 600 | 700
|
|
155
|
+
|
|
156
|
+
type CaptionAlign = "center" | "right" | "left"
|
|
157
|
+
|
|
158
|
+
type CaptionColorGroups = keyof Palette
|
|
159
|
+
|
|
160
|
+
type CaptionColors =
|
|
161
|
+
| keyof GreyColors
|
|
162
|
+
| keyof BrandColors
|
|
163
|
+
| keyof ColorOption
|
|
164
|
+
| keyof BackgroundColors
|
|
165
|
+
|
|
166
|
+
interface CaptionProps
|
|
167
|
+
extends React.DetailedHTMLProps<
|
|
168
|
+
React.HTMLAttributes<HTMLParagraphElement>,
|
|
169
|
+
HTMLParagraphElement
|
|
170
|
+
>,
|
|
171
|
+
React.AriaAttributes {
|
|
172
|
+
size?: CaptionSizes
|
|
173
|
+
weight?: CaptionWeight
|
|
174
|
+
color?: CaptionColors
|
|
175
|
+
disableUserSelect?: boolean
|
|
176
|
+
align?: CaptionAlign
|
|
177
|
+
colorGroup?: CaptionColorGroups
|
|
178
|
+
variant?: CaptionVariants
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
type CaptionType = (props: CaptionProps) => React.ReactElement
|
|
182
|
+
|
|
183
183
|
declare const Caption: CaptionType
|
|
184
184
|
|
|
185
|
-
type ButtonThemes =
|
|
186
|
-
| "primary"
|
|
187
|
-
| "orange"
|
|
188
|
-
| "orangeWithHoverLight"
|
|
189
|
-
| "orangeWithBorder"
|
|
190
|
-
| "white"
|
|
191
|
-
| "whiteWithOrangeHover"
|
|
192
|
-
| "whiteWithBrand"
|
|
193
|
-
| "blur"
|
|
194
|
-
| "blurDark"
|
|
195
|
-
| "whiteWithGray"
|
|
196
|
-
| "grayLightWithBorder"
|
|
197
|
-
| "grayLight"
|
|
198
|
-
| "grayDark"
|
|
199
|
-
| "green"
|
|
200
|
-
| "red"
|
|
201
|
-
| "error"
|
|
202
|
-
| "transparent"
|
|
203
|
-
| "transparentLight"
|
|
204
|
-
| "transparentWithBorder"
|
|
205
|
-
| "transparentWithDarkBorder"
|
|
206
|
-
| "transparentWithBoldBorder"
|
|
207
|
-
| "backgroundLight"
|
|
208
|
-
| "backgroundWithBorder"
|
|
209
|
-
|
|
210
|
-
type ButtonSizes = "xs" | "s" | "m" | "l"
|
|
211
|
-
|
|
212
|
-
type ButtonTypes = "button" | "submit"
|
|
213
|
-
|
|
214
|
-
type ButtonBorder = "brand" | "lightGray" | "lightOrange"
|
|
215
|
-
|
|
216
|
-
interface ButtonProps
|
|
217
|
-
extends React.DetailedHTMLProps<
|
|
218
|
-
React.ButtonHTMLAttributes<HTMLButtonElement>,
|
|
219
|
-
HTMLButtonElement
|
|
220
|
-
>,
|
|
221
|
-
React.AriaAttributes {
|
|
222
|
-
variant?: ButtonThemes
|
|
223
|
-
size?: ButtonSizes
|
|
224
|
-
type?: ButtonTypes
|
|
225
|
-
fullWidth?: boolean
|
|
226
|
-
endIcon?: React.ReactElement
|
|
227
|
-
startIcon?: React.ReactElement
|
|
228
|
-
disabled?: boolean
|
|
229
|
-
isCircle?: boolean
|
|
230
|
-
captionSize?: CaptionSizes
|
|
231
|
-
captionWeight?: CaptionWeight
|
|
232
|
-
disabledStyle?: string
|
|
233
|
-
border?: ButtonBorder
|
|
234
|
-
withoutChildrenWrapper?: boolean
|
|
235
|
-
}
|
|
236
|
-
|
|
237
|
-
type ButtonType = (props: ButtonProps) => React.ReactElement
|
|
238
|
-
|
|
185
|
+
type ButtonThemes =
|
|
186
|
+
| "primary"
|
|
187
|
+
| "orange"
|
|
188
|
+
| "orangeWithHoverLight"
|
|
189
|
+
| "orangeWithBorder"
|
|
190
|
+
| "white"
|
|
191
|
+
| "whiteWithOrangeHover"
|
|
192
|
+
| "whiteWithBrand"
|
|
193
|
+
| "blur"
|
|
194
|
+
| "blurDark"
|
|
195
|
+
| "whiteWithGray"
|
|
196
|
+
| "grayLightWithBorder"
|
|
197
|
+
| "grayLight"
|
|
198
|
+
| "grayDark"
|
|
199
|
+
| "green"
|
|
200
|
+
| "red"
|
|
201
|
+
| "error"
|
|
202
|
+
| "transparent"
|
|
203
|
+
| "transparentLight"
|
|
204
|
+
| "transparentWithBorder"
|
|
205
|
+
| "transparentWithDarkBorder"
|
|
206
|
+
| "transparentWithBoldBorder"
|
|
207
|
+
| "backgroundLight"
|
|
208
|
+
| "backgroundWithBorder"
|
|
209
|
+
|
|
210
|
+
type ButtonSizes = "xs" | "s" | "m" | "l"
|
|
211
|
+
|
|
212
|
+
type ButtonTypes = "button" | "submit"
|
|
213
|
+
|
|
214
|
+
type ButtonBorder = "brand" | "lightGray" | "lightOrange"
|
|
215
|
+
|
|
216
|
+
interface ButtonProps
|
|
217
|
+
extends React.DetailedHTMLProps<
|
|
218
|
+
React.ButtonHTMLAttributes<HTMLButtonElement>,
|
|
219
|
+
HTMLButtonElement
|
|
220
|
+
>,
|
|
221
|
+
React.AriaAttributes {
|
|
222
|
+
variant?: ButtonThemes
|
|
223
|
+
size?: ButtonSizes
|
|
224
|
+
type?: ButtonTypes
|
|
225
|
+
fullWidth?: boolean
|
|
226
|
+
endIcon?: React.ReactElement
|
|
227
|
+
startIcon?: React.ReactElement
|
|
228
|
+
disabled?: boolean
|
|
229
|
+
isCircle?: boolean
|
|
230
|
+
captionSize?: CaptionSizes
|
|
231
|
+
captionWeight?: CaptionWeight
|
|
232
|
+
disabledStyle?: string
|
|
233
|
+
border?: ButtonBorder
|
|
234
|
+
withoutChildrenWrapper?: boolean
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
type ButtonType = (props: ButtonProps) => React.ReactElement
|
|
238
|
+
|
|
239
239
|
declare const Button: ButtonType
|
|
240
240
|
|
|
241
241
|
interface CheckboxProps
|
|
@@ -264,29 +264,29 @@ type DividerType = (props: DividerProps) => React.ReactElement
|
|
|
264
264
|
|
|
265
265
|
declare const Divider: DividerType
|
|
266
266
|
|
|
267
|
-
type HeadingSizes = "hero" | "h1" | "h2" | "h3" | "h4"
|
|
268
|
-
|
|
269
|
-
type HeadingColors = CaptionColors
|
|
270
|
-
|
|
271
|
-
type HeadingColorGroups = CaptionColorGroups
|
|
272
|
-
|
|
273
|
-
interface HeadingProps
|
|
274
|
-
extends React.DetailedHTMLProps<
|
|
275
|
-
React.HTMLAttributes<HTMLElement>,
|
|
276
|
-
HTMLElement
|
|
277
|
-
>,
|
|
278
|
-
React.AriaAttributes {
|
|
279
|
-
size?: HeadingSizes
|
|
280
|
-
uppercase?: boolean
|
|
281
|
-
disableUserSelect?: boolean
|
|
282
|
-
color?: HeadingColors
|
|
283
|
-
colorGroup?: HeadingColorGroups
|
|
284
|
-
weight?: number
|
|
285
|
-
align?: "center" | "right" | "left"
|
|
286
|
-
}
|
|
287
|
-
|
|
288
|
-
type HeadingType = (props: HeadingProps) => React.ReactElement
|
|
289
|
-
|
|
267
|
+
type HeadingSizes = "hero" | "h1" | "h2" | "h3" | "h4"
|
|
268
|
+
|
|
269
|
+
type HeadingColors = CaptionColors
|
|
270
|
+
|
|
271
|
+
type HeadingColorGroups = CaptionColorGroups
|
|
272
|
+
|
|
273
|
+
interface HeadingProps
|
|
274
|
+
extends React.DetailedHTMLProps<
|
|
275
|
+
React.HTMLAttributes<HTMLElement>,
|
|
276
|
+
HTMLElement
|
|
277
|
+
>,
|
|
278
|
+
React.AriaAttributes {
|
|
279
|
+
size?: HeadingSizes
|
|
280
|
+
uppercase?: boolean
|
|
281
|
+
disableUserSelect?: boolean
|
|
282
|
+
color?: HeadingColors
|
|
283
|
+
colorGroup?: HeadingColorGroups
|
|
284
|
+
weight?: number
|
|
285
|
+
align?: "center" | "right" | "left"
|
|
286
|
+
}
|
|
287
|
+
|
|
288
|
+
type HeadingType = (props: HeadingProps) => React.ReactElement
|
|
289
|
+
|
|
290
290
|
declare const Heading: HeadingType
|
|
291
291
|
|
|
292
292
|
type InputMessageVariant = "error" | "warning" | "success"
|
|
@@ -305,29 +305,29 @@ type InputMessageType = (props: InputMessageProps) => React.ReactElement
|
|
|
305
305
|
|
|
306
306
|
declare const InputMessage: InputMessageType
|
|
307
307
|
|
|
308
|
-
interface InputProps
|
|
309
|
-
extends React.DetailedHTMLProps<
|
|
310
|
-
React.InputHTMLAttributes<HTMLInputElement>,
|
|
311
|
-
HTMLInputElement
|
|
312
|
-
>,
|
|
313
|
-
React.AriaAttributes {
|
|
314
|
-
isTextArea?: boolean
|
|
315
|
-
inputRef?: React.RefObject<HTMLInputElement | null>
|
|
316
|
-
inputStyles?: string
|
|
317
|
-
labelStyles?: string
|
|
318
|
-
label?: string
|
|
319
|
-
startIcon?: string | React.ReactElement | boolean
|
|
320
|
-
endIcon?: string | React.ReactElement | boolean
|
|
321
|
-
messageClassName?: string
|
|
322
|
-
labelInlineStyles?: string
|
|
323
|
-
message?: string | null
|
|
324
|
-
messageVariant?: InputMessageVariant
|
|
325
|
-
inputValue?: string | number | undefined
|
|
326
|
-
type?: HTMLInputTypeAttribute
|
|
327
|
-
}
|
|
328
|
-
|
|
329
|
-
type InputType = (props: InputProps) => React.ReactElement
|
|
330
|
-
|
|
308
|
+
interface InputProps
|
|
309
|
+
extends React.DetailedHTMLProps<
|
|
310
|
+
React.InputHTMLAttributes<HTMLInputElement>,
|
|
311
|
+
HTMLInputElement
|
|
312
|
+
>,
|
|
313
|
+
React.AriaAttributes {
|
|
314
|
+
isTextArea?: boolean
|
|
315
|
+
inputRef?: React.RefObject<HTMLInputElement | null>
|
|
316
|
+
inputStyles?: string
|
|
317
|
+
labelStyles?: string
|
|
318
|
+
label?: string
|
|
319
|
+
startIcon?: string | React.ReactElement | boolean
|
|
320
|
+
endIcon?: string | React.ReactElement | boolean
|
|
321
|
+
messageClassName?: string
|
|
322
|
+
labelInlineStyles?: string
|
|
323
|
+
message?: string | null
|
|
324
|
+
messageVariant?: InputMessageVariant
|
|
325
|
+
inputValue?: string | number | undefined
|
|
326
|
+
type?: HTMLInputTypeAttribute
|
|
327
|
+
}
|
|
328
|
+
|
|
329
|
+
type InputType = (props: InputProps) => React.ReactElement
|
|
330
|
+
|
|
331
331
|
declare const Input: InputType
|
|
332
332
|
|
|
333
333
|
interface InputFileProps
|
|
@@ -377,35 +377,35 @@ type InputWithCountryDropdownType = (
|
|
|
377
377
|
|
|
378
378
|
declare const InputWithCountryDropdown: InputWithCountryDropdownType
|
|
379
379
|
|
|
380
|
-
interface InputWithMaskProps extends InputWithAdornmentsProps {
|
|
381
|
-
mask?: string
|
|
382
|
-
value?: string | number | undefined
|
|
383
|
-
}
|
|
384
|
-
|
|
385
|
-
type InputWithMaskType = (
|
|
386
|
-
props: InputWithMaskProps
|
|
387
|
-
) => React.ReactElement
|
|
388
|
-
|
|
380
|
+
interface InputWithMaskProps extends InputWithAdornmentsProps {
|
|
381
|
+
mask?: string
|
|
382
|
+
value?: string | number | undefined
|
|
383
|
+
}
|
|
384
|
+
|
|
385
|
+
type InputWithMaskType = (
|
|
386
|
+
props: InputWithMaskProps
|
|
387
|
+
) => React.ReactElement
|
|
388
|
+
|
|
389
389
|
declare const InputWithMask: InputWithMaskType
|
|
390
390
|
|
|
391
|
-
type ModalSizes = "small" | "large"
|
|
392
|
-
|
|
393
|
-
interface ModalProps
|
|
394
|
-
extends React.DetailedHTMLProps<
|
|
395
|
-
React.HTMLAttributes<HTMLDivElement>,
|
|
396
|
-
HTMLDivElement
|
|
397
|
-
> {
|
|
398
|
-
isOpen?: boolean
|
|
399
|
-
handleClose?: () => void
|
|
400
|
-
title?: string
|
|
401
|
-
size?: ModalSizes
|
|
402
|
-
icon?: ReactElement
|
|
403
|
-
isScrollable?: boolean
|
|
404
|
-
description?: string
|
|
405
|
-
}
|
|
406
|
-
|
|
407
|
-
type ModalType = (props: ModalProps) => React.ReactElement
|
|
408
|
-
|
|
391
|
+
type ModalSizes = "small" | "large"
|
|
392
|
+
|
|
393
|
+
interface ModalProps
|
|
394
|
+
extends React.DetailedHTMLProps<
|
|
395
|
+
React.HTMLAttributes<HTMLDivElement>,
|
|
396
|
+
HTMLDivElement
|
|
397
|
+
> {
|
|
398
|
+
isOpen?: boolean
|
|
399
|
+
handleClose?: () => void
|
|
400
|
+
title?: string
|
|
401
|
+
size?: ModalSizes
|
|
402
|
+
icon?: ReactElement
|
|
403
|
+
isScrollable?: boolean
|
|
404
|
+
description?: string
|
|
405
|
+
}
|
|
406
|
+
|
|
407
|
+
type ModalType = (props: ModalProps) => React.ReactElement
|
|
408
|
+
|
|
409
409
|
declare const Modal: ModalType
|
|
410
410
|
|
|
411
411
|
interface RadioProps
|
|
@@ -478,52 +478,52 @@ type ContainerType = (
|
|
|
478
478
|
|
|
479
479
|
declare const Container: ContainerType
|
|
480
480
|
|
|
481
|
-
type GridJustify = "center" | "flex-start" | "flex-end" | "space-between"
|
|
482
|
-
|
|
483
|
-
type GridAlignItems = "center" | "flex-start" | "flex-end"
|
|
484
|
-
|
|
485
|
-
type GridDirections = "column" | "row"
|
|
486
|
-
|
|
487
|
-
type GridWrap = "wrap" | "nowrap"
|
|
488
|
-
|
|
489
|
-
type GridSizing =
|
|
490
|
-
| 1
|
|
491
|
-
| 2
|
|
492
|
-
| 3
|
|
493
|
-
| 4
|
|
494
|
-
| 5
|
|
495
|
-
| 6
|
|
496
|
-
| 7
|
|
497
|
-
| 8
|
|
498
|
-
| 9
|
|
499
|
-
| 10
|
|
500
|
-
| 11
|
|
501
|
-
| 12
|
|
502
|
-
| "auto"
|
|
503
|
-
|
|
504
|
-
interface GridProps
|
|
505
|
-
extends React.DetailedHTMLProps<
|
|
506
|
-
React.HTMLAttributes<HTMLDivElement>,
|
|
507
|
-
HTMLDivElement
|
|
508
|
-
>,
|
|
509
|
-
React.AriaAttributes {
|
|
510
|
-
spacing?: GridSizing
|
|
511
|
-
item?: boolean
|
|
512
|
-
container?: boolean
|
|
513
|
-
justify?: GridJustify
|
|
514
|
-
alignItems?: GridAlignItems
|
|
515
|
-
alignContent?: GridAlignItems
|
|
516
|
-
direction?: GridDirections
|
|
517
|
-
wrap?: GridWrap
|
|
518
|
-
xs?: GridSizing
|
|
519
|
-
sm?: GridSizing
|
|
520
|
-
md?: GridSizing
|
|
521
|
-
lg?: GridSizing
|
|
522
|
-
xl?: GridSizing
|
|
523
|
-
}
|
|
524
|
-
|
|
525
|
-
type GridType = (props: GridProps) => React.ReactElement
|
|
526
|
-
|
|
481
|
+
type GridJustify = "center" | "flex-start" | "flex-end" | "space-between"
|
|
482
|
+
|
|
483
|
+
type GridAlignItems = "center" | "flex-start" | "flex-end"
|
|
484
|
+
|
|
485
|
+
type GridDirections = "column" | "row"
|
|
486
|
+
|
|
487
|
+
type GridWrap = "wrap" | "nowrap"
|
|
488
|
+
|
|
489
|
+
type GridSizing =
|
|
490
|
+
| 1
|
|
491
|
+
| 2
|
|
492
|
+
| 3
|
|
493
|
+
| 4
|
|
494
|
+
| 5
|
|
495
|
+
| 6
|
|
496
|
+
| 7
|
|
497
|
+
| 8
|
|
498
|
+
| 9
|
|
499
|
+
| 10
|
|
500
|
+
| 11
|
|
501
|
+
| 12
|
|
502
|
+
| "auto"
|
|
503
|
+
|
|
504
|
+
interface GridProps
|
|
505
|
+
extends React.DetailedHTMLProps<
|
|
506
|
+
React.HTMLAttributes<HTMLDivElement>,
|
|
507
|
+
HTMLDivElement
|
|
508
|
+
>,
|
|
509
|
+
React.AriaAttributes {
|
|
510
|
+
spacing?: GridSizing
|
|
511
|
+
item?: boolean
|
|
512
|
+
container?: boolean
|
|
513
|
+
justify?: GridJustify
|
|
514
|
+
alignItems?: GridAlignItems
|
|
515
|
+
alignContent?: GridAlignItems
|
|
516
|
+
direction?: GridDirections
|
|
517
|
+
wrap?: GridWrap
|
|
518
|
+
xs?: GridSizing
|
|
519
|
+
sm?: GridSizing
|
|
520
|
+
md?: GridSizing
|
|
521
|
+
lg?: GridSizing
|
|
522
|
+
xl?: GridSizing
|
|
523
|
+
}
|
|
524
|
+
|
|
525
|
+
type GridType = (props: GridProps) => React.ReactElement
|
|
526
|
+
|
|
527
527
|
declare const Grid: GridType
|
|
528
528
|
|
|
529
529
|
type BoxSizing = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12
|
|
@@ -548,41 +548,41 @@ type BoxType = (props: BoxProps) => React.ReactElement
|
|
|
548
548
|
|
|
549
549
|
declare const Box: BoxType
|
|
550
550
|
|
|
551
|
-
interface AccordionProps
|
|
552
|
-
extends Omit<
|
|
553
|
-
React.DetailedHTMLProps<
|
|
554
|
-
React.HTMLAttributes<HTMLDivElement>,
|
|
555
|
-
HTMLDivElement
|
|
556
|
-
>,
|
|
557
|
-
"onChange"
|
|
558
|
-
> {
|
|
559
|
-
expanded?: boolean
|
|
560
|
-
onChange?: (expanded: boolean) => void
|
|
561
|
-
disabled?: boolean
|
|
562
|
-
}
|
|
563
|
-
|
|
564
|
-
type AccordionType = (props: AccordionProps) => React.ReactElement
|
|
565
|
-
|
|
551
|
+
interface AccordionProps
|
|
552
|
+
extends Omit<
|
|
553
|
+
React.DetailedHTMLProps<
|
|
554
|
+
React.HTMLAttributes<HTMLDivElement>,
|
|
555
|
+
HTMLDivElement
|
|
556
|
+
>,
|
|
557
|
+
"onChange"
|
|
558
|
+
> {
|
|
559
|
+
expanded?: boolean
|
|
560
|
+
onChange?: (expanded: boolean) => void
|
|
561
|
+
disabled?: boolean
|
|
562
|
+
}
|
|
563
|
+
|
|
564
|
+
type AccordionType = (props: AccordionProps) => React.ReactElement
|
|
565
|
+
|
|
566
566
|
declare const Accordion: AccordionType
|
|
567
567
|
|
|
568
|
-
interface AccordionSummaryProps
|
|
569
|
-
extends React.DetailedHTMLProps<
|
|
570
|
-
React.HTMLAttributes<HTMLDivElement>,
|
|
571
|
-
HTMLDivElement
|
|
572
|
-
>,
|
|
573
|
-
React.AriaAttributes {
|
|
574
|
-
detailsBlock?: React.RefObject<HTMLDivElement>
|
|
575
|
-
expandIcon?: React.ReactElement | React.ReactElement[] | string
|
|
576
|
-
contentStyles?: string
|
|
577
|
-
expandedStyles?: string
|
|
578
|
-
iconStyles?: string
|
|
579
|
-
disabled?: boolean
|
|
580
|
-
}
|
|
581
|
-
|
|
582
|
-
type AccordionSummaryType = (
|
|
583
|
-
props: AccordionSummaryProps
|
|
584
|
-
) => React.ReactElement
|
|
585
|
-
|
|
568
|
+
interface AccordionSummaryProps
|
|
569
|
+
extends React.DetailedHTMLProps<
|
|
570
|
+
React.HTMLAttributes<HTMLDivElement>,
|
|
571
|
+
HTMLDivElement
|
|
572
|
+
>,
|
|
573
|
+
React.AriaAttributes {
|
|
574
|
+
detailsBlock?: React.RefObject<HTMLDivElement>
|
|
575
|
+
expandIcon?: React.ReactElement | React.ReactElement[] | string
|
|
576
|
+
contentStyles?: string
|
|
577
|
+
expandedStyles?: string
|
|
578
|
+
iconStyles?: string
|
|
579
|
+
disabled?: boolean
|
|
580
|
+
}
|
|
581
|
+
|
|
582
|
+
type AccordionSummaryType = (
|
|
583
|
+
props: AccordionSummaryProps
|
|
584
|
+
) => React.ReactElement
|
|
585
|
+
|
|
586
586
|
declare const AccordionSummary: AccordionSummaryType
|
|
587
587
|
|
|
588
588
|
type AccordionDetailsType = (
|
|
@@ -700,24 +700,24 @@ type TabsType = (props: TabsProps) => React.ReactElement
|
|
|
700
700
|
|
|
701
701
|
declare const Tabs: TabsType
|
|
702
702
|
|
|
703
|
-
interface TabsPanelProps
|
|
704
|
-
extends Omit<
|
|
705
|
-
React.DetailedHTMLProps<
|
|
706
|
-
React.HTMLAttributes<HTMLDivElement>,
|
|
707
|
-
HTMLDivElement
|
|
708
|
-
>,
|
|
709
|
-
"onChange"
|
|
710
|
-
> {
|
|
711
|
-
tabs: string[]
|
|
712
|
-
tabPanels
|
|
713
|
-
paths?: string[]
|
|
714
|
-
activeTab?: number
|
|
715
|
-
onChange?: TabChangeHandlerType
|
|
716
|
-
indicatorPos?: TabsIndicatorPositions
|
|
717
|
-
}
|
|
718
|
-
|
|
719
|
-
type TabsPanelType = (props: TabsPanelProps) => React.ReactElement
|
|
720
|
-
|
|
703
|
+
interface TabsPanelProps
|
|
704
|
+
extends Omit<
|
|
705
|
+
React.DetailedHTMLProps<
|
|
706
|
+
React.HTMLAttributes<HTMLDivElement>,
|
|
707
|
+
HTMLDivElement
|
|
708
|
+
>,
|
|
709
|
+
"onChange"
|
|
710
|
+
> {
|
|
711
|
+
tabs: string[]
|
|
712
|
+
tabPanels?: React.ReactNode[]
|
|
713
|
+
paths?: string[]
|
|
714
|
+
activeTab?: number
|
|
715
|
+
onChange?: TabChangeHandlerType
|
|
716
|
+
indicatorPos?: TabsIndicatorPositions
|
|
717
|
+
}
|
|
718
|
+
|
|
719
|
+
type TabsPanelType = (props: TabsPanelProps) => React.ReactElement
|
|
720
|
+
|
|
721
721
|
declare const TabsPanel: TabsPanelType
|
|
722
722
|
|
|
723
723
|
interface MenuPanelProps
|
|
@@ -751,64 +751,64 @@ type IconButtonType = (props: IconButtonProps) => React.ReactElement
|
|
|
751
751
|
|
|
752
752
|
declare const IconButton: IconButtonType
|
|
753
753
|
|
|
754
|
-
type PopperPlacements =
|
|
755
|
-
| "right"
|
|
756
|
-
| "left"
|
|
757
|
-
| "topStart"
|
|
758
|
-
| "topMiddle"
|
|
759
|
-
| "topEnd"
|
|
760
|
-
| "bottomStart"
|
|
761
|
-
| "bottomMiddle"
|
|
762
|
-
| "bottomEnd"
|
|
763
|
-
|
|
764
|
-
type PopperBaseProps = {
|
|
765
|
-
open?: boolean
|
|
766
|
-
placement?: PopperPlacements
|
|
767
|
-
withArrow?: boolean
|
|
768
|
-
spacing?: string
|
|
769
|
-
className?: string
|
|
754
|
+
type PopperPlacements =
|
|
755
|
+
| "right"
|
|
756
|
+
| "left"
|
|
757
|
+
| "topStart"
|
|
758
|
+
| "topMiddle"
|
|
759
|
+
| "topEnd"
|
|
760
|
+
| "bottomStart"
|
|
761
|
+
| "bottomMiddle"
|
|
762
|
+
| "bottomEnd"
|
|
763
|
+
|
|
764
|
+
type PopperBaseProps = {
|
|
765
|
+
open?: boolean
|
|
766
|
+
placement?: PopperPlacements
|
|
767
|
+
withArrow?: boolean
|
|
768
|
+
spacing?: string
|
|
769
|
+
className?: string
|
|
770
770
|
} & React.HTMLAttributes<HTMLDivElement>
|
|
771
771
|
|
|
772
|
-
type PopperProps = {
|
|
773
|
-
contentRef: RefObject<HTMLDivElement>
|
|
774
|
-
} & PopperBaseProps
|
|
775
|
-
|
|
776
|
-
type PopperSizeParams = {
|
|
777
|
-
width: number
|
|
778
|
-
height: number
|
|
779
|
-
}
|
|
780
|
-
|
|
772
|
+
type PopperProps = {
|
|
773
|
+
contentRef: RefObject<HTMLDivElement>
|
|
774
|
+
} & PopperBaseProps
|
|
775
|
+
|
|
776
|
+
type PopperSizeParams = {
|
|
777
|
+
width: number
|
|
778
|
+
height: number
|
|
779
|
+
}
|
|
780
|
+
|
|
781
781
|
declare const Popper: (props: PopperProps) => React.ReactElement
|
|
782
782
|
|
|
783
|
-
interface TooltipProps
|
|
784
|
-
extends Omit<React.HTMLAttributes<HTMLDivElement>, "content"> {
|
|
785
|
-
onOpen?: () => void
|
|
786
|
-
onClose?: () => void
|
|
787
|
-
content: ReactNode
|
|
788
|
-
open?: boolean
|
|
789
|
-
placement?: PopperPlacements
|
|
790
|
-
withArrow?: boolean
|
|
791
|
-
cursor?: "pointer" | "auto"
|
|
792
|
-
spacing?: string
|
|
793
|
-
}
|
|
794
|
-
|
|
795
|
-
type TooltipStylesProps = {
|
|
796
|
-
cursor?: "pointer" | "auto"
|
|
797
|
-
spacing?: string
|
|
798
|
-
}
|
|
799
|
-
|
|
783
|
+
interface TooltipProps
|
|
784
|
+
extends Omit<React.HTMLAttributes<HTMLDivElement>, "content"> {
|
|
785
|
+
onOpen?: () => void
|
|
786
|
+
onClose?: () => void
|
|
787
|
+
content: ReactNode
|
|
788
|
+
open?: boolean
|
|
789
|
+
placement?: PopperPlacements
|
|
790
|
+
withArrow?: boolean
|
|
791
|
+
cursor?: "pointer" | "auto"
|
|
792
|
+
spacing?: string
|
|
793
|
+
}
|
|
794
|
+
|
|
795
|
+
type TooltipStylesProps = {
|
|
796
|
+
cursor?: "pointer" | "auto"
|
|
797
|
+
spacing?: string
|
|
798
|
+
}
|
|
799
|
+
|
|
800
800
|
declare const Tooltip: (props: TooltipProps) => React.ReactElement
|
|
801
801
|
|
|
802
|
-
interface ErrorComponentProps
|
|
803
|
-
extends React.DetailedHTMLProps<
|
|
804
|
-
React.HTMLAttributes<HTMLDivElement>,
|
|
805
|
-
HTMLDivElement
|
|
806
|
-
>,
|
|
807
|
-
React.AriaAttributes {
|
|
808
|
-
message: string
|
|
809
|
-
icon: ReactNode
|
|
810
|
-
}
|
|
811
|
-
|
|
802
|
+
interface ErrorComponentProps
|
|
803
|
+
extends React.DetailedHTMLProps<
|
|
804
|
+
React.HTMLAttributes<HTMLDivElement>,
|
|
805
|
+
HTMLDivElement
|
|
806
|
+
>,
|
|
807
|
+
React.AriaAttributes {
|
|
808
|
+
message: string
|
|
809
|
+
icon: ReactNode
|
|
810
|
+
}
|
|
811
|
+
|
|
812
812
|
declare const ErrorComponent: (props: ErrorComponentProps) => React.ReactElement
|
|
813
813
|
|
|
814
814
|
export { Accordion, AccordionDetails, AccordionDetailsType, AccordionProps, AccordionSummary, AccordionSummaryProps, AccordionSummaryType, AccordionType, AppBar, AppBarProps, AppBarType, BackgroundColors, BackgroundColorsType, Box, BoxProps, BoxSizing, BoxType, BrandColors, BreakpointsType, Button, ButtonBorder, ButtonProps, ButtonSizes, ButtonThemes, ButtonType, ButtonTypes, Caption, CaptionAlign, CaptionColorGroups, CaptionColors, CaptionProps, CaptionSizes, CaptionType, CaptionVariants, CaptionWeight, Checkbox, CheckboxProps, CheckboxType, CircularProgress, CircularProgressType, ColorOption, ColorsType, Container, ContainerType, CountryItem, Divider, DividerProps, DividerType, ErrorColorsType, ErrorComponent, ErrorComponentProps, GreyColors, Grid, GridAlignItems, GridDirections, GridJustify, GridProps, GridSizing, GridType, GridWrap, Heading, HeadingColorGroups, HeadingColors, HeadingProps, HeadingSizes, HeadingType, IconButton, IconButtonProps, IconButtonType, InfoColorsType, Input, InputFile, InputFileProps, InputFileType, InputMessage, InputMessageProps, InputMessageType, InputMessageVariant, InputProps, InputType, InputWithAdornments, InputWithAdornmentsProps, InputWithAdornmentsType, InputWithCountryDropdown, InputWithCountryDropdownProps, InputWithCountryDropdownType, InputWithMask, InputWithMaskProps, InputWithMaskType, LinearProgress, LinearProgressType, MenuPanel, MenuPanelProps, MenuPanelType, Modal, ModalProps, ModalSizes, ModalType, Palette, Popper, PopperProps, PopperSizeParams, PrimaryColorsType, PurpleColorsType, Radio, RadioProps, RadioType, SecondaryColorsType, SettingsType, ShadowsType, Skeleton, SkeletonType, SuccessColorsType, Switch, SwitchProps, SwitchSizes, SwitchType, Tab, TabChangeHandlerType, TabProps, TabType, Tabs, TabsIndicatorPositions, TabsPanel, TabsPanelProps, TabsPanelType, TabsProps, TabsType, Text, TextColors, TextProps, TextSizes, TextType, TextWeight, ThemeInterface, ThemeType, ToolBar, ToolBarType, Tooltip, TooltipProps, TooltipStylesProps, theme, themeOld };
|