@sikka/hawa 0.46.4-next → 0.48.0-next
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{Radio-Dyvlywnk.d.mts → Radio-BPHTeDMz.d.mts} +8 -7
- package/dist/{Radio-DlPwVCG4.d.ts → Radio-cRcIH8_L.d.ts} +8 -7
- package/dist/blocks/auth/index.d.mts +34 -17
- package/dist/blocks/auth/index.d.ts +34 -17
- package/dist/blocks/auth/index.js +1008 -430
- package/dist/blocks/auth/index.mjs +427 -297
- package/dist/blocks/feedback/index.d.mts +1 -1
- package/dist/blocks/feedback/index.d.ts +1 -1
- package/dist/blocks/feedback/index.js +68 -79
- package/dist/blocks/feedback/index.mjs +1 -1
- package/dist/blocks/index.d.mts +28 -11
- package/dist/blocks/index.d.ts +28 -11
- package/dist/blocks/index.js +2340 -2233
- package/dist/blocks/index.mjs +407 -269
- package/dist/blocks/misc/index.d.mts +1 -1
- package/dist/blocks/misc/index.d.ts +1 -1
- package/dist/blocks/misc/index.js +68 -79
- package/dist/blocks/misc/index.mjs +50 -367
- package/dist/blocks/pricing/index.d.mts +1 -1
- package/dist/blocks/pricing/index.d.ts +1 -1
- package/dist/blocks/pricing/index.mjs +1 -1
- package/dist/{chunk-6TG2PHZK.mjs → chunk-AWJSHOYU.mjs} +68 -79
- package/dist/{chunk-5CTMGPEF.mjs → chunk-GBLWUEYN.mjs} +650 -674
- package/dist/chunk-JFWD2ICY.mjs +511 -0
- package/dist/elements/index.d.mts +2 -2
- package/dist/elements/index.d.ts +2 -2
- package/dist/elements/index.js +81 -105
- package/dist/elements/index.mjs +1 -1
- package/dist/index.css +7 -0
- package/dist/index.d.mts +36 -17
- package/dist/index.d.ts +36 -17
- package/dist/index.js +482 -373
- package/dist/index.mjs +487 -373
- package/dist/phoneInput/index.d.mts +7 -7
- package/dist/phoneInput/index.d.ts +7 -7
- package/dist/phoneInput/index.js +78 -85
- package/dist/phoneInput/index.js.map +1 -1
- package/dist/phoneInput/index.mjs +78 -85
- package/dist/phoneInput/index.mjs.map +1 -1
- package/dist/pinInput/index.js +3 -20
- package/dist/pinInput/index.js.map +1 -1
- package/dist/pinInput/index.mjs +3 -20
- package/dist/pinInput/index.mjs.map +1 -1
- package/dist/select/index.d.mts +1 -0
- package/dist/select/index.d.ts +1 -0
- package/dist/select/index.js +68 -79
- package/dist/select/index.js.map +1 -1
- package/dist/select/index.mjs +68 -79
- package/dist/select/index.mjs.map +1 -1
- package/dist/{textTypes-DXLtO2fL.d.mts → textTypes-CYQYIsFt.d.mts} +1 -0
- package/dist/{textTypes-DXLtO2fL.d.ts → textTypes-CYQYIsFt.d.ts} +1 -0
- package/dist/types/index.d.mts +1 -0
- package/dist/types/index.d.ts +1 -0
- package/package.json +1 -1
- package/dist/chunk-EOH6A3GR.mjs +0 -183
@@ -0,0 +1,511 @@
|
|
1
|
+
"use client";
|
2
|
+
import {
|
3
|
+
Chip,
|
4
|
+
ScrollArea
|
5
|
+
} from "./chunk-C2UOOH4X.mjs";
|
6
|
+
import {
|
7
|
+
HelperText,
|
8
|
+
Label,
|
9
|
+
Skeleton,
|
10
|
+
cn
|
11
|
+
} from "./chunk-IFWYR5W2.mjs";
|
12
|
+
|
13
|
+
// hooks/useShortcuts.ts
|
14
|
+
import { useEffect } from "react";
|
15
|
+
function parseHotkey(hotkey) {
|
16
|
+
const keys = hotkey.toLowerCase().split("+").map((part) => part.trim());
|
17
|
+
const modifiers = {
|
18
|
+
alt: keys.includes("alt"),
|
19
|
+
ctrl: keys.includes("ctrl"),
|
20
|
+
meta: keys.includes("meta"),
|
21
|
+
mod: keys.includes("mod"),
|
22
|
+
shift: keys.includes("shift")
|
23
|
+
};
|
24
|
+
const reservedKeys = ["alt", "ctrl", "meta", "shift", "mod"];
|
25
|
+
const freeKey = keys.find((key) => !reservedKeys.includes(key));
|
26
|
+
return {
|
27
|
+
...modifiers,
|
28
|
+
key: freeKey
|
29
|
+
};
|
30
|
+
}
|
31
|
+
function isExactHotkey(hotkey, event) {
|
32
|
+
const { alt, ctrl, meta, mod, shift, key } = hotkey;
|
33
|
+
const { altKey, ctrlKey, metaKey, shiftKey, key: pressedKey } = event;
|
34
|
+
if (alt !== altKey) {
|
35
|
+
return false;
|
36
|
+
}
|
37
|
+
if (mod) {
|
38
|
+
if (!ctrlKey && !metaKey) {
|
39
|
+
return false;
|
40
|
+
}
|
41
|
+
} else {
|
42
|
+
if (ctrl !== ctrlKey) {
|
43
|
+
return false;
|
44
|
+
}
|
45
|
+
if (meta !== metaKey) {
|
46
|
+
return false;
|
47
|
+
}
|
48
|
+
}
|
49
|
+
if (shift !== shiftKey) {
|
50
|
+
return false;
|
51
|
+
}
|
52
|
+
if (key && (pressedKey.toLowerCase() === key.toLowerCase() || event.code.replace("Key", "").toLowerCase() === key.toLowerCase())) {
|
53
|
+
return true;
|
54
|
+
}
|
55
|
+
return false;
|
56
|
+
}
|
57
|
+
function getHotkeyMatcher(hotkey) {
|
58
|
+
return (event) => isExactHotkey(parseHotkey(hotkey), event);
|
59
|
+
}
|
60
|
+
function getHotkeyHandler(hotkeys) {
|
61
|
+
return (event) => {
|
62
|
+
const _event = "nativeEvent" in event ? event.nativeEvent : event;
|
63
|
+
hotkeys.forEach(([hotkey, handler, options = { preventDefault: true }]) => {
|
64
|
+
if (getHotkeyMatcher(hotkey)(_event)) {
|
65
|
+
if (options.preventDefault) {
|
66
|
+
event.preventDefault();
|
67
|
+
}
|
68
|
+
handler(_event);
|
69
|
+
}
|
70
|
+
});
|
71
|
+
};
|
72
|
+
}
|
73
|
+
|
74
|
+
// elements/tabs/Tabs.tsx
|
75
|
+
import * as React9 from "react";
|
76
|
+
|
77
|
+
// hooks/useIsomorphicEffect.ts
|
78
|
+
import { useEffect as useEffect2, useLayoutEffect } from "react";
|
79
|
+
|
80
|
+
// hooks/useDiscloser.ts
|
81
|
+
import { useState } from "react";
|
82
|
+
|
83
|
+
// hooks/useHover.ts
|
84
|
+
import { useEffect as useEffect3, useRef, useState as useState2 } from "react";
|
85
|
+
|
86
|
+
// hooks/useToast.ts
|
87
|
+
import * as React3 from "react";
|
88
|
+
|
89
|
+
// hooks/useCarousel.ts
|
90
|
+
import { useState as useState4, useRef as useRef2 } from "react";
|
91
|
+
|
92
|
+
// hooks/useDialogCarousel.ts
|
93
|
+
import { useEffect as useEffect5, useState as useState5 } from "react";
|
94
|
+
import AutoHeight from "embla-carousel-auto-height";
|
95
|
+
import useEmblaCarousel from "embla-carousel-react";
|
96
|
+
|
97
|
+
// hooks/useDialogSteps.ts
|
98
|
+
import { useState as useState6, useEffect as useEffect6, useRef as useRef3 } from "react";
|
99
|
+
|
100
|
+
// hooks/useClipboard.ts
|
101
|
+
import { useState as useState7 } from "react";
|
102
|
+
|
103
|
+
// hooks/useBreakpoint.ts
|
104
|
+
import { useState as useState8, useEffect as useEffect7 } from "react";
|
105
|
+
|
106
|
+
// hooks/useWindowSize.ts
|
107
|
+
import { useEffect as useEffect8, useState as useState9 } from "react";
|
108
|
+
|
109
|
+
// hooks/useFocusWithin.ts
|
110
|
+
import { useRef as useRef4, useState as useState10, useEffect as useEffect9 } from "react";
|
111
|
+
|
112
|
+
// hooks/useMediaQuery.ts
|
113
|
+
import { useState as useState11, useEffect as useEffect10, useRef as useRef5 } from "react";
|
114
|
+
|
115
|
+
// hooks/useScrollPosition.ts
|
116
|
+
import { useState as useState12, useEffect as useEffect11 } from "react";
|
117
|
+
|
118
|
+
// hooks/useTable.ts
|
119
|
+
import { useState as useState13, useEffect as useEffect12 } from "react";
|
120
|
+
|
121
|
+
// hooks/useTabs.ts
|
122
|
+
import { useEffect as useEffect13, useState as useState14 } from "react";
|
123
|
+
|
124
|
+
// hooks/useMeasureDirty.ts
|
125
|
+
import { useEffect as useEffect14, useRef as useRef7, useState as useState15 } from "react";
|
126
|
+
|
127
|
+
// hooks/useClickOutside.ts
|
128
|
+
import { useEffect as useEffect15, useRef as useRef8 } from "react";
|
129
|
+
|
130
|
+
// hooks/useWindowEvent.ts
|
131
|
+
import { useEffect as useEffect16 } from "react";
|
132
|
+
function useWindowEvent(type, listener, options) {
|
133
|
+
useEffect16(() => {
|
134
|
+
window.addEventListener(type, listener, options);
|
135
|
+
return () => window.removeEventListener(type, listener, options);
|
136
|
+
}, [type, listener]);
|
137
|
+
}
|
138
|
+
|
139
|
+
// hooks/useViewportSize.ts
|
140
|
+
import { useCallback, useEffect as useEffect17, useState as useState16 } from "react";
|
141
|
+
var eventListerOptions = {
|
142
|
+
passive: true
|
143
|
+
};
|
144
|
+
function useViewportSize() {
|
145
|
+
const [windowSize, setWindowSize] = useState16({
|
146
|
+
width: 0,
|
147
|
+
height: 0
|
148
|
+
});
|
149
|
+
const setSize = useCallback(() => {
|
150
|
+
setWindowSize({
|
151
|
+
width: window.innerWidth || 0,
|
152
|
+
height: window.innerHeight || 0
|
153
|
+
});
|
154
|
+
}, []);
|
155
|
+
useWindowEvent("resize", setSize, eventListerOptions);
|
156
|
+
useWindowEvent("orientationchange", setSize, eventListerOptions);
|
157
|
+
useEffect17(setSize, []);
|
158
|
+
return windowSize;
|
159
|
+
}
|
160
|
+
|
161
|
+
// elements/tabs/Tabs.tsx
|
162
|
+
import * as Popover from "@radix-ui/react-popover";
|
163
|
+
import * as TabsPrimitive from "@radix-ui/react-tabs";
|
164
|
+
import { tv } from "tailwind-variants";
|
165
|
+
var tabsListVariant = tv({
|
166
|
+
base: "",
|
167
|
+
variants: {
|
168
|
+
variant: {
|
169
|
+
default: "hawa-flex hawa-w-fit hawa-items-center hawa-justify-start hawa-gap-1 hawa-rounded hawa-border hawa-bg-muted hawa-p-1 hawa-text-muted-foreground dark:hawa-border-primary/10",
|
170
|
+
underlined: "hawa-flex hawa-w-fit hawa-items-center hawa-justify-start hawa-gap-1 hawa-rounded hawa-p-1 hawa-text-muted-foreground dark:hawa-border-primary/10",
|
171
|
+
underlined_tabs: "hawa-flex hawa-w-fit hawa-items-center hawa-justify-start hawa-gap-1 hawa-text-muted-foreground"
|
172
|
+
},
|
173
|
+
orientation: { horizontal: "", vertical: "" }
|
174
|
+
},
|
175
|
+
compoundVariants: [
|
176
|
+
{
|
177
|
+
variant: "underlined_tabs",
|
178
|
+
orientation: "vertical",
|
179
|
+
class: "hawa-border-e-2 hawa-border-e-primary"
|
180
|
+
},
|
181
|
+
{
|
182
|
+
variant: "underlined_tabs",
|
183
|
+
orientation: "horizontal",
|
184
|
+
class: "hawa-border-b-2 hawa-border-b-primary"
|
185
|
+
}
|
186
|
+
],
|
187
|
+
defaultVariants: { variant: "default", orientation: "horizontal" }
|
188
|
+
});
|
189
|
+
var tabsTriggerVariant = tv({
|
190
|
+
base: "",
|
191
|
+
variants: {
|
192
|
+
variant: {
|
193
|
+
default: "hawa-inline-flex hawa-w-full hawa-flex-1 hawa-select-none hawa-items-center hawa-justify-center hawa-gap-2 hawa-whitespace-nowrap hawa-rounded hawa-border hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-all focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50 data-[state=active]:hawa-bg-primary data-[state=active]:hawa-text-primary-foreground data-[state=active]:hawa-shadow-sm dark:hawa-border-primary/10",
|
194
|
+
underlined: "hawa-inline-flex hawa-w-full hawa-flex-1 hawa-select-none hawa-items-center hawa-justify-center hawa-gap-2 hawa-whitespace-nowrap hawa-rounded hawa-rounded-none hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-all focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50",
|
195
|
+
underlined_tabs: "hawa-inline-flex hawa-w-full hawa-flex-1 hawa-select-none hawa-items-center hawa-justify-center hawa-gap-2 hawa-whitespace-nowrap hawa-rounded hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-all focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50 hawa-bg-primary/10 data-[state=active]:hawa-bg-primary data-[state=active]:hawa-text-primary-foreground dark:hawa-border-primary/10"
|
196
|
+
},
|
197
|
+
orientation: { horizontal: "", vertical: "" }
|
198
|
+
},
|
199
|
+
compoundVariants: [
|
200
|
+
{
|
201
|
+
variant: "underlined",
|
202
|
+
orientation: "horizontal",
|
203
|
+
class: "data-[state=active]:hawa-border-b-primary hawa-border-b hawa-border-b-2"
|
204
|
+
},
|
205
|
+
{
|
206
|
+
variant: "underlined",
|
207
|
+
orientation: "vertical",
|
208
|
+
class: "data-[state=active]:hawa-border-e-primary hawa-border-e hawa-border-e-2"
|
209
|
+
},
|
210
|
+
{
|
211
|
+
variant: "underlined_tabs",
|
212
|
+
orientation: "horizontal",
|
213
|
+
class: "hawa-rounded-b-none"
|
214
|
+
},
|
215
|
+
{
|
216
|
+
variant: "underlined_tabs",
|
217
|
+
orientation: "vertical",
|
218
|
+
class: "hawa-rounded-e-none"
|
219
|
+
}
|
220
|
+
],
|
221
|
+
defaultVariants: { variant: "default", orientation: "horizontal" }
|
222
|
+
});
|
223
|
+
var TabsContext = React9.createContext({ orientation: "horizontal", variant: "default", scrollable: false });
|
224
|
+
var Tabs = React9.forwardRef(
|
225
|
+
({ className, orientation, scrollable, variant = "default", ...props }, ref) => /* @__PURE__ */ React9.createElement(
|
226
|
+
TabsPrimitive.Root,
|
227
|
+
{
|
228
|
+
ref,
|
229
|
+
className: cn(
|
230
|
+
"hawa-flex hawa-gap-2",
|
231
|
+
orientation === "vertical" ? "hawa-flex-row" : "hawa-flex-col",
|
232
|
+
className
|
233
|
+
),
|
234
|
+
...props
|
235
|
+
},
|
236
|
+
/* @__PURE__ */ React9.createElement(TabsContext.Provider, { value: { orientation, variant, scrollable } }, props.children)
|
237
|
+
)
|
238
|
+
);
|
239
|
+
var TabsList = React9.forwardRef(({ className, classNames, ...props }, ref) => {
|
240
|
+
const { orientation, variant, scrollable } = React9.useContext(TabsContext);
|
241
|
+
const { width } = useViewportSize();
|
242
|
+
if (scrollable && width < 768 && orientation === "horizontal") {
|
243
|
+
return /* @__PURE__ */ React9.createElement(ScrollArea, { orientation: "horizontal", className: classNames == null ? void 0 : classNames.scrollArea }, /* @__PURE__ */ React9.createElement(
|
244
|
+
TabsPrimitive.List,
|
245
|
+
{
|
246
|
+
ref,
|
247
|
+
className: cn(
|
248
|
+
tabsListVariant({ variant, orientation }),
|
249
|
+
"hawa-flex-row hawa-flex-nowrap",
|
250
|
+
className
|
251
|
+
),
|
252
|
+
...props
|
253
|
+
}
|
254
|
+
));
|
255
|
+
} else {
|
256
|
+
return /* @__PURE__ */ React9.createElement(
|
257
|
+
TabsPrimitive.List,
|
258
|
+
{
|
259
|
+
ref,
|
260
|
+
className: cn(
|
261
|
+
tabsListVariant({ variant, orientation }),
|
262
|
+
orientation === "vertical" ? "hawa-flex-col" : "hawa-flex-row",
|
263
|
+
"hawa-flex-wrap",
|
264
|
+
className
|
265
|
+
),
|
266
|
+
...props
|
267
|
+
}
|
268
|
+
);
|
269
|
+
}
|
270
|
+
});
|
271
|
+
var TabsTrigger = React9.forwardRef(
|
272
|
+
({ className, chipProps, withPopover = false, onPopoverClick, ...props }, ref) => {
|
273
|
+
const { orientation, variant } = React9.useContext(TabsContext);
|
274
|
+
if (withPopover) {
|
275
|
+
return /* @__PURE__ */ React9.createElement(Popover.Root, { open: props.showPopover }, /* @__PURE__ */ React9.createElement(Popover.Anchor, { asChild: true }, /* @__PURE__ */ React9.createElement(
|
276
|
+
TabsPrimitive.Trigger,
|
277
|
+
{
|
278
|
+
className: cn(
|
279
|
+
tabsTriggerVariant({ variant, orientation }),
|
280
|
+
"hawa-relative",
|
281
|
+
className
|
282
|
+
),
|
283
|
+
...props
|
284
|
+
},
|
285
|
+
props.children,
|
286
|
+
chipProps && /* @__PURE__ */ React9.createElement(Chip, { ...chipProps })
|
287
|
+
)), /* @__PURE__ */ React9.createElement(
|
288
|
+
Popover.Content,
|
289
|
+
{
|
290
|
+
onClick: onPopoverClick,
|
291
|
+
asChild: true,
|
292
|
+
className: cn(
|
293
|
+
"dark:dark-shadow hawa-z-50 hawa-rounded hawa-border hawa-bg-popover hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2",
|
294
|
+
"hawa-arrow-default-top hawa-mt-2"
|
295
|
+
)
|
296
|
+
},
|
297
|
+
/* @__PURE__ */ React9.createElement("div", { className: "hawa-p-2" }, " ", props.popoverContent)
|
298
|
+
));
|
299
|
+
} else {
|
300
|
+
return /* @__PURE__ */ React9.createElement(
|
301
|
+
TabsPrimitive.Trigger,
|
302
|
+
{
|
303
|
+
className: cn(
|
304
|
+
tabsTriggerVariant({ variant, orientation }),
|
305
|
+
"hawa-relative",
|
306
|
+
className
|
307
|
+
),
|
308
|
+
...props
|
309
|
+
},
|
310
|
+
props.children,
|
311
|
+
chipProps && /* @__PURE__ */ React9.createElement(Chip, { ...chipProps })
|
312
|
+
);
|
313
|
+
}
|
314
|
+
}
|
315
|
+
);
|
316
|
+
var TabsContent = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React9.createElement(
|
317
|
+
TabsPrimitive.Content,
|
318
|
+
{
|
319
|
+
ref,
|
320
|
+
className: cn(
|
321
|
+
"hawa-ring-offset-hawa-background hawa-w-full focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2",
|
322
|
+
className
|
323
|
+
),
|
324
|
+
...props
|
325
|
+
}
|
326
|
+
));
|
327
|
+
Tabs.displayName = TabsPrimitive.Root.displayName;
|
328
|
+
TabsList.displayName = TabsPrimitive.List.displayName;
|
329
|
+
TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
|
330
|
+
TabsContent.displayName = TabsPrimitive.Content.displayName;
|
331
|
+
|
332
|
+
// elements/input/Input.tsx
|
333
|
+
import React10, { forwardRef as forwardRef2, useState as useState17 } from "react";
|
334
|
+
var Input = forwardRef2(
|
335
|
+
({
|
336
|
+
margin = "none",
|
337
|
+
width = "full",
|
338
|
+
preview = false,
|
339
|
+
forceHideHelperText = false,
|
340
|
+
labelProps,
|
341
|
+
placeholder,
|
342
|
+
showCount,
|
343
|
+
inputProps,
|
344
|
+
countPosition = "bottom",
|
345
|
+
...props
|
346
|
+
}, ref) => {
|
347
|
+
var _a;
|
348
|
+
const [value, setValue] = useState17(props.value || "");
|
349
|
+
let marginStyles = {
|
350
|
+
none: "hawa-mb-0",
|
351
|
+
normal: "hawa-mb-3",
|
352
|
+
large: "hawa-mb-5"
|
353
|
+
};
|
354
|
+
let widthStyles = {
|
355
|
+
small: "hawa-w-full hawa-max-w-2xs",
|
356
|
+
normal: "hawa-w-1/2",
|
357
|
+
full: "hawa-w-full",
|
358
|
+
auto: ""
|
359
|
+
};
|
360
|
+
let defaultStyle = "hawa-flex hawa-max-h-fit hawa-h-fit hawa-relative hawa-flex-col hawa-justify-center hawa-gap-0";
|
361
|
+
let defaultInputStyle = "hawa-block hawa-w-full hawa-rounded hawa-border hawa-transition-all hawa-bg-background hawa-p-3 hawa-text-sm placeholder:hawa-text-muted-foreground";
|
362
|
+
const handleChange = (e) => {
|
363
|
+
let newValue = e.target.value;
|
364
|
+
setValue(newValue);
|
365
|
+
if (props.prefixText) {
|
366
|
+
if (newValue.length < props.prefixText.length) {
|
367
|
+
newValue = props.prefixText;
|
368
|
+
} else {
|
369
|
+
const isSubstring = props.prefixText.startsWith(newValue);
|
370
|
+
if (!isSubstring && !newValue.startsWith(props.prefixText)) {
|
371
|
+
newValue = `${props.prefixText}${newValue}`;
|
372
|
+
}
|
373
|
+
}
|
374
|
+
}
|
375
|
+
if (props.onChange) {
|
376
|
+
if (props.type === "number" && props.maxLength) {
|
377
|
+
let v = newValue.replace(/[^0-9]/g, "").slice(0, props.maxLength);
|
378
|
+
const newEvent = { ...e, target: { ...e.target, value: v } };
|
379
|
+
setValue(v);
|
380
|
+
props.onChange(newEvent);
|
381
|
+
} else {
|
382
|
+
const newEvent = { ...e, target: { ...e.target, value: newValue } };
|
383
|
+
setValue(newValue);
|
384
|
+
props.onChange(newEvent);
|
385
|
+
}
|
386
|
+
}
|
387
|
+
};
|
388
|
+
const handleKeyDown = (e) => {
|
389
|
+
if (props.type === "number" && ["e", "E", "+", "-", "."].includes(e.key)) {
|
390
|
+
e.preventDefault();
|
391
|
+
}
|
392
|
+
props.onKeyDown && props.onKeyDown(e);
|
393
|
+
};
|
394
|
+
return /* @__PURE__ */ React10.createElement(
|
395
|
+
"div",
|
396
|
+
{
|
397
|
+
className: cn(
|
398
|
+
defaultStyle,
|
399
|
+
marginStyles[margin],
|
400
|
+
widthStyles[width],
|
401
|
+
props.containerClassName,
|
402
|
+
"hawa-w-full hawa-gap-2"
|
403
|
+
)
|
404
|
+
},
|
405
|
+
props.label && /* @__PURE__ */ React10.createElement(Label, { ...labelProps }, props.label),
|
406
|
+
/* @__PURE__ */ React10.createElement("div", { className: "hawa-flex hawa-flex-row hawa-w-full hawa-items-center" }, props.outsidePrefix && /* @__PURE__ */ React10.createElement("span", { className: cn("hawa-me-2 hawa-opacity-90", !forceHideHelperText && "hawa-mb-2") }, props.outsidePrefix), props.isLoading ? /* @__PURE__ */ React10.createElement("div", { className: "hawa-pb-2 hawa-w-full" }, /* @__PURE__ */ React10.createElement(Skeleton, { as: "input" })) : props.isLoadingError ? /* @__PURE__ */ React10.createElement("div", { className: "hawa-pb-2 hawa-w-full" }, /* @__PURE__ */ React10.createElement(
|
407
|
+
Skeleton,
|
408
|
+
{
|
409
|
+
animation: "none",
|
410
|
+
className: "hawa-h-[40px] hawa-w-full !hawa-bg-destructive/[0.3]",
|
411
|
+
content: /* @__PURE__ */ React10.createElement("div", { className: "hawa-flex hawa-flex-row hawa-gap-2" }, /* @__PURE__ */ React10.createElement(
|
412
|
+
"svg",
|
413
|
+
{
|
414
|
+
xmlns: "http://www.w3.org/2000/svg",
|
415
|
+
width: "20",
|
416
|
+
height: "20",
|
417
|
+
viewBox: "0 0 24 24",
|
418
|
+
fill: "none",
|
419
|
+
stroke: "currentColor",
|
420
|
+
strokeWidth: "2",
|
421
|
+
strokeLinecap: "round",
|
422
|
+
strokeLinejoin: "round",
|
423
|
+
className: "hawa-text-destructive"
|
424
|
+
},
|
425
|
+
/* @__PURE__ */ React10.createElement("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }),
|
426
|
+
/* @__PURE__ */ React10.createElement("path", { d: "M12 9v4" }),
|
427
|
+
/* @__PURE__ */ React10.createElement("path", { d: "M12 17h.01" })
|
428
|
+
), /* @__PURE__ */ React10.createElement("span", null, /* @__PURE__ */ React10.createElement("span", { className: "hawa-text-destructive" }, props.loadingErrorMesssage || "Error loading data")))
|
429
|
+
}
|
430
|
+
)) : /* @__PURE__ */ React10.createElement(React10.Fragment, null, !props.hideSeparator && /* @__PURE__ */ React10.createElement(
|
431
|
+
"div",
|
432
|
+
{
|
433
|
+
className: cn(
|
434
|
+
"hawa-absolute hawa-top-[22px] hawa-h-[0.8px] hawa-w-full hawa-bg-gray-200 hawa-transition-all dark:hawa-bg-gray-800",
|
435
|
+
preview ? "hawa-opacity-100" : "hawa-opacity-0"
|
436
|
+
)
|
437
|
+
}
|
438
|
+
), /* @__PURE__ */ React10.createElement("div", { className: "hawa-flex hawa-flex-col hawa-w-full hawa-gap-2" }, /* @__PURE__ */ React10.createElement("div", { className: "hawa-relative" }, props.startIcon && /* @__PURE__ */ React10.createElement("div", { className: "hawa-absolute hawa-start-3 hawa-top-1/2 hawa--translate-y-1/2" }, props.startIcon), props.endIcon && /* @__PURE__ */ React10.createElement(
|
439
|
+
"div",
|
440
|
+
{
|
441
|
+
className: cn(
|
442
|
+
"hawa-absolute hawa-end-3 hawa-top-1/2 hawa--translate-y-1/2",
|
443
|
+
(_a = props.endIconProps) == null ? void 0 : _a.className
|
444
|
+
)
|
445
|
+
},
|
446
|
+
props.endIcon
|
447
|
+
), /* @__PURE__ */ React10.createElement(
|
448
|
+
"input",
|
449
|
+
{
|
450
|
+
required: true,
|
451
|
+
dir: props.dir,
|
452
|
+
type: props.type,
|
453
|
+
value: props.value || value,
|
454
|
+
onChange: handleChange,
|
455
|
+
onKeyDown: handleKeyDown,
|
456
|
+
autoComplete: props.autoComplete,
|
457
|
+
defaultValue: props.defaultValue,
|
458
|
+
placeholder,
|
459
|
+
disabled: props.disabled || preview,
|
460
|
+
style: { height: 40 },
|
461
|
+
maxLength: props.maxLength,
|
462
|
+
...inputProps,
|
463
|
+
className: cn(
|
464
|
+
defaultInputStyle,
|
465
|
+
"focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 dark:hawa-text-white",
|
466
|
+
{
|
467
|
+
"hawa-pe-9": props.endIcon,
|
468
|
+
"hawa-ps-9": props.startIcon,
|
469
|
+
"hawa-pe-[60px]": countPosition === "center"
|
470
|
+
},
|
471
|
+
preview && "hawa-border-transparent hawa-bg-transparent hawa-px-0",
|
472
|
+
inputProps == null ? void 0 : inputProps.className
|
473
|
+
)
|
474
|
+
}
|
475
|
+
)), !forceHideHelperText && /* @__PURE__ */ React10.createElement(HelperText, { helperText: props.helperText }), !props.disabled && forceHideHelperText && /* @__PURE__ */ React10.createElement(
|
476
|
+
"div",
|
477
|
+
{
|
478
|
+
className: cn(
|
479
|
+
"hawa-absolute hawa-end-0 hawa-top-[47px] hawa-z-20 hawa-translate-y-1/2 hawa-rounded hawa-bg-background hawa-text-start hawa-text-xs hawa-text-helper-color hawa-drop-shadow-md hawa-transition-all",
|
480
|
+
props.helperText ? "hawa-border hawa-p-1" : "hawa-border-none hawa-p-0"
|
481
|
+
)
|
482
|
+
},
|
483
|
+
props.helperText
|
484
|
+
), showCount && /* @__PURE__ */ React10.createElement(
|
485
|
+
"div",
|
486
|
+
{
|
487
|
+
className: cn(
|
488
|
+
"hawa-absolute hawa-translate-y-1/2 hawa-text-start hawa-text-xs hawa-transition-all",
|
489
|
+
{
|
490
|
+
"hawa-end-0 hawa-top-[62px]": countPosition === "bottom",
|
491
|
+
"hawa-bottom-[62px] hawa-end-0": countPosition === "top",
|
492
|
+
"hawa-end-2": countPosition === "center"
|
493
|
+
}
|
494
|
+
)
|
495
|
+
},
|
496
|
+
props.value ? String(props.value).length : 0,
|
497
|
+
"/",
|
498
|
+
props.maxLength
|
499
|
+
))))
|
500
|
+
);
|
501
|
+
}
|
502
|
+
);
|
503
|
+
|
504
|
+
export {
|
505
|
+
getHotkeyHandler,
|
506
|
+
Tabs,
|
507
|
+
TabsList,
|
508
|
+
TabsTrigger,
|
509
|
+
TabsContent,
|
510
|
+
Input
|
511
|
+
};
|
@@ -11,8 +11,8 @@ import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
|
|
11
11
|
import * as SheetPrimitive from '@radix-ui/react-dialog';
|
12
12
|
import { DialogProps } from '@radix-ui/react-dialog';
|
13
13
|
import { VariantProps } from 'class-variance-authority';
|
14
|
-
import { L as LabelProps } from '../Radio-
|
15
|
-
export { b as Label, d as PhoneInput, P as PhoneInputProps, a as Radio, R as RadioOptionsTypes, c as Select, S as SelectOptionProps } from '../Radio-
|
14
|
+
import { L as LabelProps } from '../Radio-BPHTeDMz.mjs';
|
15
|
+
export { b as Label, d as PhoneCodeValue, e as PhoneInput, P as PhoneInputProps, a as Radio, R as RadioOptionsTypes, c as Select, S as SelectOptionProps } from '../Radio-BPHTeDMz.mjs';
|
16
16
|
import { RowData, ColumnDef } from '@tanstack/react-table';
|
17
17
|
export { ColumnDef } from '@tanstack/react-table';
|
18
18
|
import { Command as Command$1 } from 'cmdk';
|
package/dist/elements/index.d.ts
CHANGED
@@ -11,8 +11,8 @@ import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
|
|
11
11
|
import * as SheetPrimitive from '@radix-ui/react-dialog';
|
12
12
|
import { DialogProps } from '@radix-ui/react-dialog';
|
13
13
|
import { VariantProps } from 'class-variance-authority';
|
14
|
-
import { L as LabelProps } from '../Radio-
|
15
|
-
export { b as Label, d as PhoneInput, P as PhoneInputProps, a as Radio, R as RadioOptionsTypes, c as Select, S as SelectOptionProps } from '../Radio-
|
14
|
+
import { L as LabelProps } from '../Radio-cRcIH8_L.js';
|
15
|
+
export { b as Label, d as PhoneCodeValue, e as PhoneInput, P as PhoneInputProps, a as Radio, R as RadioOptionsTypes, c as Select, S as SelectOptionProps } from '../Radio-cRcIH8_L.js';
|
16
16
|
import { RowData, ColumnDef } from '@tanstack/react-table';
|
17
17
|
export { ColumnDef } from '@tanstack/react-table';
|
18
18
|
import { Command as Command$1 } from 'cmdk';
|