@bikdotai/bik-component-library 0.0.419-beta.11 → 0.0.419-beta.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,4 @@
1
- import { SVGProps } from "react";
1
+ import { SVGProps } from 'react';
2
2
  export type Icon = React.FC<SVGProps<SVGSVGElement> & {
3
3
  color?: string;
4
4
  width?: string | number;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  export declare const Menus: ({
3
2
  displayName: string;
4
3
  key: number;
@@ -31,5 +31,13 @@ export interface TemplateContextMapperProps {
31
31
  disableEditVariable?: boolean;
32
32
  pod?: POD;
33
33
  extras?: ExtrasWhatsapp;
34
+ isProductCarouselTemplate?: boolean;
35
+ pickerConf?: {
36
+ searchInCollection: any;
37
+ searchProducts: any;
38
+ fetchCollections: any;
39
+ fetchProducts: any;
40
+ storeId: string;
41
+ };
34
42
  }
35
- export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList, discountCode, setDiscountCode, onBackPress, enabledCustomText, variableListForImage, showSampleValues, disableEditVariable, pod, extras, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;
43
+ export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList, discountCode, setDiscountCode, onBackPress, enabledCustomText, variableListForImage, showSampleValues, disableEditVariable, pod, extras, isProductCarouselTemplate, pickerConf, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("react"),t=require("../../utils/StringUtils.js"),a=require("../modals/styledModal.js"),o=require("../template-preview/models/Channels.js"),s=require("./context/templateModalContext.js"),i=require("./modalElements/Footer.js"),n=require("./modalElements/TemplateSelectModalContent.js"),r=require("./utils/convertPlaceholdersToBikDropdown.js");exports.TemplateContextMapper=d=>{let{selectedTemplate:c,closeDialog:u,showVariableMapping:p,channel:m,htmlContent:h,templateVariables:v,onTemplateSelect:C,globalPlaceholders:g,showOnlyContent:S,whatsappSpecificPickerMeta:b,zIndex:E,showVariableModal:T,variableList:x,discountCode:P,setDiscountCode:j,onBackPress:L,enabledCustomText:M,variableListForImage:A,showSampleValues:w,disableEditVariable:f,pod:y,extras:N}=d;var V,I,q,H,O,_;l.useEffect((()=>{Y(h)}),[h]);const k=m===o.CHANNEL_TYPE.WHATSAPP&&"CAROUSEL"===(null===(I=null===(V=c.components)||void 0===V?void 0:V[1])||void 0===I?void 0:I.type);console.log("isWhatsappCarousel: ",k),console.log("channel: ",m),console.log("is carousel: ","CAROUSEL"===(null===(H=null===(q=c.components)||void 0===q?void 0:q[1])||void 0===H?void 0:H.type)),console.log("selectedTemplate: ",c.components);const[D,F]=l.useState(m===o.CHANNEL_TYPE.EMAIL||k?"desktop":"mobile"),[W,Y]=l.useState(h),[B,z]=l.useState(!1),[U,R]=l.useState(c),[$,G]=l.useState(null!=v?v:[]),[J,K]=l.useState(!1),[Q,X]=l.useState(-1);const Z=l.useMemo((()=>r.convertPlaceholdersToBikDropdown(g)),[g]);return e.jsx(s.TemplateModalContext.Provider,Object.assign({value:{template:U,setTemplate:R,device:D,setDevice:F,display_content:W,setDisplayContent:Y,originalVariableList:$,setOriginalVariableList:G,isError:B,setIsError:z,channel:m,globalNormalizedPlaceholders:Z,templateSelectionTriggered:J,setTemplateSelectionTriggered:K,enabledCustomText:M,disableEditVariable:f,pod:y,extras:N,isWhatsappCarousel:k,selectedCarouselIndex:Q,setSelectedCarouselIndex:X}},{children:S?e.jsx(n.default,{channel:o.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(a.StyledModal,Object.assign({zIndex:E,centralContainerStyles:{width:k?900:m===o.CHANNEL_TYPE.EMAIL&&p?1e3:800},open:!0,onClose:()=>{null==u||u()},headingTitle:null==U?void 0:U.label,headingSubtitle:m===o.CHANNEL_TYPE.WHATSAPP?`${t.default.capitaliseFirstLetterOfString(null!==(O=null==U?void 0:U.category)&&void 0!==O?O:"")} • ${null!==(_=null==U?void 0:U.templateCategory)&&void 0!==_?_:""}`:"",onBackPress:()=>{null==L||L()}},{children:[e.jsx(n.default,{showSampleValues:w,showVariableMapping:p,channel:m,whatsappSpecificPickerMeta:b,showVariableModal:T,variableList:x,discountCode:P,setDiscountCode:j,variableListForImage:A&&(null==A?void 0:A.length)>0?A:x}),C?e.jsx(i.default,{isWhatsappCarousel:null!=k&&k,onSelect:function(){const e=null==C?void 0:C(U,$,null!=W?W:"");e?z(!!e):K(!0)}}):e.jsx(e.Fragment,{})]}))}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("react"),t=require("../../utils/StringUtils.js"),a=require("../modals/styledModal.js"),o=require("../template-preview/models/Channels.js"),s=require("./context/templateModalContext.js"),i=require("./modalElements/Footer.js"),n=require("./modalElements/TemplateSelectModalContent.js"),r=require("./utils/convertPlaceholdersToBikDropdown.js");exports.TemplateContextMapper=d=>{let{selectedTemplate:c,closeDialog:u,showVariableMapping:p,channel:m,htmlContent:C,templateVariables:h,onTemplateSelect:v,globalPlaceholders:g,showOnlyContent:S,whatsappSpecificPickerMeta:b,zIndex:T,showVariableModal:E,variableList:x,discountCode:P,setDiscountCode:j,onBackPress:L,enabledCustomText:M,variableListForImage:A,showSampleValues:f,disableEditVariable:w,pod:y,extras:N,isProductCarouselTemplate:V,pickerConf:I}=d;var k,q,H,O,_,D;l.useEffect((()=>{z(C)}),[C]);const F=m===o.CHANNEL_TYPE.WHATSAPP&&"CAROUSEL"===(null===(q=null===(k=c.components)||void 0===k?void 0:k[1])||void 0===q?void 0:q.type);console.log("isWhatsappCarousel: ",F),console.log("channel: ",m),console.log("is carousel: ","CAROUSEL"===(null===(O=null===(H=c.components)||void 0===H?void 0:H[1])||void 0===O?void 0:O.type)),console.log("selectedTemplate: ",c.components);const[W,Y]=l.useState(m===o.CHANNEL_TYPE.EMAIL||F?"desktop":"mobile"),[B,z]=l.useState(C),[U,R]=l.useState(!1),[$,G]=l.useState(c),[J,K]=l.useState(null!=h?h:[]),[Q,X]=l.useState(!1),[Z,ee]=l.useState(-1);const le=l.useMemo((()=>r.convertPlaceholdersToBikDropdown(g)),[g]);return e.jsx(s.TemplateModalContext.Provider,Object.assign({value:{template:$,setTemplate:G,device:W,setDevice:Y,display_content:B,setDisplayContent:z,originalVariableList:J,setOriginalVariableList:K,isError:U,setIsError:R,channel:m,globalNormalizedPlaceholders:le,templateSelectionTriggered:Q,setTemplateSelectionTriggered:X,enabledCustomText:M,disableEditVariable:w,pod:y,extras:N,isWhatsappCarousel:F,selectedCarouselIndex:Z,setSelectedCarouselIndex:ee,isProductCarouselTemplate:V,pickerConf:I}},{children:S?e.jsx(n.default,{channel:o.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(a.StyledModal,Object.assign({zIndex:T,centralContainerStyles:{width:F?900:m===o.CHANNEL_TYPE.EMAIL&&p?1e3:800},open:!0,onClose:()=>{null==u||u()},headingTitle:null==$?void 0:$.label,headingSubtitle:m===o.CHANNEL_TYPE.WHATSAPP?`${t.default.capitaliseFirstLetterOfString(null!==(_=null==$?void 0:$.category)&&void 0!==_?_:"")} • ${null!==(D=null==$?void 0:$.templateCategory)&&void 0!==D?D:""}`:"",onBackPress:()=>{null==L||L()}},{children:[e.jsx(n.default,{showSampleValues:f,showVariableMapping:p,channel:m,whatsappSpecificPickerMeta:b,showVariableModal:E,variableList:x,discountCode:P,setDiscountCode:j,variableListForImage:A&&(null==A?void 0:A.length)>0?A:x}),v?e.jsx(i.default,{isWhatsappCarousel:null!=F&&F,onSelect:function(){const e=null==v?void 0:v($,J,null!=B?B:"");e?R(!!e):X(!0)}}):e.jsx(e.Fragment,{})]}))}))};
@@ -29,6 +29,14 @@ export declare const TemplateModalContext: React.Context<{
29
29
  isWhatsappCarousel?: boolean | undefined;
30
30
  selectedCarouselIndex?: number | undefined;
31
31
  setSelectedCarouselIndex?: React.Dispatch<React.SetStateAction<number>> | undefined;
32
+ isProductCarouselTemplate?: boolean | undefined;
33
+ pickerConf?: {
34
+ searchInCollection: any;
35
+ searchProducts: any;
36
+ fetchCollections: any;
37
+ fetchProducts: any;
38
+ storeId: string;
39
+ } | undefined;
32
40
  }>;
33
41
  export declare const useTemplateModalContext: () => {
34
42
  device: DEVICE_TYPES;
@@ -53,4 +61,12 @@ export declare const useTemplateModalContext: () => {
53
61
  isWhatsappCarousel?: boolean | undefined;
54
62
  selectedCarouselIndex?: number | undefined;
55
63
  setSelectedCarouselIndex?: React.Dispatch<React.SetStateAction<number>> | undefined;
64
+ isProductCarouselTemplate?: boolean | undefined;
65
+ pickerConf?: {
66
+ searchInCollection: any;
67
+ searchProducts: any;
68
+ fetchCollections: any;
69
+ fetchProducts: any;
70
+ storeId: string;
71
+ } | undefined;
56
72
  };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),a=require("../context/templateModalContext.js"),s=require("./EditWhatsAppTemplateV2.js"),r=require("../../TypographyStyle.js");exports.default=i=>{let{template:l,whatsappSpecificPickerMeta:o,showVariableModal:p,variableList:u,variableListForImage:d,discountCode:c,setDiscountCode:n}=i;const{selectedCarouselIndex:m,setTemplate:C}=a.useTemplateModalContext(),[x,M]=t.useState(-1==m?"First Message (Step 1/2)":"Carousel Cards (Step 2/2)");return t.useEffect((()=>{M(-1==m?"First Message (Step 1/2)":"Carousel Cards (Step 2/2)")}),[m]),e.jsxs("div",{children:[e.jsx(r.TitleMedium,Object.assign({style:{marginLeft:10,marginBottom:10}},{children:x})),e.jsx(s.default,{whatsappSpecificPickerMeta:o,template:l,onTemplateChange:e=>{null==C||C(e)},showVariableModal:p,variableList:u,variableListForImage:d,discountCode:c,setDiscountCode:n})]})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/PlusIcon.js"),s=require("react"),i=require("../../button/Button.js"),o=require("../../product-picker-v2/modal.js"),r=require("../context/templateModalContext.js"),a=require("./EditWhatsAppTemplateV2.js"),n=require("../../TypographyStyle.js");exports.default=l=>{let{template:d,whatsappSpecificPickerMeta:c,showVariableModal:u,variableList:p,variableListForImage:m,discountCode:h,setDiscountCode:g}=l;const{selectedCarouselIndex:f,setTemplate:y,pickerConf:x,isProductCarouselTemplate:j}=r.useTemplateModalContext(),[b,v]=s.useState(-1==f?"First Message (Step 1/2)":"Carousel Cards (Step 2/2)"),[C,I]=s.useState(!1),[O,k]=s.useState([]);s.useEffect((()=>{v(-1==f?"First Message (Step 1/2)":"Carousel Cards (Step 2/2)")}),[f]);return e.jsxs("div",{children:[e.jsx(n.TitleMedium,Object.assign({style:{marginLeft:10,marginBottom:10}},{children:b})),j&&e.jsxs("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:12,marginRight:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[e.jsx(i.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12},size:"medium",buttonText:"Add Product(s)",buttonType:"dashBold",LeadingIcon:t.default,onClick:e=>{I(!0)}}),e.jsxs("div",Object.assign({style:{display:"flex",flex:1,alignItems:"center",justifyContent:"space-between",flexDirection:"row",width:"100%"}},{children:[e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginRight:8}}),e.jsx(n.BodyCaption,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8}})]})),e.jsx(i.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%"},size:"medium",buttonText:"Add Product(s) Variable",buttonType:"dashBold",LeadingIcon:t.default,onClick:e=>{}})]})),e.jsx(a.default,{whatsappSpecificPickerMeta:c,template:d,onTemplateChange:e=>{null==y||y(e)},showVariableModal:u,variableList:p,variableListForImage:m,discountCode:h,setDiscountCode:g}),C&&x&&e.jsx(o.ProductPickerModal,{zIndex:200,limit:1,storeId:x.storeId,selectedItems:(e=>{if(e.length>0){const t={};for(const s of e){const e=null==s?void 0:s.collectionId,i=s.productId,o=s.variantId;e in t||(t[e]={products:{},name:"",image:"",isSmartCollection:!1}),i in t[e].products||(t[e].products[i]={variants:{},name:(null==s?void 0:s.productName)||"",image:(null==s?void 0:s.productImage)||""}),t[e].products[i].variants[o]={name:(null==s?void 0:s.name)||"",price:"",image:(null==s?void 0:s.image)||"",quantity:s.quantity||0,displayOrder:s.displayOrder}}return t}return{}})(O),collectionFetcher:x.fetchCollections,productFetcher:x.fetchProducts,onAdd:(e,t)=>{const s=[];delete e.isCustom;for(const t of Object.keys(e)){const i=e[t].products;if(void 0!==i&&Object.keys(i).length)for(const e of Object.keys(i)){const o=i[e].variants;if(void 0!==o&&Object.keys(o).length)for(const r of Object.keys(o)){const{name:a,image:n,quantity:l,displayOrder:d}=o[r],c={name:a,image:n,quantity:l,variantId:r,productId:e,displayOrder:d,collectionId:t,productName:i[e].name,productImage:i[e].image};s.push(c)}}}const i=s.sort(((e,t)=>e.displayOrder-t.displayOrder));k(i)},searchInCollectionFetcher:x.searchInCollection,searchFetcher:x.searchProducts,visible:C,onClose:()=>{I(!1)}})]})};
@@ -1,4 +1,4 @@
1
- import { SVGProps } from "react";
1
+ import { SVGProps } from 'react';
2
2
  export type Icon = React.FC<SVGProps<SVGSVGElement> & {
3
3
  color?: string;
4
4
  width?: string | number;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  export declare const Menus: ({
3
2
  displayName: string;
4
3
  key: number;
@@ -31,5 +31,13 @@ export interface TemplateContextMapperProps {
31
31
  disableEditVariable?: boolean;
32
32
  pod?: POD;
33
33
  extras?: ExtrasWhatsapp;
34
+ isProductCarouselTemplate?: boolean;
35
+ pickerConf?: {
36
+ searchInCollection: any;
37
+ searchProducts: any;
38
+ fetchCollections: any;
39
+ fetchProducts: any;
40
+ storeId: string;
41
+ };
34
42
  }
35
- export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList, discountCode, setDiscountCode, onBackPress, enabledCustomText, variableListForImage, showSampleValues, disableEditVariable, pod, extras, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;
43
+ export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList, discountCode, setDiscountCode, onBackPress, enabledCustomText, variableListForImage, showSampleValues, disableEditVariable, pod, extras, isProductCarouselTemplate, pickerConf, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;
@@ -1 +1 @@
1
- import{jsx as e,jsxs as l,Fragment as o}from"react/jsx-runtime";import{useEffect as t,useState as a,useMemo as i}from"react";import s from"../../utils/StringUtils.js";import{StyledModal as n}from"../modals/styledModal.js";import{CHANNEL_TYPE as r}from"../template-preview/models/Channels.js";import{TemplateModalContext as d}from"./context/templateModalContext.js";import c from"./modalElements/Footer.js";import p from"./modalElements/TemplateSelectModalContent.js";import{convertPlaceholdersToBikDropdown as m}from"./utils/convertPlaceholdersToBikDropdown.js";const u=u=>{let{selectedTemplate:h,closeDialog:g,showVariableMapping:v,channel:b,htmlContent:C,templateVariables:S,onTemplateSelect:T,globalPlaceholders:f,showOnlyContent:w,whatsappSpecificPickerMeta:x,zIndex:L,showVariableModal:M,variableList:P,discountCode:E,setDiscountCode:V,onBackPress:j,enabledCustomText:I,variableListForImage:y,showSampleValues:A,disableEditVariable:O,pod:k,extras:D}=u;var W,F,z,B,H,U;t((()=>{q(C)}),[C]);const R=b===r.WHATSAPP&&"CAROUSEL"===(null===(F=null===(W=h.components)||void 0===W?void 0:W[1])||void 0===F?void 0:F.type);console.log("isWhatsappCarousel: ",R),console.log("channel: ",b),console.log("is carousel: ","CAROUSEL"===(null===(B=null===(z=h.components)||void 0===z?void 0:z[1])||void 0===B?void 0:B.type)),console.log("selectedTemplate: ",h.components);const[$,N]=a(b===r.EMAIL||R?"desktop":"mobile"),[_,q]=a(C),[G,J]=a(!1),[K,Q]=a(h),[X,Y]=a(null!=S?S:[]),[Z,ee]=a(!1),[le,oe]=a(-1);const te=i((()=>m(f)),[f]);return e(d.Provider,Object.assign({value:{template:K,setTemplate:Q,device:$,setDevice:N,display_content:_,setDisplayContent:q,originalVariableList:X,setOriginalVariableList:Y,isError:G,setIsError:J,channel:b,globalNormalizedPlaceholders:te,templateSelectionTriggered:Z,setTemplateSelectionTriggered:ee,enabledCustomText:I,disableEditVariable:O,pod:k,extras:D,isWhatsappCarousel:R,selectedCarouselIndex:le,setSelectedCarouselIndex:oe}},{children:w?e(p,{channel:r.EMAIL,hideHeader:!0}):l(n,Object.assign({zIndex:L,centralContainerStyles:{width:R?900:b===r.EMAIL&&v?1e3:800},open:!0,onClose:()=>{null==g||g()},headingTitle:null==K?void 0:K.label,headingSubtitle:b===r.WHATSAPP?`${s.capitaliseFirstLetterOfString(null!==(H=null==K?void 0:K.category)&&void 0!==H?H:"")} • ${null!==(U=null==K?void 0:K.templateCategory)&&void 0!==U?U:""}`:"",onBackPress:()=>{null==j||j()}},{children:[e(p,{showSampleValues:A,showVariableMapping:v,channel:b,whatsappSpecificPickerMeta:x,showVariableModal:M,variableList:P,discountCode:E,setDiscountCode:V,variableListForImage:y&&(null==y?void 0:y.length)>0?y:P}),T?e(c,{isWhatsappCarousel:null!=R&&R,onSelect:function(){const e=null==T?void 0:T(K,X,null!=_?_:"");e?J(!!e):ee(!0)}}):e(o,{})]}))}))};export{u as TemplateContextMapper};
1
+ import{jsx as e,jsxs as l,Fragment as o}from"react/jsx-runtime";import{useEffect as t,useState as a,useMemo as i}from"react";import s from"../../utils/StringUtils.js";import{StyledModal as n}from"../modals/styledModal.js";import{CHANNEL_TYPE as r}from"../template-preview/models/Channels.js";import{TemplateModalContext as d}from"./context/templateModalContext.js";import c from"./modalElements/Footer.js";import p from"./modalElements/TemplateSelectModalContent.js";import{convertPlaceholdersToBikDropdown as m}from"./utils/convertPlaceholdersToBikDropdown.js";const u=u=>{let{selectedTemplate:h,closeDialog:g,showVariableMapping:v,channel:C,htmlContent:b,templateVariables:S,onTemplateSelect:T,globalPlaceholders:f,showOnlyContent:P,whatsappSpecificPickerMeta:w,zIndex:x,showVariableModal:L,variableList:M,discountCode:E,setDiscountCode:V,onBackPress:j,enabledCustomText:I,variableListForImage:y,showSampleValues:A,disableEditVariable:k,pod:O,extras:D,isProductCarouselTemplate:W,pickerConf:F}=u;var z,B,H,U,R,$;t((()=>{J(b)}),[b]);const N=C===r.WHATSAPP&&"CAROUSEL"===(null===(B=null===(z=h.components)||void 0===z?void 0:z[1])||void 0===B?void 0:B.type);console.log("isWhatsappCarousel: ",N),console.log("channel: ",C),console.log("is carousel: ","CAROUSEL"===(null===(U=null===(H=h.components)||void 0===H?void 0:H[1])||void 0===U?void 0:U.type)),console.log("selectedTemplate: ",h.components);const[_,q]=a(C===r.EMAIL||N?"desktop":"mobile"),[G,J]=a(b),[K,Q]=a(!1),[X,Y]=a(h),[Z,ee]=a(null!=S?S:[]),[le,oe]=a(!1),[te,ae]=a(-1);const ie=i((()=>m(f)),[f]);return e(d.Provider,Object.assign({value:{template:X,setTemplate:Y,device:_,setDevice:q,display_content:G,setDisplayContent:J,originalVariableList:Z,setOriginalVariableList:ee,isError:K,setIsError:Q,channel:C,globalNormalizedPlaceholders:ie,templateSelectionTriggered:le,setTemplateSelectionTriggered:oe,enabledCustomText:I,disableEditVariable:k,pod:O,extras:D,isWhatsappCarousel:N,selectedCarouselIndex:te,setSelectedCarouselIndex:ae,isProductCarouselTemplate:W,pickerConf:F}},{children:P?e(p,{channel:r.EMAIL,hideHeader:!0}):l(n,Object.assign({zIndex:x,centralContainerStyles:{width:N?900:C===r.EMAIL&&v?1e3:800},open:!0,onClose:()=>{null==g||g()},headingTitle:null==X?void 0:X.label,headingSubtitle:C===r.WHATSAPP?`${s.capitaliseFirstLetterOfString(null!==(R=null==X?void 0:X.category)&&void 0!==R?R:"")} • ${null!==($=null==X?void 0:X.templateCategory)&&void 0!==$?$:""}`:"",onBackPress:()=>{null==j||j()}},{children:[e(p,{showSampleValues:A,showVariableMapping:v,channel:C,whatsappSpecificPickerMeta:w,showVariableModal:L,variableList:M,discountCode:E,setDiscountCode:V,variableListForImage:y&&(null==y?void 0:y.length)>0?y:M}),T?e(c,{isWhatsappCarousel:null!=N&&N,onSelect:function(){const e=null==T?void 0:T(X,Z,null!=G?G:"");e?Q(!!e):oe(!0)}}):e(o,{})]}))}))};export{u as TemplateContextMapper};
@@ -29,6 +29,14 @@ export declare const TemplateModalContext: React.Context<{
29
29
  isWhatsappCarousel?: boolean | undefined;
30
30
  selectedCarouselIndex?: number | undefined;
31
31
  setSelectedCarouselIndex?: React.Dispatch<React.SetStateAction<number>> | undefined;
32
+ isProductCarouselTemplate?: boolean | undefined;
33
+ pickerConf?: {
34
+ searchInCollection: any;
35
+ searchProducts: any;
36
+ fetchCollections: any;
37
+ fetchProducts: any;
38
+ storeId: string;
39
+ } | undefined;
32
40
  }>;
33
41
  export declare const useTemplateModalContext: () => {
34
42
  device: DEVICE_TYPES;
@@ -53,4 +61,12 @@ export declare const useTemplateModalContext: () => {
53
61
  isWhatsappCarousel?: boolean | undefined;
54
62
  selectedCarouselIndex?: number | undefined;
55
63
  setSelectedCarouselIndex?: React.Dispatch<React.SetStateAction<number>> | undefined;
64
+ isProductCarouselTemplate?: boolean | undefined;
65
+ pickerConf?: {
66
+ searchInCollection: any;
67
+ searchProducts: any;
68
+ fetchCollections: any;
69
+ fetchProducts: any;
70
+ storeId: string;
71
+ } | undefined;
56
72
  };
@@ -1 +1 @@
1
- import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as a,useEffect as r}from"react";import{useTemplateModalContext as s}from"../context/templateModalContext.js";import o from"./EditWhatsAppTemplateV2.js";import{TitleMedium as i}from"../../TypographyStyle.js";const l=l=>{let{template:p,whatsappSpecificPickerMeta:m,showVariableModal:c,variableList:n,variableListForImage:d,discountCode:u,setDiscountCode:C}=l;const{selectedCarouselIndex:f,setTemplate:g}=s(),[h,b]=a(-1==f?"First Message (Step 1/2)":"Carousel Cards (Step 2/2)");return r((()=>{b(-1==f?"First Message (Step 1/2)":"Carousel Cards (Step 2/2)")}),[f]),e("div",{children:[t(i,Object.assign({style:{marginLeft:10,marginBottom:10}},{children:h})),t(o,{whatsappSpecificPickerMeta:m,template:p,onTemplateChange:e=>{null==g||g(e)},showVariableModal:c,variableList:n,variableListForImage:d,discountCode:u,setDiscountCode:C})]})};export{l as default};
1
+ import{jsxs as e,jsx as t}from"react/jsx-runtime";import o from"../../../assets/icons/PlusIcon.js";import{useState as i,useEffect as r}from"react";import{Button as s}from"../../button/Button.js";import{ProductPickerModal as a}from"../../product-picker-v2/modal.js";import{useTemplateModalContext as n}from"../context/templateModalContext.js";import l from"./EditWhatsAppTemplateV2.js";import{TitleMedium as d,BodyCaption as c}from"../../TypographyStyle.js";const m=m=>{let{template:p,whatsappSpecificPickerMeta:u,showVariableModal:h,variableList:g,variableListForImage:f,discountCode:y,setDiscountCode:b}=m;const{selectedCarouselIndex:v,setTemplate:C,pickerConf:I,isProductCarouselTemplate:j}=n(),[x,O]=i(-1==v?"First Message (Step 1/2)":"Carousel Cards (Step 2/2)"),[k,w]=i(!1),[T,P]=i([]);r((()=>{O(-1==v?"First Message (Step 1/2)":"Carousel Cards (Step 2/2)")}),[v]);return e("div",{children:[t(d,Object.assign({style:{marginLeft:10,marginBottom:10}},{children:x})),j&&e("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:12,marginRight:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[t(s,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12},size:"medium",buttonText:"Add Product(s)",buttonType:"dashBold",LeadingIcon:o,onClick:e=>{w(!0)}}),e("div",Object.assign({style:{display:"flex",flex:1,alignItems:"center",justifyContent:"space-between",flexDirection:"row",width:"100%"}},{children:[t("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginRight:8}}),t(c,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),t("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8}})]})),t(s,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%"},size:"medium",buttonText:"Add Product(s) Variable",buttonType:"dashBold",LeadingIcon:o,onClick:e=>{}})]})),t(l,{whatsappSpecificPickerMeta:u,template:p,onTemplateChange:e=>{null==C||C(e)},showVariableModal:h,variableList:g,variableListForImage:f,discountCode:y,setDiscountCode:b}),k&&I&&t(a,{zIndex:200,limit:1,storeId:I.storeId,selectedItems:(e=>{if(e.length>0){const t={};for(const o of e){const e=null==o?void 0:o.collectionId,i=o.productId,r=o.variantId;e in t||(t[e]={products:{},name:"",image:"",isSmartCollection:!1}),i in t[e].products||(t[e].products[i]={variants:{},name:(null==o?void 0:o.productName)||"",image:(null==o?void 0:o.productImage)||""}),t[e].products[i].variants[r]={name:(null==o?void 0:o.name)||"",price:"",image:(null==o?void 0:o.image)||"",quantity:o.quantity||0,displayOrder:o.displayOrder}}return t}return{}})(T),collectionFetcher:I.fetchCollections,productFetcher:I.fetchProducts,onAdd:(e,t)=>{const o=[];delete e.isCustom;for(const t of Object.keys(e)){const i=e[t].products;if(void 0!==i&&Object.keys(i).length)for(const e of Object.keys(i)){const r=i[e].variants;if(void 0!==r&&Object.keys(r).length)for(const s of Object.keys(r)){const{name:a,image:n,quantity:l,displayOrder:d}=r[s],c={name:a,image:n,quantity:l,variantId:s,productId:e,displayOrder:d,collectionId:t,productName:i[e].name,productImage:i[e].image};o.push(c)}}}const i=o.sort(((e,t)=>e.displayOrder-t.displayOrder));P(i)},searchInCollectionFetcher:I.searchInCollection,searchFetcher:I.searchProducts,visible:k,onClose:()=>{w(!1)}})]})};export{m as default};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.0.419-beta.11",
3
+ "version": "0.0.419-beta.12",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",