@jamsrui/input 0.0.22 → 0.1.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.
package/README.md CHANGED
@@ -2,12 +2,11 @@
2
2
 
3
3
  **A comprehensive React UI component library designed for developers, with Tailwind CSS integration for seamless styling.**
4
4
 
5
-
6
5
  ## 📖 **Overview**
7
6
 
8
7
  [JamsrUI](https://jamsr-ui.jamsrworld.com) is designed to help developers build modern, fast and visually appealing web applications with ease.
9
8
 
10
- ## 🚀 Getting Started
9
+ ## 🚀 Getting Started
11
10
 
12
11
  Boost & Build your websites using [JamsrUI](https://jamsr-ui.jamsrworld.com).
13
12
 
@@ -37,4 +36,3 @@ We welcome contributions from developers of all skill levels!
37
36
  ## ⭐ Support the Project
38
37
 
39
38
  If you find **JamsrUI** helpful, consider giving it a ⭐ on [GitHub](https://github.com/jamsrworld/jamsr-ui).
40
-
package/dist/index.d.mts CHANGED
@@ -1,5 +1,5 @@
1
1
  export { Input } from './input.mjs';
2
2
  import 'react/jsx-runtime';
3
3
  import './use-input.mjs';
4
+ import 'react';
4
5
  import '@jamsrui/utils';
5
- import './styles.mjs';
package/dist/input.d.mts CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import { useInput } from './use-input.mjs';
3
+ import 'react';
3
4
  import '@jamsrui/utils';
4
- import './styles.mjs';
5
5
 
6
6
  declare const Input: (props: Input.Props) => react_jsx_runtime.JSX.Element;
7
7
  declare namespace Input {
package/dist/input.mjs CHANGED
@@ -1 +1 @@
1
- "use client";import{jsx as i}from"react/jsx-runtime";import{mergeConfigProps as r}from"@jamsrui/utils";import{useInputConfig as e}from"./input-config.mjs";import{inputVariants as s}from"./styles.mjs";import{useInput as u}from"./use-input.mjs";const I=t=>{const o=e(),p=r(s.defaultVariants,o,t),{getInputProps:n}=u(p);return i("input",{...n({})})};export{I as Input};
1
+ "use client";import{jsx as n}from"react/jsx-runtime";import{useInput as e}from"./use-input.mjs";const r=p=>{const{getInputProps:t}=e(p);return n("input",{...t()})};export{r as Input};
@@ -1,11 +1,323 @@
1
- import { PropGetter, UIProps } from '@jamsrui/utils';
2
- import { InputVariantProps } from './styles.mjs';
1
+ import * as react from 'react';
2
+ import { UIProps } from '@jamsrui/utils';
3
3
 
4
4
  declare const useInput: (props: useInput.Props) => {
5
- getInputProps: PropGetter<UIProps<"input">>;
5
+ getInputProps: () => {
6
+ value: string;
7
+ onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
8
+ ref: react.Ref<HTMLInputElement>;
9
+ "data-hovered": boolean | "true" | "false";
10
+ "data-focus-visible": boolean | "true" | "false";
11
+ "data-invalid": boolean | "true" | "false";
12
+ disabled: boolean;
13
+ form?: string | undefined | undefined;
14
+ style?: react.CSSProperties | undefined;
15
+ title?: string | undefined | undefined;
16
+ pattern?: string | undefined | undefined;
17
+ key?: react.Key | null | undefined;
18
+ accept?: string | undefined | undefined;
19
+ alt?: string | undefined | undefined;
20
+ autoComplete?: react.HTMLInputAutoCompleteAttribute | undefined;
21
+ capture?: boolean | "user" | "environment" | undefined | undefined;
22
+ checked?: boolean | undefined | undefined;
23
+ formAction?: string | ((formData: FormData) => void | Promise<void>) | undefined;
24
+ formEncType?: string | undefined | undefined;
25
+ formMethod?: string | undefined | undefined;
26
+ formNoValidate?: boolean | undefined | undefined;
27
+ formTarget?: string | undefined | undefined;
28
+ height?: number | string | undefined | undefined;
29
+ list?: string | undefined | undefined;
30
+ max?: number | string | undefined | undefined;
31
+ maxLength?: number | undefined | undefined;
32
+ min?: number | string | undefined | undefined;
33
+ minLength?: number | undefined | undefined;
34
+ multiple?: boolean | undefined | undefined;
35
+ name?: string | undefined | undefined;
36
+ placeholder?: string | undefined | undefined;
37
+ readOnly?: boolean | undefined | undefined;
38
+ required?: boolean | undefined | undefined;
39
+ src?: string | undefined | undefined;
40
+ step?: number | string | undefined | undefined;
41
+ type?: react.HTMLInputTypeAttribute | undefined;
42
+ width?: number | string | undefined | undefined;
43
+ suppressContentEditableWarning?: boolean | undefined | undefined;
44
+ suppressHydrationWarning?: boolean | undefined | undefined;
45
+ accessKey?: string | undefined | undefined;
46
+ autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
47
+ autoFocus?: boolean | undefined | undefined;
48
+ contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
49
+ contextMenu?: string | undefined | undefined;
50
+ dir?: string | undefined | undefined;
51
+ draggable?: (boolean | "true" | "false") | undefined;
52
+ enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
53
+ hidden?: boolean | undefined | undefined;
54
+ id?: string | undefined;
55
+ lang?: string | undefined | undefined;
56
+ nonce?: string | undefined | undefined;
57
+ spellCheck?: (boolean | "true" | "false") | undefined;
58
+ tabIndex?: number | undefined | undefined;
59
+ translate?: "yes" | "no" | undefined | undefined;
60
+ radioGroup?: string | undefined | undefined;
61
+ role?: react.AriaRole | undefined;
62
+ about?: string | undefined | undefined;
63
+ content?: string | undefined | undefined;
64
+ datatype?: string | undefined | undefined;
65
+ inlist?: any;
66
+ prefix?: string | undefined | undefined;
67
+ property?: string | undefined | undefined;
68
+ rel?: string | undefined | undefined;
69
+ resource?: string | undefined | undefined;
70
+ rev?: string | undefined | undefined;
71
+ typeof?: string | undefined | undefined;
72
+ vocab?: string | undefined | undefined;
73
+ autoCorrect?: string | undefined | undefined;
74
+ autoSave?: string | undefined | undefined;
75
+ itemProp?: string | undefined | undefined;
76
+ itemScope?: boolean | undefined | undefined;
77
+ itemType?: string | undefined | undefined;
78
+ itemID?: string | undefined | undefined;
79
+ itemRef?: string | undefined | undefined;
80
+ results?: number | undefined | undefined;
81
+ security?: string | undefined | undefined;
82
+ unselectable?: "on" | "off" | undefined | undefined;
83
+ popover?: "" | "auto" | "manual" | "hint" | undefined | undefined;
84
+ popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
85
+ popoverTarget?: string | undefined | undefined;
86
+ inert?: boolean | undefined | undefined;
87
+ inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
88
+ is?: string | undefined | undefined;
89
+ exportparts?: string | undefined | undefined;
90
+ part?: string | undefined | undefined;
91
+ "aria-activedescendant"?: string | undefined | undefined;
92
+ "aria-atomic"?: (boolean | "true" | "false") | undefined;
93
+ "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
94
+ "aria-braillelabel"?: string | undefined | undefined;
95
+ "aria-brailleroledescription"?: string | undefined | undefined;
96
+ "aria-busy"?: (boolean | "true" | "false") | undefined;
97
+ "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
98
+ "aria-colcount"?: number | undefined | undefined;
99
+ "aria-colindex"?: number | undefined | undefined;
100
+ "aria-colindextext"?: string | undefined | undefined;
101
+ "aria-colspan"?: number | undefined | undefined;
102
+ "aria-controls"?: string | undefined | undefined;
103
+ "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
104
+ "aria-describedby"?: string | undefined;
105
+ "aria-description"?: string | undefined | undefined;
106
+ "aria-details"?: string | undefined | undefined;
107
+ "aria-disabled"?: (boolean | "true" | "false") | undefined;
108
+ "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
109
+ "aria-errormessage"?: string | undefined | undefined;
110
+ "aria-expanded"?: (boolean | "true" | "false") | undefined;
111
+ "aria-flowto"?: string | undefined | undefined;
112
+ "aria-grabbed"?: (boolean | "true" | "false") | undefined;
113
+ "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined | undefined;
114
+ "aria-hidden"?: (boolean | "true" | "false") | undefined;
115
+ "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
116
+ "aria-keyshortcuts"?: string | undefined | undefined;
117
+ "aria-label"?: string | undefined | undefined;
118
+ "aria-labelledby"?: string | undefined;
119
+ "aria-level"?: number | undefined | undefined;
120
+ "aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
121
+ "aria-modal"?: (boolean | "true" | "false") | undefined;
122
+ "aria-multiline"?: (boolean | "true" | "false") | undefined;
123
+ "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
124
+ "aria-orientation"?: "horizontal" | "vertical" | undefined | undefined;
125
+ "aria-owns"?: string | undefined | undefined;
126
+ "aria-placeholder"?: string | undefined | undefined;
127
+ "aria-posinset"?: number | undefined | undefined;
128
+ "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
129
+ "aria-readonly"?: (boolean | "true" | "false") | undefined;
130
+ "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
131
+ "aria-required"?: (boolean | "true" | "false") | undefined;
132
+ "aria-roledescription"?: string | undefined | undefined;
133
+ "aria-rowcount"?: number | undefined | undefined;
134
+ "aria-rowindex"?: number | undefined | undefined;
135
+ "aria-rowindextext"?: string | undefined | undefined;
136
+ "aria-rowspan"?: number | undefined | undefined;
137
+ "aria-selected"?: (boolean | "true" | "false") | undefined;
138
+ "aria-setsize"?: number | undefined | undefined;
139
+ "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
140
+ "aria-valuemax"?: number | undefined | undefined;
141
+ "aria-valuemin"?: number | undefined | undefined;
142
+ "aria-valuenow"?: number | undefined | undefined;
143
+ "aria-valuetext"?: string | undefined | undefined;
144
+ children?: react.ReactNode;
145
+ dangerouslySetInnerHTML?: {
146
+ __html: string | TrustedHTML;
147
+ } | undefined | undefined;
148
+ onCopy?: react.ClipboardEventHandler<HTMLInputElement> | undefined;
149
+ onCopyCapture?: react.ClipboardEventHandler<HTMLInputElement> | undefined;
150
+ onCut?: react.ClipboardEventHandler<HTMLInputElement> | undefined;
151
+ onCutCapture?: react.ClipboardEventHandler<HTMLInputElement> | undefined;
152
+ onPaste?: react.ClipboardEventHandler<HTMLInputElement> | undefined;
153
+ onPasteCapture?: react.ClipboardEventHandler<HTMLInputElement> | undefined;
154
+ onCompositionEnd?: react.CompositionEventHandler<HTMLInputElement> | undefined;
155
+ onCompositionEndCapture?: react.CompositionEventHandler<HTMLInputElement> | undefined;
156
+ onCompositionStart?: react.CompositionEventHandler<HTMLInputElement> | undefined;
157
+ onCompositionStartCapture?: react.CompositionEventHandler<HTMLInputElement> | undefined;
158
+ onCompositionUpdate?: react.CompositionEventHandler<HTMLInputElement> | undefined;
159
+ onCompositionUpdateCapture?: react.CompositionEventHandler<HTMLInputElement> | undefined;
160
+ onFocus?: react.FocusEventHandler<HTMLInputElement> | undefined;
161
+ onFocusCapture?: react.FocusEventHandler<HTMLInputElement> | undefined;
162
+ onBlur?: react.FocusEventHandler<HTMLInputElement> | undefined;
163
+ onBlurCapture?: react.FocusEventHandler<HTMLInputElement> | undefined;
164
+ onChangeCapture?: react.FormEventHandler<HTMLInputElement> | undefined;
165
+ onBeforeInput?: react.InputEventHandler<HTMLInputElement> | undefined;
166
+ onBeforeInputCapture?: react.FormEventHandler<HTMLInputElement> | undefined;
167
+ onInput?: react.FormEventHandler<HTMLInputElement> | undefined;
168
+ onInputCapture?: react.FormEventHandler<HTMLInputElement> | undefined;
169
+ onReset?: react.FormEventHandler<HTMLInputElement> | undefined;
170
+ onResetCapture?: react.FormEventHandler<HTMLInputElement> | undefined;
171
+ onSubmit?: react.FormEventHandler<HTMLInputElement> | undefined;
172
+ onSubmitCapture?: react.FormEventHandler<HTMLInputElement> | undefined;
173
+ onInvalid?: react.FormEventHandler<HTMLInputElement> | undefined;
174
+ onInvalidCapture?: react.FormEventHandler<HTMLInputElement> | undefined;
175
+ onLoad?: react.ReactEventHandler<HTMLInputElement> | undefined;
176
+ onLoadCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
177
+ onError?: react.ReactEventHandler<HTMLInputElement> | undefined;
178
+ onErrorCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
179
+ onKeyDown?: react.KeyboardEventHandler<HTMLInputElement> | undefined;
180
+ onKeyDownCapture?: react.KeyboardEventHandler<HTMLInputElement> | undefined;
181
+ onKeyPress?: react.KeyboardEventHandler<HTMLInputElement> | undefined;
182
+ onKeyPressCapture?: react.KeyboardEventHandler<HTMLInputElement> | undefined;
183
+ onKeyUp?: react.KeyboardEventHandler<HTMLInputElement> | undefined;
184
+ onKeyUpCapture?: react.KeyboardEventHandler<HTMLInputElement> | undefined;
185
+ onAbort?: react.ReactEventHandler<HTMLInputElement> | undefined;
186
+ onAbortCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
187
+ onCanPlay?: react.ReactEventHandler<HTMLInputElement> | undefined;
188
+ onCanPlayCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
189
+ onCanPlayThrough?: react.ReactEventHandler<HTMLInputElement> | undefined;
190
+ onCanPlayThroughCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
191
+ onDurationChange?: react.ReactEventHandler<HTMLInputElement> | undefined;
192
+ onDurationChangeCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
193
+ onEmptied?: react.ReactEventHandler<HTMLInputElement> | undefined;
194
+ onEmptiedCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
195
+ onEncrypted?: react.ReactEventHandler<HTMLInputElement> | undefined;
196
+ onEncryptedCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
197
+ onEnded?: react.ReactEventHandler<HTMLInputElement> | undefined;
198
+ onEndedCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
199
+ onLoadedData?: react.ReactEventHandler<HTMLInputElement> | undefined;
200
+ onLoadedDataCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
201
+ onLoadedMetadata?: react.ReactEventHandler<HTMLInputElement> | undefined;
202
+ onLoadedMetadataCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
203
+ onLoadStart?: react.ReactEventHandler<HTMLInputElement> | undefined;
204
+ onLoadStartCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
205
+ onPause?: react.ReactEventHandler<HTMLInputElement> | undefined;
206
+ onPauseCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
207
+ onPlay?: react.ReactEventHandler<HTMLInputElement> | undefined;
208
+ onPlayCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
209
+ onPlaying?: react.ReactEventHandler<HTMLInputElement> | undefined;
210
+ onPlayingCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
211
+ onProgress?: react.ReactEventHandler<HTMLInputElement> | undefined;
212
+ onProgressCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
213
+ onRateChange?: react.ReactEventHandler<HTMLInputElement> | undefined;
214
+ onRateChangeCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
215
+ onSeeked?: react.ReactEventHandler<HTMLInputElement> | undefined;
216
+ onSeekedCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
217
+ onSeeking?: react.ReactEventHandler<HTMLInputElement> | undefined;
218
+ onSeekingCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
219
+ onStalled?: react.ReactEventHandler<HTMLInputElement> | undefined;
220
+ onStalledCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
221
+ onSuspend?: react.ReactEventHandler<HTMLInputElement> | undefined;
222
+ onSuspendCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
223
+ onTimeUpdate?: react.ReactEventHandler<HTMLInputElement> | undefined;
224
+ onTimeUpdateCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
225
+ onVolumeChange?: react.ReactEventHandler<HTMLInputElement> | undefined;
226
+ onVolumeChangeCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
227
+ onWaiting?: react.ReactEventHandler<HTMLInputElement> | undefined;
228
+ onWaitingCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
229
+ onAuxClick?: react.MouseEventHandler<HTMLInputElement> | undefined;
230
+ onAuxClickCapture?: react.MouseEventHandler<HTMLInputElement> | undefined;
231
+ onClick?: react.MouseEventHandler<HTMLInputElement> | undefined;
232
+ onClickCapture?: react.MouseEventHandler<HTMLInputElement> | undefined;
233
+ onContextMenu?: react.MouseEventHandler<HTMLInputElement> | undefined;
234
+ onContextMenuCapture?: react.MouseEventHandler<HTMLInputElement> | undefined;
235
+ onDoubleClick?: react.MouseEventHandler<HTMLInputElement> | undefined;
236
+ onDoubleClickCapture?: react.MouseEventHandler<HTMLInputElement> | undefined;
237
+ onDrag?: react.DragEventHandler<HTMLInputElement> | undefined;
238
+ onDragCapture?: react.DragEventHandler<HTMLInputElement> | undefined;
239
+ onDragEnd?: react.DragEventHandler<HTMLInputElement> | undefined;
240
+ onDragEndCapture?: react.DragEventHandler<HTMLInputElement> | undefined;
241
+ onDragEnter?: react.DragEventHandler<HTMLInputElement> | undefined;
242
+ onDragEnterCapture?: react.DragEventHandler<HTMLInputElement> | undefined;
243
+ onDragExit?: react.DragEventHandler<HTMLInputElement> | undefined;
244
+ onDragExitCapture?: react.DragEventHandler<HTMLInputElement> | undefined;
245
+ onDragLeave?: react.DragEventHandler<HTMLInputElement> | undefined;
246
+ onDragLeaveCapture?: react.DragEventHandler<HTMLInputElement> | undefined;
247
+ onDragOver?: react.DragEventHandler<HTMLInputElement> | undefined;
248
+ onDragOverCapture?: react.DragEventHandler<HTMLInputElement> | undefined;
249
+ onDragStart?: react.DragEventHandler<HTMLInputElement> | undefined;
250
+ onDragStartCapture?: react.DragEventHandler<HTMLInputElement> | undefined;
251
+ onDrop?: react.DragEventHandler<HTMLInputElement> | undefined;
252
+ onDropCapture?: react.DragEventHandler<HTMLInputElement> | undefined;
253
+ onMouseDown?: react.MouseEventHandler<HTMLInputElement> | undefined;
254
+ onMouseDownCapture?: react.MouseEventHandler<HTMLInputElement> | undefined;
255
+ onMouseEnter?: react.MouseEventHandler<HTMLInputElement> | undefined;
256
+ onMouseLeave?: react.MouseEventHandler<HTMLInputElement> | undefined;
257
+ onMouseMove?: react.MouseEventHandler<HTMLInputElement> | undefined;
258
+ onMouseMoveCapture?: react.MouseEventHandler<HTMLInputElement> | undefined;
259
+ onMouseOut?: react.MouseEventHandler<HTMLInputElement> | undefined;
260
+ onMouseOutCapture?: react.MouseEventHandler<HTMLInputElement> | undefined;
261
+ onMouseOver?: react.MouseEventHandler<HTMLInputElement> | undefined;
262
+ onMouseOverCapture?: react.MouseEventHandler<HTMLInputElement> | undefined;
263
+ onMouseUp?: react.MouseEventHandler<HTMLInputElement> | undefined;
264
+ onMouseUpCapture?: react.MouseEventHandler<HTMLInputElement> | undefined;
265
+ onSelect?: react.ReactEventHandler<HTMLInputElement> | undefined;
266
+ onSelectCapture?: react.ReactEventHandler<HTMLInputElement> | undefined;
267
+ onTouchCancel?: react.TouchEventHandler<HTMLInputElement> | undefined;
268
+ onTouchCancelCapture?: react.TouchEventHandler<HTMLInputElement> | undefined;
269
+ onTouchEnd?: react.TouchEventHandler<HTMLInputElement> | undefined;
270
+ onTouchEndCapture?: react.TouchEventHandler<HTMLInputElement> | undefined;
271
+ onTouchMove?: react.TouchEventHandler<HTMLInputElement> | undefined;
272
+ onTouchMoveCapture?: react.TouchEventHandler<HTMLInputElement> | undefined;
273
+ onTouchStart?: react.TouchEventHandler<HTMLInputElement> | undefined;
274
+ onTouchStartCapture?: react.TouchEventHandler<HTMLInputElement> | undefined;
275
+ onPointerDown?: react.PointerEventHandler<HTMLInputElement> | undefined;
276
+ onPointerDownCapture?: react.PointerEventHandler<HTMLInputElement> | undefined;
277
+ onPointerMove?: react.PointerEventHandler<HTMLInputElement> | undefined;
278
+ onPointerMoveCapture?: react.PointerEventHandler<HTMLInputElement> | undefined;
279
+ onPointerUp?: react.PointerEventHandler<HTMLInputElement> | undefined;
280
+ onPointerUpCapture?: react.PointerEventHandler<HTMLInputElement> | undefined;
281
+ onPointerCancel?: react.PointerEventHandler<HTMLInputElement> | undefined;
282
+ onPointerCancelCapture?: react.PointerEventHandler<HTMLInputElement> | undefined;
283
+ onPointerEnter?: react.PointerEventHandler<HTMLInputElement> | undefined;
284
+ onPointerLeave?: react.PointerEventHandler<HTMLInputElement> | undefined;
285
+ onPointerOver?: react.PointerEventHandler<HTMLInputElement> | undefined;
286
+ onPointerOverCapture?: react.PointerEventHandler<HTMLInputElement> | undefined;
287
+ onPointerOut?: react.PointerEventHandler<HTMLInputElement> | undefined;
288
+ onPointerOutCapture?: react.PointerEventHandler<HTMLInputElement> | undefined;
289
+ onGotPointerCapture?: react.PointerEventHandler<HTMLInputElement> | undefined;
290
+ onGotPointerCaptureCapture?: react.PointerEventHandler<HTMLInputElement> | undefined;
291
+ onLostPointerCapture?: react.PointerEventHandler<HTMLInputElement> | undefined;
292
+ onLostPointerCaptureCapture?: react.PointerEventHandler<HTMLInputElement> | undefined;
293
+ onScroll?: react.UIEventHandler<HTMLInputElement> | undefined;
294
+ onScrollCapture?: react.UIEventHandler<HTMLInputElement> | undefined;
295
+ onScrollEnd?: react.UIEventHandler<HTMLInputElement> | undefined;
296
+ onScrollEndCapture?: react.UIEventHandler<HTMLInputElement> | undefined;
297
+ onWheel?: react.WheelEventHandler<HTMLInputElement> | undefined;
298
+ onWheelCapture?: react.WheelEventHandler<HTMLInputElement> | undefined;
299
+ onAnimationStart?: react.AnimationEventHandler<HTMLInputElement> | undefined;
300
+ onAnimationStartCapture?: react.AnimationEventHandler<HTMLInputElement> | undefined;
301
+ onAnimationEnd?: react.AnimationEventHandler<HTMLInputElement> | undefined;
302
+ onAnimationEndCapture?: react.AnimationEventHandler<HTMLInputElement> | undefined;
303
+ onAnimationIteration?: react.AnimationEventHandler<HTMLInputElement> | undefined;
304
+ onAnimationIterationCapture?: react.AnimationEventHandler<HTMLInputElement> | undefined;
305
+ onToggle?: react.ToggleEventHandler<HTMLInputElement> | undefined;
306
+ onBeforeToggle?: react.ToggleEventHandler<HTMLInputElement> | undefined;
307
+ onTransitionCancel?: react.TransitionEventHandler<HTMLInputElement> | undefined;
308
+ onTransitionCancelCapture?: react.TransitionEventHandler<HTMLInputElement> | undefined;
309
+ onTransitionEnd?: react.TransitionEventHandler<HTMLInputElement> | undefined;
310
+ onTransitionEndCapture?: react.TransitionEventHandler<HTMLInputElement> | undefined;
311
+ onTransitionRun?: react.TransitionEventHandler<HTMLInputElement> | undefined;
312
+ onTransitionRunCapture?: react.TransitionEventHandler<HTMLInputElement> | undefined;
313
+ onTransitionStart?: react.TransitionEventHandler<HTMLInputElement> | undefined;
314
+ onTransitionStartCapture?: react.TransitionEventHandler<HTMLInputElement> | undefined;
315
+ className?: string;
316
+ render?: React.ReactElement;
317
+ };
6
318
  };
7
319
  declare namespace useInput {
8
- interface Props extends UIProps<"input">, InputVariantProps {
320
+ interface Props extends UIProps<"input"> {
9
321
  value?: string;
10
322
  defaultValue?: string;
11
323
  onValueChange?: (value: string) => void;
@@ -1 +1 @@
1
- "use client";import{useCallback as m,useMemo as v}from"react";import{useFieldA11yContext as V}from"@jamsrui/context";import{useControlledState as d}from"@jamsrui/hooks";import{useInputGroupContextOpt as x}from"@jamsrui/input-group";import{cn as h,mapPropsVariants as y}from"@jamsrui/utils";import{inputGroupVariants as G,inputVariants as c}from"./styles.mjs";const j=P=>{const[f,e]=y(P,c.variantKeys),o=x(),r=V(),{value:I,defaultValue:g,onValueChange:C,className:n,...p}=f,[s="",a]=d({defaultProp:g,onChange:C,prop:I}),u=o?G({...o.variantProps,...e}):c(e),i=m(t=>{a(t.target.value)},[a]),l=m(t=>({...r?.getInputProps(),...p,...t,className:h(u,n),value:s,onChange:i}),[r,p,u,n,s,i]);return v(()=>({getInputProps:l}),[l])};export{j as useInput};
1
+ "use client";import{useCallback as c,useMemo as F}from"react";import{useFieldA11yContext as T}from"@jamsrui/context";import{useControlledState as H,useFocusVisible as M,useHover as R,useMergeRefs as E}from"@jamsrui/hooks";import{dataAttr as t}from"@jamsrui/utils";import{useTextFieldContext as y}from"@jamsrui/textfield";import{useInputGroupContextOpt as A}from"@jamsrui/input-group";const O=m=>{const s=T(),o=y(),v=A(),I=o?.isDisabled??!1,n=o?.isInvalid??!1,{value:g,defaultValue:x,onValueChange:C,ref:b,disabled:e=I,...r}=m,[u="",a]=H({defaultProp:x,onChange:C,prop:g}),{isHovered:i,ref:h}=R({isDisabled:e}),{isFocusVisible:l,ref:P}=M({isDisabled:e}),p=E([b,h,P,v?.inputRefs]),d=c(V=>{a(V.target.value)},[a]),f=c(()=>({...s?.getInputProps(),...r,value:u,onChange:d,ref:p,"data-hovered":t(i),"data-focus-visible":t(l),"data-invalid":t(n),disabled:e}),[s,r,u,d,p,i,l,e,n]);return F(()=>({getInputProps:f}),[f])};export{O as useInput};
package/package.json CHANGED
@@ -1,16 +1,16 @@
1
1
  {
2
2
  "name": "@jamsrui/input",
3
- "version": "0.0.22",
3
+ "version": "0.1.0",
4
4
  "peerDependencies": {
5
5
  "react": ">=19"
6
6
  },
7
7
  "dependencies": {
8
- "@jamsrui/context": "^0.0.8",
9
- "@jamsrui/hooks": "^0.0.19",
10
- "@jamsrui/input-group": "^0.0.9",
11
- "@jamsrui/textfield": "^0.0.8",
12
- "@jamsrui/core": "^0.0.15",
13
- "@jamsrui/utils": "^0.0.19"
8
+ "@jamsrui/context": "^0.1.0",
9
+ "@jamsrui/core": "^0.1.0",
10
+ "@jamsrui/input-group": "^0.1.0",
11
+ "@jamsrui/hooks": "^0.1.0",
12
+ "@jamsrui/textfield": "^0.1.0",
13
+ "@jamsrui/utils": "^0.1.0"
14
14
  },
15
15
  "exports": {
16
16
  ".": {
@@ -1,18 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { WithGlobalConfig } from '@jamsrui/core';
3
- import { Input } from './input.mjs';
4
- import './use-input.mjs';
5
- import '@jamsrui/utils';
6
- import './styles.mjs';
7
-
8
- declare const useInputConfig: () => InputConfig.Props;
9
- declare const InputConfig: (props: Omit<Partial<InputConfig.Props>, "children"> & {
10
- merge?: boolean;
11
- children: React.ReactNode;
12
- }) => react_jsx_runtime.JSX.Element;
13
- declare namespace InputConfig {
14
- interface Props extends WithGlobalConfig<Input.Props> {
15
- }
16
- }
17
-
18
- export { InputConfig, useInputConfig };
@@ -1 +0,0 @@
1
- "use client";import{createConfigContext as o}from"@jamsrui/utils";const[p,i]=o({displayName:"InputConfigContext"});export{p as InputConfig,i as useInputConfig};
package/dist/styles.d.mts DELETED
@@ -1,92 +0,0 @@
1
- import * as _jamsrui_utils from '@jamsrui/utils';
2
- import { VariantProps } from '@jamsrui/utils';
3
-
4
- declare const inputVariants: _jamsrui_utils.TVReturnType<{
5
- variant: {
6
- bordered: string;
7
- solid: string;
8
- };
9
- size: {
10
- sm: string;
11
- md: string;
12
- lg: string;
13
- };
14
- radius: {
15
- readonly sm: "rounded";
16
- readonly md: "rounded-md";
17
- readonly lg: "rounded-lg";
18
- readonly xl: "rounded-xl";
19
- readonly "2xl": "rounded-2xl";
20
- readonly "3xl": "rounded-3xl";
21
- readonly full: "rounded-full";
22
- readonly none: "rounded-none";
23
- };
24
- isInvalid: {
25
- true: string;
26
- };
27
- }, undefined, string[], {
28
- variant: {
29
- bordered: string;
30
- solid: string;
31
- };
32
- size: {
33
- sm: string;
34
- md: string;
35
- lg: string;
36
- };
37
- radius: {
38
- readonly sm: "rounded";
39
- readonly md: "rounded-md";
40
- readonly lg: "rounded-lg";
41
- readonly xl: "rounded-xl";
42
- readonly "2xl": "rounded-2xl";
43
- readonly "3xl": "rounded-3xl";
44
- readonly full: "rounded-full";
45
- readonly none: "rounded-none";
46
- };
47
- isInvalid: {
48
- true: string;
49
- };
50
- }, undefined, _jamsrui_utils.TVReturnType<{
51
- variant: {
52
- bordered: string;
53
- solid: string;
54
- };
55
- size: {
56
- sm: string;
57
- md: string;
58
- lg: string;
59
- };
60
- radius: {
61
- readonly sm: "rounded";
62
- readonly md: "rounded-md";
63
- readonly lg: "rounded-lg";
64
- readonly xl: "rounded-xl";
65
- readonly "2xl": "rounded-2xl";
66
- readonly "3xl": "rounded-3xl";
67
- readonly full: "rounded-full";
68
- readonly none: "rounded-none";
69
- };
70
- isInvalid: {
71
- true: string;
72
- };
73
- }, undefined, string[], unknown, unknown, undefined>>;
74
- declare const inputGroupVariants: _jamsrui_utils.TVReturnType<{
75
- variant: {
76
- bordered: string;
77
- solid: string;
78
- };
79
- }, undefined, "input-group__input w-full px-3 py-2 text-sm placeholder:text-sm focus:outline-none", {
80
- variant: {
81
- bordered: string;
82
- solid: string;
83
- };
84
- }, undefined, _jamsrui_utils.TVReturnType<{
85
- variant: {
86
- bordered: string;
87
- solid: string;
88
- };
89
- }, undefined, "input-group__input w-full px-3 py-2 text-sm placeholder:text-sm focus:outline-none", unknown, unknown, undefined>>;
90
- type InputVariantProps = VariantProps<typeof inputVariants>;
91
-
92
- export { type InputVariantProps, inputGroupVariants, inputVariants };
package/dist/styles.mjs DELETED
@@ -1 +0,0 @@
1
- import{radiusBaseVariant as r,tv as e}from"@jamsrui/utils";const a=e({base:["input focus:outline-none disabled:cursor-not-allowed disabled:opacity-disabled placeholder:text-foreground-secondary bg-transparent font-normal"],variants:{variant:{bordered:"border border-divider enabled:hover:border-divider-light enabled:focus:border-focus",solid:"bg-surface hover:bg-surface/90"},size:{sm:"input--sm px-3 py-1.5 text-sm placeholder:text-sm",md:"input--md px-3 py-2 text-sm placeholder:text-sm",lg:"input--lg px-3 py-2 text-base placeholder:text-base"},radius:r,isInvalid:{true:"border-danger!"}},defaultVariants:{radius:"md",size:"md",variant:"bordered"}}),o=e({base:"input-group__input w-full px-3 py-2 text-sm placeholder:text-sm focus:outline-none",variants:{variant:{bordered:"",solid:"bg-surface hover:bg-surface/90"}}});export{o as inputGroupVariants,a as inputVariants};