@sikka/hawa 0.2.41-next → 0.2.43-next

package/dist/index.mjs

@@ -1616,8 +1616,55 @@ var DropdownMenu = ({
   )));
 };
 
+// components/elements/ColorPicker.tsx
+import React22, { useState as useState7 } from "react";
+var ColorPicker = (props) => {
+  const [selectedColor, setSelectedColor] = useState7(props.color);
+  return /* @__PURE__ */ React22.createElement(
+    "div",
+    {
+      className: `hawa-flex hawa-w-fit hawa-flex-row hawa-rounded hawa-border hawa-p-0`
+    },
+    /* @__PURE__ */ React22.createElement(
+      "div",
+      {
+        style: { backgroundColor: selectedColor },
+        className: "hawa-rounded-bl-lg hawa-rounded-tl-lg"
+      },
+      /* @__PURE__ */ React22.createElement(
+        "input",
+        {
+          type: "color",
+          value: selectedColor,
+          onChange: (e) => {
+            setSelectedColor(e.target.value);
+            if (props.handleChange) {
+              props.handleChange(e);
+            }
+          },
+          className: "hawa-opacity-0"
+        }
+      )
+    ),
+    /* @__PURE__ */ React22.createElement(
+      "input",
+      {
+        type: "text",
+        onChange: (e) => {
+          setSelectedColor(e.target.value);
+          if (props.handleChange) {
+            props.handleChange(e);
+          }
+        },
+        value: selectedColor,
+        className: "hawa-w-24 hawa-bg-background  hawa-rounded-br-lg hawa-rounded-tr-lg hawa-pl-2 hawa-pr-2"
+      }
+    )
+  );
+};
+
 // components/elements/PinInput.tsx
-import React22, { useEffect as useEffect5, useState as useState7 } from "react";
+import React23, { useEffect as useEffect5, useState as useState8 } from "react";
 import clsx5 from "clsx";
 var PinInput = ({
   label,
@@ -1627,7 +1674,7 @@ var PinInput = ({
   getPins,
   ...props
 }) => {
-  const [pin, setPin] = useState7(Array.from(Array(digits)));
+  const [pin, setPin] = useState8(Array.from(Array(digits)));
   const handleKeyDown = (e, index) => {
     let backTo = 0;
     if (e.key === "Backspace") {
@@ -1661,7 +1708,7 @@ var PinInput = ({
       }
     }
   };
-  return /* @__PURE__ */ React22.createElement("div", { className: "hawa-flex hawa-w-full hawa-flex-row hawa-justify-center hawa-gap-2" }, pin.map((value, index) => /* @__PURE__ */ React22.createElement(
+  return /* @__PURE__ */ React23.createElement("div", { className: "hawa-flex hawa-w-full hawa-flex-row hawa-justify-center hawa-gap-2" }, pin.map((value, index) => /* @__PURE__ */ React23.createElement(
     "input",
     {
       key: index,
@@ -1683,10 +1730,10 @@ var PinInput = ({
 };
 
 // components/elements/ActionCard.tsx
-import React23, { useState as useState8 } from "react";
+import React24, { useState as useState9 } from "react";
 var ActionCard = (props) => {
-  const [hovered, setHovered] = useState8(false);
-  return /* @__PURE__ */ React23.createElement("div", { className: "hawa-flex hawa-h-full hawa-w-full hawa-flex-col hawa-gap-1" }, /* @__PURE__ */ React23.createElement(
+  const [hovered, setHovered] = useState9(false);
+  return /* @__PURE__ */ React24.createElement("div", { className: "hawa-flex hawa-h-full hawa-w-full hawa-flex-col hawa-gap-1" }, /* @__PURE__ */ React24.createElement(
     "div",
     {
       className: "hawa-group hawa-relative hawa-h-full hawa-w-full hawa-rounded hawa-border hawa-bg-background hawa-bg-cover hawa-bg-center hawa-transition-all hawa-duration-500 hover:hawa-drop-shadow-2xl",
@@ -1696,7 +1743,7 @@ var ActionCard = (props) => {
       onMouseEnter: () => setHovered(true),
       onMouseLeave: () => setHovered(false)
     },
-    props.blank ? /* @__PURE__ */ React23.createElement("div", { className: "hawa-flex hawa-h-full hawa-flex-col hawa-items-center hawa-justify-center " }, /* @__PURE__ */ React23.createElement(
+    props.blank ? /* @__PURE__ */ React24.createElement("div", { className: "hawa-flex hawa-h-full hawa-flex-col hawa-items-center hawa-justify-center " }, /* @__PURE__ */ React24.createElement(
       "svg",
       {
         className: "hawa-h-10 hawa-w-10 hawa-text-foreground",
@@ -1708,11 +1755,11 @@ var ActionCard = (props) => {
         width: "1em",
         xmlns: "http://www.w3.org/2000/svg"
       },
-      /* @__PURE__ */ React23.createElement("path", { d: "M19 11h-6V5h-2v6H5v2h6v6h2v-6h6z" })
-    )) : /* @__PURE__ */ React23.createElement("div", { className: "hawa-absolute hawa-inset-0 hawa-rounded hawa-bg-black hawa-opacity-50" }),
-    /* @__PURE__ */ React23.createElement("div", { className: "hawa-absolute hawa-bottom-2 hawa-right-2 hawa-z-10 hawa-opacity-0 hawa-transition-all hawa-duration-200 group-hover:hawa-opacity-100" }, props.inCardActions),
-    !props.blank && /* @__PURE__ */ React23.createElement("div", { className: "hawa-relative hawa-p-4" }, /* @__PURE__ */ React23.createElement("h1", { className: "hawa-text-white" }, props.title), /* @__PURE__ */ React23.createElement("p", { className: "hawa-text-white" }, props.subtitle))
-  ), /* @__PURE__ */ React23.createElement(
+      /* @__PURE__ */ React24.createElement("path", { d: "M19 11h-6V5h-2v6H5v2h6v6h2v-6h6z" })
+    )) : /* @__PURE__ */ React24.createElement("div", { className: "hawa-absolute hawa-inset-0 hawa-rounded hawa-bg-black hawa-opacity-50" }),
+    /* @__PURE__ */ React24.createElement("div", { className: "hawa-absolute hawa-bottom-2 hawa-right-2 hawa-z-10 hawa-opacity-0 hawa-transition-all hawa-duration-200 group-hover:hawa-opacity-100" }, props.inCardActions),
+    !props.blank && /* @__PURE__ */ React24.createElement("div", { className: "hawa-relative hawa-p-4" }, /* @__PURE__ */ React24.createElement("h1", { className: "hawa-text-white" }, props.title), /* @__PURE__ */ React24.createElement("p", { className: "hawa-text-white" }, props.subtitle))
+  ), /* @__PURE__ */ React24.createElement(
     "div",
     {
       className: `hawa-flex hawa-flex-row hawa-justify-between hawa-text-sm hawa-transition-all hawa-duration-200 ${hovered ? "hawa-opacity-100" : "hawa-opacity-0"}`
@@ -1721,75 +1768,2282 @@ var ActionCard = (props) => {
   ));
 };
 
-// components/elements/AppStores.tsx
-import React24 from "react";
-var AppStores = (props) => {
-  return /* @__PURE__ */ React24.createElement("div", { className: "hawa-flex hawa-justify-center" }, /* @__PURE__ */ React24.createElement("div", null, props.store === "apple" ? props.mode === "dark" ? /* @__PURE__ */ React24.createElement("div", { className: "hawa-mt-3 hawa-flex hawa-h-14 hawa-w-48 hawa-items-center hawa-justify-center hawa-rounded-lg hawa-bg-black hawa-text-white" }, /* @__PURE__ */ React24.createElement("div", { className: "hawa-mr-3" }, /* @__PURE__ */ React24.createElement("svg", { viewBox: "0 0 384 512", width: "30" }, /* @__PURE__ */ React24.createElement(
-    "path",
-    {
-      fill: "currentColor",
-      d: "M318.7 268.7c-.2-36.7 16.4-64.4 50-84.8-18.8-26.9-47.2-41.7-84.7-44.6-35.5-2.8-74.3 20.7-88.5 20.7-15 0-49.4-19.7-76.4-19.7C63.3 141.2 4 184.8 4 273.5q0 39.3 14.4 81.2c12.8 36.7 59 126.7 107.2 125.2 25.2-.6 43-17.9 75.8-17.9 31.8 0 48.3 17.9 76.4 17.9 48.6-.7 90.4-82.5 102.6-119.3-65.2-30.7-61.7-90-61.7-91.9zm-56.6-164.2c27.3-32.4 24.8-61.9 24-72.5-24.1 1.4-52 16.4-67.9 34.9-17.5 19.8-27.8 44.3-25.6 71.9 26.1 2 49.9-11.4 69.5-34.3z"
-    }
-  ))), /* @__PURE__ */ React24.createElement("div", null, /* @__PURE__ */ React24.createElement("div", { className: "hawa-text-xs" }, "Download on the"), /* @__PURE__ */ React24.createElement("div", { className: "hawa-font-sans hawa--mt-1 hawa-text-2xl hawa-font-semibold" }, "App Store"))) : /* @__PURE__ */ React24.createElement("div", { className: "hawa-mt-3 hawa-flex hawa-h-14 hawa-w-48 hawa-items-center hawa-justify-center hawa-rounded-lg hawa-border hawa-border-black hawa-bg-transparent hawa-text-black" }, /* @__PURE__ */ React24.createElement("div", { className: "hawa-mr-3" }, /* @__PURE__ */ React24.createElement("svg", { viewBox: "0 0 384 512", width: "30" }, /* @__PURE__ */ React24.createElement(
-    "path",
-    {
-      fill: "currentColor",
-      d: "M318.7 268.7c-.2-36.7 16.4-64.4 50-84.8-18.8-26.9-47.2-41.7-84.7-44.6-35.5-2.8-74.3 20.7-88.5 20.7-15 0-49.4-19.7-76.4-19.7C63.3 141.2 4 184.8 4 273.5q0 39.3 14.4 81.2c12.8 36.7 59 126.7 107.2 125.2 25.2-.6 43-17.9 75.8-17.9 31.8 0 48.3 17.9 76.4 17.9 48.6-.7 90.4-82.5 102.6-119.3-65.2-30.7-61.7-90-61.7-91.9zm-56.6-164.2c27.3-32.4 24.8-61.9 24-72.5-24.1 1.4-52 16.4-67.9 34.9-17.5 19.8-27.8 44.3-25.6 71.9 26.1 2 49.9-11.4 69.5-34.3z"
-    }
-  ))), /* @__PURE__ */ React24.createElement("div", null, /* @__PURE__ */ React24.createElement("div", { className: "hawa-text-xs" }, "Download on the"), /* @__PURE__ */ React24.createElement("div", { className: "hawa-font-sans hawa--mt-1 hawa-text-2xl hawa-font-semibold" }, "App Store"))) : props.mode === "dark" ? /* @__PURE__ */ React24.createElement("div", { className: "hawa-mt-3 hawa-flex hawa-h-14 hawa-w-48 hawa-items-center hawa-justify-center hawa-rounded-lg hawa-bg-black hawa-text-white" }, /* @__PURE__ */ React24.createElement("div", { className: "hawa-mr-3" }, /* @__PURE__ */ React24.createElement("svg", { viewBox: "30 336.7 120.9 129.2", width: "30" }, /* @__PURE__ */ React24.createElement(
-    "path",
-    {
-      fill: "#FFD400",
-      d: "M119.2,421.2c15.3-8.4,27-14.8,28-15.3c3.2-1.7,6.5-6.2,0-9.7  c-2.1-1.1-13.4-7.3-28-15.3l-20.1,20.2L119.2,421.2z"
+// components/elements/FileDropzone.tsx
+import React25, { useEffect as useEffect6, useState as useState10 } from "react";
+import { useDropzone } from "react-dropzone";
+import clsx6 from "clsx";
+var FileDropzone = ({
+  texts,
+  files,
+  setFiles,
+  setDeletedFiles,
+  onAcceptedFiles,
+  errorMessages,
+  maxFiles,
+  accept,
+  showPreview,
+  onDeleteFile,
+  onClearFiles,
+  disclaimer,
+  maxSize,
+  label,
+  termsLink,
+  privacyLink
+}) => {
+  const [cmp, setCmp] = useState10(0);
+  const [max, setMax] = useState10(0);
+  const {
+    getRootProps,
+    getInputProps,
+    fileRejections,
+    acceptedFiles,
+    isDragActive
+  } = useDropzone({
+    multiple: true,
+    accept,
+    maxSize,
+    maxFiles,
+    onDrop: (acceptedFiles2) => {
+      setFiles(
+        acceptedFiles2.map(
+          (file, index) => Object.assign(file, {
+            preview: URL.createObjectURL(file)
+          })
+        )
+      );
     }
-  ), /* @__PURE__ */ React24.createElement(
-    "path",
-    {
-      fill: "#FF3333",
-      d: "M99.1,401.1l-64.2,64.7c1.5,0.2,3.2-0.2,5.2-1.3  c4.2-2.3,48.8-26.7,79.1-43.3L99.1,401.1L99.1,401.1z"
+  });
+  useEffect6(
+    () => () => {
+      files?.forEach((file) => {
+        URL.revokeObjectURL(file.preview);
+      });
+    },
+    [files]
+  );
+  useEffect6(() => {
+    setFiles(acceptedFiles);
+  }, [acceptedFiles, cmp]);
+  onClearFiles = () => {
+    acceptedFiles.length = 0;
+    acceptedFiles.splice(0, acceptedFiles.length);
+    setFiles([]);
+  };
+  const clearAllFiles = () => {
+    acceptedFiles.length = 0;
+    setFiles([]);
+  };
+  useEffect6(() => {
+    if (maxSize > 0) {
+      const k = 1024;
+      const sizes = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
+      const i = Math.floor(Math.log(maxSize) / Math.log(1024));
+      setMax(
+        parseFloat((maxSize / Math.pow(1024, i)).toFixed(2)) + " " + sizes[i]
+      );
     }
-  ), /* @__PURE__ */ React24.createElement(
-    "path",
-    {
-      fill: "#48FF48",
-      d: "M99.1,401.1l20.1-20.2c0,0-74.6-40.7-79.1-43.1  c-1.7-1-3.6-1.3-5.3-1L99.1,401.1z"
+  }, [maxSize]);
+  const errs = fileRejections.map((rej, i) => {
+    switch (rej.errors[0].code) {
+      case "file-too-large":
+        return /* @__PURE__ */ React25.createElement(
+          Alert,
+          {
+            text: rej.file.name,
+            title: texts.fileTooLarge,
+            severity: "error"
+          }
+        );
+      case "too-many-files":
+        return /* @__PURE__ */ React25.createElement(
+          Alert,
+          {
+            text: rej.file.name,
+            title: texts.tooManyFiles,
+            severity: "error"
+          }
+        );
+      case "file-invalid-type":
+        return /* @__PURE__ */ React25.createElement(
+          Alert,
+          {
+            text: rej.file.name,
+            title: texts.invalidFileType,
+            severity: "error"
+          }
+        );
+      default:
+        return /* @__PURE__ */ React25.createElement(
+          Alert,
+          {
+            text: rej.file.name,
+            title: rej.errors[0].code,
+            severity: "error"
+          }
+        );
     }
-  ), /* @__PURE__ */ React24.createElement(
-    "path",
+  });
+  const thumbs = files?.map((file, index) => /* @__PURE__ */ React25.createElement("div", { className: "hawa-relative hawa-rounded" }, /* @__PURE__ */ React25.createElement(
+    "button",
     {
-      fill: "#3BCCFF",
-      d: "M99.1,401.1l-64.3-64.3c-2.6,0.6-4.8,2.9-4.8,7.6  c0,7.5,0,107.5,0,113.8c0,4.3,1.7,7.4,4.9,7.7L99.1,401.1z"
-    }
-  ))), /* @__PURE__ */ React24.createElement("div", null, /* @__PURE__ */ React24.createElement("div", { className: "hawa-text-xs" }, "GET IT ON"), /* @__PURE__ */ React24.createElement("div", { className: "hawa-font-sans hawa--mt-1 hawa-text-xl hawa-font-semibold" }, "Google Play"))) : /* @__PURE__ */ React24.createElement("div", { className: "hawa-mt-3 hawa-flex hawa-h-14 hawa-w-48 hawa-items-center hawa-justify-center hawa-rounded-lg hawa-border hawa-border-black hawa-bg-white hawa-text-black" }, /* @__PURE__ */ React24.createElement("div", { className: "hawa-mr-3" }, /* @__PURE__ */ React24.createElement("svg", { viewBox: "30 336.7 120.9 129.2", width: "30" }, /* @__PURE__ */ React24.createElement(
-    "path",
+      onClick: (e) => {
+        e.stopPropagation();
+        acceptedFiles.splice(acceptedFiles.indexOf(file), 1);
+        setCmp(Math.random);
+        onDeleteFile(file);
+      },
+      type: "button",
+      className: "hawa-absolute hawa-left-0 hawa-ml-auto hawa-inline-flex hawa-items-center hawa-rounded-inner hawa-rounded-bl-none hawa-rounded-tr-none hawa-bg-gray-900 hawa-p-1.5 hawa-text-sm hawa-text-gray-400 hawa-transition-all hover:hawa-bg-gray-200 hover:hawa-text-gray-900 dark:hover:hawa-bg-gray-600 dark:hover:hawa-text-white",
+      "data-modal-toggle": "defaultModal"
+    },
+    /* @__PURE__ */ React25.createElement(
+      "svg",
+      {
+        "aria-hidden": "true",
+        className: "hawa-h-5 hawa-w-5",
+        fill: "currentColor",
+        viewBox: "0 0 20 20"
+      },
+      /* @__PURE__ */ React25.createElement(
+        "path",
+        {
+          fillRule: "evenodd",
+          d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z",
+          clipRule: "evenodd"
+        }
+      )
+    ),
+    /* @__PURE__ */ React25.createElement("span", { className: "hawa-sr-only" }, "Close modal")
+  ), /* @__PURE__ */ React25.createElement(
+    "div",
     {
-      fill: "#FFD400",
-      d: "M119.2,421.2c15.3-8.4,27-14.8,28-15.3c3.2-1.7,6.5-6.2,0-9.7  c-2.1-1.1-13.4-7.3-28-15.3l-20.1,20.2L119.2,421.2z"
+      style: {
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center",
+        overflow: "hidden",
+        height: 100,
+        width: 100,
+        backgroundImage: `url(${file.preview})`,
+        backgroundSize: "cover",
+        backgroundPosition: "center",
+        border: "1px solid black"
+      },
+      className: "hawa-rounded",
+      key: file.name
     }
-  ), /* @__PURE__ */ React24.createElement(
-    "path",
+  )));
+  return /* @__PURE__ */ React25.createElement("div", null, label && /* @__PURE__ */ React25.createElement("div", { className: "hawa-mb-2 hawa-block hawa-text-sm hawa-font-medium hawa-text-gray-900 dark:hawa-text-gray-300" }, label), /* @__PURE__ */ React25.createElement(
+    "div",
     {
-      fill: "#FF3333",
-      d: "M99.1,401.1l-64.2,64.7c1.5,0.2,3.2-0.2,5.2-1.3  c4.2-2.3,48.8-26.7,79.1-43.3L99.1,401.1L99.1,401.1z"
-    }
-  ), /* @__PURE__ */ React24.createElement(
-    "path",
+      className: clsx6(
+        "hawa-flex hawa-flex-col hawa-justify-center hawa-rounded hawa-border hawa-border-dashed  hawa-p-6 hawa-transition-all  ",
+        isDragActive ? "hawa-bg-muted" : "hawa-bg-muted/20 hover:hawa-bg-muted/50 "
+      )
+    },
+    /* @__PURE__ */ React25.createElement("div", { ...getRootProps({}) }, /* @__PURE__ */ React25.createElement("p", { ...getInputProps() }), /* @__PURE__ */ React25.createElement("div", { className: "hawa-flex hawa-flex-col hawa-items-center hawa-justify-center hawa-gap-2 hawa-pt-4 hawa-text-center" }, /* @__PURE__ */ React25.createElement(
+      "svg",
+      {
+        stroke: "currentColor",
+        fill: "none",
+        strokeWidth: "2",
+        viewBox: "0 0 24 24",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        height: "1.5em",
+        width: "1.5em"
+      },
+      /* @__PURE__ */ React25.createElement("path", { stroke: "none", d: "M0 0h24v24H0z", fill: "none" }),
+      /* @__PURE__ */ React25.createElement("path", { d: "M19 11v-2a2 2 0 0 0 -2 -2h-8a2 2 0 0 0 -2 2v8a2 2 0 0 0 2 2h2" }),
+      /* @__PURE__ */ React25.createElement("path", { d: "M13 13l9 3l-4 2l-2 4l-3 -9" }),
+      /* @__PURE__ */ React25.createElement("path", { d: "M3 3l0 .01" }),
+      /* @__PURE__ */ React25.createElement("path", { d: "M7 3l0 .01" }),
+      /* @__PURE__ */ React25.createElement("path", { d: "M11 3l0 .01" }),
+      /* @__PURE__ */ React25.createElement("path", { d: "M15 3l0 .01" }),
+      /* @__PURE__ */ React25.createElement("path", { d: "M3 7l0 .01" }),
+      /* @__PURE__ */ React25.createElement("path", { d: "M3 11l0 .01" }),
+      /* @__PURE__ */ React25.createElement("path", { d: "M3 15l0 .01" })
+    ), typeof texts.clickHereToUpload === "function" ? texts.clickHereToUpload() : texts.clickHereToUpload), /* @__PURE__ */ React25.createElement("div", { className: "hawa-pt-2 hawa-text-center hawa-text-xs hawa-select-none" }, texts.acceptedFileTypes, " ", accept.split(",")), /* @__PURE__ */ React25.createElement("div", { className: "hawa-pb-2 hawa-pt-1 hawa-text-center hawa-text-xs hawa-select-none" }, texts.maxFileSize, " ", max)),
+    acceptedFiles.length > 0 && /* @__PURE__ */ React25.createElement("div", { className: "hawa-flex hawa-justify-center hawa-rounded-lg  hawa-p-2 " }, /* @__PURE__ */ React25.createElement(Button, { onClick: clearAllFiles }, "Clear All")),
+    acceptedFiles.length > 0 && thumbs && showPreview ? /* @__PURE__ */ React25.createElement("aside", { className: "hawa-flex hawa-flex-row hawa-flex-wrap hawa-justify-center  hawa-gap-2 hawa-rounded-lg  hawa-p-2" }, thumbs) : null,
+    /* @__PURE__ */ React25.createElement("div", { className: "px-4" }, fileRejections[0]?.errors[0]?.code && errs)
+  ), disclaimer && /* @__PURE__ */ React25.createElement("div", { className: "hawa-mt-2 hawa-text-sm hawa-text-muted-foreground/50" }, texts.disclaimer ?? "By uploading a file you agree to our", " ", /* @__PURE__ */ React25.createElement(
+    "a",
     {
-      fill: "#48FF48",
-      d: "M99.1,401.1l20.1-20.2c0,0-74.6-40.7-79.1-43.1  c-1.7-1-3.6-1.3-5.3-1L99.1,401.1z"
-    }
-  ), /* @__PURE__ */ React24.createElement(
-    "path",
+      href: termsLink,
+      className: "clickable-link hawa-text-muted-foreground/50"
+    },
+    texts.terms ?? "Terms"
+  ), " ", texts.and ?? "and", " ", /* @__PURE__ */ React25.createElement(
+    "a",
     {
-      fill: "#3BCCFF",
-      d: "M99.1,401.1l-64.3-64.3c-2.6,0.6-4.8,2.9-4.8,7.6  c0,7.5,0,107.5,0,113.8c0,4.3,1.7,7.4,4.9,7.7L99.1,401.1z"
-    }
-  ))), /* @__PURE__ */ React24.createElement("div", null, /* @__PURE__ */ React24.createElement("div", { className: "hawa-text-xs" }, "GET IT ON"), /* @__PURE__ */ React24.createElement("div", { className: "hawa-font-sans hawa--mt-1 hawa-text-xl hawa-font-semibold" }, "Google Play")))));
+      href: privacyLink,
+      className: "clickable-link hawa-text-muted-foreground/50"
+    },
+    texts.privacyPolicy ?? "Privacy Policy"
+  )));
 };
+
+// components/elements/PhoneInput.tsx
+import React26, { useState as useState11 } from "react";
+
+// components/countries.ts
+var countries = [
+  {
+    country_label: "Saudi Arabia",
+    code: "SA",
+    unicode: "🇸🇦",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SA.svg",
+    label: "+966"
+  },
+  {
+    country_label: "United Arab Emirates",
+    code: "AE",
+    unicode: "🇦🇪",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/AE.svg",
+    label: "+971"
+  },
+  {
+    country_label: "Bahrain",
+    code: "BH",
+    unicode: "🇧🇭",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BH.svg",
+    label: "+973"
+  },
+  {
+    country_label: "Kuwait",
+    code: "KW",
+    unicode: "🇰🇼",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/KW.svg",
+    label: "+965"
+  },
+  {
+    country_label: "Qatar",
+    code: "QA",
+    unicode: "🇶🇦",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/QA.svg",
+    label: "+974"
+  },
+  {
+    country_label: "Oman",
+    code: "OM",
+    unicode: "🇴🇲",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/OM.svg",
+    label: "+968"
+  },
+  {
+    country_label: "Andorra",
+    value: "Andorra",
+    code: "AD",
+    unicode: "🇦🇩",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/AD.svg",
+    label: "+376"
+  },
+  {
+    country_label: "Afghanistan",
+    code: "AF",
+    unicode: "🇦🇫",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/AF.svg",
+    label: "+93"
+  },
+  {
+    country_label: "Antigua & Barbuda",
+    code: "AG",
+    unicode: "🇦🇬",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/AG.svg",
+    label: "+1268"
+  },
+  {
+    country_label: "Anguilla",
+    code: "AI",
+    unicode: "🇦🇮",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/AI.svg",
+    label: "+1264"
+  },
+  {
+    country_label: "Albania",
+    code: "AL",
+    unicode: "🇦🇱",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/AL.svg",
+    label: "+355"
+  },
+  {
+    country_label: "Armenia",
+    code: "AM",
+    unicode: "🇦🇲",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/AM.svg",
+    label: "+374"
+  },
+  {
+    country_label: "Angola",
+    code: "AO",
+    unicode: "🇦🇴",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/AO.svg",
+    label: "+244"
+  },
+  {
+    country_label: "Antarctica",
+    code: "AQ",
+    unicode: "🇦🇶",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/AQ.svg",
+    label: "+672"
+  },
+  {
+    country_label: "Argentina",
+    code: "AR",
+    unicode: "🇦🇷",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/AR.svg",
+    label: "+54"
+  },
+  {
+    country_label: "American Samoa",
+    code: "AS",
+    unicode: "🇦🇸",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/AS.svg",
+    label: "+1684"
+  },
+  {
+    country_label: "Austria",
+    code: "AT",
+    unicode: "🇦🇹",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/AT.svg",
+    label: "+43"
+  },
+  {
+    country_label: "Australia",
+    code: "AU",
+    unicode: "🇦🇺",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/AU.svg",
+    label: "+61"
+  },
+  {
+    country_label: "Aruba",
+    code: "AW",
+    unicode: "🇦🇼",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/AW.svg",
+    label: "+297"
+  },
+  {
+    country_label: "\xC5land Islands",
+    code: "AX",
+    unicode: "🇦🇽",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/AX.svg",
+    label: "+358"
+  },
+  {
+    country_label: "Azerbaijan",
+    code: "AZ",
+    unicode: "🇦🇿",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/AZ.svg",
+    label: "+994"
+  },
+  {
+    country_label: "Bosnia & Herzegovina",
+    code: "BA",
+    unicode: "🇧🇦",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BA.svg",
+    label: "+387"
+  },
+  {
+    country_label: "Barbados",
+    code: "BB",
+    unicode: "🇧🇧",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BB.svg",
+    label: "+1246"
+  },
+  {
+    country_label: "Bangladesh",
+    code: "BD",
+    unicode: "🇧🇩",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BD.svg",
+    label: "+880"
+  },
+  {
+    country_label: "Belgium",
+    code: "BE",
+    unicode: "🇧🇪",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BE.svg",
+    label: "+32"
+  },
+  {
+    country_label: "Burkina Faso",
+    code: "BF",
+    unicode: "🇧🇫",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BF.svg",
+    label: "+226"
+  },
+  {
+    country_label: "Bulgaria",
+    code: "BG",
+    unicode: "🇧🇬",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BG.svg",
+    label: "+359"
+  },
+  {
+    country_label: "Burundi",
+    code: "BI",
+    unicode: "🇧🇮",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BI.svg",
+    label: "+257"
+  },
+  {
+    country_label: "Benin",
+    code: "BJ",
+    unicode: "🇧🇯",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BJ.svg",
+    label: "+229"
+  },
+  {
+    country_label: "St. Barth\xE9lemy",
+    code: "BL",
+    unicode: "🇧🇱",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BL.svg",
+    label: "+590"
+  },
+  {
+    country_label: "Bermuda",
+    code: "BM",
+    unicode: "🇧🇲",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BM.svg",
+    label: "+1441"
+  },
+  {
+    country_label: "Brunei",
+    code: "BN",
+    unicode: "🇧🇳",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BN.svg",
+    label: "+673"
+  },
+  {
+    country_label: "Bolivia",
+    code: "BO",
+    unicode: "🇧🇴",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BO.svg",
+    label: "+591"
+  },
+  {
+    country_label: "Brazil",
+    code: "BR",
+    unicode: "🇧🇷",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BR.svg",
+    label: "+55"
+  },
+  {
+    country_label: "Bahamas",
+    code: "BS",
+    unicode: "🇧🇸",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BS.svg",
+    label: "+1242"
+  },
+  {
+    country_label: "Bhutan",
+    code: "BT",
+    unicode: "🇧🇹",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BT.svg",
+    label: "+975"
+  },
+  {
+    country_label: "Botswana",
+    code: "BW",
+    unicode: "🇧🇼",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BW.svg",
+    label: "+267"
+  },
+  {
+    country_label: "Belarus",
+    code: "BY",
+    unicode: "🇧🇾",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BY.svg",
+    label: "+375"
+  },
+  {
+    country_label: "Belize",
+    code: "BZ",
+    unicode: "🇧🇿",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/BZ.svg",
+    label: "+501"
+  },
+  {
+    country_label: "Canada",
+    code: "CA",
+    unicode: "🇨🇦",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CA.svg",
+    label: "+1"
+  },
+  {
+    country_label: "Cocos (Keeling) Islands",
+    code: "CC",
+    unicode: "🇨🇨",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CC.svg",
+    label: "+61"
+  },
+  {
+    country_label: "Congo - Kinshasa",
+    code: "CD",
+    unicode: "🇨🇩",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CD.svg",
+    label: "+243"
+  },
+  {
+    country_label: "Central African Republic",
+    code: "CF",
+    unicode: "🇨🇫",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CF.svg",
+    label: "+236"
+  },
+  {
+    country_label: "Congo - Brazzaville",
+    code: "CG",
+    unicode: "🇨🇬",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CG.svg",
+    label: "+242"
+  },
+  {
+    country_label: "Switzerland",
+    code: "CH",
+    unicode: "🇨🇭",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CH.svg",
+    label: "+41"
+  },
+  {
+    country_label: "C\xF4te d\u2019Ivoire",
+    code: "CI",
+    unicode: "🇨🇮",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CI.svg",
+    label: "+225"
+  },
+  {
+    country_label: "Cook Islands",
+    code: "CK",
+    unicode: "🇨🇰",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CK.svg",
+    label: "+682"
+  },
+  {
+    country_label: "Chile",
+    code: "CL",
+    unicode: "🇨🇱",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CL.svg",
+    label: "+56"
+  },
+  {
+    country_label: "Cameroon",
+    code: "CM",
+    unicode: "🇨🇲",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CM.svg",
+    label: "+237"
+  },
+  {
+    country_label: "China",
+    code: "CN",
+    unicode: "🇨🇳",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CN.svg",
+    label: "+86"
+  },
+  {
+    country_label: "Colombia",
+    code: "CO",
+    unicode: "🇨🇴",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CO.svg",
+    label: "+57"
+  },
+  {
+    country_label: "Costa Rica",
+    code: "CR",
+    unicode: "🇨🇷",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CR.svg",
+    label: "+506"
+  },
+  {
+    country_label: "Cuba",
+    code: "CU",
+    unicode: "🇨🇺",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CU.svg",
+    label: "+53"
+  },
+  {
+    country_label: "Cape Verde",
+    code: "CV",
+    unicode: "🇨🇻",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CV.svg",
+    label: "+238"
+  },
+  {
+    country_label: "Christmas Island",
+    code: "CX",
+    unicode: "🇨🇽",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CX.svg",
+    label: "+61"
+  },
+  {
+    country_label: "Cyprus",
+    code: "CY",
+    unicode: "🇨🇾",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CY.svg",
+    label: "+357"
+  },
+  {
+    country_label: "Czechia",
+    code: "CZ",
+    unicode: "🇨🇿",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/CZ.svg",
+    label: "+420"
+  },
+  {
+    country_label: "Germany",
+    code: "DE",
+    unicode: "🇩🇪",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/DE.svg",
+    label: "+49"
+  },
+  {
+    country_label: "Djibouti",
+    code: "DJ",
+    unicode: "🇩🇯",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/DJ.svg",
+    label: "+253"
+  },
+  {
+    country_label: "Denmark",
+    code: "DK",
+    unicode: "🇩🇰",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/DK.svg",
+    label: "+45"
+  },
+  {
+    country_label: "Dominica",
+    code: "DM",
+    unicode: "🇩🇲",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/DM.svg",
+    label: "+1767"
+  },
+  {
+    country_label: "Dominican Republic",
+    code: "DO",
+    unicode: "🇩🇴",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/DO.svg",
+    label: "+1849"
+  },
+  {
+    country_label: "Algeria",
+    code: "DZ",
+    unicode: "🇩🇿",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/DZ.svg",
+    label: "+213"
+  },
+  {
+    country_label: "Ecuador",
+    code: "EC",
+    unicode: "🇪🇨",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/EC.svg",
+    label: "+593"
+  },
+  {
+    country_label: "Estonia",
+    code: "EE",
+    unicode: "🇪🇪",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/EE.svg",
+    label: "+372"
+  },
+  {
+    country_label: "Egypt",
+    code: "EG",
+    unicode: "🇪🇬",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/EG.svg",
+    label: "+20"
+  },
+  {
+    country_label: "Eritrea",
+    code: "ER",
+    unicode: "🇪🇷",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/ER.svg",
+    label: "+291"
+  },
+  {
+    country_label: "Spain",
+    code: "ES",
+    unicode: "🇪🇸",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/ES.svg",
+    label: "+34"
+  },
+  {
+    country_label: "Ethiopia",
+    code: "ET",
+    unicode: "🇪🇹",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/ET.svg",
+    label: "+251"
+  },
+  {
+    country_label: "Finland",
+    code: "FI",
+    unicode: "🇫🇮",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/FI.svg",
+    label: "+358"
+  },
+  {
+    country_label: "Fiji",
+    code: "FJ",
+    unicode: "🇫🇯",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/FJ.svg",
+    label: "+679"
+  },
+  {
+    country_label: "Falkland Islands",
+    code: "FK",
+    unicode: "🇫🇰",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/FK.svg",
+    label: "+500"
+  },
+  {
+    country_label: "Micronesia",
+    code: "FM",
+    unicode: "🇫🇲",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/FM.svg",
+    label: "+691"
+  },
+  {
+    country_label: "Faroe Islands",
+    code: "FO",
+    unicode: "🇫🇴",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/FO.svg",
+    label: "+298"
+  },
+  {
+    country_label: "France",
+    code: "FR",
+    unicode: "🇫🇷",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/FR.svg",
+    label: "+33"
+  },
+  {
+    country_label: "Gabon",
+    code: "GA",
+    unicode: "🇬🇦",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GA.svg",
+    label: "+241"
+  },
+  {
+    country_label: "United Kingdom",
+    code: "GB",
+    unicode: "🇬🇧",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GB.svg",
+    label: "+44"
+  },
+  {
+    country_label: "Grenada",
+    code: "GD",
+    unicode: "🇬🇩",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GD.svg",
+    label: "+1473"
+  },
+  {
+    country_label: "Georgia",
+    code: "GE",
+    unicode: "🇬🇪",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GE.svg",
+    label: "+995"
+  },
+  {
+    country_label: "French Guiana",
+    code: "GF",
+    unicode: "🇬🇫",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GF.svg",
+    label: "+594"
+  },
+  {
+    country_label: "Guernsey",
+    code: "GG",
+    unicode: "🇬🇬",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GG.svg",
+    label: "+44"
+  },
+  {
+    country_label: "Ghana",
+    code: "GH",
+    unicode: "🇬🇭",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GH.svg",
+    label: "+233"
+  },
+  {
+    country_label: "Gibraltar",
+    code: "GI",
+    unicode: "🇬🇮",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GI.svg",
+    label: "+350"
+  },
+  {
+    country_label: "Greenland",
+    code: "GL",
+    unicode: "🇬🇱",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GL.svg",
+    label: "+299"
+  },
+  {
+    country_label: "Gambia",
+    code: "GM",
+    unicode: "🇬🇲",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GM.svg",
+    label: "+220"
+  },
+  {
+    country_label: "Guinea",
+    code: "GN",
+    unicode: "🇬🇳",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GN.svg",
+    label: "+224"
+  },
+  {
+    country_label: "Guadeloupe",
+    code: "GP",
+    unicode: "🇬🇵",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GP.svg",
+    label: "+590"
+  },
+  {
+    country_label: "Equatorial Guinea",
+    code: "GQ",
+    unicode: "🇬🇶",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GQ.svg",
+    label: "+240"
+  },
+  {
+    country_label: "Greece",
+    code: "GR",
+    unicode: "🇬🇷",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GR.svg",
+    label: "+30"
+  },
+  {
+    country_label: "South Georgia & South Sandwich Islands",
+    code: "GS",
+    unicode: "🇬🇸",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GS.svg",
+    label: "+500"
+  },
+  {
+    country_label: "Guatemala",
+    code: "GT",
+    unicode: "🇬🇹",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GT.svg",
+    label: "+502"
+  },
+  {
+    country_label: "Guam",
+    code: "GU",
+    unicode: "🇬🇺",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GU.svg",
+    label: "+1671"
+  },
+  {
+    country_label: "Guinea-Bissau",
+    code: "GW",
+    unicode: "🇬🇼",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GW.svg",
+    label: "+245"
+  },
+  {
+    country_label: "Guyana",
+    code: "GY",
+    unicode: "🇬🇾",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/GY.svg",
+    label: "+595"
+  },
+  {
+    country_label: "Hong Kong SAR China",
+    code: "HK",
+    unicode: "🇭🇰",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/HK.svg",
+    label: "+852"
+  },
+  {
+    country_label: "Honduras",
+    code: "HN",
+    unicode: "🇭🇳",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/HN.svg",
+    label: "+504"
+  },
+  {
+    country_label: "Croatia",
+    code: "HR",
+    unicode: "🇭🇷",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/HR.svg",
+    label: "+385"
+  },
+  {
+    country_label: "Haiti",
+    code: "HT",
+    unicode: "🇭🇹",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/HT.svg",
+    label: "+509"
+  },
+  {
+    country_label: "Hungary",
+    code: "HU",
+    unicode: "🇭🇺",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/HU.svg",
+    label: "+36"
+  },
+  {
+    country_label: "Indonesia",
+    code: "ID",
+    unicode: "🇮🇩",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/ID.svg",
+    label: "+62"
+  },
+  {
+    country_label: "Ireland",
+    code: "IE",
+    unicode: "🇮🇪",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/IE.svg",
+    label: "+353"
+  },
+  {
+    country_label: "Israel",
+    code: "IL",
+    unicode: "🇮🇱",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/IL.svg",
+    label: "+972"
+  },
+  {
+    country_label: "Isle of Man",
+    code: "IM",
+    unicode: "🇮🇲",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/IM.svg",
+    label: "+44"
+  },
+  {
+    country_label: "India",
+    code: "IN",
+    unicode: "🇮🇳",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/IN.svg",
+    label: "+91"
+  },
+  {
+    country_label: "British Indian Ocean Territory",
+    code: "IO",
+    unicode: "🇮🇴",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/IO.svg",
+    label: "+246"
+  },
+  {
+    country_label: "Iraq",
+    code: "IQ",
+    unicode: "🇮🇶",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/IQ.svg",
+    label: "+964"
+  },
+  {
+    country_label: "Iran",
+    code: "IR",
+    unicode: "🇮🇷",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/IR.svg",
+    label: "+98"
+  },
+  {
+    country_label: "Iceland",
+    code: "IS",
+    unicode: "🇮🇸",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/IS.svg",
+    label: "+354"
+  },
+  {
+    country_label: "Italy",
+    code: "IT",
+    unicode: "🇮🇹",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/IT.svg",
+    label: "+39"
+  },
+  {
+    country_label: "Jersey",
+    code: "JE",
+    unicode: "🇯🇪",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/JE.svg",
+    label: "+44"
+  },
+  {
+    country_label: "Jamaica",
+    code: "JM",
+    unicode: "🇯🇲",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/JM.svg",
+    label: "+1876"
+  },
+  {
+    country_label: "Jordan",
+    code: "JO",
+    unicode: "🇯🇴",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/JO.svg",
+    label: "+962"
+  },
+  {
+    country_label: "Japan",
+    code: "JP",
+    unicode: "🇯🇵",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/JP.svg",
+    label: "+81"
+  },
+  {
+    country_label: "Kenya",
+    code: "KE",
+    unicode: "🇰🇪",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/KE.svg",
+    label: "+254"
+  },
+  {
+    country_label: "Kyrgyzstan",
+    code: "KG",
+    unicode: "🇰🇬",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/KG.svg",
+    label: "+996"
+  },
+  {
+    country_label: "Cambodia",
+    code: "KH",
+    unicode: "🇰🇭",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/KH.svg",
+    label: "+855"
+  },
+  {
+    country_label: "Kiribati",
+    code: "KI",
+    unicode: "🇰🇮",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/KI.svg",
+    label: "+686"
+  },
+  {
+    country_label: "Comoros",
+    code: "KM",
+    unicode: "🇰🇲",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/KM.svg",
+    label: "+269"
+  },
+  {
+    country_label: "St. Kitts & Nevis",
+    code: "KN",
+    unicode: "🇰🇳",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/KN.svg",
+    label: "+1869"
+  },
+  {
+    country_label: "North Korea",
+    code: "KP",
+    unicode: "🇰🇵",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/KP.svg",
+    label: "+850"
+  },
+  {
+    country_label: "South Korea",
+    code: "KR",
+    unicode: "🇰🇷",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/KR.svg",
+    label: "+82"
+  },
+  {
+    country_label: "Cayman Islands",
+    code: "KY",
+    unicode: "🇰🇾",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/KY.svg",
+    label: "+ 345"
+  },
+  {
+    country_label: "Kazakhstan",
+    code: "KZ",
+    unicode: "🇰🇿",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/KZ.svg",
+    label: "+77"
+  },
+  {
+    country_label: "Laos",
+    code: "LA",
+    unicode: "🇱🇦",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/LA.svg",
+    label: "+856"
+  },
+  {
+    country_label: "Lebanon",
+    code: "LB",
+    unicode: "🇱🇧",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/LB.svg",
+    label: "+961"
+  },
+  {
+    country_label: "St. Lucia",
+    code: "LC",
+    unicode: "🇱🇨",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/LC.svg",
+    label: "+1758"
+  },
+  {
+    country_label: "Liechtenstein",
+    code: "LI",
+    unicode: "🇱🇮",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/LI.svg",
+    label: "+423"
+  },
+  {
+    country_label: "Sri Lanka",
+    code: "LK",
+    unicode: "🇱🇰",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/LK.svg",
+    label: "+94"
+  },
+  {
+    country_label: "Liberia",
+    code: "LR",
+    unicode: "🇱🇷",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/LR.svg",
+    label: "+231"
+  },
+  {
+    country_label: "Lesotho",
+    code: "LS",
+    unicode: "🇱🇸",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/LS.svg",
+    label: "+266"
+  },
+  {
+    country_label: "Lithuania",
+    code: "LT",
+    unicode: "🇱🇹",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/LT.svg",
+    label: "+370"
+  },
+  {
+    country_label: "Luxembourg",
+    code: "LU",
+    unicode: "🇱🇺",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/LU.svg",
+    label: "+352"
+  },
+  {
+    country_label: "Latvia",
+    code: "LV",
+    unicode: "🇱🇻",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/LV.svg",
+    label: "+371"
+  },
+  {
+    country_label: "Libya",
+    code: "LY",
+    unicode: "🇱🇾",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/LY.svg",
+    label: "+218"
+  },
+  {
+    country_label: "Morocco",
+    code: "MA",
+    unicode: "🇲🇦",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MA.svg",
+    label: "+212"
+  },
+  {
+    country_label: "Monaco",
+    code: "MC",
+    unicode: "🇲🇨",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MC.svg",
+    label: "+377"
+  },
+  {
+    country_label: "Moldova",
+    code: "MD",
+    unicode: "🇲🇩",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MD.svg",
+    label: "+373"
+  },
+  {
+    country_label: "Montenegro",
+    code: "ME",
+    unicode: "🇲🇪",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/ME.svg",
+    label: "+382"
+  },
+  {
+    country_label: "St. Martin",
+    code: "MF",
+    unicode: "🇲🇫",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MF.svg",
+    label: "+590"
+  },
+  {
+    country_label: "Madagascar",
+    code: "MG",
+    unicode: "🇲🇬",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MG.svg",
+    label: "+261"
+  },
+  {
+    country_label: "Marshall Islands",
+    code: "MH",
+    unicode: "🇲🇭",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MH.svg",
+    label: "+692"
+  },
+  {
+    country_label: "North Macedonia",
+    code: "MK",
+    unicode: "🇲🇰",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MK.svg",
+    label: "+389"
+  },
+  {
+    country_label: "Mali",
+    code: "ML",
+    unicode: "🇲🇱",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/ML.svg",
+    label: "+223"
+  },
+  {
+    country_label: "Myanmar (Burma)",
+    code: "MM",
+    unicode: "🇲🇲",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MM.svg",
+    label: "+95"
+  },
+  {
+    country_label: "Mongolia",
+    code: "MN",
+    unicode: "🇲🇳",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MN.svg",
+    label: "+976"
+  },
+  {
+    country_label: "Macao SAR China",
+    code: "MO",
+    unicode: "🇲🇴",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MO.svg",
+    label: "+853"
+  },
+  {
+    country_label: "Northern Mariana Islands",
+    code: "MP",
+    unicode: "🇲🇵",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MP.svg",
+    label: "+1670"
+  },
+  {
+    country_label: "Martinique",
+    code: "MQ",
+    unicode: "🇲🇶",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MQ.svg",
+    label: "+596"
+  },
+  {
+    country_label: "Mauritania",
+    code: "MR",
+    unicode: "🇲🇷",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MR.svg",
+    label: "+222"
+  },
+  {
+    country_label: "Montserrat",
+    code: "MS",
+    unicode: "🇲🇸",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MS.svg",
+    label: "+1664"
+  },
+  {
+    country_label: "Malta",
+    code: "MT",
+    unicode: "🇲🇹",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MT.svg",
+    label: "+356"
+  },
+  {
+    country_label: "Mauritius",
+    code: "MU",
+    unicode: "🇲🇺",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MU.svg",
+    label: "+230"
+  },
+  {
+    country_label: "Maldives",
+    code: "MV",
+    unicode: "🇲🇻",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MV.svg",
+    label: "+960"
+  },
+  {
+    country_label: "Malawi",
+    code: "MW",
+    unicode: "🇲🇼",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MW.svg",
+    label: "+265"
+  },
+  {
+    country_label: "Mexico",
+    code: "MX",
+    unicode: "🇲🇽",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MX.svg",
+    label: "+52"
+  },
+  {
+    country_label: "Malaysia",
+    code: "MY",
+    unicode: "🇲🇾",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MY.svg",
+    label: "+60"
+  },
+  {
+    country_label: "Mozambique",
+    code: "MZ",
+    unicode: "🇲🇿",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/MZ.svg",
+    label: "+258"
+  },
+  {
+    country_label: "Namibia",
+    code: "NA",
+    unicode: "🇳🇦",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/NA.svg",
+    label: "+264"
+  },
+  {
+    country_label: "New Caledonia",
+    code: "NC",
+    unicode: "🇳🇨",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/NC.svg",
+    label: "+687"
+  },
+  {
+    country_label: "Niger",
+    code: "NE",
+    unicode: "🇳🇪",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/NE.svg",
+    label: "+227"
+  },
+  {
+    country_label: "Norfolk Island",
+    code: "NF",
+    unicode: "🇳🇫",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/NF.svg",
+    label: "+672"
+  },
+  {
+    country_label: "Nigeria",
+    code: "NG",
+    unicode: "🇳🇬",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/NG.svg",
+    label: "+234"
+  },
+  {
+    country_label: "Nicaragua",
+    code: "NI",
+    unicode: "🇳🇮",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/NI.svg",
+    label: "+505"
+  },
+  {
+    country_label: "Netherlands",
+    code: "NL",
+    unicode: "🇳🇱",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/NL.svg",
+    label: "+31"
+  },
+  {
+    country_label: "Norway",
+    code: "NO",
+    unicode: "🇳🇴",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/NO.svg",
+    label: "+47"
+  },
+  {
+    country_label: "Nepal",
+    code: "NP",
+    unicode: "🇳🇵",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/NP.svg",
+    label: "+977"
+  },
+  {
+    country_label: "Nauru",
+    code: "NR",
+    unicode: "🇳🇷",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/NR.svg",
+    label: "+674"
+  },
+  {
+    country_label: "Niue",
+    code: "NU",
+    unicode: "🇳🇺",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/NU.svg",
+    label: "+683"
+  },
+  {
+    country_label: "New Zealand",
+    code: "NZ",
+    unicode: "🇳🇿",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/NZ.svg",
+    label: "+64"
+  },
+  {
+    country_label: "Panama",
+    code: "PA",
+    unicode: "🇵🇦",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/PA.svg",
+    label: "+507"
+  },
+  {
+    country_label: "Peru",
+    code: "PE",
+    unicode: "🇵🇪",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/PE.svg",
+    label: "+51"
+  },
+  {
+    country_label: "French Polynesia",
+    code: "PF",
+    unicode: "🇵🇫",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/PF.svg",
+    label: "+689"
+  },
+  {
+    country_label: "Papua New Guinea",
+    code: "PG",
+    unicode: "🇵🇬",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/PG.svg",
+    label: "+675"
+  },
+  {
+    country_label: "Philippines",
+    code: "PH",
+    unicode: "🇵🇭",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/PH.svg",
+    label: "+63"
+  },
+  {
+    country_label: "Pakistan",
+    code: "PK",
+    unicode: "🇵🇰",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/PK.svg",
+    label: "+92"
+  },
+  {
+    country_label: "Poland",
+    code: "PL",
+    unicode: "🇵🇱",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/PL.svg",
+    label: "+48"
+  },
+  {
+    country_label: "St. Pierre & Miquelon",
+    code: "PM",
+    unicode: "🇵🇲",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/PM.svg",
+    label: "+508"
+  },
+  {
+    country_label: "Pitcairn Islands",
+    code: "PN",
+    unicode: "🇵🇳",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/PN.svg",
+    label: "+872"
+  },
+  {
+    country_label: "Puerto Rico",
+    code: "PR",
+    unicode: "🇵🇷",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/PR.svg",
+    label: "+1939"
+  },
+  {
+    country_label: "Palestinian Territories",
+    code: "PS",
+    unicode: "🇵🇸",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/PS.svg",
+    label: "+970"
+  },
+  {
+    country_label: "Portugal",
+    code: "PT",
+    unicode: "🇵🇹",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/PT.svg",
+    label: "+351"
+  },
+  {
+    country_label: "Palau",
+    code: "PW",
+    unicode: "🇵🇼",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/PW.svg",
+    label: "+680"
+  },
+  {
+    country_label: "Paraguay",
+    code: "PY",
+    unicode: "🇵🇾",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/PY.svg",
+    label: "+595"
+  },
+  {
+    country_label: "R\xE9union",
+    code: "RE",
+    unicode: "🇷🇪",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/RE.svg",
+    label: "+262"
+  },
+  {
+    country_label: "Romania",
+    code: "RO",
+    unicode: "🇷🇴",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/RO.svg",
+    label: "+40"
+  },
+  {
+    country_label: "Serbia",
+    code: "RS",
+    unicode: "🇷🇸",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/RS.svg",
+    label: "+381"
+  },
+  {
+    country_label: "Russia",
+    code: "RU",
+    unicode: "🇷🇺",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/RU.svg",
+    label: "+7"
+  },
+  {
+    country_label: "Rwanda",
+    code: "RW",
+    unicode: "🇷🇼",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/RW.svg",
+    label: "+250"
+  },
+  {
+    country_label: "Solomon Islands",
+    code: "SB",
+    unicode: "🇸🇧",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SB.svg",
+    label: "+677"
+  },
+  {
+    country_label: "Seychelles",
+    code: "SC",
+    unicode: "🇸🇨",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SC.svg",
+    label: "+248"
+  },
+  {
+    country_label: "Sudan",
+    code: "SD",
+    unicode: "🇸🇩",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SD.svg",
+    label: "+249"
+  },
+  {
+    country_label: "Sweden",
+    code: "SE",
+    unicode: "🇸🇪",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SE.svg",
+    label: "+46"
+  },
+  {
+    country_label: "Singapore",
+    code: "SG",
+    unicode: "🇸🇬",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SG.svg",
+    label: "+65"
+  },
+  {
+    country_label: "St. Helena",
+    code: "SH",
+    unicode: "🇸🇭",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SH.svg",
+    label: "+290"
+  },
+  {
+    country_label: "Slovenia",
+    code: "SI",
+    unicode: "🇸🇮",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SI.svg",
+    label: "+386"
+  },
+  {
+    country_label: "Svalbard & Jan Mayen",
+    code: "SJ",
+    unicode: "🇸🇯",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SJ.svg",
+    label: "+47"
+  },
+  {
+    country_label: "Slovakia",
+    code: "SK",
+    unicode: "🇸🇰",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SK.svg",
+    label: "+421"
+  },
+  {
+    country_label: "Sierra Leone",
+    code: "SL",
+    unicode: "🇸🇱",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SL.svg",
+    label: "+232"
+  },
+  {
+    country_label: "San Marino",
+    code: "SM",
+    unicode: "🇸🇲",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SM.svg",
+    label: "+378"
+  },
+  {
+    country_label: "Senegal",
+    code: "SN",
+    unicode: "🇸🇳",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SN.svg",
+    label: "+221"
+  },
+  {
+    country_label: "Somalia",
+    code: "SO",
+    unicode: "🇸🇴",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SO.svg",
+    label: "+252"
+  },
+  {
+    country_label: "Suriname",
+    code: "SR",
+    unicode: "🇸🇷",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SR.svg",
+    label: "+597"
+  },
+  {
+    country_label: "South Sudan",
+    code: "SS",
+    unicode: "🇸🇸",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SS.svg",
+    label: "+211"
+  },
+  {
+    country_label: "S\xE3o Tom\xE9 & Pr\xEDncipe",
+    code: "ST",
+    unicode: "🇸🇹",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/ST.svg",
+    label: "+239"
+  },
+  {
+    country_label: "El Salvador",
+    code: "SV",
+    unicode: "🇸🇻",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SV.svg",
+    label: "+503"
+  },
+  {
+    country_label: "Syria",
+    code: "SY",
+    unicode: "🇸🇾",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SY.svg",
+    label: "+963"
+  },
+  {
+    country_label: "Eswatini",
+    code: "SZ",
+    unicode: "🇸🇿",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/SZ.svg",
+    label: "+268"
+  },
+  {
+    country_label: "Turks & Caicos Islands",
+    code: "TC",
+    unicode: "🇹🇨",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/TC.svg",
+    label: "+1649"
+  },
+  {
+    country_label: "Chad",
+    code: "TD",
+    unicode: "🇹🇩",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/TD.svg",
+    label: "+235"
+  },
+  {
+    country_label: "Togo",
+    code: "TG",
+    unicode: "🇹🇬",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/TG.svg",
+    label: "+228"
+  },
+  {
+    country_label: "Thailand",
+    code: "TH",
+    unicode: "🇹🇭",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/TH.svg",
+    label: "+66"
+  },
+  {
+    country_label: "Tajikistan",
+    code: "TJ",
+    unicode: "🇹🇯",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/TJ.svg",
+    label: "+992"
+  },
+  {
+    country_label: "Tokelau",
+    code: "TK",
+    unicode: "🇹🇰",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/TK.svg",
+    label: "+690"
+  },
+  {
+    country_label: "Timor-Leste",
+    code: "TL",
+    unicode: "🇹🇱",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/TL.svg",
+    label: "+670"
+  },
+  {
+    country_label: "Turkmenistan",
+    code: "TM",
+    unicode: "🇹🇲",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/TM.svg",
+    label: "+993"
+  },
+  {
+    country_label: "Tunisia",
+    code: "TN",
+    unicode: "🇹🇳",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/TN.svg",
+    label: "+216"
+  },
+  {
+    country_label: "Tonga",
+    code: "TO",
+    unicode: "🇹🇴",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/TO.svg",
+    label: "+676"
+  },
+  {
+    country_label: "Turkey",
+    code: "TR",
+    unicode: "🇹🇷",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/TR.svg",
+    label: "+90"
+  },
+  {
+    country_label: "Trinidad & Tobago",
+    code: "TT",
+    unicode: "🇹🇹",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/TT.svg",
+    label: "+1868"
+  },
+  {
+    country_label: "Tuvalu",
+    code: "TV",
+    unicode: "🇹🇻",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/TV.svg",
+    label: "+688"
+  },
+  {
+    country_label: "Taiwan",
+    code: "TW",
+    unicode: "🇹🇼",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/TW.svg",
+    label: "+886"
+  },
+  {
+    country_label: "Tanzania",
+    code: "TZ",
+    unicode: "🇹🇿",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/TZ.svg",
+    label: "+255"
+  },
+  {
+    country_label: "Ukraine",
+    code: "UA",
+    unicode: "🇺🇦",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/UA.svg",
+    label: "+380"
+  },
+  {
+    country_label: "Uganda",
+    code: "UG",
+    unicode: "🇺🇬",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/UG.svg",
+    label: "+256"
+  },
+  {
+    country_label: "United States",
+    code: "US",
+    unicode: "🇺🇸",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/US.svg",
+    label: "+1"
+  },
+  {
+    country_label: "Uruguay",
+    code: "UY",
+    unicode: "🇺🇾",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/UY.svg",
+    label: "+598"
+  },
+  {
+    country_label: "Uzbekistan",
+    code: "UZ",
+    unicode: "🇺🇿",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/UZ.svg",
+    label: "+998"
+  },
+  {
+    country_label: "Vatican City",
+    code: "VA",
+    unicode: "🇻🇦",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/VA.svg",
+    label: "+379"
+  },
+  {
+    country_label: "St. Vincent & Grenadines",
+    code: "VC",
+    unicode: "🇻🇨",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/VC.svg",
+    label: "+1784"
+  },
+  {
+    country_label: "Venezuela",
+    code: "VE",
+    unicode: "🇻🇪",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/VE.svg",
+    label: "+58"
+  },
+  {
+    country_label: "British Virgin Islands",
+    code: "VG",
+    unicode: "🇻🇬",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/VG.svg",
+    label: "+1284"
+  },
+  {
+    country_label: "U.S. Virgin Islands",
+    code: "VI",
+    unicode: "🇻🇮",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/VI.svg",
+    label: "+1340"
+  },
+  {
+    country_label: "Vietnam",
+    code: "VN",
+    unicode: "🇻🇳",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/VN.svg",
+    label: "+84"
+  },
+  {
+    country_label: "Vanuatu",
+    code: "VU",
+    unicode: "🇻🇺",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/VU.svg",
+    label: "+678"
+  },
+  {
+    country_label: "Wallis & Futuna",
+    code: "WF",
+    unicode: "🇼🇫",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/WF.svg",
+    label: "+681"
+  },
+  {
+    country_label: "Samoa",
+    code: "WS",
+    unicode: "🇼🇸",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/WS.svg",
+    label: "+685"
+  },
+  {
+    country_label: "Yemen",
+    code: "YE",
+    unicode: "🇾🇪",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/YE.svg",
+    label: "+967"
+  },
+  {
+    country_label: "Mayotte",
+    code: "YT",
+    unicode: "🇾🇹",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/YT.svg",
+    label: "+262"
+  },
+  {
+    country_label: "South Africa",
+    code: "ZA",
+    unicode: "🇿🇦",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/ZA.svg",
+    label: "+27"
+  },
+  {
+    country_label: "Zambia",
+    code: "ZM",
+    unicode: "🇿🇲",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/ZM.svg",
+    label: "+260"
+  },
+  {
+    country_label: "Zimbabwe",
+    code: "ZW",
+    unicode: "🇿🇼",
+    image: "https://cdn.jsdelivr.net/npm/country-flag-emoji-json@2.0.0/dist/images/ZW.svg",
+    label: "+263"
+  }
+];
+var countries_default = countries;
+
+// components/elements/PhoneInput.tsx
+import Select from "react-select";
+var Menu = ({
+  cx,
+  children,
+  getStyles,
+  innerProps,
+  innerRef,
+  ...props
+}) => {
+  return /* @__PURE__ */ React26.createElement(
+    "div",
+    {
+      className: "hawa-absolute hawa-z-50 hawa-w-[190px] hawa-rounded hawa-border hawa-bg-background",
+      ref: innerRef,
+      ...innerProps
+    },
+    children
+  );
+};
+var Option = ({
+  cx,
+  children,
+  getStyles,
+  innerProps,
+  innerRef,
+  ...props
+}) => /* @__PURE__ */ React26.createElement(
+  "div",
+  {
+    ref: innerRef,
+    className: "hawa-m-2 hawa-flex hawa-cursor-pointer hawa-flex-row hawa-items-center hawa-justify-between hawa-rounded-inner hawa-p-1 hawa-px-2 hover:hawa-bg-primary hover:hawa-text-primary-foreground",
+    ...innerProps
+  },
+  /* @__PURE__ */ React26.createElement("div", { className: "hawa-flex hawa-flex-row hawa-items-center hawa-justify-center hawa-gap-1" }, /* @__PURE__ */ React26.createElement("img", { className: "hawa-h-8 hawa-w-8", src: props.data.image }), /* @__PURE__ */ React26.createElement("span", { className: "hawa-text-[10px]" }, props.data.country_label)),
+  children
+);
+var PhoneInput = (props) => {
+  const [selectedCountry, setSelectedCountry] = useState11("+966");
+  return /* @__PURE__ */ React26.createElement("div", { className: "hawa-mb-3 hawa-flex hawa-flex-col" }, props.label && /* @__PURE__ */ React26.createElement("label", { className: "hawa-mb-2 hawa-block hawa-text-sm hawa-font-medium" }, props.label), /* @__PURE__ */ React26.createElement("div", { dir: "ltr", className: "hawa-flex hawa-flex-row " }, /* @__PURE__ */ React26.createElement(
+    Select,
+    {
+      classNames: {
+        control: () => "hawa-w-[64px] hawa-text-right hawa-pr-2 hawa-cursor-pointer hawa-z-10 hawa-border hawa-rounded-l hawa-bg-background",
+        placeholder: (state) => "hawa-text-muted-foreground hawa-text-right ",
+        input: (state) => "hawa-bg-transparent hawa-cursor-pointer dark:hawa-text-white hawa-p-2 hawa-rounded-l hawa-text-[0.875rem] ",
+        valueContainer: () => "hawa-rounded-l hawa-h-auto hawa-text-[0.875rem]"
+      },
+      styles: {
+        placeholder: (base) => ({
+          ...base,
+          fontSize: "0.875rem",
+          textAlign: "right"
+        })
+      },
+      components: {
+        Option,
+        Menu,
+        DropdownIndicator: () => null,
+        IndicatorSeparator: () => null
+      },
+      options: countries_default,
+      isMulti: false,
+      isSearchable: true,
+      isClearable: false,
+      placeholder: "+966",
+      unstyled: true,
+      defaultValue: props.preferredCountry,
+      value: selectedCountry,
+      onChange: (newValue, action) => setSelectedCountry(newValue)
+    }
+  ), /* @__PURE__ */ React26.createElement(
+    "input",
+    {
+      onChange: props.handleChange,
+      type: "number",
+      placeholder: "531045453",
+      className: "hawa-block hawa-w-full hawa-rounded-r hawa-z-50  hawa-border hawa-bg-background hawa-p-2 hawa-text-sm hawa-text-gray-900 focus:hawa-border-blue-500 focus:hawa-ring-blue-500"
+    }
+  ), props.helperText && /* @__PURE__ */ React26.createElement("p", { className: "hawa-mb-1 hawa-mt-1 hawa-text-xs hawa-text-red-600 dark:hawa-text-red-500" }, props.helperText)));
+};
+
+// components/elements/AppStores.tsx
+import React27 from "react";
+var AppStores = (props) => {
+  return /* @__PURE__ */ React27.createElement("div", { className: "hawa-flex hawa-justify-center" }, /* @__PURE__ */ React27.createElement("div", null, props.store === "apple" ? props.mode === "dark" ? /* @__PURE__ */ React27.createElement("div", { className: "hawa-mt-3 hawa-flex hawa-h-14 hawa-w-48 hawa-items-center hawa-justify-center hawa-rounded-lg hawa-bg-black hawa-text-white" }, /* @__PURE__ */ React27.createElement("div", { className: "hawa-mr-3" }, /* @__PURE__ */ React27.createElement("svg", { viewBox: "0 0 384 512", width: "30" }, /* @__PURE__ */ React27.createElement(
+    "path",
+    {
+      fill: "currentColor",
+      d: "M318.7 268.7c-.2-36.7 16.4-64.4 50-84.8-18.8-26.9-47.2-41.7-84.7-44.6-35.5-2.8-74.3 20.7-88.5 20.7-15 0-49.4-19.7-76.4-19.7C63.3 141.2 4 184.8 4 273.5q0 39.3 14.4 81.2c12.8 36.7 59 126.7 107.2 125.2 25.2-.6 43-17.9 75.8-17.9 31.8 0 48.3 17.9 76.4 17.9 48.6-.7 90.4-82.5 102.6-119.3-65.2-30.7-61.7-90-61.7-91.9zm-56.6-164.2c27.3-32.4 24.8-61.9 24-72.5-24.1 1.4-52 16.4-67.9 34.9-17.5 19.8-27.8 44.3-25.6 71.9 26.1 2 49.9-11.4 69.5-34.3z"
+    }
+  ))), /* @__PURE__ */ React27.createElement("div", null, /* @__PURE__ */ React27.createElement("div", { className: "hawa-text-xs" }, "Download on the"), /* @__PURE__ */ React27.createElement("div", { className: "hawa-font-sans hawa--mt-1 hawa-text-2xl hawa-font-semibold" }, "App Store"))) : /* @__PURE__ */ React27.createElement("div", { className: "hawa-mt-3 hawa-flex hawa-h-14 hawa-w-48 hawa-items-center hawa-justify-center hawa-rounded-lg hawa-border hawa-border-black hawa-bg-transparent hawa-text-black" }, /* @__PURE__ */ React27.createElement("div", { className: "hawa-mr-3" }, /* @__PURE__ */ React27.createElement("svg", { viewBox: "0 0 384 512", width: "30" }, /* @__PURE__ */ React27.createElement(
+    "path",
+    {
+      fill: "currentColor",
+      d: "M318.7 268.7c-.2-36.7 16.4-64.4 50-84.8-18.8-26.9-47.2-41.7-84.7-44.6-35.5-2.8-74.3 20.7-88.5 20.7-15 0-49.4-19.7-76.4-19.7C63.3 141.2 4 184.8 4 273.5q0 39.3 14.4 81.2c12.8 36.7 59 126.7 107.2 125.2 25.2-.6 43-17.9 75.8-17.9 31.8 0 48.3 17.9 76.4 17.9 48.6-.7 90.4-82.5 102.6-119.3-65.2-30.7-61.7-90-61.7-91.9zm-56.6-164.2c27.3-32.4 24.8-61.9 24-72.5-24.1 1.4-52 16.4-67.9 34.9-17.5 19.8-27.8 44.3-25.6 71.9 26.1 2 49.9-11.4 69.5-34.3z"
+    }
+  ))), /* @__PURE__ */ React27.createElement("div", null, /* @__PURE__ */ React27.createElement("div", { className: "hawa-text-xs" }, "Download on the"), /* @__PURE__ */ React27.createElement("div", { className: "hawa-font-sans hawa--mt-1 hawa-text-2xl hawa-font-semibold" }, "App Store"))) : props.mode === "dark" ? /* @__PURE__ */ React27.createElement("div", { className: "hawa-mt-3 hawa-flex hawa-h-14 hawa-w-48 hawa-items-center hawa-justify-center hawa-rounded-lg hawa-bg-black hawa-text-white" }, /* @__PURE__ */ React27.createElement("div", { className: "hawa-mr-3" }, /* @__PURE__ */ React27.createElement("svg", { viewBox: "30 336.7 120.9 129.2", width: "30" }, /* @__PURE__ */ React27.createElement(
+    "path",
+    {
+      fill: "#FFD400",
+      d: "M119.2,421.2c15.3-8.4,27-14.8,28-15.3c3.2-1.7,6.5-6.2,0-9.7  c-2.1-1.1-13.4-7.3-28-15.3l-20.1,20.2L119.2,421.2z"
+    }
+  ), /* @__PURE__ */ React27.createElement(
+    "path",
+    {
+      fill: "#FF3333",
+      d: "M99.1,401.1l-64.2,64.7c1.5,0.2,3.2-0.2,5.2-1.3  c4.2-2.3,48.8-26.7,79.1-43.3L99.1,401.1L99.1,401.1z"
+    }
+  ), /* @__PURE__ */ React27.createElement(
+    "path",
+    {
+      fill: "#48FF48",
+      d: "M99.1,401.1l20.1-20.2c0,0-74.6-40.7-79.1-43.1  c-1.7-1-3.6-1.3-5.3-1L99.1,401.1z"
+    }
+  ), /* @__PURE__ */ React27.createElement(
+    "path",
+    {
+      fill: "#3BCCFF",
+      d: "M99.1,401.1l-64.3-64.3c-2.6,0.6-4.8,2.9-4.8,7.6  c0,7.5,0,107.5,0,113.8c0,4.3,1.7,7.4,4.9,7.7L99.1,401.1z"
+    }
+  ))), /* @__PURE__ */ React27.createElement("div", null, /* @__PURE__ */ React27.createElement("div", { className: "hawa-text-xs" }, "GET IT ON"), /* @__PURE__ */ React27.createElement("div", { className: "hawa-font-sans hawa--mt-1 hawa-text-xl hawa-font-semibold" }, "Google Play"))) : /* @__PURE__ */ React27.createElement("div", { className: "hawa-mt-3 hawa-flex hawa-h-14 hawa-w-48 hawa-items-center hawa-justify-center hawa-rounded-lg hawa-border hawa-border-black hawa-bg-white hawa-text-black" }, /* @__PURE__ */ React27.createElement("div", { className: "hawa-mr-3" }, /* @__PURE__ */ React27.createElement("svg", { viewBox: "30 336.7 120.9 129.2", width: "30" }, /* @__PURE__ */ React27.createElement(
+    "path",
+    {
+      fill: "#FFD400",
+      d: "M119.2,421.2c15.3-8.4,27-14.8,28-15.3c3.2-1.7,6.5-6.2,0-9.7  c-2.1-1.1-13.4-7.3-28-15.3l-20.1,20.2L119.2,421.2z"
+    }
+  ), /* @__PURE__ */ React27.createElement(
+    "path",
+    {
+      fill: "#FF3333",
+      d: "M99.1,401.1l-64.2,64.7c1.5,0.2,3.2-0.2,5.2-1.3  c4.2-2.3,48.8-26.7,79.1-43.3L99.1,401.1L99.1,401.1z"
+    }
+  ), /* @__PURE__ */ React27.createElement(
+    "path",
+    {
+      fill: "#48FF48",
+      d: "M99.1,401.1l20.1-20.2c0,0-74.6-40.7-79.1-43.1  c-1.7-1-3.6-1.3-5.3-1L99.1,401.1z"
+    }
+  ), /* @__PURE__ */ React27.createElement(
+    "path",
+    {
+      fill: "#3BCCFF",
+      d: "M99.1,401.1l-64.3-64.3c-2.6,0.6-4.8,2.9-4.8,7.6  c0,7.5,0,107.5,0,113.8c0,4.3,1.7,7.4,4.9,7.7L99.1,401.1z"
+    }
+  ))), /* @__PURE__ */ React27.createElement("div", null, /* @__PURE__ */ React27.createElement("div", { className: "hawa-text-xs" }, "GET IT ON"), /* @__PURE__ */ React27.createElement("div", { className: "hawa-font-sans hawa--mt-1 hawa-text-xl hawa-font-semibold" }, "Google Play")))));
+};
+
+// components/elements/BackToTop.tsx
+import React28, { useState as useState12, useEffect as useEffect7, useRef as useRef4 } from "react";
+import { clsx as clsx7 } from "clsx";
+var BackToTop = ({ ...props }) => {
+  const [visible, setVisible] = useState12(false);
+  const [rect, _setRect] = useState12(null);
+  const self = useRef4(null);
+  const _rect = useRef4(rect);
+  const setRect = (data) => {
+    _rect.current = data;
+    _setRect(data);
+  };
+  const getCoords = () => {
+    let anchor = props.anchor.current;
+    if (anchor) {
+      return [anchor.scrollTop, anchor.scrollLeft];
+    }
+    return [0, 0];
+  };
+  const onScroll = () => {
+    let [scrollTop, scrollLeft] = getCoords();
+    let rect2 = props.anchor.current?.getBoundingClientRect();
+    if (rect2) {
+      setVisible(scrollTop >= rect2.height + (props.paddingThreshold || 100));
+    }
+  };
+  const backToTop = () => {
+    if (props.anchor.current) {
+      props.anchor.current.scrollTo({ top: 0, behavior: "smooth" });
+    }
+  };
+  useEffect7(() => {
+    if (!props.anchor.current)
+      return;
+    props.anchor.current.addEventListener("scroll", onScroll);
+    let interval = setInterval(() => {
+      if (!props.anchor.current)
+        return;
+      let newRect = props.anchor.current.getBoundingClientRect();
+      if (_rect.current == null)
+        return setRect(newRect);
+      if (!(_rect.current.top == newRect.top && _rect.current.left == newRect.left && _rect.current.width == newRect.width && _rect.current.height == newRect.height)) {
+        setRect(newRect);
+      }
+    }, 1);
+    return () => {
+      props.anchor.current?.removeEventListener("scroll", onScroll);
+      clearInterval(interval);
+    };
+  }, []);
+  const getStyles = () => {
+    if (!props.anchor.current || !self.current)
+      return {};
+    let corner = props.corner || "bottom-right";
+    let [vertical, horizontal] = corner.split("-");
+    let anchorRect = props.anchor.current.getBoundingClientRect();
+    let selfRect = self.current?.getBoundingClientRect();
+    let width = horizontal == "right" ? anchorRect.width - selfRect.width : 0;
+    let height = vertical == "bottom" ? anchorRect.height - selfRect.height : 0;
+    let style = {
+      top: anchorRect.y + height + (vertical == "bottom" ? -1 : 1) * (props.paddingX || 10),
+      left: anchorRect.x + width + (horizontal == "right" ? -1 : 1) * (props.paddingX || 25)
+    };
+    return style;
+  };
+  return /* @__PURE__ */ React28.createElement(
+    Button,
+    {
+      className: cn(
+        "hawa-fixed hawa-cursor-pointer hawa-rounded hawa-transition-all",
+        visible ? "hawa-pointer-events-all hawa-opacity-100" : "hawa-pointer-events-none hawa-opacity-0"
+      ),
+      onClick: backToTop,
+      style: {
+        ...getStyles(),
+        transitionProperty: "opacity, background-color"
+      },
+      ref: self,
+      size: "icon"
+    },
+    /* @__PURE__ */ React28.createElement(
+      "svg",
+      {
+        className: clsx7(
+          "hawa-h-6 hawa-w-6 hawa-shrink-0 hawa-rotate-180 hawa-transition-all  disabled:hawa-bg-gray-200"
+        ),
+        "aria-label": "Arrow Icon",
+        viewBox: "0 0 20 20",
+        fill: "currentColor"
+      },
+      /* @__PURE__ */ React28.createElement("path", { d: "M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" })
+    )
+  );
+};
+
+// components/elements/Input.tsx
+import React29 from "react";
+var Input = ({
+  margin = "none",
+  width = "full",
+  preview = false,
+  ...props
+}) => {
+  let marginStyles = {
+    none: "hawa-mb-0",
+    normal: "hawa-mb-3",
+    large: "hawa-mb-5"
+  };
+  let widthStyles = {
+    small: "hawa-w-full hawa-max-w-2xs",
+    normal: "hawa-w-1/2",
+    full: "hawa-w-full"
+  };
+  let defaultStyle = "hawa-flex hawa-max-h-fit hawa-relative hawa-flex-col hawa-justify-center hawa-gap-2";
+  let defaultInputStyle = "hawa-block hawa-w-full hawa-rounded hawa-border hawa-transition-all hawa-bg-background hawa-p-2 hawa-text-sm hawa-text-black dark:hawa-text-white ";
+  return /* @__PURE__ */ React29.createElement(
+    "div",
+    {
+      className: cn(
+        defaultStyle,
+        marginStyles[margin],
+        widthStyles[width],
+        props.className
+      )
+    },
+    props.label && /* @__PURE__ */ React29.createElement(Label, null, props.label),
+    props.isLoading ? /* @__PURE__ */ React29.createElement(Skeleton, { className: "hawa-h-[38px] hawa-w-full" }) : /* @__PURE__ */ React29.createElement(React29.Fragment, null, /* @__PURE__ */ React29.createElement(
+      "div",
+      {
+        className: cn(
+          "hawa-absolute hawa-top-[22px] hawa-h-[0.8px] hawa-w-full hawa-bg-gray-200 hawa-transition-all dark:hawa-bg-gray-800",
+          preview ? "hawa-opacity-100" : "hawa-opacity-0"
+        )
+      }
+    ), /* @__PURE__ */ React29.createElement(React29.Fragment, null, /* @__PURE__ */ React29.createElement("div", { className: cn("hawa-relative") }, props.icon && /* @__PURE__ */ React29.createElement("div", { className: "hawa-absolute hawa-left-3 hawa-top-1/2 hawa--translate-y-1/2" }, props.icon), /* @__PURE__ */ React29.createElement(
+      "input",
+      {
+        ...props,
+        className: cn(
+          defaultInputStyle,
+          props.icon && "hawa-pl-10",
+          "focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2",
+          preview && "hawa-border-transparent hawa-bg-transparent hawa-px-0"
+        ),
+        disabled: preview
+      }
+    )), props.iconInside && /* @__PURE__ */ React29.createElement("div", { className: "hawa-absolute hawa-right-1 hawa-top-[41px]  hawa--translate-y-1/2" }, props.iconInside), props.helperText && /* @__PURE__ */ React29.createElement("p", { className: "hawa-mb-0 hawa-mt-0 hawa-text-xs hawa-text-red-600 dark:hawa-text-red-500" }, props.helperText)))
+  );
+};
+
+// components/elements/Tabs.tsx
+import * as React30 from "react";
+import * as TabsPrimitive from "@radix-ui/react-tabs";
+var TabsContext = React30.createContext({ orientation: "vertical" });
+var Tabs = React30.forwardRef(({ className, orientation, ...props }, ref) => /* @__PURE__ */ React30.createElement(
+  TabsPrimitive.Root,
+  {
+    ref,
+    className: cn(
+      "hawa-flex hawa-gap-2",
+      orientation === "vertical" ? "hawa-flex-row" : "hawa-flex-col",
+      className
+    ),
+    ...props
+  },
+  /* @__PURE__ */ React30.createElement(TabsContext.Provider, { value: { orientation } }, props.children)
+));
+Tabs.displayName = TabsPrimitive.Root.displayName;
+var TabsList = React30.forwardRef(({ className, ...props }, ref) => {
+  const { orientation } = React30.useContext(TabsContext);
+  console.log("orient ", orientation);
+  return /* @__PURE__ */ React30.createElement(
+    TabsPrimitive.List,
+    {
+      ref,
+      className: cn(
+        "hawa-flex hawa-w-fit hawa-flex-wrap 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",
+        orientation === "vertical" ? "hawa-flex-col" : "hawa-flex-row",
+        className
+      ),
+      ...props
+    }
+  );
+});
+TabsList.displayName = TabsPrimitive.List.displayName;
+var TabsTrigger = React30.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ React30.createElement(
+    TabsPrimitive.Trigger,
+    {
+      ref,
+      className: cn(
+        "hawa-inline-flex hawa-w-full hawa-flex-1 hawa-select-none hawa-items-center hawa-justify-center 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",
+        className
+      ),
+      ...props
+    }
+  );
+});
+TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
+var TabsContent = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React30.createElement(
+  TabsPrimitive.Content,
+  {
+    ref,
+    className: cn(
+      "hawa-w-full hawa-ring-offset-hawa-background focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2",
+      className
+    ),
+    ...props
+  }
+));
+TabsContent.displayName = TabsPrimitive.Content.displayName;
 export {
   ActionCard,
   Alert,
   AppStores,
+  BackToTop,
   Breadcrumb,
   Button,
   Card,
@@ -1801,6 +4055,7 @@ export {
   Checkbox,
   Chip,
   CodeBlock,
+  ColorPicker,
   Dialog,
   DialogContent,
   DialogDescription,
@@ -1809,8 +4064,11 @@ export {
   DialogTitle,
   DialogTrigger,
   DropdownMenu,
+  FileDropzone,
+  Input,
   Label,
   Loading,
+  PhoneInput,
   PinInput,
   Popover,
   PopoverContent,
@@ -1818,6 +4076,10 @@ export {
   Skeleton,
   Slider,
   Switch,
+  Tabs,
+  TabsContent,
+  TabsList,
+  TabsTrigger,
   Textarea,
   Toast,
   ToastAction,