@arkyn/components 1.2.4 → 1.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (40) hide show
  1. package/dist/bundle.js +1053 -767
  2. package/dist/bundle.umd.cjs +11 -11
  3. package/dist/components/Checkbox/index.d.ts +5 -0
  4. package/dist/components/Checkbox/index.d.ts.map +1 -0
  5. package/dist/components/Checkbox/index.js +20 -0
  6. package/dist/components/Input/CpfCpnjInput/getConfig.d.ts +1 -1
  7. package/dist/components/Input/CpfCpnjInput/getConfig.d.ts.map +1 -1
  8. package/dist/components/Input/CpfCpnjInput/getConfig.js +12 -1
  9. package/dist/components/Input/CpfCpnjInput/index.d.ts.map +1 -1
  10. package/dist/components/Input/CpfCpnjInput/index.js +2 -2
  11. package/dist/components/Input/CurrencyInput/index.js +1 -1
  12. package/dist/components/Input/MaskInput/getConfig.js +1 -1
  13. package/dist/components/Input/MaskInput/index.d.ts.map +1 -1
  14. package/dist/components/Input/MaskInput/index.js +34 -58
  15. package/dist/components/Select/getConfig.d.ts +313 -0
  16. package/dist/components/Select/getConfig.d.ts.map +1 -0
  17. package/dist/components/Select/getConfig.js +30 -0
  18. package/dist/components/Select/index.d.ts +5 -0
  19. package/dist/components/Select/index.d.ts.map +1 -0
  20. package/dist/components/Select/index.js +71 -0
  21. package/dist/components/Select/utils/morpheme.d.ts +4 -0
  22. package/dist/components/Select/utils/morpheme.d.ts.map +1 -0
  23. package/dist/components/Select/utils/morpheme.js +10 -0
  24. package/dist/index.d.ts +2 -0
  25. package/dist/index.d.ts.map +1 -1
  26. package/dist/index.js +2 -0
  27. package/dist/style.css +1 -1
  28. package/package.json +6 -6
  29. package/src/components/Checkbox/index.tsx +52 -0
  30. package/src/components/Checkbox/styles.css +66 -0
  31. package/src/components/Input/CpfCpnjInput/getConfig.tsx +15 -0
  32. package/src/components/Input/CpfCpnjInput/index.tsx +3 -4
  33. package/src/components/Input/CurrencyInput/index.tsx +1 -1
  34. package/src/components/Input/MaskInput/getConfig.tsx +1 -1
  35. package/src/components/Input/MaskInput/index.tsx +81 -68
  36. package/src/components/Select/getConfig.tsx +52 -0
  37. package/src/components/Select/index.tsx +161 -0
  38. package/src/components/Select/styles.css +305 -0
  39. package/src/components/Select/utils/morpheme.tsx +19 -0
  40. package/src/index.ts +2 -0
@@ -0,0 +1,313 @@
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
+ optionMaxHeight?: number;
9
+ options: {
10
+ label: string;
11
+ value: string;
12
+ }[];
13
+ onSelect?: (value: {
14
+ label: string;
15
+ value: string;
16
+ }) => void;
17
+ suppressHydrationWarning?: boolean;
18
+ color?: string;
19
+ height?: string | number;
20
+ id?: string;
21
+ lang?: string;
22
+ max?: string | number;
23
+ min?: string | number;
24
+ width?: string | number;
25
+ role?: import("react").AriaRole;
26
+ tabIndex?: number;
27
+ "aria-activedescendant"?: string;
28
+ "aria-atomic"?: boolean | "true" | "false";
29
+ "aria-autocomplete"?: "list" | "none" | "inline" | "both";
30
+ "aria-braillelabel"?: string;
31
+ "aria-brailleroledescription"?: string;
32
+ "aria-busy"?: boolean | "true" | "false";
33
+ "aria-checked"?: boolean | "true" | "false" | "mixed";
34
+ "aria-colcount"?: number;
35
+ "aria-colindex"?: number;
36
+ "aria-colindextext"?: string;
37
+ "aria-colspan"?: number;
38
+ "aria-controls"?: string;
39
+ "aria-current"?: boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time";
40
+ "aria-describedby"?: string;
41
+ "aria-description"?: string;
42
+ "aria-details"?: string;
43
+ "aria-disabled"?: boolean | "true" | "false";
44
+ "aria-dropeffect"?: "link" | "none" | "copy" | "execute" | "move" | "popup";
45
+ "aria-errormessage"?: string;
46
+ "aria-expanded"?: boolean | "true" | "false";
47
+ "aria-flowto"?: string;
48
+ "aria-grabbed"?: boolean | "true" | "false";
49
+ "aria-haspopup"?: boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree";
50
+ "aria-hidden"?: boolean | "true" | "false";
51
+ "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling";
52
+ "aria-keyshortcuts"?: string;
53
+ "aria-label"?: string;
54
+ "aria-labelledby"?: string;
55
+ "aria-level"?: number;
56
+ "aria-live"?: "off" | "assertive" | "polite";
57
+ "aria-modal"?: boolean | "true" | "false";
58
+ "aria-multiline"?: boolean | "true" | "false";
59
+ "aria-multiselectable"?: boolean | "true" | "false";
60
+ "aria-orientation"?: "horizontal" | "vertical";
61
+ "aria-owns"?: string;
62
+ "aria-placeholder"?: string;
63
+ "aria-posinset"?: number;
64
+ "aria-pressed"?: boolean | "true" | "false" | "mixed";
65
+ "aria-readonly"?: boolean | "true" | "false";
66
+ "aria-relevant"?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals";
67
+ "aria-required"?: boolean | "true" | "false";
68
+ "aria-roledescription"?: string;
69
+ "aria-rowcount"?: number;
70
+ "aria-rowindex"?: number;
71
+ "aria-rowindextext"?: string;
72
+ "aria-rowspan"?: number;
73
+ "aria-selected"?: boolean | "true" | "false";
74
+ "aria-setsize"?: number;
75
+ "aria-sort"?: "none" | "ascending" | "descending" | "other";
76
+ "aria-valuemax"?: number;
77
+ "aria-valuemin"?: number;
78
+ "aria-valuenow"?: number;
79
+ "aria-valuetext"?: string;
80
+ children?: import("react").ReactNode;
81
+ dangerouslySetInnerHTML?: {
82
+ __html: string | TrustedHTML;
83
+ };
84
+ onCopy?: import("react").ClipboardEventHandler<HTMLInputElement>;
85
+ onCopyCapture?: import("react").ClipboardEventHandler<HTMLInputElement>;
86
+ onCut?: import("react").ClipboardEventHandler<HTMLInputElement>;
87
+ onCutCapture?: import("react").ClipboardEventHandler<HTMLInputElement>;
88
+ onPaste?: import("react").ClipboardEventHandler<HTMLInputElement>;
89
+ onPasteCapture?: import("react").ClipboardEventHandler<HTMLInputElement>;
90
+ onCompositionEnd?: import("react").CompositionEventHandler<HTMLInputElement>;
91
+ onCompositionEndCapture?: import("react").CompositionEventHandler<HTMLInputElement>;
92
+ onCompositionStart?: import("react").CompositionEventHandler<HTMLInputElement>;
93
+ onCompositionStartCapture?: import("react").CompositionEventHandler<HTMLInputElement>;
94
+ onCompositionUpdate?: import("react").CompositionEventHandler<HTMLInputElement>;
95
+ onCompositionUpdateCapture?: import("react").CompositionEventHandler<HTMLInputElement>;
96
+ onFocusCapture?: import("react").FocusEventHandler<HTMLInputElement>;
97
+ onBlurCapture?: import("react").FocusEventHandler<HTMLInputElement>;
98
+ onChangeCapture?: import("react").FormEventHandler<HTMLInputElement>;
99
+ onBeforeInput?: import("react").FormEventHandler<HTMLInputElement>;
100
+ onBeforeInputCapture?: import("react").FormEventHandler<HTMLInputElement>;
101
+ onInput?: import("react").FormEventHandler<HTMLInputElement>;
102
+ onInputCapture?: import("react").FormEventHandler<HTMLInputElement>;
103
+ onReset?: import("react").FormEventHandler<HTMLInputElement>;
104
+ onResetCapture?: import("react").FormEventHandler<HTMLInputElement>;
105
+ onSubmit?: import("react").FormEventHandler<HTMLInputElement>;
106
+ onSubmitCapture?: import("react").FormEventHandler<HTMLInputElement>;
107
+ onInvalid?: import("react").FormEventHandler<HTMLInputElement>;
108
+ onInvalidCapture?: import("react").FormEventHandler<HTMLInputElement>;
109
+ onLoad?: import("react").ReactEventHandler<HTMLInputElement>;
110
+ onLoadCapture?: import("react").ReactEventHandler<HTMLInputElement>;
111
+ onError?: import("react").ReactEventHandler<HTMLInputElement>;
112
+ onErrorCapture?: import("react").ReactEventHandler<HTMLInputElement>;
113
+ onKeyDown?: import("react").KeyboardEventHandler<HTMLInputElement>;
114
+ onKeyDownCapture?: import("react").KeyboardEventHandler<HTMLInputElement>;
115
+ onKeyPress?: import("react").KeyboardEventHandler<HTMLInputElement>;
116
+ onKeyPressCapture?: import("react").KeyboardEventHandler<HTMLInputElement>;
117
+ onKeyUp?: import("react").KeyboardEventHandler<HTMLInputElement>;
118
+ onKeyUpCapture?: import("react").KeyboardEventHandler<HTMLInputElement>;
119
+ onAbort?: import("react").ReactEventHandler<HTMLInputElement>;
120
+ onAbortCapture?: import("react").ReactEventHandler<HTMLInputElement>;
121
+ onCanPlay?: import("react").ReactEventHandler<HTMLInputElement>;
122
+ onCanPlayCapture?: import("react").ReactEventHandler<HTMLInputElement>;
123
+ onCanPlayThrough?: import("react").ReactEventHandler<HTMLInputElement>;
124
+ onCanPlayThroughCapture?: import("react").ReactEventHandler<HTMLInputElement>;
125
+ onDurationChange?: import("react").ReactEventHandler<HTMLInputElement>;
126
+ onDurationChangeCapture?: import("react").ReactEventHandler<HTMLInputElement>;
127
+ onEmptied?: import("react").ReactEventHandler<HTMLInputElement>;
128
+ onEmptiedCapture?: import("react").ReactEventHandler<HTMLInputElement>;
129
+ onEncrypted?: import("react").ReactEventHandler<HTMLInputElement>;
130
+ onEncryptedCapture?: import("react").ReactEventHandler<HTMLInputElement>;
131
+ onEnded?: import("react").ReactEventHandler<HTMLInputElement>;
132
+ onEndedCapture?: import("react").ReactEventHandler<HTMLInputElement>;
133
+ onLoadedData?: import("react").ReactEventHandler<HTMLInputElement>;
134
+ onLoadedDataCapture?: import("react").ReactEventHandler<HTMLInputElement>;
135
+ onLoadedMetadata?: import("react").ReactEventHandler<HTMLInputElement>;
136
+ onLoadedMetadataCapture?: import("react").ReactEventHandler<HTMLInputElement>;
137
+ onLoadStart?: import("react").ReactEventHandler<HTMLInputElement>;
138
+ onLoadStartCapture?: import("react").ReactEventHandler<HTMLInputElement>;
139
+ onPause?: import("react").ReactEventHandler<HTMLInputElement>;
140
+ onPauseCapture?: import("react").ReactEventHandler<HTMLInputElement>;
141
+ onPlay?: import("react").ReactEventHandler<HTMLInputElement>;
142
+ onPlayCapture?: import("react").ReactEventHandler<HTMLInputElement>;
143
+ onPlaying?: import("react").ReactEventHandler<HTMLInputElement>;
144
+ onPlayingCapture?: import("react").ReactEventHandler<HTMLInputElement>;
145
+ onProgress?: import("react").ReactEventHandler<HTMLInputElement>;
146
+ onProgressCapture?: import("react").ReactEventHandler<HTMLInputElement>;
147
+ onRateChange?: import("react").ReactEventHandler<HTMLInputElement>;
148
+ onRateChangeCapture?: import("react").ReactEventHandler<HTMLInputElement>;
149
+ onResize?: import("react").ReactEventHandler<HTMLInputElement>;
150
+ onResizeCapture?: import("react").ReactEventHandler<HTMLInputElement>;
151
+ onSeeked?: import("react").ReactEventHandler<HTMLInputElement>;
152
+ onSeekedCapture?: import("react").ReactEventHandler<HTMLInputElement>;
153
+ onSeeking?: import("react").ReactEventHandler<HTMLInputElement>;
154
+ onSeekingCapture?: import("react").ReactEventHandler<HTMLInputElement>;
155
+ onStalled?: import("react").ReactEventHandler<HTMLInputElement>;
156
+ onStalledCapture?: import("react").ReactEventHandler<HTMLInputElement>;
157
+ onSuspend?: import("react").ReactEventHandler<HTMLInputElement>;
158
+ onSuspendCapture?: import("react").ReactEventHandler<HTMLInputElement>;
159
+ onTimeUpdate?: import("react").ReactEventHandler<HTMLInputElement>;
160
+ onTimeUpdateCapture?: import("react").ReactEventHandler<HTMLInputElement>;
161
+ onVolumeChange?: import("react").ReactEventHandler<HTMLInputElement>;
162
+ onVolumeChangeCapture?: import("react").ReactEventHandler<HTMLInputElement>;
163
+ onWaiting?: import("react").ReactEventHandler<HTMLInputElement>;
164
+ onWaitingCapture?: import("react").ReactEventHandler<HTMLInputElement>;
165
+ onAuxClick?: import("react").MouseEventHandler<HTMLInputElement>;
166
+ onAuxClickCapture?: import("react").MouseEventHandler<HTMLInputElement>;
167
+ onClick?: import("react").MouseEventHandler<HTMLInputElement>;
168
+ onClickCapture?: import("react").MouseEventHandler<HTMLInputElement>;
169
+ onContextMenu?: import("react").MouseEventHandler<HTMLInputElement>;
170
+ onContextMenuCapture?: import("react").MouseEventHandler<HTMLInputElement>;
171
+ onDoubleClick?: import("react").MouseEventHandler<HTMLInputElement>;
172
+ onDoubleClickCapture?: import("react").MouseEventHandler<HTMLInputElement>;
173
+ onDrag?: import("react").DragEventHandler<HTMLInputElement>;
174
+ onDragCapture?: import("react").DragEventHandler<HTMLInputElement>;
175
+ onDragEnd?: import("react").DragEventHandler<HTMLInputElement>;
176
+ onDragEndCapture?: import("react").DragEventHandler<HTMLInputElement>;
177
+ onDragEnter?: import("react").DragEventHandler<HTMLInputElement>;
178
+ onDragEnterCapture?: import("react").DragEventHandler<HTMLInputElement>;
179
+ onDragExit?: import("react").DragEventHandler<HTMLInputElement>;
180
+ onDragExitCapture?: import("react").DragEventHandler<HTMLInputElement>;
181
+ onDragLeave?: import("react").DragEventHandler<HTMLInputElement>;
182
+ onDragLeaveCapture?: import("react").DragEventHandler<HTMLInputElement>;
183
+ onDragOver?: import("react").DragEventHandler<HTMLInputElement>;
184
+ onDragOverCapture?: import("react").DragEventHandler<HTMLInputElement>;
185
+ onDragStart?: import("react").DragEventHandler<HTMLInputElement>;
186
+ onDragStartCapture?: import("react").DragEventHandler<HTMLInputElement>;
187
+ onDrop?: import("react").DragEventHandler<HTMLInputElement>;
188
+ onDropCapture?: import("react").DragEventHandler<HTMLInputElement>;
189
+ onMouseDown?: import("react").MouseEventHandler<HTMLInputElement>;
190
+ onMouseDownCapture?: import("react").MouseEventHandler<HTMLInputElement>;
191
+ onMouseEnter?: import("react").MouseEventHandler<HTMLInputElement>;
192
+ onMouseLeave?: import("react").MouseEventHandler<HTMLInputElement>;
193
+ onMouseMove?: import("react").MouseEventHandler<HTMLInputElement>;
194
+ onMouseMoveCapture?: import("react").MouseEventHandler<HTMLInputElement>;
195
+ onMouseOut?: import("react").MouseEventHandler<HTMLInputElement>;
196
+ onMouseOutCapture?: import("react").MouseEventHandler<HTMLInputElement>;
197
+ onMouseOver?: import("react").MouseEventHandler<HTMLInputElement>;
198
+ onMouseOverCapture?: import("react").MouseEventHandler<HTMLInputElement>;
199
+ onMouseUp?: import("react").MouseEventHandler<HTMLInputElement>;
200
+ onMouseUpCapture?: import("react").MouseEventHandler<HTMLInputElement>;
201
+ onSelectCapture?: import("react").ReactEventHandler<HTMLInputElement>;
202
+ onTouchCancel?: import("react").TouchEventHandler<HTMLInputElement>;
203
+ onTouchCancelCapture?: import("react").TouchEventHandler<HTMLInputElement>;
204
+ onTouchEnd?: import("react").TouchEventHandler<HTMLInputElement>;
205
+ onTouchEndCapture?: import("react").TouchEventHandler<HTMLInputElement>;
206
+ onTouchMove?: import("react").TouchEventHandler<HTMLInputElement>;
207
+ onTouchMoveCapture?: import("react").TouchEventHandler<HTMLInputElement>;
208
+ onTouchStart?: import("react").TouchEventHandler<HTMLInputElement>;
209
+ onTouchStartCapture?: import("react").TouchEventHandler<HTMLInputElement>;
210
+ onPointerDown?: import("react").PointerEventHandler<HTMLInputElement>;
211
+ onPointerDownCapture?: import("react").PointerEventHandler<HTMLInputElement>;
212
+ onPointerMove?: import("react").PointerEventHandler<HTMLInputElement>;
213
+ onPointerMoveCapture?: import("react").PointerEventHandler<HTMLInputElement>;
214
+ onPointerUp?: import("react").PointerEventHandler<HTMLInputElement>;
215
+ onPointerUpCapture?: import("react").PointerEventHandler<HTMLInputElement>;
216
+ onPointerCancel?: import("react").PointerEventHandler<HTMLInputElement>;
217
+ onPointerCancelCapture?: import("react").PointerEventHandler<HTMLInputElement>;
218
+ onPointerEnter?: import("react").PointerEventHandler<HTMLInputElement>;
219
+ onPointerLeave?: import("react").PointerEventHandler<HTMLInputElement>;
220
+ onPointerOver?: import("react").PointerEventHandler<HTMLInputElement>;
221
+ onPointerOverCapture?: import("react").PointerEventHandler<HTMLInputElement>;
222
+ onPointerOut?: import("react").PointerEventHandler<HTMLInputElement>;
223
+ onPointerOutCapture?: import("react").PointerEventHandler<HTMLInputElement>;
224
+ onGotPointerCapture?: import("react").PointerEventHandler<HTMLInputElement>;
225
+ onGotPointerCaptureCapture?: import("react").PointerEventHandler<HTMLInputElement>;
226
+ onLostPointerCapture?: import("react").PointerEventHandler<HTMLInputElement>;
227
+ onLostPointerCaptureCapture?: import("react").PointerEventHandler<HTMLInputElement>;
228
+ onScroll?: import("react").UIEventHandler<HTMLInputElement>;
229
+ onScrollCapture?: import("react").UIEventHandler<HTMLInputElement>;
230
+ onWheel?: import("react").WheelEventHandler<HTMLInputElement>;
231
+ onWheelCapture?: import("react").WheelEventHandler<HTMLInputElement>;
232
+ onAnimationStart?: import("react").AnimationEventHandler<HTMLInputElement>;
233
+ onAnimationStartCapture?: import("react").AnimationEventHandler<HTMLInputElement>;
234
+ onAnimationEnd?: import("react").AnimationEventHandler<HTMLInputElement>;
235
+ onAnimationEndCapture?: import("react").AnimationEventHandler<HTMLInputElement>;
236
+ onAnimationIteration?: import("react").AnimationEventHandler<HTMLInputElement>;
237
+ onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLInputElement>;
238
+ onTransitionEnd?: import("react").TransitionEventHandler<HTMLInputElement>;
239
+ onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLInputElement>;
240
+ defaultChecked?: boolean;
241
+ suppressContentEditableWarning?: boolean;
242
+ accessKey?: string;
243
+ autoFocus?: boolean;
244
+ contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only";
245
+ contextMenu?: string;
246
+ dir?: string;
247
+ draggable?: boolean | "true" | "false";
248
+ hidden?: boolean;
249
+ nonce?: string;
250
+ slot?: string;
251
+ spellCheck?: boolean | "true" | "false";
252
+ translate?: "yes" | "no";
253
+ radioGroup?: string;
254
+ about?: string;
255
+ content?: string;
256
+ datatype?: string;
257
+ inlist?: any;
258
+ property?: string;
259
+ rel?: string;
260
+ resource?: string;
261
+ rev?: string;
262
+ typeof?: string;
263
+ vocab?: string;
264
+ autoCapitalize?: string;
265
+ autoCorrect?: string;
266
+ autoSave?: string;
267
+ itemProp?: string;
268
+ itemScope?: boolean;
269
+ itemType?: string;
270
+ itemID?: string;
271
+ itemRef?: string;
272
+ results?: number;
273
+ security?: string;
274
+ unselectable?: "on" | "off";
275
+ inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal";
276
+ is?: string;
277
+ form?: string;
278
+ list?: string;
279
+ step?: string | number;
280
+ formAction?: string;
281
+ formEncType?: string;
282
+ formMethod?: string;
283
+ formNoValidate?: boolean;
284
+ formTarget?: string;
285
+ accept?: string;
286
+ alt?: string;
287
+ autoComplete?: import("react").HTMLInputAutoCompleteAttribute;
288
+ capture?: boolean | "user" | "environment";
289
+ checked?: boolean;
290
+ enterKeyHint?: "search" | "enter" | "done" | "go" | "next" | "previous" | "send";
291
+ maxLength?: number;
292
+ minLength?: number;
293
+ multiple?: boolean;
294
+ pattern?: string;
295
+ placeholder?: string;
296
+ required?: boolean;
297
+ src?: string;
298
+ isLoading: boolean;
299
+ className: string;
300
+ prefix: import("react/jsx-runtime").JSX.Element;
301
+ LeftIcon: import("lucide-react").LucideIcon;
302
+ disabled: boolean;
303
+ readOnly: boolean;
304
+ onFocus: import("react").FocusEventHandler<HTMLInputElement>;
305
+ onBlur: import("react").FocusEventHandler<HTMLInputElement>;
306
+ title: string;
307
+ style: import("react").CSSProperties;
308
+ isSearchable: boolean;
309
+ iconSize: number;
310
+ Spinner: import("react/jsx-runtime").JSX.Element;
311
+ };
312
+ export { getConfig };
313
+ //# 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,5 @@
1
+ import type { SelectProps } from "@arkyn/types";
2
+ import "./styles.css";
3
+ declare function Select(props: SelectProps): import("react/jsx-runtime").JSX.Element;
4
+ export { Select };
5
+ //# sourceMappingURL=index.d.ts.map
@@ -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,2CAmJjC;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, optionMaxHeight, ...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", style: { overflow: "auto", maxHeight: optionMaxHeight }, 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,4 @@
1
+ import type { LucideIcon } from "lucide-react";
2
+ declare function morpheme(data: LucideIcon | string | undefined, iconSize: number, type?: "prefix" | "sufix"): import("react/jsx-runtime").JSX.Element;
3
+ export { morpheme };
4
+ //# sourceMappingURL=morpheme.d.ts.map
@@ -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 };
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";
@@ -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;AAG3C,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"}
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_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_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:pointer}.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}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@arkyn/components",
3
- "version": "1.2.4",
3
+ "version": "1.3.0",
4
4
  "main": "./dist/bundle.js",
5
5
  "types": "./dist/index.d.ts",
6
6
  "author": "Lucas Gonçalves",
@@ -11,9 +11,9 @@
11
11
  "typecheck": "bunx tsc --project tsconfig.json --noEmit"
12
12
  },
13
13
  "dependencies": {
14
- "@react-input/mask": ">=1.1.1",
15
- "framer-motion": ">=11.0.8",
16
- "lucide-react": ">=0.349.0"
14
+ "@react-input/mask": ">=1.2.4",
15
+ "framer-motion": ">=11.2.4",
16
+ "lucide-react": ">=0.378.0"
17
17
  },
18
18
  "peerDependencies": {
19
19
  "@remix-run/react": ">=2.0.1",
@@ -21,10 +21,10 @@
21
21
  "react-dom": ">=18.2.0"
22
22
  },
23
23
  "devDependencies": {
24
- "@types/react": ">=18.3.1",
24
+ "@types/react": ">=18.3.2",
25
25
  "@types/react-dom": ">=18.3.0",
26
26
  "bun-types": "latest",
27
27
  "typescript": ">=5.4.5",
28
- "vite": "^5.1.0"
28
+ "vite": "^5.2.11"
29
29
  }
30
30
  }