@arkyn/components 1.2.3 → 1.2.5
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/bundle.js +1031 -760
- package/dist/bundle.umd.cjs +11 -11
- package/dist/components/Checkbox/index.d.ts +5 -0
- package/dist/components/Checkbox/index.d.ts.map +1 -0
- package/dist/components/Checkbox/index.js +20 -0
- package/dist/components/Input/CurrencyInput/index.js +1 -1
- package/dist/components/Input/MaskInput/index.d.ts.map +1 -1
- package/dist/components/Input/MaskInput/index.js +34 -58
- package/dist/components/Select/getConfig.d.ts +312 -0
- package/dist/components/Select/getConfig.d.ts.map +1 -0
- package/dist/components/Select/getConfig.js +30 -0
- package/dist/components/Select/index.d.ts +5 -0
- package/dist/components/Select/index.d.ts.map +1 -0
- package/dist/components/Select/index.js +71 -0
- package/dist/components/Select/utils/morpheme.d.ts +4 -0
- package/dist/components/Select/utils/morpheme.d.ts.map +1 -0
- package/dist/components/Select/utils/morpheme.js +10 -0
- package/dist/components/Skeleton/index.d.ts +1 -0
- package/dist/components/Skeleton/index.d.ts.map +1 -1
- package/dist/components/Skeleton/index.js +1 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -0
- package/dist/style.css +1 -1
- package/package.json +6 -6
- package/src/components/Checkbox/index.tsx +52 -0
- package/src/components/Checkbox/styles.css +66 -0
- package/src/components/Input/CurrencyInput/index.tsx +1 -1
- package/src/components/Input/MaskInput/index.tsx +81 -68
- package/src/components/Select/getConfig.tsx +52 -0
- package/src/components/Select/index.tsx +157 -0
- package/src/components/Select/styles.css +305 -0
- package/src/components/Select/utils/morpheme.tsx +19 -0
- package/src/components/Skeleton/index.tsx +1 -0
- package/src/index.ts +2 -0
@@ -0,0 +1,312 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
/// <reference types="react" />
|
3
|
+
import type { SelectProps } from "@arkyn/types";
|
4
|
+
declare function getConfig(props: SelectProps, isFocused: boolean): {
|
5
|
+
name: string;
|
6
|
+
value?: string;
|
7
|
+
defaultValue?: string;
|
8
|
+
options: {
|
9
|
+
label: string;
|
10
|
+
value: string;
|
11
|
+
}[];
|
12
|
+
onSelect?: (value: {
|
13
|
+
label: string;
|
14
|
+
value: string;
|
15
|
+
}) => void;
|
16
|
+
suppressHydrationWarning?: boolean;
|
17
|
+
color?: string;
|
18
|
+
height?: string | number;
|
19
|
+
id?: string;
|
20
|
+
lang?: string;
|
21
|
+
max?: string | number;
|
22
|
+
min?: string | number;
|
23
|
+
width?: string | number;
|
24
|
+
role?: import("react").AriaRole;
|
25
|
+
tabIndex?: number;
|
26
|
+
"aria-activedescendant"?: string;
|
27
|
+
"aria-atomic"?: boolean | "true" | "false";
|
28
|
+
"aria-autocomplete"?: "list" | "none" | "inline" | "both";
|
29
|
+
"aria-braillelabel"?: string;
|
30
|
+
"aria-brailleroledescription"?: string;
|
31
|
+
"aria-busy"?: boolean | "true" | "false";
|
32
|
+
"aria-checked"?: boolean | "true" | "false" | "mixed";
|
33
|
+
"aria-colcount"?: number;
|
34
|
+
"aria-colindex"?: number;
|
35
|
+
"aria-colindextext"?: string;
|
36
|
+
"aria-colspan"?: number;
|
37
|
+
"aria-controls"?: string;
|
38
|
+
"aria-current"?: boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time";
|
39
|
+
"aria-describedby"?: string;
|
40
|
+
"aria-description"?: string;
|
41
|
+
"aria-details"?: string;
|
42
|
+
"aria-disabled"?: boolean | "true" | "false";
|
43
|
+
"aria-dropeffect"?: "link" | "none" | "copy" | "execute" | "move" | "popup";
|
44
|
+
"aria-errormessage"?: string;
|
45
|
+
"aria-expanded"?: boolean | "true" | "false";
|
46
|
+
"aria-flowto"?: string;
|
47
|
+
"aria-grabbed"?: boolean | "true" | "false";
|
48
|
+
"aria-haspopup"?: boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree";
|
49
|
+
"aria-hidden"?: boolean | "true" | "false";
|
50
|
+
"aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling";
|
51
|
+
"aria-keyshortcuts"?: string;
|
52
|
+
"aria-label"?: string;
|
53
|
+
"aria-labelledby"?: string;
|
54
|
+
"aria-level"?: number;
|
55
|
+
"aria-live"?: "off" | "assertive" | "polite";
|
56
|
+
"aria-modal"?: boolean | "true" | "false";
|
57
|
+
"aria-multiline"?: boolean | "true" | "false";
|
58
|
+
"aria-multiselectable"?: boolean | "true" | "false";
|
59
|
+
"aria-orientation"?: "horizontal" | "vertical";
|
60
|
+
"aria-owns"?: string;
|
61
|
+
"aria-placeholder"?: string;
|
62
|
+
"aria-posinset"?: number;
|
63
|
+
"aria-pressed"?: boolean | "true" | "false" | "mixed";
|
64
|
+
"aria-readonly"?: boolean | "true" | "false";
|
65
|
+
"aria-relevant"?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals";
|
66
|
+
"aria-required"?: boolean | "true" | "false";
|
67
|
+
"aria-roledescription"?: string;
|
68
|
+
"aria-rowcount"?: number;
|
69
|
+
"aria-rowindex"?: number;
|
70
|
+
"aria-rowindextext"?: string;
|
71
|
+
"aria-rowspan"?: number;
|
72
|
+
"aria-selected"?: boolean | "true" | "false";
|
73
|
+
"aria-setsize"?: number;
|
74
|
+
"aria-sort"?: "none" | "ascending" | "descending" | "other";
|
75
|
+
"aria-valuemax"?: number;
|
76
|
+
"aria-valuemin"?: number;
|
77
|
+
"aria-valuenow"?: number;
|
78
|
+
"aria-valuetext"?: string;
|
79
|
+
children?: import("react").ReactNode;
|
80
|
+
dangerouslySetInnerHTML?: {
|
81
|
+
__html: string | TrustedHTML;
|
82
|
+
};
|
83
|
+
onCopy?: import("react").ClipboardEventHandler<HTMLInputElement>;
|
84
|
+
onCopyCapture?: import("react").ClipboardEventHandler<HTMLInputElement>;
|
85
|
+
onCut?: import("react").ClipboardEventHandler<HTMLInputElement>;
|
86
|
+
onCutCapture?: import("react").ClipboardEventHandler<HTMLInputElement>;
|
87
|
+
onPaste?: import("react").ClipboardEventHandler<HTMLInputElement>;
|
88
|
+
onPasteCapture?: import("react").ClipboardEventHandler<HTMLInputElement>;
|
89
|
+
onCompositionEnd?: import("react").CompositionEventHandler<HTMLInputElement>;
|
90
|
+
onCompositionEndCapture?: import("react").CompositionEventHandler<HTMLInputElement>;
|
91
|
+
onCompositionStart?: import("react").CompositionEventHandler<HTMLInputElement>;
|
92
|
+
onCompositionStartCapture?: import("react").CompositionEventHandler<HTMLInputElement>;
|
93
|
+
onCompositionUpdate?: import("react").CompositionEventHandler<HTMLInputElement>;
|
94
|
+
onCompositionUpdateCapture?: import("react").CompositionEventHandler<HTMLInputElement>;
|
95
|
+
onFocusCapture?: import("react").FocusEventHandler<HTMLInputElement>;
|
96
|
+
onBlurCapture?: import("react").FocusEventHandler<HTMLInputElement>;
|
97
|
+
onChangeCapture?: import("react").FormEventHandler<HTMLInputElement>;
|
98
|
+
onBeforeInput?: import("react").FormEventHandler<HTMLInputElement>;
|
99
|
+
onBeforeInputCapture?: import("react").FormEventHandler<HTMLInputElement>;
|
100
|
+
onInput?: import("react").FormEventHandler<HTMLInputElement>;
|
101
|
+
onInputCapture?: import("react").FormEventHandler<HTMLInputElement>;
|
102
|
+
onReset?: import("react").FormEventHandler<HTMLInputElement>;
|
103
|
+
onResetCapture?: import("react").FormEventHandler<HTMLInputElement>;
|
104
|
+
onSubmit?: import("react").FormEventHandler<HTMLInputElement>;
|
105
|
+
onSubmitCapture?: import("react").FormEventHandler<HTMLInputElement>;
|
106
|
+
onInvalid?: import("react").FormEventHandler<HTMLInputElement>;
|
107
|
+
onInvalidCapture?: import("react").FormEventHandler<HTMLInputElement>;
|
108
|
+
onLoad?: import("react").ReactEventHandler<HTMLInputElement>;
|
109
|
+
onLoadCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
110
|
+
onError?: import("react").ReactEventHandler<HTMLInputElement>;
|
111
|
+
onErrorCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
112
|
+
onKeyDown?: import("react").KeyboardEventHandler<HTMLInputElement>;
|
113
|
+
onKeyDownCapture?: import("react").KeyboardEventHandler<HTMLInputElement>;
|
114
|
+
onKeyPress?: import("react").KeyboardEventHandler<HTMLInputElement>;
|
115
|
+
onKeyPressCapture?: import("react").KeyboardEventHandler<HTMLInputElement>;
|
116
|
+
onKeyUp?: import("react").KeyboardEventHandler<HTMLInputElement>;
|
117
|
+
onKeyUpCapture?: import("react").KeyboardEventHandler<HTMLInputElement>;
|
118
|
+
onAbort?: import("react").ReactEventHandler<HTMLInputElement>;
|
119
|
+
onAbortCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
120
|
+
onCanPlay?: import("react").ReactEventHandler<HTMLInputElement>;
|
121
|
+
onCanPlayCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
122
|
+
onCanPlayThrough?: import("react").ReactEventHandler<HTMLInputElement>;
|
123
|
+
onCanPlayThroughCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
124
|
+
onDurationChange?: import("react").ReactEventHandler<HTMLInputElement>;
|
125
|
+
onDurationChangeCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
126
|
+
onEmptied?: import("react").ReactEventHandler<HTMLInputElement>;
|
127
|
+
onEmptiedCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
128
|
+
onEncrypted?: import("react").ReactEventHandler<HTMLInputElement>;
|
129
|
+
onEncryptedCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
130
|
+
onEnded?: import("react").ReactEventHandler<HTMLInputElement>;
|
131
|
+
onEndedCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
132
|
+
onLoadedData?: import("react").ReactEventHandler<HTMLInputElement>;
|
133
|
+
onLoadedDataCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
134
|
+
onLoadedMetadata?: import("react").ReactEventHandler<HTMLInputElement>;
|
135
|
+
onLoadedMetadataCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
136
|
+
onLoadStart?: import("react").ReactEventHandler<HTMLInputElement>;
|
137
|
+
onLoadStartCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
138
|
+
onPause?: import("react").ReactEventHandler<HTMLInputElement>;
|
139
|
+
onPauseCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
140
|
+
onPlay?: import("react").ReactEventHandler<HTMLInputElement>;
|
141
|
+
onPlayCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
142
|
+
onPlaying?: import("react").ReactEventHandler<HTMLInputElement>;
|
143
|
+
onPlayingCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
144
|
+
onProgress?: import("react").ReactEventHandler<HTMLInputElement>;
|
145
|
+
onProgressCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
146
|
+
onRateChange?: import("react").ReactEventHandler<HTMLInputElement>;
|
147
|
+
onRateChangeCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
148
|
+
onResize?: import("react").ReactEventHandler<HTMLInputElement>;
|
149
|
+
onResizeCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
150
|
+
onSeeked?: import("react").ReactEventHandler<HTMLInputElement>;
|
151
|
+
onSeekedCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
152
|
+
onSeeking?: import("react").ReactEventHandler<HTMLInputElement>;
|
153
|
+
onSeekingCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
154
|
+
onStalled?: import("react").ReactEventHandler<HTMLInputElement>;
|
155
|
+
onStalledCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
156
|
+
onSuspend?: import("react").ReactEventHandler<HTMLInputElement>;
|
157
|
+
onSuspendCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
158
|
+
onTimeUpdate?: import("react").ReactEventHandler<HTMLInputElement>;
|
159
|
+
onTimeUpdateCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
160
|
+
onVolumeChange?: import("react").ReactEventHandler<HTMLInputElement>;
|
161
|
+
onVolumeChangeCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
162
|
+
onWaiting?: import("react").ReactEventHandler<HTMLInputElement>;
|
163
|
+
onWaitingCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
164
|
+
onAuxClick?: import("react").MouseEventHandler<HTMLInputElement>;
|
165
|
+
onAuxClickCapture?: import("react").MouseEventHandler<HTMLInputElement>;
|
166
|
+
onClick?: import("react").MouseEventHandler<HTMLInputElement>;
|
167
|
+
onClickCapture?: import("react").MouseEventHandler<HTMLInputElement>;
|
168
|
+
onContextMenu?: import("react").MouseEventHandler<HTMLInputElement>;
|
169
|
+
onContextMenuCapture?: import("react").MouseEventHandler<HTMLInputElement>;
|
170
|
+
onDoubleClick?: import("react").MouseEventHandler<HTMLInputElement>;
|
171
|
+
onDoubleClickCapture?: import("react").MouseEventHandler<HTMLInputElement>;
|
172
|
+
onDrag?: import("react").DragEventHandler<HTMLInputElement>;
|
173
|
+
onDragCapture?: import("react").DragEventHandler<HTMLInputElement>;
|
174
|
+
onDragEnd?: import("react").DragEventHandler<HTMLInputElement>;
|
175
|
+
onDragEndCapture?: import("react").DragEventHandler<HTMLInputElement>;
|
176
|
+
onDragEnter?: import("react").DragEventHandler<HTMLInputElement>;
|
177
|
+
onDragEnterCapture?: import("react").DragEventHandler<HTMLInputElement>;
|
178
|
+
onDragExit?: import("react").DragEventHandler<HTMLInputElement>;
|
179
|
+
onDragExitCapture?: import("react").DragEventHandler<HTMLInputElement>;
|
180
|
+
onDragLeave?: import("react").DragEventHandler<HTMLInputElement>;
|
181
|
+
onDragLeaveCapture?: import("react").DragEventHandler<HTMLInputElement>;
|
182
|
+
onDragOver?: import("react").DragEventHandler<HTMLInputElement>;
|
183
|
+
onDragOverCapture?: import("react").DragEventHandler<HTMLInputElement>;
|
184
|
+
onDragStart?: import("react").DragEventHandler<HTMLInputElement>;
|
185
|
+
onDragStartCapture?: import("react").DragEventHandler<HTMLInputElement>;
|
186
|
+
onDrop?: import("react").DragEventHandler<HTMLInputElement>;
|
187
|
+
onDropCapture?: import("react").DragEventHandler<HTMLInputElement>;
|
188
|
+
onMouseDown?: import("react").MouseEventHandler<HTMLInputElement>;
|
189
|
+
onMouseDownCapture?: import("react").MouseEventHandler<HTMLInputElement>;
|
190
|
+
onMouseEnter?: import("react").MouseEventHandler<HTMLInputElement>;
|
191
|
+
onMouseLeave?: import("react").MouseEventHandler<HTMLInputElement>;
|
192
|
+
onMouseMove?: import("react").MouseEventHandler<HTMLInputElement>;
|
193
|
+
onMouseMoveCapture?: import("react").MouseEventHandler<HTMLInputElement>;
|
194
|
+
onMouseOut?: import("react").MouseEventHandler<HTMLInputElement>;
|
195
|
+
onMouseOutCapture?: import("react").MouseEventHandler<HTMLInputElement>;
|
196
|
+
onMouseOver?: import("react").MouseEventHandler<HTMLInputElement>;
|
197
|
+
onMouseOverCapture?: import("react").MouseEventHandler<HTMLInputElement>;
|
198
|
+
onMouseUp?: import("react").MouseEventHandler<HTMLInputElement>;
|
199
|
+
onMouseUpCapture?: import("react").MouseEventHandler<HTMLInputElement>;
|
200
|
+
onSelectCapture?: import("react").ReactEventHandler<HTMLInputElement>;
|
201
|
+
onTouchCancel?: import("react").TouchEventHandler<HTMLInputElement>;
|
202
|
+
onTouchCancelCapture?: import("react").TouchEventHandler<HTMLInputElement>;
|
203
|
+
onTouchEnd?: import("react").TouchEventHandler<HTMLInputElement>;
|
204
|
+
onTouchEndCapture?: import("react").TouchEventHandler<HTMLInputElement>;
|
205
|
+
onTouchMove?: import("react").TouchEventHandler<HTMLInputElement>;
|
206
|
+
onTouchMoveCapture?: import("react").TouchEventHandler<HTMLInputElement>;
|
207
|
+
onTouchStart?: import("react").TouchEventHandler<HTMLInputElement>;
|
208
|
+
onTouchStartCapture?: import("react").TouchEventHandler<HTMLInputElement>;
|
209
|
+
onPointerDown?: import("react").PointerEventHandler<HTMLInputElement>;
|
210
|
+
onPointerDownCapture?: import("react").PointerEventHandler<HTMLInputElement>;
|
211
|
+
onPointerMove?: import("react").PointerEventHandler<HTMLInputElement>;
|
212
|
+
onPointerMoveCapture?: import("react").PointerEventHandler<HTMLInputElement>;
|
213
|
+
onPointerUp?: import("react").PointerEventHandler<HTMLInputElement>;
|
214
|
+
onPointerUpCapture?: import("react").PointerEventHandler<HTMLInputElement>;
|
215
|
+
onPointerCancel?: import("react").PointerEventHandler<HTMLInputElement>;
|
216
|
+
onPointerCancelCapture?: import("react").PointerEventHandler<HTMLInputElement>;
|
217
|
+
onPointerEnter?: import("react").PointerEventHandler<HTMLInputElement>;
|
218
|
+
onPointerLeave?: import("react").PointerEventHandler<HTMLInputElement>;
|
219
|
+
onPointerOver?: import("react").PointerEventHandler<HTMLInputElement>;
|
220
|
+
onPointerOverCapture?: import("react").PointerEventHandler<HTMLInputElement>;
|
221
|
+
onPointerOut?: import("react").PointerEventHandler<HTMLInputElement>;
|
222
|
+
onPointerOutCapture?: import("react").PointerEventHandler<HTMLInputElement>;
|
223
|
+
onGotPointerCapture?: import("react").PointerEventHandler<HTMLInputElement>;
|
224
|
+
onGotPointerCaptureCapture?: import("react").PointerEventHandler<HTMLInputElement>;
|
225
|
+
onLostPointerCapture?: import("react").PointerEventHandler<HTMLInputElement>;
|
226
|
+
onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLInputElement>;
|
227
|
+
onScroll?: import("react").UIEventHandler<HTMLInputElement>;
|
228
|
+
onScrollCapture?: import("react").UIEventHandler<HTMLInputElement>;
|
229
|
+
onWheel?: import("react").WheelEventHandler<HTMLInputElement>;
|
230
|
+
onWheelCapture?: import("react").WheelEventHandler<HTMLInputElement>;
|
231
|
+
onAnimationStart?: import("react").AnimationEventHandler<HTMLInputElement>;
|
232
|
+
onAnimationStartCapture?: import("react").AnimationEventHandler<HTMLInputElement>;
|
233
|
+
onAnimationEnd?: import("react").AnimationEventHandler<HTMLInputElement>;
|
234
|
+
onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLInputElement>;
|
235
|
+
onAnimationIteration?: import("react").AnimationEventHandler<HTMLInputElement>;
|
236
|
+
onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLInputElement>;
|
237
|
+
onTransitionEnd?: import("react").TransitionEventHandler<HTMLInputElement>;
|
238
|
+
onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLInputElement>;
|
239
|
+
defaultChecked?: boolean;
|
240
|
+
suppressContentEditableWarning?: boolean;
|
241
|
+
accessKey?: string;
|
242
|
+
autoFocus?: boolean;
|
243
|
+
contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only";
|
244
|
+
contextMenu?: string;
|
245
|
+
dir?: string;
|
246
|
+
draggable?: boolean | "true" | "false";
|
247
|
+
hidden?: boolean;
|
248
|
+
nonce?: string;
|
249
|
+
slot?: string;
|
250
|
+
spellCheck?: boolean | "true" | "false";
|
251
|
+
translate?: "yes" | "no";
|
252
|
+
radioGroup?: string;
|
253
|
+
about?: string;
|
254
|
+
content?: string;
|
255
|
+
datatype?: string;
|
256
|
+
inlist?: any;
|
257
|
+
property?: string;
|
258
|
+
rel?: string;
|
259
|
+
resource?: string;
|
260
|
+
rev?: string;
|
261
|
+
typeof?: string;
|
262
|
+
vocab?: string;
|
263
|
+
autoCapitalize?: string;
|
264
|
+
autoCorrect?: string;
|
265
|
+
autoSave?: string;
|
266
|
+
itemProp?: string;
|
267
|
+
itemScope?: boolean;
|
268
|
+
itemType?: string;
|
269
|
+
itemID?: string;
|
270
|
+
itemRef?: string;
|
271
|
+
results?: number;
|
272
|
+
security?: string;
|
273
|
+
unselectable?: "on" | "off";
|
274
|
+
inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal";
|
275
|
+
is?: string;
|
276
|
+
form?: string;
|
277
|
+
list?: string;
|
278
|
+
step?: string | number;
|
279
|
+
formAction?: string;
|
280
|
+
formEncType?: string;
|
281
|
+
formMethod?: string;
|
282
|
+
formNoValidate?: boolean;
|
283
|
+
formTarget?: string;
|
284
|
+
accept?: string;
|
285
|
+
alt?: string;
|
286
|
+
autoComplete?: import("react").HTMLInputAutoCompleteAttribute;
|
287
|
+
capture?: boolean | "user" | "environment";
|
288
|
+
checked?: boolean;
|
289
|
+
enterKeyHint?: "search" | "enter" | "done" | "go" | "next" | "previous" | "send";
|
290
|
+
maxLength?: number;
|
291
|
+
minLength?: number;
|
292
|
+
multiple?: boolean;
|
293
|
+
pattern?: string;
|
294
|
+
placeholder?: string;
|
295
|
+
required?: boolean;
|
296
|
+
src?: string;
|
297
|
+
isLoading: boolean;
|
298
|
+
className: string;
|
299
|
+
prefix: import("react/jsx-runtime").JSX.Element;
|
300
|
+
LeftIcon: import("lucide-react").LucideIcon;
|
301
|
+
disabled: boolean;
|
302
|
+
readOnly: boolean;
|
303
|
+
onFocus: import("react").FocusEventHandler<HTMLInputElement>;
|
304
|
+
onBlur: import("react").FocusEventHandler<HTMLInputElement>;
|
305
|
+
title: string;
|
306
|
+
style: import("react").CSSProperties;
|
307
|
+
isSearchable: boolean;
|
308
|
+
iconSize: number;
|
309
|
+
Spinner: import("react/jsx-runtime").JSX.Element;
|
310
|
+
};
|
311
|
+
export { getConfig };
|
312
|
+
//# sourceMappingURL=getConfig.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"getConfig.d.ts","sourceRoot":"","sources":["../../../src/components/Select/getConfig.tsx"],"names":[],"mappings":";;AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAKhD,iBAAS,SAAS,CAAC,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA4CxD;AAED,OAAO,EAAE,SAAS,EAAE,CAAC"}
|
@@ -0,0 +1,30 @@
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
2
|
+
import { Loader2 } from "lucide-react";
|
3
|
+
import { morpheme } from "./utils/morpheme";
|
4
|
+
function getConfig(props, isFocused) {
|
5
|
+
const { isLoading, isError, size = "md", className: baseClassName = "", variant = "solid", prefix: basePrefix, leftIcon: LeftIcon, disabled, readOnly, onFocus, onBlur, title, style, isSearchable = false, ...rest } = props;
|
6
|
+
const hasPrefix = !!basePrefix ? "hasPrefix" : "";
|
7
|
+
const errored = isError ? "errored" : "";
|
8
|
+
const opacity = disabled || readOnly || isLoading ? "opacity" : "";
|
9
|
+
const focused = isFocused ? "focused" : "";
|
10
|
+
const className = `arkyn_select ${hasPrefix} ${variant} ${size} ${opacity} ${errored} ${focused} ${baseClassName}`;
|
11
|
+
const iconSizes = { md: 20, lg: 20 };
|
12
|
+
const iconSize = iconSizes[size];
|
13
|
+
return {
|
14
|
+
isLoading,
|
15
|
+
className,
|
16
|
+
prefix: morpheme(basePrefix, iconSize, "prefix"),
|
17
|
+
LeftIcon,
|
18
|
+
disabled,
|
19
|
+
readOnly,
|
20
|
+
onFocus,
|
21
|
+
onBlur,
|
22
|
+
title,
|
23
|
+
style,
|
24
|
+
isSearchable,
|
25
|
+
iconSize: iconSize,
|
26
|
+
Spinner: _jsx(Loader2, { className: "spinner", size: iconSize, strokeWidth: 2.5 }),
|
27
|
+
...rest,
|
28
|
+
};
|
29
|
+
}
|
30
|
+
export { getConfig };
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAShD,OAAO,cAAc,CAAC;AAEtB,iBAAS,MAAM,CAAC,KAAK,EAAE,WAAW,2CA+IjC;AAED,OAAO,EAAE,MAAM,EAAE,CAAC"}
|
@@ -0,0 +1,71 @@
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
2
|
+
import { Check, ChevronDown } from "lucide-react";
|
3
|
+
import { useRef, useState } from "react";
|
4
|
+
import { useFormController } from "../Form/FormController";
|
5
|
+
import { getConfig } from "./getConfig";
|
6
|
+
import "./styles.css";
|
7
|
+
function Select(props) {
|
8
|
+
const [isFocused, setIsFocused] = useState(false);
|
9
|
+
const { inputRef, id, error } = useFormController();
|
10
|
+
const baseRef = useRef(null);
|
11
|
+
const ref = inputRef || baseRef;
|
12
|
+
const isError = props.isError || !!error;
|
13
|
+
const { disabled, title, style, className, prefix, iconSize, isLoading, LeftIcon, value: baseValue = null, defaultValue = "", readOnly, onFocus, onBlur, Spinner, name, isSearchable, placeholder, onSelect, options, ...rest } = getConfig({ ...props, id, isError }, isFocused);
|
14
|
+
const [selectedValue, setSelectedValue] = useState(defaultValue);
|
15
|
+
const [searchValue, setSearchValue] = useState("");
|
16
|
+
function handleSectionClick() {
|
17
|
+
if (disabled || !ref?.current)
|
18
|
+
return;
|
19
|
+
setIsFocused(true);
|
20
|
+
ref.current.focus();
|
21
|
+
}
|
22
|
+
function handleFocus(e) {
|
23
|
+
setIsFocused(true);
|
24
|
+
if (onFocus)
|
25
|
+
onFocus(e);
|
26
|
+
}
|
27
|
+
function handleBlur() {
|
28
|
+
setIsFocused(false);
|
29
|
+
if (onBlur && ref.current) {
|
30
|
+
ref.current.blur();
|
31
|
+
}
|
32
|
+
}
|
33
|
+
const currentValue = typeof baseValue === "string" ? baseValue : selectedValue;
|
34
|
+
const currentLabel = options.find((option) => option.value === currentValue)?.label || "";
|
35
|
+
const placeholderDark = () => {
|
36
|
+
if (isSearchable) {
|
37
|
+
if (!isFocused && !!currentLabel)
|
38
|
+
return true;
|
39
|
+
if (!isFocused && !currentLabel)
|
40
|
+
return false;
|
41
|
+
if (isFocused)
|
42
|
+
return false;
|
43
|
+
}
|
44
|
+
if (!isSearchable) {
|
45
|
+
if (!isFocused && !!currentLabel)
|
46
|
+
return true;
|
47
|
+
if (!isFocused && !currentLabel)
|
48
|
+
return false;
|
49
|
+
if (isFocused && !!currentLabel)
|
50
|
+
return true;
|
51
|
+
if (isFocused && !currentLabel)
|
52
|
+
return false;
|
53
|
+
}
|
54
|
+
};
|
55
|
+
const filteredOptions = options.filter((option) => {
|
56
|
+
if (isSearchable) {
|
57
|
+
return option.label.toLowerCase().includes(searchValue.toLowerCase());
|
58
|
+
}
|
59
|
+
else {
|
60
|
+
return true;
|
61
|
+
}
|
62
|
+
});
|
63
|
+
return (_jsxs(_Fragment, { children: [_jsxs("section", { title: title, style: style, onClick: handleSectionClick, className: `${className} placeholder_dark_${placeholderDark()}`, children: [prefix, LeftIcon && _jsx(LeftIcon, { size: iconSize, strokeWidth: 2.5 }), _jsx("input", { disabled: disabled || isLoading, readOnly: !isSearchable, value: searchValue || "", placeholder: currentLabel || placeholder, ref: ref, onFocus: handleFocus, onBlur: () => setSearchValue(""), ...rest, onChange: (e) => setSearchValue(e.target.value) }), _jsx("input", { type: "hidden", name: name, value: currentValue || "", readOnly: true }), isFocused && (_jsxs("ul", { className: "arkyn_select_content", children: [filteredOptions.map(({ label, value }) => (_jsxs("li", { className: currentValue === value ? "active" : "", onClick: () => {
|
64
|
+
if (selectedValue !== value)
|
65
|
+
setSelectedValue(value);
|
66
|
+
else
|
67
|
+
setSelectedValue("");
|
68
|
+
onSelect && onSelect({ label, value });
|
69
|
+
}, children: [label, " ", _jsx(Check, {})] }, value))), filteredOptions.length <= 0 && _jsx("p", { children: "Sem op\u00E7\u00F5es dispon\u00EDveis" })] })), !isLoading && (_jsx(ChevronDown, { className: "arkyn_select_arrow", size: iconSize, strokeWidth: 2.5 })), isLoading && Spinner] }), isFocused && (_jsx("aside", { className: "arkyn_select_overlay", onClick: handleBlur }))] }));
|
70
|
+
}
|
71
|
+
export { Select };
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"morpheme.d.ts","sourceRoot":"","sources":["../../../../src/components/Select/utils/morpheme.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C,iBAAS,QAAQ,CACf,IAAI,EAAE,UAAU,GAAG,MAAM,GAAG,SAAS,EACrC,QAAQ,EAAE,MAAM,EAChB,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,2CAW1B;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
|
@@ -0,0 +1,10 @@
|
|
1
|
+
import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
|
2
|
+
function morpheme(data, iconSize, type) {
|
3
|
+
if (!data)
|
4
|
+
return _jsx(_Fragment, {});
|
5
|
+
if (typeof data === "string")
|
6
|
+
return _jsx("p", { className: type, children: data });
|
7
|
+
const Data = data;
|
8
|
+
return (_jsx("p", { className: type, children: _jsx(Data, { color: "var(--secondary-600)", size: iconSize, strokeWidth: 2.5 }) }));
|
9
|
+
}
|
10
|
+
export { morpheme };
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Skeleton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Skeleton/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAC7C,OAAO,cAAc,CAAC;AAEtB,iBAAS,QAAQ,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,GAAG,IAAI,EAAE,EAAE,aAAa,2CAGrE;AAED,OAAO,EAAE,QAAQ,EAAE,CAAC"}
|
package/dist/index.d.ts
CHANGED
@@ -2,9 +2,11 @@ export { Badge } from "./components/Badge";
|
|
2
2
|
export { Divider } from "./components/Divider";
|
3
3
|
export { Skeleton } from "./components/Skeleton";
|
4
4
|
export { Button } from "./components/Button";
|
5
|
+
export { Checkbox } from "./components/Checkbox";
|
5
6
|
export { FormController, FormError, FormLabel } from "./components/Form";
|
6
7
|
export { IconButton } from "./components/IconButton";
|
7
8
|
export { Input } from "./components/Input";
|
9
|
+
export { Select } from "./components/Select";
|
8
10
|
export { Breadcrumb, BreadcrumbLink } from "./components/Breadcrumb";
|
9
11
|
export { Modal } from "./components/Modal";
|
10
12
|
export { Tooltip } from "./components/Tooltip";
|
package/dist/index.d.ts.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAGjD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACzE,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAGjD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACzE,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAG7C,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAGrE,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAC;AAC3C,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAG/C,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC"}
|
package/dist/index.js
CHANGED
@@ -4,9 +4,11 @@ export { Divider } from "./components/Divider";
|
|
4
4
|
export { Skeleton } from "./components/Skeleton";
|
5
5
|
// Form
|
6
6
|
export { Button } from "./components/Button";
|
7
|
+
export { Checkbox } from "./components/Checkbox";
|
7
8
|
export { FormController, FormError, FormLabel } from "./components/Form";
|
8
9
|
export { IconButton } from "./components/IconButton";
|
9
10
|
export { Input } from "./components/Input";
|
11
|
+
export { Select } from "./components/Select";
|
10
12
|
// Navigation
|
11
13
|
export { Breadcrumb, BreadcrumbLink } from "./components/Breadcrumb";
|
12
14
|
// Overlay
|
package/dist/style.css
CHANGED
@@ -1 +1 @@
|
|
1
|
-
.arkyn_badge{display:flex;align-items:center;justify-content:center;gap:4px;border:1px solid transparent}.arkyn_badge.solid{color:#fff}.arkyn_badge.solid.primary{background-color:var(--primary-500)}.arkyn_badge.solid.secondary{background-color:var(--secondary-500)}.arkyn_badge.solid.danger{background-color:var(--danger-600)}.arkyn_badge.solid.success{background-color:var(--success-500)}.arkyn_badge.solid.warning{background-color:var(--warning-600)}.arkyn_badge.solid.info{background-color:var(--info-500)}.arkyn_badge.outline.primary{color:var(--primary-500);border-color:var(--primary-500)}.arkyn_badge.outline.secondary{color:var(--secondary-500);border-color:var(--secondary-500)}.arkyn_badge.outline.danger{color:var(--danger-600);border-color:var(--danger-600)}.arkyn_badge.outline.success{color:var(--success-500);border-color:var(--success-500)}.arkyn_badge.outline.warning{color:var(--warning-600);border-color:var(--warning-600)}.arkyn_badge.outline.info{color:var(--info-600);border-color:var(--info-600)}.arkyn_badge.ghost.primary{color:var(--primary-500);background-color:var(--primary-100)}.arkyn_badge.ghost.secondary{color:var(--secondary-500);background-color:var(--secondary-100)}.arkyn_badge.ghost.danger{color:var(--danger-600);background-color:var(--danger-100)}.arkyn_badge.ghost.success{color:var(--success-500);background-color:var(--success-100)}.arkyn_badge.ghost.warning{color:var(--warning-600);background-color:var(--warning-100)}.arkyn_badge.ghost.info{color:var(--info-600);background-color:var(--info-100)}.arkyn_badge.lg{font-weight:400;font-size:12px;line-height:12px;border-radius:4px;padding:0 16px;height:24px}.arkyn_badge.md{font-weight:400;font-size:10px;line-height:10px;border-radius:4px;padding:0 12px;height:20px}.arkyn_divider{display:block;flex:1;background-color:var(--secondary-300)}.arkyn_divider.horizontal{width:100%;min-height:1px;max-height:1px}.arkyn_divider.vertical{height:100%;min-width:1px;max-width:1px}.arkyn_button{background:transparent;border:1px solid transparent;outline:1px solid transparent;position:relative;transition:.15s all ease-out}.arkyn_button:hover{cursor:pointer}.arkyn_button:disabled{cursor:not-allowed;opacity:.5}.arkyn_button .content{display:flex;align-items:center;justify-content:center;white-space:nowrap}.arkyn_button.solid{color:#fff}.arkyn_button.solid:disabled{opacity:.4}.arkyn_button.solid.primary{background-color:var(--primary-500)}.arkyn_button.solid.primary:hover{background-color:var(--primary-400)}.arkyn_button.solid.primary:disabled{background-color:var(--primary-400)}.arkyn_button.solid.danger{background-color:var(--danger-600)}.arkyn_button.solid.danger:hover{background-color:var(--danger-500)}.arkyn_button.solid.danger:disabled{background-color:var(--danger-500)}.arkyn_button.solid.success{background-color:var(--success-500)}.arkyn_button.solid.success:hover{background-color:var(--success-400)}.arkyn_button.solid.success:disabled{background-color:var(--success-400)}.arkyn_button.solid.warning{background-color:var(--warning-600)}.arkyn_button.solid.warning:hover{background-color:var(--warning-500)}.arkyn_button.solid.warning:disabled{background-color:var(--warning-500)}.arkyn_button.outline{border-color:var(--secondary-300)}.arkyn_button.outline:hover{border-color:var(--secondary-200)}.arkyn_button.outline:disabled{border-color:var(--secondary-200)}.arkyn_button.outline.primary{color:var(--primary-500)}.arkyn_button.outline.primary:hover{color:var(--primary-400)}.arkyn_button.outline.primary:disabled{color:var(--primary-400)}.arkyn_button.outline.danger{color:var(--danger-600)}.arkyn_button.outline.danger:hover{color:var(--danger-500)}.arkyn_button.outline.danger:disabled{color:var(--danger-500)}.arkyn_button.outline.success{color:var(--success-500)}.arkyn_button.outline.success:hover{color:var(--success-400)}.arkyn_button.outline.success:disabled{color:var(--success-400)}.arkyn_button.outline.warning{color:var(--warning-600)}.arkyn_button.outline.warning:hover{color:var(--warning-500)}.arkyn_button.outline.warning:disabled{color:var(--warning-500)}.arkyn_button.ghost:disabled{opacity:.4}.arkyn_button.ghost.primary{color:var(--primary-500);background-color:var(--primary-100)}.arkyn_button.ghost.primary:hover{color:var(--primary-400);background-color:var(--primary-50)}.arkyn_button.ghost.primary:disabled{color:var(--primary-400);background-color:var(--primary-50)}.arkyn_button.ghost.danger{color:var(--danger-600);background-color:var(--danger-100)}.arkyn_button.ghost.danger:hover{color:var(--danger-500);background-color:var(--danger-50)}.arkyn_button.ghost.danger:disabled{color:var(--danger-500);background-color:var(--danger-50)}.arkyn_button.ghost.success{color:var(--success-500);background-color:var(--success-100)}.arkyn_button.ghost.success:hover{color:var(--success-400);background-color:var(--success-50)}.arkyn_button.ghost.success:disabled{color:var(--success-400);background-color:var(--success-50)}.arkyn_button.ghost.warning{color:var(--warning-600);background-color:var(--warning-100)}.arkyn_button.ghost.warning:hover{color:var(--warning-500);background-color:var(--warning-50)}.arkyn_button.ghost.warning:disabled{color:var(--warning-500);background-color:var(--warning-50)}.arkyn_button.invisible:disabled{opacity:.4}.arkyn_button.invisible.primary{color:var(--primary-500)}.arkyn_button.invisible.primary:hover{color:var(--primary-400)}.arkyn_button.invisible.primary:disabled{color:var(--primary-400)}.arkyn_button.invisible.danger{color:var(--danger-600)}.arkyn_button.invisible.danger:hover{color:var(--danger-500)}.arkyn_button.invisible.danger:disabled{color:var(--danger-500)}.arkyn_button.invisible.success{color:var(--success-500)}.arkyn_button.invisible.success:hover{color:var(--success-400)}.arkyn_button.invisible.success:disabled{color:var(--success-400)}.arkyn_button.invisible.warning{color:var(--warning-600)}.arkyn_button.invisible.warning:hover{color:var(--warning-500)}.arkyn_button.invisible.warning:disabled{color:var(--warning-500)}.arkyn_button.lg{font-weight:600;font-size:14px;line-height:14px;border-radius:6px;padding:0 20px;height:44px}.arkyn_button.lg .content,.arkyn_button.lg .spinner{gap:16px}.arkyn_button.md{font-weight:600;font-size:14px;line-height:14px;border-radius:6px;gap:16px;padding:0 16px;height:40px}.arkyn_button.md .content,.arkyn_button.md .spinner{gap:14px}.arkyn_button.sm{font-weight:600;font-size:12px;line-height:12px;border-radius:6px;padding:0 16px;height:32px}.arkyn_button.sm .content,.arkyn_button.sm .spinner{gap:12px}.arkyn_button.xs{font-weight:600;font-size:10px;line-height:10px;border-radius:4px;padding:0 16px;height:24px}.arkyn_button.xs .content,.arkyn_button.xs .spinner{gap:8px}.arkyn_button .spinner{display:flex;align-items:center;justify-content:center;white-space:nowrap;opacity:0}.arkyn_button .spinner>svg{animation:spin 2s linear infinite}.arkyn_button.loading_text_false .spinner{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}.arkyn_button.loading_text_true .spinner{max-height:0px}.arkyn_button.loading_true .content{opacity:0;max-height:0px}.arkyn_button.loading_true .spinner{opacity:1;max-height:unset}.arkyn_form_controller{display:flex;flex-direction:column;gap:6px}.arkyn_form_error{font-size:12px;line-height:12px;font-weight:600;color:var(--danger-600)}.arkyn_form_label{color:var(--secondary-700);font-size:14px;font-weight:600;line-height:19.07px}.arkyn_form_label.show-asterisk:before{content:"* ";font-size:12px;font-weight:600;line-height:16.34px;text-align:left;color:var(--danger-600)}.arkyn_icon_button{background:transparent;border:1px solid transparent;outline:1px solid transparent;position:relative;transition:.15s all ease-out}.arkyn_icon_button:hover{cursor:pointer}.arkyn_icon_button:disabled{cursor:not-allowed;opacity:.5}.arkyn_icon_button .content{display:flex;align-items:center;justify-content:center}.arkyn_icon_button.solid{color:#fff}.arkyn_icon_button.solid:disabled{opacity:.4}.arkyn_icon_button.solid.primary{background-color:var(--primary-500)}.arkyn_icon_button.solid.primary:hover{background-color:var(--primary-400)}.arkyn_icon_button.solid.primary:disabled{background-color:var(--primary-400)}.arkyn_icon_button.solid.danger{background-color:var(--danger-600)}.arkyn_icon_button.solid.danger:hover{background-color:var(--danger-500)}.arkyn_icon_button.solid.danger:disabled{background-color:var(--danger-500)}.arkyn_icon_button.solid.success{background-color:var(--success-500)}.arkyn_icon_button.solid.success:hover{background-color:var(--success-400)}.arkyn_icon_button.solid.success:disabled{background-color:var(--success-400)}.arkyn_icon_button.solid.warning{background-color:var(--warning-600)}.arkyn_icon_button.solid.warning:hover{background-color:var(--warning-500)}.arkyn_icon_button.solid.warning:disabled{background-color:var(--warning-500)}.arkyn_icon_button.outline{border-color:var(--secondary-300)}.arkyn_icon_button.outline:hover{border-color:var(--secondary-200)}.arkyn_icon_button.outline:disabled{border-color:var(--secondary-200)}.arkyn_icon_button.outline.primary{color:var(--primary-500)}.arkyn_icon_button.outline.primary:hover{color:var(--primary-400)}.arkyn_icon_button.outline.primary:disabled{color:var(--primary-400)}.arkyn_icon_button.outline.danger{color:var(--danger-600)}.arkyn_icon_button.outline.danger:hover{color:var(--danger-500)}.arkyn_icon_button.outline.danger:disabled{color:var(--danger-500)}.arkyn_icon_button.outline.success{color:var(--success-500)}.arkyn_icon_button.outline.success:hover{color:var(--success-400)}.arkyn_icon_button.outline.success:disabled{color:var(--success-400)}.arkyn_icon_button.outline.warning{color:var(--warning-600)}.arkyn_icon_button.outline.warning:hover{color:var(--warning-500)}.arkyn_icon_button.outline.warning:disabled{color:var(--warning-500)}.arkyn_icon_button.ghost:disabled{opacity:.4}.arkyn_icon_button.ghost.primary{color:var(--primary-500);background-color:var(--primary-100)}.arkyn_icon_button.ghost.primary:hover{color:var(--primary-400);background-color:var(--primary-50)}.arkyn_icon_button.ghost.primary:disabled{color:var(--primary-400);background-color:var(--primary-50)}.arkyn_icon_button.ghost.danger{color:var(--danger-600);background-color:var(--danger-100)}.arkyn_icon_button.ghost.danger:hover{color:var(--danger-500);background-color:var(--danger-50)}.arkyn_icon_button.ghost.danger:disabled{color:var(--danger-500);background-color:var(--danger-50)}.arkyn_icon_button.ghost.success{color:var(--success-500);background-color:var(--success-100)}.arkyn_icon_button.ghost.success:hover{color:var(--success-400);background-color:var(--success-50)}.arkyn_icon_button.ghost.success:disabled{color:var(--success-400);background-color:var(--success-50)}.arkyn_icon_button.ghost.warning{color:var(--warning-600);background-color:var(--warning-100)}.arkyn_icon_button.ghost.warning:hover{color:var(--warning-500);background-color:var(--warning-50)}.arkyn_icon_button.ghost.warning:disabled{color:var(--warning-500);background-color:var(--warning-50)}.arkyn_icon_button.invisible:disabled{opacity:.4}.arkyn_icon_button.invisible.primary{color:var(--primary-500)}.arkyn_icon_button.invisible.primary:hover{color:var(--primary-400)}.arkyn_icon_button.invisible.primary:disabled{color:var(--primary-400)}.arkyn_icon_button.invisible.danger{color:var(--danger-600)}.arkyn_icon_button.invisible.danger:hover{color:var(--danger-500)}.arkyn_icon_button.invisible.danger:disabled{color:var(--danger-500)}.arkyn_icon_button.invisible.success{color:var(--success-500)}.arkyn_icon_button.invisible.success:hover{color:var(--success-400)}.arkyn_icon_button.invisible.success:disabled{color:var(--success-400)}.arkyn_icon_button.invisible.warning{color:var(--warning-600)}.arkyn_icon_button.invisible.warning:hover{color:var(--warning-500)}.arkyn_icon_button.invisible.warning:disabled{color:var(--warning-500)}.arkyn_icon_button.lg{border-radius:6px;height:44px;width:44px}.arkyn_icon_button.md{border-radius:6px;height:40px;width:40px}.arkyn_icon_button.sm{border-radius:6px;height:32px;width:32px}.arkyn_icon_button.xs{border-radius:4px;height:24px;width:24px}.arkyn_icon_button .spinner{display:flex;align-items:center;justify-content:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);opacity:0}.arkyn_icon_button .spinner svg{animation:spin 2s linear infinite}.arkyn_icon_button.loading_true .content{opacity:0}.arkyn_icon_button.loading_true .spinner{opacity:1}.arkyn_input{flex:1;position:relative;display:flex;align-items:center;padding:0 16px;gap:8px;border-radius:6px;border:1px solid transparent;outline:1px solid transparent}.arkyn_input:hover{cursor:text}.arkyn_input input{border:none;outline:none;background:transparent;width:100%}.arkyn_input input{color:var(--secondary-900)}.arkyn_input .prefix,.arkyn_input .sufix{color:var(--secondary-600);background:var(--secondary-200);font-weight:400;display:flex;align-items:center;justify-content:center;position:absolute}.arkyn_input .prefix{left:0;top:0;bottom:0;border-radius:5px 0 0 5px;border-right:1px solid var(--secondary-300)}.arkyn_input .sufix{right:0;top:0;bottom:0;border-radius:0 5px 5px 0;border-left:1px solid var(--secondary-300)}.arkyn_input input::placeholder{color:var(--secondary-400)}.arkyn_input svg{color:var(--secondary-400)}.arkyn_input.errored svg{color:var(--danger-600)}.arkyn_input:not(.opacity).focused svg{color:var(--primary-500)}.arkyn_input.opacity{opacity:.5}.arkyn_input.solid{border-color:var(--secondary-300);background-color:var(--secondary-50)}.arkyn_input.solid.errored{border-color:var(--danger-600);outline-color:var(--danger-600)}.arkyn_input:not(.opacity).solid.focused{border-color:var(--primary-500);outline-color:var(--primary-500)}.arkyn_input.outline{border-color:var(--secondary-300)}.arkyn_input.outline.errored{border-color:var(--danger-600);outline-color:var(--danger-600)}.arkyn_input:not(.opacity).outline.focused{border-color:var(--primary-500);outline-color:var(--primary-500)}.arkyn_input.underline{border-radius:0;border-top:none;border-left:none;border-right:none;outline:none;border-color:var(--secondary-300)}.arkyn_input.underline .sufix,.arkyn_input.underline .prefix{display:none}.arkyn_input.underline:before{content:" ";position:absolute;height:1px;left:0;right:0;bottom:-2px;background:transparent}.arkyn_input.underline.errored{border-color:var(--danger-600)}.arkyn_input.underline.errored:before{background:var(--danger-600)}.arkyn_input:not(.opacity).underline.focused{border-color:var(--primary-500)}.arkyn_input:not(.opacity).underline.focused:before{background:var(--primary-500)}.arkyn_input.md input{min-height:40px;max-height:40px;font-size:14px;line-height:14px;font-weight:400}.arkyn_input.md input::placeholder{font-weight:400;font-size:14px;line-height:14px}.arkyn_input.md.hasPrefix{padding-left:60px}.arkyn_input.md.hasSufix{padding-right:60px}.arkyn_input.md .prefix,.arkyn_input.md .sufix{height:40px;width:44px;font-size:14px}.arkyn_input.lg input{min-height:44px;max-height:44px;line-height:16px;font-size:16px;font-weight:400}.arkyn_input.lg input::placeholder{font-weight:400;font-size:16px;line-height:16px}.arkyn_input.lg .prefix,.arkyn_input.lg .sufix{height:44px;width:48px;font-size:16px}.arkyn_input.lg.hasPrefix{padding-left:64px}.arkyn_input.lg.hasSufix{padding-right:64px}.arkyn_input .spinner{animation:spin 2s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.arkyn_breadcrumb{display:flex;align-items:center;justify-content:start;flex-wrap:wrap;gap:4px}.arkyn_breadcrumb_link{-webkit-user-select:none;user-select:none;text-decoration:none;font-size:14px;color:var(--secondary-500)}.arkyn_breadcrumb_link.active{color:var(--secondary-900)}.arkyn_breadcrumb_link.inactive:hover{cursor:pointer;color:var(--secondary-900)}.arkyn_breadcrumb_link:first-child>svg{display:none}.arkyn_breadcrumb_link:not(:first-child){display:flex;align-items:center;gap:4px}.arkyn_breadcrumb_link:not(:first-child)>svg{display:unset;color:var(--secondary-400)}.arkyn_modal_container{position:fixed;top:0;left:0;right:0;bottom:0;display:flex;align-items:start;justify-content:center;padding:10vh 0;padding-bottom:2rem;overflow:auto}.arkyn_modal_container>.overlay{position:fixed;z-index:9997;top:0;left:0;right:0;bottom:0;background:#00000080}.arkyn_modal_container>.overlay:hover{cursor:pointer}.arkyn_modal_container>.content{z-index:9999;border-radius:6px;background:var(--secondary-50)}.arkyn_modal_footer{display:flex;align-items:center;gap:16px;padding:16px;border-top:1px solid var(--secondary-200)}.arkyn_modal_footer.left{justify-content:flex-start}.arkyn_modal_footer.right{justify-content:flex-end}.arkyn_modal_footer.center{justify-content:center}.arkyn_modal_footer.between{justify-content:space-between}.arkyn_modal_footer.around{justify-content:space-around}.arkyn_modal_header{display:flex;align-items:center;justify-content:space-between;height:56px;padding:16px;font-size:16px;font-weight:600;line-height:20px;color:var(--secondary-900);border-bottom:1px solid var(--secondary-200)}.arkyn_modal_header>button{display:flex;align-items:center;justify-content:center;padding:2px;border-radius:4px;border:none;background:none;color:var(--secondary-400);transition:all .15s ease-out}.arkyn_modal_header>button:hover{cursor:pointer;background-color:var(--secondary-100)}.arkyn_tooltip{position:relative;display:block}.arkyn_tooltip .arkyn_tooltip_text{visibility:hidden;opacity:0;position:absolute;transform:translate(-50%,-50%);white-space:nowrap;transition:.15s all ease-out;border-radius:4px;display:flex;align-items:center;justify-content:center;font-weight:400;color:var(--secondary-100);background-color:var(--secondary-900);z-index:9999}.arkyn_tooltip.lg .arkyn_tooltip_text{font-size:14px;line-height:14px;padding:8px 12px}.arkyn_tooltip.md .arkyn_tooltip_text{font-size:12px;line-height:12px;padding:8px 12px}.arkyn_tooltip:hover .arkyn_tooltip_text{opacity:1;visibility:visible}.arkyn_tooltip.top .arkyn_tooltip_text{bottom:calc(100% + 10px);left:50%;transform:translate(-50%)}.arkyn_tooltip.top .arkyn_tooltip_text:before{content:"";top:100%;border-style:solid;border-color:var(--secondary-900) transparent;border-width:6px 6px 0 6px;bottom:20px;position:absolute;left:50%;transform:translate(-50%)}.arkyn_tooltip.left .arkyn_tooltip_text{top:50%;right:calc(100% + 10px);transform:translateY(-50%)}.arkyn_tooltip.left .arkyn_tooltip_text:before{content:"";top:50%;border-style:solid;border-color:transparent var(--secondary-900);border-width:6px 0 6px 6px;left:100%;position:absolute;transform:translateY(-50%)}.arkyn_tooltip.right .arkyn_tooltip_text{top:50%;left:calc(100% + 10px);transform:translateY(-50%)}.arkyn_tooltip.right .arkyn_tooltip_text:before{content:"";border-style:solid;border-color:transparent var(--secondary-900);border-width:6px 6px 6px 0;top:50%;left:0;transform:translate(-100%,-50%);position:absolute}.arkyn_tooltip.bottom .arkyn_tooltip_text{top:calc(100% + 10px);left:50%;transform:translate(-50%)}.arkyn_tooltip.bottom .arkyn_tooltip_text:before{content:"";border-style:solid;border-color:var(--secondary-900) transparent;border-width:0 6px 6px 6px;top:0;left:50%;transform:translate(-50%,-100%);position:absolute}
|
1
|
+
.arkyn_badge{display:flex;align-items:center;justify-content:center;gap:4px;border:1px solid transparent}.arkyn_badge.solid{color:#fff}.arkyn_badge.solid.primary{background-color:var(--primary-500)}.arkyn_badge.solid.secondary{background-color:var(--secondary-500)}.arkyn_badge.solid.danger{background-color:var(--danger-600)}.arkyn_badge.solid.success{background-color:var(--success-500)}.arkyn_badge.solid.warning{background-color:var(--warning-600)}.arkyn_badge.solid.info{background-color:var(--info-500)}.arkyn_badge.outline.primary{color:var(--primary-500);border-color:var(--primary-500)}.arkyn_badge.outline.secondary{color:var(--secondary-500);border-color:var(--secondary-500)}.arkyn_badge.outline.danger{color:var(--danger-600);border-color:var(--danger-600)}.arkyn_badge.outline.success{color:var(--success-500);border-color:var(--success-500)}.arkyn_badge.outline.warning{color:var(--warning-600);border-color:var(--warning-600)}.arkyn_badge.outline.info{color:var(--info-600);border-color:var(--info-600)}.arkyn_badge.ghost.primary{color:var(--primary-500);background-color:var(--primary-100)}.arkyn_badge.ghost.secondary{color:var(--secondary-500);background-color:var(--secondary-100)}.arkyn_badge.ghost.danger{color:var(--danger-600);background-color:var(--danger-100)}.arkyn_badge.ghost.success{color:var(--success-500);background-color:var(--success-100)}.arkyn_badge.ghost.warning{color:var(--warning-600);background-color:var(--warning-100)}.arkyn_badge.ghost.info{color:var(--info-600);background-color:var(--info-100)}.arkyn_badge.lg{font-weight:400;font-size:12px;line-height:12px;border-radius:4px;padding:0 16px;height:24px}.arkyn_badge.md{font-weight:400;font-size:10px;line-height:10px;border-radius:4px;padding:0 12px;height:20px}.arkyn_divider{display:block;flex:1;background-color:var(--secondary-300)}.arkyn_divider.horizontal{width:100%;min-height:1px;max-height:1px}.arkyn_divider.vertical{height:100%;min-width:1px;max-width:1px}.arkyn_skeleton{width:100%;height:100%;border-radius:6px;background:linear-gradient(to right,#f0f0f0 4%,#e0e0e0 25%,#f0f0f0 36%);background-size:40rem 100%;animation:shimmer 1.5s infinite linear}@keyframes shimmer{0%{background-position:-40rem 0}to{background-position:40rem 0}}.arkyn_button{background:transparent;border:1px solid transparent;outline:1px solid transparent;position:relative;transition:.15s all ease-out}.arkyn_button:hover{cursor:pointer}.arkyn_button:disabled{cursor:not-allowed;opacity:.5}.arkyn_button .content{display:flex;align-items:center;justify-content:center;white-space:nowrap}.arkyn_button.solid{color:#fff}.arkyn_button.solid:disabled{opacity:.4}.arkyn_button.solid.primary{background-color:var(--primary-500)}.arkyn_button.solid.primary:hover{background-color:var(--primary-400)}.arkyn_button.solid.primary:disabled{background-color:var(--primary-400)}.arkyn_button.solid.danger{background-color:var(--danger-600)}.arkyn_button.solid.danger:hover{background-color:var(--danger-500)}.arkyn_button.solid.danger:disabled{background-color:var(--danger-500)}.arkyn_button.solid.success{background-color:var(--success-500)}.arkyn_button.solid.success:hover{background-color:var(--success-400)}.arkyn_button.solid.success:disabled{background-color:var(--success-400)}.arkyn_button.solid.warning{background-color:var(--warning-600)}.arkyn_button.solid.warning:hover{background-color:var(--warning-500)}.arkyn_button.solid.warning:disabled{background-color:var(--warning-500)}.arkyn_button.outline{border-color:var(--secondary-300)}.arkyn_button.outline:hover{border-color:var(--secondary-200)}.arkyn_button.outline:disabled{border-color:var(--secondary-200)}.arkyn_button.outline.primary{color:var(--primary-500)}.arkyn_button.outline.primary:hover{color:var(--primary-400)}.arkyn_button.outline.primary:disabled{color:var(--primary-400)}.arkyn_button.outline.danger{color:var(--danger-600)}.arkyn_button.outline.danger:hover{color:var(--danger-500)}.arkyn_button.outline.danger:disabled{color:var(--danger-500)}.arkyn_button.outline.success{color:var(--success-500)}.arkyn_button.outline.success:hover{color:var(--success-400)}.arkyn_button.outline.success:disabled{color:var(--success-400)}.arkyn_button.outline.warning{color:var(--warning-600)}.arkyn_button.outline.warning:hover{color:var(--warning-500)}.arkyn_button.outline.warning:disabled{color:var(--warning-500)}.arkyn_button.ghost:disabled{opacity:.4}.arkyn_button.ghost.primary{color:var(--primary-500);background-color:var(--primary-100)}.arkyn_button.ghost.primary:hover{color:var(--primary-400);background-color:var(--primary-50)}.arkyn_button.ghost.primary:disabled{color:var(--primary-400);background-color:var(--primary-50)}.arkyn_button.ghost.danger{color:var(--danger-600);background-color:var(--danger-100)}.arkyn_button.ghost.danger:hover{color:var(--danger-500);background-color:var(--danger-50)}.arkyn_button.ghost.danger:disabled{color:var(--danger-500);background-color:var(--danger-50)}.arkyn_button.ghost.success{color:var(--success-500);background-color:var(--success-100)}.arkyn_button.ghost.success:hover{color:var(--success-400);background-color:var(--success-50)}.arkyn_button.ghost.success:disabled{color:var(--success-400);background-color:var(--success-50)}.arkyn_button.ghost.warning{color:var(--warning-600);background-color:var(--warning-100)}.arkyn_button.ghost.warning:hover{color:var(--warning-500);background-color:var(--warning-50)}.arkyn_button.ghost.warning:disabled{color:var(--warning-500);background-color:var(--warning-50)}.arkyn_button.invisible:disabled{opacity:.4}.arkyn_button.invisible.primary{color:var(--primary-500)}.arkyn_button.invisible.primary:hover{color:var(--primary-400)}.arkyn_button.invisible.primary:disabled{color:var(--primary-400)}.arkyn_button.invisible.danger{color:var(--danger-600)}.arkyn_button.invisible.danger:hover{color:var(--danger-500)}.arkyn_button.invisible.danger:disabled{color:var(--danger-500)}.arkyn_button.invisible.success{color:var(--success-500)}.arkyn_button.invisible.success:hover{color:var(--success-400)}.arkyn_button.invisible.success:disabled{color:var(--success-400)}.arkyn_button.invisible.warning{color:var(--warning-600)}.arkyn_button.invisible.warning:hover{color:var(--warning-500)}.arkyn_button.invisible.warning:disabled{color:var(--warning-500)}.arkyn_button.lg{font-weight:600;font-size:14px;line-height:14px;border-radius:6px;padding:0 20px;height:44px}.arkyn_button.lg .content,.arkyn_button.lg .spinner{gap:16px}.arkyn_button.md{font-weight:600;font-size:14px;line-height:14px;border-radius:6px;gap:16px;padding:0 16px;height:40px}.arkyn_button.md .content,.arkyn_button.md .spinner{gap:14px}.arkyn_button.sm{font-weight:600;font-size:12px;line-height:12px;border-radius:6px;padding:0 16px;height:32px}.arkyn_button.sm .content,.arkyn_button.sm .spinner{gap:12px}.arkyn_button.xs{font-weight:600;font-size:10px;line-height:10px;border-radius:4px;padding:0 16px;height:24px}.arkyn_button.xs .content,.arkyn_button.xs .spinner{gap:8px}.arkyn_button .spinner{display:flex;align-items:center;justify-content:center;white-space:nowrap;opacity:0}.arkyn_button .spinner>svg{animation:spin 2s linear infinite}.arkyn_button.loading_text_false .spinner{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}.arkyn_button.loading_text_true .spinner{max-height:0px}.arkyn_button.loading_true .content{opacity:0;max-height:0px}.arkyn_button.loading_true .spinner{opacity:1;max-height:unset}.arkyn_form_controller{display:flex;flex-direction:column;gap:6px}.arkyn_checkbox{display:flex;align-items:center;justify-content:center;border:2px solid var(--secondary-400);background-color:var(--secondary-100)}.arkyn_checkbox:hover{cursor:pointer}.arkyn_checkbox svg{display:none;stroke-width:3px}.arkyn_checkbox.sm{height:16px;width:16px;border-radius:2px}.arkyn_checkbox.sm svg{min-height:12px;min-width:12px}.arkyn_checkbox.md{height:20px;width:20px;border-radius:4px}.arkyn_checkbox.md svg{min-height:14px;min-width:14px}.arkyn_checkbox.lg{height:24px;width:24px;border-radius:6px}.arkyn_checkbox.lg svg{min-height:14px;min-width:14px}.arkyn_checkbox.checked{background-color:var(--primary-500);border-color:var(--primary-500)}.arkyn_checkbox.checked svg{display:unset;color:#fff}.arkyn_checkbox.error{border-color:var(--danger-500)}.arkyn_form_error{font-size:12px;line-height:12px;font-weight:600;color:var(--danger-600)}.arkyn_form_label{color:var(--secondary-700);font-size:14px;font-weight:600;line-height:19.07px}.arkyn_form_label.show-asterisk:before{content:"* ";font-size:12px;font-weight:600;line-height:16.34px;text-align:left;color:var(--danger-600)}.arkyn_icon_button{background:transparent;border:1px solid transparent;outline:1px solid transparent;position:relative;transition:.15s all ease-out}.arkyn_icon_button:hover{cursor:pointer}.arkyn_icon_button:disabled{cursor:not-allowed;opacity:.5}.arkyn_icon_button .content{display:flex;align-items:center;justify-content:center}.arkyn_icon_button.solid{color:#fff}.arkyn_icon_button.solid:disabled{opacity:.4}.arkyn_icon_button.solid.primary{background-color:var(--primary-500)}.arkyn_icon_button.solid.primary:hover{background-color:var(--primary-400)}.arkyn_icon_button.solid.primary:disabled{background-color:var(--primary-400)}.arkyn_icon_button.solid.danger{background-color:var(--danger-600)}.arkyn_icon_button.solid.danger:hover{background-color:var(--danger-500)}.arkyn_icon_button.solid.danger:disabled{background-color:var(--danger-500)}.arkyn_icon_button.solid.success{background-color:var(--success-500)}.arkyn_icon_button.solid.success:hover{background-color:var(--success-400)}.arkyn_icon_button.solid.success:disabled{background-color:var(--success-400)}.arkyn_icon_button.solid.warning{background-color:var(--warning-600)}.arkyn_icon_button.solid.warning:hover{background-color:var(--warning-500)}.arkyn_icon_button.solid.warning:disabled{background-color:var(--warning-500)}.arkyn_icon_button.outline{border-color:var(--secondary-300)}.arkyn_icon_button.outline:hover{border-color:var(--secondary-200)}.arkyn_icon_button.outline:disabled{border-color:var(--secondary-200)}.arkyn_icon_button.outline.primary{color:var(--primary-500)}.arkyn_icon_button.outline.primary:hover{color:var(--primary-400)}.arkyn_icon_button.outline.primary:disabled{color:var(--primary-400)}.arkyn_icon_button.outline.danger{color:var(--danger-600)}.arkyn_icon_button.outline.danger:hover{color:var(--danger-500)}.arkyn_icon_button.outline.danger:disabled{color:var(--danger-500)}.arkyn_icon_button.outline.success{color:var(--success-500)}.arkyn_icon_button.outline.success:hover{color:var(--success-400)}.arkyn_icon_button.outline.success:disabled{color:var(--success-400)}.arkyn_icon_button.outline.warning{color:var(--warning-600)}.arkyn_icon_button.outline.warning:hover{color:var(--warning-500)}.arkyn_icon_button.outline.warning:disabled{color:var(--warning-500)}.arkyn_icon_button.ghost:disabled{opacity:.4}.arkyn_icon_button.ghost.primary{color:var(--primary-500);background-color:var(--primary-100)}.arkyn_icon_button.ghost.primary:hover{color:var(--primary-400);background-color:var(--primary-50)}.arkyn_icon_button.ghost.primary:disabled{color:var(--primary-400);background-color:var(--primary-50)}.arkyn_icon_button.ghost.danger{color:var(--danger-600);background-color:var(--danger-100)}.arkyn_icon_button.ghost.danger:hover{color:var(--danger-500);background-color:var(--danger-50)}.arkyn_icon_button.ghost.danger:disabled{color:var(--danger-500);background-color:var(--danger-50)}.arkyn_icon_button.ghost.success{color:var(--success-500);background-color:var(--success-100)}.arkyn_icon_button.ghost.success:hover{color:var(--success-400);background-color:var(--success-50)}.arkyn_icon_button.ghost.success:disabled{color:var(--success-400);background-color:var(--success-50)}.arkyn_icon_button.ghost.warning{color:var(--warning-600);background-color:var(--warning-100)}.arkyn_icon_button.ghost.warning:hover{color:var(--warning-500);background-color:var(--warning-50)}.arkyn_icon_button.ghost.warning:disabled{color:var(--warning-500);background-color:var(--warning-50)}.arkyn_icon_button.invisible:disabled{opacity:.4}.arkyn_icon_button.invisible.primary{color:var(--primary-500)}.arkyn_icon_button.invisible.primary:hover{color:var(--primary-400)}.arkyn_icon_button.invisible.primary:disabled{color:var(--primary-400)}.arkyn_icon_button.invisible.danger{color:var(--danger-600)}.arkyn_icon_button.invisible.danger:hover{color:var(--danger-500)}.arkyn_icon_button.invisible.danger:disabled{color:var(--danger-500)}.arkyn_icon_button.invisible.success{color:var(--success-500)}.arkyn_icon_button.invisible.success:hover{color:var(--success-400)}.arkyn_icon_button.invisible.success:disabled{color:var(--success-400)}.arkyn_icon_button.invisible.warning{color:var(--warning-600)}.arkyn_icon_button.invisible.warning:hover{color:var(--warning-500)}.arkyn_icon_button.invisible.warning:disabled{color:var(--warning-500)}.arkyn_icon_button.lg{border-radius:6px;height:44px;width:44px}.arkyn_icon_button.md{border-radius:6px;height:40px;width:40px}.arkyn_icon_button.sm{border-radius:6px;height:32px;width:32px}.arkyn_icon_button.xs{border-radius:4px;height:24px;width:24px}.arkyn_icon_button .spinner{display:flex;align-items:center;justify-content:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);opacity:0}.arkyn_icon_button .spinner svg{animation:spin 2s linear infinite}.arkyn_icon_button.loading_true .content{opacity:0}.arkyn_icon_button.loading_true .spinner{opacity:1}.arkyn_input{flex:1;position:relative;display:flex;align-items:center;padding:0 16px;gap:8px;border-radius:6px;border:1px solid transparent;outline:1px solid transparent}.arkyn_input:hover{cursor:text}.arkyn_input input{border:none;outline:none;background:transparent;width:100%}.arkyn_input input{color:var(--secondary-900)}.arkyn_input .prefix,.arkyn_input .sufix{color:var(--secondary-600);background:var(--secondary-200);font-weight:400;display:flex;align-items:center;justify-content:center;position:absolute}.arkyn_input .prefix{left:0;top:0;bottom:0;border-radius:5px 0 0 5px;border-right:1px solid var(--secondary-300)}.arkyn_input .sufix{right:0;top:0;bottom:0;border-radius:0 5px 5px 0;border-left:1px solid var(--secondary-300)}.arkyn_input input::placeholder{color:var(--secondary-400)}.arkyn_input svg{color:var(--secondary-400)}.arkyn_input.errored svg{color:var(--danger-600)}.arkyn_input:not(.opacity).focused svg{color:var(--primary-500)}.arkyn_input.opacity{opacity:.5}.arkyn_input.solid{border-color:var(--secondary-300);background-color:var(--secondary-50)}.arkyn_input.solid.errored{border-color:var(--danger-600);outline-color:var(--danger-600)}.arkyn_input:not(.opacity).solid.focused{border-color:var(--primary-500);outline-color:var(--primary-500)}.arkyn_input.outline{border-color:var(--secondary-300)}.arkyn_input.outline.errored{border-color:var(--danger-600);outline-color:var(--danger-600)}.arkyn_input:not(.opacity).outline.focused{border-color:var(--primary-500);outline-color:var(--primary-500)}.arkyn_input.underline{border-radius:0;border-top:none;border-left:none;border-right:none;outline:none;border-color:var(--secondary-300)}.arkyn_input.underline .sufix,.arkyn_input.underline .prefix{display:none}.arkyn_input.underline:before{content:" ";position:absolute;height:1px;left:0;right:0;bottom:-2px;background:transparent}.arkyn_input.underline.errored{border-color:var(--danger-600)}.arkyn_input.underline.errored:before{background:var(--danger-600)}.arkyn_input:not(.opacity).underline.focused{border-color:var(--primary-500)}.arkyn_input:not(.opacity).underline.focused:before{background:var(--primary-500)}.arkyn_input.md input{min-height:40px;max-height:40px;font-size:14px;line-height:14px;font-weight:400}.arkyn_input.md input::placeholder{font-weight:400;font-size:14px;line-height:14px}.arkyn_input.md.hasPrefix{padding-left:60px}.arkyn_input.md.hasSufix{padding-right:60px}.arkyn_input.md .prefix,.arkyn_input.md .sufix{height:40px;width:44px;font-size:14px}.arkyn_input.lg input{min-height:44px;max-height:44px;line-height:16px;font-size:16px;font-weight:400}.arkyn_input.lg input::placeholder{font-weight:400;font-size:16px;line-height:16px}.arkyn_input.lg .prefix,.arkyn_input.lg .sufix{height:44px;width:48px;font-size:16px}.arkyn_input.lg.hasPrefix{padding-left:64px}.arkyn_input.lg.hasSufix{padding-right:64px}.arkyn_input .spinner{animation:spin 2s linear infinite}.arkyn_select{flex:1;position:relative;display:flex;align-items:center;padding:0 16px;gap:8px;border-radius:6px;border:1px solid transparent;outline:1px solid transparent}.arkyn_select:hover{cursor:text}.arkyn_select input{border:none;outline:none;background:transparent;width:100%}.arkyn_select input{color:var(--secondary-900)}.arkyn_select .prefix{color:var(--secondary-600);background:var(--secondary-200);font-weight:400;display:flex;align-items:center;justify-content:center;position:absolute}.arkyn_select .prefix{left:0;top:0;bottom:0;border-radius:5px 0 0 5px;border-right:1px solid var(--secondary-300)}.arkyn_select.placeholder_dark_true input::placeholder{color:var(--secondary-900)}.arkyn_select.placeholder_dark_false input::placeholder{color:var(--secondary-400)}.arkyn_select svg{color:var(--secondary-400)}.arkyn_select.errored svg{color:var(--danger-600)}.arkyn_select:not(.opacity).focused svg{color:var(--primary-500)}.arkyn_select.opacity{opacity:.5}.arkyn_select .arkyn_select_arrow{transition:.15s all ease-in-out;color:var(--secondary-400)}.arkyn_select:not(.opacity).focused .arkyn_select_arrow{transform:rotate(180deg)}.arkyn_select.solid{border-color:var(--secondary-300);background-color:var(--secondary-50)}.arkyn_select.solid.errored{border-color:var(--danger-600);outline-color:var(--danger-600)}.arkyn_select:not(.opacity).solid.focused{border-color:var(--primary-500);outline-color:var(--primary-500)}.arkyn_select.outline{border-color:var(--secondary-300)}.arkyn_select.outline.errored{border-color:var(--danger-600);outline-color:var(--danger-600)}.arkyn_select:not(.opacity).outline.focused{border-color:var(--primary-500);outline-color:var(--primary-500)}.arkyn_select.underline{border-radius:0;border-top:none;border-left:none;border-right:none;outline:none;border-color:var(--secondary-300)}.arkyn_select.underline .prefix{display:none}.arkyn_select.underline:before{content:" ";position:absolute;height:1px;left:0;right:0;bottom:-2px;background:transparent}.arkyn_select.underline.errored{border-color:var(--danger-600)}.arkyn_select.underline.errored:before{background:var(--danger-600)}.arkyn_select:not(.opacity).underline.focused{border-color:var(--primary-500)}.arkyn_select:not(.opacity).underline.focused:before{background:var(--primary-500)}.arkyn_select.md input{min-height:40px;max-height:40px;font-size:14px;line-height:14px;font-weight:400}.arkyn_select.md input::placeholder{font-weight:400;font-size:14px;line-height:14px}.arkyn_select.md.hasPrefix{padding-left:60px}.arkyn_select.md .prefix{height:40px;width:44px;font-size:14px}.arkyn_select.lg input{min-height:44px;max-height:44px;line-height:16px;font-size:16px;font-weight:400}.arkyn_select.lg input::placeholder{font-weight:400;font-size:16px;line-height:16px}.arkyn_select.lg .prefix{height:44px;width:48px;font-size:16px}.arkyn_select.lg.hasPrefix{padding-left:64px}.arkyn_select_content{position:absolute;z-index:6;top:calc(100% + 5px);left:-2px;right:-2px;border-radius:6px;list-style:none;display:flex;flex-direction:column;flex:1;overflow:hidden;height:max-content;border:1px solid var(--secondary-300);background-color:var(--secondary-50)}.arkyn_select_content>li{display:flex;align-items:center;justify-content:space-between;font-weight:400;line-height:21.79px;color:var(--secondary-500)}.arkyn_select.md .arkyn_select_content>li{font-size:14px;padding:8px 16px}.arkyn_select.lg .arkyn_select_content>li{font-size:16px;padding:8px 16px}.arkyn_select_content>p{font-weight:400;font-size:14px;padding:16px;text-align:center;line-height:21.79px;color:var(--secondary-500)}.arkyn_select_content>li svg{height:20px;width:20px;color:var(--primary-500);display:none}.arkyn_select_content>li:hover{cursor:pointer;background-color:var(--secondary-100)}.arkyn_select_content>li:not(:last-child){border-bottom:1px solid var(--secondary-300)}.arkyn_select_content>li.active{font-weight:600;color:var(--secondary-900);background-color:var(--secondary-100)}.arkyn_select_content>li.active svg{display:unset}.arkyn_select .spinner{animation:spin 2s linear infinite}.arkyn_select_overlay{position:fixed;top:0;bottom:0;left:0;right:0;z-index:5}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.arkyn_breadcrumb{display:flex;align-items:center;justify-content:start;flex-wrap:wrap;gap:4px}.arkyn_breadcrumb_link{-webkit-user-select:none;user-select:none;text-decoration:none;font-size:14px;color:var(--secondary-500)}.arkyn_breadcrumb_link.active{color:var(--secondary-900)}.arkyn_breadcrumb_link.inactive:hover{cursor:pointer;color:var(--secondary-900)}.arkyn_breadcrumb_link:first-child>svg{display:none}.arkyn_breadcrumb_link:not(:first-child){display:flex;align-items:center;gap:4px}.arkyn_breadcrumb_link:not(:first-child)>svg{display:unset;color:var(--secondary-400)}.arkyn_modal_container{position:fixed;top:0;left:0;right:0;bottom:0;display:flex;align-items:start;justify-content:center;padding:10vh 0;padding-bottom:2rem;overflow:auto}.arkyn_modal_container>.overlay{position:fixed;z-index:9997;top:0;left:0;right:0;bottom:0;background:#00000080}.arkyn_modal_container>.overlay:hover{cursor:pointer}.arkyn_modal_container>.content{z-index:9999;border-radius:6px;background:var(--secondary-50)}.arkyn_modal_footer{display:flex;align-items:center;gap:16px;padding:16px;border-top:1px solid var(--secondary-200)}.arkyn_modal_footer.left{justify-content:flex-start}.arkyn_modal_footer.right{justify-content:flex-end}.arkyn_modal_footer.center{justify-content:center}.arkyn_modal_footer.between{justify-content:space-between}.arkyn_modal_footer.around{justify-content:space-around}.arkyn_modal_header{display:flex;align-items:center;justify-content:space-between;height:56px;padding:16px;font-size:16px;font-weight:600;line-height:20px;color:var(--secondary-900);border-bottom:1px solid var(--secondary-200)}.arkyn_modal_header>button{display:flex;align-items:center;justify-content:center;padding:2px;border-radius:4px;border:none;background:none;color:var(--secondary-400);transition:all .15s ease-out}.arkyn_modal_header>button:hover{cursor:pointer;background-color:var(--secondary-100)}.arkyn_tooltip{position:relative;display:block}.arkyn_tooltip .arkyn_tooltip_text{visibility:hidden;opacity:0;position:absolute;transform:translate(-50%,-50%);white-space:nowrap;transition:.15s all ease-out;border-radius:4px;display:flex;align-items:center;justify-content:center;font-weight:400;color:var(--secondary-100);background-color:var(--secondary-900);z-index:9999}.arkyn_tooltip.lg .arkyn_tooltip_text{font-size:14px;line-height:14px;padding:8px 12px}.arkyn_tooltip.md .arkyn_tooltip_text{font-size:12px;line-height:12px;padding:8px 12px}.arkyn_tooltip:hover .arkyn_tooltip_text{opacity:1;visibility:visible}.arkyn_tooltip.top .arkyn_tooltip_text{bottom:calc(100% + 10px);left:50%;transform:translate(-50%)}.arkyn_tooltip.top .arkyn_tooltip_text:before{content:"";top:100%;border-style:solid;border-color:var(--secondary-900) transparent;border-width:6px 6px 0 6px;bottom:20px;position:absolute;left:50%;transform:translate(-50%)}.arkyn_tooltip.left .arkyn_tooltip_text{top:50%;right:calc(100% + 10px);transform:translateY(-50%)}.arkyn_tooltip.left .arkyn_tooltip_text:before{content:"";top:50%;border-style:solid;border-color:transparent var(--secondary-900);border-width:6px 0 6px 6px;left:100%;position:absolute;transform:translateY(-50%)}.arkyn_tooltip.right .arkyn_tooltip_text{top:50%;left:calc(100% + 10px);transform:translateY(-50%)}.arkyn_tooltip.right .arkyn_tooltip_text:before{content:"";border-style:solid;border-color:transparent var(--secondary-900);border-width:6px 6px 6px 0;top:50%;left:0;transform:translate(-100%,-50%);position:absolute}.arkyn_tooltip.bottom .arkyn_tooltip_text{top:calc(100% + 10px);left:50%;transform:translate(-50%)}.arkyn_tooltip.bottom .arkyn_tooltip_text:before{content:"";border-style:solid;border-color:var(--secondary-900) transparent;border-width:0 6px 6px 6px;top:0;left:50%;transform:translate(-50%,-100%);position:absolute}
|