@rovula/ui 0.0.28 → 0.0.30

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 (58) hide show
  1. package/dist/cjs/bundle.css +40 -0
  2. package/dist/cjs/bundle.js +3 -3
  3. package/dist/cjs/bundle.js.map +1 -1
  4. package/dist/cjs/types/components/DatePicker/DatePicker.d.ts +2 -1
  5. package/dist/cjs/types/components/DatePicker/DatePicker.stories.d.ts +720 -1
  6. package/dist/cjs/types/components/Dropdown/Dropdown.d.ts +2 -0
  7. package/dist/cjs/types/components/Dropdown/Dropdown.stories.d.ts +8 -0
  8. package/dist/cjs/types/components/InputFilter/InputFilter.d.ts +5 -0
  9. package/dist/cjs/types/components/InputFilter/InputFilter.stories.d.ts +334 -0
  10. package/dist/cjs/types/components/InputFilter/InputFilter.styles.d.ts +7 -0
  11. package/dist/cjs/types/components/Search/Search.d.ts +2 -20
  12. package/dist/cjs/types/components/Search/Search.stories.d.ts +20 -38
  13. package/dist/cjs/types/components/TextInput/TextInput.d.ts +10 -0
  14. package/dist/cjs/types/components/TextInput/TextInput.stories.d.ts +10 -0
  15. package/dist/cjs/types/components/TextInput/TextInput.styles.d.ts +1 -0
  16. package/dist/cjs/types/index.d.ts +1 -0
  17. package/dist/components/DatePicker/DatePicker.js +16 -3
  18. package/dist/components/Dropdown/Dropdown.js +26 -15
  19. package/dist/components/Dropdown/Dropdown.stories.js +1 -0
  20. package/dist/components/InputFilter/InputFilter.js +18 -0
  21. package/dist/components/InputFilter/InputFilter.stories.js +33 -0
  22. package/dist/components/InputFilter/InputFilter.styles.js +60 -0
  23. package/dist/components/Search/Search.js +1 -1
  24. package/dist/components/TextInput/TextInput.js +22 -6
  25. package/dist/components/TextInput/TextInput.styles.js +84 -11
  26. package/dist/esm/bundle.css +40 -0
  27. package/dist/esm/bundle.js +3 -3
  28. package/dist/esm/bundle.js.map +1 -1
  29. package/dist/esm/types/components/DatePicker/DatePicker.d.ts +2 -1
  30. package/dist/esm/types/components/DatePicker/DatePicker.stories.d.ts +720 -1
  31. package/dist/esm/types/components/Dropdown/Dropdown.d.ts +2 -0
  32. package/dist/esm/types/components/Dropdown/Dropdown.stories.d.ts +8 -0
  33. package/dist/esm/types/components/InputFilter/InputFilter.d.ts +5 -0
  34. package/dist/esm/types/components/InputFilter/InputFilter.stories.d.ts +334 -0
  35. package/dist/esm/types/components/InputFilter/InputFilter.styles.d.ts +7 -0
  36. package/dist/esm/types/components/Search/Search.d.ts +2 -20
  37. package/dist/esm/types/components/Search/Search.stories.d.ts +20 -38
  38. package/dist/esm/types/components/TextInput/TextInput.d.ts +10 -0
  39. package/dist/esm/types/components/TextInput/TextInput.stories.d.ts +10 -0
  40. package/dist/esm/types/components/TextInput/TextInput.styles.d.ts +1 -0
  41. package/dist/esm/types/index.d.ts +1 -0
  42. package/dist/index.d.ts +19 -22
  43. package/dist/index.js +1 -0
  44. package/dist/src/theme/global.css +65 -0
  45. package/dist/theme/tokens/components/action-button.css +13 -0
  46. package/package.json +1 -1
  47. package/src/components/DatePicker/DatePicker.tsx +8 -3
  48. package/src/components/Dropdown/Dropdown.stories.tsx +1 -0
  49. package/src/components/Dropdown/Dropdown.tsx +51 -34
  50. package/src/components/InputFilter/InputFilter.stories.tsx +71 -0
  51. package/src/components/InputFilter/InputFilter.styles.ts +69 -0
  52. package/src/components/InputFilter/InputFilter.tsx +55 -0
  53. package/src/components/Search/Search.stories.tsx +1 -1
  54. package/src/components/Search/Search.tsx +13 -2
  55. package/src/components/TextInput/TextInput.styles.ts +84 -11
  56. package/src/components/TextInput/TextInput.tsx +51 -10
  57. package/src/index.ts +1 -0
  58. package/src/theme/tokens/components/action-button.css +13 -0
@@ -29,6 +29,7 @@ export type DropdownProps = {
29
29
  value?: Options;
30
30
  onChangeText?: InputProps["onChange"];
31
31
  onSelect?: (value: Options) => void;
32
+ renderOptions?: (optionsFiltered: Options[]) => ReactNode;
32
33
  } & Omit<InputProps, "value">;
33
34
  declare const Dropdown: React.ForwardRefExoticComponent<{
34
35
  id?: string | undefined;
@@ -48,5 +49,6 @@ declare const Dropdown: React.ForwardRefExoticComponent<{
48
49
  value?: Options | undefined;
49
50
  onChangeText?: InputProps["onChange"];
50
51
  onSelect?: ((value: Options) => void) | undefined;
52
+ renderOptions?: ((optionsFiltered: Options[]) => ReactNode) | undefined;
51
53
  } & Omit<InputProps, "value"> & React.RefAttributes<HTMLInputElement>>;
52
54
  export default Dropdown;
@@ -20,6 +20,7 @@ declare const meta: {
20
20
  value?: Options | undefined;
21
21
  onChangeText?: React.ChangeEventHandler<HTMLInputElement> | undefined;
22
22
  onSelect?: ((value: Options) => void) | undefined;
23
+ renderOptions?: ((optionsFiltered: Options[]) => React.ReactNode) | undefined;
23
24
  } & Omit<import("../..").InputProps, "value"> & React.RefAttributes<HTMLInputElement>>;
24
25
  tags: string[];
25
26
  parameters: {
@@ -43,6 +44,7 @@ declare const meta: {
43
44
  value?: Options | undefined;
44
45
  onChangeText?: React.ChangeEventHandler<HTMLInputElement> | undefined;
45
46
  onSelect?: (((value: Options) => void) & React.ReactEventHandler<HTMLInputElement>) | undefined;
47
+ renderOptions?: ((optionsFiltered: Options[]) => React.ReactNode) | undefined;
46
48
  suppressHydrationWarning?: boolean | undefined;
47
49
  color?: string | undefined;
48
50
  height?: string | number | undefined;
@@ -323,6 +325,7 @@ declare const meta: {
323
325
  is?: string | undefined;
324
326
  hasClearIcon?: boolean | undefined;
325
327
  hasSearchIcon?: boolean | undefined;
328
+ isFloatingLabel?: boolean | undefined;
326
329
  accept?: string | undefined;
327
330
  alt?: string | undefined;
328
331
  autoComplete?: React.HTMLInputAutoCompleteAttribute | undefined;
@@ -336,7 +339,11 @@ declare const meta: {
336
339
  placeholder?: string | undefined;
337
340
  readOnly?: boolean | undefined;
338
341
  src?: string | undefined;
342
+ keepCloseIconOnValue?: boolean | undefined;
339
343
  labelClassName?: string | undefined;
344
+ onClickEndIcon?: (() => void) | undefined;
345
+ renderEndIcon?: (() => React.ReactNode) | undefined;
346
+ onClickStartIcon?: (() => void) | undefined;
340
347
  ref?: React.LegacyRef<HTMLInputElement> | undefined;
341
348
  key?: React.Key | null | undefined;
342
349
  }>) => import("react/jsx-runtime").JSX.Element)[];
@@ -346,6 +353,7 @@ export declare const Default: {
346
353
  args: {
347
354
  label: string;
348
355
  fullwidth: boolean;
356
+ isFloatingLabel: boolean;
349
357
  options: Options[];
350
358
  };
351
359
  render: (args: {}) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,5 @@
1
+ import React from "react";
2
+ import { DropdownProps } from "../Dropdown/Dropdown";
3
+ export type InputFilterProps = Omit<DropdownProps, "isFloatingLabel" | "keepCloseIconOnValue" | "hasClearIcon" | "hasSearchIcon" | "endIcon" | "filterMode" | "isFloatingLabel">;
4
+ declare const InputFilter: React.ForwardRefExoticComponent<InputFilterProps & React.RefAttributes<HTMLInputElement>>;
5
+ export { InputFilter };
@@ -0,0 +1,334 @@
1
+ import React from "react";
2
+ import { Options } from "../Dropdown/Dropdown";
3
+ declare const meta: {
4
+ title: string;
5
+ component: React.ForwardRefExoticComponent<import("./InputFilter").InputFilterProps & React.RefAttributes<HTMLInputElement>>;
6
+ tags: string[];
7
+ parameters: {
8
+ layout: string;
9
+ };
10
+ decorators: ((Story: import("@storybook/types").PartialStoryFn<import("@storybook/react").ReactRenderer, {
11
+ variant?: "outline" | "flat" | "underline" | undefined;
12
+ suppressHydrationWarning?: boolean | undefined;
13
+ className?: string | undefined;
14
+ color?: string | undefined;
15
+ height?: string | number | undefined;
16
+ id?: string | undefined;
17
+ lang?: string | undefined;
18
+ max?: string | number | undefined;
19
+ min?: string | number | undefined;
20
+ name?: string | undefined;
21
+ style?: React.CSSProperties | undefined;
22
+ type?: React.HTMLInputTypeAttribute | undefined;
23
+ width?: string | number | undefined;
24
+ role?: React.AriaRole | undefined;
25
+ tabIndex?: number | undefined;
26
+ "aria-activedescendant"?: string | undefined;
27
+ "aria-atomic"?: (boolean | "true" | "false") | undefined;
28
+ "aria-autocomplete"?: "list" | "none" | "inline" | "both" | undefined;
29
+ "aria-braillelabel"?: string | undefined;
30
+ "aria-brailleroledescription"?: string | undefined;
31
+ "aria-busy"?: (boolean | "true" | "false") | undefined;
32
+ "aria-checked"?: boolean | "true" | "false" | "mixed" | undefined;
33
+ "aria-colcount"?: number | undefined;
34
+ "aria-colindex"?: number | undefined;
35
+ "aria-colindextext"?: string | undefined;
36
+ "aria-colspan"?: number | undefined;
37
+ "aria-controls"?: string | undefined;
38
+ "aria-current"?: boolean | "true" | "false" | "page" | "step" | "location" | "date" | "time" | undefined;
39
+ "aria-describedby"?: string | undefined;
40
+ "aria-description"?: string | undefined;
41
+ "aria-details"?: string | undefined;
42
+ "aria-disabled"?: (boolean | "true" | "false") | undefined;
43
+ "aria-dropeffect"?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
44
+ "aria-errormessage"?: string | undefined;
45
+ "aria-expanded"?: (boolean | "true" | "false") | undefined;
46
+ "aria-flowto"?: string | undefined;
47
+ "aria-grabbed"?: (boolean | "true" | "false") | undefined;
48
+ "aria-haspopup"?: boolean | "dialog" | "grid" | "listbox" | "menu" | "tree" | "true" | "false" | undefined;
49
+ "aria-hidden"?: (boolean | "true" | "false") | undefined;
50
+ "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
51
+ "aria-keyshortcuts"?: string | undefined;
52
+ "aria-label"?: string | undefined;
53
+ "aria-labelledby"?: string | undefined;
54
+ "aria-level"?: number | undefined;
55
+ "aria-live"?: "off" | "assertive" | "polite" | undefined;
56
+ "aria-modal"?: (boolean | "true" | "false") | undefined;
57
+ "aria-multiline"?: (boolean | "true" | "false") | undefined;
58
+ "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
59
+ "aria-orientation"?: "horizontal" | "vertical" | undefined;
60
+ "aria-owns"?: string | undefined;
61
+ "aria-placeholder"?: string | undefined;
62
+ "aria-posinset"?: number | undefined;
63
+ "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
64
+ "aria-readonly"?: (boolean | "true" | "false") | undefined;
65
+ "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
66
+ "aria-required"?: (boolean | "true" | "false") | undefined;
67
+ "aria-roledescription"?: string | undefined;
68
+ "aria-rowcount"?: number | undefined;
69
+ "aria-rowindex"?: number | undefined;
70
+ "aria-rowindextext"?: string | undefined;
71
+ "aria-rowspan"?: number | undefined;
72
+ "aria-selected"?: (boolean | "true" | "false") | undefined;
73
+ "aria-setsize"?: number | undefined;
74
+ "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
75
+ "aria-valuemax"?: number | undefined;
76
+ "aria-valuemin"?: number | undefined;
77
+ "aria-valuenow"?: number | undefined;
78
+ "aria-valuetext"?: string | undefined;
79
+ children?: React.ReactNode;
80
+ dangerouslySetInnerHTML?: {
81
+ __html: string | TrustedHTML;
82
+ } | undefined;
83
+ onCopy?: React.ClipboardEventHandler<HTMLInputElement> | undefined;
84
+ onCopyCapture?: React.ClipboardEventHandler<HTMLInputElement> | undefined;
85
+ onCut?: React.ClipboardEventHandler<HTMLInputElement> | undefined;
86
+ onCutCapture?: React.ClipboardEventHandler<HTMLInputElement> | undefined;
87
+ onPaste?: React.ClipboardEventHandler<HTMLInputElement> | undefined;
88
+ onPasteCapture?: React.ClipboardEventHandler<HTMLInputElement> | undefined;
89
+ onCompositionEnd?: React.CompositionEventHandler<HTMLInputElement> | undefined;
90
+ onCompositionEndCapture?: React.CompositionEventHandler<HTMLInputElement> | undefined;
91
+ onCompositionStart?: React.CompositionEventHandler<HTMLInputElement> | undefined;
92
+ onCompositionStartCapture?: React.CompositionEventHandler<HTMLInputElement> | undefined;
93
+ onCompositionUpdate?: React.CompositionEventHandler<HTMLInputElement> | undefined;
94
+ onCompositionUpdateCapture?: React.CompositionEventHandler<HTMLInputElement> | undefined;
95
+ onFocus?: React.FocusEventHandler<HTMLInputElement> | undefined;
96
+ onFocusCapture?: React.FocusEventHandler<HTMLInputElement> | undefined;
97
+ onBlur?: React.FocusEventHandler<HTMLInputElement> | undefined;
98
+ onBlurCapture?: React.FocusEventHandler<HTMLInputElement> | undefined;
99
+ onChange?: React.ChangeEventHandler<HTMLInputElement> | undefined;
100
+ onChangeCapture?: React.FormEventHandler<HTMLInputElement> | undefined;
101
+ onBeforeInput?: React.FormEventHandler<HTMLInputElement> | undefined;
102
+ onBeforeInputCapture?: React.FormEventHandler<HTMLInputElement> | undefined;
103
+ onInput?: React.FormEventHandler<HTMLInputElement> | undefined;
104
+ onInputCapture?: React.FormEventHandler<HTMLInputElement> | undefined;
105
+ onReset?: React.FormEventHandler<HTMLInputElement> | undefined;
106
+ onResetCapture?: React.FormEventHandler<HTMLInputElement> | undefined;
107
+ onSubmit?: React.FormEventHandler<HTMLInputElement> | undefined;
108
+ onSubmitCapture?: React.FormEventHandler<HTMLInputElement> | undefined;
109
+ onInvalid?: React.FormEventHandler<HTMLInputElement> | undefined;
110
+ onInvalidCapture?: React.FormEventHandler<HTMLInputElement> | undefined;
111
+ onLoad?: React.ReactEventHandler<HTMLInputElement> | undefined;
112
+ onLoadCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
113
+ onError?: React.ReactEventHandler<HTMLInputElement> | undefined;
114
+ onErrorCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
115
+ onKeyDown?: React.KeyboardEventHandler<HTMLInputElement> | undefined;
116
+ onKeyDownCapture?: React.KeyboardEventHandler<HTMLInputElement> | undefined;
117
+ onKeyPress?: React.KeyboardEventHandler<HTMLInputElement> | undefined;
118
+ onKeyPressCapture?: React.KeyboardEventHandler<HTMLInputElement> | undefined;
119
+ onKeyUp?: React.KeyboardEventHandler<HTMLInputElement> | undefined;
120
+ onKeyUpCapture?: React.KeyboardEventHandler<HTMLInputElement> | undefined;
121
+ onAbort?: React.ReactEventHandler<HTMLInputElement> | undefined;
122
+ onAbortCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
123
+ onCanPlay?: React.ReactEventHandler<HTMLInputElement> | undefined;
124
+ onCanPlayCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
125
+ onCanPlayThrough?: React.ReactEventHandler<HTMLInputElement> | undefined;
126
+ onCanPlayThroughCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
127
+ onDurationChange?: React.ReactEventHandler<HTMLInputElement> | undefined;
128
+ onDurationChangeCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
129
+ onEmptied?: React.ReactEventHandler<HTMLInputElement> | undefined;
130
+ onEmptiedCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
131
+ onEncrypted?: React.ReactEventHandler<HTMLInputElement> | undefined;
132
+ onEncryptedCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
133
+ onEnded?: React.ReactEventHandler<HTMLInputElement> | undefined;
134
+ onEndedCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
135
+ onLoadedData?: React.ReactEventHandler<HTMLInputElement> | undefined;
136
+ onLoadedDataCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
137
+ onLoadedMetadata?: React.ReactEventHandler<HTMLInputElement> | undefined;
138
+ onLoadedMetadataCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
139
+ onLoadStart?: React.ReactEventHandler<HTMLInputElement> | undefined;
140
+ onLoadStartCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
141
+ onPause?: React.ReactEventHandler<HTMLInputElement> | undefined;
142
+ onPauseCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
143
+ onPlay?: React.ReactEventHandler<HTMLInputElement> | undefined;
144
+ onPlayCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
145
+ onPlaying?: React.ReactEventHandler<HTMLInputElement> | undefined;
146
+ onPlayingCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
147
+ onProgress?: React.ReactEventHandler<HTMLInputElement> | undefined;
148
+ onProgressCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
149
+ onRateChange?: React.ReactEventHandler<HTMLInputElement> | undefined;
150
+ onRateChangeCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
151
+ onResize?: React.ReactEventHandler<HTMLInputElement> | undefined;
152
+ onResizeCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
153
+ onSeeked?: React.ReactEventHandler<HTMLInputElement> | undefined;
154
+ onSeekedCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
155
+ onSeeking?: React.ReactEventHandler<HTMLInputElement> | undefined;
156
+ onSeekingCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
157
+ onStalled?: React.ReactEventHandler<HTMLInputElement> | undefined;
158
+ onStalledCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
159
+ onSuspend?: React.ReactEventHandler<HTMLInputElement> | undefined;
160
+ onSuspendCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
161
+ onTimeUpdate?: React.ReactEventHandler<HTMLInputElement> | undefined;
162
+ onTimeUpdateCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
163
+ onVolumeChange?: React.ReactEventHandler<HTMLInputElement> | undefined;
164
+ onVolumeChangeCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
165
+ onWaiting?: React.ReactEventHandler<HTMLInputElement> | undefined;
166
+ onWaitingCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
167
+ onAuxClick?: React.MouseEventHandler<HTMLInputElement> | undefined;
168
+ onAuxClickCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
169
+ onClick?: React.MouseEventHandler<HTMLInputElement> | undefined;
170
+ onClickCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
171
+ onContextMenu?: React.MouseEventHandler<HTMLInputElement> | undefined;
172
+ onContextMenuCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
173
+ onDoubleClick?: React.MouseEventHandler<HTMLInputElement> | undefined;
174
+ onDoubleClickCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
175
+ onDrag?: React.DragEventHandler<HTMLInputElement> | undefined;
176
+ onDragCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
177
+ onDragEnd?: React.DragEventHandler<HTMLInputElement> | undefined;
178
+ onDragEndCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
179
+ onDragEnter?: React.DragEventHandler<HTMLInputElement> | undefined;
180
+ onDragEnterCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
181
+ onDragExit?: React.DragEventHandler<HTMLInputElement> | undefined;
182
+ onDragExitCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
183
+ onDragLeave?: React.DragEventHandler<HTMLInputElement> | undefined;
184
+ onDragLeaveCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
185
+ onDragOver?: React.DragEventHandler<HTMLInputElement> | undefined;
186
+ onDragOverCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
187
+ onDragStart?: React.DragEventHandler<HTMLInputElement> | undefined;
188
+ onDragStartCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
189
+ onDrop?: React.DragEventHandler<HTMLInputElement> | undefined;
190
+ onDropCapture?: React.DragEventHandler<HTMLInputElement> | undefined;
191
+ onMouseDown?: React.MouseEventHandler<HTMLInputElement> | undefined;
192
+ onMouseDownCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
193
+ onMouseEnter?: React.MouseEventHandler<HTMLInputElement> | undefined;
194
+ onMouseLeave?: React.MouseEventHandler<HTMLInputElement> | undefined;
195
+ onMouseMove?: React.MouseEventHandler<HTMLInputElement> | undefined;
196
+ onMouseMoveCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
197
+ onMouseOut?: React.MouseEventHandler<HTMLInputElement> | undefined;
198
+ onMouseOutCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
199
+ onMouseOver?: React.MouseEventHandler<HTMLInputElement> | undefined;
200
+ onMouseOverCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
201
+ onMouseUp?: React.MouseEventHandler<HTMLInputElement> | undefined;
202
+ onMouseUpCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
203
+ onSelect?: (((value: Options) => void) & React.ReactEventHandler<HTMLInputElement>) | undefined;
204
+ onSelectCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
205
+ onTouchCancel?: React.TouchEventHandler<HTMLInputElement> | undefined;
206
+ onTouchCancelCapture?: React.TouchEventHandler<HTMLInputElement> | undefined;
207
+ onTouchEnd?: React.TouchEventHandler<HTMLInputElement> | undefined;
208
+ onTouchEndCapture?: React.TouchEventHandler<HTMLInputElement> | undefined;
209
+ onTouchMove?: React.TouchEventHandler<HTMLInputElement> | undefined;
210
+ onTouchMoveCapture?: React.TouchEventHandler<HTMLInputElement> | undefined;
211
+ onTouchStart?: React.TouchEventHandler<HTMLInputElement> | undefined;
212
+ onTouchStartCapture?: React.TouchEventHandler<HTMLInputElement> | undefined;
213
+ onPointerDown?: React.PointerEventHandler<HTMLInputElement> | undefined;
214
+ onPointerDownCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
215
+ onPointerMove?: React.PointerEventHandler<HTMLInputElement> | undefined;
216
+ onPointerMoveCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
217
+ onPointerUp?: React.PointerEventHandler<HTMLInputElement> | undefined;
218
+ onPointerUpCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
219
+ onPointerCancel?: React.PointerEventHandler<HTMLInputElement> | undefined;
220
+ onPointerCancelCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
221
+ onPointerEnter?: React.PointerEventHandler<HTMLInputElement> | undefined;
222
+ onPointerLeave?: React.PointerEventHandler<HTMLInputElement> | undefined;
223
+ onPointerOver?: React.PointerEventHandler<HTMLInputElement> | undefined;
224
+ onPointerOverCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
225
+ onPointerOut?: React.PointerEventHandler<HTMLInputElement> | undefined;
226
+ onPointerOutCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
227
+ onGotPointerCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
228
+ onGotPointerCaptureCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
229
+ onLostPointerCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
230
+ onLostPointerCaptureCapture?: React.PointerEventHandler<HTMLInputElement> | undefined;
231
+ onScroll?: React.UIEventHandler<HTMLInputElement> | undefined;
232
+ onScrollCapture?: React.UIEventHandler<HTMLInputElement> | undefined;
233
+ onWheel?: React.WheelEventHandler<HTMLInputElement> | undefined;
234
+ onWheelCapture?: React.WheelEventHandler<HTMLInputElement> | undefined;
235
+ onAnimationStart?: React.AnimationEventHandler<HTMLInputElement> | undefined;
236
+ onAnimationStartCapture?: React.AnimationEventHandler<HTMLInputElement> | undefined;
237
+ onAnimationEnd?: React.AnimationEventHandler<HTMLInputElement> | undefined;
238
+ onAnimationEndCapture?: React.AnimationEventHandler<HTMLInputElement> | undefined;
239
+ onAnimationIteration?: React.AnimationEventHandler<HTMLInputElement> | undefined;
240
+ onAnimationIterationCapture?: React.AnimationEventHandler<HTMLInputElement> | undefined;
241
+ onTransitionEnd?: React.TransitionEventHandler<HTMLInputElement> | undefined;
242
+ onTransitionEndCapture?: React.TransitionEventHandler<HTMLInputElement> | undefined;
243
+ form?: string | undefined;
244
+ list?: string | undefined;
245
+ step?: string | number | undefined;
246
+ error?: boolean | undefined;
247
+ size?: "sm" | "md" | "lg" | undefined;
248
+ disabled?: boolean | undefined;
249
+ fullwidth?: boolean | undefined;
250
+ title?: string | undefined;
251
+ startIcon?: React.ReactNode;
252
+ formAction?: string | undefined;
253
+ formEncType?: string | undefined;
254
+ formMethod?: string | undefined;
255
+ formNoValidate?: boolean | undefined;
256
+ formTarget?: string | undefined;
257
+ value?: Options | undefined;
258
+ defaultChecked?: boolean | undefined;
259
+ defaultValue?: string | number | readonly string[] | undefined;
260
+ suppressContentEditableWarning?: boolean | undefined;
261
+ accessKey?: string | undefined;
262
+ autoFocus?: boolean | undefined;
263
+ contentEditable?: "inherit" | (boolean | "true" | "false") | "plaintext-only" | undefined;
264
+ contextMenu?: string | undefined;
265
+ dir?: string | undefined;
266
+ draggable?: (boolean | "true" | "false") | undefined;
267
+ hidden?: boolean | undefined;
268
+ nonce?: string | undefined;
269
+ slot?: string | undefined;
270
+ spellCheck?: (boolean | "true" | "false") | undefined;
271
+ translate?: "no" | "yes" | undefined;
272
+ radioGroup?: string | undefined;
273
+ about?: string | undefined;
274
+ content?: string | undefined;
275
+ datatype?: string | undefined;
276
+ inlist?: any;
277
+ prefix?: string | undefined;
278
+ property?: string | undefined;
279
+ rel?: string | undefined;
280
+ resource?: string | undefined;
281
+ rev?: string | undefined;
282
+ typeof?: string | undefined;
283
+ vocab?: string | undefined;
284
+ autoCapitalize?: string | undefined;
285
+ autoCorrect?: string | undefined;
286
+ autoSave?: string | undefined;
287
+ itemProp?: string | undefined;
288
+ itemScope?: boolean | undefined;
289
+ itemType?: string | undefined;
290
+ itemID?: string | undefined;
291
+ itemRef?: string | undefined;
292
+ results?: number | undefined;
293
+ security?: string | undefined;
294
+ unselectable?: "off" | "on" | undefined;
295
+ inputMode?: "none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
296
+ is?: string | undefined;
297
+ rounded?: "none" | "normal" | "full" | undefined;
298
+ accept?: string | undefined;
299
+ alt?: string | undefined;
300
+ autoComplete?: React.HTMLInputAutoCompleteAttribute | undefined;
301
+ capture?: boolean | "user" | "environment" | undefined;
302
+ checked?: boolean | undefined;
303
+ enterKeyHint?: "search" | "enter" | "done" | "go" | "next" | "previous" | "send" | undefined;
304
+ maxLength?: number | undefined;
305
+ minLength?: number | undefined;
306
+ multiple?: boolean | undefined;
307
+ pattern?: string | undefined;
308
+ placeholder?: string | undefined;
309
+ readOnly?: boolean | undefined;
310
+ required?: boolean | undefined;
311
+ src?: string | undefined;
312
+ label?: string | undefined;
313
+ helperText?: string | undefined;
314
+ errorMessage?: string | undefined;
315
+ labelClassName?: string | undefined;
316
+ onClickEndIcon?: (() => void) | undefined;
317
+ renderEndIcon?: (() => React.ReactNode) | undefined;
318
+ onClickStartIcon?: (() => void) | undefined;
319
+ options: Options[];
320
+ onChangeText?: React.ChangeEventHandler<HTMLInputElement> | undefined;
321
+ renderOptions?: ((optionsFiltered: Options[]) => React.ReactNode) | undefined;
322
+ ref?: React.LegacyRef<HTMLInputElement> | undefined;
323
+ key?: React.Key | null | undefined;
324
+ }>) => import("react/jsx-runtime").JSX.Element)[];
325
+ };
326
+ export default meta;
327
+ export declare const Default: {
328
+ args: {
329
+ label: string;
330
+ fullwidth: boolean;
331
+ options: Options[];
332
+ };
333
+ render: (args: {}) => import("react/jsx-runtime").JSX.Element;
334
+ };
@@ -0,0 +1,7 @@
1
+ export declare const filterIconVariant: (props?: ({
2
+ size?: "sm" | "md" | "lg" | null | undefined;
3
+ rounded?: "none" | "normal" | "full" | null | undefined;
4
+ error?: boolean | null | undefined;
5
+ position?: "end" | "start" | null | undefined;
6
+ active?: boolean | null | undefined;
7
+ } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
@@ -1,23 +1,5 @@
1
1
  import React from "react";
2
2
  import { DropdownProps } from "../Dropdown/Dropdown";
3
- export type SearchProps = DropdownProps;
4
- declare const Search: React.ForwardRefExoticComponent<{
5
- id?: string | undefined;
6
- label?: string | undefined;
7
- size?: "sm" | "md" | "lg" | undefined;
8
- rounded?: "none" | "normal" | "full" | undefined;
9
- variant?: "outline" | "flat" | "underline" | undefined;
10
- helperText?: string | undefined;
11
- errorMessage?: string | undefined;
12
- filterMode?: boolean | undefined;
13
- fullwidth?: boolean | undefined;
14
- disabled?: boolean | undefined;
15
- error?: boolean | undefined;
16
- required?: boolean | undefined;
17
- className?: string | undefined;
18
- options: import("../Dropdown/Dropdown").Options[];
19
- value?: import("../Dropdown/Dropdown").Options | undefined;
20
- onChangeText?: React.ChangeEventHandler<HTMLInputElement> | undefined;
21
- onSelect?: ((value: import("../Dropdown/Dropdown").Options) => void) | undefined;
22
- } & Omit<import("../..").InputProps, "value"> & React.RefAttributes<HTMLInputElement>>;
3
+ export type SearchProps = Omit<DropdownProps, "isFloatingLabel" | "keepCloseIconOnValue" | "hasClearIcon" | "hasSearchIcon" | "endIcon" | "filterMode" | "isFloatingLabel">;
4
+ declare const Search: React.ForwardRefExoticComponent<SearchProps & React.RefAttributes<HTMLInputElement>>;
23
5
  export { Search };
@@ -2,50 +2,18 @@ import React from "react";
2
2
  import { Options } from "../Dropdown/Dropdown";
3
3
  declare const meta: {
4
4
  title: string;
5
- component: React.ForwardRefExoticComponent<{
6
- id?: string | undefined;
7
- label?: string | undefined;
8
- size?: "sm" | "md" | "lg" | undefined;
9
- rounded?: "none" | "normal" | "full" | undefined;
10
- variant?: "outline" | "flat" | "underline" | undefined;
11
- helperText?: string | undefined;
12
- errorMessage?: string | undefined;
13
- filterMode?: boolean | undefined;
14
- fullwidth?: boolean | undefined;
15
- disabled?: boolean | undefined;
16
- error?: boolean | undefined;
17
- required?: boolean | undefined;
18
- className?: string | undefined;
19
- options: Options[];
20
- value?: Options | undefined;
21
- onChangeText?: React.ChangeEventHandler<HTMLInputElement> | undefined;
22
- onSelect?: ((value: Options) => void) | undefined;
23
- } & Omit<import("../..").InputProps, "value"> & React.RefAttributes<HTMLInputElement>>;
5
+ component: React.ForwardRefExoticComponent<import("./Search").SearchProps & React.RefAttributes<HTMLInputElement>>;
24
6
  tags: string[];
25
7
  parameters: {
26
8
  layout: string;
27
9
  };
28
10
  decorators: ((Story: import("@storybook/types").PartialStoryFn<import("@storybook/react").ReactRenderer, {
29
- id?: string | undefined;
30
- label?: string | undefined;
31
- size?: "sm" | "md" | "lg" | undefined;
32
- rounded?: "none" | "normal" | "full" | undefined;
33
11
  variant?: "outline" | "flat" | "underline" | undefined;
34
- helperText?: string | undefined;
35
- errorMessage?: string | undefined;
36
- filterMode?: boolean | undefined;
37
- fullwidth?: boolean | undefined;
38
- disabled?: boolean | undefined;
39
- error?: boolean | undefined;
40
- required?: boolean | undefined;
41
- className?: string | undefined;
42
- options: Options[];
43
- value?: Options | undefined;
44
- onChangeText?: React.ChangeEventHandler<HTMLInputElement> | undefined;
45
- onSelect?: (((value: Options) => void) & React.ReactEventHandler<HTMLInputElement>) | undefined;
46
12
  suppressHydrationWarning?: boolean | undefined;
13
+ className?: string | undefined;
47
14
  color?: string | undefined;
48
15
  height?: string | number | undefined;
16
+ id?: string | undefined;
49
17
  lang?: string | undefined;
50
18
  max?: string | number | undefined;
51
19
  min?: string | number | undefined;
@@ -232,6 +200,7 @@ declare const meta: {
232
200
  onMouseOverCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
233
201
  onMouseUp?: React.MouseEventHandler<HTMLInputElement> | undefined;
234
202
  onMouseUpCapture?: React.MouseEventHandler<HTMLInputElement> | undefined;
203
+ onSelect?: (((value: Options) => void) & React.ReactEventHandler<HTMLInputElement>) | undefined;
235
204
  onSelectCapture?: React.ReactEventHandler<HTMLInputElement> | undefined;
236
205
  onTouchCancel?: React.TouchEventHandler<HTMLInputElement> | undefined;
237
206
  onTouchCancelCapture?: React.TouchEventHandler<HTMLInputElement> | undefined;
@@ -274,14 +243,18 @@ declare const meta: {
274
243
  form?: string | undefined;
275
244
  list?: string | undefined;
276
245
  step?: string | number | undefined;
246
+ error?: boolean | undefined;
247
+ size?: "sm" | "md" | "lg" | undefined;
248
+ disabled?: boolean | undefined;
249
+ fullwidth?: boolean | undefined;
277
250
  title?: string | undefined;
278
251
  startIcon?: React.ReactNode;
279
- endIcon?: React.ReactNode;
280
252
  formAction?: string | undefined;
281
253
  formEncType?: string | undefined;
282
254
  formMethod?: string | undefined;
283
255
  formNoValidate?: boolean | undefined;
284
256
  formTarget?: string | undefined;
257
+ value?: Options | undefined;
285
258
  defaultChecked?: boolean | undefined;
286
259
  defaultValue?: string | number | readonly string[] | undefined;
287
260
  suppressContentEditableWarning?: boolean | undefined;
@@ -321,8 +294,7 @@ declare const meta: {
321
294
  unselectable?: "off" | "on" | undefined;
322
295
  inputMode?: "none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
323
296
  is?: string | undefined;
324
- hasClearIcon?: boolean | undefined;
325
- hasSearchIcon?: boolean | undefined;
297
+ rounded?: "none" | "normal" | "full" | undefined;
326
298
  accept?: string | undefined;
327
299
  alt?: string | undefined;
328
300
  autoComplete?: React.HTMLInputAutoCompleteAttribute | undefined;
@@ -335,8 +307,18 @@ declare const meta: {
335
307
  pattern?: string | undefined;
336
308
  placeholder?: string | undefined;
337
309
  readOnly?: boolean | undefined;
310
+ required?: boolean | undefined;
338
311
  src?: string | undefined;
312
+ label?: string | undefined;
313
+ helperText?: string | undefined;
314
+ errorMessage?: string | undefined;
339
315
  labelClassName?: string | undefined;
316
+ onClickEndIcon?: (() => void) | undefined;
317
+ renderEndIcon?: (() => React.ReactNode) | undefined;
318
+ onClickStartIcon?: (() => void) | undefined;
319
+ options: Options[];
320
+ onChangeText?: React.ChangeEventHandler<HTMLInputElement> | undefined;
321
+ renderOptions?: ((optionsFiltered: Options[]) => React.ReactNode) | undefined;
340
322
  ref?: React.LegacyRef<HTMLInputElement> | undefined;
341
323
  key?: React.Key | null | undefined;
342
324
  }>) => import("react/jsx-runtime").JSX.Element)[];
@@ -12,12 +12,17 @@ export type InputProps = {
12
12
  disabled?: boolean;
13
13
  error?: boolean;
14
14
  required?: boolean;
15
+ isFloatingLabel?: boolean;
16
+ keepCloseIconOnValue?: boolean;
15
17
  hasClearIcon?: boolean;
16
18
  hasSearchIcon?: boolean;
17
19
  startIcon?: ReactNode;
18
20
  endIcon?: ReactNode;
19
21
  className?: string;
20
22
  labelClassName?: string;
23
+ onClickStartIcon?: () => void;
24
+ onClickEndIcon?: () => void;
25
+ renderEndIcon?: () => ReactNode;
21
26
  } & Omit<React.InputHTMLAttributes<HTMLInputElement>, "size">;
22
27
  export declare const TextInput: React.ForwardRefExoticComponent<{
23
28
  id?: string | undefined;
@@ -32,11 +37,16 @@ export declare const TextInput: React.ForwardRefExoticComponent<{
32
37
  disabled?: boolean | undefined;
33
38
  error?: boolean | undefined;
34
39
  required?: boolean | undefined;
40
+ isFloatingLabel?: boolean | undefined;
41
+ keepCloseIconOnValue?: boolean | undefined;
35
42
  hasClearIcon?: boolean | undefined;
36
43
  hasSearchIcon?: boolean | undefined;
37
44
  startIcon?: ReactNode;
38
45
  endIcon?: ReactNode;
39
46
  className?: string | undefined;
40
47
  labelClassName?: string | undefined;
48
+ onClickStartIcon?: (() => void) | undefined;
49
+ onClickEndIcon?: (() => void) | undefined;
50
+ renderEndIcon?: (() => ReactNode) | undefined;
41
51
  } & Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> & React.RefAttributes<HTMLInputElement>>;
42
52
  export default TextInput;
@@ -14,12 +14,17 @@ declare const meta: {
14
14
  disabled?: boolean | undefined;
15
15
  error?: boolean | undefined;
16
16
  required?: boolean | undefined;
17
+ isFloatingLabel?: boolean | undefined;
18
+ keepCloseIconOnValue?: boolean | undefined;
17
19
  hasClearIcon?: boolean | undefined;
18
20
  hasSearchIcon?: boolean | undefined;
19
21
  startIcon?: React.ReactNode;
20
22
  endIcon?: React.ReactNode;
21
23
  className?: string | undefined;
22
24
  labelClassName?: string | undefined;
25
+ onClickStartIcon?: (() => void) | undefined;
26
+ onClickEndIcon?: (() => void) | undefined;
27
+ renderEndIcon?: (() => React.ReactNode) | undefined;
23
28
  } & Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> & React.RefAttributes<HTMLInputElement>>;
24
29
  tags: string[];
25
30
  parameters: {
@@ -38,12 +43,17 @@ declare const meta: {
38
43
  disabled?: boolean | undefined;
39
44
  error?: boolean | undefined;
40
45
  required?: boolean | undefined;
46
+ isFloatingLabel?: boolean | undefined;
47
+ keepCloseIconOnValue?: boolean | undefined;
41
48
  hasClearIcon?: boolean | undefined;
42
49
  hasSearchIcon?: boolean | undefined;
43
50
  startIcon?: React.ReactNode;
44
51
  endIcon?: React.ReactNode;
45
52
  className?: string | undefined;
46
53
  labelClassName?: string | undefined;
54
+ onClickStartIcon?: (() => void) | undefined;
55
+ onClickEndIcon?: (() => void) | undefined;
56
+ renderEndIcon?: (() => React.ReactNode) | undefined;
47
57
  suppressHydrationWarning?: boolean | undefined;
48
58
  color?: string | undefined;
49
59
  height?: string | number | undefined;
@@ -15,6 +15,7 @@ export declare const labelVariant: (props?: ({
15
15
  disabled?: boolean | null | undefined;
16
16
  error?: boolean | null | undefined;
17
17
  hasSearchIcon?: boolean | null | undefined;
18
+ isFloatingLabel?: boolean | null | undefined;
18
19
  } & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
19
20
  export declare const helperTextVariant: (props?: ({
20
21
  size?: "sm" | "md" | "lg" | null | undefined;
@@ -23,6 +23,7 @@ export * from "./components/DataTable/DataTable";
23
23
  export * from "./components/Dialog/Dialog";
24
24
  export * from "./components/AlertDialog/AlertDialog";
25
25
  export * from "./components/Search/Search";
26
+ export * from "./components/InputFilter/InputFilter";
26
27
  export * from "./components/Slider/Slider";
27
28
  export * from "./components/Switch/Switch";
28
29
  export * from "./components/DropdownMenu/DropdownMenu";