@bikdotai/bik-component-library 0.0.588-beta.2 → 0.0.588

package/dist/esm/components/discount-modal/DynamicCoupon/DynamicCoupon.js

@@ -1 +1 @@
-import{__rest as e}from"../../../_virtual/_tslib.js";import{jsxs as i,jsx as t,Fragment as o}from"react/jsx-runtime";import n from"../../../assets/icons/info.svg.js";import{Alert as l}from"../../alerts/Alert.js";import{ALERT_TYPES as s,CONTENT_POSITION as r}from"../../alerts/AlertHelper.js";import{Button as a}from"../../button/Button.js";import{CheckBox as d}from"../../checkBox/CheckBox.js";import"react";import{DISCOUNT_APPLIES_TO as c,OFFER_APPLIES_TO as u,DISCOUNT_TYPES as p,COUPON_EXPIRATION as m,DISCOUNT_VALUE_TYPES as v,DISCOUNT_TARGET_TYPES as C,DISCOUNT_TARGET_SELECTION as E}from"../type.js";import"../../dropdown/DropdownPopover/index.js";import{Dropdown as b}from"../../dropdown/Dropdown.js";import"../../dropdown/ChipDropdown.js";import"../../zeroState/ZeroState.js";import{BodySecondary as D,TitleRegular as g,TitleSmall as T}from"../../TypographyStyle.js";import{DEFAULT_THEME as h}from"../../../constants/Theme.js";import"../../dropdown/OpenedDropdown/components/description/Description.styled.js";import"../../list-item/ListItem.js";import"../../dropdown/OpenedDropdown/components/menu/FreeFormMenu.styled.js";import"../../dropdown/OpenedDropdown/components/menu/MenuItem.js";import"../../dropdown/OpenedDropdown/components/menu/MenuList.styled.js";import"../../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js";import"../../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js";import{Input as y}from"../../input/Input.js";import P from"../../../assets/icons/cross.svg.js";import"../../dropdown/MenuItem/MenuItem.js";import"../../modals/styledModal.js";import"../../../node_modules/lodash.debounce/index.js";import"../../bik-layout/CommonStyles.js";import"../../product-picker/ProductPicker.styled.js";import"../../../utils/DateUtils.js";import"../../tag/Tag.js";import"../../tooltips/Tooltip.js";import"../../product-picker-v2/modal.js";import"../../variable-picker-v3/model.js";import"../../modals/modal.styled.js";import O from"../../../assets/icons/plus.svg.js";import"../../accordion/Accordion.style.js";import"../../accordion/AccordionArrow.js";import"../../icon-button/IconButton.js";import"../../switch/Switch.js";import"../../variable-picker-v3/NoResult.js";import"../../variable-picker-v3/styles.js";import"lodash";import{DynamicCouponContainer as I}from"../DiscountModal.styled.js";import{CouponExpiration as j}from"../CouponExpiration/CouponExpiration.js";import{RadioButton as V}from"../../radioButton/RadioButton.js";import S from"../../../assets/icons/cubeIcon.svg.js";import f from"../../../assets/icons/delete.svg.js";import x from"../../../assets/icons/edit.svg.js";import{DiscountOptionsContainer as R,DiscountDetailsOption as _,AddProductButtonsContainer as A,ProductCollectionCard as N,CubeIconContainer as w,IconContainer as L,ProductVariableCard as F}from"./DynamicCoupon.styled.js";import q from"./MinimumRequirementComponent.js";import k from"./ZeroState.js";var U;!function(e){e.ENTITLED="entitled",e.PREREQUISITE="prerequisite"}(U||(U={}));const B=B=>{var M,G,Q,Y,X,$,W,z;const Z=[{selected:B.discountCouponAppliesTo===c.ENTIRE_ORDER,label:"Entire Order",value:c.ENTIRE_ORDER},{selected:B.discountCouponAppliesTo===c.SPECIFIC_PRODUCTS,label:"Specific Product",value:c.SPECIFIC_PRODUCTS},{selected:B.discountCouponAppliesTo===c.SPECIFIC_COLLECTIONS,label:"Specific Collections",value:c.SPECIFIC_COLLECTIONS}],H=[{selected:B.offerAppliesToBuy===u.SPECIFIC_PRODUCTS,label:"Specific Product",value:u.SPECIFIC_PRODUCTS},{selected:B.offerAppliesToBuy===u.SPECIFIC_COLLECTIONS,label:"Specific Collections",value:u.SPECIFIC_COLLECTIONS}],J=[{selected:B.offerAppliesToGet===u.SPECIFIC_PRODUCTS,label:"Specific Product",value:u.SPECIFIC_PRODUCTS},{selected:B.offerAppliesToGet===u.SPECIFIC_COLLECTIONS,label:"Specific Collections",value:u.SPECIFIC_COLLECTIONS}],K=(e,d,u)=>{var p,m,v,C,E,b,g,y,I,j,V,R;let _=[],q=[],k={},M={};B.useNewPicker?(k=d===U.ENTITLED?B.entitledProducts:B.prerequisiteProducts,M=null!==(p=d===U.ENTITLED?B.entitledCollections:B.prerequisiteCollections)&&void 0!==p?p:[],(null==k?void 0:k.isCustom)&&delete k.isCustom,(null==M?void 0:M.isCustom)&&delete M.isCustom,Object.values(k).forEach((e=>{Object.keys(e.products).forEach((i=>{_.push({id:i,name:e.products[i].name,image:e.products[i].image})}))})),Object.keys(M).forEach((e=>{"isCustom"!==e&&q.push({id:e,name:M[e].name,image:M[e].image})}))):(_=d===U.ENTITLED?B.entitledProducts:B.prerequisiteProducts,q=null!==(m=d===U.ENTITLED?B.entitledCollections:B.prerequisiteCollections)&&void 0!==m?m:[]);const G=[null===(v=B.dynamicDiscountValidationError)||void 0===v?void 0:v.inValidProductSelection,null===(C=B.dynamicDiscountValidationError)||void 0===C?void 0:C.inValidProductVariableSelection,null===(E=B.dynamicDiscountValidationError)||void 0===E?void 0:E.inValidCollectionSelection],Q=[null===(b=B.dynamicDiscountValidationError)||void 0===b?void 0:b.inValidBuyXCollectionSelection,null===(g=B.dynamicDiscountValidationError)||void 0===g?void 0:g.inValidBuyXProductSelection,null===(y=B.dynamicDiscountValidationError)||void 0===y?void 0:y.inValidBuyXProductVariableSelection],Y=[null===(I=B.dynamicDiscountValidationError)||void 0===I?void 0:I.inValidGetYCollectionSelection,null===(j=B.dynamicDiscountValidationError)||void 0===j?void 0:j.inValidGetYProductSelection,null===(V=B.dynamicDiscountValidationError)||void 0===V?void 0:V.inValidGetYProductVariableSelection];let X=!1;return"couponAppliesTo"===u&&(X=G.some(Boolean)),"buyX"===u&&(X=Q.some(Boolean)),"getY"===u&&(X=Y.some(Boolean)),i(o,{children:[i("div",Object.assign({style:{display:"flex",gap:18}},{children:[e===c.SPECIFIC_PRODUCTS&&0===_.length&&(d===U.ENTITLED&&!B.entitledProductVariable||d===U.PREREQUISITE&&!B.preRequisiteProductVariable)&&!(null==q?void 0:q.length)&&i(A,{children:[t("div",Object.assign({style:{width:B.isProductVariableSupported?"284px":"300px",display:"flex"}},{children:t(a,{buttonText:"Add Product(s)",buttonType:"dashRegular",LeadingIcon:O,matchParentWidth:!0,onClick:()=>{B.setIsProductPickerOpen(d)},error:X})})),B.isProductVariableSupported&&B.productVariableList&&i(o,{children:[t(D,Object.assign({color:h.colorsV2.content.placeholder},{children:"OR"})),t(a,{buttonText:"Add Product(s) Variable",buttonType:"dashRegular",LeadingIcon:O,matchParentWidth:!0,onClick:()=>{B.setIsProductVariablePickerOpen(d)},error:X})]})]}),e===c.SPECIFIC_COLLECTIONS&&0===q.length&&!(null==_?void 0:_.length)&&t("div",Object.assign({style:{width:"300px",display:"flex"}},{children:t(a,{buttonText:"Add collection(s)",buttonType:"dashRegular",LeadingIcon:O,matchParentWidth:!0,onClick:()=>{B.setIsCollectionPickerOpen(d)},style:{marginTop:"16px"},error:X})}))]})),X&&t("div",Object.assign({style:{margin:"8px 0 0"}},{children:t(l,{type:s.NEGATIVE,text:"Required Field",contentPosition:r.START,icon:()=>t(n,{width:16,height:16,color:h.colorsV2.content.negative})})})),_.length||q.length?i("div",{children:[t(D,Object.assign({style:{margin:"8px 0"}},{children:e===c.SPECIFIC_COLLECTIONS?"Collection(s)":"Product(s)"})),i(N,{children:[t(w,{children:t(S,{width:20,height:20,color:h.colorsV2.content.secondary})}),i(T,{children:[e===c.SPECIFIC_PRODUCTS?_.length:q.length," ",e===c.SPECIFIC_PRODUCTS?"Product(s)":"Collection(s)"," ","added"]}),i("div",Object.assign({style:{display:"flex",gap:4}},{children:[t(L,Object.assign({onClick:()=>{e===c.SPECIFIC_PRODUCTS?B.setIsProductPickerOpen(d):B.setIsCollectionPickerOpen(d)}},{children:t(x,{width:24,height:24,color:h.colorsV2.content.placeholder})})),t(L,Object.assign({onClick:()=>{e===c.SPECIFIC_PRODUCTS?d===U.ENTITLED?B.setEntitledProducts([]):B.setPrerequisiteProducts([]):d===U.ENTITLED?B.setEntitledCollections([]):B.setPrerequisiteCollections([])}},{children:t(f,{width:24,height:24,color:h.colorsV2.content.placeholder})}))]}))]})]}):d===U.ENTITLED&&B.entitledProductVariable?i("div",{children:[t(D,Object.assign({style:{margin:"16px 0 8px"}},{children:"Product Variable"})),i(F,{children:[t(T,{children:B.entitledProductVariable.displayName}),t("div",Object.assign({style:{display:"flex",gap:4}},{children:t(L,Object.assign({onClick:()=>{B.setEntitledProductVariable(void 0)}},{children:t(P,{width:24,height:24,color:h.colorsV2.content.primary})}))}))]})]}):d===U.PREREQUISITE&&(null===(R=B.preRequisiteProductVariable)||void 0===R?void 0:R.displayName)?i("div",{children:[t(D,Object.assign({style:{margin:"16px 0 8px"}},{children:"Product Variable"})),i(F,{children:[t(T,{children:B.preRequisiteProductVariable.displayName}),t("div",Object.assign({style:{display:"flex",gap:4}},{children:t(L,Object.assign({onClick:()=>{B.setPreRequisiteProductVariable(void 0)}},{children:t(P,{width:24,height:24,color:h.colorsV2.content.primary})}))}))]})]}):t(o,{children:" "})]})},ee=(e,o)=>{var n,l,s,r,a,d,p,m,v,C;let E=[],g=[],h={},P={};B.useNewPicker?(h=e===U.ENTITLED?B.entitledProducts:B.prerequisiteProducts,P=null!==(n=e===U.ENTITLED?B.entitledCollections:B.prerequisiteCollections)&&void 0!==n?n:[],(null==h?void 0:h.isCustom)&&delete h.isCustom,(null==P?void 0:P.isCustom)&&delete P.isCustom,Object.values(h).forEach((e=>{Object.keys(e.products).forEach((i=>{E.push({id:i,name:e.products[i].name,image:e.products[i].image})}))})),Object.keys(P).forEach((e=>{"isCustom"!==e&&g.push({id:e,name:P[e].name,image:P[e].image})}))):(E=e===U.ENTITLED?B.entitledProducts:B.prerequisiteProducts,g=null!==(l=e===U.ENTITLED?B.entitledCollections:B.prerequisiteCollections)&&void 0!==l?l:[]);const O=e===U.PREREQUISITE?B.offerAppliesToBuy:B.offerAppliesToGet,I=e===U.PREREQUISITE?U.PREREQUISITE:U.ENTITLED,j=O===u.SPECIFIC_PRODUCTS?c.SPECIFIC_PRODUCTS:c.SPECIFIC_COLLECTIONS;return i("div",{children:[t(T,Object.assign({style:{marginBottom:16}},{children:e===U.PREREQUISITE?"Customer buys":"Customer gets"})),i("div",Object.assign({style:{display:"flex"}},{children:[!o&&t("div",{children:i("div",Object.assign({className:"input__rows"},{children:[t("div",Object.assign({className:"input__wrapper"},{children:t(y,{value:e===U.ENTITLED?null!==(r=null===(s=B.discountData.entitledQuantity)||void 0===s?void 0:s.toString())&&void 0!==r?r:"":null!==(d=null===(a=B.discountData.prerequisiteQuantity)||void 0===a?void 0:a.toString())&&void 0!==d?d:"",type:"number",onChangeText:i=>{e===U.ENTITLED?B.setDiscountData(Object.assign(Object.assign({},B.discountData),{entitledQuantity:parseInt(i)})):B.setDiscountData(Object.assign(Object.assign({},B.discountData),{prerequisiteQuantity:parseInt(i)}))},labelText:"Quantity of products",placeholder:"Eg. 2",width:"300px",errorMessage:e===U.PREREQUISITE&&(null===(p=B.dynamicDiscountValidationError)||void 0===p?void 0:p.inValidBuyXValue)||e===U.ENTITLED&&(null===(m=B.dynamicDiscountValidationError)||void 0===m?void 0:m.inValidGetYValue)?"Required Field":"",state:e===U.PREREQUISITE&&(null===(v=B.dynamicDiscountValidationError)||void 0===v?void 0:v.inValidBuyXValue)||e===U.ENTITLED&&(null===(C=B.dynamicDiscountValidationError)||void 0===C?void 0:C.inValidGetYValue)?"invalid":"none"})})),t("div",{className:"input__wrapper"})]}))}),i("div",{children:[t(D,Object.assign({style:{marginBottom:8}},{children:"Any items from"})),e===U.PREREQUISITE&&t(b,{width:"244px",options:H,placement:"bottom-start",onSelect:e=>{var i,t,o;B.setOfferAppliesToBuy(e.value),B.setPrerequisiteProducts([]),B.setPrerequisiteCollections([]),B.setPreRequisiteProductVariable(void 0),B.setDynamicDiscountValidationError((e=>Object.assign(Object.assign({},e),{inValidBuyXCollectionSelection:!1,inValidBuyXProductSelection:!1,inValidBuyXProductVariableSelection:!1}))),B.setDiscountData(Object.assign(Object.assign({},B.discountData),{prerequisiteCollectionIds:[],prerequisiteProductIds:[],collectionsConf:{entitledCollections:null===(i=B.discountData.collectionsConf)||void 0===i?void 0:i.entitledCollections,prerequisiteCollections:{}},productsConf:{entitledProducts:null===(t=B.discountData.productsConf)||void 0===t?void 0:t.entitledProducts,prerequisiteProducts:{}},productVariableConf:{entitledProductVariable:null===(o=B.discountData.productVariableConf)||void 0===o?void 0:o.entitledProductVariable,prerequisiteProductVariable:{}}}))}}),e===U.ENTITLED&&t(b,{width:"244px",options:J,placement:"bottom-start",onSelect:e=>{var i,t,o;B.setOfferAppliesToGet(e.value),B.setEntitledProducts([]),B.setEntitledCollections([]),B.setEntitledProductVariable(void 0),B.setDynamicDiscountValidationError((e=>Object.assign(Object.assign({},e),{inValidGetYCollectionSelection:!1,inValidGetYProductSelection:!1,inValidGetYProductVariableSelection:!1}))),B.setDiscountData(Object.assign(Object.assign({},B.discountData),{entitledCollectionIds:[],entitledProductIds:[],collectionsConf:{entitledCollections:{},prerequisiteCollections:null===(i=B.discountData.collectionsConf)||void 0===i?void 0:i.prerequisiteCollections},productsConf:{entitledProducts:{},prerequisiteProducts:null===(t=B.discountData.productsConf)||void 0===t?void 0:t.prerequisiteProducts},productVariableConf:{entitledProductVariable:{},prerequisiteProductVariable:null===(o=B.discountData.productVariableConf)||void 0===o?void 0:o.prerequisiteProductVariable}}))}})]})]})),K(j,I,e===U.PREREQUISITE?"buyX":"getY")]})};return i(I,{children:[i("div",{children:[i("div",Object.assign({style:{display:"flex",gap:16}},{children:[t("div",Object.assign({className:"input__wrapper"},{children:t(y,{value:null!==(M=B.discountData.title)&&void 0!==M?M:"",onChangeText:e=>{var i;B.setDiscountData(Object.assign(Object.assign({},B.discountData),{title:null!==(i=null==e?void 0:e.trim())&&void 0!==i?i:""}))},maxCharLimit:30,labelText:"Discount Coupon Title",placeholder:`Eg. “Flat ${null!==(G=B.currency)&&void 0!==G?G:""} 15 Off”`,hintText:"Will be same for everyone. Can’t be changed later",width:"300px",isRequired:!0,errorMessage:(null===(Q=B.dynamicDiscountValidationError)||void 0===Q?void 0:Q.invalidCouponTitle)?"Required Field":"",state:(null===(Y=B.dynamicDiscountValidationError)||void 0===Y?void 0:Y.invalidCouponTitle)?"invalid":"none"})})),!B.hideProbability&&t(y,{value:null!==($=null===(X=B.discountData.probability)||void 0===X?void 0:X.toString())&&void 0!==$?$:"",type:"number",onChangeText:e=>{B.setDiscountData(Object.assign(Object.assign({},B.discountData),{probability:e.startsWith(".")?parseFloat(parseFloat(`0${e}`).toFixed(2)):parseFloat(parseFloat(e).toFixed(2))}))},labelText:"Probability of getting coupon ",hintText:"Enter a decimal value between 0-1",placeholder:"Eg. 0.5",maxCharLimit:4,width:"300px",isRequired:!0,errorMessage:(null===(W=B.dynamicDiscountValidationError)||void 0===W?void 0:W.inValidProbability)?"Required Field":"",state:(null===(z=B.dynamicDiscountValidationError)||void 0===z?void 0:z.inValidProbability)?"invalid":"none"})]})),t("div",{style:{height:"1px",width:"100%",background:h.colorsV2.stroke.primary,margin:"24px 0 8px"}})]}),B.allowStaticCoupon&&t((()=>i("div",{children:[t(g,{children:"Discount Details"}),t(R,{children:B.discountDetailsOptions.map((t=>{return i(_,Object.assign({selected:B.selectedDiscountDetails.id===t.id,onClick:()=>(i=>{if(B.selectedDiscountDetails.id!==i.id)if(B.resetValidationErrors(),B.setValidationErrorMessage(""),B.setDiscountCouponAppliesTo(c.ENTIRE_ORDER),B.setSelectedDiscountDetails(i),B.setDiscountData(Object.assign(Object.assign({},B.discountData),{value:void 0})),B.setPreRequisiteProductVariable(void 0),B.setEntitledProductVariable(void 0),["percentage","amount"].includes(i.value)){B.onChangeCouponType({label:"Amount off on order",selected:!0,value:p.AMOUNT_OFF_ORDER});const t=Object.assign(Object.assign({},B.discountData),{valueType:"percentage"===i.value?v.PERCENTAGE:v.FIXED_AMOUNT,value:void 0,targetType:C.LINE_ITEM,targetSelection:E.ALL,entitledCollectionIds:[],entitledProductIds:[],prerequisiteCollectionIds:[],prerequisiteProductIds:[],collectionsConf:{entitledCollections:{},prerequisiteCollections:{}},productsConf:{entitledProducts:{},prerequisiteProducts:{}},productVariableConf:{entitledProductVariable:{},prerequisiteProductVariable:{}}}),o=e(t,["entitledQuantity","prerequisiteQuantity"]);B.setDiscountData(o)}else B.onChangeCouponType({label:i.label,selected:!0,value:i.value})})(t)},{children:[t.icon((o=t.id,B.selectedDiscountDetails.id===o?h.colorsV2.stroke.brand:h.colorsV2.text.secondary)),t.label]}),t.id);var o}))})]})),{}),(B.selectedCouponType===p.AMOUNT_OFF_ORDER||B.selectedCouponType===p.AMOUNT_OFF_PRODUCTS)&&(()=>{var e,n,l,s,r,a;return i(o,{children:[t("div",Object.assign({className:"input__rows"},{children:t("div",Object.assign({className:"input__wrapper"},{children:t(y,{value:null!==(l=null===(n=null===(e=B.discountData)||void 0===e?void 0:e.value)||void 0===n?void 0:n.toString())&&void 0!==l?l:"",labelText:"Discount amount",type:"number",width:"300px",onChangeText:e=>{B.setDiscountData(Object.assign(Object.assign({},B.discountData),{value:parseInt(e)}))},placeholder:"15",prefixText:B.discountData.valueType===v.FIXED_AMOUNT?null!==(s=B.currency)&&void 0!==s?s:"":void 0,suffixText:B.discountData.valueType===v.PERCENTAGE?"%":void 0,errorMessage:(null===(r=B.dynamicDiscountValidationError)||void 0===r?void 0:r.inValidDiscountAmount)?"Required Field":"",state:(null===(a=B.dynamicDiscountValidationError)||void 0===a?void 0:a.inValidDiscountAmount)?"invalid":"none"})}))})),t("div",Object.assign({style:{paddingTop:"24px",marginTop:16,borderTop:`1px solid ${h.colorsV2.stroke.primary}`}},{children:i("div",Object.assign({className:"input__wrapper"},{children:[t(g,Object.assign({style:{marginBottom:10}},{children:"Applies to"})),t("div",Object.assign({style:{display:"flex",flexGrow:0,flexShrink:0,flexBasis:"auto"}},{children:t(b,{width:"300px",options:Z,placement:"bottom-start",onSelect:e=>{const i="value"in e&&e.value===c.ENTIRE_ORDER?{label:"Amount off on order",selected:!0,value:p.AMOUNT_OFF_ORDER}:{label:"Amount off on products",selected:!0,value:p.AMOUNT_OFF_PRODUCTS};B.onChangeCouponType(i),B.setDiscountCouponAppliesTo(e.value),B.setEntitledProductVariable(void 0),B.setDynamicDiscountValidationError((e=>Object.assign(Object.assign({},e),{inValidProductVariableSelection:!1,inValidProductSelection:!1,inValidCollectionSelection:!1})))}})})),(B.discountCouponAppliesTo===c.SPECIFIC_PRODUCTS||B.discountCouponAppliesTo===c.SPECIFIC_COLLECTIONS)&&K(B.discountCouponAppliesTo,U.ENTITLED,"couponAppliesTo")]}))}))]})})(),B.selectedCouponType===p.BUY_X_GET_Y&&(()=>{var e,o,n,l,s;return i(I,Object.assign({style:{border:`1px solid ${h.colorsV2.stroke.primary}`,padding:"16px",borderRadius:"4px",margin:0}},{children:[ee(U.PREREQUISITE),t("div",{style:{width:"100%",height:"1px",backgroundColor:h.colorsV2.stroke.primary,margin:"8px 0"}}),ee(U.ENTITLED),t(D,Object.assign({style:{marginTop:"8px"}},{children:"At a discounted value"})),t("div",{children:t(V,{label:"Free",isActive:100===B.discountData.value,onValueChange:e=>{e?B.setDiscountData(Object.assign(Object.assign({},B.discountData),{value:100})):B.setDiscountData(Object.assign(Object.assign({},B.discountData),{value:void 0}))}})}),i("div",Object.assign({style:{display:"flex",flexDirection:"column"}},{children:[t(V,{label:"Percentage off",isActive:100!==B.discountData.value,onValueChange:()=>{B.setDiscountData(Object.assign(Object.assign({},B.discountData),{value:void 0}))}}),100!==B.discountData.value&&t("div",Object.assign({style:{marginTop:8}},{children:t(y,{value:null!==(n=null===(o=null===(e=B.discountData)||void 0===e?void 0:e.value)||void 0===o?void 0:o.toString())&&void 0!==n?n:"",onChangeText:e=>{B.setDiscountData(Object.assign(Object.assign({},B.discountData),{value:parseInt(e)}))},type:"number",placeholder:"Eg. 50",suffixText:"%",width:"300px",errorMessage:(null===(l=B.dynamicDiscountValidationError)||void 0===l?void 0:l.inValidDiscountAmount)?"Required Field":"",state:(null===(s=B.dynamicDiscountValidationError)||void 0===s?void 0:s.inValidDiscountAmount)?"invalid":"none"})}))]}))]}))})(),!B.selectedCouponType&&t(k,{}),B.allowStaticCoupon&&B.selectedCouponType!==p.BUY_X_GET_Y&&t("div",Object.assign({style:{padding:"24px 0 16px",marginTop:16,borderTop:`1px solid ${h.colorsV2.stroke.primary}`}},{children:t(q,{selectedMinimumRequirement:B.selectedMinimumRequirement,setSelectedMinimumRequirement:B.setSelectedMinimumRequirement,discountData:B.discountData,setDiscountData:B.setDiscountData,currency:B.currency,dynamicDiscountValidationError:B.dynamicDiscountValidationError})})),B.selectedCouponType&&!B.hideExpiration&&i("div",Object.assign({style:{padding:B.selectedCouponType!==p.BUY_X_GET_Y?"24px 0 16px":"8px 0",borderTop:B.selectedCouponType!==p.BUY_X_GET_Y?`1px solid ${h.colorsV2.stroke.primary}`:"none"}},{children:[t(d,{label:"Add expiration",isChecked:B.isAddExpirationChecked,onValueChange:e=>{B.setIsAddExpirationChecked(e),B.setDiscountData(Object.assign(Object.assign({},B.discountData),{expireAfter:void 0,expireAt:void 0})),B.setSelectedExpiration(m.DYNAMIC_EXPIRATION)},boldOnChecked:!0,labelSize:"DEFAULT"}),t(D,Object.assign({style:{color:h.colorsV2.text.secondary,marginLeft:28}},{children:"Make coupon only valid till a certain time"})),B.isAddExpirationChecked&&t(j,{discountData:B.discountData,setDiscountData:B.setDiscountData,isAddExpirationChecked:B.isAddExpirationChecked,inValidCouponExpiry:B.dynamicDiscountValidationError.inValidCouponExpiry,selectedExpiration:B.selectedExpiration,setSelectedExpiration:B.setSelectedExpiration})]}))]})};export{U as DISCOUNT_PRODUCTS,B as default};
+import{__rest as e}from"../../../_virtual/_tslib.js";import{jsxs as i,jsx as t,Fragment as o}from"react/jsx-runtime";import n from"../../../assets/icons/info.svg.js";import{Alert as l}from"../../alerts/Alert.js";import{ALERT_TYPES as s,CONTENT_POSITION as r}from"../../alerts/AlertHelper.js";import{Button as a}from"../../button/Button.js";import{CheckBox as d}from"../../checkBox/CheckBox.js";import"react";import{DISCOUNT_APPLIES_TO as c,OFFER_APPLIES_TO as u,DISCOUNT_TYPES as p,COUPON_EXPIRATION as m,DISCOUNT_VALUE_TYPES as v,DISCOUNT_TARGET_TYPES as C,DISCOUNT_TARGET_SELECTION as E}from"../type.js";import"../../dropdown/DropdownPopover/index.js";import{Dropdown as b}from"../../dropdown/Dropdown.js";import"../../dropdown/ChipDropdown.js";import"../../zeroState/ZeroState.js";import{BodySecondary as D,TitleRegular as g,TitleSmall as T}from"../../TypographyStyle.js";import{DEFAULT_THEME as h}from"../../../constants/Theme.js";import"../../dropdown/OpenedDropdown/components/description/Description.styled.js";import"../../list-item/ListItem.js";import"../../dropdown/OpenedDropdown/components/menu/FreeFormMenu.styled.js";import"../../dropdown/OpenedDropdown/components/menu/MenuItem.js";import"../../dropdown/OpenedDropdown/components/menu/MenuList.styled.js";import"../../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js";import"../../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js";import{Input as y}from"../../input/Input.js";import P from"../../../assets/icons/cross.svg.js";import"../../dropdown/MenuItem/MenuItem.js";import"../../modals/styledModal.js";import"../../../node_modules/lodash.debounce/index.js";import"../../bik-layout/CommonStyles.js";import"../../product-picker/ProductPicker.styled.js";import"../../../utils/DateUtils.js";import"../../tag/Tag.js";import"../../tooltips/Tooltip.js";import"../../product-picker-v2/modal.js";import"../../variable-picker-v3/model.js";import"../../modals/modal.styled.js";import O from"../../../assets/icons/plus.svg.js";import"../../accordion/Accordion.style.js";import"../../accordion/AccordionArrow.js";import"../../icon-button/IconButton.js";import"../../switch/Switch.js";import"../../variable-picker-v3/NoResult.js";import"../../variable-picker-v3/styles.js";import"lodash";import{DynamicCouponContainer as I}from"../DiscountModal.styled.js";import{CouponExpiration as j}from"../CouponExpiration/CouponExpiration.js";import{RadioButton as V}from"../../radioButton/RadioButton.js";import S from"../../../assets/icons/cubeIcon.svg.js";import f from"../../../assets/icons/delete.svg.js";import x from"../../../assets/icons/edit.svg.js";import{DiscountOptionsContainer as R,DiscountDetailsOption as _,AddProductButtonsContainer as A,ProductCollectionCard as N,CubeIconContainer as w,IconContainer as L,ProductVariableCard as F}from"./DynamicCoupon.styled.js";import q from"./MinimumRequirementComponent.js";import k from"./ZeroState.js";var U;!function(e){e.ENTITLED="entitled",e.PREREQUISITE="prerequisite"}(U||(U={}));const B=B=>{var M,G,Q,Y,X,$,W,z;const Z=[{selected:B.discountCouponAppliesTo===c.ENTIRE_ORDER,label:"Entire Order",value:c.ENTIRE_ORDER},{selected:B.discountCouponAppliesTo===c.SPECIFIC_PRODUCTS,label:"Specific Product",value:c.SPECIFIC_PRODUCTS},{selected:B.discountCouponAppliesTo===c.SPECIFIC_COLLECTIONS,label:"Specific Collections",value:c.SPECIFIC_COLLECTIONS}],H=[{selected:B.offerAppliesToBuy===u.SPECIFIC_PRODUCTS,label:"Specific Product",value:u.SPECIFIC_PRODUCTS},{selected:B.offerAppliesToBuy===u.SPECIFIC_COLLECTIONS,label:"Specific Collections",value:u.SPECIFIC_COLLECTIONS}],J=[{selected:B.offerAppliesToGet===u.SPECIFIC_PRODUCTS,label:"Specific Product",value:u.SPECIFIC_PRODUCTS},{selected:B.offerAppliesToGet===u.SPECIFIC_COLLECTIONS,label:"Specific Collections",value:u.SPECIFIC_COLLECTIONS}],K=(e,d,u)=>{var p,m,v,C,E,b,g,y,I,j,V,R;let _=[],q=[],k={},M={};B.useNewPicker?(k=d===U.ENTITLED?B.entitledProducts:B.prerequisiteProducts,M=null!==(p=d===U.ENTITLED?B.entitledCollections:B.prerequisiteCollections)&&void 0!==p?p:[],(null==k?void 0:k.isCustom)&&delete k.isCustom,(null==M?void 0:M.isCustom)&&delete M.isCustom,Object.values(k).forEach((e=>{Object.keys(e.products).forEach((i=>{_.push({id:i,name:e.products[i].name,image:e.products[i].image})}))})),Object.keys(M).forEach((e=>{"isCustom"!==e&&q.push({id:e,name:M[e].name,image:M[e].image})}))):(_=d===U.ENTITLED?B.entitledProducts:B.prerequisiteProducts,q=null!==(m=d===U.ENTITLED?B.entitledCollections:B.prerequisiteCollections)&&void 0!==m?m:[]);const G=[null===(v=B.dynamicDiscountValidationError)||void 0===v?void 0:v.inValidProductSelection,null===(C=B.dynamicDiscountValidationError)||void 0===C?void 0:C.inValidProductVariableSelection,null===(E=B.dynamicDiscountValidationError)||void 0===E?void 0:E.inValidCollectionSelection],Q=[null===(b=B.dynamicDiscountValidationError)||void 0===b?void 0:b.inValidBuyXCollectionSelection,null===(g=B.dynamicDiscountValidationError)||void 0===g?void 0:g.inValidBuyXProductSelection,null===(y=B.dynamicDiscountValidationError)||void 0===y?void 0:y.inValidBuyXProductVariableSelection],Y=[null===(I=B.dynamicDiscountValidationError)||void 0===I?void 0:I.inValidGetYCollectionSelection,null===(j=B.dynamicDiscountValidationError)||void 0===j?void 0:j.inValidGetYProductSelection,null===(V=B.dynamicDiscountValidationError)||void 0===V?void 0:V.inValidGetYProductVariableSelection];let X=!1;return"couponAppliesTo"===u&&(X=G.some(Boolean)),"buyX"===u&&(X=Q.some(Boolean)),"getY"===u&&(X=Y.some(Boolean)),i(o,{children:[i("div",Object.assign({style:{display:"flex",gap:18}},{children:[e===c.SPECIFIC_PRODUCTS&&0===_.length&&(d===U.ENTITLED&&!B.entitledProductVariable||d===U.PREREQUISITE&&!B.preRequisiteProductVariable)&&!(null==q?void 0:q.length)&&i(A,{children:[t("div",Object.assign({style:{width:B.isProductVariableSupported?"284px":"300px",display:"flex"}},{children:t(a,{buttonText:"Add Product(s)",buttonType:"dashRegular",LeadingIcon:O,matchParentWidth:!0,onClick:()=>{B.setIsProductPickerOpen(d)},error:X})})),B.isProductVariableSupported&&B.productVariableList&&i(o,{children:[t(D,Object.assign({color:h.colorsV2.content.placeholder},{children:"OR"})),t(a,{buttonText:"Add Product(s) Variable",buttonType:"dashRegular",LeadingIcon:O,matchParentWidth:!0,onClick:()=>{B.setIsProductVariablePickerOpen(d)},error:X})]})]}),e===c.SPECIFIC_COLLECTIONS&&0===q.length&&!(null==_?void 0:_.length)&&t("div",Object.assign({style:{width:"300px",display:"flex"}},{children:t(a,{buttonText:"Add collection(s)",buttonType:"dashRegular",LeadingIcon:O,matchParentWidth:!0,onClick:()=>{B.setIsCollectionPickerOpen(d)},style:{marginTop:"16px"},error:X})}))]})),X&&t("div",Object.assign({style:{margin:"8px 0 0"}},{children:t(l,{type:s.NEGATIVE,text:"Required Field",contentPosition:r.START,icon:()=>t(n,{width:16,height:16,color:h.colorsV2.content.negative})})})),_.length||q.length?i("div",{children:[t(D,Object.assign({style:{margin:"8px 0"}},{children:e===c.SPECIFIC_COLLECTIONS?"Collection(s)":"Product(s)"})),i(N,{children:[t(w,{children:t(S,{width:20,height:20,color:h.colorsV2.content.secondary})}),i(T,{children:[e===c.SPECIFIC_PRODUCTS?_.length:q.length," ",e===c.SPECIFIC_PRODUCTS?"Product(s)":"Collection(s)"," ","added"]}),i("div",Object.assign({style:{display:"flex",gap:4}},{children:[t(L,Object.assign({onClick:()=>{e===c.SPECIFIC_PRODUCTS?B.setIsProductPickerOpen(d):B.setIsCollectionPickerOpen(d)}},{children:t(x,{width:24,height:24,color:h.colorsV2.content.placeholder})})),t(L,Object.assign({onClick:()=>{e===c.SPECIFIC_PRODUCTS?d===U.ENTITLED?B.setEntitledProducts([]):B.setPrerequisiteProducts([]):d===U.ENTITLED?B.setEntitledCollections([]):B.setPrerequisiteCollections([])}},{children:t(f,{width:24,height:24,color:h.colorsV2.content.placeholder})}))]}))]})]}):d===U.ENTITLED&&B.entitledProductVariable?i("div",{children:[t(D,Object.assign({style:{margin:"16px 0 8px"}},{children:"Product Variable"})),i(F,{children:[t(T,{children:B.entitledProductVariable.displayName}),t("div",Object.assign({style:{display:"flex",gap:4}},{children:t(L,Object.assign({onClick:()=>{B.setEntitledProductVariable(void 0)}},{children:t(P,{width:24,height:24,color:h.colorsV2.content.primary})}))}))]})]}):d===U.PREREQUISITE&&(null===(R=B.preRequisiteProductVariable)||void 0===R?void 0:R.displayName)?i("div",{children:[t(D,Object.assign({style:{margin:"16px 0 8px"}},{children:"Product Variable"})),i(F,{children:[t(T,{children:B.preRequisiteProductVariable.displayName}),t("div",Object.assign({style:{display:"flex",gap:4}},{children:t(L,Object.assign({onClick:()=>{B.setPreRequisiteProductVariable(void 0)}},{children:t(P,{width:24,height:24,color:h.colorsV2.content.primary})}))}))]})]}):t(o,{children:" "})]})},ee=(e,o)=>{var n,l,s,r,a,d,p,m,v,C;let E=[],g=[],h={},P={};B.useNewPicker?(h=e===U.ENTITLED?B.entitledProducts:B.prerequisiteProducts,P=null!==(n=e===U.ENTITLED?B.entitledCollections:B.prerequisiteCollections)&&void 0!==n?n:[],(null==h?void 0:h.isCustom)&&delete h.isCustom,(null==P?void 0:P.isCustom)&&delete P.isCustom,Object.values(h).forEach((e=>{Object.keys(e.products).forEach((i=>{E.push({id:i,name:e.products[i].name,image:e.products[i].image})}))})),Object.keys(P).forEach((e=>{"isCustom"!==e&&g.push({id:e,name:P[e].name,image:P[e].image})}))):(E=e===U.ENTITLED?B.entitledProducts:B.prerequisiteProducts,g=null!==(l=e===U.ENTITLED?B.entitledCollections:B.prerequisiteCollections)&&void 0!==l?l:[]);const O=e===U.PREREQUISITE?B.offerAppliesToBuy:B.offerAppliesToGet,I=e===U.PREREQUISITE?U.PREREQUISITE:U.ENTITLED,j=O===u.SPECIFIC_PRODUCTS?c.SPECIFIC_PRODUCTS:c.SPECIFIC_COLLECTIONS;return i("div",{children:[t(T,Object.assign({style:{marginBottom:16}},{children:e===U.PREREQUISITE?"Customer buys":"Customer gets"})),i("div",Object.assign({style:{display:"flex"}},{children:[!o&&t("div",{children:i("div",Object.assign({className:"input__rows"},{children:[t("div",Object.assign({className:"input__wrapper"},{children:t(y,{value:e===U.ENTITLED?null!==(r=null===(s=B.discountData.entitledQuantity)||void 0===s?void 0:s.toString())&&void 0!==r?r:"":null!==(d=null===(a=B.discountData.prerequisiteQuantity)||void 0===a?void 0:a.toString())&&void 0!==d?d:"",type:"number",onChangeText:i=>{e===U.ENTITLED?B.setDiscountData(Object.assign(Object.assign({},B.discountData),{entitledQuantity:parseInt(i)})):B.setDiscountData(Object.assign(Object.assign({},B.discountData),{prerequisiteQuantity:parseInt(i)}))},labelText:"Quantity of products",placeholder:"Eg. 2",width:"300px",errorMessage:e===U.PREREQUISITE&&(null===(p=B.dynamicDiscountValidationError)||void 0===p?void 0:p.inValidBuyXValue)||e===U.ENTITLED&&(null===(m=B.dynamicDiscountValidationError)||void 0===m?void 0:m.inValidGetYValue)?"Required Field":"",state:e===U.PREREQUISITE&&(null===(v=B.dynamicDiscountValidationError)||void 0===v?void 0:v.inValidBuyXValue)||e===U.ENTITLED&&(null===(C=B.dynamicDiscountValidationError)||void 0===C?void 0:C.inValidGetYValue)?"invalid":"none"})})),t("div",{className:"input__wrapper"})]}))}),i("div",{children:[t(D,Object.assign({style:{marginBottom:8}},{children:"Any items from"})),e===U.PREREQUISITE&&t(b,{width:"244px",options:H,placement:"bottom-start",onSelect:e=>{var i,t,o;B.setOfferAppliesToBuy(e.value),B.setPrerequisiteProducts([]),B.setPrerequisiteCollections([]),B.setPreRequisiteProductVariable(void 0),B.setDynamicDiscountValidationError((e=>Object.assign(Object.assign({},e),{inValidBuyXCollectionSelection:!1,inValidBuyXProductSelection:!1,inValidBuyXProductVariableSelection:!1}))),B.setDiscountData(Object.assign(Object.assign({},B.discountData),{prerequisiteCollectionIds:[],prerequisiteProductIds:[],collectionsConf:{entitledCollections:null===(i=B.discountData.collectionsConf)||void 0===i?void 0:i.entitledCollections,prerequisiteCollections:{}},productsConf:{entitledProducts:null===(t=B.discountData.productsConf)||void 0===t?void 0:t.entitledProducts,prerequisiteProducts:{}},productVariableConf:{entitledProductVariable:null===(o=B.discountData.productVariableConf)||void 0===o?void 0:o.entitledProductVariable,prerequisiteProductVariable:{}}}))}}),e===U.ENTITLED&&t(b,{width:"244px",options:J,placement:"bottom-start",onSelect:e=>{var i,t,o;B.setOfferAppliesToGet(e.value),B.setEntitledProducts([]),B.setEntitledCollections([]),B.setEntitledProductVariable(void 0),B.setDynamicDiscountValidationError((e=>Object.assign(Object.assign({},e),{inValidGetYCollectionSelection:!1,inValidGetYProductSelection:!1,inValidGetYProductVariableSelection:!1}))),B.setDiscountData(Object.assign(Object.assign({},B.discountData),{entitledCollectionIds:[],entitledProductIds:[],collectionsConf:{entitledCollections:{},prerequisiteCollections:null===(i=B.discountData.collectionsConf)||void 0===i?void 0:i.prerequisiteCollections},productsConf:{entitledProducts:{},prerequisiteProducts:null===(t=B.discountData.productsConf)||void 0===t?void 0:t.prerequisiteProducts},productVariableConf:{entitledProductVariable:{},prerequisiteProductVariable:null===(o=B.discountData.productVariableConf)||void 0===o?void 0:o.prerequisiteProductVariable}}))}})]})]})),K(j,I,e===U.PREREQUISITE?"buyX":"getY")]})};return i(I,{children:[i("div",{children:[i("div",Object.assign({style:{display:"flex",gap:16}},{children:[t("div",Object.assign({className:"input__wrapper"},{children:t(y,{value:null!==(M=B.discountData.title)&&void 0!==M?M:"",onChangeText:e=>{var i;B.setDiscountData(Object.assign(Object.assign({},B.discountData),{title:null!==(i=null==e?void 0:e.trim())&&void 0!==i?i:""}))},maxCharLimit:30,labelText:"Discount Coupon Title",placeholder:`Eg. “Flat ${null!==(G=B.currency)&&void 0!==G?G:""} 15 Off”`,hintText:"Will be same for everyone. Can’t be changed later",width:"300px",isRequired:!0,errorMessage:(null===(Q=B.dynamicDiscountValidationError)||void 0===Q?void 0:Q.invalidCouponTitle)?"Required Field":"",state:(null===(Y=B.dynamicDiscountValidationError)||void 0===Y?void 0:Y.invalidCouponTitle)?"invalid":"none"})})),!B.hideProbability&&t(y,{value:null!==($=null===(X=B.discountData.probability)||void 0===X?void 0:X.toString())&&void 0!==$?$:"",type:"number",onChangeText:e=>{B.setDiscountData(Object.assign(Object.assign({},B.discountData),{probability:e.startsWith(".")?parseFloat(parseFloat(`0${e}`).toFixed(2)):parseFloat(parseFloat(e).toFixed(2))}))},labelText:"Probability of getting coupon ",hintText:"Enter a decimal value between 0-1",placeholder:"Eg. 0.5",maxCharLimit:4,width:"300px",isRequired:!0,errorMessage:(null===(W=B.dynamicDiscountValidationError)||void 0===W?void 0:W.inValidProbability)?"Required Field":"",state:(null===(z=B.dynamicDiscountValidationError)||void 0===z?void 0:z.inValidProbability)?"invalid":"none"})]})),t("div",{style:{height:"1px",width:"100%",background:h.colorsV2.stroke.primary,margin:"24px 0 8px"}})]}),B.allowStaticCoupon&&t((()=>i("div",{children:[t(g,{children:"Discount Details"}),t(R,{children:B.discountDetailsOptions.map((t=>{return i(_,Object.assign({selected:B.selectedDiscountDetails.id===t.id,onClick:()=>(i=>{if(B.selectedDiscountDetails.id!==i.id)if(B.resetValidationErrors(),B.setValidationErrorMessage(""),B.setDiscountCouponAppliesTo(c.ENTIRE_ORDER),B.setSelectedDiscountDetails(i),B.setDiscountData(Object.assign(Object.assign({},B.discountData),{value:void 0})),B.setPreRequisiteProductVariable(void 0),B.setEntitledProductVariable(void 0),["percentage","amount"].includes(i.value)){B.onChangeCouponType({label:"Amount off on order",selected:!0,value:p.AMOUNT_OFF_ORDER});const t=Object.assign(Object.assign({},B.discountData),{valueType:"percentage"===i.value?v.PERCENTAGE:v.FIXED_AMOUNT,value:void 0,targetType:C.LINE_ITEM,targetSelection:E.ALL,entitledCollectionIds:[],entitledProductIds:[],prerequisiteCollectionIds:[],prerequisiteProductIds:[],collectionsConf:{entitledCollections:{},prerequisiteCollections:{}},productsConf:{entitledProducts:{},prerequisiteProducts:{}},productVariableConf:{entitledProductVariable:{},prerequisiteProductVariable:{}}}),o=e(t,["entitledQuantity","prerequisiteQuantity"]);B.setDiscountData(o)}else B.onChangeCouponType({label:i.label,selected:!0,value:i.value})})(t)},{children:[t.icon((o=t.id,B.selectedDiscountDetails.id===o?h.colorsV2.stroke.brand:h.colorsV2.text.secondary)),t.label]}),t.id);var o}))})]})),{}),(B.selectedCouponType===p.AMOUNT_OFF_ORDER||B.selectedCouponType===p.AMOUNT_OFF_PRODUCTS)&&(()=>{var e,n,l,s,r,a;return i(o,{children:[t("div",Object.assign({className:"input__rows"},{children:t("div",Object.assign({className:"input__wrapper"},{children:t(y,{value:null!==(l=null===(n=null===(e=B.discountData)||void 0===e?void 0:e.value)||void 0===n?void 0:n.toString())&&void 0!==l?l:"",labelText:"Discount amount",type:"number",width:"300px",onChangeText:e=>{B.setDiscountData(Object.assign(Object.assign({},B.discountData),{value:parseInt(e)}))},placeholder:"15",prefixText:B.discountData.valueType===v.FIXED_AMOUNT?null!==(s=B.currency)&&void 0!==s?s:"":void 0,suffixText:B.discountData.valueType===v.PERCENTAGE?"%":void 0,errorMessage:(null===(r=B.dynamicDiscountValidationError)||void 0===r?void 0:r.inValidDiscountAmount)?"Required Field":"",state:(null===(a=B.dynamicDiscountValidationError)||void 0===a?void 0:a.inValidDiscountAmount)?"invalid":"none"})}))})),t("div",Object.assign({style:{paddingTop:"24px",marginTop:16,borderTop:`1px solid ${h.colorsV2.stroke.primary}`}},{children:i("div",Object.assign({className:"input__wrapper"},{children:[t(g,Object.assign({style:{marginBottom:10}},{children:"Applies to"})),t("div",Object.assign({style:{display:"flex",flexGrow:0,flexShrink:0,flexBasis:"auto"}},{children:t(b,{width:"300px",options:Z,placement:"bottom-start",onSelect:e=>{const i="value"in e&&e.value===c.ENTIRE_ORDER?{label:"Amount off on order",selected:!0,value:p.AMOUNT_OFF_ORDER}:{label:"Amount off on products",selected:!0,value:p.AMOUNT_OFF_PRODUCTS};B.onChangeCouponType(i),B.setDiscountCouponAppliesTo(e.value),B.setEntitledProductVariable(void 0),B.setDynamicDiscountValidationError((e=>Object.assign(Object.assign({},e),{inValidProductVariableSelection:!1,inValidProductSelection:!1,inValidCollectionSelection:!1})))}})})),(B.discountCouponAppliesTo===c.SPECIFIC_PRODUCTS||B.discountCouponAppliesTo===c.SPECIFIC_COLLECTIONS)&&K(B.discountCouponAppliesTo,U.ENTITLED,"couponAppliesTo")]}))}))]})})(),B.selectedCouponType===p.BUY_X_GET_Y&&(()=>{var e,o,n,l,s;return i(I,Object.assign({style:{border:`1px solid ${h.colorsV2.stroke.primary}`,padding:"16px",borderRadius:"4px",margin:0}},{children:[ee(U.PREREQUISITE),t("div",{style:{width:"100%",height:"1px",backgroundColor:h.colorsV2.stroke.primary,margin:"8px 0"}}),ee(U.ENTITLED),t(D,Object.assign({style:{marginTop:"8px"}},{children:"At a discounted value"})),t("div",{children:t(V,{label:"Free",isActive:100===B.discountData.value,onValueChange:e=>{e?B.setDiscountData(Object.assign(Object.assign({},B.discountData),{value:100})):B.setDiscountData(Object.assign(Object.assign({},B.discountData),{value:void 0}))}})}),i("div",Object.assign({style:{display:"flex",flexDirection:"column"}},{children:[t(V,{label:"Percentage off",isActive:100!==B.discountData.value,onValueChange:()=>{B.setDiscountData(Object.assign(Object.assign({},B.discountData),{value:void 0}))}}),100!==B.discountData.value&&t("div",Object.assign({style:{marginTop:8}},{children:t(y,{value:null!==(n=null===(o=null===(e=B.discountData)||void 0===e?void 0:e.value)||void 0===o?void 0:o.toString())&&void 0!==n?n:"",onChangeText:e=>{B.setDiscountData(Object.assign(Object.assign({},B.discountData),{value:parseInt(e)}))},type:"number",placeholder:"Eg. 50",suffixText:"%",width:"300px",errorMessage:(null===(l=B.dynamicDiscountValidationError)||void 0===l?void 0:l.inValidDiscountAmount)?"Required Field":"",state:(null===(s=B.dynamicDiscountValidationError)||void 0===s?void 0:s.inValidDiscountAmount)?"invalid":"none"})}))]}))]}))})(),!B.selectedCouponType&&t(k,{}),B.allowStaticCoupon&&B.selectedCouponType!==p.BUY_X_GET_Y&&t("div",Object.assign({style:{padding:"24px 0 16px",marginTop:16,borderTop:`1px solid ${h.colorsV2.stroke.primary}`}},{children:t(q,{selectedMinimumRequirement:B.selectedMinimumRequirement,setSelectedMinimumRequirement:B.setSelectedMinimumRequirement,discountData:B.discountData,setDiscountData:B.setDiscountData,currency:B.currency,dynamicDiscountValidationError:B.dynamicDiscountValidationError})})),B.selectedCouponType&&!B.hideExpiration&&i("div",Object.assign({style:{padding:B.selectedCouponType!==p.BUY_X_GET_Y?"24px 0 16px":"8px 0",borderTop:B.selectedCouponType!==p.BUY_X_GET_Y?`1px solid ${h.colorsV2.stroke.primary}`:"none"}},{children:[t(d,{label:"Add expiration",isDisabled:!!B.makeExpiryMandatory,isChecked:B.isAddExpirationChecked,onValueChange:e=>{B.setIsAddExpirationChecked(e),B.setDiscountData(Object.assign(Object.assign({},B.discountData),{expireAfter:void 0,expireAt:void 0})),B.setSelectedExpiration(m.DYNAMIC_EXPIRATION)},boldOnChecked:!0,labelSize:"DEFAULT"}),t(D,Object.assign({style:{color:h.colorsV2.text.secondary,marginLeft:28}},{children:"Make coupon only valid till a certain time"})),B.isAddExpirationChecked&&t(j,{discountData:B.discountData,setDiscountData:B.setDiscountData,isAddExpirationChecked:B.isAddExpirationChecked,inValidCouponExpiry:B.dynamicDiscountValidationError.inValidCouponExpiry,selectedExpiration:B.selectedExpiration,setSelectedExpiration:B.setSelectedExpiration})]}))]})};export{U as DISCOUNT_PRODUCTS,B as default};

package/dist/esm/components/dropShadow/DropShadow.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
-export declare const DropShadow: React.FC<{
+declare const DropShadow: React.FC<{
     level: 'z1' | 'z2';
     position: 'up' | 'down';
     children: React.ReactNode;
     style?: React.CSSProperties;
 }>;
+export default DropShadow;

package/dist/esm/components/dropShadow/DropShadow.js

@@ -1 +1 @@
-import{jsx as p}from"react/jsx-runtime";const x={z1:{up:"0px -2px 8px rgba(0, 0, 0, 0.12)",down:"0px 2px 8px rgba(0, 0, 0, 0.12)"},z2:{up:"0px -4px 12px rgba(0, 0, 0, 0.12)",down:"0px 4px 12px rgba(0, 0, 0, 0.12)"}},e=e=>{let{level:n="z1",position:r="down",children:t,style:o}=e;const s=x[n][r];return p("div",Object.assign({style:Object.assign({boxShadow:s},null!=o?o:{})},{children:t}))};export{e as DropShadow};
+import{jsx as p}from"react/jsx-runtime";const x={z1:{up:"0px -2px 8px rgba(0, 0, 0, 0.12)",down:"0px 2px 8px rgba(0, 0, 0, 0.12)"},z2:{up:"0px -4px 12px rgba(0, 0, 0, 0.12)",down:"0px 4px 12px rgba(0, 0, 0, 0.12)"}},e=e=>{let{level:t="z1",position:n="down",children:r,style:o}=e;const s=x[t][n];return p("div",Object.assign({style:Object.assign({boxShadow:s},null!=o?o:{})},{children:r}))};export{e as default};

package/dist/esm/components/dropdown/DropdownPopover/index.js

@@ -1 +1 @@
-import{__rest as o}from"../../../_virtual/_tslib.js";import{jsx as e,Fragment as l,jsxs as n}from"react/jsx-runtime";import t,{useState as r,useRef as i,useImperativeHandle as s,useEffect as p}from"react";import{usePopper as d}from"react-popper";import{DropShadow as a}from"../../dropShadow/DropShadow.js";import{Tooltip as c}from"../../tooltips/Tooltip.js";import{OverLapAbs as v,OpenDropdownContainer as m}from"../Common.styled.js";import{OpenedDropdown as u}from"../OpenedDropdown/components/OpennedDropdown.js";const w=t.forwardRef(((t,w)=>{var{children:h,onDropdownVisbilityChange:b,version:f="1.0",tooltipContent:j,tooltipDirection:g,showTooltipArrow:D}=t,y=o(t,["children","onDropdownVisbilityChange","version","tooltipContent","tooltipDirection","showTooltipArrow"]);const O=w,[C,S]=r(!1),[E,x]=r(null),[A,R]=r(null),T=i(null),{styles:z,attributes:M}=d(E,A,{placement:y.placement,strategy:y.strategy}),V=o=>{var e,l;"2.0"===f&&y.isMultiSelect&&o&&(null===(e=y.onSelect)||void 0===e||e.call(y,[...o])),S(!1),null===(l=null==y?void 0:y.onClose)||void 0===l||l.call(y)};s(O,(()=>({openDropdown:C})),[]),p((()=>{(null==O?void 0:O.current)&&(O.current.openDropdown=C)}),[C]),p((()=>{null==b||b(C)}),[C]);const _=()=>n(l,{children:[n("div",Object.assign({style:{position:"relative"},ref:x},{children:[e(v,Object.assign({ref:T,allowEvents:y.allowEvents,disabled:y.disabled,onClick:o=>{var e;null===(e=y.onDropdownOpen)||void 0===e||e.call(y),C?(S(!1),o.preventDefault()):y.disabled||S(!0)}},{children:y.allowEvents?h:null})),y.allowEvents?null:h]})),C&&e(m,Object.assign({ref:R,style:Object.assign(Object.assign({},z.popper),{zIndex:3})},M.popper,{children:e(a,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:e(u,Object.assign({},y,{onSelect:o=>{var e;"2.0"===f&&y.isMultiSelect||(null===(e=y.onSelect)||void 0===e||e.call(y,o),S(!1))},onClose:V,version:f,headerRef:T}))}))}))]});return e(l,{children:C||void 0===j?_():e(c,Object.assign({body:j,placement:g,hideArrow:!D},{children:e("div",{children:_()})}))})}));w.displayName="DropdownPopover";export{w as DropdownPopover};
+import{__rest as o}from"../../../_virtual/_tslib.js";import{jsx as e,Fragment as l,jsxs as n}from"react/jsx-runtime";import t,{useState as r,useRef as i,useImperativeHandle as s,useEffect as p}from"react";import{usePopper as d}from"react-popper";import a from"../../dropShadow/DropShadow.js";import{Tooltip as c}from"../../tooltips/Tooltip.js";import{OverLapAbs as v,OpenDropdownContainer as m}from"../Common.styled.js";import{OpenedDropdown as u}from"../OpenedDropdown/components/OpennedDropdown.js";const w=t.forwardRef(((t,w)=>{var{children:h,onDropdownVisbilityChange:b,version:f="1.0",tooltipContent:j,tooltipDirection:g,showTooltipArrow:D}=t,y=o(t,["children","onDropdownVisbilityChange","version","tooltipContent","tooltipDirection","showTooltipArrow"]);const O=w,[C,S]=r(!1),[E,x]=r(null),[A,R]=r(null),T=i(null),{styles:z,attributes:M}=d(E,A,{placement:y.placement,strategy:y.strategy}),V=o=>{var e,l;"2.0"===f&&y.isMultiSelect&&o&&(null===(e=y.onSelect)||void 0===e||e.call(y,[...o])),S(!1),null===(l=null==y?void 0:y.onClose)||void 0===l||l.call(y)};s(O,(()=>({openDropdown:C})),[]),p((()=>{(null==O?void 0:O.current)&&(O.current.openDropdown=C)}),[C]),p((()=>{null==b||b(C)}),[C]);const _=()=>n(l,{children:[n("div",Object.assign({style:{position:"relative"},ref:x},{children:[e(v,Object.assign({ref:T,allowEvents:y.allowEvents,disabled:y.disabled,onClick:o=>{var e;null===(e=y.onDropdownOpen)||void 0===e||e.call(y),C?(S(!1),o.preventDefault()):y.disabled||S(!0)}},{children:y.allowEvents?h:null})),y.allowEvents?null:h]})),C&&e(m,Object.assign({ref:R,style:Object.assign(Object.assign({},z.popper),{zIndex:3})},M.popper,{children:e(a,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:e(u,Object.assign({},y,{onSelect:o=>{var e;"2.0"===f&&y.isMultiSelect||(null===(e=y.onSelect)||void 0===e||e.call(y,o),S(!1))},onClose:V,version:f,headerRef:T}))}))}))]});return e(l,{children:C||void 0===j?_():e(c,Object.assign({body:j,placement:g,hideArrow:!D},{children:e("div",{children:_()})}))})}));w.displayName="DropdownPopover";export{w as DropdownPopover};

package/dist/esm/components/dropdown/MultilevelDropdownPopover/index.js

@@ -1 +1 @@
-import{__rest as o}from"../../../_virtual/_tslib.js";import{jsx as e,Fragment as r,jsxs as l}from"react/jsx-runtime";import n,{useState as t,useRef as i,useImperativeHandle as s,useEffect as p}from"react";import{usePopper as d}from"react-popper";import{DropShadow as c}from"../../dropShadow/DropShadow.js";import{Tooltip as a}from"../../tooltips/Tooltip.js";import{OverLapAbs as m,OpenDropdownContainer as v}from"../Common.styled.js";import{OpenedDropdown as u}from"../OpenedDropdown/components/OpennedDropdown.js";const h=n.forwardRef(((n,h)=>{var{children:w,onDropdownVisbilityChange:b,version:f="1.0",tooltipContent:j,tooltipDirection:D,showTooltipArrow:g}=n,y=o(n,["children","onDropdownVisbilityChange","version","tooltipContent","tooltipDirection","showTooltipArrow"]);const O=h,[C,S]=t(!1),[x,A]=t(null),[M,R]=t(null),T=i(null),{styles:z,attributes:V}=d(x,M,{placement:y.placement,strategy:y.strategy}),_=o=>{var e,r;y.isMultiSelect&&o&&(null===(e=y.onSelect)||void 0===e||e.call(y,[...o])),S(!1),null===(r=null==y?void 0:y.onClose)||void 0===r||r.call(y)};s(O,(()=>({openDropdown:C})),[]),p((()=>{(null==O?void 0:O.current)&&(O.current.openDropdown=C)}),[C]),p((()=>{null==b||b(C)}),[C]);const k=()=>l(r,{children:[l("div",Object.assign({style:{position:"relative"},ref:A},{children:[e(m,{ref:T,disabled:y.disabled,onClick:o=>{var e;null===(e=y.onDropdownOpen)||void 0===e||e.call(y),C?(S(!1),o.preventDefault()):y.disabled||S(!0)}}),w]})),C&&e(v,Object.assign({ref:R,style:Object.assign(Object.assign({},z.popper),{zIndex:3})},V.popper,{children:e(c,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:e(u,Object.assign({},y,{onSelect:o=>{var e;"2.0"===f&&y.isMultiSelect||(null===(e=y.onSelect)||void 0===e||e.call(y,o),S(!1))},onClose:_,version:f,headerRef:T}))}))}))]});return e(r,{children:C||void 0===j?k():e(a,Object.assign({body:j,placement:D,hideArrow:!g},{children:e("div",{children:k()})}))})}));h.displayName="MultilevelDropdownPopover";export{h as MultilevelDropdownPopover};
+import{__rest as o}from"../../../_virtual/_tslib.js";import{jsx as e,Fragment as r,jsxs as l}from"react/jsx-runtime";import n,{useState as t,useRef as i,useImperativeHandle as s,useEffect as p}from"react";import{usePopper as d}from"react-popper";import c from"../../dropShadow/DropShadow.js";import{Tooltip as a}from"../../tooltips/Tooltip.js";import{OverLapAbs as m,OpenDropdownContainer as v}from"../Common.styled.js";import{OpenedDropdown as u}from"../OpenedDropdown/components/OpennedDropdown.js";const h=n.forwardRef(((n,h)=>{var{children:w,onDropdownVisbilityChange:b,version:f="1.0",tooltipContent:j,tooltipDirection:D,showTooltipArrow:g}=n,y=o(n,["children","onDropdownVisbilityChange","version","tooltipContent","tooltipDirection","showTooltipArrow"]);const O=h,[C,S]=t(!1),[x,A]=t(null),[M,R]=t(null),T=i(null),{styles:z,attributes:V}=d(x,M,{placement:y.placement,strategy:y.strategy}),_=o=>{var e,r;y.isMultiSelect&&o&&(null===(e=y.onSelect)||void 0===e||e.call(y,[...o])),S(!1),null===(r=null==y?void 0:y.onClose)||void 0===r||r.call(y)};s(O,(()=>({openDropdown:C})),[]),p((()=>{(null==O?void 0:O.current)&&(O.current.openDropdown=C)}),[C]),p((()=>{null==b||b(C)}),[C]);const k=()=>l(r,{children:[l("div",Object.assign({style:{position:"relative"},ref:A},{children:[e(m,{ref:T,disabled:y.disabled,onClick:o=>{var e;null===(e=y.onDropdownOpen)||void 0===e||e.call(y),C?(S(!1),o.preventDefault()):y.disabled||S(!0)}}),w]})),C&&e(v,Object.assign({ref:R,style:Object.assign(Object.assign({},z.popper),{zIndex:3})},V.popper,{children:e(c,Object.assign({level:"z2",position:"down",style:{borderRadius:8}},{children:e(u,Object.assign({},y,{onSelect:o=>{var e;"2.0"===f&&y.isMultiSelect||(null===(e=y.onSelect)||void 0===e||e.call(y,o),S(!1))},onClose:_,version:f,headerRef:T}))}))}))]});return e(r,{children:C||void 0===j?k():e(a,Object.assign({body:j,placement:D,hideArrow:!g},{children:e("div",{children:k()})}))})}));h.displayName="MultilevelDropdownPopover";export{h as MultilevelDropdownPopover};

package/dist/esm/components/floating-input-dropdown/FloatingInputDropdown.js

@@ -1,4 +1,4 @@
-import{jsxs as e,Fragment as o,jsx as n}from"react/jsx-runtime";import{useRef as t,useState as i,useEffect as r}from"react";import{usePopper as l}from"react-popper";import s from"styled-components";import{DropShadow as p}from"../dropShadow/DropShadow.js";import{OpenDropdownContainer as c}from"../dropdown/Common.styled.js";import{OpenedDropdown as d}from"../dropdown/OpenedDropdown/components/OpennedDropdown.js";import{Floater as a}from"../floater/floater.js";import{Input as m}from"../input/Input.js";const u=s(c)`
+import{jsxs as e,Fragment as o,jsx as n}from"react/jsx-runtime";import{useRef as t,useState as i,useEffect as r}from"react";import{usePopper as l}from"react-popper";import s from"styled-components";import p from"../dropShadow/DropShadow.js";import{OpenDropdownContainer as c}from"../dropdown/Common.styled.js";import{OpenedDropdown as d}from"../dropdown/OpenedDropdown/components/OpennedDropdown.js";import{Floater as a}from"../floater/floater.js";import{Input as m}from"../input/Input.js";const u=s(c)`
 	opacity: ${e=>{let{visible:o}=e;return o?1:0}};
 	visibility: ${e=>{let{visible:o}=e;return o?"visible":"hidden"}};
 	transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;

package/dist/esm/components/template-context-mapper/TemplateContextMapper.d.ts

@@ -56,5 +56,9 @@ export interface TemplateContextMapperProps {
     maxCharLimit?: number;
     onDefaultVariableSelect?: (variable: VariableV3) => void;
     skipDefaultVariableContent?: boolean;
+    disableDatePicker?: boolean;
+    disableCopyCode?: boolean;
+    initialExpiryDateTime?: string;
+    showDiscountCodeExpiryInfo?: boolean;
 }
-export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList: variableListFromProps, discountCode, setDiscountCode, onBackPress, enabledCustomText, variableListForImage, showSampleValues, disableEditVariable, pod, extras, pickerConf, selectedCarouselProducts, disableEditExpiry, cardWidth, onDeleteSelectedProducts, fileName, setFileName, hideDeviceContainerInPreview, maxCharLimit, onDefaultVariableSelect, skipDefaultVariableContent, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TemplateContextMapper: (props: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/template-context-mapper/TemplateContextMapper.js

@@ -1 +1 @@
-import{jsx as e,jsxs as l,Fragment as o}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import{useEffect as r,useState as i,useRef as a,useMemo as s}from"react";import n from"../../utils/StringUtils.js";import{COLORS as d}from"../../constants/Theme.js";import{StyledModal as u}from"../modals/styledModal.js";import{CHANNEL_TYPE as c}from"../template-preview/models/Channels.js";import{POD as p}from"../template-preview/models/WhatsAppTemplate.js";import{TemplateModalContext as m}from"./context/templateModalContext.js";import v from"./modalElements/Footer.js";import h from"./modalElements/TemplateSelectModalContent.js";import{convertPlaceholdersToBikDropdown as b}from"./utils/convertPlaceholdersToBikDropdown.js";const C=C=>{let{selectedTemplate:f,closeDialog:g,showVariableMapping:P,channel:x,htmlContent:E,templateVariables:S,onTemplateSelect:I,globalPlaceholders:T,showOnlyContent:V,whatsappSpecificPickerMeta:y,zIndex:w,showVariableModal:k,variableList:L,discountCode:D,setDiscountCode:j,onBackPress:M,enabledCustomText:A,variableListForImage:B,showSampleValues:H,disableEditVariable:F,pod:O,extras:W,pickerConf:N,selectedCarouselProducts:z,disableEditExpiry:R,cardWidth:U,onDeleteSelectedProducts:$,fileName:_,setFileName:q,hideDeviceContainerInPreview:G,maxCharLimit:J,onDefaultVariableSelect:K,skipDefaultVariableContent:Q}=C;var X,Y,Z,ee,le,oe,te,re;r((()=>{pe(E)}),[E]);const ie=x===c.WHATSAPP&&"CAROUSEL"===(null===(Y=null===(X=null==f?void 0:f.components)||void 0===X?void 0:X[1])||void 0===Y?void 0:Y.type),ae=null==f?void 0:f.isProductCarouselType,[se,ne]=i(x===c.EMAIL||x==c.WEBPUSH||ie?"desktop":"mobile"),[de,ue]=i(!1),[ce,pe]=i(E),[me,ve]=i(!1),[he,be]=i([]),[Ce,fe]=i({}),[ge,Pe]=i(f),[xe,Ee]=i([]),[Se,Ie]=i(null),[Te,Ve]=i(!1),[ye,we]=i(null!=S?S:[]),[ke,Le]=i(!1),[De,je]=i(ie?(null===(ee=null===(Z=null==ge?void 0:ge.mapping)||void 0===Z?void 0:Z.body)||void 0===ee?void 0:ee.length)?-1:0:-1),[Me,Ae]=i([]),[Be,He]=i(void 0),Fe=a(null),[Oe,We]=i(!1),[Ne,ze]=i(!1),[Re,Ue]=i(!1),[$e,_e]=i({});r((()=>{z?Ae(z):ae&&Ae([])}),[z]),r((()=>{var e;if(!Te&&ae&&(!z||0===Ae.length)){const l=null===(e=null==ge?void 0:ge.components)||void 0===e?void 0:e[1].cards,o=[];null==l||l.forEach((e=>{var l;null===(l=null==e?void 0:e.components)||void 0===l||l.forEach((e=>{var l,t,r;"HEADER"===e.type&&o.push(null!==(r=null===(t=null===(l=e.example)||void 0===l?void 0:l.header_handle)||void 0===t?void 0:t[0])&&void 0!==r?r:"")}))})),Ee(o),Ve(!0)}}),[Te]);const qe=s((()=>b(T)),[T]);return r((()=>{He(t(L))}),[L]),e(m.Provider,Object.assign({value:{hideFooterButton:Re,setHideFooterButton:Ue,hideCrossButton:Ne,setHideCrossButton:ze,variableList:Be,setVariableList:He,variableCallback:Se,setVariableCallback:Ie,showVariablePicker:de,setShowVariablePicker:ue,template:ge,setTemplate:Pe,device:se,setDevice:ne,display_content:ce,setDisplayContent:pe,originalVariableList:ye,setOriginalVariableList:we,isError:me,setIsError:ve,channel:x,globalNormalizedPlaceholders:qe,templateSelectionTriggered:ke,setTemplateSelectionTriggered:Le,enabledCustomText:A,disableEditVariable:F,pod:O,extras:W,isWhatsappCarousel:ie,selectedCarouselIndex:De,setSelectedCarouselIndex:je,isProductCarouselType:ae,templateErrorIndexes:Ce,cardCount:ie?null===(oe=null===(le=f.components)||void 0===le?void 0:le[1].cards)||void 0===oe?void 0:oe.length:void 0,errorIndexes:he,setErrorIndexes:be,pickerConf:N,carouselProducts:Me,setCarouselProducts:Ae,disableEditExpiry:R,cardWidth:U,cardImages:xe,onDeleteSelectedProducts:$,hideDeviceContainerInPreview:G,sliderRef:Fe,isCarouselHovered:Oe,setIsCarouselHovered:We,maxCharLimit:J,ctaOptionsErrors:$e,setCtaOptionsErrors:_e,onDefaultVariableSelect:K}},{children:V?e(h,{variableListFromProps:L,channel:c.EMAIL,hideHeader:!0}):l(u,Object.assign({hideCrossButton:Ne,zIndex:w,centralContainerStyles:{width:ie?900:x===c.EMAIL&&P?1e3:800},open:!0,onClose:()=>{null==g||g()},headingTitle:null==ge?void 0:ge.label,headingSubtitle:x===c.WHATSAPP?`${n.capitaliseFirstLetterOfString(null!==(te=null==ge?void 0:ge.category)&&void 0!==te?te:"")} • ${null!==(re=null==ge?void 0:ge.templateCategory)&&void 0!==re?re:""}`:"",onBackPress:()=>{null==M||M()},modalHeaderStyles:{borderBottom:`1px solid ${d.stroke.primary}`}},{children:[e(h,{variableListFromProps:L,showSampleValues:H,showVariableMapping:P,channel:x,whatsappSpecificPickerMeta:y,showVariableModal:k,discountCode:D,setDiscountCode:j,variableListForImage:B&&(null==B?void 0:B.length)>0?B:Be,fileName:_,setFileName:e=>{null==q||q(e)},skipDefaultVariableContent:Q}),I?e(v,{isWhatsappCarousel:null!=ie&&ie,onSelect:function(){var e;if((null==Me?void 0:Me.length)<1&&ae)return void ve(!0);if(Object.keys($e).length>0&&O!==p.CHATBOT)return void ve(!0);const l=null==I?void 0:I(ge,ye,null!=ce?ce:"",Me);fe(null!==(e=null==l?void 0:l.templateErrorIndexes)&&void 0!==e?e:{body:[],buttons:[]}),(null==l?void 0:l.errorIndexes)||(null==l?void 0:l.error)?((null==l?void 0:l.errorIndexes)&&be(l.errorIndexes),(null==l?void 0:l.error)&&ve(!!(null==l?void 0:l.error))):Le(!0)}}):e(o,{})]}))}))};export{C as TemplateContextMapper};
+import{jsx as e,jsxs as o,Fragment as l}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import{useEffect as i,useState as r,useRef as a,useMemo as s}from"react";import n from"../../utils/StringUtils.js";import{COLORS as d}from"../../constants/Theme.js";import{StyledModal as c}from"../modals/styledModal.js";import{CHANNEL_TYPE as u}from"../template-preview/models/Channels.js";import{POD as p}from"../template-preview/models/WhatsAppTemplate.js";import{TemplateModalContext as m}from"./context/templateModalContext.js";import v from"./modalElements/Footer.js";import h from"./modalElements/TemplateSelectModalContent.js";import{convertPlaceholdersToBikDropdown as b}from"./utils/convertPlaceholdersToBikDropdown.js";const C=C=>{var f,g,x,E,P,y,S,I;const{selectedTemplate:D,closeDialog:T,showVariableMapping:w,channel:V,htmlContent:k,templateVariables:L,onTemplateSelect:j,globalPlaceholders:M,showOnlyContent:A,whatsappSpecificPickerMeta:B,zIndex:H,showVariableModal:F,variableList:O,discountCode:W,setDiscountCode:N,onBackPress:z,enabledCustomText:R,variableListForImage:U,showSampleValues:$,disableEditVariable:_,pod:q,extras:G,pickerConf:J,selectedCarouselProducts:K,disableEditExpiry:Q,cardWidth:X,onDeleteSelectedProducts:Y,fileName:Z,setFileName:ee,hideDeviceContainerInPreview:oe,maxCharLimit:le,onDefaultVariableSelect:te,skipDefaultVariableContent:ie,disableDatePicker:re,disableCopyCode:ae,initialExpiryDateTime:se,showDiscountCodeExpiryInfo:ne}=C;i((()=>{be(k)}),[k]);const de=V===u.WHATSAPP&&"CAROUSEL"===(null===(g=null===(f=null==D?void 0:D.components)||void 0===f?void 0:f[1])||void 0===g?void 0:g.type),ce=null==D?void 0:D.isProductCarouselType,[ue,pe]=r(V===u.EMAIL||V==u.WEBPUSH||de?"desktop":"mobile"),[me,ve]=r(!1),[he,be]=r(k),[Ce,fe]=r(!1),[ge,xe]=r([]),[Ee,Pe]=r({}),[ye,Se]=r(D),[Ie,De]=r([]),[Te,we]=r(null),[Ve,ke]=r(!1),[Le,je]=r(null!=L?L:[]),[Me,Ae]=r(!1),[Be,He]=r(de?(null===(E=null===(x=null==ye?void 0:ye.mapping)||void 0===x?void 0:x.body)||void 0===E?void 0:E.length)?-1:0:-1),[Fe,Oe]=r([]),[We,Ne]=r(void 0),ze=a(null),[Re,Ue]=r(!1),[$e,_e]=r(!1),[qe,Ge]=r(!1),[Je,Ke]=r({});i((()=>{K?Oe(K):ce&&Oe([])}),[K]),i((()=>{var e;if(!Ve&&ce&&(!K||0===Oe.length)){const o=null===(e=null==ye?void 0:ye.components)||void 0===e?void 0:e[1].cards,l=[];null==o||o.forEach((e=>{var o;null===(o=null==e?void 0:e.components)||void 0===o||o.forEach((e=>{var o,t,i;"HEADER"===e.type&&l.push(null!==(i=null===(t=null===(o=e.example)||void 0===o?void 0:o.header_handle)||void 0===t?void 0:t[0])&&void 0!==i?i:"")}))})),De(l),ke(!0)}}),[Ve]);const Qe=s((()=>b(M)),[M]);return i((()=>{Ne(t(O))}),[O]),e(m.Provider,Object.assign({value:{hideFooterButton:qe,setHideFooterButton:Ge,hideCrossButton:$e,setHideCrossButton:_e,variableList:We,setVariableList:Ne,variableCallback:Te,setVariableCallback:we,showVariablePicker:me,setShowVariablePicker:ve,template:ye,setTemplate:Se,device:ue,setDevice:pe,display_content:he,setDisplayContent:be,originalVariableList:Le,setOriginalVariableList:je,isError:Ce,setIsError:fe,channel:V,globalNormalizedPlaceholders:Qe,templateSelectionTriggered:Me,setTemplateSelectionTriggered:Ae,enabledCustomText:R,disableEditVariable:_,pod:q,extras:G,isWhatsappCarousel:de,selectedCarouselIndex:Be,setSelectedCarouselIndex:He,isProductCarouselType:ce,templateErrorIndexes:Ee,cardCount:de?null===(y=null===(P=D.components)||void 0===P?void 0:P[1].cards)||void 0===y?void 0:y.length:void 0,errorIndexes:ge,setErrorIndexes:xe,pickerConf:J,carouselProducts:Fe,setCarouselProducts:Oe,disableEditExpiry:Q,cardWidth:X,cardImages:Ie,onDeleteSelectedProducts:Y,hideDeviceContainerInPreview:oe,sliderRef:ze,isCarouselHovered:Re,setIsCarouselHovered:Ue,maxCharLimit:le,ctaOptionsErrors:Je,setCtaOptionsErrors:Ke,onDefaultVariableSelect:te,disableDatePicker:re,disableCopyCode:ae,initialExpiryDateTime:se,showDiscountCodeExpiryInfo:ne}},{children:A?e(h,{variableListFromProps:O,channel:u.EMAIL,hideHeader:!0}):o(c,Object.assign({hideCrossButton:$e,zIndex:H,centralContainerStyles:{width:de?900:V===u.EMAIL&&w?1e3:800},open:!0,onClose:()=>{null==T||T()},headingTitle:null==ye?void 0:ye.label,headingSubtitle:V===u.WHATSAPP?`${n.capitaliseFirstLetterOfString(null!==(S=null==ye?void 0:ye.category)&&void 0!==S?S:"")} • ${null!==(I=null==ye?void 0:ye.templateCategory)&&void 0!==I?I:""}`:"",onBackPress:()=>{null==z||z()},modalHeaderStyles:{borderBottom:`1px solid ${d.stroke.primary}`}},{children:[e(h,{variableListFromProps:O,showSampleValues:$,showVariableMapping:w,channel:V,whatsappSpecificPickerMeta:B,showVariableModal:F,discountCode:W,setDiscountCode:N,variableListForImage:U&&(null==U?void 0:U.length)>0?U:We,fileName:Z,setFileName:e=>{null==ee||ee(e)},skipDefaultVariableContent:ie}),j?e(v,{isWhatsappCarousel:null!=de&&de,onSelect:function(){var e;if((null==Fe?void 0:Fe.length)<1&&ce)return void fe(!0);if(Object.keys(Je).length>0&&q!==p.CHATBOT)return void fe(!0);const o=null==j?void 0:j(ye,Le,null!=he?he:"",Fe);Pe(null!==(e=null==o?void 0:o.templateErrorIndexes)&&void 0!==e?e:{body:[],buttons:[]}),(null==o?void 0:o.errorIndexes)||(null==o?void 0:o.error)?((null==o?void 0:o.errorIndexes)&&xe(o.errorIndexes),(null==o?void 0:o.error)&&fe(!!(null==o?void 0:o.error))):Ae(!0)}}):e(l,{})]}))}))};export{C as TemplateContextMapper};

package/dist/esm/components/template-context-mapper/context/templateModalContext.d.ts

@@ -9,6 +9,10 @@ import { AllTemplateTypes, AllTemplateVariables } from "../../template-preview/m
 import { ExtrasWhatsapp } from "../../template-preview/models/WhatsAppTemplate";
 export type DEVICE_TYPES = 'desktop' | 'mobile';
 export declare const TemplateModalContext: React.Context<{
+    showDiscountCodeExpiryInfo?: boolean | undefined;
+    initialExpiryDateTime?: string | undefined;
+    disableDatePicker?: boolean | undefined;
+    disableCopyCode?: boolean | undefined;
     hideFooterButton: boolean;
     setHideFooterButton: React.Dispatch<React.SetStateAction<boolean>>;
     hideCrossButton: boolean;
@@ -76,6 +80,10 @@ export declare const TemplateModalContext: React.Context<{
     onDefaultVariableSelect?: ((variable: VariableV3) => void) | undefined;
 }>;
 export declare const useTemplateModalContext: () => {
+    showDiscountCodeExpiryInfo?: boolean | undefined;
+    initialExpiryDateTime?: string | undefined;
+    disableDatePicker?: boolean | undefined;
+    disableCopyCode?: boolean | undefined;
     hideFooterButton: boolean;
     setHideFooterButton: React.Dispatch<React.SetStateAction<boolean>>;
     hideCrossButton: boolean;

package/dist/esm/components/template-context-mapper/context/templateModalContext.js

@@ -1 +1 @@
-import e,{useContext as t}from"react";import{CHANNEL_TYPE as a}from"../../template-preview/models/Channels.js";const i=e.createContext({hideFooterButton:!1,setHideFooterButton:()=>{},hideCrossButton:!1,setHideCrossButton:()=>{},variableList:[],setVariableList:()=>{},variableCallback:null,setVariableCallback:null,showVariablePicker:!1,setShowVariablePicker:()=>{},device:"desktop",templateSelectionTriggered:!1,display_content:null,originalVariableList:[],channel:a.EMAIL,template:null,isError:!1,enabledCustomText:!1,disableEditVariable:!1,disableEditExpiry:!1}),l=()=>t(i);export{i as TemplateModalContext,l as useTemplateModalContext};
+import e,{useContext as t}from"react";import{CHANNEL_TYPE as i}from"../../template-preview/models/Channels.js";const a=e.createContext({hideFooterButton:!1,setHideFooterButton:()=>{},hideCrossButton:!1,setHideCrossButton:()=>{},variableList:[],setVariableList:()=>{},variableCallback:null,setVariableCallback:null,showVariablePicker:!1,setShowVariablePicker:()=>{},device:"desktop",templateSelectionTriggered:!1,display_content:null,originalVariableList:[],channel:i.EMAIL,template:null,isError:!1,enabledCustomText:!1,disableEditVariable:!1,disableEditExpiry:!1,disableDatePicker:!1,showDiscountCodeExpiryInfo:!1}),l=()=>t(a);export{a as TemplateModalContext,l as useTemplateModalContext};

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

@@ -1,4 +1,4 @@
-import{jsx as o,jsxs as n,Fragment as e}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import{useRef as i,useState as l,useEffect as a}from"react";import s from"styled-components";import{Input as d}from"../../input/Input.js";import{HEADER_TYPES as r}from"../../template-preview/models/TemplateMeta.js";import{POD as p}from"../../template-preview/models/WhatsAppTemplate.js";import{useTemplateModalContext as u}from"../context/templateModalContext.js";import{getAllDataFromTemplateComponent as c}from"../utils/getDataFromTemplateComponent.js";import{isVariable as m}from"../utils/validateIsUrl.js";import{validateInputName as v}from"../utils/validateName.js";import{BackTrackComponent as b}from"./BackTrackComponent.js";import{DiscountCodeComponent as g}from"./DiscountCodeComponent.js";import f from"./EditMediaModal.js";import h from"./EditMediaV2.js";import{EditTemplateMediaContainer as O}from"./EditMediaV2.style.js";import{useEditWhatsappTemplateMedia as j}from"./useEditWhtasappTemplateMedia.js";import C from"./VariableConnector.js";import{Container as T}from"./VariableConnectorsPanel.js";import x from"./VariableConnectorWhatsApp.js";import y from"./VariableEditorHeader.js";import E from"./WhatsAppTemplateCardButtonV2.js";const V=s=>{let{template:V,onTemplateChange:M,whatsappSpecificPickerMeta:k,showVariableModal:I,variableListForImage:L,setDiscountCode:R,fileName:U,setFileName:w}=s;var N,P,A,_,D,H,S,F,Q,q,Y,K,W,$,G,X,z,J,Z,oo,no,eo,to,io,lo,ao,so,ro,po,uo,co,mo,vo,bo,go,fo,ho,Oo,jo;const Co=V.isCarouselType,{originalVariableList:To,pod:xo,extras:yo,selectedCarouselIndex:Eo,isProductCarouselType:Vo}=u(),{descriptionComponents:Bo,urlBtns:Mo,qrbBtns:ko,imageComponent:Io,bodyVariables:Lo,headerVariables:Ro}=c(V),Uo=i(null),[wo,No]=l(!1),[Po,Ao]=l(-1===Eo?{descriptionComponents:Bo,urlBtns:Mo,qrbBtns:ko,imageComponent:Io,bodyVariables:Lo,headerVariables:Ro}:{}),{uploadMediaLink:_o,uploadMediaFiles:Do,validateMimeType:Ho}=k,So=j({uploadMediaLink:_o,uploadMediaFiles:Do,updateTemplateImageUrl:function(o,n){var e,i,l,a,s,d,r,p;let u;u=null!=Eo&&Eo>-1?{components:null===(i=null===(e=V.components[1])||void 0===e?void 0:e.cards)||void 0===i?void 0:i[Eo].components,mapping:null===(a=null===(l=null==V?void 0:V.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Eo]}:Object.assign({},V);const c=null===(s=null==u?void 0:u.components)||void 0===s?void 0:s.findIndex((o=>{if("HEADER"===o.type&&"NONE"!==o.format&&"TEXT"!==o.format)return!0}));if(void 0!==c&&c>-1&&(null==u?void 0:u.components[c])){const e=Object.assign(Object.assign({},u.components[c]),{format:n,example:{header_handle:[o]}}),t=[...u.components];t[c]=e,u=Object.assign(Object.assign({},u),{components:t})}u.mapping&&(u.mapping=Object.assign(Object.assign({},u.mapping),{header:void 0}));if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=u.components,(null===(d=null==o?void 0:o.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==o?void 0:o.mapping)||void 0===r?void 0:r.cards.length)>0&&(o.mapping.cards[Eo]=null!==(p=u.mapping)&&void 0!==p?p:{}),null==M||M(Object.assign({},o)),Qo(!0)}else null==M||M(Object.assign({},u))},validateMimeType:Ho,mediaComponent:Co?Po.imageComponent:Io,fileRef:Uo}),[Fo,Qo]=l(!1),[qo,Yo]=l(U),[Ko,Wo]=l();function $o(o,n,e){var i,l,a,s,d,r,p,u,c,m;const v=null!=Eo&&Eo>-1?{components:null===(i=Object.assign({},V).components[1].cards)||void 0===i?void 0:i[Eo].components,mapping:null===(l=Object.assign({},V).mapping.cards)||void 0===l?void 0:l[Eo]}:Object.assign({},V),b=t(v),g="custom"===n&&"string"==typeof o,f=g?o:"string"!=typeof o?o.defaultValue?o.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=Eo&&Eo>-1&&Vo){const n=Object.assign({},V).components.map((o=>{var n;return"CAROUSEL"===o.type?Object.assign(Object.assign({},o),{cards:null===(n=o.cards)||void 0===n?void 0:n.map((o=>Object.assign(Object.assign({},o),{components:o.components.map((o=>{var n,t,i;if("BUTTONS"===o.type){const l=null===(n=o.buttons)||void 0===n?void 0:n.filter((o=>"URL"===o.type));let a=null!==(t=null==l?void 0:l[e])&&void 0!==t?t:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[f]});const s=null===(i=o.buttons)||void 0===i?void 0:i.map((o=>"URL"===o.type&&(null==o?void 0:o.text)===(null==a?void 0:a.text)?a:o));return Object.assign(Object.assign({},o),{buttons:s})}return o}))})))}):o})),i=null===(s=null===(a=Object.assign({},V).mapping)||void 0===a?void 0:a.cards)||void 0===s?void 0:s.map((n=>{var e;return Object.assign(Object.assign({},n),{buttons:null===(e=null==n?void 0:n.buttons)||void 0===e?void 0:e.map((n=>g?"((customBtnPlaceholder))":"string"!=typeof o?o.placeHolder:""))})})),l=t(V);return l.components=n,l.mapping.cards=i,void(null==M||M(Object.assign({},l)))}const h=null==b?void 0:b.components.findIndex((o=>"BUTTONS"===o.type));if(void 0!==h&&h>-1){const t=null===(d=null==b?void 0:b.components[h].buttons)||void 0===d?void 0:d.filter((o=>"URL"===o.type));if((null==t?void 0:t.length)>0){const i="custom"===n&&"string"==typeof o,l=i?o:"string"!=typeof o&&o.defaultValue?o.defaultValue:"https://d.bik.ai/";let a=t[e];a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]});const s=[...null!==(u=null===(p=null===(r=b.components)||void 0===r?void 0:r[h])||void 0===p?void 0:p.buttons)&&void 0!==u?u:[]].map((o=>"URL"===o.type&&(null==o?void 0:o.text)===(null==a?void 0:a.text)?a:o)),d=Object.assign(Object.assign({},b.components[h]),{buttons:s}),m=null===(c=b.mapping)||void 0===c?void 0:c.buttons;m&&m.length>0&&(m[e]=i?"((customBtnPlaceholder))":"string"!=typeof o?o.placeHolder:"");const v=Object.assign(Object.assign({},b.mapping),{buttons:m});b.mapping=v;const g=[...b.components];g[h]=d,b.components=g}}if("string"!=typeof o){"checkout.checkoutUrl"===(null===(m=o.placeHolder)||void 0===m?void 0:m.slice(2,-2))?No(!0):(No(!1),null==R||R(""))}if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=b.components,o.mapping.cards[Eo]=b.mapping,null==M||M(Object.assign({},o))}else null==M||M(b)}function Go(o,n,e){var i,l,a,s,d,r,p;const u=null!=Eo&&Eo>-1?{components:null===(i=Object.assign({},V).components[1].cards)||void 0===i?void 0:i[Eo].components,mapping:null===(l=Object.assign({},V).mapping.cards)||void 0===l?void 0:l[Eo]}:Object.assign({},V);if(null!=Eo&&Eo>-1&&Vo){const n=Object.assign({},V).components.map((n=>{var t;return"CAROUSEL"===n.type?Object.assign(Object.assign({},n),{cards:null===(t=n.cards)||void 0===t?void 0:t.map((n=>Object.assign(Object.assign({},n),{components:n.components.map((n=>{var t,i,l;if("BUTTONS"===n.type){const a=null===(t=null==n?void 0:n.buttons)||void 0===t?void 0:t.filter((o=>"QUICK_REPLY"===o.type));let s=null!==(i=null==a?void 0:a[e])&&void 0!==i?i:{};s=Object.assign(Object.assign({},s),{flowId:o.flowId,flowName:o.flowName});const d=null===(l=null==n?void 0:n.buttons)||void 0===l?void 0:l.map((o=>"QUICK_REPLY"===o.type&&(null==o?void 0:o.text)===(null==s?void 0:s.text)?s:o));return Object.assign(Object.assign({},n),{buttons:d})}return n}))})))}):n})),i=t(V);return i.components=n,void(null==M||M(Object.assign({},i)))}const c=null==u?void 0:u.components.findIndex((o=>"BUTTONS"===o.type));if(void 0!==c&&c>-1){const n=null===(s=null===(a=null==u?void 0:u.components[c])||void 0===a?void 0:a.buttons)||void 0===s?void 0:s.filter((o=>"QUICK_REPLY"===o.type));if(n){let t=n[e];t=Object.assign(Object.assign({},t),{flowId:o.flowId,flowName:o.flowName});const i=[...null!==(p=null===(r=null===(d=u.components)||void 0===d?void 0:d[c])||void 0===r?void 0:r.buttons)&&void 0!==p?p:[]].map((o=>"QUICK_REPLY"===o.type&&(null==o?void 0:o.text)===(null==t?void 0:t.text)?t:o)),l=Object.assign(Object.assign({},u.components[c]),{buttons:i}),a=[...u.components];a[c]=l,u.components=a}}if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=u.components,null==M||M(Object.assign({},o))}else null==M||M(u)}a((()=>{var o,n;if(null===(o=V.mapping.buttons)||void 0===o?void 0:o.find((o=>"checkout.checkoutUrl"===o.slice(2,-2))))No(!0);else{No(!1);const o=null===(n=null==yo?void 0:yo.discountCodeExtra)||void 0===n?void 0:n[1];null==o||o("")}}),[V]),a((()=>{var o,n,e,t;if(null!=Eo&&Eo>-1){const i={components:null===(n=null===(o=V.components[1])||void 0===o?void 0:o.cards)||void 0===n?void 0:n[Eo].components,mapping:null===(t=null===(e=null==V?void 0:V.mapping)||void 0===e?void 0:e.cards)||void 0===t?void 0:t[Eo]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}=c(i);Ao({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p})}else if(null!=Eo&&-1===Eo){const{descriptionComponents:o,urlBtns:n,qrbBtns:e,imageComponent:t,bodyVariables:i,headerVariables:l}=c(V);Ao({descriptionComponents:o,urlBtns:n,qrbBtns:e,imageComponent:t,bodyVariables:i,headerVariables:l})}}),[Eo]),a((()=>{var o,n,e,t;if(null!=Eo&&Eo>-1&&Fo){const i={components:null===(n=null===(o=V.components[1])||void 0===o?void 0:o.cards)||void 0===n?void 0:n[Eo].components,mapping:null===(t=null===(e=null==V?void 0:V.mapping)||void 0===e?void 0:e.cards)||void 0===t?void 0:t[Eo]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}=c(i);Ao({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}),Qo(!1)}}),[Fo]);const Xo=Co?Po.imageComponent:Io;return So.openEditMedia?o(T,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:o(f,{mediaComponentFormat:null!==(N=Xo.format)&&void 0!==N?N:r.IMAGE,uploadMedia:So.uploadMedia,variableListForImage:L||[],useEditWhatsappTemplateMediaResponse:So,setOpenEditMedia:So.setOpenEditMedia,openEditMedia:So.openEditMedia,editIconRef:So.editIconRef,fileRef:Uo})})):n(T,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:Vo?"420px":"auto"}},{children:[!!Po.imageComponent&&!Vo&&n(O,{children:[o(h,{imageName:null!==(A=null===(P=null==Xo?void 0:Xo.example)||void 0===P?void 0:P.header_handle)&&void 0!==A?A:[],handleImageChange:So.handleImageChange,mediaType:null==Xo?void 0:Xo.format,error:So.error,isLoading:So.loading,setOpenEditMedia:So.setOpenEditMedia,selectedVariable:m(null!==(H=null===(D=null===(_=null==Xo?void 0:Xo.example)||void 0===_?void 0:_.header_handle)||void 0===D?void 0:D[0])&&void 0!==H?H:"")?null===(F=null===(S=null==Xo?void 0:Xo.example)||void 0===S?void 0:S.header_handle)||void 0===F?void 0:F[0]:(null===(q=null===(Q=null==V?void 0:V.mapping)||void 0===Q?void 0:Q.header)||void 0===q?void 0:q[0])?null===(K=null===(Y=null==V?void 0:V.mapping)||void 0===Y?void 0:Y.header)||void 0===K?void 0:K[0]:So.selectedVariable}),(null==Io?void 0:Io.format)==r.DOCUMENT?o(B,{children:o(d,{labelText:"PDF Name",placeholder:"Enter the name",value:qo,errorMessage:Ko||void 0,onBlur:()=>{if(!qo)return null==w||w(""),void Wo("PDF name is Required");const o=v(qo);null==w||w(qo),Wo(o?"Please enter a valid PDF name":void 0)},onChangeText:o=>{Wo(""),Yo(o)}})}):o(e,{})]}),(null===(W=Po.bodyVariables)||void 0===W?void 0:W.length)>0&&o(y,{containerStyle:{paddingTop:Po.mediaComponent?24:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}),null===($=Po.descriptionComponents)||void 0===$?void 0:$.map(((n,e)=>o(x,{originalVariableList:null!=Eo&&Eo>-1?To.cards[Eo]:To,type:n.type,descriptionComponent:n.component,showVariableModal:I},e))),(null===(z=null===(X=null!=Eo&&Eo>-1?null===(G=To.cards[Eo])||void 0===G?void 0:G.buttons:null==To?void 0:To.buttons)||void 0===X?void 0:X.filter((o=>"URL"===o.type)))||void 0===z?void 0:z.length)>0&&o(y,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(oo=null===(Z=null!=Eo&&Eo>-1?null===(J=To.cards[Eo])||void 0===J?void 0:J.buttons:null==To?void 0:To.buttons)||void 0===Z?void 0:Z.filter((o=>xo===p.CHATBOT||"URL"===o.type)))||void 0===oo?void 0:oo.map(((n,e)=>{if("URL"===n.type)return o(E,{variableListIndex:e,CTAoptions:null==k?void 0:k.CTAoptions,button:n,currentVariableList:null!=Eo&&Eo>-1?Object.assign({},To.cards[Eo]):Object.assign({},To),updateSelectedURLTemplateBtn:$o},`${e}_${Eo}`)})),xo===p.CHATBOT&&(null===(eo=null===(no=ko[0])||void 0===no?void 0:no.component)||void 0===eo?void 0:eo.buttons)&&(null===(lo=null===(io=null===(to=ko[0])||void 0===to?void 0:to.component)||void 0===io?void 0:io.buttons)||void 0===lo?void 0:lo.length)>0&&o(b,{backTrackMessage:null===(ao=null==yo?void 0:yo.backTrackExtra)||void 0===ao?void 0:ao[0],setBackTrackMessage:null===(so=null==yo?void 0:yo.backTrackExtra)||void 0===so?void 0:so[1]}),(null===(uo=null===(po=null!=Eo&&Eo>-1?null===(ro=To.cards[Eo])||void 0===ro?void 0:ro.buttons:null==To?void 0:To.buttons)||void 0===po?void 0:po.filter((o=>"QUICK_REPLY"===o.type)))||void 0===uo?void 0:uo.length)>0&&(xo!==p.CHATBOT?o(y,{headerText:"Edit buttons",subText:"Edit the chatflows triggered on clicking  the buttons",toolTipInfo:"There is an option to trigger chatflows through the buttons which can keep the user engaged"}):o(b,{backTrackMessage:null===(co=null==yo?void 0:yo.backTrackExtra)||void 0===co?void 0:co[0],setBackTrackMessage:null===(mo=null==yo?void 0:yo.backTrackExtra)||void 0===mo?void 0:mo[1]})),null===(go=null===(bo=null!=Eo&&Eo>-1?null===(vo=To.cards[Eo])||void 0===vo?void 0:vo.buttons:null==To?void 0:To.buttons)||void 0===bo?void 0:bo.filter((o=>"QUICK_REPLY"===o.type)))||void 0===go?void 0:go.map(((n,e)=>{if("QUICK_REPLY"===n.type&&xo!==p.CHATBOT)return o(E,{variableListIndex:e,QRBoptions:null==k?void 0:k.QRBoptions,button:n,currentVariableList:null!=Eo&&Eo>-1?Object.assign({},To.cards[Eo]):Object.assign({},To),updateSelectedQRBTemplateBtn:Go},`${e}_${Eo}`)})),xo===p.CHATBOT&&wo&&o(g,{discountCode:null===(fo=null==yo?void 0:yo.discountCodeExtra)||void 0===fo?void 0:fo[0],setDiscountCode:null===(ho=null==yo?void 0:yo.discountCodeExtra)||void 0===ho?void 0:ho[1]}),null===(jo=null!=Eo&&Eo>-1?null===(Oo=To.cards[Eo])||void 0===Oo?void 0:Oo.buttons:null==To?void 0:To.buttons)||void 0===jo?void 0:jo.map(((n,e)=>{var t,i,l;if("COPY_CODE"===n.type)return o(C,{index:e,variable:{variableName:null!==(t=n.text)&&void 0!==t?t:"Copy Code",updatedValue:null!==(i=n.buttonVariable)&&void 0!==i?i:"",type:"string",isEditableVariable:!0,index:null!==(l=n.index)&&void 0!==l?l:0},showVariableModal:!0,componentType:"BUTTONS",buttonType:n.type},e)}))]}))},B=s.div`
+import{jsx as o,jsxs as e,Fragment as n}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import{useRef as i,useState as l,useEffect as a}from"react";import d from"styled-components";import{Input as s}from"../../input/Input.js";import{HEADER_TYPES as r}from"../../template-preview/models/TemplateMeta.js";import{POD as p}from"../../template-preview/models/WhatsAppTemplate.js";import{useTemplateModalContext as u}from"../context/templateModalContext.js";import{getAllDataFromTemplateComponent as c}from"../utils/getDataFromTemplateComponent.js";import{isVariable as v}from"../utils/validateIsUrl.js";import{validateInputName as m}from"../utils/validateName.js";import{BackTrackComponent as b}from"./BackTrackComponent.js";import{DiscountCodeComponent as g}from"./DiscountCodeComponent.js";import f from"./EditMediaModal.js";import h from"./EditMediaV2.js";import{EditTemplateMediaContainer as O}from"./EditMediaV2.style.js";import{useEditWhatsappTemplateMedia as j}from"./useEditWhtasappTemplateMedia.js";import C from"./VariableConnector.js";import{Container as T}from"./VariableConnectorsPanel.js";import x from"./VariableConnectorWhatsApp.js";import y from"./VariableEditorHeader.js";import E from"./WhatsAppTemplateCardButtonV2.js";const V=d=>{let{template:V,onTemplateChange:M,whatsappSpecificPickerMeta:k,showVariableModal:I,variableListForImage:L,setDiscountCode:R,fileName:U,setFileName:w}=d;var N,P,A,_,D,H,S,F,Q,q,Y,K,W,$,G,X,z,J,Z,oo,eo,no,to,io,lo,ao,so,ro,po,uo,co,vo,mo,bo,go,fo,ho,Oo,jo;const Co=V.isCarouselType,{originalVariableList:To,pod:xo,extras:yo,selectedCarouselIndex:Eo,isProductCarouselType:Vo,disableCopyCode:Bo}=u(),{descriptionComponents:Mo,urlBtns:ko,qrbBtns:Io,imageComponent:Lo,bodyVariables:Ro,headerVariables:Uo}=c(V),wo=i(null),[No,Po]=l(!1),[Ao,_o]=l(-1===Eo?{descriptionComponents:Mo,urlBtns:ko,qrbBtns:Io,imageComponent:Lo,bodyVariables:Ro,headerVariables:Uo}:{}),{uploadMediaLink:Do,uploadMediaFiles:Ho,validateMimeType:So}=k,Fo=j({uploadMediaLink:Do,uploadMediaFiles:Ho,updateTemplateImageUrl:function(o,e){var n,i,l,a,d,s,r,p;let u;u=null!=Eo&&Eo>-1?{components:null===(i=null===(n=V.components[1])||void 0===n?void 0:n.cards)||void 0===i?void 0:i[Eo].components,mapping:null===(a=null===(l=null==V?void 0:V.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Eo]}:Object.assign({},V);const c=null===(d=null==u?void 0:u.components)||void 0===d?void 0:d.findIndex((o=>{if("HEADER"===o.type&&"NONE"!==o.format&&"TEXT"!==o.format)return!0}));if(void 0!==c&&c>-1&&(null==u?void 0:u.components[c])){const n=Object.assign(Object.assign({},u.components[c]),{format:e,example:{header_handle:[o]}}),t=[...u.components];t[c]=n,u=Object.assign(Object.assign({},u),{components:t})}u.mapping&&(u.mapping=Object.assign(Object.assign({},u.mapping),{header:void 0}));if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=u.components,(null===(s=null==o?void 0:o.mapping)||void 0===s?void 0:s.cards)&&(null===(r=null==o?void 0:o.mapping)||void 0===r?void 0:r.cards.length)>0&&(o.mapping.cards[Eo]=null!==(p=u.mapping)&&void 0!==p?p:{}),null==M||M(Object.assign({},o)),qo(!0)}else null==M||M(Object.assign({},u))},validateMimeType:So,mediaComponent:Co?Ao.imageComponent:Lo,fileRef:wo}),[Qo,qo]=l(!1),[Yo,Ko]=l(U),[Wo,$o]=l();function Go(o,e,n){var i,l,a,d,s,r,p,u,c,v;const m=null!=Eo&&Eo>-1?{components:null===(i=Object.assign({},V).components[1].cards)||void 0===i?void 0:i[Eo].components,mapping:null===(l=Object.assign({},V).mapping.cards)||void 0===l?void 0:l[Eo]}:Object.assign({},V),b=t(m),g="custom"===e&&"string"==typeof o,f=g?o:"string"!=typeof o?o.defaultValue?o.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=Eo&&Eo>-1&&Vo){const e=Object.assign({},V).components.map((o=>{var e;return"CAROUSEL"===o.type?Object.assign(Object.assign({},o),{cards:null===(e=o.cards)||void 0===e?void 0:e.map((o=>Object.assign(Object.assign({},o),{components:o.components.map((o=>{var e,t,i;if("BUTTONS"===o.type){const l=null===(e=o.buttons)||void 0===e?void 0:e.filter((o=>"URL"===o.type));let a=null!==(t=null==l?void 0:l[n])&&void 0!==t?t:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[f]});const d=null===(i=o.buttons)||void 0===i?void 0:i.map((o=>"URL"===o.type&&(null==o?void 0:o.text)===(null==a?void 0:a.text)?a:o));return Object.assign(Object.assign({},o),{buttons:d})}return o}))})))}):o})),i=null===(d=null===(a=Object.assign({},V).mapping)||void 0===a?void 0:a.cards)||void 0===d?void 0:d.map((e=>{var n;return Object.assign(Object.assign({},e),{buttons:null===(n=null==e?void 0:e.buttons)||void 0===n?void 0:n.map((e=>g?"((customBtnPlaceholder))":"string"!=typeof o?o.placeHolder:""))})})),l=t(V);return l.components=e,l.mapping.cards=i,void(null==M||M(Object.assign({},l)))}const h=null==b?void 0:b.components.findIndex((o=>"BUTTONS"===o.type));if(void 0!==h&&h>-1){const t=null===(s=null==b?void 0:b.components[h].buttons)||void 0===s?void 0:s.filter((o=>"URL"===o.type));if((null==t?void 0:t.length)>0){const i="custom"===e&&"string"==typeof o,l=i?o:"string"!=typeof o&&o.defaultValue?o.defaultValue:"https://d.bik.ai/";let a=t[n];a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]});const d=[...null!==(u=null===(p=null===(r=b.components)||void 0===r?void 0:r[h])||void 0===p?void 0:p.buttons)&&void 0!==u?u:[]].map((o=>"URL"===o.type&&(null==o?void 0:o.text)===(null==a?void 0:a.text)?a:o)),s=Object.assign(Object.assign({},b.components[h]),{buttons:d}),v=null===(c=b.mapping)||void 0===c?void 0:c.buttons;v&&v.length>0&&(v[n]=i?"((customBtnPlaceholder))":"string"!=typeof o?o.placeHolder:"");const m=Object.assign(Object.assign({},b.mapping),{buttons:v});b.mapping=m;const g=[...b.components];g[h]=s,b.components=g}}if("string"!=typeof o){"checkout.checkoutUrl"===(null===(v=o.placeHolder)||void 0===v?void 0:v.slice(2,-2))?Po(!0):(Po(!1),null==R||R(""))}if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=b.components,o.mapping.cards[Eo]=b.mapping,null==M||M(Object.assign({},o))}else null==M||M(b)}function Xo(o,e,n){var i,l,a,d,s,r,p;const u=null!=Eo&&Eo>-1?{components:null===(i=Object.assign({},V).components[1].cards)||void 0===i?void 0:i[Eo].components,mapping:null===(l=Object.assign({},V).mapping.cards)||void 0===l?void 0:l[Eo]}:Object.assign({},V);if(null!=Eo&&Eo>-1&&Vo){const e=Object.assign({},V).components.map((e=>{var t;return"CAROUSEL"===e.type?Object.assign(Object.assign({},e),{cards:null===(t=e.cards)||void 0===t?void 0:t.map((e=>Object.assign(Object.assign({},e),{components:e.components.map((e=>{var t,i,l;if("BUTTONS"===e.type){const a=null===(t=null==e?void 0:e.buttons)||void 0===t?void 0:t.filter((o=>"QUICK_REPLY"===o.type));let d=null!==(i=null==a?void 0:a[n])&&void 0!==i?i:{};d=Object.assign(Object.assign({},d),{flowId:o.flowId,flowName:o.flowName});const s=null===(l=null==e?void 0:e.buttons)||void 0===l?void 0:l.map((o=>"QUICK_REPLY"===o.type&&(null==o?void 0:o.text)===(null==d?void 0:d.text)?d:o));return Object.assign(Object.assign({},e),{buttons:s})}return e}))})))}):e})),i=t(V);return i.components=e,void(null==M||M(Object.assign({},i)))}const c=null==u?void 0:u.components.findIndex((o=>"BUTTONS"===o.type));if(void 0!==c&&c>-1){const e=null===(d=null===(a=null==u?void 0:u.components[c])||void 0===a?void 0:a.buttons)||void 0===d?void 0:d.filter((o=>"QUICK_REPLY"===o.type));if(e){let t=e[n];t=Object.assign(Object.assign({},t),{flowId:o.flowId,flowName:o.flowName});const i=[...null!==(p=null===(r=null===(s=u.components)||void 0===s?void 0:s[c])||void 0===r?void 0:r.buttons)&&void 0!==p?p:[]].map((o=>"QUICK_REPLY"===o.type&&(null==o?void 0:o.text)===(null==t?void 0:t.text)?t:o)),l=Object.assign(Object.assign({},u.components[c]),{buttons:i}),a=[...u.components];a[c]=l,u.components=a}}if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=u.components,null==M||M(Object.assign({},o))}else null==M||M(u)}a((()=>{var o,e;if(null===(o=V.mapping.buttons)||void 0===o?void 0:o.find((o=>"checkout.checkoutUrl"===o.slice(2,-2))))Po(!0);else{Po(!1);const o=null===(e=null==yo?void 0:yo.discountCodeExtra)||void 0===e?void 0:e[1];null==o||o("")}}),[V]),a((()=>{var o,e,n,t;if(null!=Eo&&Eo>-1){const i={components:null===(e=null===(o=V.components[1])||void 0===o?void 0:o.cards)||void 0===e?void 0:e[Eo].components,mapping:null===(t=null===(n=null==V?void 0:V.mapping)||void 0===n?void 0:n.cards)||void 0===t?void 0:t[Eo]},{descriptionComponents:l,urlBtns:a,qrbBtns:d,imageComponent:s,bodyVariables:r,headerVariables:p}=c(i);_o({descriptionComponents:l,urlBtns:a,qrbBtns:d,imageComponent:s,bodyVariables:r,headerVariables:p})}else if(null!=Eo&&-1===Eo){const{descriptionComponents:o,urlBtns:e,qrbBtns:n,imageComponent:t,bodyVariables:i,headerVariables:l}=c(V);_o({descriptionComponents:o,urlBtns:e,qrbBtns:n,imageComponent:t,bodyVariables:i,headerVariables:l})}}),[Eo]),a((()=>{var o,e,n,t;if(null!=Eo&&Eo>-1&&Qo){const i={components:null===(e=null===(o=V.components[1])||void 0===o?void 0:o.cards)||void 0===e?void 0:e[Eo].components,mapping:null===(t=null===(n=null==V?void 0:V.mapping)||void 0===n?void 0:n.cards)||void 0===t?void 0:t[Eo]},{descriptionComponents:l,urlBtns:a,qrbBtns:d,imageComponent:s,bodyVariables:r,headerVariables:p}=c(i);_o({descriptionComponents:l,urlBtns:a,qrbBtns:d,imageComponent:s,bodyVariables:r,headerVariables:p}),qo(!1)}}),[Qo]);const zo=Co?Ao.imageComponent:Lo;return Fo.openEditMedia?o(T,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:o(f,{mediaComponentFormat:null!==(N=zo.format)&&void 0!==N?N:r.IMAGE,uploadMedia:Fo.uploadMedia,variableListForImage:L||[],useEditWhatsappTemplateMediaResponse:Fo,setOpenEditMedia:Fo.setOpenEditMedia,openEditMedia:Fo.openEditMedia,editIconRef:Fo.editIconRef,fileRef:wo})})):e(T,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:Vo?"420px":"auto"}},{children:[!!Ao.imageComponent&&!Vo&&e(O,{children:[o(h,{imageName:null!==(A=null===(P=null==zo?void 0:zo.example)||void 0===P?void 0:P.header_handle)&&void 0!==A?A:[],handleImageChange:Fo.handleImageChange,mediaType:null==zo?void 0:zo.format,error:Fo.error,isLoading:Fo.loading,setOpenEditMedia:Fo.setOpenEditMedia,selectedVariable:v(null!==(H=null===(D=null===(_=null==zo?void 0:zo.example)||void 0===_?void 0:_.header_handle)||void 0===D?void 0:D[0])&&void 0!==H?H:"")?null===(F=null===(S=null==zo?void 0:zo.example)||void 0===S?void 0:S.header_handle)||void 0===F?void 0:F[0]:(null===(q=null===(Q=null==V?void 0:V.mapping)||void 0===Q?void 0:Q.header)||void 0===q?void 0:q[0])?null===(K=null===(Y=null==V?void 0:V.mapping)||void 0===Y?void 0:Y.header)||void 0===K?void 0:K[0]:Fo.selectedVariable}),(null==Lo?void 0:Lo.format)==r.DOCUMENT?o(B,{children:o(s,{labelText:"PDF Name",placeholder:"Enter the name",value:Yo,errorMessage:Wo||void 0,onBlur:()=>{if(!Yo)return null==w||w(""),void $o("PDF name is Required");const o=m(Yo);null==w||w(Yo),$o(o?"Please enter a valid PDF name":void 0)},onChangeText:o=>{$o(""),Ko(o)}})}):o(n,{})]}),(null===(W=Ao.bodyVariables)||void 0===W?void 0:W.length)>0&&o(y,{containerStyle:{paddingTop:Ao.mediaComponent?24:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}),null===($=Ao.descriptionComponents)||void 0===$?void 0:$.map(((e,n)=>o(x,{originalVariableList:null!=Eo&&Eo>-1?To.cards[Eo]:To,type:e.type,descriptionComponent:e.component,showVariableModal:I},n))),(null===(z=null===(X=null!=Eo&&Eo>-1?null===(G=To.cards[Eo])||void 0===G?void 0:G.buttons:null==To?void 0:To.buttons)||void 0===X?void 0:X.filter((o=>"URL"===o.type)))||void 0===z?void 0:z.length)>0&&o(y,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(oo=null===(Z=null!=Eo&&Eo>-1?null===(J=To.cards[Eo])||void 0===J?void 0:J.buttons:null==To?void 0:To.buttons)||void 0===Z?void 0:Z.filter((o=>xo===p.CHATBOT||"URL"===o.type)))||void 0===oo?void 0:oo.map(((e,n)=>{if("URL"===e.type)return o(E,{variableListIndex:n,CTAoptions:null==k?void 0:k.CTAoptions,button:e,currentVariableList:null!=Eo&&Eo>-1?Object.assign({},To.cards[Eo]):Object.assign({},To),updateSelectedURLTemplateBtn:Go},`${n}_${Eo}`)})),xo===p.CHATBOT&&(null===(no=null===(eo=Io[0])||void 0===eo?void 0:eo.component)||void 0===no?void 0:no.buttons)&&(null===(lo=null===(io=null===(to=Io[0])||void 0===to?void 0:to.component)||void 0===io?void 0:io.buttons)||void 0===lo?void 0:lo.length)>0&&o(b,{backTrackMessage:null===(ao=null==yo?void 0:yo.backTrackExtra)||void 0===ao?void 0:ao[0],setBackTrackMessage:null===(so=null==yo?void 0:yo.backTrackExtra)||void 0===so?void 0:so[1]}),(null===(uo=null===(po=null!=Eo&&Eo>-1?null===(ro=To.cards[Eo])||void 0===ro?void 0:ro.buttons:null==To?void 0:To.buttons)||void 0===po?void 0:po.filter((o=>"QUICK_REPLY"===o.type)))||void 0===uo?void 0:uo.length)>0&&(xo!==p.CHATBOT?o(y,{headerText:"Edit buttons",subText:"Edit the chatflows triggered on clicking  the buttons",toolTipInfo:"There is an option to trigger chatflows through the buttons which can keep the user engaged"}):o(b,{backTrackMessage:null===(co=null==yo?void 0:yo.backTrackExtra)||void 0===co?void 0:co[0],setBackTrackMessage:null===(vo=null==yo?void 0:yo.backTrackExtra)||void 0===vo?void 0:vo[1]})),null===(go=null===(bo=null!=Eo&&Eo>-1?null===(mo=To.cards[Eo])||void 0===mo?void 0:mo.buttons:null==To?void 0:To.buttons)||void 0===bo?void 0:bo.filter((o=>"QUICK_REPLY"===o.type)))||void 0===go?void 0:go.map(((e,n)=>{if("QUICK_REPLY"===e.type&&xo!==p.CHATBOT)return o(E,{variableListIndex:n,QRBoptions:null==k?void 0:k.QRBoptions,button:e,currentVariableList:null!=Eo&&Eo>-1?Object.assign({},To.cards[Eo]):Object.assign({},To),updateSelectedQRBTemplateBtn:Xo},`${n}_${Eo}`)})),xo===p.CHATBOT&&No&&o(g,{discountCode:null===(fo=null==yo?void 0:yo.discountCodeExtra)||void 0===fo?void 0:fo[0],setDiscountCode:null===(ho=null==yo?void 0:yo.discountCodeExtra)||void 0===ho?void 0:ho[1]}),null===(jo=null!=Eo&&Eo>-1?null===(Oo=To.cards[Eo])||void 0===Oo?void 0:Oo.buttons:null==To?void 0:To.buttons)||void 0===jo?void 0:jo.map(((e,t)=>{var i,l,a,d,r;if("COPY_CODE"===e.type)return o(n,{children:Bo?o("div",Object.assign({style:{marginBottom:20,borderRadius:4,padding:"8px 10px"}},{children:o(s,{state:"disabled",labelText:null!==(i=e.text)&&void 0!==i?i:"Copy Code",value:null!==(l=e.buttonVariable)&&void 0!==l?l:"",onChangeText:()=>{}})})):o(C,{index:t,variable:{variableName:null!==(a=e.text)&&void 0!==a?a:"Copy Code",updatedValue:null!==(d=e.buttonVariable)&&void 0!==d?d:"",type:"string",isEditableVariable:!0,index:null!==(r=e.index)&&void 0!==r?r:0},showVariableModal:!0,componentType:"BUTTONS",buttonType:e.type},t)})}))]}))},B=d.div`
 	padding-top: 24px;
 	padding-left: 10px;
 	padding-right: 10px;

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

@@ -1,16 +1,19 @@
-import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import a from"../../../assets/icons/edit.svg.js";import{format as i}from"date-fns";import{cloneDeep as n}from"lodash";import{useState as o,useEffect as s}from"react";import u from"styled-components";import{CustomDateTime as d}from"../../custom-date-time/CustomDateTime.js";import{Dropdown as r}from"../../dropdown/Dropdown.js";import{Input as c}from"../../input/Input.js";import{truncate as p}from"../../product-picker-v2/collectionScreen.js";import{placeHolderNamePattern as m}from"../../template-preview/constants/regexPatterns.js";import{CHANNEL_TYPE as v}from"../../template-preview/models/Channels.js";import{WEB_PUSH_COMPONENT_TYPE as b}from"../../template-preview/models/WebpushTemplate.js";import{POD as g,BUTTON_TYPE as O}from"../../template-preview/models/WhatsAppTemplate.js";import{BodySecondary as j,BodyPrimary as y}from"../../TypographyStyle.js";import h from"../../../utils/StringUtils.js";import{COLORS as f}from"../../../constants/Theme.js";import{useTemplateModalContext as x}from"../context/templateModalContext.js";import{updateVariables as _}from"../custom-hooks/useAdditionalVariables.js";import{getVariableNameForEmailByIndex as T}from"../utils/getVariableNameEmail.js";import{QueryParamsComponent as E}from"./QueryParamsComponent.js";const V=u.div`
+import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import a from"../../../assets/icons/edit.svg.js";import i from"../../../assets/icons/info.svg.js";import{format as n}from"date-fns";import{cloneDeep as o}from"lodash";import{useState as s,useEffect as u}from"react";import d from"styled-components";import{Alert as r}from"../../alerts/Alert.js";import{ALERT_TYPES as c}from"../../alerts/AlertHelper.js";import{CustomDateTime as p}from"../../custom-date-time/CustomDateTime.js";import{Dropdown as m}from"../../dropdown/Dropdown.js";import{Input as v}from"../../input/Input.js";import{truncate as b}from"../../product-picker-v2/collectionScreen.js";import{placeHolderNamePattern as g}from"../../template-preview/constants/regexPatterns.js";import{CHANNEL_TYPE as O}from"../../template-preview/models/Channels.js";import{WEB_PUSH_COMPONENT_TYPE as y}from"../../template-preview/models/WebpushTemplate.js";import{POD as h,BUTTON_TYPE as j}from"../../template-preview/models/WhatsAppTemplate.js";import{BodySecondary as f,BodyPrimary as x}from"../../TypographyStyle.js";import _ from"../../../utils/StringUtils.js";import{COLORS as T}from"../../../constants/Theme.js";import{useTemplateModalContext as E}from"../context/templateModalContext.js";import{updateVariables as C}from"../custom-hooks/useAdditionalVariables.js";import{getVariableNameForEmailByIndex as V}from"../utils/getVariableNameEmail.js";import{QueryParamsComponent as k}from"./QueryParamsComponent.js";const S=d.div`
 	/* surface/$color-background-warning-light */
 
-	background: ${e=>e.focused&&e.channel===v.EMAIL?f.background.warning.light:"transparent"};
+	background: ${e=>e.focused&&e.channel===O.EMAIL?T.background.warning.light:"transparent"};
 	border-radius: 4px;
 	padding: 8px 10px;
-`,k=u.div`
+`,B=d.div`
 	position: absolute;
 	top: 0;
 	left: 0;
 	width: 100%;
 	height: 100%;
-	background-color: rgba(0, 0, 0, 0.1);
 	z-index: 1000;
 	cursor: not-allowed;
-`,C={value:"custom_link",label:"Custom URL"},S={value:"custom_text",label:"Custom text"},B={value:"static_expiry",label:"Static Expiry"},P=u=>{let{onFocus:P,variable:A,index:D,showVariableModal:L,setShowDiscountCheckBox:w,componentType:N,CTAoptions:U,buttonType:H}=u;var W,R,I,Y,M,$,z,Z,q;const[G,F]=o(!1),[K,Q]=o(""),[J,X]=o([]),[ee,te]=o(),[le,ae]=o(!1),{variableList:ie,setVariableList:ne,setVariableCallback:oe,setShowVariablePicker:se,device:ue,channel:de,isError:re,originalVariableList:ce,template:pe,templateSelectionTriggered:me,setTemplate:ve,setDisplayContent:be,setOriginalVariableList:ge,globalNormalizedPlaceholders:Oe,enabledCustomText:je,pod:ye,selectedCarouselIndex:he,isProductCarouselType:fe,isWhatsappCarousel:xe,disableEditVariable:_e,disableEditExpiry:Te,templateErrorIndexes:Ee,maxCharLimit:Ve}=x();function ke(e,t){var l,a,i,n;const o=e;Q(""),te(o),de===v.WHATSAPP?"custom_text"!==o.value&&"custom_link"!==o.value&&"static_expiry"!==o.value?(Se(null!==(l=o.value)&&void 0!==l?l:"","string"),null==Be||Be(null!==(a=A.index)&&void 0!==a?a:0,o.value,!0)):(null==Be||Be(null!==(i=A.index)&&void 0!==i?i:0,"",!0,o.value),Se("","url"===o.bikPlaceholderType?"link":"string")):"custom_text"!==o.value&&"custom_link"!==o.value?(Se(o.value,"url"===o.bikPlaceholderType?"link":"string"),de==v.WEBPUSH&&(null==Ae||Ae(null!==(n=A.index)&&void 0!==n?n:0,o.value))):(Q(""),Se("",o.value))}function Ce(e,t){var l,a;Q(t);const i="custom_link"===(null==ee?void 0:ee.value)&&t?t.includes("https")?t:`https://${t}`:t;Se(i,"static_expiry"===e?"string":e),de===v.WHATSAPP&&(null==Be||Be(null!==(l=A.index)&&void 0!==l?l:0,i,"custom_link"===e,e)),de===v.WEBPUSH&&(null==Ae||Ae(null!==(a=A.index)&&void 0!==a?a:0,i))}function Se(e,t,l){var a,i,o,s;const u="custom_link"===t?"link":"custom_text"===t?"string":t;if(de!==v.WHATSAPP&&de!==v.WEBPUSH){const l=T(D+1),i=null===document||void 0===document?void 0:document.getElementById("mobile"===ue?"template_html_mobile":"template_html_desktop"),n=de===v.EMAIL?null===(a=null==i?void 0:i.contentWindow)||void 0===a?void 0:a.document.getElementById(l):document.getElementById(l);n&&(n.textContent="custom_text"!==t&&"custom_link"!==t||e?e:A.variableName);const o=ce.map(((t,l)=>l===D?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t));null==ge||ge(o)}if(de===v.WEBPUSH){const t=ce,l=t=>null==t?void 0:t.map(((t,l)=>l===D?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)),a={BODY:"BODY"===N?l(t.body):t.body,TITLE:N===b.TITLE.toUpperCase()?l(t.title):t.title};null==ge||ge((e=>Object.assign(Object.assign({},e),{title:a.TITLE,body:a.BODY,buttons:t.buttons})))}if(de===v.WHATSAPP){if(null!=he&&he>-1&&fe){const l=Object.assign({},ce).cards.map(((l,a)=>{var i,n;return"BODY"===N?Object.assign(Object.assign({},l),{body:null===(i=l.body)||void 0===i?void 0:i.map(((t,l)=>D===l?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t))}):"BUTTONS"===N?Object.assign(Object.assign({},l),{buttons:null===(n=l.buttons)||void 0===n?void 0:n.map(((l,a)=>a===D?Object.assign(Object.assign({},l),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===l.type?e:[e]}):l))}):l}));return void(null==ge||ge((e=>Object.assign(Object.assign({},e),{cards:l}))))}const a=null!=he&&he>-1?ce.cards[he]:ce;let d=a.body,r=a.header,c=a.buttons;if("BODY"===N?d=null===(i=a.body)||void 0===i?void 0:i.map(((t,l)=>l===D?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"HEADER"===N?r=null===(o=a.header)||void 0===o?void 0:o.map(((t,l)=>l===D?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"BUTTONS"===N&&(c=null===(s=a.buttons)||void 0===s?void 0:s.map(((a,i)=>i===D?Object.assign(Object.assign({},a),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===a.type?e:[e],queryParams:null!=l?l:[]}):a))),null!=he&&he>-1){const e=n(ce.cards);e[he]={header:r,body:d,buttons:c},null==ge||ge((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==ge||ge((e=>Object.assign(Object.assign({},e),{header:r,body:d,buttons:c})))}}function Be(e,t,l,a){var i,o,s,u,d,r,c;if(null!=he&&he>-1&&fe){const o=Object.assign({},pe).components.map((l=>{var a;return"CAROUSEL"===l.type?Object.assign(Object.assign({},l),{cards:null===(a=l.cards)||void 0===a?void 0:a.map((l=>Object.assign(Object.assign({},l),{components:l.components.map((l=>{var a,i,n,o,s,u;if("BODY"===l.type&&"BODY"===N){if(null===(i=null===(a=l.example)||void 0===a?void 0:a.body_text)||void 0===i?void 0:i[0]){const a=[...null!==(s=null===(o=null===(n=l.example)||void 0===n?void 0:n.body_text)||void 0===o?void 0:o[0])&&void 0!==s?s:[]];a[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const i=Object.assign(Object.assign({},l.example),{body_text:[a]});return Object.assign(Object.assign({},l),{example:i})}return l}if("BUTTONS"===l.type&&"BUTTONS"===N){const a=null===(u=l.buttons)||void 0===u?void 0:u.map(((l,a)=>a===e?Object.assign(Object.assign({},l),{example:[t]}):l));return a?Object.assign(Object.assign({},l),{buttons:a}):l}return l}))})))}):l})),s=n(pe);if(l){const l=null===(i=Object.assign({},pe).mapping.cards)||void 0===i?void 0:i.map(((l,i)=>{var n,o,s;if("BODY"===N)return Object.assign(Object.assign({},l),{body:null===(n=l.body)||void 0===n?void 0:n.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+10}))`:t:l))});if("BUTTONS"===N&&(null==l?void 0:l.buttons)){let n=-1,u=-1;return null===(o=pe.components[1].cards)||void 0===o||o[i].components.forEach((t=>{var l;"BUTTONS"===t.type&&(null===(l=t.buttons)||void 0===l||l.forEach(((t,l)=>{"URL"===t.type&&(n++,l===e&&"URL"==t.type&&(u=n))})))})),Object.assign(Object.assign({},l),{buttons:null===(s=l.buttons)||void 0===s?void 0:s.map(((e,l)=>l===u?"custom_link"===a?"((customPlaceholderName))":t:e))})}return l}));s.mapping.cards=l}return s.components=o,void(null==ve||ve(s))}const p=null!=he&&he>-1?{components:null===(o=Object.assign({},pe).components[1].cards)||void 0===o?void 0:o[he].components,mapping:null===(s=Object.assign({},pe).mapping.cards)||void 0===s?void 0:s[he]}:Object.assign({},pe),m=null===(u=null==p?void 0:p.components)||void 0===u?void 0:u.map((l=>{var a,i,n,o,s,u,d,r,c;const p=Object.assign({},l);if("BODY"===l.type&&"BODY"===N){if(null===(i=null===(a=l.example)||void 0===a?void 0:a.body_text)||void 0===i?void 0:i[0]){const l=[...null!==(s=null===(o=null===(n=p.example)||void 0===n?void 0:n.body_text)||void 0===o?void 0:o[0])&&void 0!==s?s:[]];l[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=Object.assign(Object.assign({},p.example),{body_text:[l]});return Object.assign(Object.assign({},p),{example:a})}}else if("HEADER"===l.type&&"HEADER"===N){if(null===(u=l.example)||void 0===u?void 0:u.header_text){const l=[...null!==(r=null===(d=p.example)||void 0===d?void 0:d.header_text)&&void 0!==r?r:[]];l[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=Object.assign(Object.assign({},p.example),{header_text:l});return Object.assign(Object.assign({},p),{example:a})}}else{if("BUTTONS"===l.type&&"BUTTONS"===N){const a=null===(c=l.buttons)||void 0===c?void 0:c.map(((l,a)=>a===e?Object.assign(Object.assign({},l),{example:"COPY_CODE"===l.type?t:[t]}):l));return a?Object.assign(Object.assign({},p),{buttons:a}):p}if("limited_time_offer"===l.type&&"limited_time_offer"===N)return Object.assign(Object.assign({},p),{example:Object.assign(Object.assign({},p.example),{limited_time_offer:t})})}return l}));if(p.components=m,l)if("BODY"===N&&(null===(d=null==p?void 0:p.mapping)||void 0===d?void 0:d.body))p.mapping=Object.assign(Object.assign({},p.mapping),{body:p.mapping.body.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+10}))`:t:l))});else if("HEADER"===N&&(null===(r=null==p?void 0:p.mapping)||void 0===r?void 0:r.header))p.mapping=Object.assign(Object.assign({},p.mapping),{header:p.mapping.header.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+20}))`:t:l))});else if("BUTTONS"===N&&(null===(c=null==p?void 0:p.mapping)||void 0===c?void 0:c.buttons)){let l=-1,i=-1;m.forEach((t=>{var a;"BUTTONS"===t.type&&(null===(a=t.buttons)||void 0===a||a.forEach(((t,a)=>{"URL"===t.type&&(l++,a===e&&"URL"==t.type&&(i=l))})))})),p.mapping=Object.assign(Object.assign({},p.mapping),{buttons:p.mapping.buttons.map(((e,l)=>l===i?"custom_link"===a?"((customPlaceholderName))":t:e))})}if(null!=he&&he>-1&&pe){const e=n(pe);e.components[1].cards[he].components=p.components,e.mapping.cards[he]=p.mapping,null==ve||ve(e)}else null==ve||ve(Object.assign({},p))}s((()=>{G&&(null==P||P())}),[G]),s((()=>{!function(){var e,t,l,a,i;const n="mobile"===ue?"template_html_mobile":"template_html_desktop",o=document.getElementById(n),s=(null!==(a=null===(l=null===(t=null===(e=null==o?void 0:o.contentWindow)||void 0===e?void 0:e.document)||void 0===t?void 0:t.body)||void 0===l?void 0:l.innerHTML)&&void 0!==a?a:"")+(null===(i=null==o?void 0:o.contentWindow)||void 0===i?void 0:i.document.head.innerHTML);de===v.EMAIL&&(null==be||be(s))}()}),[me]),s((()=>{!function(){var e,t;const l=[];let a=[];if(de!==v.MESSAGE||je){"link"===(null==A?void 0:A.type)?(l.push({label:"",options:[C,S]}),te(C)):"date_time"===(null==A?void 0:A.type)?(l.push({label:"",options:[C,S]}),te(B)):(l.push({label:"",options:[C,S,B]}),te(S));const e=null!=Oe?Oe:[];X([...l,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:h.toCapitilize(null===(l=null===(t=e.label)||void 0===t?void 0:t.replace(/([A-Z])/g," $1"))||void 0===l?void 0:l.toLowerCase())})}))]),a=[...l,...e]}else{const e=null!=Oe?Oe:[];X([{label:"",options:[S,C]},...e]),a=[{label:"",options:[S,C]},...e]}if((de===v.WHATSAPP||de===v.EMAIL||de===v.MESSAGE||de===v.WEBPUSH)&&A.updatedValue)if(m.test(A.updatedValue)&&de===v.WHATSAPP||A.updatedValue.startsWith("{{")&&de!==v.WHATSAPP){const e=function(e,t,l){var a;let i={label:"",value:""};const n=l===v.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(L){let t=e.updatedValue;if(ye===g.CHATBOT&&"BUTTONS"===N){const l=null==U?void 0:U.filter((t=>t.placeHolder===e.updatedValue));l&&l.length>0&&(t=l[0].label)}i={label:t?t.replace("{{","").replace("}}","").trim().replace("."," "):"",value:null!==(a=e.updatedValue)&&void 0!==a?a:""}}else t.map((e=>{e.options.map((e=>{var t;(null===(t=e.value)||void 0===t?void 0:t.replace("{{","").replace("}}","").trim())===n.trim()&&(i=e)}))}));return i}(A,a,de);e.value&&te(e)}else"date_time"===A.type?(te(B),Q(A.updatedValue),Be(null!==(e=A.index)&&void 0!==e?e:0,A.updatedValue)):(null===(t=A.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(te(C),Q(A.updatedValue.split("https://")[1])):(te(S),Q(A.updatedValue))}()}),[he]),s((()=>{ue&&ee&&K&&setTimeout((()=>{Se("custom_link"===(null==ee?void 0:ee.value)&&K?K.includes("https")?K:`https://${K}`:K,ee.value)}),100)}),[ue]),s((()=>{!le&&ee&&A.updatedValue&&setTimeout((()=>{Se("custom_link"===(null==ee?void 0:ee.value)&&A.updatedValue?A.updatedValue.includes("https")?A.updatedValue:`https://${A.updatedValue}`:A.updatedValue,ee.value),ae(!0)}),100)}),[ee]);const Pe=e=>{null==w||w(!1),"{{custom.url}}"===e.actualValue?ke({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?ke({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?ke({label:e.displayName,selected:!0,value:"static_expiry"}):ke({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})};function Ae(e,t){var l;const a=n(pe),i=N.toLocaleLowerCase();(null===(l=a.webpushBroadcastConfig)||void 0===l?void 0:l[i])&&(a.webpushBroadcastConfig[i][e]=t),null==ve||ve(Object.assign({},a))}return e(V,Object.assign({channel:de,focused:G,onMouseEnter:()=>F(!0),onMouseLeave:()=>F(!1)},{children:[t("div",Object.assign({style:{marginBottom:8}},{children:e(j,Object.assign({style:{color:re&&!ee?f.content.negative:f.content.primary}},{children:[null===(W=A.variableName)||void 0===W?void 0:W.replace("{{","").replace("}}","")," ","link"===(null==A?void 0:A.type)?"link":"variable"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:L?e("div",Object.assign({style:{display:"flex",border:"#E0E0E0 1px solid",borderRadius:4,padding:10,justifyContent:(null==ee?void 0:ee.label)?"space-between":"flex-end"}},{children:[t(y,Object.assign({numberOfLines:1},{children:ye===g.CHATBOT?["static_expiry","custom_text","custom_link"].includes(null!==(R=null==ee?void 0:ee.value)&&void 0!==R?R:"")?null==ee?void 0:ee.label:null==ee?void 0:ee.value:p(null!==(I=null==ee?void 0:ee.label)&&void 0!==I?I:"",20,!0)})),_e||"date_time"===(null==A?void 0:A.type)&&Te?t(l,{}):t(a,{onClick:()=>{(()=>{if(H===O.URL&&ye===g.CHATBOT){const e=_({variableList:ie,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom URL",variableValue:"{{custom.url}}"});ne(e)}else if("limited_time_offer"===N){const e=_({variableList:ie,categoryDisplayName:"Static Variables",variableDisplayName:"Static Expiry",variableValue:"{{static.expiry}}"});ne(e)}else if(H===O.COPY_CODE){const e=_({variableList:ie,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom Text",variableValue:"{{custom.text}}"});ne(e)}})(),oe((()=>Pe)),se(!0)},width:24,height:24,color:f.content.primary})]})):t(r,{disabled:_e,options:J,isSearchable:!1,onSelect:ke,defaultOptions:ee?[Object.assign(Object.assign({},ee),{selected:!0})]:[]})})),("custom_text"===(null==ee?void 0:ee.value)||"custom_link"===(null==ee?void 0:ee.value))&&t(c,{state:_e?"disabled":"none",labelText:"custom_text"===(null==ee?void 0:ee.value)?"Custom text value":"custom_link"===(null==ee?void 0:ee.value)?"Custom URL value":"",id:`variable-value-${null==ee?void 0:ee.value}-${D}`,value:K,errorMessage:re&&(null===(Y=null==Ee?void 0:Ee.buttons)||void 0===Y?void 0:Y.includes(null!==(M=null==A?void 0:A.index)&&void 0!==M?M:-1))?K&&0!==K.trim().length?"custom_link"!==ee.value||/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/.test(`https://${K.trim()}`)&&0!==K.trim().length?"custom_link"!==ee.value&&K.length>30?"Length cannot be more than 30":"BUTTONS"===N&&"custom_link"!==ee.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:Ve||("custom_link"===(null==ee?void 0:ee.value)?2e3:"BUTTONS"===N?15:30),noKeyDownChange:!0,prefixText:"custom_link"===(null==ee?void 0:ee.value)?"https://":"",placeholder:"link"===A.type||"custom_link"===ee.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{Ce(ee.value,e)}}),"static_expiry"===(null==ee?void 0:ee.value)&&e("div",Object.assign({style:{position:"relative"}},{children:[_e&&t(k,{onClick:e=>e.preventDefault()}),t(d,{placement:"auto",time:i(K?new Date(K):new Date,"hh:mm a"),date:K?new Date(K):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{Ce("static_expiry",e.toISOString())}})]})),"link"===A.type&&"custom_link"!==(null==ee?void 0:ee.value)&&!fe&&!xe&&ye===g.CHATBOT&&t(E,{isError:null!==(Z=null===($=null==Ee?void 0:Ee.buttons)||void 0===$?void 0:$.includes(null!==(z=null==A?void 0:A.index)&&void 0!==z?z:-1))&&void 0!==Z&&Z,params:null!==(q=A.queryParams)&&void 0!==q?q:[],onChange:e=>{Se(A.updatedValue,"link",e)},variableValue:A.updatedValue})]}))};export{V as Container,P as default};
+`,A=d.div`
+	height: 100%;
+	width: 48%;
+	background: rgba(0, 0, 0, 0.1);
+`,P={value:"custom_link",label:"Custom URL"},D={value:"custom_text",label:"Custom text"},w={value:"static_expiry",label:"Static Expiry"},L=d=>{var L,N,U,H,W,R,I,Y,M;const{onFocus:$,variable:z,index:Z,showVariableModal:q,setShowDiscountCheckBox:G,componentType:F,CTAoptions:K,buttonType:Q}=d,[J,X]=s(!1),[ee,te]=s(""),[le,ae]=s([]),[ie,ne]=s(),[oe,se]=s(!1),{variableList:ue,setVariableList:de,setVariableCallback:re,setShowVariablePicker:ce,device:pe,channel:me,isError:ve,originalVariableList:be,template:ge,templateSelectionTriggered:Oe,setTemplate:ye,setDisplayContent:he,setOriginalVariableList:je,globalNormalizedPlaceholders:fe,enabledCustomText:xe,pod:_e,selectedCarouselIndex:Te,isProductCarouselType:Ee,isWhatsappCarousel:Ce,disableEditVariable:Ve,disableEditExpiry:ke,templateErrorIndexes:Se,maxCharLimit:Be,disableDatePicker:Ae,showDiscountCodeExpiryInfo:Pe}=E();function De(e,t){var l,a,i,n;const o=e;te(""),ne(o),me===O.WHATSAPP?"custom_text"!==o.value&&"custom_link"!==o.value&&"static_expiry"!==o.value?(Le(null!==(l=o.value)&&void 0!==l?l:"","string"),null==Ne||Ne(null!==(a=z.index)&&void 0!==a?a:0,o.value,!0)):(null==Ne||Ne(null!==(i=z.index)&&void 0!==i?i:0,"",!0,o.value),Le("","url"===o.bikPlaceholderType?"link":"string")):"custom_text"!==o.value&&"custom_link"!==o.value?(Le(o.value,"url"===o.bikPlaceholderType?"link":"string"),me==O.WEBPUSH&&(null==He||He(null!==(n=z.index)&&void 0!==n?n:0,o.value))):(te(""),Le("",o.value))}function we(e,t){var l,a;te(t);const i="custom_link"===(null==ie?void 0:ie.value)&&t?t.includes("https")?t:`https://${t}`:t;Le(i,"static_expiry"===e?"string":e),me===O.WHATSAPP&&(null==Ne||Ne(null!==(l=z.index)&&void 0!==l?l:0,i,"custom_link"===e,e)),me===O.WEBPUSH&&(null==He||He(null!==(a=z.index)&&void 0!==a?a:0,i))}function Le(e,t,l){var a,i,n,s;const u="custom_link"===t?"link":"custom_text"===t?"string":t;if(me!==O.WHATSAPP&&me!==O.WEBPUSH){const l=V(Z+1),i=null===document||void 0===document?void 0:document.getElementById("mobile"===pe?"template_html_mobile":"template_html_desktop"),n=me===O.EMAIL?null===(a=null==i?void 0:i.contentWindow)||void 0===a?void 0:a.document.getElementById(l):document.getElementById(l);n&&(n.textContent="custom_text"!==t&&"custom_link"!==t||e?e:z.variableName);const o=be.map(((t,l)=>l===Z?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t));null==je||je(o)}if(me===O.WEBPUSH){const t=be,l=t=>null==t?void 0:t.map(((t,l)=>l===Z?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)),a={BODY:"BODY"===F?l(t.body):t.body,TITLE:F===y.TITLE.toUpperCase()?l(t.title):t.title};null==je||je((e=>Object.assign(Object.assign({},e),{title:a.TITLE,body:a.BODY,buttons:t.buttons})))}if(me===O.WHATSAPP){if(null!=Te&&Te>-1&&Ee){const l=Object.assign({},be).cards.map(((l,a)=>{var i,n;return"BODY"===F?Object.assign(Object.assign({},l),{body:null===(i=l.body)||void 0===i?void 0:i.map(((t,l)=>Z===l?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t))}):"BUTTONS"===F?Object.assign(Object.assign({},l),{buttons:null===(n=l.buttons)||void 0===n?void 0:n.map(((l,a)=>a===Z?Object.assign(Object.assign({},l),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===l.type?e:[e]}):l))}):l}));return void(null==je||je((e=>Object.assign(Object.assign({},e),{cards:l}))))}const a=null!=Te&&Te>-1?be.cards[Te]:be;let d=a.body,r=a.header,c=a.buttons;if("BODY"===F?d=null===(i=a.body)||void 0===i?void 0:i.map(((t,l)=>l===Z?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"HEADER"===F?r=null===(n=a.header)||void 0===n?void 0:n.map(((t,l)=>l===Z?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"BUTTONS"===F&&(c=null===(s=a.buttons)||void 0===s?void 0:s.map(((a,i)=>i===Z?Object.assign(Object.assign({},a),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===a.type?e:[e],queryParams:null!=l?l:[]}):a))),null!=Te&&Te>-1){const e=o(be.cards);e[Te]={header:r,body:d,buttons:c},null==je||je((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==je||je((e=>Object.assign(Object.assign({},e),{header:r,body:d,buttons:c})))}}function Ne(e,t,l,a){var i,n,s,u,d,r,c;if(null!=Te&&Te>-1&&Ee){const n=Object.assign({},ge).components.map((l=>{var a;return"CAROUSEL"===l.type?Object.assign(Object.assign({},l),{cards:null===(a=l.cards)||void 0===a?void 0:a.map((l=>Object.assign(Object.assign({},l),{components:l.components.map((l=>{var a,i,n,o,s,u;if("BODY"===l.type&&"BODY"===F){if(null===(i=null===(a=l.example)||void 0===a?void 0:a.body_text)||void 0===i?void 0:i[0]){const a=[...null!==(s=null===(o=null===(n=l.example)||void 0===n?void 0:n.body_text)||void 0===o?void 0:o[0])&&void 0!==s?s:[]];a[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const i=Object.assign(Object.assign({},l.example),{body_text:[a]});return Object.assign(Object.assign({},l),{example:i})}return l}if("BUTTONS"===l.type&&"BUTTONS"===F){const a=null===(u=l.buttons)||void 0===u?void 0:u.map(((l,a)=>a===e?Object.assign(Object.assign({},l),{example:[t]}):l));return a?Object.assign(Object.assign({},l),{buttons:a}):l}return l}))})))}):l})),s=o(ge);if(l){const l=null===(i=Object.assign({},ge).mapping.cards)||void 0===i?void 0:i.map(((l,i)=>{var n,o,s;if("BODY"===F)return Object.assign(Object.assign({},l),{body:null===(n=l.body)||void 0===n?void 0:n.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+10}))`:t:l))});if("BUTTONS"===F&&(null==l?void 0:l.buttons)){let n=-1,u=-1;return null===(o=ge.components[1].cards)||void 0===o||o[i].components.forEach((t=>{var l;"BUTTONS"===t.type&&(null===(l=t.buttons)||void 0===l||l.forEach(((t,l)=>{"URL"===t.type&&(n++,l===e&&"URL"==t.type&&(u=n))})))})),Object.assign(Object.assign({},l),{buttons:null===(s=l.buttons)||void 0===s?void 0:s.map(((e,l)=>l===u?"custom_link"===a?"((customPlaceholderName))":t:e))})}return l}));s.mapping.cards=l}return s.components=n,void(null==ye||ye(s))}const p=null!=Te&&Te>-1?{components:null===(n=Object.assign({},ge).components[1].cards)||void 0===n?void 0:n[Te].components,mapping:null===(s=Object.assign({},ge).mapping.cards)||void 0===s?void 0:s[Te]}:Object.assign({},ge),m=null===(u=null==p?void 0:p.components)||void 0===u?void 0:u.map((l=>{var a,i,n,o,s,u,d,r,c;const p=Object.assign({},l);if("BODY"===l.type&&"BODY"===F){if(null===(i=null===(a=l.example)||void 0===a?void 0:a.body_text)||void 0===i?void 0:i[0]){const l=[...null!==(s=null===(o=null===(n=p.example)||void 0===n?void 0:n.body_text)||void 0===o?void 0:o[0])&&void 0!==s?s:[]];l[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=Object.assign(Object.assign({},p.example),{body_text:[l]});return Object.assign(Object.assign({},p),{example:a})}}else if("HEADER"===l.type&&"HEADER"===F){if(null===(u=l.example)||void 0===u?void 0:u.header_text){const l=[...null!==(r=null===(d=p.example)||void 0===d?void 0:d.header_text)&&void 0!==r?r:[]];l[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=Object.assign(Object.assign({},p.example),{header_text:l});return Object.assign(Object.assign({},p),{example:a})}}else{if("BUTTONS"===l.type&&"BUTTONS"===F){const a=null===(c=l.buttons)||void 0===c?void 0:c.map(((l,a)=>a===e?Object.assign(Object.assign({},l),{example:"COPY_CODE"===l.type?t:[t]}):l));return a?Object.assign(Object.assign({},p),{buttons:a}):p}if("limited_time_offer"===l.type&&"limited_time_offer"===F)return Object.assign(Object.assign({},p),{example:Object.assign(Object.assign({},p.example),{limited_time_offer:t})})}return l}));if(p.components=m,l)if("BODY"===F&&(null===(d=null==p?void 0:p.mapping)||void 0===d?void 0:d.body))p.mapping=Object.assign(Object.assign({},p.mapping),{body:p.mapping.body.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+10}))`:t:l))});else if("HEADER"===F&&(null===(r=null==p?void 0:p.mapping)||void 0===r?void 0:r.header))p.mapping=Object.assign(Object.assign({},p.mapping),{header:p.mapping.header.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+20}))`:t:l))});else if("BUTTONS"===F&&(null===(c=null==p?void 0:p.mapping)||void 0===c?void 0:c.buttons)){let l=-1,i=-1;m.forEach((t=>{var a;"BUTTONS"===t.type&&(null===(a=t.buttons)||void 0===a||a.forEach(((t,a)=>{"URL"===t.type&&(l++,a===e&&"URL"==t.type&&(i=l))})))})),p.mapping=Object.assign(Object.assign({},p.mapping),{buttons:p.mapping.buttons.map(((e,l)=>l===i?"custom_link"===a?"((customPlaceholderName))":t:e))})}if(null!=Te&&Te>-1&&ge){const e=o(ge);e.components[1].cards[Te].components=p.components,e.mapping.cards[Te]=p.mapping,null==ye||ye(e)}else null==ye||ye(Object.assign({},p))}u((()=>{J&&(null==$||$())}),[J]),u((()=>{!function(){var e,t,l,a,i;const n="mobile"===pe?"template_html_mobile":"template_html_desktop",o=document.getElementById(n),s=(null!==(a=null===(l=null===(t=null===(e=null==o?void 0:o.contentWindow)||void 0===e?void 0:e.document)||void 0===t?void 0:t.body)||void 0===l?void 0:l.innerHTML)&&void 0!==a?a:"")+(null===(i=null==o?void 0:o.contentWindow)||void 0===i?void 0:i.document.head.innerHTML);me===O.EMAIL&&(null==he||he(s))}()}),[Oe]),u((()=>{!function(){var e,t;const l=[];let a=[];if(me!==O.MESSAGE||xe){"link"===(null==z?void 0:z.type)?(l.push({label:"",options:[P,D]}),ne(P)):"date_time"===(null==z?void 0:z.type)?(l.push({label:"",options:[P,D]}),ne(w)):(l.push({label:"",options:[P,D,w]}),ne(D));const e=null!=fe?fe:[];ae([...l,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:_.toCapitilize(null===(l=null===(t=e.label)||void 0===t?void 0:t.replace(/([A-Z])/g," $1"))||void 0===l?void 0:l.toLowerCase())})}))]),a=[...l,...e]}else{const e=null!=fe?fe:[];ae([{label:"",options:[D,P]},...e]),a=[{label:"",options:[D,P]},...e]}if((me===O.WHATSAPP||me===O.EMAIL||me===O.MESSAGE||me===O.WEBPUSH)&&z.updatedValue)if(g.test(z.updatedValue)&&me===O.WHATSAPP||z.updatedValue.startsWith("{{")&&me!==O.WHATSAPP){const e=function(e,t,l){var a;let i={label:"",value:""};const n=l===O.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(q){let t=e.updatedValue;if(_e===h.CHATBOT&&"BUTTONS"===F){const l=null==K?void 0:K.filter((t=>t.placeHolder===e.updatedValue));l&&l.length>0&&(t=l[0].label)}i={label:t?t.replace("{{","").replace("}}","").trim().replace("."," "):"",value:null!==(a=e.updatedValue)&&void 0!==a?a:""}}else t.map((e=>{e.options.map((e=>{var t;(null===(t=e.value)||void 0===t?void 0:t.replace("{{","").replace("}}","").trim())===n.trim()&&(i=e)}))}));return i}(z,a,me);e.value&&ne(e)}else"date_time"===z.type?(ne(w),te(z.updatedValue),Ne(null!==(e=z.index)&&void 0!==e?e:0,z.updatedValue)):(null===(t=z.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(ne(P),te(z.updatedValue.split("https://")[1])):(ne(D),te(z.updatedValue))}()}),[Te]),u((()=>{pe&&ie&&ee&&setTimeout((()=>{Le("custom_link"===(null==ie?void 0:ie.value)&&ee?ee.includes("https")?ee:`https://${ee}`:ee,ie.value)}),100)}),[pe]),u((()=>{!oe&&ie&&z.updatedValue&&setTimeout((()=>{Le("custom_link"===(null==ie?void 0:ie.value)&&z.updatedValue?z.updatedValue.includes("https")?z.updatedValue:`https://${z.updatedValue}`:z.updatedValue,ie.value),se(!0)}),100)}),[ie]);const Ue=e=>{null==G||G(!1),"{{custom.url}}"===e.actualValue?De({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?De({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?De({label:e.displayName,selected:!0,value:"static_expiry"}):De({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})};function He(e,t){var l;const a=o(ge),i=F.toLocaleLowerCase();(null===(l=a.webpushBroadcastConfig)||void 0===l?void 0:l[i])&&(a.webpushBroadcastConfig[i][e]=t),null==ye||ye(Object.assign({},a))}return e(S,Object.assign({channel:me,focused:J,onMouseEnter:()=>X(!0),onMouseLeave:()=>X(!1)},{children:[t("div",Object.assign({style:{marginBottom:8}},{children:e(f,Object.assign({style:{color:ve&&!ie?T.content.negative:T.content.primary}},{children:[null===(L=z.variableName)||void 0===L?void 0:L.replace("{{","").replace("}}","")," ","link"===(null==z?void 0:z.type)?"link":"variable"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:q?e("div",Object.assign({style:{display:"flex",border:"#E0E0E0 1px solid",borderRadius:4,padding:10,justifyContent:(null==ie?void 0:ie.label)?"space-between":"flex-end"}},{children:[t(x,Object.assign({numberOfLines:1},{children:_e===h.CHATBOT?["static_expiry","custom_text","custom_link"].includes(null!==(N=null==ie?void 0:ie.value)&&void 0!==N?N:"")?null==ie?void 0:ie.label:null==ie?void 0:ie.value:b(null!==(U=null==ie?void 0:ie.label)&&void 0!==U?U:"",20,!0)})),Ve||"date_time"===(null==z?void 0:z.type)&&ke?t(l,{}):t(a,{onClick:()=>{(()=>{if(Q===j.URL&&_e===h.CHATBOT){const e=C({variableList:ue,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom URL",variableValue:"{{custom.url}}"});de(e)}else if("limited_time_offer"===F){const e=C({variableList:ue,categoryDisplayName:"Static Variables",variableDisplayName:"Static Expiry",variableValue:"{{static.expiry}}"});de(e)}else if(Q===j.COPY_CODE){const e=C({variableList:ue,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom Text",variableValue:"{{custom.text}}"});de(e)}})(),re((()=>Ue)),ce(!0)},width:24,height:24,color:T.content.primary})]})):t(m,{disabled:Ve,options:le,isSearchable:!1,onSelect:De,defaultOptions:ie?[Object.assign(Object.assign({},ie),{selected:!0})]:[]})})),("custom_text"===(null==ie?void 0:ie.value)||"custom_link"===(null==ie?void 0:ie.value))&&t(v,{state:Ve?"disabled":"none",labelText:"custom_text"===(null==ie?void 0:ie.value)?"Custom text value":"custom_link"===(null==ie?void 0:ie.value)?"Custom URL value":"",id:`variable-value-${null==ie?void 0:ie.value}-${Z}`,value:ee,errorMessage:ve&&(null===(H=null==Se?void 0:Se.buttons)||void 0===H?void 0:H.includes(null!==(W=null==z?void 0:z.index)&&void 0!==W?W:-1))?ee&&0!==ee.trim().length?"custom_link"!==ie.value||/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/.test(`https://${ee.trim()}`)&&0!==ee.trim().length?"custom_link"!==ie.value&&ee.length>30?"Length cannot be more than 30":"BUTTONS"===F&&"custom_link"!==ie.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:Be||("custom_link"===(null==ie?void 0:ie.value)?2e3:"BUTTONS"===F?15:30),noKeyDownChange:!0,prefixText:"custom_link"===(null==ie?void 0:ie.value)?"https://":"",placeholder:"link"===z.type||"custom_link"===ie.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{we(ie.value,e)}}),"static_expiry"===(null==ie?void 0:ie.value)&&e("div",Object.assign({style:{position:"relative"}},{children:[(Ve||Ae)&&e(B,Object.assign({onClick:e=>e.preventDefault(),style:{display:"flex",justifyContent:"space-between"}},{children:[t(A,{}),t(A,{})]})),t(p,{placement:"auto",time:n(ee?new Date(ee):new Date,"hh:mm a"),date:ee?new Date(ee):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{we("static_expiry",e.toISOString())}})]})),"static_expiry"===(null==ie?void 0:ie.value)&&Pe&&t("div",Object.assign({style:{marginTop:8}},{children:t(r,{containerStyle:{padding:"4px 8px"},icon:()=>t(i,{width:16,height:16,color:T.content.secondary}),type:c.NEUTRAL,text:"Please use the same expiration code that you applied when creating \nthe code on Shopify"})})),"link"===z.type&&"custom_link"!==(null==ie?void 0:ie.value)&&!Ee&&!Ce&&_e===h.CHATBOT&&t(k,{isError:null!==(Y=null===(R=null==Se?void 0:Se.buttons)||void 0===R?void 0:R.includes(null!==(I=null==z?void 0:z.index)&&void 0!==I?I:-1))&&void 0!==Y&&Y,params:null!==(M=z.queryParams)&&void 0!==M?M:[],onChange:e=>{Le(z.updatedValue,"link",e)},variableValue:z.updatedValue})]}))};export{S as Container,L as default};

package/dist/esm/components/template-context-mapper/modalElements/VariableConnectorWhatsApp.d.ts

@@ -10,5 +10,5 @@ export interface VariableConnectorWhatsAppProps {
     originalList?: WhatsAppTemplateVariables | WebpushTemplateVariables | AllTemplateVariables;
     channel?: CHANNEL_TYPE;
 }
-declare const VariableConnectorWhatsApp: ({ descriptionComponent, type, showVariableModal, originalList, channel, }: VariableConnectorWhatsAppProps) => import("react/jsx-runtime").JSX.Element;
+declare const VariableConnectorWhatsApp: (props: VariableConnectorWhatsAppProps) => import("react/jsx-runtime").JSX.Element;
 export default VariableConnectorWhatsApp;

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

@@ -1 +1 @@
-import{jsx as e,jsxs as i,Fragment as a}from"react/jsx-runtime";import{Input as t}from"../../input/Input.js";import"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{COLORS as l}from"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import"../../variable-picker-v3/model.js";import"../../template-preview/models/TemplateMeta.js";import"../../template-preview/models/WhatsAppTemplate.js";import{CHANNEL_TYPE as r}from"../../template-preview/models/Channels.js";import{BodySecondary as o}from"../../TypographyStyle.js";import{useTemplateModalContext as p}from"../context/templateModalContext.js";import d from"./VariableConnector.js";const n=n=>{let{descriptionComponent:s,type:m,showVariableModal:v,originalList:c,channel:b}=n;var h,u,x,j,y,f;const{originalVariableList:T,disableEditVariable:w,selectedCarouselIndex:E}=p();let g=T;b&&b==r.WHATSAPP&&c&&(g=c);const V=s.type;return"BODY"===V||"TITLE"===V.toLocaleUpperCase()?e("div",{children:null===(h=null!=E&&E>-1?g.cards[E].body:"TITLE"===V.toLocaleUpperCase()?null==g?void 0:g.title:null==g?void 0:g.body)||void 0===h?void 0:h.map(((a,r)=>w||!a.isEditableVariable?i("div",Object.assign({style:{margin:"16px 8px"}},{children:[i(o,Object.assign({style:{color:l.content.primary}},{children:["HEADER"===m?"Header":""," Locked variable ",r+1]})),e(t,{state:"disabled",placeholder:a.variableName,onChangeText:()=>{}})]}),r):e(d,{index:r,variable:a,showVariableModal:v,componentType:V},`${r}-${a.index}`)))}):"HEADER"===V?e("div",{children:null===(u=null!=E&&E>-1?g.cards[E].header:null==g?void 0:g.header)||void 0===u?void 0:u.map(((a,r)=>a.isEditableVariable?e(d,{index:r,variable:a,showVariableModal:v,componentType:V},`${r}-${a.index}`):i("div",Object.assign({style:{margin:"16px 8px"}},{children:[i(o,Object.assign({style:{color:l.content.primary}},{children:["HEADER"===m?"Header":""," Locked variable ",r+1]})),e(t,{state:"disabled",placeholder:a.variableName,onChangeText:()=>{}})]}),r)))}):"limited_time_offer"===V?e("div",{children:e(d,{index:0,variable:{variableName:null!==(j=null===(x=null==s?void 0:s.limited_time_offer)||void 0===x?void 0:x.text)&&void 0!==j?j:"Expires after",updatedValue:null!==(f=null===(y=s.example)||void 0===y?void 0:y.limited_time_offer)&&void 0!==f?f:(new Date).toISOString(),type:"date_time",isEditableVariable:!0,index:0},showVariableModal:v,componentType:V},`${V}`)}):e(a,{})};export{n as default};
+import{jsx as e,jsxs as i,Fragment as t}from"react/jsx-runtime";import{Input as a}from"../../input/Input.js";import"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{COLORS as l}from"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import"../../variable-picker-v3/model.js";import"../../template-preview/models/TemplateMeta.js";import"../../template-preview/models/WhatsAppTemplate.js";import{CHANNEL_TYPE as r}from"../../template-preview/models/Channels.js";import{BodySecondary as o}from"../../TypographyStyle.js";import{useTemplateModalContext as n}from"../context/templateModalContext.js";import p from"./VariableConnector.js";const d=d=>{var s,m,v,c,b,h;const{descriptionComponent:u,type:x,showVariableModal:f,originalList:j,channel:y}=d,{originalVariableList:T,disableEditVariable:w,selectedCarouselIndex:E,initialExpiryDateTime:g}=n();let V=T;y&&y==r.WHATSAPP&&j&&(V=j);const A=u.type;if("BODY"===A||"TITLE"===A.toLocaleUpperCase())return e("div",{children:null===(s=null!=E&&E>-1?V.cards[E].body:"TITLE"===A.toLocaleUpperCase()?null==V?void 0:V.title:null==V?void 0:V.body)||void 0===s?void 0:s.map(((t,r)=>w||!t.isEditableVariable?i("div",Object.assign({style:{margin:"16px 8px"}},{children:[i(o,Object.assign({style:{color:l.content.primary}},{children:["HEADER"===x?"Header":""," Locked variable ",r+1]})),e(a,{state:"disabled",placeholder:t.variableName,onChangeText:()=>{}})]}),r):e(p,{index:r,variable:t,showVariableModal:f,componentType:A},`${r}-${t.index}`)))});if("HEADER"===A)return e("div",{children:null===(m=null!=E&&E>-1?V.cards[E].header:null==V?void 0:V.header)||void 0===m?void 0:m.map(((t,r)=>t.isEditableVariable?e(p,{index:r,variable:t,showVariableModal:f,componentType:A},`${r}-${t.index}`):i("div",Object.assign({style:{margin:"16px 8px"}},{children:[i(o,Object.assign({style:{color:l.content.primary}},{children:["HEADER"===x?"Header":""," Locked variable ",r+1]})),e(a,{state:"disabled",placeholder:t.variableName,onChangeText:()=>{}})]}),r)))});if("limited_time_offer"===A){let i=null!==(c=null===(v=u.example)||void 0===v?void 0:v.limited_time_offer)&&void 0!==c?c:(new Date).toISOString();return g&&(i=new Date(g).toISOString()),e("div",{children:e(p,{index:0,variable:{variableName:null!==(h=null===(b=null==u?void 0:u.limited_time_offer)||void 0===b?void 0:b.text)&&void 0!==h?h:"Expires after",updatedValue:i,type:"date_time",isEditableVariable:!0,index:0},showVariableModal:f,componentType:A},`${A}`)})}return e(t,{})};export{d as default};

package/dist/esm/components/template-preview/models/TemplateMeta.d.ts

@@ -10,6 +10,7 @@ export type CUSTOM_VARIABLE = {
         key: string;
         value: string;
     }[];
+    initialValue?: string;
 };
 export type QueryParamtype = {
     key: string;

package/dist/esm/index.d.ts

@@ -88,4 +88,3 @@ export * from './components/ai-modals';
 export * from './components/input-with-vars/customPortal';
 export * from './components/floating-input-dropdown';
 export * from './components/dropdown/MultilevelDropdownPopover';
-export * from './components/dropShadow';