@sikka/hawa 0.37.2-next → 0.38.1-next

package/dist/phoneInput/index.mjs

@@ -1,7 +1,7 @@
 "use client";
 
 // elements/phoneInput/PhoneInput.tsx
-import React5, { useState, useRef } from "react";
+import React6, { useState, useRef } from "react";
 
 // util/index.ts
 import { clsx } from "clsx";
@@ -1703,13 +1703,26 @@ var countries = [
 ];
 var countries_default = countries;
 
+// elements/helperText/HelperText.tsx
+import React from "react";
+var HelperText = ({ helperText }) => /* @__PURE__ */ React.createElement(
+  "p",
+  {
+    className: cn(
+      "hawa-my-0 hawa-text-start hawa-text-xs hawa-text-helper-color hawa-transition-all",
+      helperText ? "hawa-h-4 hawa-opacity-100" : "hawa-h-0 hawa-opacity-0"
+    )
+  },
+  helperText
+);
+
 // elements/label/Label.tsx
-import * as React2 from "react";
+import * as React3 from "react";
 
 // elements/tooltip/Tooltip.tsx
-import React from "react";
+import React2 from "react";
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
-var TooltipContent = React.forwardRef(({ className, sideOffset = 4, size = "default", ...props }, ref) => /* @__PURE__ */ React.createElement(
+var TooltipContent = React2.forwardRef(({ className, sideOffset = 4, size = "default", ...props }, ref) => /* @__PURE__ */ React2.createElement(
   TooltipPrimitive.Content,
   {
     ref,
@@ -1726,7 +1739,7 @@ var TooltipContent = React.forwardRef(({ className, sideOffset = 4, size = "defa
   }
 ));
 TooltipContent.displayName = TooltipPrimitive.Content.displayName;
-var TooltipArrow = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(TooltipPrimitive.Arrow, { ref, className: cn(className), ...props }));
+var TooltipArrow = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React2.createElement(TooltipPrimitive.Arrow, { ref, className: cn(className), ...props }));
 TooltipArrow.displayName = TooltipPrimitive.Arrow.displayName;
 var Tooltip = ({
   side,
@@ -1743,13 +1756,13 @@ var Tooltip = ({
   delayDuration = 300,
   ...props
 }) => {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React2.createElement(
     TooltipPrimitive.TooltipProvider,
     {
       delayDuration,
       ...providerProps
     },
-    /* @__PURE__ */ React.createElement(
+    /* @__PURE__ */ React2.createElement(
       TooltipPrimitive.Root,
       {
         open: !disabled && open,
@@ -1757,8 +1770,8 @@ var Tooltip = ({
         onOpenChange,
         ...props
       },
-      /* @__PURE__ */ React.createElement(TooltipPrimitive.Trigger, { ...triggerProps }, children),
-      /* @__PURE__ */ React.createElement(
+      /* @__PURE__ */ React2.createElement(TooltipPrimitive.Trigger, { ...triggerProps }, children),
+      /* @__PURE__ */ React2.createElement(
         TooltipContent,
         {
           size,
@@ -1778,7 +1791,7 @@ var Tooltip = ({
 };
 
 // elements/label/Label.tsx
-var Label = React2.forwardRef(({ className, hint, hintSide, required, children, ...props }, ref) => /* @__PURE__ */ React2.createElement("div", { className: "hawa-flex hawa-flex-row hawa-items-center hawa-gap-1 hawa-transition-all" }, /* @__PURE__ */ React2.createElement(
+var Label = React3.forwardRef(({ className, hint, hintSide, required, children, ...props }, ref) => /* @__PURE__ */ React3.createElement("div", { className: "hawa-flex hawa-flex-row hawa-items-center hawa-gap-1 hawa-transition-all" }, /* @__PURE__ */ React3.createElement(
   "label",
   {
     ref,
@@ -1789,8 +1802,8 @@ var Label = React2.forwardRef(({ className, hint, hintSide, required, children,
     ...props
   },
   children,
-  required && /* @__PURE__ */ React2.createElement("span", { className: "hawa-mx-0.5 hawa-text-red-500" }, "*")
-), hint && /* @__PURE__ */ React2.createElement(
+  required && /* @__PURE__ */ React3.createElement("span", { className: "hawa-mx-0.5 hawa-text-red-500" }, "*")
+), hint && /* @__PURE__ */ React3.createElement(
   Tooltip,
   {
     content: hint,
@@ -1800,7 +1813,7 @@ var Label = React2.forwardRef(({ className, hint, hintSide, required, children,
       onClick: (event) => event.preventDefault()
     }
   },
-  /* @__PURE__ */ React2.createElement("div", null, /* @__PURE__ */ React2.createElement(
+  /* @__PURE__ */ React3.createElement("div", null, /* @__PURE__ */ React3.createElement(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -1812,21 +1825,21 @@ var Label = React2.forwardRef(({ className, hint, hintSide, required, children,
       strokeLinecap: "round",
       strokeLinejoin: "round"
     },
-    /* @__PURE__ */ React2.createElement("circle", { cx: "12", cy: "12", r: "10" }),
-    /* @__PURE__ */ React2.createElement("path", { d: "M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" }),
-    /* @__PURE__ */ React2.createElement("path", { d: "M12 17h.01" })
+    /* @__PURE__ */ React3.createElement("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ React3.createElement("path", { d: "M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" }),
+    /* @__PURE__ */ React3.createElement("path", { d: "M12 17h.01" })
   ))
 )));
 Label.displayName = "Label";
 
 // elements/select/Select.tsx
-import React4 from "react";
+import React5 from "react";
 import ReactSelect from "react-select";
 import CreatableSelect from "react-select/creatable";
 import clsx2 from "clsx";
 
 // elements/skeleton/Skeleton.tsx
-import React3 from "react";
+import React4 from "react";
 function Skeleton({
   className,
   content,
@@ -1845,7 +1858,7 @@ function Skeleton({
     right: "hawa-mask-fade-right",
     left: "hawa-mask-fade-left "
   };
-  return /* @__PURE__ */ React3.createElement(
+  return /* @__PURE__ */ React4.createElement(
     "div",
     {
       className: cn(
@@ -1868,10 +1881,10 @@ var Select = ({
 }) => {
   const NoOption = () => {
     var _a, _b;
-    return /* @__PURE__ */ React4.createElement("div", null, (_b = (_a = props.texts) == null ? void 0 : _a.noOptions) != null ? _b : "No Items Found");
+    return /* @__PURE__ */ React5.createElement("div", null, (_b = (_a = props.texts) == null ? void 0 : _a.noOptions) != null ? _b : "No Items Found");
   };
   const Control = ({ children, innerProps, innerRef }) => {
-    return /* @__PURE__ */ React4.createElement(
+    return /* @__PURE__ */ React5.createElement(
       "div",
       {
         ref: innerRef,
@@ -1884,7 +1897,7 @@ var Select = ({
     );
   };
   const Option = ({ children, innerProps, innerRef }) => {
-    return /* @__PURE__ */ React4.createElement(
+    return /* @__PURE__ */ React5.createElement(
       "div",
       {
         ref: innerRef,
@@ -1905,7 +1918,7 @@ var Select = ({
     ...menuProps
   }) => {
     const menuOpen = menuProps.selectProps.menuIsOpen;
-    return /* @__PURE__ */ React4.createElement(
+    return /* @__PURE__ */ React5.createElement(
       "div",
       {
         className: cn(
@@ -1923,7 +1936,7 @@ var Select = ({
   let selectContainerStyles = "hawa-rounded hawa-block hawa-w-full hawa-border hawa-transition-all hawa-bg-background  hawa-p-0 hawa-px-1 hawa-text-sm";
   let selectPlaceholderStyles = "hawa-text-muted-foreground hawa-cursor-pointer hawa-px-1";
   let selectIndicatorContainerStyles = "hawa-cursor-pointer hawa-text-muted-foreground hawa-absolute hawa-end-0 hawa-top-[50%] hawa-bottom-[50%] ";
-  return /* @__PURE__ */ React4.createElement(
+  return /* @__PURE__ */ React5.createElement(
     "div",
     {
       className: cn(
@@ -1931,10 +1944,10 @@ var Select = ({
         props.width === "fit" ? "hawa-w-fit" : "hawa-w-full"
       )
     },
-    props.label && /* @__PURE__ */ React4.createElement(Label, { ...labelProps }, props.label),
-    props.isLoading ? /* @__PURE__ */ React4.createElement(Skeleton, { className: "hawa-h-[40px] hawa-w-full" }) : !props.isCreatable ? (
+    props.label && /* @__PURE__ */ React5.createElement(Label, { ...labelProps }, props.label),
+    props.isLoading ? /* @__PURE__ */ React5.createElement(Skeleton, { className: "hawa-h-[40px] hawa-w-full" }) : !props.isCreatable ? (
       //   TODO: enable keyboard to go to the next item in the list
-      /* @__PURE__ */ React4.createElement(
+      /* @__PURE__ */ React5.createElement(
         ReactSelect,
         {
           noOptionsMessage: NoOption,
@@ -1968,7 +1981,7 @@ var Select = ({
             //     {...e}
             //   />
             // ),
-            ValueContainer: (e) => /* @__PURE__ */ React4.createElement(
+            ValueContainer: (e) => /* @__PURE__ */ React5.createElement(
               "div",
               {
                 className: cn(
@@ -1978,7 +1991,7 @@ var Select = ({
                 ...e
               }
             ),
-            MultiValueContainer: (e) => /* @__PURE__ */ React4.createElement(
+            MultiValueContainer: (e) => /* @__PURE__ */ React5.createElement(
               "div",
               {
                 className: "hawa-rounded hawa-border hawa-p-1 hawa-px-2 hawa-flex hawa-flex-row",
@@ -1997,7 +2010,7 @@ var Select = ({
           isSearchable: props.isSearchable
         }
       )
-    ) : /* @__PURE__ */ React4.createElement(
+    ) : /* @__PURE__ */ React5.createElement(
       CreatableSelect,
       {
         formatCreateLabel: (inputValue) => {
@@ -2027,16 +2040,7 @@ var Select = ({
         onInputChange: (newValue, action) => props.onInputChange(newValue, action)
       }
     ),
-    !props.hideHelperText && /* @__PURE__ */ React4.createElement(
-      "p",
-      {
-        className: cn(
-          "hawa-my-0 hawa-text-start hawa-text-xs hawa-text-helper-color hawa-transition-all",
-          props.helperText ? "hawa-h-4 hawa-opacity-100" : "hawa-h-0 hawa-opacity-0"
-        )
-      },
-      props.helperText
-    )
+    !props.hideHelperText && /* @__PURE__ */ React5.createElement(HelperText, { helperText: props.helperText })
   );
 };
 
@@ -2063,7 +2067,7 @@ var PhoneInput = ({
       console.log("handleChange prop was not provided in <PhoneInput/>");
     }
   };
-  return /* @__PURE__ */ React5.createElement("div", { className: "hawa-flex hawa-h-fit hawa-w-full hawa-flex-col hawa-gap-2" }, props.label && /* @__PURE__ */ React5.createElement(Label, { ...labelProps }, props.label), /* @__PURE__ */ React5.createElement("div", { dir: "ltr", className: "hawa-flex hawa-w-full hawa-flex-row" }, /* @__PURE__ */ React5.createElement(
+  return /* @__PURE__ */ React6.createElement("div", { className: "hawa-flex hawa-h-fit hawa-w-full hawa-flex-col hawa-gap-2" }, props.label && /* @__PURE__ */ React6.createElement(Label, { ...labelProps }, props.label), /* @__PURE__ */ React6.createElement("div", { dir: "ltr", className: "hawa-flex hawa-w-full hawa-flex-row" }, /* @__PURE__ */ React6.createElement(
     Select,
     {
       phoneCode: true,
@@ -2079,7 +2083,7 @@ var PhoneInput = ({
       value: countryCode == null ? void 0 : countryCode.label,
       defaultValue: props.preferredCountry
     }
-  ), /* @__PURE__ */ React5.createElement("div", { className: "hawa-relative hawa-flex hawa-h-fit hawa-w-full  hawa-flex-col hawa-justify-center hawa-gap-0" }, /* @__PURE__ */ React5.createElement(
+  ), /* @__PURE__ */ React6.createElement("div", { className: "hawa-relative hawa-flex hawa-h-fit hawa-w-full  hawa-flex-col hawa-justify-center hawa-gap-0" }, /* @__PURE__ */ React6.createElement(
     "input",
     {
       type: "tel",
@@ -2093,16 +2097,7 @@ var PhoneInput = ({
       ),
       ...inputProps
     }
-  ))), /* @__PURE__ */ React5.createElement(
-    "p",
-    {
-      className: cn(
-        "hawa-my-0 hawa-text-start hawa-text-xs hawa-text-helper-color hawa-transition-all",
-        props.helperText ? "hawa-h-4 hawa-opacity-100" : "hawa-h-0 hawa-opacity-0"
-      )
-    },
-    props.helperText
-  ));
+  ))), /* @__PURE__ */ React6.createElement(HelperText, { helperText: props.helperText }));
 };
 export {
   PhoneInput