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

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

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.useFetchFbStatusForCollections=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 c=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];c&&(c.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 c=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(c).forEach((l=>{var t,n,s,c;const u=null===(c=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===c?void 0:c[l];(null==u?void 0:u.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 c=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(c).forEach((l=>{var t,n,s,c;const u=null===(c=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===c?void 0:c[l];u&&"REJECTED"===v[l]?u.fbStatus="REJECTED":u&&"APPROVED"===v[l]&&(u.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 c=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];c&&(c.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}};

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

@@ -1 +1,11 @@
+import { Collection, SelectedItems } from './modal';
 export declare const liftTheStateUp: (payload: any, data: any) => any;
+export declare function paginateArray(array: Array<any>, limit: number, pageNo: number): {
+    data: any[];
+    leftCursor: boolean;
+    rightCursor: boolean;
+};
+export declare function paginateSelectedItems(selectedItems: SelectedItems, limit: number, offset: number): {
+    [key: string]: Collection;
+};
+export declare function mergeProducts(curData: any, paginatedData: any): any;

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

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

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

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

package/dist/esm/components/add-variableV2/AddVariableV2.js

@@ -1 +1 @@
-import{__awaiter as e}from"../../_virtual/_tslib.js";import{jsx as a,jsxs as i,Fragment as s}from"react/jsx-runtime";import l from"../../assets/icons/back_icon.svg.js";import t from"../../assets/icons/chevronRightAlt.svg.js";import n from"../../assets/icons/cross.svg.js";import r from"../../assets/icons/plus.svg.js";import o from"../../assets/icons/undo.svg.js";import{memo as c,useState as d,useEffect as b}from"react";import{AddVariableStyled as v}from"./AddVariableV2.styled.js";import{Button as m}from"../button/Button.js";import{IconButton as h}from"../icon-button/IconButton.js";import{SearchBar as g}from"../searchBar/searchBar.js";import{Tooltip as p}from"../tooltips/Tooltip.js";import{COLORS as u}from"../../constants/Theme.js";import{CloseButtonContainer as y}from"../modals/modal.styled.js";import{Switch as f}from"../switch/Switch.js";import{BodySecondary as j,TitleSmall as O,BodyCaption as N}from"../TypographyStyle.js";const V=c((c=>{const{data:V,hasHeader:w=!0,needsBorder:S=!0,styledCloseBtn:_=!1,readonly:C=!1}=c,[T,k]=d({}),[x,L]=d(),[B,I]=d(""),[A,E]=d(""),[F,H]=d(!0),$=/^[^.].*[^.]$/,[z,P]=d(c.data),[R,M]=d(!0);b((()=>{const e={};V.forEach((a=>{e[a.displayName]=[]})),L(e)}),[V]),b((()=>{G(!0)}),[]),b((()=>{G(R,!B)}),[T,B]),b((()=>{M(!0),E(""),D([],B),L((e=>Object.assign(Object.assign({},e),{[B]:[]}))),I("");const e=c.data.map((e=>J(e))).filter((e=>null!==e));P(e),e.length>0?H(!0):H(!1)}),[c.reRender]),b((()=>{let e=c.data;B&&(e=[T[B]]);W(e,R).length>0?H(!0):H(!1)}),[A]);const W=function(e){let a=arguments.length>1&&void 0!==arguments[1]&&arguments[1];return e.flatMap((e=>Object.keys(e.variables).filter((i=>{var s;return(null===(s=e.variables[i].displayName)||void 0===s?void 0:s.toLowerCase().includes(A.toLowerCase()))&&(!a||e.variables[i].isAvailable===a)||q(e.variables[i])}))))},D=(e,a)=>{const i=V.find((e=>e.displayName===a));if(i){let s=i;e.forEach(((e,a)=>{s=s.variables[e]})),k((e=>Object.assign(Object.assign({},e),{[a]:s})))}},q=e=>{let a=!1;if(e.isSubHeader&&e.variables){const i=Object.keys(e.variables);for(let s=0;s<i.length;s++){const l=i[s];if(e.variables&&e.variables[l].displayName.toLowerCase().includes(A.toLowerCase())&&e.variables[l].isAvailable===R){a=!0;break}}}return a},G=function(e){let a=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(M(e),e){let i=[];if(!B||a)i=c.data.map((e=>J(e))).filter((e=>null!==e));else{const e=T[B];i=c.data.filter((e=>e.displayName===B)).map((a=>J(a,e))).filter((e=>null!=e))}P(i),A&&(i=W(i,e)),i.length>0?H(!0):H(!1)}else if(P(c.data),A){W(c.data,e).length>0?H(!0):H(!1)}else H(!0)};function J(e,a){let i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(a)for(const s in e.variables)if(e.variables[s].displayName===a.displayName)for(const a in e.variables[s].variables)e.variables[s].variables[a].isAvailable&&(i[a]=e.variables[s].variables[a]);else e.variables[s].isSubHeader&&J(e.variables[s],a,i);else for(const a in e.variables)e.variables[a].isAvailable&&(i[a]=e.variables[a]);return 0===Object.keys(i).length?null:Object.assign(Object.assign({},e),{variables:i})}const K=e=>{const i=e.item.description;return e.readonly?a("div",{children:a(Q,{item:e.item,readonly:e.readonly})}):a(s,{children:a(p,Object.assign({body:"",tooltipContent:a(N,Object.assign({color:u.content.primaryInverse,style:{whiteSpace:"pre-line",padding:8}},{children:e.item.isAvailable?i?`• ${i}\n• Recommended here`:"Recommended here":"Not recommended here"})),width:300,delay:300,placement:"bottom"},{children:a("div",{children:a(Q,{item:e.item})})}))})},Q=e=>a(m,{darkMode:c.enableVariable?c.enableVariable:e.item.isAvailable,size:"chip",disabled:!!e.readonly&&!e.item.isSubHeader,LeadingIcon:e.item.isSubHeader||e.readonly?void 0:r,TrailingIcon:()=>e.item.isSubHeader?a("div",Object.assign({className:"icon-trailing",style:{display:"flex"}},{children:a(t,{})})):a(s,{}),buttonText:e.item.displayName}),U=(e,i)=>R&&!e.isAvailable?a(s,{}):a("div",Object.assign({onClick:e.isSubHeader?()=>{W([e],R).length||H(!1),E("");const a=[...x[B],i];D(a,B),L((e=>Object.assign(Object.assign({},e),{[B]:a})))}:()=>{c.customTrigger?(c.customTrigger(e),c.setShowVariable(!1)):c.isEvaluationList?Y(e):c.setVariableValue(c.selectWithTypes?{actualValue:e.actualValue,variableType:e.variableType,needsFetching:e.needsFetching}:e.actualValue)}},{children:a(K,{item:e,readonly:C})})),X=(e,a)=>{const i=[...x[e.displayName],a];D(i,e.displayName),L((a=>Object.assign(Object.assign({},a),{[e.displayName]:i}))),I(e.displayName)},Y=e=>{if(e.actualValue.match($)){const a=e.actualValue.replace("{{","").replace("}}","").split(".");let i=a[0];a.forEach(((e,a)=>{if(0===a)return;const s=(e=>/\w+\[\d+\]/g.test(e))(e);if(s){const a=e.match(/(\w+)\[(\d+)\]/);if(a){const e=a[1],s=a[2];i+=`['${e}'][${s}]`}}else i+=`['${e}']`})),c.setVariableValue(c.selectWithTypes?{actualValue:i,variableType:e.variableType,needsFetching:e.needsFetching}:i)}else{const a=e.actualValueEval?e.actualValueEval:e.actualValue;c.setVariableValue(c.selectWithTypes?{actualValue:a,variableType:e.variableType,needsFetching:e.needsFetching}:a)}},Z=(e,a)=>{if(c.customTrigger)c.customTrigger(e.variables[a]),c.setShowVariable(!1);else if(c.isEvaluationList){const i=e.variables[a];Y(i)}else c.setVariableValue(c.selectWithTypes?{actualValue:e.variables[a].actualValue,variableType:e.variables[a].variableType,needsFetching:e.variables[a].needsFetching}:e.variables[a].actualValue)},ee=c.isModalState?void 0:{top:`${c.topPosition?c.topPosition:"small"===c.pickerSize?"300px":"60px"}`,left:`${c.leftPosition?c.leftPosition+24:430}px`};return a("div",Object.assign({id:"varList",tabIndex:-1},{children:i(v,Object.assign({style:ee,onClick:e=>{e.stopPropagation()},pickerSize:c.pickerSize||"large",isModalState:c.isModalState,positionStrategy:c.positionStrategy,zIndex:c.zindex,height:c.height,needsBorder:S,width:c.width},{children:[_&&a(y,Object.assign({onClick:()=>{c.setShowVariable(!1)},style:{zIndex:300}},{children:a(n,{height:20,width:20,color:u.content.secondary})})),c.showVariable&&i("div",Object.assign({className:"popup"},{children:[i("div",Object.assign({className:"sticky__bar"},{children:[w&&i("div",Object.assign({className:"header__bar"},{children:[a("div",Object.assign({className:"add__variable"},{children:"Add a new variable"})),!_&&a("div",Object.assign({onClick:()=>{c.setShowVariable(!1)},style:{display:"flex",alignItems:"center",justifyContent:"center"}},{children:a(h,{iconButtonType:"default",Icon:n})}))]})),i("div",Object.assign({className:"search__bar",onBlur:e=>{c.onSearchBlur&&c.onSearchBlur(e)}},{children:[a(g,{width:"100%",isEnabled:!0,onChange:e=>{E(e)},onEnter:()=>{},reset:!A,placeholder:"Search...",variant:"default"}),i("div",Object.assign({style:{display:"flex",alignItems:"center",marginTop:8,justifyContent:"space-between"}},{children:[a(j,Object.assign({style:{color:u.content.secondary}},{children:"Show only recommended variables"})),a(f,{value:R,onValueChange:a=>e(void 0,void 0,void 0,(function*(){return yield G(a)}))})]}))]})),B&&x[B].length>0&&i("div",Object.assign({className:"nav__bar"},{children:[i("div",Object.assign({className:"left__nav"},{children:[a(h,{Icon:l,style:{color:"#919191",display:"flex"},onClick:()=>{E("");const e=x[B].slice(0,-1);D(e,B),L((a=>Object.assign(Object.assign({},a),{[B]:e}))),e.length||I("")}}),i("div",Object.assign({className:"block"},{children:[a(O,{children:T[B].displayName}),T[B].description&&a(N,{children:T[B].description})]}))]})),i("div",Object.assign({className:"right__nav"},{children:[a(h,{Icon:o,style:{display:"flex"},onClick:()=>{E(""),D([],B),L((e=>Object.assign(Object.assign({},e),{[B]:[]}))),I("")}}),a("div",{children:"First page"})]}))]}))]})),!F&&i("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",marginTop:16}},{children:[a(O,{children:"No results found!"}),a(N,R?{children:"Sorry we could not find any recommended variables"}:{children:`Sorry we could not find any results for "${A}"`})]})),a("div",Object.assign({className:"wrapper"},{children:a("div",Object.assign({className:"list__map"},{children:i("div",Object.assign({className:"items"},{children:[!B&&z.map((e=>{let l=[];return A&&(l=Object.keys(e.variables).filter((a=>{var i;return(null===(i=e.variables[a].displayName)||void 0===i?void 0:i.toLowerCase().includes(A.toLowerCase()))||q(e.variables[a])}))),i(s,{children:[A?l.length>0?i("div",Object.assign({className:"block"},{children:[a("div",Object.assign({className:"heading__font"},{children:null==e?void 0:e.displayName})),a(N,Object.assign({style:{marginBottom:8,color:"#616161"}},{children:null==e?void 0:e.description}))]})):a(s,{}):i("div",Object.assign({className:"block"},{children:[a("div",Object.assign({className:"heading__font"},{children:null==e?void 0:e.displayName})),a(N,Object.assign({style:{marginBottom:8,color:"#616161"}},{children:null==e?void 0:e.description}))]})),Object.keys(e.variables).map((i=>{var l;return A?(null===(l=e.variables[i].displayName)||void 0===l?void 0:l.toLowerCase().includes(A.toLowerCase()))||q(e.variables[i])?a("div",Object.assign({onClick:e.variables[i].isSubHeader?()=>X(e,i):()=>Z(e,i)},{children:a(K,{item:e.variables[i],readonly:C})})):a(s,{}):a("div",Object.assign({onClick:e.variables[i].isSubHeader?()=>X(e,i):()=>Z(e,i)},{children:a(K,{item:e.variables[i],readonly:C})}))}))]})})),B&&a("div",Object.assign({className:"list__map"},{children:a("div",Object.assign({className:"items",style:{marginTop:16}},{children:Object.keys(T[B].variables).map(((e,i)=>{var l;return A?(null===(l=T[B].variables[e].displayName)||void 0===l?void 0:l.toLowerCase().includes(A.toLowerCase()))||q(T[B].variables[e])?U(T[B].variables[e],e):a(s,{}):U(T[B].variables[e],e)}))}))}))]}))}))})),a("div",{className:"bottom__padding"})]}))]}))}))}),((e,a)=>e.enableVariable===a.enableVariable&&(e.leftPosition===a.leftPosition&&e.reRender===a.reRender)));export{V as AddVariableV2};
+import{__awaiter as e}from"../../_virtual/_tslib.js";import{jsx as a,jsxs as i,Fragment as s}from"react/jsx-runtime";import l from"../../assets/icons/back_icon.svg.js";import t from"../../assets/icons/chevronRightAlt.svg.js";import n from"../../assets/icons/cross.svg.js";import r from"../../assets/icons/plus.svg.js";import o from"../../assets/icons/undo.svg.js";import{memo as c,useState as d,useEffect as b}from"react";import{AddVariableStyled as v}from"./AddVariableV2.styled.js";import{Button as m}from"../button/Button.js";import{IconButton as h}from"../icon-button/IconButton.js";import{SearchBar as g}from"../searchBar/searchBar.js";import{Tooltip as p}from"../tooltips/Tooltip.js";import{COLORS as u}from"../../constants/Theme.js";import{CloseButtonContainer as y}from"../modals/modal.styled.js";import{Switch as j}from"../switch/Switch.js";import{BodySecondary as f,TitleSmall as O,BodyCaption as N}from"../TypographyStyle.js";const V=c((c=>{const{data:V,hasHeader:w=!0,needsBorder:S=!0,styledCloseBtn:_=!1,readonly:C=!1}=c,[T,k]=d({}),[x,L]=d(),[B,I]=d(""),[A,F]=d(""),[H,E]=d(!0),z=/^[^.]*\.[^.]*$/,[P,R]=d(c.data),[$,M]=d(!0);b((()=>{const e={};V.forEach((a=>{e[a.displayName]=[]})),L(e)}),[V]),b((()=>{G(!0)}),[]),b((()=>{G($,!B)}),[T,B]),b((()=>{M(!0),F(""),D([],B),L((e=>Object.assign(Object.assign({},e),{[B]:[]}))),I("");const e=c.data.map((e=>J(e))).filter((e=>null!==e));R(e),e.length>0?E(!0):E(!1)}),[c.reRender]),b((()=>{let e=c.data;B&&(e=[T[B]]);W(e,$).length>0?E(!0):E(!1)}),[A]);const W=function(e){let a=arguments.length>1&&void 0!==arguments[1]&&arguments[1];return e.flatMap((e=>Object.keys(e.variables).filter((i=>{var s;return(null===(s=e.variables[i].displayName)||void 0===s?void 0:s.toLowerCase().includes(A.toLowerCase()))&&(!a||e.variables[i].isAvailable===a)||q(e.variables[i])}))))},D=(e,a)=>{const i=V.find((e=>e.displayName===a));if(i){let s=i;e.forEach(((e,a)=>{s=s.variables[e]})),k((e=>Object.assign(Object.assign({},e),{[a]:s})))}},q=e=>{let a=!1;if(e.isSubHeader&&e.variables){const i=Object.keys(e.variables);for(let s=0;s<i.length;s++){const l=i[s];if(e.variables&&e.variables[l].displayName.toLowerCase().includes(A.toLowerCase())&&e.variables[l].isAvailable===$){a=!0;break}}}return a},G=function(e){let a=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(M(e),e){let i=[];if(!B||a)i=c.data.map((e=>J(e))).filter((e=>null!==e));else{const e=T[B];i=c.data.filter((e=>e.displayName===B)).map((a=>J(a,e))).filter((e=>null!=e))}R(i),A&&(i=W(i,e)),i.length>0?E(!0):E(!1)}else if(R(c.data),A){W(c.data,e).length>0?E(!0):E(!1)}else E(!0)};function J(e,a){let i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(a)for(const s in e.variables)if(e.variables[s].displayName===a.displayName)for(const a in e.variables[s].variables)e.variables[s].variables[a].isAvailable&&(i[a]=e.variables[s].variables[a]);else e.variables[s].isSubHeader&&J(e.variables[s],a,i);else for(const a in e.variables)e.variables[a].isAvailable&&(i[a]=e.variables[a]);return 0===Object.keys(i).length?null:Object.assign(Object.assign({},e),{variables:i})}const K=e=>{const i=e.item.description;return e.readonly?a("div",{children:a(Q,{item:e.item,readonly:e.readonly})}):a(s,{children:a(p,Object.assign({body:"",tooltipContent:a(N,Object.assign({color:u.content.primaryInverse,style:{whiteSpace:"pre-line",padding:8}},{children:e.item.isAvailable?i?`• ${i}\n• Recommended here`:"Recommended here":"Not recommended here"})),width:300,delay:300,placement:"bottom"},{children:a("div",{children:a(Q,{item:e.item})})}))})},Q=e=>a(m,{darkMode:c.enableVariable?c.enableVariable:e.item.isAvailable,size:"chip",disabled:!!e.readonly&&!e.item.isSubHeader,LeadingIcon:e.item.isSubHeader||e.readonly?void 0:r,TrailingIcon:()=>e.item.isSubHeader?a("div",Object.assign({className:"icon-trailing",style:{display:"flex"}},{children:a(t,{})})):a(s,{}),buttonText:e.item.displayName}),U=(e,i)=>$&&!e.isAvailable?a(s,{}):a("div",Object.assign({onClick:e.isSubHeader?()=>{W([e],$).length||E(!1),F("");const a=[...x[B],i];D(a,B),L((e=>Object.assign(Object.assign({},e),{[B]:a})))}:()=>{c.customTrigger?(c.customTrigger(e),c.setShowVariable(!1)):c.isEvaluationList?Y(e):c.setVariableValue(c.selectWithTypes?{actualValue:e.actualValue,variableType:e.variableType,needsFetching:e.needsFetching}:e.actualValue)}},{children:a(K,{item:e,readonly:C})})),X=(e,a)=>{const i=[...x[e.displayName],a];D(i,e.displayName),L((a=>Object.assign(Object.assign({},a),{[e.displayName]:i}))),I(e.displayName)},Y=e=>{if(e.actualValue.match(z)){const a=e.actualValue.replace("{{","").replace("}}","").split("."),i=a[0]+`['${a[1]}']`;c.setVariableValue(c.selectWithTypes?{actualValue:i,variableType:e.variableType,needsFetching:e.needsFetching}:i)}else{const a=e.actualValueEval?e.actualValueEval:e.actualValue;c.setVariableValue(c.selectWithTypes?{actualValue:a,variableType:e.variableType,needsFetching:e.needsFetching}:a)}},Z=(e,a)=>{if(c.customTrigger)c.customTrigger(e.variables[a]),c.setShowVariable(!1);else if(c.isEvaluationList){const i=e.variables[a];Y(i)}else c.setVariableValue(c.selectWithTypes?{actualValue:e.variables[a].actualValue,variableType:e.variables[a].variableType,needsFetching:e.variables[a].needsFetching}:e.variables[a].actualValue)},ee=c.isModalState?void 0:{top:`${c.topPosition?c.topPosition:"small"===c.pickerSize?"300px":"60px"}`,left:`${c.leftPosition?c.leftPosition+24:430}px`};return a("div",Object.assign({id:"varList",tabIndex:-1},{children:i(v,Object.assign({style:ee,onClick:e=>{e.stopPropagation()},pickerSize:c.pickerSize||"large",isModalState:c.isModalState,positionStrategy:c.positionStrategy,zIndex:c.zindex,height:c.height,needsBorder:S,width:c.width},{children:[_&&a(y,Object.assign({onClick:()=>{c.setShowVariable(!1)},style:{zIndex:300}},{children:a(n,{height:20,width:20,color:u.content.secondary})})),c.showVariable&&i("div",Object.assign({className:"popup"},{children:[i("div",Object.assign({className:"sticky__bar"},{children:[w&&i("div",Object.assign({className:"header__bar"},{children:[a("div",Object.assign({className:"add__variable"},{children:"Add a new variable"})),!_&&a("div",Object.assign({onClick:()=>{c.setShowVariable(!1)},style:{display:"flex",alignItems:"center",justifyContent:"center"}},{children:a(h,{iconButtonType:"default",Icon:n})}))]})),i("div",Object.assign({className:"search__bar",onBlur:e=>{c.onSearchBlur&&c.onSearchBlur(e)}},{children:[a(g,{width:"100%",isEnabled:!0,onChange:e=>{F(e)},onEnter:()=>{},reset:!A,placeholder:"Search...",variant:"default"}),i("div",Object.assign({style:{display:"flex",alignItems:"center",marginTop:8,justifyContent:"space-between"}},{children:[a(f,Object.assign({style:{color:u.content.secondary}},{children:"Show only recommended variables"})),a(j,{value:$,onValueChange:a=>e(void 0,void 0,void 0,(function*(){return yield G(a)}))})]}))]})),B&&x[B].length>0&&i("div",Object.assign({className:"nav__bar"},{children:[i("div",Object.assign({className:"left__nav"},{children:[a(h,{Icon:l,style:{color:"#919191",display:"flex"},onClick:()=>{F("");const e=x[B].slice(0,-1);D(e,B),L((a=>Object.assign(Object.assign({},a),{[B]:e}))),e.length||I("")}}),i("div",Object.assign({className:"block"},{children:[a(O,{children:T[B].displayName}),T[B].description&&a(N,{children:T[B].description})]}))]})),i("div",Object.assign({className:"right__nav"},{children:[a(h,{Icon:o,style:{display:"flex"},onClick:()=>{F(""),D([],B),L((e=>Object.assign(Object.assign({},e),{[B]:[]}))),I("")}}),a("div",{children:"First page"})]}))]}))]})),!H&&i("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",marginTop:16}},{children:[a(O,{children:"No results found!"}),a(N,$?{children:"Sorry we could not find any recommended variables"}:{children:`Sorry we could not find any results for "${A}"`})]})),a("div",Object.assign({className:"wrapper"},{children:a("div",Object.assign({className:"list__map"},{children:i("div",Object.assign({className:"items"},{children:[!B&&P.map((e=>{let l=[];return A&&(l=Object.keys(e.variables).filter((a=>{var i;return(null===(i=e.variables[a].displayName)||void 0===i?void 0:i.toLowerCase().includes(A.toLowerCase()))||q(e.variables[a])}))),i(s,{children:[A?l.length>0?i("div",Object.assign({className:"block"},{children:[a("div",Object.assign({className:"heading__font"},{children:null==e?void 0:e.displayName})),a(N,Object.assign({style:{marginBottom:8,color:"#616161"}},{children:null==e?void 0:e.description}))]})):a(s,{}):i("div",Object.assign({className:"block"},{children:[a("div",Object.assign({className:"heading__font"},{children:null==e?void 0:e.displayName})),a(N,Object.assign({style:{marginBottom:8,color:"#616161"}},{children:null==e?void 0:e.description}))]})),Object.keys(e.variables).map((i=>{var l;return A?(null===(l=e.variables[i].displayName)||void 0===l?void 0:l.toLowerCase().includes(A.toLowerCase()))||q(e.variables[i])?a("div",Object.assign({onClick:e.variables[i].isSubHeader?()=>X(e,i):()=>Z(e,i)},{children:a(K,{item:e.variables[i],readonly:C})})):a(s,{}):a("div",Object.assign({onClick:e.variables[i].isSubHeader?()=>X(e,i):()=>Z(e,i)},{children:a(K,{item:e.variables[i],readonly:C})}))}))]})})),B&&a("div",Object.assign({className:"list__map"},{children:a("div",Object.assign({className:"items",style:{marginTop:16}},{children:Object.keys(T[B].variables).map(((e,i)=>{var l;return A?(null===(l=T[B].variables[e].displayName)||void 0===l?void 0:l.toLowerCase().includes(A.toLowerCase()))||q(T[B].variables[e])?U(T[B].variables[e],e):a(s,{}):U(T[B].variables[e],e)}))}))}))]}))}))})),a("div",{className:"bottom__padding"})]}))]}))}))}),((e,a)=>e.enableVariable===a.enableVariable&&(e.leftPosition===a.leftPosition&&e.reRender===a.reRender)));export{V as AddVariableV2};

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

@@ -0,0 +1,8 @@
+import { Product, ProductVariant } from './modal';
+import { OUT_OF_STOCK_ACTION } from './type';
+export type ProductPickerTagType = {
+    isVariant: boolean;
+    data: Product | ProductVariant;
+    outOfStockAction?: OUT_OF_STOCK_ACTION;
+};
+export declare const ProductPickerTag: (props: ProductPickerTagType) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1 @@
+import{jsx as t,Fragment as e}from"react/jsx-runtime";import{BikShimmer as i}from"../shimmer/ShimmerComponent/BikShimmer.js";import{Tag as l}from"../tag/Tag.js";import{ProductHelper as r}from"./helpers/ProductHelper.js";const o=o=>{var s,n;const{isVariant:a,data:m,outOfStockAction:p}=o;let d=m,c=a;1===Object.keys(null!==(s=null==m?void 0:m.variants)&&void 0!==s?s:{}).length&&(d=Object.values(null!==(n=null==m?void 0:m.variants)&&void 0!==n?n:{})[0],c=!0);const u=r.getProductLabels(d,p),g=r.getTagType(null!=u?u:"");return t("div",Object.assign({style:{display:"flex"}},{children:!(null==d?void 0:d.fbStatus)&&c?t(i,{boxes:[{height:"24px",width:"100px",marginTop:"0px"}]}):u?t("div",Object.assign({style:{display:"flex"}},{children:t(l,{tagText:u,type:g,theme:"light"})})):t(e,{})}))};export{o as ProductPickerTag};

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

@@ -13,6 +13,7 @@ interface CollectionsScreenInterface {
     storeId: string;
     selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
     setCollectionId: React.Dispatch<React.SetStateAction<string>>;
+    setSelectedCollectionId: React.Dispatch<React.SetStateAction<string>>;
     setScreen: React.Dispatch<React.SetStateAction<string>>;
     collectionsDispatch: React.Dispatch<CollectionsActions>;
     setSaveDisabled: React.Dispatch<boolean>;

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

@@ -1 +1 @@
-import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import i from"../../assets/icons/chevronRight.svg.js";import{useRef as c,useState as s,useEffect as r}from"react";import{CheckBox as l}from"../checkBox/CheckBox.js";import{IconButton as n}from"../icon-button/IconButton.js";import{BikShimmer as d}from"../shimmer/ShimmerComponent/BikShimmer.js";import{Tag as a}from"../tag/Tag.js";import{Tooltip as h}from"../tooltips/Tooltip.js";import{TitleRegular as p}from"../TypographyStyle.js";import{EmptyState as m}from"./emptyState.js";import{CollectionCardStyle as u,CollectionCardInfoStyle as C,CollectionCardDetailStyle as v,CollectionNameHolder as b}from"./style.js";const g=(e,t,o)=>{if(e.length<=t)return e;const i=e.slice(0,t-1);return(o?i.slice(0,i.lastIndexOf(" ")):i)+"..."},y=o=>{const{customCollectionRestriction:i,dataLoading:l,collections:n,selectedCollectionsDispatch:a,setCollectionId:h,selectedCollections:p,setScreen:u,collectionFetcher:C,collectionsDispatch:v,pagingControls:b,storeId:g,setSaveDisabled:y,hideCollectionCheckbox:k,renderWithoutModal:j,pickerType:x}=o,O=c(null),E=c(b.curPage),I=!!i&&(null==p?void 0:p.isCustom),[T,S]=s(!1);r((()=>{E.current=b.curPage}),[b.curPage]),r((()=>{const e=new IntersectionObserver((e=>{e[0].isIntersecting&&E.current>0&&(y(!0),S(!0),C(E.current,g).then((e=>{v({type:"paged",data:(null==e?void 0:e.collections)||{}}),b.setCurPage(E.current+1),S(!1),y(!1)})).catch())}),{threshold:1});return O.current&&e.observe(O.current),()=>{O.current&&e.unobserve(O.current)}}),[O]);const D=e=>{var t,o;let i=0,c=0;if(p[e]){const s=null===(t=n[e])||void 0===t?void 0:t.products;s&&Object.keys(s).forEach((e=>{var t;const o=null===(t=s[e])||void 0===t?void 0:t.variants;o&&Object.keys(o).forEach((e=>i+=1))}));const r=null===(o=p[e])||void 0===o?void 0:o.products;return r&&Object.keys(r).forEach((e=>{var t;const o=null===(t=r[e])||void 0===t?void 0:t.variants;o&&Object.keys(o).forEach((e=>c+=1))})),!(i<=0&&c>0)&&(c>0&&i!==c)}return!1};return e("div",{children:[Object.keys(n).length?Object.keys(n).map((e=>t(f,{customCollectionRestriction:i,data:n[e],isDisabled:I&&!(null==p?void 0:p[e]),isChecked:!!(null==p?void 0:p[e]),isPartiallyChecked:D(e),selectedCollectionsDispatch:a,setCollectionId:h,setScreen:u,id:e,hideCollectionCheckbox:k,selectedCollections:p,renderWithoutModal:j,pickerType:x},e))):l?[1,2,3,4,5,6,7,8,9,10].map(((e,o)=>t("div",Object.assign({style:{borderBottom:"1px solid #E0E0E0"}},{children:t(d,{boxes:[{height:"64px",width:"100%",marginTop:"0px"}]})}),o))):t(m,{title:"No collections to show",subtitle:"We couldn’t find any collection."}),t("div",{ref:O}),T&&[1,2,3,4,5].map(((e,o)=>t("div",Object.assign({style:{borderBottom:"1px solid #E0E0E0"}},{children:t(d,{boxes:[{height:"64px",width:"100%",marginTop:"0px"}]})}),o)))]})},f=c=>{const{customCollectionRestriction:s,data:r,selectedCollectionsDispatch:d,setCollectionId:m,isPartiallyChecked:y,setScreen:f,id:k,isChecked:j,isDisabled:x,hideCollectionCheckbox:O,pickerType:E,selectedCollections:I}=c;return e(u,Object.assign({isDisabled:x,onClick:e=>{if(!x){if("COLLECTION"===E)return e.stopPropagation(),d({type:"reset",data:{}}),d({type:"selected",data:{id:k,val:r,isRestricted:s}}),void m(k);m(k),f("products")}},isActive:!!I[k]},{children:[e(C,{children:[!O&&t(l,{isDisabled:x,isChecked:j,isPartiallyChecked:y,onValueChange:function(e,t,o){null==o||o.stopPropagation(),d(e?{type:"selected",data:{id:k,val:r,isRestricted:s}}:{type:"unselected",data:{id:k}}),m(e?k:"")}}),t(v,{children:t(h,Object.assign({body:r.name,placement:"bottom",delay:400},{children:e(b,{children:[t(p,{children:g(r.name,40,!0)}),r.isSmartCollection?t("div",Object.assign({style:{display:"flex"}},{children:t(a,{tagText:"Smart Collection",type:"warning"})})):t(o,{})]})}))})]}),"COLLECTION"!==E&&t(n,{height:12,width:12,disabled:x,Icon:i})]}))};export{y as CollectionsScreen,g as truncate};
+import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import i from"../../assets/icons/chevronRight.svg.js";import{useRef as c,useState as s,useEffect as l}from"react";import{CheckBox as r}from"../checkBox/CheckBox.js";import{IconButton as n}from"../icon-button/IconButton.js";import{BikShimmer as d}from"../shimmer/ShimmerComponent/BikShimmer.js";import{Tag as a}from"../tag/Tag.js";import{Tooltip as h}from"../tooltips/Tooltip.js";import{TitleRegular as p}from"../TypographyStyle.js";import{EmptyState as u}from"./emptyState.js";import{CollectionCardStyle as m,CollectionCardInfoStyle as C,CollectionCardDetailStyle as b,CollectionNameHolder as g}from"./style.js";const v=(e,t,o)=>{if(e.length<=t)return e;const i=e.slice(0,t-1);return(o?i.slice(0,i.lastIndexOf(" ")):i)+"..."},y=o=>{const{customCollectionRestriction:i,dataLoading:r,collections:n,selectedCollectionsDispatch:a,setCollectionId:h,setSelectedCollectionId:p,selectedCollections:m,setScreen:C,collectionFetcher:b,collectionsDispatch:g,pagingControls:v,storeId:y,setSaveDisabled:k,hideCollectionCheckbox:j,renderWithoutModal:x,pickerType:O}=o,I=c(null),S=c(v.curPage),E=!!i&&(null==m?void 0:m.isCustom),[T,D]=s(!1),P=c(!1);l((()=>{S.current=v.curPage}),[v.curPage]),l((()=>{const e=new IntersectionObserver((e=>{e[0].isIntersecting&&S.current>0&&!P.current&&(k(!0),D(!0),b(S.current,y).then((e=>{g({type:"paged",data:(null==e?void 0:e.collections)||{}}),v.setCurPage(S.current+1),D(!1),k(!1),Object.keys(e).length||(P.current=!0)})).catch())}),{threshold:1});return I.current&&e.observe(I.current),()=>{I.current&&e.unobserve(I.current)}}),[I]);const w=e=>{var t,o;let i=0,c=0;if(m[e]){const s=null===(t=n[e])||void 0===t?void 0:t.products;s&&Object.keys(s).forEach((e=>{var t;const o=null===(t=s[e])||void 0===t?void 0:t.variants;o&&Object.keys(o).forEach((e=>i+=1))}));const l=null===(o=m[e])||void 0===o?void 0:o.products;return l&&Object.keys(l).forEach((e=>{var t;const o=null===(t=l[e])||void 0===t?void 0:t.variants;o&&Object.keys(o).forEach((e=>c+=1))})),!(i<=0&&c>0)&&(c>0&&i!==c)}return!1};return e("div",{children:[Object.keys(n).length?Object.keys(n).map((e=>t(f,{customCollectionRestriction:i,data:n[e],isDisabled:E&&!(null==m?void 0:m[e]),isChecked:!!(null==m?void 0:m[e]),isPartiallyChecked:w(e),selectedCollectionsDispatch:a,setCollectionId:h,setSelectedCollectionId:p,setScreen:C,id:e,hideCollectionCheckbox:j||"-1"===e,selectedCollections:m,renderWithoutModal:x,pickerType:O},e))):r?[1,2,3,4,5,6,7,8,9,10].map(((e,o)=>t("div",Object.assign({style:{borderBottom:"1px solid #E0E0E0"}},{children:t(d,{boxes:[{height:"64px",width:"100%",marginTop:"0px"}]})}),o))):t(u,{title:"No collections to show",subtitle:"We couldn’t find any collection."}),t("div",{ref:I}),T&&[1,2,3,4,5].map(((e,o)=>t("div",Object.assign({style:{borderBottom:"1px solid #E0E0E0"}},{children:t(d,{boxes:[{height:"64px",width:"100%",marginTop:"0px"}]})}),o)))]})},f=c=>{const{customCollectionRestriction:s,data:l,selectedCollectionsDispatch:d,setCollectionId:u,setSelectedCollectionId:y,isPartiallyChecked:f,setScreen:k,id:j,isChecked:x,isDisabled:O,hideCollectionCheckbox:I,pickerType:S,selectedCollections:E}=c;return e(m,Object.assign({isDisabled:O,onClick:e=>{if(!O){if("COLLECTION"===S)return e.stopPropagation(),d({type:"reset",data:{}}),d({type:"selected",data:{id:j,val:l,isRestricted:s}}),void u(j);u(j),k("products")}},isActive:!!E[j]},{children:[e(C,{children:[!I&&t(r,{isDisabled:O,isChecked:x,isPartiallyChecked:f,onValueChange:function(e,t,o){null==o||o.stopPropagation(),d(e?{type:"selected",data:{id:j,val:l,isRestricted:s}}:{type:"unselected",data:{id:j}}),y(e?j:"")}}),t(b,{children:t(h,Object.assign({body:l.name,placement:"bottom",delay:400},{children:e(g,{children:[t(p,{children:v(l.name,40,!0)}),l.isSmartCollection?t("div",Object.assign({style:{display:"flex"}},{children:t(a,{tagText:"Smart Collection",type:"warning"})})):t(o,{})]})}))})]}),"COLLECTION"!==S&&t(n,{height:12,width:12,disabled:O,Icon:i})]}))};export{y as CollectionsScreen,v as truncate};

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

@@ -1,3 +1,4 @@
+import { TagType } from "../../tag/model";
 import { Product, ProductVariant, SelectedItems } from '../modal';
 import { OUT_OF_STOCK_ACTION } from '../type';
 import { ProductVariantForRearrange } from '../variant';
@@ -31,6 +32,7 @@ export declare class ProductHelper {
      * @param outOfStockAction
      */
     static getProductLabels(productVariant: Product | ProductVariant, outOfStockAction?: OUT_OF_STOCK_ACTION): string | null;
+    static getTagType: (tagText: string) => TagType;
 }
 /**
  * Loops through each collection, each product, each variant.

package/dist/esm/components/product-picker-v2/helpers/ProductHelper.js

@@ -1 +1 @@
-import{OUT_OF_STOCK_ACTION as n}from"../type.js";const t={NORMAL:null,NOT_SYNCED:"Hidden",OUT_OF_STOCK:"Out of Stock"};class i{static getProductLabels(i){let l=arguments.length>1&&void 0!==arguments[1]?arguments[1]:n.NORMAL,u="NORMAL";if(i.variants)return t[u];const d=i;return l===n.HIDE&&(!d.skipSync||0!==(null==d?void 0:d.quantity)&&-2!==(null==d?void 0:d.quantity)||(u="NOT_SYNCED"),d.skipSync&&0!==(null==d?void 0:d.quantity)&&-2!==(null==d?void 0:d.quantity)&&(u="NOT_SYNCED"),d.skipSync||0!==(null==d?void 0:d.quantity)&&-2!==(null==d?void 0:d.quantity)||(u="NOT_SYNCED"),d.skipSync||0===(null==d?void 0:d.quantity)||-2===(null==d?void 0:d.quantity)||(u="NORMAL")),l===n.BLUR&&(!d.skipSync||0!==(null==d?void 0:d.quantity)&&-2!==(null==d?void 0:d.quantity)||(u="NOT_SYNCED"),d.skipSync&&0!==(null==d?void 0:d.quantity)&&-2!==(null==d?void 0:d.quantity)&&(u="NOT_SYNCED"),d.skipSync||0!==(null==d?void 0:d.quantity)&&-2!==(null==d?void 0:d.quantity)||(u="OUT_OF_STOCK"),d.skipSync||0===(null==d?void 0:d.quantity)||-2===(null==d?void 0:d.quantity)||(u="NORMAL")),l===n.NORMAL&&(!d.skipSync||0!==(null==d?void 0:d.quantity)&&-2!==(null==d?void 0:d.quantity)||(u="NOT_SYNCED"),d.skipSync&&0!==(null==d?void 0:d.quantity)&&-2!==(null==d?void 0:d.quantity)&&(u="NOT_SYNCED"),d.skipSync||0!==(null==d?void 0:d.quantity)&&-2!==(null==d?void 0:d.quantity)||(u="NORMAL"),d.skipSync||0===(null==d?void 0:d.quantity)||-2===(null==d?void 0:d.quantity)||(u="NORMAL")),t[u]}}const l=n=>{let t=[];Object.keys(n).forEach((i=>{var l;return Object.keys((null===(l=null==n?void 0:n[i])||void 0===l?void 0:l.products)||[]).forEach((l=>{var u,d;const o=null!==(u=n[i].products)&&void 0!==u?u:[],a=null!==(d=o[l].variants)&&void 0!==d?d:[];return Object.keys(a).map((n=>{const t=a[n];t.variantId=n,t.productId=l,t.collectionId=i,t.productName=o[l].name})),t=[...t,...Object.values(a)],t}))}));const i=t.sort(((n,t)=>null==n.displayOrder&&null==t.displayOrder?0:null==n.displayOrder?1:null==t.displayOrder?-1:n.displayOrder-t.displayOrder));return i.forEach(((n,t)=>{n.displayOrder=t})),i};export{i as ProductHelper,l as parseSelectedVariantsToArray};
+import{OUT_OF_STOCK_ACTION as n}from"../type.js";const t={NORMAL:null,NOT_SYNCED:"Hidden",OUT_OF_STOCK:"Out of Stock",FB_REJECTED:"Rejected on FB catalog"};class l{static getProductLabels(l){let i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:n.NORMAL,u="NORMAL";if(l.variants)return t[u];const a=l;return"REJECTED"===(null==a?void 0:a.fbStatus)?t.FB_REJECTED:(i===n.HIDE&&(!a.skipSync||0!==(null==a?void 0:a.quantity)&&-2!==(null==a?void 0:a.quantity)||(u="NOT_SYNCED"),a.skipSync&&0!==(null==a?void 0:a.quantity)&&-2!==(null==a?void 0:a.quantity)&&(u="NOT_SYNCED"),a.skipSync||0!==(null==a?void 0:a.quantity)&&-2!==(null==a?void 0:a.quantity)||(u="NOT_SYNCED"),a.skipSync||0===(null==a?void 0:a.quantity)||-2===(null==a?void 0:a.quantity)||(u="NORMAL")),i===n.BLUR&&(!a.skipSync||0!==(null==a?void 0:a.quantity)&&-2!==(null==a?void 0:a.quantity)||(u="NOT_SYNCED"),a.skipSync&&0!==(null==a?void 0:a.quantity)&&-2!==(null==a?void 0:a.quantity)&&(u="NOT_SYNCED"),a.skipSync||0!==(null==a?void 0:a.quantity)&&-2!==(null==a?void 0:a.quantity)||(u="OUT_OF_STOCK"),a.skipSync||0===(null==a?void 0:a.quantity)||-2===(null==a?void 0:a.quantity)||(u="NORMAL")),i===n.NORMAL&&(!a.skipSync||0!==(null==a?void 0:a.quantity)&&-2!==(null==a?void 0:a.quantity)||(u="NOT_SYNCED"),a.skipSync&&0!==(null==a?void 0:a.quantity)&&-2!==(null==a?void 0:a.quantity)&&(u="NOT_SYNCED"),a.skipSync||0!==(null==a?void 0:a.quantity)&&-2!==(null==a?void 0:a.quantity)||(u="NORMAL"),a.skipSync||0===(null==a?void 0:a.quantity)||-2===(null==a?void 0:a.quantity)||(u="NORMAL")),t[u])}}Object.defineProperty(l,"getTagType",{enumerable:!0,configurable:!0,writable:!0,value:n=>t.FB_REJECTED===n?"negative":"warning"});const i=n=>{let t=[];Object.keys(n).forEach((l=>{var i;return Object.keys((null===(i=null==n?void 0:n[l])||void 0===i?void 0:i.products)||[]).forEach((i=>{var u,a;const d=null!==(u=n[l].products)&&void 0!==u?u:[],o=null!==(a=d[i].variants)&&void 0!==a?a:[];return Object.keys(o).map((n=>{const t=o[n];t.variantId=n,t.productId=i,t.collectionId=l,t.productName=d[i].name})),t=[...t,...Object.values(o)],t}))}));const l=t.sort(((n,t)=>null==n.displayOrder&&null==t.displayOrder?0:null==n.displayOrder?1:null==t.displayOrder?-1:n.displayOrder-t.displayOrder));return l.forEach(((n,t)=>{n.displayOrder=t})),l};export{l as ProductHelper,i as parseSelectedVariantsToArray};

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

@@ -7,10 +7,13 @@ export interface ProductVariant {
     quantity: number;
     skipSync?: boolean;
     displayOrder?: number | null;
+    fbStatus?: FbProductStatus;
+    description?: string;
 }
 export interface Product {
     name: string;
     image: string;
+    description?: string;
     variants?: {
         [key: string]: ProductVariant;
     };
@@ -38,6 +41,10 @@ export type CollectionFetcherReturn = Promise<{
 export type ProductFetcherReturn = Promise<{
     [key: string]: Product;
 }>;
+export type FbStatusFetcherReturn = Promise<{
+    [key: string]: FbProductStatus;
+}>;
+export type FbProductStatus = 'APPROVED' | 'REJECTED';
 export declare enum ScreenName {
     Collections = "collections",
     RearrangeProducts = "rearrange",
@@ -49,10 +56,11 @@ export type ProductPickerInterface = {
     hideGlobalSearch?: boolean;
     hideInCollectionSearch?: boolean;
     customCollectionRestriction?: boolean;
-    searchInCollectionFetcher: (storeId: string, collectionId: string, query: string) => Promise<string[]>;
+    searchInCollectionFetcher: (storeId: string, collectionId: string, query: string) => ProductFetcherReturn;
     searchFetcher: (storeId: string, query: string) => Promise<SelectedItems>;
     collectionFetcher: (offset: number, storeId: string) => CollectionFetcherReturn;
-    productFetcher: (collectionId: string, storeId: string) => ProductFetcherReturn;
+    productFetcher: (collectionId: string, storeId: string, limit?: number, offset?: number) => ProductFetcherReturn;
+    fbStatusFetcher?: (storeId: string, variantIds: string[]) => FbStatusFetcherReturn;
     storeId: string;
     selectedItems: SelectedItems;
     onAdd: (items: SelectedItems, total: number) => void;
@@ -60,6 +68,7 @@ export type ProductPickerInterface = {
     visible: boolean;
     zIndex?: number;
     limit?: number;
+    minlimit?: number;
     hideCollectionCheckbox?: boolean;
     hideProductCheckbox?: boolean;
     outOfStockAction?: OUT_OF_STOCK_ACTION;
@@ -74,6 +83,7 @@ export type ProductPickerInterface = {
     pickerType?: 'COLLECTION' | 'PRODUCT';
     hideProductVariants?: boolean;
     rearrangeEnabled?: boolean;
+    showProductDetailInfoIcon?: boolean;
 } & ({
     startupScreen: ScreenName.RearrangeProducts;
     rearrangeEnabled: true;

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

@@ -1 +1 @@
-import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import c from"../../assets/icons/search.svg.js";import{useReducer as r,useState as i,useRef as s,useEffect as n}from"react";import{COLORS as l}from"../../constants/Theme.js";import{Button as d}from"../button/Button.js";import{Input as a}from"../input/Input.js";import{StyledModal as h}from"../modals/styledModal.js";import{Spinner as u}from"../spinner/Spinner.js";import{Tag as p}from"../tag/Tag.js";import{CollectionsScreen as m}from"./collectionScreen.js";import{ProductsScreen as C}from"./productScreen.js";import{RearrangeScreen as g}from"./rearrangeScreen.js";import{collectionsReducer as b,selectedColectionsReducer as v,CollectionIdContext as y}from"./reducers.js";import{SearchScreen as f}from"./searchScreen.js";import{SelectedScreen as S}from"./selectedScreen.js";import{ContainerStyle as P,ScrollContainerStyle as j}from"./style.js";import{OUT_OF_STOCK_ACTION as x}from"./type.js";var k;!function(e){e.Collections="collections",e.RearrangeProducts="rearrange",e.SelectedProducts="view",e.SearchProducts="searchProducts",e.Products="products"}(k||(k={}));const T=T=>{const{storeId:I,selectedItems:O,onClose:R,visible:D,zIndex:F,limit:w,hideCollectionCheckbox:E,hideProductCheckbox:V,outOfStockAction:A=x.BLUR,hideVariantCheckbox:B,selectProductsFromCustomCollection:L,hideSelectionCount:M,title:z,width:G,renderWithoutModal:H,onClickSave:W,pickerType:$,hideProductVariants:K=!1,startupScreen:U=k.Collections,rearrangeEnabled:Y}=T,[q,J]=r(b,{}),[N,Q]=i([k.Collections,k.RearrangeProducts].includes(U)?U:k.Collections),[X,Z]=i("grid"),[_,ee]=i(""),[te,oe]=i(0),[ce,re]=i(!1),[ie,se]=i(0),[ne,le]=i(""),[de,ae]=i(!1),[he,ue]=i(!1),[pe,me]=i(),[Ce,ge]=r(v,Object.keys(O).length>0?O:{}),be=s(null);n((()=>{re(!0),ue(!0),T.collectionFetcher(te,I).then((e=>{J({type:"fetched",data:(null==e?void 0:e.collections)||{}}),re(!1),oe((e=>e+1)),ue(!1)})).catch()}),[]),n((()=>{let e=0;Object.keys(Ce||[]).forEach((t=>{var o;Object.keys((null===(o=Ce[t])||void 0===o?void 0:o.products)||[]).forEach((o=>{var c,r;Object.keys((null===(r=null===(c=Ce[t].products)||void 0===c?void 0:c[o])||void 0===r?void 0:r.variants)||[]).forEach((()=>{e+=1}))}))})),se(e)})),n((()=>{var e;_&&!(null===(e=null==q?void 0:q[_])||void 0===e?void 0:e.products)&&(re(!0),T.productFetcher(_,I).then((e=>{Object.keys(e).length&&J({type:"productsFetched",data:{collectionId:_,products:e}}),re(!1)})).catch())}),[_]),n((()=>{const e=setTimeout((()=>{"rearrange"!==N&&(ne.length?(ae(!0),T.searchFetcher(I,ne).then((e=>{me(Object.assign({},e)),Q("searchProducts"),re(!1),ae(!1)}))):Q("collections"))}),800);return()=>clearTimeout(e)}),[ne]),n((()=>{W&&(T.onAdd(Ce,ie),ve())}),[W]);const ve=()=>{ge({type:"reset",data:{}})},ye=e(P,{children:[T.postHeader&&t("div",Object.assign({style:{padding:"0 24px"}},{children:T.postHeader})),!T.hideGlobalSearch&&t(o,{children:("collections"===N||"searchProducts"===N)&&t("div",Object.assign({style:{padding:H?"8px 16px":"12px 24px",borderBottom:"1px solid #E0E0E0"}},{children:t(a,{noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>de?t(u,{size:"small",color:l.content.primary}):t(c,{})},id:"listInput",height:"24px",type:"text",value:ne,onChangeText:e=>{e.length&&e.trim().length?le(e):le("")}})}))}),e(j,Object.assign({ref:be},{children:["collections"===N&&t(m,{customCollectionRestriction:T.customCollectionRestriction,dataLoading:he,collections:q,selectedCollectionsDispatch:ge,setCollectionId:ee,setScreen:Q,selectedCollections:Ce,collectionFetcher:T.collectionFetcher,storeId:I,collectionsDispatch:J,setSaveDisabled:re,pagingControls:{curPage:te,setCurPage:oe},hideCollectionCheckbox:E,renderWithoutModal:H,pickerType:$}),"products"===N&&_&&t(y.Provider,Object.assign({value:_},{children:t(C,{hideInCollectionSearch:T.hideInCollectionSearch,customCollectionRestriction:T.customCollectionRestriction,productFetcher:T.productFetcher,setScreen:Q,storeId:I,data:q[_],collectionsDispatch:J,selectedCollectionsDispatch:ge,selectedData:Ce,setSaveDisabled:re,searchInCollectionFetcher:T.searchInCollectionFetcher,hideProductCheckbox:V,outOfStockAction:A,hideVariantCheckbox:B,selectProductsFromCustomCollection:L,renderWithoutModal:H,pickerType:$,hideProductVariants:K})})),"view"===N&&t(S,{selectedCollections:Ce||{},selectedCollectionsDispatch:ge,setScreen:Q,collections:q}),"rearrange"===N&&t(g,{selectedCollections:Ce||{},selectedCollectionsDispatch:ge,setScreen:Q,outOfStockAction:A,rearrangeViewType:"grid"===X?"list":"grid",scrollContainerRef:be}),"searchProducts"===N&&t(f,{customCollectionRestriction:T.customCollectionRestriction,selectedCollections:Ce||{},searchedCollections:pe||{},selectedCollectionsDispatch:ge,setScreen:Q,collections:q,onBackPress:()=>{le(""),me({})},pickerType:$,hideProductCheckbox:V,hideProductVariants:K,hideVariantCheckbox:B})]}))]});return t(o,{children:H?ye:t(h,Object.assign({zIndex:F,open:D,onClose:()=>{null==R||R(),ve()},headingTitle:z||("collections"===N||"products"===N?"Select Products":"view"===N?"Selected Products":"searchProducts"===N?"Searched Products":"rearrange"===N?"Rearrange Products":void 0),footerShadow:!0,centralContainerStyles:{width:G||"480px"},headerRightCustomElement:"rearrange"===N?(console.log("ignore:",Z),t(o,{})):t(o,{}),primaryButton:{buttonText:ce?"Loading...":N===k.RearrangeProducts?"Done":"Add",disabled:ce||ie<1||w&&ie>w||!1,onClick:()=>{T.onAdd(Ce,ie),ve()}},footerLeftCustomElement:M?t(o,{}):w&&ie>w?t(p,{tagText:`You can only select ${w} products`,type:"negative"}):t(d,ie>0?{onClick:()=>{Q(Y?k.RearrangeProducts:k.SelectedProducts)},buttonText:`${ie} products selected`,buttonType:["rearrange","view"].includes(N)?"tertiaryGray":"tertiary",disabled:["rearrange","view"].includes(N)}:{disabled:!0,buttonText:`${ie} products selected`,buttonType:"tertiaryGray"})},{children:ye}))})};export{T as ProductPickerModal,k as ScreenName};
+import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import c from"../../assets/icons/search.svg.js";import{useReducer as r,useState as s,useRef as i,useEffect as n}from"react";import{COLORS as l}from"../../constants/Theme.js";import{Button as a}from"../button/Button.js";import{Input as d}from"../input/Input.js";import{StyledModal as u}from"../modals/styledModal.js";import{Spinner as h}from"../spinner/Spinner.js";import{Tag as p}from"../tag/Tag.js";import{CollectionsScreen as m}from"./collectionScreen.js";import{ProductInfoOverlay as C}from"./productInfoOverlay.js";import{ProductsScreen as g}from"./productScreen.js";import{RearrangeScreen as f}from"./rearrangeScreen.js";import{collectionsReducer as b,selectedColectionsReducer as S,CollectionIdContext as y}from"./reducers.js";import{SearchScreen as P}from"./searchScreen.js";import{SelectedScreen as v}from"./selectedScreen.js";import{ContainerStyle as j,ScrollContainerStyle as k}from"./style.js";import{OUT_OF_STOCK_ACTION as x}from"./type.js";import{useFetchFbStatusForCollections as I}from"./useFetchFbStatus.js";var F;!function(e){e.Collections="collections",e.RearrangeProducts="rearrange",e.SelectedProducts="view",e.SearchProducts="searchProducts",e.Products="products"}(F||(F={}));const T=T=>{const{storeId:O,selectedItems:D,onClose:R,visible:w,zIndex:E,minlimit:A,limit:V,hideCollectionCheckbox:B,hideProductCheckbox:M,outOfStockAction:L=x.BLUR,hideVariantCheckbox:$,selectProductsFromCustomCollection:z,hideSelectionCount:G,title:H,width:W,renderWithoutModal:K,onClickSave:U,pickerType:Y,hideProductVariants:q=!1,startupScreen:J=F.Collections,rearrangeEnabled:N,showProductDetailInfoIcon:Q}=T,[X,Z]=r(b,{}),[_,ee]=s([F.Collections,F.RearrangeProducts].includes(J)?J:F.Collections),[te,oe]=s("grid"),[ce,re]=s(""),[se,ie]=s(""),[ne,le]=s(0),[ae,de]=s(!1),[ue,he]=s(0),[pe,me]=s(""),[Ce,ge]=s(!1),[fe,be]=s(!1),[Se,ye]=s(),[Pe,ve]=r(S,Object.keys(D).length>0?D:{}),je=i(null),[ke,xe]=s(!1),[Ie,Fe]=s(),{fetchFbStatus:Te}=I(Pe,O,ve,T.fbStatusFetcher,!1);n((()=>{de(!0),be(!0),T.collectionFetcher(ne,O).then((e=>{Z({type:"fetched",data:(null==e?void 0:e.collections)||{}}),de(!1),le((e=>e+1)),be(!1)})).catch()}),[]),n((()=>{let e=0;Object.keys(Pe||[]).forEach((t=>{var o;Object.keys((null===(o=Pe[t])||void 0===o?void 0:o.products)||[]).forEach((o=>{var c,r;Object.keys((null===(r=null===(c=Pe[t].products)||void 0===c?void 0:c[o])||void 0===r?void 0:r.variants)||[]).forEach((()=>{e+=1}))}))})),he(e)})),n((()=>{}),[ce]),n((()=>{se&&(de(!0),T.productFetcher(se,O).then((e=>{Object.keys(e).length&&Z({type:"productsFetched",data:{collectionId:se,products:e}}),de(!1)})).catch())}),[se]),n((()=>{Te()}),[Pe]),n((()=>{const e=setTimeout((()=>{"rearrange"!==_&&(pe.length?(ge(!0),T.searchFetcher(O,pe).then((e=>{ye(Object.assign({},e)),ee("searchProducts"),de(!1),ge(!1)}))):ee("collections"))}),800);return()=>clearTimeout(e)}),[pe]),n((()=>{U&&(T.onAdd(Pe,ue),Oe())}),[U]);const Oe=()=>{ve({type:"reset",data:{}})},De=e(j,{children:[T.postHeader&&t("div",Object.assign({style:{padding:"0 24px"}},{children:T.postHeader})),!T.hideGlobalSearch&&t(o,{children:("collections"===_||"searchProducts"===_)&&t("div",Object.assign({style:{padding:K?"8px 16px":"12px 24px",borderBottom:"1px solid #E0E0E0"}},{children:t(d,{noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>Ce?t(h,{size:"small",color:l.content.primary}):t(c,{})},id:"listInput",height:"24px",type:"text",value:pe,onChangeText:e=>{e.length&&e.trim().length?me(e):me("")}})}))}),e(k,Object.assign({ref:je},{children:["collections"===_&&t(m,{customCollectionRestriction:T.customCollectionRestriction,dataLoading:fe,collections:X,selectedCollectionsDispatch:ve,setCollectionId:re,setSelectedCollectionId:ie,setScreen:ee,selectedCollections:Pe,collectionFetcher:T.collectionFetcher,storeId:O,collectionsDispatch:Z,setSaveDisabled:de,pagingControls:{curPage:ne,setCurPage:le},hideCollectionCheckbox:B,renderWithoutModal:K,pickerType:Y}),"products"===_&&ce&&t(y.Provider,Object.assign({value:ce},{children:t(g,{hideInCollectionSearch:T.hideInCollectionSearch,customCollectionRestriction:T.customCollectionRestriction,productFetcher:T.productFetcher,setScreen:ee,storeId:O,data:X[ce],collectionsDispatch:Z,selectedCollectionsDispatch:ve,selectedData:Pe,setSaveDisabled:de,searchInCollectionFetcher:T.searchInCollectionFetcher,hideProductCheckbox:M,outOfStockAction:L,hideVariantCheckbox:$,selectProductsFromCustomCollection:z,renderWithoutModal:K,pickerType:Y,hideProductVariants:q,fbStatusFetcher:T.fbStatusFetcher,onInfoIconClick:e=>{xe(!0),Fe(e)},showProductDetailInfoIcon:Q})})),"view"===_&&t(v,{selectedCollections:Pe||{},selectedCollectionsDispatch:ve,setScreen:ee,collections:X,outOfStockAction:L,storeId:O,fbStatusFetcher:T.fbStatusFetcher}),"rearrange"===_&&t(f,{selectedCollections:Pe||{},selectedCollectionsDispatch:ve,setScreen:ee,outOfStockAction:L,rearrangeViewType:"grid"===te?"list":"grid",scrollContainerRef:je,storeId:O,fbStatusFetcher:T.fbStatusFetcher}),"searchProducts"===_&&t(P,{customCollectionRestriction:T.customCollectionRestriction,selectedCollections:Pe||{},searchedCollections:Se||{},setSearchedCollections:ye,selectedCollectionsDispatch:ve,setScreen:ee,collections:X,onBackPress:()=>{me(""),ye({})},pickerType:Y,hideProductCheckbox:M,hideProductVariants:q,hideVariantCheckbox:$,storeId:O,fbStatusFetcher:T.fbStatusFetcher})]}))]});return t(o,{children:K?De:e(u,Object.assign({zIndex:E,open:w,onClose:()=>{null==R||R(),Oe()},headingTitle:H||("collections"===_||"products"===_?"Select Products":"view"===_?"Selected Products":"searchProducts"===_?"Searched Products":"rearrange"===_?"Rearrange Products":void 0),footerShadow:!0,centralContainerStyles:{width:W||"600px"},headerRightCustomElement:"rearrange"===_?(console.log("ignore:",oe),t(o,{})):t(o,{}),primaryButton:{buttonText:ae?"Loading...":_===F.RearrangeProducts?"Done":"Add",disabled:ae||ue<1||A&&ue<A||V&&ue>V||!1,onClick:()=>{T.onAdd(Pe,ue),Oe()}},footerLeftCustomElement:G?t(o,{}):A&&ue<A?t(p,{tagText:`Minimum limit is ${A} products`,type:"negative"}):V&&ue>V?t(p,{tagText:`You can only select ${V} products`,type:"negative"}):t(a,ue>0?{onClick:()=>{ee(N?F.RearrangeProducts:F.SelectedProducts)},buttonText:`${ue} products selected`,buttonType:["rearrange","view"].includes(_)?"tertiaryGray":"tertiary",disabled:["rearrange","view"].includes(_)}:{disabled:!0,buttonText:`${ue} products selected`,buttonType:"tertiaryGray"}),hideCrossButton:ke},{children:[De,ke&&Ie?t(C,{productData:Ie,outOfStockAction:L,onClose:()=>{xe(!1)}}):t(o,{})]}))})};export{T as ProductPickerModal,F as ScreenName};

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

@@ -0,0 +1,11 @@
+import { Product, ProductVariant } from './modal';
+import { OUT_OF_STOCK_ACTION } from './type';
+export declare const ProductInfoOverlay: (props: {
+    productData: Product | ProductVariant;
+    onClose: () => void;
+    outOfStockAction?: OUT_OF_STOCK_ACTION;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const ProductInfoCard: (props: {
+    productData: Product | ProductVariant;
+    outOfStockAction?: OUT_OF_STOCK_ACTION;
+}) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,39 @@
+import{jsxs as o,jsx as t}from"react/jsx-runtime";import i from"styled-components";import{COLORS as r}from"../../constants/Theme.js";import e from"../../assets/icons/cross.svg.js";import{IconButton as a}from"../icon-button/IconButton.js";import{ShimmerImage as d}from"../shimmer-image/ShimmerImage.js";import{TitleSmall as n,BodyCaption as c}from"../TypographyStyle.js";import{ProductPickerTag as s}from"./ProductPickerTag.js";const l=i=>o(m,{children:[t(u,{}),t(x,{children:t(a,{className:"close-button",onClick:i.onClose,Icon:e,width:20,height:20})}),t(p,{productData:i.productData,outOfStockAction:i.outOfStockAction})]}),p=i=>{var r;console.log("vj: product data",i);const e=void 0===i.productData.variants;return o(f,{children:[t(g,{children:t(d,{imageUrl:i.productData.image,width:"200px",height:200,borderRadius:4})}),o(h,{children:[t(n,Object.assign({style:{display:"flex"}},{children:i.productData.name})),t(c,{style:{display:"flex",flexDirection:"column"},dangerouslySetInnerHTML:{__html:null!==(r=i.productData.description)&&void 0!==r?r:""}}),t(s,{isVariant:e,data:i.productData,outOfStockAction:i.outOfStockAction})]})]})},m=i.div`
+	display: flex;
+	flex: 1;
+	background: rgba(0, 0, 0, 0.5);
+	flex-direction: column;
+	width: 100%;
+	height: 100%;
+	position: absolute;
+	bottom: 0;
+	z-index: 10;
+`,u=i.div`
+	display: flex;
+	flex: 1;
+	background: rgba(0, 0, 0, 0.5);
+`,x=i.div`
+	position: relative;
+
+	.close-button {
+		position: absolute;
+		top: -50px;
+		right: 0px;
+		margin: 10px;
+		background: ${r.surface.standard};
+		border-radius: 50%;
+	}
+`,f=i.div`
+	display: flex;
+	background: white;
+	padding: 24px;
+	gap: 24px;
+	border-radius: 8px 8px 0px 0px;
+`,g=i.div`
+	display: flex;
+`,h=i.div`
+	display: flex;
+	flex: 1;
+	flex-direction: column;
+	gap: 10px;
+`;export{p as ProductInfoCard,l as ProductInfoOverlay};

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Collection, Product, ProductFetcherReturn, ProductVariant, SelectedItems } from '.';
+import { Collection, FbStatusFetcherReturn, Product, ProductFetcherReturn, ProductVariant, SelectedItems } from '.';
 import { CollectionsActions, SelectedCollectionsActions } from './reducers';
 import { OUT_OF_STOCK_ACTION } from './type';
 interface ProductsScreenInterface {
@@ -9,8 +9,8 @@ interface ProductsScreenInterface {
     collectionsDispatch: React.Dispatch<CollectionsActions>;
     selectedData: SelectedItems;
     selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
-    searchInCollectionFetcher: (storeId: string, collectionId: string, query: string) => Promise<string[]>;
-    productFetcher: (collectionId: string, storeId: string) => ProductFetcherReturn;
+    searchInCollectionFetcher: (storeId: string, collectionId: string, query: string) => ProductFetcherReturn;
+    productFetcher: (collectionId: string, storeId: string, limit?: number, offset?: number) => ProductFetcherReturn;
     storeId: string;
     setScreen: React.Dispatch<React.SetStateAction<string>>;
     setSaveDisabled: React.Dispatch<React.SetStateAction<boolean>>;
@@ -21,6 +21,9 @@ interface ProductsScreenInterface {
     renderWithoutModal?: boolean;
     pickerType?: 'COLLECTION' | 'PRODUCT';
     hideProductVariants?: boolean;
+    showProductDetailInfoIcon?: boolean;
+    fbStatusFetcher?: (storeId: string, variantIds: string[]) => FbStatusFetcherReturn;
+    onInfoIconClick: (productData: Product | ProductVariant) => void;
 }
 export declare const ProductsScreen: (props: ProductsScreenInterface) => import("react/jsx-runtime").JSX.Element;
 interface ProductGroupInterface {
@@ -36,7 +39,9 @@ interface ProductGroupInterface {
     outOfStockAction?: OUT_OF_STOCK_ACTION;
     hideVariantCheckbox?: boolean;
     hideProductVariants?: boolean;
+    showProductDetailInfoIcon?: boolean;
     pickerType?: 'COLLECTION' | 'PRODUCT';
+    onInfoIconClick?: (productData: Product | ProductVariant) => void;
 }
 export declare const ProductGroup: (props: ProductGroupInterface) => import("react/jsx-runtime").JSX.Element;
 interface ProductCardInterface {
@@ -54,7 +59,9 @@ interface ProductCardInterface {
     outOfStockAction?: OUT_OF_STOCK_ACTION;
     hideVariantCheckbox?: boolean;
     hideProductVariants?: boolean;
+    showProductDetailInfoIcon?: boolean;
     pickerType?: 'COLLECTION' | 'PRODUCT';
+    onInfoIconClick?: (productData: Product | ProductVariant) => void;
 }
 export declare const ProductCard: (props: ProductCardInterface) => import("react/jsx-runtime").JSX.Element;
 export {};

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 o,Fragment as e}from"react/jsx-runtime";import i from"../../assets/icons/arrow_left.svg.js";import n from"../../assets/icons/box.svg.js";import c from"../../assets/icons/search.svg.js";import{cloneDeep as l}from"lodash";import{useContext as s,useRef as d,useState as r,useEffect as a}from"react";import{COLORS as u}from"../../constants/Theme.js";import v from"../../assets/icons/info.svg.js";import{CheckBox as h}from"../checkBox/CheckBox.js";import{IconButton as p}from"../icon-button/IconButton.js";import{Input as g}from"../input/Input.js";import{BikShimmer as f}from"../shimmer/ShimmerComponent/BikShimmer.js";import{ShimmerImage as b}from"../shimmer-image/ShimmerImage.js";import{Spinner as j}from"../spinner/Spinner.js";import{Tooltip as m}from"../tooltips/Tooltip.js";import{BodyCaption as y,TitleRegular as k,BodyPrimary as I}from"../TypographyStyle.js";import{EmptyState as O}from"./emptyState.js";import{ProductPickerTag as C}from"./ProductPickerTag.js";import{CollectionIdContext as P}from"./reducers.js";import{ProductScreenHeader as S,ProductScreenCollectionCardStyle as x,ProductCardStyle as E}from"./style.js";import{OUT_OF_STOCK_ACTION as D}from"./type.js";import{liftTheStateUp as V}from"./utility.js";const w=e=>{const{data:v,collectionsDispatch:b,selectedData:m,selectedCollectionsDispatch:I,productFetcher:C,storeId:E,setScreen:w,setSaveDisabled:T,hideInCollectionSearch:F,customCollectionRestriction:R,hideProductCheckbox:B,outOfStockAction:U=D.BLUR,hideVariantCheckbox:L=!1,selectProductsFromCustomCollection:H=!1,pickerType:J,hideProductVariants:W,fbStatusFetcher:z,onInfoIconClick:K,showProductDetailInfoIcon:M}=e,N=s(P),_=d(null),q=d(0),[G,Q]=r(!1),[X,Y]=r(""),[Z,$]=r(!1),[tt,ot]=r(v),et=d(!1);a((()=>{const t=setTimeout((()=>{X.length?($(!0),e.searchInCollectionFetcher(E,N,X).then((t=>{const o=l(v);o.products=t,ot(o);const e=ct(null!=t?t:{},!0);lt(e,null!=t?t:{},!0),T(!1),$(!1)}))):ot(v)}),800);return()=>clearTimeout(t)}),[X]),a((()=>{var t,o,e,i,n,c,l,s;console.log("vj: collectionId change before",v,v.products,null===(o=Object.keys(null!==(t=v.products)&&void 0!==t?t:{}))||void 0===o?void 0:o.length,et),et.current=!1,q.current=Math.floor((null===(i=Object.keys(null!==(e=v.products)&&void 0!==e?e:{}))||void 0===i?void 0:i.length)/10);const d=ct(null!==(n=v.products)&&void 0!==n?n:{});lt(d,null!==(c=v.products)&&void 0!==c?c:{}),console.log("vj: collectionId change after",v,v.products,null===(s=Object.keys(null!==(l=v.products)&&void 0!==l?l:{}))||void 0===s?void 0:s.length,et)}),[N]);const it=!!R&&v.isSmartCollection,nt=t=>{var o,e,i,n,c,l,s,d;let r=0,a=0;return!!((null===(e=null===(o=null==m?void 0:m[N])||void 0===o?void 0:o.products)||void 0===e?void 0:e[t])&&(null===(c=Object.keys((null===(n=null===(i=null==v?void 0:v.products)||void 0===i?void 0:i[t])||void 0===n?void 0:n.variants)||[]))||void 0===c||c.forEach((()=>a++)),Object.keys((null===(d=null===(s=null===(l=null==m?void 0:m[N])||void 0===l?void 0:l.products)||void 0===s?void 0:s[t])||void 0===d?void 0:d.variants)||[]).forEach((()=>r++)),r>0&&a!==r))};a((()=>{(null==v?void 0:v.products)||st(10)}),[]);const ct=(t,o)=>{const e=[];return console.log("vj: getVariantIdsForFbStatusFetch",t),Object.keys(null!=t?t:{}).forEach((i=>{var n,c;const l=null!==(c=null===(n=null==t?void 0:t[i])||void 0===n?void 0:n.variants)&&void 0!==c?c:{};Object.keys(l).forEach((n=>{var c,l,s,d,r;let a;a=o?null===(l=null===(c=null==t?void 0:t[i])||void 0===c?void 0:c.variants)||void 0===l?void 0:l[n]:null===(r=null===(d=null===(s=null==v?void 0:v.products)||void 0===s?void 0:s[i])||void 0===d?void 0:d.variants)||void 0===r?void 0:r[n],console.log("vj: variant fb status",{data:v,variant:a}),(null==a?void 0:a.fbStatus)||e.push(n)}))})),console.log("vj: getVariantIdsForFbStatusFetch returning",e),e},lt=(t,o,e)=>{if(console.log("fetchFbStatusAndDispatchProducts",{variantIdsToFetchFbStatus:t,fbStatusFetcher:z}),!z){const t=Object.assign({},o);if(Object.keys(o).forEach((e=>{var i,n,c;console.log("vj: response variants",null===(i=null==o?void 0:o[e])||void 0===i?void 0:i.variants),Object.keys(null!==(c=null===(n=null==o?void 0:o[e])||void 0===n?void 0:n.variants)&&void 0!==c?c:{}).forEach((i=>{var n,c;const l=null===(n=null==o?void 0:o[e].variants)||void 0===n?void 0:n[i];l&&(l.fbStatus="APPROVED");const s=null===(c=null==t?void 0:t[e])||void 0===c?void 0:c.variants;s&&s[i]&&(s[i]=l)}))})),console.log("vj: fetchFbStatusAndDispatchProducts updated Products",t),e){const o=Object.assign({},tt);o.products=t,ot(o)}else b({type:"productsPaged",data:{collectionId:N,products:t}})}t.length>0&&z&&z(E,t).then((t=>{console.log("vj: response",{response:t,products:o});const i=Object.assign({},o);if(Object.keys(o).forEach((e=>{var n,c,l;console.log("vj: response variants",null===(n=null==o?void 0:o[e])||void 0===n?void 0:n.variants),Object.keys(null!==(l=null===(c=null==o?void 0:o[e])||void 0===c?void 0:c.variants)&&void 0!==l?l:{}).forEach((n=>{var c,l;const s=null===(c=null==o?void 0:o[e].variants)||void 0===c?void 0:c[n];console.log("vj: v",{v:s,vId:n,status:t[n],response:t}),s&&"REJECTED"===t[n]?s.fbStatus="REJECTED":s&&"APPROVED"===t[n]&&(s.fbStatus="APPROVED");const d=null===(l=null==i?void 0:i[e])||void 0===l?void 0:l.variants;d&&d[n]&&(d[n]=s)}))})),console.log("vj: updated Products",i),e){const t=Object.assign({},tt);t.products=i,ot(t)}else b({type:"productsPaged",data:{collectionId:N,products:i}})})).catch((t=>{const i=Object.assign({},o);if(Object.keys(o).forEach((t=>{var e,n,c;console.log("vj: response variants",null===(e=null==o?void 0:o[t])||void 0===e?void 0:e.variants),Object.keys(null!==(c=null===(n=null==o?void 0:o[t])||void 0===n?void 0:n.variants)&&void 0!==c?c:{}).forEach((e=>{var n,c;const l=null===(n=null==o?void 0:o[t].variants)||void 0===n?void 0:n[e];l&&(l.fbStatus="APPROVED");const s=null===(c=null==i?void 0:i[t])||void 0===c?void 0:c.variants;s&&s[e]&&(s[e]=l)}))})),console.log("vj: fetchFbStatusAndDispatchProducts updated Products",i),e){const t=Object.assign({},tt);t.products=i,ot(t)}else b({type:"productsPaged",data:{collectionId:N,products:i}})}))};a((()=>{console.log("vj: observertarget",_.current);const t=new IntersectionObserver((t=>{console.log("vj: observertargetinside",t),t[0].isIntersecting&&(console.log("vj: nextPageRef",q.current,et),q.current>=0&&!et.current&&(T(!0),Q(!0),C(N,E,10,q.current).then((t=>{if(console.log("vj: fetched products",t,et,Object.keys(t).length),Object.keys(t).length||(console.log("vj: setHasAllCollectionLoaded ",!0),et.current=!0),Object.keys(t).length){const o=tt;o.products=Object.assign(Object.assign({},tt.products),t),ot(o);const e=ct(t);lt(e,t),q.current+=1}Q(!1),T(!1)})).catch()))}),{threshold:1});return _.current&&t.observe(_.current),()=>{_.current&&t.unobserve(_.current)}}),[_]);const st=t=>{console.log("vj: getProductsForCollection"),T(!0),$(!0),C(N,E,t,0).then((o=>{if(Object.keys(o).length||(console.log("vj: setHasAllCollectionLoaded ",!0),et.current=!0),Object.keys(o).length){ot(Object.assign(Object.assign({},tt),{products:o})),console.log("vj: next page when products loaded",q.current);const t=ct(o);lt(t,o),q.current=1}console.log("vj: product data",{productData:o,limit:t,data:v}),t||I({type:"selected",data:{id:N,val:Object.assign(Object.assign({},v),{products:o})}}),T(!1),$(!1)})).catch()},dt=(t,o)=>{const e=V(o,v);I({type:t,data:Object.assign(Object.assign({},e),{isRestricted:R})})};return t("div",{children:[t(S,{children:[o(p,{Icon:i,height:16,onClick:()=>{w("collections")}}),o(y,Object.assign({style:{color:u.content.secondary}},{children:v.name}))]}),!F&&o("div",Object.assign({style:{padding:16,height:"76px",borderBottom:"1px solid #E0E0E0"}},{children:o(g,{noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>Z&&X.length?o(j,{size:"small",color:u.content.primary}):o(c,{})},id:"listInput",height:"24px",type:"text",value:X,onChangeText:t=>{t.length&&t.trim().length?Y(t):Y("")},placeholder:"Search products in this collection..."})})),t("div",{children:[Object.keys((null==tt?void 0:tt.products)||[]).length>0&&!it&&!X.length&&!B&&"-1"!==N&&t(x,{children:[o(h,{isChecked:!!(null==m?void 0:m[N]),isPartiallyChecked:(t=>{var o;let e=0,i=0;if(m[t]){const n=null==v?void 0:v.products;n&&Object.keys(n).forEach((t=>{var o;const i=null===(o=n[t])||void 0===o?void 0:o.variants;i&&Object.keys(i).forEach((t=>e+=1))}));const c=null===(o=m[t])||void 0===o?void 0:o.products;return c&&Object.keys(c).forEach((t=>{var o;const e=null===(o=c[t])||void 0===o?void 0:o.variants;e&&Object.keys(e).forEach((()=>i+=1))})),i>0&&e!==i}return!1})(N),onValueChange:function(t){t?st():I({type:"unselected",data:{id:N}})}}),o("div",Object.assign({style:{width:40,height:40}},{children:o(n,{})})),o(k,{children:"All Products"})]}),Object.keys((null==tt?void 0:tt.products)||[]).length?Object.keys(tt.products||[]).map((t=>o(A,{outOfStockAction:U,collectionId:N,isProductPartiallyChecked:nt(t),productId:t,data:tt.products[t],selectedData:m,selectedCollectionsDispatch:I,viewOnly:!H&&!!it,upliftAdditions:dt,hideProductCheckbox:B,hideVariantCheckbox:L,hideProductVariants:W,pickerType:J,onInfoIconClick:K,showProductDetailInfoIcon:M},t))):Z?[1,2,3,4,5,6,7,8,9,10].map(((t,e)=>o("div",Object.assign({style:{borderBottom:"1px solid #E0E0E0"}},{children:o(f,{boxes:[{height:"64px",width:"100%",marginTop:"0px"}]})}),e))):o(O,{title:"No products to show",subtitle:X.length?"We couldn't find the product you were looking for":"We couldn’t find any product in this collection."}),o("div",{ref:_})]}),G&&[1,2,3,4,5].map(((t,e)=>o("div",Object.assign({style:{borderBottom:"1px solid #E0E0E0"}},{children:o(f,{boxes:[{height:"64px",width:"100%",marginTop:"0px"}]})}),e)))]})},A=e=>{const{collectionId:i,productId:n,data:c,selectedData:l,selectedCollectionsDispatch:s,viewOnly:d,upliftAdditions:r,isProductPartiallyChecked:a,hideProductCheckbox:u,outOfStockAction:v,hideVariantCheckbox:h,hideProductVariants:p,pickerType:g,onInfoIconClick:f,showProductDetailInfoIcon:b}=e,j=t=>{var o,e,c,s,d,r;if(!(null===(e=null===(o=null==l?void 0:l[i])||void 0===o?void 0:o.products)||void 0===e?void 0:e[n]))return!1;return!!(null===(r=null===(d=null===(s=null===(c=null==l?void 0:l[i])||void 0===c?void 0:c.products)||void 0===s?void 0:s[n])||void 0===d?void 0:d.variants)||void 0===r?void 0:r[t])};return t("div",{children:[o(T,{isVariant:!1,data:c,productId:n,collectionId:i,isSelected:!!(null===(y=null===(m=null==l?void 0:l[i])||void 0===m?void 0:m.products)||void 0===y?void 0:y[n]),isPartiallyChecked:a,selectedCollectionsDispatch:s,upliftAdditions:r,viewOnly:d,hideProductCheckbox:u,hideVariantCheckbox:h,hideProductVariants:p,pickerType:g,outOfStockAction:v,onInfoIconClick:f,showProductDetailInfoIcon:b},n),p?null:Object.keys(c.variants||[]).length>1&&Object.keys(c.variants||[]).map((t=>o(T,{isVariant:!0,hideVariantCheckbox:h,data:c.variants[t],variantId:t,productId:n,viewOnly:d,upliftAdditions:r,collectionId:i,isSelected:j(t),selectedCollectionsDispatch:s,outOfStockAction:v,onInfoIconClick:f,showProductDetailInfoIcon:b},t)))]});var m,y},T=i=>{const{isVariant:n,data:c,productId:l,collectionId:s,variantId:d,isSelected:r,selectedCollectionsDispatch:a,viewOnly:g,upliftAdditions:f,isPartiallyChecked:j,hideProductCheckbox:y,outOfStockAction:k,hideVariantCheckbox:O,hideProductVariants:P,pickerType:S,onInfoIconClick:x,showProductDetailInfoIcon:D}=i;return t(E,Object.assign({isVariant:n,onClick:t=>{"PRODUCT"===S&&P&&(t.stopPropagation(),a({type:"reset",data:{}}),f("variantSelected",{productId:l,variantId:d||Object.keys(c.variants)[0],collectionId:s,variant:c}))},isActive:r},{children:[n&&!g&&!O||!n&&!g&&!y?o(h,{isChecked:r,isPartiallyChecked:j||!1,onValueChange:function(t){n?t?f("variantSelected",{productId:l,variantId:d,collectionId:s,variant:c}):a({type:"variantUnselected",data:{productId:l,variantId:d,collectionId:s}}):t?f("productSelected",{productId:l,collectionId:s,product:c}):a({type:"productUnselected",data:{productId:l,collectionId:s}})}}):o(e,{}),o("div",{children:o(b,{width:40,height:40,imageUrl:c.image,alt:"Item",borderRadius:4})}),o(m,Object.assign({variant:"light",body:c.name,placement:"bottom",delay:400},{children:t("div",Object.assign({style:{display:"flex",flexDirection:"column",flex:1}},{children:[t("div",Object.assign({style:{display:"flex",alignItems:"center",justifyContent:"space-between"}},{children:[o(I,Object.assign({numberOfLines:1},{children:c.name})),D&&o(p,{onClick:()=>{null==x||x(c)},Icon:()=>o(v,{width:20,height:20,color:u.content.placeholder})})]})),o(C,{isVariant:n,data:c,outOfStockAction:k})]}))}))]}))};export{T as ProductCard,A as ProductGroup,w as ProductsScreen};

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { SelectedItems } from '.';
+import { FbStatusFetcherReturn, SelectedItems } from '.';
 import { SelectedCollectionsActions } from './reducers';
 import { OUT_OF_STOCK_ACTION } from './type';
 interface RearrangeScreenInterface {
@@ -9,6 +9,8 @@ interface RearrangeScreenInterface {
     rearrangeViewType: 'grid' | 'list';
     outOfStockAction?: OUT_OF_STOCK_ACTION;
     scrollContainerRef: React.RefObject<HTMLDivElement>;
+    storeId: string;
+    fbStatusFetcher?: (storeId: string, variantIds: string[]) => FbStatusFetcherReturn;
 }
 /**
  * Screen will be opened on two conditions -

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

@@ -1 +1 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import o from"../../assets/icons/arrow_left.svg.js";import{useState as r,useEffect as s}from"react";import{DragDropContext as c}from"react-beautiful-dnd";import{COLORS as n}from"../../constants/Theme.js";import{IconButton as i}from"../icon-button/IconButton.js";import{BodyCaption as l}from"../TypographyStyle.js";import{EmptyState as a}from"./emptyState.js";import{parseSelectedVariantsToArray as d}from"./helpers/ProductHelper.js";import{SelectedScreenHeader as p}from"./style.js";import{VariantsList as m,VariantsGrid as f}from"./variantComponents.js";const u=u=>{const{selectedCollections:h,selectedCollectionsDispatch:j,setScreen:y,rearrangeViewType:S,outOfStockAction:g,scrollContainerRef:C}=u,[b,O]=r(d(h));s((()=>{var e;null===(e=null==C?void 0:C.current)||void 0===e||e.scrollTo({top:0}),O(d(h))}),[h]);return e(c,Object.assign({onDragEnd:e=>{if(!e.destination)return;const t=b,[o]=t.splice(e.source.index,1);t.splice(e.destination.index,0,o),t.forEach(((e,t)=>{e.displayOrder=t})),O(t)}},{children:[e(p,{children:[t(i,{Icon:o,width:16,height:16,color:n.content.secondary,onClick:()=>{y("collections")}}),t(l,Object.assign({color:n.content.secondary},{children:"All Products"}))]}),Object.keys(h).length>0?"list"===S?t(m,{selectedVariants:b,setSelectedVariants:O,selectedCollectionsDispatch:j,outOfStockAction:g}):t(f,{selectedVariants:b,setSelectedVariants:O,selectedCollectionsDispatch:j}):t(a,{title:"No Products Selected",subtitle:"Selected products will appear here"})]}))};export{u as RearrangeScreen};
+import{jsxs as t,jsx as e}from"react/jsx-runtime";import o from"../../assets/icons/arrow_left.svg.js";import{useState as r,useEffect as s}from"react";import{DragDropContext as c}from"react-beautiful-dnd";import{COLORS as i}from"../../constants/Theme.js";import{IconButton as n}from"../icon-button/IconButton.js";import{BodyCaption as l}from"../TypographyStyle.js";import{EmptyState as a}from"./emptyState.js";import{parseSelectedVariantsToArray as d}from"./helpers/ProductHelper.js";import{SelectedScreenHeader as p}from"./style.js";import{useFetchFbStatusForCollections as m}from"./useFetchFbStatus.js";import{VariantsList as u,VariantsGrid as f}from"./variantComponents.js";const h=h=>{const{selectedCollections:j,selectedCollectionsDispatch:S,setScreen:y,rearrangeViewType:b,outOfStockAction:g,scrollContainerRef:C,storeId:O,fbStatusFetcher:v}=h,[V,k]=r(d(j)),{fetchFbStatus:w}=m(j,O,S,v,!1);s((()=>{var t;null===(t=null==C?void 0:C.current)||void 0===t||t.scrollTo({top:0}),w(),k(d(j))}),[j]);return t(c,Object.assign({onDragEnd:t=>{if(!t.destination)return;const e=V,[o]=e.splice(t.source.index,1);e.splice(t.destination.index,0,o),e.forEach(((t,e)=>{t.displayOrder=e})),k(e)}},{children:[t(p,{children:[e(n,{Icon:o,width:16,height:16,color:i.content.secondary,onClick:()=>{y("collections")}}),e(l,Object.assign({color:i.content.secondary},{children:"All Products"}))]}),Object.keys(j).length>0?"list"===b?e(u,{selectedVariants:V,setSelectedVariants:k,selectedCollectionsDispatch:S,outOfStockAction:g}):e(f,{selectedVariants:V,setSelectedVariants:k,selectedCollectionsDispatch:S}):e(a,{title:"No Products Selected",subtitle:"Selected products will appear here"})]}))};export{h as RearrangeScreen};

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

@@ -1 +1 @@
-import{cloneDeep as t}from"lodash";import{createContext as a}from"react";function d(a,d){var e,o,c,s,r,l;let i={},u="",n="",p="";switch(d.type){case"selected":return i=t(a),d.data.val.isSmartCollection&&(d.data.isRestricted&&(i={}),i.isCustom=!0),i[d.data.id]=d.data.val,i;case"unselected":return i=t(a),(null==i?void 0:i.isCustom)&&(i.isCustom=!1),delete i[d.data.id],i;case"productUnselected":return i=t(a),u=d.data.productId,n=d.data.collectionId,delete i[n].products[u],Object.keys(i[n].products).length||((null==i?void 0:i.isCustom)&&(i.isCustom=!1),delete i[n]),i;case"productSelected":return i=t(a),u=d.data.productId,n=d.data.collectionId,(null===(e=d.data.catalogOnlyData)||void 0===e?void 0:e.isSmartCollection)&&(d.data.isRestricted&&(i={}),i.isCustom=!0),(null==i?void 0:i[n])||(i[n]=d.data.catalogOnlyData,i[n].products={}),i[n].products[u]=d.data.product,i;case"variantSelected":return i=t(a),u=d.data.productId,n=d.data.collectionId,p=d.data.variantId,(null===(o=d.data.catalogOnlyData)||void 0===o?void 0:o.isSmartCollection)&&(d.data.isRestricted&&(i={}),i.isCustom=!0),(null==i?void 0:i[n])||(i[n]=d.data.catalogOnlyData,i[n].products={},i[n].products[u]=d.data.productOnlyData,i[n].products[u].variants={}),(null===(s=null===(c=null==i?void 0:i[n])||void 0===c?void 0:c.products)||void 0===s?void 0:s[u])||((null===(r=null==i?void 0:i[n])||void 0===r?void 0:r.products)||(i[n].products={}),i[n].products[u]=d.data.productOnlyData,i[n].products[u].variants={}),i[n].products[u].variants[p]=d.data.variant,i;case"variantUnselected":return i=t(a),u=d.data.productId,n=d.data.collectionId,p=d.data.variantId,delete i[n].products[u].variants[p],Object.keys(i[n].products[u].variants).length||(delete i[n].products[u],Object.keys(i[n].products).length||((null===(l=i[n])||void 0===l?void 0:l.isSmartCollection)&&(i.isCustom=!1),delete i[n])),i;case"reset":return{};default:return a}}function e(t,a){let d={};switch(a.type){case"fetched":return d=Object.assign({},a.data),d;case"productsFetched":return d=Object.assign({},t),d[a.data.collectionId].products=a.data.products,d;case"paged":return d=Object.assign(Object.assign({},t),a.data),d;default:return{}}}const o=a("");export{o as CollectionIdContext,e as collectionsReducer,d as selectedColectionsReducer};
+import{cloneDeep as t}from"lodash";import{createContext as a}from"react";function e(a,e){var o,d,c,s,l,r;let n={},i="",u="",p="";switch(console.log("vj: selected Items",a),e.type){case"selected":return console.log("vj: selectedColectionsReducer selected",e),n=t(a),e.data.val.isSmartCollection&&(e.data.isRestricted&&(n={}),n.isCustom=!0),n[e.data.id]=e.data.val,n;case"unselected":return n=t(a),(null==n?void 0:n.isCustom)&&(n.isCustom=!1),delete n[e.data.id],n;case"productUnselected":return n=t(a),i=e.data.productId,u=e.data.collectionId,delete n[u].products[i],Object.keys(n[u].products).length||((null==n?void 0:n.isCustom)&&(n.isCustom=!1),delete n[u]),n;case"productSelected":return n=t(a),i=e.data.productId,u=e.data.collectionId,(null===(o=e.data.catalogOnlyData)||void 0===o?void 0:o.isSmartCollection)&&(e.data.isRestricted&&(n={}),n.isCustom=!0),(null==n?void 0:n[u])||(n[u]=e.data.catalogOnlyData,n[u].products={}),n[u].products[i]=e.data.product,n;case"variantSelected":return n=t(a),i=e.data.productId,u=e.data.collectionId,p=e.data.variantId,(null===(d=e.data.catalogOnlyData)||void 0===d?void 0:d.isSmartCollection)&&(e.data.isRestricted&&(n={}),n.isCustom=!0),(null==n?void 0:n[u])||(n[u]=e.data.catalogOnlyData,n[u].products={},n[u].products[i]=e.data.productOnlyData,n[u].products[i].variants={}),(null===(s=null===(c=null==n?void 0:n[u])||void 0===c?void 0:c.products)||void 0===s?void 0:s[i])||((null===(l=null==n?void 0:n[u])||void 0===l?void 0:l.products)||(n[u].products={}),n[u].products[i]=e.data.productOnlyData,n[u].products[i].variants={}),n[u].products[i].variants[p]=e.data.variant,n;case"variantUnselected":return n=t(a),i=e.data.productId,u=e.data.collectionId,p=e.data.variantId,delete n[u].products[i].variants[p],Object.keys(n[u].products[i].variants).length||(delete n[u].products[i],Object.keys(n[u].products).length||((null===(r=n[u])||void 0===r?void 0:r.isSmartCollection)&&(n.isCustom=!1),delete n[u])),n;case"reset":return{};default:return a}}function o(t,a){let e={};switch(a.type){case"fetched":return e=Object.assign({},a.data),e;case"productsFetched":return console.log("vj: productsFetched",{collections:t,action:a}),e=Object.assign({},t),e[a.data.collectionId].products=a.data.products,console.log("vj: collectionsCopy",{collectionsCopy:e}),e;case"paged":return console.log("vj: paged",{collections:t,action:a}),e=Object.assign(Object.assign({},t),a.data),e;case"productsPaged":return console.log("vj: pagedProducts",{collections:t,action:a}),e=Object.assign({},t),a.data.collectionId,e[a.data.collectionId].products=Object.assign(Object.assign({},e[a.data.collectionId].products),a.data.products),e;default:return{}}}const d=a("");export{d as CollectionIdContext,o as collectionsReducer,e as selectedColectionsReducer};

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

@@ -1,10 +1,11 @@
 /// <reference types="react" />
-import { Collection, SelectedItems } from '.';
+import { Collection, FbStatusFetcherReturn, SelectedItems } from '.';
 import { SelectedCollectionsActions } from './reducers';
 interface SearchScreenInterface {
     customCollectionRestriction?: boolean;
     selectedCollections: SelectedItems;
     searchedCollections: SelectedItems;
+    setSearchedCollections: React.Dispatch<React.SetStateAction<SelectedItems | undefined>>;
     selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
     setScreen: React.Dispatch<React.SetStateAction<string>>;
     collections: {
@@ -15,6 +16,8 @@ interface SearchScreenInterface {
     pickerType?: 'COLLECTION' | 'PRODUCT';
     hideProductVariants?: boolean;
     hideProductCheckbox?: boolean;
+    storeId: string;
+    fbStatusFetcher?: (storeId: string, variantIds: string[]) => FbStatusFetcherReturn;
 }
 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 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,setSearchedCollections:f,setScreen:y,collections:j,onBackPress:b,hideVariantCheckbox:k,pickerType:C,hideProductVariants:O,hideProductCheckbox:P,storeId:S,fbStatusFetcher:g}=a;n(h,S,m,g,!0,f);const x=(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==j?void 0:j[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:()=>{y("collections"),b()}}),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:x(o,e),selectedData:p,selectedCollectionsDispatch:m,viewOnly:i,hideProductCheckbox:P,hideVariantCheckbox:k,hideProductVariants:O,pickerType:C},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 e,jsx as t,Fragment as o}from"react/jsx-runtime";import r from"../../assets/icons/arrow_left.svg.js";import{useState as l,useRef as n,useEffect as c}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{SelectedScreenHeader as a}from"./style.js";import{paginateSelectedItems as v,mergeProducts as p}from"./utility.js";const m=m=>{const{selectedCollections:g,selectedCollectionsDispatch:f,setScreen:h,collections:j,outOfStockAction:b}=m,[y,k]=l({}),O=n(0),S=n(null);c((()=>{O.current=0;const e=v(g,10,O.current);console.log("paginated",{paginatedProducts:e,selectedCollections:g}),k(e),O.current+=1}),[]),c((()=>{console.log("paginated curscreen data change",y)}),[y]),c((()=>{console.log("vj: observertarget",S.current);const e=new IntersectionObserver((e=>{if(console.log("vj: observertargetinside",e),e[0].isIntersecting&&(console.log("vj: nextPageRef",O.current),O.current>0)){const e=v(g,10,O.current);console.log("paginated inside observer target",{paginatedProducts:e,selectedCollections:g});const t=p(y,e);k(t),O.current+=1}}),{threshold:1});return S.current&&e.observe(S.current),()=>{S.current&&e.unobserve(S.current)}}),[S]);const C=(e,t)=>{var o,r,l,n,c,i,s,d,u;let a=0,v=0;return!!((null===(r=null===(o=null==g?void 0:g[e])||void 0===o?void 0:o.products)||void 0===r?void 0:r[t])&&(null===(i=Object.keys((null===(c=null===(n=null===(l=null==j?void 0:j[e])||void 0===l?void 0:l.products)||void 0===n?void 0:n[t])||void 0===c?void 0:c.variants)||[]))||void 0===i||i.forEach((()=>v++)),Object.keys((null===(u=null===(d=null===(s=null==g?void 0:g[e])||void 0===s?void 0:s.products)||void 0===d?void 0:d[t])||void 0===u?void 0:u.variants)||[]).forEach((()=>a++)),a>0&&v!==a))};return e("div",{children:[e(a,{children:[t(i,{Icon:r,onClick:()=>{h("collections")}}),t(s,{children:"Selected Products"})]}),e("div",{children:[Object.keys(y).length>0?t(o,{children:Object.keys(y).map((e=>{var o;return Object.keys((null===(o=null==y?void 0:y[e])||void 0===o?void 0:o.products)||[]).map((o=>{let r=!1;return(null==y?void 0:y.isCustom)&&(r=!0),t(u,{upliftAdditions:null,collectionId:e,productId:o,data:y[e].products[o],isProductPartiallyChecked:C(e,o),selectedData:y,selectedCollectionsDispatch:f,viewOnly:r,outOfStockAction:b},o)}))}))}):t(d,{title:"No Products Selected",subtitle:"Select products will appear here"}),t("div",{ref:S})]})]})};export{m as SelectedScreen};