@bikdotai/bik-component-library 0.0.817-beta.4 → 0.0.817-beta.6

package/dist/esm/components/template-context-mapper/modalElements/EditMediaModal.js

@@ -1,16 +1,16 @@
 import { jsxDEV as e, Fragment as f } from "react/jsx-dev-runtime";
-import A from "../../../assets/icons/arrow_back.svg.js";
-import L from "../../../assets/icons/info.svg.js";
-import { useState as d, useEffect as M } from "react";
-import { Button as v } from "../../button/Button.js";
-import { BikImageCropper as T } from "../../image-cropper/BikImageCropper.js";
-import { InputWithVariables as G } from "../../input-with-vars/InputWithVariables.js";
-import { PureSpinner as O } from "../../spinner/Spinner.js";
-import { HEADER_TYPES as t } from "../../template-preview/models/TemplateMeta.js";
-import { POD as H } from "../../template-preview/models/WhatsAppTemplate.js";
-import { TitleRegular as j, TitleMedium as $, BodySecondary as Y, BodyCaption as h } from "../../TypographyStyle.js";
+import w from "../../../assets/icons/arrow_back.svg.js";
+import A from "../../../assets/icons/info.svg.js";
+import { useState as m, useEffect as k } from "react";
+import { Button as M } from "../../button/Button.js";
+import { BikImageCropper as L } from "../../image-cropper/BikImageCropper.js";
+import { InputWithVariables as T } from "../../input-with-vars/InputWithVariables.js";
+import { PureSpinner as G } from "../../spinner/Spinner.js";
+import { HEADER_TYPES as r } from "../../template-preview/models/TemplateMeta.js";
+import { POD as O } from "../../template-preview/models/WhatsAppTemplate.js";
+import { TitleRegular as H, TitleMedium as $, BodySecondary as Y, BodyCaption as y } from "../../TypographyStyle.js";
 import { validateURL as _ } from "../../../utils/validator.js";
-import { DEFAULT_THEME as m, COLORS as s } from "../../../constants/Theme.js";
+import { DEFAULT_THEME as c, COLORS as d } from "../../../constants/Theme.js";
 import q from "../../../assets/icons/file.svg.js";
 import z from "../../../assets/icons/filePdf.svg.js";
 import J from "../../../assets/icons/image.svg.js";
@@ -20,32 +20,32 @@ import { isVariable as X } from "../utils/validateIsUrl.js";
 import { PickerType as Z } from "../../variable-picker-v3/model.js";
 const xe = ({
   setOpenEditMedia: b,
-  mediaComponentFormat: n,
-  variableListForImage: k,
-  openEditMedia: D,
-  uploadMedia: y,
-  fileRef: c,
-  useEditWhatsappTemplateMediaResponse: o,
+  mediaComponentFormat: o,
+  variableListForImage: v,
+  openEditMedia: P,
+  uploadMedia: h,
+  fileRef: s,
+  useEditWhatsappTemplateMediaResponse: t,
   skipAddVariable: x
 }) => {
-  const { pod: w, setHideCrossButton: N, setHideFooterButton: E } = Q(), [U, p] = d(""), [I, V] = d(
+  const { pod: U, setHideCrossButton: N, setHideFooterButton: E } = Q(), [j, p] = m(""), [I, V] = m(
     void 0
-  ), [g, r] = d(!1), [a, B] = d("");
-  M(() => (E(!0), () => {
+  ), [g, l] = m(!1), [a, B] = m("");
+  k(() => (E(!0), () => {
     E(!1);
-  }), []), M(() => {
-    const l = document.querySelector('[class*="ModalWrapper"]');
-    l && V(l);
-  }, [o.loading]);
+  }), []), k(() => {
+    const n = document.querySelector('[class*="ModalWrapper"]');
+    n && V(n);
+  }, [t.loading]);
   let i;
-  if (n === t.IMAGE ? i = "image/png, image/jpeg" : n === t.VIDEO ? i = "video/mp4" : i = "application/pdf", !D)
+  if (o === r.IMAGE ? i = "image/png, image/jpeg" : o === r.VIDEO ? i = "video/mp4" : i = "application/pdf", !P)
     return /* @__PURE__ */ e(f, {}, void 0, !1, {
-      fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+      fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
       lineNumber: 84,
       columnNumber: 10
     }, void 0);
-  const u = () => n === t.IMAGE ? "Image" : n === t.VIDEO ? "Video" : "Document", C = () => o.loading ? "Upload in progress..." : n === t.IMAGE ? "Upload an image" : n === t.VIDEO ? "Upload a video" : "Upload a document", S = () => o.loading ? `Your ${n.toLowerCase()} is getting loaded. This may take a couple of minutes.` : n === t.IMAGE ? "JPEG/ PNG format • Max 5MB" : n === t.VIDEO ? "MP4 format video • Max 16MB" : "PDF format document • Max 100MB", P = (l) => {
-    N(!!l);
+  const u = () => o === r.IMAGE ? "Image" : o === r.VIDEO ? "Video" : "Document", C = () => t.loading ? "Upload in progress..." : o === r.IMAGE ? "Upload an image" : o === r.VIDEO ? "Upload a video" : "Upload a document", D = () => t.loading ? `Your ${o.toLowerCase()} is getting loaded. This may take a couple of minutes.` : o === r.IMAGE ? "JPEG/ PNG format • Max 5MB" : o === r.VIDEO ? "MP4 format video • Max 16MB" : "PDF format document • Max 100MB", S = (n) => {
+    N(!!n);
   };
   return /* @__PURE__ */ e(f, { children: [
     /* @__PURE__ */ e(
@@ -59,10 +59,10 @@ const xe = ({
         },
         children: [
           /* @__PURE__ */ e(
-            A,
+            w,
             {
-              onClick: (l) => {
-                l.stopPropagation(), b(!1), p("");
+              onClick: (n) => {
+                n.stopPropagation(), b(!1), p("");
               },
               style: { cursor: "pointer" },
               width: 16,
@@ -71,14 +71,14 @@ const xe = ({
             void 0,
             !1,
             {
-              fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+              fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
               lineNumber: 137,
               columnNumber: 5
             },
             void 0
           ),
-          /* @__PURE__ */ e(j, { children: "Update Media" }, void 0, !1, {
-            fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+          /* @__PURE__ */ e(H, { children: "Update Media" }, void 0, !1, {
+            fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
             lineNumber: 147,
             columnNumber: 5
           }, void 0)
@@ -87,7 +87,7 @@ const xe = ({
       void 0,
       !0,
       {
-        fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+        fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
         lineNumber: 129,
         columnNumber: 4
       },
@@ -100,12 +100,12 @@ const xe = ({
           position: "relative",
           padding: 16,
           borderRadius: 4,
-          border: g ? `1px dashed ${m.colorsV2.stroke.negative.vibrant}` : `1px dashed ${m.colorsV2.stroke.primary}`,
-          backgroundColor: m.colorsV2.surface.subdued,
+          border: g ? `1px dashed ${c.colorsV2.stroke.negative.vibrant}` : `1px dashed ${c.colorsV2.stroke.primary}`,
+          backgroundColor: c.colorsV2.surface.subdued,
           width: "100%",
           height: "100%",
           alignItems: "center",
-          display: o.loading ? "flex" : "initial"
+          display: t.loading ? "flex" : "initial"
         },
         children: [
           /* @__PURE__ */ e(
@@ -120,17 +120,17 @@ const xe = ({
                 gap: 16
               },
               children: [
-                o.loading ? /* @__PURE__ */ e(
-                  O,
+                t.loading ? /* @__PURE__ */ e(
+                  G,
                   {
                     width: "40px",
                     height: "40px",
-                    color: s.content.brand
+                    color: d.content.brand
                   },
                   void 0,
                   !1,
                   {
-                    fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+                    fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
                     lineNumber: 177,
                     columnNumber: 7
                   },
@@ -145,18 +145,18 @@ const xe = ({
                       display: "flex",
                       alignItems: "center",
                       justifyContent: "center",
-                      backgroundColor: m.colorsV2.background.base
+                      backgroundColor: c.colorsV2.background.base
                     },
-                    children: n === t.IMAGE ? /* @__PURE__ */ e(J, { width: 40, height: 40 }, void 0, !1, {
-                      fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+                    children: o === r.IMAGE ? /* @__PURE__ */ e(J, { width: 40, height: 40 }, void 0, !1, {
+                      fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
                       lineNumber: 195,
                       columnNumber: 9
-                    }, void 0) : n === t.VIDEO ? /* @__PURE__ */ e(q, { width: 40, height: 40 }, void 0, !1, {
-                      fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+                    }, void 0) : o === r.VIDEO ? /* @__PURE__ */ e(q, { width: 40, height: 40 }, void 0, !1, {
+                      fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
                       lineNumber: 197,
                       columnNumber: 9
                     }, void 0) : /* @__PURE__ */ e(z, { width: 40, height: 40 }, void 0, !1, {
-                      fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+                      fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
                       lineNumber: 199,
                       columnNumber: 9
                     }, void 0)
@@ -164,19 +164,19 @@ const xe = ({
                   void 0,
                   !1,
                   {
-                    fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+                    fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
                     lineNumber: 183,
                     columnNumber: 7
                   },
                   void 0
                 ),
                 /* @__PURE__ */ e($, { children: C() }, void 0, !1, {
-                  fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+                  fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
                   lineNumber: 203,
                   columnNumber: 6
                 }, void 0),
-                /* @__PURE__ */ e(Y, { color: s.content.secondary, children: S() }, void 0, !1, {
-                  fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+                /* @__PURE__ */ e(Y, { color: d.content.secondary, children: D() }, void 0, !1, {
+                  fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
                   lineNumber: 204,
                   columnNumber: 6
                 }, void 0)
@@ -185,41 +185,41 @@ const xe = ({
             void 0,
             !0,
             {
-              fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+              fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
               lineNumber: 166,
               columnNumber: 5
             },
             void 0
           ),
-          !o.loading && /* @__PURE__ */ e(f, { children: [
+          !t.loading && /* @__PURE__ */ e(f, { children: [
             /* @__PURE__ */ e(
               "div",
               {
                 style: { display: "flex", flexDirection: "column", gap: "6px" },
                 children: /* @__PURE__ */ e(
-                  G,
+                  T,
                   {
                     labelText: `${u()} URL`,
-                    onPickerToggle: P,
+                    onPickerToggle: S,
                     pickerType: Z.EMBEDDED,
                     portalElement: I ?? document.body,
                     noMaxCharCheck: !0,
                     allowMix: !1,
-                    onChange: (l) => {
-                      B(l.actualValue), r(!1);
+                    onChange: (n) => {
+                      B(n.actualValue), l(!1);
                     },
                     showVarHeader: !0,
                     varHeaderText: "Select variable",
-                    errorMessage: U,
+                    errorMessage: j,
                     prevVariable: { actualValue: "", variableType: "string" },
-                    variablesList: k,
+                    variablesList: v,
                     placeHolder: x ? "Enter URL" : "Enter URL/Add variable",
-                    showAddButton: w === H.CAMPAIGN ? !x && n === t.IMAGE : !0
+                    showAddButton: U === O.CAMPAIGN ? !x && o === r.IMAGE : !0
                   },
                   void 0,
                   !1,
                   {
-                    fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+                    fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
                     lineNumber: 213,
                     columnNumber: 8
                   },
@@ -229,7 +229,7 @@ const xe = ({
               void 0,
               !1,
               {
-                fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+                fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
                 lineNumber: 210,
                 columnNumber: 7
               },
@@ -254,14 +254,14 @@ const xe = ({
                     void 0,
                     !1,
                     {
-                      fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+                      fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
                       lineNumber: 249,
                       columnNumber: 8
                     },
                     void 0
                   ),
-                  /* @__PURE__ */ e(h, { children: "Or upload media from device" }, void 0, !1, {
-                    fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+                  /* @__PURE__ */ e(y, { children: "Or upload media from device" }, void 0, !1, {
+                    fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
                     lineNumber: 252,
                     columnNumber: 8
                   }, void 0),
@@ -273,7 +273,7 @@ const xe = ({
                     void 0,
                     !1,
                     {
-                      fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+                      fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
                       lineNumber: 253,
                       columnNumber: 8
                     },
@@ -284,39 +284,39 @@ const xe = ({
               void 0,
               !0,
               {
-                fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+                fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
                 lineNumber: 240,
                 columnNumber: 7
               },
               void 0
             ),
             /* @__PURE__ */ e("div", { style: { display: "flex", width: "100%" }, children: /* @__PURE__ */ e(
-              v,
+              M,
               {
                 matchParentWidth: !0,
                 buttonText: "Upload",
                 buttonType: "dashBold",
                 LeadingIcon: K,
                 onClick: () => {
-                  y(), r(!1);
+                  h(), l(!1);
                 },
                 size: "medium"
               },
               void 0,
               !1,
               {
-                fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+                fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
                 lineNumber: 258,
                 columnNumber: 8
               },
               void 0
             ) }, void 0, !1, {
-              fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+              fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
               lineNumber: 257,
               columnNumber: 7
             }, void 0)
           ] }, void 0, !0, {
-            fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+            fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
             lineNumber: 209,
             columnNumber: 6
           }, void 0),
@@ -332,13 +332,13 @@ const xe = ({
                 gap: 4
               },
               children: [
-                /* @__PURE__ */ e(L, { width: 16, height: 16, color: s.content.negative }, void 0, !1, {
-                  fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+                /* @__PURE__ */ e(A, { width: 16, height: 16, color: d.content.negative }, void 0, !1, {
+                  fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
                   lineNumber: 283,
                   columnNumber: 7
                 }, void 0),
-                /* @__PURE__ */ e(h, { style: { color: s.content.negative }, children: `Select ${u()}` }, void 0, !1, {
-                  fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+                /* @__PURE__ */ e(y, { style: { color: d.content.negative }, children: `Select ${u()}` }, void 0, !1, {
+                  fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
                   lineNumber: 284,
                   columnNumber: 7
                 }, void 0)
@@ -347,7 +347,7 @@ const xe = ({
             void 0,
             !0,
             {
-              fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+              fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
               lineNumber: 273,
               columnNumber: 6
             },
@@ -358,36 +358,36 @@ const xe = ({
       void 0,
       !0,
       {
-        fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+        fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
         lineNumber: 149,
         columnNumber: 4
       },
       void 0
     ),
-    !o.loading && /* @__PURE__ */ e(
+    !t.loading && /* @__PURE__ */ e(
       "div",
       {
         style: { display: "flex", justifyContent: "flex-end", marginTop: 8 },
         children: /* @__PURE__ */ e(
-          v,
+          M,
           {
             buttonText: `Add ${u()}`,
             onClick: () => {
               if (!a) {
-                r(!0);
+                l(!0);
                 return;
               }
               if (!_(a) && !X(a)) {
                 p("Enter valid URL");
                 return;
               }
-              y(a), b(!1), p(""), r(!1);
+              h(a), b(!1), p(""), l(!1);
             }
           },
           void 0,
           !1,
           {
-            fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+            fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
             lineNumber: 295,
             columnNumber: 6
           },
@@ -397,7 +397,7 @@ const xe = ({
       void 0,
       !1,
       {
-        fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+        fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
         lineNumber: 292,
         columnNumber: 5
       },
@@ -406,42 +406,42 @@ const xe = ({
     /* @__PURE__ */ e(
       "input",
       {
-        ref: c,
+        ref: s,
         style: { display: "none" },
         type: "file",
-        onChange: o.handleImageUpload,
+        onChange: t.handleImageUpload,
         accept: i
       },
       void 0,
       !1,
       {
-        fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+        fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
         lineNumber: 316,
         columnNumber: 4
       },
       void 0
     ),
-    !!o.selectedImage && /* @__PURE__ */ e(
-      T,
+    !!t.selectedImage && /* @__PURE__ */ e(
+      L,
       {
         aspectRatio: 15 / 8,
-        src: o.selectedImage,
-        onCropComplete: o.onCropComplete,
+        src: t.selectedImage,
+        onCropComplete: t.onCropComplete,
         onCancel: () => {
-          o.setLoading(!1), o.setSelectedImage(""), c.current && (c.current.value = "");
+          t.setLoading(!1), t.setSelectedImage(""), s.current && (s.current.value = "");
         }
       },
       void 0,
       !1,
       {
-        fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+        fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
         lineNumber: 324,
         columnNumber: 5
       },
       void 0
     )
   ] }, void 0, !0, {
-    fileName: "/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
+    fileName: "/Users/prateekchouhan/Projects/bik-component-library/src/components/template-context-mapper/modalElements/EditMediaModal.tsx",
     lineNumber: 128,
     columnNumber: 3
   }, void 0);