@bikdotai/bik-component-library 0.0.453 → 0.0.454-beta.ppi-2

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

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

@@ -1,6 +1,7 @@
 /// <reference types="react" />
-import { Collection, SelectedItems } from '.';
+import { Collection, FbStatusFetcherReturn, SelectedItems } from '.';
 import { SelectedCollectionsActions } from './reducers';
+import { OUT_OF_STOCK_ACTION } from './type';
 interface SelectedScreenInterface {
     selectedCollections: SelectedItems;
     selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
@@ -8,6 +9,9 @@ interface SelectedScreenInterface {
     collections: {
         [key: string]: Collection;
     };
+    outOfStockAction?: OUT_OF_STOCK_ACTION;
+    storeId: string;
+    fbStatusFetcher?: (storeId: string, variantIds: string[]) => FbStatusFetcherReturn;
 }
 export declare const SelectedScreen: (props: SelectedScreenInterface) => import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -1 +1 @@
-import{jsxs as o,jsx as t,Fragment as l}from"react/jsx-runtime";import e from"../../assets/icons/arrow_left.svg.js";import{IconButton as i}from"../icon-button/IconButton.js";import{BodyCaption as r}from"../TypographyStyle.js";import{EmptyState as d}from"./emptyState.js";import{ProductGroup as c}from"./productScreen.js";import{SelectedScreenHeader as n}from"./style.js";const s=s=>{const{selectedCollections:u,selectedCollectionsDispatch:v,setScreen:p,collections:a}=s,m=(o,t)=>{var l,e,i,r,d,c,n,s,v;let p=0,m=0;return!!((null===(e=null===(l=null==u?void 0:u[o])||void 0===l?void 0:l.products)||void 0===e?void 0:e[t])&&(null===(c=Object.keys((null===(d=null===(r=null===(i=null==a?void 0:a[o])||void 0===i?void 0:i.products)||void 0===r?void 0:r[t])||void 0===d?void 0:d.variants)||[]))||void 0===c||c.forEach((()=>m++)),Object.keys((null===(v=null===(s=null===(n=null==u?void 0:u[o])||void 0===n?void 0:n.products)||void 0===s?void 0:s[t])||void 0===v?void 0:v.variants)||[]).forEach((()=>p++)),p>0&&m!==p))};return o("div",{children:[o(n,{children:[t(i,{Icon:e,onClick:()=>{p("collections")}}),t(r,{children:"Selected Products"})]}),t("div",{children:Object.keys(u).length>0?t(l,{children:Object.keys(u).map((o=>{var l;return Object.keys((null===(l=null==u?void 0:u[o])||void 0===l?void 0:l.products)||[]).map((l=>{let e=!1;return(null==u?void 0:u.isCustom)&&(e=!0),t(c,{upliftAdditions:null,collectionId:o,productId:l,data:u[o].products[l],isProductPartiallyChecked:m(o,l),selectedData:u,selectedCollectionsDispatch:v,viewOnly:e},l)}))}))}):t(d,{title:"No Products Selected",subtitle:"Select products will appear here"})})]})};export{s as SelectedScreen};
+import{jsxs as t,jsx as e,Fragment as o}from"react/jsx-runtime";import r from"../../assets/icons/arrow_left.svg.js";import{useRef as c,useReducer as l,useEffect as n}from"react";import{IconButton as i}from"../icon-button/IconButton.js";import{BodyCaption as s}from"../TypographyStyle.js";import{EmptyState as d}from"./emptyState.js";import{ProductGroup as u}from"./productScreen.js";import{paginationReducer as a}from"./reducers.js";import{SelectedScreenHeader as v}from"./style.js";import{fetchFbStatus as p}from"./useFetchFbStatus copy.js";import{paginateSelectedItems as m}from"./utility.js";const f=f=>{const{selectedCollections:j,selectedCollectionsDispatch:h,setScreen:y,collections:g,outOfStockAction:b,storeId:S,fbStatusFetcher:k}=f,O=c(0),C=c(null),[I,P]=l(a,{});n((()=>{O.current=0;const t=m(j,10,0);P({type:"paginate",data:t}),p(t,S,P,k,!0),O.current+=1}),[]),n((()=>{P({type:"filter",data:j})}),[j]),n((()=>{console.log("vj: observertarget",C.current);const t=new IntersectionObserver((t=>{if(console.log("vj: observertargetinside",t),t[0].isIntersecting&&(console.log("vj: nextPageRef",O.current),O.current>0)){const t=m(j,10,O.current);console.log("paginated inside observer target",{paginatedProducts:t,selectedCollections:j,curScreenData:I}),P({type:"paginate",data:t}),p(t,S,P,k),O.current+=1}}),{threshold:1});return C.current&&t.observe(C.current),()=>{C.current&&t.unobserve(C.current)}}),[C,j]);const w=(t,e)=>{var o,r,c,l,n,i,s,d,u;let a=0,v=0;return!!((null===(r=null===(o=null==j?void 0:j[t])||void 0===o?void 0:o.products)||void 0===r?void 0:r[e])&&(null===(i=Object.keys((null===(n=null===(l=null===(c=null==g?void 0:g[t])||void 0===c?void 0:c.products)||void 0===l?void 0:l[e])||void 0===n?void 0:n.variants)||[]))||void 0===i||i.forEach((()=>v++)),Object.keys((null===(u=null===(d=null===(s=null==j?void 0:j[t])||void 0===s?void 0:s.products)||void 0===d?void 0:d[e])||void 0===u?void 0:u.variants)||[]).forEach((()=>a++)),a>0&&v!==a))};return t("div",{children:[t(v,{children:[e(i,{Icon:r,onClick:()=>{y("collections")}}),e(s,{children:"Selected Products"})]}),t("div",{children:[Object.keys(I).length>0?e(o,{children:Object.keys(I).map((t=>{var o;return Object.keys((null===(o=null==I?void 0:I[t])||void 0===o?void 0:o.products)||[]).map((o=>{let r=!1;return(null==I?void 0:I.isCustom)&&(r=!0),e(u,{upliftAdditions:null,collectionId:t,productId:o,data:I[t].products[o],isProductPartiallyChecked:w(t,o),selectedData:j,selectedCollectionsDispatch:h,viewOnly:r,outOfStockAction:b},o)}))}))}):e(d,{title:"No Products Selected",subtitle:"Select products will appear here"}),e("div",{ref:C})]})]})};export{f as SelectedScreen};

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

@@ -1,8 +1,7 @@
 import e from"styled-components";import{COLORS as i}from"../../constants/Theme.js";const t=e.div`
 	display: flex;
 	background-color: white;
-	max-height: 600px;
-	min-height: 600px;
+	height: 600px;
 	flex-direction: column;
 `,o=e.div`
 	overflow-y: scroll;
@@ -31,7 +30,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`
+`,p=e.div`
 	display: flex;
 	flex-direction: row;
 	max-height: 32px;
@@ -41,15 +40,18 @@ 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`
+	position: sticky;
+	top: 0;
+	z-index: 10;
+`,l=e.div`
 	display: flex;
 	flex-direction: row;
 	column-gap: 16px;
 	padding: 12px 16px;
 	border-bottom: 1px solid #e0e0e0;
 	align-items: center;
-`,x=e.div`
-	height: 64px;
+`,c=e.div`
+	min-height: 64px;
 	background-color: ${e=>e.isActive?i.background.positive.light:"white"};
 	border-bottom: 1px solid #e0e0e0;
 	padding: 12px 16px;
@@ -63,7 +65,7 @@ import e from"styled-components";import{COLORS as i}from"../../constants/Theme.j
 		cursor: pointer;
 		background-color: ${i.surface.hovered};
 	}
-`,c=e.div`
+`,x=e.div`
 	display: flex;
 	flex-direction: row;
 	max-height: 32px;
@@ -72,11 +74,14 @@ import e from"styled-components";import{COLORS as i}from"../../constants/Theme.j
 	justify-content: flex-start;
 	align-items: center;
 	padding: 8px 16px;
+	position: sticky;
+	top: 0;
+	z-index: 10;
 `,a=e.div`
 	display: flex;
 	flex-direction: column;
 `,s=e.div`
-	height: 72px;
+	min-height: 72px;
 	background: white;
 	padding: 12px 16px;
 	display: flex;
@@ -107,4 +112,4 @@ import e from"styled-components";import{COLORS as i}from"../../constants/Theme.j
 	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,r as CollectionCardInfoStyle,n as CollectionCardStyle,a as CollectionNameHolder,t as ContainerStyle,c as ProductCardStyle,l as ProductScreenCollectionCardStyle,p as ProductScreenHeader,o as ScrollContainerStyle,x as SelectedScreenHeader,g as VariantCardGridStyle,s as VariantCardListStyle};

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

@@ -0,0 +1,2 @@
+import { FbStatusFetcherReturn, SelectedItems } from './modal';
+export declare const fetchFbStatus: (data: SelectedItems, storeId: string, dispatchCurScreenData: any, fbStatusFetcher?: ((storeId: string, variantIds: string[]) => FbStatusFetcherReturn) | undefined, set?: boolean) => void;

package/dist/esm/components/product-picker-v2/useFetchFbStatus copy.js

@@ -0,0 +1 @@
+const o=(o,d,v,l,i)=>{if(!l){const d=o;Object.keys(d).forEach((o=>{var v,l;const i=null!==(l=null===(v=d[o])||void 0===v?void 0:v.products)&&void 0!==l?l:{};Object.keys(i).forEach((v=>{var l,i,t,n;const a=null!==(n=null===(t=null===(i=null===(l=d[o])||void 0===l?void 0:l.products)||void 0===i?void 0:i[v])||void 0===t?void 0:t.variants)&&void 0!==n?n:{};Object.keys(a).forEach((l=>{var i,t,n,a;const s=null===(a=null===(n=null===(t=null===(i=d[o])||void 0===i?void 0:i.products)||void 0===t?void 0:t[v])||void 0===n?void 0:n.variants)||void 0===a?void 0:a[l];s&&(s.fbStatus="APPROVED")}))}))})),v({type:"update",data:d})}const t=(o=>{const d=[];return Object.keys(o).forEach((v=>{var l,i;const t=null!==(i=null===(l=o[v])||void 0===l?void 0:l.products)&&void 0!==i?i:{};Object.keys(t).forEach((l=>{var i,t,n,a;const s=null!==(a=null===(n=null===(t=null===(i=o[v])||void 0===i?void 0:i.products)||void 0===t?void 0:t[l])||void 0===n?void 0:n.variants)&&void 0!==a?a:{};Object.keys(s).forEach((i=>{var t,n,a,s;const u=null===(s=null===(a=null===(n=null===(t=o[v])||void 0===t?void 0:t.products)||void 0===n?void 0:n[l])||void 0===a?void 0:a.variants)||void 0===s?void 0:s[i];(null==u?void 0:u.fbStatus)||d.push(i)}))}))})),d})(o);console.log("vj: variantids",t),t.length>0&&l&&l(d,t).then((d=>{const l=Object.assign({},o);Object.keys(l).forEach((o=>{var v,i;const t=null!==(i=null===(v=l[o])||void 0===v?void 0:v.products)&&void 0!==i?i:{};Object.keys(t).forEach((v=>{var i,t,n,a;const s=null!==(a=null===(n=null===(t=null===(i=l[o])||void 0===i?void 0:i.products)||void 0===t?void 0:t[v])||void 0===n?void 0:n.variants)&&void 0!==a?a:{};Object.keys(s).forEach((i=>{var t,n,a,s;const u=null===(s=null===(a=null===(n=null===(t=l[o])||void 0===t?void 0:t.products)||void 0===n?void 0:n[v])||void 0===a?void 0:a.variants)||void 0===s?void 0:s[i];u&&"REJECTED"===d[i]?u.fbStatus="REJECTED":u&&"APPROVED"===d[i]&&(u.fbStatus="APPROVED")}))}))})),console.log("updated data",l),v(i?{type:"set",data:l}:{type:"update",data:l})})).catch((d=>{const l=Object.assign({},o);Object.keys(l).forEach((o=>{var d,v;const i=null!==(v=null===(d=l[o])||void 0===d?void 0:d.products)&&void 0!==v?v:{};Object.keys(i).forEach((d=>{var v,i,t,n;const a=null!==(n=null===(t=null===(i=null===(v=l[o])||void 0===v?void 0:v.products)||void 0===i?void 0:i[d])||void 0===t?void 0:t.variants)&&void 0!==n?n:{};Object.keys(a).forEach((v=>{var i,t,n,a;const s=null===(a=null===(n=null===(t=null===(i=l[o])||void 0===i?void 0:i.products)||void 0===t?void 0:t[d])||void 0===n?void 0:n.variants)||void 0===a?void 0:a[v];s&&(s.fbStatus="APPROVED")}))}))})),console.log("vj: variantids",l),v({type:"update",data:l})}))};export{o as fetchFbStatus};

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

@@ -0,0 +1,5 @@
+import { FbStatusFetcherReturn, SelectedItems } from './modal';
+import { SelectedCollectionsActions } from './reducers';
+export declare const useFetchFbStatusForCollections: (data: SelectedItems, storeId: string, selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>, fbStatusFetcher?: ((storeId: string, variantIds: string[]) => FbStatusFetcherReturn) | undefined, autoFetch?: boolean, setSearchedCollections?: React.Dispatch<React.SetStateAction<SelectedItems | undefined>>) => {
+    fetchFbStatus: () => void;
+};

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

@@ -0,0 +1 @@
+const o=function(o,v,d,i){let l=arguments.length>5?arguments[5]:void 0;const t=()=>{if(!i){const v=Object.assign({},o);Object.keys(v).forEach((o=>{var d,i;const l=null!==(i=null===(d=v[o])||void 0===d?void 0:d.products)&&void 0!==i?i:{};Object.keys(l).forEach((d=>{var i,l,t,n;const s=null!==(n=null===(t=null===(l=null===(i=v[o])||void 0===i?void 0:i.products)||void 0===l?void 0:l[d])||void 0===t?void 0:t.variants)&&void 0!==n?n:{};Object.keys(s).forEach((i=>{var l,t,n,s;const a=null===(s=null===(n=null===(t=null===(l=v[o])||void 0===l?void 0:l.products)||void 0===t?void 0:t[d])||void 0===n?void 0:n.variants)||void 0===s?void 0:s[i];a&&(a.fbStatus="APPROVED")}))}))})),l?l(v):d({type:"paged",data:v})}const t=(()=>{const v=[];return Object.keys(o).forEach((d=>{var i,l;const t=null!==(l=null===(i=o[d])||void 0===i?void 0:i.products)&&void 0!==l?l:{};Object.keys(t).forEach((i=>{var l,t,n,s;const a=null!==(s=null===(n=null===(t=null===(l=o[d])||void 0===l?void 0:l.products)||void 0===t?void 0:t[i])||void 0===n?void 0:n.variants)&&void 0!==s?s:{};Object.keys(a).forEach((l=>{var t,n,s,a;const c=null===(a=null===(s=null===(n=null===(t=o[d])||void 0===t?void 0:t.products)||void 0===n?void 0:n[i])||void 0===s?void 0:s.variants)||void 0===a?void 0:a[l];(null==c?void 0:c.fbStatus)||v.push(l)}))}))})),v})();console.log("vj: variantids",t),t.length>0&&i&&i(v,t).then((v=>{const i=Object.assign({},o);Object.keys(i).forEach((o=>{var d,l;const t=null!==(l=null===(d=i[o])||void 0===d?void 0:d.products)&&void 0!==l?l:{};Object.keys(t).forEach((d=>{var l,t,n,s;const a=null!==(s=null===(n=null===(t=null===(l=i[o])||void 0===l?void 0:l.products)||void 0===t?void 0:t[d])||void 0===n?void 0:n.variants)&&void 0!==s?s:{};Object.keys(a).forEach((l=>{var t,n,s,a;const c=null===(a=null===(s=null===(n=null===(t=i[o])||void 0===t?void 0:t.products)||void 0===n?void 0:n[d])||void 0===s?void 0:s.variants)||void 0===a?void 0:a[l];c&&"REJECTED"===v[l]?c.fbStatus="REJECTED":c&&"APPROVED"===v[l]&&(c.fbStatus="APPROVED")}))}))})),console.log("variantids",i),l?l(i):d({type:"paged",data:i})})).catch((v=>{const i=Object.assign({},o);Object.keys(i).forEach((o=>{var v,d;const l=null!==(d=null===(v=i[o])||void 0===v?void 0:v.products)&&void 0!==d?d:{};Object.keys(l).forEach((v=>{var d,l,t,n;const s=null!==(n=null===(t=null===(l=null===(d=i[o])||void 0===d?void 0:d.products)||void 0===l?void 0:l[v])||void 0===t?void 0:t.variants)&&void 0!==n?n:{};Object.keys(s).forEach((d=>{var l,t,n,s;const a=null===(s=null===(n=null===(t=null===(l=i[o])||void 0===l?void 0:l.products)||void 0===t?void 0:t[v])||void 0===n?void 0:n.variants)||void 0===s?void 0:s[d];a&&(a.fbStatus="APPROVED")}))}))})),console.log("vj: variantids",i),l?l(i):d({type:"paged",data:i})}))};return(!(arguments.length>4&&void 0!==arguments[4])||arguments[4])&&t(),{fetchFbStatus:t}};export{o as useFetchFbStatusForCollections};

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

@@ -1 +1,5 @@
+import { Collection, SelectedItems } from './modal';
 export declare const liftTheStateUp: (payload: any, data: any) => any;
+export declare function paginateSelectedItems(selectedItems: SelectedItems, limit: number, offset: number): {
+    [key: string]: Collection;
+};

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

@@ -1 +1 @@
-import{cloneDeep as t}from"lodash";const a=(a,s)=>{const o=t(s);if(delete o.products,(a=Object.assign(Object.assign({},a),{catalogOnlyData:o})).productId&&s.products){const c=t(s.products[a.productId]);(null==c?void 0:c.variants)&&delete c.variants,a=Object.assign(Object.assign({},a),{catalogOnlyData:o,productOnlyData:c})}return a};export{a as liftTheStateUp};
+import{cloneDeep as t}from"lodash";const o=(o,s)=>{const c=t(s);if(delete c.products,(o=Object.assign(Object.assign({},o),{catalogOnlyData:c})).productId&&s.products){const n=t(s.products[o.productId]);(null==n?void 0:n.variants)&&delete n.variants,o=Object.assign(Object.assign({},o),{catalogOnlyData:c,productOnlyData:n})}return o};function s(t,o,s){var n;const e={};let r=0;console.log("paginated offset",s);for(const a in t)if(Object.prototype.hasOwnProperty.call(t,a)){const l=t[a],i=c(l.products,o,s-r);i&&Object.keys(i).length>0&&(e[a]=Object.assign(Object.assign({},l),{products:i})),r+=Object.keys(null!==(n=l.products)&&void 0!==n?n:{}).length}return e}function c(t,o,s){if(!t)return{};const c=Object.keys(t).slice(s,s+o),n={};return c.forEach((o=>{n[o]=t[o]})),n}export{o as liftTheStateUp,s as paginateSelectedItems};

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

@@ -1 +1 @@
-import{jsxs as t,jsx as e,Fragment as o}from"react/jsx-runtime";import i from"../../assets/icons/delete.svg.js";import r from"../../assets/icons/drag_handle.svg.js";import{COLORS as a}from"../../constants/Theme.js";import{IconButton as n}from"../icon-button/IconButton.js";import{ShimmerImage as l}from"../shimmer-image/ShimmerImage.js";import{TitleRegular as s}from"../TypographyStyle.js";import{truncate as c}from"./collectionScreen.js";import{ProductHelper as m}from"./helpers/ProductHelper.js";import{VariantCardListStyle as d,VariantCardGridStyle as h}from"./style.js";import{Tooltip as p}from"../tooltips/Tooltip.js";import{Tag as g}from"../tag/Tag.js";const j=h=>{const{data:j,selectedCollectionsDispatch:u,outOfStockAction:f}=h,b=m.getProductLabels(j,f),y=t=>{let e;return e=j.name.includes(j.productName)?j.name:`${j.productName} ${j.name}`,t?c(e,34,!0):e};return t(d,{children:[e(r,{width:24,height:24,color:a.content.placeholder}),e("div",{children:e(l,{width:40,height:40,imageUrl:j.image,alt:"Item",borderRadius:4},j.variantId)}),t("div",Object.assign({className:"tooltip-title-tag"},{children:[e(p,Object.assign({body:y(!1),placement:"bottom",delay:400},{children:e(s,{children:y(!0)})})),b?e("div",Object.assign({style:{width:90,display:"flex"}},{children:e(g,{tagText:b,type:"warning",theme:"light"})})):e(o,{})]})),e(n,{Icon:()=>e(i,{width:24,height:24,color:a.content.placeholder}),onClick:()=>{u&&u({type:"variantUnselected",data:{productId:j.productId,variantId:j.variantId,collectionId:j.collectionId}}),h.onDelete&&h.onDelete()}})]})},u=t=>{const{data:o}=t;return e(h,{children:e(p,Object.assign({body:o.name,alwaysVisible:!1,variant:"dark",placement:"bottom"},{children:e(l,{width:72,height:72,imageUrl:o.image,alt:"Item",borderRadius:4})}))})};export{u as VariantCardGridView,j as VariantCardListView};
+import{jsxs as t,jsx as e}from"react/jsx-runtime";import o from"../../assets/icons/delete.svg.js";import i from"../../assets/icons/drag_handle.svg.js";import{COLORS as r}from"../../constants/Theme.js";import{IconButton as a}from"../icon-button/IconButton.js";import{ShimmerImage as n}from"../shimmer-image/ShimmerImage.js";import{TitleRegular as c}from"../TypographyStyle.js";import{truncate as m}from"./collectionScreen.js";import{ProductPickerTag as s}from"./ProductPickerTag.js";import{VariantCardListStyle as l,VariantCardGridStyle as d}from"./style.js";import{Tooltip as h}from"../tooltips/Tooltip.js";const p=d=>{const{data:p,selectedCollectionsDispatch:g,outOfStockAction:u}=d,j=t=>{let e;return e=p.name.includes(p.productName)?p.name:`${p.productName} ${p.name}`,t?m(e,34,!0):e};return t(l,{children:[e(i,{width:24,height:24,color:r.content.placeholder}),e("div",{children:e(n,{width:40,height:40,imageUrl:p.image,alt:"Item",borderRadius:4},p.variantId)}),t("div",Object.assign({className:"tooltip-title-tag"},{children:[e(h,Object.assign({body:j(!1),placement:"bottom",delay:400},{children:e(c,{children:j(!0)})})),e(s,{isVariant:!0,data:p,outOfStockAction:u})]})),e(a,{Icon:()=>e(o,{width:24,height:24,color:r.content.placeholder}),onClick:()=>{g&&g({type:"variantUnselected",data:{productId:p.productId,variantId:p.variantId,collectionId:p.collectionId}}),d.onDelete&&d.onDelete()}})]})},g=t=>{const{data:o}=t;return e(d,{children:e(h,Object.assign({body:o.name,alwaysVisible:!1,variant:"dark",placement:"bottom"},{children:e(n,{width:72,height:72,imageUrl:o.image,alt:"Item",borderRadius:4})}))})};export{g as VariantCardGridView,p as VariantCardListView};

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

@@ -1 +1 @@
-import{jsxs as n,jsx as o}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import{useState as e,useEffect as i}from"react";import{POD as s}from"../../template-preview/models/WhatsAppTemplate.js";import{useTemplateModalContext as l}from"../context/templateModalContext.js";import{useAdditionalVariables as a}from"../custom-hooks/useAdditionalVariables.js";import{getAllDataFromTemplateComponent as d}from"../utils/getDataFromTemplateComponent.js";import{BackTrackComponent as r}from"./BackTrackComponent.js";import{DiscountCodeComponent as p}from"./DiscountCodeComponent.js";import{EditTemplateMediaContainer as c}from"./EditMediaV2.style.js";import u from"./EditWhatsAppTemplateMediaV2.js";import m from"./VariableConnector.js";import{Container as v}from"./VariableConnectorsPanel.js";import b from"./VariableConnectorWhatsApp.js";import g from"./VariableEditorHeader.js";import f from"./WhatsAppTemplateCardButtonV2.js";const h=h=>{let{template:j,onTemplateChange:O,whatsappSpecificPickerMeta:C,showVariableModal:y,variableList:T,variableListForImage:x,discountCode:V,setDiscountCode:B}=h;var L,E,U,k,I,w,R,N,P,A,S,_,M,Q;const D=j.isCarouselType,{originalVariableList:q,pod:H,extras:Y,selectedCarouselIndex:K,isProductCarouselType:W}=l(),{descriptionComponents:$,urlBtns:F,qrbBtns:X,imageComponent:z,bodyVariables:G,headerVariables:J}=d(j),[Z,nn]=e(!1),[on,tn]=e(-1===K?{descriptionComponents:$,urlBtns:F,qrbBtns:X,imageComponent:z,bodyVariables:G,headerVariables:J}:{}),[en,sn]=e(!1);function ln(n,o,e){var i,s,l,a,d,r,p,c,u,m;const v=null!=K&&K>-1?{components:null===(i=Object.assign({},j).components[1].cards)||void 0===i?void 0:i[K].components,mapping:null===(s=Object.assign({},j).mapping.cards)||void 0===s?void 0:s[K]}:Object.assign({},j),b=t(v),g="custom"===o&&"string"==typeof n,f=g?n:"string"!=typeof n?n.defaultValue:"";if(null!=K&&K>-1&&W){const o=Object.assign({},j).components.map((n=>{var o;return"CAROUSEL"===n.type?Object.assign(Object.assign({},n),{cards:null===(o=n.cards)||void 0===o?void 0:o.map((n=>Object.assign(Object.assign({},n),{components:n.components.map((n=>{var o,t,i;if("BUTTONS"===n.type){const s=null===(o=n.buttons)||void 0===o?void 0:o.filter((n=>"URL"===n.type));let l=null!==(t=null==s?void 0:s[e])&&void 0!==t?t:{};l=Object.assign(Object.assign({},l),{url:"https://d.bik.ai/{{1}}",example:[f]});const a=null===(i=n.buttons)||void 0===i?void 0:i.map((n=>"URL"===n.type&&(null==n?void 0:n.text)===(null==l?void 0:l.text)?l:n));return Object.assign(Object.assign({},n),{buttons:a})}return n}))})))}):n})),i=null===(a=null===(l=Object.assign({},j).mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a.map((o=>{var t;return Object.assign(Object.assign({},o),{buttons:null===(t=null==o?void 0:o.buttons)||void 0===t?void 0:t.map((o=>g?"((customBtnPlaceholder))":"string"!=typeof n?n.placeHolder:""))})})),s=t(j);return s.components=o,s.mapping.cards=i,void(null==O||O(Object.assign({},s)))}const h=null==b?void 0:b.components.findIndex((n=>"BUTTONS"===n.type));if(void 0!==h&&h>-1){const t=null===(d=null==b?void 0:b.components[h].buttons)||void 0===d?void 0:d.filter((n=>"URL"===n.type));if((null==t?void 0:t.length)>0){const i="custom"===o&&"string"==typeof n,s=i?n:"string"!=typeof n?n.defaultValue:"";let l=t[e];l=Object.assign(Object.assign({},l),{url:"https://d.bik.ai/{{1}}",example:[s]});const a=[...null!==(c=null===(p=null===(r=b.components)||void 0===r?void 0:r[h])||void 0===p?void 0:p.buttons)&&void 0!==c?c:[]].map((n=>"URL"===n.type&&(null==n?void 0:n.text)===(null==l?void 0:l.text)?l:n)),d=Object.assign(Object.assign({},b.components[h]),{buttons:a}),m=null===(u=b.mapping)||void 0===u?void 0:u.buttons;m&&m.length>0&&(m[e]=i?"((customBtnPlaceholder))":"string"!=typeof n?n.placeHolder:"");const v=Object.assign(Object.assign({},b.mapping),{buttons:m});b.mapping=v;const g=[...b.components];g[h]=d,b.components=g}}if("string"!=typeof n){"checkout.checkoutUrl"===(null===(m=n.placeHolder)||void 0===m?void 0:m.slice(2,-2))?nn(!0):(nn(!1),null==B||B(""))}if(null!=K&&K>-1){const n=t(j);n.components[1].cards[K].components=b.components,n.mapping.cards[K]=b.mapping,null==O||O(Object.assign({},n))}else null==O||O(b)}function an(n,o,e){var i,s,l,a,d,r;const p=null!=K&&K>-1?{components:null===(i=Object.assign({},j).components[1].cards)||void 0===i?void 0:i[K].components,mapping:null===(s=Object.assign({},j).mapping.cards)||void 0===s?void 0:s[K]}:Object.assign({},j);if(null!=K&&K>-1&&W){const o=Object.assign({},j).components.map((o=>{var t;return"CAROUSEL"===o.type?Object.assign(Object.assign({},o),{cards:null===(t=o.cards)||void 0===t?void 0:t.map((o=>Object.assign(Object.assign({},o),{components:o.components.map((o=>{var t,i,s;if("BUTTONS"===o.type){const l=null===(t=o.buttons)||void 0===t?void 0:t.filter((n=>"QUICK_REPLY"===n.type));let a=null!==(i=null==l?void 0:l[e])&&void 0!==i?i:{};a=Object.assign(Object.assign({},a),{flowId:n.flowId,flowName:n.flowName});const d=null===(s=o.buttons)||void 0===s?void 0:s.map((n=>"QUICK_REPLY"===n.type&&(null==n?void 0:n.text)===(null==a?void 0:a.text)?a:n));return Object.assign(Object.assign({},o),{buttons:d})}return o}))})))}):o})),i=t(j);return i.components=o,void(null==O||O(Object.assign({},i)))}const c=null==p?void 0:p.components.findIndex((n=>"BUTTONS"===n.type));if(void 0!==c&&c>-1){const o=null===(l=null==p?void 0:p.components[c].buttons)||void 0===l?void 0:l.filter((n=>"QUICK_REPLY"===n.type));if(o){let t=o[e];t=Object.assign(Object.assign({},t),{flowId:n.flowId,flowName:n.flowName});const i=[...null!==(r=null===(d=null===(a=p.components)||void 0===a?void 0:a[c])||void 0===d?void 0:d.buttons)&&void 0!==r?r:[]].map((n=>"QUICK_REPLY"===n.type&&(null==n?void 0:n.text)===(null==t?void 0:t.text)?t:n)),s=Object.assign(Object.assign({},p.components[c]),{buttons:i}),l=[...p.components];l[c]=s,p.components=l}}if(null!=K&&K>-1){const n=t(j);n.components[1].cards[K].components=p.components,null==O||O(Object.assign({},n))}else null==O||O(p)}i((()=>{var n,o;if(null===(n=j.mapping.buttons)||void 0===n?void 0:n.find((n=>"checkout.checkoutUrl"===n.slice(2,-2))))nn(!0);else{nn(!1);const n=null===(o=null==Y?void 0:Y.discountCodeExtra)||void 0===o?void 0:o[1];null==n||n("")}}),[j]),i((()=>{var n,o,t,e;if(null!=K&&K>-1){const i={components:null===(o=null===(n=j.components[1])||void 0===n?void 0:n.cards)||void 0===o?void 0:o[K].components,mapping:null===(e=null===(t=null==j?void 0:j.mapping)||void 0===t?void 0:t.cards)||void 0===e?void 0:e[K]},{descriptionComponents:s,urlBtns:l,qrbBtns:a,imageComponent:r,bodyVariables:p,headerVariables:c}=d(i);tn({descriptionComponents:s,urlBtns:l,qrbBtns:a,imageComponent:r,bodyVariables:p,headerVariables:c})}else if(null!=K&&-1===K){const{descriptionComponents:n,urlBtns:o,qrbBtns:t,imageComponent:e,bodyVariables:i,headerVariables:s}=d(j);tn({descriptionComponents:n,urlBtns:o,qrbBtns:t,imageComponent:e,bodyVariables:i,headerVariables:s})}}),[K]),i((()=>{var n,o,t,e;if(null!=K&&K>-1&&en){const i={components:null===(o=null===(n=j.components[1])||void 0===n?void 0:n.cards)||void 0===o?void 0:o[K].components,mapping:null===(e=null===(t=null==j?void 0:j.mapping)||void 0===t?void 0:t.cards)||void 0===e?void 0:e[K]},{descriptionComponents:s,urlBtns:l,qrbBtns:a,imageComponent:r,bodyVariables:p,headerVariables:c}=d(i);tn({descriptionComponents:s,urlBtns:l,qrbBtns:a,imageComponent:r,bodyVariables:p,headerVariables:c}),sn(!1)}}),[en]);const dn=a({variableList:T,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom Text",variableValue:"{{custom.text}}"});return n(v,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:[!!on.imageComponent&&!W&&o(c,{children:o(u,{whatsappSpecificPickerMeta:C,mediaComponent:D?on.imageComponent:z,updateTemplateImageUrl:function(n,o){var e,i,s,l,a;let d;d=null!=K&&K>-1?{components:null===(i=null===(e=j.components[1])||void 0===e?void 0:e.cards)||void 0===i?void 0:i[K].components,mapping:null===(l=null===(s=null==j?void 0:j.mapping)||void 0===s?void 0:s.cards)||void 0===l?void 0:l[K]}:Object.assign({},j);const r=null===(a=null==d?void 0:d.components)||void 0===a?void 0:a.findIndex((n=>{if("HEADER"===n.type&&"NONE"!==n.format&&"TEXT"!==n.format)return!0}));if(void 0!==r&&r>-1&&(null==d?void 0:d.components[r])){const t=Object.assign(Object.assign({},d.components[r]),{format:o,example:{header_handle:[n]}}),e=[...d.components];e[r]=t,d=Object.assign(Object.assign({},d),{components:e})}if(d.mapping&&(d.mapping=Object.assign(Object.assign({},d.mapping),{header:void 0})),null!=K&&K>-1){const n=t(j);n.components[1].cards[K].components=d.components,n.mapping.cards[K]=d.mapping,null==O||O(Object.assign({},n)),sn(!0)}else null==O||O(Object.assign({},d))},template:j,variableListForImage:x})}),(on.bodyVariables.length>0||on.headerVariables.length>0)&&o(g,{containerStyle:{paddingTop:on.mediaComponent?24:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}),null===(L=on.descriptionComponents)||void 0===L?void 0:L.map(((n,t)=>o(b,{originalVariableList:null!=K&&K>-1?q.cards[K]:q,type:n.type,descriptionComponent:n.component,showVariableModal:y,variableList:T},t))),(null===(U=null===(E=null!=K&&K>-1?q.cards[K].buttons:null==q?void 0:q.buttons)||void 0===E?void 0:E.filter((n=>"URL"===n.type)))||void 0===U?void 0:U.length)>0&&o(g,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(I=null===(k=null!=K&&K>-1?q.cards[K].buttons:null==q?void 0:q.buttons)||void 0===k?void 0:k.filter((n=>!(null!=K&&K>-1)||"URL"===n.type)))||void 0===I?void 0:I.map(((n,t)=>{if("URL"===n.type)return o(f,{variableListIndex:t,CTAoptions:null==C?void 0:C.CTAoptions,button:n,currentVariableList:null!=K&&K>-1?Object.assign({},q.cards[K]):Object.assign({},q),updateSelectedURLTemplateBtn:ln,variableList:T},`${t}_${K}`)})),(null===(R=null===(w=null!=K&&K>-1?q.cards[K].buttons:null==q?void 0:q.buttons)||void 0===w?void 0:w.filter((n=>"QUICK_REPLY"===n.type)))||void 0===R?void 0:R.length)>0&&(H!==s.CHATBOT?o(g,{headerText:"Edit buttons",subText:"Edit the chatflows triggered on clicking  the buttons",toolTipInfo:"There is an option to trigger chatflows through the buttons which can keep the user engaged"}):o(r,{backTrackMessage:null===(N=null==Y?void 0:Y.backTrackExtra)||void 0===N?void 0:N[0],setBackTrackMessage:null===(P=null==Y?void 0:Y.backTrackExtra)||void 0===P?void 0:P[1]})),null===(S=null===(A=null!=K&&K>-1?q.cards[K].buttons:null==q?void 0:q.buttons)||void 0===A?void 0:A.filter((n=>"QUICK_REPLY"===n.type)))||void 0===S?void 0:S.map(((n,t)=>{if("QUICK_REPLY"===n.type)return o(f,{variableListIndex:t,QRBoptions:null==C?void 0:C.QRBoptions,button:n,currentVariableList:null!=K&&K>-1?Object.assign({},q.cards[K]):Object.assign({},q),updateSelectedQRBTemplateBtn:an},`${t}_${K}`)})),H===s.CHATBOT&&Z&&o(p,{discountCode:null===(_=null==Y?void 0:Y.discountCodeExtra)||void 0===_?void 0:_[0],setDiscountCode:null===(M=null==Y?void 0:Y.discountCodeExtra)||void 0===M?void 0:M[1],variableList:T}),null===(Q=null!=K&&K>-1?q.cards[K].buttons:null==q?void 0:q.buttons)||void 0===Q?void 0:Q.map(((n,t)=>{var e,i,s;if("COPY_CODE"===n.type)return o(m,{index:t,variable:{variableName:null!==(e=n.text)&&void 0!==e?e:"Copy Code",updatedValue:null!==(i=n.buttonVariable)&&void 0!==i?i:"",type:"string",isEditableVariable:!0,index:null!==(s=n.index)&&void 0!==s?s:0},showVariableModal:!0,variableList:dn,componentType:"BUTTONS"},t)}))]}))};export{h as default};
+import{jsxs as n,jsx as o}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import{useState as e,useEffect as i}from"react";import{POD as s}from"../../template-preview/models/WhatsAppTemplate.js";import{useTemplateModalContext as l}from"../context/templateModalContext.js";import{useAdditionalVariables as a}from"../custom-hooks/useAdditionalVariables.js";import{getAllDataFromTemplateComponent as d}from"../utils/getDataFromTemplateComponent.js";import{BackTrackComponent as r}from"./BackTrackComponent.js";import{DiscountCodeComponent as p}from"./DiscountCodeComponent.js";import{EditTemplateMediaContainer as c}from"./EditMediaV2.style.js";import u from"./EditWhatsAppTemplateMediaV2.js";import m from"./VariableConnector.js";import{Container as v}from"./VariableConnectorsPanel.js";import b from"./VariableConnectorWhatsApp.js";import g from"./VariableEditorHeader.js";import f from"./WhatsAppTemplateCardButtonV2.js";const h=h=>{let{template:j,onTemplateChange:O,whatsappSpecificPickerMeta:C,showVariableModal:y,variableList:T,variableListForImage:x,discountCode:V,setDiscountCode:B}=h;var L,E,U,k,I,w,R,A,N,P,S,_,M,Q;const D=j.isCarouselType,{originalVariableList:H,pod:q,extras:Y,selectedCarouselIndex:K,isProductCarouselType:W}=l(),{descriptionComponents:$,urlBtns:F,qrbBtns:X,imageComponent:z,bodyVariables:G,headerVariables:J}=d(j),[Z,nn]=e(!1),[on,tn]=e(-1===K?{descriptionComponents:$,urlBtns:F,qrbBtns:X,imageComponent:z,bodyVariables:G,headerVariables:J}:{}),[en,sn]=e(!1);function ln(n,o,e){var i,s,l,a,d,r,p,c,u,m;const v=null!=K&&K>-1?{components:null===(i=Object.assign({},j).components[1].cards)||void 0===i?void 0:i[K].components,mapping:null===(s=Object.assign({},j).mapping.cards)||void 0===s?void 0:s[K]}:Object.assign({},j),b=t(v),g="custom"===o&&"string"==typeof n,f=g?n:"string"!=typeof n?n.defaultValue:"";if(null!=K&&K>-1&&W){const o=Object.assign({},j).components.map((n=>{var o;return"CAROUSEL"===n.type?Object.assign(Object.assign({},n),{cards:null===(o=n.cards)||void 0===o?void 0:o.map((n=>Object.assign(Object.assign({},n),{components:n.components.map((n=>{var o,t,i;if("BUTTONS"===n.type){const s=null===(o=n.buttons)||void 0===o?void 0:o.filter((n=>"URL"===n.type));let l=null!==(t=null==s?void 0:s[e])&&void 0!==t?t:{};l=Object.assign(Object.assign({},l),{url:"https://d.bik.ai/{{1}}",example:[f]});const a=null===(i=n.buttons)||void 0===i?void 0:i.map((n=>"URL"===n.type&&(null==n?void 0:n.text)===(null==l?void 0:l.text)?l:n));return Object.assign(Object.assign({},n),{buttons:a})}return n}))})))}):n})),i=null===(a=null===(l=Object.assign({},j).mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a.map((o=>{var t;return Object.assign(Object.assign({},o),{buttons:null===(t=null==o?void 0:o.buttons)||void 0===t?void 0:t.map((o=>g?"((customBtnPlaceholder))":"string"!=typeof n?n.placeHolder:""))})})),s=t(j);return s.components=o,s.mapping.cards=i,void(null==O||O(Object.assign({},s)))}const h=null==b?void 0:b.components.findIndex((n=>"BUTTONS"===n.type));if(void 0!==h&&h>-1){const t=null===(d=null==b?void 0:b.components[h].buttons)||void 0===d?void 0:d.filter((n=>"URL"===n.type));if((null==t?void 0:t.length)>0){const i="custom"===o&&"string"==typeof n,s=i?n:"string"!=typeof n?n.defaultValue:"";let l=t[e];l=Object.assign(Object.assign({},l),{url:"https://d.bik.ai/{{1}}",example:[s]});const a=[...null!==(c=null===(p=null===(r=b.components)||void 0===r?void 0:r[h])||void 0===p?void 0:p.buttons)&&void 0!==c?c:[]].map((n=>"URL"===n.type&&(null==n?void 0:n.text)===(null==l?void 0:l.text)?l:n)),d=Object.assign(Object.assign({},b.components[h]),{buttons:a}),m=null===(u=b.mapping)||void 0===u?void 0:u.buttons;m&&m.length>0&&(m[e]=i?"((customBtnPlaceholder))":"string"!=typeof n?n.placeHolder:"");const v=Object.assign(Object.assign({},b.mapping),{buttons:m});b.mapping=v;const g=[...b.components];g[h]=d,b.components=g}}if("string"!=typeof n){"checkout.checkoutUrl"===(null===(m=n.placeHolder)||void 0===m?void 0:m.slice(2,-2))?nn(!0):(nn(!1),null==B||B(""))}if(null!=K&&K>-1){const n=t(j);n.components[1].cards[K].components=b.components,n.mapping.cards[K]=b.mapping,null==O||O(Object.assign({},n))}else null==O||O(b)}function an(n,o,e){var i,s,l,a,d,r;const p=null!=K&&K>-1?{components:null===(i=Object.assign({},j).components[1].cards)||void 0===i?void 0:i[K].components,mapping:null===(s=Object.assign({},j).mapping.cards)||void 0===s?void 0:s[K]}:Object.assign({},j);if(null!=K&&K>-1&&W){const o=Object.assign({},j).components.map((o=>{var t;return"CAROUSEL"===o.type?Object.assign(Object.assign({},o),{cards:null===(t=o.cards)||void 0===t?void 0:t.map((o=>Object.assign(Object.assign({},o),{components:o.components.map((o=>{var t,i,s;if("BUTTONS"===o.type){const l=null===(t=o.buttons)||void 0===t?void 0:t.filter((n=>"QUICK_REPLY"===n.type));let a=null!==(i=null==l?void 0:l[e])&&void 0!==i?i:{};a=Object.assign(Object.assign({},a),{flowId:n.flowId,flowName:n.flowName});const d=null===(s=o.buttons)||void 0===s?void 0:s.map((n=>"QUICK_REPLY"===n.type&&(null==n?void 0:n.text)===(null==a?void 0:a.text)?a:n));return Object.assign(Object.assign({},o),{buttons:d})}return o}))})))}):o})),i=t(j);return i.components=o,void(null==O||O(Object.assign({},i)))}const c=null==p?void 0:p.components.findIndex((n=>"BUTTONS"===n.type));if(void 0!==c&&c>-1){const o=null===(l=null==p?void 0:p.components[c].buttons)||void 0===l?void 0:l.filter((n=>"QUICK_REPLY"===n.type));if(o){let t=o[e];t=Object.assign(Object.assign({},t),{flowId:n.flowId,flowName:n.flowName});const i=[...null!==(r=null===(d=null===(a=p.components)||void 0===a?void 0:a[c])||void 0===d?void 0:d.buttons)&&void 0!==r?r:[]].map((n=>"QUICK_REPLY"===n.type&&(null==n?void 0:n.text)===(null==t?void 0:t.text)?t:n)),s=Object.assign(Object.assign({},p.components[c]),{buttons:i}),l=[...p.components];l[c]=s,p.components=l}}if(null!=K&&K>-1){const n=t(j);n.components[1].cards[K].components=p.components,null==O||O(Object.assign({},n))}else null==O||O(p)}i((()=>{var n,o;if(null===(n=j.mapping.buttons)||void 0===n?void 0:n.find((n=>"checkout.checkoutUrl"===n.slice(2,-2))))nn(!0);else{nn(!1);const n=null===(o=null==Y?void 0:Y.discountCodeExtra)||void 0===o?void 0:o[1];null==n||n("")}}),[j]),i((()=>{var n,o,t,e;if(null!=K&&K>-1){const i={components:null===(o=null===(n=j.components[1])||void 0===n?void 0:n.cards)||void 0===o?void 0:o[K].components,mapping:null===(e=null===(t=null==j?void 0:j.mapping)||void 0===t?void 0:t.cards)||void 0===e?void 0:e[K]},{descriptionComponents:s,urlBtns:l,qrbBtns:a,imageComponent:r,bodyVariables:p,headerVariables:c}=d(i);tn({descriptionComponents:s,urlBtns:l,qrbBtns:a,imageComponent:r,bodyVariables:p,headerVariables:c})}else if(null!=K&&-1===K){const{descriptionComponents:n,urlBtns:o,qrbBtns:t,imageComponent:e,bodyVariables:i,headerVariables:s}=d(j);tn({descriptionComponents:n,urlBtns:o,qrbBtns:t,imageComponent:e,bodyVariables:i,headerVariables:s})}}),[K]),i((()=>{var n,o,t,e;if(null!=K&&K>-1&&en){const i={components:null===(o=null===(n=j.components[1])||void 0===n?void 0:n.cards)||void 0===o?void 0:o[K].components,mapping:null===(e=null===(t=null==j?void 0:j.mapping)||void 0===t?void 0:t.cards)||void 0===e?void 0:e[K]},{descriptionComponents:s,urlBtns:l,qrbBtns:a,imageComponent:r,bodyVariables:p,headerVariables:c}=d(i);tn({descriptionComponents:s,urlBtns:l,qrbBtns:a,imageComponent:r,bodyVariables:p,headerVariables:c}),sn(!1)}}),[en]);const dn=a({variableList:T,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom Text",variableValue:"{{custom.text}}"});return n(v,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:[!!on.imageComponent&&!W&&o(c,{children:o(u,{whatsappSpecificPickerMeta:C,mediaComponent:D?on.imageComponent:z,updateTemplateImageUrl:function(n,o){var e,i,s,l,a;let d;d=null!=K&&K>-1?{components:null===(i=null===(e=j.components[1])||void 0===e?void 0:e.cards)||void 0===i?void 0:i[K].components,mapping:null===(l=null===(s=null==j?void 0:j.mapping)||void 0===s?void 0:s.cards)||void 0===l?void 0:l[K]}:Object.assign({},j);const r=null===(a=null==d?void 0:d.components)||void 0===a?void 0:a.findIndex((n=>{if("HEADER"===n.type&&"NONE"!==n.format&&"TEXT"!==n.format)return!0}));if(void 0!==r&&r>-1&&(null==d?void 0:d.components[r])){const t=Object.assign(Object.assign({},d.components[r]),{format:o,example:{header_handle:[n]}}),e=[...d.components];e[r]=t,d=Object.assign(Object.assign({},d),{components:e})}if(d.mapping&&(d.mapping=Object.assign(Object.assign({},d.mapping),{header:void 0})),null!=K&&K>-1){const n=t(j);n.components[1].cards[K].components=d.components,n.mapping.cards[K]=d.mapping,null==O||O(Object.assign({},n)),sn(!0)}else null==O||O(Object.assign({},d))},template:j,variableListForImage:x})}),(on.bodyVariables.length>0||on.headerVariables.length>0)&&o(g,{containerStyle:{paddingTop:on.mediaComponent?24:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}),null===(L=on.descriptionComponents)||void 0===L?void 0:L.map(((n,t)=>o(b,{originalVariableList:null!=K&&K>-1?H.cards[K]:H,type:n.type,descriptionComponent:n.component,showVariableModal:y,variableList:T},t))),(null===(U=null===(E=null!=K&&K>-1?H.cards[K].buttons:null==H?void 0:H.buttons)||void 0===E?void 0:E.filter((n=>"URL"===n.type)))||void 0===U?void 0:U.length)>0&&o(g,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(I=null===(k=null!=K&&K>-1?H.cards[K].buttons:null==H?void 0:H.buttons)||void 0===k?void 0:k.filter((n=>q===s.CHATBOT||"URL"===n.type)))||void 0===I?void 0:I.map(((n,t)=>{if("URL"===n.type)return o(f,{variableListIndex:t,CTAoptions:null==C?void 0:C.CTAoptions,button:n,currentVariableList:null!=K&&K>-1?Object.assign({},H.cards[K]):Object.assign({},H),updateSelectedURLTemplateBtn:ln,variableList:T},`${t}_${K}`)})),(null===(R=null===(w=null!=K&&K>-1?H.cards[K].buttons:null==H?void 0:H.buttons)||void 0===w?void 0:w.filter((n=>"QUICK_REPLY"===n.type)))||void 0===R?void 0:R.length)>0&&(q!==s.CHATBOT?o(g,{headerText:"Edit buttons",subText:"Edit the chatflows triggered on clicking  the buttons",toolTipInfo:"There is an option to trigger chatflows through the buttons which can keep the user engaged"}):o(r,{backTrackMessage:null===(A=null==Y?void 0:Y.backTrackExtra)||void 0===A?void 0:A[0],setBackTrackMessage:null===(N=null==Y?void 0:Y.backTrackExtra)||void 0===N?void 0:N[1]})),null===(S=null===(P=null!=K&&K>-1?H.cards[K].buttons:null==H?void 0:H.buttons)||void 0===P?void 0:P.filter((n=>"QUICK_REPLY"===n.type)))||void 0===S?void 0:S.map(((n,t)=>{if("QUICK_REPLY"===n.type)return o(f,{variableListIndex:t,QRBoptions:null==C?void 0:C.QRBoptions,button:n,currentVariableList:null!=K&&K>-1?Object.assign({},H.cards[K]):Object.assign({},H),updateSelectedQRBTemplateBtn:an},`${t}_${K}`)})),q===s.CHATBOT&&Z&&o(p,{discountCode:null===(_=null==Y?void 0:Y.discountCodeExtra)||void 0===_?void 0:_[0],setDiscountCode:null===(M=null==Y?void 0:Y.discountCodeExtra)||void 0===M?void 0:M[1],variableList:T}),null===(Q=null!=K&&K>-1?H.cards[K].buttons:null==H?void 0:H.buttons)||void 0===Q?void 0:Q.map(((n,t)=>{var e,i,s;if("COPY_CODE"===n.type)return o(m,{index:t,variable:{variableName:null!==(e=n.text)&&void 0!==e?e:"Copy Code",updatedValue:null!==(i=n.buttonVariable)&&void 0!==i?i:"",type:"string",isEditableVariable:!0,index:null!==(s=n.index)&&void 0!==s?s:0},showVariableModal:!0,variableList:dn,componentType:"BUTTONS"},t)}))]}))};export{h as default};

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

@@ -13,4 +13,4 @@ import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import a from"..
 	background-color: rgba(0, 0, 0, 0.1);
 	z-index: 1000;
 	cursor: not-allowed;
-`,V={value:"custom_link",label:"Custom URL"},k={value:"custom_text",label:"Custom text"},E={value:"static_expiry",label:"Static Expiry"},A=d=>{let{onFocus:A,variable:S,index:C,showVariableModal:w,variableList:P,setShowDiscountCheckBox:D,componentType:B,CTAoptions:L}=d;var N,H,U;const[M,W]=o(!1),[R,$]=o(""),[I,z]=o([]),[Y,Z]=o(),[G,q]=o(!1),[F,K]=o(!1),{device:J,channel:Q,isError:X,originalVariableList:ee,template:te,templateSelectionTriggered:le,setTemplate:ae,setDisplayContent:ie,setOriginalVariableList:ne,globalNormalizedPlaceholders:oe,enabledCustomText:se,pod:de,selectedCarouselIndex:ue,isProductCarouselType:ce,disableEditVariable:re,disableEditExpiry:pe}=y();function me(){var e,t;const l=[];let a=[];if(Q!==b.MESSAGE||se){"link"===(null==S?void 0:S.type)?(l.push({label:"",options:[V,k]}),Z(V)):"date_time"===(null==S?void 0:S.type)?(l.push({label:"",options:[V,k]}),Z(E)):(l.push({label:"",options:[V,k,E]}),Z(k));const e=null!=oe?oe:[];z([...l,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:j.toCapitilize(null===(l=null===(t=e.label)||void 0===t?void 0:t.replace(/([A-Z])/g," $1"))||void 0===l?void 0:l.toLowerCase())})}))]),a=[...l,...e]}else{const e=null!=oe?oe:[];z([{label:"",options:[k,V]},...e]),a=[{label:"",options:[k,V]},...e]}if((Q===b.WHATSAPP||Q===b.EMAIL||Q===b.MESSAGE)&&S.updatedValue)if(v.test(S.updatedValue)&&Q===b.WHATSAPP||S.updatedValue.startsWith("{{")&&Q!==b.WHATSAPP){const e=function(e,t,l){var a;let i={label:"",value:""};const n=l===b.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(w){let t=e.updatedValue;if(de===g.CHATBOT&&"BUTTONS"===B){const l=null==L?void 0:L.filter((t=>t.placeHolder===e.updatedValue));l&&l.length>0&&(t=l[0].label)}i={label:t?t.replace("{{","").replace("}}","").trim().replace("."," "):"",value:null!==(a=e.updatedValue)&&void 0!==a?a:""}}else t.map((e=>{e.options.map((e=>{var t;(null===(t=e.value)||void 0===t?void 0:t.replace("{{","").replace("}}","").trim())===n.trim()&&(i=e)}))}));return i}(S,a,Q);e.value&&Z(e)}else"date_time"===S.type?(Z(E),$(S.updatedValue),Oe(null!==(e=S.index)&&void 0!==e?e:0,S.updatedValue)):(null===(t=S.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(Z(V),$(S.updatedValue.split("https://")[1])):(Z(k),$(S.updatedValue))}function ve(e,t){var l,a,i;const n=e;$(""),Z(n),Q===b.WHATSAPP?"custom_text"!==n.value&&"custom_link"!==n.value&&"static_expiry"!==n.value?(ge(null!==(l=n.value)&&void 0!==l?l:"","string"),null==Oe||Oe(null!==(a=S.index)&&void 0!==a?a:0,n.value,!0)):(null==Oe||Oe(null!==(i=S.index)&&void 0!==i?i:0,R,!0,n.value),ge("","url"===n.bikPlaceholderType?"link":"string")):"custom_text"!==n.value&&"custom_link"!==n.value?ge(n.value,"url"===n.bikPlaceholderType?"link":"string"):($(""),ge("",n.value))}function be(e,t){var l;$(t);const a="custom_link"===(null==Y?void 0:Y.value)&&t?t.includes("https")?t:`https://${t}`:t;ge(a,"static_expiry"===e?"string":e),Q===b.WHATSAPP&&(null==Oe||Oe(null!==(l=S.index)&&void 0!==l?l:0,a,"custom_link"===e,e))}function ge(e,t){var l,a,i,o;const s="custom_link"===t?"link":"custom_text"===t?"string":t;if(Q!==b.WHATSAPP){const a=f(C+1),i=null===document||void 0===document?void 0:document.getElementById("mobile"===J?"template_html_mobile":"template_html_desktop"),n=Q===b.EMAIL?null===(l=null==i?void 0:i.contentWindow)||void 0===l?void 0:l.document.getElementById(a):document.getElementById(a);n&&(n.textContent="custom_text"!==t&&"custom_link"!==t||e?e:S.variableName);const o=ee.map(((t,l)=>l===C?Object.assign(Object.assign({},t),{type:s,updatedValue:e}):t));null==ne||ne(o)}if(Q===b.WHATSAPP){if(null!=ue&&ue>-1&&ce){const t=Object.assign({},ee).cards.map(((t,l)=>{var a;return Object.assign(Object.assign({},t),{body:null===(a=t.body)||void 0===a?void 0:a.map(((t,l)=>C===l?Object.assign(Object.assign({},t),{type:s,updatedValue:e}):t))})}));return void(null==ne||ne((e=>Object.assign(Object.assign({},e),{cards:t}))))}const l=null!=ue&&ue>-1?ee.cards[ue]:ee;let d=l.body,u=l.header,c=l.buttons;if("BODY"===B?d=null===(a=l.body)||void 0===a?void 0:a.map(((t,l)=>l===C?Object.assign(Object.assign({},t),{type:s,updatedValue:e}):t)):"HEADER"===B?u=null===(i=l.header)||void 0===i?void 0:i.map(((t,l)=>l===C?Object.assign(Object.assign({},t),{type:s,updatedValue:e}):t)):"BUTTONS"===B&&(c=null===(o=l.buttons)||void 0===o?void 0:o.map(((l,a)=>a===C?Object.assign(Object.assign({},l),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===l.type?e:[e]}):l))),null!=ue&&ue>-1){const e=n(ee.cards);e[ue]={header:u,body:d,buttons:c},null==ne||ne((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==ne||ne((e=>Object.assign(Object.assign({},e),{header:u,body:d,buttons:c})))}}function Oe(e,t,l,a){var i,o,s,d,u,c,r;if(null!=ue&&ue>-1&&ce){const o=Object.assign({},te).components.map((l=>{var a;return"CAROUSEL"===l.type?Object.assign(Object.assign({},l),{cards:null===(a=l.cards)||void 0===a?void 0:a.map((l=>Object.assign(Object.assign({},l),{components:l.components.map((l=>{var a,i,n,o,s;if("BODY"!==l.type)return l;if(null===(i=null===(a=l.example)||void 0===a?void 0:a.body_text)||void 0===i?void 0:i[0]){const a=[...null!==(s=null===(o=null===(n=l.example)||void 0===n?void 0:n.body_text)||void 0===o?void 0:o[0])&&void 0!==s?s:[]];a[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const i=Object.assign(Object.assign({},l.example),{body_text:[a]});return Object.assign(Object.assign({},l),{example:i})}}))})))}):l})),s=n(te);if(l){const l=null===(i=Object.assign({},te).mapping.cards)||void 0===i?void 0:i.map((l=>{var i;return Object.assign(Object.assign({},l),{body:null===(i=l.body)||void 0===i?void 0:i.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+10}))`:t:l))})}));s.mapping.cards=l}return s.components=o,void(null==ae||ae(s))}const p=null!=ue&&ue>-1?{components:null===(o=Object.assign({},te).components[1].cards)||void 0===o?void 0:o[ue].components,mapping:null===(s=Object.assign({},te).mapping.cards)||void 0===s?void 0:s[ue]}:Object.assign({},te),m=null===(d=null==p?void 0:p.components)||void 0===d?void 0:d.map((l=>{var a,i,n,o,s,d,u,c,r,p;const m=Object.assign({},l);if("BODY"===l.type&&"BODY"===B){if(null===(i=null===(a=l.example)||void 0===a?void 0:a.body_text)||void 0===i?void 0:i[0]){const l=[...null!==(s=null===(o=null===(n=m.example)||void 0===n?void 0:n.body_text)||void 0===o?void 0:o[0])&&void 0!==s?s:[]];l[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=Object.assign(Object.assign({},m.example),{body_text:[l]});return Object.assign(Object.assign({},m),{example:a})}}else if("HEADER"===l.type&&"HEADER"===B){if(null===(d=l.example)||void 0===d?void 0:d.header_text){const l=[...null!==(c=null===(u=m.example)||void 0===u?void 0:u.header_text)&&void 0!==c?c:[]];l[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=Object.assign(Object.assign({},m.example),{header_text:l});return Object.assign(Object.assign({},m),{example:a})}}else if("BUTTONS"===l.type&&"BUTTONS"===B){if(null===(p=null===(r=l.buttons)||void 0===r?void 0:r[e])||void 0===p?void 0:p.example){const a=l.buttons.map(((l,a)=>a===e?Object.assign(Object.assign({},l),{example:"COPY_CODE"===l.type?t:[t]}):l));return Object.assign(Object.assign({},m),{buttons:a})}}else if("limited_time_offer"===l.type&&"limited_time_offer"===B)return Object.assign(Object.assign({},m),{example:Object.assign(Object.assign({},m.example),{limited_time_offer:t})});return l}));if(p.components=m,l)if("BODY"===B&&(null===(u=null==p?void 0:p.mapping)||void 0===u?void 0:u.body))p.mapping=Object.assign(Object.assign({},p.mapping),{body:p.mapping.body.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+10}))`:t:l))});else if("HEADER"===B&&(null===(c=null==p?void 0:p.mapping)||void 0===c?void 0:c.header))p.mapping=Object.assign(Object.assign({},p.mapping),{header:p.mapping.header.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+20}))`:t:l))});else if("BUTTONS"===B&&(null===(r=null==p?void 0:p.mapping)||void 0===r?void 0:r.buttons)){let l=-1,i=-1;m.forEach((t=>{var a;"BUTTONS"===t.type&&(null===(a=t.buttons)||void 0===a||a.forEach(((t,a)=>{"URL"===t.type&&(l++,a===e&&"URL"==t.type&&(i=l))})))})),p.mapping=Object.assign(Object.assign({},p.mapping),{buttons:p.mapping.buttons.map(((e,l)=>l===i?"custom_link"===a?"((customPlaceholderName))":t:e))})}if(null!=ue&&ue>-1&&te){const e=n(te);e.components[1].cards[ue].components=p.components,e.mapping.cards[ue]=p.mapping,null==ae||ae(e)}else null==ae||ae(Object.assign({},p))}return s((()=>{M&&(null==A||A())}),[M]),s((()=>{!function(){var e,t,l,a,i;const n="mobile"===J?"template_html_mobile":"template_html_desktop",o=document.getElementById(n),s=(null!==(a=null===(l=null===(t=null===(e=null==o?void 0:o.contentWindow)||void 0===e?void 0:e.document)||void 0===t?void 0:t.body)||void 0===l?void 0:l.innerHTML)&&void 0!==a?a:"")+(null===(i=null==o?void 0:o.contentWindow)||void 0===i?void 0:i.document.head.innerHTML);Q===b.EMAIL&&(null==ie||ie(s))}()}),[le]),s((()=>{me()}),[]),s((()=>{me()}),[ue]),s((()=>{J&&Y&&R&&setTimeout((()=>{ge("custom_link"===(null==Y?void 0:Y.value)&&R?R.includes("https")?R:`https://${R}`:R,Y.value)}),100)}),[J]),s((()=>{!F&&Y&&S.updatedValue&&setTimeout((()=>{ge("custom_link"===(null==Y?void 0:Y.value)&&S.updatedValue?S.updatedValue.includes("https")?S.updatedValue:`https://${S.updatedValue}`:S.updatedValue,Y.value),K(!0)}),100)}),[Y]),e(_,Object.assign({channel:Q,focused:M,onMouseEnter:()=>W(!0),onMouseLeave:()=>W(!1)},{children:[t("div",Object.assign({style:{marginBottom:8}},{children:e(O,Object.assign({style:{color:X&&!Y?x.content.negative:x.content.primary}},{children:[null===(N=S.variableName)||void 0===N?void 0:N.replace("{{","").replace("}}","")," ","link"===(null==S?void 0:S.type)?"link":"variable"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:w?e("div",Object.assign({style:{display:"flex",border:"#E0E0E0 1px solid",borderRadius:4,padding:10,justifyContent:(null==Y?void 0:Y.label)?"space-between":"flex-end"}},{children:[t(h,Object.assign({numberOfLines:1},{children:de===g.CHATBOT?["static_expiry","custom_text"].includes(null!==(H=null==Y?void 0:Y.value)&&void 0!==H?H:"")?null==Y?void 0:Y.label:null==Y?void 0:Y.value:m(null!==(U=null==Y?void 0:Y.label)&&void 0!==U?U:"",20,!0)})),re||"date_time"===(null==S?void 0:S.type)&&pe?t(l,{}):t(a,{onClick:()=>{q(!G)},width:24,height:24,color:x.content.primary})]})):t(r,{disabled:re,options:I,isSearchable:!1,onSelect:ve,defaultOptions:Y?[Object.assign(Object.assign({},Y),{selected:!0})]:[]})})),("custom_text"===(null==Y?void 0:Y.value)||"custom_link"===(null==Y?void 0:Y.value))&&t(p,{state:re?"disabled":"none",labelText:"custom_text"===(null==Y?void 0:Y.value)?"Custom text value":"custom_link"===(null==Y?void 0:Y.value)?"Custom URL value":"",id:`variable-value-${null==Y?void 0:Y.value}-${C}`,value:R,errorMessage:X?R&&0!==R.trim().length?"custom_link"!==Y.value||/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/.test(`https://${R.trim()}`)&&0!==R.trim().length?"custom_link"!==Y.value&&R.length>30?"Length cannot be more than 30":"BUTTONS"===B&&"custom_link"!==Y.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:"custom_link"===(null==Y?void 0:Y.value)?2e3:"BUTTONS"===B?15:30,noKeyDownChange:!0,prefixText:"custom_link"===(null==Y?void 0:Y.value)?"https://":"",placeholder:"link"===S.type||"custom_link"===Y.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{be(Y.value,e)}}),"static_expiry"===(null==Y?void 0:Y.value)&&e("div",Object.assign({style:{position:"relative"}},{children:[re&&t(T,{onClick:e=>e.preventDefault()}),t(c,{placement:"auto",time:i(R?new Date(R):new Date,"hh:mm a"),date:R?new Date(R):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{be("static_expiry",e.toISOString())}})]})),G&&t(u,{zIndex:2e3,data:null!=P?P:[],showVariable:G,setShowVariable:q,placeholder:"Add a variable",customTrigger:e=>{null==D||D(!1),"{{custom.url}}"===e.actualValue?ve({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?ve({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?ve({label:e.displayName,selected:!0,value:"static_expiry"}):ve({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})}})]}))};export{_ as Container,A as default};
+`,V={value:"custom_link",label:"Custom URL"},k={value:"custom_text",label:"Custom text"},E={value:"static_expiry",label:"Static Expiry"},A=d=>{let{onFocus:A,variable:S,index:C,showVariableModal:w,variableList:P,setShowDiscountCheckBox:D,componentType:B,CTAoptions:L}=d;var N,H,U;const[M,W]=o(!1),[R,$]=o(""),[I,z]=o([]),[Y,Z]=o(),[G,q]=o(!1),[F,K]=o(!1),{device:J,channel:Q,isError:X,originalVariableList:ee,template:te,templateSelectionTriggered:le,setTemplate:ae,setDisplayContent:ie,setOriginalVariableList:ne,globalNormalizedPlaceholders:oe,enabledCustomText:se,pod:de,selectedCarouselIndex:ue,isProductCarouselType:ce,disableEditVariable:re,disableEditExpiry:pe}=y();function me(){var e,t;const l=[];let a=[];if(Q!==b.MESSAGE||se){"link"===(null==S?void 0:S.type)?(l.push({label:"",options:[V,k]}),Z(V)):"date_time"===(null==S?void 0:S.type)?(l.push({label:"",options:[V,k]}),Z(E)):(l.push({label:"",options:[V,k,E]}),Z(k));const e=null!=oe?oe:[];z([...l,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:j.toCapitilize(null===(l=null===(t=e.label)||void 0===t?void 0:t.replace(/([A-Z])/g," $1"))||void 0===l?void 0:l.toLowerCase())})}))]),a=[...l,...e]}else{const e=null!=oe?oe:[];z([{label:"",options:[k,V]},...e]),a=[{label:"",options:[k,V]},...e]}if((Q===b.WHATSAPP||Q===b.EMAIL||Q===b.MESSAGE)&&S.updatedValue)if(v.test(S.updatedValue)&&Q===b.WHATSAPP||S.updatedValue.startsWith("{{")&&Q!==b.WHATSAPP){const e=function(e,t,l){var a;let i={label:"",value:""};const n=l===b.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(w){let t=e.updatedValue;if(de===g.CHATBOT&&"BUTTONS"===B){const l=null==L?void 0:L.filter((t=>t.placeHolder===e.updatedValue));l&&l.length>0&&(t=l[0].label)}i={label:t?t.replace("{{","").replace("}}","").trim().replace("."," "):"",value:null!==(a=e.updatedValue)&&void 0!==a?a:""}}else t.map((e=>{e.options.map((e=>{var t;(null===(t=e.value)||void 0===t?void 0:t.replace("{{","").replace("}}","").trim())===n.trim()&&(i=e)}))}));return i}(S,a,Q);e.value&&Z(e)}else"date_time"===S.type?(Z(E),$(S.updatedValue),Oe(null!==(e=S.index)&&void 0!==e?e:0,S.updatedValue)):(null===(t=S.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(Z(V),$(S.updatedValue.split("https://")[1])):(Z(k),$(S.updatedValue))}function ve(e,t){var l,a,i;const n=e;$(""),Z(n),Q===b.WHATSAPP?"custom_text"!==n.value&&"custom_link"!==n.value&&"static_expiry"!==n.value?(ge(null!==(l=n.value)&&void 0!==l?l:"","string"),null==Oe||Oe(null!==(a=S.index)&&void 0!==a?a:0,n.value,!0)):(null==Oe||Oe(null!==(i=S.index)&&void 0!==i?i:0,R,!0,n.value),ge("","url"===n.bikPlaceholderType?"link":"string")):"custom_text"!==n.value&&"custom_link"!==n.value?ge(n.value,"url"===n.bikPlaceholderType?"link":"string"):($(""),ge("",n.value))}function be(e,t){var l;$(t);const a="custom_link"===(null==Y?void 0:Y.value)&&t?t.includes("https")?t:`https://${t}`:t;ge(a,"static_expiry"===e?"string":e),Q===b.WHATSAPP&&(null==Oe||Oe(null!==(l=S.index)&&void 0!==l?l:0,a,"custom_link"===e,e))}function ge(e,t){var l,a,i,o;const s="custom_link"===t?"link":"custom_text"===t?"string":t;if(Q!==b.WHATSAPP){const a=f(C+1),i=null===document||void 0===document?void 0:document.getElementById("mobile"===J?"template_html_mobile":"template_html_desktop"),n=Q===b.EMAIL?null===(l=null==i?void 0:i.contentWindow)||void 0===l?void 0:l.document.getElementById(a):document.getElementById(a);n&&(n.textContent="custom_text"!==t&&"custom_link"!==t||e?e:S.variableName);const o=ee.map(((t,l)=>l===C?Object.assign(Object.assign({},t),{type:s,updatedValue:e}):t));null==ne||ne(o)}if(Q===b.WHATSAPP){if(null!=ue&&ue>-1&&ce){const t=Object.assign({},ee).cards.map(((t,l)=>{var a;return Object.assign(Object.assign({},t),{body:null===(a=t.body)||void 0===a?void 0:a.map(((t,l)=>C===l?Object.assign(Object.assign({},t),{type:s,updatedValue:e}):t))})}));return void(null==ne||ne((e=>Object.assign(Object.assign({},e),{cards:t}))))}const l=null!=ue&&ue>-1?ee.cards[ue]:ee;let d=l.body,u=l.header,c=l.buttons;if("BODY"===B?d=null===(a=l.body)||void 0===a?void 0:a.map(((t,l)=>l===C?Object.assign(Object.assign({},t),{type:s,updatedValue:e}):t)):"HEADER"===B?u=null===(i=l.header)||void 0===i?void 0:i.map(((t,l)=>l===C?Object.assign(Object.assign({},t),{type:s,updatedValue:e}):t)):"BUTTONS"===B&&(c=null===(o=l.buttons)||void 0===o?void 0:o.map(((l,a)=>a===C?Object.assign(Object.assign({},l),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===l.type?e:[e]}):l))),null!=ue&&ue>-1){const e=n(ee.cards);e[ue]={header:u,body:d,buttons:c},null==ne||ne((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==ne||ne((e=>Object.assign(Object.assign({},e),{header:u,body:d,buttons:c})))}}function Oe(e,t,l,a){var i,o,s,d,u,c,r;if(null!=ue&&ue>-1&&ce){const o=Object.assign({},te).components.map((l=>{var a;return"CAROUSEL"===l.type?Object.assign(Object.assign({},l),{cards:null===(a=l.cards)||void 0===a?void 0:a.map((l=>Object.assign(Object.assign({},l),{components:l.components.map((l=>{var a,i,n,o,s;if("BODY"!==l.type)return l;if(null===(i=null===(a=l.example)||void 0===a?void 0:a.body_text)||void 0===i?void 0:i[0]){const a=[...null!==(s=null===(o=null===(n=l.example)||void 0===n?void 0:n.body_text)||void 0===o?void 0:o[0])&&void 0!==s?s:[]];a[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const i=Object.assign(Object.assign({},l.example),{body_text:[a]});return Object.assign(Object.assign({},l),{example:i})}}))})))}):l})),s=n(te);if(l){const l=null===(i=Object.assign({},te).mapping.cards)||void 0===i?void 0:i.map((l=>{var i;return Object.assign(Object.assign({},l),{body:null===(i=l.body)||void 0===i?void 0:i.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+10}))`:t:l))})}));s.mapping.cards=l}return s.components=o,void(null==ae||ae(s))}const p=null!=ue&&ue>-1?{components:null===(o=Object.assign({},te).components[1].cards)||void 0===o?void 0:o[ue].components,mapping:null===(s=Object.assign({},te).mapping.cards)||void 0===s?void 0:s[ue]}:Object.assign({},te),m=null===(d=null==p?void 0:p.components)||void 0===d?void 0:d.map((l=>{var a,i,n,o,s,d,u,c,r;const p=Object.assign({},l);if("BODY"===l.type&&"BODY"===B){if(null===(i=null===(a=l.example)||void 0===a?void 0:a.body_text)||void 0===i?void 0:i[0]){const l=[...null!==(s=null===(o=null===(n=p.example)||void 0===n?void 0:n.body_text)||void 0===o?void 0:o[0])&&void 0!==s?s:[]];l[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=Object.assign(Object.assign({},p.example),{body_text:[l]});return Object.assign(Object.assign({},p),{example:a})}}else if("HEADER"===l.type&&"HEADER"===B){if(null===(d=l.example)||void 0===d?void 0:d.header_text){const l=[...null!==(c=null===(u=p.example)||void 0===u?void 0:u.header_text)&&void 0!==c?c:[]];l[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=Object.assign(Object.assign({},p.example),{header_text:l});return Object.assign(Object.assign({},p),{example:a})}}else{if("BUTTONS"===l.type&&"BUTTONS"===B){const a=null===(r=l.buttons)||void 0===r?void 0:r.map(((l,a)=>a===e?Object.assign(Object.assign({},l),{example:"COPY_CODE"===l.type?t:[t]}):l));return a?Object.assign(Object.assign({},p),{buttons:a}):p}if("limited_time_offer"===l.type&&"limited_time_offer"===B)return Object.assign(Object.assign({},p),{example:Object.assign(Object.assign({},p.example),{limited_time_offer:t})})}return l}));if(p.components=m,l)if("BODY"===B&&(null===(u=null==p?void 0:p.mapping)||void 0===u?void 0:u.body))p.mapping=Object.assign(Object.assign({},p.mapping),{body:p.mapping.body.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+10}))`:t:l))});else if("HEADER"===B&&(null===(c=null==p?void 0:p.mapping)||void 0===c?void 0:c.header))p.mapping=Object.assign(Object.assign({},p.mapping),{header:p.mapping.header.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+20}))`:t:l))});else if("BUTTONS"===B&&(null===(r=null==p?void 0:p.mapping)||void 0===r?void 0:r.buttons)){let l=-1,i=-1;m.forEach((t=>{var a;"BUTTONS"===t.type&&(null===(a=t.buttons)||void 0===a||a.forEach(((t,a)=>{"URL"===t.type&&(l++,a===e&&"URL"==t.type&&(i=l))})))})),p.mapping=Object.assign(Object.assign({},p.mapping),{buttons:p.mapping.buttons.map(((e,l)=>l===i?"custom_link"===a?"((customPlaceholderName))":t:e))})}if(null!=ue&&ue>-1&&te){const e=n(te);e.components[1].cards[ue].components=p.components,e.mapping.cards[ue]=p.mapping,null==ae||ae(e)}else null==ae||ae(Object.assign({},p))}return s((()=>{M&&(null==A||A())}),[M]),s((()=>{!function(){var e,t,l,a,i;const n="mobile"===J?"template_html_mobile":"template_html_desktop",o=document.getElementById(n),s=(null!==(a=null===(l=null===(t=null===(e=null==o?void 0:o.contentWindow)||void 0===e?void 0:e.document)||void 0===t?void 0:t.body)||void 0===l?void 0:l.innerHTML)&&void 0!==a?a:"")+(null===(i=null==o?void 0:o.contentWindow)||void 0===i?void 0:i.document.head.innerHTML);Q===b.EMAIL&&(null==ie||ie(s))}()}),[le]),s((()=>{me()}),[]),s((()=>{me()}),[ue]),s((()=>{J&&Y&&R&&setTimeout((()=>{ge("custom_link"===(null==Y?void 0:Y.value)&&R?R.includes("https")?R:`https://${R}`:R,Y.value)}),100)}),[J]),s((()=>{!F&&Y&&S.updatedValue&&setTimeout((()=>{ge("custom_link"===(null==Y?void 0:Y.value)&&S.updatedValue?S.updatedValue.includes("https")?S.updatedValue:`https://${S.updatedValue}`:S.updatedValue,Y.value),K(!0)}),100)}),[Y]),e(_,Object.assign({channel:Q,focused:M,onMouseEnter:()=>W(!0),onMouseLeave:()=>W(!1)},{children:[t("div",Object.assign({style:{marginBottom:8}},{children:e(O,Object.assign({style:{color:X&&!Y?x.content.negative:x.content.primary}},{children:[null===(N=S.variableName)||void 0===N?void 0:N.replace("{{","").replace("}}","")," ","link"===(null==S?void 0:S.type)?"link":"variable"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:w?e("div",Object.assign({style:{display:"flex",border:"#E0E0E0 1px solid",borderRadius:4,padding:10,justifyContent:(null==Y?void 0:Y.label)?"space-between":"flex-end"}},{children:[t(h,Object.assign({numberOfLines:1},{children:de===g.CHATBOT?["static_expiry","custom_text"].includes(null!==(H=null==Y?void 0:Y.value)&&void 0!==H?H:"")?null==Y?void 0:Y.label:null==Y?void 0:Y.value:m(null!==(U=null==Y?void 0:Y.label)&&void 0!==U?U:"",20,!0)})),re||"date_time"===(null==S?void 0:S.type)&&pe?t(l,{}):t(a,{onClick:()=>{q(!G)},width:24,height:24,color:x.content.primary})]})):t(r,{disabled:re,options:I,isSearchable:!1,onSelect:ve,defaultOptions:Y?[Object.assign(Object.assign({},Y),{selected:!0})]:[]})})),("custom_text"===(null==Y?void 0:Y.value)||"custom_link"===(null==Y?void 0:Y.value))&&t(p,{state:re?"disabled":"none",labelText:"custom_text"===(null==Y?void 0:Y.value)?"Custom text value":"custom_link"===(null==Y?void 0:Y.value)?"Custom URL value":"",id:`variable-value-${null==Y?void 0:Y.value}-${C}`,value:R,errorMessage:X?R&&0!==R.trim().length?"custom_link"!==Y.value||/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/.test(`https://${R.trim()}`)&&0!==R.trim().length?"custom_link"!==Y.value&&R.length>30?"Length cannot be more than 30":"BUTTONS"===B&&"custom_link"!==Y.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:"custom_link"===(null==Y?void 0:Y.value)?2e3:"BUTTONS"===B?15:30,noKeyDownChange:!0,prefixText:"custom_link"===(null==Y?void 0:Y.value)?"https://":"",placeholder:"link"===S.type||"custom_link"===Y.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{be(Y.value,e)}}),"static_expiry"===(null==Y?void 0:Y.value)&&e("div",Object.assign({style:{position:"relative"}},{children:[re&&t(T,{onClick:e=>e.preventDefault()}),t(c,{placement:"auto",time:i(R?new Date(R):new Date,"hh:mm a"),date:R?new Date(R):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{be("static_expiry",e.toISOString())}})]})),G&&t(u,{zIndex:2e3,data:null!=P?P:[],showVariable:G,setShowVariable:q,placeholder:"Add a variable",customTrigger:e=>{null==D||D(!1),"{{custom.url}}"===e.actualValue?ve({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?ve({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?ve({label:e.displayName,selected:!0,value:"static_expiry"}):ve({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})}})]}))};export{_ as Container,A as default};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bikdotai/bik-component-library",
-	"version": "0.0.453",
+	"version": "0.0.454-beta.ppi-2",
 	"description": "Bik Component Library",
 	"repository": {
 		"type": "git",