@veeqo/ui 14.10.0-beta-1 → 14.10.0-beta-2
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/components/DataTable/DataTable.cjs +3 -3
- package/dist/components/DataTable/DataTable.cjs.map +1 -1
- package/dist/components/DataTable/DataTable.js +3 -3
- package/dist/components/DataTable/DataTable.js.map +1 -1
- package/dist/components/DataTable/components/DataTable.module.scss.cjs +2 -2
- package/dist/components/DataTable/components/DataTable.module.scss.cjs.map +1 -1
- package/dist/components/DataTable/components/DataTable.module.scss.js +2 -2
- package/dist/components/DataTable/components/DataTable.module.scss.js.map +1 -1
- package/dist/components/DataTable/components/EmptyBodyContent.cjs +4 -1
- package/dist/components/DataTable/components/EmptyBodyContent.cjs.map +1 -1
- package/dist/components/DataTable/components/EmptyBodyContent.js +4 -1
- package/dist/components/DataTable/components/EmptyBodyContent.js.map +1 -1
- package/dist/components/DataTable/components/Header.cjs +1 -1
- package/dist/components/DataTable/components/Header.cjs.map +1 -1
- package/dist/components/DataTable/components/Header.js +1 -1
- package/dist/components/DataTable/components/Header.js.map +1 -1
- package/dist/components/DataTable/components/StickyHead.cjs +3 -11
- package/dist/components/DataTable/components/StickyHead.cjs.map +1 -1
- package/dist/components/DataTable/components/StickyHead.d.ts +2 -1
- package/dist/components/DataTable/components/StickyHead.js +3 -11
- package/dist/components/DataTable/components/StickyHead.js.map +1 -1
- package/dist/components/DataTable/components/TableGrid.cjs +38 -2
- package/dist/components/DataTable/components/TableGrid.cjs.map +1 -1
- package/dist/components/DataTable/components/TableGrid.d.ts +5 -6
- package/dist/components/DataTable/components/TableGrid.js +39 -3
- package/dist/components/DataTable/components/TableGrid.js.map +1 -1
- package/dist/components/DataTable/utils/generateTableCss.cjs +44 -80
- package/dist/components/DataTable/utils/generateTableCss.cjs.map +1 -1
- package/dist/components/DataTable/utils/generateTableCss.d.ts +7 -1
- package/dist/components/DataTable/utils/generateTableCss.js +44 -80
- package/dist/components/DataTable/utils/generateTableCss.js.map +1 -1
- package/dist/components/LegacyDataTable/LegacyDataTable.module.scss.cjs +2 -2
- package/dist/components/LegacyDataTable/LegacyDataTable.module.scss.cjs.map +1 -1
- package/dist/components/LegacyDataTable/LegacyDataTable.module.scss.js +2 -2
- package/dist/components/LegacyDataTable/LegacyDataTable.module.scss.js.map +1 -1
- package/dist/components/LegacyDataTable/SkeletonContent/SkeletonContent.module.scss.cjs +2 -2
- package/dist/components/LegacyDataTable/SkeletonContent/SkeletonContent.module.scss.cjs.map +1 -1
- package/dist/components/LegacyDataTable/SkeletonContent/SkeletonContent.module.scss.js +2 -2
- package/dist/components/LegacyDataTable/SkeletonContent/SkeletonContent.module.scss.js.map +1 -1
- package/dist/components/LegacyDataTable/cells/cells.module.scss.cjs +2 -2
- package/dist/components/LegacyDataTable/cells/cells.module.scss.cjs.map +1 -1
- package/dist/components/LegacyDataTable/cells/cells.module.scss.js +2 -2
- package/dist/components/LegacyDataTable/cells/cells.module.scss.js.map +1 -1
- package/dist/components/LegacyDataTable/styled.cjs +31 -36
- package/dist/components/LegacyDataTable/styled.cjs.map +1 -1
- package/dist/components/LegacyDataTable/styled.js +31 -36
- package/dist/components/LegacyDataTable/styled.js.map +1 -1
- package/dist/components/Search/Search.cjs +16 -10
- package/dist/components/Search/Search.cjs.map +1 -1
- package/dist/components/Search/Search.d.ts +1 -1
- package/dist/components/Search/Search.js +16 -10
- package/dist/components/Search/Search.js.map +1 -1
- package/dist/components/Search/Search.module.scss.cjs +9 -0
- package/dist/components/Search/Search.module.scss.cjs.map +1 -0
- package/dist/components/Search/Search.module.scss.js +7 -0
- package/dist/components/Search/Search.module.scss.js.map +1 -0
- package/dist/components/Stepper/Stepper.cjs +15 -8
- package/dist/components/Stepper/Stepper.cjs.map +1 -1
- package/dist/components/Stepper/Stepper.d.ts +1 -8
- package/dist/components/Stepper/Stepper.js +15 -8
- package/dist/components/Stepper/Stepper.js.map +1 -1
- package/dist/components/Stepper/Stepper.module.scss.cjs +9 -0
- package/dist/components/Stepper/Stepper.module.scss.cjs.map +1 -0
- package/dist/components/Stepper/Stepper.module.scss.js +7 -0
- package/dist/components/Stepper/Stepper.module.scss.js.map +1 -0
- package/dist/components/Stepper/types.d.ts +8 -0
- package/dist/components/Toggle/Toggle.cjs +11 -5
- package/dist/components/Toggle/Toggle.cjs.map +1 -1
- package/dist/components/Toggle/Toggle.js +11 -5
- package/dist/components/Toggle/Toggle.js.map +1 -1
- package/dist/components/Toggle/Toggle.module.scss.cjs +9 -0
- package/dist/components/Toggle/Toggle.module.scss.cjs.map +1 -0
- package/dist/components/Toggle/Toggle.module.scss.js +7 -0
- package/dist/components/Toggle/Toggle.module.scss.js.map +1 -0
- package/package.json +1 -1
- package/dist/components/Search/styled.cjs +0 -45
- package/dist/components/Search/styled.cjs.map +0 -1
- package/dist/components/Search/styled.d.ts +0 -308
- package/dist/components/Search/styled.js +0 -37
- package/dist/components/Search/styled.js.map +0 -1
- package/dist/components/Stepper/styled.cjs +0 -33
- package/dist/components/Stepper/styled.cjs.map +0 -1
- package/dist/components/Stepper/styled.d.ts +0 -12
- package/dist/components/Stepper/styled.js +0 -25
- package/dist/components/Stepper/styled.js.map +0 -1
- package/dist/components/Toggle/styled.cjs +0 -20
- package/dist/components/Toggle/styled.cjs.map +0 -1
- package/dist/components/Toggle/styled.d.ts +0 -12
- package/dist/components/Toggle/styled.js +0 -11
- package/dist/components/Toggle/styled.js.map +0 -1
|
@@ -1,308 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { Loader } from '../Loader';
|
|
3
|
-
declare const Input: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Omit<{
|
|
4
|
-
rel?: string | undefined;
|
|
5
|
-
form?: string | undefined;
|
|
6
|
-
slot?: string | undefined;
|
|
7
|
-
style?: import("react").CSSProperties | undefined;
|
|
8
|
-
title?: string | undefined;
|
|
9
|
-
pattern?: string | undefined;
|
|
10
|
-
className?: string | undefined;
|
|
11
|
-
children?: import("react").ReactNode;
|
|
12
|
-
defaultChecked?: boolean | undefined;
|
|
13
|
-
defaultValue?: string | number | readonly string[] | undefined;
|
|
14
|
-
suppressContentEditableWarning?: boolean | undefined;
|
|
15
|
-
suppressHydrationWarning?: boolean | undefined;
|
|
16
|
-
accessKey?: string | undefined;
|
|
17
|
-
autoFocus?: boolean | undefined;
|
|
18
|
-
contentEditable?: "inherit" | (boolean | "true" | "false") | undefined;
|
|
19
|
-
contextMenu?: string | undefined;
|
|
20
|
-
dir?: string | undefined;
|
|
21
|
-
draggable?: (boolean | "true" | "false") | undefined;
|
|
22
|
-
hidden?: boolean | undefined;
|
|
23
|
-
id?: string | undefined;
|
|
24
|
-
lang?: string | undefined;
|
|
25
|
-
nonce?: string | undefined;
|
|
26
|
-
placeholder?: string | undefined;
|
|
27
|
-
spellCheck?: (boolean | "true" | "false") | undefined;
|
|
28
|
-
tabIndex?: number | undefined;
|
|
29
|
-
translate?: "no" | "yes" | undefined;
|
|
30
|
-
radioGroup?: string | undefined;
|
|
31
|
-
role?: import("react").AriaRole | undefined;
|
|
32
|
-
about?: string | undefined;
|
|
33
|
-
content?: string | undefined;
|
|
34
|
-
datatype?: string | undefined;
|
|
35
|
-
inlist?: any;
|
|
36
|
-
prefix?: string | undefined;
|
|
37
|
-
property?: string | undefined;
|
|
38
|
-
resource?: string | undefined;
|
|
39
|
-
rev?: string | undefined;
|
|
40
|
-
typeof?: string | undefined;
|
|
41
|
-
vocab?: string | undefined;
|
|
42
|
-
autoCapitalize?: string | undefined;
|
|
43
|
-
autoCorrect?: string | undefined;
|
|
44
|
-
autoSave?: string | undefined;
|
|
45
|
-
color?: string | undefined;
|
|
46
|
-
itemProp?: string | undefined;
|
|
47
|
-
itemScope?: boolean | undefined;
|
|
48
|
-
itemType?: string | undefined;
|
|
49
|
-
itemID?: string | undefined;
|
|
50
|
-
itemRef?: string | undefined;
|
|
51
|
-
results?: number | undefined;
|
|
52
|
-
security?: string | undefined;
|
|
53
|
-
unselectable?: "on" | "off" | undefined;
|
|
54
|
-
inputMode?: "text" | "none" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
|
|
55
|
-
is?: string | undefined;
|
|
56
|
-
'aria-activedescendant'?: string | undefined;
|
|
57
|
-
'aria-atomic'?: (boolean | "true" | "false") | undefined;
|
|
58
|
-
'aria-autocomplete'?: "list" | "none" | "inline" | "both" | undefined;
|
|
59
|
-
'aria-busy'?: (boolean | "true" | "false") | undefined;
|
|
60
|
-
'aria-checked'?: boolean | "true" | "false" | "mixed" | undefined;
|
|
61
|
-
'aria-colcount'?: number | undefined;
|
|
62
|
-
'aria-colindex'?: number | undefined;
|
|
63
|
-
'aria-colspan'?: number | undefined;
|
|
64
|
-
'aria-controls'?: string | undefined;
|
|
65
|
-
'aria-current'?: boolean | "time" | "true" | "false" | "step" | "date" | "page" | "location" | undefined;
|
|
66
|
-
'aria-describedby'?: string | undefined;
|
|
67
|
-
'aria-details'?: string | undefined;
|
|
68
|
-
'aria-disabled'?: (boolean | "true" | "false") | undefined;
|
|
69
|
-
'aria-dropeffect'?: "link" | "none" | "copy" | "move" | "execute" | "popup" | undefined;
|
|
70
|
-
'aria-errormessage'?: string | undefined;
|
|
71
|
-
'aria-expanded'?: (boolean | "true" | "false") | undefined;
|
|
72
|
-
'aria-flowto'?: string | undefined;
|
|
73
|
-
'aria-grabbed'?: (boolean | "true" | "false") | undefined;
|
|
74
|
-
'aria-haspopup'?: boolean | "dialog" | "menu" | "grid" | "listbox" | "tree" | "true" | "false" | undefined;
|
|
75
|
-
'aria-hidden'?: (boolean | "true" | "false") | undefined;
|
|
76
|
-
'aria-invalid'?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
|
|
77
|
-
'aria-keyshortcuts'?: string | undefined;
|
|
78
|
-
'aria-label'?: string | undefined;
|
|
79
|
-
'aria-labelledby'?: string | undefined;
|
|
80
|
-
'aria-level'?: number | undefined;
|
|
81
|
-
'aria-live'?: "off" | "assertive" | "polite" | undefined;
|
|
82
|
-
'aria-modal'?: (boolean | "true" | "false") | undefined;
|
|
83
|
-
'aria-multiline'?: (boolean | "true" | "false") | undefined;
|
|
84
|
-
'aria-multiselectable'?: (boolean | "true" | "false") | undefined;
|
|
85
|
-
'aria-orientation'?: "horizontal" | "vertical" | undefined;
|
|
86
|
-
'aria-owns'?: string | undefined;
|
|
87
|
-
'aria-placeholder'?: string | undefined;
|
|
88
|
-
'aria-posinset'?: number | undefined;
|
|
89
|
-
'aria-pressed'?: boolean | "true" | "false" | "mixed" | undefined;
|
|
90
|
-
'aria-readonly'?: (boolean | "true" | "false") | undefined;
|
|
91
|
-
'aria-relevant'?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
|
|
92
|
-
'aria-required'?: (boolean | "true" | "false") | undefined;
|
|
93
|
-
'aria-roledescription'?: string | undefined;
|
|
94
|
-
'aria-rowcount'?: number | undefined;
|
|
95
|
-
'aria-rowindex'?: number | undefined;
|
|
96
|
-
'aria-rowspan'?: number | undefined;
|
|
97
|
-
'aria-selected'?: (boolean | "true" | "false") | undefined;
|
|
98
|
-
'aria-setsize'?: number | undefined;
|
|
99
|
-
'aria-sort'?: "other" | "none" | "ascending" | "descending" | undefined;
|
|
100
|
-
'aria-valuemax'?: number | undefined;
|
|
101
|
-
'aria-valuemin'?: number | undefined;
|
|
102
|
-
'aria-valuenow'?: number | undefined;
|
|
103
|
-
'aria-valuetext'?: string | undefined;
|
|
104
|
-
dangerouslySetInnerHTML?: {
|
|
105
|
-
__html: string | TrustedHTML;
|
|
106
|
-
} | undefined;
|
|
107
|
-
onCopy?: (import("react").ClipboardEventHandler<HTMLInputElement> & import("react").ClipboardEventHandler<HTMLTextAreaElement>) | undefined;
|
|
108
|
-
onCopyCapture?: (import("react").ClipboardEventHandler<HTMLInputElement> & import("react").ClipboardEventHandler<HTMLTextAreaElement>) | undefined;
|
|
109
|
-
onCut?: (import("react").ClipboardEventHandler<HTMLInputElement> & import("react").ClipboardEventHandler<HTMLTextAreaElement>) | undefined;
|
|
110
|
-
onCutCapture?: (import("react").ClipboardEventHandler<HTMLInputElement> & import("react").ClipboardEventHandler<HTMLTextAreaElement>) | undefined;
|
|
111
|
-
onPaste?: (import("react").ClipboardEventHandler<HTMLInputElement> & import("react").ClipboardEventHandler<HTMLTextAreaElement>) | undefined;
|
|
112
|
-
onPasteCapture?: (import("react").ClipboardEventHandler<HTMLInputElement> & import("react").ClipboardEventHandler<HTMLTextAreaElement>) | undefined;
|
|
113
|
-
onCompositionEnd?: (import("react").CompositionEventHandler<HTMLInputElement> & import("react").CompositionEventHandler<HTMLTextAreaElement>) | undefined;
|
|
114
|
-
onCompositionEndCapture?: (import("react").CompositionEventHandler<HTMLInputElement> & import("react").CompositionEventHandler<HTMLTextAreaElement>) | undefined;
|
|
115
|
-
onCompositionStart?: (import("react").CompositionEventHandler<HTMLInputElement> & import("react").CompositionEventHandler<HTMLTextAreaElement>) | undefined;
|
|
116
|
-
onCompositionStartCapture?: (import("react").CompositionEventHandler<HTMLInputElement> & import("react").CompositionEventHandler<HTMLTextAreaElement>) | undefined;
|
|
117
|
-
onCompositionUpdate?: (import("react").CompositionEventHandler<HTMLInputElement> & import("react").CompositionEventHandler<HTMLTextAreaElement>) | undefined;
|
|
118
|
-
onCompositionUpdateCapture?: (import("react").CompositionEventHandler<HTMLInputElement> & import("react").CompositionEventHandler<HTMLTextAreaElement>) | undefined;
|
|
119
|
-
onFocus?: (import("react").FocusEventHandler<HTMLInputElement> & import("react").FocusEventHandler<HTMLTextAreaElement>) | undefined;
|
|
120
|
-
onFocusCapture?: (import("react").FocusEventHandler<HTMLInputElement> & import("react").FocusEventHandler<HTMLTextAreaElement>) | undefined;
|
|
121
|
-
onBlur?: (import("react").FocusEventHandler<HTMLInputElement> & import("react").FocusEventHandler<HTMLTextAreaElement>) | undefined;
|
|
122
|
-
onBlurCapture?: (import("react").FocusEventHandler<HTMLInputElement> & import("react").FocusEventHandler<HTMLTextAreaElement>) | undefined;
|
|
123
|
-
onChangeCapture?: (import("react").FormEventHandler<HTMLInputElement> & import("react").FormEventHandler<HTMLTextAreaElement>) | undefined;
|
|
124
|
-
onBeforeInput?: (import("react").FormEventHandler<HTMLInputElement> & import("react").FormEventHandler<HTMLTextAreaElement>) | undefined;
|
|
125
|
-
onBeforeInputCapture?: (import("react").FormEventHandler<HTMLInputElement> & import("react").FormEventHandler<HTMLTextAreaElement>) | undefined;
|
|
126
|
-
onInput?: (import("react").FormEventHandler<HTMLInputElement> & import("react").FormEventHandler<HTMLTextAreaElement>) | undefined;
|
|
127
|
-
onInputCapture?: (import("react").FormEventHandler<HTMLInputElement> & import("react").FormEventHandler<HTMLTextAreaElement>) | undefined;
|
|
128
|
-
onReset?: (import("react").FormEventHandler<HTMLInputElement> & import("react").FormEventHandler<HTMLTextAreaElement>) | undefined;
|
|
129
|
-
onResetCapture?: (import("react").FormEventHandler<HTMLInputElement> & import("react").FormEventHandler<HTMLTextAreaElement>) | undefined;
|
|
130
|
-
onSubmit?: (import("react").FormEventHandler<HTMLInputElement> & import("react").FormEventHandler<HTMLTextAreaElement>) | undefined;
|
|
131
|
-
onSubmitCapture?: (import("react").FormEventHandler<HTMLInputElement> & import("react").FormEventHandler<HTMLTextAreaElement>) | undefined;
|
|
132
|
-
onInvalid?: (import("react").FormEventHandler<HTMLInputElement> & import("react").FormEventHandler<HTMLTextAreaElement>) | undefined;
|
|
133
|
-
onInvalidCapture?: (import("react").FormEventHandler<HTMLInputElement> & import("react").FormEventHandler<HTMLTextAreaElement>) | undefined;
|
|
134
|
-
onLoad?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
135
|
-
onLoadCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
136
|
-
onError?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
137
|
-
onErrorCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
138
|
-
onKeyDown?: (import("react").KeyboardEventHandler<HTMLInputElement> & import("react").KeyboardEventHandler<HTMLTextAreaElement>) | undefined;
|
|
139
|
-
onKeyDownCapture?: (import("react").KeyboardEventHandler<HTMLInputElement> & import("react").KeyboardEventHandler<HTMLTextAreaElement>) | undefined;
|
|
140
|
-
onKeyPress?: (import("react").KeyboardEventHandler<HTMLInputElement> & import("react").KeyboardEventHandler<HTMLTextAreaElement>) | undefined;
|
|
141
|
-
onKeyPressCapture?: (import("react").KeyboardEventHandler<HTMLInputElement> & import("react").KeyboardEventHandler<HTMLTextAreaElement>) | undefined;
|
|
142
|
-
onKeyUp?: (import("react").KeyboardEventHandler<HTMLInputElement> & import("react").KeyboardEventHandler<HTMLTextAreaElement>) | undefined;
|
|
143
|
-
onKeyUpCapture?: (import("react").KeyboardEventHandler<HTMLInputElement> & import("react").KeyboardEventHandler<HTMLTextAreaElement>) | undefined;
|
|
144
|
-
onAbort?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
145
|
-
onAbortCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
146
|
-
onCanPlay?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
147
|
-
onCanPlayCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
148
|
-
onCanPlayThrough?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
149
|
-
onCanPlayThroughCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
150
|
-
onDurationChange?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
151
|
-
onDurationChangeCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
152
|
-
onEmptied?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
153
|
-
onEmptiedCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
154
|
-
onEncrypted?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
155
|
-
onEncryptedCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
156
|
-
onEnded?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
157
|
-
onEndedCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
158
|
-
onLoadedData?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
159
|
-
onLoadedDataCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
160
|
-
onLoadedMetadata?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
161
|
-
onLoadedMetadataCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
162
|
-
onLoadStart?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
163
|
-
onLoadStartCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
164
|
-
onPause?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
165
|
-
onPauseCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
166
|
-
onPlay?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
167
|
-
onPlayCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
168
|
-
onPlaying?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
169
|
-
onPlayingCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
170
|
-
onProgress?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
171
|
-
onProgressCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
172
|
-
onRateChange?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
173
|
-
onRateChangeCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
174
|
-
onSeeked?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
175
|
-
onSeekedCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
176
|
-
onSeeking?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
177
|
-
onSeekingCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
178
|
-
onStalled?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
179
|
-
onStalledCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
180
|
-
onSuspend?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
181
|
-
onSuspendCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
182
|
-
onTimeUpdate?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
183
|
-
onTimeUpdateCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
184
|
-
onVolumeChange?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
185
|
-
onVolumeChangeCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
186
|
-
onWaiting?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
187
|
-
onWaitingCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
188
|
-
onAuxClick?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
189
|
-
onAuxClickCapture?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
190
|
-
onClick?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
191
|
-
onClickCapture?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
192
|
-
onContextMenu?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
193
|
-
onContextMenuCapture?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
194
|
-
onDoubleClick?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
195
|
-
onDoubleClickCapture?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
196
|
-
onDrag?: (import("react").DragEventHandler<HTMLInputElement> & import("react").DragEventHandler<HTMLTextAreaElement>) | undefined;
|
|
197
|
-
onDragCapture?: (import("react").DragEventHandler<HTMLInputElement> & import("react").DragEventHandler<HTMLTextAreaElement>) | undefined;
|
|
198
|
-
onDragEnd?: (import("react").DragEventHandler<HTMLInputElement> & import("react").DragEventHandler<HTMLTextAreaElement>) | undefined;
|
|
199
|
-
onDragEndCapture?: (import("react").DragEventHandler<HTMLInputElement> & import("react").DragEventHandler<HTMLTextAreaElement>) | undefined;
|
|
200
|
-
onDragEnter?: (import("react").DragEventHandler<HTMLInputElement> & import("react").DragEventHandler<HTMLTextAreaElement>) | undefined;
|
|
201
|
-
onDragEnterCapture?: (import("react").DragEventHandler<HTMLInputElement> & import("react").DragEventHandler<HTMLTextAreaElement>) | undefined;
|
|
202
|
-
onDragExit?: (import("react").DragEventHandler<HTMLInputElement> & import("react").DragEventHandler<HTMLTextAreaElement>) | undefined;
|
|
203
|
-
onDragExitCapture?: (import("react").DragEventHandler<HTMLInputElement> & import("react").DragEventHandler<HTMLTextAreaElement>) | undefined;
|
|
204
|
-
onDragLeave?: (import("react").DragEventHandler<HTMLInputElement> & import("react").DragEventHandler<HTMLTextAreaElement>) | undefined;
|
|
205
|
-
onDragLeaveCapture?: (import("react").DragEventHandler<HTMLInputElement> & import("react").DragEventHandler<HTMLTextAreaElement>) | undefined;
|
|
206
|
-
onDragOver?: (import("react").DragEventHandler<HTMLInputElement> & import("react").DragEventHandler<HTMLTextAreaElement>) | undefined;
|
|
207
|
-
onDragOverCapture?: (import("react").DragEventHandler<HTMLInputElement> & import("react").DragEventHandler<HTMLTextAreaElement>) | undefined;
|
|
208
|
-
onDragStart?: (import("react").DragEventHandler<HTMLInputElement> & import("react").DragEventHandler<HTMLTextAreaElement>) | undefined;
|
|
209
|
-
onDragStartCapture?: (import("react").DragEventHandler<HTMLInputElement> & import("react").DragEventHandler<HTMLTextAreaElement>) | undefined;
|
|
210
|
-
onDrop?: (import("react").DragEventHandler<HTMLInputElement> & import("react").DragEventHandler<HTMLTextAreaElement>) | undefined;
|
|
211
|
-
onDropCapture?: (import("react").DragEventHandler<HTMLInputElement> & import("react").DragEventHandler<HTMLTextAreaElement>) | undefined;
|
|
212
|
-
onMouseDown?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
213
|
-
onMouseDownCapture?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
214
|
-
onMouseEnter?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
215
|
-
onMouseLeave?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
216
|
-
onMouseMove?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
217
|
-
onMouseMoveCapture?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
218
|
-
onMouseOut?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
219
|
-
onMouseOutCapture?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
220
|
-
onMouseOver?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
221
|
-
onMouseOverCapture?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
222
|
-
onMouseUp?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
223
|
-
onMouseUpCapture?: (import("react").MouseEventHandler<HTMLInputElement> & import("react").MouseEventHandler<HTMLTextAreaElement>) | undefined;
|
|
224
|
-
onSelect?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
225
|
-
onSelectCapture?: (import("react").ReactEventHandler<HTMLInputElement> & import("react").ReactEventHandler<HTMLTextAreaElement>) | undefined;
|
|
226
|
-
onTouchCancel?: (import("react").TouchEventHandler<HTMLInputElement> & import("react").TouchEventHandler<HTMLTextAreaElement>) | undefined;
|
|
227
|
-
onTouchCancelCapture?: (import("react").TouchEventHandler<HTMLInputElement> & import("react").TouchEventHandler<HTMLTextAreaElement>) | undefined;
|
|
228
|
-
onTouchEnd?: (import("react").TouchEventHandler<HTMLInputElement> & import("react").TouchEventHandler<HTMLTextAreaElement>) | undefined;
|
|
229
|
-
onTouchEndCapture?: (import("react").TouchEventHandler<HTMLInputElement> & import("react").TouchEventHandler<HTMLTextAreaElement>) | undefined;
|
|
230
|
-
onTouchMove?: (import("react").TouchEventHandler<HTMLInputElement> & import("react").TouchEventHandler<HTMLTextAreaElement>) | undefined;
|
|
231
|
-
onTouchMoveCapture?: (import("react").TouchEventHandler<HTMLInputElement> & import("react").TouchEventHandler<HTMLTextAreaElement>) | undefined;
|
|
232
|
-
onTouchStart?: (import("react").TouchEventHandler<HTMLInputElement> & import("react").TouchEventHandler<HTMLTextAreaElement>) | undefined;
|
|
233
|
-
onTouchStartCapture?: (import("react").TouchEventHandler<HTMLInputElement> & import("react").TouchEventHandler<HTMLTextAreaElement>) | undefined;
|
|
234
|
-
onPointerDown?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
235
|
-
onPointerDownCapture?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
236
|
-
onPointerMove?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
237
|
-
onPointerMoveCapture?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
238
|
-
onPointerUp?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
239
|
-
onPointerUpCapture?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
240
|
-
onPointerCancel?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
241
|
-
onPointerCancelCapture?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
242
|
-
onPointerEnter?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
243
|
-
onPointerEnterCapture?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
244
|
-
onPointerLeave?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
245
|
-
onPointerLeaveCapture?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
246
|
-
onPointerOver?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
247
|
-
onPointerOverCapture?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
248
|
-
onPointerOut?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
249
|
-
onPointerOutCapture?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
250
|
-
onGotPointerCapture?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
251
|
-
onGotPointerCaptureCapture?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
252
|
-
onLostPointerCapture?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
253
|
-
onLostPointerCaptureCapture?: (import("react").PointerEventHandler<HTMLInputElement> & import("react").PointerEventHandler<HTMLTextAreaElement>) | undefined;
|
|
254
|
-
onScroll?: (import("react").UIEventHandler<HTMLInputElement> & import("react").UIEventHandler<HTMLTextAreaElement>) | undefined;
|
|
255
|
-
onScrollCapture?: (import("react").UIEventHandler<HTMLInputElement> & import("react").UIEventHandler<HTMLTextAreaElement>) | undefined;
|
|
256
|
-
onWheel?: (import("react").WheelEventHandler<HTMLInputElement> & import("react").WheelEventHandler<HTMLTextAreaElement>) | undefined;
|
|
257
|
-
onWheelCapture?: (import("react").WheelEventHandler<HTMLInputElement> & import("react").WheelEventHandler<HTMLTextAreaElement>) | undefined;
|
|
258
|
-
onAnimationStart?: (import("react").AnimationEventHandler<HTMLInputElement> & import("react").AnimationEventHandler<HTMLTextAreaElement>) | undefined;
|
|
259
|
-
onAnimationStartCapture?: (import("react").AnimationEventHandler<HTMLInputElement> & import("react").AnimationEventHandler<HTMLTextAreaElement>) | undefined;
|
|
260
|
-
onAnimationEnd?: (import("react").AnimationEventHandler<HTMLInputElement> & import("react").AnimationEventHandler<HTMLTextAreaElement>) | undefined;
|
|
261
|
-
onAnimationEndCapture?: (import("react").AnimationEventHandler<HTMLInputElement> & import("react").AnimationEventHandler<HTMLTextAreaElement>) | undefined;
|
|
262
|
-
onAnimationIteration?: (import("react").AnimationEventHandler<HTMLInputElement> & import("react").AnimationEventHandler<HTMLTextAreaElement>) | undefined;
|
|
263
|
-
onAnimationIterationCapture?: (import("react").AnimationEventHandler<HTMLInputElement> & import("react").AnimationEventHandler<HTMLTextAreaElement>) | undefined;
|
|
264
|
-
onTransitionEnd?: (import("react").TransitionEventHandler<HTMLInputElement> & import("react").TransitionEventHandler<HTMLTextAreaElement>) | undefined;
|
|
265
|
-
onTransitionEndCapture?: (import("react").TransitionEventHandler<HTMLInputElement> & import("react").TransitionEventHandler<HTMLTextAreaElement>) | undefined;
|
|
266
|
-
alt?: string | undefined;
|
|
267
|
-
disabled?: boolean | undefined;
|
|
268
|
-
formAction?: string | undefined;
|
|
269
|
-
formEncType?: string | undefined;
|
|
270
|
-
formMethod?: string | undefined;
|
|
271
|
-
formNoValidate?: boolean | undefined;
|
|
272
|
-
formTarget?: string | undefined;
|
|
273
|
-
autoComplete?: string | undefined;
|
|
274
|
-
accept?: string | undefined;
|
|
275
|
-
capture?: boolean | "user" | "environment" | undefined;
|
|
276
|
-
checked?: boolean | undefined;
|
|
277
|
-
enterKeyHint?: "search" | "previous" | "next" | "enter" | "done" | "go" | "send" | undefined;
|
|
278
|
-
multiple?: boolean | undefined;
|
|
279
|
-
cols?: number | undefined;
|
|
280
|
-
dirName?: string | undefined;
|
|
281
|
-
maxLength?: number | undefined;
|
|
282
|
-
minLength?: number | undefined;
|
|
283
|
-
src?: string | undefined;
|
|
284
|
-
list?: string | undefined;
|
|
285
|
-
name?: string | undefined;
|
|
286
|
-
height?: string | number | undefined;
|
|
287
|
-
max?: string | number | undefined;
|
|
288
|
-
min?: string | number | undefined;
|
|
289
|
-
width?: string | number | undefined;
|
|
290
|
-
readOnly?: boolean | undefined;
|
|
291
|
-
required?: boolean | undefined;
|
|
292
|
-
step?: string | number | undefined;
|
|
293
|
-
rows?: number | undefined;
|
|
294
|
-
wrap?: string | undefined;
|
|
295
|
-
} & {
|
|
296
|
-
value?: string | undefined;
|
|
297
|
-
type?: import("../TextField").TextFieldType | undefined;
|
|
298
|
-
onChange?: ((value: string) => void) | undefined;
|
|
299
|
-
hasError?: boolean | undefined;
|
|
300
|
-
disabledMessage?: import("react").ReactNode;
|
|
301
|
-
size?: "base" | "sm" | undefined;
|
|
302
|
-
multiline?: boolean | undefined;
|
|
303
|
-
} & import("react").RefAttributes<HTMLInputElement> & import("../../hoc/withLabels/withLabels").WithLabelsProps, "ref"> & import("react").RefAttributes<unknown>>, any, {}, never>;
|
|
304
|
-
declare const IconContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
305
|
-
declare const Container: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../BaseContainer").BaseContainerProps & import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>, any, {
|
|
306
|
-
iconPosition: 'left' | 'right';
|
|
307
|
-
}, never>;
|
|
308
|
-
export { Container, Input, IconContainer, Loader };
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
import styled from 'styled-components';
|
|
2
|
-
import { TextField } from '../TextField/index.js';
|
|
3
|
-
import { BaseContainer } from '../BaseContainer/BaseContainer.js';
|
|
4
|
-
import 'react';
|
|
5
|
-
|
|
6
|
-
const Input = styled(TextField).withConfig({ displayName: "vui--Input", componentId: "vui--je6y84" }) `flex-grow:2;margin-top:0;margin-bottom:0;`;
|
|
7
|
-
const IconContainer = styled.div.withConfig({ displayName: "vui--IconContainer", componentId: "vui--113gfe8" }) `position:absolute;`;
|
|
8
|
-
const Container = styled(BaseContainer).withConfig({
|
|
9
|
-
shouldForwardProp: (prop) => !['iconPosition'].includes(prop),
|
|
10
|
-
}) `
|
|
11
|
-
position: relative;
|
|
12
|
-
display: flex;
|
|
13
|
-
justify-content: flex-start;
|
|
14
|
-
align-items: center;
|
|
15
|
-
border-radius: 0.25rem;
|
|
16
|
-
|
|
17
|
-
${({ iconPosition }) => {
|
|
18
|
-
let padding = 'padding-right: 2.5rem;';
|
|
19
|
-
let position = 'right: 0.5rem;';
|
|
20
|
-
if (iconPosition === 'left') {
|
|
21
|
-
padding = 'padding-left: 2.5rem';
|
|
22
|
-
position = 'left: 0.5rem;';
|
|
23
|
-
}
|
|
24
|
-
return `
|
|
25
|
-
& ${Input} {
|
|
26
|
-
${padding}
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
& ${IconContainer} {
|
|
30
|
-
${position}
|
|
31
|
-
}
|
|
32
|
-
`;
|
|
33
|
-
}}
|
|
34
|
-
`;
|
|
35
|
-
|
|
36
|
-
export { Container, IconContainer, Input };
|
|
37
|
-
//# sourceMappingURL=styled.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"styled.js","sources":["../../../src/components/Search/styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport { TextField } from '../TextField';\nimport { BaseContainer } from '../BaseContainer';\nimport { Loader } from '../Loader';\n\nconst Input = styled(TextField)`\n flex-grow: 2;\n margin-top: 0;\n margin-bottom: 0;\n`;\n\nconst IconContainer = styled.div`\n position: absolute;\n`;\n\nconst Container = styled(BaseContainer).withConfig({\n shouldForwardProp: (prop) => !['iconPosition'].includes(prop),\n})<{ iconPosition: 'left' | 'right' }>`\n position: relative;\n display: flex;\n justify-content: flex-start;\n align-items: center;\n border-radius: 0.25rem;\n\n ${({ iconPosition }) => {\n let padding = 'padding-right: 2.5rem;';\n let position = 'right: 0.5rem;';\n\n if (iconPosition === 'left') {\n padding = 'padding-left: 2.5rem';\n position = 'left: 0.5rem;';\n }\n\n return `\n & ${Input} {\n ${padding}\n }\n\n & ${IconContainer} {\n ${position}\n }\n `;\n }}\n`;\n\nexport { Container, Input, IconContainer, Loader };\n"],"names":[],"mappings":";;;;;AAMA,MAAM,KAAK,GAAG,MAAM,CAAC,SAAS,CAAC;AAM/B,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG;AAIhC,MAAM,SAAS,GAAG,MAAM,CAAC,aAAa,CAAC,CAAC,UAAU,CAAC;AACjD,IAAA,iBAAiB,EAAE,CAAC,IAAI,KAAK,CAAC,CAAC,cAAc,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC;AAC9D,CAAA,CAAC,CAAoC;;;;;;;AAOlC,EAAA,EAAA,CAAC,EAAE,YAAY,EAAE,KAAI;IACrB,IAAI,OAAO,GAAG,wBAAwB;IACtC,IAAI,QAAQ,GAAG,gBAAgB;IAE/B,IAAI,YAAY,KAAK,MAAM,EAAE;QAC3B,OAAO,GAAG,sBAAsB;QAChC,QAAQ,GAAG,eAAe;AAC3B,IAAA;IAED,OAAO;UACD,KAAK,CAAA;UACL,OAAO;;;UAGP,aAAa,CAAA;UACb,QAAQ;;KAEb;AACH,CAAC;;;;;"}
|
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var styled = require('styled-components');
|
|
4
|
-
var index = require('../../theme/index.cjs');
|
|
5
|
-
var inputStyles = require('../../utils/forms/inputStyles.cjs');
|
|
6
|
-
var Stack = require('../Stack/Stack.cjs');
|
|
7
|
-
|
|
8
|
-
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
9
|
-
|
|
10
|
-
var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
|
|
11
|
-
|
|
12
|
-
const { colors: { neutral, secondary }, radius, } = index.theme;
|
|
13
|
-
const ContainerStack = styled__default.default(Stack.Stack).withConfig({
|
|
14
|
-
shouldForwardProp: (prop) => !['hasError', 'compact'].includes(prop),
|
|
15
|
-
}) `
|
|
16
|
-
--background-color: ${({ disabled }) => (disabled ? neutral.grey.light : 'white')};
|
|
17
|
-
--border-color: ${({ hasError }) => (hasError ? secondary.red.base : neutral.ink.lightest)};
|
|
18
|
-
|
|
19
|
-
box-sizing: border-box;
|
|
20
|
-
display: inline-flex;
|
|
21
|
-
background-color: var(--background-color);
|
|
22
|
-
border: ${index.theme.sizes.line} solid var(--border-color);
|
|
23
|
-
border-radius: ${radius.base};
|
|
24
|
-
|
|
25
|
-
height: ${({ compact }) => (compact ? index.theme.sizes[8] : index.theme.sizes[10])};
|
|
26
|
-
`;
|
|
27
|
-
const StepButton = styled__default.default.button.withConfig({ displayName: "vui--StepButton", componentId: "vui--1j6prbe" }) `appearance:none;border:0;background-color:transparent;border-radius:${radius.base};cursor:pointer;height:100%;aspect-ratio:1;&:hover{background-color:${neutral.grey.light};}${inputStyles.inputFocusStyles}`;
|
|
28
|
-
const StepperDivider = styled__default.default.div.withConfig({ displayName: "vui--StepperDivider", componentId: "vui--19ho080" }) `width:${index.theme.sizes.line};background-color:${neutral.ink.lightest};height:${({ compact }) => (compact ? index.theme.sizes[4] : index.theme.sizes[6])};`;
|
|
29
|
-
|
|
30
|
-
exports.ContainerStack = ContainerStack;
|
|
31
|
-
exports.StepButton = StepButton;
|
|
32
|
-
exports.StepperDivider = StepperDivider;
|
|
33
|
-
//# sourceMappingURL=styled.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"styled.cjs","sources":["../../../src/components/Stepper/styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../theme';\nimport { inputFocusStyles } from '../../utils/forms/inputStyles';\nimport { Stack } from '../Stack';\nimport { FormComponentProps } from '../types';\n\nconst {\n colors: { neutral, secondary },\n radius,\n} = theme;\n\nexport const ContainerStack = styled(Stack).withConfig({\n shouldForwardProp: (prop) => !['hasError', 'compact'].includes(prop),\n})<FormComponentProps>`\n --background-color: ${({ disabled }) => (disabled ? neutral.grey.light : 'white')};\n --border-color: ${({ hasError }) => (hasError ? secondary.red.base : neutral.ink.lightest)};\n\n box-sizing: border-box;\n display: inline-flex;\n background-color: var(--background-color);\n border: ${theme.sizes.line} solid var(--border-color);\n border-radius: ${radius.base};\n\n height: ${({ compact }) => (compact ? theme.sizes[8] : theme.sizes[10])};\n`;\n\nexport const StepButton = styled.button`\n appearance: none;\n border: 0;\n background-color: transparent;\n border-radius: ${radius.base};\n cursor: pointer;\n\n height: 100%;\n aspect-ratio: 1;\n\n &:hover {\n background-color: ${neutral.grey.light};\n }\n\n ${inputFocusStyles}\n`;\n\nexport const StepperDivider = styled.div<Pick<FormComponentProps, 'compact'>>`\n width: ${theme.sizes.line};\n background-color: ${neutral.ink.lightest};\n height: ${({ compact }) => (compact ? theme.sizes[4] : theme.sizes[6])};\n`;\n"],"names":["theme","styled","Stack","inputFocusStyles"],"mappings":";;;;;;;;;;;AAMA,MAAM,EACJ,MAAM,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,EAC9B,MAAM,GACP,GAAGA,WAAK;AAEF,MAAM,cAAc,GAAGC,uBAAM,CAACC,WAAK,CAAC,CAAC,UAAU,CAAC;AACrD,IAAA,iBAAiB,EAAE,CAAC,IAAI,KAAK,CAAC,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC;AACrE,CAAA,CAAC,CAAoB;wBACE,CAAC,EAAE,QAAQ,EAAE,MAAM,QAAQ,GAAG,OAAO,CAAC,IAAI,CAAC,KAAK,GAAG,OAAO,CAAC,CAAA;oBAC/D,CAAC,EAAE,QAAQ,EAAE,MAAM,QAAQ,GAAG,SAAS,CAAC,GAAG,CAAC,IAAI,GAAG,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAA;;;;;YAKhFF,WAAK,CAAC,KAAK,CAAC,IAAI,CAAA;AACT,iBAAA,EAAA,MAAM,CAAC,IAAI,CAAA;;YAElB,CAAC,EAAE,OAAO,EAAE,MAAM,OAAO,GAAGA,WAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAGA,WAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAA;;MAG5D,UAAU,GAAGC,uBAAM,CAAC,MAAM,oJAIpB,MAAM,CAAC,IAAI,CAAA,oEAAA,EAON,OAAO,CAAC,IAAI,CAAC,KAAK,CAAA,EAAA,EAGtCE,4BAAgB;MAGP,cAAc,GAAGF,uBAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,qBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,MAAA,EAC7BD,WAAK,CAAC,KAAK,CAAC,IAAI,CAAA,kBAAA,EACL,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAA,QAAA,EAC9B,CAAC,EAAE,OAAO,EAAE,MAAM,OAAO,GAAGA,WAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAGA,WAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAA,CAAA;;;;;;"}
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { FormComponentProps } from '../types';
|
|
3
|
-
export declare const ContainerStack: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<{
|
|
4
|
-
direction?: "horizontal" | "vertical" | undefined;
|
|
5
|
-
alignX?: "start" | "end" | "center" | "stretch" | "between" | "around" | undefined;
|
|
6
|
-
alignY?: "start" | "end" | "center" | "stretch" | "between" | "around" | undefined;
|
|
7
|
-
spacing?: keyof import("../Stack").SizeScale | undefined;
|
|
8
|
-
as?: import("react").ElementType<any> | undefined;
|
|
9
|
-
forwardedAs?: import("react").ElementType<any> | undefined;
|
|
10
|
-
} & import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>, any, FormComponentProps, never>;
|
|
11
|
-
export declare const StepButton: import("styled-components").StyledComponent<"button", any, FormComponentProps, never>;
|
|
12
|
-
export declare const StepperDivider: import("styled-components").StyledComponent<"div", any, Pick<FormComponentProps, "compact">, never>;
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import styled from 'styled-components';
|
|
2
|
-
import { theme } from '../../theme/index.js';
|
|
3
|
-
import { inputFocusStyles } from '../../utils/forms/inputStyles.js';
|
|
4
|
-
import { Stack } from '../Stack/Stack.js';
|
|
5
|
-
|
|
6
|
-
const { colors: { neutral, secondary }, radius, } = theme;
|
|
7
|
-
const ContainerStack = styled(Stack).withConfig({
|
|
8
|
-
shouldForwardProp: (prop) => !['hasError', 'compact'].includes(prop),
|
|
9
|
-
}) `
|
|
10
|
-
--background-color: ${({ disabled }) => (disabled ? neutral.grey.light : 'white')};
|
|
11
|
-
--border-color: ${({ hasError }) => (hasError ? secondary.red.base : neutral.ink.lightest)};
|
|
12
|
-
|
|
13
|
-
box-sizing: border-box;
|
|
14
|
-
display: inline-flex;
|
|
15
|
-
background-color: var(--background-color);
|
|
16
|
-
border: ${theme.sizes.line} solid var(--border-color);
|
|
17
|
-
border-radius: ${radius.base};
|
|
18
|
-
|
|
19
|
-
height: ${({ compact }) => (compact ? theme.sizes[8] : theme.sizes[10])};
|
|
20
|
-
`;
|
|
21
|
-
const StepButton = styled.button.withConfig({ displayName: "vui--StepButton", componentId: "vui--1j6prbe" }) `appearance:none;border:0;background-color:transparent;border-radius:${radius.base};cursor:pointer;height:100%;aspect-ratio:1;&:hover{background-color:${neutral.grey.light};}${inputFocusStyles}`;
|
|
22
|
-
const StepperDivider = styled.div.withConfig({ displayName: "vui--StepperDivider", componentId: "vui--19ho080" }) `width:${theme.sizes.line};background-color:${neutral.ink.lightest};height:${({ compact }) => (compact ? theme.sizes[4] : theme.sizes[6])};`;
|
|
23
|
-
|
|
24
|
-
export { ContainerStack, StepButton, StepperDivider };
|
|
25
|
-
//# sourceMappingURL=styled.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"styled.js","sources":["../../../src/components/Stepper/styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../theme';\nimport { inputFocusStyles } from '../../utils/forms/inputStyles';\nimport { Stack } from '../Stack';\nimport { FormComponentProps } from '../types';\n\nconst {\n colors: { neutral, secondary },\n radius,\n} = theme;\n\nexport const ContainerStack = styled(Stack).withConfig({\n shouldForwardProp: (prop) => !['hasError', 'compact'].includes(prop),\n})<FormComponentProps>`\n --background-color: ${({ disabled }) => (disabled ? neutral.grey.light : 'white')};\n --border-color: ${({ hasError }) => (hasError ? secondary.red.base : neutral.ink.lightest)};\n\n box-sizing: border-box;\n display: inline-flex;\n background-color: var(--background-color);\n border: ${theme.sizes.line} solid var(--border-color);\n border-radius: ${radius.base};\n\n height: ${({ compact }) => (compact ? theme.sizes[8] : theme.sizes[10])};\n`;\n\nexport const StepButton = styled.button`\n appearance: none;\n border: 0;\n background-color: transparent;\n border-radius: ${radius.base};\n cursor: pointer;\n\n height: 100%;\n aspect-ratio: 1;\n\n &:hover {\n background-color: ${neutral.grey.light};\n }\n\n ${inputFocusStyles}\n`;\n\nexport const StepperDivider = styled.div<Pick<FormComponentProps, 'compact'>>`\n width: ${theme.sizes.line};\n background-color: ${neutral.ink.lightest};\n height: ${({ compact }) => (compact ? theme.sizes[4] : theme.sizes[6])};\n`;\n"],"names":[],"mappings":";;;;;AAMA,MAAM,EACJ,MAAM,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,EAC9B,MAAM,GACP,GAAG,KAAK;AAEF,MAAM,cAAc,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC;AACrD,IAAA,iBAAiB,EAAE,CAAC,IAAI,KAAK,CAAC,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC;AACrE,CAAA,CAAC,CAAoB;wBACE,CAAC,EAAE,QAAQ,EAAE,MAAM,QAAQ,GAAG,OAAO,CAAC,IAAI,CAAC,KAAK,GAAG,OAAO,CAAC,CAAA;oBAC/D,CAAC,EAAE,QAAQ,EAAE,MAAM,QAAQ,GAAG,SAAS,CAAC,GAAG,CAAC,IAAI,GAAG,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAA;;;;;YAKhF,KAAK,CAAC,KAAK,CAAC,IAAI,CAAA;AACT,iBAAA,EAAA,MAAM,CAAC,IAAI,CAAA;;YAElB,CAAC,EAAE,OAAO,EAAE,MAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAA;;MAG5D,UAAU,GAAG,MAAM,CAAC,MAAM,oJAIpB,MAAM,CAAC,IAAI,CAAA,oEAAA,EAON,OAAO,CAAC,IAAI,CAAC,KAAK,CAAA,EAAA,EAGtC,gBAAgB;MAGP,cAAc,GAAG,MAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,qBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,MAAA,EAC7B,KAAK,CAAC,KAAK,CAAC,IAAI,CAAA,kBAAA,EACL,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAA,QAAA,EAC9B,CAAC,EAAE,OAAO,EAAE,MAAM,OAAO,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAA,CAAA;;;;"}
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var styled = require('styled-components');
|
|
4
|
-
var BaseContainer = require('../BaseContainer/BaseContainer.cjs');
|
|
5
|
-
var index = require('../../theme/index.cjs');
|
|
6
|
-
|
|
7
|
-
function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
|
|
8
|
-
|
|
9
|
-
var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
|
|
10
|
-
|
|
11
|
-
const Slider = styled__default.default.span.withConfig({ displayName: "vui--Slider", componentId: "vui--x03mdi" }) `content:'';position:absolute;top:0;left:0;right:0;bottom:0;border-radius:18px;background-color:#cdd1d5;-webkit-transition:0.3s;transition:0.3s;&:after{content:'';position:absolute;border-radius:50%;background-color:${({ disabled, switched }) => disabled && switched ? index.theme.colors.secondary.blue.lightest : 'white'};-webkit-transition:0.3s;transition:0.3s;}`;
|
|
12
|
-
const Input = styled__default.default.input.withConfig({ displayName: "vui--Input", componentId: "vui--1ccelw2" }) `width:100%;height:100%;border-radius:${index.theme.radius.base};z-index:2;margin:0;cursor:${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};&:focus-visible + ${Slider}{box-shadow:0 0 0 4px ${index.theme.colors.brand.blue.light};}&:checked + ${Slider}{background-color:#0079d1;}&:disabled + ${Slider}{background-color:${index.theme.colors.neutral.grey.base};}&:checked:disabled + ${Slider}{background-color:${index.theme.colors.secondary.blue.light};}`;
|
|
13
|
-
const Switch = styled__default.default.span.withConfig({ displayName: "vui--Switch", componentId: "vui--13yy1uj" }) `display:flex;position:relative;height:${({ small }) => (small ? '28px' : '36px')};width:${({ small }) => (small ? '56px' : '72px')};z-index:1;input{position:absolute;opacity:0;}${Slider}:after{height:${({ small }) => (small ? '22px' : '28px')};width:${({ small }) => (small ? '22px' : '28px')};left:${({ small }) => (small ? '3px' : '4px')};bottom:${({ small }) => (small ? '3px' : '4px')};}${Input}:checked + ${Slider}{&:after,svg{-webkit-transform:translateX(${({ small }) => (small ? '28px' : '36px')});-ms-transform:translateX(${({ small }) => (small ? '28px' : '36px')});transform:translateX(${({ small }) => (small ? '28px' : '36px')});}}`;
|
|
14
|
-
const Wrapper = styled__default.default(BaseContainer.BaseContainer).withConfig({ displayName: "vui--Wrapper", componentId: "vui--69792q" }) `display:inline-block;user-select:none;`;
|
|
15
|
-
|
|
16
|
-
exports.Input = Input;
|
|
17
|
-
exports.Slider = Slider;
|
|
18
|
-
exports.Switch = Switch;
|
|
19
|
-
exports.Wrapper = Wrapper;
|
|
20
|
-
//# sourceMappingURL=styled.cjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"styled.cjs","sources":["../../../src/components/Toggle/styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport { ToggleProps } from './types';\nimport { BaseContainer } from '../BaseContainer';\nimport { theme } from '../../theme';\n\nconst Slider = styled.span<{ switched?: boolean; disabled?: boolean }>`\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border-radius: 18px;\n background-color: #cdd1d5;\n -webkit-transition: 0.3s;\n transition: 0.3s;\n\n &:after {\n content: '';\n position: absolute;\n border-radius: 50%;\n background-color: ${({ disabled, switched }) =>\n disabled && switched ? theme.colors.secondary.blue.lightest : 'white'};\n -webkit-transition: 0.3s;\n transition: 0.3s;\n }\n`;\n\nconst Input = styled.input`\n width: 100%;\n height: 100%;\n border-radius: ${theme.radius.base};\n z-index: 2;\n margin: 0;\n\n cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};\n\n &:focus-visible + ${Slider} {\n box-shadow: 0 0 0 4px ${theme.colors.brand.blue.light};\n }\n\n &:checked + ${Slider} {\n background-color: #0079d1;\n }\n\n &:disabled + ${Slider} {\n background-color: ${theme.colors.neutral.grey.base};\n }\n\n &:checked:disabled + ${Slider} {\n background-color: ${theme.colors.secondary.blue.light};\n }\n`;\n\nconst Switch = styled.span<ToggleProps>`\n display: flex;\n position: relative;\n height: ${({ small }) => (small ? '28px' : '36px')};\n width: ${({ small }) => (small ? '56px' : '72px')};\n z-index: 1;\n\n input {\n position: absolute;\n opacity: 0;\n }\n\n // configure size and animation\n ${Slider}:after {\n height: ${({ small }) => (small ? '22px' : '28px')};\n width: ${({ small }) => (small ? '22px' : '28px')};\n left: ${({ small }) => (small ? '3px' : '4px')};\n bottom: ${({ small }) => (small ? '3px' : '4px')};\n }\n\n ${Input}:checked + ${Slider} {\n &:after,\n svg {\n -webkit-transform: translateX(${({ small }) => (small ? '28px' : '36px')});\n -ms-transform: translateX(${({ small }) => (small ? '28px' : '36px')});\n transform: translateX(${({ small }) => (small ? '28px' : '36px')});\n }\n }\n`;\n\nconst Wrapper = styled(BaseContainer)<{ disabled?: boolean }>`\n display: inline-block;\n user-select: none;\n`;\n\nexport { Switch, Slider, Input, Wrapper };\n"],"names":["styled","theme","BaseContainer"],"mappings":";;;;;;;;;;AAMA,MAAM,MAAM,GAAGA,uBAAM,CAAC,IAAI,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,aAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,uNAAA,EAgBF,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,KACzC,QAAQ,IAAI,QAAQ,GAAGC,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,GAAG,OAAO;AAM3E,MAAM,KAAK,GAAGD,uBAAM,CAAC,KAAK,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,YAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,qCAAA,EAGPC,WAAK,CAAC,MAAM,CAAC,IAAI,CAAA,2BAAA,EAIxB,CAAC,EAAE,QAAQ,EAAE,MAAM,QAAQ,GAAG,aAAa,GAAG,SAAS,CAAC,CAAA,mBAAA,EAE9C,MAAM,CAAA,sBAAA,EACAA,WAAK,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAA,cAAA,EAGzC,MAAM,CAAA,wCAAA,EAIL,MAAM,CAAA,kBAAA,EACCA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,uBAAA,EAG7B,MAAM,qBACPA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK;AAIzD,MAAM,MAAM,GAAGD,uBAAM,CAAC,IAAI,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,aAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,sCAAA,EAGd,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,OAAA,EACzC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,8CAAA,EAS/C,MAAM,CAAA,cAAA,EACI,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,UACzC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,MAAA,EACzC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC,WACpC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC,CAAA,EAAA,EAGhD,KAAK,cAAc,MAAM,CAAA,0CAAA,EAGS,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,2BAAA,EAC5C,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,uBAAA,EAC5C,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;AAKtE,MAAM,OAAO,GAAGA,uBAAM,CAACE,2BAAa,CAAC;;;;;;;"}
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { ToggleProps } from './types';
|
|
3
|
-
declare const Slider: import("styled-components").StyledComponent<"span", any, {
|
|
4
|
-
switched?: boolean | undefined;
|
|
5
|
-
disabled?: boolean | undefined;
|
|
6
|
-
}, never>;
|
|
7
|
-
declare const Input: import("styled-components").StyledComponent<"input", any, {}, never>;
|
|
8
|
-
declare const Switch: import("styled-components").StyledComponent<"span", any, ToggleProps, never>;
|
|
9
|
-
declare const Wrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../BaseContainer").BaseContainerProps & import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>, any, {
|
|
10
|
-
disabled?: boolean | undefined;
|
|
11
|
-
}, never>;
|
|
12
|
-
export { Switch, Slider, Input, Wrapper };
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import styled from 'styled-components';
|
|
2
|
-
import { BaseContainer } from '../BaseContainer/BaseContainer.js';
|
|
3
|
-
import { theme } from '../../theme/index.js';
|
|
4
|
-
|
|
5
|
-
const Slider = styled.span.withConfig({ displayName: "vui--Slider", componentId: "vui--x03mdi" }) `content:'';position:absolute;top:0;left:0;right:0;bottom:0;border-radius:18px;background-color:#cdd1d5;-webkit-transition:0.3s;transition:0.3s;&:after{content:'';position:absolute;border-radius:50%;background-color:${({ disabled, switched }) => disabled && switched ? theme.colors.secondary.blue.lightest : 'white'};-webkit-transition:0.3s;transition:0.3s;}`;
|
|
6
|
-
const Input = styled.input.withConfig({ displayName: "vui--Input", componentId: "vui--1ccelw2" }) `width:100%;height:100%;border-radius:${theme.radius.base};z-index:2;margin:0;cursor:${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};&:focus-visible + ${Slider}{box-shadow:0 0 0 4px ${theme.colors.brand.blue.light};}&:checked + ${Slider}{background-color:#0079d1;}&:disabled + ${Slider}{background-color:${theme.colors.neutral.grey.base};}&:checked:disabled + ${Slider}{background-color:${theme.colors.secondary.blue.light};}`;
|
|
7
|
-
const Switch = styled.span.withConfig({ displayName: "vui--Switch", componentId: "vui--13yy1uj" }) `display:flex;position:relative;height:${({ small }) => (small ? '28px' : '36px')};width:${({ small }) => (small ? '56px' : '72px')};z-index:1;input{position:absolute;opacity:0;}${Slider}:after{height:${({ small }) => (small ? '22px' : '28px')};width:${({ small }) => (small ? '22px' : '28px')};left:${({ small }) => (small ? '3px' : '4px')};bottom:${({ small }) => (small ? '3px' : '4px')};}${Input}:checked + ${Slider}{&:after,svg{-webkit-transform:translateX(${({ small }) => (small ? '28px' : '36px')});-ms-transform:translateX(${({ small }) => (small ? '28px' : '36px')});transform:translateX(${({ small }) => (small ? '28px' : '36px')});}}`;
|
|
8
|
-
const Wrapper = styled(BaseContainer).withConfig({ displayName: "vui--Wrapper", componentId: "vui--69792q" }) `display:inline-block;user-select:none;`;
|
|
9
|
-
|
|
10
|
-
export { Input, Slider, Switch, Wrapper };
|
|
11
|
-
//# sourceMappingURL=styled.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"styled.js","sources":["../../../src/components/Toggle/styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport { ToggleProps } from './types';\nimport { BaseContainer } from '../BaseContainer';\nimport { theme } from '../../theme';\n\nconst Slider = styled.span<{ switched?: boolean; disabled?: boolean }>`\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border-radius: 18px;\n background-color: #cdd1d5;\n -webkit-transition: 0.3s;\n transition: 0.3s;\n\n &:after {\n content: '';\n position: absolute;\n border-radius: 50%;\n background-color: ${({ disabled, switched }) =>\n disabled && switched ? theme.colors.secondary.blue.lightest : 'white'};\n -webkit-transition: 0.3s;\n transition: 0.3s;\n }\n`;\n\nconst Input = styled.input`\n width: 100%;\n height: 100%;\n border-radius: ${theme.radius.base};\n z-index: 2;\n margin: 0;\n\n cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};\n\n &:focus-visible + ${Slider} {\n box-shadow: 0 0 0 4px ${theme.colors.brand.blue.light};\n }\n\n &:checked + ${Slider} {\n background-color: #0079d1;\n }\n\n &:disabled + ${Slider} {\n background-color: ${theme.colors.neutral.grey.base};\n }\n\n &:checked:disabled + ${Slider} {\n background-color: ${theme.colors.secondary.blue.light};\n }\n`;\n\nconst Switch = styled.span<ToggleProps>`\n display: flex;\n position: relative;\n height: ${({ small }) => (small ? '28px' : '36px')};\n width: ${({ small }) => (small ? '56px' : '72px')};\n z-index: 1;\n\n input {\n position: absolute;\n opacity: 0;\n }\n\n // configure size and animation\n ${Slider}:after {\n height: ${({ small }) => (small ? '22px' : '28px')};\n width: ${({ small }) => (small ? '22px' : '28px')};\n left: ${({ small }) => (small ? '3px' : '4px')};\n bottom: ${({ small }) => (small ? '3px' : '4px')};\n }\n\n ${Input}:checked + ${Slider} {\n &:after,\n svg {\n -webkit-transform: translateX(${({ small }) => (small ? '28px' : '36px')});\n -ms-transform: translateX(${({ small }) => (small ? '28px' : '36px')});\n transform: translateX(${({ small }) => (small ? '28px' : '36px')});\n }\n }\n`;\n\nconst Wrapper = styled(BaseContainer)<{ disabled?: boolean }>`\n display: inline-block;\n user-select: none;\n`;\n\nexport { Switch, Slider, Input, Wrapper };\n"],"names":[],"mappings":";;;;AAMA,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,aAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,uNAAA,EAgBF,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,KACzC,QAAQ,IAAI,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,GAAG,OAAO;AAM3E,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,YAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,qCAAA,EAGP,KAAK,CAAC,MAAM,CAAC,IAAI,CAAA,2BAAA,EAIxB,CAAC,EAAE,QAAQ,EAAE,MAAM,QAAQ,GAAG,aAAa,GAAG,SAAS,CAAC,CAAA,mBAAA,EAE9C,MAAM,CAAA,sBAAA,EACA,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAA,cAAA,EAGzC,MAAM,CAAA,wCAAA,EAIL,MAAM,CAAA,kBAAA,EACC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAA,uBAAA,EAG7B,MAAM,qBACP,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK;AAIzD,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,aAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,sCAAA,EAGd,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,OAAA,EACzC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,8CAAA,EAS/C,MAAM,CAAA,cAAA,EACI,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,UACzC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,MAAA,EACzC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC,WACpC,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC,CAAA,EAAA,EAGhD,KAAK,cAAc,MAAM,CAAA,0CAAA,EAGS,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,2BAAA,EAC5C,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC,CAAA,uBAAA,EAC5C,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;AAKtE,MAAM,OAAO,GAAG,MAAM,CAAC,aAAa,CAAC;;;;"}
|