@sikka/hawa 0.44.0-next → 0.45.0-next

package/dist/index.mjs

@@ -5548,13 +5548,21 @@ var Select = ({
       children
     );
   };
-  const Option = ({ children, innerProps, innerRef }) => {
+  const Option = ({
+    children,
+    innerProps,
+    innerRef,
+    isFocused,
+    isSelected
+  }) => {
     return /* @__PURE__ */ React43.createElement(
       "div",
       {
         ref: innerRef,
         className: cn(
-          "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"
+          "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",
+          isFocused ? "hawa-bg-accent hawa-text-bg-accent-foreground" : "hover:hawa-bg-accent hover:hawa-text-accent-foreground",
+          isSelected && "hawa-bg-primary hawa-text-primary-foreground"
         ),
         ...innerProps
       },
@@ -5611,15 +5619,20 @@ var Select = ({
             container: () => cn(
               selectContainerStyles,
               props.phoneCode && phoneCodeStyles,
-              props.disabled ? "hawa-cursor-not-allowed" : "hawa-cursor-pointer",
               props.isMulti && "hawa-ps-0 "
             ),
-            placeholder: () => selectPlaceholderStyles,
+            placeholder: () => cn(
+              selectPlaceholderStyles,
+              props.disabled && "hawa-text-muted-foreground"
+            ),
             valueContainer: () => "hawa-text-foreground hawa-px-1 ",
-            singleValue: () => "hawa-text-foreground",
+            singleValue: () => cn(
+              props.disabled ? "hawa-text-muted-foreground hawa-opacity-30" : "hawa-text-foreground"
+            ),
             indicatorsContainer: () => cn(
               selectIndicatorContainerStyles,
-              props.hideIndicator ? "hawa-invisible" : "hawa-px-1"
+              props.hideIndicator ? "hawa-invisible" : "hawa-px-1",
+              props.disabled && "hawa-opacity-30"
             )
           },
           unstyled: true,
@@ -5627,12 +5640,6 @@ var Select = ({
           components: props.hideIndicator ? { Option, Menu: Menu2, IndicatorsContainer: () => null } : {
             Option,
             Menu: Menu2,
-            // Control: (e) => (
-            //   <div
-            //     className={cn(e.className, "hawa-flex hawa-flex-row")}
-            //     {...e}
-            //   />
-            // ),
             ValueContainer: (e) => /* @__PURE__ */ React43.createElement(
               "div",
               {
@@ -7704,19 +7711,19 @@ var PhoneInput = ({
 import * as React50 from "react";
 import { OTPInput, OTPInputContext } from "input-otp";
 
-// ../../node_modules/.pnpm/lucide-react@0.417.0_react@18.3.1/node_modules/lucide-react/dist/esm/createLucideIcon.js
+// ../../node_modules/.pnpm/lucide-react@0.424.0_react@18.3.1/node_modules/lucide-react/dist/esm/createLucideIcon.js
 import { forwardRef as forwardRef25, createElement as createElement24 } from "react";
 
-// ../../node_modules/.pnpm/lucide-react@0.417.0_react@18.3.1/node_modules/lucide-react/dist/esm/shared/src/utils.js
+// ../../node_modules/.pnpm/lucide-react@0.424.0_react@18.3.1/node_modules/lucide-react/dist/esm/shared/src/utils.js
 var toKebabCase = (string9) => string9.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
 var mergeClasses = (...classes) => classes.filter((className, index, array) => {
   return Boolean(className) && array.indexOf(className) === index;
 }).join(" ");
 
-// ../../node_modules/.pnpm/lucide-react@0.417.0_react@18.3.1/node_modules/lucide-react/dist/esm/Icon.js
+// ../../node_modules/.pnpm/lucide-react@0.424.0_react@18.3.1/node_modules/lucide-react/dist/esm/Icon.js
 import { forwardRef as forwardRef24, createElement as createElement23 } from "react";
 
-// ../../node_modules/.pnpm/lucide-react@0.417.0_react@18.3.1/node_modules/lucide-react/dist/esm/defaultAttributes.js
+// ../../node_modules/.pnpm/lucide-react@0.424.0_react@18.3.1/node_modules/lucide-react/dist/esm/defaultAttributes.js
 var defaultAttributes = {
   xmlns: "http://www.w3.org/2000/svg",
   width: 24,
@@ -7729,7 +7736,7 @@ var defaultAttributes = {
   strokeLinejoin: "round"
 };
 
-// ../../node_modules/.pnpm/lucide-react@0.417.0_react@18.3.1/node_modules/lucide-react/dist/esm/Icon.js
+// ../../node_modules/.pnpm/lucide-react@0.424.0_react@18.3.1/node_modules/lucide-react/dist/esm/Icon.js
 var Icon = forwardRef24(
   ({
     color = "currentColor",
@@ -7761,7 +7768,7 @@ var Icon = forwardRef24(
   }
 );
 
-// ../../node_modules/.pnpm/lucide-react@0.417.0_react@18.3.1/node_modules/lucide-react/dist/esm/createLucideIcon.js
+// ../../node_modules/.pnpm/lucide-react@0.424.0_react@18.3.1/node_modules/lucide-react/dist/esm/createLucideIcon.js
 var createLucideIcon = (iconName, iconNode) => {
   const Component = forwardRef25(
     ({ className, ...props }, ref) => createElement24(Icon, {
@@ -7775,7 +7782,7 @@ var createLucideIcon = (iconName, iconNode) => {
   return Component;
 };
 
-// ../../node_modules/.pnpm/lucide-react@0.417.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/dot.js
+// ../../node_modules/.pnpm/lucide-react@0.424.0_react@18.3.1/node_modules/lucide-react/dist/esm/icons/dot.js
 var Dot = createLucideIcon("Dot", [
   ["circle", { cx: "12.1", cy: "12.1", r: "1", key: "18d7e5" }]
 ]);
@@ -7832,12 +7839,19 @@ var PinInput = ({
   const clampedSeparatorPosition = Math.min(separatorPosition, maxLength);
   const firstGroupLength = clampedSeparatorPosition > 0 ? clampedSeparatorPosition : 0;
   const secondGroupLength = maxLength - firstGroupLength;
-  return /* @__PURE__ */ React50.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-2" }, /* @__PURE__ */ React50.createElement(PinInputRoot, { ...props }, firstGroupLength > 0 && /* @__PURE__ */ React50.createElement(PinInputGroup, { className: "hawa-w-full" }, [...Array(firstGroupLength)].map((_, index) => /* @__PURE__ */ React50.createElement(PinInputSlot, { key: index, index, className: "hawa-w-full" }))), separatorPosition > 0 && separatorPosition < props.maxLength && /* @__PURE__ */ React50.createElement(PinInputSeperator, null), secondGroupLength > 0 && /* @__PURE__ */ React50.createElement(PinInputGroup, { className: "hawa-w-full" }, [...Array(secondGroupLength)].map((_, index) => /* @__PURE__ */ React50.createElement(
+  return /* @__PURE__ */ React50.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-2" }, /* @__PURE__ */ React50.createElement(PinInputRoot, { ...props }, firstGroupLength > 0 && /* @__PURE__ */ React50.createElement(PinInputGroup, { className: "hawa-w-full hawa-gap-2" }, [...Array(firstGroupLength)].map((_, index) => /* @__PURE__ */ React50.createElement(
+    PinInputSlot,
+    {
+      key: index,
+      index,
+      className: "hawa-w-full hawa-border"
+    }
+  ))), separatorPosition > 0 && separatorPosition < props.maxLength && /* @__PURE__ */ React50.createElement(PinInputSeperator, null), secondGroupLength > 0 && /* @__PURE__ */ React50.createElement(PinInputGroup, { className: "hawa-w-full hawa-gap-2" }, [...Array(secondGroupLength)].map((_, index) => /* @__PURE__ */ React50.createElement(
     PinInputSlot,
     {
       key: index + firstGroupLength,
       index: index + firstGroupLength,
-      className: "hawa-w-full"
+      className: "hawa-w-full hawa-border"
     }
   )))), /* @__PURE__ */ React50.createElement(HelperText, { helperText: props.helperText }));
 };
@@ -11787,12 +11801,10 @@ var CodeConfirmation = ({
     {
       noValidate: true,
       onSubmit: handleSubmit((e) => {
-        if (props.handleConfirm) {
-          return props.handleConfirm(e);
+        if (props.onConfirm) {
+          return props.onConfirm(e);
         } else {
-          console.log(
-            "Form is submitted but handleConfirm prop is missing"
-          );
+          console.log("Form is submitted but onConfirm prop is missing");
         }
       })
     },
@@ -11820,12 +11832,28 @@ var CodeConfirmation = ({
         className: "clickable-link",
         onClick: () => {
           startResendTimer();
-          props.handleResend();
+          props.onResend();
         }
       },
       ((_i = props.texts) == null ? void 0 : _i.resendCode) || "Click to resend"
     )),
-    /* @__PURE__ */ React88.createElement("div", { className: "hawa-mt-4 hawa-grid hawa-grid-cols-2 hawa-gap-2" }, /* @__PURE__ */ React88.createElement(Button, { variant: "outline" }, ((_j = props.texts) == null ? void 0 : _j.cancel) || "Cancel"), /* @__PURE__ */ React88.createElement(Button, { isLoading: props.confirmLoading }, ((_k = props.texts) == null ? void 0 : _k.confirm) || "Confirm"))
+    /* @__PURE__ */ React88.createElement("div", { className: "hawa-mt-4 hawa-grid hawa-grid-cols-2 hawa-gap-2" }, /* @__PURE__ */ React88.createElement(
+      Button,
+      {
+        type: "button",
+        onClick: () => {
+          if (props.onCancel) {
+            return props.onCancel();
+          } else {
+            console.log(
+              "Cancel button clicked but onCancel prop is missing"
+            );
+          }
+        },
+        variant: "outline"
+      },
+      ((_j = props.texts) == null ? void 0 : _j.cancel) || "Cancel"
+    ), /* @__PURE__ */ React88.createElement(Button, { isLoading: props.confirmLoading }, ((_k = props.texts) == null ? void 0 : _k.confirm) || "Confirm"))
   )));
 };
 
@@ -12468,6 +12496,7 @@ var ContactForm = ({
   onSubmit,
   customFields,
   classNames,
+  clearOnSubmit = true,
   ...props
 }) => {
   var _a, _b, _c, _d, _e;
@@ -12511,8 +12540,11 @@ var ContactForm = ({
     control,
     handleSubmit,
     formState: { errors },
-    reset
+    reset,
+    getValues,
+    trigger
   } = useForm9({
+    mode: "all",
     resolver: zodResolver8(MainSchema),
     defaultValues: {
       name: "",
@@ -12521,10 +12553,16 @@ var ContactForm = ({
       ...customFieldsDefaultValues
     }
   });
-  const handleFormSubmit = (data) => {
+  const SubmitForm = async (data) => {
+    const isValid = await trigger();
+    if (!isValid) {
+      return;
+    }
     if (onSubmit) {
       onSubmit(data);
-      reset();
+      if (clearOnSubmit) {
+        reset();
+      }
     } else {
       console.log("Form is submitted but onSubmit prop is missing");
     }
@@ -12534,7 +12572,8 @@ var ContactForm = ({
     {
       className: cn(
         "hawa-w-full",
-        cardless && "hawa-border-none hawa-bg-transparent hawa-shadow-none hawa-drop-shadow-none"
+        cardless && "hawa-border-none hawa-bg-transparent hawa-shadow-none hawa-drop-shadow-none",
+        classNames == null ? void 0 : classNames.container
       ),
       style: cardless ? { boxShadow: "none" } : void 0
     },
@@ -12542,7 +12581,7 @@ var ContactForm = ({
       "form",
       {
         noValidate: true,
-        onSubmit: handleSubmit(handleFormSubmit),
+        onSubmit: handleSubmit(SubmitForm),
         className: "hawa-space-y-2",
         id: formId,
         autoComplete: formAutoComplete
@@ -12653,7 +12692,10 @@ var ContactForm = ({
                 textareaProps: {
                   placeholder: texts == null ? void 0 : texts.message.placeholder,
                   className: "hawa-min-h-20",
-                  ...field
+                  ...field,
+                  onKeyDown: getHotkeyHandler([
+                    ["mod+enter", () => SubmitForm(getValues())]
+                  ])
                 },
                 classNames: { textarea: "hawa-min-h-40 hawa-h-full" },
                 helperText: (_a2 = errors.message) == null ? void 0 : _a2.message
@@ -13618,7 +13660,7 @@ export {
 
 lucide-react/dist/esm/shared/src/utils.js:
   (**
-   * @license lucide-react v0.417.0 - ISC
+   * @license lucide-react v0.424.0 - ISC
    *
    * This source code is licensed under the ISC license.
    * See the LICENSE file in the root directory of this source tree.
@@ -13626,7 +13668,7 @@ lucide-react/dist/esm/shared/src/utils.js:
 
 lucide-react/dist/esm/defaultAttributes.js:
   (**
-   * @license lucide-react v0.417.0 - ISC
+   * @license lucide-react v0.424.0 - ISC
    *
    * This source code is licensed under the ISC license.
    * See the LICENSE file in the root directory of this source tree.
@@ -13634,7 +13676,7 @@ lucide-react/dist/esm/defaultAttributes.js:
 
 lucide-react/dist/esm/Icon.js:
   (**
-   * @license lucide-react v0.417.0 - ISC
+   * @license lucide-react v0.424.0 - ISC
    *
    * This source code is licensed under the ISC license.
    * See the LICENSE file in the root directory of this source tree.
@@ -13642,7 +13684,7 @@ lucide-react/dist/esm/Icon.js:
 
 lucide-react/dist/esm/createLucideIcon.js:
   (**
-   * @license lucide-react v0.417.0 - ISC
+   * @license lucide-react v0.424.0 - ISC
    *
    * This source code is licensed under the ISC license.
    * See the LICENSE file in the root directory of this source tree.
@@ -13650,7 +13692,7 @@ lucide-react/dist/esm/createLucideIcon.js:
 
 lucide-react/dist/esm/icons/dot.js:
   (**
-   * @license lucide-react v0.417.0 - ISC
+   * @license lucide-react v0.424.0 - ISC
    *
    * This source code is licensed under the ISC license.
    * See the LICENSE file in the root directory of this source tree.
@@ -13658,7 +13700,7 @@ lucide-react/dist/esm/icons/dot.js:
 
 lucide-react/dist/esm/lucide-react.js:
   (**
-   * @license lucide-react v0.417.0 - ISC
+   * @license lucide-react v0.424.0 - ISC
    *
    * This source code is licensed under the ISC license.
    * See the LICENSE file in the root directory of this source tree.

package/dist/phoneInput/index.js

@@ -1933,13 +1933,21 @@ var Select = ({
       children
     );
   };
-  const Option = ({ children, innerProps, innerRef }) => {
+  const Option = ({
+    children,
+    innerProps,
+    innerRef,
+    isFocused,
+    isSelected
+  }) => {
     return /* @__PURE__ */ import_react4.default.createElement(
       "div",
       {
         ref: innerRef,
         className: cn(
-          "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"
+          "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",
+          isFocused ? "hawa-bg-accent hawa-text-bg-accent-foreground" : "hover:hawa-bg-accent hover:hawa-text-accent-foreground",
+          isSelected && "hawa-bg-primary hawa-text-primary-foreground"
         ),
         ...innerProps
       },
@@ -1996,15 +2004,20 @@ var Select = ({
             container: () => cn(
               selectContainerStyles,
               props.phoneCode && phoneCodeStyles,
-              props.disabled ? "hawa-cursor-not-allowed" : "hawa-cursor-pointer",
               props.isMulti && "hawa-ps-0 "
             ),
-            placeholder: () => selectPlaceholderStyles,
+            placeholder: () => cn(
+              selectPlaceholderStyles,
+              props.disabled && "hawa-text-muted-foreground"
+            ),
             valueContainer: () => "hawa-text-foreground hawa-px-1 ",
-            singleValue: () => "hawa-text-foreground",
+            singleValue: () => cn(
+              props.disabled ? "hawa-text-muted-foreground hawa-opacity-30" : "hawa-text-foreground"
+            ),
             indicatorsContainer: () => cn(
               selectIndicatorContainerStyles,
-              props.hideIndicator ? "hawa-invisible" : "hawa-px-1"
+              props.hideIndicator ? "hawa-invisible" : "hawa-px-1",
+              props.disabled && "hawa-opacity-30"
             )
           },
           unstyled: true,
@@ -2012,12 +2025,6 @@ var Select = ({
           components: props.hideIndicator ? { Option, Menu, IndicatorsContainer: () => null } : {
             Option,
             Menu,
-            // Control: (e) => (
-            //   <div
-            //     className={cn(e.className, "hawa-flex hawa-flex-row")}
-            //     {...e}
-            //   />
-            // ),
             ValueContainer: (e) => /* @__PURE__ */ import_react4.default.createElement(
               "div",
               {