geoiq-frontend-ui-kit 2.0.2 → 2.0.4

package/dist/index.es183.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es183.js","sources":["../src/components/ui/form-renderer/components/form-fields/components/taggable-multi-image-picker/index.tsx"],"sourcesContent":["import { Typography } from '@/components/atoms/typography'\nimport { useToast } from '@/components/molecules/toast'\nimport { Spinner } from '@/components/unstyled/spinner'\nimport { SingleCombobox } from '@/components/molecules/single-combobox'\n\nimport { Upload, X, Pen } from 'lucide-react'\nimport React, { useRef, useState } from 'react'\nimport { useFormValues } from '../../../../context/form-values'\nimport { AssetValue, TaggableAssetValue } from '../../../../form.types'\n\ninterface TaggableMultiImagePickerProps {\n  id: string\n  onChange: (data: TaggableAssetValue[]) => void\n  value?: TaggableAssetValue[]\n  accept?: string\n  error?: string\n  maxImages?: number\n  options: string[]\n}\n\nconst TaggableMultiImagePicker: React.FC<TaggableMultiImagePickerProps> = ({\n  id,\n  onChange,\n  value = [],\n  accept = 'image/*',\n  error,\n  maxImages = 20,\n  options,\n}) => {\n  const { onAssetUpload, onToggleImageEditor } = useFormValues()\n  const { toast } = useToast()\n\n  const [isLoading, setIsLoading] = useState(false)\n  const fileInputRef = useRef<HTMLInputElement>(null)\n\n  const handleImageSelect = async (e: React.ChangeEvent<HTMLInputElement>) => {\n    const files = e.target.files\n    if (!files?.length || isLoading) return\n\n    if (value.length + files.length > maxImages) {\n      toast({\n        title: 'Alert!',\n        description: `Maximum ${maxImages} images allowed.`,\n        icon: 'warning',\n      })\n      return\n    }\n\n    if (onAssetUpload) {\n      setIsLoading(true)\n\n      try {\n        const uploads = Array.from(files).map((file) => onAssetUpload(file))\n        const results = await Promise.all(uploads)\n\n        const TaggedResults = results.map((result) => ({ ...result, tag: '' }))\n\n        onChange([...value, ...TaggedResults])\n\n        toast({\n          title: 'Alert!',\n          description: `${files.length} ${files.length === 1 ? 'image' : 'images'} uploaded successfully.`,\n          icon: 'success',\n        })\n      } catch (error) {\n        toast({\n          title: 'Alert!',\n          description: `Error uploading images`,\n          icon: 'warning',\n        })\n      } finally {\n        setIsLoading(false)\n        // Reset the file input so the same files can be selected again\n        if (fileInputRef.current) {\n          fileInputRef.current.value = ''\n        }\n      }\n    }\n  }\n\n  const handleClick = () => {\n    if (!isLoading && value.length < maxImages) {\n      fileInputRef.current?.click()\n    } else if (value.length >= maxImages) {\n      toast({\n        title: 'Alert!',\n        description: `Maximum ${maxImages} images allowed.`,\n        icon: 'warning',\n      })\n    }\n  }\n\n  const removeImage = (index: number) => {\n    if (!isLoading) {\n      const newImages = [...value]\n      newImages.splice(index, 1)\n      onChange(newImages)\n    }\n  }\n\n  const onReplaceImage = (data: AssetValue, index: number) => {\n    const newValue = [...value]\n    const existingImage = newValue[index]\n\n    newValue.splice(index, 1, { ...existingImage, ...data })\n    onChange(newValue)\n  }\n\n  return (\n    <div className=\"relative\">\n      {isLoading && (\n        <div className=\"absolute inset-0 z-10 flex items-center justify-center bg-white bg-opacity-70\">\n          <Spinner className=\"w-8 h-8 text-primary-1\" />\n        </div>\n      )}\n      <div className=\"relative p-8 border-2 border-dashed rounded-lg border-primary-1 bg-primary-1\">\n        <button\n          className=\"w-full\"\n          onClick={handleClick}\n          type=\"button\"\n          disabled={isLoading || value.length >= maxImages}\n        >\n          <div className=\"flex flex-col items-center gap-3 text-center\">\n            <div className=\"bg-gray-100 rounded-full\">\n              <Upload className=\"w-6 h-6 text-gray-500\" />\n            </div>\n            <Typography variant=\"body1\" className=\"text-gray-600\">\n              {isLoading\n                ? 'Uploading...'\n                : value.length >= maxImages\n                  ? `Maximum ${maxImages} images reached`\n                  : 'Add Images'}\n            </Typography>\n            {value.length > 0 && (\n              <Typography variant=\"body1\" className=\"text-gray-500\">\n                {value.length} of {maxImages} images\n              </Typography>\n            )}\n          </div>\n        </button>\n        <input\n          ref={fileInputRef}\n          id={`${id}-gallery`}\n          type=\"file\"\n          accept={accept}\n          disabled={isLoading || value.length >= maxImages}\n          onChange={handleImageSelect}\n          className=\"hidden\"\n          multiple\n        />\n\n        {error && (\n          <Typography variant=\"body1\" className=\"mt-1 text-danger-1\">\n            {error}\n          </Typography>\n        )}\n      </div>\n\n      {value.length > 0 && (\n        <div className=\"grid grid-cols-2 gap-4 mt-4 sm:grid-cols-3 md:grid-cols-4\">\n          {value.map((image, index) => (\n            <div key={image.private_url} className=\"flex flex-col gap-2\">\n              <div key={index} className=\"relative flex rounded\">\n                <img\n                  src={image.public_url}\n                  alt={`Preview ${index + 1}`}\n                  className=\"object-cover w-full h-24 rounded\"\n                />\n                {onToggleImageEditor && (\n                  <button\n                    type=\"button\"\n                    onClick={(e) => {\n                      e.currentTarget.blur()\n                      onToggleImageEditor({\n                        imageUrl: image.public_url,\n                        index,\n                        onReplaceImage,\n                      })\n                    }}\n                    className=\"absolute p-1 text-white bg-white rounded-full left-2 top-2 opacity-70 hover:opacity-100\"\n                  >\n                    <Pen size={16} className=\"stroke-danger\" />\n                  </button>\n                )}\n                <button\n                  onClick={() => removeImage(index)}\n                  className=\"absolute p-1 text-white bg-white rounded-full right-2 top-2 opacity-70 hover:opacity-100\"\n                  type=\"button\"\n                  disabled={isLoading}\n                >\n                  <X size={16} className=\"stroke-danger\" />\n                </button>\n              </div>\n              <SingleCombobox\n                options={options.map((option) => ({\n                  id: option,\n                  name: option,\n                }))}\n                value={image.tag}\n                onChange={(data) => {\n                  const newImages = [...value]\n                  newImages[index].tag = data\n                  onChange(newImages)\n                }}\n                placeholder={'Select '}\n              />\n            </div>\n          ))}\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport { TaggableMultiImagePicker }\n"],"names":["TaggableMultiImagePicker","id","onChange","value","accept","error","maxImages","options","onAssetUpload","onToggleImageEditor","useFormValues","toast","useToast","isLoading","setIsLoading","useState","fileInputRef","useRef","handleImageSelect","e","files","uploads","file","TaggedResults","result","handleClick","removeImage","index","newImages","onReplaceImage","data","newValue","existingImage","React","Spinner","Upload","Typography","image","Pen","X","SingleCombobox","option"],"mappings":"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"}

package/dist/index.es184.js

@@ -0,0 +1,133 @@
+import * as e from "react";
+import { useState as $, useRef as T } from "react";
+import { Input as x } from "./index.es11.js";
+import { Typography as g } from "./index.es19.js";
+import { Spinner as R } from "./index.es64.js";
+import { Upload as U, Pen as I, X as z } from "lucide-react";
+import { useFormValues as C } from "./index.es161.js";
+import { useToast as M } from "./index.es87.js";
+const q = ({
+  id: p,
+  onChange: c,
+  value: r = [],
+  accept: E = "image/*",
+  error: u,
+  maxImages: l = 20,
+  placeholder: f
+}) => {
+  const { onAssetUpload: h, onToggleImageEditor: y } = C(), { toast: o } = M(), [n, b] = $(!1), m = T(null), N = async (a) => {
+    const t = a.target.files;
+    if (!(!t?.length || n)) {
+      if (r.length + t.length > l) {
+        o({
+          title: "Alert!",
+          description: `Maximum ${l} images allowed.`,
+          icon: "warning"
+        });
+        return;
+      }
+      if (h) {
+        b(!0);
+        try {
+          const s = Array.from(t).map((d) => h(d)), A = (await Promise.all(s)).map((d) => ({ ...d, tag: "" }));
+          c([...r, ...A]), o({
+            title: "Alert!",
+            description: `${t.length} ${t.length === 1 ? "image" : "images"} uploaded successfully.`,
+            icon: "success"
+          });
+        } catch {
+          o({
+            title: "Alert!",
+            description: "Error uploading images",
+            icon: "warning"
+          });
+        } finally {
+          b(!1), m.current && (m.current.value = "");
+        }
+      }
+    }
+  }, w = () => {
+    !n && r.length < l ? m.current?.click() : r.length >= l && o({
+      title: "Alert!",
+      description: `Maximum ${l} images allowed.`,
+      icon: "warning"
+    });
+  }, v = (a) => {
+    if (!n) {
+      const t = [...r];
+      t.splice(a, 1), c(t);
+    }
+  }, k = (a, t) => {
+    const s = [...r], i = s[t];
+    s.splice(t, 1, { ...i, ...a }), c(s);
+  };
+  return /* @__PURE__ */ e.createElement("div", { className: "relative" }, n && /* @__PURE__ */ e.createElement("div", { className: "absolute inset-0 z-10 flex items-center justify-center bg-white bg-opacity-70" }, /* @__PURE__ */ e.createElement(R, { className: "w-8 h-8 text-primary-1" })), /* @__PURE__ */ e.createElement("div", { className: "relative p-8 border-2 border-dashed rounded-lg border-primary-1 bg-primary-1" }, /* @__PURE__ */ e.createElement(
+    "button",
+    {
+      className: "w-full",
+      onClick: w,
+      type: "button",
+      disabled: n || r.length >= l
+    },
+    /* @__PURE__ */ e.createElement("div", { className: "flex flex-col items-center gap-3 text-center" }, /* @__PURE__ */ e.createElement("div", { className: "bg-gray-100 rounded-full" }, /* @__PURE__ */ e.createElement(U, { className: "w-6 h-6 text-gray-500" })), /* @__PURE__ */ e.createElement(g, { variant: "body1", className: "text-gray-600" }, n ? "Uploading..." : r.length >= l ? `Maximum ${l} images reached` : "Add Images"), r.length > 0 && /* @__PURE__ */ e.createElement(g, { variant: "body1", className: "text-gray-500" }, r.length, " of ", l, " images"))
+  ), /* @__PURE__ */ e.createElement(
+    "input",
+    {
+      ref: m,
+      id: `${p}-gallery`,
+      type: "file",
+      accept: E,
+      disabled: n || r.length >= l,
+      onChange: N,
+      className: "hidden",
+      multiple: !0
+    }
+  ), u && /* @__PURE__ */ e.createElement(g, { variant: "body1", className: "mt-1 text-danger-1" }, u)), r.length > 0 && /* @__PURE__ */ e.createElement("div", { className: "grid grid-cols-2 gap-4 mt-4 sm:grid-cols-3 md:grid-cols-4" }, r.map((a, t) => /* @__PURE__ */ e.createElement("div", { key: a.private_url, className: "flex flex-col gap-2" }, /* @__PURE__ */ e.createElement("div", { key: t, className: "relative flex rounded" }, /* @__PURE__ */ e.createElement(
+    "img",
+    {
+      src: a.public_url,
+      alt: `Preview ${t + 1}`,
+      className: "object-cover w-full h-24 rounded"
+    }
+  ), y && /* @__PURE__ */ e.createElement(
+    "button",
+    {
+      type: "button",
+      onClick: (s) => {
+        s.currentTarget.blur(), y({
+          imageUrl: a.public_url,
+          index: t,
+          onReplaceImage: k
+        });
+      },
+      className: "absolute p-1 text-white bg-white rounded-full left-2 top-2 opacity-70 hover:opacity-100"
+    },
+    /* @__PURE__ */ e.createElement(I, { size: 16, className: "stroke-danger" })
+  ), /* @__PURE__ */ e.createElement(
+    "button",
+    {
+      onClick: () => v(t),
+      className: "absolute p-1 text-white bg-white rounded-full right-2 top-2 opacity-70 hover:opacity-100",
+      type: "button",
+      disabled: n
+    },
+    /* @__PURE__ */ e.createElement(z, { size: 16, className: "stroke-danger" })
+  )), /* @__PURE__ */ e.createElement(
+    x,
+    {
+      id: p + t,
+      type: "text",
+      placeholder: f || "",
+      value: a.tag,
+      required: !0,
+      onChange: (s) => {
+        const i = [...r];
+        i[t].tag = s.target.value, c(i);
+      }
+    }
+  )))));
+};
+export {
+  q as TaggableImageUploadFieldWithInput
+};
+//# sourceMappingURL=index.es184.js.map

package/dist/index.es184.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es184.js","sources":["../src/components/ui/form-renderer/components/form-fields/components/taggable-multi-image-picker-with-input/index.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Input } from '@/components/atoms/input'\nimport { Typography } from '@/components/atoms/typography'\nimport { useToast } from '@/components/molecules/toast'\nimport { useFormValues } from '@/components/ui/form-renderer/context/form-values'\nimport {\n  AssetValue,\n  TaggableAssetValue,\n} from '@/components/ui/form-renderer/form.types'\nimport { Spinner } from '@/components/unstyled/spinner'\nimport { Upload, X, Pen } from 'lucide-react'\nimport { useRef, useState } from 'react'\n\ninterface TaggableImageUploadFieldWithInputProps {\n  id: string\n  onChange: (data: TaggableAssetValue[]) => void\n  value?: TaggableAssetValue[]\n  accept?: string\n  error?: string\n  maxImages?: number\n  placeholder?: string\n}\n\nconst TaggableImageUploadFieldWithInput: React.FC<\n  TaggableImageUploadFieldWithInputProps\n> = ({\n  id,\n  onChange,\n  value = [],\n  accept = 'image/*',\n  error,\n  maxImages = 20,\n  placeholder,\n}) => {\n  const { onAssetUpload, onToggleImageEditor } = useFormValues()\n  const { toast } = useToast()\n\n  const [isLoading, setIsLoading] = useState(false)\n  const fileInputRef = useRef<HTMLInputElement>(null)\n\n  const handleImageSelect = async (e: React.ChangeEvent<HTMLInputElement>) => {\n    const files = e.target.files\n    if (!files?.length || isLoading) return\n\n    if (value.length + files.length > maxImages) {\n      toast({\n        title: 'Alert!',\n        description: `Maximum ${maxImages} images allowed.`,\n        icon: 'warning',\n      })\n      return\n    }\n\n    if (onAssetUpload) {\n      setIsLoading(true)\n\n      try {\n        const uploads = Array.from(files).map((file) => onAssetUpload(file))\n        const results = await Promise.all(uploads)\n\n        const TaggedResults = results.map((result) => ({ ...result, tag: '' }))\n\n        onChange([...value, ...TaggedResults])\n\n        toast({\n          title: 'Alert!',\n          description: `${files.length} ${files.length === 1 ? 'image' : 'images'} uploaded successfully.`,\n          icon: 'success',\n        })\n      } catch (error) {\n        toast({\n          title: 'Alert!',\n          description: `Error uploading images`,\n          icon: 'warning',\n        })\n      } finally {\n        setIsLoading(false)\n        // Reset the file input so the same files can be selected again\n        if (fileInputRef.current) {\n          fileInputRef.current.value = ''\n        }\n      }\n    }\n  }\n\n  const handleClick = () => {\n    if (!isLoading && value.length < maxImages) {\n      fileInputRef.current?.click()\n    } else if (value.length >= maxImages) {\n      toast({\n        title: 'Alert!',\n        description: `Maximum ${maxImages} images allowed.`,\n        icon: 'warning',\n      })\n    }\n  }\n\n  const removeImage = (index: number) => {\n    if (!isLoading) {\n      const newImages = [...value]\n      newImages.splice(index, 1)\n      onChange(newImages)\n    }\n  }\n\n  const onReplaceImage = (data: AssetValue, index: number) => {\n    const newValue = [...value]\n    const existingImage = newValue[index]\n\n    newValue.splice(index, 1, { ...existingImage, ...data })\n    onChange(newValue)\n  }\n  return (\n    <div className=\"relative\">\n      {isLoading && (\n        <div className=\"absolute inset-0 z-10 flex items-center justify-center bg-white bg-opacity-70\">\n          <Spinner className=\"w-8 h-8 text-primary-1\" />\n        </div>\n      )}\n      <div className=\"relative p-8 border-2 border-dashed rounded-lg border-primary-1 bg-primary-1\">\n        <button\n          className=\"w-full\"\n          onClick={handleClick}\n          type=\"button\"\n          disabled={isLoading || value.length >= maxImages}\n        >\n          <div className=\"flex flex-col items-center gap-3 text-center\">\n            <div className=\"bg-gray-100 rounded-full\">\n              <Upload className=\"w-6 h-6 text-gray-500\" />\n            </div>\n            <Typography variant=\"body1\" className=\"text-gray-600\">\n              {isLoading\n                ? 'Uploading...'\n                : value.length >= maxImages\n                  ? `Maximum ${maxImages} images reached`\n                  : 'Add Images'}\n            </Typography>\n            {value.length > 0 && (\n              <Typography variant=\"body1\" className=\"text-gray-500\">\n                {value.length} of {maxImages} images\n              </Typography>\n            )}\n          </div>\n        </button>\n        <input\n          ref={fileInputRef}\n          id={`${id}-gallery`}\n          type=\"file\"\n          accept={accept}\n          disabled={isLoading || value.length >= maxImages}\n          onChange={handleImageSelect}\n          className=\"hidden\"\n          multiple\n        />\n\n        {error && (\n          <Typography variant=\"body1\" className=\"mt-1 text-danger-1\">\n            {error}\n          </Typography>\n        )}\n      </div>\n\n      {value.length > 0 && (\n        <div className=\"grid grid-cols-2 gap-4 mt-4 sm:grid-cols-3 md:grid-cols-4\">\n          {value.map((image, index) => (\n            <div key={image.private_url} className=\"flex flex-col gap-2\">\n              <div key={index} className=\"relative flex rounded\">\n                <img\n                  src={image.public_url}\n                  alt={`Preview ${index + 1}`}\n                  className=\"object-cover w-full h-24 rounded\"\n                />\n                {onToggleImageEditor && (\n                  <button\n                    type=\"button\"\n                    onClick={(e) => {\n                      e.currentTarget.blur()\n                      onToggleImageEditor({\n                        imageUrl: image.public_url,\n                        index,\n                        onReplaceImage,\n                      })\n                    }}\n                    className=\"absolute p-1 text-white bg-white rounded-full left-2 top-2 opacity-70 hover:opacity-100\"\n                  >\n                    <Pen size={16} className=\"stroke-danger\" />\n                  </button>\n                )}\n                <button\n                  onClick={() => removeImage(index)}\n                  className=\"absolute p-1 text-white bg-white rounded-full right-2 top-2 opacity-70 hover:opacity-100\"\n                  type=\"button\"\n                  disabled={isLoading}\n                >\n                  <X size={16} className=\"stroke-danger\" />\n                </button>\n              </div>\n              <Input\n                id={id + index}\n                type=\"text\"\n                placeholder={placeholder ? placeholder : ''}\n                value={image.tag}\n                required={true}\n                onChange={(e) => {\n                  const newImages = [...value]\n                  newImages[index].tag = e.target.value\n                  onChange(newImages)\n                }}\n              />\n            </div>\n          ))}\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport { TaggableImageUploadFieldWithInput }\n"],"names":["TaggableImageUploadFieldWithInput","id","onChange","value","accept","error","maxImages","placeholder","onAssetUpload","onToggleImageEditor","useFormValues","toast","useToast","isLoading","setIsLoading","useState","fileInputRef","useRef","handleImageSelect","e","files","uploads","file","TaggedResults","result","handleClick","removeImage","index","newImages","onReplaceImage","data","newValue","existingImage","React","Spinner","Upload","Typography","image","Pen","X","Input"],"mappings":"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"}

package/dist/index.es185.js

@@ -0,0 +1,9 @@
+import { format as o } from "date-fns";
+const m = (t) => {
+  const e = new Date(t * 1e3);
+  return o(e, "dd MMM yyyy, hh:mm a");
+};
+export {
+  m as convertEpochTime
+};
+//# sourceMappingURL=index.es185.js.map

package/dist/index.es185.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es185.js","sources":["../src/components/organisms/navbar/components/notification-panel/components/notification-card/notification.utils.ts"],"sourcesContent":["import { format } from 'date-fns'\n\nconst convertEpochTime = (epochTime: number) => {\n  const date = new Date(epochTime * 1000)\n  return format(date, 'dd MMM yyyy, hh:mm a')\n}\n\nexport { convertEpochTime }\n"],"names":["convertEpochTime","epochTime","date","format"],"mappings":";AAEA,MAAMA,IAAmB,CAACC,MAAsB;AAC9C,QAAMC,IAAO,IAAI,KAAKD,IAAY,GAAI;AACtC,SAAOE,EAAOD,GAAM,sBAAsB;AAC5C;"}

package/dist/index.es19.js

@@ -1,7 +1,7 @@
 import * as o from "react";
 import { cn as n } from "./index.es89.js";
 import { TypographyVariants as y } from "./index.es85.js";
-import { variantElementMap as i, defaultTypographyVariant as c } from "./index.es121.js";
+import { variantElementMap as i, defaultTypographyVariant as c } from "./index.es108.js";
 const f = o.forwardRef(({ className: t, variant: r = c, id: e, ...a }, p) => {
   const m = i[r];
   return /* @__PURE__ */ o.createElement(

package/dist/index.es2.js

@@ -4,51 +4,51 @@ import { Typography as f } from "./index.es19.js";
 import { Button as p } from "./index.es9.js";
 import { Input as w } from "./index.es11.js";
 const j = ["5", "10", "20", "50", ">50"], T = ({
-  open: o,
+  open: c,
   onClose: _,
   onRequestCredits: g,
-  onProceedToPayment: E,
+  onProceedToPayment: N,
   dialogClassName: k,
-  buyCreditsOptions: N = j,
+  buyCreditsOptions: E = j,
   minimumCreditsToBuy: v = 5,
   requestOnly: D = !1
 }) => {
-  const [a, l] = h(""), [r, c] = h(""), [m, i] = h(""), x = N.filter((e) => !e.startsWith(">")).map((e) => Number(e)), O = x.length ? Math.max(...x) : 50, b = a.startsWith(">") || Number(a) > O, s = D || b, u = a && !s && Number(a) < v ? `Minimum number of credits is ${v}` : "";
+  const [a, l] = h(""), [s, m] = h(""), [o, i] = h(""), x = E.map((e) => e.startsWith(">") ? Number(e.replace(">", "")) : Number(e)), O = x.length ? Math.max(...x) : 50, b = a.startsWith(">") || Number(a) > O, r = D || b, u = a && !r && Number(a) < v ? `Minimum number of credits is ${v}` : "";
   C(() => {
-    if (s) {
-      const e = P(r);
+    if (r) {
+      const e = P(s);
       i(e);
     } else
       i("");
-  }, [r, s]);
+  }, [s, r]);
   const P = (e) => {
     if (!e) return "";
     const n = e.startsWith("+91") ? e.substring(3) : e;
     return /^[6-9]\d{9}$/.test(n) ? "" : "Number should start with 6-9 and be 10 digits";
   }, W = (e) => {
     const n = e.target.value.replace(/\D/g, "");
-    c(n);
+    m(n);
   }, q = (e) => {
     const n = e.target.value.replace(/\D/g, "");
     l(n);
   }, S = () => {
     const e = a.startsWith(">") ? a.replace(">", "") + "+" : a;
-    s ? g(e, r) : E ? E(e, r) : g(e, r), d();
+    r ? g(e, s) : N ? N(e, s) : g(e, s), d();
   }, d = () => {
     _(), setTimeout(() => {
-      c(""), i(""), l("");
+      m(""), i(""), l("");
     }, 100);
   };
   C(() => {
-    o || setTimeout(() => {
-      c(""), i(""), l("");
+    c || setTimeout(() => {
+      m(""), i(""), l("");
     }, 100);
-  }, [o]);
-  const $ = s ? `Request ${a}` : `Proceed to Payment ${a} `, M = !a || Number(a) <= 0 || !!u || s && (!!m || !r), y = (e) => e.startsWith(">") ? b : e === a;
+  }, [c]);
+  const $ = r ? `Request ${a}` : `Proceed to Payment ${a} `, M = !a || Number(a) <= 0 || !!u || r && (!!o || !s), y = (e) => e.startsWith(">") ? b : e === a;
   return /* @__PURE__ */ t.createElement(
     R,
     {
-      open: o,
+      open: c,
       onOpenChange: d,
       onOpenAutoFocus: (e) => e.preventDefault(),
       trigger: null,
@@ -60,7 +60,7 @@ const j = ["5", "10", "20", "50", ">50"], T = ({
           alt: "lock",
           className: k
         }
-      )), /* @__PURE__ */ t.createElement("div", { className: "px-4 py-2 w-72 md:w-[400px]" }, /* @__PURE__ */ t.createElement("div", { className: "flex flex-col gap-2" }, /* @__PURE__ */ t.createElement(f, { variant: "h3", className: "text-light-2" }, "How many credits do you need?"), /* @__PURE__ */ t.createElement(f, { variant: "body4", className: "text-light-4" }, /* @__PURE__ */ t.createElement("span", { className: "underline" }, "Note:"), " One credit is needed to unlock a site report.", " ", s ? " Please provide your phone number to make a request" : "")), /* @__PURE__ */ t.createElement("div", { className: "mt-3" }, /* @__PURE__ */ t.createElement(
+      )), /* @__PURE__ */ t.createElement("div", { className: "px-4 py-2 w-72 md:w-[400px]" }, /* @__PURE__ */ t.createElement("div", { className: "flex flex-col gap-2" }, /* @__PURE__ */ t.createElement(f, { variant: "h3", className: "text-light-2" }, "How many credits do you need?"), /* @__PURE__ */ t.createElement(f, { variant: "body4", className: "text-light-4" }, /* @__PURE__ */ t.createElement("span", { className: "underline" }, "Note:"), " One credit is needed to unlock a site report.", " ", r ? " Please provide your phone number to make a request" : "")), /* @__PURE__ */ t.createElement("div", { className: "mt-3" }, /* @__PURE__ */ t.createElement(
         w,
         {
           id: "creditValue",
@@ -73,7 +73,7 @@ const j = ["5", "10", "20", "50", ">50"], T = ({
           isError: !!u,
           message: u
         }
-      )), /* @__PURE__ */ t.createElement("div", { className: "flex flex-row gap-2 mt-3" }, N.map((e) => /* @__PURE__ */ t.createElement(
+      )), /* @__PURE__ */ t.createElement("div", { className: "flex flex-row gap-2 mt-3" }, E.map((e) => /* @__PURE__ */ t.createElement(
         p,
         {
           variant: y(e) ? "primary" : "secondary",
@@ -83,18 +83,18 @@ const j = ["5", "10", "20", "50", ">50"], T = ({
           onClick: () => l(e)
         },
         e
-      ))), s && /* @__PURE__ */ t.createElement("div", { className: "flex flex-col mt-4" }, /* @__PURE__ */ t.createElement(f, { className: "mb-1 text-sm font-medium text-light-2" }, "Phone Number *"), /* @__PURE__ */ t.createElement(
+      ))), r && /* @__PURE__ */ t.createElement("div", { className: "flex flex-col mt-4" }, /* @__PURE__ */ t.createElement(f, { className: "mb-1 text-sm font-medium text-light-2" }, "Phone Number *"), /* @__PURE__ */ t.createElement(
         w,
         {
           id: "phoneNumber",
           type: "text",
-          value: r,
+          value: s,
           onChange: W,
           className: "h-10",
           placeholder: "Enter phone number",
           maxLength: 10,
-          isError: !!m,
-          message: m
+          isError: !!o,
+          message: o
         }
       )))),
       footer: /* @__PURE__ */ t.createElement("div", { className: "flex w-full gap-2 justify-evenly" }, /* @__PURE__ */ t.createElement(p, { variant: "secondary", onClick: d, title: "Cancel" }), /* @__PURE__ */ t.createElement(

package/dist/index.es2.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es2.js","sources":["../src/components/ui/request-credits-view/component/request-credit-dialog.tsx"],"sourcesContent":["import React, { useState, useEffect } from 'react'\nimport { Dialog } from '@/components/organisms/dialog'\nimport { Typography } from '@/components/atoms/typography'\nimport { Button } from '@/components/atoms/button'\nimport { Input } from '@/components/atoms/input'\nimport { RequestCreditsDialogProps } from './request-credit-dialog.types'\n\nconst DefaultBuyCreditsOptions = ['5', '10', '20', '50', '>50']\n\nexport const RequestCreditsDialog: React.FC<RequestCreditsDialogProps> = ({\n  open,\n  onClose,\n  onRequestCredits,\n  onProceedToPayment,\n  dialogClassName,\n  buyCreditsOptions = DefaultBuyCreditsOptions,\n  minimumCreditsToBuy = 5,\n  requestOnly = false,\n}) => {\n  const [selectedCredit, setSelectedCredit] = useState('')\n  const [phoneNumber, setPhoneNumber] = useState('')\n  const [phoneError, setPhoneError] = useState('')\n\n  // Largest plain numeric option (e.g. 50). Anything above it is a request.\n  const numericOptions = buyCreditsOptions\n    .filter((option) => !option.startsWith('>'))\n    .map((option) => Number(option))\n  const maxCredit = numericOptions.length ? Math.max(...numericOptions) : 50\n\n  const exceedsMaxCredit =\n    selectedCredit.startsWith('>') || Number(selectedCredit) > maxCredit\n\n  const isRequestAction = requestOnly || exceedsMaxCredit\n\n  const creditError =\n    selectedCredit &&\n    !isRequestAction &&\n    Number(selectedCredit) < minimumCreditsToBuy\n      ? `Minimum number of credits is ${minimumCreditsToBuy}`\n      : ''\n\n  // Validate phone on every change\n  useEffect(() => {\n    if (isRequestAction) {\n      const error = validatePhone(phoneNumber)\n      setPhoneError(error)\n    } else {\n      setPhoneError('')\n    }\n  }, [phoneNumber, isRequestAction])\n\n  const validatePhone = (phone: string) => {\n    if (!phone) return ''\n    const numberOnly = phone.startsWith('+91') ? phone.substring(3) : phone\n    if (!/^[6-9]\\d{9}$/.test(numberOnly))\n      return 'Number should start with 6-9 and be 10 digits'\n    return ''\n  }\n\n  const handlePhoneChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const value = e.target.value.replace(/\\D/g, '') // keep only digits\n    setPhoneNumber(value)\n  }\n\n  const handleCreditChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const value = e.target.value.replace(/\\D/g, '') // keep only digits\n    setSelectedCredit(value)\n  }\n\n  const handleSubmit = () => {\n    // Only the '>50' style option appends '+'; a typed value is sent as-is\n    const credit = selectedCredit.startsWith('>')\n      ? selectedCredit.replace('>', '') + '+'\n      : selectedCredit\n    if (isRequestAction) {\n      onRequestCredits(credit, phoneNumber)\n    } else {\n      if (onProceedToPayment) {\n        onProceedToPayment(credit, phoneNumber)\n      } else {\n        onRequestCredits(credit, phoneNumber)\n      }\n    }\n    reset()\n  }\n\n  const reset = () => {\n    onClose()\n    setTimeout(() => {\n      setPhoneNumber('')\n      setPhoneError('')\n      setSelectedCredit('')\n    }, 100)\n  }\n\n  useEffect(() => {\n    if (!open) {\n      setTimeout(() => {\n        setPhoneNumber('')\n        setPhoneError('')\n        setSelectedCredit('')\n      }, 100)\n    }\n  }, [open])\n\n  const buttonText = isRequestAction\n    ? `Request ${selectedCredit}`\n    : `Proceed to Payment ${selectedCredit} `\n\n  // Button should be disabled if no credit entered, or phone is invalid for a request\n  const isButtonDisabled =\n    !selectedCredit ||\n    Number(selectedCredit) <= 0 ||\n    !!creditError ||\n    (isRequestAction && (!!phoneError || !phoneNumber))\n\n  // Highlight the '>50' style option whenever the entered value exceeds the\n  // largest buyable option; plain options match exactly.\n  const isOptionSelected = (credit: string) =>\n    credit.startsWith('>') ? exceedsMaxCredit : credit === selectedCredit\n\n  return (\n    <Dialog\n      open={open}\n      onOpenChange={reset}\n      onOpenAutoFocus={(e) => e.preventDefault()}\n      trigger={null}\n      contentClassName=\"w-min\"\n      body={\n        <div className=\"w-72 md:w-[570px] flex items-center \">\n          <div className=\"items-center justify-center\">\n            <img\n              src=\"https://frontend-static-files.geoiq.io/strapi/Group_427319313_e054593ef1/Group_427319313_e054593ef1.svg\"\n              alt=\"lock\"\n              className={dialogClassName}\n            />\n          </div>\n          <div className=\"px-4 py-2 w-72 md:w-[400px]\">\n            <div className=\"flex flex-col gap-2\">\n              <Typography variant={'h3'} className=\"text-light-2\">\n                How many credits do you need?\n              </Typography>\n              <Typography variant={'body4'} className=\"text-light-4\">\n                <span className=\"underline\">Note:</span> One credit is needed to\n                unlock a site report.{' '}\n                {isRequestAction\n                  ? ' Please provide your phone number to make a request'\n                  : ''}\n              </Typography>\n            </div>\n\n            <div className=\"mt-3\">\n              <Input\n                id=\"creditValue\"\n                type=\"text\"\n                value={selectedCredit.startsWith('>') ? '' : selectedCredit}\n                onChange={handleCreditChange}\n                className=\"h-10\"\n                placeholder=\"Enter number of credits\"\n                maxLength={6}\n                isError={!!creditError}\n                message={creditError}\n              />\n            </div>\n\n            <div className=\"flex flex-row gap-2 mt-3\">\n              {buyCreditsOptions.map((credit) => (\n                <Button\n                  variant={isOptionSelected(credit) ? 'primary' : 'secondary'}\n                  key={credit}\n                  className={\n                    isOptionSelected(credit) ? 'w-10' : 'w-10 bg-light-2'\n                  }\n                  size={'sm'}\n                  onClick={() => setSelectedCredit(credit)}\n                >\n                  {credit}\n                </Button>\n              ))}\n            </div>\n            {isRequestAction && (\n              <div className=\"flex flex-col mt-4\">\n                <Typography className=\"mb-1 text-sm font-medium text-light-2\">\n                  Phone Number *\n                </Typography>\n                <Input\n                  id=\"phoneNumber\"\n                  type=\"text\" // use text for maxLength\n                  value={phoneNumber}\n                  onChange={handlePhoneChange}\n                  className=\"h-10\"\n                  placeholder=\"Enter phone number\"\n                  maxLength={10}\n                  isError={!!phoneError}\n                  message={phoneError}\n                />\n              </div>\n            )}\n          </div>\n        </div>\n      }\n      footer={\n        <div className=\"flex w-full gap-2 justify-evenly\">\n          <Button variant=\"secondary\" onClick={reset} title={'Cancel'} />\n          <Button\n            variant=\"primary\"\n            suffixIcon={\n              <img\n                src={\n                  'https://frontend-static-files.geoiq.io/strapi/navbar_credits_247858e26a.svg'\n                }\n                width={16}\n                height={16}\n                alt=\"coin icon\"\n                className=\"ml-1 mr-2 md:mr-0\"\n              />\n            }\n            title={buttonText}\n            onClick={handleSubmit}\n            disabled={isButtonDisabled}\n          />\n        </div>\n      }\n    />\n  )\n}\n"],"names":["DefaultBuyCreditsOptions","RequestCreditsDialog","open","onClose","onRequestCredits","onProceedToPayment","dialogClassName","buyCreditsOptions","minimumCreditsToBuy","requestOnly","selectedCredit","setSelectedCredit","useState","phoneNumber","setPhoneNumber","phoneError","setPhoneError","numericOptions","option","maxCredit","exceedsMaxCredit","isRequestAction","creditError","useEffect","error","validatePhone","phone","numberOnly","handlePhoneChange","value","handleCreditChange","handleSubmit","credit","reset","buttonText","isButtonDisabled","isOptionSelected","React","Dialog","Typography","Input","Button"],"mappings":"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"}
+{"version":3,"file":"index.es2.js","sources":["../src/components/ui/request-credits-view/component/request-credit-dialog.tsx"],"sourcesContent":["import React, { useState, useEffect } from 'react'\nimport { Dialog } from '@/components/organisms/dialog'\nimport { Typography } from '@/components/atoms/typography'\nimport { Button } from '@/components/atoms/button'\nimport { Input } from '@/components/atoms/input'\nimport { RequestCreditsDialogProps } from './request-credit-dialog.types'\n\nconst DefaultBuyCreditsOptions = ['5', '10', '20', '50', '>50']\n\nexport const RequestCreditsDialog: React.FC<RequestCreditsDialogProps> = ({\n  open,\n  onClose,\n  onRequestCredits,\n  onProceedToPayment,\n  dialogClassName,\n  buyCreditsOptions = DefaultBuyCreditsOptions,\n  minimumCreditsToBuy = 5,\n  requestOnly = false,\n}) => {\n  const [selectedCredit, setSelectedCredit] = useState('')\n  const [phoneNumber, setPhoneNumber] = useState('')\n  const [phoneError, setPhoneError] = useState('')\n\n  // Largest plain numeric option (e.g. 50). Anything above it is a request.\n  const numericOptions = buyCreditsOptions    \n    .map((option) => {\n      if (option.startsWith('>')) {\n        return Number(option.replace('>', ''))\n      }\n      return Number(option)\n    })\n  const maxCredit = numericOptions.length ? Math.max(...numericOptions) : 50\n\n  const exceedsMaxCredit =\n    selectedCredit.startsWith('>') || Number(selectedCredit) > maxCredit\n\n  const isRequestAction = requestOnly || exceedsMaxCredit\n\n  const creditError =\n    selectedCredit &&\n    !isRequestAction &&\n    Number(selectedCredit) < minimumCreditsToBuy\n      ? `Minimum number of credits is ${minimumCreditsToBuy}`\n      : ''\n\n  // Validate phone on every change\n  useEffect(() => {\n    if (isRequestAction) {\n      const error = validatePhone(phoneNumber)\n      setPhoneError(error)\n    } else {\n      setPhoneError('')\n    }\n  }, [phoneNumber, isRequestAction])\n\n  const validatePhone = (phone: string) => {\n    if (!phone) return ''\n    const numberOnly = phone.startsWith('+91') ? phone.substring(3) : phone\n    if (!/^[6-9]\\d{9}$/.test(numberOnly))\n      return 'Number should start with 6-9 and be 10 digits'\n    return ''\n  }\n\n  const handlePhoneChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const value = e.target.value.replace(/\\D/g, '') // keep only digits\n    setPhoneNumber(value)\n  }\n\n  const handleCreditChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const value = e.target.value.replace(/\\D/g, '') // keep only digits\n    setSelectedCredit(value)\n  }\n\n  const handleSubmit = () => {\n    // Only the '>50' style option appends '+'; a typed value is sent as-is\n    const credit = selectedCredit.startsWith('>')\n      ? selectedCredit.replace('>', '') + '+'\n      : selectedCredit\n    if (isRequestAction) {\n      onRequestCredits(credit, phoneNumber)\n    } else {\n      if (onProceedToPayment) {\n        onProceedToPayment(credit, phoneNumber)\n      } else {\n        onRequestCredits(credit, phoneNumber)\n      }\n    }\n    reset()\n  }\n\n  const reset = () => {\n    onClose()\n    setTimeout(() => {\n      setPhoneNumber('')\n      setPhoneError('')\n      setSelectedCredit('')\n    }, 100)\n  }\n\n  useEffect(() => {\n    if (!open) {\n      setTimeout(() => {\n        setPhoneNumber('')\n        setPhoneError('')\n        setSelectedCredit('')\n      }, 100)\n    }\n  }, [open])\n\n  const buttonText = isRequestAction\n    ? `Request ${selectedCredit}`\n    : `Proceed to Payment ${selectedCredit} `\n\n  // Button should be disabled if no credit entered, or phone is invalid for a request\n  const isButtonDisabled =\n    !selectedCredit ||\n    Number(selectedCredit) <= 0 ||\n    !!creditError ||\n    (isRequestAction && (!!phoneError || !phoneNumber))\n\n  // Highlight the '>50' style option whenever the entered value exceeds the\n  // largest buyable option; plain options match exactly.\n  const isOptionSelected = (credit: string) =>\n    credit.startsWith('>') ? exceedsMaxCredit : credit === selectedCredit\n\n  return (\n    <Dialog\n      open={open}\n      onOpenChange={reset}\n      onOpenAutoFocus={(e) => e.preventDefault()}\n      trigger={null}\n      contentClassName=\"w-min\"\n      body={\n        <div className=\"w-72 md:w-[570px] flex items-center \">\n          <div className=\"items-center justify-center\">\n            <img\n              src=\"https://frontend-static-files.geoiq.io/strapi/Group_427319313_e054593ef1/Group_427319313_e054593ef1.svg\"\n              alt=\"lock\"\n              className={dialogClassName}\n            />\n          </div>\n          <div className=\"px-4 py-2 w-72 md:w-[400px]\">\n            <div className=\"flex flex-col gap-2\">\n              <Typography variant={'h3'} className=\"text-light-2\">\n                How many credits do you need?\n              </Typography>\n              <Typography variant={'body4'} className=\"text-light-4\">\n                <span className=\"underline\">Note:</span> One credit is needed to\n                unlock a site report.{' '}\n                {isRequestAction\n                  ? ' Please provide your phone number to make a request'\n                  : ''}\n              </Typography>\n            </div>\n\n            <div className=\"mt-3\">\n              <Input\n                id=\"creditValue\"\n                type=\"text\"\n                value={selectedCredit.startsWith('>') ? '' : selectedCredit}\n                onChange={handleCreditChange}\n                className=\"h-10\"\n                placeholder=\"Enter number of credits\"\n                maxLength={6}\n                isError={!!creditError}\n                message={creditError}\n              />\n            </div>\n\n            <div className=\"flex flex-row gap-2 mt-3\">\n              {buyCreditsOptions.map((credit) => (\n                <Button\n                  variant={isOptionSelected(credit) ? 'primary' : 'secondary'}\n                  key={credit}\n                  className={\n                    isOptionSelected(credit) ? 'w-10' : 'w-10 bg-light-2'\n                  }\n                  size={'sm'}\n                  onClick={() => setSelectedCredit(credit)}\n                >\n                  {credit}\n                </Button>\n              ))}\n            </div>\n            {isRequestAction && (\n              <div className=\"flex flex-col mt-4\">\n                <Typography className=\"mb-1 text-sm font-medium text-light-2\">\n                  Phone Number *\n                </Typography>\n                <Input\n                  id=\"phoneNumber\"\n                  type=\"text\" // use text for maxLength\n                  value={phoneNumber}\n                  onChange={handlePhoneChange}\n                  className=\"h-10\"\n                  placeholder=\"Enter phone number\"\n                  maxLength={10}\n                  isError={!!phoneError}\n                  message={phoneError}\n                />\n              </div>\n            )}\n          </div>\n        </div>\n      }\n      footer={\n        <div className=\"flex w-full gap-2 justify-evenly\">\n          <Button variant=\"secondary\" onClick={reset} title={'Cancel'} />\n          <Button\n            variant=\"primary\"\n            suffixIcon={\n              <img\n                src={\n                  'https://frontend-static-files.geoiq.io/strapi/navbar_credits_247858e26a.svg'\n                }\n                width={16}\n                height={16}\n                alt=\"coin icon\"\n                className=\"ml-1 mr-2 md:mr-0\"\n              />\n            }\n            title={buttonText}\n            onClick={handleSubmit}\n            disabled={isButtonDisabled}\n          />\n        </div>\n      }\n    />\n  )\n}\n"],"names":["DefaultBuyCreditsOptions","RequestCreditsDialog","open","onClose","onRequestCredits","onProceedToPayment","dialogClassName","buyCreditsOptions","minimumCreditsToBuy","requestOnly","selectedCredit","setSelectedCredit","useState","phoneNumber","setPhoneNumber","phoneError","setPhoneError","numericOptions","option","maxCredit","exceedsMaxCredit","isRequestAction","creditError","useEffect","error","validatePhone","phone","numberOnly","handlePhoneChange","value","handleCreditChange","handleSubmit","credit","reset","buttonText","isButtonDisabled","isOptionSelected","React","Dialog","Typography","Input","Button"],"mappings":"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"}

package/dist/index.es20.js

@@ -1,6 +1,6 @@
 import * as e from "react";
 import { cn as s } from "./index.es89.js";
-import { AlertVariants as v, AlertContentVariants as h, AlertButtonVariants as u } from "./index.es102.js";
+import { AlertVariants as v, AlertContentVariants as h, AlertButtonVariants as u } from "./index.es133.js";
 import { Button as _ } from "./index.es9.js";
 import { Typography as N } from "./index.es19.js";
 const n = e.forwardRef(({ className: t, ...r }, a) => /* @__PURE__ */ e.createElement(

package/dist/index.es21.js

@@ -1,9 +1,9 @@
-import { Breadcrumb as b, BreadcrumbList as h, BreadcrumbSeparator as o, BreadcrumbItem as s, BreadcrumbEllipsis as y, BreadcrumbLink as i } from "./index.es99.js";
-import { DropdownMenu as d, DropdownMenuTrigger as f, DropdownMenuContent as B, DropdownMenuItem as w } from "./index.es100.js";
+import { Breadcrumb as b, BreadcrumbList as h, BreadcrumbSeparator as o, BreadcrumbItem as s, BreadcrumbEllipsis as y, BreadcrumbLink as i } from "./index.es134.js";
+import { DropdownMenu as d, DropdownMenuTrigger as f, DropdownMenuContent as B, DropdownMenuItem as w } from "./index.es109.js";
 import e from "react";
 import { Typography as N } from "./index.es19.js";
 import { cn as D } from "./index.es89.js";
-import { CrumbVariants as k } from "./index.es101.js";
+import { CrumbVariants as k } from "./index.es135.js";
 function u({ field: t, isSelected: r }) {
   return /* @__PURE__ */ e.createElement(s, null, /* @__PURE__ */ e.createElement(
     i,

package/dist/index.es22.js

@@ -1,5 +1,5 @@
 import e from "react";
-import { DropdownMenu as g, DropdownMenuTrigger as p, DropdownMenuContent as h, DropdownMenuLabel as E, DropdownMenuSeparator as s, DropdownMenuGroup as w, DropdownMenuSub as x, DropdownMenuSubTrigger as N, DropdownMenuPortal as D, DropdownMenuSubContent as M, DropdownMenuItem as c } from "./index.es100.js";
+import { DropdownMenu as g, DropdownMenuTrigger as p, DropdownMenuContent as h, DropdownMenuLabel as E, DropdownMenuSeparator as s, DropdownMenuGroup as w, DropdownMenuSub as x, DropdownMenuSubTrigger as N, DropdownMenuPortal as D, DropdownMenuSubContent as M, DropdownMenuItem as c } from "./index.es109.js";
 function v({
   trigger: o,
   optionGroups: r,

package/dist/index.es25.js

@@ -1,7 +1,7 @@
 import { cn as s } from "./index.es89.js";
 import { useRanger as w } from "@tanstack/react-ranger";
 import e from "react";
-import { SliderBgColorVariants as a } from "./index.es103.js";
+import { SliderBgColorVariants as a } from "./index.es118.js";
 const x = ({ left: t = 0, width: o = 0, index: l = -1 }) => /* @__PURE__ */ e.createElement(
   "div",
   {

package/dist/index.es27.js

@@ -4,7 +4,7 @@ import { ChevronUp as y, ChevronDown as w, Check as k } from "lucide-react";
 import { Command as S, CommandInput as O, CommandEmpty as P, CommandGroup as R, CommandList as j, CommandItem as B } from "./index.es60.js";
 import { Popover as I, PopoverTrigger as T, PopoverContent as V } from "./index.es90.js";
 import { Button as D } from "./index.es9.js";
-import { ComboBoxStates as F } from "./index.es120.js";
+import { ComboBoxStates as F } from "./index.es103.js";
 import { Typography as m } from "./index.es19.js";
 import { cn as n } from "./index.es89.js";
 function J({

package/dist/index.es28.js

@@ -6,8 +6,8 @@ import { Button as Ae } from "./index.es9.js";
 import { Typography as w } from "./index.es19.js";
 import { Badge as Pe } from "./index.es8.js";
 import { cn as R } from "./index.es89.js";
-import { ComboBoxStates as Oe } from "./index.es120.js";
-import { interpolateUrl as Q } from "./index.es134.js";
+import { ComboBoxStates as Oe } from "./index.es103.js";
+import { interpolateUrl as Q } from "./index.es104.js";
 function Me(o) {
   const c = (a) => typeof a == "string" ? { id: a, name: a } : {
     id: String(a.id ?? a.value ?? a.email ?? a),

package/dist/index.es30.js

@@ -1,7 +1,7 @@
 import * as o from "@radix-ui/react-slider";
 import * as e from "react";
 import { cn as t } from "./index.es89.js";
-import { SliderVariants as s } from "./index.es97.js";
+import { SliderVariants as s } from "./index.es102.js";
 const n = e.forwardRef(({ className: r, id: l, ...a }, i) => (
   // <div className='bg-light-3 h-[100px] w-full flex'>
   /* @__PURE__ */ e.createElement(

package/dist/index.es32.js

@@ -1,4 +1,4 @@
-import { StepperProvider as p, StepGroup as m } from "./index.es112.js";
+import { StepperProvider as p, StepGroup as m } from "./index.es107.js";
 import * as e from "react";
 const a = ({ value: t, id: r }) => /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(p, { steps: t, id: r }, /* @__PURE__ */ e.createElement(m, null)));
 a.displayName = "Stepper";

package/dist/index.es33.js

@@ -1,7 +1,7 @@
 import * as e from "react";
 import * as i from "@radix-ui/react-tabs";
 import { cn as l } from "./index.es89.js";
-import { TabsVariants as N, TabTriggerVariants as T } from "./index.es136.js";
+import { TabsVariants as N, TabTriggerVariants as T } from "./index.es132.js";
 const f = e.forwardRef(({ className: s, variant: a, size: n, ...t }, o) => /* @__PURE__ */ e.createElement(
   i.List,
   {

package/dist/index.es45.js

@@ -1,67 +1,69 @@
-import k, { useRef as c, useState as y, useEffect as f } from "react";
-import { createRoot as I } from "./index.es115.js";
-import { ImageEditorModal as w } from "./index.es116.js";
-import { notifyNativeImageEditorState as m } from "./index.es117.js";
-import U from "./index.es118.js";
-function A(u) {
-  const s = c(u);
-  s.current = u;
-  const n = c(null), [p, v] = y(null), [d, g] = y(!1);
-  if (!n.current && typeof window < "u") {
-    const e = s.current;
-    n.current = U.create({
+import k, { useRef as s, useState as g, useEffect as u } from "react";
+import { createRoot as L } from "./index.es97.js";
+import { ImageEditorModal as I } from "./index.es98.js";
+import { notifyNativeImageEditorState as d } from "./index.es99.js";
+import w from "./index.es100.js";
+function x(r) {
+  const a = s(r);
+  a.current = r;
+  const t = s(null), [m, S] = g(null), [p, y] = g(!1);
+  if (!t.current && typeof window < "u") {
+    const e = a.current;
+    t.current = w.create({
       ...e,
       image: e.image ?? e.backgroundImage,
-      onSave: async (t, o) => {
-        const a = s.current;
-        if (a.onAssetUpload) {
-          const R = t.type === "image/jpeg" ? "jpg" : "png", E = new File([t.blob], `edit.${R}`, {
-            type: t.type
-          }), b = await a.onAssetUpload(E);
-          a.onSave({ ...t, ...b }, o);
+      onSave: async (n, c) => {
+        const l = a.current;
+        if (l.onAssetUpload) {
+          const R = n.type === "image/jpeg" ? "jpg" : "png", E = new File([n.blob], `edit.${R}`, {
+            type: n.type
+          }), b = await l.onAssetUpload(E);
+          l.onSave({ ...n, ...b }, c);
           return;
         }
-        a.onSave(t, o);
+        l.onSave(n, c);
       },
-      onUiChange: v
+      onUiChange: S
     });
   }
-  f(() => {
-    const e = n.current;
+  u(() => {
+    !t.current || !r.savedLayers || t.current.setSavedLayers(r.savedLayers);
+  }, [r.savedLayers]), u(() => {
+    const e = t.current;
     if (!e) return;
-    const t = () => {
-      g(!0), m(!0);
-    }, o = () => {
-      g(!1), m(!1);
+    const n = () => {
+      y(!0), d(!0);
+    }, c = () => {
+      y(!1), d(!1);
     };
-    return e.on("open", t), e.on("close", o), () => {
-      e.off("open", t), e.off("close", o), m(!1), e.destroy();
+    return e.on("open", n), e.on("close", c), () => {
+      e.off("open", n), e.off("close", c), d(!1), e.destroy();
     };
   }, []);
-  const l = (u.stickers ?? []).join(" "), S = c(null);
-  f(() => {
-    const e = n.current;
-    !e || S.current === l || (S.current = l, e.setStickers(u.stickers ?? []));
-  }, [l]);
-  const i = c(null), r = c(null);
-  return f(() => () => {
-    i.current?.unmount(), r.current?.remove(), i.current = null, r.current = null;
-  }, []), f(() => {
-    const e = n.current;
-    e && (r.current || (r.current = document.createElement("div"), document.body.appendChild(r.current), i.current = I(r.current)), i.current.render(
+  const f = (r.stickers ?? []).join(" "), v = s(null);
+  u(() => {
+    const e = t.current;
+    !e || v.current === f || (v.current = f, e.setStickers(r.stickers ?? []));
+  }, [f]);
+  const i = s(null), o = s(null);
+  return u(() => () => {
+    i.current?.unmount(), o.current?.remove(), i.current = null, o.current = null;
+  }, []), u(() => {
+    const e = t.current;
+    e && (o.current || (o.current = document.createElement("div"), document.body.appendChild(o.current), i.current = L(o.current)), i.current.render(
       /* @__PURE__ */ k.createElement(
-        w,
+        I,
         {
           engine: e,
-          ui: p,
-          isOpen: d,
-          saveLabel: s.current.saveLabel || "Save"
+          ui: m,
+          isOpen: p,
+          saveLabel: a.current.saveLabel || "Save"
         }
       )
     ));
-  }, [p, d]), n.current;
+  }, [m, p]), t.current;
 }
 export {
-  A as useImageEditor
+  x as useImageEditor
 };
 //# sourceMappingURL=index.es45.js.map