@bikdotai/bik-component-library 0.0.548-beta.1 → 0.0.548-beta.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ export interface InfiniteScrollProps {
3
+ children: React.ReactNode;
4
+ fetchMore: () => Promise<boolean>;
5
+ loadingComponent?: React.ReactNode;
6
+ containerRef: React.RefObject<HTMLDivElement>;
7
+ hasData: boolean;
8
+ }
9
+ export declare const InfiniteScroll: React.FC<InfiniteScrollProps>;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("../product-picker-v2/ProductPickerShimmer.js");exports.InfiniteScroll=n=>{let{children:i,fetchMore:c,loadingComponent:o=e.jsx(t.ProductPickerShimmer,{limit:1}),containerRef:u,hasData:s}=n;const l=r.useRef(!1),[d,a]=r.useState(!1),f=r.useRef(null);return r.useEffect((()=>{if(!u.current||!f.current)return;const e=u.current,r=f.current,t=()=>{if(d)return;const t=e.getBoundingClientRect(),n=r.getBoundingClientRect();n.top<=t.bottom&&n.bottom>=t.top&&(a(!0),c().then((e=>{e&&(l.current=!0),a(!1)})))};return e.addEventListener("scroll",t),()=>{e.removeEventListener("scroll",t)}}),[c,d,u]),e.jsxs("div",{children:[i,!!s&&!l.current&&e.jsx("div",Object.assign({ref:f,style:{minHeight:"10px"}},{children:o}))]})};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),o=require("../../assets/icons/arrow_left.svg.js"),r=require("../../assets/icons/box.svg.js"),c=require("../../assets/icons/search.svg.js"),n=require("lodash"),s=require("react"),i=require("../../constants/Theme.js"),l=require("../checkBox/CheckBox.js"),u=require("../icon-button/IconButton.js"),d=require("../input/Input.js"),a=require("../spinner/Spinner.js"),h=require("../TypographyStyle.js"),p=require("./emptyState.js"),v=require("./product.js"),g=require("./ProductPickerShimmer.js"),j=require("./reducers.js"),f=require("./style.js"),y=require("./type.js"),C=require("./utility.js");const b=e=>{let{children:o,fetchMore:r,loadingComponent:c,containerRef:n}=e;const[i,l]=s.useState(!1),u=s.useRef(0);return s.useEffect((()=>{if(!n.current)return;const e=n.current,t=()=>{if(i)return;const t=e.querySelector("#sentinel");if(!t)return;const o=e.getBoundingClientRect(),c=t.getBoundingClientRect();c.top<=o.bottom&&c.bottom>=o.top&&(l(!0),u.current=e.scrollTop,r().then((()=>{e.scrollTo({top:u.current-10,behavior:"smooth"}),l(!1)})))};return e.addEventListener("scroll",t),()=>{e.removeEventListener("scroll",t)}}),[r,i,n]),t.jsxs("div",{children:[o,t.jsx("div",{id:"sentinel",style:{height:"10px"}}),i&&c]})};exports.ProductsScreen=P=>{var k,x;const{data:O,collectionsDispatch:m,selectedData:S,selectedCollectionsDispatch:I,productFetcher:T,storeId:E,setScreen:q,setSaveDisabled:R,hideInCollectionSearch:A,customCollectionRestriction:D,hideProductCheckbox:V,outOfStockAction:L=y.OUT_OF_STOCK_ACTION.BLUR,hideVariantCheckbox:w=!1,selectProductsFromCustomCollection:B=!1,pickerType:F,hideProductVariants:_,fbStatusFetcher:H,onProductDetailClick:M,showProductDetailInfoIcon:U,scrollContainerRef:J}=P,K=s.useContext(j.CollectionIdContext),N=s.useRef(0),W=s.useRef(!1),[z,G]=s.useState(!1),[Q,X]=s.useState(""),[Y,Z]=s.useState(!1),[$,ee]=s.useState(O),te=s.useRef(!1);s.useEffect((()=>{const e=setTimeout((()=>{Q.length?(Z(!0),P.searchInCollectionFetcher(E,K,Q).then((e=>{const t=n.cloneDeep(O);t.products=e,ee(t);const o=C.getVariantIdsToFetchAtProductLevel(null!=e?e:{});re(o,null!=e?e:{},!0),R(!1),Z(!1)}))):ee(O)}),800);return()=>clearTimeout(e)}),[Q]),s.useCallback((()=>{if(!J||!(null==J?void 0:J.current))return;const{scrollTop:e,clientHeight:t,scrollHeight:o}=J.current;console.log({scrollTop:e,clientHeight:t,scrollHeight:o}),e+t>=o-20&&!te.current&&!W.current&&(R(!0),G(!0),W.current=!0,console.log("handleScroll productFetcher",{collectionId:K,storeId:E,o:10,nc:N.current}),T(K,E,10,N.current).then((r=>{var c,n;if(Object.keys(r).length||(te.current=!0),Object.keys(r).length){const s=$;s.products=Object.assign(Object.assign({},$.products),r),ee(s);const i=C.getVariantIdsToFetchAtProductLevel(r);re(i,r),console.log("new scroll position",e+t-100),N.current+=1;const l=(null===(c=J.current)||void 0===c?void 0:c.scrollHeight)-o+e;null===(n=J.current)||void 0===n||n.scrollTo({top:l-100,behavior:"smooth"})}W.current=!1,G(!1),R(!1)})).catch())}),[K,$,J,E]),s.useEffect((()=>{var e,t,o,r;console.log("useEffect productScreen, collectionId",{collectionId:K}),te.current=!1,N.current=Math.floor((null===(t=Object.keys(null!==(e=O.products)&&void 0!==e?e:{}))||void 0===t?void 0:t.length)/10);const c=C.getVariantIdsToFetchAtProductLevel(null!==(o=O.products)&&void 0!==o?o:{});re(c,null!==(r=O.products)&&void 0!==r?r:{})}),[K]);const oe=!!D&&O.isSmartCollection;s.useEffect((()=>{(null==O?void 0:O.products)||ce(10)}),[]);const re=(e,t,o)=>{H||(o?C.markVariantsAsApprovedProductsLevel(t,m,K,$,ee):C.markVariantsAsApprovedProductsLevel(t,m,K)),e.length>0&&H&&H(E,e).then((e=>{const r=Object.assign({},t);Object.keys(t).forEach((o=>{var c,n;Object.keys(null!==(n=null===(c=null==t?void 0:t[o])||void 0===c?void 0:c.variants)&&void 0!==n?n:{}).forEach((c=>{var n,s;const i=null===(n=null==t?void 0:t[o].variants)||void 0===n?void 0:n[c];i&&"REJECTED"===e[c]?i.fbStatus="REJECTED":i&&"APPROVED"===e[c]&&(i.fbStatus="APPROVED");const l=null===(s=null==r?void 0:r[o])||void 0===s?void 0:s.variants;l&&l[c]&&(l[c]=i)}))})),o?(ee((e=>{const t=Object.assign({},e);return t.products=r,t})),m({type:"productsPaged",data:{collectionId:K,products:r}})):m({type:"productsPaged",data:{collectionId:K,products:r}})})).catch((e=>{o?C.markVariantsAsApprovedProductsLevel(t,m,K,$,ee):C.markVariantsAsApprovedProductsLevel(t,m,K)}))},ce=e=>{R(!0),Z(!0),T(K,E,e,0).then((t=>{if(Object.keys(t).length||(te.current=!0),Object.keys(t).length){ee(Object.assign(Object.assign({},$),{products:t}));const e=C.getVariantIdsToFetchAtProductLevel(t);re(e,t),N.current=1}e||I({type:"selected",data:{id:K,val:Object.assign(Object.assign({},O),{products:t})}}),R(!1),Z(!1)})).catch()},ne=(e,t)=>{const o=C.liftTheStateUp(t,O);I({type:e,data:Object.assign(Object.assign({},o),{isRestricted:D})})},se=!!(null==S?void 0:S[K])&&!!Object.keys(null!==(x=null===(k=null==S?void 0:S[K])||void 0===k?void 0:k.products)&&void 0!==x?x:{}).length;return s.useRef(null),console.log({scrollContainerRef:J}),t.jsxs("div",{children:[t.jsxs(f.ProductScreenHeader,{children:[t.jsx(u.IconButton,{Icon:o.default,height:16,onClick:()=>{q("collections")}}),t.jsx(h.BodyCaption,Object.assign({style:{color:i.COLORS.content.secondary}},{children:O.name}))]}),!A&&t.jsx("div",Object.assign({style:{padding:16,height:"76px",borderBottom:"1px solid #E0E0E0"}},{children:t.jsx(d.Input,{noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>Y&&Q.length?t.jsx(a.Spinner,{size:"small",color:i.COLORS.content.primary}):t.jsx(c.default,{})},id:"listInput",height:"24px",type:"text",value:Q,onChangeText:e=>{e.length&&e.trim().length?X(e):X("")},placeholder:"Search products in this collection..."})})),t.jsxs(b,Object.assign({containerRef:J,fetchMore:()=>e.__awaiter(void 0,void 0,void 0,(function*(){console.log("fetchMore called"),yield T(K,E,10,N.current),N.current+=1})),loadingComponent:t.jsx(g.ProductPickerShimmer,{limit:1})},{children:[Object.keys((null==$?void 0:$.products)||[]).length>0&&!oe&&!Q.length&&!V&&"-1"!==K&&t.jsxs(f.ProductScreenCollectionCardStyle,{children:[t.jsx(l.CheckBox,{isChecked:se,isPartiallyChecked:C.isCollectionPartiallyChecked(K,$,S,_),onValueChange:function(e){e?ce():I({type:"unselected",data:{id:K}})}}),t.jsx("div",Object.assign({style:{width:40,height:40}},{children:t.jsx(r.default,{})})),t.jsx(h.TitleRegular,{children:"All Products"})]}),Object.keys((null==$?void 0:$.products)||[]).length?Object.keys($.products||[]).map((e=>t.jsx(v.ProductGroup,{outOfStockAction:L,collectionId:K,isProductPartiallyChecked:C.isProductPartiallyChecked(K,e,S,$,_),productId:e,data:$.products[e],selectedData:S,selectedCollectionsDispatch:I,viewOnly:!B&&!!oe,upliftAdditions:ne,hideProductCheckbox:V,hideVariantCheckbox:w,hideProductVariants:_,pickerType:F,onProductDetailClick:M,showProductDetailInfoIcon:U},e))):Y?t.jsx(g.ProductPickerShimmer,{limit:10}):t.jsx(p.EmptyState,{title:"No products to show",subtitle:Q.length?"We couldn't find the product you were looking for":"We couldn’t find any product in this collection."})]})),z&&t.jsx(g.ProductPickerShimmer,{limit:1})]})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_left.svg.js"),o=require("../../assets/icons/box.svg.js"),c=require("../../assets/icons/search.svg.js"),s=require("lodash"),r=require("react"),n=require("../../constants/Theme.js"),i=require("../checkBox/CheckBox.js"),l=require("../icon-button/IconButton.js"),d=require("../InfiniteScroll/InfiniteScroll.js"),u=require("../input/Input.js"),a=require("../spinner/Spinner.js"),h=require("../TypographyStyle.js"),p=require("./emptyState.js"),j=require("./product.js"),v=require("./ProductPickerShimmer.js"),g=require("./reducers.js"),y=require("./style.js"),O=require("./type.js"),P=require("./utility.js");exports.ProductsScreen=b=>{var C,k;const{data:f,collectionsDispatch:x,selectedData:S,selectedCollectionsDispatch:m,productFetcher:I,storeId:q,setScreen:A,setSaveDisabled:E,hideInCollectionSearch:T,customCollectionRestriction:D,hideProductCheckbox:R,outOfStockAction:V=O.OUT_OF_STOCK_ACTION.BLUR,hideVariantCheckbox:L=!1,selectProductsFromCustomCollection:F=!1,pickerType:w,hideProductVariants:B,fbStatusFetcher:_,onProductDetailClick:M,showProductDetailInfoIcon:U,scrollContainerRef:H}=b,J=r.useContext(g.CollectionIdContext),K=r.useRef(0),N=r.useRef(!1),[W,z]=r.useState(""),[G,Q]=r.useState(!1),[X,Y]=r.useState(f),Z=r.useRef(!1);r.useEffect((()=>{const e=setTimeout((()=>{W.length?(Q(!0),b.searchInCollectionFetcher(q,J,W).then((e=>{const t=s.cloneDeep(f);t.products=e,Y(t);const o=P.getVariantIdsToFetchAtProductLevel(null!=e?e:{});ee(o,null!=e?e:{},!0),E(!1),Q(!1)}))):Y(f)}),800);return()=>clearTimeout(e)}),[W]);r.useEffect((()=>{var e,t,o,c;Z.current=!1,K.current=Math.floor((null===(t=Object.keys(null!==(e=f.products)&&void 0!==e?e:{}))||void 0===t?void 0:t.length)/10);const s=P.getVariantIdsToFetchAtProductLevel(null!==(o=f.products)&&void 0!==o?o:{});ee(s,null!==(c=f.products)&&void 0!==c?c:{})}),[J]);const $=!!D&&f.isSmartCollection;r.useEffect((()=>{(null==f?void 0:f.products)||te(10)}),[]);const ee=(e,t,o)=>{_||(o?P.markVariantsAsApprovedProductsLevel(t,x,J,X,Y):P.markVariantsAsApprovedProductsLevel(t,x,J)),e.length>0&&_&&_(q,e).then((e=>{const c=Object.assign({},t);Object.keys(t).forEach((o=>{var s,r;Object.keys(null!==(r=null===(s=null==t?void 0:t[o])||void 0===s?void 0:s.variants)&&void 0!==r?r:{}).forEach((s=>{var r,n;const i=null===(r=null==t?void 0:t[o].variants)||void 0===r?void 0:r[s];i&&"REJECTED"===e[s]?i.fbStatus="REJECTED":i&&"APPROVED"===e[s]&&(i.fbStatus="APPROVED");const l=null===(n=null==c?void 0:c[o])||void 0===n?void 0:n.variants;l&&l[s]&&(l[s]=i)}))})),o?(Y((e=>{const t=Object.assign({},e);return t.products=c,t})),x({type:"productsPaged",data:{collectionId:J,products:c}})):x({type:"productsPaged",data:{collectionId:J,products:c}})})).catch((e=>{o?P.markVariantsAsApprovedProductsLevel(t,x,J,X,Y):P.markVariantsAsApprovedProductsLevel(t,x,J)}))},te=e=>{E(!0),Q(!0),I(J,q,e,0).then((t=>{if(Object.keys(t).length||(Z.current=!0),Object.keys(t).length){Y(Object.assign(Object.assign({},X),{products:t}));const e=P.getVariantIdsToFetchAtProductLevel(t);ee(e,t),K.current=1}e||m({type:"selected",data:{id:J,val:Object.assign(Object.assign({},f),{products:t})}}),E(!1),Q(!1)})).catch()},oe=(e,t)=>{const o=P.liftTheStateUp(t,f);m({type:e,data:Object.assign(Object.assign({},o),{isRestricted:D})})},ce=!!(null==S?void 0:S[J])&&!!Object.keys(null!==(k=null===(C=null==S?void 0:S[J])||void 0===C?void 0:C.products)&&void 0!==k?k:{}).length;return e.jsxs("div",{children:[e.jsxs(y.ProductScreenHeader,{children:[e.jsx(l.IconButton,{Icon:t.default,height:16,onClick:()=>{A("collections")}}),e.jsx(h.BodyCaption,Object.assign({style:{color:n.COLORS.content.secondary}},{children:f.name}))]}),!T&&e.jsx("div",Object.assign({style:{padding:16,height:"76px",borderBottom:"1px solid #E0E0E0"}},{children:e.jsx(u.Input,{noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>G&&W.length?e.jsx(a.Spinner,{size:"small",color:n.COLORS.content.primary}):e.jsx(c.default,{})},id:"listInput",height:"24px",type:"text",value:W,onChangeText:e=>{e.length&&e.trim().length?z(e):z("")},placeholder:"Search products in this collection..."})})),Object.keys((null==X?void 0:X.products)||[]).length>0&&!$&&!W.length&&!R&&"-1"!==J&&e.jsxs(y.ProductScreenCollectionCardStyle,{children:[e.jsx(i.CheckBox,{isChecked:ce,isPartiallyChecked:P.isCollectionPartiallyChecked(J,X,S,B),onValueChange:function(e){e?te():m({type:"unselected",data:{id:J}})}}),e.jsx("div",Object.assign({style:{width:40,height:40}},{children:e.jsx(o.default,{})})),e.jsx(h.TitleRegular,{children:"All Products"})]}),e.jsx(d.InfiniteScroll,Object.assign({hasData:!!Object.keys((null==X?void 0:X.products)||[]).length,fetchMore:()=>(N.current=!0,I(J,q,10,K.current).then((e=>{let t=!1;if(Object.keys(e).length||(t=!0),Object.keys(e).length){const t=X;t.products=Object.assign(Object.assign({},X.products),e),Y(Object.assign({},t));const o=P.getVariantIdsToFetchAtProductLevel(e);ee(o,e)}return E(!1),N.current=!1,K.current+=1,t}))),loadingComponent:e.jsx(v.ProductPickerShimmer,{limit:1}),containerRef:H},{children:Object.keys((null==X?void 0:X.products)||[]).length?Object.keys(X.products||[]).map((t=>e.jsx(j.ProductGroup,{outOfStockAction:V,collectionId:J,isProductPartiallyChecked:P.isProductPartiallyChecked(J,t,S,X,B),productId:t,data:X.products[t],selectedData:S,selectedCollectionsDispatch:m,viewOnly:!F&&!!$,upliftAdditions:oe,hideProductCheckbox:R,hideVariantCheckbox:L,hideProductVariants:B,pickerType:w,onProductDetailClick:M,showProductDetailInfoIcon:U},t))):G?e.jsx(v.ProductPickerShimmer,{limit:10}):e.jsx(p.EmptyState,{title:"No products to show",subtitle:W.length?"We couldn't find the product you were looking for":"We couldn’t find any product in this collection."})}))]})};
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ export interface InfiniteScrollProps {
3
+ children: React.ReactNode;
4
+ fetchMore: () => Promise<boolean>;
5
+ loadingComponent?: React.ReactNode;
6
+ containerRef: React.RefObject<HTMLDivElement>;
7
+ hasData: boolean;
8
+ }
9
+ export declare const InfiniteScroll: React.FC<InfiniteScrollProps>;
@@ -0,0 +1 @@
1
+ import{jsx as t,jsxs as r}from"react/jsx-runtime";import{useRef as e,useState as n,useEffect as o}from"react";import{ProductPickerShimmer as i}from"../product-picker-v2/ProductPickerShimmer.js";const c=c=>{let{children:u,fetchMore:l,loadingComponent:m=t(i,{limit:1}),containerRef:s,hasData:d}=c;const p=e(!1),[a,f]=n(!1),h=e(null);return o((()=>{if(!s.current||!h.current)return;const t=s.current,r=h.current,e=()=>{if(a)return;const e=t.getBoundingClientRect(),n=r.getBoundingClientRect();n.top<=e.bottom&&n.bottom>=e.top&&(f(!0),l().then((t=>{t&&(p.current=!0),f(!1)})))};return t.addEventListener("scroll",e),()=>{t.removeEventListener("scroll",e)}}),[l,a,s]),r("div",{children:[u,!!d&&!p.current&&t("div",Object.assign({ref:h,style:{minHeight:"10px"}},{children:m}))]})};export{c as InfiniteScroll};
@@ -1 +1 @@
1
- import{__awaiter as t}from"../../_virtual/_tslib.js";import{jsxs as o,jsx as e}from"react/jsx-runtime";import c from"../../assets/icons/arrow_left.svg.js";import n from"../../assets/icons/box.svg.js";import r from"../../assets/icons/search.svg.js";import{cloneDeep as i}from"lodash";import{useContext as l,useRef as s,useState as d,useEffect as u,useCallback as a}from"react";import{COLORS as h}from"../../constants/Theme.js";import{CheckBox as p}from"../checkBox/CheckBox.js";import{IconButton as m}from"../icon-button/IconButton.js";import{Input as g}from"../input/Input.js";import{Spinner as v}from"../spinner/Spinner.js";import{BodyCaption as f,TitleRegular as j}from"../TypographyStyle.js";import{EmptyState as b}from"./emptyState.js";import{ProductGroup as y}from"./product.js";import{ProductPickerShimmer as C}from"./ProductPickerShimmer.js";import{CollectionIdContext as O}from"./reducers.js";import{ProductScreenHeader as k,ProductScreenCollectionCardStyle as P}from"./style.js";import{OUT_OF_STOCK_ACTION as I}from"./type.js";import{getVariantIdsToFetchAtProductLevel as E,markVariantsAsApprovedProductsLevel as S,isCollectionPartiallyChecked as x,isProductPartiallyChecked as D,liftTheStateUp as T}from"./utility.js";const R=R=>{var B,V;const{data:A,collectionsDispatch:H,selectedData:F,selectedCollectionsDispatch:M,productFetcher:L,storeId:_,setScreen:J,setSaveDisabled:W,hideInCollectionSearch:q,customCollectionRestriction:z,hideProductCheckbox:K,outOfStockAction:N=I.BLUR,hideVariantCheckbox:U=!1,selectProductsFromCustomCollection:G=!1,pickerType:Q,hideProductVariants:X,fbStatusFetcher:Y,onProductDetailClick:Z,showProductDetailInfoIcon:$,scrollContainerRef:tt}=R,ot=l(O),et=s(0),ct=s(!1),[nt,rt]=d(!1),[it,lt]=d(""),[st,dt]=d(!1),[ut,at]=d(A),ht=s(!1);u((()=>{const t=setTimeout((()=>{it.length?(dt(!0),R.searchInCollectionFetcher(_,ot,it).then((t=>{const o=i(A);o.products=t,at(o);const e=E(null!=t?t:{});mt(e,null!=t?t:{},!0),W(!1),dt(!1)}))):at(A)}),800);return()=>clearTimeout(t)}),[it]),a((()=>{if(!tt||!(null==tt?void 0:tt.current))return;const{scrollTop:t,clientHeight:o,scrollHeight:e}=tt.current;console.log({scrollTop:t,clientHeight:o,scrollHeight:e}),t+o>=e-20&&!ht.current&&!ct.current&&(W(!0),rt(!0),ct.current=!0,console.log("handleScroll productFetcher",{collectionId:ot,storeId:_,o:10,nc:et.current}),L(ot,_,10,et.current).then((c=>{var n,r;if(Object.keys(c).length||(ht.current=!0),Object.keys(c).length){const i=ut;i.products=Object.assign(Object.assign({},ut.products),c),at(i);const l=E(c);mt(l,c),console.log("new scroll position",t+o-100),et.current+=1;const s=(null===(n=tt.current)||void 0===n?void 0:n.scrollHeight)-e+t;null===(r=tt.current)||void 0===r||r.scrollTo({top:s-100,behavior:"smooth"})}ct.current=!1,rt(!1),W(!1)})).catch())}),[ot,ut,tt,_]),u((()=>{var t,o,e,c;console.log("useEffect productScreen, collectionId",{collectionId:ot}),ht.current=!1,et.current=Math.floor((null===(o=Object.keys(null!==(t=A.products)&&void 0!==t?t:{}))||void 0===o?void 0:o.length)/10);const n=E(null!==(e=A.products)&&void 0!==e?e:{});mt(n,null!==(c=A.products)&&void 0!==c?c:{})}),[ot]);const pt=!!z&&A.isSmartCollection;u((()=>{(null==A?void 0:A.products)||gt(10)}),[]);const mt=(t,o,e)=>{Y||(e?S(o,H,ot,ut,at):S(o,H,ot)),t.length>0&&Y&&Y(_,t).then((t=>{const c=Object.assign({},o);Object.keys(o).forEach((e=>{var n,r;Object.keys(null!==(r=null===(n=null==o?void 0:o[e])||void 0===n?void 0:n.variants)&&void 0!==r?r:{}).forEach((n=>{var r,i;const l=null===(r=null==o?void 0:o[e].variants)||void 0===r?void 0:r[n];l&&"REJECTED"===t[n]?l.fbStatus="REJECTED":l&&"APPROVED"===t[n]&&(l.fbStatus="APPROVED");const s=null===(i=null==c?void 0:c[e])||void 0===i?void 0:i.variants;s&&s[n]&&(s[n]=l)}))})),e?(at((t=>{const o=Object.assign({},t);return o.products=c,o})),H({type:"productsPaged",data:{collectionId:ot,products:c}})):H({type:"productsPaged",data:{collectionId:ot,products:c}})})).catch((t=>{e?S(o,H,ot,ut,at):S(o,H,ot)}))},gt=t=>{W(!0),dt(!0),L(ot,_,t,0).then((o=>{if(Object.keys(o).length||(ht.current=!0),Object.keys(o).length){at(Object.assign(Object.assign({},ut),{products:o}));const t=E(o);mt(t,o),et.current=1}t||M({type:"selected",data:{id:ot,val:Object.assign(Object.assign({},A),{products:o})}}),W(!1),dt(!1)})).catch()},vt=(t,o)=>{const e=T(o,A);M({type:t,data:Object.assign(Object.assign({},e),{isRestricted:z})})},ft=!!(null==F?void 0:F[ot])&&!!Object.keys(null!==(V=null===(B=null==F?void 0:F[ot])||void 0===B?void 0:B.products)&&void 0!==V?V:{}).length;return s(null),console.log({scrollContainerRef:tt}),o("div",{children:[o(k,{children:[e(m,{Icon:c,height:16,onClick:()=>{J("collections")}}),e(f,Object.assign({style:{color:h.content.secondary}},{children:A.name}))]}),!q&&e("div",Object.assign({style:{padding:16,height:"76px",borderBottom:"1px solid #E0E0E0"}},{children:e(g,{noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>st&&it.length?e(v,{size:"small",color:h.content.primary}):e(r,{})},id:"listInput",height:"24px",type:"text",value:it,onChangeText:t=>{t.length&&t.trim().length?lt(t):lt("")},placeholder:"Search products in this collection..."})})),o(w,Object.assign({containerRef:tt,fetchMore:()=>t(void 0,void 0,void 0,(function*(){console.log("fetchMore called"),yield L(ot,_,10,et.current),et.current+=1})),loadingComponent:e(C,{limit:1})},{children:[Object.keys((null==ut?void 0:ut.products)||[]).length>0&&!pt&&!it.length&&!K&&"-1"!==ot&&o(P,{children:[e(p,{isChecked:ft,isPartiallyChecked:x(ot,ut,F,X),onValueChange:function(t){t?gt():M({type:"unselected",data:{id:ot}})}}),e("div",Object.assign({style:{width:40,height:40}},{children:e(n,{})})),e(j,{children:"All Products"})]}),Object.keys((null==ut?void 0:ut.products)||[]).length?Object.keys(ut.products||[]).map((t=>e(y,{outOfStockAction:N,collectionId:ot,isProductPartiallyChecked:D(ot,t,F,ut,X),productId:t,data:ut.products[t],selectedData:F,selectedCollectionsDispatch:M,viewOnly:!G&&!!pt,upliftAdditions:vt,hideProductCheckbox:K,hideVariantCheckbox:U,hideProductVariants:X,pickerType:Q,onProductDetailClick:Z,showProductDetailInfoIcon:$},t))):st?e(C,{limit:10}):e(b,{title:"No products to show",subtitle:it.length?"We couldn't find the product you were looking for":"We couldn’t find any product in this collection."})]})),nt&&e(C,{limit:1})]})},w=t=>{let{children:c,fetchMore:n,loadingComponent:r,containerRef:i}=t;const[l,a]=d(!1),h=s(0);return u((()=>{if(!i.current)return;const t=i.current,o=()=>{if(l)return;const o=t.querySelector("#sentinel");if(!o)return;const e=t.getBoundingClientRect(),c=o.getBoundingClientRect();c.top<=e.bottom&&c.bottom>=e.top&&(a(!0),h.current=t.scrollTop,n().then((()=>{t.scrollTo({top:h.current-10,behavior:"smooth"}),a(!1)})))};return t.addEventListener("scroll",o),()=>{t.removeEventListener("scroll",o)}}),[n,l,i]),o("div",{children:[c,e("div",{id:"sentinel",style:{height:"10px"}}),l&&r]})};export{R as ProductsScreen};
1
+ import{jsxs as t,jsx as e}from"react/jsx-runtime";import o from"../../assets/icons/arrow_left.svg.js";import c from"../../assets/icons/box.svg.js";import n from"../../assets/icons/search.svg.js";import{cloneDeep as i}from"lodash";import{useContext as r,useRef as s,useState as l,useEffect as d}from"react";import{COLORS as a}from"../../constants/Theme.js";import{CheckBox as u}from"../checkBox/CheckBox.js";import{IconButton as h}from"../icon-button/IconButton.js";import{InfiniteScroll as p}from"../InfiniteScroll/InfiniteScroll.js";import{Input as m}from"../input/Input.js";import{Spinner as g}from"../spinner/Spinner.js";import{BodyCaption as j,TitleRegular as f}from"../TypographyStyle.js";import{EmptyState as v}from"./emptyState.js";import{ProductGroup as b}from"./product.js";import{ProductPickerShimmer as y}from"./ProductPickerShimmer.js";import{CollectionIdContext as O}from"./reducers.js";import{ProductScreenHeader as k,ProductScreenCollectionCardStyle as C}from"./style.js";import{OUT_OF_STOCK_ACTION as P}from"./type.js";import{getVariantIdsToFetchAtProductLevel as I,markVariantsAsApprovedProductsLevel as D,isCollectionPartiallyChecked as S,isProductPartiallyChecked as x,liftTheStateUp as E}from"./utility.js";const R=R=>{var T,w;const{data:V,collectionsDispatch:A,selectedData:B,selectedCollectionsDispatch:F,productFetcher:J,storeId:M,setScreen:W,setSaveDisabled:z,hideInCollectionSearch:H,customCollectionRestriction:K,hideProductCheckbox:L,outOfStockAction:N=P.BLUR,hideVariantCheckbox:U=!1,selectProductsFromCustomCollection:_=!1,pickerType:q,hideProductVariants:G,fbStatusFetcher:Q,onProductDetailClick:X,showProductDetailInfoIcon:Y,scrollContainerRef:Z}=R,$=r(O),tt=s(0),et=s(!1),[ot,ct]=l(""),[nt,it]=l(!1),[rt,st]=l(V),lt=s(!1);d((()=>{const t=setTimeout((()=>{ot.length?(it(!0),R.searchInCollectionFetcher(M,$,ot).then((t=>{const e=i(V);e.products=t,st(e);const o=I(null!=t?t:{});at(o,null!=t?t:{},!0),z(!1),it(!1)}))):st(V)}),800);return()=>clearTimeout(t)}),[ot]);d((()=>{var t,e,o,c;lt.current=!1,tt.current=Math.floor((null===(e=Object.keys(null!==(t=V.products)&&void 0!==t?t:{}))||void 0===e?void 0:e.length)/10);const n=I(null!==(o=V.products)&&void 0!==o?o:{});at(n,null!==(c=V.products)&&void 0!==c?c:{})}),[$]);const dt=!!K&&V.isSmartCollection;d((()=>{(null==V?void 0:V.products)||ut(10)}),[]);const at=(t,e,o)=>{Q||(o?D(e,A,$,rt,st):D(e,A,$)),t.length>0&&Q&&Q(M,t).then((t=>{const c=Object.assign({},e);Object.keys(e).forEach((o=>{var n,i;Object.keys(null!==(i=null===(n=null==e?void 0:e[o])||void 0===n?void 0:n.variants)&&void 0!==i?i:{}).forEach((n=>{var i,r;const s=null===(i=null==e?void 0:e[o].variants)||void 0===i?void 0:i[n];s&&"REJECTED"===t[n]?s.fbStatus="REJECTED":s&&"APPROVED"===t[n]&&(s.fbStatus="APPROVED");const l=null===(r=null==c?void 0:c[o])||void 0===r?void 0:r.variants;l&&l[n]&&(l[n]=s)}))})),o?(st((t=>{const e=Object.assign({},t);return e.products=c,e})),A({type:"productsPaged",data:{collectionId:$,products:c}})):A({type:"productsPaged",data:{collectionId:$,products:c}})})).catch((t=>{o?D(e,A,$,rt,st):D(e,A,$)}))},ut=t=>{z(!0),it(!0),J($,M,t,0).then((e=>{if(Object.keys(e).length||(lt.current=!0),Object.keys(e).length){st(Object.assign(Object.assign({},rt),{products:e}));const t=I(e);at(t,e),tt.current=1}t||F({type:"selected",data:{id:$,val:Object.assign(Object.assign({},V),{products:e})}}),z(!1),it(!1)})).catch()},ht=(t,e)=>{const o=E(e,V);F({type:t,data:Object.assign(Object.assign({},o),{isRestricted:K})})},pt=!!(null==B?void 0:B[$])&&!!Object.keys(null!==(w=null===(T=null==B?void 0:B[$])||void 0===T?void 0:T.products)&&void 0!==w?w:{}).length;return t("div",{children:[t(k,{children:[e(h,{Icon:o,height:16,onClick:()=>{W("collections")}}),e(j,Object.assign({style:{color:a.content.secondary}},{children:V.name}))]}),!H&&e("div",Object.assign({style:{padding:16,height:"76px",borderBottom:"1px solid #E0E0E0"}},{children:e(m,{noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>nt&&ot.length?e(g,{size:"small",color:a.content.primary}):e(n,{})},id:"listInput",height:"24px",type:"text",value:ot,onChangeText:t=>{t.length&&t.trim().length?ct(t):ct("")},placeholder:"Search products in this collection..."})})),Object.keys((null==rt?void 0:rt.products)||[]).length>0&&!dt&&!ot.length&&!L&&"-1"!==$&&t(C,{children:[e(u,{isChecked:pt,isPartiallyChecked:S($,rt,B,G),onValueChange:function(t){t?ut():F({type:"unselected",data:{id:$}})}}),e("div",Object.assign({style:{width:40,height:40}},{children:e(c,{})})),e(f,{children:"All Products"})]}),e(p,Object.assign({hasData:!!Object.keys((null==rt?void 0:rt.products)||[]).length,fetchMore:()=>(et.current=!0,J($,M,10,tt.current).then((t=>{let e=!1;if(Object.keys(t).length||(e=!0),Object.keys(t).length){const e=rt;e.products=Object.assign(Object.assign({},rt.products),t),st(Object.assign({},e));const o=I(t);at(o,t)}return z(!1),et.current=!1,tt.current+=1,e}))),loadingComponent:e(y,{limit:1}),containerRef:Z},{children:Object.keys((null==rt?void 0:rt.products)||[]).length?Object.keys(rt.products||[]).map((t=>e(b,{outOfStockAction:N,collectionId:$,isProductPartiallyChecked:x($,t,B,rt,G),productId:t,data:rt.products[t],selectedData:B,selectedCollectionsDispatch:F,viewOnly:!_&&!!dt,upliftAdditions:ht,hideProductCheckbox:L,hideVariantCheckbox:U,hideProductVariants:G,pickerType:q,onProductDetailClick:X,showProductDetailInfoIcon:Y},t))):nt?e(y,{limit:10}):e(v,{title:"No products to show",subtitle:ot.length?"We couldn't find the product you were looking for":"We couldn’t find any product in this collection."})}))]})};export{R as ProductsScreen};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.0.548-beta.1",
3
+ "version": "0.0.548-beta.3",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",