@bikdotai/bik-component-library 0.0.48-editor.13 → 0.0.48-editor.14

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),r=require("react/jsx-runtime"),n=require("react"),o=require("react-popper"),t=require("../../dropShadow/DropShadow.js"),s=require("../Common.styled.js"),l=require("../OpenedDropdown/components/OpennedDropdown.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const d=i(n).default.forwardRef(((i,d)=>{var{children:p}=i,a=e.__rest(i,["children"]);const u=d,[c,j]=n.useState(!1),[v,f]=n.useState(null),[b,w]=n.useState(null),{styles:O,attributes:x}=o.usePopper(v,b,{});return n.useImperativeHandle(u,(()=>({openDropdown:c})),[]),n.useEffect((()=>{(null==u?void 0:u.current)&&(u.current.openDropdown=c)}),[c]),r.jsxs(r.Fragment,{children:[r.jsxs("div",Object.assign({style:{position:"relative"},ref:f},{children:[r.jsx(s.OverLapAbs,{onClick:e=>{c?e.preventDefault():a.disabled||j(!0)}}),p]})),c&&r.jsx(s.OpenDropdownContainer,Object.assign({ref:w,style:Object.assign(Object.assign({},O.popper),{zIndex:3})},x.popper,{children:r.jsx(t.default,Object.assign({level:"z2",position:"down",style:{borderRadius:4}},{children:r.jsx(l.OpenedDropdown,Object.assign({},a,{onSelect:e=>{var r;null===(r=a.onSelect)||void 0===r||r.call(a,e),j(!1)},onClose:function(){var e;j(!1),null===(e=null==a?void 0:a.onClose)||void 0===e||e.call(a)}}))}))}))]})}));d.displayName="DropdownPopover",exports.DropdownPopover=d;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),r=require("react/jsx-runtime"),n=require("react"),o=require("react-popper"),t=require("../../dropShadow/DropShadow.js"),s=require("../Common.styled.js"),l=require("../OpenedDropdown/components/OpennedDropdown.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const p=i(n).default.forwardRef(((i,p)=>{var{children:a}=i,d=e.__rest(i,["children"]);const u=p,[c,j]=n.useState(!1),[v,f]=n.useState(null),[b,w]=n.useState(null),{styles:O,attributes:x}=o.usePopper(v,b,{placement:d.placement});return n.useImperativeHandle(u,(()=>({openDropdown:c})),[]),n.useEffect((()=>{(null==u?void 0:u.current)&&(u.current.openDropdown=c)}),[c]),r.jsxs(r.Fragment,{children:[r.jsxs("div",Object.assign({style:{position:"relative"},ref:f},{children:[r.jsx(s.OverLapAbs,{onClick:e=>{c?e.preventDefault():d.disabled||j(!0)}}),a]})),c&&r.jsx(s.OpenDropdownContainer,Object.assign({ref:w,style:Object.assign(Object.assign({},O.popper),{zIndex:3})},x.popper,{children:r.jsx(t.default,Object.assign({level:"z2",position:"down",style:{borderRadius:4}},{children:r.jsx(l.OpenedDropdown,Object.assign({},d,{onSelect:e=>{var r;null===(r=d.onSelect)||void 0===r||r.call(d,e),j(!1)},onClose:function(){var e;j(!1),null===(e=null==d?void 0:d.onClose)||void 0===e||e.call(d)}}))}))}))]})}));p.displayName="DropdownPopover",exports.DropdownPopover=p;

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"),s=require("../../../zeroState/ZeroState.js"),n=require("../../../../hooks/useOutside.js"),i=require("../utils/iterationOnOptions.js"),l=require("./description/Description.js"),o=require("./menu/FreeFormMenu.js"),r=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,f=290;exports.OpenedDropdown=j=>{let{options:S,isSearchable:x,isMultiSelect:O,width:b,allowFreeForm:g,height:m,onClose:v,onSelect:w}=j;const[q,y]=t.useState(null!=S?S:[]),[M,F]=t.useState(null!=b?b:f),[C,D]=t.useState(""),[L,A]=t.useState(null),B=t.useRef(null);n.useOutside(B,(()=>{A(null),null==v||v()}));const Z=null!=m?m:h,E="number"==typeof Z?x&&O?Z-96:x&&!O||!x&&O?Z-48:Z:Z;function H(e){if(O){const t=i.iterateOnOptions(q,{selected:e.selected},(t=>t.value===e.value));y([...t])}else null==w||w(e)}t.useEffect((()=>{const e=null!=b?b:f;if(null===L)F(e);else if("number"==typeof e)F(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));F(t)}}),[L]);const W=q.map((e=>{var t;if(C){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(C.toLowerCase()))})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(C.toLowerCase()))?e:null}return e})).filter((e=>null!==e)),_=!!x&&C&&0===W.length;return e.jsxs(a.OpennedDropdownContainer,Object.assign({ref:B,style:{maxWidth:L?800:400,width:M}},{children:[e.jsxs("div",Object.assign({style:{width:L?"50%":"100%",display:"flex",flexDirection:"column"}},{children:[!!x&&e.jsx(d.SearchBox,{onSearch:function(e){D(e)}}),W.length||C?e.jsxs(a.MenuListContainer,Object.assign({minHeight:Z,maxHeight:E},{children:[!!O&&!_&&e.jsx(u.SelectAllMenu,{options:q,onSelect:function(e){if("selectAll"===e){const e=i.iterateOnOptions(q,{selected:!0},(e=>!e.disabled));y([...e])}else if("notSelected"===e){const e=i.iterateOnOptions(q,{selected:!1},(e=>!e.disabled));y([...e])}}}),!g&&_&&e.jsx(p.SearchZeroState,{searchedString:C}),g&&_&&e.jsx(o.FreeFormMenu,{isMultiSelect:O,onSelect:function(e){if(!O)return void H({label:C,value:C,isFreeForm:!0,selected:!0});const t=q.map((t=>t.options?t:Object.assign(Object.assign({},t),{selected:t.label===C&&t.value===C?e:t.selected})));e&&(t.some((e=>e.label===C&&e.value===C))||t.unshift({label:C,value:C,isFreeForm:!0,selected:!0})),y([...t])},searchedString:C}),e.jsx(r.MenuList,{onSelect:H,showDescription:function(e,t){A(e&&t?{title:e,description:t}:null)},isMultiSelect:O,options:W})]})):e.jsx("div",Object.assign({style:{height:Z,display:"flex"}},{children:e.jsx(s.ZeroState,{title:"No options passed",subTitle:"Sorry we could not find any options to show"})})),!!O&&!(!W.length&&!C)&&e.jsx(c.default,{onClear:function(){const e=i.iterateOnOptions(q,{selected:!1});y([...e])},onApply:function(){const e=[];q.forEach((t=>{if(t.options){const s=t.options.filter((e=>!0===e.selected));e.push(Object.assign(Object.assign({},t),{options:[...s]}))}else t.selected&&e.push(Object.assign({},t))})),null==w||w([...e])},list:q})]})),!!L&&e.jsx(l.Description,{title:L.title,description:L.description})]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),s=require("../../../zeroState/ZeroState.js"),n=require("../../../../hooks/useOutside.js"),i=require("../utils/iterationOnOptions.js"),l=require("./description/Description.js"),o=require("./menu/FreeFormMenu.js"),r=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 f=304,h=290;exports.OpenedDropdown=j=>{let{options:S,isSearchable:O,isMultiSelect:x,width:b,allowFreeForm:g,height:m,onClose:v,onSelect:w}=j;const[y,q]=t.useState(null!=S?S:[]);t.useEffect((()=>{q(S)}),[JSON.stringify(S)]);const[M,F]=t.useState(null!=b?b:h),[C,D]=t.useState(""),[L,A]=t.useState(null),B=t.useRef(null);n.useOutside(B,(()=>{A(null),null==v||v()}));const Z=null!=m?m:f,E="number"==typeof Z?O&&x?Z-96:O&&!x||!O&&x?Z-48:Z:Z;function H(e){if(x){const t=i.iterateOnOptions(y,{selected:e.selected},(t=>t.value===e.value));q([...t])}else null==w||w(e)}t.useEffect((()=>{const e=null!=b?b:h;if(null===L)F(e);else if("number"==typeof e)F(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));F(t)}}),[L]);const N=y.map((e=>{var t;if(C){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(C.toLowerCase()))})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(C.toLowerCase()))?e:null}return e})).filter((e=>null!==e)),W=!!O&&C&&0===N.length;return e.jsxs(a.OpennedDropdownContainer,Object.assign({ref:B,style:{maxWidth:L?800:400,width:M}},{children:[e.jsxs("div",Object.assign({style:{width:L?"50%":"100%",display:"flex",flexDirection:"column"}},{children:[!!O&&e.jsx(d.SearchBox,{onSearch:function(e){D(e)}}),N.length||C?e.jsxs(a.MenuListContainer,Object.assign({minHeight:Z,maxHeight:E},{children:[!!x&&!W&&e.jsx(u.SelectAllMenu,{options:y,onSelect:function(e){if("selectAll"===e){const e=i.iterateOnOptions(y,{selected:!0},(e=>!e.disabled));q([...e])}else if("notSelected"===e){const e=i.iterateOnOptions(y,{selected:!1},(e=>!e.disabled));q([...e])}}}),!g&&W&&e.jsx(p.SearchZeroState,{searchedString:C}),g&&W&&e.jsx(o.FreeFormMenu,{isMultiSelect:x,onSelect:function(e){if(!x)return void H({label:C,value:C,isFreeForm:!0,selected:!0});const t=y.map((t=>t.options?t:Object.assign(Object.assign({},t),{selected:t.label===C&&t.value===C?e:t.selected})));e&&(t.some((e=>e.label===C&&e.value===C))||t.unshift({label:C,value:C,isFreeForm:!0,selected:!0})),q([...t])},searchedString:C}),e.jsx(r.MenuList,{onSelect:H,showDescription:function(e,t){A(e&&t?{title:e,description:t}:null)},isMultiSelect:x,options:N})]})):e.jsx("div",Object.assign({style:{height:Z,display:"flex"}},{children:e.jsx(s.ZeroState,{title:"No options passed",subTitle:"Sorry we could not find any options to show"})})),!!x&&!(!N.length&&!C)&&e.jsx(c.default,{onClear:function(){const e=i.iterateOnOptions(y,{selected:!1});q([...e])},onApply:function(){const e=[];y.forEach((t=>{if(t.options){const s=t.options.filter((e=>!0===e.selected));e.push(Object.assign(Object.assign({},t),{options:[...s]}))}else t.selected&&e.push(Object.assign({},t))})),null==w||w([...e])},list:y})]})),!!L&&e.jsx(l.Description,{title:L.title,description:L.description})]}))};

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

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import { Placement } from '@popperjs/core';
 export interface OpenDropdownProps {
     defaultOptions?: DropdownOption[];
     options: DropdownOption[];
@@ -10,6 +11,7 @@ export interface OpenDropdownProps {
     allowFreeForm?: boolean;
     onClose?: () => void;
     onSelect?: (option: DropdownOption | DropdownOption[]) => void;
+    placement?: Placement;
 }
 export type GroupedOption = {
     label?: string;

package/dist/cjs/components/template-preview/WhatsApp/ChatBtn.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../TypographyStyle.js"),r=require("../../../constants/Theme.js"),n=require("./ChatUI.style.js");exports.ChatBtn=s=>{let{Icon:i,text:l,extraContent:c,placeholder:o,textTypography:a,size:p}=s;const x=a||t.BodySecondary;return e.jsx(n.ChatBtnContainer,{children:e.jsxs("div",Object.assign({style:{textAlign:"center",maxWidth:"100%"}},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center"}},{children:[i&&e.jsx(i,{color:r.COLORS.special.brand.facebook,height:16,width:16,style:{marginRight:8}}),e.jsx(x,Object.assign({style:{color:r.COLORS.special.brand.facebook,textAlign:"center",fontSize:"small"===p?12:14,textOverflow:"ellipsis"}},{children:l}))]})),!!c&&e.jsx(t.Caption,Object.assign({style:{marginTop:2,color:r.COLORS.content.placeholder,textOverflow:"ellipsis"}},{children:o?function(e){return e.replace("[[","").replace("]]","").replace(/([A-Z])/g," $1").replace(/^./,(function(e){return e.toUpperCase()}))}(o):c}))]}))})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../TypographyStyle.js"),r=require("../../../constants/Theme.js"),n=require("./ChatUI.style.js");exports.ChatBtn=i=>{let{Icon:s,text:l,extraContent:o,placeholder:a,textTypography:c,size:p}=i;const d=c||t.BodySecondary;return e.jsx(n.ChatBtnContainer,{children:e.jsxs("div",Object.assign({style:{textAlign:"center",maxWidth:"100%"}},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center"}},{children:[s&&e.jsx(s,{color:r.COLORS.special.brand.facebook,height:16,width:16,style:{marginRight:8}}),e.jsx(d,Object.assign({style:{color:r.COLORS.special.brand.facebook,textAlign:"center",fontSize:"small"===p?12:14,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:l}))]})),!!o&&e.jsx(t.Caption,Object.assign({style:{marginTop:2,color:r.COLORS.content.placeholder,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:a?function(e){return e.replace("[[","").replace("]]","").replace(/([A-Z])/g," $1").replace(/^./,(function(e){return e.toUpperCase()}))}(a):o}))]}))})};

package/dist/cjs/components/template-preview/WhatsApp/ChatUiV2.js

@@ -10,7 +10,7 @@
 	font-weight: 400;
 	font-size: 14px;
 	line-height: 20px;
-	padding: 0px 12px;
+	padding: 8px 12px 0px;
 	color: ${n.COLORS.content.primary};
 	word-wrap: break-word;
 `,T=u.default(m)`

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

@@ -1 +1 @@
-import{__rest as o}from"../../../_virtual/_tslib.js";import{jsxs as e,Fragment as r,jsx as n}from"react/jsx-runtime";import t,{useState as l,useImperativeHandle as i,useEffect as s}from"react";import{usePopper as p}from"react-popper";import d from"../../dropShadow/DropShadow.js";import{OverLapAbs as c,OpenDropdownContainer as a}from"../Common.styled.js";import{OpenedDropdown as m}from"../OpenedDropdown/components/OpennedDropdown.js";const u=t.forwardRef(((t,u)=>{var{children:f}=t,v=o(t,["children"]);const j=u,[b,w]=l(!1),[h,O]=l(null),[D,g]=l(null),{styles:y,attributes:C}=p(h,D,{});return i(j,(()=>({openDropdown:b})),[]),s((()=>{(null==j?void 0:j.current)&&(j.current.openDropdown=b)}),[b]),e(r,{children:[e("div",Object.assign({style:{position:"relative"},ref:O},{children:[n(c,{onClick:o=>{b?o.preventDefault():v.disabled||w(!0)}}),f]})),b&&n(a,Object.assign({ref:g,style:Object.assign(Object.assign({},y.popper),{zIndex:3})},C.popper,{children:n(d,Object.assign({level:"z2",position:"down",style:{borderRadius:4}},{children:n(m,Object.assign({},v,{onSelect:o=>{var e;null===(e=v.onSelect)||void 0===e||e.call(v,o),w(!1)},onClose:function(){var o;w(!1),null===(o=null==v?void 0:v.onClose)||void 0===o||o.call(v)}}))}))}))]})}));u.displayName="DropdownPopover";export{u as DropdownPopover};
+import{__rest as e}from"../../../_virtual/_tslib.js";import{jsxs as o,Fragment as r,jsx as n}from"react/jsx-runtime";import t,{useState as l,useImperativeHandle as i,useEffect as p}from"react";import{usePopper as s}from"react-popper";import d from"../../dropShadow/DropShadow.js";import{OverLapAbs as c,OpenDropdownContainer as a}from"../Common.styled.js";import{OpenedDropdown as m}from"../OpenedDropdown/components/OpennedDropdown.js";const u=t.forwardRef(((t,u)=>{var{children:f}=t,v=e(t,["children"]);const j=u,[b,w]=l(!1),[h,O]=l(null),[D,g]=l(null),{styles:y,attributes:C}=s(h,D,{placement:v.placement});return i(j,(()=>({openDropdown:b})),[]),p((()=>{(null==j?void 0:j.current)&&(j.current.openDropdown=b)}),[b]),o(r,{children:[o("div",Object.assign({style:{position:"relative"},ref:O},{children:[n(c,{onClick:e=>{b?e.preventDefault():v.disabled||w(!0)}}),f]})),b&&n(a,Object.assign({ref:g,style:Object.assign(Object.assign({},y.popper),{zIndex:3})},C.popper,{children:n(d,Object.assign({level:"z2",position:"down",style:{borderRadius:4}},{children:n(m,Object.assign({},v,{onSelect:e=>{var o;null===(o=v.onSelect)||void 0===o||o.call(v,e),w(!1)},onClose:function(){var e;w(!1),null===(e=null==v?void 0:v.onClose)||void 0===e||e.call(v)}}))}))}))]})}));u.displayName="DropdownPopover";export{u as DropdownPopover};

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

@@ -1 +1 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as o,useRef as l,useEffect as n}from"react";import{ZeroState as i}from"../../../zeroState/ZeroState.js";import{useOutside as s}from"../../../../hooks/useOutside.js";import{iterateOnOptions as r}from"../utils/iterationOnOptions.js";import{Description as c}from"./description/Description.js";import{FreeFormMenu as u}from"./menu/FreeFormMenu.js";import{MenuList as a}from"./menu/MenuList.js";import{SelectAllMenu as p}from"./menu/SelectAllMenu.js";import d from"./multiSelect/MultiSelectDropdownBottomBar.js";import{OpennedDropdownContainer as m,MenuListContainer as f}from"./OpennedDropdown.styled.js";import{SearchBox as h}from"./searchbox/SearchBox.js";import{SearchZeroState as b}from"./searchbox/SearchZeroState.js";const j=304,g=290,S=S=>{let{options:v,isSearchable:O,isMultiSelect:w,width:x,allowFreeForm:y,height:F,onClose:M,onSelect:C}=S;const[D,L]=o(null!=v?v:[]),[A,B]=o(null!=x?x:g),[H,W]=o(""),[Z,k]=o(null),z=l(null);s(z,(()=>{k(null),null==M||M()}));const E=null!=F?F:j,I="number"==typeof E?O&&w?E-96:O&&!w||!O&&w?E-48:E:E;function N(e){if(w){const t=r(D,{selected:e.selected},(t=>t.value===e.value));L([...t])}else null==C||C(e)}n((()=>{const e=null!=x?x:g;if(null===Z)B(e);else if("number"==typeof e)B(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));B(t)}}),[Z]);const T=D.map((e=>{var t;if(H){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(H.toLowerCase()))})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(H.toLowerCase()))?e:null}return e})).filter((e=>null!==e)),q=!!O&&H&&0===T.length;return e(m,Object.assign({ref:z,style:{maxWidth:Z?800:400,width:A}},{children:[e("div",Object.assign({style:{width:Z?"50%":"100%",display:"flex",flexDirection:"column"}},{children:[!!O&&t(h,{onSearch:function(e){W(e)}}),T.length||H?e(f,Object.assign({minHeight:E,maxHeight:I},{children:[!!w&&!q&&t(p,{options:D,onSelect:function(e){if("selectAll"===e){const e=r(D,{selected:!0},(e=>!e.disabled));L([...e])}else if("notSelected"===e){const e=r(D,{selected:!1},(e=>!e.disabled));L([...e])}}}),!y&&q&&t(b,{searchedString:H}),y&&q&&t(u,{isMultiSelect:w,onSelect:function(e){if(!w)return void N({label:H,value:H,isFreeForm:!0,selected:!0});const t=D.map((t=>t.options?t:Object.assign(Object.assign({},t),{selected:t.label===H&&t.value===H?e:t.selected})));e&&(t.some((e=>e.label===H&&e.value===H))||t.unshift({label:H,value:H,isFreeForm:!0,selected:!0})),L([...t])},searchedString:H}),t(a,{onSelect:N,showDescription:function(e,t){k(e&&t?{title:e,description:t}:null)},isMultiSelect:w,options:T})]})):t("div",Object.assign({style:{height:E,display:"flex"}},{children:t(i,{title:"No options passed",subTitle:"Sorry we could not find any options to show"})})),!!w&&!(!T.length&&!H)&&t(d,{onClear:function(){const e=r(D,{selected:!1});L([...e])},onApply:function(){const e=[];D.forEach((t=>{if(t.options){const o=t.options.filter((e=>!0===e.selected));e.push(Object.assign(Object.assign({},t),{options:[...o]}))}else t.selected&&e.push(Object.assign({},t))})),null==C||C([...e])},list:D})]})),!!Z&&t(c,{title:Z.title,description:Z.description})]}))};export{S as OpenedDropdown};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as o,useEffect as l,useRef as n}from"react";import{ZeroState as i}from"../../../zeroState/ZeroState.js";import{useOutside as s}from"../../../../hooks/useOutside.js";import{iterateOnOptions as r}from"../utils/iterationOnOptions.js";import{Description as c}from"./description/Description.js";import{FreeFormMenu as u}from"./menu/FreeFormMenu.js";import{MenuList as a}from"./menu/MenuList.js";import{SelectAllMenu as p}from"./menu/SelectAllMenu.js";import d from"./multiSelect/MultiSelectDropdownBottomBar.js";import{OpennedDropdownContainer as m,MenuListContainer as f}from"./OpennedDropdown.styled.js";import{SearchBox as h}from"./searchbox/SearchBox.js";import{SearchZeroState as b}from"./searchbox/SearchZeroState.js";const g=304,j=290,S=S=>{let{options:v,isSearchable:O,isMultiSelect:w,width:y,allowFreeForm:x,height:F,onClose:M,onSelect:C}=S;const[D,L]=o(null!=v?v:[]);l((()=>{L(v)}),[JSON.stringify(v)]);const[A,B]=o(null!=y?y:j),[H,N]=o(""),[W,Z]=o(null),k=n(null);s(k,(()=>{Z(null),null==M||M()}));const z=null!=F?F:g,E="number"==typeof z?O&&w?z-96:O&&!w||!O&&w?z-48:z:z;function I(e){if(w){const t=r(D,{selected:e.selected},(t=>t.value===e.value));L([...t])}else null==C||C(e)}l((()=>{const e=null!=y?y:j;if(null===W)B(e);else if("number"==typeof e)B(2*e);else if("string"==typeof e&&e.endsWith("px")){const t=2*parseInt(e.replace("px",""));B(t)}}),[W]);const J=D.map((e=>{var t;if(H){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(H.toLowerCase()))})),t.options.length>0?t:null}return(null===(t=e.label)||void 0===t?void 0:t.toLowerCase().includes(H.toLowerCase()))?e:null}return e})).filter((e=>null!==e)),T=!!O&&H&&0===J.length;return e(m,Object.assign({ref:k,style:{maxWidth:W?800:400,width:A}},{children:[e("div",Object.assign({style:{width:W?"50%":"100%",display:"flex",flexDirection:"column"}},{children:[!!O&&t(h,{onSearch:function(e){N(e)}}),J.length||H?e(f,Object.assign({minHeight:z,maxHeight:E},{children:[!!w&&!T&&t(p,{options:D,onSelect:function(e){if("selectAll"===e){const e=r(D,{selected:!0},(e=>!e.disabled));L([...e])}else if("notSelected"===e){const e=r(D,{selected:!1},(e=>!e.disabled));L([...e])}}}),!x&&T&&t(b,{searchedString:H}),x&&T&&t(u,{isMultiSelect:w,onSelect:function(e){if(!w)return void I({label:H,value:H,isFreeForm:!0,selected:!0});const t=D.map((t=>t.options?t:Object.assign(Object.assign({},t),{selected:t.label===H&&t.value===H?e:t.selected})));e&&(t.some((e=>e.label===H&&e.value===H))||t.unshift({label:H,value:H,isFreeForm:!0,selected:!0})),L([...t])},searchedString:H}),t(a,{onSelect:I,showDescription:function(e,t){Z(e&&t?{title:e,description:t}:null)},isMultiSelect:w,options:J})]})):t("div",Object.assign({style:{height:z,display:"flex"}},{children:t(i,{title:"No options passed",subTitle:"Sorry we could not find any options to show"})})),!!w&&!(!J.length&&!H)&&t(d,{onClear:function(){const e=r(D,{selected:!1});L([...e])},onApply:function(){const e=[];D.forEach((t=>{if(t.options){const o=t.options.filter((e=>!0===e.selected));e.push(Object.assign(Object.assign({},t),{options:[...o]}))}else t.selected&&e.push(Object.assign({},t))})),null==C||C([...e])},list:D})]})),!!W&&t(c,{title:W.title,description:W.description})]}))};export{S as OpenedDropdown};

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

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import { Placement } from '@popperjs/core';
 export interface OpenDropdownProps {
     defaultOptions?: DropdownOption[];
     options: DropdownOption[];
@@ -10,6 +11,7 @@ export interface OpenDropdownProps {
     allowFreeForm?: boolean;
     onClose?: () => void;
     onSelect?: (option: DropdownOption | DropdownOption[]) => void;
+    placement?: Placement;
 }
 export type GroupedOption = {
     label?: string;

package/dist/esm/components/template-preview/WhatsApp/ChatBtn.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{Caption as r,BodySecondary as n}from"../../TypographyStyle.js";import{COLORS as l}from"../../../constants/Theme.js";import{ChatBtnContainer as i}from"./ChatUI.style.js";const o=o=>{let{Icon:c,text:s,extraContent:a,placeholder:p,textTypography:h,size:m}=o;const d=h||n;return e(i,{children:t("div",Object.assign({style:{textAlign:"center",maxWidth:"100%"}},{children:[t("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center"}},{children:[c&&e(c,{color:l.special.brand.facebook,height:16,width:16,style:{marginRight:8}}),e(d,Object.assign({style:{color:l.special.brand.facebook,textAlign:"center",fontSize:"small"===m?12:14,textOverflow:"ellipsis"}},{children:s}))]})),!!a&&e(r,Object.assign({style:{marginTop:2,color:l.content.placeholder,textOverflow:"ellipsis"}},{children:p?function(e){return e.replace("[[","").replace("]]","").replace(/([A-Z])/g," $1").replace(/^./,(function(e){return e.toUpperCase()}))}(p):a}))]}))})};export{o as ChatBtn};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{Caption as r,BodySecondary as n}from"../../TypographyStyle.js";import{COLORS as o}from"../../../constants/Theme.js";import{ChatBtnContainer as i}from"./ChatUI.style.js";const l=l=>{let{Icon:c,text:s,extraContent:a,placeholder:p,textTypography:h,size:d}=l;const f=h||n;return e(i,{children:t("div",Object.assign({style:{textAlign:"center",maxWidth:"100%"}},{children:[t("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center"}},{children:[c&&e(c,{color:o.special.brand.facebook,height:16,width:16,style:{marginRight:8}}),e(f,Object.assign({style:{color:o.special.brand.facebook,textAlign:"center",fontSize:"small"===d?12:14,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:s}))]})),!!a&&e(r,Object.assign({style:{marginTop:2,color:o.content.placeholder,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:p?function(e){return e.replace("[[","").replace("]]","").replace(/([A-Z])/g," $1").replace(/^./,(function(e){return e.toUpperCase()}))}(p):a}))]}))})};export{l as ChatBtn};

package/dist/esm/components/template-preview/WhatsApp/ChatUiV2.js

@@ -1,4 +1,4 @@
-import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import r from"../../../assets/icons/halfRectangle.svg.js";import i from"../../../assets/icons/phone.svg.js";import s from"../../../assets/icons/RedirectToNew.svg.js";import a from"styled-components";import{Tooltip as n}from"../../tooltips/Tooltip.js";import{Caption as l,BodySecondary as p}from"../../TypographyStyle.js";import{COLORS as m}from"../../../constants/Theme.js";import{VariableEditorHelper as d}from"../helpers/VariableEditorHelper.js";import{HEADER_TYPES as h,ACTIONS_TYPES as c}from"../models/TemplateMeta.js";import{ChatBtn as f}from"./ChatBtn.js";import{Container as x,FooterWrapper as y,TimeStamp as g}from"./ChatUI.style.js";import{MediaCard as T}from"./MediaCard.js";const j=a.div`
+import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import r from"../../../assets/icons/halfRectangle.svg.js";import i from"../../../assets/icons/phone.svg.js";import s from"../../../assets/icons/RedirectToNew.svg.js";import a from"styled-components";import{Tooltip as n}from"../../tooltips/Tooltip.js";import{Caption as p,BodySecondary as l}from"../../TypographyStyle.js";import{COLORS as m}from"../../../constants/Theme.js";import{VariableEditorHelper as d}from"../helpers/VariableEditorHelper.js";import{HEADER_TYPES as h,ACTIONS_TYPES as c}from"../models/TemplateMeta.js";import{ChatBtn as f}from"./ChatBtn.js";import{Container as x,FooterWrapper as y,TimeStamp as g}from"./ChatUI.style.js";import{MediaCard as T}from"./MediaCard.js";const j=a.div`
 	position: absolute;
 	width: 8px;
 	height: 8px;
@@ -10,10 +10,10 @@ import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import r from"..
 	font-weight: 400;
 	font-size: 14px;
 	line-height: 20px;
-	padding: 0px 12px;
+	padding: 8px 12px 0px;
 	color: ${m.content.primary};
 	word-wrap: break-word;
 `,w=a(b)`
 	font-weight: 600;
 	margin-bottom: 8px;
-`,v=new d,u=a=>{const{bodyText:m,footerText:d,headerMediaType:u,headerText:I,headerAssetLink:L,headerAssetName:N,quickReplybtn:A,ctaBtn:C,actionTypes:M,extras:_,showHeader:E,imagePreviewStyles:S,size:k,bodyVariableList:H,headerVariableList:R}=a,z=v.format(m,H),B=v.format(I,R);return e(x,{children:[t(j,{children:t(r,{color:"white",height:8,width:8})}),u===h.TEXT?t(w,{dangerouslySetInnerHTML:{__html:B}}):u!==h.NONE?t(T,{headerAssetLink:L,headerAssetName:N,mediaType:u,imagePreviewStyles:u===h.IMAGE?S:{}}):t(o,{}),!!m&&t(o,{children:t(b,{dangerouslySetInnerHTML:{__html:z}})}),e(y,{children:[t(n,Object.assign({body:null!=d?d:"",placement:"top"},{children:t(g,Object.assign({style:{flex:1}},{children:d}))})),t(g,{children:"16:48"})]}),M===c.QUICK_REPLY?t("div",{children:null==A?void 0:A.map(((e,o)=>t(f,{text:e.text},o)))}):M===c.CTA_BTN?t("div",{children:null==C?void 0:C.map(((e,o)=>t(f,{textTypography:E?l:p,extraContent:_?e.extra:void 0,placeholder:e.placeholder,text:e.text,Icon:"phoneNumber"===e.type?i:s,size:k},o)))}):t(o,{})]})};export{u as ChatUIV2};
+`,v=new d,u=a=>{const{bodyText:m,footerText:d,headerMediaType:u,headerText:I,headerAssetLink:L,headerAssetName:N,quickReplybtn:A,ctaBtn:C,actionTypes:M,extras:_,showHeader:E,imagePreviewStyles:S,size:k,bodyVariableList:H,headerVariableList:R}=a,z=v.format(m,H),B=v.format(I,R);return e(x,{children:[t(j,{children:t(r,{color:"white",height:8,width:8})}),u===h.TEXT?t(w,{dangerouslySetInnerHTML:{__html:B}}):u!==h.NONE?t(T,{headerAssetLink:L,headerAssetName:N,mediaType:u,imagePreviewStyles:u===h.IMAGE?S:{}}):t(o,{}),!!m&&t(o,{children:t(b,{dangerouslySetInnerHTML:{__html:z}})}),e(y,{children:[t(n,Object.assign({body:null!=d?d:"",placement:"top"},{children:t(g,Object.assign({style:{flex:1}},{children:d}))})),t(g,{children:"16:48"})]}),M===c.QUICK_REPLY?t("div",{children:null==A?void 0:A.map(((e,o)=>t(f,{text:e.text},o)))}):M===c.CTA_BTN?t("div",{children:null==C?void 0:C.map(((e,o)=>t(f,{textTypography:E?p:l,extraContent:_?e.extra:void 0,placeholder:e.placeholder,text:e.text,Icon:"phoneNumber"===e.type?i:s,size:k},o)))}):t(o,{})]})};export{u as ChatUIV2};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.48-editor.13",
+	"version": "0.0.48-editor.14",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",