@bikdotai/bik-component-library 0.0.585 → 0.0.586-am.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
- package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsDropdown.d.ts +1 -0
- package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsDropdown.js +1 -1
- package/dist/cjs/components/template-context-mapper/TemplateContextMapper.d.ts +3 -1
- package/dist/cjs/components/template-context-mapper/TemplateContextMapper.js +1 -1
- package/dist/cjs/components/template-context-mapper/context/templateModalContext.d.ts +4 -0
- package/dist/cjs/components/template-context-mapper/context/templateModalContext.js +1 -1
- package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +2 -2
- package/dist/cjs/components/template-context-mapper/modalElements/VariableConnector.js +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
- package/dist/esm/components/analytics-chips-and-dropdowns/AnalyticsDropdown.d.ts +1 -0
- package/dist/esm/components/analytics-chips-and-dropdowns/AnalyticsDropdown.js +1 -1
- package/dist/esm/components/template-context-mapper/TemplateContextMapper.d.ts +3 -1
- package/dist/esm/components/template-context-mapper/TemplateContextMapper.js +1 -1
- package/dist/esm/components/template-context-mapper/context/templateModalContext.d.ts +4 -0
- package/dist/esm/components/template-context-mapper/context/templateModalContext.js +1 -1
- package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +1 -1
- package/dist/esm/components/template-context-mapper/modalElements/VariableConnector.js +3 -3
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const EventsTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default EventsTrigger;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const IGTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default IGTrigger;
|
package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { DropdownOption } from "../../../dropdown/type";
|
|
3
|
-
import { QueryBuilderProperty } from "../../
|
|
4
|
-
import { QueryBuilderNodeProps } from "../../
|
|
3
|
+
import { QueryBuilderProperty } from "../../Types/QueryBuilder.type";
|
|
4
|
+
import { QueryBuilderNodeProps } from "../../Types/QueryBuilderNodeProps.type";
|
|
5
5
|
declare const BaseTriggerQueryBuilderNode: React.FC<QueryBuilderNodeProps & {
|
|
6
6
|
cacheKey: string;
|
|
7
7
|
propertyAddBtnText: string;
|
|
@@ -34,6 +34,7 @@ export interface AnalyticsDropdownInterface {
|
|
|
34
34
|
datePickerPlacement?: DropDirection;
|
|
35
35
|
closeDropdown?: boolean;
|
|
36
36
|
labelColor?: string;
|
|
37
|
+
styleProps?: React.CSSProperties;
|
|
37
38
|
}
|
|
38
39
|
export declare const AnalyticsDropdown: React.FC<AnalyticsDropdownInterface>;
|
|
39
40
|
export declare const EachItem: React.FC<{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),o=require("react-bootstrap"),s=require("../../constants/Theme.js"),n=require("../datePicker/DatePicker.js");require("react-calendar"),require("../../utils/DateUtils.js");var i=require("../TypographyStyle.js");require("../datePicker/DatePickerWrapper.styled.js");var l=require("./CommonStyles.js");const a=t=>{let{eachOption:o,selectedOption:n,selectedDate:a,onClickingEachItem:r,rangeSelection:c,isLastItem:u,isFirstItem:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),o=require("react-bootstrap"),s=require("../../constants/Theme.js"),n=require("../datePicker/DatePicker.js");require("react-calendar"),require("../../utils/DateUtils.js");var i=require("../TypographyStyle.js");require("../datePicker/DatePickerWrapper.styled.js");var l=require("./CommonStyles.js");const a=t=>{let{eachOption:o,selectedOption:n,selectedDate:a,onClickingEachItem:r,rangeSelection:c,isLastItem:u,isFirstItem:p}=t;return e.jsxs(l.ItemMenuContainer,Object.assign({isFirstItem:p,isLastItem:u,onClick:()=>r(o),isSelected:o.isCustom?o.key==(null==n?void 0:n.key)&&!!a:o.key==(null==n?void 0:n.key)},{children:[e.jsx(i.BodySecondary,Object.assign({color:o.key==(null==n?void 0:n.key)?s.BASE_COLORS.positive[900]:s.BASE_COLORS.grayscale[900]},{children:o.label})),o.subLabel?e.jsx(i.BodyCaption,Object.assign({style:{color:s.BASE_COLORS.grayscale[700]}},{children:o.subLabel})):e.jsx(e.Fragment,{}),a&&(null==n?void 0:n.isCustom)&&o.key==(null==n?void 0:n.key)&&e.jsx(i.BodyCaption,{children:c?`${d(a[0])} to ${d(a[1])}`:`${d(a[0])}`})]}),o.key)},d=e=>e.toLocaleString("default",{day:"numeric",month:"short",year:"numeric"});exports.AnalyticsDropdown=r=>{let{options:c,placeholder:u="Select an option",selected:p,onOptionSelected:g,resetDropdown:m,maxHeight:v,backgroundcolor:j,calendarPopperConfig:O,variant:y="default",datePickerPlacement:b,closeDropdown:D,labelColor:S,styleProps:h}=r;var x,f,k;const[w,C]=t.useState(!1),[R,E]=t.useState(p),[I,L]=t.useState(),[F,q]=t.useState(!1),P=()=>{!w&&q(!F)},[T,A]=t.useState(p),M="small"===y?i.Caption:i.BodySecondary;return t.useEffect((()=>{m&&E(void 0)}),[m]),t.useEffect((()=>{var e;(null==p?void 0:p.isCustom)&&(null===(e=p.dateRangeSelectionOptions)||void 0===e?void 0:e.selectedDates)?L(p.dateRangeSelectionOptions.selectedDates):L(void 0),E(p)}),[p]),t.useEffect((()=>{q(!1),C(!1)}),[D]),e.jsx(e.Fragment,{children:e.jsxs(l.MainDropdown,Object.assign({drop:"down",show:F,onToggle:P,bgColor:j,id:"analytic-dropdown"},{children:[e.jsx(o.Dropdown.Toggle,Object.assign({id:"dropdown-autoclose-outside",className:"main--dropdown",style:"small"===y?{display:"flex",alignItems:"center",gap:6,padding:"4px 8px",backgroundColor:"#FAFAFA",borderRadius:4,border:`1px solid ${s.DEFAULT_THEME.colorsV2.stroke.primary}`}:h||void 0},{children:e.jsx(M,Object.assign({style:"small"===y||S?{color:S||s.DEFAULT_THEME.colorsV2.content.secondary}:void 0},{children:(null==R?void 0:R.isCustom)?I?d(I[0])===d(I[1])?`${d(I[0])}`:`${d(I[0])} to ${d(I[1])}`:(null==T?void 0:T.label)?null==T?void 0:T.label:u:R?null==R?void 0:R.label:u}))})),e.jsx(o.Dropdown.Menu,Object.assign({className:"main--dropdown"},{children:e.jsxs(l.MainDropdown,Object.assign({drop:null!=b?b:"end",id:"sub--dropdown",show:w,onToggle:e=>{!e&&q(!1),C(!w)}},{children:[e.jsx("div",Object.assign({style:{maxHeight:v||"auto",overflowY:"scroll"}},{children:c.map(((t,s)=>{var n;return e.jsx("div",{children:(null==t?void 0:t.isCustom)?e.jsx(o.Dropdown.Toggle,Object.assign({className:"sub--dropdown"},{children:e.jsx(a,{isFirstItem:0===s,isLastItem:s===c.length-1,eachOption:t,selectedOption:R,selectedDate:I,onClickingEachItem:e=>{E(e),C(!0)},rangeSelection:!!(null===(n=null==t?void 0:t.dateRangeSelectionOptions)||void 0===n?void 0:n.selectRange)})})):e.jsx(a,{isFirstItem:0===s,isLastItem:s===c.length-1,eachOption:t,selectedOption:R,selectedDate:I,onClickingEachItem:e=>{if(L(void 0),E(e),A(e),P(),!e.noOfDays)return void g(e);const t=new Date,o=new Date;o.setDate(t.getDate()-e.noOfDays),g(Object.assign(Object.assign({},e),{selectedRange:[o,t]}))}})},null==t?void 0:t.key)}))})),e.jsx(o.Dropdown.Menu,Object.assign({className:"sub--dropdown",popperConfig:{modifiers:[{name:"offset",options:{offset:[(null==O?void 0:O.offsetSkid)||0,(null==O?void 0:O.offsetDistance)||0]}}]}},{children:e.jsx(n.DatePicker,{selectRange:(null===(x=null==R?void 0:R.dateRangeSelectionOptions)||void 0===x?void 0:x.selectRange)||!1,maxDate:null===(f=null==R?void 0:R.dateRangeSelectionOptions)||void 0===f?void 0:f.maxDate,minDate:null===(k=null==R?void 0:R.dateRangeSelectionOptions)||void 0===k?void 0:k.minDate,selectedDates:I,onSelectRange:(e,t)=>{const o=[e,t];(null==R?void 0:R.dateRangeSelectionOptions)&&(R.dateRangeSelectionOptions.selectedDates=o,g(Object.assign(Object.assign({},R),{selectedRange:[e,t]}))),A(R),C(!1),L(o),q(!F)},onSelectDate:e=>{(null==R?void 0:R.dateRangeSelectionOptions)&&(R.dateRangeSelectionOptions.selectedDates=[e,e],g(Object.assign(Object.assign({},R),{selectedRange:[e,e]}))),A(R),C(!1),L([e,e]),q(!F)}})}))]}))}))]}))})},exports.EachItem=a,exports.formatDate=d;
|
|
@@ -56,5 +56,7 @@ export interface TemplateContextMapperProps {
|
|
|
56
56
|
maxCharLimit?: number;
|
|
57
57
|
onDefaultVariableSelect?: (variable: VariableV3) => void;
|
|
58
58
|
skipDefaultVariableContent?: boolean;
|
|
59
|
+
disableDatePicker?: boolean;
|
|
60
|
+
disableCopyCode?: boolean;
|
|
59
61
|
}
|
|
60
|
-
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;
|
|
62
|
+
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, disableDatePicker, disableCopyCode, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("lodash"),l=require("react"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("lodash"),l=require("react"),a=require("../../utils/StringUtils.js"),o=require("../../constants/Theme.js"),r=require("../modals/styledModal.js"),s=require("../template-preview/models/Channels.js"),i=require("../template-preview/models/WhatsAppTemplate.js"),n=require("./context/templateModalContext.js"),d=require("./modalElements/Footer.js"),u=require("./modalElements/TemplateSelectModalContent.js"),c=require("./utils/convertPlaceholdersToBikDropdown.js");exports.TemplateContextMapper=p=>{let{selectedTemplate:v,closeDialog:m,showVariableMapping:C,channel:h,htmlContent:b,templateVariables:S,onTemplateSelect:E,globalPlaceholders:P,showOnlyContent:x,whatsappSpecificPickerMeta:f,zIndex:g,showVariableModal:T,variableList:L,discountCode:y,setDiscountCode:I,onBackPress:j,enabledCustomText:D,variableListForImage:k,showSampleValues:V,disableEditVariable:w,pod:A,extras:H,pickerConf:M,selectedCarouselProducts:N,disableEditExpiry:O,cardWidth:q,onDeleteSelectedProducts:B,fileName:F,setFileName:_,hideDeviceContainerInPreview:W,maxCharLimit:Y,onDefaultVariableSelect:R,skipDefaultVariableContent:z,disableDatePicker:U,disableCopyCode:$}=p;var G,J,K,Q,X,Z,ee,te;l.useEffect((()=>{de(b)}),[b]);const le=h===s.CHANNEL_TYPE.WHATSAPP&&"CAROUSEL"===(null===(J=null===(G=null==v?void 0:v.components)||void 0===G?void 0:G[1])||void 0===J?void 0:J.type),ae=null==v?void 0:v.isProductCarouselType,[oe,re]=l.useState(h===s.CHANNEL_TYPE.EMAIL||h==s.CHANNEL_TYPE.WEBPUSH||le?"desktop":"mobile"),[se,ie]=l.useState(!1),[ne,de]=l.useState(b),[ue,ce]=l.useState(!1),[pe,ve]=l.useState([]),[me,Ce]=l.useState({}),[he,be]=l.useState(v),[Se,Ee]=l.useState([]),[Pe,xe]=l.useState(null),[fe,ge]=l.useState(!1),[Te,Le]=l.useState(null!=S?S:[]),[ye,Ie]=l.useState(!1),[je,De]=l.useState(le?(null===(Q=null===(K=null==he?void 0:he.mapping)||void 0===K?void 0:K.body)||void 0===Q?void 0:Q.length)?-1:0:-1),[ke,Ve]=l.useState([]),[we,Ae]=l.useState(void 0),He=l.useRef(null),[Me,Ne]=l.useState(!1),[Oe,qe]=l.useState(!1),[Be,Fe]=l.useState(!1),[_e,We]=l.useState({});l.useEffect((()=>{N?Ve(N):ae&&Ve([])}),[N]),l.useEffect((()=>{var e;if(!fe&&ae&&(!N||0===Ve.length)){const t=null===(e=null==he?void 0:he.components)||void 0===e?void 0:e[1].cards,l=[];null==t||t.forEach((e=>{var t;null===(t=null==e?void 0:e.components)||void 0===t||t.forEach((e=>{var t,a,o;"HEADER"===e.type&&l.push(null!==(o=null===(a=null===(t=e.example)||void 0===t?void 0:t.header_handle)||void 0===a?void 0:a[0])&&void 0!==o?o:"")}))})),Ee(l),ge(!0)}}),[fe]);const Ye=l.useMemo((()=>c.convertPlaceholdersToBikDropdown(P)),[P]);return l.useEffect((()=>{Ae(t.cloneDeep(L))}),[L]),e.jsx(n.TemplateModalContext.Provider,Object.assign({value:{hideFooterButton:Be,setHideFooterButton:Fe,hideCrossButton:Oe,setHideCrossButton:qe,variableList:we,setVariableList:Ae,variableCallback:Pe,setVariableCallback:xe,showVariablePicker:se,setShowVariablePicker:ie,template:he,setTemplate:be,device:oe,setDevice:re,display_content:ne,setDisplayContent:de,originalVariableList:Te,setOriginalVariableList:Le,isError:ue,setIsError:ce,channel:h,globalNormalizedPlaceholders:Ye,templateSelectionTriggered:ye,setTemplateSelectionTriggered:Ie,enabledCustomText:D,disableEditVariable:w,pod:A,extras:H,isWhatsappCarousel:le,selectedCarouselIndex:je,setSelectedCarouselIndex:De,isProductCarouselType:ae,templateErrorIndexes:me,cardCount:le?null===(Z=null===(X=v.components)||void 0===X?void 0:X[1].cards)||void 0===Z?void 0:Z.length:void 0,errorIndexes:pe,setErrorIndexes:ve,pickerConf:M,carouselProducts:ke,setCarouselProducts:Ve,disableEditExpiry:O,cardWidth:q,cardImages:Se,onDeleteSelectedProducts:B,hideDeviceContainerInPreview:W,sliderRef:He,isCarouselHovered:Me,setIsCarouselHovered:Ne,maxCharLimit:Y,ctaOptionsErrors:_e,setCtaOptionsErrors:We,onDefaultVariableSelect:R,disableDatePicker:U,disableCopyCode:$}},{children:x?e.jsx(u.default,{variableListFromProps:L,channel:s.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(r.StyledModal,Object.assign({hideCrossButton:Oe,zIndex:g,centralContainerStyles:{width:le?900:h===s.CHANNEL_TYPE.EMAIL&&C?1e3:800},open:!0,onClose:()=>{null==m||m()},headingTitle:null==he?void 0:he.label,headingSubtitle:h===s.CHANNEL_TYPE.WHATSAPP?`${a.default.capitaliseFirstLetterOfString(null!==(ee=null==he?void 0:he.category)&&void 0!==ee?ee:"")} • ${null!==(te=null==he?void 0:he.templateCategory)&&void 0!==te?te:""}`:"",onBackPress:()=>{null==j||j()},modalHeaderStyles:{borderBottom:`1px solid ${o.COLORS.stroke.primary}`}},{children:[e.jsx(u.default,{variableListFromProps:L,showSampleValues:V,showVariableMapping:C,channel:h,whatsappSpecificPickerMeta:f,showVariableModal:T,discountCode:y,setDiscountCode:I,variableListForImage:k&&(null==k?void 0:k.length)>0?k:we,fileName:F,setFileName:e=>{null==_||_(e)},skipDefaultVariableContent:z}),E?e.jsx(d.default,{isWhatsappCarousel:null!=le&&le,onSelect:function(){var e;if((null==ke?void 0:ke.length)<1&&ae)return void ce(!0);if(Object.keys(_e).length>0&&A!==i.POD.CHATBOT)return void ce(!0);const t=null==E?void 0:E(he,Te,null!=ne?ne:"",ke);Ce(null!==(e=null==t?void 0:t.templateErrorIndexes)&&void 0!==e?e:{body:[],buttons:[]}),(null==t?void 0:t.errorIndexes)||(null==t?void 0:t.error)?((null==t?void 0:t.errorIndexes)&&ve(t.errorIndexes),(null==t?void 0:t.error)&&ce(!!(null==t?void 0:t.error))):Ie(!0)}}):e.jsx(e.Fragment,{})]}))}))};
|
|
@@ -9,6 +9,8 @@ import { AllTemplateTypes, AllTemplateVariables } from "../../template-preview/m
|
|
|
9
9
|
import { ExtrasWhatsapp } from "../../template-preview/models/WhatsAppTemplate";
|
|
10
10
|
export type DEVICE_TYPES = 'desktop' | 'mobile';
|
|
11
11
|
export declare const TemplateModalContext: React.Context<{
|
|
12
|
+
disableDatePicker?: boolean | undefined;
|
|
13
|
+
disableCopyCode?: boolean | undefined;
|
|
12
14
|
hideFooterButton: boolean;
|
|
13
15
|
setHideFooterButton: React.Dispatch<React.SetStateAction<boolean>>;
|
|
14
16
|
hideCrossButton: boolean;
|
|
@@ -76,6 +78,8 @@ export declare const TemplateModalContext: React.Context<{
|
|
|
76
78
|
onDefaultVariableSelect?: ((variable: VariableV3) => void) | undefined;
|
|
77
79
|
}>;
|
|
78
80
|
export declare const useTemplateModalContext: () => {
|
|
81
|
+
disableDatePicker?: boolean | undefined;
|
|
82
|
+
disableCopyCode?: boolean | undefined;
|
|
79
83
|
hideFooterButton: boolean;
|
|
80
84
|
setHideFooterButton: React.Dispatch<React.SetStateAction<boolean>>;
|
|
81
85
|
hideCrossButton: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("../../template-preview/models/Channels.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const l=a(e).default.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:t.CHANNEL_TYPE.EMAIL,template:null,isError:!1,enabledCustomText:!1,disableEditVariable:!1,disableEditExpiry:!1});exports.TemplateModalContext=l,exports.useTemplateModalContext=()=>e.useContext(l);
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("../../template-preview/models/Channels.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const l=a(e).default.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:t.CHANNEL_TYPE.EMAIL,template:null,isError:!1,enabledCustomText:!1,disableEditVariable:!1,disableEditExpiry:!1,disableDatePicker:!1});exports.TemplateModalContext=l,exports.useTemplateModalContext=()=>e.useContext(l);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("lodash"),o=require("react"),t=require("styled-components"),i=require("../../input/Input.js"),l=require("../../template-preview/models/TemplateMeta.js"),a=require("../../template-preview/models/WhatsAppTemplate.js"),s=require("../context/templateModalContext.js"),d=require("../utils/getDataFromTemplateComponent.js"),u=require("../utils/validateIsUrl.js"),r=require("../utils/validateName.js"),p=require("./BackTrackComponent.js"),c=require("./DiscountCodeComponent.js"),v=require("./EditMediaModal.js"),m=require("./EditMediaV2.js"),b=require("./EditMediaV2.style.js"),g=require("./useEditWhtasappTemplateMedia.js"),f=require("./VariableConnector.js"),h=require("./VariableConnectorsPanel.js"),j=require("./VariableConnectorWhatsApp.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("lodash"),o=require("react"),t=require("styled-components"),i=require("../../input/Input.js"),l=require("../../template-preview/models/TemplateMeta.js"),a=require("../../template-preview/models/WhatsAppTemplate.js"),s=require("../context/templateModalContext.js"),d=require("../utils/getDataFromTemplateComponent.js"),u=require("../utils/validateIsUrl.js"),r=require("../utils/validateName.js"),p=require("./BackTrackComponent.js"),c=require("./DiscountCodeComponent.js"),v=require("./EditMediaModal.js"),m=require("./EditMediaV2.js"),b=require("./EditMediaV2.style.js"),g=require("./useEditWhtasappTemplateMedia.js"),f=require("./VariableConnector.js"),h=require("./VariableConnectorsPanel.js"),j=require("./VariableConnectorWhatsApp.js"),C=require("./VariableEditorHeader.js"),O=require("./WhatsAppTemplateCardButtonV2.js");function T(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const x=T(t).default.div`
|
|
2
2
|
padding-top: 24px;
|
|
3
3
|
padding-left: 10px;
|
|
4
4
|
padding-right: 10px;
|
|
5
5
|
margin-bottom: 8px;
|
|
6
6
|
line-height: normal;
|
|
7
|
-
`;exports.default=t=>{let{template:T,onTemplateChange:y,whatsappSpecificPickerMeta:E,showVariableModal:V,variableListForImage:B,setDiscountCode:M,fileName:k,setFileName:q}=t;var I,D,R,L,U,P,w,A,N,S,_,F,H,Q,Y,K,W,$,G,X,z,J,Z,ee,ne,oe,te,ie,le,ae,se,de,ue,re,pe,ce,ve,me,be;const ge=T.isCarouselType,{originalVariableList:fe,pod:he,extras:je,selectedCarouselIndex:Oe,isProductCarouselType:Ce}=s.useTemplateModalContext(),{descriptionComponents:Te,urlBtns:xe,qrbBtns:ye,imageComponent:Ee,bodyVariables:Ve,headerVariables:Be}=d.getAllDataFromTemplateComponent(T),Me=o.useRef(null),[ke,qe]=o.useState(!1),[Ie,De]=o.useState(-1===Oe?{descriptionComponents:Te,urlBtns:xe,qrbBtns:ye,imageComponent:Ee,bodyVariables:Ve,headerVariables:Be}:{}),{uploadMediaLink:Re,uploadMediaFiles:Le,validateMimeType:Ue}=E,Pe=g.useEditWhatsappTemplateMedia({uploadMediaLink:Re,uploadMediaFiles:Le,updateTemplateImageUrl:function(e,o){var t,i,l,a,s,d,u,r;let p;p=null!=Oe&&Oe>-1?{components:null===(i=null===(t=T.components[1])||void 0===t?void 0:t.cards)||void 0===i?void 0:i[Oe].components,mapping:null===(a=null===(l=null==T?void 0:T.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Oe]}:Object.assign({},T);const c=null===(s=null==p?void 0:p.components)||void 0===s?void 0:s.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==c&&c>-1&&(null==p?void 0:p.components[c])){const n=Object.assign(Object.assign({},p.components[c]),{format:o,example:{header_handle:[e]}}),t=[...p.components];t[c]=n,p=Object.assign(Object.assign({},p),{components:t})}p.mapping&&(p.mapping=Object.assign(Object.assign({},p.mapping),{header:void 0}));if(null!=Oe&&Oe>-1){const e=n.cloneDeep(T);e.components[1].cards[Oe].components=p.components,(null===(d=null==e?void 0:e.mapping)||void 0===d?void 0:d.cards)&&(null===(u=null==e?void 0:e.mapping)||void 0===u?void 0:u.cards.length)>0&&(e.mapping.cards[Oe]=null!==(r=p.mapping)&&void 0!==r?r:{}),null==y||y(Object.assign({},e)),Ae(!0)}else null==y||y(Object.assign({},p))},validateMimeType:Ue,mediaComponent:ge?Ie.imageComponent:Ee,fileRef:Me}),[we,Ae]=o.useState(!1),[Ne,Se]=o.useState(k),[_e,Fe]=o.useState();function He(e,o,t){var i,l,a,s,d,u,r,p,c,v;const m=null!=Oe&&Oe>-1?{components:null===(i=Object.assign({},T).components[1].cards)||void 0===i?void 0:i[Oe].components,mapping:null===(l=Object.assign({},T).mapping.cards)||void 0===l?void 0:l[Oe]}:Object.assign({},T),b=n.cloneDeep(m),g="custom"===o&&"string"==typeof e,f=g?e:"string"!=typeof e?e.defaultValue?e.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=Oe&&Oe>-1&&Ce){const o=Object.assign({},T).components.map((e=>{var n;return"CAROUSEL"===e.type?Object.assign(Object.assign({},e),{cards:null===(n=e.cards)||void 0===n?void 0:n.map((e=>Object.assign(Object.assign({},e),{components:e.components.map((e=>{var n,o,i;if("BUTTONS"===e.type){const l=null===(n=e.buttons)||void 0===n?void 0:n.filter((e=>"URL"===e.type));let a=null!==(o=null==l?void 0:l[t])&&void 0!==o?o:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[f]});const s=null===(i=e.buttons)||void 0===i?void 0:i.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e));return Object.assign(Object.assign({},e),{buttons:s})}return e}))})))}):e})),i=null===(s=null===(a=Object.assign({},T).mapping)||void 0===a?void 0:a.cards)||void 0===s?void 0:s.map((n=>{var o;return Object.assign(Object.assign({},n),{buttons:null===(o=null==n?void 0:n.buttons)||void 0===o?void 0:o.map((n=>g?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:""))})})),l=n.cloneDeep(T);return l.components=o,l.mapping.cards=i,void(null==y||y(Object.assign({},l)))}const h=null==b?void 0:b.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==h&&h>-1){const n=null===(d=null==b?void 0:b.components[h].buttons)||void 0===d?void 0:d.filter((e=>"URL"===e.type));if((null==n?void 0:n.length)>0){const i="custom"===o&&"string"==typeof e,l=i?e:"string"!=typeof e&&e.defaultValue?e.defaultValue:"https://d.bik.ai/";let a=n[t];a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]});const s=[...null!==(p=null===(r=null===(u=b.components)||void 0===u?void 0:u[h])||void 0===r?void 0:r.buttons)&&void 0!==p?p:[]].map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e)),d=Object.assign(Object.assign({},b.components[h]),{buttons:s}),v=null===(c=b.mapping)||void 0===c?void 0:c.buttons;v&&v.length>0&&(v[t]=i?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"");const m=Object.assign(Object.assign({},b.mapping),{buttons:v});b.mapping=m;const g=[...b.components];g[h]=d,b.components=g}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(v=e.placeHolder)||void 0===v?void 0:v.slice(2,-2))?qe(!0):(qe(!1),null==M||M(""))}if(null!=Oe&&Oe>-1){const e=n.cloneDeep(T);e.components[1].cards[Oe].components=b.components,e.mapping.cards[Oe]=b.mapping,null==y||y(Object.assign({},e))}else null==y||y(b)}function Qe(e,o,t){var i,l,a,s,d,u,r;const p=null!=Oe&&Oe>-1?{components:null===(i=Object.assign({},T).components[1].cards)||void 0===i?void 0:i[Oe].components,mapping:null===(l=Object.assign({},T).mapping.cards)||void 0===l?void 0:l[Oe]}:Object.assign({},T);if(null!=Oe&&Oe>-1&&Ce){const o=Object.assign({},T).components.map((n=>{var o;return"CAROUSEL"===n.type?Object.assign(Object.assign({},n),{cards:null===(o=n.cards)||void 0===o?void 0:o.map((n=>Object.assign(Object.assign({},n),{components:n.components.map((n=>{var o,i,l;if("BUTTONS"===n.type){const a=null===(o=null==n?void 0:n.buttons)||void 0===o?void 0:o.filter((e=>"QUICK_REPLY"===e.type));let s=null!==(i=null==a?void 0:a[t])&&void 0!==i?i:{};s=Object.assign(Object.assign({},s),{flowId:e.flowId,flowName:e.flowName});const d=null===(l=null==n?void 0:n.buttons)||void 0===l?void 0:l.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==s?void 0:s.text)?s:e));return Object.assign(Object.assign({},n),{buttons:d})}return n}))})))}):n})),i=n.cloneDeep(T);return i.components=o,void(null==y||y(Object.assign({},i)))}const c=null==p?void 0:p.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==c&&c>-1){const n=null===(s=null===(a=null==p?void 0:p.components[c])||void 0===a?void 0:a.buttons)||void 0===s?void 0:s.filter((e=>"QUICK_REPLY"===e.type));if(n){let o=n[t];o=Object.assign(Object.assign({},o),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(r=null===(u=null===(d=p.components)||void 0===d?void 0:d[c])||void 0===u?void 0:u.buttons)&&void 0!==r?r:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==o?void 0:o.text)?o:e)),l=Object.assign(Object.assign({},p.components[c]),{buttons:i}),a=[...p.components];a[c]=l,p.components=a}}if(null!=Oe&&Oe>-1){const e=n.cloneDeep(T);e.components[1].cards[Oe].components=p.components,null==y||y(Object.assign({},e))}else null==y||y(p)}o.useEffect((()=>{var e,n;if(null===(e=T.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))qe(!0);else{qe(!1);const e=null===(n=null==je?void 0:je.discountCodeExtra)||void 0===n?void 0:n[1];null==e||e("")}}),[T]),o.useEffect((()=>{var e,n,o,t;if(null!=Oe&&Oe>-1){const i={components:null===(n=null===(e=T.components[1])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Oe].components,mapping:null===(t=null===(o=null==T?void 0:T.mapping)||void 0===o?void 0:o.cards)||void 0===t?void 0:t[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}=d.getAllDataFromTemplateComponent(i);De({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p})}else if(null!=Oe&&-1===Oe){const{descriptionComponents:e,urlBtns:n,qrbBtns:o,imageComponent:t,bodyVariables:i,headerVariables:l}=d.getAllDataFromTemplateComponent(T);De({descriptionComponents:e,urlBtns:n,qrbBtns:o,imageComponent:t,bodyVariables:i,headerVariables:l})}}),[Oe]),o.useEffect((()=>{var e,n,o,t;if(null!=Oe&&Oe>-1&&we){const i={components:null===(n=null===(e=T.components[1])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Oe].components,mapping:null===(t=null===(o=null==T?void 0:T.mapping)||void 0===o?void 0:o.cards)||void 0===t?void 0:t[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}=d.getAllDataFromTemplateComponent(i);De({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}),Ae(!1)}}),[we]);const Ye=ge?Ie.imageComponent:Ee;return Pe.openEditMedia?e.jsx(h.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(v.default,{mediaComponentFormat:null!==(I=Ye.format)&&void 0!==I?I:l.HEADER_TYPES.IMAGE,uploadMedia:Pe.uploadMedia,variableListForImage:B||[],useEditWhatsappTemplateMediaResponse:Pe,setOpenEditMedia:Pe.setOpenEditMedia,openEditMedia:Pe.openEditMedia,editIconRef:Pe.editIconRef,fileRef:Me})})):e.jsxs(h.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:Ce?"420px":"auto"}},{children:[!!Ie.imageComponent&&!Ce&&e.jsxs(b.EditTemplateMediaContainer,{children:[e.jsx(m.default,{imageName:null!==(R=null===(D=null==Ye?void 0:Ye.example)||void 0===D?void 0:D.header_handle)&&void 0!==R?R:[],handleImageChange:Pe.handleImageChange,mediaType:null==Ye?void 0:Ye.format,error:Pe.error,isLoading:Pe.loading,setOpenEditMedia:Pe.setOpenEditMedia,selectedVariable:u.isVariable(null!==(P=null===(U=null===(L=null==Ye?void 0:Ye.example)||void 0===L?void 0:L.header_handle)||void 0===U?void 0:U[0])&&void 0!==P?P:"")?null===(A=null===(w=null==Ye?void 0:Ye.example)||void 0===w?void 0:w.header_handle)||void 0===A?void 0:A[0]:(null===(S=null===(N=null==T?void 0:T.mapping)||void 0===N?void 0:N.header)||void 0===S?void 0:S[0])?null===(F=null===(_=null==T?void 0:T.mapping)||void 0===_?void 0:_.header)||void 0===F?void 0:F[0]:Pe.selectedVariable}),(null==Ee?void 0:Ee.format)==l.HEADER_TYPES.DOCUMENT?e.jsx(x,{children:e.jsx(i.Input,{labelText:"PDF Name",placeholder:"Enter the name",value:Ne,errorMessage:_e||void 0,onBlur:()=>{if(!Ne)return null==q||q(""),void Fe("PDF name is Required");const e=r.validateInputName(Ne);null==q||q(Ne),Fe(e?"Please enter a valid PDF name":void 0)},onChangeText:e=>{Fe(""),Se(e)}})}):e.jsx(e.Fragment,{})]}),(null===(H=Ie.bodyVariables)||void 0===H?void 0:H.length)>0&&e.jsx(O.default,{containerStyle:{paddingTop:Ie.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===(Q=Ie.descriptionComponents)||void 0===Q?void 0:Q.map(((n,o)=>e.jsx(j.default,{originalVariableList:null!=Oe&&Oe>-1?fe.cards[Oe]:fe,type:n.type,descriptionComponent:n.component,showVariableModal:V},o))),(null===(W=null===(K=null!=Oe&&Oe>-1?null===(Y=fe.cards[Oe])||void 0===Y?void 0:Y.buttons:null==fe?void 0:fe.buttons)||void 0===K?void 0:K.filter((e=>"URL"===e.type)))||void 0===W?void 0:W.length)>0&&e.jsx(O.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(X=null===(G=null!=Oe&&Oe>-1?null===($=fe.cards[Oe])||void 0===$?void 0:$.buttons:null==fe?void 0:fe.buttons)||void 0===G?void 0:G.filter((e=>he===a.POD.CHATBOT||"URL"===e.type)))||void 0===X?void 0:X.map(((n,o)=>{if("URL"===n.type)return e.jsx(C.default,{variableListIndex:o,CTAoptions:null==E?void 0:E.CTAoptions,button:n,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},fe.cards[Oe]):Object.assign({},fe),updateSelectedURLTemplateBtn:He},`${o}_${Oe}`)})),he===a.POD.CHATBOT&&(null===(J=null===(z=ye[0])||void 0===z?void 0:z.component)||void 0===J?void 0:J.buttons)&&(null===(ne=null===(ee=null===(Z=ye[0])||void 0===Z?void 0:Z.component)||void 0===ee?void 0:ee.buttons)||void 0===ne?void 0:ne.length)>0&&e.jsx(p.BackTrackComponent,{backTrackMessage:null===(oe=null==je?void 0:je.backTrackExtra)||void 0===oe?void 0:oe[0],setBackTrackMessage:null===(te=null==je?void 0:je.backTrackExtra)||void 0===te?void 0:te[1]}),(null===(ae=null===(le=null!=Oe&&Oe>-1?null===(ie=fe.cards[Oe])||void 0===ie?void 0:ie.buttons:null==fe?void 0:fe.buttons)||void 0===le?void 0:le.filter((e=>"QUICK_REPLY"===e.type)))||void 0===ae?void 0:ae.length)>0&&(he!==a.POD.CHATBOT?e.jsx(O.default,{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"}):e.jsx(p.BackTrackComponent,{backTrackMessage:null===(se=null==je?void 0:je.backTrackExtra)||void 0===se?void 0:se[0],setBackTrackMessage:null===(de=null==je?void 0:je.backTrackExtra)||void 0===de?void 0:de[1]})),null===(pe=null===(re=null!=Oe&&Oe>-1?null===(ue=fe.cards[Oe])||void 0===ue?void 0:ue.buttons:null==fe?void 0:fe.buttons)||void 0===re?void 0:re.filter((e=>"QUICK_REPLY"===e.type)))||void 0===pe?void 0:pe.map(((n,o)=>{if("QUICK_REPLY"===n.type&&he!==a.POD.CHATBOT)return e.jsx(C.default,{variableListIndex:o,QRBoptions:null==E?void 0:E.QRBoptions,button:n,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},fe.cards[Oe]):Object.assign({},fe),updateSelectedQRBTemplateBtn:Qe},`${o}_${Oe}`)})),he===a.POD.CHATBOT&&ke&&e.jsx(c.DiscountCodeComponent,{discountCode:null===(ce=null==je?void 0:je.discountCodeExtra)||void 0===ce?void 0:ce[0],setDiscountCode:null===(ve=null==je?void 0:je.discountCodeExtra)||void 0===ve?void 0:ve[1]}),null===(be=null!=Oe&&Oe>-1?null===(me=fe.cards[Oe])||void 0===me?void 0:me.buttons:null==fe?void 0:fe.buttons)||void 0===be?void 0:be.map(((n,o)=>{var t,i,l;if("COPY_CODE"===n.type)return e.jsx(f.default,{index:o,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},o)}))]}))};
|
|
7
|
+
`;exports.default=t=>{let{template:T,onTemplateChange:y,whatsappSpecificPickerMeta:E,showVariableModal:V,variableListForImage:B,setDiscountCode:M,fileName:k,setFileName:q}=t;var I,D,R,L,U,P,w,A,N,S,_,F,H,Q,Y,K,W,$,G,X,z,J,Z,ee,ne,oe,te,ie,le,ae,se,de,ue,re,pe,ce,ve,me,be;const ge=T.isCarouselType,{originalVariableList:fe,pod:he,extras:je,selectedCarouselIndex:Ce,isProductCarouselType:Oe,disableCopyCode:Te}=s.useTemplateModalContext();console.log("disableCopyCode",Te);const{descriptionComponents:xe,urlBtns:ye,qrbBtns:Ee,imageComponent:Ve,bodyVariables:Be,headerVariables:Me}=d.getAllDataFromTemplateComponent(T),ke=o.useRef(null),[qe,Ie]=o.useState(!1),[De,Re]=o.useState(-1===Ce?{descriptionComponents:xe,urlBtns:ye,qrbBtns:Ee,imageComponent:Ve,bodyVariables:Be,headerVariables:Me}:{}),{uploadMediaLink:Le,uploadMediaFiles:Ue,validateMimeType:Pe}=E,we=g.useEditWhatsappTemplateMedia({uploadMediaLink:Le,uploadMediaFiles:Ue,updateTemplateImageUrl:function(e,o){var t,i,l,a,s,d,u,r;let p;p=null!=Ce&&Ce>-1?{components:null===(i=null===(t=T.components[1])||void 0===t?void 0:t.cards)||void 0===i?void 0:i[Ce].components,mapping:null===(a=null===(l=null==T?void 0:T.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Ce]}:Object.assign({},T);const c=null===(s=null==p?void 0:p.components)||void 0===s?void 0:s.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==c&&c>-1&&(null==p?void 0:p.components[c])){const n=Object.assign(Object.assign({},p.components[c]),{format:o,example:{header_handle:[e]}}),t=[...p.components];t[c]=n,p=Object.assign(Object.assign({},p),{components:t})}p.mapping&&(p.mapping=Object.assign(Object.assign({},p.mapping),{header:void 0}));if(null!=Ce&&Ce>-1){const e=n.cloneDeep(T);e.components[1].cards[Ce].components=p.components,(null===(d=null==e?void 0:e.mapping)||void 0===d?void 0:d.cards)&&(null===(u=null==e?void 0:e.mapping)||void 0===u?void 0:u.cards.length)>0&&(e.mapping.cards[Ce]=null!==(r=p.mapping)&&void 0!==r?r:{}),null==y||y(Object.assign({},e)),Ne(!0)}else null==y||y(Object.assign({},p))},validateMimeType:Pe,mediaComponent:ge?De.imageComponent:Ve,fileRef:ke}),[Ae,Ne]=o.useState(!1),[Se,_e]=o.useState(k),[Fe,He]=o.useState();function Qe(e,o,t){var i,l,a,s,d,u,r,p,c,v;const m=null!=Ce&&Ce>-1?{components:null===(i=Object.assign({},T).components[1].cards)||void 0===i?void 0:i[Ce].components,mapping:null===(l=Object.assign({},T).mapping.cards)||void 0===l?void 0:l[Ce]}:Object.assign({},T),b=n.cloneDeep(m),g="custom"===o&&"string"==typeof e,f=g?e:"string"!=typeof e?e.defaultValue?e.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=Ce&&Ce>-1&&Oe){const o=Object.assign({},T).components.map((e=>{var n;return"CAROUSEL"===e.type?Object.assign(Object.assign({},e),{cards:null===(n=e.cards)||void 0===n?void 0:n.map((e=>Object.assign(Object.assign({},e),{components:e.components.map((e=>{var n,o,i;if("BUTTONS"===e.type){const l=null===(n=e.buttons)||void 0===n?void 0:n.filter((e=>"URL"===e.type));let a=null!==(o=null==l?void 0:l[t])&&void 0!==o?o:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[f]});const s=null===(i=e.buttons)||void 0===i?void 0:i.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e));return Object.assign(Object.assign({},e),{buttons:s})}return e}))})))}):e})),i=null===(s=null===(a=Object.assign({},T).mapping)||void 0===a?void 0:a.cards)||void 0===s?void 0:s.map((n=>{var o;return Object.assign(Object.assign({},n),{buttons:null===(o=null==n?void 0:n.buttons)||void 0===o?void 0:o.map((n=>g?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:""))})})),l=n.cloneDeep(T);return l.components=o,l.mapping.cards=i,void(null==y||y(Object.assign({},l)))}const h=null==b?void 0:b.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==h&&h>-1){const n=null===(d=null==b?void 0:b.components[h].buttons)||void 0===d?void 0:d.filter((e=>"URL"===e.type));if((null==n?void 0:n.length)>0){const i="custom"===o&&"string"==typeof e,l=i?e:"string"!=typeof e&&e.defaultValue?e.defaultValue:"https://d.bik.ai/";let a=n[t];a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]});const s=[...null!==(p=null===(r=null===(u=b.components)||void 0===u?void 0:u[h])||void 0===r?void 0:r.buttons)&&void 0!==p?p:[]].map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e)),d=Object.assign(Object.assign({},b.components[h]),{buttons:s}),v=null===(c=b.mapping)||void 0===c?void 0:c.buttons;v&&v.length>0&&(v[t]=i?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"");const m=Object.assign(Object.assign({},b.mapping),{buttons:v});b.mapping=m;const g=[...b.components];g[h]=d,b.components=g}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(v=e.placeHolder)||void 0===v?void 0:v.slice(2,-2))?Ie(!0):(Ie(!1),null==M||M(""))}if(null!=Ce&&Ce>-1){const e=n.cloneDeep(T);e.components[1].cards[Ce].components=b.components,e.mapping.cards[Ce]=b.mapping,null==y||y(Object.assign({},e))}else null==y||y(b)}function Ye(e,o,t){var i,l,a,s,d,u,r;const p=null!=Ce&&Ce>-1?{components:null===(i=Object.assign({},T).components[1].cards)||void 0===i?void 0:i[Ce].components,mapping:null===(l=Object.assign({},T).mapping.cards)||void 0===l?void 0:l[Ce]}:Object.assign({},T);if(null!=Ce&&Ce>-1&&Oe){const o=Object.assign({},T).components.map((n=>{var o;return"CAROUSEL"===n.type?Object.assign(Object.assign({},n),{cards:null===(o=n.cards)||void 0===o?void 0:o.map((n=>Object.assign(Object.assign({},n),{components:n.components.map((n=>{var o,i,l;if("BUTTONS"===n.type){const a=null===(o=null==n?void 0:n.buttons)||void 0===o?void 0:o.filter((e=>"QUICK_REPLY"===e.type));let s=null!==(i=null==a?void 0:a[t])&&void 0!==i?i:{};s=Object.assign(Object.assign({},s),{flowId:e.flowId,flowName:e.flowName});const d=null===(l=null==n?void 0:n.buttons)||void 0===l?void 0:l.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==s?void 0:s.text)?s:e));return Object.assign(Object.assign({},n),{buttons:d})}return n}))})))}):n})),i=n.cloneDeep(T);return i.components=o,void(null==y||y(Object.assign({},i)))}const c=null==p?void 0:p.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==c&&c>-1){const n=null===(s=null===(a=null==p?void 0:p.components[c])||void 0===a?void 0:a.buttons)||void 0===s?void 0:s.filter((e=>"QUICK_REPLY"===e.type));if(n){let o=n[t];o=Object.assign(Object.assign({},o),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(r=null===(u=null===(d=p.components)||void 0===d?void 0:d[c])||void 0===u?void 0:u.buttons)&&void 0!==r?r:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==o?void 0:o.text)?o:e)),l=Object.assign(Object.assign({},p.components[c]),{buttons:i}),a=[...p.components];a[c]=l,p.components=a}}if(null!=Ce&&Ce>-1){const e=n.cloneDeep(T);e.components[1].cards[Ce].components=p.components,null==y||y(Object.assign({},e))}else null==y||y(p)}o.useEffect((()=>{var e,n;if(null===(e=T.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))Ie(!0);else{Ie(!1);const e=null===(n=null==je?void 0:je.discountCodeExtra)||void 0===n?void 0:n[1];null==e||e("")}}),[T]),o.useEffect((()=>{var e,n,o,t;if(null!=Ce&&Ce>-1){const i={components:null===(n=null===(e=T.components[1])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Ce].components,mapping:null===(t=null===(o=null==T?void 0:T.mapping)||void 0===o?void 0:o.cards)||void 0===t?void 0:t[Ce]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}=d.getAllDataFromTemplateComponent(i);Re({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p})}else if(null!=Ce&&-1===Ce){const{descriptionComponents:e,urlBtns:n,qrbBtns:o,imageComponent:t,bodyVariables:i,headerVariables:l}=d.getAllDataFromTemplateComponent(T);Re({descriptionComponents:e,urlBtns:n,qrbBtns:o,imageComponent:t,bodyVariables:i,headerVariables:l})}}),[Ce]),o.useEffect((()=>{var e,n,o,t;if(null!=Ce&&Ce>-1&&Ae){const i={components:null===(n=null===(e=T.components[1])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Ce].components,mapping:null===(t=null===(o=null==T?void 0:T.mapping)||void 0===o?void 0:o.cards)||void 0===t?void 0:t[Ce]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}=d.getAllDataFromTemplateComponent(i);Re({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}),Ne(!1)}}),[Ae]);const Ke=ge?De.imageComponent:Ve;return we.openEditMedia?e.jsx(h.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(v.default,{mediaComponentFormat:null!==(I=Ke.format)&&void 0!==I?I:l.HEADER_TYPES.IMAGE,uploadMedia:we.uploadMedia,variableListForImage:B||[],useEditWhatsappTemplateMediaResponse:we,setOpenEditMedia:we.setOpenEditMedia,openEditMedia:we.openEditMedia,editIconRef:we.editIconRef,fileRef:ke})})):e.jsxs(h.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:Oe?"420px":"auto"}},{children:[!!De.imageComponent&&!Oe&&e.jsxs(b.EditTemplateMediaContainer,{children:[e.jsx(m.default,{imageName:null!==(R=null===(D=null==Ke?void 0:Ke.example)||void 0===D?void 0:D.header_handle)&&void 0!==R?R:[],handleImageChange:we.handleImageChange,mediaType:null==Ke?void 0:Ke.format,error:we.error,isLoading:we.loading,setOpenEditMedia:we.setOpenEditMedia,selectedVariable:u.isVariable(null!==(P=null===(U=null===(L=null==Ke?void 0:Ke.example)||void 0===L?void 0:L.header_handle)||void 0===U?void 0:U[0])&&void 0!==P?P:"")?null===(A=null===(w=null==Ke?void 0:Ke.example)||void 0===w?void 0:w.header_handle)||void 0===A?void 0:A[0]:(null===(S=null===(N=null==T?void 0:T.mapping)||void 0===N?void 0:N.header)||void 0===S?void 0:S[0])?null===(F=null===(_=null==T?void 0:T.mapping)||void 0===_?void 0:_.header)||void 0===F?void 0:F[0]:we.selectedVariable}),(null==Ve?void 0:Ve.format)==l.HEADER_TYPES.DOCUMENT?e.jsx(x,{children:e.jsx(i.Input,{labelText:"PDF Name",placeholder:"Enter the name",value:Se,errorMessage:Fe||void 0,onBlur:()=>{if(!Se)return null==q||q(""),void He("PDF name is Required");const e=r.validateInputName(Se);null==q||q(Se),He(e?"Please enter a valid PDF name":void 0)},onChangeText:e=>{He(""),_e(e)}})}):e.jsx(e.Fragment,{})]}),(null===(H=De.bodyVariables)||void 0===H?void 0:H.length)>0&&e.jsx(C.default,{containerStyle:{paddingTop:De.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===(Q=De.descriptionComponents)||void 0===Q?void 0:Q.map(((n,o)=>e.jsx(j.default,{originalVariableList:null!=Ce&&Ce>-1?fe.cards[Ce]:fe,type:n.type,descriptionComponent:n.component,showVariableModal:V},o))),(null===(W=null===(K=null!=Ce&&Ce>-1?null===(Y=fe.cards[Ce])||void 0===Y?void 0:Y.buttons:null==fe?void 0:fe.buttons)||void 0===K?void 0:K.filter((e=>"URL"===e.type)))||void 0===W?void 0:W.length)>0&&e.jsx(C.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(X=null===(G=null!=Ce&&Ce>-1?null===($=fe.cards[Ce])||void 0===$?void 0:$.buttons:null==fe?void 0:fe.buttons)||void 0===G?void 0:G.filter((e=>he===a.POD.CHATBOT||"URL"===e.type)))||void 0===X?void 0:X.map(((n,o)=>{if("URL"===n.type)return e.jsx(O.default,{variableListIndex:o,CTAoptions:null==E?void 0:E.CTAoptions,button:n,currentVariableList:null!=Ce&&Ce>-1?Object.assign({},fe.cards[Ce]):Object.assign({},fe),updateSelectedURLTemplateBtn:Qe},`${o}_${Ce}`)})),he===a.POD.CHATBOT&&(null===(J=null===(z=Ee[0])||void 0===z?void 0:z.component)||void 0===J?void 0:J.buttons)&&(null===(ne=null===(ee=null===(Z=Ee[0])||void 0===Z?void 0:Z.component)||void 0===ee?void 0:ee.buttons)||void 0===ne?void 0:ne.length)>0&&e.jsx(p.BackTrackComponent,{backTrackMessage:null===(oe=null==je?void 0:je.backTrackExtra)||void 0===oe?void 0:oe[0],setBackTrackMessage:null===(te=null==je?void 0:je.backTrackExtra)||void 0===te?void 0:te[1]}),(null===(ae=null===(le=null!=Ce&&Ce>-1?null===(ie=fe.cards[Ce])||void 0===ie?void 0:ie.buttons:null==fe?void 0:fe.buttons)||void 0===le?void 0:le.filter((e=>"QUICK_REPLY"===e.type)))||void 0===ae?void 0:ae.length)>0&&(he!==a.POD.CHATBOT?e.jsx(C.default,{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"}):e.jsx(p.BackTrackComponent,{backTrackMessage:null===(se=null==je?void 0:je.backTrackExtra)||void 0===se?void 0:se[0],setBackTrackMessage:null===(de=null==je?void 0:je.backTrackExtra)||void 0===de?void 0:de[1]})),null===(pe=null===(re=null!=Ce&&Ce>-1?null===(ue=fe.cards[Ce])||void 0===ue?void 0:ue.buttons:null==fe?void 0:fe.buttons)||void 0===re?void 0:re.filter((e=>"QUICK_REPLY"===e.type)))||void 0===pe?void 0:pe.map(((n,o)=>{if("QUICK_REPLY"===n.type&&he!==a.POD.CHATBOT)return e.jsx(O.default,{variableListIndex:o,QRBoptions:null==E?void 0:E.QRBoptions,button:n,currentVariableList:null!=Ce&&Ce>-1?Object.assign({},fe.cards[Ce]):Object.assign({},fe),updateSelectedQRBTemplateBtn:Ye},`${o}_${Ce}`)})),he===a.POD.CHATBOT&&qe&&e.jsx(c.DiscountCodeComponent,{discountCode:null===(ce=null==je?void 0:je.discountCodeExtra)||void 0===ce?void 0:ce[0],setDiscountCode:null===(ve=null==je?void 0:je.discountCodeExtra)||void 0===ve?void 0:ve[1]}),null===(be=null!=Ce&&Ce>-1?null===(me=fe.cards[Ce])||void 0===me?void 0:me.buttons:null==fe?void 0:fe.buttons)||void 0===be?void 0:be.map(((n,o)=>{var t,i,l;if("COPY_CODE"===n.type)return e.jsx(f.default,{index:o,variable:{variableName:null!==(t=n.text)&&void 0!==t?t:"Copy Code",updatedValue:null!==(i=n.buttonVariable)&&void 0!==i?i:"",type:"string",isEditableVariable:null==Te||Te,index:null!==(l=n.index)&&void 0!==l?l:0},showVariableModal:!0,componentType:"BUTTONS",buttonType:n.type},o)}))]}))};
|
|
@@ -13,4 +13,4 @@
|
|
|
13
13
|
background-color: rgba(0, 0, 0, 0.1);
|
|
14
14
|
z-index: 1000;
|
|
15
15
|
cursor: not-allowed;
|
|
16
|
-
`,f={value:"custom_link",label:"Custom URL"},C={value:"custom_text",label:"Custom text"},N={value:"static_expiry",label:"Static Expiry"};exports.Container=T,exports.default=n=>{let{onFocus:E,variable:_,index:P,showVariableModal:L,setShowDiscountCheckBox:A,componentType:S,CTAoptions:V,buttonType:k}=n;var B,D,H,Y,U,w,q,W,R;const[I,M]=i.useState(!1),[$,z]=i.useState(""),[Z,F]=i.useState([]),[G,Q]=i.useState(),[K,J]=i.useState(!1),{variableList:X,setVariableList:ee,setVariableCallback:te,setShowVariablePicker:le,device:ae,channel:ie,isError:ne,originalVariableList:se,template:oe,templateSelectionTriggered:ue,setTemplate:de,setDisplayContent:re,setOriginalVariableList:ce,globalNormalizedPlaceholders:pe,enabledCustomText:me,pod:ve,selectedCarouselIndex:be,isProductCarouselType:ge,isWhatsappCarousel:Oe,disableEditVariable:je,disableEditExpiry:ye,templateErrorIndexes:xe,maxCharLimit:Ee}=O.useTemplateModalContext();function _e(e,t){var l,a,i,n;const s=e;z(""),Q(s),ie===c.CHANNEL_TYPE.WHATSAPP?"custom_text"!==s.value&&"custom_link"!==s.value&&"static_expiry"!==s.value?(he(null!==(l=s.value)&&void 0!==l?l:"","string"),null==fe||fe(null!==(a=_.index)&&void 0!==a?a:0,s.value,!0)):(null==fe||fe(null!==(i=_.index)&&void 0!==i?i:0,"",!0,s.value),he("","url"===s.bikPlaceholderType?"link":"string")):"custom_text"!==s.value&&"custom_link"!==s.value?(he(s.value,"url"===s.bikPlaceholderType?"link":"string"),ie==c.CHANNEL_TYPE.WEBPUSH&&(null==Ne||Ne(null!==(n=_.index)&&void 0!==n?n:0,s.value))):(z(""),he("",s.value))}function Te(e,t){var l,a;z(t);const i="custom_link"===(null==G?void 0:G.value)&&t?t.includes("https")?t:`https://${t}`:t;he(i,"static_expiry"===e?"string":e),ie===c.CHANNEL_TYPE.WHATSAPP&&(null==fe||fe(null!==(l=_.index)&&void 0!==l?l:0,i,"custom_link"===e,e)),ie===c.CHANNEL_TYPE.WEBPUSH&&(null==Ne||Ne(null!==(a=_.index)&&void 0!==a?a:0,i))}function he(e,t,l){var i,n,s,o;const u="custom_link"===t?"link":"custom_text"===t?"string":t;if(ie!==c.CHANNEL_TYPE.WHATSAPP&&ie!==c.CHANNEL_TYPE.WEBPUSH){const l=y.getVariableNameForEmailByIndex(P+1),a=null===document||void 0===document?void 0:document.getElementById("mobile"===ae?"template_html_mobile":"template_html_desktop"),n=ie===c.CHANNEL_TYPE.EMAIL?null===(i=null==a?void 0:a.contentWindow)||void 0===i?void 0:i.document.getElementById(l):document.getElementById(l);n&&(n.textContent="custom_text"!==t&&"custom_link"!==t||e?e:_.variableName);const s=se.map(((t,l)=>l===P?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t));null==ce||ce(s)}if(ie===c.CHANNEL_TYPE.WEBPUSH){const t=se,l=t=>null==t?void 0:t.map(((t,l)=>l===P?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)),a={BODY:"BODY"===S?l(t.body):t.body,TITLE:S===p.WEB_PUSH_COMPONENT_TYPE.TITLE.toUpperCase()?l(t.title):t.title};null==ce||ce((e=>Object.assign(Object.assign({},e),{title:a.TITLE,body:a.BODY,buttons:t.buttons})))}if(ie===c.CHANNEL_TYPE.WHATSAPP){if(null!=be&&be>-1&&ge){const l=Object.assign({},se).cards.map(((l,a)=>{var i,n;return"BODY"===S?Object.assign(Object.assign({},l),{body:null===(i=l.body)||void 0===i?void 0:i.map(((t,l)=>P===l?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t))}):"BUTTONS"===S?Object.assign(Object.assign({},l),{buttons:null===(n=l.buttons)||void 0===n?void 0:n.map(((l,a)=>a===P?Object.assign(Object.assign({},l),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===l.type?e:[e]}):l))}):l}));return void(null==ce||ce((e=>Object.assign(Object.assign({},e),{cards:l}))))}const i=null!=be&&be>-1?se.cards[be]:se;let d=i.body,r=i.header,c=i.buttons;if("BODY"===S?d=null===(n=i.body)||void 0===n?void 0:n.map(((t,l)=>l===P?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"HEADER"===S?r=null===(s=i.header)||void 0===s?void 0:s.map(((t,l)=>l===P?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"BUTTONS"===S&&(c=null===(o=i.buttons)||void 0===o?void 0:o.map(((a,i)=>i===P?Object.assign(Object.assign({},a),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===a.type?e:[e],queryParams:null!=l?l:[]}):a))),null!=be&&be>-1){const e=a.cloneDeep(se.cards);e[be]={header:r,body:d,buttons:c},null==ce||ce((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==ce||ce((e=>Object.assign(Object.assign({},e),{header:r,body:d,buttons:c})))}}function fe(e,t,l,i){var n,s,o,u,d,r,c;if(null!=be&&be>-1&&ge){const s=Object.assign({},oe).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,s,o,u;if("BODY"===l.type&&"BODY"===S){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!==(o=null===(s=null===(n=l.example)||void 0===n?void 0:n.body_text)||void 0===s?void 0:s[0])&&void 0!==o?o:[]];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"===S){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})),o=a.cloneDeep(oe);if(l){const l=null===(n=Object.assign({},oe).mapping.cards)||void 0===n?void 0:n.map(((l,a)=>{var n,s,o;if("BODY"===S)return Object.assign(Object.assign({},l),{body:null===(n=l.body)||void 0===n?void 0:n.map(((l,a)=>e===a?"custom_text"===i?`((editableVariable${a+10}))`:t:l))});if("BUTTONS"===S&&(null==l?void 0:l.buttons)){let n=-1,u=-1;return null===(s=oe.components[1].cards)||void 0===s||s[a].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===(o=l.buttons)||void 0===o?void 0:o.map(((e,l)=>l===u?"custom_link"===i?"((customPlaceholderName))":t:e))})}return l}));o.mapping.cards=l}return o.components=s,void(null==de||de(o))}const p=null!=be&&be>-1?{components:null===(s=Object.assign({},oe).components[1].cards)||void 0===s?void 0:s[be].components,mapping:null===(o=Object.assign({},oe).mapping.cards)||void 0===o?void 0:o[be]}:Object.assign({},oe),m=null===(u=null==p?void 0:p.components)||void 0===u?void 0:u.map((l=>{var a,i,n,s,o,u,d,r,c;const p=Object.assign({},l);if("BODY"===l.type&&"BODY"===S){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!==(o=null===(s=null===(n=p.example)||void 0===n?void 0:n.body_text)||void 0===s?void 0:s[0])&&void 0!==o?o:[]];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"===S){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"===S){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"===S)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"===S&&(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,a)=>e===a?"custom_text"===i?`((editableVariable${a+10}))`:t:l))});else if("HEADER"===S&&(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,a)=>e===a?"custom_text"===i?`((editableVariable${a+20}))`:t:l))});else if("BUTTONS"===S&&(null===(c=null==p?void 0:p.mapping)||void 0===c?void 0:c.buttons)){let l=-1,a=-1;m.forEach((t=>{var i;"BUTTONS"===t.type&&(null===(i=t.buttons)||void 0===i||i.forEach(((t,i)=>{"URL"===t.type&&(l++,i===e&&"URL"==t.type&&(a=l))})))})),p.mapping=Object.assign(Object.assign({},p.mapping),{buttons:p.mapping.buttons.map(((e,l)=>l===a?"custom_link"===i?"((customPlaceholderName))":t:e))})}if(null!=be&&be>-1&&oe){const e=a.cloneDeep(oe);e.components[1].cards[be].components=p.components,e.mapping.cards[be]=p.mapping,null==de||de(e)}else null==de||de(Object.assign({},p))}i.useEffect((()=>{I&&(null==E||E())}),[I]),i.useEffect((()=>{!function(){var e,t,l,a,i;const n="mobile"===ae?"template_html_mobile":"template_html_desktop",s=document.getElementById(n),o=(null!==(a=null===(l=null===(t=null===(e=null==s?void 0:s.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==s?void 0:s.contentWindow)||void 0===i?void 0:i.document.head.innerHTML);ie===c.CHANNEL_TYPE.EMAIL&&(null==re||re(o))}()}),[ue]),i.useEffect((()=>{!function(){var e,t;const l=[];let a=[];if(ie!==c.CHANNEL_TYPE.MESSAGE||me){"link"===(null==_?void 0:_.type)?(l.push({label:"",options:[f,C]}),Q(f)):"date_time"===(null==_?void 0:_.type)?(l.push({label:"",options:[f,C]}),Q(N)):(l.push({label:"",options:[f,C,N]}),Q(C));const e=null!=pe?pe:[];F([...l,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:b.default.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!=pe?pe:[];F([{label:"",options:[C,f]},...e]),a=[{label:"",options:[C,f]},...e]}if((ie===c.CHANNEL_TYPE.WHATSAPP||ie===c.CHANNEL_TYPE.EMAIL||ie===c.CHANNEL_TYPE.MESSAGE||ie===c.CHANNEL_TYPE.WEBPUSH)&&_.updatedValue)if(r.placeHolderNamePattern.test(_.updatedValue)&&ie===c.CHANNEL_TYPE.WHATSAPP||_.updatedValue.startsWith("{{")&&ie!==c.CHANNEL_TYPE.WHATSAPP){const e=function(e,t,l){var a;let i={label:"",value:""};const n=l===c.CHANNEL_TYPE.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(L){let t=e.updatedValue;if(ve===m.POD.CHATBOT&&"BUTTONS"===S){const l=null==V?void 0:V.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,ie);e.value&&Q(e)}else"date_time"===_.type?(Q(N),z(_.updatedValue),fe(null!==(e=_.index)&&void 0!==e?e:0,_.updatedValue)):(null===(t=_.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(Q(f),z(_.updatedValue.split("https://")[1])):(Q(C),z(_.updatedValue))}()}),[be]),i.useEffect((()=>{ae&&G&&$&&setTimeout((()=>{he("custom_link"===(null==G?void 0:G.value)&&$?$.includes("https")?$:`https://${$}`:$,G.value)}),100)}),[ae]),i.useEffect((()=>{!K&&G&&_.updatedValue&&setTimeout((()=>{he("custom_link"===(null==G?void 0:G.value)&&_.updatedValue?_.updatedValue.includes("https")?_.updatedValue:`https://${_.updatedValue}`:_.updatedValue,G.value),J(!0)}),100)}),[G]);const Ce=e=>{null==A||A(!1),"{{custom.url}}"===e.actualValue?_e({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?_e({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?_e({label:e.displayName,selected:!0,value:"static_expiry"}):_e({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})};function Ne(e,t){var l;const i=a.cloneDeep(oe),n=S.toLocaleLowerCase();(null===(l=i.webpushBroadcastConfig)||void 0===l?void 0:l[n])&&(i.webpushBroadcastConfig[n][e]=t),null==de||de(Object.assign({},i))}return e.jsxs(T,Object.assign({channel:ie,focused:I,onMouseEnter:()=>M(!0),onMouseLeave:()=>M(!1)},{children:[e.jsx("div",Object.assign({style:{marginBottom:8}},{children:e.jsxs(v.BodySecondary,Object.assign({style:{color:ne&&!G?g.COLORS.content.negative:g.COLORS.content.primary}},{children:[null===(B=_.variableName)||void 0===B?void 0:B.replace("{{","").replace("}}","")," ","link"===(null==_?void 0:_.type)?"link":"variable"]}))})),e.jsx("div",Object.assign({style:{marginBottom:12}},{children:L?e.jsxs("div",Object.assign({style:{display:"flex",border:"#E0E0E0 1px solid",borderRadius:4,padding:10,justifyContent:(null==G?void 0:G.label)?"space-between":"flex-end"}},{children:[e.jsx(v.BodyPrimary,Object.assign({numberOfLines:1},{children:ve===m.POD.CHATBOT?["static_expiry","custom_text","custom_link"].includes(null!==(D=null==G?void 0:G.value)&&void 0!==D?D:"")?null==G?void 0:G.label:null==G?void 0:G.value:d.truncate(null!==(H=null==G?void 0:G.label)&&void 0!==H?H:"",20,!0)})),je||"date_time"===(null==_?void 0:_.type)&&ye?e.jsx(e.Fragment,{}):e.jsx(t.default,{onClick:()=>{(()=>{if(k===m.BUTTON_TYPE.URL&&ve===m.POD.CHATBOT){const e=j.updateVariables({variableList:X,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom URL",variableValue:"{{custom.url}}"});ee(e)}else if("limited_time_offer"===S){const e=j.updateVariables({variableList:X,categoryDisplayName:"Static Variables",variableDisplayName:"Static Expiry",variableValue:"{{static.expiry}}"});ee(e)}else if(k===m.BUTTON_TYPE.COPY_CODE){const e=j.updateVariables({variableList:X,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom Text",variableValue:"{{custom.text}}"});ee(e)}})(),te((()=>Ce)),le(!0)},width:24,height:24,color:g.COLORS.content.primary})]})):e.jsx(o.Dropdown,{disabled:je,options:Z,isSearchable:!1,onSelect:_e,defaultOptions:G?[Object.assign(Object.assign({},G),{selected:!0})]:[]})})),("custom_text"===(null==G?void 0:G.value)||"custom_link"===(null==G?void 0:G.value))&&e.jsx(u.Input,{state:je?"disabled":"none",labelText:"custom_text"===(null==G?void 0:G.value)?"Custom text value":"custom_link"===(null==G?void 0:G.value)?"Custom URL value":"",id:`variable-value-${null==G?void 0:G.value}-${P}`,value:$,errorMessage:ne&&(null===(Y=null==xe?void 0:xe.buttons)||void 0===Y?void 0:Y.includes(null!==(U=null==_?void 0:_.index)&&void 0!==U?U:-1))?$&&0!==$.trim().length?"custom_link"!==G.value||/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/.test(`https://${$.trim()}`)&&0!==$.trim().length?"custom_link"!==G.value&&$.length>30?"Length cannot be more than 30":"BUTTONS"===S&&"custom_link"!==G.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:Ee||("custom_link"===(null==G?void 0:G.value)?2e3:"BUTTONS"===S?15:30),noKeyDownChange:!0,prefixText:"custom_link"===(null==G?void 0:G.value)?"https://":"",placeholder:"link"===_.type||"custom_link"===G.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{Te(G.value,e)}}),"static_expiry"===(null==G?void 0:G.value)&&e.jsxs("div",Object.assign({style:{position:"relative"}},{children:[je&&e.jsx(h,{onClick:e=>e.preventDefault()}),e.jsx(s.CustomDateTime,{placement:"auto",time:$?l.format(new Date($),"hh:mm a"):l.format(new Date,"hh:mm a"),date:$?new Date($):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{Te("static_expiry",e.toISOString())}})]})),"link"===_.type&&"custom_link"!==(null==G?void 0:G.value)&&!ge&&!Oe&&ve===m.POD.CHATBOT&&e.jsx(x.QueryParamsComponent,{isError:null!==(W=null===(w=null==xe?void 0:xe.buttons)||void 0===w?void 0:w.includes(null!==(q=null==_?void 0:_.index)&&void 0!==q?q:-1))&&void 0!==W&&W,params:null!==(R=_.queryParams)&&void 0!==R?R:[],onChange:e=>{he(_.updatedValue,"link",e)},variableValue:_.updatedValue})]}))};
|
|
16
|
+
`,f={value:"custom_link",label:"Custom URL"},C={value:"custom_text",label:"Custom text"},N={value:"static_expiry",label:"Static Expiry"};exports.Container=T,exports.default=n=>{let{onFocus:E,variable:_,index:P,showVariableModal:L,setShowDiscountCheckBox:A,componentType:S,CTAoptions:V,buttonType:k}=n;var D,B,H,Y,U,w,q,W,R;const[I,M]=i.useState(!1),[$,z]=i.useState(""),[Z,F]=i.useState([]),[G,Q]=i.useState(),[K,J]=i.useState(!1),{variableList:X,setVariableList:ee,setVariableCallback:te,setShowVariablePicker:le,device:ae,channel:ie,isError:ne,originalVariableList:se,template:oe,templateSelectionTriggered:ue,setTemplate:de,setDisplayContent:re,setOriginalVariableList:ce,globalNormalizedPlaceholders:pe,enabledCustomText:me,pod:ve,selectedCarouselIndex:be,isProductCarouselType:ge,isWhatsappCarousel:Oe,disableEditVariable:je,disableEditExpiry:ye,templateErrorIndexes:xe,maxCharLimit:Ee,disableDatePicker:_e}=O.useTemplateModalContext();function Te(e,t){var l,a,i,n;const s=e;z(""),Q(s),ie===c.CHANNEL_TYPE.WHATSAPP?"custom_text"!==s.value&&"custom_link"!==s.value&&"static_expiry"!==s.value?(fe(null!==(l=s.value)&&void 0!==l?l:"","string"),null==Ce||Ce(null!==(a=_.index)&&void 0!==a?a:0,s.value,!0)):(null==Ce||Ce(null!==(i=_.index)&&void 0!==i?i:0,"",!0,s.value),fe("","url"===s.bikPlaceholderType?"link":"string")):"custom_text"!==s.value&&"custom_link"!==s.value?(fe(s.value,"url"===s.bikPlaceholderType?"link":"string"),ie==c.CHANNEL_TYPE.WEBPUSH&&(null==Pe||Pe(null!==(n=_.index)&&void 0!==n?n:0,s.value))):(z(""),fe("",s.value))}function he(e,t){var l,a;z(t);const i="custom_link"===(null==G?void 0:G.value)&&t?t.includes("https")?t:`https://${t}`:t;fe(i,"static_expiry"===e?"string":e),ie===c.CHANNEL_TYPE.WHATSAPP&&(null==Ce||Ce(null!==(l=_.index)&&void 0!==l?l:0,i,"custom_link"===e,e)),ie===c.CHANNEL_TYPE.WEBPUSH&&(null==Pe||Pe(null!==(a=_.index)&&void 0!==a?a:0,i))}function fe(e,t,l){var i,n,s,o;const u="custom_link"===t?"link":"custom_text"===t?"string":t;if(ie!==c.CHANNEL_TYPE.WHATSAPP&&ie!==c.CHANNEL_TYPE.WEBPUSH){const l=y.getVariableNameForEmailByIndex(P+1),a=null===document||void 0===document?void 0:document.getElementById("mobile"===ae?"template_html_mobile":"template_html_desktop"),n=ie===c.CHANNEL_TYPE.EMAIL?null===(i=null==a?void 0:a.contentWindow)||void 0===i?void 0:i.document.getElementById(l):document.getElementById(l);n&&(n.textContent="custom_text"!==t&&"custom_link"!==t||e?e:_.variableName);const s=se.map(((t,l)=>l===P?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t));null==ce||ce(s)}if(ie===c.CHANNEL_TYPE.WEBPUSH){const t=se,l=t=>null==t?void 0:t.map(((t,l)=>l===P?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)),a={BODY:"BODY"===S?l(t.body):t.body,TITLE:S===p.WEB_PUSH_COMPONENT_TYPE.TITLE.toUpperCase()?l(t.title):t.title};null==ce||ce((e=>Object.assign(Object.assign({},e),{title:a.TITLE,body:a.BODY,buttons:t.buttons})))}if(ie===c.CHANNEL_TYPE.WHATSAPP){if(null!=be&&be>-1&&ge){const l=Object.assign({},se).cards.map(((l,a)=>{var i,n;return"BODY"===S?Object.assign(Object.assign({},l),{body:null===(i=l.body)||void 0===i?void 0:i.map(((t,l)=>P===l?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t))}):"BUTTONS"===S?Object.assign(Object.assign({},l),{buttons:null===(n=l.buttons)||void 0===n?void 0:n.map(((l,a)=>a===P?Object.assign(Object.assign({},l),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===l.type?e:[e]}):l))}):l}));return void(null==ce||ce((e=>Object.assign(Object.assign({},e),{cards:l}))))}const i=null!=be&&be>-1?se.cards[be]:se;let d=i.body,r=i.header,c=i.buttons;if("BODY"===S?d=null===(n=i.body)||void 0===n?void 0:n.map(((t,l)=>l===P?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"HEADER"===S?r=null===(s=i.header)||void 0===s?void 0:s.map(((t,l)=>l===P?Object.assign(Object.assign({},t),{type:u,updatedValue:e}):t)):"BUTTONS"===S&&(c=null===(o=i.buttons)||void 0===o?void 0:o.map(((a,i)=>i===P?Object.assign(Object.assign({},a),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===a.type?e:[e],queryParams:null!=l?l:[]}):a))),null!=be&&be>-1){const e=a.cloneDeep(se.cards);e[be]={header:r,body:d,buttons:c},null==ce||ce((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==ce||ce((e=>Object.assign(Object.assign({},e),{header:r,body:d,buttons:c})))}}function Ce(e,t,l,i){var n,s,o,u,d,r,c;if(null!=be&&be>-1&&ge){const s=Object.assign({},oe).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,s,o,u;if("BODY"===l.type&&"BODY"===S){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!==(o=null===(s=null===(n=l.example)||void 0===n?void 0:n.body_text)||void 0===s?void 0:s[0])&&void 0!==o?o:[]];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"===S){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})),o=a.cloneDeep(oe);if(l){const l=null===(n=Object.assign({},oe).mapping.cards)||void 0===n?void 0:n.map(((l,a)=>{var n,s,o;if("BODY"===S)return Object.assign(Object.assign({},l),{body:null===(n=l.body)||void 0===n?void 0:n.map(((l,a)=>e===a?"custom_text"===i?`((editableVariable${a+10}))`:t:l))});if("BUTTONS"===S&&(null==l?void 0:l.buttons)){let n=-1,u=-1;return null===(s=oe.components[1].cards)||void 0===s||s[a].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===(o=l.buttons)||void 0===o?void 0:o.map(((e,l)=>l===u?"custom_link"===i?"((customPlaceholderName))":t:e))})}return l}));o.mapping.cards=l}return o.components=s,void(null==de||de(o))}const p=null!=be&&be>-1?{components:null===(s=Object.assign({},oe).components[1].cards)||void 0===s?void 0:s[be].components,mapping:null===(o=Object.assign({},oe).mapping.cards)||void 0===o?void 0:o[be]}:Object.assign({},oe),m=null===(u=null==p?void 0:p.components)||void 0===u?void 0:u.map((l=>{var a,i,n,s,o,u,d,r,c;const p=Object.assign({},l);if("BODY"===l.type&&"BODY"===S){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!==(o=null===(s=null===(n=p.example)||void 0===n?void 0:n.body_text)||void 0===s?void 0:s[0])&&void 0!==o?o:[]];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"===S){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"===S){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"===S)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"===S&&(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,a)=>e===a?"custom_text"===i?`((editableVariable${a+10}))`:t:l))});else if("HEADER"===S&&(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,a)=>e===a?"custom_text"===i?`((editableVariable${a+20}))`:t:l))});else if("BUTTONS"===S&&(null===(c=null==p?void 0:p.mapping)||void 0===c?void 0:c.buttons)){let l=-1,a=-1;m.forEach((t=>{var i;"BUTTONS"===t.type&&(null===(i=t.buttons)||void 0===i||i.forEach(((t,i)=>{"URL"===t.type&&(l++,i===e&&"URL"==t.type&&(a=l))})))})),p.mapping=Object.assign(Object.assign({},p.mapping),{buttons:p.mapping.buttons.map(((e,l)=>l===a?"custom_link"===i?"((customPlaceholderName))":t:e))})}if(null!=be&&be>-1&&oe){const e=a.cloneDeep(oe);e.components[1].cards[be].components=p.components,e.mapping.cards[be]=p.mapping,null==de||de(e)}else null==de||de(Object.assign({},p))}console.log("disableDatePicker",_e),i.useEffect((()=>{I&&(null==E||E())}),[I]),i.useEffect((()=>{!function(){var e,t,l,a,i;const n="mobile"===ae?"template_html_mobile":"template_html_desktop",s=document.getElementById(n),o=(null!==(a=null===(l=null===(t=null===(e=null==s?void 0:s.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==s?void 0:s.contentWindow)||void 0===i?void 0:i.document.head.innerHTML);ie===c.CHANNEL_TYPE.EMAIL&&(null==re||re(o))}()}),[ue]),i.useEffect((()=>{!function(){var e,t;const l=[];let a=[];if(ie!==c.CHANNEL_TYPE.MESSAGE||me){"link"===(null==_?void 0:_.type)?(l.push({label:"",options:[f,C]}),Q(f)):"date_time"===(null==_?void 0:_.type)?(l.push({label:"",options:[f,C]}),Q(N)):(l.push({label:"",options:[f,C,N]}),Q(C));const e=null!=pe?pe:[];F([...l,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:b.default.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!=pe?pe:[];F([{label:"",options:[C,f]},...e]),a=[{label:"",options:[C,f]},...e]}if((ie===c.CHANNEL_TYPE.WHATSAPP||ie===c.CHANNEL_TYPE.EMAIL||ie===c.CHANNEL_TYPE.MESSAGE||ie===c.CHANNEL_TYPE.WEBPUSH)&&_.updatedValue)if(r.placeHolderNamePattern.test(_.updatedValue)&&ie===c.CHANNEL_TYPE.WHATSAPP||_.updatedValue.startsWith("{{")&&ie!==c.CHANNEL_TYPE.WHATSAPP){const e=function(e,t,l){var a;let i={label:"",value:""};const n=l===c.CHANNEL_TYPE.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(L){let t=e.updatedValue;if(ve===m.POD.CHATBOT&&"BUTTONS"===S){const l=null==V?void 0:V.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,ie);e.value&&Q(e)}else"date_time"===_.type?(Q(N),z(_.updatedValue),Ce(null!==(e=_.index)&&void 0!==e?e:0,_.updatedValue)):(null===(t=_.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(Q(f),z(_.updatedValue.split("https://")[1])):(Q(C),z(_.updatedValue))}()}),[be]),i.useEffect((()=>{ae&&G&&$&&setTimeout((()=>{fe("custom_link"===(null==G?void 0:G.value)&&$?$.includes("https")?$:`https://${$}`:$,G.value)}),100)}),[ae]),i.useEffect((()=>{!K&&G&&_.updatedValue&&setTimeout((()=>{fe("custom_link"===(null==G?void 0:G.value)&&_.updatedValue?_.updatedValue.includes("https")?_.updatedValue:`https://${_.updatedValue}`:_.updatedValue,G.value),J(!0)}),100)}),[G]);const Ne=e=>{null==A||A(!1),"{{custom.url}}"===e.actualValue?Te({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?Te({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?Te({label:e.displayName,selected:!0,value:"static_expiry"}):Te({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})};function Pe(e,t){var l;const i=a.cloneDeep(oe),n=S.toLocaleLowerCase();(null===(l=i.webpushBroadcastConfig)||void 0===l?void 0:l[n])&&(i.webpushBroadcastConfig[n][e]=t),null==de||de(Object.assign({},i))}return e.jsxs(T,Object.assign({channel:ie,focused:I,onMouseEnter:()=>M(!0),onMouseLeave:()=>M(!1)},{children:[e.jsx("div",Object.assign({style:{marginBottom:8}},{children:e.jsxs(v.BodySecondary,Object.assign({style:{color:ne&&!G?g.COLORS.content.negative:g.COLORS.content.primary}},{children:[null===(D=_.variableName)||void 0===D?void 0:D.replace("{{","").replace("}}","")," ","link"===(null==_?void 0:_.type)?"link":"variable"]}))})),e.jsx("div",Object.assign({style:{marginBottom:12}},{children:L?e.jsxs("div",Object.assign({style:{display:"flex",border:"#E0E0E0 1px solid",borderRadius:4,padding:10,justifyContent:(null==G?void 0:G.label)?"space-between":"flex-end"}},{children:[e.jsx(v.BodyPrimary,Object.assign({numberOfLines:1},{children:ve===m.POD.CHATBOT?["static_expiry","custom_text","custom_link"].includes(null!==(B=null==G?void 0:G.value)&&void 0!==B?B:"")?null==G?void 0:G.label:null==G?void 0:G.value:d.truncate(null!==(H=null==G?void 0:G.label)&&void 0!==H?H:"",20,!0)})),je||"date_time"===(null==_?void 0:_.type)&&ye?e.jsx(e.Fragment,{}):e.jsx(t.default,{onClick:()=>{(()=>{if(k===m.BUTTON_TYPE.URL&&ve===m.POD.CHATBOT){const e=j.updateVariables({variableList:X,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom URL",variableValue:"{{custom.url}}"});ee(e)}else if("limited_time_offer"===S){const e=j.updateVariables({variableList:X,categoryDisplayName:"Static Variables",variableDisplayName:"Static Expiry",variableValue:"{{static.expiry}}"});ee(e)}else if(k===m.BUTTON_TYPE.COPY_CODE){const e=j.updateVariables({variableList:X,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom Text",variableValue:"{{custom.text}}"});ee(e)}})(),te((()=>Ne)),le(!0)},width:24,height:24,color:g.COLORS.content.primary})]})):e.jsx(o.Dropdown,{disabled:je,options:Z,isSearchable:!1,onSelect:Te,defaultOptions:G?[Object.assign(Object.assign({},G),{selected:!0})]:[]})})),("custom_text"===(null==G?void 0:G.value)||"custom_link"===(null==G?void 0:G.value))&&e.jsx(u.Input,{state:je?"disabled":"none",labelText:"custom_text"===(null==G?void 0:G.value)?"Custom text value":"custom_link"===(null==G?void 0:G.value)?"Custom URL value":"",id:`variable-value-${null==G?void 0:G.value}-${P}`,value:$,errorMessage:ne&&(null===(Y=null==xe?void 0:xe.buttons)||void 0===Y?void 0:Y.includes(null!==(U=null==_?void 0:_.index)&&void 0!==U?U:-1))?$&&0!==$.trim().length?"custom_link"!==G.value||/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/.test(`https://${$.trim()}`)&&0!==$.trim().length?"custom_link"!==G.value&&$.length>30?"Length cannot be more than 30":"BUTTONS"===S&&"custom_link"!==G.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:Ee||("custom_link"===(null==G?void 0:G.value)?2e3:"BUTTONS"===S?15:30),noKeyDownChange:!0,prefixText:"custom_link"===(null==G?void 0:G.value)?"https://":"",placeholder:"link"===_.type||"custom_link"===G.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{he(G.value,e)}}),"static_expiry"===(null==G?void 0:G.value)&&e.jsxs("div",Object.assign({style:{position:"relative"}},{children:[(je||_e)&&e.jsx(h,{onClick:e=>e.preventDefault()}),e.jsx(s.CustomDateTime,{placement:"auto",time:$?l.format(new Date($),"hh:mm a"):l.format(new Date,"hh:mm a"),date:$?new Date($):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{he("static_expiry",e.toISOString())}})]})),"link"===_.type&&"custom_link"!==(null==G?void 0:G.value)&&!ge&&!Oe&&ve===m.POD.CHATBOT&&e.jsx(x.QueryParamsComponent,{isError:null!==(W=null===(w=null==xe?void 0:xe.buttons)||void 0===w?void 0:w.includes(null!==(q=null==_?void 0:_.index)&&void 0!==q?q:-1))&&void 0!==W&&W,params:null!==(R=_.queryParams)&&void 0!==R?R:[],onChange:e=>{fe(_.updatedValue,"link",e)},variableValue:_.updatedValue})]}))};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const EventsTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default EventsTrigger;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const IGTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default IGTrigger;
|
package/dist/esm/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
package/dist/esm/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { DropdownOption } from "../../../dropdown/type";
|
|
3
|
-
import { QueryBuilderProperty } from "../../
|
|
4
|
-
import { QueryBuilderNodeProps } from "../../
|
|
3
|
+
import { QueryBuilderProperty } from "../../Types/QueryBuilder.type";
|
|
4
|
+
import { QueryBuilderNodeProps } from "../../Types/QueryBuilderNodeProps.type";
|
|
5
5
|
declare const BaseTriggerQueryBuilderNode: React.FC<QueryBuilderNodeProps & {
|
|
6
6
|
cacheKey: string;
|
|
7
7
|
propertyAddBtnText: string;
|
|
@@ -34,6 +34,7 @@ export interface AnalyticsDropdownInterface {
|
|
|
34
34
|
datePickerPlacement?: DropDirection;
|
|
35
35
|
closeDropdown?: boolean;
|
|
36
36
|
labelColor?: string;
|
|
37
|
+
styleProps?: React.CSSProperties;
|
|
37
38
|
}
|
|
38
39
|
export declare const AnalyticsDropdown: React.FC<AnalyticsDropdownInterface>;
|
|
39
40
|
export declare const EachItem: React.FC<{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,Fragment as t,jsxs as o}from"react/jsx-runtime";import{useState as n,useEffect as i}from"react";import{Dropdown as l}from"react-bootstrap";import{DEFAULT_THEME as s,BASE_COLORS as a}from"../../constants/Theme.js";import{DatePicker as d}from"../datePicker/DatePicker.js";import"react-calendar";import"../../utils/DateUtils.js";import{BodySecondary as c,BodyCaption as r,Caption as g}from"../TypographyStyle.js";import"../datePicker/DatePickerWrapper.styled.js";import{MainDropdown as p,ItemMenuContainer as m}from"./CommonStyles.js";const u=a=>{let{options:r,placeholder:m="Select an option",selected:u,onOptionSelected:b,resetDropdown:h,maxHeight:y,backgroundcolor:f,calendarPopperConfig:D,variant:j="default",datePickerPlacement:k,closeDropdown:S,labelColor:R}=a;var
|
|
1
|
+
import{jsx as e,Fragment as t,jsxs as o}from"react/jsx-runtime";import{useState as n,useEffect as i}from"react";import{Dropdown as l}from"react-bootstrap";import{DEFAULT_THEME as s,BASE_COLORS as a}from"../../constants/Theme.js";import{DatePicker as d}from"../datePicker/DatePicker.js";import"react-calendar";import"../../utils/DateUtils.js";import{BodySecondary as c,BodyCaption as r,Caption as g}from"../TypographyStyle.js";import"../datePicker/DatePickerWrapper.styled.js";import{MainDropdown as p,ItemMenuContainer as m}from"./CommonStyles.js";const u=a=>{let{options:r,placeholder:m="Select an option",selected:u,onOptionSelected:b,resetDropdown:h,maxHeight:y,backgroundcolor:f,calendarPopperConfig:D,variant:j="default",datePickerPlacement:k,closeDropdown:S,labelColor:R,styleProps:w}=a;var C,I,x;const[P,F]=n(!1),[L,$]=n(u),[T,N]=n(),[A,E]=n(!1),H=()=>{!P&&E(!A)},[M,V]=n(u),U="small"===j?g:c;return i((()=>{h&&$(void 0)}),[h]),i((()=>{var e;(null==u?void 0:u.isCustom)&&(null===(e=u.dateRangeSelectionOptions)||void 0===e?void 0:e.selectedDates)?N(u.dateRangeSelectionOptions.selectedDates):N(void 0),$(u)}),[u]),i((()=>{E(!1),F(!1)}),[S]),e(t,{children:o(p,Object.assign({drop:"down",show:A,onToggle:H,bgColor:f,id:"analytic-dropdown"},{children:[e(l.Toggle,Object.assign({id:"dropdown-autoclose-outside",className:"main--dropdown",style:"small"===j?{display:"flex",alignItems:"center",gap:6,padding:"4px 8px",backgroundColor:"#FAFAFA",borderRadius:4,border:`1px solid ${s.colorsV2.stroke.primary}`}:w||void 0},{children:e(U,Object.assign({style:"small"===j||R?{color:R||s.colorsV2.content.secondary}:void 0},{children:(null==L?void 0:L.isCustom)?T?O(T[0])===O(T[1])?`${O(T[0])}`:`${O(T[0])} to ${O(T[1])}`:(null==M?void 0:M.label)?null==M?void 0:M.label:m:L?null==L?void 0:L.label:m}))})),e(l.Menu,Object.assign({className:"main--dropdown"},{children:o(p,Object.assign({drop:null!=k?k:"end",id:"sub--dropdown",show:P,onToggle:e=>{!e&&E(!1),F(!P)}},{children:[e("div",Object.assign({style:{maxHeight:y||"auto",overflowY:"scroll"}},{children:r.map(((t,o)=>{var n;return e("div",{children:(null==t?void 0:t.isCustom)?e(l.Toggle,Object.assign({className:"sub--dropdown"},{children:e(v,{isFirstItem:0===o,isLastItem:o===r.length-1,eachOption:t,selectedOption:L,selectedDate:T,onClickingEachItem:e=>{$(e),F(!0)},rangeSelection:!!(null===(n=null==t?void 0:t.dateRangeSelectionOptions)||void 0===n?void 0:n.selectRange)})})):e(v,{isFirstItem:0===o,isLastItem:o===r.length-1,eachOption:t,selectedOption:L,selectedDate:T,onClickingEachItem:e=>{if(N(void 0),$(e),V(e),H(),!e.noOfDays)return void b(e);const t=new Date,o=new Date;o.setDate(t.getDate()-e.noOfDays),b(Object.assign(Object.assign({},e),{selectedRange:[o,t]}))}})},null==t?void 0:t.key)}))})),e(l.Menu,Object.assign({className:"sub--dropdown",popperConfig:{modifiers:[{name:"offset",options:{offset:[(null==D?void 0:D.offsetSkid)||0,(null==D?void 0:D.offsetDistance)||0]}}]}},{children:e(d,{selectRange:(null===(C=null==L?void 0:L.dateRangeSelectionOptions)||void 0===C?void 0:C.selectRange)||!1,maxDate:null===(I=null==L?void 0:L.dateRangeSelectionOptions)||void 0===I?void 0:I.maxDate,minDate:null===(x=null==L?void 0:L.dateRangeSelectionOptions)||void 0===x?void 0:x.minDate,selectedDates:T,onSelectRange:(e,t)=>{const o=[e,t];(null==L?void 0:L.dateRangeSelectionOptions)&&(L.dateRangeSelectionOptions.selectedDates=o,b(Object.assign(Object.assign({},L),{selectedRange:[e,t]}))),V(L),F(!1),N(o),E(!A)},onSelectDate:e=>{(null==L?void 0:L.dateRangeSelectionOptions)&&(L.dateRangeSelectionOptions.selectedDates=[e,e],b(Object.assign(Object.assign({},L),{selectedRange:[e,e]}))),V(L),F(!1),N([e,e]),E(!A)}})}))]}))}))]}))})},v=n=>{let{eachOption:i,selectedOption:l,selectedDate:s,onClickingEachItem:d,rangeSelection:g,isLastItem:p,isFirstItem:u}=n;return o(m,Object.assign({isFirstItem:u,isLastItem:p,onClick:()=>d(i),isSelected:i.isCustom?i.key==(null==l?void 0:l.key)&&!!s:i.key==(null==l?void 0:l.key)},{children:[e(c,Object.assign({color:i.key==(null==l?void 0:l.key)?a.positive[900]:a.grayscale[900]},{children:i.label})),i.subLabel?e(r,Object.assign({style:{color:a.grayscale[700]}},{children:i.subLabel})):e(t,{}),s&&(null==l?void 0:l.isCustom)&&i.key==(null==l?void 0:l.key)&&e(r,{children:g?`${O(s[0])} to ${O(s[1])}`:`${O(s[0])}`})]}),i.key)},O=e=>e.toLocaleString("default",{day:"numeric",month:"short",year:"numeric"});export{u as AnalyticsDropdown,v as EachItem,O as formatDate};
|
|
@@ -56,5 +56,7 @@ export interface TemplateContextMapperProps {
|
|
|
56
56
|
maxCharLimit?: number;
|
|
57
57
|
onDefaultVariableSelect?: (variable: VariableV3) => void;
|
|
58
58
|
skipDefaultVariableContent?: boolean;
|
|
59
|
+
disableDatePicker?: boolean;
|
|
60
|
+
disableCopyCode?: boolean;
|
|
59
61
|
}
|
|
60
|
-
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;
|
|
62
|
+
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, disableDatePicker, disableCopyCode, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as l,Fragment as o}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import{useEffect as
|
|
1
|
+
import{jsx as e,jsxs as l,Fragment as o}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 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:y,showOnlyContent:T,whatsappSpecificPickerMeta:V,zIndex:k,showVariableModal:w,variableList:D,discountCode:L,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,disableDatePicker:X,disableCopyCode:Y}=C;var Z,ee,le,oe,te,ie,re,ae;i((()=>{ve(E)}),[E]);const se=x===c.WHATSAPP&&"CAROUSEL"===(null===(ee=null===(Z=null==f?void 0:f.components)||void 0===Z?void 0:Z[1])||void 0===ee?void 0:ee.type),ne=null==f?void 0:f.isProductCarouselType,[de,ue]=r(x===c.EMAIL||x==c.WEBPUSH||se?"desktop":"mobile"),[ce,pe]=r(!1),[me,ve]=r(E),[he,be]=r(!1),[Ce,fe]=r([]),[ge,Pe]=r({}),[xe,Ee]=r(f),[Se,Ie]=r([]),[ye,Te]=r(null),[Ve,ke]=r(!1),[we,De]=r(null!=S?S:[]),[Le,je]=r(!1),[Me,Ae]=r(se?(null===(oe=null===(le=null==xe?void 0:xe.mapping)||void 0===le?void 0:le.body)||void 0===oe?void 0:oe.length)?-1:0:-1),[Be,He]=r([]),[Fe,Oe]=r(void 0),We=a(null),[Ne,ze]=r(!1),[Re,Ue]=r(!1),[$e,_e]=r(!1),[qe,Ge]=r({});i((()=>{z?He(z):ne&&He([])}),[z]),i((()=>{var e;if(!Ve&&ne&&(!z||0===He.length)){const l=null===(e=null==xe?void 0:xe.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,i;"HEADER"===e.type&&o.push(null!==(i=null===(t=null===(l=e.example)||void 0===l?void 0:l.header_handle)||void 0===t?void 0:t[0])&&void 0!==i?i:"")}))})),Ie(o),ke(!0)}}),[Ve]);const Je=s((()=>b(y)),[y]);return i((()=>{Oe(t(D))}),[D]),e(m.Provider,Object.assign({value:{hideFooterButton:$e,setHideFooterButton:_e,hideCrossButton:Re,setHideCrossButton:Ue,variableList:Fe,setVariableList:Oe,variableCallback:ye,setVariableCallback:Te,showVariablePicker:ce,setShowVariablePicker:pe,template:xe,setTemplate:Ee,device:de,setDevice:ue,display_content:me,setDisplayContent:ve,originalVariableList:we,setOriginalVariableList:De,isError:he,setIsError:be,channel:x,globalNormalizedPlaceholders:Je,templateSelectionTriggered:Le,setTemplateSelectionTriggered:je,enabledCustomText:A,disableEditVariable:F,pod:O,extras:W,isWhatsappCarousel:se,selectedCarouselIndex:Me,setSelectedCarouselIndex:Ae,isProductCarouselType:ne,templateErrorIndexes:ge,cardCount:se?null===(ie=null===(te=f.components)||void 0===te?void 0:te[1].cards)||void 0===ie?void 0:ie.length:void 0,errorIndexes:Ce,setErrorIndexes:fe,pickerConf:N,carouselProducts:Be,setCarouselProducts:He,disableEditExpiry:R,cardWidth:U,cardImages:Se,onDeleteSelectedProducts:$,hideDeviceContainerInPreview:G,sliderRef:We,isCarouselHovered:Ne,setIsCarouselHovered:ze,maxCharLimit:J,ctaOptionsErrors:qe,setCtaOptionsErrors:Ge,onDefaultVariableSelect:K,disableDatePicker:X,disableCopyCode:Y}},{children:T?e(h,{variableListFromProps:D,channel:c.EMAIL,hideHeader:!0}):l(u,Object.assign({hideCrossButton:Re,zIndex:k,centralContainerStyles:{width:se?900:x===c.EMAIL&&P?1e3:800},open:!0,onClose:()=>{null==g||g()},headingTitle:null==xe?void 0:xe.label,headingSubtitle:x===c.WHATSAPP?`${n.capitaliseFirstLetterOfString(null!==(re=null==xe?void 0:xe.category)&&void 0!==re?re:"")} • ${null!==(ae=null==xe?void 0:xe.templateCategory)&&void 0!==ae?ae:""}`:"",onBackPress:()=>{null==M||M()},modalHeaderStyles:{borderBottom:`1px solid ${d.stroke.primary}`}},{children:[e(h,{variableListFromProps:D,showSampleValues:H,showVariableMapping:P,channel:x,whatsappSpecificPickerMeta:V,showVariableModal:w,discountCode:L,setDiscountCode:j,variableListForImage:B&&(null==B?void 0:B.length)>0?B:Fe,fileName:_,setFileName:e=>{null==q||q(e)},skipDefaultVariableContent:Q}),I?e(v,{isWhatsappCarousel:null!=se&&se,onSelect:function(){var e;if((null==Be?void 0:Be.length)<1&&ne)return void be(!0);if(Object.keys(qe).length>0&&O!==p.CHATBOT)return void be(!0);const l=null==I?void 0:I(xe,we,null!=me?me:"",Be);Pe(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)&&fe(l.errorIndexes),(null==l?void 0:l.error)&&be(!!(null==l?void 0:l.error))):je(!0)}}):e(o,{})]}))}))};export{C as TemplateContextMapper};
|
|
@@ -9,6 +9,8 @@ import { AllTemplateTypes, AllTemplateVariables } from "../../template-preview/m
|
|
|
9
9
|
import { ExtrasWhatsapp } from "../../template-preview/models/WhatsAppTemplate";
|
|
10
10
|
export type DEVICE_TYPES = 'desktop' | 'mobile';
|
|
11
11
|
export declare const TemplateModalContext: React.Context<{
|
|
12
|
+
disableDatePicker?: boolean | undefined;
|
|
13
|
+
disableCopyCode?: boolean | undefined;
|
|
12
14
|
hideFooterButton: boolean;
|
|
13
15
|
setHideFooterButton: React.Dispatch<React.SetStateAction<boolean>>;
|
|
14
16
|
hideCrossButton: boolean;
|
|
@@ -76,6 +78,8 @@ export declare const TemplateModalContext: React.Context<{
|
|
|
76
78
|
onDefaultVariableSelect?: ((variable: VariableV3) => void) | undefined;
|
|
77
79
|
}>;
|
|
78
80
|
export declare const useTemplateModalContext: () => {
|
|
81
|
+
disableDatePicker?: boolean | undefined;
|
|
82
|
+
disableCopyCode?: boolean | undefined;
|
|
79
83
|
hideFooterButton: boolean;
|
|
80
84
|
setHideFooterButton: React.Dispatch<React.SetStateAction<boolean>>;
|
|
81
85
|
hideCrossButton: boolean;
|
|
@@ -1 +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};
|
|
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,disableDatePicker:!1}),l=()=>t(i);export{i as TemplateModalContext,l as useTemplateModalContext};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
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`
|
|
1
|
+
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 y from"./VariableConnectorWhatsApp.js";import x 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:yo,extras:xo,selectedCarouselIndex:Eo,isProductCarouselType:Vo,disableCopyCode:Bo}=u();console.log("disableCopyCode",Bo);const{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,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:So,mediaComponent:Co?Ao.imageComponent:Lo,fileRef:wo}),[Qo,qo]=l(!1),[Yo,Ko]=l(U),[Wo,$o]=l();function Go(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))?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,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))))Po(!0);else{Po(!1);const o=null===(n=null==xo?void 0:xo.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);_o({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);_o({descriptionComponents:o,urlBtns:n,qrbBtns:e,imageComponent:t,bodyVariables:i,headerVariables:l})}}),[Eo]),a((()=>{var o,n,e,t;if(null!=Eo&&Eo>-1&&Qo){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);_o({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,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})})):n(T,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:Vo?"420px":"auto"}},{children:[!!Ao.imageComponent&&!Vo&&n(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:m(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(d,{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=v(Yo);null==w||w(Yo),$o(o?"Please enter a valid PDF name":void 0)},onChangeText:o=>{$o(""),Ko(o)}})}):o(e,{})]}),(null===(W=Ao.bodyVariables)||void 0===W?void 0:W.length)>0&&o(x,{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(((n,e)=>o(y,{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(x,{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=>yo===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:Go},`${e}_${Eo}`)})),yo===p.CHATBOT&&(null===(eo=null===(no=Io[0])||void 0===no?void 0:no.component)||void 0===eo?void 0:eo.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==xo?void 0:xo.backTrackExtra)||void 0===ao?void 0:ao[0],setBackTrackMessage:null===(so=null==xo?void 0:xo.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&&(yo!==p.CHATBOT?o(x,{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==xo?void 0:xo.backTrackExtra)||void 0===co?void 0:co[0],setBackTrackMessage:null===(mo=null==xo?void 0:xo.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&&yo!==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:Xo},`${e}_${Eo}`)})),yo===p.CHATBOT&&No&&o(g,{discountCode:null===(fo=null==xo?void 0:xo.discountCodeExtra)||void 0===fo?void 0:fo[0],setDiscountCode:null===(ho=null==xo?void 0:xo.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:null==Bo||Bo,index:null!==(l=n.index)&&void 0!==l?l:0},showVariableModal:!0,componentType:"BUTTONS",buttonType:n.type},e)}))]}))},B=s.div`
|
|
2
2
|
padding-top: 24px;
|
|
3
3
|
padding-left: 10px;
|
|
4
4
|
padding-right: 10px;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
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
|
|
1
|
+
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 k=u.div`
|
|
2
2
|
/* surface/$color-background-warning-light */
|
|
3
3
|
|
|
4
4
|
background: ${e=>e.focused&&e.channel===v.EMAIL?f.background.warning.light:"transparent"};
|
|
5
5
|
border-radius: 4px;
|
|
6
6
|
padding: 8px 10px;
|
|
7
|
-
`,
|
|
7
|
+
`,V=u.div`
|
|
8
8
|
position: absolute;
|
|
9
9
|
top: 0;
|
|
10
10
|
left: 0;
|
|
@@ -13,4 +13,4 @@ import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import a from"..
|
|
|
13
13
|
background-color: rgba(0, 0, 0, 0.1);
|
|
14
14
|
z-index: 1000;
|
|
15
15
|
cursor: not-allowed;
|
|
16
|
-
`,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};
|
|
16
|
+
`,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:D,index:A,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:ke,disableDatePicker:Ve}=x();function Ce(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?(Be(null!==(l=o.value)&&void 0!==l?l:"","string"),null==Pe||Pe(null!==(a=D.index)&&void 0!==a?a:0,o.value,!0)):(null==Pe||Pe(null!==(i=D.index)&&void 0!==i?i:0,"",!0,o.value),Be("","url"===o.bikPlaceholderType?"link":"string")):"custom_text"!==o.value&&"custom_link"!==o.value?(Be(o.value,"url"===o.bikPlaceholderType?"link":"string"),de==v.WEBPUSH&&(null==Ae||Ae(null!==(n=D.index)&&void 0!==n?n:0,o.value))):(Q(""),Be("",o.value))}function Se(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;Be(i,"static_expiry"===e?"string":e),de===v.WHATSAPP&&(null==Pe||Pe(null!==(l=D.index)&&void 0!==l?l:0,i,"custom_link"===e,e)),de===v.WEBPUSH&&(null==Ae||Ae(null!==(a=D.index)&&void 0!==a?a:0,i))}function Be(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(A+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:D.variableName);const o=ce.map(((t,l)=>l===A?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===A?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)=>A===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===A?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===A?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===A?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===A?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 Pe(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))}console.log("disableDatePicker",Ve),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==D?void 0:D.type)?(l.push({label:"",options:[C,S]}),te(C)):"date_time"===(null==D?void 0:D.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)&&D.updatedValue)if(m.test(D.updatedValue)&&de===v.WHATSAPP||D.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}(D,a,de);e.value&&te(e)}else"date_time"===D.type?(te(B),Q(D.updatedValue),Pe(null!==(e=D.index)&&void 0!==e?e:0,D.updatedValue)):(null===(t=D.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(te(C),Q(D.updatedValue.split("https://")[1])):(te(S),Q(D.updatedValue))}()}),[he]),s((()=>{ue&&ee&&K&&setTimeout((()=>{Be("custom_link"===(null==ee?void 0:ee.value)&&K?K.includes("https")?K:`https://${K}`:K,ee.value)}),100)}),[ue]),s((()=>{!le&&ee&&D.updatedValue&&setTimeout((()=>{Be("custom_link"===(null==ee?void 0:ee.value)&&D.updatedValue?D.updatedValue.includes("https")?D.updatedValue:`https://${D.updatedValue}`:D.updatedValue,ee.value),ae(!0)}),100)}),[ee]);const De=e=>{null==w||w(!1),"{{custom.url}}"===e.actualValue?Ce({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?Ce({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?Ce({label:e.displayName,selected:!0,value:"static_expiry"}):Ce({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(k,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=D.variableName)||void 0===W?void 0:W.replace("{{","").replace("}}","")," ","link"===(null==D?void 0:D.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==D?void 0:D.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((()=>De)),se(!0)},width:24,height:24,color:f.content.primary})]})):t(r,{disabled:_e,options:J,isSearchable:!1,onSelect:Ce,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}-${A}`,value:K,errorMessage:re&&(null===(Y=null==Ee?void 0:Ee.buttons)||void 0===Y?void 0:Y.includes(null!==(M=null==D?void 0:D.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:ke||("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"===D.type||"custom_link"===ee.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{Se(ee.value,e)}}),"static_expiry"===(null==ee?void 0:ee.value)&&e("div",Object.assign({style:{position:"relative"}},{children:[(_e||Ve)&&t(V,{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=>{Se("static_expiry",e.toISOString())}})]})),"link"===D.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==D?void 0:D.index)&&void 0!==z?z:-1))&&void 0!==Z&&Z,params:null!==(q=D.queryParams)&&void 0!==q?q:[],onChange:e=>{Be(D.updatedValue,"link",e)},variableValue:D.updatedValue})]}))};export{k as Container,P as default};
|