@bikdotai/bik-component-library 0.0.421 → 0.0.422-beta.1

package/dist/esm/components/product-picker-v2/productScreen.js

@@ -1 +1 @@
-import{jsxs as t,jsx as e,Fragment as o}from"react/jsx-runtime";import i from"../../assets/icons/arrow_left.svg.js";import c from"../../assets/icons/box.svg.js";import d from"../../assets/icons/search.svg.js";import{cloneDeep as r}from"lodash";import{useContext as n,useState as l,useEffect as s}from"react";import{Tag as a}from"../tag/Tag.js";import{COLORS as u}from"../../constants/Theme.js";import{CheckBox as p}from"../checkBox/CheckBox.js";import{IconButton as h}from"../icon-button/IconButton.js";import{Input as v}from"../input/Input.js";import{BikShimmer as m}from"../shimmer/ShimmerComponent/BikShimmer.js";import{ShimmerImage as y}from"../shimmer-image/ShimmerImage.js";import{Spinner as f}from"../spinner/Spinner.js";import{Tooltip as g}from"../tooltips/Tooltip.js";import{BodyCaption as k,TitleRegular as b}from"../TypographyStyle.js";import{truncate as j}from"./collectionScreen.js";import{EmptyState as C}from"./emptyState.js";import{ProductHelper as I}from"./helpers/ProductHelper.js";import{CollectionIdContext as O}from"./reducers.js";import{ProductScreenHeader as x,ProductScreenCollectionCardStyle as P,ProductCardStyle as S}from"./style.js";import{OUT_OF_STOCK_ACTION as V}from"./type.js";import{liftTheStateUp as T}from"./utility.js";const w=o=>{const a=n(O),{data:y,collectionsDispatch:g,selectedData:j,selectedCollectionsDispatch:I,productFetcher:S,storeId:w,setScreen:E,setSaveDisabled:A,hideInCollectionSearch:B,customCollectionRestriction:R,hideProductCheckbox:U,outOfStockAction:F=V.BLUR,hideVariantCheckbox:H=!1,selectProductsFromCustomCollection:L=!1,pickerType:W,hideProductVariants:z}=o,[K,N]=l(""),[_,q]=l(!1),[G,J]=l(y);s((()=>{const t=setTimeout((()=>{K.length?(q(!0),o.searchInCollectionFetcher(w,a,K).then((t=>{var e;const o=r(y);o.products={};for(const i of t)(null===(e=null==y?void 0:y.products)||void 0===e?void 0:e[i])&&(o.products[i]=y.products[i]);J(o),A(!1),q(!1)}))):J(y)}),800);return()=>clearTimeout(t)}),[K]);const M=!!R&&y.isSmartCollection,Q=t=>{var e,o,i,c,d,r,n,l;let s=0,u=0;return!!((null===(o=null===(e=null==j?void 0:j[a])||void 0===e?void 0:e.products)||void 0===o?void 0:o[t])&&(null===(d=Object.keys((null===(c=null===(i=null==y?void 0:y.products)||void 0===i?void 0:i[t])||void 0===c?void 0:c.variants)||[]))||void 0===d||d.forEach((()=>u++)),Object.keys((null===(l=null===(n=null===(r=null==j?void 0:j[a])||void 0===r?void 0:r.products)||void 0===n?void 0:n[t])||void 0===l?void 0:l.variants)||[]).forEach((()=>s++)),s>0&&u!==s))};s((()=>{(null==y?void 0:y.products)||X()}),[]);const X=()=>{A(!0),q(!0),S(a,w).then((t=>{Object.keys(t).length&&(g({type:"productsFetched",data:{collectionId:a,products:t}}),J(Object.assign(Object.assign({},G),{products:t}))),A(!1),q(!1)})).catch()},Y=(t,e)=>{const o=T(e,y);I({type:t,data:Object.assign(Object.assign({},o),{isRestricted:R})})};return t("div",{children:[t(x,{children:[e(h,{Icon:i,height:16,onClick:()=>{E("collections")}}),e(k,Object.assign({style:{color:u.content.secondary}},{children:y.name}))]}),!B&&e("div",Object.assign({style:{padding:16,height:"76px",borderBottom:"1px solid #E0E0E0"}},{children:e(v,{noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>_&&K.length?e(f,{size:"small",color:u.content.primary}):e(d,{})},id:"listInput",height:"24px",type:"text",value:K,onChangeText:t=>{t.length&&t.trim().length?N(t):N("")},placeholder:"Search products in this collection..."})})),t("div",{children:[Object.keys((null==G?void 0:G.products)||[]).length>0&&!M&&!K.length&&!U&&t(P,{children:[e(p,{isChecked:!!(null==j?void 0:j[a]),isPartiallyChecked:(t=>{var e;let o=0,i=0;if(j[t]){const c=null==y?void 0:y.products;c&&Object.keys(c).forEach((t=>{var e;const i=null===(e=c[t])||void 0===e?void 0:e.variants;i&&Object.keys(i).forEach((t=>o+=1))}));const d=null===(e=j[t])||void 0===e?void 0:e.products;return d&&Object.keys(d).forEach((t=>{var e;const o=null===(e=d[t])||void 0===e?void 0:e.variants;o&&Object.keys(o).forEach((()=>i+=1))})),i>0&&o!==i}return!1})(a),onValueChange:function(t){I(t?{type:"selected",data:{id:a,val:y}}:{type:"unselected",data:{id:a}})}}),e("div",Object.assign({style:{width:40,height:40}},{children:e(c,{})})),e(b,{children:"All Products"})]}),Object.keys((null==G?void 0:G.products)||[]).length?Object.keys(G.products||[]).map((t=>e(D,{outOfStockAction:F,collectionId:a,isProductPartiallyChecked:Q(t),productId:t,data:G.products[t],selectedData:j,selectedCollectionsDispatch:I,viewOnly:!L&&!!M,upliftAdditions:Y,hideProductCheckbox:U,hideVariantCheckbox:H,hideProductVariants:z,pickerType:W},t))):_?[1,2,3,4,5,6,7,8,9,10].map(((t,o)=>e("div",Object.assign({style:{borderBottom:"1px solid #E0E0E0"}},{children:e(m,{boxes:[{height:"64px",width:"100%",marginTop:"0px"}]})}),o))):e(C,{title:"No products to show",subtitle:K.length?"We couldn't find the product you were looking for":"We couldn’t find any product in this collection."})]})]})},D=o=>{const{collectionId:i,productId:c,data:d,selectedData:r,selectedCollectionsDispatch:n,viewOnly:l,upliftAdditions:s,isProductPartiallyChecked:a,hideProductCheckbox:u,outOfStockAction:p,hideVariantCheckbox:h,hideProductVariants:v,pickerType:m}=o,y=t=>{var e,o,d,n,l,s;if(!(null===(o=null===(e=null==r?void 0:r[i])||void 0===e?void 0:e.products)||void 0===o?void 0:o[c]))return!1;return!!(null===(s=null===(l=null===(n=null===(d=null==r?void 0:r[i])||void 0===d?void 0:d.products)||void 0===n?void 0:n[c])||void 0===l?void 0:l.variants)||void 0===s?void 0:s[t])};return t("div",{children:[e(E,{isVariant:!1,data:d,productId:c,collectionId:i,isSelected:!!(null===(g=null===(f=null==r?void 0:r[i])||void 0===f?void 0:f.products)||void 0===g?void 0:g[c]),isPartiallyChecked:a,selectedCollectionsDispatch:n,upliftAdditions:s,viewOnly:l,hideProductCheckbox:u,hideVariantCheckbox:h,hideProductVariants:v,pickerType:m},c),v?null:Object.keys(d.variants||[]).map((t=>e(E,{isVariant:!0,hideVariantCheckbox:h,data:d.variants[t],variantId:t,productId:c,viewOnly:l,upliftAdditions:s,collectionId:i,isSelected:y(t),selectedCollectionsDispatch:n,outOfStockAction:p},t)))]});var f,g},E=i=>{const{isVariant:c,data:d,productId:r,collectionId:n,variantId:l,isSelected:s,selectedCollectionsDispatch:u,viewOnly:h,upliftAdditions:v,isPartiallyChecked:m,hideProductCheckbox:f,outOfStockAction:k,hideVariantCheckbox:C,hideProductVariants:O,pickerType:x}=i,P=I.getProductLabels(d,k);return t(S,Object.assign({isVariant:c,onClick:t=>{"PRODUCT"===x&&O&&(t.stopPropagation(),u({type:"reset",data:{}}),v("variantSelected",{productId:r,variantId:l||Object.keys(d.variants)[0],collectionId:n,variant:d}))},isActive:s},{children:[c&&!h&&!C||!c&&!h&&!f?e(p,{isChecked:s,isPartiallyChecked:m||!1,onValueChange:function(t){c?t?v("variantSelected",{productId:r,variantId:l,collectionId:n,variant:d}):u({type:"variantUnselected",data:{productId:r,variantId:l,collectionId:n}}):t?v("productSelected",{productId:r,collectionId:n,product:d}):u({type:"productUnselected",data:{productId:r,collectionId:n}})}}):e(o,{}),e("div",{children:e(y,{width:40,height:40,imageUrl:d.image,alt:"Item",borderRadius:4})}),e(g,Object.assign({body:d.name,placement:"bottom",delay:400},{children:t("div",Object.assign({style:{display:"flex",flexDirection:"column"}},{children:[e(b,{children:j(d.name,40,!0)}),P?e("div",Object.assign({style:{width:90,display:"flex"}},{children:e(a,{tagText:P,type:"warning",theme:"light"})})):e(o,{})]}))}))]}))};export{E as ProductCard,D as ProductGroup,w as ProductsScreen};
+import{jsxs as t,jsx as e,Fragment as o}from"react/jsx-runtime";import i from"../../assets/icons/arrow_left.svg.js";import d from"../../assets/icons/box.svg.js";import c from"../../assets/icons/search.svg.js";import{cloneDeep as l}from"lodash";import{useContext as n,useState as r,useEffect as s}from"react";import{COLORS as a}from"../../constants/Theme.js";import{CheckBox as u}from"../checkBox/CheckBox.js";import{IconButton as h}from"../icon-button/IconButton.js";import{Input as p}from"../input/Input.js";import{BikShimmer as v}from"../shimmer/ShimmerComponent/BikShimmer.js";import{ShimmerImage as m}from"../shimmer-image/ShimmerImage.js";import{Spinner as y}from"../spinner/Spinner.js";import{BodyCaption as f,TitleRegular as g}from"../TypographyStyle.js";import{truncate as b}from"./collectionScreen.js";import{EmptyState as j}from"./emptyState.js";import{CollectionIdContext as k}from"./reducers.js";import{ProductScreenHeader as C,ProductScreenCollectionCardStyle as I,ProductCardStyle as O}from"./style.js";import{liftTheStateUp as x}from"./utility.js";const S=o=>{const m=n(k),{data:b,collectionsDispatch:O,selectedData:S,selectedCollectionsDispatch:E,productFetcher:w,storeId:D,setScreen:V,setSaveDisabled:A,hideInCollectionSearch:B,customCollectionRestriction:T,hideProductCheckbox:F,hideVariantCheckbox:R}=o,[U,W]=r(""),[z,H]=r(!1),[N,_]=r(b);s((()=>{const t=setTimeout((()=>{U.length?(H(!0),o.searchInCollectionFetcher(D,m,U).then((t=>{var e;const o=l(b);o.products={};for(const i of t)(null===(e=null==b?void 0:b.products)||void 0===e?void 0:e[i])&&(o.products[i]=b.products[i]);_(o),A(!1),H(!1)}))):_(b)}),800);return()=>clearTimeout(t)}),[U]);const q=!!T&&b.isSmartCollection,G=t=>{var e,o,i,d,c,l,n,r;let s=0,a=0;return!!((null===(o=null===(e=null==S?void 0:S[m])||void 0===e?void 0:e.products)||void 0===o?void 0:o[t])&&(null===(c=Object.keys((null===(d=null===(i=null==b?void 0:b.products)||void 0===i?void 0:i[t])||void 0===d?void 0:d.variants)||[]))||void 0===c||c.forEach((()=>a++)),Object.keys((null===(r=null===(n=null===(l=null==S?void 0:S[m])||void 0===l?void 0:l.products)||void 0===n?void 0:n[t])||void 0===r?void 0:r.variants)||[]).forEach((()=>s++)),s>0&&a!==s))};s((()=>{(null==b?void 0:b.products)||J()}),[]);const J=()=>{A(!0),H(!0),w(m,D).then((t=>{Object.keys(t).length&&(O({type:"productsFetched",data:{collectionId:m,products:t}}),_(Object.assign(Object.assign({},N),{products:t}))),A(!1),H(!1)})).catch()},K=(t,e)=>{const o=x(e,b);E({type:t,data:Object.assign(Object.assign({},o),{isRestricted:T})})};return t("div",{children:[t(C,{children:[e(h,{Icon:i,height:16,onClick:()=>{V("collections")}}),e(f,Object.assign({style:{color:a.content.secondary}},{children:b.name}))]}),!B&&e("div",Object.assign({style:{padding:16,height:"76px",borderBottom:"1px solid #E0E0E0"}},{children:e(p,{noErrorHint:!0,rightIcon:{icon:()=>z&&U.length?e(y,{size:"small",color:a.content.primary}):e(c,{})},id:"listInput",height:"24px",type:"text",value:U,onChangeText:t=>{t.length&&t.trim().length&&W(t)},placeholder:"Search products in this collection..."})})),t("div",{children:[Object.keys((null==N?void 0:N.products)||[]).length>0&&!q&&!U.length&&!F&&t(I,{children:[e(u,{isChecked:!!(null==S?void 0:S[m]),isPartiallyChecked:(t=>{var e;let o=0,i=0;if(S[t]){const d=null==b?void 0:b.products;d&&Object.keys(d).forEach((t=>{var e;const i=null===(e=d[t])||void 0===e?void 0:e.variants;i&&Object.keys(i).forEach((t=>o+=1))}));const c=null===(e=S[t])||void 0===e?void 0:e.products;return c&&Object.keys(c).forEach((t=>{var e;const o=null===(e=c[t])||void 0===e?void 0:e.variants;o&&Object.keys(o).forEach((()=>i+=1))})),i>0&&o!==i}return!1})(m),onValueChange:function(t){E(t?{type:"selected",data:{id:m,val:b}}:{type:"unselected",data:{id:m}})}}),e("div",Object.assign({style:{width:40,height:40}},{children:e(d,{})})),e(g,{children:"All Products"})]}),Object.keys((null==N?void 0:N.products)||[]).length?Object.keys(N.products||[]).map((t=>e(P,{collectionId:m,isProductPartiallyChecked:G(t),productId:t,data:N.products[t],selectedData:S,selectedCollectionsDispatch:E,viewOnly:!!q,upliftAdditions:K,hideProductCheckbox:F,hideVariantCheckbox:R},t))):z?[1,2,3,4,5,6,7,8,9,10].map(((t,o)=>e("div",Object.assign({style:{borderBottom:"1px solid #E0E0E0"}},{children:e(v,{boxes:[{height:"64px",width:"100%",marginTop:"0px"}]})}),o))):e(j,{title:"No products to show",subtitle:U.length?"We couldn't find the product you were looking for":"We couldn’t find any product in this collection."})]})]})},P=o=>{const{collectionId:i,productId:d,data:c,selectedData:l,selectedCollectionsDispatch:n,viewOnly:r,upliftAdditions:s,isProductPartiallyChecked:a,hideProductCheckbox:u,hideVariantCheckbox:h}=o,p=t=>{var e,o,c,n,r,s;if(!(null===(o=null===(e=null==l?void 0:l[i])||void 0===e?void 0:e.products)||void 0===o?void 0:o[d]))return!1;return!!(null===(s=null===(r=null===(n=null===(c=null==l?void 0:l[i])||void 0===c?void 0:c.products)||void 0===n?void 0:n[d])||void 0===r?void 0:r.variants)||void 0===s?void 0:s[t])};return t("div",{children:[e(E,{isVariant:!1,data:c,productId:d,collectionId:i,isSelected:!!(null===(m=null===(v=null==l?void 0:l[i])||void 0===v?void 0:v.products)||void 0===m?void 0:m[d]),isPartiallyChecked:a,selectedCollectionsDispatch:n,upliftAdditions:s,viewOnly:r,hideProductCheckbox:u},d),Object.keys(c.variants||[]).map((t=>e(E,{isVariant:!0,data:c.variants[t],hideVariantCheckbox:h,variantId:t,productId:d,viewOnly:r,upliftAdditions:s,collectionId:i,isSelected:p(t),selectedCollectionsDispatch:n},t)))]});var v,m},E=i=>{const{isVariant:d,data:c,productId:l,collectionId:n,variantId:r,isSelected:s,selectedCollectionsDispatch:a,viewOnly:h,upliftAdditions:p,isPartiallyChecked:v,hideProductCheckbox:y,hideVariantCheckbox:f}=i;return console.log(h,f,h||f),t(O,Object.assign({isVariant:d},{children:[d&&!h&&!f||!d&&!h&&!y?e(u,{isChecked:s,isPartiallyChecked:v||!1,onValueChange:function(t){d?t?p("variantSelected",{productId:l,variantId:r,collectionId:n,variant:c}):a({type:"variantUnselected",data:{productId:l,variantId:r,collectionId:n}}):t?p("productSelected",{productId:l,collectionId:n,product:c}):a({type:"productUnselected",data:{productId:l,collectionId:n}})}}):e(o,{}),e("div",{children:e(m,{width:40,height:40,imageUrl:c.image,alt:"Item",borderRadius:4})}),e(g,{children:b(c.name,40,!0)})]}))};export{E as ProductCard,P as ProductGroup,S as ProductsScreen};

package/dist/esm/components/product-picker-v2/searchScreen.d.ts

@@ -11,10 +11,6 @@ interface SearchScreenInterface {
         [key: string]: Collection;
     };
     onBackPress: () => void;
-    hideVariantCheckbox?: boolean;
-    pickerType?: 'COLLECTION' | 'PRODUCT';
-    hideProductVariants?: boolean;
-    hideProductCheckbox?: boolean;
 }
 export declare const SearchScreen: (props: SearchScreenInterface) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/esm/components/product-picker-v2/searchScreen.js

@@ -1 +1 @@
-import{jsxs as o,jsx as t,Fragment as e}from"react/jsx-runtime";import i from"../../assets/icons/arrow_left.svg.js";import{IconButton as r}from"../icon-button/IconButton.js";import{BodyCaption as l}from"../TypographyStyle.js";import{EmptyState as c}from"./emptyState.js";import{ProductGroup as d}from"./productScreen.js";import{SelectedScreenHeader as s}from"./style.js";import{liftTheStateUp as n}from"./utility.js";const u=u=>{const{customCollectionRestriction:a,selectedCollections:v,searchedCollections:p,selectedCollectionsDispatch:h,setScreen:m,collections:y,onBackPress:f,hideVariantCheckbox:j,pickerType:k,hideProductVariants:b,hideProductCheckbox:C}=u,O=(o,t)=>{var e,i,r,l,c,d,s,n,u;let a=0,p=0;return!!((null===(i=null===(e=null==v?void 0:v[o])||void 0===e?void 0:e.products)||void 0===i?void 0:i[t])&&(null===(d=Object.keys((null===(c=null===(l=null===(r=null==y?void 0:y[o])||void 0===r?void 0:r.products)||void 0===l?void 0:l[t])||void 0===c?void 0:c.variants)||[]))||void 0===d||d.forEach((()=>p++)),Object.keys((null===(u=null===(n=null===(s=null==v?void 0:v[o])||void 0===s?void 0:s.products)||void 0===n?void 0:n[t])||void 0===u?void 0:u.variants)||[]).forEach((()=>a++)),a>0&&p!==a))};return o("div",{children:[o(s,{children:[t(r,{Icon:i,onClick:()=>{m("collections"),f()}}),t(l,{children:"Searched Products"})]}),t("div",{children:Object.keys(p).length?t(e,{children:Object.keys(p).map((o=>{var e;return Object.keys((null===(e=null==p?void 0:p[o])||void 0===e?void 0:e.products)||[]).map((e=>{let i=!1;return(null==p?void 0:p.isCustom)&&(i=!0),t(d,{collectionId:o,upliftAdditions:(t,e)=>((o,t,e)=>{const i=n(e,p[o]);h({type:t,data:Object.assign(Object.assign({},i),{isRestricted:a})})})(o,t,e),productId:e,data:p[o].products[e],isProductPartiallyChecked:O(o,e),selectedData:v,selectedCollectionsDispatch:h,viewOnly:i,hideProductCheckbox:C,hideVariantCheckbox:j,hideProductVariants:b,pickerType:k},e)}))}))}):t(c,{title:"No search results found",subtitle:"We couldn’t find the product you were looking for."})})]})};export{u as SearchScreen};
+import{jsxs as o,jsx as t,Fragment as e}from"react/jsx-runtime";import i from"../../assets/icons/arrow_left.svg.js";import{IconButton as l}from"../icon-button/IconButton.js";import{BodyCaption as r}from"../TypographyStyle.js";import{EmptyState as s}from"./emptyState.js";import{ProductGroup as c}from"./productScreen.js";import{SelectedScreenHeader as d}from"./style.js";import{liftTheStateUp as n}from"./utility.js";const u=u=>{const{customCollectionRestriction:v,selectedCollections:a,searchedCollections:p,selectedCollectionsDispatch:m,setScreen:h,collections:f,onBackPress:j}=u,y=(o,t)=>{var e,i,l,r,s,c,d,n,u;let v=0,p=0;return!!((null===(i=null===(e=null==a?void 0:a[o])||void 0===e?void 0:e.products)||void 0===i?void 0:i[t])&&(null===(c=Object.keys((null===(s=null===(r=null===(l=null==f?void 0:f[o])||void 0===l?void 0:l.products)||void 0===r?void 0:r[t])||void 0===s?void 0:s.variants)||[]))||void 0===c||c.forEach((()=>p++)),Object.keys((null===(u=null===(n=null===(d=null==a?void 0:a[o])||void 0===d?void 0:d.products)||void 0===n?void 0:n[t])||void 0===u?void 0:u.variants)||[]).forEach((()=>v++)),v>0&&p!==v))};return o("div",{children:[o(d,{children:[t(l,{Icon:i,onClick:()=>{h("collections"),j()}}),t(r,{children:"Searched Products"})]}),t("div",{children:Object.keys(p).length?t(e,{children:Object.keys(p).map((o=>{var e;return Object.keys((null===(e=null==p?void 0:p[o])||void 0===e?void 0:e.products)||[]).map((e=>{let i=!1;return(null==p?void 0:p.isCustom)&&(i=!0),t(c,{collectionId:o,upliftAdditions:(t,e)=>((o,t,e)=>{const i=n(e,p[o]);m({type:t,data:Object.assign(Object.assign({},i),{isRestricted:v})})})(o,t,e),productId:e,data:p[o].products[e],isProductPartiallyChecked:y(o,e),selectedData:a,selectedCollectionsDispatch:m,viewOnly:i},e)}))}))}):t(s,{title:"No search results found",subtitle:"We couldn’t find the product you were looking for."})})]})};export{u as SearchScreen};

package/dist/esm/components/product-picker-v2/style.d.ts

@@ -2,7 +2,6 @@ export declare const ContainerStyle: import("styled-components").StyledComponent
 export declare const ScrollContainerStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const CollectionCardStyle: import("styled-components").StyledComponent<"div", any, {
     isDisabled: boolean;
-    isActive: boolean;
 }, never>;
 export declare const CollectionCardInfoStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const CollectionCardDetailStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -10,10 +9,6 @@ export declare const ProductScreenHeader: import("styled-components").StyledComp
 export declare const ProductScreenCollectionCardStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const ProductCardStyle: import("styled-components").StyledComponent<"div", any, {
     isVariant: boolean;
-    isActive: boolean;
 }, never>;
 export declare const SelectedScreenHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const CollectionNameHolder: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const VariantCardListStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const VariantCardGridStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const StyledHeaderRightIcon: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/esm/components/product-picker-v2/style.js

@@ -9,7 +9,7 @@ import e from"styled-components";import{COLORS as i}from"../../constants/Theme.j
 	overflow-x: hidden;
 `,n=e.div`
 	height: 64px;
-	background-color: ${e=>e.isDisabled?"#F0F0F0":e.isActive?i.background.positive.light:"white"};
+	background-color: ${e=>e.isDisabled?"#F0F0F0":"white"};
 	border-bottom: 1px solid #e0e0e0;
 	padding: 12px 24px;
 	display: flex;
@@ -17,11 +17,7 @@ import e from"styled-components";import{COLORS as i}from"../../constants/Theme.j
 	column-gap: 16px;
 	justify-content: space-between;
 	align-items: center;
-	:hover {
-		cursor: pointer;
-		background-color: ${i.surface.hovered};
-	}
-`,r=e.div`
+`,l=e.div`
 	display: flex;
 	flex-direction: row;
 	justify-content: center;
@@ -31,7 +27,7 @@ import e from"styled-components";import{COLORS as i}from"../../constants/Theme.j
 	display: flex;
 	flex-direction: column;
 	justify-content: center;
-`,l=e.div`
+`,r=e.div`
 	display: flex;
 	flex-direction: row;
 	max-height: 32px;
@@ -41,16 +37,16 @@ import e from"styled-components";import{COLORS as i}from"../../constants/Theme.j
 	align-items: center;
 	padding: 8px 16px;
 	margin-top: 16px;
-`,p=e.div`
+`,x=e.div`
 	display: flex;
 	flex-direction: row;
 	column-gap: 16px;
 	padding: 12px 16px;
 	border-bottom: 1px solid #e0e0e0;
 	align-items: center;
-`,x=e.div`
+`,p=e.div`
 	height: 64px;
-	background-color: ${e=>e.isActive?i.background.positive.light:"white"};
+	background-color: white;
 	border-bottom: 1px solid #e0e0e0;
 	padding: 12px 16px;
 	display: flex;
@@ -59,10 +55,6 @@ import e from"styled-components";import{COLORS as i}from"../../constants/Theme.j
 	justify-content: flex-start;
 	align-items: center;
 	padding-left: ${e=>e.isVariant?"42px":"16px"};
-	:hover {
-		cursor: pointer;
-		background-color: ${i.surface.hovered};
-	}
 `,c=e.div`
 	display: flex;
 	flex-direction: row;
@@ -75,36 +67,4 @@ import e from"styled-components";import{COLORS as i}from"../../constants/Theme.j
 `,a=e.div`
 	display: flex;
 	flex-direction: column;
-`,s=e.div`
-	height: 72px;
-	background: white;
-	padding: 12px 16px;
-	display: flex;
-	flex-direction: row;
-	gap: 16px;
-	align-items: center;
-	justify-content: center;
-
-	.tooltip-title-tag {
-		display: flex;
-		flex: 1;
-		flex-direction: column;
-		gap: 2px;
-	}
-`,g=e.div`
-	height: 72px;
-	width: 72px;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	margin: 16px;
-`;e.div`
-	display: flex;
-	width: 32px;
-	height: 32px;
-	padding: 6px;
-	justify-content: center;
-	align-items: center;
-	border: 1px solid ${i.stroke.primary};
-	border-radius: 4px;
-`;export{d as CollectionCardDetailStyle,r as CollectionCardInfoStyle,n as CollectionCardStyle,a as CollectionNameHolder,t as ContainerStyle,x as ProductCardStyle,p as ProductScreenCollectionCardStyle,l as ProductScreenHeader,o as ScrollContainerStyle,c as SelectedScreenHeader,g as VariantCardGridStyle,s as VariantCardListStyle};
+`;export{d as CollectionCardDetailStyle,l as CollectionCardInfoStyle,n as CollectionCardStyle,a as CollectionNameHolder,t as ContainerStyle,p as ProductCardStyle,x as ProductScreenCollectionCardStyle,r as ProductScreenHeader,o as ScrollContainerStyle,c as SelectedScreenHeader};

package/dist/esm/components/shimmer-image/ShimmerImage.d.ts

@@ -1,11 +1,10 @@
 import React from 'react';
 export type ShimmerImageProps = {
     imageUrl: string;
-    width: number | string;
+    width: number;
     height: number;
     alt?: string;
     borderRadius?: number;
     defaultImageUrl?: string;
 };
-export declare const DEFAULT_IMAGE = "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";
 export declare const ShimmerImage: React.FC<ShimmerImageProps>;

package/dist/esm/components/shimmer-image/ShimmerImage.js

@@ -1 +1 @@
-import{jsxs as e,jsx as r}from"react/jsx-runtime";import{useState as t,useEffect as i}from"react";import{BikShimmer as o}from"../shimmer/ShimmerComponent/BikShimmer.js";const a="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",l=l=>{let{imageUrl:s,width:d,height:n,borderRadius:m,alt:h,defaultImageUrl:c=a}=l;const[g,p]=t(!0),[b,u]=t(!1);return i((()=>{const e=new Image;return e.src=s,e.onload=()=>{u(!1),p(!1)},e.onerror=()=>{u(!0),p(!1)},()=>{e.onload=null,e.onerror=null}}),[s]),e("div",Object.assign({style:{position:"relative",width:d,height:n,borderRadius:m}},{children:[g&&r(o,{boxes:[{height:`${n}px`,width:`${d}px`,marginTop:"0px"}]}),r("img",b?{src:c,alt:null!=h?h:"Image",style:{borderRadius:null!=m?m:0,display:"block",width:"100%",height:"100%"}}:{src:s,alt:null!=h?h:"Image",style:{borderRadius:null!=m?m:0,display:g?"none":"block",width:"100%",height:"100%"}})]}))};export{a as DEFAULT_IMAGE,l as ShimmerImage};
+import{jsxs as e,jsx as r}from"react/jsx-runtime";import{useState as t,useEffect as i}from"react";import{BikShimmer as o}from"../shimmer/ShimmerComponent/BikShimmer.js";const a="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",l=l=>{let{imageUrl:s,width:d,height:n,borderRadius:m,alt:h,defaultImageUrl:c=a}=l;const[g,p]=t(!0),[b,u]=t(!1);return i((()=>{const e=new Image;return e.src=s,e.onload=()=>{u(!1),p(!1)},e.onerror=()=>{u(!0),p(!1)},()=>{e.onload=null,e.onerror=null}}),[s]),e("div",Object.assign({style:{position:"relative",width:d,height:n,borderRadius:m}},{children:[g&&r(o,{boxes:[{height:`${n}px`,width:`${d}px`,marginTop:"0px"}]}),r("img",b?{src:c,alt:null!=h?h:"Image",style:{borderRadius:null!=m?m:0,display:"block",width:"100%",height:"100%"}}:{src:s,alt:null!=h?h:"Image",style:{borderRadius:null!=m?m:0,display:g?"none":"block",width:"100%",height:"100%"}})]}))};export{l as ShimmerImage};

package/dist/esm/components/side-modal/SideModal.d.ts

@@ -7,11 +7,9 @@ export interface SideModalProps {
     footerDirection?: 'row' | 'row-reverse';
     hideCrossButton?: boolean;
     width?: string;
-    saveButtonProps?: ButtonProps;
-    cancelButtonProps?: ButtonProps;
+    saveButtonProps: ButtonProps;
+    cancelButtonProps: ButtonProps;
     onClose: () => void;
     zIndex?: number;
-    hideFooter?: boolean;
-    bodyStyle?: React.CSSProperties;
 }
 export declare const SideModal: React.FC<SideModalProps>;

package/dist/esm/components/side-modal/SideModal.js

@@ -1 +1 @@
-import{jsx as o,jsxs as t,Fragment as e}from"react/jsx-runtime";import r from"react-dom";import i from"../../assets/icons/cross.svg.js";import{Button as n}from"../button/Button.js";import{TitleMedium as s}from"../TypographyStyle.js";import{SideModalStyle as c,SideModalContainer as d,SideModalHeader as h,SideModalBody as l,SideModalFooter as m,FooterButtonWrapper as a}from"./SideModal.style.js";const j=j=>r.createPortal(o(c,Object.assign({zIndex:j.zIndex},{children:t(d,Object.assign({width:j.width},{children:[t(h,{children:[o(s,{children:j.header}),!j.hideCrossButton&&o(i,{width:24,height:24,onClick:j.onClose})]}),o(l,Object.assign({hideFooter:j.hideFooter,bodyStyle:Object.assign({},j.bodyStyle)},{children:j.children})),!0===j.hideFooter?null:t(m,Object.assign({footerDirection:j.footerDirection},{children:[t(a,Object.assign({footerDirection:j.footerDirection},{children:[o(n,Object.assign({},j.saveButtonProps)),o(n,Object.assign({},j.cancelButtonProps))]})),j.footerCustomComponent?j.footerCustomComponent:o(e,{})]}))]}))})),document.body);export{j as SideModal};
+import{jsx as o,jsxs as t,Fragment as e}from"react/jsx-runtime";import r from"react-dom";import n from"../../assets/icons/cross.svg.js";import{Button as i}from"../button/Button.js";import{TitleMedium as s}from"../TypographyStyle.js";import{SideModalStyle as c,SideModalContainer as m,SideModalHeader as d,SideModalBody as a,SideModalFooter as l,FooterButtonWrapper as h}from"./SideModal.style.js";const p=p=>r.createPortal(o(c,Object.assign({zIndex:p.zIndex},{children:t(m,{children:[t(d,{children:[o(s,{children:p.header}),!p.hideCrossButton&&o(n,{width:24,height:24,onClick:p.onClose})]}),o(a,{children:p.children}),t(l,Object.assign({footerDirection:p.footerDirection},{children:[t(h,Object.assign({footerDirection:p.footerDirection},{children:[o(i,Object.assign({},p.saveButtonProps)),o(i,Object.assign({},p.cancelButtonProps))]})),p.footerCustomComponent?p.footerCustomComponent:o(e,{})]}))]})})),document.body);export{p as SideModal};

package/dist/esm/components/side-modal/SideModal.style.d.ts

@@ -5,10 +5,7 @@ export declare const SideModalContainer: import("styled-components").StyledCompo
     width?: string | undefined;
 }, never>;
 export declare const SideModalHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const SideModalBody: import("styled-components").StyledComponent<"div", any, {
-    hideFooter?: boolean | undefined;
-    bodyStyle: React.CSSProperties;
-}, never>;
+export declare const SideModalBody: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const SideModalFooter: import("styled-components").StyledComponent<"div", any, {
     footerDirection?: "row" | "row-reverse" | undefined;
 }, never>;

package/dist/esm/components/side-modal/SideModal.style.js

@@ -1,22 +1,22 @@
-import e,{css as t}from"styled-components";import{COLORS as i}from"../../constants/Theme.js";import{ComponentZindex as o}from"../../constants/zindex.js";const r=e.div`
+import t from"styled-components";import{COLORS as i}from"../../constants/Theme.js";import{ComponentZindex as e}from"../../constants/zindex.js";const o=t.div`
 	position: fixed;
 	top: 0;
 	left: 0;
-	z-index: ${e=>e.zIndex||o.SIDE_MODAL};
+	z-index: ${t=>t.zIndex||e.SIDE_MODAL};
 	height: 100%;
 	width: 100%;
 	background-color: rgba(0, 0, 0, 0.4);
 	display: flex;
 	align-items: center;
 	justify-content: flex-end;
-`,n=e.div`
+`,r=t.div`
 	height: 100%;
-	width: ${e=>e.width||"566px"};
+	width: ${t=>t.width||"566px"};
 	background: ${i.surface.standard};
 	position: relative;
 	display: flex;
 	flex-direction: column;
-`,d=e.div`
+`,n=t.div`
 	width: 100%;
 	height: 60px;
 	position: sticky;
@@ -31,27 +31,24 @@ import e,{css as t}from"styled-components";import{COLORS as i}from"../../constan
 	svg:hover {
 		cursor: pointer;
 	}
-`,s=e.div`
+`,d=t.div`
 	overflow-y: auto;
 	padding: 24px;
-	height: ${e=>e.hideFooter?"calc(100% - 60px)":"calc(100% - 120px)"};
-	${e=>{let{bodyStyle:i}=e;return t`
-		${Object.keys(i).map((e=>`${e}: ${i[e]};`)).join("\n")}
-	`}}
-`,p=e.div`
+	height: calc(100% - 120px);
+`,s=t.div`
 	height: 60px;
 	width: 100%;
 	position: sticky;
 	bottom: 0;
 	display: flex;
-	flex-direction: ${e=>e.footerDirection||"row"};
+	flex-direction: ${t=>t.footerDirection||"row"};
 	justify-content: space-between;
 	align-items: center;
 	background: ${i.surface.standard};
 	border-top: 1px solid ${i.stroke.primary};
 	padding: 0px 24px;
-`,a=e.div`
+`,p=t.div`
 	display: flex;
-	flex-direction: ${e=>e.footerDirection||"row"};
+	flex-direction: ${t=>t.footerDirection||"row"};
 	gap: 8px;
-`;export{a as FooterButtonWrapper,s as SideModalBody,n as SideModalContainer,p as SideModalFooter,d as SideModalHeader,r as SideModalStyle};
+`;export{p as FooterButtonWrapper,d as SideModalBody,r as SideModalContainer,s as SideModalFooter,n as SideModalHeader,o as SideModalStyle};

package/dist/esm/components/star-rating/Star.d.ts

@@ -8,5 +8,4 @@ export declare const Star: React.FC<{
     onHover?: (hovered: boolean) => void;
     /** this means this star is hovered-active cause there is a star hovered after this  */
     asHovered?: boolean;
-    mode?: 'VIEW' | 'EDIT';
 }>;

package/dist/esm/components/star-rating/Star.js

@@ -1 +1 @@
-import{jsx as o}from"react/jsx-runtime";import{useState as e,useEffect as r}from"react";import{COLORS as n}from"../../constants/Theme.js";import t from"../../assets/icons/starEmpty.svg.js";import l from"../../assets/icons/starFilled.svg.js";const s=s=>{let{size:i,filled:u,emptyColor:c,filledColor:a,onClick:d,asHovered:m,onHover:h,mode:E}=s;const[g,p]=e(!1);return r((()=>{null==h||h(g)}),[g]),r((()=>{m||p(!1)}),[m]),m?o(l,{onClick:()=>{null==d||d("select")},onMouseEnter:()=>p(!0),onMouseLeave:()=>p(!1),style:{cursor:"pointer"},width:i,height:i,color:null!=a?a:n.background.warning.vibrant}):g?o(l,{onMouseLeave:()=>p(!1),onMouseEnter:()=>p(!0),style:{cursor:"pointer"},onClick:()=>{null==d||d("select")},width:i,height:i,color:null!=a?a:n.background.warning.vibrant}):u?o(l,{onMouseEnter:()=>"VIEW"!==E&&p(!0),onMouseLeave:()=>"VIEW"!==E&&p(!1),style:{cursor:"VIEW"!==E?"pointer":"default"},onClick:()=>{"VIEW"!==E&&(null==d||d("de-select"))},width:i,height:i,color:null!=a?a:n.background.warning.vibrant}):o(t,{onMouseEnter:()=>"VIEW"!==E&&p(!0),onMouseLeave:()=>"VIEW"!==E&&p(!1),style:{cursor:"VIEW"!==E?"pointer":"default"},onClick:()=>{"VIEW"!==E&&(null==d||d("select"))},width:i,height:i,color:null!=c?c:n.surface.standard})};export{s as Star};
+import{jsx as o}from"react/jsx-runtime";import{useState as e,useEffect as r}from"react";import{COLORS as n}from"../../constants/Theme.js";import t from"../../assets/icons/starEmpty.svg.js";import l from"../../assets/icons/starFilled.svg.js";const s=s=>{let{size:i,filled:c,emptyColor:u,filledColor:a,onClick:d,asHovered:m,onHover:h}=s;const[g,p]=e(!1);return r((()=>{null==h||h(g)}),[g]),r((()=>{m||p(!1)}),[m]),m?o(l,{onClick:()=>{null==d||d("select")},onMouseEnter:()=>p(!0),onMouseLeave:()=>p(!1),style:{cursor:"pointer"},width:i,height:i,color:null!=a?a:n.background.warning.vibrant}):g?o(l,{onMouseLeave:()=>p(!1),onMouseEnter:()=>p(!0),style:{cursor:"pointer"},onClick:()=>{null==d||d("select")},width:i,height:i,color:null!=a?a:n.background.warning.vibrant}):c?o(l,{onMouseEnter:()=>p(!0),onMouseLeave:()=>p(!1),style:{cursor:"pointer"},onClick:()=>{null==d||d("de-select")},width:i,height:i,color:null!=a?a:n.background.warning.vibrant}):o(t,{onMouseEnter:()=>p(!0),onMouseLeave:()=>p(!1),style:{cursor:"pointer"},onClick:()=>{null==d||d("select")},width:i,height:i,color:null!=u?u:n.surface.standard})};export{s as Star};

package/dist/esm/components/star-rating/StarRating.d.ts

@@ -6,5 +6,4 @@ export declare const StarRating: React.FC<{
     value?: number;
     maxValue?: number;
     starSize?: number;
-    mode?: 'VIEW' | 'EDIT';
 }>;

package/dist/esm/components/star-rating/StarRating.js

@@ -1 +1 @@
-import g from"@emotion/styled/base";import{jsx as I}from"react/jsx-runtime";import{useState as C,useMemo as A,useEffect as c}from"react";import{Star as l}from"./Star.js";const e=g("div","production"===process.env.NODE_ENV?{target:"e1yh3w250"}:{target:"e1yh3w250",label:"Container"})("production"===process.env.NODE_ENV?{name:"31c8wb",styles:"display:flex;flex-direction:row;gap:12px;justify-content:start;align-items:center"}:{name:"31c8wb",styles:"display:flex;flex-direction:row;gap:12px;justify-content:start;align-items:center",map:"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlN0YXJSYXRpbmcudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUk2QiIsImZpbGUiOiJTdGFyUmF0aW5nLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGpzeCBhcyBfanN4IH0gZnJvbSBcInJlYWN0L2pzeC1ydW50aW1lXCI7XHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcclxuaW1wb3J0IHsgdXNlRWZmZWN0LCB1c2VNZW1vLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcclxuaW1wb3J0IHsgU3RhciB9IGZyb20gJy4vU3Rhcic7XHJcbmNvbnN0IENvbnRhaW5lciA9IHN0eWxlZC5kaXYgYFxuXHRkaXNwbGF5OiBmbGV4O1xuXHRmbGV4LWRpcmVjdGlvbjogcm93O1xuXHRnYXA6IDEycHg7XG5cdGp1c3RpZnktY29udGVudDogc3RhcnQ7XG5cdGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5gO1xyXG5leHBvcnQgY29uc3QgU3RhclJhdGluZyA9ICh7IGVtcHR5Q29sb3IsIGZpbGxlZENvbG9yLCBvbkNoYW5nZSwgdmFsdWUsIG1heFZhbHVlLCBzdGFyU2l6ZSwgbW9kZSwgfSkgPT4ge1xyXG4gICAgY29uc3QgW3N0YXJzLCBzZXRTdGFyc10gPSB1c2VTdGF0ZSh2YWx1ZSAhPT0gbnVsbCAmJiB2YWx1ZSAhPT0gdm9pZCAwID8gdmFsdWUgOiAwKTtcclxuICAgIGNvbnN0IFttb3VudGVkLCBzZXRNb3VudGVkRmxhZ10gPSB1c2VTdGF0ZShmYWxzZSk7XHJcbiAgICBjb25zdCBbaG92ZXJlZFN0YXIsIHNldEhvdmVyZWRTdGFyXSA9IHVzZVN0YXRlKDApO1xyXG4gICAgY29uc3QgYXJyID0gdXNlTWVtbygoKSA9PiB7XHJcbiAgICAgICAgY29uc3QgbGltaXQgPSBtYXhWYWx1ZSAhPT0gbnVsbCAmJiBtYXhWYWx1ZSAhPT0gdm9pZCAwID8gbWF4VmFsdWUgOiA1O1xyXG4gICAgICAgIHJldHVybiBBcnJheShsaW1pdClcclxuICAgICAgICAgICAgLmZpbGwobnVsbClcclxuICAgICAgICAgICAgLm1hcCgoXywgaWR4KSA9PiBpZHggKyAxKTtcclxuICAgIH0sIFttYXhWYWx1ZV0pO1xyXG4gICAgdXNlRWZmZWN0KCgpID0+IHtcclxuICAgICAgICBpZiAobW91bnRlZCkge1xyXG4gICAgICAgICAgICBvbkNoYW5nZShzdGFycyk7XHJcbiAgICAgICAgfVxyXG4gICAgfSwgW3N0YXJzXSk7XHJcbiAgICB1c2VFZmZlY3QoKCkgPT4ge1xyXG4gICAgICAgIHNldE1vdW50ZWRGbGFnKHRydWUpO1xyXG4gICAgfSwgW10pO1xyXG4gICAgcmV0dXJuIChfanN4KENvbnRhaW5lciwgeyBjaGlsZHJlbjogYXJyLm1hcCgoaWR4KSA9PiAoX2pzeChTdGFyLCB7IGFzSG92ZXJlZDogaG92ZXJlZFN0YXIgPyBpZHggPD0gaG92ZXJlZFN0YXIgOiBmYWxzZSwgc2l6ZTogc3RhclNpemUgIT09IG51bGwgJiYgc3RhclNpemUgIT09IHZvaWQgMCA/IHN0YXJTaXplIDogMjQsIGZpbGxlZDogaG92ZXJlZFN0YXIgPyB1bmRlZmluZWQgOiBpZHggPD0gc3RhcnMsIGVtcHR5Q29sb3I6IGVtcHR5Q29sb3IsIGZpbGxlZENvbG9yOiBmaWxsZWRDb2xvciwgb25DbGljazogKGFjdGlvbikgPT4ge1xyXG4gICAgICAgICAgICAgICAgaWYgKGFjdGlvbiA9PT0gJ2RlLXNlbGVjdCcpIHtcclxuICAgICAgICAgICAgICAgICAgICBpZiAoaWR4IDwgc3RhcnMpIHtcclxuICAgICAgICAgICAgICAgICAgICAgICAgc2V0U3RhcnMoaWR4KTtcclxuICAgICAgICAgICAgICAgICAgICB9XHJcbiAgICAgICAgICAgICAgICAgICAgZWxzZSB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgIHNldFN0YXJzKGlkeCAtIDEpO1xyXG4gICAgICAgICAgICAgICAgICAgIH1cclxuICAgICAgICAgICAgICAgIH1cclxuICAgICAgICAgICAgICAgIGVsc2Uge1xyXG4gICAgICAgICAgICAgICAgICAgIHNldFN0YXJzKGlkeCk7XHJcbiAgICAgICAgICAgICAgICB9XHJcbiAgICAgICAgICAgIH0sIG9uSG92ZXI6IChob3ZlcmVkKSA9PiB7XHJcbiAgICAgICAgICAgICAgICBpZiAoaG92ZXJlZClcclxuICAgICAgICAgICAgICAgICAgICBzZXRIb3ZlcmVkU3RhcihpZHgpO1xyXG4gICAgICAgICAgICAgICAgZWxzZSB7XHJcbiAgICAgICAgICAgICAgICAgICAgc2V0SG92ZXJlZFN0YXIoMCk7XHJcbiAgICAgICAgICAgICAgICB9XHJcbiAgICAgICAgICAgIH0sIG1vZGU6IG1vZGUgfSwgaWR4KSkpIH0pKTtcclxufTtcclxuLy8jIHNvdXJjZU1hcHBpbmdVUkw9U3RhclJhdGluZy5qcy5tYXAiXX0= */",toString:function(){return"You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."}}),t=g=>{let{emptyColor:t,filledColor:Z,onChange:b,value:i,maxValue:G,starSize:X,mode:o}=g;const[d,a]=C(null!=i?i:0),[n,s]=C(!1),[p,W]=C(0),m=A((()=>Array(null!=G?G:5).fill(null).map(((g,I)=>I+1))),[G]);return c((()=>{n&&b(d)}),[d]),c((()=>{s(!0)}),[]),I(e,{children:m.map((g=>I(l,{asHovered:!!p&&g<=p,size:null!=X?X:24,filled:p?void 0:g<=d,emptyColor:t,filledColor:Z,onClick:I=>{a("de-select"===I?g<d?g:g-1:g)},onHover:I=>{W(I?g:0)},mode:o},g)))})};export{t as StarRating};
+import I from"@emotion/styled/base";import{jsx as g}from"react/jsx-runtime";import{useState as C,useMemo as A,useEffect as c}from"react";import{Star as l}from"./Star.js";const b=I("div","production"===process.env.NODE_ENV?{target:"e1yh3w250"}:{target:"e1yh3w250",label:"Container"})("production"===process.env.NODE_ENV?{name:"31c8wb",styles:"display:flex;flex-direction:row;gap:12px;justify-content:start;align-items:center"}:{name:"31c8wb",styles:"display:flex;flex-direction:row;gap:12px;justify-content:start;align-items:center",map:"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlN0YXJSYXRpbmcudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUk2QiIsImZpbGUiOiJTdGFyUmF0aW5nLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGpzeCBhcyBfanN4IH0gZnJvbSBcInJlYWN0L2pzeC1ydW50aW1lXCI7XHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcclxuaW1wb3J0IHsgdXNlRWZmZWN0LCB1c2VNZW1vLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcclxuaW1wb3J0IHsgU3RhciB9IGZyb20gJy4vU3Rhcic7XHJcbmNvbnN0IENvbnRhaW5lciA9IHN0eWxlZC5kaXYgYFxuXHRkaXNwbGF5OiBmbGV4O1xuXHRmbGV4LWRpcmVjdGlvbjogcm93O1xuXHRnYXA6IDEycHg7XG5cdGp1c3RpZnktY29udGVudDogc3RhcnQ7XG5cdGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5gO1xyXG5leHBvcnQgY29uc3QgU3RhclJhdGluZyA9ICh7IGVtcHR5Q29sb3IsIGZpbGxlZENvbG9yLCBvbkNoYW5nZSwgdmFsdWUsIG1heFZhbHVlLCBzdGFyU2l6ZSB9KSA9PiB7XHJcbiAgICBjb25zdCBbc3RhcnMsIHNldFN0YXJzXSA9IHVzZVN0YXRlKHZhbHVlICE9PSBudWxsICYmIHZhbHVlICE9PSB2b2lkIDAgPyB2YWx1ZSA6IDApO1xyXG4gICAgY29uc3QgW21vdW50ZWQsIHNldE1vdW50ZWRGbGFnXSA9IHVzZVN0YXRlKGZhbHNlKTtcclxuICAgIGNvbnN0IFtob3ZlcmVkU3Rhciwgc2V0SG92ZXJlZFN0YXJdID0gdXNlU3RhdGUoMCk7XHJcbiAgICBjb25zdCBhcnIgPSB1c2VNZW1vKCgpID0+IHtcclxuICAgICAgICBjb25zdCBsaW1pdCA9IG1heFZhbHVlICE9PSBudWxsICYmIG1heFZhbHVlICE9PSB2b2lkIDAgPyBtYXhWYWx1ZSA6IDU7XHJcbiAgICAgICAgcmV0dXJuIEFycmF5KGxpbWl0KVxyXG4gICAgICAgICAgICAuZmlsbChudWxsKVxyXG4gICAgICAgICAgICAubWFwKChfLCBpZHgpID0+IGlkeCArIDEpO1xyXG4gICAgfSwgW21heFZhbHVlXSk7XHJcbiAgICB1c2VFZmZlY3QoKCkgPT4ge1xyXG4gICAgICAgIGlmIChtb3VudGVkKSB7XHJcbiAgICAgICAgICAgIG9uQ2hhbmdlKHN0YXJzKTtcclxuICAgICAgICB9XHJcbiAgICB9LCBbc3RhcnNdKTtcclxuICAgIHVzZUVmZmVjdCgoKSA9PiB7XHJcbiAgICAgICAgc2V0TW91bnRlZEZsYWcodHJ1ZSk7XHJcbiAgICB9LCBbXSk7XHJcbiAgICByZXR1cm4gKF9qc3goQ29udGFpbmVyLCB7IGNoaWxkcmVuOiBhcnIubWFwKChpZHgpID0+IChfanN4KFN0YXIsIHsgYXNIb3ZlcmVkOiBob3ZlcmVkU3RhciA/IGlkeCA8PSBob3ZlcmVkU3RhciA6IGZhbHNlLCBzaXplOiBzdGFyU2l6ZSAhPT0gbnVsbCAmJiBzdGFyU2l6ZSAhPT0gdm9pZCAwID8gc3RhclNpemUgOiAyNCwgZmlsbGVkOiBob3ZlcmVkU3RhciA/IHVuZGVmaW5lZCA6IGlkeCA8PSBzdGFycywgZW1wdHlDb2xvcjogZW1wdHlDb2xvciwgZmlsbGVkQ29sb3I6IGZpbGxlZENvbG9yLCBvbkNsaWNrOiAoYWN0aW9uKSA9PiB7XHJcbiAgICAgICAgICAgICAgICBpZiAoYWN0aW9uID09PSAnZGUtc2VsZWN0Jykge1xyXG4gICAgICAgICAgICAgICAgICAgIGlmIChpZHggPCBzdGFycykge1xyXG4gICAgICAgICAgICAgICAgICAgICAgICBzZXRTdGFycyhpZHgpO1xyXG4gICAgICAgICAgICAgICAgICAgIH1cclxuICAgICAgICAgICAgICAgICAgICBlbHNlIHtcclxuICAgICAgICAgICAgICAgICAgICAgICAgc2V0U3RhcnMoaWR4IC0gMSk7XHJcbiAgICAgICAgICAgICAgICAgICAgfVxyXG4gICAgICAgICAgICAgICAgfVxyXG4gICAgICAgICAgICAgICAgZWxzZSB7XHJcbiAgICAgICAgICAgICAgICAgICAgc2V0U3RhcnMoaWR4KTtcclxuICAgICAgICAgICAgICAgIH1cclxuICAgICAgICAgICAgfSwgb25Ib3ZlcjogKGhvdmVyZWQpID0+IHtcclxuICAgICAgICAgICAgICAgIGlmIChob3ZlcmVkKVxyXG4gICAgICAgICAgICAgICAgICAgIHNldEhvdmVyZWRTdGFyKGlkeCk7XHJcbiAgICAgICAgICAgICAgICBlbHNlIHtcclxuICAgICAgICAgICAgICAgICAgICBzZXRIb3ZlcmVkU3RhcigwKTtcclxuICAgICAgICAgICAgICAgIH1cclxuICAgICAgICAgICAgfSB9LCBpZHgpKSkgfSkpO1xyXG59O1xyXG4vLyMgc291cmNlTWFwcGluZ1VSTD1TdGFyUmF0aW5nLmpzLm1hcCJdfQ== */",toString:function(){return"You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."}}),e=I=>{let{emptyColor:e,filledColor:t,onChange:i,value:Z,maxValue:o,starSize:G}=I;const[d,n]=C(null!=Z?Z:0),[s,m]=C(!1),[a,X]=C(0),p=A((()=>Array(null!=o?o:5).fill(null).map(((I,g)=>g+1))),[o]);return c((()=>{s&&i(d)}),[d]),c((()=>{m(!0)}),[]),g(b,{children:p.map((I=>g(l,{asHovered:!!a&&I<=a,size:null!=G?G:24,filled:a?void 0:I<=d,emptyColor:e,filledColor:t,onClick:g=>{n("de-select"===g?I<d?I:I-1:I)},onHover:g=>{X(g?I:0)}},I)))})};export{e as StarRating};

package/dist/esm/components/tag/Tag.styled.js

@@ -1 +1 @@
-import c from"@emotion/styled/base";import{getPadding as l,getBackgroundColor as b,generateBorder as d,getTextColor as t}from"./themes.js";const e=c("div","production"===process.env.NODE_ENV?{target:"e930jd90"}:{target:"e930jd90",label:"Tag"})("cursor:",(c=>{var l;return null!==(l=c.cursor)&&void 0!==l?l:"default"}),";",(c=>"regular"===c.variant?"display: block;\n\t\t     min-height: 26px;\n\t\t":"min-height: 20px;")," .container{display:flex;align-items:center;gap:6px;padding:",(c=>l(c.variant)),";background-color:",(c=>b(c.theme,c.type)),";border-radius:",(c=>"regular"===c.variant?"4px":"12px"),";",(c=>"light"===c.theme&&`border: ${"2.0"===c.version?.5:1}px solid ${d(c.type)};`)," .text{color:",(c=>t(c.theme,c.type)),";}.icon-trailing{all:unset;display:flex;}.icon-leading{all:unset;display:flex;}}"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRhZy5zdHlsZWQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUU4QiIsImZpbGUiOiJUYWcuc3R5bGVkLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcclxuaW1wb3J0IHsgZ2VuZXJhdGVCb3JkZXIsIGdldEJhY2tncm91bmRDb2xvciwgZ2V0UGFkZGluZywgZ2V0VGV4dENvbG9yLCB9IGZyb20gJy4vdGhlbWVzJztcclxuZXhwb3J0IGNvbnN0IFRhZyA9IHN0eWxlZC5kaXYgYFxuXHRjdXJzb3I6ICR7KHByb3BzKSA9PiB7IHZhciBfYTsgcmV0dXJuIChfYSA9IHByb3BzLmN1cnNvcikgIT09IG51bGwgJiYgX2EgIT09IHZvaWQgMCA/IF9hIDogJ2RlZmF1bHQnOyB9fTtcblx0JHsocHJvcHMpID0+IHByb3BzLnZhcmlhbnQgPT09ICdyZWd1bGFyJ1xyXG4gICAgPyBgZGlzcGxheTogYmxvY2s7XG5cdFx0ICAgICBtaW4taGVpZ2h0OiAyNnB4O1xuXHRcdGBcclxuICAgIDogYG1pbi1oZWlnaHQ6IDIwcHg7YH1cblx0LmNvbnRhaW5lciB7XG5cdFx0ZGlzcGxheTogZmxleDtcblx0XHRhbGlnbi1pdGVtczogY2VudGVyO1xuXHRcdGdhcDogNnB4O1xuXHRcdHBhZGRpbmc6ICR7KHByb3BzKSA9PiBnZXRQYWRkaW5nKHByb3BzLnZhcmlhbnQpfTtcblxuXHRcdGJhY2tncm91bmQtY29sb3I6ICR7KHByb3BzKSA9PiBnZXRCYWNrZ3JvdW5kQ29sb3IocHJvcHMudGhlbWUsIHByb3BzLnR5cGUpfTtcblxuXHRcdGJvcmRlci1yYWRpdXM6ICR7KHByb3BzKSA9PiAocHJvcHMudmFyaWFudCA9PT0gJ3JlZ3VsYXInID8gJzRweCcgOiAnMTJweCcpfTtcblxuXHRcdCR7KHByb3BzKSA9PiBwcm9wcy50aGVtZSA9PT0gJ2xpZ2h0JyAmJlxyXG4gICAgYGJvcmRlcjogJHtwcm9wcy52ZXJzaW9uID09PSAnMi4wJyA/IDAuNSA6IDF9cHggc29saWQgJHtnZW5lcmF0ZUJvcmRlcihwcm9wcy50eXBlKX07YH1cblxuXHRcdC50ZXh0IHtcblx0XHRcdGNvbG9yOiAkeyhwcm9wcykgPT4gZ2V0VGV4dENvbG9yKHByb3BzLnRoZW1lLCBwcm9wcy50eXBlKX07XG5cdFx0fVxuXG5cdFx0Lmljb24tdHJhaWxpbmcge1xuXHRcdFx0YWxsOiB1bnNldDtcblx0XHRcdGRpc3BsYXk6IGZsZXg7XG5cdFx0fVxuXG5cdFx0Lmljb24tbGVhZGluZyB7XG5cdFx0XHRhbGw6IHVuc2V0O1xuXHRcdFx0ZGlzcGxheTogZmxleDtcblx0XHR9XG5cdH1cbmA7XHJcbi8vIyBzb3VyY2VNYXBwaW5nVVJMPVRhZy5zdHlsZWQuanMubWFwIl19 */"));export{e as Tag};
+import c from"@emotion/styled/base";import{getPadding as l,getBackgroundColor as b,generateBorder as d,getTextColor as X}from"./themes.js";const g=c("div","production"===process.env.NODE_ENV?{target:"e930jd90"}:{target:"e930jd90",label:"Tag"})("cursor:",(c=>{var l;return null!==(l=c.cursor)&&void 0!==l?l:"default"}),";",(c=>"regular"===c.variant?"display: block;\n\t\t     height: 26px;\n\t\t":"height: 20px;")," .container{display:flex;align-items:center;gap:6px;padding:",(c=>l(c.variant)),";background-color:",(c=>b(c.theme,c.type)),";border-radius:",(c=>"regular"===c.variant?"4px":"12px"),";",(c=>"light"===c.theme&&`border: ${"2.0"===c.version?.5:1}px solid ${d(c.type)};`)," .text{color:",(c=>X(c.theme,c.type)),";}.icon-trailing{all:unset;display:flex;}.icon-leading{all:unset;display:flex;}}"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRhZy5zdHlsZWQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUU4QiIsImZpbGUiOiJUYWcuc3R5bGVkLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcclxuaW1wb3J0IHsgZ2VuZXJhdGVCb3JkZXIsIGdldEJhY2tncm91bmRDb2xvciwgZ2V0UGFkZGluZywgZ2V0VGV4dENvbG9yLCB9IGZyb20gJy4vdGhlbWVzJztcclxuZXhwb3J0IGNvbnN0IFRhZyA9IHN0eWxlZC5kaXYgYFxuXHRjdXJzb3I6ICR7KHByb3BzKSA9PiB7IHZhciBfYTsgcmV0dXJuIChfYSA9IHByb3BzLmN1cnNvcikgIT09IG51bGwgJiYgX2EgIT09IHZvaWQgMCA/IF9hIDogJ2RlZmF1bHQnOyB9fTtcblx0JHsocHJvcHMpID0+IHByb3BzLnZhcmlhbnQgPT09ICdyZWd1bGFyJ1xyXG4gICAgPyBgZGlzcGxheTogYmxvY2s7XG5cdFx0ICAgICBoZWlnaHQ6IDI2cHg7XG5cdFx0YFxyXG4gICAgOiBgaGVpZ2h0OiAyMHB4O2B9XG5cdC5jb250YWluZXIge1xuXHRcdGRpc3BsYXk6IGZsZXg7XG5cdFx0YWxpZ24taXRlbXM6IGNlbnRlcjtcblx0XHRnYXA6IDZweDtcblx0XHRwYWRkaW5nOiAkeyhwcm9wcykgPT4gZ2V0UGFkZGluZyhwcm9wcy52YXJpYW50KX07XG5cblx0XHRiYWNrZ3JvdW5kLWNvbG9yOiAkeyhwcm9wcykgPT4gZ2V0QmFja2dyb3VuZENvbG9yKHByb3BzLnRoZW1lLCBwcm9wcy50eXBlKX07XG5cblx0XHRib3JkZXItcmFkaXVzOiAkeyhwcm9wcykgPT4gKHByb3BzLnZhcmlhbnQgPT09ICdyZWd1bGFyJyA/ICc0cHgnIDogJzEycHgnKX07XG5cblx0XHQkeyhwcm9wcykgPT4gcHJvcHMudGhlbWUgPT09ICdsaWdodCcgJiZcclxuICAgIGBib3JkZXI6ICR7cHJvcHMudmVyc2lvbiA9PT0gJzIuMCcgPyAwLjUgOiAxfXB4IHNvbGlkICR7Z2VuZXJhdGVCb3JkZXIocHJvcHMudHlwZSl9O2B9XG5cblx0XHQudGV4dCB7XG5cdFx0XHRjb2xvcjogJHsocHJvcHMpID0+IGdldFRleHRDb2xvcihwcm9wcy50aGVtZSwgcHJvcHMudHlwZSl9O1xuXHRcdH1cblxuXHRcdC5pY29uLXRyYWlsaW5nIHtcblx0XHRcdGFsbDogdW5zZXQ7XG5cdFx0XHRkaXNwbGF5OiBmbGV4O1xuXHRcdH1cblxuXHRcdC5pY29uLWxlYWRpbmcge1xuXHRcdFx0YWxsOiB1bnNldDtcblx0XHRcdGRpc3BsYXk6IGZsZXg7XG5cdFx0fVxuXHR9XG5gO1xyXG4vLyMgc291cmNlTWFwcGluZ1VSTD1UYWcuc3R5bGVkLmpzLm1hcCJdfQ== */"));export{g as Tag};

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

@@ -3,7 +3,7 @@ import { CHANNEL_TYPE } from '../template-preview/models/Channels';
 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 { WhatsAppPickerMeta, WhatsAppTemplate, WhatsAppTemplateVariables } from '../template-preview/models/WhatsAppTemplate';
 export interface TemplateContextMapperProps {
     selectedTemplate: WhatsAppTemplate | EmailTemplateType | SMSTemplateType;
     closeDialog?: () => void;
@@ -11,7 +11,7 @@ export interface TemplateContextMapperProps {
     channel: CHANNEL_TYPE;
     globalPlaceholders: GlobalPlaceholderType;
     /** List of variables being used in this template */
-    templateVariables: CUSTOM_VARIABLE[] | WhatsAppTemplateVariables;
+    templateVariables: CUSTOM_VARIABLE[];
     /** Only for initial-UI-purpose for the modal */
     htmlContent: string;
     showOnlyContent?: boolean;
@@ -20,14 +20,6 @@ export interface TemplateContextMapperProps {
     zIndex?: number;
     showVariableModal?: boolean;
     variableList?: VariableListInterfaceV2[];
-    variableListForImage?: VariableListInterfaceV2[];
     onBackPress?: () => void;
-    discountCode?: string;
-    setDiscountCode?: (code: string) => void;
-    enabledCustomText?: boolean;
-    showSampleValues?: boolean;
-    disableEditVariable?: boolean;
-    pod?: POD;
-    extras?: ExtrasWhatsapp;
 }
-export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList, discountCode, setDiscountCode, onBackPress, enabledCustomText, variableListForImage, showSampleValues, disableEditVariable, pod, extras, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList, onBackPress, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1 +1 @@
-import{jsx as e,jsxs as t,Fragment as l}from"react/jsx-runtime";import{useEffect as o,useState as a,useMemo as i}from"react";import r from"../../utils/StringUtils.js";import{StyledModal as s}from"../modals/styledModal.js";import{CHANNEL_TYPE as n}from"../template-preview/models/Channels.js";import{TemplateModalContext as d}from"./context/templateModalContext.js";import c from"./modalElements/Footer.js";import m from"./modalElements/TemplateSelectModalContent.js";import{convertPlaceholdersToBikDropdown as p}from"./utils/convertPlaceholdersToBikDropdown.js";const u=u=>{let{selectedTemplate:h,closeDialog:b,showVariableMapping:g,channel:v,htmlContent:C,templateVariables:S,onTemplateSelect:f,globalPlaceholders:w,showOnlyContent:M,whatsappSpecificPickerMeta:T,zIndex:V,showVariableModal:j,variableList:x,discountCode:L,setDiscountCode:P,onBackPress:E,enabledCustomText:I,variableListForImage:y,showSampleValues:k,disableEditVariable:D,pod:A,extras:O}=u;var F,z;o((()=>{N(C)}),[C]);const[B,H]=a(v===n.EMAIL?"desktop":"mobile"),[$,N]=a(C),[U,W]=a(!1),[_,q]=a(h),[G,J]=a(null!=S?S:[]),[K,Q]=a(!1);const R=i((()=>p(w)),[w]);return e(d.Provider,Object.assign({value:{template:_,setTemplate:q,device:B,setDevice:H,display_content:$,setDisplayContent:N,originalVariableList:G,setOriginalVariableList:J,isError:U,setIsError:W,channel:v,globalNormalizedPlaceholders:R,templateSelectionTriggered:K,setTemplateSelectionTriggered:Q,enabledCustomText:I,disableEditVariable:D,pod:A,extras:O}},{children:M?e(m,{channel:n.EMAIL,hideHeader:!0}):t(s,Object.assign({zIndex:V,centralContainerStyles:{width:v===n.EMAIL&&g?1e3:800},open:!0,onClose:()=>{null==b||b()},headingTitle:null==_?void 0:_.label,headingSubtitle:v===n.WHATSAPP?`${r.capitaliseFirstLetterOfString(null!==(F=null==_?void 0:_.category)&&void 0!==F?F:"")} • ${null!==(z=null==_?void 0:_.templateCategory)&&void 0!==z?z:""}`:"",onBackPress:()=>{null==E||E()}},{children:[e(m,{showSampleValues:k,showVariableMapping:g,channel:v,whatsappSpecificPickerMeta:T,showVariableModal:j,variableList:x,discountCode:L,setDiscountCode:P,variableListForImage:y&&(null==y?void 0:y.length)>0?y:x}),f?e(c,{onSelect:function(){const e=null==f?void 0:f(_,G,null!=$?$:"");e?W(!!e):Q(!0)}}):e(l,{})]}))}))};export{u as TemplateContextMapper};
+import{jsx as e,jsxs as l,Fragment as t}from"react/jsx-runtime";import{useEffect as o,useState as a,useMemo as i}from"react";import r from"../../utils/StringUtils.js";import{StyledModal as n}from"../modals/styledModal.js";import{CHANNEL_TYPE as s}from"../template-preview/models/Channels.js";import{TemplateModalContext as c}from"./context/templateModalContext.js";import m from"./modalElements/Footer.js";import p from"./modalElements/TemplateSelectModalContent.js";import{convertPlaceholdersToBikDropdown as d}from"./utils/convertPlaceholdersToBikDropdown.js";const h=h=>{let{selectedTemplate:g,closeDialog:u,showVariableMapping:b,channel:v,htmlContent:f,templateVariables:M,onTemplateSelect:S,globalPlaceholders:j,showOnlyContent:w,whatsappSpecificPickerMeta:P,zIndex:T,showVariableModal:C,variableList:L,onBackPress:y}=h;var E,V;o((()=>{A(f)}),[f]);const[k,x]=a(v===s.EMAIL?"desktop":"mobile"),[I,A]=a(f),[O,D]=a(!1),[z,B]=a(g),[F,H]=a(null!=M?M:[]),[$,N]=a(!1);const U=i((()=>d(j)),[j]);return e(c.Provider,Object.assign({value:{template:z,setTemplate:B,device:k,setDevice:x,display_content:I,setDisplayContent:A,originalVariableList:F,setOriginalVariableList:H,isError:O,setIsError:D,channel:v,globalNormalizedPlaceholders:U,templateSelectionTriggered:$,setTemplateSelectionTriggered:N}},{children:w?e(p,{channel:s.EMAIL,hideHeader:!0}):l(n,Object.assign({zIndex:T,centralContainerStyles:{width:v===s.EMAIL&&b?1e3:650},open:!0,onClose:()=>{null==u||u()},headingTitle:null==z?void 0:z.label,headingSubtitle:v===s.WHATSAPP?`${r.capitaliseFirstLetterOfString(null!==(E=null==z?void 0:z.category)&&void 0!==E?E:"")} • ${null!==(V=null==z?void 0:z.templateCategory)&&void 0!==V?V:""}`:"",onBackPress:()=>{null==y||y()}},{children:[e(p,{showVariableMapping:b,channel:v,whatsappSpecificPickerMeta:P,showVariableModal:C,variableList:L}),S?e(m,{onSelect:function(){const e=null==S?void 0:S(z,F,null!=I?I:"");e?D(!!e):N(!0)}}):e(t,{})]}))}))};export{h as TemplateContextMapper};

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

@@ -3,7 +3,7 @@ import { CHANNEL_TYPE } from "../../template-preview/models/Channels";
 import { EmailTemplateType } from "../../template-preview/models/EmailTemplate";
 import { SMSTemplateType } from "../../template-preview/models/SmsTemplate";
 import { CUSTOM_VARIABLE, globalNormalizedPlaceholdersType } from "../../template-preview/models/TemplateMeta";
-import { ExtrasWhatsapp, WhatsAppTemplate, WhatsAppTemplateVariables } from "../../template-preview/models/WhatsAppTemplate";
+import { WhatsAppTemplate, WhatsAppTemplateVariables } from "../../template-preview/models/WhatsAppTemplate";
 export type DEVICE_TYPES = 'desktop' | 'mobile';
 export declare const TemplateModalContext: React.Context<{
     device: DEVICE_TYPES;
@@ -21,10 +21,6 @@ export declare const TemplateModalContext: React.Context<{
     globalNormalizedPlaceholders?: globalNormalizedPlaceholdersType[] | undefined;
     templateSelectionTriggered: boolean;
     setTemplateSelectionTriggered?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
-    enabledCustomText?: boolean | undefined;
-    disableEditVariable?: boolean | undefined;
-    pod?: string | undefined;
-    extras?: ExtrasWhatsapp | undefined;
 }>;
 export declare const useTemplateModalContext: () => {
     device: DEVICE_TYPES;
@@ -42,8 +38,4 @@ export declare const useTemplateModalContext: () => {
     globalNormalizedPlaceholders?: globalNormalizedPlaceholdersType[] | undefined;
     templateSelectionTriggered: boolean;
     setTemplateSelectionTriggered?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
-    enabledCustomText?: boolean | undefined;
-    disableEditVariable?: boolean | undefined;
-    pod?: string | undefined;
-    extras?: ExtrasWhatsapp | undefined;
 };

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

@@ -1 +1 @@
-import e,{useContext as t}from"react";import{CHANNEL_TYPE as l}from"../../template-preview/models/Channels.js";const r=e.createContext({device:"desktop",templateSelectionTriggered:!1,display_content:null,originalVariableList:[],channel:l.EMAIL,template:null,isError:!1,enabledCustomText:!1,disableEditVariable:!1}),a=()=>t(r);export{r as TemplateModalContext,a as useTemplateModalContext};
+import e,{useContext as t}from"react";import{CHANNEL_TYPE as r}from"../../template-preview/models/Channels.js";const l=e.createContext({device:"desktop",templateSelectionTriggered:!1,display_content:null,originalVariableList:[],channel:r.EMAIL,template:null,isError:!1}),o=()=>t(l);export{l as TemplateModalContext,o as useTemplateModalContext};

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

@@ -6,10 +6,6 @@ export interface BodyProps {
     whatsappSpecificPickerMeta?: WhatsAppPickerMeta;
     showVariableModal?: boolean;
     variableList?: VariableListInterfaceV2[];
-    variableListForImage?: VariableListInterfaceV2[];
-    discountCode?: string;
-    setDiscountCode?: (code: string) => void;
-    showSampleValues?: boolean;
 }
 declare const Body: (props: BodyProps) => import("react/jsx-runtime").JSX.Element;
 export default Body;

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

@@ -1,17 +1,18 @@
-import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import{useRef as l}from"react";import n from"styled-components";import{CHANNEL_TYPE as i}from"../../template-preview/models/Channels.js";import{COLORS as a}from"../../../constants/Theme.js";import{useTemplateModalContext as r}from"../context/templateModalContext.js";import{getVariableNameForEmailByIndex as s}from"../utils/getVariableNameEmail.js";import{highlightFor as p}from"../utils/highlightFor.js";import d from"./DesktopPreview.js";import m from"./EditWhatsAppTemplateV2.js";import c from"./MobilePreview.js";import u from"./VariableConnectorsPanel.js";const h=n.div`
+import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import{useRef as l}from"react";import n from"styled-components";import{CHANNEL_TYPE as i}from"../../template-preview/models/Channels.js";import{COLORS as a}from"../../../constants/Theme.js";import{useTemplateModalContext as r}from"../context/templateModalContext.js";import{getVariableNameForEmailByIndex as p}from"../utils/getVariableNameEmail.js";import{highlightFor as s}from"../utils/highlightFor.js";import m from"./DesktopPreview.js";import d from"./EditWhatsAppTemplateV2.js";import c from"./MobilePreview.js";import h from"./VariableConnectorsPanel.js";const f=n.div`
 	display: flex;
 	//	height: 100%;
-`,f=n.div`
+`,u=n.div`
 	padding: 16px 14px;
-	max-width: 450px;
+	border-left-width: 1px;
+	border-left-color: ${a.stroke.primary};
+	max-width: 350px;
 
 	height: ${e=>e.channel===i.WHATSAPP?"500px":"475px"};
 	overflow-y: 'auto';
 	padding-bottom: 24px;
-	border-left: ${a.stroke.primary} 1px solid;
 `,v=n.div`
 	padding: ${e=>e.showOnlyContent?"16px 14px":"16px 32px"};
 	flex: 1;
 	height: 475px;
 	overflow-y: auto;
-`,g=n=>{const{showVariableMapping:g,showOnlyContent:w,whatsappSpecificPickerMeta:b,showVariableModal:x,variableList:y,discountCode:C,setDiscountCode:j,variableListForImage:M,showSampleValues:V}=n,P=l(),E=l(),{device:S,display_content:T,channel:k,template:A,setTemplate:L}=r();const I=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e(h,{children:[t(v,Object.assign({showOnlyContent:w,showVariableMapping:g},{children:"mobile"===S?t(c,{ref:E,display_content:null!=T?T:"",channel:k,template:A,showSampleValues:V}):k!==i.MESSAGE?t(d,{ref:P,channel:k,display_content:null!=T?T:"",showSampleValues:V}):t(o,{})})),g&&t(f,Object.assign({channel:k},{children:k!==i.WHATSAPP?t(u,{onFocus:k===i.EMAIL?function(e){var t,o,l;const n=null===document||void 0===document?void 0:document.getElementById("mobile"===S?"template_html_mobile":"template_html_desktop"),r=s(e+1),d=k===i.EMAIL?null===(t=null==n?void 0:n.contentWindow)||void 0===t?void 0:t.document.getElementById(r):document.getElementById(r),m=I(d),c=null==d?void 0:d.offsetLeft;"desktop"===S?m&&P.current&&(null===(o=null==n?void 0:n.contentWindow)||void 0===o||o.scrollTo(null!=c?c:0,m),p(r,a.background.warning.light,2,k,S)):m&&E.current&&(null===(l=null==n?void 0:n.contentWindow)||void 0===l||l.scrollTo(null!=c?c:0,m),p(r,a.background.warning.light,2,k,S))}:void 0,showVariableModal:x,variableList:y,discountCode:C,setDiscountCode:j}):t(m,{whatsappSpecificPickerMeta:b,template:A,onTemplateChange:e=>{null==L||L(e)},showVariableModal:x,variableList:y,variableListForImage:M,discountCode:C,setDiscountCode:j})}))]})};export{g as default};
+`,g=n=>{const{showVariableMapping:g,showOnlyContent:w,whatsappSpecificPickerMeta:b,showVariableModal:x,variableList:y}=n,j=l(),M=l(),{device:P,display_content:E,channel:T,template:k,setTemplate:A}=r();const V=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e(f,{children:[t(v,Object.assign({showOnlyContent:w,showVariableMapping:g},{children:"mobile"===P?t(c,{ref:M,display_content:null!=E?E:"",channel:T,template:k}):T!==i.MESSAGE?t(m,{ref:j,channel:T,display_content:null!=E?E:""}):t(o,{})})),g&&t(u,Object.assign({channel:T},{children:T!==i.WHATSAPP?t(h,{onFocus:T===i.EMAIL?function(e){var t,o,l;const n=null===document||void 0===document?void 0:document.getElementById("mobile"===P?"template_html_mobile":"template_html_desktop"),r=p(e+1),m=T===i.EMAIL?null===(t=null==n?void 0:n.contentWindow)||void 0===t?void 0:t.document.getElementById(r):document.getElementById(r),d=V(m),c=null==m?void 0:m.offsetLeft;"desktop"===P?d&&j.current&&(null===(o=null==n?void 0:n.contentWindow)||void 0===o||o.scrollTo(null!=c?c:0,d),s(r,a.background.warning.light,2,T,P)):d&&M.current&&(null===(l=null==n?void 0:n.contentWindow)||void 0===l||l.scrollTo(null!=c?c:0,d),s(r,a.background.warning.light,2,T,P))}:void 0,showVariableModal:x,variableList:y}):t(d,{whatsappSpecificPickerMeta:b,template:k,onTemplateChange:e=>{null==A||A(e)},showVariableModal:x,variableList:y})}))]})};export{g as default};

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

@@ -3,6 +3,5 @@ import { CHANNEL_TYPE } from "../../template-preview/models/Channels";
 declare const DesktopPreview: React.ForwardRefExoticComponent<{
     display_content: string;
     channel: CHANNEL_TYPE;
-    showSampleValues?: boolean | undefined;
 } & React.RefAttributes<HTMLDivElement>>;
 export default DesktopPreview;

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

@@ -1,20 +1,20 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import r from"react";import i from"styled-components";import{Spinner as p}from"../../spinner/Spinner.js";import{TemplatePreview as a}from"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{COLORS as o}from"../../../constants/Theme.js";import"../../template-preview/models/TemplateMeta.js";import"../../template-preview/models/WhatsAppTemplate.js";import{CHANNEL_TYPE as s}from"../../template-preview/models/Channels.js";const m=i.div`
-	background: ${o.surface.standard};
-	border: 1px solid ${o.stroke.primary};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import r from"react";import i from"styled-components";import{Spinner as p}from"../../spinner/Spinner.js";import{TemplatePreview as o}from"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import{COLORS as a}from"../../../constants/Theme.js";import"../../template-preview/models/TemplateMeta.js";import{CHANNEL_TYPE as m}from"../../template-preview/models/Channels.js";const s=i.div`
+	background: ${a.surface.standard};
+	border: 1px solid ${a.stroke.primary};
 	border-radius: 8px;
 	overflow-y: auto;
 	/* max-height: 420px; */
 	scroll-behavior: smooth;
 	height: 100%;
-`,l=i.div`
+`,d=i.div`
 	padding: 18px 24px 12px;
 	display: flex;
 	gap: 4px;
 	border-bottom-width: 1px;
-	border-bottom-color: ${o.stroke.primary};
-`,d=i.div`
+	border-bottom-color: ${a.stroke.primary};
+`,l=i.div`
 	width: 6px;
 	height: 6px;
 	background: #d9d9d9;
 	border-radius: 3px;
-`,n=r.forwardRef(((r,i)=>{let{display_content:o,showSampleValues:n}=r;return e(m,Object.assign({ref:i},{children:[e(l,{children:[t(d,{}),t(d,{}),t(d,{})]}),t("div",{children:o?t(a,{showSampleValues:n,channel:s.EMAIL,hideHeader:!0,emailSpecificMeta:{emailDisplayContent:o,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_desktop",containerStyle:{width:584,height:441},templateContainerStyles:{height:"100%"}}}):t("div",Object.assign({style:{padding:20}},{children:t(p,{size:"small"})}))})]}))}));n.displayName="DesktopPreview";export{n as default};
+`,n=r.forwardRef(((r,i)=>{let{display_content:a}=r;return e(s,Object.assign({ref:i},{children:[e(d,{children:[t(l,{}),t(l,{}),t(l,{})]}),t("div",{children:a?t(o,{channel:m.EMAIL,hideHeader:!0,emailSpecificMeta:{emailDisplayContent:a,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_desktop",containerStyle:{width:584,height:441},templateContainerStyles:{height:"100%"}}}):t("div",Object.assign({style:{padding:20}},{children:t(p,{size:"small"})}))})]}))}));n.displayName="DesktopPreview";export{n as default};

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

@@ -1,15 +1,11 @@
-/// <reference types="react" />
 import { HEADER_TYPES } from "../../template-preview/models/TemplateMeta";
 export interface EditMediaV2Props {
     imageName: string[];
-    selectedVariable?: string;
     errorSecondaryText?: string;
     error?: string;
     isLoading?: boolean;
     mediaType?: HEADER_TYPES;
     handleImageChange?: () => void;
-    disableEditVariable?: boolean;
-    setOpenEditMedia?: React.Dispatch<React.SetStateAction<boolean>>;
 }
 declare const EditMediaV2: (props: EditMediaV2Props) => import("react/jsx-runtime").JSX.Element;
 export default EditMediaV2;

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

@@ -1,8 +1,8 @@
-import{jsxs as e,jsx as i,Fragment as t}from"react/jsx-runtime";import r from"../../../assets/icons/document_pdf.svg.js";import o from"../../../assets/icons/edit.svg.js";import s from"../../../assets/icons/refresh.svg.js";import n from"styled-components";import{ShimmerImage as l}from"../../shimmer-image/ShimmerImage.js";import{Spinner as d}from"../../spinner/Spinner.js";import{HEADER_TYPES as a}from"../../template-preview/models/TemplateMeta.js";import{BodyCaption as c,BodySecondary as m,Caption as p}from"../../TypographyStyle.js";import h from"../../../utils/StringUtils.js";import{COLORS as g}from"../../../constants/Theme.js";import{Container as f,ImageContainer as j,RightComponent as y}from"./EditMediaV2.style.js";const u=n.div`
+import{jsxs as e,jsx as t,Fragment as i}from"react/jsx-runtime";import o from"../../../assets/icons/document_pdf.svg.js";import r from"../../../assets/icons/edit.svg.js";import s from"../../../assets/icons/refresh.svg.js";import n from"../../../assets/icons/video_camcorder.svg.js";import l from"styled-components";import{Spinner as c}from"../../spinner/Spinner.js";import{HEADER_TYPES as d}from"../../template-preview/models/TemplateMeta.js";import{BodyCaption as a,BodySecondary as m,Caption as p}from"../../TypographyStyle.js";import h from"../../../utils/StringUtils.js";import{COLORS as g}from"../../../constants/Theme.js";import{Container as f,ImageContainer as j,RightComponent as y}from"./EditMediaV2.style.js";const v=l.div`
 	padding-left: 14px;
 	padding-right: 6px;
 	width: 44px;
 	height: 24px;
 	border-left: 1px solid ${g.stroke.primary};
 	cursor: pointer;
-`,v=n=>{const{imageName:v,error:b,isLoading:O,mediaType:w,disableEditVariable:x,selectedVariable:L,setOpenEditMedia:E}=n,k=null==v?void 0:v[0].split("/"),C=null==k?void 0:k[k.length-1];return e(f,{children:[i(j,Object.assign({error:!!b,onClick:()=>null==E?void 0:E(!0)},{children:b?i(s,{color:g.content.brand,width:32,height:32}):O?i(d,{size:"small"}):w===a.IMAGE?i(l,{imageUrl:null==v?void 0:v[0],width:56,height:56}):w===a.VIDEO?i("video",Object.assign({src:v[0],style:{width:56,height:56}},{children:i("track",{default:!0,kind:"captions",srcLang:"en",src:v[0]})})):i(r,{width:18,height:22,color:g.content.placeholder})})),e(y,{children:[i("div",Object.assign({style:{flex:1}},{children:v&&b?i(t,{}):O?i(c,Object.assign({style:{marginLeft:8}},{children:"Your media is getting loaded..."})):i(m,Object.assign({style:{color:g.content.primary,marginLeft:8}},{children:L||h.toCapitilize(null==w?void 0:w.toLowerCase())||C}))})),!!b&&e("div",Object.assign({style:{display:"flex",flexDirection:"column",marginLeft:8}},{children:[e(m,Object.assign({style:{color:g.content.negative}},{children:["Error loading this ",null==w?void 0:w.toLowerCase(),". Retry"]})),i(p,Object.assign({style:{color:g.content.secondary}},{children:b}))]})),!x&&!b&&!O&&i(u,Object.assign({onClick:()=>null==E?void 0:E(!0),onKeyDown:()=>null==E?void 0:E(!0),role:"presentation"},{children:i(o,{width:24,height:24,color:g.content.placeholder})}))]})]})};export{v as default};
+`,u=l=>{const{imageName:u,error:b,isLoading:x,mediaType:w,handleImageChange:O}=l,C=null==u?void 0:u[0].split("/"),L=null==C?void 0:C[C.length-1];return e(f,{children:[t(j,Object.assign({error:!!b,onClick:b?O:void 0},{children:b?t(s,{color:g.content.brand,width:32,height:32}):x?t(c,{size:"small"}):w===d.IMAGE?t("img",{alt:"",src:null==u?void 0:u[0],style:{width:"100%",height:"56px",borderRadius:8,objectFit:"cover"}}):w===d.VIDEO?t(n,{width:18,height:22,color:g.content.placeholder}):t(o,{width:18,height:22,color:g.content.placeholder})})),e(y,{children:[t("div",Object.assign({style:{flex:1}},{children:u&&b?t(i,{}):x?t(a,Object.assign({style:{marginLeft:8}},{children:"Your media is getting loaded..."})):t(m,Object.assign({style:{color:g.content.primary,marginLeft:8}},{children:h.toCapitilize(null==w?void 0:w.toLowerCase())||L}))})),!!b&&e("div",Object.assign({style:{display:"flex",flexDirection:"column",marginLeft:8}},{children:[e(m,Object.assign({style:{color:g.content.negative}},{children:["Error loading this ",null==w?void 0:w.toLowerCase(),". Retry"]})),t(p,Object.assign({style:{color:g.content.secondary}},{children:b}))]})),!b&&!x&&t(v,Object.assign({onClick:O,onKeyDown:O,role:"presentation"},{children:t(r,{width:24,height:24,color:g.content.placeholder})}))]})]})};export{u as default};