@sikka/hawa 0.44.0-next → 0.45.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.
@@ -232,6 +232,64 @@ var import_react16 = require("react");
232
232
 
233
233
  // hooks/useShortcuts.ts
234
234
  var import_react17 = require("react");
235
+ function parseHotkey(hotkey) {
236
+ const keys = hotkey.toLowerCase().split("+").map((part) => part.trim());
237
+ const modifiers = {
238
+ alt: keys.includes("alt"),
239
+ ctrl: keys.includes("ctrl"),
240
+ meta: keys.includes("meta"),
241
+ mod: keys.includes("mod"),
242
+ shift: keys.includes("shift")
243
+ };
244
+ const reservedKeys = ["alt", "ctrl", "meta", "shift", "mod"];
245
+ const freeKey = keys.find((key) => !reservedKeys.includes(key));
246
+ return {
247
+ ...modifiers,
248
+ key: freeKey
249
+ };
250
+ }
251
+ function isExactHotkey(hotkey, event) {
252
+ const { alt, ctrl, meta, mod, shift, key } = hotkey;
253
+ const { altKey, ctrlKey, metaKey, shiftKey, key: pressedKey } = event;
254
+ if (alt !== altKey) {
255
+ return false;
256
+ }
257
+ if (mod) {
258
+ if (!ctrlKey && !metaKey) {
259
+ return false;
260
+ }
261
+ } else {
262
+ if (ctrl !== ctrlKey) {
263
+ return false;
264
+ }
265
+ if (meta !== metaKey) {
266
+ return false;
267
+ }
268
+ }
269
+ if (shift !== shiftKey) {
270
+ return false;
271
+ }
272
+ if (key && (pressedKey.toLowerCase() === key.toLowerCase() || event.code.replace("Key", "").toLowerCase() === key.toLowerCase())) {
273
+ return true;
274
+ }
275
+ return false;
276
+ }
277
+ function getHotkeyMatcher(hotkey) {
278
+ return (event) => isExactHotkey(parseHotkey(hotkey), event);
279
+ }
280
+ function getHotkeyHandler(hotkeys) {
281
+ return (event) => {
282
+ const _event = "nativeEvent" in event ? event.nativeEvent : event;
283
+ hotkeys.forEach(([hotkey, handler, options = { preventDefault: true }]) => {
284
+ if (getHotkeyMatcher(hotkey)(_event)) {
285
+ if (options.preventDefault) {
286
+ event.preventDefault();
287
+ }
288
+ handler(_event);
289
+ }
290
+ });
291
+ };
292
+ }
235
293
 
236
294
  // hooks/useWindowEvent.ts
237
295
  var import_react18 = require("react");
@@ -1445,13 +1503,21 @@ var Select = ({
1445
1503
  children
1446
1504
  );
1447
1505
  };
1448
- const Option = ({ children, innerProps, innerRef }) => {
1506
+ const Option = ({
1507
+ children,
1508
+ innerProps,
1509
+ innerRef,
1510
+ isFocused,
1511
+ isSelected
1512
+ }) => {
1449
1513
  return /* @__PURE__ */ import_react33.default.createElement(
1450
1514
  "div",
1451
1515
  {
1452
1516
  ref: innerRef,
1453
1517
  className: cn(
1454
- "hawa-flex hawa-cursor-pointer hawa-select-none hawa-flex-row hawa-items-center hawa-justify-between hawa-rounded-inner hawa-p-1 hawa-px-2 hawa-transition-all hover:hawa-bg-primary hover:hawa-text-primary-foreground"
1518
+ "hawa-flex hawa-cursor-pointer hawa-select-none hawa-flex-row hawa-items-center hawa-justify-between hawa-rounded-inner hawa-p-1 hawa-px-2 hawa-transition-all",
1519
+ isFocused ? "hawa-bg-accent hawa-text-bg-accent-foreground" : "hover:hawa-bg-accent hover:hawa-text-accent-foreground",
1520
+ isSelected && "hawa-bg-primary hawa-text-primary-foreground"
1455
1521
  ),
1456
1522
  ...innerProps
1457
1523
  },
@@ -1508,15 +1574,20 @@ var Select = ({
1508
1574
  container: () => cn(
1509
1575
  selectContainerStyles,
1510
1576
  props.phoneCode && phoneCodeStyles,
1511
- props.disabled ? "hawa-cursor-not-allowed" : "hawa-cursor-pointer",
1512
1577
  props.isMulti && "hawa-ps-0 "
1513
1578
  ),
1514
- placeholder: () => selectPlaceholderStyles,
1579
+ placeholder: () => cn(
1580
+ selectPlaceholderStyles,
1581
+ props.disabled && "hawa-text-muted-foreground"
1582
+ ),
1515
1583
  valueContainer: () => "hawa-text-foreground hawa-px-1 ",
1516
- singleValue: () => "hawa-text-foreground",
1584
+ singleValue: () => cn(
1585
+ props.disabled ? "hawa-text-muted-foreground hawa-opacity-30" : "hawa-text-foreground"
1586
+ ),
1517
1587
  indicatorsContainer: () => cn(
1518
1588
  selectIndicatorContainerStyles,
1519
- props.hideIndicator ? "hawa-invisible" : "hawa-px-1"
1589
+ props.hideIndicator ? "hawa-invisible" : "hawa-px-1",
1590
+ props.disabled && "hawa-opacity-30"
1520
1591
  )
1521
1592
  },
1522
1593
  unstyled: true,
@@ -1524,12 +1595,6 @@ var Select = ({
1524
1595
  components: props.hideIndicator ? { Option, Menu, IndicatorsContainer: () => null } : {
1525
1596
  Option,
1526
1597
  Menu,
1527
- // Control: (e) => (
1528
- // <div
1529
- // className={cn(e.className, "hawa-flex hawa-flex-row")}
1530
- // {...e}
1531
- // />
1532
- // ),
1533
1598
  ValueContainer: (e) => /* @__PURE__ */ import_react33.default.createElement(
1534
1599
  "div",
1535
1600
  {
@@ -1652,6 +1717,7 @@ var ContactForm = ({
1652
1717
  onSubmit,
1653
1718
  customFields,
1654
1719
  classNames,
1720
+ clearOnSubmit = true,
1655
1721
  ...props
1656
1722
  }) => {
1657
1723
  var _a, _b, _c, _d, _e;
@@ -1695,8 +1761,11 @@ var ContactForm = ({
1695
1761
  control,
1696
1762
  handleSubmit,
1697
1763
  formState: { errors },
1698
- reset
1764
+ reset,
1765
+ getValues,
1766
+ trigger
1699
1767
  } = (0, import_react_hook_form2.useForm)({
1768
+ mode: "all",
1700
1769
  resolver: (0, import_zod.zodResolver)(MainSchema),
1701
1770
  defaultValues: {
1702
1771
  name: "",
@@ -1705,10 +1774,16 @@ var ContactForm = ({
1705
1774
  ...customFieldsDefaultValues
1706
1775
  }
1707
1776
  });
1708
- const handleFormSubmit = (data) => {
1777
+ const SubmitForm = async (data) => {
1778
+ const isValid = await trigger();
1779
+ if (!isValid) {
1780
+ return;
1781
+ }
1709
1782
  if (onSubmit) {
1710
1783
  onSubmit(data);
1711
- reset();
1784
+ if (clearOnSubmit) {
1785
+ reset();
1786
+ }
1712
1787
  } else {
1713
1788
  console.log("Form is submitted but onSubmit prop is missing");
1714
1789
  }
@@ -1718,7 +1793,8 @@ var ContactForm = ({
1718
1793
  {
1719
1794
  className: cn(
1720
1795
  "hawa-w-full",
1721
- cardless && "hawa-border-none hawa-bg-transparent hawa-shadow-none hawa-drop-shadow-none"
1796
+ cardless && "hawa-border-none hawa-bg-transparent hawa-shadow-none hawa-drop-shadow-none",
1797
+ classNames == null ? void 0 : classNames.container
1722
1798
  ),
1723
1799
  style: cardless ? { boxShadow: "none" } : void 0
1724
1800
  },
@@ -1726,7 +1802,7 @@ var ContactForm = ({
1726
1802
  "form",
1727
1803
  {
1728
1804
  noValidate: true,
1729
- onSubmit: handleSubmit(handleFormSubmit),
1805
+ onSubmit: handleSubmit(SubmitForm),
1730
1806
  className: "hawa-space-y-2",
1731
1807
  id: formId,
1732
1808
  autoComplete: formAutoComplete
@@ -1837,7 +1913,10 @@ var ContactForm = ({
1837
1913
  textareaProps: {
1838
1914
  placeholder: texts == null ? void 0 : texts.message.placeholder,
1839
1915
  className: "hawa-min-h-20",
1840
- ...field
1916
+ ...field,
1917
+ onKeyDown: getHotkeyHandler([
1918
+ ["mod+enter", () => SubmitForm(getValues())]
1919
+ ])
1841
1920
  },
1842
1921
  classNames: { textarea: "hawa-min-h-40 hawa-h-full" },
1843
1922
  helperText: (_a2 = errors.message) == null ? void 0 : _a2.message
@@ -11,7 +11,7 @@ import {
11
11
  } from "../../chunk-FIUKVRL5.mjs";
12
12
  import {
13
13
  Select
14
- } from "../../chunk-DYYINLRJ.mjs";
14
+ } from "../../chunk-LMYT23CT.mjs";
15
15
  import {
16
16
  Button,
17
17
  Card,
@@ -84,6 +84,64 @@ import { useEffect as useEffect14, useRef as useRef8 } from "react";
84
84
 
85
85
  // hooks/useShortcuts.ts
86
86
  import { useEffect as useEffect15 } from "react";
87
+ function parseHotkey(hotkey) {
88
+ const keys = hotkey.toLowerCase().split("+").map((part) => part.trim());
89
+ const modifiers = {
90
+ alt: keys.includes("alt"),
91
+ ctrl: keys.includes("ctrl"),
92
+ meta: keys.includes("meta"),
93
+ mod: keys.includes("mod"),
94
+ shift: keys.includes("shift")
95
+ };
96
+ const reservedKeys = ["alt", "ctrl", "meta", "shift", "mod"];
97
+ const freeKey = keys.find((key) => !reservedKeys.includes(key));
98
+ return {
99
+ ...modifiers,
100
+ key: freeKey
101
+ };
102
+ }
103
+ function isExactHotkey(hotkey, event) {
104
+ const { alt, ctrl, meta, mod, shift, key } = hotkey;
105
+ const { altKey, ctrlKey, metaKey, shiftKey, key: pressedKey } = event;
106
+ if (alt !== altKey) {
107
+ return false;
108
+ }
109
+ if (mod) {
110
+ if (!ctrlKey && !metaKey) {
111
+ return false;
112
+ }
113
+ } else {
114
+ if (ctrl !== ctrlKey) {
115
+ return false;
116
+ }
117
+ if (meta !== metaKey) {
118
+ return false;
119
+ }
120
+ }
121
+ if (shift !== shiftKey) {
122
+ return false;
123
+ }
124
+ if (key && (pressedKey.toLowerCase() === key.toLowerCase() || event.code.replace("Key", "").toLowerCase() === key.toLowerCase())) {
125
+ return true;
126
+ }
127
+ return false;
128
+ }
129
+ function getHotkeyMatcher(hotkey) {
130
+ return (event) => isExactHotkey(parseHotkey(hotkey), event);
131
+ }
132
+ function getHotkeyHandler(hotkeys) {
133
+ return (event) => {
134
+ const _event = "nativeEvent" in event ? event.nativeEvent : event;
135
+ hotkeys.forEach(([hotkey, handler, options = { preventDefault: true }]) => {
136
+ if (getHotkeyMatcher(hotkey)(_event)) {
137
+ if (options.preventDefault) {
138
+ event.preventDefault();
139
+ }
140
+ handler(_event);
141
+ }
142
+ });
143
+ };
144
+ }
87
145
 
88
146
  // hooks/useWindowEvent.ts
89
147
  import { useEffect as useEffect16 } from "react";
@@ -447,6 +505,7 @@ var ContactForm = ({
447
505
  onSubmit,
448
506
  customFields,
449
507
  classNames,
508
+ clearOnSubmit = true,
450
509
  ...props
451
510
  }) => {
452
511
  var _a, _b, _c, _d, _e;
@@ -490,8 +549,11 @@ var ContactForm = ({
490
549
  control,
491
550
  handleSubmit,
492
551
  formState: { errors },
493
- reset
552
+ reset,
553
+ getValues,
554
+ trigger
494
555
  } = useForm2({
556
+ mode: "all",
495
557
  resolver: zodResolver(MainSchema),
496
558
  defaultValues: {
497
559
  name: "",
@@ -500,10 +562,16 @@ var ContactForm = ({
500
562
  ...customFieldsDefaultValues
501
563
  }
502
564
  });
503
- const handleFormSubmit = (data) => {
565
+ const SubmitForm = async (data) => {
566
+ const isValid = await trigger();
567
+ if (!isValid) {
568
+ return;
569
+ }
504
570
  if (onSubmit) {
505
571
  onSubmit(data);
506
- reset();
572
+ if (clearOnSubmit) {
573
+ reset();
574
+ }
507
575
  } else {
508
576
  console.log("Form is submitted but onSubmit prop is missing");
509
577
  }
@@ -513,7 +581,8 @@ var ContactForm = ({
513
581
  {
514
582
  className: cn(
515
583
  "hawa-w-full",
516
- cardless && "hawa-border-none hawa-bg-transparent hawa-shadow-none hawa-drop-shadow-none"
584
+ cardless && "hawa-border-none hawa-bg-transparent hawa-shadow-none hawa-drop-shadow-none",
585
+ classNames == null ? void 0 : classNames.container
517
586
  ),
518
587
  style: cardless ? { boxShadow: "none" } : void 0
519
588
  },
@@ -521,7 +590,7 @@ var ContactForm = ({
521
590
  "form",
522
591
  {
523
592
  noValidate: true,
524
- onSubmit: handleSubmit(handleFormSubmit),
593
+ onSubmit: handleSubmit(SubmitForm),
525
594
  className: "hawa-space-y-2",
526
595
  id: formId,
527
596
  autoComplete: formAutoComplete
@@ -632,7 +701,10 @@ var ContactForm = ({
632
701
  textareaProps: {
633
702
  placeholder: texts == null ? void 0 : texts.message.placeholder,
634
703
  className: "hawa-min-h-20",
635
- ...field
704
+ ...field,
705
+ onKeyDown: getHotkeyHandler([
706
+ ["mod+enter", () => SubmitForm(getValues())]
707
+ ])
636
708
  },
637
709
  classNames: { textarea: "hawa-min-h-40 hawa-h-full" },
638
710
  helperText: (_a2 = errors.message) == null ? void 0 : _a2.message
@@ -33,13 +33,21 @@ var Select = ({
33
33
  children
34
34
  );
35
35
  };
36
- const Option = ({ children, innerProps, innerRef }) => {
36
+ const Option = ({
37
+ children,
38
+ innerProps,
39
+ innerRef,
40
+ isFocused,
41
+ isSelected
42
+ }) => {
37
43
  return /* @__PURE__ */ React.createElement(
38
44
  "div",
39
45
  {
40
46
  ref: innerRef,
41
47
  className: cn(
42
- "hawa-flex hawa-cursor-pointer hawa-select-none hawa-flex-row hawa-items-center hawa-justify-between hawa-rounded-inner hawa-p-1 hawa-px-2 hawa-transition-all hover:hawa-bg-primary hover:hawa-text-primary-foreground"
48
+ "hawa-flex hawa-cursor-pointer hawa-select-none hawa-flex-row hawa-items-center hawa-justify-between hawa-rounded-inner hawa-p-1 hawa-px-2 hawa-transition-all",
49
+ isFocused ? "hawa-bg-accent hawa-text-bg-accent-foreground" : "hover:hawa-bg-accent hover:hawa-text-accent-foreground",
50
+ isSelected && "hawa-bg-primary hawa-text-primary-foreground"
43
51
  ),
44
52
  ...innerProps
45
53
  },
@@ -96,15 +104,20 @@ var Select = ({
96
104
  container: () => cn(
97
105
  selectContainerStyles,
98
106
  props.phoneCode && phoneCodeStyles,
99
- props.disabled ? "hawa-cursor-not-allowed" : "hawa-cursor-pointer",
100
107
  props.isMulti && "hawa-ps-0 "
101
108
  ),
102
- placeholder: () => selectPlaceholderStyles,
109
+ placeholder: () => cn(
110
+ selectPlaceholderStyles,
111
+ props.disabled && "hawa-text-muted-foreground"
112
+ ),
103
113
  valueContainer: () => "hawa-text-foreground hawa-px-1 ",
104
- singleValue: () => "hawa-text-foreground",
114
+ singleValue: () => cn(
115
+ props.disabled ? "hawa-text-muted-foreground hawa-opacity-30" : "hawa-text-foreground"
116
+ ),
105
117
  indicatorsContainer: () => cn(
106
118
  selectIndicatorContainerStyles,
107
- props.hideIndicator ? "hawa-invisible" : "hawa-px-1"
119
+ props.hideIndicator ? "hawa-invisible" : "hawa-px-1",
120
+ props.disabled && "hawa-opacity-30"
108
121
  )
109
122
  },
110
123
  unstyled: true,
@@ -112,12 +125,6 @@ var Select = ({
112
125
  components: props.hideIndicator ? { Option, Menu, IndicatorsContainer: () => null } : {
113
126
  Option,
114
127
  Menu,
115
- // Control: (e) => (
116
- // <div
117
- // className={cn(e.className, "hawa-flex hawa-flex-row")}
118
- // {...e}
119
- // />
120
- // ),
121
128
  ValueContainer: (e) => /* @__PURE__ */ React.createElement(
122
129
  "div",
123
130
  {
@@ -360,13 +360,21 @@ var Select = ({
360
360
  children
361
361
  );
362
362
  };
363
- const Option = ({ children, innerProps, innerRef }) => {
363
+ const Option = ({
364
+ children,
365
+ innerProps,
366
+ innerRef,
367
+ isFocused,
368
+ isSelected
369
+ }) => {
364
370
  return /* @__PURE__ */ React3.createElement(
365
371
  "div",
366
372
  {
367
373
  ref: innerRef,
368
374
  className: cn(
369
- "hawa-flex hawa-cursor-pointer hawa-select-none hawa-flex-row hawa-items-center hawa-justify-between hawa-rounded-inner hawa-p-1 hawa-px-2 hawa-transition-all hover:hawa-bg-primary hover:hawa-text-primary-foreground"
375
+ "hawa-flex hawa-cursor-pointer hawa-select-none hawa-flex-row hawa-items-center hawa-justify-between hawa-rounded-inner hawa-p-1 hawa-px-2 hawa-transition-all",
376
+ isFocused ? "hawa-bg-accent hawa-text-bg-accent-foreground" : "hover:hawa-bg-accent hover:hawa-text-accent-foreground",
377
+ isSelected && "hawa-bg-primary hawa-text-primary-foreground"
370
378
  ),
371
379
  ...innerProps
372
380
  },
@@ -423,15 +431,20 @@ var Select = ({
423
431
  container: () => cn(
424
432
  selectContainerStyles,
425
433
  props.phoneCode && phoneCodeStyles,
426
- props.disabled ? "hawa-cursor-not-allowed" : "hawa-cursor-pointer",
427
434
  props.isMulti && "hawa-ps-0 "
428
435
  ),
429
- placeholder: () => selectPlaceholderStyles,
436
+ placeholder: () => cn(
437
+ selectPlaceholderStyles,
438
+ props.disabled && "hawa-text-muted-foreground"
439
+ ),
430
440
  valueContainer: () => "hawa-text-foreground hawa-px-1 ",
431
- singleValue: () => "hawa-text-foreground",
441
+ singleValue: () => cn(
442
+ props.disabled ? "hawa-text-muted-foreground hawa-opacity-30" : "hawa-text-foreground"
443
+ ),
432
444
  indicatorsContainer: () => cn(
433
445
  selectIndicatorContainerStyles,
434
- props.hideIndicator ? "hawa-invisible" : "hawa-px-1"
446
+ props.hideIndicator ? "hawa-invisible" : "hawa-px-1",
447
+ props.disabled && "hawa-opacity-30"
435
448
  )
436
449
  },
437
450
  unstyled: true,
@@ -439,12 +452,6 @@ var Select = ({
439
452
  components: props.hideIndicator ? { Option, Menu, IndicatorsContainer: () => null } : {
440
453
  Option,
441
454
  Menu,
442
- // Control: (e) => (
443
- // <div
444
- // className={cn(e.className, "hawa-flex hawa-flex-row")}
445
- // {...e}
446
- // />
447
- // ),
448
455
  ValueContainer: (e) => /* @__PURE__ */ React3.createElement(
449
456
  "div",
450
457
  {
@@ -2409,19 +2416,19 @@ var StopPropagationWrapper = (props) => {
2409
2416
  import * as React7 from "react";
2410
2417
  import { OTPInput, OTPInputContext } from "input-otp";
2411
2418
 
2412
- // ../../node_modules/.pnpm/lucide-react@0.417.0_react@18.3.1/node_modules/lucide-react/dist/esm/createLucideIcon.js
2419
+ // ../../node_modules/.pnpm/lucide-react@0.424.0_react@18.3.1/node_modules/lucide-react/dist/esm/createLucideIcon.js
2413
2420
  import { forwardRef as forwardRef4, createElement as createElement3 } from "react";
2414
2421
 
2415
- // ../../node_modules/.pnpm/lucide-react@0.417.0_react@18.3.1/node_modules/lucide-react/dist/esm/shared/src/utils.js
2422
+ // ../../node_modules/.pnpm/lucide-react@0.424.0_react@18.3.1/node_modules/lucide-react/dist/esm/shared/src/utils.js
2416
2423
  var toKebabCase = (string) => string.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
2417
2424
  var mergeClasses = (...classes) => classes.filter((className, index, array) => {
2418
2425
  return Boolean(className) && array.indexOf(className) === index;
2419
2426
  }).join(" ");
2420
2427
 
2421
- // ../../node_modules/.pnpm/lucide-react@0.417.0_react@18.3.1/node_modules/lucide-react/dist/esm/Icon.js
2428
+ // ../../node_modules/.pnpm/lucide-react@0.424.0_react@18.3.1/node_modules/lucide-react/dist/esm/Icon.js
2422
2429
  import { forwardRef as forwardRef3, createElement as createElement2 } from "react";
2423
2430
 
2424
- // ../../node_modules/.pnpm/lucide-react@0.417.0_react@18.3.1/node_modules/lucide-react/dist/esm/defaultAttributes.js
2431
+ // ../../node_modules/.pnpm/lucide-react@0.424.0_react@18.3.1/node_modules/lucide-react/dist/esm/defaultAttributes.js
2425
2432
  var defaultAttributes = {
2426
2433
  xmlns: "http://www.w3.org/2000/svg",
2427
2434
  width: 24,
@@ -2434,7 +2441,7 @@ var defaultAttributes = {
2434
2441
  strokeLinejoin: "round"
2435
2442
  };
2436
2443
 
2437
- // ../../node_modules/.pnpm/lucide-react@0.417.0_react@18.3.1/node_modules/lucide-react/dist/esm/Icon.js
2444
+ // ../../node_modules/.pnpm/lucide-react@0.424.0_react@18.3.1/node_modules/lucide-react/dist/esm/Icon.js
2438
2445
  var Icon = forwardRef3(
2439
2446
  ({
2440
2447
  color = "currentColor",
@@ -2466,7 +2473,7 @@ var Icon = forwardRef3(
2466
2473
  }
2467
2474
  );
2468
2475
 
2469
- // ../../node_modules/.pnpm/lucide-react@0.417.0_react@18.3.1/node_modules/lucide-react/dist/esm/createLucideIcon.js
2476
+ // ../../node_modules/.pnpm/lucide-react@0.424.0_react@18.3.1/node_modules/lucide-react/dist/esm/createLucideIcon.js
2470
2477
  var createLucideIcon = (iconName, iconNode) => {
2471
2478
  const Component = forwardRef4(
2472
2479
  ({ className, ...props }, ref) => createElement3(Icon, {
@@ -2480,7 +2487,7 @@ var createLucideIcon = (iconName, iconNode) => {
2480
2487
  return Component;
2481
2488
  };
2482
2489
 
2483
- // ../../node_modules/.pnpm/lucide-react@0.417.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/dot.js
2490
+ // ../../node_modules/.pnpm/lucide-react@0.424.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/dot.js
2484
2491
  var Dot = createLucideIcon("Dot", [
2485
2492
  ["circle", { cx: "12.1", cy: "12.1", r: "1", key: "18d7e5" }]
2486
2493
  ]);
@@ -2537,12 +2544,19 @@ var PinInput = ({
2537
2544
  const clampedSeparatorPosition = Math.min(separatorPosition, maxLength);
2538
2545
  const firstGroupLength = clampedSeparatorPosition > 0 ? clampedSeparatorPosition : 0;
2539
2546
  const secondGroupLength = maxLength - firstGroupLength;
2540
- return /* @__PURE__ */ React7.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-2" }, /* @__PURE__ */ React7.createElement(PinInputRoot, { ...props }, firstGroupLength > 0 && /* @__PURE__ */ React7.createElement(PinInputGroup, { className: "hawa-w-full" }, [...Array(firstGroupLength)].map((_, index) => /* @__PURE__ */ React7.createElement(PinInputSlot, { key: index, index, className: "hawa-w-full" }))), separatorPosition > 0 && separatorPosition < props.maxLength && /* @__PURE__ */ React7.createElement(PinInputSeperator, null), secondGroupLength > 0 && /* @__PURE__ */ React7.createElement(PinInputGroup, { className: "hawa-w-full" }, [...Array(secondGroupLength)].map((_, index) => /* @__PURE__ */ React7.createElement(
2547
+ return /* @__PURE__ */ React7.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-2" }, /* @__PURE__ */ React7.createElement(PinInputRoot, { ...props }, firstGroupLength > 0 && /* @__PURE__ */ React7.createElement(PinInputGroup, { className: "hawa-w-full hawa-gap-2" }, [...Array(firstGroupLength)].map((_, index) => /* @__PURE__ */ React7.createElement(
2548
+ PinInputSlot,
2549
+ {
2550
+ key: index,
2551
+ index,
2552
+ className: "hawa-w-full hawa-border"
2553
+ }
2554
+ ))), separatorPosition > 0 && separatorPosition < props.maxLength && /* @__PURE__ */ React7.createElement(PinInputSeperator, null), secondGroupLength > 0 && /* @__PURE__ */ React7.createElement(PinInputGroup, { className: "hawa-w-full hawa-gap-2" }, [...Array(secondGroupLength)].map((_, index) => /* @__PURE__ */ React7.createElement(
2541
2555
  PinInputSlot,
2542
2556
  {
2543
2557
  key: index + firstGroupLength,
2544
2558
  index: index + firstGroupLength,
2545
- className: "hawa-w-full"
2559
+ className: "hawa-w-full hawa-border"
2546
2560
  }
2547
2561
  )))), /* @__PURE__ */ React7.createElement(HelperText, { helperText: props.helperText }));
2548
2562
  };
@@ -3305,7 +3319,7 @@ export {
3305
3319
 
3306
3320
  lucide-react/dist/esm/shared/src/utils.js:
3307
3321
  (**
3308
- * @license lucide-react v0.417.0 - ISC
3322
+ * @license lucide-react v0.424.0 - ISC
3309
3323
  *
3310
3324
  * This source code is licensed under the ISC license.
3311
3325
  * See the LICENSE file in the root directory of this source tree.
@@ -3313,7 +3327,7 @@ lucide-react/dist/esm/shared/src/utils.js:
3313
3327
 
3314
3328
  lucide-react/dist/esm/defaultAttributes.js:
3315
3329
  (**
3316
- * @license lucide-react v0.417.0 - ISC
3330
+ * @license lucide-react v0.424.0 - ISC
3317
3331
  *
3318
3332
  * This source code is licensed under the ISC license.
3319
3333
  * See the LICENSE file in the root directory of this source tree.
@@ -3321,7 +3335,7 @@ lucide-react/dist/esm/defaultAttributes.js:
3321
3335
 
3322
3336
  lucide-react/dist/esm/Icon.js:
3323
3337
  (**
3324
- * @license lucide-react v0.417.0 - ISC
3338
+ * @license lucide-react v0.424.0 - ISC
3325
3339
  *
3326
3340
  * This source code is licensed under the ISC license.
3327
3341
  * See the LICENSE file in the root directory of this source tree.
@@ -3329,7 +3343,7 @@ lucide-react/dist/esm/Icon.js:
3329
3343
 
3330
3344
  lucide-react/dist/esm/createLucideIcon.js:
3331
3345
  (**
3332
- * @license lucide-react v0.417.0 - ISC
3346
+ * @license lucide-react v0.424.0 - ISC
3333
3347
  *
3334
3348
  * This source code is licensed under the ISC license.
3335
3349
  * See the LICENSE file in the root directory of this source tree.
@@ -3337,7 +3351,7 @@ lucide-react/dist/esm/createLucideIcon.js:
3337
3351
 
3338
3352
  lucide-react/dist/esm/icons/dot.js:
3339
3353
  (**
3340
- * @license lucide-react v0.417.0 - ISC
3354
+ * @license lucide-react v0.424.0 - ISC
3341
3355
  *
3342
3356
  * This source code is licensed under the ISC license.
3343
3357
  * See the LICENSE file in the root directory of this source tree.
@@ -3345,7 +3359,7 @@ lucide-react/dist/esm/icons/dot.js:
3345
3359
 
3346
3360
  lucide-react/dist/esm/lucide-react.js:
3347
3361
  (**
3348
- * @license lucide-react v0.417.0 - ISC
3362
+ * @license lucide-react v0.424.0 - ISC
3349
3363
  *
3350
3364
  * This source code is licensed under the ISC license.
3351
3365
  * See the LICENSE file in the root directory of this source tree.