@bikdotai/bik-component-library 0.0.568-beta.115 → 0.0.569-am.0

package/dist/cjs/components/TypographyStyle.js

@@ -134,8 +134,6 @@
 	overflow: hidden;
 	display: -webkit-box;
 	-webkit-line-clamp: ${e=>e.numberOfLines};
-	word-break: break-word;
-	overflow-wrap: break-word;
 `,x=o.default.div`
 	font-family: Inter;
 	color: ${e=>e.color||t.COLORS.text.primary};

package/dist/cjs/components/WhatsAppTextEditor/WhatsAppTextEditor.d.ts

@@ -12,6 +12,7 @@ export type CustomEditorProps = React.TextareaHTMLAttributes<HTMLTextAreaElement
      * Calls only for editor only error, not for errors coming from outside
      */
     onError?: (err: string) => void;
+    onClickVariable?: (variable: string) => void;
 };
 export type CustomEditorRef = {
     addTextOrWrap: (textToAdd: string) => {
@@ -37,4 +38,5 @@ export declare const WhatsAppTextEditor: React.ForwardRefExoticComponent<React.T
      * Calls only for editor only error, not for errors coming from outside
      */
     onError?: ((err: string) => void) | undefined;
+    onClickVariable?: ((variable: string) => void) | undefined;
 } & React.RefAttributes<CustomEditorRef>>;

package/dist/cjs/components/WhatsAppTextEditor/WhatsAppTextEditor.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),n=require("../../assets/icons/info.svg.js"),r=require("../../helpers/BaseWhatsappContentLang.helper.js"),l=require("react"),o=require("../../constants/Theme.js"),i=require("../TypographyStyle.js"),u=require("./CustomEditor.styled.js"),s=require("./WhatsAppTextEditorHeader.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=c(l);const d="Character limit reached",v=new r.BaseWhatsappContentLangHelper,h={[s.EditorActionTypes.BOLD]:"*",[s.EditorActionTypes.ITALIC]:"_",[s.EditorActionTypes.STRIKETHROUGH]:"~"},p=a.default.forwardRef(((r,c)=>{var a,p,{onChange:f,text:g,RightComponent:x,error:j,limit:m,onError:C,rows:E,actions:T}=r,O=e.__rest(r,["onChange","text","RightComponent","error","limit","onError","rows","actions"]);const y=l.useRef(null);function L(e){const t=null==y?void 0:y.current;null!=t&&(t.selectionStart?(t.focus(),t.selectionEnd=e):t.focus())}function S(e){var t,n;let r=null!==(n=null===(t=y.current)||void 0===t?void 0:t.value)&&void 0!==n?n:"";if(y.current&&e){const t=y.current.selectionStart,n=y.current.selectionEnd,l=e;if(t===n)return R(l);{r=v.wrappWildcard(t,n,l,r);const e=v.getHTML(r);return y.current.value=r,{text:r,html:e}}}return{text:r,html:r}}function R(e){var t,n;let r=null!==(n=null===(t=y.current)||void 0===t?void 0:t.value)&&void 0!==n?n:"";if(y.current&&e){const t=y.current.selectionStart;if(t===y.current.selectionEnd)return H(e,t)}return{text:r,html:r}}function H(e,t){var n,r;let l=null!==(r=null===(n=y.current)||void 0===n?void 0:n.value)&&void 0!==r?r:"";l=l.slice(0,t)+e+l.slice(t);const o=v.getHTML(l);return y.current.value=l,{text:l,html:o}}return l.useImperativeHandle(c,(()=>({addTextOrWrap:S,addText:R,get(){var e,t;return null!==(t=null===(e=y.current)||void 0===e?void 0:e.value)&&void 0!==t?t:""},setCaretPosition:L}))),l.useEffect((()=>{if(null==y?void 0:y.current){y.current.value=g||"";const e=v.getHTML(g||"");null==f||f(g||"",e)}}),[g]),l.useEffect((()=>{var e,t;(null===(e=null==y?void 0:y.current)||void 0===e?void 0:e.value)&&m&&((null===(t=null==y?void 0:y.current)||void 0===t?void 0:t.value.length)>m?null==C||C(d):null==C||C(null!=j?j:""))}),[null===(a=null==y?void 0:y.current)||void 0===a?void 0:a.value.length]),t.jsxs(u.OuterContainer,{children:[t.jsxs(u.Container,Object.assign({isError:!!j},{children:[t.jsx(s.WhatsAppTextEditorHeader,{actions:T,ref:y,onActionSelect:function(e){if((null==h?void 0:h[e])&&y.current){const t=y.current.selectionStart;if(t===y.current.selectionEnd){H(null==h?void 0:h[e],t);const{text:n,html:r}=H(null==h?void 0:h[e],t);L(t+1),null==f||f(n,r)}else{const{text:t,html:n}=S(null==h?void 0:h[e]);null==f||f(t,n)}}},RightComponent:x,onEmojiClick:function(e){const{text:t,html:n}=R(e);null==f||f(t,n)}}),t.jsx(u.TextSpace,Object.assign({ref:y,onChange:function(e){const t=e.target.value,n=v.getHTML(t);null==f||f(t,n)}},O,{rows:E}))]})),j&&j!==d?t.jsxs("div",Object.assign({style:{display:"flex",gap:6,alignItems:"center"}},{children:[t.jsx(n.default,{width:16,height:16,color:o.COLORS.content.negative}),t.jsx(i.BodyCaption,Object.assign({color:o.COLORS.content.negative},{children:j}))]})):t.jsx(t.Fragment,{children:m&&(null==y?void 0:y.current)?t.jsxs(i.BodyCaption,Object.assign({style:{color:j===d||(null===(p=null==y?void 0:y.current)||void 0===p?void 0:p.value.length)>m?o.COLORS.content.negative:o.COLORS.content.secondary}},{children:[y.current.value.length,"/",m]})):t.jsx(t.Fragment,{})})]})}));p.displayName="WhatsAppTextEditor",exports.WhatsAppTextEditor=p;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),n=require("../../assets/icons/info.svg.js"),r=require("../../helpers/BaseWhatsappContentLang.helper.js"),l=require("react"),o=require("../../constants/Theme.js"),i=require("../TypographyStyle.js"),u=require("./CustomEditor.styled.js"),s=require("./WhatsAppTextEditorHeader.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=c(l);const d="Character limit reached",v=new r.BaseWhatsappContentLangHelper,h={[s.EditorActionTypes.BOLD]:"*",[s.EditorActionTypes.ITALIC]:"_",[s.EditorActionTypes.STRIKETHROUGH]:"~"},p=a.default.forwardRef(((r,c)=>{var a,p,{onChange:f,onClickVariable:g,text:x,RightComponent:j,error:C,limit:m,onError:E,rows:T,actions:O}=r,y=e.__rest(r,["onChange","onClickVariable","text","RightComponent","error","limit","onError","rows","actions"]);const L=l.useRef(null);function S(e){const t=null==L?void 0:L.current;null!=t&&(t.selectionStart?(t.focus(),t.selectionEnd=e):t.focus())}function R(e){var t,n;let r=null!==(n=null===(t=L.current)||void 0===t?void 0:t.value)&&void 0!==n?n:"";if(L.current&&e){const t=L.current.selectionStart,n=L.current.selectionEnd,l=e;if(t===n)return b(l);{r=v.wrappWildcard(t,n,l,r);const e=v.getHTML(r);return L.current.value=r,{text:r,html:e}}}return{text:r,html:r}}function b(e){var t,n;let r=null!==(n=null===(t=L.current)||void 0===t?void 0:t.value)&&void 0!==n?n:"";if(L.current&&e){const t=L.current.selectionStart;if(t===L.current.selectionEnd)return H(e,t)}return{text:r,html:r}}function H(e,t){var n,r;let l=null!==(r=null===(n=L.current)||void 0===n?void 0:n.value)&&void 0!==r?r:"";l=l.slice(0,t)+e+l.slice(t);const o=v.getHTML(l);return L.current.value=l,{text:l,html:o}}return l.useImperativeHandle(c,(()=>({addTextOrWrap:R,addText:b,get(){var e,t;return null!==(t=null===(e=L.current)||void 0===e?void 0:e.value)&&void 0!==t?t:""},setCaretPosition:S}))),l.useEffect((()=>{if(null==L?void 0:L.current){L.current.value=x||"";const e=v.getHTML(x||"");null==f||f(x||"",e)}}),[x]),l.useEffect((()=>{var e,t;(null===(e=null==L?void 0:L.current)||void 0===e?void 0:e.value)&&m&&((null===(t=null==L?void 0:L.current)||void 0===t?void 0:t.value.length)>m?null==E||E(d):null==E||E(null!=C?C:""))}),[null===(a=null==L?void 0:L.current)||void 0===a?void 0:a.value.length]),t.jsxs(u.OuterContainer,{children:[t.jsxs(u.Container,Object.assign({isError:!!C},{children:[t.jsx(s.WhatsAppTextEditorHeader,{actions:O,ref:L,onActionSelect:function(e){if((null==h?void 0:h[e])&&L.current){const t=L.current.selectionStart;if(t===L.current.selectionEnd){H(null==h?void 0:h[e],t);const{text:n,html:r}=H(null==h?void 0:h[e],t);S(t+1),null==f||f(n,r)}else{const{text:t,html:n}=R(null==h?void 0:h[e]);null==f||f(t,n)}}},RightComponent:j,onEmojiClick:function(e){const{text:t,html:n}=b(e);null==f||f(t,n)}}),t.jsx(u.TextSpace,Object.assign({ref:L,onChange:function(e){const t=e.target.value,n=v.getHTML(t);null==f||f(t,n)}},y,{rows:T}))]})),C&&C!==d?t.jsxs("div",Object.assign({style:{display:"flex",gap:6,alignItems:"center"}},{children:[t.jsx(n.default,{width:16,height:16,color:o.COLORS.content.negative}),t.jsx(i.BodyCaption,Object.assign({color:o.COLORS.content.negative},{children:C}))]})):t.jsx(t.Fragment,{children:m&&(null==L?void 0:L.current)?t.jsxs(i.BodyCaption,Object.assign({style:{color:C===d||(null===(p=null==L?void 0:L.current)||void 0===p?void 0:p.value.length)>m?o.COLORS.content.negative:o.COLORS.content.secondary}},{children:[L.current.value.length,"/",m]})):t.jsx(t.Fragment,{})})]})}));p.displayName="WhatsAppTextEditor",exports.WhatsAppTextEditor=p;

package/dist/cjs/components/avatar/Avatar.d.ts

@@ -3,7 +3,6 @@ import { AVATAR_BACKGROUND, AVATAR_TYPES, SIZE } from "./AvatarHelper";
 export declare const AVATAR_SIZE_VS_ICON_SIZE_MAP: {
     SMALL: number;
     MEDIUM: number;
-    INBOX: number;
     LARGE: number;
 };
 export declare const BACKGROUND_VS_TEXT_COLOR_MAP: {
@@ -22,23 +21,5 @@ export type AvatarProps = {
         color: string;
     }>;
     useNameFallback?: boolean;
-    channelName?: MESSAGE_CHANNELS;
-    inboxSettings?: {
-        isSelected: boolean;
-        isComments: boolean;
-    };
 };
-export declare const enum MESSAGE_CHANNELS {
-    INSTAGRAM = "instagram",
-    MESSENGER = "messenger",
-    WHATSAPP = "whatsapp",
-    GMAIL = "gmail",
-    LIVECHAT = "livechat",
-    GOOGLE_BUSINESS_CHAT = "gbm",
-    SHOPIFY = "shopify",
-    FACEBOOK = "facebook",
-    EMAIL = "email",
-    SMTP = "smtp",
-    FACEBOOK_CATALOG = "facebook-catalog"
-}
 export declare const Avatar: React.FC<AvatarProps>;

package/dist/cjs/components/avatar/Avatar.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("react"),t=require("./Avatar.styled.js"),i=require("./AvatarHelper.js"),r=require("../TypographyStyle.js"),a=require("../../constants/Theme.js"),A=require("../../assets/icons/email-channel.svg.js"),o=require("../../assets/icons/facebook_channel.svg.js"),n=require("../../assets/icons/gmail.svg.js"),S=require("../../assets/icons/instagram-channel.svg.js"),c=require("../../assets/icons/whatsapp_color.svg.js");const E={[i.SIZE.SMALL]:16,[i.SIZE.MEDIUM]:20,[i.SIZE.INBOX]:24,[i.SIZE.LARGE]:32},l={[i.AVATAR_BACKGROUND.LIGHT]:a.COLORS.content.secondary,[i.AVATAR_BACKGROUND.DARK]:a.COLORS.surface.standard};var d;exports.MESSAGE_CHANNELS=void 0,(d=exports.MESSAGE_CHANNELS||(exports.MESSAGE_CHANNELS={})).INSTAGRAM="instagram",d.MESSENGER="messenger",d.WHATSAPP="whatsapp",d.GMAIL="gmail",d.LIVECHAT="livechat",d.GOOGLE_BUSINESS_CHAT="gbm",d.SHOPIFY="shopify",d.FACEBOOK="facebook",d.EMAIL="email",d.SMTP="smtp",d.FACEBOOK_CATALOG="facebook-catalog";exports.AVATAR_SIZE_VS_ICON_SIZE_MAP=E,exports.Avatar=d=>{const[h,u]=s.useState(!1),p=()=>{const s=(d.name||"").split(".").join(" ").split(" ").map((e=>e.charAt(0).toUpperCase())).slice(0,2).join("");return d.size===i.SIZE.SMALL?e.jsx(r.BodyTiny,Object.assign({style:{color:l[d.background]}},{children:s})):d.size===i.SIZE.MEDIUM||d.size===i.SIZE.INBOX?e.jsx(r.TitleSmall,Object.assign({style:{color:l[d.background]}},{children:s})):d.size===i.SIZE.LARGE?e.jsx(r.TitleMedium,Object.assign({style:{color:l[d.background]}},{children:s})):void 0};return e.jsxs("div",Object.assign({style:{position:"relative"}},{children:[e.jsxs(t.AvatarStyle,Object.assign({type:d.type===i.AVATAR_TYPES.IMAGE&&h&&d.useNameFallback&&d.name?i.AVATAR_TYPES.INITIALS:d.type,size:d.size,background:d.background},{children:[d.type===i.AVATAR_TYPES.IMAGE&&(d.useNameFallback&&!h?e.jsx("img",{alt:"",width:i.AVATAR_SIZE_MAP[d.size],height:i.AVATAR_SIZE_MAP[d.size],style:{borderRadius:"50%",objectFit:"contain"},src:d.photoUrl,onError:()=>{u(!0)}}):d.useNameFallback&&h&&d.name?e.jsx("div",{children:p()}):e.jsx("img",{alt:"",width:i.AVATAR_SIZE_MAP[d.size],height:i.AVATAR_SIZE_MAP[d.size],style:{borderRadius:"50%",objectFit:"contain"},src:d.photoUrl})),d.type===i.AVATAR_TYPES.INITIALS&&e.jsx("div",{children:p()}),d.type===i.AVATAR_TYPES.ICON&&d.icon&&e.jsx(d.icon,{width:E[d.size],height:E[d.size],color:l[d.background]})]})),d.inboxSettings&&e.jsx("div",Object.assign({style:{position:"absolute",left:"20px",top:"20px",width:14,height:14,borderRadius:"50%",display:"flex",justifyContent:"center",backgroundColor:d.inboxSettings.isSelected?d.inboxSettings.isComments?a.COLORS.content.primary:a.COLORS.background.brandLight:d.inboxSettings.isComments?a.COLORS.content.primary:a.COLORS.surface.standard,alignItems:"center"}},{children:(()=>{switch(d.channelName){case exports.MESSAGE_CHANNELS.EMAIL:case exports.MESSAGE_CHANNELS.SMTP:return e.jsx(A.default,{width:11,height:11});case exports.MESSAGE_CHANNELS.FACEBOOK:case exports.MESSAGE_CHANNELS.FACEBOOK_CATALOG:case exports.MESSAGE_CHANNELS.MESSENGER:return e.jsx(o.default,{width:11,height:11});case exports.MESSAGE_CHANNELS.INSTAGRAM:return e.jsx(S.default,{width:11,height:11});case exports.MESSAGE_CHANNELS.WHATSAPP:return e.jsx(c.default,{width:11,height:11});case exports.MESSAGE_CHANNELS.GMAIL:return e.jsx(n.default,{width:11,height:11})}})()}))]}))},exports.BACKGROUND_VS_TEXT_COLOR_MAP=l;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("react"),t=require("./Avatar.styled.js"),r=require("./AvatarHelper.js"),i=require("../TypographyStyle.js"),A=require("../../constants/Theme.js");const a={[r.SIZE.SMALL]:16,[r.SIZE.MEDIUM]:20,[r.SIZE.LARGE]:32},o={[r.AVATAR_BACKGROUND.LIGHT]:A.COLORS.content.secondary,[r.AVATAR_BACKGROUND.DARK]:A.COLORS.surface.standard};exports.AVATAR_SIZE_VS_ICON_SIZE_MAP=a,exports.Avatar=A=>{const[c,n]=s.useState(!1),l=()=>{const s=(A.name||"").split(".").join(" ").split(" ").map((e=>e.charAt(0).toUpperCase())).slice(0,2).join("");return A.size===r.SIZE.SMALL?e.jsx(i.BodyTiny,Object.assign({style:{color:o[A.background]}},{children:s})):A.size===r.SIZE.MEDIUM?e.jsx(i.TitleSmall,Object.assign({style:{color:o[A.background]}},{children:s})):A.size===r.SIZE.LARGE?e.jsx(i.TitleMedium,Object.assign({style:{color:o[A.background]}},{children:s})):void 0};return e.jsxs(t.AvatarStyle,Object.assign({type:A.type,size:A.size,background:A.background},{children:[A.type===r.AVATAR_TYPES.IMAGE&&(A.useNameFallback&&!c?e.jsx("img",{alt:"",width:r.AVATAR_SIZE_MAP[A.size],height:r.AVATAR_SIZE_MAP[A.size],style:{borderRadius:"50%",objectFit:"contain"},src:A.photoUrl,onError:()=>{n(!0)}}):A.useNameFallback&&c&&A.name?e.jsx("div",{children:l()}):e.jsx("img",{alt:"",width:r.AVATAR_SIZE_MAP[A.size],height:r.AVATAR_SIZE_MAP[A.size],style:{borderRadius:"50%",objectFit:"contain"},src:A.photoUrl})),A.type===r.AVATAR_TYPES.INITIALS&&e.jsx("div",{children:l()}),A.type===r.AVATAR_TYPES.ICON&&A.icon&&e.jsx(A.icon,{width:a[A.size],height:a[A.size],color:o[A.background]})]}))},exports.BACKGROUND_VS_TEXT_COLOR_MAP=o;

package/dist/cjs/components/avatar/AvatarHelper.d.ts

@@ -6,8 +6,7 @@ export declare enum AVATAR_TYPES {
 export declare enum SIZE {
     SMALL = "SMALL",
     MEDIUM = "MEDIUM",
-    LARGE = "LARGE",
-    INBOX = "INBOX"
+    LARGE = "LARGE"
 }
 export declare enum AVATAR_BACKGROUND {
     LIGHT = "LIGHT",
@@ -17,5 +16,4 @@ export declare const AVATAR_SIZE_MAP: {
     SMALL: number;
     MEDIUM: number;
     LARGE: number;
-    INBOX: number;
 };

package/dist/cjs/components/avatar/AvatarHelper.js

@@ -1 +1 @@
-"use strict";var A,I,e;Object.defineProperty(exports,"__esModule",{value:!0}),exports.AVATAR_TYPES=void 0,(A=exports.AVATAR_TYPES||(exports.AVATAR_TYPES={})).IMAGE="IMAGE",A.INITIALS="INITIALS",A.ICON="ICON",exports.SIZE=void 0,(I=exports.SIZE||(exports.SIZE={})).SMALL="SMALL",I.MEDIUM="MEDIUM",I.LARGE="LARGE",I.INBOX="INBOX",exports.AVATAR_BACKGROUND=void 0,(e=exports.AVATAR_BACKGROUND||(exports.AVATAR_BACKGROUND={})).LIGHT="LIGHT",e.DARK="DARK";const o={[exports.SIZE.SMALL]:24,[exports.SIZE.MEDIUM]:40,[exports.SIZE.LARGE]:64,[exports.SIZE.INBOX]:30};exports.AVATAR_SIZE_MAP=o;
+"use strict";var A,e,I;Object.defineProperty(exports,"__esModule",{value:!0}),exports.AVATAR_TYPES=void 0,(A=exports.AVATAR_TYPES||(exports.AVATAR_TYPES={})).IMAGE="IMAGE",A.INITIALS="INITIALS",A.ICON="ICON",exports.SIZE=void 0,(e=exports.SIZE||(exports.SIZE={})).SMALL="SMALL",e.MEDIUM="MEDIUM",e.LARGE="LARGE",exports.AVATAR_BACKGROUND=void 0,(I=exports.AVATAR_BACKGROUND||(exports.AVATAR_BACKGROUND={})).LIGHT="LIGHT",I.DARK="DARK";const o={[exports.SIZE.SMALL]:24,[exports.SIZE.MEDIUM]:40,[exports.SIZE.LARGE]:64};exports.AVATAR_SIZE_MAP=o;

package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../../../zeroState/ZeroState.js"),r=require("../../../../hooks/useOutside.js"),o=require("../../hooks/useDropdown.js"),s=require("./description/Description.js"),i=require("./menu/FreeFormMenu.js"),l=require("./menu/MenuList.js"),u=require("./menu/SelectAllMenu.js"),c=require("./multiSelect/MultiSelectDropdownBottomBar.js"),a=require("./OpennedDropdown.styled.js"),d=require("./searchbox/SearchBox.js"),p=require("./searchbox/SearchZeroState.js");const h=304,S=290;exports.OpenedDropdown=j=>{let{options:f,isSearchable:x,isMultiSelect:g,width:w,allowFreeForm:b,height:v,onClose:m,onSelect:y,onSearch:O,version:M,skipSorting:q,headerRef:C,hideSelectAll:D,primaryButtonText:L,onInfiniteScroll:F,onMultiSelectClear:k,onDropdownItemClick:A,buttonOptions:B,isSearchLoading:I}=j;const{dropdownOptions:H,search:Z,searchedString:R,searchedOptions:T,onApplyHandler:P,selectAllHandler:_,onMultiSelectClear:z,onFreeFormSelect:E,onMultiSelectApply:K,latestDropdownOptionsRef:N,getSelectedOptions:W}=o.useDropdown(M,f,y,q,g,O),[G,J]=t.useState(null!=w?w:S),[Q,U]=t.useState(null),V=t.useRef(null);r.useOutside(V,(()=>{if(U(null),g&&"2.0"===M){const e=W(N.current);null==m||m(e)}else null==m||m(H)}),[C]);const X=null!=v?v:h,Y="number"==typeof X?x&&g?X-96:x&&!g||!x&&g?X-48:X:X;t.useEffect((()=>{const e=null!=w?w:S;if(null===Q)J(e);else if("number"==typeof e)J(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));J(t)}}),[Q]);const $=[],ee=(R&&O?T:H).map((e=>{var t,n;if(R&&!O){if(e.options){const t=Object.assign({},e);return t.options=t.options.filter((e=>{var t;return!!(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(R.toLowerCase()))&&($.push(!R||e.label===R),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(R.toLowerCase()))||(null===(n=e.searchKey)||void 0===n?void 0:n.toLowerCase().includes(R.toLowerCase()))?($.push(!R||e.label===R),e):null}return e})).filter((e=>null!==e)),te=!!x&&R&&0===ee.length;return e.jsxs(a.OpennedDropdownContainer,Object.assign({version:M,ref:V,style:{width:G}},{children:[e.jsxs("div",Object.assign({style:{width:Q?"50%":"100%",display:"flex",flexDirection:"column",background:"white"}},{children:[!!x&&e.jsx(d.SearchBox,{onSearch:Z,version:M}),ee.length||R?e.jsxs(a.MenuListContainer,Object.assign({minHeight:X,maxHeight:Y},{children:[!!g&&!te&&!D&&e.jsx(u.SelectAllMenu,{version:M,options:R&&O?T:H,onSelect:_}),!b&&te&&e.jsx(p.SearchZeroState,{isLoading:I,height:Y,searchedString:R}),b&&(te||!!$.length&&$.every((e=>!1===e)))&&e.jsx(i.FreeFormMenu,{version:M,isMultiSelect:g,onSelect:E,searchedString:R}),e.jsx(l.MenuList,{onInfiniteScroll:F,onDropdownItemClick:A,version:M,onSelect:P,showDescription:function(e,t){U(e&&t?{title:e,description:t}:null)},isMultiSelect:g,options:ee})]})):e.jsx("div",Object.assign({style:{height:X,display:"flex"}},{children:e.jsx(n.ZeroState,{title:"No results found",subTitle:"Please try again later or contact us at support@bik.ai if you require further assistance."})})),!!g&&!(!ee.length&&!R)&&"2.0"!==M&&e.jsx(c.default,{onClear:()=>{z(),null==k||k()},onApply:K,list:R&&O?T:H,buttonText:L,buttonOptions:B})]})),!!Q&&e.jsx(s.Description,{title:Q.title,description:Q.description,version:M})]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../../../zeroState/ZeroState.js"),r=require("../../../../hooks/useOutside.js"),o=require("../../hooks/useDropdown.js"),s=require("./description/Description.js"),i=require("./menu/FreeFormMenu.js"),l=require("./menu/MenuList.js"),u=require("./menu/SelectAllMenu.js"),c=require("./multiSelect/MultiSelectDropdownBottomBar.js"),a=require("./OpennedDropdown.styled.js"),d=require("./searchbox/SearchBox.js"),p=require("./searchbox/SearchZeroState.js");const h=304,S=290;exports.OpenedDropdown=j=>{let{options:f,isSearchable:x,isMultiSelect:g,width:b,allowFreeForm:w,height:v,onClose:m,onSelect:O,onSearch:y,version:M,skipSorting:q,headerRef:C,hideSelectAll:D,primaryButtonText:L,onInfiniteScroll:F,onMultiSelectClear:k,onDropdownItemClick:A,buttonOptions:B,isSearchLoading:I,disableOtherOptions:H}=j;const{dropdownOptions:Z,search:R,searchedString:T,searchedOptions:P,onApplyHandler:_,selectAllHandler:z,onMultiSelectClear:E,onFreeFormSelect:K,onMultiSelectApply:N,latestDropdownOptionsRef:W,getSelectedOptions:G}=o.useDropdown(M,f,O,q,g,y,H),[J,Q]=t.useState(null!=b?b:S),[U,V]=t.useState(null),X=t.useRef(null);r.useOutside(X,(()=>{if(V(null),g&&"2.0"===M){const e=G(W.current);null==m||m(e)}else null==m||m(Z)}),[C]);const Y=null!=v?v:h,$="number"==typeof Y?x&&g?Y-96:x&&!g||!x&&g?Y-48:Y:Y;t.useEffect((()=>{const e=null!=b?b:S;if(null===U)Q(e);else if("number"==typeof e)Q(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));Q(t)}}),[U]);const ee=[],te=(T&&y?P:Z).map((e=>{var t,n;if(T&&!y){if(e.options){const t=Object.assign({},e);return t.options=t.options.filter((e=>{var t;return!!(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(T.toLowerCase()))&&(ee.push(!T||e.label===T),!0)})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(T.toLowerCase()))||(null===(n=e.searchKey)||void 0===n?void 0:n.toLowerCase().includes(T.toLowerCase()))?(ee.push(!T||e.label===T),e):null}return e})).filter((e=>null!==e)),ne=!!x&&T&&0===te.length;return e.jsxs(a.OpennedDropdownContainer,Object.assign({version:M,ref:X,style:{width:J}},{children:[e.jsxs("div",Object.assign({style:{width:U?"50%":"100%",display:"flex",flexDirection:"column",background:"white"}},{children:[!!x&&e.jsx(d.SearchBox,{onSearch:R,version:M}),te.length||T?e.jsxs(a.MenuListContainer,Object.assign({minHeight:Y,maxHeight:$},{children:[!!g&&!ne&&!D&&e.jsx(u.SelectAllMenu,{version:M,options:T&&y?P:Z,onSelect:z}),!w&&ne&&e.jsx(p.SearchZeroState,{isLoading:I,height:$,searchedString:T}),w&&(ne||!!ee.length&&ee.every((e=>!1===e)))&&e.jsx(i.FreeFormMenu,{version:M,isMultiSelect:g,onSelect:K,searchedString:T}),e.jsx(l.MenuList,{onInfiniteScroll:F,onDropdownItemClick:A,version:M,onSelect:_,showDescription:function(e,t){V(e&&t?{title:e,description:t}:null)},isMultiSelect:g,options:te})]})):e.jsx("div",Object.assign({style:{height:Y,display:"flex"}},{children:e.jsx(n.ZeroState,{title:"No results found",subTitle:"Please try again later or contact us at support@bik.ai if you require further assistance."})})),!!g&&!(!te.length&&!T)&&"2.0"!==M&&e.jsx(c.default,{onClear:()=>{E(),null==k||k()},onApply:N,list:T&&y?P:Z,buttonText:L,buttonOptions:B})]})),!!U&&e.jsx(s.Description,{title:U.title,description:U.description,version:M})]}))};

package/dist/cjs/components/dropdown/hooks/useDropdown.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { SelectAllCheckboxState } from '../OpenedDropdown/components/menu/SelectAllMenu';
 import { DropdownOption, SingleOption } from '../type';
-export declare const useDropdown: (version: string | undefined, options: DropdownOption[], onSelect: ((option: DropdownOption | DropdownOption[]) => void) | undefined, skipSorting?: boolean, isMultiSelect?: boolean, onSearch?: ((searchKey: string) => Promise<DropdownOption[]>) | undefined) => {
+export declare const useDropdown: (version: string | undefined, options: DropdownOption[], onSelect: ((option: DropdownOption | DropdownOption[]) => void) | undefined, skipSorting?: boolean, isMultiSelect?: boolean, onSearch?: ((searchKey: string) => Promise<DropdownOption[]>) | undefined, disableOtherSearchedOption?: boolean, disableSearchedOptionExcept?: string[]) => {
     latestDropdownOptionsRef: import("react").MutableRefObject<DropdownOption[]>;
     dropdownOptions: DropdownOption[];
     search: (searchKey: string) => void;

package/dist/cjs/components/dropdown/hooks/useDropdown.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("../OpenedDropdown/utils/iterationOnOptions.js");exports.useDropdown=function(){let s=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"1.0",l=arguments.length>1?arguments[1]:void 0,n=arguments.length>2?arguments[2]:void 0,i=arguments.length>3?arguments[3]:void 0,c=arguments.length>4?arguments[4]:void 0,o=arguments.length>5?arguments[5]:void 0;const[a,u]=e.useState(null!=l?l:[]),[r,d]=e.useState([]),[p,v]=e.useState(""),O=e.useRef(a);e.useEffect((()=>{if(O.current=a,r.length&&p&&o){let e=[...r];const t=a.map((e=>e.options?e.options.map((e=>({value:e.value,selected:e.selected}))):{value:e.value,selected:e.selected})).flat();e=e.map((e=>{const s=t.find((t=>e.value===t.value));return s?Object.assign(Object.assign({},e),{selected:s.selected}):e})),d([...e])}}),[a]),e.useEffect((()=>{if(l){const e=[...l];u(c&&!i?[...e.sort((e=>e.selected?-1:1))]:[...e])}}),[l]);const f=e=>{const t=[];return e.forEach((e=>{if(e.options){const s=e.options.filter((e=>!0===e.selected));t.push(Object.assign(Object.assign({},e),{options:[...s]}))}else e.selected&&t.push(Object.assign({},e))})),t};function g(e,l){if(c)if(r.length&&p&&o)if(e.selected){let n=!1;const i=t.iterateOnOptions(a,{selected:e.selected},(t=>t.value===e.value&&(n=!0,!0)));if(n||i.push(e),l)return[...i];u([...i]),"2.0"===s&&b(i)}else{let n=!1,i=t.iterateOnOptions(a,{selected:e.selected},(t=>t.value===e.value&&(n=!0,!0)));if(n&&(i=i.filter((t=>t.value!==e.value))),l)return[...i];u([...i]),"2.0"===s&&b(i)}else{const n=t.iterateOnOptions(a,{selected:e.selected},(t=>t.value===e.value));if(l)return[...n];u([...n]),"2.0"===s&&b(n)}else null==n||n(e)}function b(e){const t=f(null!=e?e:O.current);null==n||n([...t])}return{latestDropdownOptionsRef:O,dropdownOptions:a,search:function(e){if(v(e),d([]),e&&o){const s=[];t.iterateOnOptionsRaw(a,(e=>{e.selected&&!s.includes(e.value)&&s.push(e.value)})),o(e).then((e=>{if(e){const t=e.map((e=>{if(e.options){const t=e;return Object.assign(Object.assign({},t),{options:t.options.map((e=>Object.assign(Object.assign({},e),{selected:s.includes(e.value)})))})}return Object.assign(Object.assign({},e),{selected:s.includes(e.value)})}));d([...t])}}))}},searchedString:p,searchedOptions:r,onApplyHandler:g,selectAllHandler:function(e){if(r.length&&p&&o)!function(e){let t=[...a];e?r.forEach((e=>{let s=!1;t=t.map((t=>{const l=e;return void 0!==l.value&&l.value===t.value?(s=!0,Object.assign(Object.assign({},t),{selected:!0})):t})),s||t.push(Object.assign(Object.assign({},e),{selected:!0}))})):r.forEach((e=>{t=t.map((t=>{const s=e;return void 0!==s.value&&s.value===t.value?Object.assign(Object.assign({},t),{selected:!1}):t}))})),u([...t]),"2.0"===s&&b(t)}("selectAll"===e);else if("selectAll"===e){const e=t.iterateOnOptions(a,{selected:!0},(e=>{var t;return p?(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(p.toLowerCase()))&&!e.disabled:!e.disabled}));u([...e]),"2.0"===s&&b(e)}else if("notSelected"===e){const e=t.iterateOnOptions(a,{selected:!1},(e=>!e.disabled));u([...e]),"2.0"===s&&b(e)}},onMultiSelectClear:function(){const e=t.iterateOnOptions(a,{selected:!1});u([...e]),"2.0"===s&&b(e)},onFreeFormSelect:function(e){if(!c)return void g({label:p,value:p,isFreeForm:!0,selected:!0});const t=a.map((t=>t.options?t:Object.assign(Object.assign({},t),{selected:t.label===p&&t.value===p?e:t.selected})));e&&(t.some((e=>e.label===p&&e.value===p))||t.unshift({label:p,value:p,isFreeForm:!0,selected:!0})),u([...t]),"2.0"===s&&b(t)},onMultiSelectApply:b,getSelectedOptions:f}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("../OpenedDropdown/utils/iterationOnOptions.js");exports.useDropdown=function(){let s=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"1.0",l=arguments.length>1?arguments[1]:void 0,n=arguments.length>2?arguments[2]:void 0,o=arguments.length>3?arguments[3]:void 0,i=arguments.length>4?arguments[4]:void 0,c=arguments.length>5?arguments[5]:void 0,a=arguments.length>6?arguments[6]:void 0,u=arguments.length>7&&void 0!==arguments[7]?arguments[7]:[];const[d,r]=e.useState(null!=l?l:[]),[p,v]=e.useState([]),[O,f]=e.useState(""),g=e.useRef(d);e.useEffect((()=>{if(g.current=d,p.length&&O&&c){let e=[...p];const t=d.map((e=>{if(e.options)return e.options.map((e=>({value:e.value,selected:e.selected,disabled:a&&!u.includes(e.value)})));const t=e;return{value:t.value,selected:t.selected,disabled:a&&!u.includes(t.value)}})).flat();console.log("dropdownOptionFlat",t),console.log("47 searchedOptionsClone",e),e=e.map((e=>{const s=t.find((t=>e.value===t.value));return console.log("selectedDropdownOption",s),s?Object.assign(Object.assign({},e),{selected:s.selected,disabled:a&&!u.includes(e.value)}):e})),console.log("71 searchedOptionsClone",e),v([...e])}}),[d,u,a]),e.useEffect((()=>{if(l){const e=[...l];r(i&&!o?[...e.sort((e=>e.selected?-1:1))]:[...e])}}),[l]);const b=e=>{const t=[];return e.forEach((e=>{if(e.options){const s=e.options.filter((e=>!0===e.selected));t.push(Object.assign(Object.assign({},e),{options:[...s]}))}else e.selected&&t.push(Object.assign({},e))})),t};function h(e,l){if(i)if(p.length&&O&&c)if(e.selected){let n=!1;const o=t.iterateOnOptions(d,{selected:e.selected},(t=>t.value===e.value&&(n=!0,!0)));if(n||o.push(e),l)return[...o];r([...o]),"2.0"===s&&j(o)}else{let n=!1,o=t.iterateOnOptions(d,{selected:e.selected},(t=>t.value===e.value&&(n=!0,!0)));if(n&&(o=o.filter((t=>t.value!==e.value))),l)return[...o];r([...o]),"2.0"===s&&j(o)}else{const n=t.iterateOnOptions(d,{selected:e.selected},(t=>t.value===e.value));if(l)return[...n];r([...n]),"2.0"===s&&j(n)}else null==n||n(e)}function j(e){const t=b(null!=e?e:g.current);null==n||n([...t])}return{latestDropdownOptionsRef:g,dropdownOptions:d,search:function(e){if(f(e),v([]),e&&c){const s=[];t.iterateOnOptionsRaw(d,(e=>{e.selected&&!s.includes(e.value)&&s.push(e.value)})),c(e).then((e=>{if(e){const t=e.map((e=>{if(e.options){const t=e;return Object.assign(Object.assign({},t),{options:t.options.map((e=>Object.assign(Object.assign({},e),{selected:s.includes(e.value)})))})}return Object.assign(Object.assign({},e),{selected:s.includes(e.value)})}));v([...t])}}))}},searchedString:O,searchedOptions:p,onApplyHandler:h,selectAllHandler:function(e){if(p.length&&O&&c)!function(e){let t=[...d];e?p.forEach((e=>{let s=!1;t=t.map((t=>{const l=e;return void 0!==l.value&&l.value===t.value?(s=!0,Object.assign(Object.assign({},t),{selected:!0})):t})),s||t.push(Object.assign(Object.assign({},e),{selected:!0}))})):p.forEach((e=>{t=t.map((t=>{const s=e;return void 0!==s.value&&s.value===t.value?Object.assign(Object.assign({},t),{selected:!1}):t}))})),r([...t]),"2.0"===s&&j(t)}("selectAll"===e);else if("selectAll"===e){const e=t.iterateOnOptions(d,{selected:!0},(e=>{var t;return O?(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(O.toLowerCase()))&&!e.disabled:!e.disabled}));r([...e]),"2.0"===s&&j(e)}else if("notSelected"===e){const e=t.iterateOnOptions(d,{selected:!1},(e=>!e.disabled));r([...e]),"2.0"===s&&j(e)}},onMultiSelectClear:function(){const e=t.iterateOnOptions(d,{selected:!1});r([...e]),"2.0"===s&&j(e)},onFreeFormSelect:function(e){if(!i)return void h({label:O,value:O,isFreeForm:!0,selected:!0});const t=d.map((t=>t.options?t:Object.assign(Object.assign({},t),{selected:t.label===O&&t.value===O?e:t.selected})));e&&(t.some((e=>e.label===O&&e.value===O))||t.unshift({label:O,value:O,isFreeForm:!0,selected:!0})),r([...t]),"2.0"===s&&j(t)},onMultiSelectApply:j,getSelectedOptions:b}};

package/dist/cjs/components/dropdown/type.d.ts

@@ -25,6 +25,7 @@ export interface OpenDropdownProps {
     onDropdownItemClick?: (option: DropdownOption) => void;
     buttonOptions?: ButtonOptions;
     isSearchLoading?: boolean;
+    disableOtherOptions?: boolean;
 }
 export type GroupedOption = {
     label?: string;

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

@@ -7,6 +7,7 @@ import { EmailTemplateType } from '../template-preview/models/EmailTemplate';
 import { SMSTemplateType } from '../template-preview/models/SmsTemplate';
 import { CUSTOM_VARIABLE, GlobalPlaceholderType } from '../template-preview/models/TemplateMeta';
 import { ExtrasWhatsapp, POD, WhatsAppPickerMeta, WhatsAppTemplate, WhatsAppTemplateVariables } from '../template-preview/models/WhatsAppTemplate';
+import { VariableV3 } from '../variable-picker-v3/model';
 export interface TemplateContextMapperProps {
     selectedTemplate: WhatsAppTemplate | EmailTemplateType | SMSTemplateType | WhatsAppCarouselTemplate;
     closeDialog?: () => void;
@@ -54,5 +55,6 @@ export interface TemplateContextMapperProps {
     setFileName?: (name: string) => void;
     hideDeviceContainerInPreview?: boolean;
     maxCharLimit?: number;
+    onDefaultVariableSelect?: (variable: VariableV3) => void;
 }
 export declare const TemplateContextMapper: React.FC<TemplateContextMapperProps>;

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

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

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

@@ -1,3 +1,4 @@
+import { VariableV3 } from "../../../helpers";
 import React, { LegacyRef } from 'react';
 import Slider from 'react-slick';
 import { VariableListInterfaceV2 } from "../../add-variableV2";
@@ -74,6 +75,7 @@ export declare const TemplateModalContext: React.Context<{
     setCtaOptionsErrors?: React.Dispatch<React.SetStateAction<{
         [key: string]: string;
     }>> | undefined;
+    onDefaultVariableSelect?: ((variable: VariableV3) => void) | undefined;
 }>;
 export declare const useTemplateModalContext: () => {
     hideFooterButton: boolean;
@@ -140,4 +142,5 @@ export declare const useTemplateModalContext: () => {
     setCtaOptionsErrors?: React.Dispatch<React.SetStateAction<{
         [key: string]: string;
     }>> | undefined;
+    onDefaultVariableSelect?: ((variable: VariableV3) => void) | undefined;
 };

package/dist/cjs/components/template-context-mapper/modalElements/Body.js

@@ -1,17 +1,17 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");require("../../curtain/CurtainHelper.js");var t=require("../../variable-picker-v3/model.js"),a=require("lodash"),i=require("react"),l=require("styled-components"),o=require("../../carousel-preview/CarouselPreview.js"),r=require("./EditWhatsAppCarouselTemplateV2.js"),s=require("../../template-preview/models/Channels.js"),n=require("../../TypographyStyle.js"),d=require("../../variable-picker-v3/VariablePicker.js"),p=require("../../../constants/Theme.js"),c=require("../context/templateModalContext.js"),u=require("../utils/constants.js"),h=require("../utils/getVariableNameEmail.js"),m=require("../utils/highlightFor.js"),C=require("./DesktopPreview.js"),v=require("./EditWhatsAppTemplateV2.js"),w=require("./MobilePreview.js"),P=require("./VariableConnectorsPanel.js");function x(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var b=x(l);const g=b.default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");require("../../curtain/CurtainHelper.js");var a=require("../../variable-picker-v3/model.js"),t=require("lodash"),i=require("react"),l=require("styled-components"),o=require("../../carousel-preview/CarouselPreview.js"),r=require("./EditWhatsAppCarouselTemplateV2.js"),s=require("../../template-preview/models/Channels.js"),n=require("../../TypographyStyle.js"),d=require("../../variable-picker-v3/VariablePicker.js"),c=require("../../../constants/Theme.js"),p=require("../context/templateModalContext.js"),u=require("../utils/constants.js"),h=require("../utils/getVariableNameEmail.js"),m=require("../utils/highlightFor.js"),C=require("./DesktopPreview.js"),v=require("./EditWhatsAppTemplateV2.js"),w=require("./MobilePreview.js"),P=require("./VariableConnectorsPanel.js");function b(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var x=b(l);const f=x.default.div`
 	display: flex;
 	//	height: 100%;
-`,E=b.default.div`
+`,g=x.default.div`
 	max-width: 450px;
 	max-width: ${e=>e.channel===s.CHANNEL_TYPE.EMAIL?"400px":"450px"};
 
 	height: ${e=>e.channel===s.CHANNEL_TYPE.WHATSAPP?"500px":"475px"};
 	overflow-y: auto;
 	padding-bottom: 24px;
-	border-left: ${p.COLORS.stroke.primary} 1px solid;
-	border-top: ${e=>e.isWhatsappCarousel?`${p.COLORS.stroke.primary} 1px solid`:void 0};
+	border-left: ${c.COLORS.stroke.primary} 1px solid;
+	border-top: ${e=>e.isWhatsappCarousel?`${c.COLORS.stroke.primary} 1px solid`:void 0};
 	${e=>!e.showVariableMapping&&"width: 340px; height: 500px"};
-`,f=b.default.div`
+`,E=x.default.div`
 	padding: ${e=>e.isWhatsappCarousel?void 0:e.showOnlyContent?"16px 14px":"16px 32px"};
 	flex: 1;
 	height: ${e=>e.isWhatsappCarousel||e.hideDeviceContainerInPreview?"500px":"475px"};
@@ -19,4 +19,4 @@
 	background-image: ${e=>e.hideDeviceContainerInPreview&&e.channel===s.CHANNEL_TYPE.WHATSAPP?`url(${u.BACKGROUND_PREVIEW_IMAGE});`:"none"};
 	display: ${e=>e.hideDeviceContainerInPreview&&e.channel===s.CHANNEL_TYPE.WHATSAPP?"flex":"initial"};
 	align-items: flex-start;
-`;exports.default=l=>{const{showVariableMapping:u,showOnlyContent:x,whatsappSpecificPickerMeta:b,showVariableModal:j,discountCode:A,setDiscountCode:y,variableListForImage:N,showSampleValues:T,variableListFromProps:S,fileName:L,setFileName:k}=l,M=i.useRef(),V=i.useRef(),{variableList:_,setVariableList:H,variableCallback:q,showVariablePicker:O,setShowVariablePicker:W,device:I,display_content:D,channel:F,template:Y,setTemplate:B,isWhatsappCarousel:$,isProductCarouselType:R,hideDeviceContainerInPreview:G}=c.useTemplateModalContext();const K=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e.jsxs(g,{children:[e.jsx(f,Object.assign({showOnlyContent:x,showVariableMapping:u,isWhatsappCarousel:$,hideDeviceContainerInPreview:G,channel:F},{children:"mobile"===I?e.jsx(w.default,{ref:V,display_content:null!=D?D:"",channel:F,template:Y,showSampleValues:T}):F===s.CHANNEL_TYPE.WHATSAPP&&$?e.jsx(o.CarouselPreview,{ref:M,channel:F,template:Y,showSampleValues:T,isPreview:!1,showArrows:!0}):F!==s.CHANNEL_TYPE.MESSAGE?e.jsx(C.default,{ref:M,channel:F,display_content:null!=D?D:"",showSampleValues:T}):e.jsx(e.Fragment,{})})),(R||u)&&e.jsxs(E,Object.assign({channel:F,isWhatsappCarousel:$,showVariableMapping:!0},{children:[e.jsx("div",Object.assign({style:{height:"100%",width:"whatsapp"===F?428:400,display:O?"block":"none"}},{children:e.jsx(d.VariablePicker,{hideHeaderCross:!0,showHeader:!0,showBackButton:!0,onBackButtonClick:()=>{H(a.cloneDeep(S)),W(!1)},onSelect:e=>{q(e),H(a.cloneDeep(S)),W(!1)},type:t.PickerType.EMBEDDED,data:null!=_?_:[]},Math.random())})),e.jsx("div",Object.assign({style:{padding:"16px 14px",width:"whatsapp"===F?428:400,display:O?"none":"block"}},{children:F!==s.CHANNEL_TYPE.WHATSAPP?e.jsx(P.default,{onFocus:F===s.CHANNEL_TYPE.EMAIL?function(e){var t,a,i;const l=null===document||void 0===document?void 0:document.getElementById("mobile"===I?"template_html_mobile":"template_html_desktop"),o=h.getVariableNameForEmailByIndex(e+1),r=F===s.CHANNEL_TYPE.EMAIL?null===(t=null==l?void 0:l.contentWindow)||void 0===t?void 0:t.document.getElementById(o):document.getElementById(o),n=K(r),d=null==r?void 0:r.offsetLeft;"desktop"===I?n&&M.current&&(null===(a=null==l?void 0:l.contentWindow)||void 0===a||a.scrollTo(null!=d?d:0,n),m.highlightFor(o,p.COLORS.background.warning.light,2,F,I)):n&&V.current&&(null===(i=null==l?void 0:l.contentWindow)||void 0===i||i.scrollTo(null!=d?d:0,n),m.highlightFor(o,p.COLORS.background.warning.light,2,F,I))}:void 0,showVariableModal:j,discountCode:A,setDiscountCode:y}):F===s.CHANNEL_TYPE.WHATSAPP&&$?e.jsx(r.default,{whatsappSpecificPickerMeta:b,template:Y,showVariableModal:j,variableListForImage:N,discountCode:A,setDiscountCode:y}):e.jsx(v.default,{whatsappSpecificPickerMeta:b,template:Y,onTemplateChange:e=>{null==B||B(e)},showVariableModal:j,variableListForImage:N,discountCode:A,setDiscountCode:y,fileName:L,setFileName:k})}))]})),[s.CHANNEL_TYPE.WHATSAPP,s.CHANNEL_TYPE.SMS].includes(F)&&!u&&!R&&e.jsx(E,{children:e.jsx(n.BodySecondary,Object.assign({color:p.COLORS.content.secondary,style:{fontStyle:"italic"}},{children:"Click on ‘Select template’ below to use it"}))})]})};
+`;exports.default=l=>{const{showVariableMapping:u,showOnlyContent:b,whatsappSpecificPickerMeta:x,showVariableModal:j,discountCode:A,setDiscountCode:y,variableListForImage:N,showSampleValues:S,variableListFromProps:T,fileName:L,setFileName:k}=l,V=i.useRef(),M=i.useRef(),{variableList:_,setVariableList:H,variableCallback:q,showVariablePicker:O,setShowVariablePicker:W,device:D,display_content:I,channel:F,template:Y,setTemplate:B,isWhatsappCarousel:$,isProductCarouselType:R,hideDeviceContainerInPreview:G,onDefaultVariableSelect:K}=p.useTemplateModalContext();const U=e=>{let a=0;for(;e;)a+=e.offsetTop,e=e.offsetParent;return a};return e.jsxs(f,{children:[e.jsx(E,Object.assign({showOnlyContent:b,showVariableMapping:u,isWhatsappCarousel:$,hideDeviceContainerInPreview:G,channel:F},{children:"mobile"===D?e.jsx(w.default,{ref:M,display_content:null!=I?I:"",channel:F,template:Y,showSampleValues:S}):F===s.CHANNEL_TYPE.WHATSAPP&&$?e.jsx(o.CarouselPreview,{ref:V,channel:F,template:Y,showSampleValues:S,isPreview:!1,showArrows:!0}):F!==s.CHANNEL_TYPE.MESSAGE?e.jsx(C.default,{ref:V,channel:F,display_content:null!=I?I:"",showSampleValues:S}):e.jsx(e.Fragment,{})})),(R||u)&&e.jsxs(g,Object.assign({channel:F,isWhatsappCarousel:$,showVariableMapping:!0},{children:[e.jsx("div",Object.assign({style:{height:"100%",width:"whatsapp"===F?428:400,display:O?"block":"none"}},{children:e.jsx(d.VariablePicker,{hideHeaderCross:!0,showHeader:!0,showBackButton:!0,onBackButtonClick:()=>{H(t.cloneDeep(T)),W(!1)},onSelect:e=>{q(e),H(t.cloneDeep(T)),W(!1)},type:a.PickerType.EMBEDDED,data:null!=_?_:[],onDefaultVariableSelect:K},Math.random())})),e.jsx("div",Object.assign({style:{padding:"16px 14px",width:"whatsapp"===F?428:400,display:O?"none":"block"}},{children:F!==s.CHANNEL_TYPE.WHATSAPP?e.jsx(P.default,{onFocus:F===s.CHANNEL_TYPE.EMAIL?function(e){var a,t,i;const l=null===document||void 0===document?void 0:document.getElementById("mobile"===D?"template_html_mobile":"template_html_desktop"),o=h.getVariableNameForEmailByIndex(e+1),r=F===s.CHANNEL_TYPE.EMAIL?null===(a=null==l?void 0:l.contentWindow)||void 0===a?void 0:a.document.getElementById(o):document.getElementById(o),n=U(r),d=null==r?void 0:r.offsetLeft;"desktop"===D?n&&V.current&&(null===(t=null==l?void 0:l.contentWindow)||void 0===t||t.scrollTo(null!=d?d:0,n),m.highlightFor(o,c.COLORS.background.warning.light,2,F,D)):n&&M.current&&(null===(i=null==l?void 0:l.contentWindow)||void 0===i||i.scrollTo(null!=d?d:0,n),m.highlightFor(o,c.COLORS.background.warning.light,2,F,D))}:void 0,showVariableModal:j,discountCode:A,setDiscountCode:y}):F===s.CHANNEL_TYPE.WHATSAPP&&$?e.jsx(r.default,{whatsappSpecificPickerMeta:x,template:Y,showVariableModal:j,variableListForImage:N,discountCode:A,setDiscountCode:y}):e.jsx(v.default,{whatsappSpecificPickerMeta:x,template:Y,onTemplateChange:e=>{null==B||B(e)},showVariableModal:j,variableListForImage:N,discountCode:A,setDiscountCode:y,fileName:L,setFileName:k})}))]})),[s.CHANNEL_TYPE.WHATSAPP,s.CHANNEL_TYPE.SMS].includes(F)&&!u&&!R&&e.jsx(g,{children:e.jsx(n.BodySecondary,Object.assign({color:c.COLORS.content.secondary,style:{fontStyle:"italic"}},{children:"Click on ‘Select template’ below to use it"}))})]})};

package/dist/cjs/components/template-context-mapper/modalElements/DesktopPreview.js

@@ -17,4 +17,4 @@
 	height: 6px;
 	background: #d9d9d9;
 	border-radius: 3px;
-`,h=d.default.forwardRef(((r,t)=>{let{display_content:s,showSampleValues:l}=r;return e.jsxs(n,Object.assign({ref:t},{children:[e.jsxs(u,{children:[e.jsx(m,{}),e.jsx(m,{}),e.jsx(m,{})]}),e.jsx("div",{children:s?e.jsx(a.TemplatePreview,{showSampleValues:l,channel:p.CHANNEL_TYPE.EMAIL,hideHeader:!0,emailSpecificMeta:{emailDisplayContent:s,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_desktop",containerStyle:{height:441},templateContainerStyles:{height:"100%"}}}):e.jsx("div",Object.assign({style:{padding:20}},{children:e.jsx(i.Spinner,{size:"small"})}))})]}))}));h.displayName="DesktopPreview",exports.default=h;
+`,h=d.default.forwardRef(((r,t)=>{let{display_content:s,showSampleValues:l}=r;return e.jsxs(n,Object.assign({ref:t},{children:[e.jsxs(u,{children:[e.jsx(m,{}),e.jsx(m,{}),e.jsx(m,{})]}),e.jsx("div",{children:s?e.jsx(a.TemplatePreview,{showSampleValues:l,channel:p.CHANNEL_TYPE.EMAIL,hideHeader:!0,emailSpecificMeta:{emailDisplayContent:s,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_desktop",containerStyle:{height:441},templateContainerStyles:{height:"100%"}},hidePointerEvents:!0}):e.jsx("div",Object.assign({style:{padding:20}},{children:e.jsx(i.Spinner,{size:"small"})}))})]}))}));h.displayName="DesktopPreview",exports.default=h;

package/dist/cjs/components/template-context-mapper/modalElements/MobilePreview.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("styled-components"),a=require("../../template-preview/TemplatePreview.js");require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js"),require("../../../constants/Theme.js"),require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js");var r=require("../../template-preview/models/WhatsAppTemplate.js"),s=require("../context/templateModalContext.js"),l=require("../utils/getPreviewDimension.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=o(t),n=o(i);const c=n.default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("styled-components"),a=require("../../template-preview/TemplatePreview.js");require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js"),require("../../../constants/Theme.js"),require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js");var r=require("../../template-preview/models/WhatsAppTemplate.js"),s=require("../context/templateModalContext.js"),l=require("../utils/getPreviewDimension.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=o(t),p=o(i);const d=p.default.div`
 	position: relative;
 	height: 100%;
 	border-radius: 31px;
@@ -6,7 +6,7 @@
 	background-color: white;
 	margin: auto;
 	overflow-y: auto;
-`,d=n.default.div`
+`,c=p.default.div`
 	position: absolute;
 	flex: 1;
 	background-color: white;
@@ -17,7 +17,7 @@
 	height: calc(100% - 17px);
 	border-radius: 16px;
 	overflow-y: auto;
-`,h=p.default.forwardRef(((t,i)=>{let{display_content:o,channel:p,template:n,showSampleValues:h}=t;const{pod:u,hideDeviceContainerInPreview:v}=s.useTemplateModalContext(),w={showSampleValues:h,template:n,channel:p,smsSpecificMeta:{smsDisplayContent:o},whatsAppSpecificMeta:{showWhatsAppHeader:!0,whatsAppExtras:u!==r.POD.CHATBOT,containerStyle:{border:"none",borderBottomRightRadius:0,borderBottomLeftRadius:0,minHeight:426,width:240}},size:"small",hideHeader:!0,emailSpecificMeta:{emailDisplayContent:o,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_mobile",containerStyle:{height:"100%",width:"100%"},templateContainerStyles:{height:"100%"}},isPreview:!0};return v?e.jsx(m,{children:e.jsx(a.TemplatePreview,Object.assign({},w))}):e.jsx(e.Fragment,{children:e.jsxs(c,Object.assign({channel:p},{children:[e.jsx("img",{alt:"",src:"https://firebasestorage.googleapis.com/v0/b/staging-bikayi.appspot.com/o/bik%2FkNwEVoGlLpVjOsXoO1M8WgvWicP2%2F6f07b850-8b4b-4d58-96cc-8ba6df7b4e4a-Device___Frame.jpg?alt=media&token=253f1bfe-8481-4f54-bdef-3c0a73697d6a",style:{width:l.getPreviewWidth(p),height:443}}),e.jsx(d,Object.assign({ref:i},{children:e.jsx(a.TemplatePreview,Object.assign({},w))}))]}))})}));h.displayName="MobilePreview";const m=n.default.div`
+`,h=n.default.forwardRef(((t,i)=>{let{display_content:o,channel:n,template:p,showSampleValues:h}=t;const{pod:u,hideDeviceContainerInPreview:v}=s.useTemplateModalContext(),w={showSampleValues:h,template:p,channel:n,smsSpecificMeta:{smsDisplayContent:o},whatsAppSpecificMeta:{showWhatsAppHeader:!0,whatsAppExtras:u!==r.POD.CHATBOT,containerStyle:{border:"none",borderBottomRightRadius:0,borderBottomLeftRadius:0,minHeight:426,width:240}},size:"small",hideHeader:!0,emailSpecificMeta:{emailDisplayContent:o,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_mobile",containerStyle:{height:"100%",width:"100%"},templateContainerStyles:{height:"100%"}},isPreview:!0,hidePointerEvents:!0};return v?e.jsx(m,{children:e.jsx(a.TemplatePreview,Object.assign({},w))}):e.jsx(e.Fragment,{children:e.jsxs(d,Object.assign({channel:n},{children:[e.jsx("img",{alt:"",src:"https://firebasestorage.googleapis.com/v0/b/staging-bikayi.appspot.com/o/bik%2FkNwEVoGlLpVjOsXoO1M8WgvWicP2%2F6f07b850-8b4b-4d58-96cc-8ba6df7b4e4a-Device___Frame.jpg?alt=media&token=253f1bfe-8481-4f54-bdef-3c0a73697d6a",style:{width:l.getPreviewWidth(n),height:443}}),e.jsx(c,Object.assign({ref:i},{children:e.jsx(a.TemplatePreview,Object.assign({},w))}))]}))})}));h.displayName="MobilePreview";const m=p.default.div`
 	display: flex;
 	align-items: center;
 	justify-content: center;

package/dist/cjs/components/template-preview/EmailTemplateThumbnailPreview.d.ts

@@ -11,5 +11,6 @@ declare const EmailTemplateThumbnailPreview: React.FC<{
     emailHtmlContainerId?: string;
     emailDisplayContent?: string;
     applyBorderBottom?: boolean;
+    hidePointerEvents?: boolean;
 }>;
 export default EmailTemplateThumbnailPreview;

package/dist/cjs/components/template-preview/EmailTemplateThumbnailPreview.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../button/Button.js"),a=require("../TypographyStyle.js"),n=require("./EmailTemplatePreview.styled.js");const s="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c";exports.DEFAULT_IMAGE=s,exports.default=r=>{let{template:o,handleViewTemplate:i,hideHeader:l,hideViewButton:p,containerStyle:d,emailHtmlContainerId:c,emailDisplayContent:u,applyBorderBottom:m}=r;return e.jsxs(n.EmailContainer,Object.assign({hideHeader:l,style:Object.assign({},null!=d?d:{})},{children:[!l&&e.jsx(n.Header,{children:e.jsx(a.TitleRegular,Object.assign({style:{maxWidth:"100%"}},{children:o.name}))}),e.jsx(n.IframeContainer,Object.assign({applyBorderBottom:m},{children:u?e.jsx("iframe",{title:"Email template preview",id:null!=c?c:"",width:"100%",srcDoc:(x=u,x.replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##orderProducts}}<\/span><span>\s*<\/span>/g,"").replace(/src="<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{product.photoUrl}}<\/span><span> <\/span>"/g,`src=${s}`).replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/orderProducts}}<\/span><span>\s*<\/span>/g,"").replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##abandonedCartProducts}}<\/span><span>\s*<\/span>/g,"").replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/abandonedCartProducts}}<\/span><span>\s*<\/span>/g,"")),height:"100%",style:{pointerEvents:"none"}}):e.jsx(n.ImageContainer,Object.assign({hideHeader:l},{children:e.jsx(n.CardLoadingContainer,{})}))})),!p&&e.jsx(n.ViewButton,{children:e.jsx(t.Button,{buttonType:"tertiary",buttonText:"View",onClick:()=>{i&&i()}})})]}));var x};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../button/Button.js"),a=require("../TypographyStyle.js"),n=require("./EmailTemplatePreview.styled.js");const s="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c";exports.DEFAULT_IMAGE=s,exports.default=r=>{let{template:o,handleViewTemplate:i,hideHeader:l,hideViewButton:p,containerStyle:d,emailHtmlContainerId:c,emailDisplayContent:u,applyBorderBottom:m,hidePointerEvents:h}=r;return e.jsxs(n.EmailContainer,Object.assign({hideHeader:l,style:Object.assign({},null!=d?d:{})},{children:[!l&&e.jsx(n.Header,{children:e.jsx(a.TitleRegular,Object.assign({style:{maxWidth:"100%"}},{children:o.name}))}),e.jsx(n.IframeContainer,Object.assign({applyBorderBottom:m},{children:u?e.jsx("iframe",{title:"Email template preview",id:null!=c?c:"",width:"100%",srcDoc:(x=u,x.replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##orderProducts}}<\/span><span>\s*<\/span>/g,"").replace(/src="<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{product.photoUrl}}<\/span><span> <\/span>"/g,`src=${s}`).replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/orderProducts}}<\/span><span>\s*<\/span>/g,"").replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##abandonedCartProducts}}<\/span><span>\s*<\/span>/g,"").replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/abandonedCartProducts}}<\/span><span>\s*<\/span>/g,"")),height:"100%",style:{pointerEvents:h?void 0:"none"}}):e.jsx(n.ImageContainer,Object.assign({hideHeader:l},{children:e.jsx(n.CardLoadingContainer,{})}))})),!p&&e.jsx(n.ViewButton,{children:e.jsx(t.Button,{buttonType:"tertiary",buttonText:"View",onClick:()=>{i&&i()}})})]}));var x};

package/dist/cjs/components/template-preview/TemplatePreview.d.ts

@@ -21,5 +21,6 @@ export interface TemplatePreviewProps {
     isWhatsappCarousel?: boolean;
     isPreview?: boolean;
     applyBorderBottom?: boolean;
+    hidePointerEvents?: boolean;
 }
-export declare const TemplatePreview: ({ template, channel, whatsAppSpecificMeta, templateCreationsInfo, hideHeader, size, onlyTemplateContent, emailSpecificMeta, smsSpecificMeta, showSampleValues, carouselCardIndex, isWhatsappCarousel, isPreview, applyBorderBottom, }: TemplatePreviewProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TemplatePreview: ({ template, channel, whatsAppSpecificMeta, templateCreationsInfo, hideHeader, size, onlyTemplateContent, emailSpecificMeta, smsSpecificMeta, showSampleValues, carouselCardIndex, isWhatsappCarousel, isPreview, applyBorderBottom, hidePointerEvents, }: TemplatePreviewProps) => import("react/jsx-runtime").JSX.Element;

package/dist/cjs/components/template-preview/TemplatePreview.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("../template-context-mapper/context/templateModalContext.js"),t=require("../../utils/StringUtils.js"),a=require("../../constants/Theme.js"),i=require("../TypographyStyle.js"),n=require("./EmailTemplateThumbnailPreview.js"),r=require("./models/Channels.js"),s=require("./SmsTemplatePreview.js"),o=require("./WhatsAppTemplatePreview.js");const d={WhatsAppWrapper:{backgroundColor:a.COLORS.surface.standard,borderRadius:4,border:`1px solid ${a.COLORS.background.inactive}`,marginTop:16}};exports.TemplatePreview=p=>{let{template:u,channel:m,whatsAppSpecificMeta:c,templateCreationsInfo:v,hideHeader:h,size:j,onlyTemplateContent:C,emailSpecificMeta:g,smsSpecificMeta:S,showSampleValues:y,carouselCardIndex:b,isWhatsappCarousel:x,isPreview:T,applyBorderBottom:O}=p;var w,P;const{setSelectedCarouselIndex:H}=l.useTemplateModalContext();return m===r.CHANNEL_TYPE.SMS?e.jsx("div",Object.assign({style:Object.assign({marginTop:v?16:0,border:v?`1px solid ${a.COLORS.stroke.primary}`:"none",borderRadius:4},null==S?void 0:S.templateContainerStyles)},{children:e.jsx(s.default,{template:u,hideHeader:h,onlyTemplateContent:C,size:null!=j?j:"large",variableStore:null==S?void 0:S.smsVariableStore,display_content:null==S?void 0:S.smsDisplayContent,uniqueId:null==S?void 0:S.uniqueId})})):m===r.CHANNEL_TYPE.EMAIL?e.jsx("div",Object.assign({style:Object.assign({marginTop:v?16:0},null==g?void 0:g.templateContainerStyles)},{children:e.jsx(n.default,{template:u,handleViewTemplate:()=>{var e;null===(e=null==g?void 0:g.handleViewTemplate)||void 0===e||e.call(g)},hideHeader:h,hideViewButton:null==g?void 0:g.hideViewButtonForEmail,containerStyle:null==g?void 0:g.containerStyle,emailDisplayContent:null==g?void 0:g.emailDisplayContent,emailHtmlContainerId:null==g?void 0:g.emailHtmlContainerId,applyBorderBottom:O})})):m===r.CHANNEL_TYPE.WHATSAPP?e.jsxs("div",Object.assign({style:Object.assign(Object.assign({},null==c?void 0:c.templateContainerStyles),v?d.WhatsAppWrapper:{}),onClick:()=>{var e,l;if(H&&x){if(-1===b&&!(null===(l=null===(e=null==u?void 0:u.mapping)||void 0===e?void 0:e.body)||void 0===l?void 0:l.length))return;H(null!=b?b:-1)}}},{children:[v?e.jsx("div",Object.assign({style:{padding:16}},{children:e.jsx(i.TitleRegular,{children:t.default.convertToTitleCase(null!==(w=null==u?void 0:u.label)&&void 0!==w?w:"")})})):e.jsx(e.Fragment,{}),e.jsx(o.default,{showSampleValues:y,showHeader:null==c?void 0:c.showWhatsAppHeader,extras:null==c?void 0:c.whatsAppExtras,template:u,size:v?"small":null!=j?j:"large",containerStyle:Object.assign(Object.assign({borderWidth:v?0:1,borderTopWidth:1},null!==(P=null==c?void 0:c.containerStyle)&&void 0!==P?P:{}),{height:"100%"}),zeroStateComponent:null==c?void 0:c.zeroStateComponent,usePlaceHolderName:null==c?void 0:c.usePlaceHolderName,carouselCardIndex:b,isWhatsappCarousel:x,isPreview:T})]})):e.jsx(e.Fragment,{})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("../template-context-mapper/context/templateModalContext.js"),t=require("../../utils/StringUtils.js"),a=require("../../constants/Theme.js"),i=require("../TypographyStyle.js"),n=require("./EmailTemplateThumbnailPreview.js"),r=require("./models/Channels.js"),s=require("./SmsTemplatePreview.js"),o=require("./WhatsAppTemplatePreview.js");const d={WhatsAppWrapper:{backgroundColor:a.COLORS.surface.standard,borderRadius:4,border:`1px solid ${a.COLORS.background.inactive}`,marginTop:16}};exports.TemplatePreview=p=>{let{template:u,channel:m,whatsAppSpecificMeta:c,templateCreationsInfo:v,hideHeader:h,size:j,onlyTemplateContent:C,emailSpecificMeta:g,smsSpecificMeta:S,showSampleValues:y,carouselCardIndex:b,isWhatsappCarousel:x,isPreview:T,applyBorderBottom:O,hidePointerEvents:w}=p;var P,H;const{setSelectedCarouselIndex:f}=l.useTemplateModalContext();return m===r.CHANNEL_TYPE.SMS?e.jsx("div",Object.assign({style:Object.assign({marginTop:v?16:0,border:v?`1px solid ${a.COLORS.stroke.primary}`:"none",borderRadius:4},null==S?void 0:S.templateContainerStyles)},{children:e.jsx(s.default,{template:u,hideHeader:h,onlyTemplateContent:C,size:null!=j?j:"large",variableStore:null==S?void 0:S.smsVariableStore,display_content:null==S?void 0:S.smsDisplayContent,uniqueId:null==S?void 0:S.uniqueId})})):m===r.CHANNEL_TYPE.EMAIL?e.jsx("div",Object.assign({style:Object.assign({marginTop:v?16:0},null==g?void 0:g.templateContainerStyles)},{children:e.jsx(n.default,{template:u,handleViewTemplate:()=>{var e;null===(e=null==g?void 0:g.handleViewTemplate)||void 0===e||e.call(g)},hideHeader:h,hideViewButton:null==g?void 0:g.hideViewButtonForEmail,containerStyle:null==g?void 0:g.containerStyle,emailDisplayContent:null==g?void 0:g.emailDisplayContent,emailHtmlContainerId:null==g?void 0:g.emailHtmlContainerId,applyBorderBottom:O,hidePointerEvents:w})})):m===r.CHANNEL_TYPE.WHATSAPP?e.jsxs("div",Object.assign({style:Object.assign(Object.assign({},null==c?void 0:c.templateContainerStyles),v?d.WhatsAppWrapper:{}),onClick:()=>{var e,l;if(f&&x){if(-1===b&&!(null===(l=null===(e=null==u?void 0:u.mapping)||void 0===e?void 0:e.body)||void 0===l?void 0:l.length))return;f(null!=b?b:-1)}}},{children:[v?e.jsx("div",Object.assign({style:{padding:16}},{children:e.jsx(i.TitleRegular,{children:t.default.convertToTitleCase(null!==(P=null==u?void 0:u.label)&&void 0!==P?P:"")})})):e.jsx(e.Fragment,{}),e.jsx(o.default,{showSampleValues:y,showHeader:null==c?void 0:c.showWhatsAppHeader,extras:null==c?void 0:c.whatsAppExtras,template:u,size:v?"small":null!=j?j:"large",containerStyle:Object.assign(Object.assign({borderWidth:v?0:1,borderTopWidth:1},null!==(H=null==c?void 0:c.containerStyle)&&void 0!==H?H:{}),{height:"100%"}),zeroStateComponent:null==c?void 0:c.zeroStateComponent,usePlaceHolderName:null==c?void 0:c.usePlaceHolderName,carouselCardIndex:b,isWhatsappCarousel:x,isPreview:T})]})):e.jsx(e.Fragment,{})};

package/dist/cjs/components/variable-picker-v3/Content.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),s=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_back.svg.js"),a=require("../../assets/icons/cross.svg.js"),i=require("../../assets/icons/plus.svg.js"),l=require("../../assets/icons/triangle_error.svg.js"),n=require("react"),r=require("../../constants/Theme.js"),o=require("../accordion/Accordion.js"),c=require("../icon-button/IconButton.js"),d=require("../input/Input.js"),u=require("../list-item/ListItem.js"),h=require("../switch/Switch.js"),b=require("../tooltips/Tooltip.js"),j=require("../TypographyStyle.js"),g=require("./context.js"),p=require("./NoResult.js"),x=require("./recommendVaribles.js"),y=require("./searchVariables.js"),m=require("./styles.js"),O=require("./SubHeaderItems.js");const v=(e,t)=>{if(0===t.length)return e;const a=e.toLowerCase().indexOf(t.toLowerCase());if(-1===a)return e;const i=e.slice(0,a),l=e.slice(a,a+t.length),n=e.slice(a+t.length);return s.jsxs("span",{children:[i,s.jsx("b",Object.assign({style:{color:r.COLORS.content.primary}},{children:l})),n]})},f=/.*\..*/,S=e=>{if(e.actualValue.match(f)){const s=e.actualValue.replace("{{","").replace("}}","").split(".");let t=s[0];return s.forEach(((e,s)=>{if(0===s)return;const a=(e=>/\w+\[\d+\]/g.test(e))(e);if(a){const s=e.match(/(\w+)\[(\d+)\]/);if(s){const e=s[1],a=s[2];t+=`['${e}'][${a}]`}}else t+=`['${e}']`})),t}return e.actualValueEval?e.actualValueEval:e.actualValue};exports.VariablePickerContent=f=>{const{data:C,onSelect:w,showHeader:R,showBackButton:V,hideHeaderCross:k,onBackButtonClick:q,isEvaluationList:T,autoOpenFirst:B,headerText:L}=f,[I,N]=n.useState(C),[_,H]=n.useState(""),[P,E]=n.useState([]),[$,A]=n.useState(""),[F,W]=n.useState(!1),[z,D]=n.useState([]);n.useEffect((()=>{K(!0)}),[]),n.useEffect((()=>{P.length>0?D([P[P.length-1]]):D(C)}),[P]);const K=s=>e.__awaiter(void 0,void 0,void 0,(function*(){if(W(s),s){const e=x.showOnlyRecommendedVariables(I,P);N(e)}else if(P.length>0){const e=$==P[P.length-1].displayName;if(_.length>0&&e){const e=y.searchVariables(_,z,P);N(e)}else N([P[P.length-1].variables])}else if(_.length>0){const e=y.searchVariables(_,z,P);N(e)}else N(C)})),M=()=>{let e=131;return P.length>0&&(e+=32),(f.showHeader||f.showBackButton)&&(e+=40),`calc(100% - ${e}px)`};return s.jsx(g.VariablePickerContext.Provider,Object.assign({value:{variables:I,searchText:_,subHeaderStack:P,showRecommended:F,setSubHeaderStack:E,setSearchText:H,setVariables:N,setShowRecommended:W}},{children:s.jsxs("div",Object.assign({tabIndex:-1,id:"variable-picker-v3",style:{backgroundColor:"white",borderRadius:4,height:"100%",outline:"none"},onClick:e=>e.stopPropagation()},{children:[(R||V)&&s.jsxs(m.HeaderWrapper,{children:[s.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:8}},{children:[V&&s.jsx(c.IconButton,{Icon:()=>s.jsx(t.default,{width:16,height:16,style:{display:"flex",color:r.COLORS.content.primary}}),onClick:q}),R&&s.jsx(j.TitleRegular,{children:null!=L?L:"Select Variable"})]})),!k&&s.jsx(c.IconButton,{style:{color:"#212121"},Icon:a.default,onClick:()=>f.onClose&&f.onClose()})]}),s.jsx("div",Object.assign({style:{padding:"0 16px",paddingTop:12,backgroundColor:r.COLORS.surface.subdued,borderTopLeftRadius:4,borderTopRightRadius:4}},{children:s.jsx(d.Input,{id:"search-bar-v3-picker",onBlur:e=>{f.onSearchBlur&&f.onSearchBlur(e)},value:_,noKeyDownChange:!0,placeholder:"Search",onChangeText:e=>{e||A("");const s=y.searchVariables(e,z,P);if(F){const e=x.showOnlyRecommendedVariables(s,P);N(e)}else N(s);H(e);const t=P.length>0?P[P.length-1].displayName:"home";A(t)}})})),s.jsxs(m.RecommendWrapper,{children:[s.jsx(j.BodySecondary,Object.assign({style:{color:r.COLORS.content.secondary}},{children:"Only Recommended"})),s.jsx(h.Switch,{value:F,onValueChange:s=>e.__awaiter(void 0,void 0,void 0,(function*(){yield K(s)}))})]}),P.length>0&&s.jsxs(m.BackHeader,{children:[s.jsx("div",Object.assign({style:{position:"absolute",left:16}},{children:s.jsx(c.IconButton,{id:"back-btn-v3",style:{display:"flex"},Icon:()=>s.jsx(t.default,{width:12,height:12,style:{color:r.COLORS.content.secondary}}),onClick:e=>{e.stopPropagation();let s=_;const t=[...P],a=t.pop();if(E(t),a.displayName===$&&(H(""),s=""),s.length>0){const e=t.length>0?[t[t.length-1]]:C,a=y.searchVariables(s,e,t);if(F){const e=x.showOnlyRecommendedVariables(a,t);N(e)}else N(a)}else if(t.length>0)if(F){const e=x.showOnlyRecommendedVariables([t[t.length-1].variables],t);N(e)}else N([t[t.length-1].variables]);else if(F){const e=x.showOnlyRecommendedVariables(C,P);N(e)}else N(C)}})})),s.jsx(j.BodyCaption,Object.assign({style:{color:r.COLORS.content.secondary}},{children:P[P.length-1].displayName}))]}),s.jsx(s.Fragment,{children:I.length>0?s.jsx(m.Container,Object.assign({height:M()},{children:I.map(((e,t)=>{var a,n;return e.displayName&&void 0!==e.variables?s.jsx("div",Object.assign({style:{borderBottom:`1px solid ${r.COLORS.stroke.primary}`}},{children:s.jsx(o.BikAccordion,Object.assign({autoOpen:B&&0===t,headerPadding:"12px 16px",header:s.jsx(j.TitleSmall,Object.assign({style:{color:r.COLORS.content.secondary}},{children:v(e.displayName,_)}))},{children:s.jsx(O.default,{parentVariable:e,disabled:null!==(a=f.disabled)&&void 0!==a&&a,searchText:_,variable:e.variables,onSelect:w})}))}),e.displayName+F):e.displayName?s.jsx(b.Tooltip,Object.assign({body:O.renderTooltipBody(e),placement:"bottom"},{children:s.jsx(u.ListItem,{variant:f.disabled?"readonly":(null==e?void 0:e.selected)?"selected":"default",version:"2.0",leadingIcon:(null==e?void 0:e.selected)||f.disabled?s.jsx(s.Fragment,{}):s.jsx(i.default,{width:14,height:14}),customListItemLabel:s.jsxs("div",Object.assign({style:{display:"flex",gap:4}},{children:[s.jsx(j.BodySecondary,Object.assign({style:{fontSize:"14px",color:r.COLORS.text.primary}},{children:v(e.displayName,_)})),!e.isAvailable&&s.jsx(b.Tooltip,Object.assign({body:"Not Recommended"},{children:s.jsx("div",Object.assign({style:{display:"flex",marginTop:2}},{children:s.jsx(l.default,{width:16,height:16,color:r.COLORS.content.secondary})}))}))]})),listItem:{label:e.displayName,value:e.displayName},subText:e.description||"",onClick:()=>{if(!f.disabled)if(T){const s=S(e);w(Object.assign(Object.assign({},e),{actualValue:s}))}else w(e)}},t)}),t):s.jsx(O.default,{disabled:null!==(n=f.disabled)&&void 0!==n&&n,searchText:_,variable:e,onSelect:e=>{if(!f.disabled)if(T){const s=S(e);w(Object.assign(Object.assign({},e),{actualValue:s}))}else w(e)}},t)}))})):s.jsx(p.default,{height:M(),searchText:_})})]}))}))},exports.highlightSearchText=v;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),s=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_back.svg.js"),a=require("../../assets/icons/cross.svg.js"),i=require("../../assets/icons/plus.svg.js"),l=require("../../assets/icons/triangle_error.svg.js"),r=require("react"),n=require("../../constants/Theme.js"),o=require("../accordion/Accordion.js"),c=require("../icon-button/IconButton.js"),d=require("../input/Input.js"),u=require("../list-item/ListItem.js"),h=require("../switch/Switch.js"),b=require("../tooltips/Tooltip.js"),j=require("../TypographyStyle.js"),p=require("./context.js"),g=require("./DefaultVariableContent.js"),x=require("./model.js"),y=require("./NoResult.js"),m=require("./recommendVaribles.js"),f=require("./searchVariables.js"),v=require("./styles.js"),O=require("./SubHeaderItems.js");const S=(e,t)=>{if(0===t.length)return e;const a=e.toLowerCase().indexOf(t.toLowerCase());if(-1===a)return e;const i=e.slice(0,a),l=e.slice(a,a+t.length),r=e.slice(a+t.length);return s.jsxs("span",{children:[i,s.jsx("b",Object.assign({style:{color:n.COLORS.content.primary}},{children:l})),r]})},C=/.*\..*/;exports.VariablePickerContent=V=>{const{data:w,onSelect:R,showHeader:k,showBackButton:q,hideHeaderCross:T,onBackButtonClick:B,isEvaluationList:I,autoOpenFirst:L,headerText:N,contentHeight:D,onDefaultVariableSelect:_}=V,[E,H]=r.useState(w),[P,$]=r.useState(""),[F,A]=r.useState([]),[M,W]=r.useState(""),[z,K]=r.useState(!1),[G,J]=r.useState([]),[Q,U]=r.useState(!1),[X,Y]=r.useState(),Z=Q&&V.type===x.PickerType.EMBEDDED&&!T;r.useEffect((()=>{ee(!0)}),[]),r.useEffect((()=>{F.length>0?J([F[F.length-1]]):J(w)}),[F]);const ee=s=>e.__awaiter(void 0,void 0,void 0,(function*(){if(K(s),s){const e=m.showOnlyRecommendedVariables(E,F);H(e)}else if(F.length>0){const e=M==F[F.length-1].displayName;if(P.length>0&&e){const e=f.searchVariables(P,G,F);H(e)}else H([F[F.length-1].variables])}else if(P.length>0){const e=f.searchVariables(P,G,F);H(e)}else H(w)})),se=()=>{if(D)return D;let e=131;return F.length>0&&(e+=32),(V.showHeader||V.showBackButton)&&(e+=40),`calc(100% - ${e}px)`},te=e=>{if(!V.disabled)if(I){const s=(e=>{if(e.actualValue.match(C)){const s=e.actualValue.replace("{{","").replace("}}","").split(".");let t=s[0];return s.forEach(((e,s)=>{if(0===s)return;const a=(e=>/\w+\[\d+\]/g.test(e))(e);if(a){const s=e.match(/(\w+)\[(\d+)\]/);if(s){const e=s[1],a=s[2];t+=`['${e}'][${a}]`}}else t+=`['${e}']`})),t}return e.actualValueEval?e.actualValueEval:e.actualValue})(e);R(Object.assign(Object.assign({},e),{actualValue:s}))}else{if(e.isDefaultValueSupported)return Y(e),void U(!0);R(e)}};return s.jsx(p.VariablePickerContext.Provider,Object.assign({value:{variables:E,searchText:P,subHeaderStack:F,showRecommended:z,setSubHeaderStack:A,setSearchText:$,setVariables:H,setShowRecommended:K}},{children:s.jsxs("div",Object.assign({tabIndex:-1,id:"variable-picker-v3",style:{backgroundColor:"white",borderRadius:8,height:"100%",outline:"none"},onClick:e=>e.stopPropagation()},{children:[(k||q||Q)&&s.jsxs(v.HeaderWrapper,Object.assign({openDefault:Q},{children:[s.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:8}},{children:[(q||Q)&&s.jsx(c.IconButton,{Icon:()=>s.jsx(t.default,{width:16,height:16,style:{display:"flex",color:n.COLORS.content.primary}}),onClick:()=>{Q?U(!1):B&&B()}}),(k||Q)&&s.jsx(j.TitleRegular,{children:Q?"Set up":null!=N?N:"Select Variable"})]})),Z&&s.jsx(c.IconButton,{style:{color:"#212121"},Icon:a.default,onClick:()=>V.onClose&&V.onClose()})]})),Q&&X?s.jsx(g.DefaultVariableContent,{variable:X,onInsertVariable:e=>{R(e),null==_||_(e)}}):s.jsxs(s.Fragment,{children:[s.jsx("div",Object.assign({style:{padding:"0 16px",paddingTop:12,backgroundColor:n.COLORS.surface.subdued,borderTopLeftRadius:8,borderTopRightRadius:8}},{children:s.jsx(d.Input,{id:"search-bar-v3-picker",onBlur:e=>{V.onSearchBlur&&V.onSearchBlur(e)},value:P,noKeyDownChange:!0,placeholder:"Search",onChangeText:e=>{e||W("");const s=f.searchVariables(e,G,F);if(z){const e=m.showOnlyRecommendedVariables(s,F);H(e)}else H(s);$(e);const t=F.length>0?F[F.length-1].displayName:"home";W(t)}})})),s.jsxs(v.RecommendWrapper,{children:[s.jsx(j.BodySecondary,Object.assign({style:{color:n.COLORS.content.secondary}},{children:"Only Recommended"})),s.jsx(h.Switch,{value:z,onValueChange:s=>e.__awaiter(void 0,void 0,void 0,(function*(){yield ee(s)}))})]}),F.length>0&&s.jsxs(v.BackHeader,{children:[s.jsx("div",Object.assign({style:{position:"absolute",left:16}},{children:s.jsx(c.IconButton,{id:"back-btn-v3",style:{display:"flex"},Icon:()=>s.jsx(t.default,{width:12,height:12,style:{color:n.COLORS.content.secondary}}),onClick:e=>{e.stopPropagation();let s=P;const t=[...F],a=t.pop();if(A(t),a.displayName===M&&($(""),s=""),s.length>0){const e=t.length>0?[t[t.length-1]]:w,a=f.searchVariables(s,e,t);if(z){const e=m.showOnlyRecommendedVariables(a,t);H(e)}else H(a)}else if(t.length>0)if(z){const e=m.showOnlyRecommendedVariables([t[t.length-1].variables],t);H(e)}else H([t[t.length-1].variables]);else if(z){const e=m.showOnlyRecommendedVariables(w,F);H(e)}else H(w)}})})),s.jsx(j.BodyCaption,Object.assign({style:{color:n.COLORS.content.secondary}},{children:F[F.length-1].displayName}))]}),s.jsx(s.Fragment,{children:E.length>0?s.jsx(v.Container,Object.assign({height:se()},{children:E.map(((e,t)=>{var a,r;return e.displayName&&void 0!==e.variables?s.jsx("div",Object.assign({style:{borderBottom:`1px solid ${n.COLORS.stroke.primary}`}},{children:s.jsx(o.BikAccordion,Object.assign({autoOpen:L&&0===t,headerPadding:"12px 16px",header:s.jsx(j.TitleSmall,Object.assign({style:{color:n.COLORS.content.secondary}},{children:S(e.displayName,P)}))},{children:s.jsx(O.default,{parentVariable:e,disabled:null!==(a=V.disabled)&&void 0!==a&&a,searchText:P,variable:e.variables,onSelect:e=>{if(e.isDefaultValueSupported)return Y(e),void U(!0);R(e)}})}))}),e.displayName+z):e.displayName?s.jsx(b.Tooltip,Object.assign({body:O.renderTooltipBody(e),placement:"bottom"},{children:s.jsx(u.ListItem,{variant:V.disabled?"readonly":(null==e?void 0:e.selected)?"selected":"default",version:"2.0",leadingIcon:(null==e?void 0:e.selected)||V.disabled?s.jsx(s.Fragment,{}):s.jsx("div",Object.assign({style:{flexShrink:0}},{children:s.jsx(i.default,{width:14,height:14})})),customListItemLabel:s.jsxs("div",Object.assign({style:{display:"flex",gap:4}},{children:[s.jsx(j.BodySecondary,Object.assign({style:{fontSize:"14px",color:n.COLORS.text.primary}},{children:S(e.displayName,P)})),!e.isAvailable&&s.jsx(b.Tooltip,Object.assign({body:"Not Recommended"},{children:s.jsx("div",Object.assign({style:{display:"flex",marginTop:2}},{children:s.jsx(l.default,{width:16,height:16,color:n.COLORS.content.secondary})}))}))]})),listItem:{label:e.displayName,value:e.displayName},subText:e.description||"",onClick:()=>te(e)},t)}),t):s.jsx(O.default,{disabled:null!==(r=V.disabled)&&void 0!==r&&r,searchText:P,variable:e,onSelect:e=>te(e)},t)}))})):s.jsx(y.default,{height:se(),searchText:P})})]})]}))}))},exports.highlightSearchText=S;

package/dist/cjs/components/variable-picker-v3/DefaultVariableContent.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { VariableV3 } from './model';
+interface Props {
+    variable: VariableV3;
+    onInsertVariable: (variable: VariableV3) => void;
+}
+export declare const DefaultVariableContent: React.FC<Props>;
+export {};

package/dist/cjs/components/variable-picker-v3/DefaultVariableContent.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),a=require("../button/Button.js"),t=require("../checkBox/CheckBox.js"),s=require("../input/Input.js"),l=require("../TypographyStyle.js");exports.DefaultVariableContent=r=>{var n,d,o;const[u,c]=i.useState(r.variable.defaultValue||""),[x,p]=i.useState(""),[b,g]=i.useState(!!(null===(n=r.variable)||void 0===n?void 0:n.enableDefaultValueForGlobalUsage));return e.jsx(e.Fragment,{children:e.jsxs("div",Object.assign({style:{padding:"0 16px",paddingTop:12,borderTopLeftRadius:8,borderTopRightRadius:8}},{children:[e.jsx("div",Object.assign({style:{paddingBottom:16,borderBottom:"1px solid #E0E0E0"}},{children:e.jsx(l.TitleRegular,{children:null===(d=r.variable)||void 0===d?void 0:d.displayName})})),e.jsxs("div",Object.assign({style:{paddingTop:24}},{children:[e.jsx(s.Input,{onChangeText:e=>{p(""),c(e)},value:u,isRequired:!0,labelText:"Default Value",hintText:"Used if this field is missing for a customer",errorMessage:null!=x?x:"",maxCharLimit:25}),e.jsxs("div",Object.assign({style:{paddingTop:24,gap:8,alignItems:"flex-start"},className:"d-flex"},{children:[e.jsx(t.CheckBox,{isChecked:b,onValueChange:e=>g(e),size:"SMALL"}),e.jsx(l.BodySecondary,Object.assign({style:{marginTop:-2}},{children:`Make this the default value for ‘${null===(o=r.variable)||void 0===o?void 0:o.displayName}’`}))]})),e.jsx("div",Object.assign({style:{padding:"24px 0px",display:"flex",flexDirection:"row",justifyContent:"flex-end"}},{children:e.jsx(a.Button,{buttonText:"Insert Variable",buttonType:"primary",onClick:()=>{if(!u)return void p("This field is required");const e=Object.assign(Object.assign({},r.variable),{defaultValue:u,enableDefaultValueForGlobalUsage:b});r.onInsertVariable(e)}})}))]}))]}))})};

package/dist/cjs/components/variable-picker-v3/SubHeaderItems.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/chevronRight.svg.js"),t=require("../../assets/icons/plus.svg.js"),i=require("../../assets/icons/sub_category.svg.js"),l=require("../../assets/icons/triangle_error.svg.js"),a=require("lodash"),r=require("../../constants/Theme.js"),o=require("../list-item/ListItem.js"),n=require("../tooltips/Tooltip.js"),c=require("../TypographyStyle.js"),d=require("./Content.js"),u=require("./context.js"),j=require("./recommendVaribles.js");const b=e=>{var s;return(null===(s=e.contextQ)||void 0===s?void 0:s.join(" > "))||""};exports.default=h=>{const{onSelect:m,variable:p,searchText:x,disabled:y,parentVariable:g}=h,{subHeaderStack:v,setSubHeaderStack:O,setVariables:f,showRecommended:S}=u.useVariablePickerContext();return e.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:4}},{children:Object.keys(p).map(((u,h)=>{var q;if(void 0===p[u].variables||0===Object.keys((null===(q=p[u])||void 0===q?void 0:q.variables)||{}).length){const s=p[u];return e.jsx(n.Tooltip,Object.assign({body:b(s),placement:"bottom"},{children:e.jsx(o.ListItem,{variant:y?"readonly":(null==s?void 0:s.selected)?"selected":"default",version:"2.0",leadingIcon:(null==s?void 0:s.selected)||y?e.jsx(e.Fragment,{}):e.jsx(t.default,{width:14,height:14}),customListItemLabel:e.jsxs("div",Object.assign({style:{display:"flex",gap:4}},{children:[e.jsx(c.BodySecondary,Object.assign({style:{fontSize:"14px",color:r.COLORS.text.primary}},{children:d.highlightSearchText(s.displayName,x)})),!s.isAvailable&&e.jsx(n.Tooltip,Object.assign({body:"Not Recommended"},{children:e.jsx("div",Object.assign({style:{display:"flex",marginTop:2}},{children:e.jsx(l.default,{width:16,height:16,color:r.COLORS.content.secondary})}))}))]})),listItem:{label:s.displayName,value:s.displayName},subText:s.description||"",onClick:()=>{m(s)}})}),h)}return e.jsx(n.Tooltip,Object.assign({body:b(p[u]),placement:"bottom"},{children:e.jsx(o.ListItem,{variant:"default",version:"2.0",listItem:{label:p[u].displayName,value:p[u].displayName},customListItemLabel:e.jsx("div",Object.assign({style:{display:"flex",alignItems:"center"}},{children:e.jsx(c.BodySecondary,Object.assign({style:{fontSize:"14px",color:r.COLORS.text.primary}},{children:d.highlightSearchText(p[u].displayName,x)}))})),leadingIcon:e.jsx(i.default,{width:14,height:14}),subText:p[u].description||"",trailingIcon:e.jsx(s.default,{width:10,height:10,color:"#212121"}),onClick:()=>{const e=a.cloneDeep(p[u]);void 0!==g&&(e.contextQ=[g.displayName]);const s=[...v,e];if(O(s),S){const t=j.showOnlyRecommendedVariables([e.variables],s);f(t)}else f([e.variables])}})}),h)}))}))},exports.renderTooltipBody=b;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/chevronRight.svg.js"),t=require("../../assets/icons/plus.svg.js"),i=require("../../assets/icons/sub_category.svg.js"),l=require("../../assets/icons/triangle_error.svg.js"),a=require("lodash"),r=require("../../constants/Theme.js"),o=require("../list-item/ListItem.js"),n=require("../tooltips/Tooltip.js"),c=require("../TypographyStyle.js"),d=require("./Content.js"),u=require("./context.js"),j=require("./recommendVaribles.js");const h=e=>{var s;return(null===(s=e.contextQ)||void 0===s?void 0:s.join(" > "))||""};exports.default=x=>{const{onSelect:b,variable:m,searchText:p,disabled:y,parentVariable:g}=x,{subHeaderStack:v,setSubHeaderStack:O,setVariables:f,showRecommended:S}=u.useVariablePickerContext();return e.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:4}},{children:Object.keys(m).map(((u,x)=>{var q;if(void 0===m[u].variables||0===Object.keys((null===(q=m[u])||void 0===q?void 0:q.variables)||{}).length){const s=m[u];return e.jsx(n.Tooltip,Object.assign({body:h(s),placement:"bottom"},{children:e.jsx(o.ListItem,{variant:y?"readonly":(null==s?void 0:s.selected)?"selected":"default",version:"2.0",leadingIcon:(null==s?void 0:s.selected)||y?e.jsx(e.Fragment,{}):e.jsx("div",Object.assign({style:{flexShrink:0}},{children:e.jsx(t.default,{width:14,height:14})})),customListItemLabel:e.jsxs("div",Object.assign({style:{display:"flex",gap:4}},{children:[e.jsx(c.BodySecondary,Object.assign({style:{fontSize:"14px",color:r.COLORS.text.primary}},{children:d.highlightSearchText(s.displayName,p)})),!s.isAvailable&&e.jsx(n.Tooltip,Object.assign({body:"Not Recommended"},{children:e.jsx("div",Object.assign({style:{display:"flex",marginTop:2}},{children:e.jsx(l.default,{width:16,height:16,color:r.COLORS.content.secondary})}))}))]})),listItem:{label:s.displayName,value:s.displayName},subText:s.description||"",onClick:()=>{b(s)}})}),x)}return e.jsx(n.Tooltip,Object.assign({body:h(m[u]),placement:"bottom"},{children:e.jsx(o.ListItem,{variant:"default",version:"2.0",listItem:{label:m[u].displayName,value:m[u].displayName},customListItemLabel:e.jsx("div",Object.assign({style:{display:"flex",alignItems:"center"}},{children:e.jsx(c.BodySecondary,Object.assign({style:{fontSize:"14px",color:r.COLORS.text.primary}},{children:d.highlightSearchText(m[u].displayName,p)}))})),leadingIcon:e.jsx(i.default,{width:14,height:14}),subText:m[u].description||"",trailingIcon:e.jsx(s.default,{width:10,height:10,color:"#212121"}),onClick:()=>{const e=a.cloneDeep(m[u]);void 0!==g&&(e.contextQ=[g.displayName]);const s=[...v,e];if(O(s),S){const t=j.showOnlyRecommendedVariables([e.variables],s);f(t)}else f([e.variables])}})}),x)}))}))},exports.renderTooltipBody=h;

package/dist/cjs/components/variable-picker-v3/model.d.ts

@@ -17,6 +17,8 @@ export interface VariablePickerV3Props {
     disabled?: boolean;
     autoOpenFirst?: boolean;
     headerText?: string;
+    contentHeight?: string;
+    onDefaultVariableSelect?: (variable: VariableV3) => void;
 }
 export interface VariableListInterfaceV3 {
     isSubHeader?: boolean;
@@ -54,4 +56,6 @@ export interface VariableV3 {
         [key: string]: VariableV3;
     };
     needsFetching?: boolean;
+    isDefaultValueSupported?: boolean;
+    enableDefaultValueForGlobalUsage?: boolean;
 }

package/dist/cjs/components/variable-picker-v3/styles.d.ts

@@ -1,4 +1,6 @@
-export declare const HeaderWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const HeaderWrapper: import("styled-components").StyledComponent<"div", any, {
+    openDefault?: boolean | undefined;
+}, never>;
 export declare const RecommendWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const BackHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const Container: import("styled-components").StyledComponent<"div", any, {

package/dist/cjs/components/variable-picker-v3/styles.js

@@ -1,11 +1,11 @@
 "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../constants/Theme.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=r(e);const i=o.default.div`
 	display: flex;
 	align-items: center;
-	padding: 12px 16px 0px 16px;
+	padding: ${e=>e.openDefault?"12px 16px":"12px 16px 0px 16px"};
 	background-color: ${t.COLORS.surface.subdued};
 	justify-content: space-between;
-	border-top-right-radius: 4px;
-	border-top-left-radius: 4px;
+	border-top-right-radius: 8px;
+	border-top-left-radius: 8px;
 `,a=o.default.div`
 	display: flex;
 	justify-content: space-between;
@@ -13,14 +13,14 @@
 	padding: 12px 16px;
 	background-color: ${t.COLORS.surface.subdued};
 	border-bottom: 1px solid ${t.COLORS.stroke.primary};
-`,d=o.default.div`
+`,p=o.default.div`
 	position: relative;
 	display: flex;
 	align-items: center;
 	justify-content: center;
 	height: 32px;
 	background-color: ${t.COLORS.background.base};
-`,p=o.default.div`
+`,d=o.default.div`
 	margin: 8px;
 	display: flex;
 	flex-direction: column;
@@ -39,4 +39,4 @@
 	&::-webkit-scrollbar-thumb:horizontal {
 		width: 8px;
 	}
-`;exports.BackHeader=d,exports.Container=p,exports.HeaderWrapper=i,exports.RecommendWrapper=a;
+`;exports.BackHeader=p,exports.Container=d,exports.HeaderWrapper=i,exports.RecommendWrapper=a;