@bikdotai/bik-component-library 0.0.506-beta-pdf-1.4 → 0.0.507-beta.filter-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.
Files changed (51) hide show
  1. package/dist/cjs/components/checkBox/CheckBox.d.ts +3 -0
  2. package/dist/cjs/components/checkBox/CheckBox.js +1 -1
  3. package/dist/cjs/components/checkBox/CheckBox.styled.d.ts +1 -0
  4. package/dist/cjs/components/checkBox/CheckBox.styled.js +4 -3
  5. package/dist/cjs/components/checkList/CheckList.d.ts +1 -0
  6. package/dist/cjs/components/checkList/CheckList.js +1 -1
  7. package/dist/cjs/components/input/Input.d.ts +0 -1
  8. package/dist/cjs/components/input/Input.js +1 -1
  9. package/dist/cjs/components/postPicker/postPicker.js +1 -1
  10. package/dist/cjs/components/radioButton/RadioButton.d.ts +1 -0
  11. package/dist/cjs/components/radioButton/RadioButton.js +1 -1
  12. package/dist/cjs/components/radioList/RadioList.d.ts +1 -0
  13. package/dist/cjs/components/radioList/RadioList.js +1 -1
  14. package/dist/cjs/components/tabs/Tabs.js +1 -1
  15. package/dist/cjs/components/tabs/Tabs.model.d.ts +1 -0
  16. package/dist/cjs/components/template-context-mapper/TemplateContextMapper.d.ts +1 -3
  17. package/dist/cjs/components/template-context-mapper/TemplateContextMapper.js +1 -1
  18. package/dist/cjs/components/template-context-mapper/modalElements/Body.d.ts +0 -2
  19. package/dist/cjs/components/template-context-mapper/modalElements/Body.js +5 -5
  20. package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.d.ts +1 -3
  21. package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +1 -7
  22. package/dist/cjs/components/template-context-mapper/modalElements/TemplateSelectModalContent.d.ts +1 -3
  23. package/dist/cjs/components/template-context-mapper/modalElements/TemplateSelectModalContent.js +1 -1
  24. package/dist/esm/components/checkBox/CheckBox.d.ts +3 -0
  25. package/dist/esm/components/checkBox/CheckBox.js +1 -1
  26. package/dist/esm/components/checkBox/CheckBox.styled.d.ts +1 -0
  27. package/dist/esm/components/checkBox/CheckBox.styled.js +6 -5
  28. package/dist/esm/components/checkList/CheckList.d.ts +1 -0
  29. package/dist/esm/components/checkList/CheckList.js +1 -1
  30. package/dist/esm/components/input/Input.d.ts +0 -1
  31. package/dist/esm/components/input/Input.js +1 -1
  32. package/dist/esm/components/postPicker/postPicker.js +1 -1
  33. package/dist/esm/components/radioButton/RadioButton.d.ts +1 -0
  34. package/dist/esm/components/radioButton/RadioButton.js +1 -1
  35. package/dist/esm/components/radioList/RadioList.d.ts +1 -0
  36. package/dist/esm/components/radioList/RadioList.js +1 -1
  37. package/dist/esm/components/tabs/Tabs.js +1 -1
  38. package/dist/esm/components/tabs/Tabs.model.d.ts +1 -0
  39. package/dist/esm/components/template-context-mapper/TemplateContextMapper.d.ts +1 -3
  40. package/dist/esm/components/template-context-mapper/TemplateContextMapper.js +1 -1
  41. package/dist/esm/components/template-context-mapper/modalElements/Body.d.ts +0 -2
  42. package/dist/esm/components/template-context-mapper/modalElements/Body.js +2 -2
  43. package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.d.ts +1 -3
  44. package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +1 -7
  45. package/dist/esm/components/template-context-mapper/modalElements/TemplateSelectModalContent.d.ts +1 -3
  46. package/dist/esm/components/template-context-mapper/modalElements/TemplateSelectModalContent.js +1 -1
  47. package/package.json +1 -1
  48. package/dist/cjs/components/template-context-mapper/utils/validateName.d.ts +0 -1
  49. package/dist/cjs/components/template-context-mapper/utils/validateName.js +0 -1
  50. package/dist/esm/components/template-context-mapper/utils/validateName.d.ts +0 -1
  51. package/dist/esm/components/template-context-mapper/utils/validateName.js +0 -1
@@ -8,5 +8,8 @@ export type CheckBoxProps = {
8
8
  label?: string;
9
9
  size?: 'DEFAULT' | 'SMALL';
10
10
  skipHoverState?: boolean;
11
+ labelSize?: 'DEFAULT' | 'SMALL';
12
+ rightComponent?: JSX.Element;
13
+ checkboxBorderColor?: string;
11
14
  };
12
15
  export declare const CheckBox: React.FC<CheckBoxProps>;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("react"),i=require("./CheckBox.styled.js"),l=require("../TypographyStyle.js"),t=require("../../constants/Theme.js");const a=s=>e.jsxs("svg",Object.assign({width:s.isSmall?"16":"18",height:s.isSmall?"16":"18",viewBox:s.isSmall?"0 0 16 16":"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e.jsx("rect",{x:"0",y:"0",width:s.isSmall?"16":"18",height:s.isSmall?"16":"18",rx:"4",fill:s.isDisabled?t.COLORS.content.inactive:t.COLORS.background.positive.vibrant}),!s.isPartial&&e.jsx("svg",Object.assign({width:s.isSmall?"8":"10",height:s.isSmall?"7":"9",x:"4",y:"4",viewBox:"0 0 10 9",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:e.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M9.68189 1.06043C10.0724 1.45096 10.0724 2.08412 9.68189 2.47464L4.02501 8.13152C3.63449 8.52205 3.00132 8.52205 2.6108 8.13152L0.489684 6.01041C0.0991601 5.61988 0.0991598 4.98672 0.489684 4.59619C0.880209 4.20567 1.51337 4.20567 1.9039 4.59619L3.31791 6.0102L8.26768 1.06043C8.6582 0.669907 9.29137 0.669907 9.68189 1.06043Z",fill:"white"})})),s.isPartial&&e.jsx("rect",{x:"5",y:s.isSmall?"7":"8",width:s.isSmall?"6":"8",height:"2",rx:"1",fill:t.COLORS.surface.standard})]}));exports.CheckBox=r=>{const[c,n]=s.useState(r.isChecked||!1),[o,d]=s.useState(r.isPartiallyChecked||!1),[h,x]=s.useState(r.isDisabled||!1),[u,S]=s.useState(!1),[b,C]=s.useState(!1);return s.useEffect((()=>{n(r.isChecked)}),[r.isChecked]),s.useEffect((()=>{x(r.isDisabled||!1)}),[r.isDisabled]),s.useEffect((()=>{d(r.isPartiallyChecked||!1)}),[r.isPartiallyChecked]),e.jsxs(i.CheckboxContainer,Object.assign({onClick:e=>{var s;if(!r.isDisabled){const i=!c;o?d(!o):n(i),null===(s=r.onValueChange)||void 0===s||s.call(r,i,r.value,e)}},onMouseEnter:()=>S(!r.skipHoverState),onMouseLeave:()=>S(!1),onMouseDown:()=>C(!r.skipHoverState),onMouseUp:()=>C(!1)},{children:[e.jsx(i.CheckboxIcon,Object.assign({checked:c,hovered:u,clicked:b,isDisabled:h,size:r.size},{children:c&&e.jsx(a,{isPartial:o||!1,isDisabled:h,isSmall:"SMALL"===r.size})})),r.label&&"SMALL"!==r.size&&e.jsx(l.BodyPrimary,Object.assign({color:r.isDisabled?t.COLORS.text.disabled:t.COLORS.text.primary},{children:r.label})),r.label&&"SMALL"===r.size&&e.jsx(l.BodySecondary,Object.assign({color:r.isDisabled?t.COLORS.text.disabled:t.COLORS.text.primary},{children:r.label}))]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),s=require("./CheckBox.styled.js"),l=require("../TypographyStyle.js"),t=require("../../constants/Theme.js");const a=i=>e.jsxs("svg",Object.assign({width:i.isSmall?"16":"18",height:i.isSmall?"16":"18",viewBox:i.isSmall?"0 0 16 16":"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e.jsx("rect",{x:"0",y:"0",width:i.isSmall?"16":"18",height:i.isSmall?"16":"18",rx:"4",fill:i.isDisabled?t.COLORS.content.inactive:t.COLORS.background.positive.vibrant}),!i.isPartial&&e.jsx("svg",Object.assign({width:i.isSmall?"8":"10",height:i.isSmall?"7":"9",x:"4",y:"4",viewBox:"0 0 10 9",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:e.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M9.68189 1.06043C10.0724 1.45096 10.0724 2.08412 9.68189 2.47464L4.02501 8.13152C3.63449 8.52205 3.00132 8.52205 2.6108 8.13152L0.489684 6.01041C0.0991601 5.61988 0.0991598 4.98672 0.489684 4.59619C0.880209 4.20567 1.51337 4.20567 1.9039 4.59619L3.31791 6.0102L8.26768 1.06043C8.6582 0.669907 9.29137 0.669907 9.68189 1.06043Z",fill:"white"})})),i.isPartial&&e.jsx("rect",{x:"5",y:i.isSmall?"7":"8",width:i.isSmall?"6":"8",height:"2",rx:"1",fill:t.COLORS.surface.standard})]}));exports.CheckBox=r=>{const[o,c]=i.useState(r.isChecked||!1),[n,d]=i.useState(r.isPartiallyChecked||!1),[h,S]=i.useState(r.isDisabled||!1),[x,b]=i.useState(!1),[u,C]=i.useState(!1);return i.useEffect((()=>{c(r.isChecked)}),[r.isChecked]),i.useEffect((()=>{S(r.isDisabled||!1)}),[r.isDisabled]),i.useEffect((()=>{d(r.isPartiallyChecked||!1)}),[r.isPartiallyChecked]),e.jsxs(s.CheckboxContainer,Object.assign({onClick:e=>{var i;if(!r.isDisabled){const s=!o;n?d(!n):c(s),null===(i=r.onValueChange)||void 0===i||i.call(r,s,r.value,e)}},onMouseEnter:()=>b(!r.skipHoverState),onMouseLeave:()=>b(!1),onMouseDown:()=>C(!r.skipHoverState),onMouseUp:()=>C(!1)},{children:[e.jsx(s.CheckboxIcon,Object.assign({checked:o,hovered:x,clicked:u,isDisabled:h,size:r.size,borderColor:r.checkboxBorderColor},{children:o&&e.jsx(a,{isPartial:n||!1,isDisabled:h,isSmall:"SMALL"===r.size})})),r.label&&"SMALL"!==r.size&&"SMALL"!==r.labelSize&&e.jsx(l.BodyPrimary,Object.assign({color:r.isDisabled?t.COLORS.text.disabled:t.COLORS.text.primary},{children:r.label})),r.label&&("SMALL"===r.size||"SMALL"===r.labelSize)&&e.jsx(l.BodySecondary,Object.assign({color:r.isDisabled?t.COLORS.text.disabled:t.COLORS.text.primary},{children:r.label})),r.rightComponent]}))};
@@ -5,4 +5,5 @@ export declare const CheckboxIcon: import("styled-components").StyledComponent<"
5
5
  clicked: boolean;
6
6
  isDisabled: boolean;
7
7
  size?: "SMALL" | "DEFAULT" | undefined;
8
+ borderColor?: string | undefined;
8
9
  }, never>;
@@ -12,12 +12,13 @@
12
12
  justify-content: center;
13
13
  align-items: center;
14
14
  box-sizing: content-box;
15
- ${s=>s.isDisabled?e.css`
15
+ ${s=>{var t;return s.isDisabled?e.css`
16
16
  border: ${"SMALL"===s.size?1.5:2}px solid
17
17
  ${i.COLORS.content.inactive};
18
18
  `:e.css`
19
- border: ${"SMALL"===s.size?1.5:2}px solid black;
20
- `}
19
+ border: ${"SMALL"===s.size?1.5:2}px solid
20
+ ${null!==(t=s.borderColor)&&void 0!==t?t:"black"};
21
+ `}}
21
22
  ${i=>i.checked&&e.css`
22
23
  border: 0px;
23
24
  width: 18px;
@@ -8,6 +8,7 @@ export type CheckListProps = {
8
8
  subTitle?: string;
9
9
  listItems: CheckListItem[];
10
10
  onChange: (options: CheckListItem[]) => void;
11
+ listContainerStyles?: React.CSSProperties;
11
12
  };
12
13
  export declare const CheckList: React.FC<CheckListProps>;
13
14
  export {};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("react"),t=require("../checkBox/CheckBox.js"),i=require("./CheckList.styled.js"),r=require("../TypographyStyle.js"),c=require("../../constants/Theme.js");exports.CheckList=l=>{const[n,a]=s.useState(l.listItems);s.useEffect((()=>{a(l.listItems)}),[l.listItems]);const o=(e,s)=>{const t=[...n],i=n.find((e=>e.value===s));i&&(i.isChecked=e),a(t);const r=t.filter((e=>e.isChecked));l.onChange(r)};return e.jsxs(i.CheckListStyled,{children:[(l.title||l.subTitle)&&e.jsxs("div",Object.assign({className:"title__container"},{children:[l.title&&e.jsx(r.TitleRegular,{children:l.title}),l.subTitle&&e.jsx(r.BodySecondary,Object.assign({color:c.COLORS.text.secondary},{children:l.subTitle}))]})),e.jsx("div",Object.assign({className:"list__container"},{children:n.map((s=>e.jsx(t.CheckBox,Object.assign({},s,{onValueChange:o}),s.value)))}))]})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("react"),t=require("../checkBox/CheckBox.js"),i=require("./CheckList.styled.js"),r=require("../TypographyStyle.js"),c=require("../../constants/Theme.js");exports.CheckList=l=>{var n;const[a,o]=s.useState(l.listItems);s.useEffect((()=>{o(l.listItems)}),[l.listItems]);const u=(e,s)=>{const t=[...a],i=a.find((e=>e.value===s));i&&(i.isChecked=e),o(t);const r=t.filter((e=>e.isChecked));l.onChange(r)};return e.jsxs(i.CheckListStyled,{children:[(l.title||l.subTitle)&&e.jsxs("div",Object.assign({className:"title__container"},{children:[l.title&&e.jsx(r.TitleRegular,{children:l.title}),l.subTitle&&e.jsx(r.BodySecondary,Object.assign({color:c.COLORS.text.secondary},{children:l.subTitle}))]})),e.jsx("div",Object.assign({style:null!==(n=l.listContainerStyles)&&void 0!==n?n:{},className:"list__container"},{children:a.map((s=>e.jsx(t.CheckBox,Object.assign({},s,{onValueChange:u}),s.value)))}))]})};
@@ -57,6 +57,5 @@ export interface InputProps {
57
57
  autoGrow?: boolean;
58
58
  minHeight?: string;
59
59
  maxHeight?: string;
60
- labelTextBold?: boolean;
61
60
  }
62
61
  export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement | HTMLTextAreaElement | null>>;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/info.svg.js"),n=require("react"),i=require("../button/Button.js"),r=require("./Input-helper.js"),s=require("../tooltips/Tooltip.js"),l=require("../TypographyStyle.js"),a=require("../../constants/Theme.js"),o=require("../../assets/icons/errorInfo.svg.js"),u=require("./context/InputStyleProvider.js"),c=require("./Input.styled.js");const d=n.forwardRef(((d,h)=>{var v,p,x,g,j;const{placeholder:f,leftIcon:y,rightIcon:b,labelText:m,maxCharLimit:C,isRequired:I,hintText:O,type:w,state:S,validate:T,variant:E,button:k,suffixText:q,prefixText:H,onChangeText:F,value:L,noErrorHint:R,reset:B,rangeValidation:M,noKeyDownChange:z,version:A,noMaxCharCheck:D,labelElement:_,autoGrow:K,minHeight:P,maxHeight:G,labelTextBold:N}=Object.assign({maxCharLimit:0,type:"text",variant:"default"},d),W=null==y?void 0:y.icon,V=null==b?void 0:b.icon,[$,J]=n.useState(!1),[Q,U]=n.useState(!1),[X,Y]=n.useState(),Z="small"===E?"18px":"22px",ee=n.useContext(u.InputStyleContext),[te,ne]=n.useState(),ie=n.useRef(null),re=null!=h?h:ie;n.useEffect((()=>{ne(L),!L&&K&&(re.current.style.height=P||"48px")}),[L]),n.useEffect((()=>{var e;re.current&&(null===(e=d.onReferenceInit)||void 0===e||e.call(d,re.current))}),[re]),n.useEffect((()=>{const e=re.current;if(e&&["phonenumber","zip","number"].includes(w))return e.addEventListener("wheel",oe,{passive:!1}),()=>{e.removeEventListener("wheel",oe)}}),[]),n.useEffect((()=>{B&&ne("")}),[B]),n.useEffect((()=>{var e;U(!!d.isActive),d.isActive&&(null===(e=re.current)||void 0===e||e.focus())}),[d.isActive]),n.useEffect((()=>{Y(d.errorMessage)}),[d.errorMessage]),n.useEffect((()=>{var e;J(!1),("invalid"===d.state||X||"disabled-invalid"===d.state)&&J(!0),"active"===d.state&&(null===(e=re.current)||void 0===e||e.focus())}),[d.state,X]),n.useEffect((()=>{J(!!X)}),[X]);const se=function(e){if(r.isFunction(e)){for(var t=arguments.length,n=new Array(t>1?t-1:0),i=1;i<t;i++)n[i-1]=arguments[i];e(...n)}},le=()=>"zip"===w?6:60,ae=e=>{const t=0!==C?C:le();if(z||F(L||"",e),D)return;const n=e.target.value;![8].includes(e.which)&&t>0&&n.length>=t&&e.preventDefault()},oe=e=>{e.preventDefault()},ue=e=>{let t=e.target.value;const n=0!==C?C+1:le();!D&&n>0&&t.length>=n&&(t=t.substring(0,n-1)),F(t,e),d.textControl||ne(t),K&&(re.current.style.height=`${re.current.scrollHeight}px`,t||(re.current.style.height=P||"48px"));const i=T||r.validateInput;if(!i||!r.isFunction(i))return;const[s,l]=i(t,w,M);J(!s),Y(d.errorMessage?d.errorMessage:l)},ce=e=>{var t;d.skipFocus||U(!0),se(null===(t=d.onFocus)||void 0===t?void 0:t.call(d,e))},de=e=>{var t;d.skipFocus||U(!1),se(null===(t=d.onBlur)||void 0===t?void 0:t.call(d,e))},he=()=>{var t;return e.jsxs(e.Fragment,{children:["multiline"!==w&&e.jsx("input",{"data-test":d["data-test"],id:d.id,style:null!==(t=null==ee?void 0:ee.input)&&void 0!==t?t:{},ref:re,type:["phonenumber","zip","number"].includes(w)?"number":w,value:te,onFocus:e=>ce(e),onBlur:e=>de(e),placeholder:f||"Enter here",onChange:ue,onClick:e=>se(d.onClick),onKeyDown:e=>ae(e)}),"multiline"===w&&e.jsx("textarea",{"data-test":d["data-test"],value:te,ref:re,onFocus:e=>ce(e),onBlur:e=>de(e),onClick:e=>se(d.onClick),placeholder:f||"Enter here",onChange:ue,onKeyDown:e=>ae(e),maxLength:C>0?C:void 0})]})};return e.jsxs(c.RootContainer,Object.assign({width:d.width,height:d.height,state:S,type:w,style:null!==(v=null==ee?void 0:ee.RootContainer)&&void 0!==v?v:{}},{children:[!R&&(!!O||!!X)&&e.jsxs(c.InputFooter,Object.assign({invalid:!!X},{children:[!!X&&e.jsx(o.default,{width:16,height:16}),X||O]})),e.jsxs(c.InputWrapper,Object.assign({variant:E,state:S,width:d.width,isActive:"active"===S||Q,isInvalid:$,style:null!==(p=null==ee?void 0:ee.InputWrapper)&&void 0!==p?p:{},version:A,height:d.height},{children:[!!W&&e.jsx(c.IconHolder,Object.assign({variant:E,iconSize:Z,onClick:()=>se(null==y?void 0:y.callback),isLeft:!0,style:null!==(x=null==ee?void 0:ee.IconHolder)&&void 0!==x?x:{}},{children:e.jsx(W,{})})),!!H&&e.jsx(c.PrefixHolder,Object.assign({variant:E},{children:H})),"default"===E&&e.jsx(c.InputContainer,Object.assign({height:d.height,type:d.type,minHeight:P,maxHeight:G,autoGrow:K},{children:he()})),"small"===E&&e.jsx(c.InputContainerSmall,Object.assign({height:d.height,type:d.type},{children:he()})),!!V&&e.jsx(c.IconHolder,Object.assign({variant:E,iconSize:Z,onClick:()=>se(null==b?void 0:b.callback),isLeft:!1},{children:e.jsx(V,{})})),!!q&&e.jsx(c.SuffixHolder,Object.assign({variant:E},{children:q})),k&&k.text&&e.jsx(i.Button,{buttonText:k.text,onClick:()=>se(null==k?void 0:k.onClick)})]})),(!!m||!!C)&&e.jsxs(c.InputHeader,Object.assign({invalid:$},{children:[_&&_,e.jsxs("div",Object.assign({className:"label__container"},{children:[N?e.jsxs(l.TitleSmall,{children:[m,I?e.jsx("span",{children:"*"}):""]}):e.jsxs(l.BodySecondary,{children:[m,I?e.jsx("span",{children:"*"}):""]}),d.tooltipText&&e.jsx(s.Tooltip,Object.assign({body:d.tooltipText,placement:"top"},{children:e.jsx("span",{children:e.jsx(t.default,{style:{marginTop:-3},width:18,height:18,color:$?a.COLORS.content.negative:a.COLORS.content.primary})})}))]})),C>0&&e.jsxs(c.MaxCharStyle,{children:[null!==(j=null===(g=d.value)||void 0===g?void 0:g.length)&&void 0!==j?j:0,"/",C]})]}))]}))}));d.displayName="Input",exports.Input=d;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/info.svg.js"),n=require("react"),i=require("../button/Button.js"),r=require("./Input-helper.js"),s=require("../tooltips/Tooltip.js"),l=require("../TypographyStyle.js"),o=require("../../constants/Theme.js"),a=require("../../assets/icons/errorInfo.svg.js"),u=require("./context/InputStyleProvider.js"),c=require("./Input.styled.js");const d=n.forwardRef(((d,h)=>{var v,p,x,g,f;const{placeholder:j,leftIcon:y,rightIcon:b,labelText:m,maxCharLimit:C,isRequired:I,hintText:O,type:w,state:S,validate:E,variant:k,button:T,suffixText:q,prefixText:H,onChangeText:F,value:L,noErrorHint:R,reset:M,rangeValidation:B,noKeyDownChange:z,version:A,noMaxCharCheck:D,labelElement:_,autoGrow:K,minHeight:P,maxHeight:G}=Object.assign({maxCharLimit:0,type:"text",variant:"default"},d),N=null==y?void 0:y.icon,W=null==b?void 0:b.icon,[V,$]=n.useState(!1),[J,Q]=n.useState(!1),[U,X]=n.useState(),Y="small"===k?"18px":"22px",Z=n.useContext(u.InputStyleContext),[ee,te]=n.useState(),ne=n.useRef(null),ie=null!=h?h:ne;n.useEffect((()=>{te(L),!L&&K&&(ie.current.style.height=P||"48px")}),[L]),n.useEffect((()=>{var e;ie.current&&(null===(e=d.onReferenceInit)||void 0===e||e.call(d,ie.current))}),[ie]),n.useEffect((()=>{const e=ie.current;if(e&&["phonenumber","zip","number"].includes(w))return e.addEventListener("wheel",oe,{passive:!1}),()=>{e.removeEventListener("wheel",oe)}}),[]),n.useEffect((()=>{M&&te("")}),[M]),n.useEffect((()=>{var e;Q(!!d.isActive),d.isActive&&(null===(e=ie.current)||void 0===e||e.focus())}),[d.isActive]),n.useEffect((()=>{X(d.errorMessage)}),[d.errorMessage]),n.useEffect((()=>{var e;$(!1),("invalid"===d.state||U||"disabled-invalid"===d.state)&&$(!0),"active"===d.state&&(null===(e=ie.current)||void 0===e||e.focus())}),[d.state,U]),n.useEffect((()=>{$(!!U)}),[U]);const re=function(e){if(r.isFunction(e)){for(var t=arguments.length,n=new Array(t>1?t-1:0),i=1;i<t;i++)n[i-1]=arguments[i];e(...n)}},se=()=>"zip"===w?6:60,le=e=>{const t=0!==C?C:se();if(z||F(L||"",e),D)return;const n=e.target.value;![8].includes(e.which)&&t>0&&n.length>=t&&e.preventDefault()},oe=e=>{e.preventDefault()},ae=e=>{let t=e.target.value;const n=0!==C?C+1:se();!D&&n>0&&t.length>=n&&(t=t.substring(0,n-1)),F(t,e),d.textControl||te(t),K&&(ie.current.style.height=`${ie.current.scrollHeight}px`,t||(ie.current.style.height=P||"48px"));const i=E||r.validateInput;if(!i||!r.isFunction(i))return;const[s,l]=i(t,w,B);$(!s),X(d.errorMessage?d.errorMessage:l)},ue=e=>{var t;d.skipFocus||Q(!0),re(null===(t=d.onFocus)||void 0===t?void 0:t.call(d,e))},ce=e=>{var t;d.skipFocus||Q(!1),re(null===(t=d.onBlur)||void 0===t?void 0:t.call(d,e))},de=()=>{var t;return e.jsxs(e.Fragment,{children:["multiline"!==w&&e.jsx("input",{"data-test":d["data-test"],id:d.id,style:null!==(t=null==Z?void 0:Z.input)&&void 0!==t?t:{},ref:ie,type:["phonenumber","zip","number"].includes(w)?"number":w,value:ee,onFocus:e=>ue(e),onBlur:e=>ce(e),placeholder:j||"Enter here",onChange:ae,onClick:e=>re(d.onClick),onKeyDown:e=>le(e)}),"multiline"===w&&e.jsx("textarea",{"data-test":d["data-test"],value:ee,ref:ie,onFocus:e=>ue(e),onBlur:e=>ce(e),onClick:e=>re(d.onClick),placeholder:j||"Enter here",onChange:ae,onKeyDown:e=>le(e),maxLength:C>0?C:void 0})]})};return e.jsxs(c.RootContainer,Object.assign({width:d.width,height:d.height,state:S,type:w,style:null!==(v=null==Z?void 0:Z.RootContainer)&&void 0!==v?v:{}},{children:[!R&&(!!O||!!U)&&e.jsxs(c.InputFooter,Object.assign({invalid:!!U},{children:[!!U&&e.jsx(a.default,{width:16,height:16}),U||O]})),e.jsxs(c.InputWrapper,Object.assign({variant:k,state:S,width:d.width,isActive:"active"===S||J,isInvalid:V,style:null!==(p=null==Z?void 0:Z.InputWrapper)&&void 0!==p?p:{},version:A,height:d.height},{children:[!!N&&e.jsx(c.IconHolder,Object.assign({variant:k,iconSize:Y,onClick:()=>re(null==y?void 0:y.callback),isLeft:!0,style:null!==(x=null==Z?void 0:Z.IconHolder)&&void 0!==x?x:{}},{children:e.jsx(N,{})})),!!H&&e.jsx(c.PrefixHolder,Object.assign({variant:k},{children:H})),"default"===k&&e.jsx(c.InputContainer,Object.assign({height:d.height,type:d.type,minHeight:P,maxHeight:G,autoGrow:K},{children:de()})),"small"===k&&e.jsx(c.InputContainerSmall,Object.assign({height:d.height,type:d.type},{children:de()})),!!W&&e.jsx(c.IconHolder,Object.assign({variant:k,iconSize:Y,onClick:()=>re(null==b?void 0:b.callback),isLeft:!1},{children:e.jsx(W,{})})),!!q&&e.jsx(c.SuffixHolder,Object.assign({variant:k},{children:q})),T&&T.text&&e.jsx(i.Button,{buttonText:T.text,onClick:()=>re(null==T?void 0:T.onClick)})]})),(!!m||!!C)&&e.jsxs(c.InputHeader,Object.assign({invalid:V},{children:[_&&_,e.jsxs("div",Object.assign({className:"label__container"},{children:[e.jsxs(l.BodySecondary,{children:[m,I?e.jsx("span",{children:"*"}):""]}),d.tooltipText&&e.jsx(s.Tooltip,Object.assign({body:d.tooltipText,placement:"top"},{children:e.jsx("span",{children:e.jsx(t.default,{style:{marginTop:-3},width:18,height:18,color:V?o.COLORS.content.negative:o.COLORS.content.primary})})}))]})),C>0&&e.jsxs(c.MaxCharStyle,{children:[null!==(f=null===(g=d.value)||void 0===g?void 0:g.length)&&void 0!==f?f:0,"/",C]})]}))]}))}));d.displayName="Input",exports.Input=d;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/searchIcon.js"),a=require("react"),s=require("./PostPicker.styled.js"),r=require("../tag/Tag.js"),i=require("../TypographyStyle.js"),n=require("../../utils/unCamelCase.js"),o=require("../../constants/colors.js"),l=require("../../constants/Theme.js"),d=require("../../assets/icons/instagram.svg.js"),c=require("../../assets/icons/warning.svg.js");require("../tooltips/Tooltip.js"),require("../analytics-chips-and-dropdowns/CommonStyles.js");var p=require("../analytics-chips-and-dropdowns/AnalyticsDropdown.js");require("../analytics-chips-and-dropdowns/AnalyticsMetric.js"),require("../shimmer/ShimmerComponent/ShimmerStyled.js"),require("../../utils/DateUtils.js"),require("../analytics-chips-and-dropdowns/chart/LineChart/LineChart.js"),require("react-bootstrap"),require("../analytics-chips-and-dropdowns/chart/linearChipGroupedChart/LinearChipGroupedChart.styled.js"),require("../analytics-chips-and-dropdowns/chart/Pie/PieChartAnalytics.js"),require("../analytics-chips-and-dropdowns/chart/Pie/PieChart.js"),require("../analytics-chips-and-dropdowns/chart/HorizontalBarGraph/HorizontalGraph.js"),require("../analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js"),require("../analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarDistributionChart.js"),require("../analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarDistributionChart.model.js"),require("../analytics-chips-and-dropdowns/chart/VerticalBarGraph/VerticalGraph.js"),require("../analytics-chips-and-dropdowns/chart/heatmap/HeatMap.js"),require("../analytics-chips-and-dropdowns/chart/heatmap/HeatMapVertical.js"),require("../analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.js");var u,h,y=require("../modals/styledModal.js"),m=require("../shimmer/ShimmerComponent/BikShimmer.js"),g=require("../shimmer-image/ShimmerImage.js"),j=require("../states/StateComponent.js");require("../../_virtual/_tslib.js"),exports.MEDIA_TYPES=void 0,(u=exports.MEDIA_TYPES||(exports.MEDIA_TYPES={})).STORY="story",u.POST="post",u.REEL="reel",exports.DateKeys=void 0,(h=exports.DateKeys||(exports.DateKeys={})).Today="Today",h["7_Days"]="7",h["30_Days"]="30",h.custom="custom",h.Yesterday="Yesterday";const x=[{label:"Today",value:"today",key:exports.DateKeys.Today,typeValue:[new Date,new Date]},{label:"Last 7 days",value:"7 days",key:exports.DateKeys["7_Days"],typeValue:[new Date((new Date).setDate((new Date).getDate()-6)),new Date]},{label:"Last 30 days",value:"30 days",key:exports.DateKeys["30_Days"],typeValue:[new Date((new Date).setDate((new Date).getDate()-29)),new Date]},{label:"Custom range",value:"calender",key:exports.DateKeys.custom,isCustom:!0,dateRangeSelectionOptions:{selectRange:!0,maxDate:new Date((new Date).setMonth((new Date).getMonth()+3))}}];exports.PostPicker=u=>{var h,S;const[D,v]=a.useState(null!==(h=u.previouslySelected)&&void 0!==h?h:[]),[w,C]=a.useState(""),[T,b]=a.useState(!1),[f,O]=a.useState(u.media),[q,k]=a.useState(!1),[E,P]=a.useState(!1),[B,I]=a.useState(!1),_=a.useRef(null);a.useEffect((()=>{u.media.length||(b(!0),setTimeout((()=>{b(!1)}),2e3)),v(u.selected||[])}),[]),a.useEffect((()=>{u.media.length>0&&(O(u.media),b(!1))}),[null===(S=null==u?void 0:u.media)||void 0===S?void 0:S.length]),a.useEffect((()=>{D.length>0&&C("")}),[D.length]),a.useEffect((()=>{q&&(O(u.media),P(!1))}),[q]),a.useEffect((()=>{const e=e=>{document.getElementById("analytic-dropdown").contains(e.target)||I(!B)},t=document.getElementById("post-picker");return t&&t.addEventListener("click",e),()=>{t&&t.removeEventListener("click",e)}}));return e.jsx("div",Object.assign({ref:_},{children:e.jsxs(y.StyledModal,Object.assign({zIndex:201,open:u.showModal,headingTitle:u.title,onClose:u.onClose,centralContainerStyles:{width:1071,height:u.showFilter?650:564},primaryButton:{disabled:!f.length,buttonType:"primary",buttonText:`Select ${n.unCamelCase(u.mediaType)}`,onClick:()=>{D.length?u.onSelect(D):C(`Please select a ${u.mediaType} to proceed`)}},secondaryButton:{buttonType:"secondary",buttonText:"Back",onClick:()=>u.onClose()},footerLeftCustomElement:w?e.jsx(r.Tag,{tagText:w,type:"negative",LeadingIcon:c.default}):D.length?e.jsxs(i.BodySecondary,{children:[D.length," selected"]}):null,id:"post-picker"},{children:[u.showFilter&&e.jsxs("div",Object.assign({style:{marginTop:24,marginBottom:24,padding:"0 24px",display:"flex",flexDirection:"row",gap:8,alignItems:"center"}},{children:[e.jsx(p.AnalyticsDropdown,{options:x,placeholder:"posted on",resetDropdown:q,onOptionSelected:e=>{var t,a;let s=null,r=null;"Custom range"===e.label?(s=(null===(t=null==e?void 0:e.selectedRange)||void 0===t?void 0:t[0])||new Date,r=(null===(a=null==e?void 0:e.selectedRange)||void 0===a?void 0:a[1])||new Date):(s=e.typeValue[0],r=e.typeValue[1]);const i=u.media.filter((e=>function(e,t,a){const s=new Date(e),r=new Date(t),i=new Date(a);return s>=r&&s<=i}(e.timestamp,s,r)));O(i),P(!0),k(!1)},closeDropdown:B}),E&&e.jsx(i.ButtonRegular,Object.assign({color:l.COLORS.content.secondary,onClick:()=>k(!0)},{children:"Clear"}))]})),T?e.jsx("div",Object.assign({style:{padding:"0 24px"}},{children:e.jsx(m.BikShimmer,{boxes:[{width:(u.mediaType==exports.MEDIA_TYPES.POST?148:104)+"px",height:(u.mediaType==exports.MEDIA_TYPES.POST?148:172)+"px"}]})})):e.jsx(e.Fragment,{children:f&&f.length?e.jsx(s.StyledProductGrid,Object.assign({mediaType:u.mediaType},{children:f.map((t=>{return e.jsxs(s.StyledProduct,Object.assign({mediaType:u.mediaType,className:""+(a=t,r=D,r.some((e=>e.id===a.id))?"selected":""),onClick:()=>{return e=t,void v((()=>D.find((t=>t.id===e.id))?D.filter((t=>t.id!==e.id)):!u.limit||D.length<u.limit?[...D,e]:(C(`Only ${u.limit} ${u.mediaType}s can be selected`),D)));var e}},{children:[e.jsx(g.ShimmerImage,{imageUrl:t.imageUrl,width:u.mediaType==exports.MEDIA_TYPES.POST?148:104,height:u.mediaType==exports.MEDIA_TYPES.POST?148:172,alt:t.overlayCaption}),e.jsxs("div",Object.assign({className:"overlay"},{children:[e.jsx("a",Object.assign({target:"_blank",rel:"noreferrer",href:t.redirectionUrl},{children:e.jsxs("div",Object.assign({className:"overlay__redirection"},{children:[e.jsx(d.default,{height:22,width:22}),e.jsx(i.BodyPrimary,Object.assign({color:o.PRIMARY,style:{fontWeight:500}},{children:"View"}))]}))})),e.jsx("div",Object.assign({className:"overlay__caption"},{children:e.jsx(i.BodyCaption,Object.assign({color:l.COLORS.content.placeholder},{children:t.overlayCaption}))}))]}))]}),t.id);var a,r}))})):e.jsx("div",Object.assign({style:{justifyContent:"center",alignItems:"center",display:"flex",height:422}},{children:u.media.length?f.length?e.jsx(e.Fragment,{}):e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",gap:"16px"}},{children:[e.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",width:"48px",height:"48px",backgroundColor:`${l.COLORS.background.inverse}`,borderRadius:"50%"}},{children:e.jsx(t.SearchIcon,{color:l.COLORS.content.primaryInverse})})),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:"8px"}},{children:[e.jsx(i.TitleMedium,{children:"No results found"}),e.jsx(i.BodyPrimary,{children:"Sorry we could not find any results for the selected filter"})]})),e.jsx("div",Object.assign({onClick:()=>{k(!0)}},{children:e.jsx(i.ButtonLarge,Object.assign({color:`${l.COLORS.content.brand}`},{children:"Clear Filter"}))}))]})):e.jsx(j.StateComponent,{states:j.StateInterface.WARNING,heading:`No ${u.mediaType}s on your account`,subline:`There seems to be no ${u.mediaType}s on your account`,isButtonEnabled:!1,width:400})}))})]}))}))},exports.dateOptions=x;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/searchIcon.js"),a=require("react"),s=require("./PostPicker.styled.js"),r=require("../tag/Tag.js"),i=require("../TypographyStyle.js"),n=require("../../utils/unCamelCase.js"),o=require("../../constants/colors.js"),l=require("../../constants/Theme.js"),d=require("../../assets/icons/instagram.svg.js"),c=require("../../assets/icons/warning.svg.js");require("../tooltips/Tooltip.js"),require("../analytics-chips-and-dropdowns/CommonStyles.js");var p=require("../analytics-chips-and-dropdowns/AnalyticsDropdown.js");require("../analytics-chips-and-dropdowns/AnalyticsMetric.js"),require("../shimmer/ShimmerComponent/ShimmerStyled.js"),require("../../utils/DateUtils.js"),require("../analytics-chips-and-dropdowns/chart/LineChart/LineChart.js"),require("react-bootstrap"),require("../analytics-chips-and-dropdowns/chart/linearChipGroupedChart/LinearChipGroupedChart.styled.js"),require("../analytics-chips-and-dropdowns/chart/Pie/PieChartAnalytics.js"),require("../analytics-chips-and-dropdowns/chart/Pie/PieChart.js"),require("../analytics-chips-and-dropdowns/chart/HorizontalBarGraph/HorizontalGraph.js"),require("../analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js"),require("../analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarDistributionChart.js"),require("../analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarDistributionChart.model.js"),require("../analytics-chips-and-dropdowns/chart/VerticalBarGraph/VerticalGraph.js"),require("../analytics-chips-and-dropdowns/chart/heatmap/HeatMap.js"),require("../analytics-chips-and-dropdowns/chart/heatmap/HeatMapVertical.js"),require("../analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.js");var u,h,y=require("../modals/styledModal.js"),m=require("../shimmer/ShimmerComponent/BikShimmer.js"),g=require("../shimmer-image/ShimmerImage.js"),j=require("../states/StateComponent.js");require("../../_virtual/_tslib.js"),exports.MEDIA_TYPES=void 0,(u=exports.MEDIA_TYPES||(exports.MEDIA_TYPES={})).STORY="story",u.POST="post",u.REEL="reel",exports.DateKeys=void 0,(h=exports.DateKeys||(exports.DateKeys={})).Today="Today",h["7_Days"]="7",h["30_Days"]="30",h.custom="custom",h.Yesterday="Yesterday";const x=[{label:"Today",value:"today",key:exports.DateKeys.Today,typeValue:[new Date,new Date]},{label:"Last 7 days",value:"7 days",key:exports.DateKeys["7_Days"],typeValue:[new Date((new Date).setDate((new Date).getDate()-6)),new Date]},{label:"Last 30 days",value:"30 days",key:exports.DateKeys["30_Days"],typeValue:[new Date((new Date).setDate((new Date).getDate()-29)),new Date]},{label:"Custom range",value:"calender",key:exports.DateKeys.custom,isCustom:!0,dateRangeSelectionOptions:{selectRange:!0,maxDate:new Date((new Date).setMonth((new Date).getMonth()+3))}}];exports.PostPicker=u=>{var h,S;const[D,v]=a.useState(null!==(h=u.previouslySelected)&&void 0!==h?h:[]),[w,C]=a.useState(""),[T,b]=a.useState(!1),[f,O]=a.useState(u.media),[q,k]=a.useState(!1),[E,P]=a.useState(!1),[B,I]=a.useState(!1),_=a.useRef(null);a.useEffect((()=>{u.media.length||(b(!0),setTimeout((()=>{b(!1)}),2e3)),v(u.selected||[])}),[]),a.useEffect((()=>{u.media.length>0&&(O(u.media),b(!1))}),[null===(S=null==u?void 0:u.media)||void 0===S?void 0:S.length]),a.useEffect((()=>{D.length>0&&C("")}),[D.length]),a.useEffect((()=>{q&&(O(u.media),P(!1))}),[q]),a.useEffect((()=>{const e=e=>{document.getElementById("analytic-dropdown").contains(e.target)||I(!B)},t=document.getElementById("post-picker");return t&&t.addEventListener("click",e),()=>{t&&t.removeEventListener("click",e)}}));return e.jsx("div",Object.assign({ref:_},{children:e.jsxs(y.StyledModal,Object.assign({zIndex:201,open:u.showModal,headingTitle:u.title,onClose:u.onClose,centralContainerStyles:{width:1071,height:u.showFilter?650:564},primaryButton:{disabled:!f.length,buttonType:"primary",buttonText:`Select ${n.unCamelCase(u.mediaType)}`,onClick:()=>{D.length?u.onSelect(D):C(`Please select a ${u.mediaType} to proceed`)}},secondaryButton:{buttonType:"secondary",buttonText:"Back",onClick:()=>u.onClose()},footerLeftCustomElement:w?e.jsx(r.Tag,{tagText:w,type:"negative",LeadingIcon:c.default}):D.length?e.jsxs(i.BodySecondary,{children:[D.length," selected"]}):null,id:"post-picker"},{children:[u.showFilter&&e.jsxs("div",Object.assign({style:{marginTop:24,marginBottom:24,padding:"0 24px",display:"flex",flexDirection:"row",gap:8,alignItems:"center"}},{children:[e.jsx(p.AnalyticsDropdown,{options:x,placeholder:"posted on",resetDropdown:q,onOptionSelected:e=>{var t,a;let s=null,r=null;"Custom range"===e.label?(s=(null===(t=null==e?void 0:e.selectedRange)||void 0===t?void 0:t[0])||new Date,r=(null===(a=null==e?void 0:e.selectedRange)||void 0===a?void 0:a[1])||new Date):(s=e.typeValue[0],r=e.typeValue[1]);const i=u.media.filter((e=>function(e,t,a){const s=new Date(e),r=new Date(t),i=new Date(a);return s>=r&&s<=i}(e.timestamp,s,r)));O(i),P(!0),k(!1)},closeDropdown:B}),E&&e.jsx(i.ButtonRegular,Object.assign({color:l.COLORS.content.secondary,onClick:()=>k(!0),style:{cursor:"pointer"}},{children:"Clear"}))]})),T?e.jsx("div",Object.assign({style:{padding:"0 24px"}},{children:e.jsx(m.BikShimmer,{boxes:[{width:(u.mediaType==exports.MEDIA_TYPES.POST?148:104)+"px",height:(u.mediaType==exports.MEDIA_TYPES.POST?148:172)+"px"}]})})):e.jsx(e.Fragment,{children:f&&f.length?e.jsx(s.StyledProductGrid,Object.assign({mediaType:u.mediaType},{children:f.map((t=>{return e.jsxs(s.StyledProduct,Object.assign({mediaType:u.mediaType,className:""+(a=t,r=D,r.some((e=>e.id===a.id))?"selected":""),onClick:()=>{return e=t,void v((()=>D.find((t=>t.id===e.id))?D.filter((t=>t.id!==e.id)):!u.limit||D.length<u.limit?[...D,e]:(C(`Only ${u.limit} ${u.mediaType}s can be selected`),D)));var e}},{children:[e.jsx(g.ShimmerImage,{imageUrl:t.imageUrl,width:u.mediaType==exports.MEDIA_TYPES.POST?148:104,height:u.mediaType==exports.MEDIA_TYPES.POST?148:172,alt:t.overlayCaption}),e.jsxs("div",Object.assign({className:"overlay"},{children:[e.jsx("a",Object.assign({target:"_blank",rel:"noreferrer",href:t.redirectionUrl},{children:e.jsxs("div",Object.assign({className:"overlay__redirection"},{children:[e.jsx(d.default,{height:22,width:22}),e.jsx(i.BodyPrimary,Object.assign({color:o.PRIMARY,style:{fontWeight:500}},{children:"View"}))]}))})),e.jsx("div",Object.assign({className:"overlay__caption"},{children:e.jsx(i.BodyCaption,Object.assign({color:l.COLORS.content.placeholder},{children:t.overlayCaption}))}))]}))]}),t.id);var a,r}))})):e.jsx("div",Object.assign({style:{justifyContent:"center",alignItems:"center",display:"flex",height:422}},{children:u.media.length?f.length?e.jsx(e.Fragment,{}):e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",gap:"16px"}},{children:[e.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",width:"48px",height:"48px",backgroundColor:`${l.COLORS.background.inverse}`,borderRadius:"50%"}},{children:e.jsx(t.SearchIcon,{color:l.COLORS.content.primaryInverse})})),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:"8px"}},{children:[e.jsx(i.TitleMedium,{children:"No results found"}),e.jsx(i.BodyPrimary,{children:"Sorry we could not find any results for the selected filter"})]})),e.jsx("div",Object.assign({onClick:()=>{k(!0)},style:{cursor:"pointer"}},{children:e.jsx(i.ButtonLarge,Object.assign({color:`${l.COLORS.content.brand}`},{children:"Clear Filter"}))}))]})):e.jsx(j.StateComponent,{states:j.StateInterface.WARNING,heading:`No ${u.mediaType}s on your account`,subline:`There seems to be no ${u.mediaType}s on your account`,isButtonEnabled:!1,width:400})}))})]}))}))},exports.dateOptions=x;
@@ -7,5 +7,6 @@ export type RadioButtonProps = {
7
7
  onValueChange: (checked: boolean, value?: string) => void;
8
8
  skipHoverState?: boolean;
9
9
  size?: 'DEFAULT' | 'SMALL';
10
+ labelSize?: 'DEFAULT' | 'MEDIUM';
10
11
  };
11
12
  export declare const RadioButton: React.FC<RadioButtonProps>;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),s=require("./RadioButton.styled.js"),t=require("../TypographyStyle.js"),l=require("../../constants/Theme.js");const a=i=>{const s=i.isDisabled?l.COLORS.content.inactive:i.isActive?l.COLORS.background.positive.vibrant:l.COLORS.content.primary;return e.jsxs("svg",Object.assign({width:i.isSmall?"16":"20",height:i.isSmall?"16":"20",viewBox:i.isSmall?"0 0 16 16":"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e.jsx("circle",{cx:i.isSmall?"8":"10",cy:i.isSmall?"8":"10",r:i.isSmall?6:9,stroke:s,strokeWidth:i.isSmall?1.5:2}),i.isActive&&e.jsx("circle",{cx:i.isSmall?"8":"10",cy:i.isSmall?"8":"10",r:i.isSmall?3:5,fill:i.isDisabled?l.COLORS.content.inactive:l.COLORS.background.positive.vibrant})]}))};exports.RadioButton=r=>{const[o,n]=i.useState(r.isActive||!1),[c,d]=i.useState(!1),[S,u]=i.useState(!1);return i.useEffect((()=>{n(r.isActive)}),[r.isActive]),e.jsxs(s.RadioButtonContainer,Object.assign({onClick:()=>{var e;if(!r.isDisabled){const i=!o;n(i),null===(e=r.onValueChange)||void 0===e||e.call(r,i,r.value)}},onMouseEnter:()=>d(!r.skipHoverState),onMouseLeave:()=>d(!1),onMouseDown:()=>u(!r.skipHoverState),onMouseUp:()=>u(!1)},{children:[e.jsx(s.RadioButtonIcon,Object.assign({checked:o,hovered:c,clicked:S,isDisabled:r.isDisabled||!1,size:r.size},{children:e.jsx(a,{isSmall:"SMALL"===r.size,isActive:o,isDisabled:r.isDisabled||!1})})),r.label&&"SMALL"!==r.size&&e.jsx(t.BodyPrimary,Object.assign({color:r.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:r.label})),r.label&&"SMALL"===r.size&&e.jsx(t.BodyCaption,Object.assign({color:r.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:r.label}))]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),s=require("./RadioButton.styled.js"),t=require("../TypographyStyle.js"),l=require("../../constants/Theme.js");const a=i=>{const s=i.isDisabled?l.COLORS.content.inactive:i.isActive?l.COLORS.background.positive.vibrant:l.COLORS.content.primary;return e.jsxs("svg",Object.assign({width:i.isSmall?"16":"20",height:i.isSmall?"16":"20",viewBox:i.isSmall?"0 0 16 16":"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e.jsx("circle",{cx:i.isSmall?"8":"10",cy:i.isSmall?"8":"10",r:i.isSmall?6:9,stroke:s,strokeWidth:i.isSmall?1.5:2}),i.isActive&&e.jsx("circle",{cx:i.isSmall?"8":"10",cy:i.isSmall?"8":"10",r:i.isSmall?3:5,fill:i.isDisabled?l.COLORS.content.inactive:l.COLORS.background.positive.vibrant})]}))};exports.RadioButton=r=>{const[o,n]=i.useState(r.isActive||!1),[c,d]=i.useState(!1),[S,b]=i.useState(!1);i.useEffect((()=>{n(r.isActive)}),[r.isActive]);return e.jsxs(s.RadioButtonContainer,Object.assign({onClick:()=>{var e;if(!r.isDisabled){const i=!o;n(i),null===(e=r.onValueChange)||void 0===e||e.call(r,i,r.value)}},onMouseEnter:()=>d(!r.skipHoverState),onMouseLeave:()=>d(!1),onMouseDown:()=>b(!r.skipHoverState),onMouseUp:()=>b(!1)},{children:[e.jsx(s.RadioButtonIcon,Object.assign({checked:o,hovered:c,clicked:S,isDisabled:r.isDisabled||!1,size:r.size},{children:e.jsx(a,{isSmall:"SMALL"===r.size,isActive:o,isDisabled:r.isDisabled||!1})})),r.label?"SMALL"===r.size?e.jsx(t.BodyCaption,Object.assign({color:r.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:r.label})):"MEDIUM"===r.labelSize?e.jsx(t.BodySecondary,Object.assign({color:r.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:r.label})):e.jsx(t.BodyPrimary,Object.assign({color:r.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:r.label})):e.jsx(e.Fragment,{})]}))};
@@ -8,6 +8,7 @@ export type RadioListProps = {
8
8
  subTitle?: string;
9
9
  listItems: RadioListItem[];
10
10
  onChange: (option: RadioListItem) => void;
11
+ listContainerStyles?: React.CSSProperties;
11
12
  };
12
13
  export declare const RadioList: React.FC<RadioListProps>;
13
14
  export {};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),s=require("../radioButton/RadioButton.js"),i=require("./RadioList.styled.js"),r=require("../TypographyStyle.js"),a=require("../../constants/Theme.js");exports.RadioList=l=>{const[n,c]=t.useState(l.listItems);t.useEffect((()=>{c(l.listItems)}),[l.listItems]);const o=(e,t)=>{let s;const i=[...n];i.forEach((i=>{i.value===t?(s=i,i.isActive=e):i.isActive=!e})),c(i),l.onChange(s)};return e.jsxs(i.RadioListStyled,{children:[(l.title||l.subTitle)&&e.jsxs("div",Object.assign({className:"title__container"},{children:[l.title&&e.jsx(r.TitleRegular,{children:l.title}),l.subTitle&&e.jsx(r.BodySecondary,Object.assign({color:a.COLORS.text.secondary},{children:l.subTitle}))]})),e.jsx("div",Object.assign({className:"list__container"},{children:n.map((t=>e.jsx(s.RadioButton,Object.assign({},t,{onValueChange:o}),t.value)))}))]})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),s=require("../radioButton/RadioButton.js"),i=require("./RadioList.styled.js"),r=require("../TypographyStyle.js"),a=require("../../constants/Theme.js");exports.RadioList=l=>{var n;const[o,c]=t.useState(l.listItems);t.useEffect((()=>{c(l.listItems)}),[l.listItems]);const u=(e,t)=>{let s;const i=[...o];i.forEach((i=>{i.value===t?(s=i,i.isActive=e):i.isActive=!e})),c(i),l.onChange(s)};return e.jsxs(i.RadioListStyled,{children:[(l.title||l.subTitle)&&e.jsxs("div",Object.assign({className:"title__container"},{children:[l.title&&e.jsx(r.TitleRegular,{children:l.title}),l.subTitle&&e.jsx(r.BodySecondary,Object.assign({color:a.COLORS.text.secondary},{children:l.subTitle}))]})),e.jsx("div",Object.assign({style:null!==(n=l.listContainerStyles)&&void 0!==n?n:{},className:"list__container"},{children:o.map((t=>e.jsx(s.RadioButton,Object.assign({},t,{onValueChange:u}),t.value)))}))]})};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),s=require("../../constants/Theme.js"),r=require("../TypographyStyle.js"),a=require("./Tabs.styles.js");const n=r=>{var n,l;const{tabs:i,initialTab:c,onTabSelected:d,TabItemStyledProps:b,selectedTab:u,extendedBorder:p,rightComponent:x,size:T="default",isSquared:m=!1}=r,[g,C]=t.useState(c||i[0].key),{colorsV2:y}=s.DEFAULT_THEME;t.useEffect((()=>{u&&C(u)}),[u]);const j=r.backgroundColor,S=null!==(n=r.selectedTextColor)&&void 0!==n?n:y.background.brand,h=null!==(l=r.textColor)&&void 0!==l?l:y.content.secondary;return e.jsxs(a.TabHeader,Object.assign({bgColor:j},{children:[i.map(((t,s)=>e.jsx(o,{hasEqualSpacing:r.hasEqualSpacing,selectedTextColor:S,textColor:h,tab:t,currentTab:g,TabItemStyledProps:b,IconComponent:t.icon,size:T,setCurrentTab:e=>{d(e),C(e)},isSquared:m,isFirstlement:0==s,isLastElement:s==i.length-1},t.key))),p&&e.jsx(a.EmptyTab,{}),e.jsx(a.RightComponent,{children:x})]}))},o=n=>{const{tab:o,currentTab:l,setCurrentTab:i,TabItemStyledProps:c,IconComponent:d,size:b="default",isSquared:u=!1,isFirstlement:p,isLastElement:x}=n,T=o.key===l,{colorsV2:m}=s.DEFAULT_THEME,g=t.useCallback((()=>Object.assign(Object.assign({},c),{borderRadius:n.isSquared?p?"4px 0px 0px 4px":x?"0px 4px 4px 0px":"":""})),[]);return e.jsxs(a.TabItem,Object.assign({style:g(),selected:T,hasEqualSpacing:n.hasEqualSpacing,onClick:()=>i(n.tab.key),selectedTextColor:n.selectedTextColor,isSquared:u},{children:[d&&e.jsx(d,{selected:T?m.background.brand:m.content.secondary}),e.jsx(a.TabItemText,Object.assign({style:"small"===b?{fontSize:14,fontStyle:"normal",fontWeight:600}:void 0,textColor:n.textColor,selectedTextColor:n.selectedTextColor,selected:T},{children:o.title})),void 0!==o.trailingNumber&&null!==o.trailingNumber&&e.jsx(a.TrailingNumberContainer,Object.assign({selected:T},{children:e.jsx(r.BodyCaption,Object.assign({color:m.content.primaryInverse},{children:o.trailingNumber}))}))]}))};n.displayName="Tabs",o.displayName="TabItemComponent",exports.TabItemComponent=o,exports.Tabs=n;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),s=require("../../constants/Theme.js"),r=require("../TypographyStyle.js"),a=require("./Tabs.styles.js");const n=r=>{var n,l;const{tabs:i,initialTab:c,onTabSelected:d,TabItemStyledProps:b,selectedTab:u,extendedBorder:p,rightComponent:x,size:T="default",isSquared:m=!1,containerStyles:g}=r,[y,C]=t.useState(c||i[0].key),{colorsV2:j}=s.DEFAULT_THEME;t.useEffect((()=>{u&&C(u)}),[u]);const S=r.backgroundColor,h=null!==(n=r.selectedTextColor)&&void 0!==n?n:j.background.brand,q=null!==(l=r.textColor)&&void 0!==l?l:j.content.secondary;return e.jsxs(a.TabHeader,Object.assign({style:null!=g?g:{},bgColor:S},{children:[i.map(((t,s)=>e.jsx(o,{hasEqualSpacing:r.hasEqualSpacing,selectedTextColor:h,textColor:q,tab:t,currentTab:y,TabItemStyledProps:b,IconComponent:t.icon,size:T,setCurrentTab:e=>{d(e),C(e)},isSquared:m,isFirstlement:0==s,isLastElement:s==i.length-1},t.key))),p&&e.jsx(a.EmptyTab,{}),e.jsx(a.RightComponent,{children:x})]}))},o=n=>{const{tab:o,currentTab:l,setCurrentTab:i,TabItemStyledProps:c,IconComponent:d,size:b="default",isSquared:u=!1,isFirstlement:p,isLastElement:x}=n,T=o.key===l,{colorsV2:m}=s.DEFAULT_THEME,g=t.useCallback((()=>Object.assign(Object.assign({},c),{borderRadius:n.isSquared?p?"4px 0px 0px 4px":x?"0px 4px 4px 0px":"":""})),[]);return e.jsxs(a.TabItem,Object.assign({style:g(),selected:T,hasEqualSpacing:n.hasEqualSpacing,onClick:()=>i(n.tab.key),selectedTextColor:n.selectedTextColor,isSquared:u},{children:[d&&e.jsx(d,{selected:T?m.background.brand:m.content.secondary}),e.jsx(a.TabItemText,Object.assign({style:"small"===b?{fontSize:14,fontStyle:"normal",fontWeight:600}:void 0,textColor:n.textColor,selectedTextColor:n.selectedTextColor,selected:T},{children:o.title})),void 0!==o.trailingNumber&&null!==o.trailingNumber&&e.jsx(a.TrailingNumberContainer,Object.assign({selected:T},{children:e.jsx(r.BodyCaption,Object.assign({color:m.content.primaryInverse},{children:o.trailingNumber}))}))]}))};n.displayName="Tabs",o.displayName="TabItemComponent",exports.TabItemComponent=o,exports.Tabs=n;
@@ -36,6 +36,7 @@ export interface TabViewHeaderProps {
36
36
  rightComponent?: JSX.Element;
37
37
  size?: 'small' | 'default';
38
38
  isSquared?: boolean;
39
+ containerStyles?: React.CSSProperties;
39
40
  }
40
41
  export interface TabItemComponentProps {
41
42
  hasEqualSpacing?: boolean;
@@ -46,7 +46,5 @@ export interface TemplateContextMapperProps {
46
46
  disableEditExpiry?: boolean;
47
47
  cardWidth?: number;
48
48
  onDeleteSelectedProducts?: () => void;
49
- fileName?: string;
50
- setFileName?: (name: string) => void;
51
49
  }
52
- export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList, discountCode, setDiscountCode, onBackPress, enabledCustomText, variableListForImage, showSampleValues, disableEditVariable, pod, extras, pickerConf, selectedCarouselProducts, disableEditExpiry, cardWidth, onDeleteSelectedProducts, fileName, setFileName, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;
50
+ export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList, discountCode, setDiscountCode, onBackPress, enabledCustomText, variableListForImage, showSampleValues, disableEditVariable, pod, extras, pickerConf, selectedCarouselProducts, disableEditExpiry, cardWidth, onDeleteSelectedProducts, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("react"),t=require("../../utils/StringUtils.js"),a=require("../modals/styledModal.js"),o=require("../template-preview/models/Channels.js"),r=require("./context/templateModalContext.js"),s=require("./modalElements/Footer.js"),i=require("./modalElements/TemplateSelectModalContent.js"),n=require("./utils/convertPlaceholdersToBikDropdown.js"),d=require("./utils/validateName.js");exports.TemplateContextMapper=u=>{let{selectedTemplate:c,closeDialog:p,showVariableMapping:v,channel:m,htmlContent:h,templateVariables:C,onTemplateSelect:E,globalPlaceholders:S,showOnlyContent:x,whatsappSpecificPickerMeta:b,zIndex:g,showVariableModal:P,variableList:f,discountCode:T,setDiscountCode:j,onBackPress:I,enabledCustomText:M,variableListForImage:N,showSampleValues:L,disableEditVariable:y,pod:A,extras:w,pickerConf:V,selectedCarouselProducts:q,disableEditExpiry:D,cardWidth:k,onDeleteSelectedProducts:H,fileName:_,setFileName:F}=u;var O,W,Y,B,z,R;l.useEffect((()=>{Q(h)}),[h]);const U=m===o.CHANNEL_TYPE.WHATSAPP&&"CAROUSEL"===(null===(W=null===(O=null==c?void 0:c.components)||void 0===O?void 0:O[1])||void 0===W?void 0:W.type),$=null==c?void 0:c.isProductCarouselType,[G,J]=l.useState(m===o.CHANNEL_TYPE.EMAIL||U?"desktop":"mobile"),[K,Q]=l.useState(h),[X,Z]=l.useState(!1),[ee,le]=l.useState([]),[te,ae]=l.useState(c),[oe,re]=l.useState([]),[se,ie]=l.useState(!1),[ne,de]=l.useState(null!=C?C:[]),[ue,ce]=l.useState(!1),[pe,ve]=l.useState(-1),[me,he]=l.useState([]),[Ce,Ee]=l.useState(_);l.useEffect((()=>{q?he(q):$&&he([])}),[q]),l.useEffect((()=>{var e;if(!se&&$&&(!q||0===he.length)){const l=null===(e=null==te?void 0:te.components)||void 0===e?void 0:e[1].cards,t=[];null==l||l.forEach((e=>{var l;null===(l=null==e?void 0:e.components)||void 0===l||l.forEach((e=>{var l,a,o;"HEADER"===e.type&&t.push(null!==(o=null===(a=null===(l=e.example)||void 0===l?void 0:l.header_handle)||void 0===a?void 0:a[0])&&void 0!==o?o:"")}))})),re(t),ie(!0)}}),[se]);const Se=l.useMemo((()=>n.convertPlaceholdersToBikDropdown(S)),[S]);return e.jsx(r.TemplateModalContext.Provider,Object.assign({value:{template:te,setTemplate:ae,device:G,setDevice:J,display_content:K,setDisplayContent:Q,originalVariableList:ne,setOriginalVariableList:de,isError:X,setIsError:Z,channel:m,globalNormalizedPlaceholders:Se,templateSelectionTriggered:ue,setTemplateSelectionTriggered:ce,enabledCustomText:M,disableEditVariable:y,pod:A,extras:w,isWhatsappCarousel:U,selectedCarouselIndex:pe,setSelectedCarouselIndex:ve,isProductCarouselType:$,cardCount:U?null===(B=null===(Y=c.components)||void 0===Y?void 0:Y[1].cards)||void 0===B?void 0:B.length:void 0,errorIndexes:ee,setErrorIndexes:le,pickerConf:V,carouselProducts:me,setCarouselProducts:he,disableEditExpiry:D,cardWidth:k,cardImages:oe,onDeleteSelectedProducts:H}},{children:x?e.jsx(i.default,{channel:o.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(a.StyledModal,Object.assign({zIndex:g,centralContainerStyles:{width:U?900:m===o.CHANNEL_TYPE.EMAIL&&v?1e3:800},open:!0,onClose:()=>{null==p||p()},headingTitle:null==te?void 0:te.label,headingSubtitle:m===o.CHANNEL_TYPE.WHATSAPP?`${t.default.capitaliseFirstLetterOfString(null!==(z=null==te?void 0:te.category)&&void 0!==z?z:"")} • ${null!==(R=null==te?void 0:te.templateCategory)&&void 0!==R?R:""}`:"",onBackPress:()=>{null==I||I()}},{children:[e.jsx(i.default,{showSampleValues:L,showVariableMapping:v,channel:m,whatsappSpecificPickerMeta:b,showVariableModal:P,variableList:f,discountCode:T,setDiscountCode:j,variableListForImage:N&&(null==N?void 0:N.length)>0?N:f,fileName:_,setFileName:e=>{null==F||F(e),Ee(e)}}),E?e.jsx(s.default,{isWhatsappCarousel:null!=U&&U,onSelect:function(){if((null==me?void 0:me.length)<1&&$)return void Z(!0);if(!Ce)return void Z(!0);if(!Ce||d.validateInputName(Ce))return void Z(!0);const e=null==E?void 0:E(te,ne,null!=K?K:"",me);(null==e?void 0:e.errorIndexes)||(null==e?void 0:e.error)?((null==e?void 0:e.errorIndexes)&&le(e.errorIndexes),(null==e?void 0:e.error)&&Z(!!(null==e?void 0:e.error))):ce(!0)}}):e.jsx(e.Fragment,{})]}))}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("react"),t=require("../../utils/StringUtils.js"),o=require("../modals/styledModal.js"),a=require("../template-preview/models/Channels.js"),r=require("./context/templateModalContext.js"),s=require("./modalElements/Footer.js"),i=require("./modalElements/TemplateSelectModalContent.js"),n=require("./utils/convertPlaceholdersToBikDropdown.js");exports.TemplateContextMapper=d=>{let{selectedTemplate:u,closeDialog:c,showVariableMapping:p,channel:v,htmlContent:h,templateVariables:m,onTemplateSelect:C,globalPlaceholders:E,showOnlyContent:S,whatsappSpecificPickerMeta:x,zIndex:b,showVariableModal:g,variableList:P,discountCode:T,setDiscountCode:f,onBackPress:j,enabledCustomText:M,variableListForImage:I,showSampleValues:L,disableEditVariable:y,pod:A,extras:w,pickerConf:N,selectedCarouselProducts:V,disableEditExpiry:D,cardWidth:k,onDeleteSelectedProducts:q}=d;var H,_,O,W,F,Y;l.useEffect((()=>{G(h)}),[h]);const B=v===a.CHANNEL_TYPE.WHATSAPP&&"CAROUSEL"===(null===(_=null===(H=null==u?void 0:u.components)||void 0===H?void 0:H[1])||void 0===_?void 0:_.type),z=null==u?void 0:u.isProductCarouselType,[R,U]=l.useState(v===a.CHANNEL_TYPE.EMAIL||B?"desktop":"mobile"),[$,G]=l.useState(h),[J,K]=l.useState(!1),[Q,X]=l.useState([]),[Z,ee]=l.useState(u),[le,te]=l.useState([]),[oe,ae]=l.useState(!1),[re,se]=l.useState(null!=m?m:[]),[ie,ne]=l.useState(!1),[de,ue]=l.useState(-1),[ce,pe]=l.useState([]);l.useEffect((()=>{V?pe(V):z&&pe([])}),[V]),l.useEffect((()=>{var e;if(!oe&&z&&(!V||0===pe.length)){const l=null===(e=null==Z?void 0:Z.components)||void 0===e?void 0:e[1].cards,t=[];null==l||l.forEach((e=>{var l;null===(l=null==e?void 0:e.components)||void 0===l||l.forEach((e=>{var l,o,a;"HEADER"===e.type&&t.push(null!==(a=null===(o=null===(l=e.example)||void 0===l?void 0:l.header_handle)||void 0===o?void 0:o[0])&&void 0!==a?a:"")}))})),te(t),ae(!0)}}),[oe]);const ve=l.useMemo((()=>n.convertPlaceholdersToBikDropdown(E)),[E]);return e.jsx(r.TemplateModalContext.Provider,Object.assign({value:{template:Z,setTemplate:ee,device:R,setDevice:U,display_content:$,setDisplayContent:G,originalVariableList:re,setOriginalVariableList:se,isError:J,setIsError:K,channel:v,globalNormalizedPlaceholders:ve,templateSelectionTriggered:ie,setTemplateSelectionTriggered:ne,enabledCustomText:M,disableEditVariable:y,pod:A,extras:w,isWhatsappCarousel:B,selectedCarouselIndex:de,setSelectedCarouselIndex:ue,isProductCarouselType:z,cardCount:B?null===(W=null===(O=u.components)||void 0===O?void 0:O[1].cards)||void 0===W?void 0:W.length:void 0,errorIndexes:Q,setErrorIndexes:X,pickerConf:N,carouselProducts:ce,setCarouselProducts:pe,disableEditExpiry:D,cardWidth:k,cardImages:le,onDeleteSelectedProducts:q}},{children:S?e.jsx(i.default,{channel:a.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(o.StyledModal,Object.assign({zIndex:b,centralContainerStyles:{width:B?900:v===a.CHANNEL_TYPE.EMAIL&&p?1e3:800},open:!0,onClose:()=>{null==c||c()},headingTitle:null==Z?void 0:Z.label,headingSubtitle:v===a.CHANNEL_TYPE.WHATSAPP?`${t.default.capitaliseFirstLetterOfString(null!==(F=null==Z?void 0:Z.category)&&void 0!==F?F:"")} • ${null!==(Y=null==Z?void 0:Z.templateCategory)&&void 0!==Y?Y:""}`:"",onBackPress:()=>{null==j||j()}},{children:[e.jsx(i.default,{showSampleValues:L,showVariableMapping:p,channel:v,whatsappSpecificPickerMeta:x,showVariableModal:g,variableList:P,discountCode:T,setDiscountCode:f,variableListForImage:I&&(null==I?void 0:I.length)>0?I:P}),C?e.jsx(s.default,{isWhatsappCarousel:null!=B&&B,onSelect:function(){if((null==ce?void 0:ce.length)<1&&z)return void K(!0);const e=null==C?void 0:C(Z,re,null!=$?$:"",ce);(null==e?void 0:e.errorIndexes)||(null==e?void 0:e.error)?((null==e?void 0:e.errorIndexes)&&X(e.errorIndexes),(null==e?void 0:e.error)&&K(!!(null==e?void 0:e.error))):ne(!0)}}):e.jsx(e.Fragment,{})]}))}))};
@@ -10,8 +10,6 @@ export interface BodyProps {
10
10
  discountCode?: string;
11
11
  setDiscountCode?: (code: string) => void;
12
12
  showSampleValues?: boolean;
13
- fileName?: string;
14
- setFileName?: (name: string) => void;
15
13
  }
16
14
  declare const Body: (props: BodyProps) => import("react/jsx-runtime").JSX.Element;
17
15
  export default Body;
@@ -1,18 +1,18 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),a=require("styled-components"),l=require("../../carousel-preview/CarouselPreview.js"),i=require("./EditWhatsAppCarouselTemplateV2.js"),o=require("../../template-preview/models/Channels.js"),s=require("../../../constants/Theme.js"),r=require("../context/templateModalContext.js"),n=require("../utils/getVariableNameEmail.js"),u=require("../utils/highlightFor.js"),d=require("./DesktopPreview.js"),p=require("./EditWhatsAppTemplateV2.js"),c=require("./MobilePreview.js"),h=require("./VariableConnectorsPanel.js");function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var f=m(a);const v=f.default.div`
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),a=require("styled-components"),l=require("../../carousel-preview/CarouselPreview.js"),o=require("./EditWhatsAppCarouselTemplateV2.js"),i=require("../../template-preview/models/Channels.js"),s=require("../../../constants/Theme.js"),r=require("../context/templateModalContext.js"),n=require("../utils/getVariableNameEmail.js"),u=require("../utils/highlightFor.js"),d=require("./DesktopPreview.js"),p=require("./EditWhatsAppTemplateV2.js"),c=require("./MobilePreview.js"),h=require("./VariableConnectorsPanel.js");function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var v=m(a);const C=v.default.div`
2
2
  display: flex;
3
3
  // height: 100%;
4
- `,C=f.default.div`
4
+ `,f=v.default.div`
5
5
  padding: 16px 14px;
6
6
  max-width: 450px;
7
7
 
8
- height: ${e=>e.channel===o.CHANNEL_TYPE.WHATSAPP?"500px":"475px"};
8
+ height: ${e=>e.channel===i.CHANNEL_TYPE.WHATSAPP?"500px":"475px"};
9
9
  overflow-y: auto;
10
10
  padding-bottom: 24px;
11
11
  border-left: ${s.COLORS.stroke.primary} 1px solid;
12
12
  border-top: ${e=>e.isWhatsappCarousel?`${s.COLORS.stroke.primary} 1px solid`:void 0};
13
- `,x=f.default.div`
13
+ `,x=v.default.div`
14
14
  padding: ${e=>e.isWhatsappCarousel?void 0:e.showOnlyContent?"16px 14px":"16px 32px"};
15
15
  flex: 1;
16
16
  height: ${e=>e.isWhatsappCarousel?"500px":"475px"};
17
17
  overflow-y: auto;
18
- `;exports.default=a=>{const{showVariableMapping:m,showOnlyContent:f,whatsappSpecificPickerMeta:g,showVariableModal:w,variableList:b,discountCode:P,setDiscountCode:j,variableListForImage:E,showSampleValues:L,fileName:T,setFileName:A}=a,N=t.useRef(),y=t.useRef(),{device:S,display_content:M,channel:_,template:V,setTemplate:W,isWhatsappCarousel:q,isProductCarouselType:O}=r.useTemplateModalContext();const F=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e.jsxs(v,{children:[e.jsx(x,Object.assign({showOnlyContent:f,showVariableMapping:m,isWhatsappCarousel:q},{children:"mobile"===S?e.jsx(c.default,{ref:y,display_content:null!=M?M:"",channel:_,template:V,showSampleValues:L}):_===o.CHANNEL_TYPE.WHATSAPP&&q?e.jsx(l.CarouselPreview,{ref:N,channel:_,template:V,showSampleValues:L,isPreview:!1}):_!==o.CHANNEL_TYPE.MESSAGE?e.jsx(d.default,{ref:N,channel:_,display_content:null!=M?M:"",showSampleValues:L}):e.jsx(e.Fragment,{})})),(O||m)&&e.jsx(C,Object.assign({channel:_,isWhatsappCarousel:q},{children:_!==o.CHANNEL_TYPE.WHATSAPP?e.jsx(h.default,{onFocus:_===o.CHANNEL_TYPE.EMAIL?function(e){var t,a,l;const i=null===document||void 0===document?void 0:document.getElementById("mobile"===S?"template_html_mobile":"template_html_desktop"),r=n.getVariableNameForEmailByIndex(e+1),d=_===o.CHANNEL_TYPE.EMAIL?null===(t=null==i?void 0:i.contentWindow)||void 0===t?void 0:t.document.getElementById(r):document.getElementById(r),p=F(d),c=null==d?void 0:d.offsetLeft;"desktop"===S?p&&N.current&&(null===(a=null==i?void 0:i.contentWindow)||void 0===a||a.scrollTo(null!=c?c:0,p),u.highlightFor(r,s.COLORS.background.warning.light,2,_,S)):p&&y.current&&(null===(l=null==i?void 0:i.contentWindow)||void 0===l||l.scrollTo(null!=c?c:0,p),u.highlightFor(r,s.COLORS.background.warning.light,2,_,S))}:void 0,showVariableModal:w,variableList:b,discountCode:P,setDiscountCode:j}):_===o.CHANNEL_TYPE.WHATSAPP&&q?e.jsx(i.default,{whatsappSpecificPickerMeta:g,template:V,showVariableModal:w,variableList:b,variableListForImage:E,discountCode:P,setDiscountCode:j}):e.jsx(p.default,{whatsappSpecificPickerMeta:g,template:V,onTemplateChange:e=>{null==W||W(e)},showVariableModal:w,variableList:b,variableListForImage:E,discountCode:P,setDiscountCode:j,fileName:T,setFileName:A})}))]})};
18
+ `;exports.default=a=>{const{showVariableMapping:m,showOnlyContent:v,whatsappSpecificPickerMeta:g,showVariableModal:w,variableList:b,discountCode:P,setDiscountCode:j,variableListForImage:E,showSampleValues:L}=a,T=t.useRef(),A=t.useRef(),{device:y,display_content:S,channel:M,template:N,setTemplate:_,isWhatsappCarousel:V,isProductCarouselType:W}=r.useTemplateModalContext();const q=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e.jsxs(C,{children:[e.jsx(x,Object.assign({showOnlyContent:v,showVariableMapping:m,isWhatsappCarousel:V},{children:"mobile"===y?e.jsx(c.default,{ref:A,display_content:null!=S?S:"",channel:M,template:N,showSampleValues:L}):M===i.CHANNEL_TYPE.WHATSAPP&&V?e.jsx(l.CarouselPreview,{ref:T,channel:M,template:N,showSampleValues:L,isPreview:!1}):M!==i.CHANNEL_TYPE.MESSAGE?e.jsx(d.default,{ref:T,channel:M,display_content:null!=S?S:"",showSampleValues:L}):e.jsx(e.Fragment,{})})),(W||m)&&e.jsx(f,Object.assign({channel:M,isWhatsappCarousel:V},{children:M!==i.CHANNEL_TYPE.WHATSAPP?e.jsx(h.default,{onFocus:M===i.CHANNEL_TYPE.EMAIL?function(e){var t,a,l;const o=null===document||void 0===document?void 0:document.getElementById("mobile"===y?"template_html_mobile":"template_html_desktop"),r=n.getVariableNameForEmailByIndex(e+1),d=M===i.CHANNEL_TYPE.EMAIL?null===(t=null==o?void 0:o.contentWindow)||void 0===t?void 0:t.document.getElementById(r):document.getElementById(r),p=q(d),c=null==d?void 0:d.offsetLeft;"desktop"===y?p&&T.current&&(null===(a=null==o?void 0:o.contentWindow)||void 0===a||a.scrollTo(null!=c?c:0,p),u.highlightFor(r,s.COLORS.background.warning.light,2,M,y)):p&&A.current&&(null===(l=null==o?void 0:o.contentWindow)||void 0===l||l.scrollTo(null!=c?c:0,p),u.highlightFor(r,s.COLORS.background.warning.light,2,M,y))}:void 0,showVariableModal:w,variableList:b,discountCode:P,setDiscountCode:j}):M===i.CHANNEL_TYPE.WHATSAPP&&V?e.jsx(o.default,{whatsappSpecificPickerMeta:g,template:N,showVariableModal:w,variableList:b,variableListForImage:E,discountCode:P,setDiscountCode:j}):e.jsx(p.default,{whatsappSpecificPickerMeta:g,template:N,onTemplateChange:e=>{null==_||_(e)},showVariableModal:w,variableList:b,variableListForImage:E,discountCode:P,setDiscountCode:j})}))]})};
@@ -12,8 +12,6 @@ export interface EditWhatsAppTemplateV2Props {
12
12
  variableListForImage?: VariableListInterfaceV2[];
13
13
  discountCode?: string;
14
14
  setDiscountCode?: (code: string) => void;
15
- fileName?: string;
16
- setFileName?: (name: string) => void;
17
15
  }
18
- declare const EditWhatsAppTemplateV2: ({ template, onTemplateChange, whatsappSpecificPickerMeta, showVariableModal, variableList, variableListForImage, discountCode, setDiscountCode, fileName, setFileName, }: EditWhatsAppTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
16
+ declare const EditWhatsAppTemplateV2: ({ template, onTemplateChange, whatsappSpecificPickerMeta, showVariableModal, variableList, variableListForImage, discountCode, setDiscountCode, }: EditWhatsAppTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
19
17
  export default EditWhatsAppTemplateV2;
@@ -1,7 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("lodash"),t=require("react"),o=require("styled-components"),i=require("../../input/Input.js"),l=require("../../template-preview/models/TemplateMeta.js"),s=require("../../template-preview/models/WhatsAppTemplate.js"),a=require("../context/templateModalContext.js"),d=require("../utils/getDataFromTemplateComponent.js"),r=require("../utils/validateName.js"),u=require("./BackTrackComponent.js"),p=require("./DiscountCodeComponent.js"),c=require("./EditMediaV2.style.js"),v=require("./EditWhatsAppTemplateMediaV2.js"),m=require("./VariableConnector.js"),b=require("./VariableConnectorsPanel.js"),g=require("./VariableConnectorWhatsApp.js"),f=require("./VariableEditorHeader.js"),j=require("./WhatsAppTemplateCardButtonV2.js");function h(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const O=h(o).default.div`
2
- padding-top: 24px;
3
- padding-left: 10px;
4
- padding-right: 10px;
5
- margin-bottom: 8px;
6
- line-height: normal;
7
- `;exports.default=o=>{let{template:h,onTemplateChange:C,whatsappSpecificPickerMeta:T,showVariableModal:x,variableList:y,variableListForImage:B,discountCode:E,setDiscountCode:V,fileName:k,setFileName:L}=o;var q,D,U,I,P,R,w,A,M,N,S,_,F,H,Q,Y,K,W,$,X,z;const G=h.isCarouselType,{originalVariableList:J,pod:Z,extras:ee,selectedCarouselIndex:ne,isProductCarouselType:te}=a.useTemplateModalContext(),{descriptionComponents:oe,urlBtns:ie,qrbBtns:le,imageComponent:se,bodyVariables:ae,headerVariables:de}=d.getAllDataFromTemplateComponent(h),[re,ue]=t.useState(!1),[pe,ce]=t.useState(-1===ne?{descriptionComponents:oe,urlBtns:ie,qrbBtns:le,imageComponent:se,bodyVariables:ae,headerVariables:de}:{}),[ve,me]=t.useState(!1),[be,ge]=t.useState(k),[fe,je]=t.useState();function he(e,t,o){var i,l,s,a,d,r,u,p,c,v;const m=null!=ne&&ne>-1?{components:null===(i=Object.assign({},h).components[1].cards)||void 0===i?void 0:i[ne].components,mapping:null===(l=Object.assign({},h).mapping.cards)||void 0===l?void 0:l[ne]}:Object.assign({},h),b=n.cloneDeep(m),g="custom"===t&&"string"==typeof e,f=g?e:"string"!=typeof e?e.defaultValue?e.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=ne&&ne>-1&&te){const t=Object.assign({},h).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,t,i;if("BUTTONS"===e.type){const l=null===(n=e.buttons)||void 0===n?void 0:n.filter((e=>"URL"===e.type));let s=null!==(t=null==l?void 0:l[o])&&void 0!==t?t:{};s=Object.assign(Object.assign({},s),{url:"https://d.bik.ai/{{1}}",example:[f]});const a=null===(i=e.buttons)||void 0===i?void 0:i.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==s?void 0:s.text)?s:e));return Object.assign(Object.assign({},e),{buttons:a})}return e}))})))}):e})),i=null===(a=null===(s=Object.assign({},h).mapping)||void 0===s?void 0:s.cards)||void 0===a?void 0:a.map((n=>{var t;return Object.assign(Object.assign({},n),{buttons:null===(t=null==n?void 0:n.buttons)||void 0===t?void 0:t.map((n=>g?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:""))})})),l=n.cloneDeep(h);return l.components=t,l.mapping.cards=i,void(null==C||C(Object.assign({},l)))}const j=null==b?void 0:b.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==j&&j>-1){const n=null===(d=null==b?void 0:b.components[j].buttons)||void 0===d?void 0:d.filter((e=>"URL"===e.type));if((null==n?void 0:n.length)>0){const i="custom"===t&&"string"==typeof e,l=i?e:"string"!=typeof e&&e.defaultValue?e.defaultValue:"https://d.bik.ai/";let s=n[o];s=Object.assign(Object.assign({},s),{url:"https://d.bik.ai/{{1}}",example:[l]});const a=[...null!==(p=null===(u=null===(r=b.components)||void 0===r?void 0:r[j])||void 0===u?void 0:u.buttons)&&void 0!==p?p:[]].map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==s?void 0:s.text)?s:e)),d=Object.assign(Object.assign({},b.components[j]),{buttons:a}),v=null===(c=b.mapping)||void 0===c?void 0:c.buttons;v&&v.length>0&&(v[o]=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[j]=d,b.components=g}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(v=e.placeHolder)||void 0===v?void 0:v.slice(2,-2))?ue(!0):(ue(!1),null==V||V(""))}if(null!=ne&&ne>-1){const e=n.cloneDeep(h);e.components[1].cards[ne].components=b.components,e.mapping.cards[ne]=b.mapping,null==C||C(Object.assign({},e))}else null==C||C(b)}function Oe(e,t,o){var i,l,s,a,d,r;const u=null!=ne&&ne>-1?{components:null===(i=Object.assign({},h).components[1].cards)||void 0===i?void 0:i[ne].components,mapping:null===(l=Object.assign({},h).mapping.cards)||void 0===l?void 0:l[ne]}:Object.assign({},h);if(null!=ne&&ne>-1&&te){const t=Object.assign({},h).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 s=null===(t=n.buttons)||void 0===t?void 0:t.filter((e=>"QUICK_REPLY"===e.type));let a=null!==(i=null==s?void 0:s[o])&&void 0!==i?i:{};a=Object.assign(Object.assign({},a),{flowId:e.flowId,flowName:e.flowName});const d=null===(l=n.buttons)||void 0===l?void 0:l.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e));return Object.assign(Object.assign({},n),{buttons:d})}return n}))})))}):n})),i=n.cloneDeep(h);return i.components=t,void(null==C||C(Object.assign({},i)))}const p=null==u?void 0:u.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==p&&p>-1){const n=null===(s=null==u?void 0:u.components[p].buttons)||void 0===s?void 0:s.filter((e=>"QUICK_REPLY"===e.type));if(n){let t=n[o];t=Object.assign(Object.assign({},t),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(r=null===(d=null===(a=u.components)||void 0===a?void 0:a[p])||void 0===d?void 0:d.buttons)&&void 0!==r?r:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),l=Object.assign(Object.assign({},u.components[p]),{buttons:i}),s=[...u.components];s[p]=l,u.components=s}}if(null!=ne&&ne>-1){const e=n.cloneDeep(h);e.components[1].cards[ne].components=u.components,null==C||C(Object.assign({},e))}else null==C||C(u)}t.useEffect((()=>{var e,n;if(null===(e=h.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))ue(!0);else{ue(!1);const e=null===(n=null==ee?void 0:ee.discountCodeExtra)||void 0===n?void 0:n[1];null==e||e("")}}),[h]),t.useEffect((()=>{var e,n,t,o;if(null!=ne&&ne>-1){const i={components:null===(n=null===(e=h.components[1])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[ne].components,mapping:null===(o=null===(t=null==h?void 0:h.mapping)||void 0===t?void 0:t.cards)||void 0===o?void 0:o[ne]},{descriptionComponents:l,urlBtns:s,qrbBtns:a,imageComponent:r,bodyVariables:u,headerVariables:p}=d.getAllDataFromTemplateComponent(i);ce({descriptionComponents:l,urlBtns:s,qrbBtns:a,imageComponent:r,bodyVariables:u,headerVariables:p})}else if(null!=ne&&-1===ne){const{descriptionComponents:e,urlBtns:n,qrbBtns:t,imageComponent:o,bodyVariables:i,headerVariables:l}=d.getAllDataFromTemplateComponent(h);ce({descriptionComponents:e,urlBtns:n,qrbBtns:t,imageComponent:o,bodyVariables:i,headerVariables:l})}}),[ne]),t.useEffect((()=>{var e,n,t,o;if(null!=ne&&ne>-1&&ve){const i={components:null===(n=null===(e=h.components[1])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[ne].components,mapping:null===(o=null===(t=null==h?void 0:h.mapping)||void 0===t?void 0:t.cards)||void 0===o?void 0:o[ne]},{descriptionComponents:l,urlBtns:s,qrbBtns:a,imageComponent:r,bodyVariables:u,headerVariables:p}=d.getAllDataFromTemplateComponent(i);ce({descriptionComponents:l,urlBtns:s,qrbBtns:a,imageComponent:r,bodyVariables:u,headerVariables:p}),me(!1)}}),[ve]);return e.jsxs(b.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:[!!pe.imageComponent&&!te&&e.jsxs(c.EditTemplateMediaContainer,{children:[e.jsx(v.default,{whatsappSpecificPickerMeta:T,mediaComponent:G?pe.imageComponent:se,updateTemplateImageUrl:function(e,t){var o,i,l,s,a,d,r,u;let p;p=null!=ne&&ne>-1?{components:null===(i=null===(o=h.components[1])||void 0===o?void 0:o.cards)||void 0===i?void 0:i[ne].components,mapping:null===(s=null===(l=null==h?void 0:h.mapping)||void 0===l?void 0:l.cards)||void 0===s?void 0:s[ne]}:Object.assign({},h);const c=null===(a=null==p?void 0:p.components)||void 0===a?void 0:a.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:t,example:{header_handle:[e]}}),o=[...p.components];o[c]=n,p=Object.assign(Object.assign({},p),{components:o})}if(p.mapping&&(p.mapping=Object.assign(Object.assign({},p.mapping),{header:void 0})),null!=ne&&ne>-1){const e=n.cloneDeep(h);e.components[1].cards[ne].components=p.components,(null===(d=null==e?void 0:e.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==e?void 0:e.mapping)||void 0===r?void 0:r.cards.length)>0&&(e.mapping.cards[ne]=null!==(u=p.mapping)&&void 0!==u?u:{}),null==C||C(Object.assign({},e)),me(!0)}else null==C||C(Object.assign({},p))},template:h,variableListForImage:B}),(null==se?void 0:se.format)==l.HEADER_TYPES.DOCUMENT?e.jsx(O,{children:e.jsx(i.Input,{labelText:"PDF Name",placeholder:"Enter the name",value:be,errorMessage:fe||void 0,onBlur:()=>{if(!be)return null==L||L(""),void je("PDF name is Required");const e=r.validateInputName(be);null==L||L(be),je(e?"Please enter a valid PDF name":void 0)},onChangeText:e=>{je(""),ge(e)}})}):e.jsx(e.Fragment,{})]}),pe.bodyVariables.length>0&&e.jsx(f.default,{containerStyle:{paddingTop:pe.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=pe.descriptionComponents)||void 0===q?void 0:q.map(((n,t)=>e.jsx(g.default,{originalVariableList:null!=ne&&ne>-1?J.cards[ne]:J,type:n.type,descriptionComponent:n.component,showVariableModal:x,variableList:y},t))),(null===(U=null===(D=null!=ne&&ne>-1?J.cards[ne].buttons:null==J?void 0:J.buttons)||void 0===D?void 0:D.filter((e=>"URL"===e.type)))||void 0===U?void 0:U.length)>0&&e.jsx(f.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(P=null===(I=null!=ne&&ne>-1?J.cards[ne].buttons:null==J?void 0:J.buttons)||void 0===I?void 0:I.filter((e=>Z===s.POD.CHATBOT||"URL"===e.type)))||void 0===P?void 0:P.map(((n,t)=>{if("URL"===n.type)return e.jsx(j.default,{variableListIndex:t,CTAoptions:null==T?void 0:T.CTAoptions,button:n,currentVariableList:null!=ne&&ne>-1?Object.assign({},J.cards[ne]):Object.assign({},J),updateSelectedURLTemplateBtn:he,variableList:y},`${t}_${ne}`)})),Z===s.POD.CHATBOT&&(null===(w=null===(R=le[0])||void 0===R?void 0:R.component)||void 0===w?void 0:w.buttons)&&(null===(N=null===(M=null===(A=le[0])||void 0===A?void 0:A.component)||void 0===M?void 0:M.buttons)||void 0===N?void 0:N.length)>0&&e.jsx(u.BackTrackComponent,{backTrackMessage:null===(S=null==ee?void 0:ee.backTrackExtra)||void 0===S?void 0:S[0],setBackTrackMessage:null===(_=null==ee?void 0:ee.backTrackExtra)||void 0===_?void 0:_[1]}),(null===(H=null===(F=null!=ne&&ne>-1?J.cards[ne].buttons:null==J?void 0:J.buttons)||void 0===F?void 0:F.filter((e=>"QUICK_REPLY"===e.type)))||void 0===H?void 0:H.length)>0&&(Z!==s.POD.CHATBOT?e.jsx(f.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(u.BackTrackComponent,{backTrackMessage:null===(Q=null==ee?void 0:ee.backTrackExtra)||void 0===Q?void 0:Q[0],setBackTrackMessage:null===(Y=null==ee?void 0:ee.backTrackExtra)||void 0===Y?void 0:Y[1]})),null===(W=null===(K=null!=ne&&ne>-1?J.cards[ne].buttons:null==J?void 0:J.buttons)||void 0===K?void 0:K.filter((e=>"QUICK_REPLY"===e.type)))||void 0===W?void 0:W.map(((n,t)=>{if("QUICK_REPLY"===n.type&&Z!==s.POD.CHATBOT)return e.jsx(j.default,{variableListIndex:t,QRBoptions:null==T?void 0:T.QRBoptions,button:n,currentVariableList:null!=ne&&ne>-1?Object.assign({},J.cards[ne]):Object.assign({},J),updateSelectedQRBTemplateBtn:Oe},`${t}_${ne}`)})),Z===s.POD.CHATBOT&&re&&e.jsx(p.DiscountCodeComponent,{discountCode:null===($=null==ee?void 0:ee.discountCodeExtra)||void 0===$?void 0:$[0],setDiscountCode:null===(X=null==ee?void 0:ee.discountCodeExtra)||void 0===X?void 0:X[1],variableList:y}),null===(z=null!=ne&&ne>-1?J.cards[ne].buttons:null==J?void 0:J.buttons)||void 0===z?void 0:z.map(((n,t)=>{var o,i,l;if("COPY_CODE"===n.type)return e.jsx(m.default,{index:t,variable:{variableName:null!==(o=n.text)&&void 0!==o?o:"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,variableList:y,componentType:"BUTTONS"},t)}))]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("lodash"),t=require("react"),o=require("../../template-preview/models/WhatsAppTemplate.js"),i=require("../context/templateModalContext.js"),l=require("../utils/getDataFromTemplateComponent.js"),s=require("./BackTrackComponent.js"),a=require("./DiscountCodeComponent.js"),d=require("./EditMediaV2.style.js"),r=require("./EditWhatsAppTemplateMediaV2.js"),u=require("./VariableConnector.js"),c=require("./VariableConnectorsPanel.js"),p=require("./VariableConnectorWhatsApp.js"),v=require("./VariableEditorHeader.js"),m=require("./WhatsAppTemplateCardButtonV2.js");exports.default=b=>{let{template:g,onTemplateChange:f,whatsappSpecificPickerMeta:j,showVariableModal:O,variableList:C,variableListForImage:h,discountCode:T,setDiscountCode:x}=b;var y,B,V,k,E,L,U,q,D,I,w,R,P,A,M,S,_,N,H,Q,Y;const F=g.isCarouselType,{originalVariableList:K,pod:W,extras:$,selectedCarouselIndex:X,isProductCarouselType:z}=i.useTemplateModalContext(),{descriptionComponents:G,urlBtns:J,qrbBtns:Z,imageComponent:ee,bodyVariables:ne,headerVariables:te}=l.getAllDataFromTemplateComponent(g),[oe,ie]=t.useState(!1),[le,se]=t.useState(-1===X?{descriptionComponents:G,urlBtns:J,qrbBtns:Z,imageComponent:ee,bodyVariables:ne,headerVariables:te}:{}),[ae,de]=t.useState(!1);function re(e,t,o){var i,l,s,a,d,r,u,c,p,v;const m=null!=X&&X>-1?{components:null===(i=Object.assign({},g).components[1].cards)||void 0===i?void 0:i[X].components,mapping:null===(l=Object.assign({},g).mapping.cards)||void 0===l?void 0:l[X]}:Object.assign({},g),b=n.cloneDeep(m),j="custom"===t&&"string"==typeof e,O=j?e:"string"!=typeof e?e.defaultValue?e.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=X&&X>-1&&z){const t=Object.assign({},g).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,t,i;if("BUTTONS"===e.type){const l=null===(n=e.buttons)||void 0===n?void 0:n.filter((e=>"URL"===e.type));let s=null!==(t=null==l?void 0:l[o])&&void 0!==t?t:{};s=Object.assign(Object.assign({},s),{url:"https://d.bik.ai/{{1}}",example:[O]});const a=null===(i=e.buttons)||void 0===i?void 0:i.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==s?void 0:s.text)?s:e));return Object.assign(Object.assign({},e),{buttons:a})}return e}))})))}):e})),i=null===(a=null===(s=Object.assign({},g).mapping)||void 0===s?void 0:s.cards)||void 0===a?void 0:a.map((n=>{var t;return Object.assign(Object.assign({},n),{buttons:null===(t=null==n?void 0:n.buttons)||void 0===t?void 0:t.map((n=>j?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:""))})})),l=n.cloneDeep(g);return l.components=t,l.mapping.cards=i,void(null==f||f(Object.assign({},l)))}const C=null==b?void 0:b.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==C&&C>-1){const n=null===(d=null==b?void 0:b.components[C].buttons)||void 0===d?void 0:d.filter((e=>"URL"===e.type));if((null==n?void 0:n.length)>0){const i="custom"===t&&"string"==typeof e,l=i?e:"string"!=typeof e&&e.defaultValue?e.defaultValue:"https://d.bik.ai/";let s=n[o];s=Object.assign(Object.assign({},s),{url:"https://d.bik.ai/{{1}}",example:[l]});const a=[...null!==(c=null===(u=null===(r=b.components)||void 0===r?void 0:r[C])||void 0===u?void 0:u.buttons)&&void 0!==c?c:[]].map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==s?void 0:s.text)?s:e)),d=Object.assign(Object.assign({},b.components[C]),{buttons:a}),v=null===(p=b.mapping)||void 0===p?void 0:p.buttons;v&&v.length>0&&(v[o]=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[C]=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==x||x(""))}if(null!=X&&X>-1){const e=n.cloneDeep(g);e.components[1].cards[X].components=b.components,e.mapping.cards[X]=b.mapping,null==f||f(Object.assign({},e))}else null==f||f(b)}function ue(e,t,o){var i,l,s,a,d,r;const u=null!=X&&X>-1?{components:null===(i=Object.assign({},g).components[1].cards)||void 0===i?void 0:i[X].components,mapping:null===(l=Object.assign({},g).mapping.cards)||void 0===l?void 0:l[X]}:Object.assign({},g);if(null!=X&&X>-1&&z){const t=Object.assign({},g).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 s=null===(t=n.buttons)||void 0===t?void 0:t.filter((e=>"QUICK_REPLY"===e.type));let a=null!==(i=null==s?void 0:s[o])&&void 0!==i?i:{};a=Object.assign(Object.assign({},a),{flowId:e.flowId,flowName:e.flowName});const d=null===(l=n.buttons)||void 0===l?void 0:l.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e));return Object.assign(Object.assign({},n),{buttons:d})}return n}))})))}):n})),i=n.cloneDeep(g);return i.components=t,void(null==f||f(Object.assign({},i)))}const c=null==u?void 0:u.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==c&&c>-1){const n=null===(s=null==u?void 0:u.components[c].buttons)||void 0===s?void 0:s.filter((e=>"QUICK_REPLY"===e.type));if(n){let t=n[o];t=Object.assign(Object.assign({},t),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(r=null===(d=null===(a=u.components)||void 0===a?void 0:a[c])||void 0===d?void 0:d.buttons)&&void 0!==r?r:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),l=Object.assign(Object.assign({},u.components[c]),{buttons:i}),s=[...u.components];s[c]=l,u.components=s}}if(null!=X&&X>-1){const e=n.cloneDeep(g);e.components[1].cards[X].components=u.components,null==f||f(Object.assign({},e))}else null==f||f(u)}return t.useEffect((()=>{var e,n;if(null===(e=g.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==$?void 0:$.discountCodeExtra)||void 0===n?void 0:n[1];null==e||e("")}}),[g]),t.useEffect((()=>{var e,n,t,o;if(null!=X&&X>-1){const i={components:null===(n=null===(e=g.components[1])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[X].components,mapping:null===(o=null===(t=null==g?void 0:g.mapping)||void 0===t?void 0:t.cards)||void 0===o?void 0:o[X]},{descriptionComponents:s,urlBtns:a,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:c}=l.getAllDataFromTemplateComponent(i);se({descriptionComponents:s,urlBtns:a,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:c})}else if(null!=X&&-1===X){const{descriptionComponents:e,urlBtns:n,qrbBtns:t,imageComponent:o,bodyVariables:i,headerVariables:s}=l.getAllDataFromTemplateComponent(g);se({descriptionComponents:e,urlBtns:n,qrbBtns:t,imageComponent:o,bodyVariables:i,headerVariables:s})}}),[X]),t.useEffect((()=>{var e,n,t,o;if(null!=X&&X>-1&&ae){const i={components:null===(n=null===(e=g.components[1])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[X].components,mapping:null===(o=null===(t=null==g?void 0:g.mapping)||void 0===t?void 0:t.cards)||void 0===o?void 0:o[X]},{descriptionComponents:s,urlBtns:a,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:c}=l.getAllDataFromTemplateComponent(i);se({descriptionComponents:s,urlBtns:a,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:c}),de(!1)}}),[ae]),e.jsxs(c.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:[!!le.imageComponent&&!z&&e.jsx(d.EditTemplateMediaContainer,{children:e.jsx(r.default,{whatsappSpecificPickerMeta:j,mediaComponent:F?le.imageComponent:ee,updateTemplateImageUrl:function(e,t){var o,i,l,s,a,d,r,u;let c;c=null!=X&&X>-1?{components:null===(i=null===(o=g.components[1])||void 0===o?void 0:o.cards)||void 0===i?void 0:i[X].components,mapping:null===(s=null===(l=null==g?void 0:g.mapping)||void 0===l?void 0:l.cards)||void 0===s?void 0:s[X]}:Object.assign({},g);const p=null===(a=null==c?void 0:c.components)||void 0===a?void 0:a.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==p&&p>-1&&(null==c?void 0:c.components[p])){const n=Object.assign(Object.assign({},c.components[p]),{format:t,example:{header_handle:[e]}}),o=[...c.components];o[p]=n,c=Object.assign(Object.assign({},c),{components:o})}if(c.mapping&&(c.mapping=Object.assign(Object.assign({},c.mapping),{header:void 0})),null!=X&&X>-1){const e=n.cloneDeep(g);e.components[1].cards[X].components=c.components,(null===(d=null==e?void 0:e.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==e?void 0:e.mapping)||void 0===r?void 0:r.cards.length)>0&&(e.mapping.cards[X]=null!==(u=c.mapping)&&void 0!==u?u:{}),null==f||f(Object.assign({},e)),de(!0)}else null==f||f(Object.assign({},c))},template:g,variableListForImage:h})}),le.bodyVariables.length>0&&e.jsx(v.default,{containerStyle:{paddingTop:le.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===(y=le.descriptionComponents)||void 0===y?void 0:y.map(((n,t)=>e.jsx(p.default,{originalVariableList:null!=X&&X>-1?K.cards[X]:K,type:n.type,descriptionComponent:n.component,showVariableModal:O,variableList:C},t))),(null===(V=null===(B=null!=X&&X>-1?K.cards[X].buttons:null==K?void 0:K.buttons)||void 0===B?void 0:B.filter((e=>"URL"===e.type)))||void 0===V?void 0:V.length)>0&&e.jsx(v.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(E=null===(k=null!=X&&X>-1?K.cards[X].buttons:null==K?void 0:K.buttons)||void 0===k?void 0:k.filter((e=>W===o.POD.CHATBOT||"URL"===e.type)))||void 0===E?void 0:E.map(((n,t)=>{if("URL"===n.type)return e.jsx(m.default,{variableListIndex:t,CTAoptions:null==j?void 0:j.CTAoptions,button:n,currentVariableList:null!=X&&X>-1?Object.assign({},K.cards[X]):Object.assign({},K),updateSelectedURLTemplateBtn:re,variableList:C},`${t}_${X}`)})),W===o.POD.CHATBOT&&(null===(U=null===(L=Z[0])||void 0===L?void 0:L.component)||void 0===U?void 0:U.buttons)&&(null===(I=null===(D=null===(q=Z[0])||void 0===q?void 0:q.component)||void 0===D?void 0:D.buttons)||void 0===I?void 0:I.length)>0&&e.jsx(s.BackTrackComponent,{backTrackMessage:null===(w=null==$?void 0:$.backTrackExtra)||void 0===w?void 0:w[0],setBackTrackMessage:null===(R=null==$?void 0:$.backTrackExtra)||void 0===R?void 0:R[1]}),(null===(A=null===(P=null!=X&&X>-1?K.cards[X].buttons:null==K?void 0:K.buttons)||void 0===P?void 0:P.filter((e=>"QUICK_REPLY"===e.type)))||void 0===A?void 0:A.length)>0&&(W!==o.POD.CHATBOT?e.jsx(v.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(s.BackTrackComponent,{backTrackMessage:null===(M=null==$?void 0:$.backTrackExtra)||void 0===M?void 0:M[0],setBackTrackMessage:null===(S=null==$?void 0:$.backTrackExtra)||void 0===S?void 0:S[1]})),null===(N=null===(_=null!=X&&X>-1?K.cards[X].buttons:null==K?void 0:K.buttons)||void 0===_?void 0:_.filter((e=>"QUICK_REPLY"===e.type)))||void 0===N?void 0:N.map(((n,t)=>{if("QUICK_REPLY"===n.type&&W!==o.POD.CHATBOT)return e.jsx(m.default,{variableListIndex:t,QRBoptions:null==j?void 0:j.QRBoptions,button:n,currentVariableList:null!=X&&X>-1?Object.assign({},K.cards[X]):Object.assign({},K),updateSelectedQRBTemplateBtn:ue},`${t}_${X}`)})),W===o.POD.CHATBOT&&oe&&e.jsx(a.DiscountCodeComponent,{discountCode:null===(H=null==$?void 0:$.discountCodeExtra)||void 0===H?void 0:H[0],setDiscountCode:null===(Q=null==$?void 0:$.discountCodeExtra)||void 0===Q?void 0:Q[1],variableList:C}),null===(Y=null!=X&&X>-1?K.cards[X].buttons:null==K?void 0:K.buttons)||void 0===Y?void 0:Y.map(((n,t)=>{var o,i,l;if("COPY_CODE"===n.type)return e.jsx(u.default,{index:t,variable:{variableName:null!==(o=n.text)&&void 0!==o?o:"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,variableList:C,componentType:"BUTTONS"},t)}))]}))};
@@ -13,8 +13,6 @@ export interface TemplateSelectModalContentProps {
13
13
  discountCode?: string;
14
14
  setDiscountCode?: (code: string) => void;
15
15
  showSampleValues?: boolean;
16
- fileName?: string;
17
- setFileName?: (name: string) => void;
18
16
  }
19
- declare const TemplateSelectModalContent: ({ channel, showVariableMapping, showOnlyContent, whatsappSpecificPickerMeta, showVariableModal, variableList, discountCode, setDiscountCode, variableListForImage, showSampleValues, fileName, setFileName, }: TemplateSelectModalContentProps) => import("react/jsx-runtime").JSX.Element;
17
+ declare const TemplateSelectModalContent: ({ channel, showVariableMapping, showOnlyContent, whatsappSpecificPickerMeta, showVariableModal, variableList, discountCode, setDiscountCode, variableListForImage, showSampleValues, }: TemplateSelectModalContentProps) => import("react/jsx-runtime").JSX.Element;
20
18
  export default TemplateSelectModalContent;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("../../template-preview/models/Channels.js"),s=require("./Body.js"),i=require("./Header.js");exports.default=t=>{let{channel:l,showVariableMapping:r,showOnlyContent:o,whatsappSpecificPickerMeta:n,showVariableModal:d,variableList:p,discountCode:u,setDiscountCode:c,variableListForImage:h,showSampleValues:m,fileName:w,setFileName:b}=t;return e.jsx("div",Object.assign({style:{paddingBottom:0}},{children:e.jsxs("div",{children:[l===a.CHANNEL_TYPE.EMAIL&&e.jsx(i.default,{showOnlyContent:o}),e.jsx(s.default,{whatsappSpecificPickerMeta:n,showVariableMapping:!!r,showOnlyContent:o,showVariableModal:d,variableList:p,discountCode:u,setDiscountCode:c,variableListForImage:h,showSampleValues:m,fileName:w,setFileName:b})]})}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("../../template-preview/models/Channels.js"),s=require("./Body.js"),t=require("./Header.js");exports.default=i=>{let{channel:r,showVariableMapping:o,showOnlyContent:l,whatsappSpecificPickerMeta:n,showVariableModal:d,variableList:p,discountCode:u,setDiscountCode:c,variableListForImage:h,showSampleValues:w}=i;return e.jsx("div",Object.assign({style:{paddingBottom:0}},{children:e.jsxs("div",{children:[r===a.CHANNEL_TYPE.EMAIL&&e.jsx(t.default,{showOnlyContent:l}),e.jsx(s.default,{whatsappSpecificPickerMeta:n,showVariableMapping:!!o,showOnlyContent:l,showVariableModal:d,variableList:p,discountCode:u,setDiscountCode:c,variableListForImage:h,showSampleValues:w})]})}))};
@@ -8,5 +8,8 @@ export type CheckBoxProps = {
8
8
  label?: string;
9
9
  size?: 'DEFAULT' | 'SMALL';
10
10
  skipHoverState?: boolean;
11
+ labelSize?: 'DEFAULT' | 'SMALL';
12
+ rightComponent?: JSX.Element;
13
+ checkboxBorderColor?: string;
11
14
  };
12
15
  export declare const CheckBox: React.FC<CheckBoxProps>;
@@ -1 +1 @@
1
- import{jsxs as i,jsx as e}from"react/jsx-runtime";import{useState as l,useEffect as s}from"react";import{CheckboxContainer as a,CheckboxIcon as t}from"./CheckBox.styled.js";import{BodyPrimary as r,BodySecondary as o}from"../TypographyStyle.js";import{COLORS as n}from"../../constants/Theme.js";const d=l=>i("svg",Object.assign({width:l.isSmall?"16":"18",height:l.isSmall?"16":"18",viewBox:l.isSmall?"0 0 16 16":"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e("rect",{x:"0",y:"0",width:l.isSmall?"16":"18",height:l.isSmall?"16":"18",rx:"4",fill:l.isDisabled?n.content.inactive:n.background.positive.vibrant}),!l.isPartial&&e("svg",Object.assign({width:l.isSmall?"8":"10",height:l.isSmall?"7":"9",x:"4",y:"4",viewBox:"0 0 10 9",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:e("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M9.68189 1.06043C10.0724 1.45096 10.0724 2.08412 9.68189 2.47464L4.02501 8.13152C3.63449 8.52205 3.00132 8.52205 2.6108 8.13152L0.489684 6.01041C0.0991601 5.61988 0.0991598 4.98672 0.489684 4.59619C0.880209 4.20567 1.51337 4.20567 1.9039 4.59619L3.31791 6.0102L8.26768 1.06043C8.6582 0.669907 9.29137 0.669907 9.68189 1.06043Z",fill:"white"})})),l.isPartial&&e("rect",{x:"5",y:l.isSmall?"7":"8",width:l.isSmall?"6":"8",height:"2",rx:"1",fill:n.surface.standard})]})),c=c=>{const[h,m]=l(c.isChecked||!1),[b,g]=l(c.isPartiallyChecked||!1),[p,v]=l(c.isDisabled||!1),[w,x]=l(!1),[S,C]=l(!1);return s((()=>{m(c.isChecked)}),[c.isChecked]),s((()=>{v(c.isDisabled||!1)}),[c.isDisabled]),s((()=>{g(c.isPartiallyChecked||!1)}),[c.isPartiallyChecked]),i(a,Object.assign({onClick:i=>{var e;if(!c.isDisabled){const l=!h;b?g(!b):m(l),null===(e=c.onValueChange)||void 0===e||e.call(c,l,c.value,i)}},onMouseEnter:()=>x(!c.skipHoverState),onMouseLeave:()=>x(!1),onMouseDown:()=>C(!c.skipHoverState),onMouseUp:()=>C(!1)},{children:[e(t,Object.assign({checked:h,hovered:w,clicked:S,isDisabled:p,size:c.size},{children:h&&e(d,{isPartial:b||!1,isDisabled:p,isSmall:"SMALL"===c.size})})),c.label&&"SMALL"!==c.size&&e(r,Object.assign({color:c.isDisabled?n.text.disabled:n.text.primary},{children:c.label})),c.label&&"SMALL"===c.size&&e(o,Object.assign({color:c.isDisabled?n.text.disabled:n.text.primary},{children:c.label}))]}))};export{c as CheckBox};
1
+ import{jsxs as e,jsx as i}from"react/jsx-runtime";import{useState as l,useEffect as s}from"react";import{CheckboxContainer as a,CheckboxIcon as t}from"./CheckBox.styled.js";import{BodyPrimary as r,BodySecondary as o}from"../TypographyStyle.js";import{COLORS as n}from"../../constants/Theme.js";const d=l=>e("svg",Object.assign({width:l.isSmall?"16":"18",height:l.isSmall?"16":"18",viewBox:l.isSmall?"0 0 16 16":"0 0 18 18",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[i("rect",{x:"0",y:"0",width:l.isSmall?"16":"18",height:l.isSmall?"16":"18",rx:"4",fill:l.isDisabled?n.content.inactive:n.background.positive.vibrant}),!l.isPartial&&i("svg",Object.assign({width:l.isSmall?"8":"10",height:l.isSmall?"7":"9",x:"4",y:"4",viewBox:"0 0 10 9",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:i("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M9.68189 1.06043C10.0724 1.45096 10.0724 2.08412 9.68189 2.47464L4.02501 8.13152C3.63449 8.52205 3.00132 8.52205 2.6108 8.13152L0.489684 6.01041C0.0991601 5.61988 0.0991598 4.98672 0.489684 4.59619C0.880209 4.20567 1.51337 4.20567 1.9039 4.59619L3.31791 6.0102L8.26768 1.06043C8.6582 0.669907 9.29137 0.669907 9.68189 1.06043Z",fill:"white"})})),l.isPartial&&i("rect",{x:"5",y:l.isSmall?"7":"8",width:l.isSmall?"6":"8",height:"2",rx:"1",fill:n.surface.standard})]})),c=c=>{const[h,b]=l(c.isChecked||!1),[m,g]=l(c.isPartiallyChecked||!1),[S,p]=l(c.isDisabled||!1),[v,x]=l(!1),[C,w]=l(!1);return s((()=>{b(c.isChecked)}),[c.isChecked]),s((()=>{p(c.isDisabled||!1)}),[c.isDisabled]),s((()=>{g(c.isPartiallyChecked||!1)}),[c.isPartiallyChecked]),e(a,Object.assign({onClick:e=>{var i;if(!c.isDisabled){const l=!h;m?g(!m):b(l),null===(i=c.onValueChange)||void 0===i||i.call(c,l,c.value,e)}},onMouseEnter:()=>x(!c.skipHoverState),onMouseLeave:()=>x(!1),onMouseDown:()=>w(!c.skipHoverState),onMouseUp:()=>w(!1)},{children:[i(t,Object.assign({checked:h,hovered:v,clicked:C,isDisabled:S,size:c.size,borderColor:c.checkboxBorderColor},{children:h&&i(d,{isPartial:m||!1,isDisabled:S,isSmall:"SMALL"===c.size})})),c.label&&"SMALL"!==c.size&&"SMALL"!==c.labelSize&&i(r,Object.assign({color:c.isDisabled?n.text.disabled:n.text.primary},{children:c.label})),c.label&&("SMALL"===c.size||"SMALL"===c.labelSize)&&i(o,Object.assign({color:c.isDisabled?n.text.disabled:n.text.primary},{children:c.label})),c.rightComponent]}))};export{c as CheckBox};
@@ -5,4 +5,5 @@ export declare const CheckboxIcon: import("styled-components").StyledComponent<"
5
5
  clicked: boolean;
6
6
  isDisabled: boolean;
7
7
  size?: "SMALL" | "DEFAULT" | undefined;
8
+ borderColor?: string | undefined;
8
9
  }, never>;
@@ -3,7 +3,7 @@ import e,{css as i}from"styled-components";import{COLORS as o}from"../../constan
3
3
  gap: 8px;
4
4
  align-items: center;
5
5
  cursor: pointer;
6
- `,s=e.div`
6
+ `,r=e.div`
7
7
  width: ${e=>"SMALL"===e.size?12:14}px;
8
8
  height: ${e=>"SMALL"===e.size?12:14}px;
9
9
  border-radius: 4px;
@@ -12,12 +12,13 @@ import e,{css as i}from"styled-components";import{COLORS as o}from"../../constan
12
12
  justify-content: center;
13
13
  align-items: center;
14
14
  box-sizing: content-box;
15
- ${e=>e.isDisabled?i`
15
+ ${e=>{var t;return e.isDisabled?i`
16
16
  border: ${"SMALL"===e.size?1.5:2}px solid
17
17
  ${o.content.inactive};
18
18
  `:i`
19
- border: ${"SMALL"===e.size?1.5:2}px solid black;
20
- `}
19
+ border: ${"SMALL"===e.size?1.5:2}px solid
20
+ ${null!==(t=e.borderColor)&&void 0!==t?t:"black"};
21
+ `}}
21
22
  ${e=>e.checked&&i`
22
23
  border: 0px;
23
24
  width: 18px;
@@ -31,4 +32,4 @@ import e,{css as i}from"styled-components";import{COLORS as o}from"../../constan
31
32
  ${e.checked?o.stroke.positive.lightAlt:o.surface.hovered};
32
33
  outline-offset: 2px;
33
34
  `}
34
- `;export{t as CheckboxContainer,s as CheckboxIcon};
35
+ `;export{t as CheckboxContainer,r as CheckboxIcon};
@@ -8,6 +8,7 @@ export type CheckListProps = {
8
8
  subTitle?: string;
9
9
  listItems: CheckListItem[];
10
10
  onChange: (options: CheckListItem[]) => void;
11
+ listContainerStyles?: React.CSSProperties;
11
12
  };
12
13
  export declare const CheckList: React.FC<CheckListProps>;
13
14
  export {};
@@ -1 +1 @@
1
- import{jsxs as t,jsx as e}from"react/jsx-runtime";import{useState as s,useEffect as i}from"react";import{CheckBox as c}from"../checkBox/CheckBox.js";import{CheckListStyled as o}from"./CheckList.styled.js";import{TitleRegular as r,BodySecondary as n}from"../TypographyStyle.js";import{COLORS as l}from"../../constants/Theme.js";const a=a=>{const[m,h]=s(a.listItems);i((()=>{h(a.listItems)}),[a.listItems]);const d=(t,e)=>{const s=[...m],i=m.find((t=>t.value===e));i&&(i.isChecked=t),h(s);const c=s.filter((t=>t.isChecked));a.onChange(c)};return t(o,{children:[(a.title||a.subTitle)&&t("div",Object.assign({className:"title__container"},{children:[a.title&&e(r,{children:a.title}),a.subTitle&&e(n,Object.assign({color:l.text.secondary},{children:a.subTitle}))]})),e("div",Object.assign({className:"list__container"},{children:m.map((t=>e(c,Object.assign({},t,{onValueChange:d}),t.value)))}))]})};export{a as CheckList};
1
+ import{jsxs as t,jsx as e}from"react/jsx-runtime";import{useState as s,useEffect as i}from"react";import{CheckBox as n}from"../checkBox/CheckBox.js";import{CheckListStyled as o}from"./CheckList.styled.js";import{TitleRegular as r,BodySecondary as l}from"../TypographyStyle.js";import{COLORS as c}from"../../constants/Theme.js";const a=a=>{var m;const[h,d]=s(a.listItems);i((()=>{d(a.listItems)}),[a.listItems]);const p=(t,e)=>{const s=[...h],i=h.find((t=>t.value===e));i&&(i.isChecked=t),d(s);const n=s.filter((t=>t.isChecked));a.onChange(n)};return t(o,{children:[(a.title||a.subTitle)&&t("div",Object.assign({className:"title__container"},{children:[a.title&&e(r,{children:a.title}),a.subTitle&&e(l,Object.assign({color:c.text.secondary},{children:a.subTitle}))]})),e("div",Object.assign({style:null!==(m=a.listContainerStyles)&&void 0!==m?m:{},className:"list__container"},{children:h.map((t=>e(n,Object.assign({},t,{onValueChange:p}),t.value)))}))]})};export{a as CheckList};
@@ -57,6 +57,5 @@ export interface InputProps {
57
57
  autoGrow?: boolean;
58
58
  minHeight?: string;
59
59
  maxHeight?: string;
60
- labelTextBold?: boolean;
61
60
  }
62
61
  export declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement | HTMLTextAreaElement | null>>;
@@ -1 +1 @@
1
- import{jsxs as e,jsx as t,Fragment as n}from"react/jsx-runtime";import i from"../../assets/icons/info.svg.js";import{forwardRef as r,useState as l,useContext as o,useRef as a,useEffect as s}from"react";import{Button as c}from"../button/Button.js";import{isFunction as u,validateInput as h}from"./Input-helper.js";import{Tooltip as d}from"../tooltips/Tooltip.js";import{TitleSmall as v,BodySecondary as p}from"../TypographyStyle.js";import{COLORS as g}from"../../constants/Theme.js";import m from"../../assets/icons/errorInfo.svg.js";import{InputStyleContext as f}from"./context/InputStyleProvider.js";import{RootContainer as b,InputFooter as x,InputWrapper as y,IconHolder as j,PrefixHolder as C,InputContainer as w,InputContainerSmall as k,SuffixHolder as O,InputHeader as T,MaxCharStyle as I}from"./Input.styled.js";const H=r(((r,H)=>{var L,E,z,A,B;const{placeholder:D,leftIcon:F,rightIcon:M,labelText:S,maxCharLimit:K,isRequired:R,hintText:G,type:N,state:_,validate:q,variant:P,button:V,suffixText:W,prefixText:$,onChangeText:J,value:Q,noErrorHint:U,reset:X,rangeValidation:Y,noKeyDownChange:Z,version:ee,noMaxCharCheck:te,labelElement:ne,autoGrow:ie,minHeight:re,maxHeight:le,labelTextBold:oe}=Object.assign({maxCharLimit:0,type:"text",variant:"default"},r),ae=null==F?void 0:F.icon,se=null==M?void 0:M.icon,[ce,ue]=l(!1),[he,de]=l(!1),[ve,pe]=l(),ge="small"===P?"18px":"22px",me=o(f),[fe,be]=l(),xe=a(null),ye=null!=H?H:xe;s((()=>{be(Q),!Q&&ie&&(ye.current.style.height=re||"48px")}),[Q]),s((()=>{var e;ye.current&&(null===(e=r.onReferenceInit)||void 0===e||e.call(r,ye.current))}),[ye]),s((()=>{const e=ye.current;if(e&&["phonenumber","zip","number"].includes(N))return e.addEventListener("wheel",ke,{passive:!1}),()=>{e.removeEventListener("wheel",ke)}}),[]),s((()=>{X&&be("")}),[X]),s((()=>{var e;de(!!r.isActive),r.isActive&&(null===(e=ye.current)||void 0===e||e.focus())}),[r.isActive]),s((()=>{pe(r.errorMessage)}),[r.errorMessage]),s((()=>{var e;ue(!1),("invalid"===r.state||ve||"disabled-invalid"===r.state)&&ue(!0),"active"===r.state&&(null===(e=ye.current)||void 0===e||e.focus())}),[r.state,ve]),s((()=>{ue(!!ve)}),[ve]);const je=function(e){if(u(e)){for(var t=arguments.length,n=new Array(t>1?t-1:0),i=1;i<t;i++)n[i-1]=arguments[i];e(...n)}},Ce=()=>"zip"===N?6:60,we=e=>{const t=0!==K?K:Ce();if(Z||J(Q||"",e),te)return;const n=e.target.value;![8].includes(e.which)&&t>0&&n.length>=t&&e.preventDefault()},ke=e=>{e.preventDefault()},Oe=e=>{let t=e.target.value;const n=0!==K?K+1:Ce();!te&&n>0&&t.length>=n&&(t=t.substring(0,n-1)),J(t,e),r.textControl||be(t),ie&&(ye.current.style.height=`${ye.current.scrollHeight}px`,t||(ye.current.style.height=re||"48px"));const i=q||h;if(!i||!u(i))return;const[l,o]=i(t,N,Y);ue(!l),pe(r.errorMessage?r.errorMessage:o)},Te=e=>{var t;r.skipFocus||de(!0),je(null===(t=r.onFocus)||void 0===t?void 0:t.call(r,e))},Ie=e=>{var t;r.skipFocus||de(!1),je(null===(t=r.onBlur)||void 0===t?void 0:t.call(r,e))},He=()=>{var i;return e(n,{children:["multiline"!==N&&t("input",{"data-test":r["data-test"],id:r.id,style:null!==(i=null==me?void 0:me.input)&&void 0!==i?i:{},ref:ye,type:["phonenumber","zip","number"].includes(N)?"number":N,value:fe,onFocus:e=>Te(e),onBlur:e=>Ie(e),placeholder:D||"Enter here",onChange:Oe,onClick:e=>je(r.onClick),onKeyDown:e=>we(e)}),"multiline"===N&&t("textarea",{"data-test":r["data-test"],value:fe,ref:ye,onFocus:e=>Te(e),onBlur:e=>Ie(e),onClick:e=>je(r.onClick),placeholder:D||"Enter here",onChange:Oe,onKeyDown:e=>we(e),maxLength:K>0?K:void 0})]})};return e(b,Object.assign({width:r.width,height:r.height,state:_,type:N,style:null!==(L=null==me?void 0:me.RootContainer)&&void 0!==L?L:{}},{children:[!U&&(!!G||!!ve)&&e(x,Object.assign({invalid:!!ve},{children:[!!ve&&t(m,{width:16,height:16}),ve||G]})),e(y,Object.assign({variant:P,state:_,width:r.width,isActive:"active"===_||he,isInvalid:ce,style:null!==(E=null==me?void 0:me.InputWrapper)&&void 0!==E?E:{},version:ee,height:r.height},{children:[!!ae&&t(j,Object.assign({variant:P,iconSize:ge,onClick:()=>je(null==F?void 0:F.callback),isLeft:!0,style:null!==(z=null==me?void 0:me.IconHolder)&&void 0!==z?z:{}},{children:t(ae,{})})),!!$&&t(C,Object.assign({variant:P},{children:$})),"default"===P&&t(w,Object.assign({height:r.height,type:r.type,minHeight:re,maxHeight:le,autoGrow:ie},{children:He()})),"small"===P&&t(k,Object.assign({height:r.height,type:r.type},{children:He()})),!!se&&t(j,Object.assign({variant:P,iconSize:ge,onClick:()=>je(null==M?void 0:M.callback),isLeft:!1},{children:t(se,{})})),!!W&&t(O,Object.assign({variant:P},{children:W})),V&&V.text&&t(c,{buttonText:V.text,onClick:()=>je(null==V?void 0:V.onClick)})]})),(!!S||!!K)&&e(T,Object.assign({invalid:ce},{children:[ne&&ne,e("div",Object.assign({className:"label__container"},{children:[e(oe?v:p,{children:[S,R?t("span",{children:"*"}):""]}),r.tooltipText&&t(d,Object.assign({body:r.tooltipText,placement:"top"},{children:t("span",{children:t(i,{style:{marginTop:-3},width:18,height:18,color:ce?g.content.negative:g.content.primary})})}))]})),K>0&&e(I,{children:[null!==(B=null===(A=r.value)||void 0===A?void 0:A.length)&&void 0!==B?B:0,"/",K]})]}))]}))}));H.displayName="Input";export{H as Input};
1
+ import{jsxs as e,jsx as t,Fragment as n}from"react/jsx-runtime";import i from"../../assets/icons/info.svg.js";import{forwardRef as r,useState as l,useContext as o,useRef as a,useEffect as s}from"react";import{Button as c}from"../button/Button.js";import{isFunction as u,validateInput as h}from"./Input-helper.js";import{Tooltip as d}from"../tooltips/Tooltip.js";import{BodySecondary as v}from"../TypographyStyle.js";import{COLORS as p}from"../../constants/Theme.js";import g from"../../assets/icons/errorInfo.svg.js";import{InputStyleContext as m}from"./context/InputStyleProvider.js";import{RootContainer as f,InputFooter as b,InputWrapper as x,IconHolder as y,PrefixHolder as j,InputContainer as C,InputContainerSmall as w,SuffixHolder as k,InputHeader as O,MaxCharStyle as T}from"./Input.styled.js";const I=r(((r,I)=>{var H,L,E,z,A;const{placeholder:D,leftIcon:F,rightIcon:M,labelText:B,maxCharLimit:S,isRequired:K,hintText:R,type:G,state:N,validate:_,variant:q,button:P,suffixText:V,prefixText:W,onChangeText:$,value:J,noErrorHint:Q,reset:U,rangeValidation:X,noKeyDownChange:Y,version:Z,noMaxCharCheck:ee,labelElement:te,autoGrow:ne,minHeight:ie,maxHeight:re}=Object.assign({maxCharLimit:0,type:"text",variant:"default"},r),le=null==F?void 0:F.icon,oe=null==M?void 0:M.icon,[ae,se]=l(!1),[ce,ue]=l(!1),[he,de]=l(),ve="small"===q?"18px":"22px",pe=o(m),[ge,me]=l(),fe=a(null),be=null!=I?I:fe;s((()=>{me(J),!J&&ne&&(be.current.style.height=ie||"48px")}),[J]),s((()=>{var e;be.current&&(null===(e=r.onReferenceInit)||void 0===e||e.call(r,be.current))}),[be]),s((()=>{const e=be.current;if(e&&["phonenumber","zip","number"].includes(G))return e.addEventListener("wheel",Ce,{passive:!1}),()=>{e.removeEventListener("wheel",Ce)}}),[]),s((()=>{U&&me("")}),[U]),s((()=>{var e;ue(!!r.isActive),r.isActive&&(null===(e=be.current)||void 0===e||e.focus())}),[r.isActive]),s((()=>{de(r.errorMessage)}),[r.errorMessage]),s((()=>{var e;se(!1),("invalid"===r.state||he||"disabled-invalid"===r.state)&&se(!0),"active"===r.state&&(null===(e=be.current)||void 0===e||e.focus())}),[r.state,he]),s((()=>{se(!!he)}),[he]);const xe=function(e){if(u(e)){for(var t=arguments.length,n=new Array(t>1?t-1:0),i=1;i<t;i++)n[i-1]=arguments[i];e(...n)}},ye=()=>"zip"===G?6:60,je=e=>{const t=0!==S?S:ye();if(Y||$(J||"",e),ee)return;const n=e.target.value;![8].includes(e.which)&&t>0&&n.length>=t&&e.preventDefault()},Ce=e=>{e.preventDefault()},we=e=>{let t=e.target.value;const n=0!==S?S+1:ye();!ee&&n>0&&t.length>=n&&(t=t.substring(0,n-1)),$(t,e),r.textControl||me(t),ne&&(be.current.style.height=`${be.current.scrollHeight}px`,t||(be.current.style.height=ie||"48px"));const i=_||h;if(!i||!u(i))return;const[l,o]=i(t,G,X);se(!l),de(r.errorMessage?r.errorMessage:o)},ke=e=>{var t;r.skipFocus||ue(!0),xe(null===(t=r.onFocus)||void 0===t?void 0:t.call(r,e))},Oe=e=>{var t;r.skipFocus||ue(!1),xe(null===(t=r.onBlur)||void 0===t?void 0:t.call(r,e))},Te=()=>{var i;return e(n,{children:["multiline"!==G&&t("input",{"data-test":r["data-test"],id:r.id,style:null!==(i=null==pe?void 0:pe.input)&&void 0!==i?i:{},ref:be,type:["phonenumber","zip","number"].includes(G)?"number":G,value:ge,onFocus:e=>ke(e),onBlur:e=>Oe(e),placeholder:D||"Enter here",onChange:we,onClick:e=>xe(r.onClick),onKeyDown:e=>je(e)}),"multiline"===G&&t("textarea",{"data-test":r["data-test"],value:ge,ref:be,onFocus:e=>ke(e),onBlur:e=>Oe(e),onClick:e=>xe(r.onClick),placeholder:D||"Enter here",onChange:we,onKeyDown:e=>je(e),maxLength:S>0?S:void 0})]})};return e(f,Object.assign({width:r.width,height:r.height,state:N,type:G,style:null!==(H=null==pe?void 0:pe.RootContainer)&&void 0!==H?H:{}},{children:[!Q&&(!!R||!!he)&&e(b,Object.assign({invalid:!!he},{children:[!!he&&t(g,{width:16,height:16}),he||R]})),e(x,Object.assign({variant:q,state:N,width:r.width,isActive:"active"===N||ce,isInvalid:ae,style:null!==(L=null==pe?void 0:pe.InputWrapper)&&void 0!==L?L:{},version:Z,height:r.height},{children:[!!le&&t(y,Object.assign({variant:q,iconSize:ve,onClick:()=>xe(null==F?void 0:F.callback),isLeft:!0,style:null!==(E=null==pe?void 0:pe.IconHolder)&&void 0!==E?E:{}},{children:t(le,{})})),!!W&&t(j,Object.assign({variant:q},{children:W})),"default"===q&&t(C,Object.assign({height:r.height,type:r.type,minHeight:ie,maxHeight:re,autoGrow:ne},{children:Te()})),"small"===q&&t(w,Object.assign({height:r.height,type:r.type},{children:Te()})),!!oe&&t(y,Object.assign({variant:q,iconSize:ve,onClick:()=>xe(null==M?void 0:M.callback),isLeft:!1},{children:t(oe,{})})),!!V&&t(k,Object.assign({variant:q},{children:V})),P&&P.text&&t(c,{buttonText:P.text,onClick:()=>xe(null==P?void 0:P.onClick)})]})),(!!B||!!S)&&e(O,Object.assign({invalid:ae},{children:[te&&te,e("div",Object.assign({className:"label__container"},{children:[e(v,{children:[B,K?t("span",{children:"*"}):""]}),r.tooltipText&&t(d,Object.assign({body:r.tooltipText,placement:"top"},{children:t("span",{children:t(i,{style:{marginTop:-3},width:18,height:18,color:ae?p.content.negative:p.content.primary})})}))]})),S>0&&e(T,{children:[null!==(A=null===(z=r.value)||void 0===z?void 0:z.length)&&void 0!==A?A:0,"/",S]})]}))]}))}));I.displayName="Input";export{I as Input};
@@ -1 +1 @@
1
- import{jsx as e,jsxs as t,Fragment as a}from"react/jsx-runtime";import{SearchIcon as i}from"../../assets/icons/searchIcon.js";import{useState as n,useRef as r,useEffect as o}from"react";import{StyledProductGrid as s,StyledProduct as l}from"./PostPicker.styled.js";import{Tag as d}from"../tag/Tag.js";import{ButtonRegular as c,BodyPrimary as p,BodyCaption as m,TitleMedium as h,ButtonLarge as y,BodySecondary as g}from"../TypographyStyle.js";import{unCamelCase as u}from"../../utils/unCamelCase.js";import{PRIMARY as j}from"../../constants/colors.js";import{COLORS as w}from"../../constants/Theme.js";import v from"../../assets/icons/instagram.svg.js";import f from"../../assets/icons/warning.svg.js";import"../tooltips/Tooltip.js";import"../analytics-chips-and-dropdowns/CommonStyles.js";import{AnalyticsDropdown as b}from"../analytics-chips-and-dropdowns/AnalyticsDropdown.js";import"../analytics-chips-and-dropdowns/AnalyticsMetric.js";import"../shimmer/ShimmerComponent/ShimmerStyled.js";import"../../utils/DateUtils.js";import"../analytics-chips-and-dropdowns/chart/LineChart/LineChart.js";import"react-bootstrap";import"../analytics-chips-and-dropdowns/chart/linearChipGroupedChart/LinearChipGroupedChart.styled.js";import"../analytics-chips-and-dropdowns/chart/Pie/PieChartAnalytics.js";import"../analytics-chips-and-dropdowns/chart/Pie/PieChart.js";import"../analytics-chips-and-dropdowns/chart/HorizontalBarGraph/HorizontalGraph.js";import"../analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js";import"../analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarDistributionChart.js";import"../analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarDistributionChart.model.js";import"../analytics-chips-and-dropdowns/chart/VerticalBarGraph/VerticalGraph.js";import"../analytics-chips-and-dropdowns/chart/heatmap/HeatMap.js";import"../analytics-chips-and-dropdowns/chart/heatmap/HeatMapVertical.js";import"../analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.js";import{StyledModal as C}from"../modals/styledModal.js";import{BikShimmer as D}from"../shimmer/ShimmerComponent/BikShimmer.js";import{ShimmerImage as T}from"../shimmer-image/ShimmerImage.js";import{StateComponent as O,StateInterface as S}from"../states/StateComponent.js";import"../../_virtual/_tslib.js";var k,x;!function(e){e.STORY="story",e.POST="post",e.REEL="reel"}(k||(k={})),function(e){e.Today="Today",e["7_Days"]="7",e["30_Days"]="30",e.custom="custom",e.Yesterday="Yesterday"}(x||(x={}));const B=[{label:"Today",value:"today",key:x.Today,typeValue:[new Date,new Date]},{label:"Last 7 days",value:"7 days",key:x["7_Days"],typeValue:[new Date((new Date).setDate((new Date).getDate()-6)),new Date]},{label:"Last 30 days",value:"30 days",key:x["30_Days"],typeValue:[new Date((new Date).setDate((new Date).getDate()-29)),new Date]},{label:"Custom range",value:"calender",key:x.custom,isCustom:!0,dateRangeSelectionOptions:{selectRange:!0,maxDate:new Date((new Date).setMonth((new Date).getMonth()+3))}}],I=x=>{var I,L;const[P,V]=n(null!==(I=x.previouslySelected)&&void 0!==I?I:[]),[_,G]=n(""),[E,N]=n(!1),[R,$]=n(x.media),[M,A]=n(!1),[H,U]=n(!1),[z,F]=n(!1),Y=r(null);o((()=>{x.media.length||(N(!0),setTimeout((()=>{N(!1)}),2e3)),V(x.selected||[])}),[]),o((()=>{x.media.length>0&&($(x.media),N(!1))}),[null===(L=null==x?void 0:x.media)||void 0===L?void 0:L.length]),o((()=>{P.length>0&&G("")}),[P.length]),o((()=>{M&&($(x.media),U(!1))}),[M]),o((()=>{const e=e=>{document.getElementById("analytic-dropdown").contains(e.target)||F(!z)},t=document.getElementById("post-picker");return t&&t.addEventListener("click",e),()=>{t&&t.removeEventListener("click",e)}}));return e("div",Object.assign({ref:Y},{children:t(C,Object.assign({zIndex:201,open:x.showModal,headingTitle:x.title,onClose:x.onClose,centralContainerStyles:{width:1071,height:x.showFilter?650:564},primaryButton:{disabled:!R.length,buttonType:"primary",buttonText:`Select ${u(x.mediaType)}`,onClick:()=>{P.length?x.onSelect(P):G(`Please select a ${x.mediaType} to proceed`)}},secondaryButton:{buttonType:"secondary",buttonText:"Back",onClick:()=>x.onClose()},footerLeftCustomElement:_?e(d,{tagText:_,type:"negative",LeadingIcon:f}):P.length?t(g,{children:[P.length," selected"]}):null,id:"post-picker"},{children:[x.showFilter&&t("div",Object.assign({style:{marginTop:24,marginBottom:24,padding:"0 24px",display:"flex",flexDirection:"row",gap:8,alignItems:"center"}},{children:[e(b,{options:B,placeholder:"posted on",resetDropdown:M,onOptionSelected:e=>{var t,a;let i=null,n=null;"Custom range"===e.label?(i=(null===(t=null==e?void 0:e.selectedRange)||void 0===t?void 0:t[0])||new Date,n=(null===(a=null==e?void 0:e.selectedRange)||void 0===a?void 0:a[1])||new Date):(i=e.typeValue[0],n=e.typeValue[1]);const r=x.media.filter((e=>function(e,t,a){const i=new Date(e),n=new Date(t),r=new Date(a);return i>=n&&i<=r}(e.timestamp,i,n)));$(r),U(!0),A(!1)},closeDropdown:z}),H&&e(c,Object.assign({color:w.content.secondary,onClick:()=>A(!0)},{children:"Clear"}))]})),E?e("div",Object.assign({style:{padding:"0 24px"}},{children:e(D,{boxes:[{width:(x.mediaType==k.POST?148:104)+"px",height:(x.mediaType==k.POST?148:172)+"px"}]})})):e(a,{children:R&&R.length?e(s,Object.assign({mediaType:x.mediaType},{children:R.map((a=>{return t(l,Object.assign({mediaType:x.mediaType,className:""+(i=a,n=P,n.some((e=>e.id===i.id))?"selected":""),onClick:()=>{return e=a,void V((()=>P.find((t=>t.id===e.id))?P.filter((t=>t.id!==e.id)):!x.limit||P.length<x.limit?[...P,e]:(G(`Only ${x.limit} ${x.mediaType}s can be selected`),P)));var e}},{children:[e(T,{imageUrl:a.imageUrl,width:x.mediaType==k.POST?148:104,height:x.mediaType==k.POST?148:172,alt:a.overlayCaption}),t("div",Object.assign({className:"overlay"},{children:[e("a",Object.assign({target:"_blank",rel:"noreferrer",href:a.redirectionUrl},{children:t("div",Object.assign({className:"overlay__redirection"},{children:[e(v,{height:22,width:22}),e(p,Object.assign({color:j,style:{fontWeight:500}},{children:"View"}))]}))})),e("div",Object.assign({className:"overlay__caption"},{children:e(m,Object.assign({color:w.content.placeholder},{children:a.overlayCaption}))}))]}))]}),a.id);var i,n}))})):e("div",Object.assign({style:{justifyContent:"center",alignItems:"center",display:"flex",height:422}},{children:x.media.length?R.length?e(a,{}):t("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",gap:"16px"}},{children:[e("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",width:"48px",height:"48px",backgroundColor:`${w.background.inverse}`,borderRadius:"50%"}},{children:e(i,{color:w.content.primaryInverse})})),t("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:"8px"}},{children:[e(h,{children:"No results found"}),e(p,{children:"Sorry we could not find any results for the selected filter"})]})),e("div",Object.assign({onClick:()=>{A(!0)}},{children:e(y,Object.assign({color:`${w.content.brand}`},{children:"Clear Filter"}))}))]})):e(O,{states:S.WARNING,heading:`No ${x.mediaType}s on your account`,subline:`There seems to be no ${x.mediaType}s on your account`,isButtonEnabled:!1,width:400})}))})]}))}))};export{x as DateKeys,k as MEDIA_TYPES,I as PostPicker,B as dateOptions};
1
+ import{jsx as e,jsxs as t,Fragment as a}from"react/jsx-runtime";import{SearchIcon as i}from"../../assets/icons/searchIcon.js";import{useState as n,useRef as r,useEffect as o}from"react";import{StyledProductGrid as s,StyledProduct as l}from"./PostPicker.styled.js";import{Tag as d}from"../tag/Tag.js";import{ButtonRegular as c,BodyPrimary as p,BodyCaption as m,TitleMedium as h,ButtonLarge as y,BodySecondary as g}from"../TypographyStyle.js";import{unCamelCase as u}from"../../utils/unCamelCase.js";import{PRIMARY as j}from"../../constants/colors.js";import{COLORS as w}from"../../constants/Theme.js";import v from"../../assets/icons/instagram.svg.js";import f from"../../assets/icons/warning.svg.js";import"../tooltips/Tooltip.js";import"../analytics-chips-and-dropdowns/CommonStyles.js";import{AnalyticsDropdown as b}from"../analytics-chips-and-dropdowns/AnalyticsDropdown.js";import"../analytics-chips-and-dropdowns/AnalyticsMetric.js";import"../shimmer/ShimmerComponent/ShimmerStyled.js";import"../../utils/DateUtils.js";import"../analytics-chips-and-dropdowns/chart/LineChart/LineChart.js";import"react-bootstrap";import"../analytics-chips-and-dropdowns/chart/linearChipGroupedChart/LinearChipGroupedChart.styled.js";import"../analytics-chips-and-dropdowns/chart/Pie/PieChartAnalytics.js";import"../analytics-chips-and-dropdowns/chart/Pie/PieChart.js";import"../analytics-chips-and-dropdowns/chart/HorizontalBarGraph/HorizontalGraph.js";import"../analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js";import"../analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarDistributionChart.js";import"../analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarDistributionChart.model.js";import"../analytics-chips-and-dropdowns/chart/VerticalBarGraph/VerticalGraph.js";import"../analytics-chips-and-dropdowns/chart/heatmap/HeatMap.js";import"../analytics-chips-and-dropdowns/chart/heatmap/HeatMapVertical.js";import"../analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.js";import{StyledModal as C}from"../modals/styledModal.js";import{BikShimmer as D}from"../shimmer/ShimmerComponent/BikShimmer.js";import{ShimmerImage as T}from"../shimmer-image/ShimmerImage.js";import{StateComponent as O,StateInterface as S}from"../states/StateComponent.js";import"../../_virtual/_tslib.js";var k,x;!function(e){e.STORY="story",e.POST="post",e.REEL="reel"}(k||(k={})),function(e){e.Today="Today",e["7_Days"]="7",e["30_Days"]="30",e.custom="custom",e.Yesterday="Yesterday"}(x||(x={}));const B=[{label:"Today",value:"today",key:x.Today,typeValue:[new Date,new Date]},{label:"Last 7 days",value:"7 days",key:x["7_Days"],typeValue:[new Date((new Date).setDate((new Date).getDate()-6)),new Date]},{label:"Last 30 days",value:"30 days",key:x["30_Days"],typeValue:[new Date((new Date).setDate((new Date).getDate()-29)),new Date]},{label:"Custom range",value:"calender",key:x.custom,isCustom:!0,dateRangeSelectionOptions:{selectRange:!0,maxDate:new Date((new Date).setMonth((new Date).getMonth()+3))}}],I=x=>{var I,L;const[P,V]=n(null!==(I=x.previouslySelected)&&void 0!==I?I:[]),[_,G]=n(""),[E,N]=n(!1),[R,$]=n(x.media),[M,A]=n(!1),[H,U]=n(!1),[z,F]=n(!1),Y=r(null);o((()=>{x.media.length||(N(!0),setTimeout((()=>{N(!1)}),2e3)),V(x.selected||[])}),[]),o((()=>{x.media.length>0&&($(x.media),N(!1))}),[null===(L=null==x?void 0:x.media)||void 0===L?void 0:L.length]),o((()=>{P.length>0&&G("")}),[P.length]),o((()=>{M&&($(x.media),U(!1))}),[M]),o((()=>{const e=e=>{document.getElementById("analytic-dropdown").contains(e.target)||F(!z)},t=document.getElementById("post-picker");return t&&t.addEventListener("click",e),()=>{t&&t.removeEventListener("click",e)}}));return e("div",Object.assign({ref:Y},{children:t(C,Object.assign({zIndex:201,open:x.showModal,headingTitle:x.title,onClose:x.onClose,centralContainerStyles:{width:1071,height:x.showFilter?650:564},primaryButton:{disabled:!R.length,buttonType:"primary",buttonText:`Select ${u(x.mediaType)}`,onClick:()=>{P.length?x.onSelect(P):G(`Please select a ${x.mediaType} to proceed`)}},secondaryButton:{buttonType:"secondary",buttonText:"Back",onClick:()=>x.onClose()},footerLeftCustomElement:_?e(d,{tagText:_,type:"negative",LeadingIcon:f}):P.length?t(g,{children:[P.length," selected"]}):null,id:"post-picker"},{children:[x.showFilter&&t("div",Object.assign({style:{marginTop:24,marginBottom:24,padding:"0 24px",display:"flex",flexDirection:"row",gap:8,alignItems:"center"}},{children:[e(b,{options:B,placeholder:"posted on",resetDropdown:M,onOptionSelected:e=>{var t,a;let i=null,n=null;"Custom range"===e.label?(i=(null===(t=null==e?void 0:e.selectedRange)||void 0===t?void 0:t[0])||new Date,n=(null===(a=null==e?void 0:e.selectedRange)||void 0===a?void 0:a[1])||new Date):(i=e.typeValue[0],n=e.typeValue[1]);const r=x.media.filter((e=>function(e,t,a){const i=new Date(e),n=new Date(t),r=new Date(a);return i>=n&&i<=r}(e.timestamp,i,n)));$(r),U(!0),A(!1)},closeDropdown:z}),H&&e(c,Object.assign({color:w.content.secondary,onClick:()=>A(!0),style:{cursor:"pointer"}},{children:"Clear"}))]})),E?e("div",Object.assign({style:{padding:"0 24px"}},{children:e(D,{boxes:[{width:(x.mediaType==k.POST?148:104)+"px",height:(x.mediaType==k.POST?148:172)+"px"}]})})):e(a,{children:R&&R.length?e(s,Object.assign({mediaType:x.mediaType},{children:R.map((a=>{return t(l,Object.assign({mediaType:x.mediaType,className:""+(i=a,n=P,n.some((e=>e.id===i.id))?"selected":""),onClick:()=>{return e=a,void V((()=>P.find((t=>t.id===e.id))?P.filter((t=>t.id!==e.id)):!x.limit||P.length<x.limit?[...P,e]:(G(`Only ${x.limit} ${x.mediaType}s can be selected`),P)));var e}},{children:[e(T,{imageUrl:a.imageUrl,width:x.mediaType==k.POST?148:104,height:x.mediaType==k.POST?148:172,alt:a.overlayCaption}),t("div",Object.assign({className:"overlay"},{children:[e("a",Object.assign({target:"_blank",rel:"noreferrer",href:a.redirectionUrl},{children:t("div",Object.assign({className:"overlay__redirection"},{children:[e(v,{height:22,width:22}),e(p,Object.assign({color:j,style:{fontWeight:500}},{children:"View"}))]}))})),e("div",Object.assign({className:"overlay__caption"},{children:e(m,Object.assign({color:w.content.placeholder},{children:a.overlayCaption}))}))]}))]}),a.id);var i,n}))})):e("div",Object.assign({style:{justifyContent:"center",alignItems:"center",display:"flex",height:422}},{children:x.media.length?R.length?e(a,{}):t("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",gap:"16px"}},{children:[e("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",width:"48px",height:"48px",backgroundColor:`${w.background.inverse}`,borderRadius:"50%"}},{children:e(i,{color:w.content.primaryInverse})})),t("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:"8px"}},{children:[e(h,{children:"No results found"}),e(p,{children:"Sorry we could not find any results for the selected filter"})]})),e("div",Object.assign({onClick:()=>{A(!0)},style:{cursor:"pointer"}},{children:e(y,Object.assign({color:`${w.content.brand}`},{children:"Clear Filter"}))}))]})):e(O,{states:S.WARNING,heading:`No ${x.mediaType}s on your account`,subline:`There seems to be no ${x.mediaType}s on your account`,isButtonEnabled:!1,width:400})}))})]}))}))};export{x as DateKeys,k as MEDIA_TYPES,I as PostPicker,B as dateOptions};
@@ -7,5 +7,6 @@ export type RadioButtonProps = {
7
7
  onValueChange: (checked: boolean, value?: string) => void;
8
8
  skipHoverState?: boolean;
9
9
  size?: 'DEFAULT' | 'SMALL';
10
+ labelSize?: 'DEFAULT' | 'MEDIUM';
10
11
  };
11
12
  export declare const RadioButton: React.FC<RadioButtonProps>;
@@ -1 +1 @@
1
- import{jsxs as i,jsx as e}from"react/jsx-runtime";import{useState as s,useEffect as l}from"react";import{RadioButtonContainer as t,RadioButtonIcon as a}from"./RadioButton.styled.js";import{BodyPrimary as o,BodyCaption as r}from"../TypographyStyle.js";import{COLORS as c}from"../../constants/Theme.js";const n=s=>{const l=s.isDisabled?c.content.inactive:s.isActive?c.background.positive.vibrant:c.content.primary;return i("svg",Object.assign({width:s.isSmall?"16":"20",height:s.isSmall?"16":"20",viewBox:s.isSmall?"0 0 16 16":"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e("circle",{cx:s.isSmall?"8":"10",cy:s.isSmall?"8":"10",r:s.isSmall?6:9,stroke:l,strokeWidth:s.isSmall?1.5:2}),s.isActive&&e("circle",{cx:s.isSmall?"8":"10",cy:s.isSmall?"8":"10",r:s.isSmall?3:5,fill:s.isDisabled?c.content.inactive:c.background.positive.vibrant})]}))},d=d=>{const[m,b]=s(d.isActive||!1),[v,p]=s(!1),[S,h]=s(!1);return l((()=>{b(d.isActive)}),[d.isActive]),i(t,Object.assign({onClick:()=>{var i;if(!d.isDisabled){const e=!m;b(e),null===(i=d.onValueChange)||void 0===i||i.call(d,e,d.value)}},onMouseEnter:()=>p(!d.skipHoverState),onMouseLeave:()=>p(!1),onMouseDown:()=>h(!d.skipHoverState),onMouseUp:()=>h(!1)},{children:[e(a,Object.assign({checked:m,hovered:v,clicked:S,isDisabled:d.isDisabled||!1,size:d.size},{children:e(n,{isSmall:"SMALL"===d.size,isActive:m,isDisabled:d.isDisabled||!1})})),d.label&&"SMALL"!==d.size&&e(o,Object.assign({color:d.isDisabled?c.text.disabled:c.text.primary},{children:d.label})),d.label&&"SMALL"===d.size&&e(r,Object.assign({color:d.isDisabled?c.text.disabled:c.text.primary},{children:d.label}))]}))};export{d as RadioButton};
1
+ import{jsxs as i,jsx as e,Fragment as s}from"react/jsx-runtime";import{useState as l,useEffect as t}from"react";import{RadioButtonContainer as a,RadioButtonIcon as o}from"./RadioButton.styled.js";import{BodyCaption as r,BodySecondary as c,BodyPrimary as n}from"../TypographyStyle.js";import{COLORS as d}from"../../constants/Theme.js";const b=s=>{const l=s.isDisabled?d.content.inactive:s.isActive?d.background.positive.vibrant:d.content.primary;return i("svg",Object.assign({width:s.isSmall?"16":"20",height:s.isSmall?"16":"20",viewBox:s.isSmall?"0 0 16 16":"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e("circle",{cx:s.isSmall?"8":"10",cy:s.isSmall?"8":"10",r:s.isSmall?6:9,stroke:l,strokeWidth:s.isSmall?1.5:2}),s.isActive&&e("circle",{cx:s.isSmall?"8":"10",cy:s.isSmall?"8":"10",r:s.isSmall?3:5,fill:s.isDisabled?d.content.inactive:d.background.positive.vibrant})]}))},m=m=>{const[v,p]=l(m.isActive||!1),[S,h]=l(!1),[g,u]=l(!1);t((()=>{p(m.isActive)}),[m.isActive]);return i(a,Object.assign({onClick:()=>{var i;if(!m.isDisabled){const e=!v;p(e),null===(i=m.onValueChange)||void 0===i||i.call(m,e,m.value)}},onMouseEnter:()=>h(!m.skipHoverState),onMouseLeave:()=>h(!1),onMouseDown:()=>u(!m.skipHoverState),onMouseUp:()=>u(!1)},{children:[e(o,Object.assign({checked:v,hovered:S,clicked:g,isDisabled:m.isDisabled||!1,size:m.size},{children:e(b,{isSmall:"SMALL"===m.size,isActive:v,isDisabled:m.isDisabled||!1})})),m.label?"SMALL"===m.size?e(r,Object.assign({color:m.isDisabled?d.text.disabled:d.text.primary},{children:m.label})):"MEDIUM"===m.labelSize?e(c,Object.assign({color:m.isDisabled?d.text.disabled:d.text.primary},{children:m.label})):e(n,Object.assign({color:m.isDisabled?d.text.disabled:d.text.primary},{children:m.label})):e(s,{})]}))};export{m as RadioButton};
@@ -8,6 +8,7 @@ export type RadioListProps = {
8
8
  subTitle?: string;
9
9
  listItems: RadioListItem[];
10
10
  onChange: (option: RadioListItem) => void;
11
+ listContainerStyles?: React.CSSProperties;
11
12
  };
12
13
  export declare const RadioList: React.FC<RadioListProps>;
13
14
  export {};
@@ -1 +1 @@
1
- import{jsxs as t,jsx as e}from"react/jsx-runtime";import{useState as i,useEffect as s}from"react";import{RadioButton as o}from"../radioButton/RadioButton.js";import{RadioListStyled as r}from"./RadioList.styled.js";import{TitleRegular as n,BodySecondary as a}from"../TypographyStyle.js";import{COLORS as c}from"../../constants/Theme.js";const l=l=>{const[m,d]=i(l.listItems);s((()=>{d(l.listItems)}),[l.listItems]);const h=(t,e)=>{let i;const s=[...m];s.forEach((s=>{s.value===e?(i=s,s.isActive=t):s.isActive=!t})),d(s),l.onChange(i)};return t(r,{children:[(l.title||l.subTitle)&&t("div",Object.assign({className:"title__container"},{children:[l.title&&e(n,{children:l.title}),l.subTitle&&e(a,Object.assign({color:c.text.secondary},{children:l.subTitle}))]})),e("div",Object.assign({className:"list__container"},{children:m.map((t=>e(o,Object.assign({},t,{onValueChange:h}),t.value)))}))]})};export{l as RadioList};
1
+ import{jsxs as t,jsx as e}from"react/jsx-runtime";import{useState as i,useEffect as s}from"react";import{RadioButton as o}from"../radioButton/RadioButton.js";import{RadioListStyled as r}from"./RadioList.styled.js";import{TitleRegular as n,BodySecondary as l}from"../TypographyStyle.js";import{COLORS as a}from"../../constants/Theme.js";const c=c=>{var m;const[d,u]=i(c.listItems);s((()=>{u(c.listItems)}),[c.listItems]);const h=(t,e)=>{let i;const s=[...d];s.forEach((s=>{s.value===e?(i=s,s.isActive=t):s.isActive=!t})),u(s),c.onChange(i)};return t(r,{children:[(c.title||c.subTitle)&&t("div",Object.assign({className:"title__container"},{children:[c.title&&e(n,{children:c.title}),c.subTitle&&e(l,Object.assign({color:a.text.secondary},{children:c.subTitle}))]})),e("div",Object.assign({style:null!==(m=c.listContainerStyles)&&void 0!==m?m:{},className:"list__container"},{children:d.map((t=>e(o,Object.assign({},t,{onValueChange:h}),t.value)))}))]})};export{c as RadioList};
@@ -1 +1 @@
1
- import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as o,useEffect as r,useCallback as s}from"react";import{DEFAULT_THEME as n}from"../../constants/Theme.js";import{BodyCaption as a}from"../TypographyStyle.js";import{TabHeader as l,EmptyTab as i,RightComponent as c,TabItem as d,TabItemText as b,TrailingNumberContainer as m}from"./Tabs.styles.js";const p=s=>{var a,d;const{tabs:b,initialTab:m,onTabSelected:p,TabItemStyledProps:g,selectedTab:x,extendedBorder:T,rightComponent:y,size:C="default",isSquared:S=!1}=s,[h,j]=o(m||b[0].key),{colorsV2:f}=n;r((()=>{x&&j(x)}),[x]);const q=s.backgroundColor,k=null!==(a=s.selectedTextColor)&&void 0!==a?a:f.background.brand,I=null!==(d=s.textColor)&&void 0!==d?d:f.content.secondary;return e(l,Object.assign({bgColor:q},{children:[b.map(((e,o)=>t(u,{hasEqualSpacing:s.hasEqualSpacing,selectedTextColor:k,textColor:I,tab:e,currentTab:h,TabItemStyledProps:g,IconComponent:e.icon,size:C,setCurrentTab:e=>{p(e),j(e)},isSquared:S,isFirstlement:0==o,isLastElement:o==b.length-1},e.key))),T&&t(i,{}),t(c,{children:y})]}))},u=o=>{const{tab:r,currentTab:l,setCurrentTab:i,TabItemStyledProps:c,IconComponent:p,size:u="default",isSquared:g=!1,isFirstlement:x,isLastElement:T}=o,y=r.key===l,{colorsV2:C}=n,S=s((()=>Object.assign(Object.assign({},c),{borderRadius:o.isSquared?x?"4px 0px 0px 4px":T?"0px 4px 4px 0px":"":""})),[]);return e(d,Object.assign({style:S(),selected:y,hasEqualSpacing:o.hasEqualSpacing,onClick:()=>i(o.tab.key),selectedTextColor:o.selectedTextColor,isSquared:g},{children:[p&&t(p,{selected:y?C.background.brand:C.content.secondary}),t(b,Object.assign({style:"small"===u?{fontSize:14,fontStyle:"normal",fontWeight:600}:void 0,textColor:o.textColor,selectedTextColor:o.selectedTextColor,selected:y},{children:r.title})),void 0!==r.trailingNumber&&null!==r.trailingNumber&&t(m,Object.assign({selected:y},{children:t(a,Object.assign({color:C.content.primaryInverse},{children:r.trailingNumber}))}))]}))};p.displayName="Tabs",u.displayName="TabItemComponent";export{u as TabItemComponent,p as Tabs};
1
+ import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as o,useEffect as r,useCallback as s}from"react";import{DEFAULT_THEME as n}from"../../constants/Theme.js";import{BodyCaption as l}from"../TypographyStyle.js";import{TabHeader as a,EmptyTab as i,RightComponent as c,TabItem as d,TabItemText as b,TrailingNumberContainer as m}from"./Tabs.styles.js";const p=s=>{var l,d;const{tabs:b,initialTab:m,onTabSelected:p,TabItemStyledProps:g,selectedTab:x,extendedBorder:y,rightComponent:T,size:C="default",isSquared:S=!1,containerStyles:h}=s,[j,f]=o(m||b[0].key),{colorsV2:q}=n;r((()=>{x&&f(x)}),[x]);const k=s.backgroundColor,I=null!==(l=s.selectedTextColor)&&void 0!==l?l:q.background.brand,O=null!==(d=s.textColor)&&void 0!==d?d:q.content.secondary;return e(a,Object.assign({style:null!=h?h:{},bgColor:k},{children:[b.map(((e,o)=>t(u,{hasEqualSpacing:s.hasEqualSpacing,selectedTextColor:I,textColor:O,tab:e,currentTab:j,TabItemStyledProps:g,IconComponent:e.icon,size:C,setCurrentTab:e=>{p(e),f(e)},isSquared:S,isFirstlement:0==o,isLastElement:o==b.length-1},e.key))),y&&t(i,{}),t(c,{children:T})]}))},u=o=>{const{tab:r,currentTab:a,setCurrentTab:i,TabItemStyledProps:c,IconComponent:p,size:u="default",isSquared:g=!1,isFirstlement:x,isLastElement:y}=o,T=r.key===a,{colorsV2:C}=n,S=s((()=>Object.assign(Object.assign({},c),{borderRadius:o.isSquared?x?"4px 0px 0px 4px":y?"0px 4px 4px 0px":"":""})),[]);return e(d,Object.assign({style:S(),selected:T,hasEqualSpacing:o.hasEqualSpacing,onClick:()=>i(o.tab.key),selectedTextColor:o.selectedTextColor,isSquared:g},{children:[p&&t(p,{selected:T?C.background.brand:C.content.secondary}),t(b,Object.assign({style:"small"===u?{fontSize:14,fontStyle:"normal",fontWeight:600}:void 0,textColor:o.textColor,selectedTextColor:o.selectedTextColor,selected:T},{children:r.title})),void 0!==r.trailingNumber&&null!==r.trailingNumber&&t(m,Object.assign({selected:T},{children:t(l,Object.assign({color:C.content.primaryInverse},{children:r.trailingNumber}))}))]}))};p.displayName="Tabs",u.displayName="TabItemComponent";export{u as TabItemComponent,p as Tabs};
@@ -36,6 +36,7 @@ export interface TabViewHeaderProps {
36
36
  rightComponent?: JSX.Element;
37
37
  size?: 'small' | 'default';
38
38
  isSquared?: boolean;
39
+ containerStyles?: React.CSSProperties;
39
40
  }
40
41
  export interface TabItemComponentProps {
41
42
  hasEqualSpacing?: boolean;
@@ -46,7 +46,5 @@ export interface TemplateContextMapperProps {
46
46
  disableEditExpiry?: boolean;
47
47
  cardWidth?: number;
48
48
  onDeleteSelectedProducts?: () => void;
49
- fileName?: string;
50
- setFileName?: (name: string) => void;
51
49
  }
52
- export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList, discountCode, setDiscountCode, onBackPress, enabledCustomText, variableListForImage, showSampleValues, disableEditVariable, pod, extras, pickerConf, selectedCarouselProducts, disableEditExpiry, cardWidth, onDeleteSelectedProducts, fileName, setFileName, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;
50
+ export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList, discountCode, setDiscountCode, onBackPress, enabledCustomText, variableListForImage, showSampleValues, disableEditVariable, pod, extras, pickerConf, selectedCarouselProducts, disableEditExpiry, cardWidth, onDeleteSelectedProducts, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;
@@ -1 +1 @@
1
- import{jsx as e,jsxs as l,Fragment as o}from"react/jsx-runtime";import{useEffect as t,useState as i,useMemo as r}from"react";import a from"../../utils/StringUtils.js";import{StyledModal as n}from"../modals/styledModal.js";import{CHANNEL_TYPE as s}from"../template-preview/models/Channels.js";import{TemplateModalContext as d}from"./context/templateModalContext.js";import c from"./modalElements/Footer.js";import u from"./modalElements/TemplateSelectModalContent.js";import{convertPlaceholdersToBikDropdown as p}from"./utils/convertPlaceholdersToBikDropdown.js";import{validateInputName as m}from"./utils/validateName.js";const v=v=>{let{selectedTemplate:h,closeDialog:C,showVariableMapping:b,channel:g,htmlContent:f,templateVariables:x,onTemplateSelect:E,globalPlaceholders:P,showOnlyContent:S,whatsappSpecificPickerMeta:I,zIndex:T,showVariableModal:y,variableList:w,discountCode:M,setDiscountCode:j,onBackPress:L,enabledCustomText:V,variableListForImage:A,showSampleValues:D,disableEditVariable:k,pod:F,extras:N,pickerConf:O,selectedCarouselProducts:W,disableEditExpiry:H,cardWidth:z,onDeleteSelectedProducts:B,fileName:R,setFileName:U}=v;var $,_,q,G,J,K;t((()=>{le(f)}),[f]);const Q=g===s.WHATSAPP&&"CAROUSEL"===(null===(_=null===($=null==h?void 0:h.components)||void 0===$?void 0:$[1])||void 0===_?void 0:_.type),X=null==h?void 0:h.isProductCarouselType,[Y,Z]=i(g===s.EMAIL||Q?"desktop":"mobile"),[ee,le]=i(f),[oe,te]=i(!1),[ie,re]=i([]),[ae,ne]=i(h),[se,de]=i([]),[ce,ue]=i(!1),[pe,me]=i(null!=x?x:[]),[ve,he]=i(!1),[Ce,be]=i(-1),[ge,fe]=i([]),[xe,Ee]=i(R);t((()=>{W?fe(W):X&&fe([])}),[W]),t((()=>{var e;if(!ce&&X&&(!W||0===fe.length)){const l=null===(e=null==ae?void 0:ae.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:"")}))})),de(o),ue(!0)}}),[ce]);const Pe=r((()=>p(P)),[P]);return e(d.Provider,Object.assign({value:{template:ae,setTemplate:ne,device:Y,setDevice:Z,display_content:ee,setDisplayContent:le,originalVariableList:pe,setOriginalVariableList:me,isError:oe,setIsError:te,channel:g,globalNormalizedPlaceholders:Pe,templateSelectionTriggered:ve,setTemplateSelectionTriggered:he,enabledCustomText:V,disableEditVariable:k,pod:F,extras:N,isWhatsappCarousel:Q,selectedCarouselIndex:Ce,setSelectedCarouselIndex:be,isProductCarouselType:X,cardCount:Q?null===(G=null===(q=h.components)||void 0===q?void 0:q[1].cards)||void 0===G?void 0:G.length:void 0,errorIndexes:ie,setErrorIndexes:re,pickerConf:O,carouselProducts:ge,setCarouselProducts:fe,disableEditExpiry:H,cardWidth:z,cardImages:se,onDeleteSelectedProducts:B}},{children:S?e(u,{channel:s.EMAIL,hideHeader:!0}):l(n,Object.assign({zIndex:T,centralContainerStyles:{width:Q?900:g===s.EMAIL&&b?1e3:800},open:!0,onClose:()=>{null==C||C()},headingTitle:null==ae?void 0:ae.label,headingSubtitle:g===s.WHATSAPP?`${a.capitaliseFirstLetterOfString(null!==(J=null==ae?void 0:ae.category)&&void 0!==J?J:"")} • ${null!==(K=null==ae?void 0:ae.templateCategory)&&void 0!==K?K:""}`:"",onBackPress:()=>{null==L||L()}},{children:[e(u,{showSampleValues:D,showVariableMapping:b,channel:g,whatsappSpecificPickerMeta:I,showVariableModal:y,variableList:w,discountCode:M,setDiscountCode:j,variableListForImage:A&&(null==A?void 0:A.length)>0?A:w,fileName:R,setFileName:e=>{null==U||U(e),Ee(e)}}),E?e(c,{isWhatsappCarousel:null!=Q&&Q,onSelect:function(){if((null==ge?void 0:ge.length)<1&&X)return void te(!0);if(!xe)return void te(!0);if(!xe||m(xe))return void te(!0);const e=null==E?void 0:E(ae,pe,null!=ee?ee:"",ge);(null==e?void 0:e.errorIndexes)||(null==e?void 0:e.error)?((null==e?void 0:e.errorIndexes)&&re(e.errorIndexes),(null==e?void 0:e.error)&&te(!!(null==e?void 0:e.error))):he(!0)}}):e(o,{})]}))}))};export{v as TemplateContextMapper};
1
+ import{jsx as e,jsxs as l,Fragment as o}from"react/jsx-runtime";import{useEffect as t,useState as r,useMemo as i}from"react";import a from"../../utils/StringUtils.js";import{StyledModal as n}from"../modals/styledModal.js";import{CHANNEL_TYPE as s}from"../template-preview/models/Channels.js";import{TemplateModalContext as d}from"./context/templateModalContext.js";import c from"./modalElements/Footer.js";import u from"./modalElements/TemplateSelectModalContent.js";import{convertPlaceholdersToBikDropdown as p}from"./utils/convertPlaceholdersToBikDropdown.js";const m=m=>{let{selectedTemplate:v,closeDialog:h,showVariableMapping:C,channel:b,htmlContent:g,templateVariables:x,onTemplateSelect:f,globalPlaceholders:E,showOnlyContent:P,whatsappSpecificPickerMeta:S,zIndex:I,showVariableModal:T,variableList:y,discountCode:w,setDiscountCode:M,onBackPress:L,enabledCustomText:V,variableListForImage:j,showSampleValues:A,disableEditVariable:D,pod:k,extras:O,pickerConf:W,selectedCarouselProducts:F,disableEditExpiry:H,cardWidth:z,onDeleteSelectedProducts:B}=m;var R,U,$,_,N,q;t((()=>{Y(g)}),[g]);const G=b===s.WHATSAPP&&"CAROUSEL"===(null===(U=null===(R=null==v?void 0:v.components)||void 0===R?void 0:R[1])||void 0===U?void 0:U.type),J=null==v?void 0:v.isProductCarouselType,[K,Q]=r(b===s.EMAIL||G?"desktop":"mobile"),[X,Y]=r(g),[Z,ee]=r(!1),[le,oe]=r([]),[te,re]=r(v),[ie,ae]=r([]),[ne,se]=r(!1),[de,ce]=r(null!=x?x:[]),[ue,pe]=r(!1),[me,ve]=r(-1),[he,Ce]=r([]);t((()=>{F?Ce(F):J&&Ce([])}),[F]),t((()=>{var e;if(!ne&&J&&(!F||0===Ce.length)){const l=null===(e=null==te?void 0:te.components)||void 0===e?void 0:e[1].cards,o=[];null==l||l.forEach((e=>{var l;null===(l=null==e?void 0:e.components)||void 0===l||l.forEach((e=>{var l,t,r;"HEADER"===e.type&&o.push(null!==(r=null===(t=null===(l=e.example)||void 0===l?void 0:l.header_handle)||void 0===t?void 0:t[0])&&void 0!==r?r:"")}))})),ae(o),se(!0)}}),[ne]);const be=i((()=>p(E)),[E]);return e(d.Provider,Object.assign({value:{template:te,setTemplate:re,device:K,setDevice:Q,display_content:X,setDisplayContent:Y,originalVariableList:de,setOriginalVariableList:ce,isError:Z,setIsError:ee,channel:b,globalNormalizedPlaceholders:be,templateSelectionTriggered:ue,setTemplateSelectionTriggered:pe,enabledCustomText:V,disableEditVariable:D,pod:k,extras:O,isWhatsappCarousel:G,selectedCarouselIndex:me,setSelectedCarouselIndex:ve,isProductCarouselType:J,cardCount:G?null===(_=null===($=v.components)||void 0===$?void 0:$[1].cards)||void 0===_?void 0:_.length:void 0,errorIndexes:le,setErrorIndexes:oe,pickerConf:W,carouselProducts:he,setCarouselProducts:Ce,disableEditExpiry:H,cardWidth:z,cardImages:ie,onDeleteSelectedProducts:B}},{children:P?e(u,{channel:s.EMAIL,hideHeader:!0}):l(n,Object.assign({zIndex:I,centralContainerStyles:{width:G?900:b===s.EMAIL&&C?1e3:800},open:!0,onClose:()=>{null==h||h()},headingTitle:null==te?void 0:te.label,headingSubtitle:b===s.WHATSAPP?`${a.capitaliseFirstLetterOfString(null!==(N=null==te?void 0:te.category)&&void 0!==N?N:"")} • ${null!==(q=null==te?void 0:te.templateCategory)&&void 0!==q?q:""}`:"",onBackPress:()=>{null==L||L()}},{children:[e(u,{showSampleValues:A,showVariableMapping:C,channel:b,whatsappSpecificPickerMeta:S,showVariableModal:T,variableList:y,discountCode:w,setDiscountCode:M,variableListForImage:j&&(null==j?void 0:j.length)>0?j:y}),f?e(c,{isWhatsappCarousel:null!=G&&G,onSelect:function(){if((null==he?void 0:he.length)<1&&J)return void ee(!0);const e=null==f?void 0:f(te,de,null!=X?X:"",he);(null==e?void 0:e.errorIndexes)||(null==e?void 0:e.error)?((null==e?void 0:e.errorIndexes)&&oe(e.errorIndexes),(null==e?void 0:e.error)&&ee(!!(null==e?void 0:e.error))):pe(!0)}}):e(o,{})]}))}))};export{m as TemplateContextMapper};
@@ -10,8 +10,6 @@ export interface BodyProps {
10
10
  discountCode?: string;
11
11
  setDiscountCode?: (code: string) => void;
12
12
  showSampleValues?: boolean;
13
- fileName?: string;
14
- setFileName?: (name: string) => void;
15
13
  }
16
14
  declare const Body: (props: BodyProps) => import("react/jsx-runtime").JSX.Element;
17
15
  export default Body;
@@ -1,4 +1,4 @@
1
- import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import{useRef as a}from"react";import i from"styled-components";import{CarouselPreview as l}from"../../carousel-preview/CarouselPreview.js";import s from"./EditWhatsAppCarouselTemplateV2.js";import{CHANNEL_TYPE as n}from"../../template-preview/models/Channels.js";import{COLORS as r}from"../../../constants/Theme.js";import{useTemplateModalContext as p}from"../context/templateModalContext.js";import{getVariableNameForEmailByIndex as m}from"../utils/getVariableNameEmail.js";import{highlightFor as d}from"../utils/highlightFor.js";import c from"./DesktopPreview.js";import u from"./EditWhatsAppTemplateV2.js";import h from"./MobilePreview.js";import f from"./VariableConnectorsPanel.js";const v=i.div`
1
+ import{jsxs as e,jsx as o,Fragment as t}from"react/jsx-runtime";import{useRef as a}from"react";import i from"styled-components";import{CarouselPreview as l}from"../../carousel-preview/CarouselPreview.js";import s from"./EditWhatsAppCarouselTemplateV2.js";import{CHANNEL_TYPE as n}from"../../template-preview/models/Channels.js";import{COLORS as r}from"../../../constants/Theme.js";import{useTemplateModalContext as p}from"../context/templateModalContext.js";import{getVariableNameForEmailByIndex as d}from"../utils/getVariableNameEmail.js";import{highlightFor as m}from"../utils/highlightFor.js";import c from"./DesktopPreview.js";import u from"./EditWhatsAppTemplateV2.js";import h from"./MobilePreview.js";import f from"./VariableConnectorsPanel.js";const v=i.div`
2
2
  display: flex;
3
3
  // height: 100%;
4
4
  `,w=i.div`
@@ -15,4 +15,4 @@ import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import{useRef as
15
15
  flex: 1;
16
16
  height: ${e=>e.isWhatsappCarousel?"500px":"475px"};
17
17
  overflow-y: auto;
18
- `,g=i=>{const{showVariableMapping:g,showOnlyContent:C,whatsappSpecificPickerMeta:x,showVariableModal:P,variableList:y,discountCode:W,setDiscountCode:j,variableListForImage:M,showSampleValues:V,fileName:A,setFileName:S}=i,T=a(),k=a(),{device:E,display_content:L,channel:I,template:F,setTemplate:_,isWhatsappCarousel:$,isProductCarouselType:D}=p();const N=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e(v,{children:[t(b,Object.assign({showOnlyContent:C,showVariableMapping:g,isWhatsappCarousel:$},{children:"mobile"===E?t(h,{ref:k,display_content:null!=L?L:"",channel:I,template:F,showSampleValues:V}):I===n.WHATSAPP&&$?t(l,{ref:T,channel:I,template:F,showSampleValues:V,isPreview:!1}):I!==n.MESSAGE?t(c,{ref:T,channel:I,display_content:null!=L?L:"",showSampleValues:V}):t(o,{})})),(D||g)&&t(w,Object.assign({channel:I,isWhatsappCarousel:$},{children:I!==n.WHATSAPP?t(f,{onFocus:I===n.EMAIL?function(e){var t,o,a;const i=null===document||void 0===document?void 0:document.getElementById("mobile"===E?"template_html_mobile":"template_html_desktop"),l=m(e+1),s=I===n.EMAIL?null===(t=null==i?void 0:i.contentWindow)||void 0===t?void 0:t.document.getElementById(l):document.getElementById(l),p=N(s),c=null==s?void 0:s.offsetLeft;"desktop"===E?p&&T.current&&(null===(o=null==i?void 0:i.contentWindow)||void 0===o||o.scrollTo(null!=c?c:0,p),d(l,r.background.warning.light,2,I,E)):p&&k.current&&(null===(a=null==i?void 0:i.contentWindow)||void 0===a||a.scrollTo(null!=c?c:0,p),d(l,r.background.warning.light,2,I,E))}:void 0,showVariableModal:P,variableList:y,discountCode:W,setDiscountCode:j}):I===n.WHATSAPP&&$?t(s,{whatsappSpecificPickerMeta:x,template:F,showVariableModal:P,variableList:y,variableListForImage:M,discountCode:W,setDiscountCode:j}):t(u,{whatsappSpecificPickerMeta:x,template:F,onTemplateChange:e=>{null==_||_(e)},showVariableModal:P,variableList:y,variableListForImage:M,discountCode:W,setDiscountCode:j,fileName:A,setFileName:S})}))]})};export{g as default};
18
+ `,g=i=>{const{showVariableMapping:g,showOnlyContent:C,whatsappSpecificPickerMeta:x,showVariableModal:P,variableList:y,discountCode:W,setDiscountCode:j,variableListForImage:M,showSampleValues:V}=i,A=a(),S=a(),{device:T,display_content:k,channel:E,template:L,setTemplate:I,isWhatsappCarousel:_,isProductCarouselType:$}=p();const D=e=>{let o=0;for(;e;)o+=e.offsetTop,e=e.offsetParent;return o};return e(v,{children:[o(b,Object.assign({showOnlyContent:C,showVariableMapping:g,isWhatsappCarousel:_},{children:"mobile"===T?o(h,{ref:S,display_content:null!=k?k:"",channel:E,template:L,showSampleValues:V}):E===n.WHATSAPP&&_?o(l,{ref:A,channel:E,template:L,showSampleValues:V,isPreview:!1}):E!==n.MESSAGE?o(c,{ref:A,channel:E,display_content:null!=k?k:"",showSampleValues:V}):o(t,{})})),($||g)&&o(w,Object.assign({channel:E,isWhatsappCarousel:_},{children:E!==n.WHATSAPP?o(f,{onFocus:E===n.EMAIL?function(e){var o,t,a;const i=null===document||void 0===document?void 0:document.getElementById("mobile"===T?"template_html_mobile":"template_html_desktop"),l=d(e+1),s=E===n.EMAIL?null===(o=null==i?void 0:i.contentWindow)||void 0===o?void 0:o.document.getElementById(l):document.getElementById(l),p=D(s),c=null==s?void 0:s.offsetLeft;"desktop"===T?p&&A.current&&(null===(t=null==i?void 0:i.contentWindow)||void 0===t||t.scrollTo(null!=c?c:0,p),m(l,r.background.warning.light,2,E,T)):p&&S.current&&(null===(a=null==i?void 0:i.contentWindow)||void 0===a||a.scrollTo(null!=c?c:0,p),m(l,r.background.warning.light,2,E,T))}:void 0,showVariableModal:P,variableList:y,discountCode:W,setDiscountCode:j}):E===n.WHATSAPP&&_?o(s,{whatsappSpecificPickerMeta:x,template:L,showVariableModal:P,variableList:y,variableListForImage:M,discountCode:W,setDiscountCode:j}):o(u,{whatsappSpecificPickerMeta:x,template:L,onTemplateChange:e=>{null==I||I(e)},showVariableModal:P,variableList:y,variableListForImage:M,discountCode:W,setDiscountCode:j})}))]})};export{g as default};
@@ -12,8 +12,6 @@ export interface EditWhatsAppTemplateV2Props {
12
12
  variableListForImage?: VariableListInterfaceV2[];
13
13
  discountCode?: string;
14
14
  setDiscountCode?: (code: string) => void;
15
- fileName?: string;
16
- setFileName?: (name: string) => void;
17
15
  }
18
- declare const EditWhatsAppTemplateV2: ({ template, onTemplateChange, whatsappSpecificPickerMeta, showVariableModal, variableList, variableListForImage, discountCode, setDiscountCode, fileName, setFileName, }: EditWhatsAppTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
16
+ declare const EditWhatsAppTemplateV2: ({ template, onTemplateChange, whatsappSpecificPickerMeta, showVariableModal, variableList, variableListForImage, discountCode, setDiscountCode, }: EditWhatsAppTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
19
17
  export default EditWhatsAppTemplateV2;
@@ -1,7 +1 @@
1
- import{jsxs as n,jsx as o,Fragment as t}from"react/jsx-runtime";import{cloneDeep as e}from"lodash";import{useState as i,useEffect as l}from"react";import s from"styled-components";import{Input as a}from"../../input/Input.js";import{HEADER_TYPES as d}from"../../template-preview/models/TemplateMeta.js";import{POD as r}from"../../template-preview/models/WhatsAppTemplate.js";import{useTemplateModalContext as p}from"../context/templateModalContext.js";import{getAllDataFromTemplateComponent as c}from"../utils/getDataFromTemplateComponent.js";import{validateInputName as u}from"../utils/validateName.js";import{BackTrackComponent as m}from"./BackTrackComponent.js";import{DiscountCodeComponent as v}from"./DiscountCodeComponent.js";import{EditTemplateMediaContainer as b}from"./EditMediaV2.style.js";import g from"./EditWhatsAppTemplateMediaV2.js";import f from"./VariableConnector.js";import{Container as h}from"./VariableConnectorsPanel.js";import j from"./VariableConnectorWhatsApp.js";import O from"./VariableEditorHeader.js";import C from"./WhatsAppTemplateCardButtonV2.js";const T=s=>{let{template:T,onTemplateChange:y,whatsappSpecificPickerMeta:V,showVariableModal:B,variableList:E,variableListForImage:k,discountCode:L,setDiscountCode:U,fileName:I,setFileName:w}=s;var R,P,N,A,M,S,D,H,_,Q,q,Y,F,K,W,$,X,z,G,J,Z;const nn=T.isCarouselType,{originalVariableList:on,pod:tn,extras:en,selectedCarouselIndex:ln,isProductCarouselType:sn}=p(),{descriptionComponents:an,urlBtns:dn,qrbBtns:rn,imageComponent:pn,bodyVariables:cn,headerVariables:un}=c(T),[mn,vn]=i(!1),[bn,gn]=i(-1===ln?{descriptionComponents:an,urlBtns:dn,qrbBtns:rn,imageComponent:pn,bodyVariables:cn,headerVariables:un}:{}),[fn,hn]=i(!1),[jn,On]=i(I),[Cn,Tn]=i();function xn(n,o,t){var i,l,s,a,d,r,p,c,u,m;const v=null!=ln&&ln>-1?{components:null===(i=Object.assign({},T).components[1].cards)||void 0===i?void 0:i[ln].components,mapping:null===(l=Object.assign({},T).mapping.cards)||void 0===l?void 0:l[ln]}:Object.assign({},T),b=e(v),g="custom"===o&&"string"==typeof n,f=g?n:"string"!=typeof n?n.defaultValue?n.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=ln&&ln>-1&&sn){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,e,i;if("BUTTONS"===n.type){const l=null===(o=n.buttons)||void 0===o?void 0:o.filter((n=>"URL"===n.type));let s=null!==(e=null==l?void 0:l[t])&&void 0!==e?e:{};s=Object.assign(Object.assign({},s),{url:"https://d.bik.ai/{{1}}",example:[f]});const a=null===(i=n.buttons)||void 0===i?void 0:i.map((n=>"URL"===n.type&&(null==n?void 0:n.text)===(null==s?void 0:s.text)?s:n));return Object.assign(Object.assign({},n),{buttons:a})}return n}))})))}):n})),i=null===(a=null===(s=Object.assign({},T).mapping)||void 0===s?void 0:s.cards)||void 0===a?void 0:a.map((o=>{var t;return Object.assign(Object.assign({},o),{buttons:null===(t=null==o?void 0:o.buttons)||void 0===t?void 0:t.map((o=>g?"((customBtnPlaceholder))":"string"!=typeof n?n.placeHolder:""))})})),l=e(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((n=>"BUTTONS"===n.type));if(void 0!==h&&h>-1){const e=null===(d=null==b?void 0:b.components[h].buttons)||void 0===d?void 0:d.filter((n=>"URL"===n.type));if((null==e?void 0:e.length)>0){const i="custom"===o&&"string"==typeof n,l=i?n:"string"!=typeof n&&n.defaultValue?n.defaultValue:"https://d.bik.ai/";let s=e[t];s=Object.assign(Object.assign({},s),{url:"https://d.bik.ai/{{1}}",example:[l]});const a=[...null!==(c=null===(p=null===(r=b.components)||void 0===r?void 0:r[h])||void 0===p?void 0:p.buttons)&&void 0!==c?c:[]].map((n=>"URL"===n.type&&(null==n?void 0:n.text)===(null==s?void 0:s.text)?s:n)),d=Object.assign(Object.assign({},b.components[h]),{buttons:a}),m=null===(u=b.mapping)||void 0===u?void 0:u.buttons;m&&m.length>0&&(m[t]=i?"((customBtnPlaceholder))":"string"!=typeof n?n.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 n){"checkout.checkoutUrl"===(null===(m=n.placeHolder)||void 0===m?void 0:m.slice(2,-2))?vn(!0):(vn(!1),null==U||U(""))}if(null!=ln&&ln>-1){const n=e(T);n.components[1].cards[ln].components=b.components,n.mapping.cards[ln]=b.mapping,null==y||y(Object.assign({},n))}else null==y||y(b)}function yn(n,o,t){var i,l,s,a,d,r;const p=null!=ln&&ln>-1?{components:null===(i=Object.assign({},T).components[1].cards)||void 0===i?void 0:i[ln].components,mapping:null===(l=Object.assign({},T).mapping.cards)||void 0===l?void 0:l[ln]}:Object.assign({},T);if(null!=ln&&ln>-1&&sn){const o=Object.assign({},T).components.map((o=>{var e;return"CAROUSEL"===o.type?Object.assign(Object.assign({},o),{cards:null===(e=o.cards)||void 0===e?void 0:e.map((o=>Object.assign(Object.assign({},o),{components:o.components.map((o=>{var e,i,l;if("BUTTONS"===o.type){const s=null===(e=o.buttons)||void 0===e?void 0:e.filter((n=>"QUICK_REPLY"===n.type));let a=null!==(i=null==s?void 0:s[t])&&void 0!==i?i:{};a=Object.assign(Object.assign({},a),{flowId:n.flowId,flowName:n.flowName});const d=null===(l=o.buttons)||void 0===l?void 0:l.map((n=>"QUICK_REPLY"===n.type&&(null==n?void 0:n.text)===(null==a?void 0:a.text)?a:n));return Object.assign(Object.assign({},o),{buttons:d})}return o}))})))}):o})),i=e(T);return i.components=o,void(null==y||y(Object.assign({},i)))}const c=null==p?void 0:p.components.findIndex((n=>"BUTTONS"===n.type));if(void 0!==c&&c>-1){const o=null===(s=null==p?void 0:p.components[c].buttons)||void 0===s?void 0:s.filter((n=>"QUICK_REPLY"===n.type));if(o){let e=o[t];e=Object.assign(Object.assign({},e),{flowId:n.flowId,flowName:n.flowName});const i=[...null!==(r=null===(d=null===(a=p.components)||void 0===a?void 0:a[c])||void 0===d?void 0:d.buttons)&&void 0!==r?r:[]].map((n=>"QUICK_REPLY"===n.type&&(null==n?void 0:n.text)===(null==e?void 0:e.text)?e:n)),l=Object.assign(Object.assign({},p.components[c]),{buttons:i}),s=[...p.components];s[c]=l,p.components=s}}if(null!=ln&&ln>-1){const n=e(T);n.components[1].cards[ln].components=p.components,null==y||y(Object.assign({},n))}else null==y||y(p)}l((()=>{var n,o;if(null===(n=T.mapping.buttons)||void 0===n?void 0:n.find((n=>"checkout.checkoutUrl"===n.slice(2,-2))))vn(!0);else{vn(!1);const n=null===(o=null==en?void 0:en.discountCodeExtra)||void 0===o?void 0:o[1];null==n||n("")}}),[T]),l((()=>{var n,o,t,e;if(null!=ln&&ln>-1){const i={components:null===(o=null===(n=T.components[1])||void 0===n?void 0:n.cards)||void 0===o?void 0:o[ln].components,mapping:null===(e=null===(t=null==T?void 0:T.mapping)||void 0===t?void 0:t.cards)||void 0===e?void 0:e[ln]},{descriptionComponents:l,urlBtns:s,qrbBtns:a,imageComponent:d,bodyVariables:r,headerVariables:p}=c(i);gn({descriptionComponents:l,urlBtns:s,qrbBtns:a,imageComponent:d,bodyVariables:r,headerVariables:p})}else if(null!=ln&&-1===ln){const{descriptionComponents:n,urlBtns:o,qrbBtns:t,imageComponent:e,bodyVariables:i,headerVariables:l}=c(T);gn({descriptionComponents:n,urlBtns:o,qrbBtns:t,imageComponent:e,bodyVariables:i,headerVariables:l})}}),[ln]),l((()=>{var n,o,t,e;if(null!=ln&&ln>-1&&fn){const i={components:null===(o=null===(n=T.components[1])||void 0===n?void 0:n.cards)||void 0===o?void 0:o[ln].components,mapping:null===(e=null===(t=null==T?void 0:T.mapping)||void 0===t?void 0:t.cards)||void 0===e?void 0:e[ln]},{descriptionComponents:l,urlBtns:s,qrbBtns:a,imageComponent:d,bodyVariables:r,headerVariables:p}=c(i);gn({descriptionComponents:l,urlBtns:s,qrbBtns:a,imageComponent:d,bodyVariables:r,headerVariables:p}),hn(!1)}}),[fn]);return n(h,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:[!!bn.imageComponent&&!sn&&n(b,{children:[o(g,{whatsappSpecificPickerMeta:V,mediaComponent:nn?bn.imageComponent:pn,updateTemplateImageUrl:function(n,o){var t,i,l,s,a,d,r,p;let c;c=null!=ln&&ln>-1?{components:null===(i=null===(t=T.components[1])||void 0===t?void 0:t.cards)||void 0===i?void 0:i[ln].components,mapping:null===(s=null===(l=null==T?void 0:T.mapping)||void 0===l?void 0:l.cards)||void 0===s?void 0:s[ln]}:Object.assign({},T);const u=null===(a=null==c?void 0:c.components)||void 0===a?void 0:a.findIndex((n=>{if("HEADER"===n.type&&"NONE"!==n.format&&"TEXT"!==n.format)return!0}));if(void 0!==u&&u>-1&&(null==c?void 0:c.components[u])){const t=Object.assign(Object.assign({},c.components[u]),{format:o,example:{header_handle:[n]}}),e=[...c.components];e[u]=t,c=Object.assign(Object.assign({},c),{components:e})}if(c.mapping&&(c.mapping=Object.assign(Object.assign({},c.mapping),{header:void 0})),null!=ln&&ln>-1){const n=e(T);n.components[1].cards[ln].components=c.components,(null===(d=null==n?void 0:n.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==n?void 0:n.mapping)||void 0===r?void 0:r.cards.length)>0&&(n.mapping.cards[ln]=null!==(p=c.mapping)&&void 0!==p?p:{}),null==y||y(Object.assign({},n)),hn(!0)}else null==y||y(Object.assign({},c))},template:T,variableListForImage:k}),(null==pn?void 0:pn.format)==d.DOCUMENT?o(x,{children:o(a,{labelText:"PDF Name",placeholder:"Enter the name",value:jn,errorMessage:Cn||void 0,onBlur:()=>{if(!jn)return null==w||w(""),void Tn("PDF name is Required");const n=u(jn);null==w||w(jn),Tn(n?"Please enter a valid PDF name":void 0)},onChangeText:n=>{Tn(""),On(n)}})}):o(t,{})]}),bn.bodyVariables.length>0&&o(O,{containerStyle:{paddingTop:bn.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===(R=bn.descriptionComponents)||void 0===R?void 0:R.map(((n,t)=>o(j,{originalVariableList:null!=ln&&ln>-1?on.cards[ln]:on,type:n.type,descriptionComponent:n.component,showVariableModal:B,variableList:E},t))),(null===(N=null===(P=null!=ln&&ln>-1?on.cards[ln].buttons:null==on?void 0:on.buttons)||void 0===P?void 0:P.filter((n=>"URL"===n.type)))||void 0===N?void 0:N.length)>0&&o(O,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(M=null===(A=null!=ln&&ln>-1?on.cards[ln].buttons:null==on?void 0:on.buttons)||void 0===A?void 0:A.filter((n=>tn===r.CHATBOT||"URL"===n.type)))||void 0===M?void 0:M.map(((n,t)=>{if("URL"===n.type)return o(C,{variableListIndex:t,CTAoptions:null==V?void 0:V.CTAoptions,button:n,currentVariableList:null!=ln&&ln>-1?Object.assign({},on.cards[ln]):Object.assign({},on),updateSelectedURLTemplateBtn:xn,variableList:E},`${t}_${ln}`)})),tn===r.CHATBOT&&(null===(D=null===(S=rn[0])||void 0===S?void 0:S.component)||void 0===D?void 0:D.buttons)&&(null===(Q=null===(_=null===(H=rn[0])||void 0===H?void 0:H.component)||void 0===_?void 0:_.buttons)||void 0===Q?void 0:Q.length)>0&&o(m,{backTrackMessage:null===(q=null==en?void 0:en.backTrackExtra)||void 0===q?void 0:q[0],setBackTrackMessage:null===(Y=null==en?void 0:en.backTrackExtra)||void 0===Y?void 0:Y[1]}),(null===(K=null===(F=null!=ln&&ln>-1?on.cards[ln].buttons:null==on?void 0:on.buttons)||void 0===F?void 0:F.filter((n=>"QUICK_REPLY"===n.type)))||void 0===K?void 0:K.length)>0&&(tn!==r.CHATBOT?o(O,{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(m,{backTrackMessage:null===(W=null==en?void 0:en.backTrackExtra)||void 0===W?void 0:W[0],setBackTrackMessage:null===($=null==en?void 0:en.backTrackExtra)||void 0===$?void 0:$[1]})),null===(z=null===(X=null!=ln&&ln>-1?on.cards[ln].buttons:null==on?void 0:on.buttons)||void 0===X?void 0:X.filter((n=>"QUICK_REPLY"===n.type)))||void 0===z?void 0:z.map(((n,t)=>{if("QUICK_REPLY"===n.type&&tn!==r.CHATBOT)return o(C,{variableListIndex:t,QRBoptions:null==V?void 0:V.QRBoptions,button:n,currentVariableList:null!=ln&&ln>-1?Object.assign({},on.cards[ln]):Object.assign({},on),updateSelectedQRBTemplateBtn:yn},`${t}_${ln}`)})),tn===r.CHATBOT&&mn&&o(v,{discountCode:null===(G=null==en?void 0:en.discountCodeExtra)||void 0===G?void 0:G[0],setDiscountCode:null===(J=null==en?void 0:en.discountCodeExtra)||void 0===J?void 0:J[1],variableList:E}),null===(Z=null!=ln&&ln>-1?on.cards[ln].buttons:null==on?void 0:on.buttons)||void 0===Z?void 0:Z.map(((n,t)=>{var e,i,l;if("COPY_CODE"===n.type)return o(f,{index:t,variable:{variableName:null!==(e=n.text)&&void 0!==e?e:"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,variableList:E,componentType:"BUTTONS"},t)}))]}))},x=s.div`
2
- padding-top: 24px;
3
- padding-left: 10px;
4
- padding-right: 10px;
5
- margin-bottom: 8px;
6
- line-height: normal;
7
- `;export{T as default};
1
+ import{jsxs as n,jsx as o}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import{useState as e,useEffect as i}from"react";import{POD as l}from"../../template-preview/models/WhatsAppTemplate.js";import{useTemplateModalContext as s}from"../context/templateModalContext.js";import{getAllDataFromTemplateComponent as a}from"../utils/getDataFromTemplateComponent.js";import{BackTrackComponent as d}from"./BackTrackComponent.js";import{DiscountCodeComponent as r}from"./DiscountCodeComponent.js";import{EditTemplateMediaContainer as p}from"./EditMediaV2.style.js";import c from"./EditWhatsAppTemplateMediaV2.js";import u from"./VariableConnector.js";import{Container as m}from"./VariableConnectorsPanel.js";import v from"./VariableConnectorWhatsApp.js";import b from"./VariableEditorHeader.js";import g from"./WhatsAppTemplateCardButtonV2.js";const f=f=>{let{template:h,onTemplateChange:O,whatsappSpecificPickerMeta:j,showVariableModal:C,variableList:T,variableListForImage:y,discountCode:x,setDiscountCode:V}=f;var B,k,E,L,U,I,w,R,A,P,M,N,S,H,_,Q,q,Y,D,K,W;const $=h.isCarouselType,{originalVariableList:F,pod:X,extras:z,selectedCarouselIndex:G,isProductCarouselType:J}=s(),{descriptionComponents:Z,urlBtns:nn,qrbBtns:on,imageComponent:tn,bodyVariables:en,headerVariables:ln}=a(h),[sn,an]=e(!1),[dn,rn]=e(-1===G?{descriptionComponents:Z,urlBtns:nn,qrbBtns:on,imageComponent:tn,bodyVariables:en,headerVariables:ln}:{}),[pn,cn]=e(!1);function un(n,o,e){var i,l,s,a,d,r,p,c,u,m;const v=null!=G&&G>-1?{components:null===(i=Object.assign({},h).components[1].cards)||void 0===i?void 0:i[G].components,mapping:null===(l=Object.assign({},h).mapping.cards)||void 0===l?void 0:l[G]}:Object.assign({},h),b=t(v),g="custom"===o&&"string"==typeof n,f=g?n:"string"!=typeof n?n.defaultValue?n.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=G&&G>-1&&J){const o=Object.assign({},h).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,t,i;if("BUTTONS"===n.type){const l=null===(o=n.buttons)||void 0===o?void 0:o.filter((n=>"URL"===n.type));let s=null!==(t=null==l?void 0:l[e])&&void 0!==t?t:{};s=Object.assign(Object.assign({},s),{url:"https://d.bik.ai/{{1}}",example:[f]});const a=null===(i=n.buttons)||void 0===i?void 0:i.map((n=>"URL"===n.type&&(null==n?void 0:n.text)===(null==s?void 0:s.text)?s:n));return Object.assign(Object.assign({},n),{buttons:a})}return n}))})))}):n})),i=null===(a=null===(s=Object.assign({},h).mapping)||void 0===s?void 0:s.cards)||void 0===a?void 0:a.map((o=>{var t;return Object.assign(Object.assign({},o),{buttons:null===(t=null==o?void 0:o.buttons)||void 0===t?void 0:t.map((o=>g?"((customBtnPlaceholder))":"string"!=typeof n?n.placeHolder:""))})})),l=t(h);return l.components=o,l.mapping.cards=i,void(null==O||O(Object.assign({},l)))}const j=null==b?void 0:b.components.findIndex((n=>"BUTTONS"===n.type));if(void 0!==j&&j>-1){const t=null===(d=null==b?void 0:b.components[j].buttons)||void 0===d?void 0:d.filter((n=>"URL"===n.type));if((null==t?void 0:t.length)>0){const i="custom"===o&&"string"==typeof n,l=i?n:"string"!=typeof n&&n.defaultValue?n.defaultValue:"https://d.bik.ai/";let s=t[e];s=Object.assign(Object.assign({},s),{url:"https://d.bik.ai/{{1}}",example:[l]});const a=[...null!==(c=null===(p=null===(r=b.components)||void 0===r?void 0:r[j])||void 0===p?void 0:p.buttons)&&void 0!==c?c:[]].map((n=>"URL"===n.type&&(null==n?void 0:n.text)===(null==s?void 0:s.text)?s:n)),d=Object.assign(Object.assign({},b.components[j]),{buttons:a}),m=null===(u=b.mapping)||void 0===u?void 0:u.buttons;m&&m.length>0&&(m[e]=i?"((customBtnPlaceholder))":"string"!=typeof n?n.placeHolder:"");const v=Object.assign(Object.assign({},b.mapping),{buttons:m});b.mapping=v;const g=[...b.components];g[j]=d,b.components=g}}if("string"!=typeof n){"checkout.checkoutUrl"===(null===(m=n.placeHolder)||void 0===m?void 0:m.slice(2,-2))?an(!0):(an(!1),null==V||V(""))}if(null!=G&&G>-1){const n=t(h);n.components[1].cards[G].components=b.components,n.mapping.cards[G]=b.mapping,null==O||O(Object.assign({},n))}else null==O||O(b)}function mn(n,o,e){var i,l,s,a,d,r;const p=null!=G&&G>-1?{components:null===(i=Object.assign({},h).components[1].cards)||void 0===i?void 0:i[G].components,mapping:null===(l=Object.assign({},h).mapping.cards)||void 0===l?void 0:l[G]}:Object.assign({},h);if(null!=G&&G>-1&&J){const o=Object.assign({},h).components.map((o=>{var t;return"CAROUSEL"===o.type?Object.assign(Object.assign({},o),{cards:null===(t=o.cards)||void 0===t?void 0:t.map((o=>Object.assign(Object.assign({},o),{components:o.components.map((o=>{var t,i,l;if("BUTTONS"===o.type){const s=null===(t=o.buttons)||void 0===t?void 0:t.filter((n=>"QUICK_REPLY"===n.type));let a=null!==(i=null==s?void 0:s[e])&&void 0!==i?i:{};a=Object.assign(Object.assign({},a),{flowId:n.flowId,flowName:n.flowName});const d=null===(l=o.buttons)||void 0===l?void 0:l.map((n=>"QUICK_REPLY"===n.type&&(null==n?void 0:n.text)===(null==a?void 0:a.text)?a:n));return Object.assign(Object.assign({},o),{buttons:d})}return o}))})))}):o})),i=t(h);return i.components=o,void(null==O||O(Object.assign({},i)))}const c=null==p?void 0:p.components.findIndex((n=>"BUTTONS"===n.type));if(void 0!==c&&c>-1){const o=null===(s=null==p?void 0:p.components[c].buttons)||void 0===s?void 0:s.filter((n=>"QUICK_REPLY"===n.type));if(o){let t=o[e];t=Object.assign(Object.assign({},t),{flowId:n.flowId,flowName:n.flowName});const i=[...null!==(r=null===(d=null===(a=p.components)||void 0===a?void 0:a[c])||void 0===d?void 0:d.buttons)&&void 0!==r?r:[]].map((n=>"QUICK_REPLY"===n.type&&(null==n?void 0:n.text)===(null==t?void 0:t.text)?t:n)),l=Object.assign(Object.assign({},p.components[c]),{buttons:i}),s=[...p.components];s[c]=l,p.components=s}}if(null!=G&&G>-1){const n=t(h);n.components[1].cards[G].components=p.components,null==O||O(Object.assign({},n))}else null==O||O(p)}return i((()=>{var n,o;if(null===(n=h.mapping.buttons)||void 0===n?void 0:n.find((n=>"checkout.checkoutUrl"===n.slice(2,-2))))an(!0);else{an(!1);const n=null===(o=null==z?void 0:z.discountCodeExtra)||void 0===o?void 0:o[1];null==n||n("")}}),[h]),i((()=>{var n,o,t,e;if(null!=G&&G>-1){const i={components:null===(o=null===(n=h.components[1])||void 0===n?void 0:n.cards)||void 0===o?void 0:o[G].components,mapping:null===(e=null===(t=null==h?void 0:h.mapping)||void 0===t?void 0:t.cards)||void 0===e?void 0:e[G]},{descriptionComponents:l,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:p,headerVariables:c}=a(i);rn({descriptionComponents:l,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:p,headerVariables:c})}else if(null!=G&&-1===G){const{descriptionComponents:n,urlBtns:o,qrbBtns:t,imageComponent:e,bodyVariables:i,headerVariables:l}=a(h);rn({descriptionComponents:n,urlBtns:o,qrbBtns:t,imageComponent:e,bodyVariables:i,headerVariables:l})}}),[G]),i((()=>{var n,o,t,e;if(null!=G&&G>-1&&pn){const i={components:null===(o=null===(n=h.components[1])||void 0===n?void 0:n.cards)||void 0===o?void 0:o[G].components,mapping:null===(e=null===(t=null==h?void 0:h.mapping)||void 0===t?void 0:t.cards)||void 0===e?void 0:e[G]},{descriptionComponents:l,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:p,headerVariables:c}=a(i);rn({descriptionComponents:l,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:p,headerVariables:c}),cn(!1)}}),[pn]),n(m,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:[!!dn.imageComponent&&!J&&o(p,{children:o(c,{whatsappSpecificPickerMeta:j,mediaComponent:$?dn.imageComponent:tn,updateTemplateImageUrl:function(n,o){var e,i,l,s,a,d,r,p;let c;c=null!=G&&G>-1?{components:null===(i=null===(e=h.components[1])||void 0===e?void 0:e.cards)||void 0===i?void 0:i[G].components,mapping:null===(s=null===(l=null==h?void 0:h.mapping)||void 0===l?void 0:l.cards)||void 0===s?void 0:s[G]}:Object.assign({},h);const u=null===(a=null==c?void 0:c.components)||void 0===a?void 0:a.findIndex((n=>{if("HEADER"===n.type&&"NONE"!==n.format&&"TEXT"!==n.format)return!0}));if(void 0!==u&&u>-1&&(null==c?void 0:c.components[u])){const t=Object.assign(Object.assign({},c.components[u]),{format:o,example:{header_handle:[n]}}),e=[...c.components];e[u]=t,c=Object.assign(Object.assign({},c),{components:e})}if(c.mapping&&(c.mapping=Object.assign(Object.assign({},c.mapping),{header:void 0})),null!=G&&G>-1){const n=t(h);n.components[1].cards[G].components=c.components,(null===(d=null==n?void 0:n.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==n?void 0:n.mapping)||void 0===r?void 0:r.cards.length)>0&&(n.mapping.cards[G]=null!==(p=c.mapping)&&void 0!==p?p:{}),null==O||O(Object.assign({},n)),cn(!0)}else null==O||O(Object.assign({},c))},template:h,variableListForImage:y})}),dn.bodyVariables.length>0&&o(b,{containerStyle:{paddingTop:dn.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===(B=dn.descriptionComponents)||void 0===B?void 0:B.map(((n,t)=>o(v,{originalVariableList:null!=G&&G>-1?F.cards[G]:F,type:n.type,descriptionComponent:n.component,showVariableModal:C,variableList:T},t))),(null===(E=null===(k=null!=G&&G>-1?F.cards[G].buttons:null==F?void 0:F.buttons)||void 0===k?void 0:k.filter((n=>"URL"===n.type)))||void 0===E?void 0:E.length)>0&&o(b,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(U=null===(L=null!=G&&G>-1?F.cards[G].buttons:null==F?void 0:F.buttons)||void 0===L?void 0:L.filter((n=>X===l.CHATBOT||"URL"===n.type)))||void 0===U?void 0:U.map(((n,t)=>{if("URL"===n.type)return o(g,{variableListIndex:t,CTAoptions:null==j?void 0:j.CTAoptions,button:n,currentVariableList:null!=G&&G>-1?Object.assign({},F.cards[G]):Object.assign({},F),updateSelectedURLTemplateBtn:un,variableList:T},`${t}_${G}`)})),X===l.CHATBOT&&(null===(w=null===(I=on[0])||void 0===I?void 0:I.component)||void 0===w?void 0:w.buttons)&&(null===(P=null===(A=null===(R=on[0])||void 0===R?void 0:R.component)||void 0===A?void 0:A.buttons)||void 0===P?void 0:P.length)>0&&o(d,{backTrackMessage:null===(M=null==z?void 0:z.backTrackExtra)||void 0===M?void 0:M[0],setBackTrackMessage:null===(N=null==z?void 0:z.backTrackExtra)||void 0===N?void 0:N[1]}),(null===(H=null===(S=null!=G&&G>-1?F.cards[G].buttons:null==F?void 0:F.buttons)||void 0===S?void 0:S.filter((n=>"QUICK_REPLY"===n.type)))||void 0===H?void 0:H.length)>0&&(X!==l.CHATBOT?o(b,{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(d,{backTrackMessage:null===(_=null==z?void 0:z.backTrackExtra)||void 0===_?void 0:_[0],setBackTrackMessage:null===(Q=null==z?void 0:z.backTrackExtra)||void 0===Q?void 0:Q[1]})),null===(Y=null===(q=null!=G&&G>-1?F.cards[G].buttons:null==F?void 0:F.buttons)||void 0===q?void 0:q.filter((n=>"QUICK_REPLY"===n.type)))||void 0===Y?void 0:Y.map(((n,t)=>{if("QUICK_REPLY"===n.type&&X!==l.CHATBOT)return o(g,{variableListIndex:t,QRBoptions:null==j?void 0:j.QRBoptions,button:n,currentVariableList:null!=G&&G>-1?Object.assign({},F.cards[G]):Object.assign({},F),updateSelectedQRBTemplateBtn:mn},`${t}_${G}`)})),X===l.CHATBOT&&sn&&o(r,{discountCode:null===(D=null==z?void 0:z.discountCodeExtra)||void 0===D?void 0:D[0],setDiscountCode:null===(K=null==z?void 0:z.discountCodeExtra)||void 0===K?void 0:K[1],variableList:T}),null===(W=null!=G&&G>-1?F.cards[G].buttons:null==F?void 0:F.buttons)||void 0===W?void 0:W.map(((n,t)=>{var e,i,l;if("COPY_CODE"===n.type)return o(u,{index:t,variable:{variableName:null!==(e=n.text)&&void 0!==e?e:"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,variableList:T,componentType:"BUTTONS"},t)}))]}))};export{f as default};
@@ -13,8 +13,6 @@ export interface TemplateSelectModalContentProps {
13
13
  discountCode?: string;
14
14
  setDiscountCode?: (code: string) => void;
15
15
  showSampleValues?: boolean;
16
- fileName?: string;
17
- setFileName?: (name: string) => void;
18
16
  }
19
- declare const TemplateSelectModalContent: ({ channel, showVariableMapping, showOnlyContent, whatsappSpecificPickerMeta, showVariableModal, variableList, discountCode, setDiscountCode, variableListForImage, showSampleValues, fileName, setFileName, }: TemplateSelectModalContentProps) => import("react/jsx-runtime").JSX.Element;
17
+ declare const TemplateSelectModalContent: ({ channel, showVariableMapping, showOnlyContent, whatsappSpecificPickerMeta, showVariableModal, variableList, discountCode, setDiscountCode, variableListForImage, showSampleValues, }: TemplateSelectModalContentProps) => import("react/jsx-runtime").JSX.Element;
20
18
  export default TemplateSelectModalContent;
@@ -1 +1 @@
1
- import{jsx as e,jsxs as a}from"react/jsx-runtime";import{CHANNEL_TYPE as i}from"../../template-preview/models/Channels.js";import t from"./Body.js";import o from"./Header.js";const s=s=>{let{channel:l,showVariableMapping:r,showOnlyContent:n,whatsappSpecificPickerMeta:m,showVariableModal:p,variableList:d,discountCode:c,setDiscountCode:h,variableListForImage:w,showSampleValues:b,fileName:f,setFileName:u}=s;return e("div",Object.assign({style:{paddingBottom:0}},{children:a("div",{children:[l===i.EMAIL&&e(o,{showOnlyContent:n}),e(t,{whatsappSpecificPickerMeta:m,showVariableMapping:!!r,showOnlyContent:n,showVariableModal:p,variableList:d,discountCode:c,setDiscountCode:h,variableListForImage:w,showSampleValues:b,fileName:f,setFileName:u})]})}))};export{s as default};
1
+ import{jsx as e,jsxs as a}from"react/jsx-runtime";import{CHANNEL_TYPE as o}from"../../template-preview/models/Channels.js";import t from"./Body.js";import i from"./Header.js";const s=s=>{let{channel:r,showVariableMapping:l,showOnlyContent:n,whatsappSpecificPickerMeta:p,showVariableModal:d,variableList:c,discountCode:m,setDiscountCode:h,variableListForImage:w,showSampleValues:b}=s;return e("div",Object.assign({style:{paddingBottom:0}},{children:a("div",{children:[r===o.EMAIL&&e(i,{showOnlyContent:n}),e(t,{whatsappSpecificPickerMeta:p,showVariableMapping:!!l,showOnlyContent:n,showVariableModal:d,variableList:c,discountCode:m,setDiscountCode:h,variableListForImage:w,showSampleValues:b})]})}))};export{s as default};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.0.506-beta-pdf-1.4",
3
+ "version": "0.0.507-beta.filter-1",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",
@@ -1 +0,0 @@
1
- export declare const validateInputName: (name: string) => boolean;
@@ -1 +0,0 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.validateInputName=e=>!!/[^a-zA-Z0-9._ ]/.test(e);
@@ -1 +0,0 @@
1
- export declare const validateInputName: (name: string) => boolean;
@@ -1 +0,0 @@
1
- const t=t=>!!/[^a-zA-Z0-9._ ]/.test(t);export{t as validateInputName};