@bikdotai/bik-component-library 0.0.455-beta.ppif-4 → 0.0.455
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.
- package/dist/cjs/components/product-picker-v2/collectionScreen.d.ts +0 -19
- package/dist/cjs/components/product-picker-v2/collectionScreen.js +1 -1
- package/dist/cjs/components/product-picker-v2/helpers/ProductHelper.d.ts +0 -5
- package/dist/cjs/components/product-picker-v2/helpers/ProductHelper.js +1 -1
- package/dist/cjs/components/product-picker-v2/modal.d.ts +3 -16
- package/dist/cjs/components/product-picker-v2/modal.js +1 -1
- package/dist/cjs/components/product-picker-v2/productScreen.d.ts +37 -6
- package/dist/cjs/components/product-picker-v2/productScreen.js +1 -1
- package/dist/cjs/components/product-picker-v2/rearrangeScreen.d.ts +1 -3
- package/dist/cjs/components/product-picker-v2/rearrangeScreen.js +1 -1
- package/dist/cjs/components/product-picker-v2/reducers.d.ts +1 -25
- package/dist/cjs/components/product-picker-v2/reducers.js +1 -1
- package/dist/cjs/components/product-picker-v2/searchScreen.d.ts +3 -10
- package/dist/cjs/components/product-picker-v2/searchScreen.js +1 -1
- package/dist/cjs/components/product-picker-v2/selectedScreen.d.ts +1 -5
- package/dist/cjs/components/product-picker-v2/selectedScreen.js +1 -1
- package/dist/cjs/components/product-picker-v2/style.d.ts +0 -1
- package/dist/cjs/components/product-picker-v2/style.js +12 -32
- package/dist/cjs/components/product-picker-v2/utility.d.ts +0 -37
- package/dist/cjs/components/product-picker-v2/utility.js +1 -1
- package/dist/cjs/components/product-picker-v2/variant.js +1 -1
- package/dist/esm/components/product-picker-v2/collectionScreen.d.ts +0 -19
- package/dist/esm/components/product-picker-v2/collectionScreen.js +1 -1
- package/dist/esm/components/product-picker-v2/helpers/ProductHelper.d.ts +0 -5
- package/dist/esm/components/product-picker-v2/helpers/ProductHelper.js +1 -1
- package/dist/esm/components/product-picker-v2/modal.d.ts +3 -16
- package/dist/esm/components/product-picker-v2/modal.js +1 -1
- package/dist/esm/components/product-picker-v2/productScreen.d.ts +37 -6
- package/dist/esm/components/product-picker-v2/productScreen.js +1 -1
- package/dist/esm/components/product-picker-v2/rearrangeScreen.d.ts +1 -3
- package/dist/esm/components/product-picker-v2/rearrangeScreen.js +1 -1
- package/dist/esm/components/product-picker-v2/reducers.d.ts +1 -25
- package/dist/esm/components/product-picker-v2/reducers.js +1 -1
- package/dist/esm/components/product-picker-v2/searchScreen.d.ts +3 -10
- package/dist/esm/components/product-picker-v2/searchScreen.js +1 -1
- package/dist/esm/components/product-picker-v2/selectedScreen.d.ts +1 -5
- package/dist/esm/components/product-picker-v2/selectedScreen.js +1 -1
- package/dist/esm/components/product-picker-v2/style.d.ts +0 -1
- package/dist/esm/components/product-picker-v2/style.js +12 -32
- package/dist/esm/components/product-picker-v2/utility.d.ts +0 -37
- package/dist/esm/components/product-picker-v2/utility.js +1 -1
- package/dist/esm/components/product-picker-v2/variant.js +1 -1
- package/package.json +1 -1
- package/dist/cjs/components/product-picker-v2/ProductPickerShimmer.d.ts +0 -3
- package/dist/cjs/components/product-picker-v2/ProductPickerShimmer.js +0 -1
- package/dist/cjs/components/product-picker-v2/ProductPickerTag.d.ts +0 -19
- package/dist/cjs/components/product-picker-v2/ProductPickerTag.js +0 -1
- package/dist/cjs/components/product-picker-v2/product.d.ts +0 -43
- package/dist/cjs/components/product-picker-v2/product.js +0 -1
- package/dist/cjs/components/product-picker-v2/productInfoOverlay.d.ts +0 -17
- package/dist/cjs/components/product-picker-v2/productInfoOverlay.js +0 -39
- package/dist/esm/components/product-picker-v2/ProductPickerShimmer.d.ts +0 -3
- package/dist/esm/components/product-picker-v2/ProductPickerShimmer.js +0 -1
- package/dist/esm/components/product-picker-v2/ProductPickerTag.d.ts +0 -19
- package/dist/esm/components/product-picker-v2/ProductPickerTag.js +0 -1
- package/dist/esm/components/product-picker-v2/product.d.ts +0 -43
- package/dist/esm/components/product-picker-v2/product.js +0 -1
- package/dist/esm/components/product-picker-v2/productInfoOverlay.d.ts +0 -17
- package/dist/esm/components/product-picker-v2/productInfoOverlay.js +0 -39
|
@@ -1,38 +1 @@
|
|
|
1
|
-
import { Collection, FbStatusFetcherReturn, Product, SelectedItems } from './modal';
|
|
2
|
-
import { CollectionsActions } from './reducers';
|
|
3
1
|
export declare const liftTheStateUp: (payload: any, data: any) => any;
|
|
4
|
-
export declare function paginateSelectedItems(selectedItems: SelectedItems, limit: number, offset: number): {
|
|
5
|
-
[key: string]: Collection;
|
|
6
|
-
};
|
|
7
|
-
/**
|
|
8
|
-
* 3 scenarios.
|
|
9
|
-
* 1. If no api is provided -> marks everything as approved.
|
|
10
|
-
* 2. If api is success -> sets the status
|
|
11
|
-
* 3. If api is failure -> marks everything as approved.
|
|
12
|
-
*
|
|
13
|
-
* We first get the variant ids to fetch and only if we have variant ids, we call api.
|
|
14
|
-
*/
|
|
15
|
-
export declare const fetchFbStatusCollection: (data: SelectedItems, storeId: string, dispatcher: any, fbStatusFetcher?: ((storeId: string, variantIds: string[]) => FbStatusFetcherReturn) | undefined, dispatchType?: string) => void;
|
|
16
|
-
/**
|
|
17
|
-
* Instead of collection level, we do it product level.
|
|
18
|
-
*
|
|
19
|
-
* For more info refer @function getVariantIdsToFetch
|
|
20
|
-
*/
|
|
21
|
-
export declare const getVariantIdsToFetchAtProductLevel: (products: {
|
|
22
|
-
[key: string]: Product;
|
|
23
|
-
}, globalData?: Collection) => string[];
|
|
24
|
-
/**
|
|
25
|
-
* Instead of collection level, we do it product level.
|
|
26
|
-
*
|
|
27
|
-
* For more info refer @function markVariantsAsApproved
|
|
28
|
-
*/
|
|
29
|
-
export declare const markVariantsAsApprovedProductsLevel: (products: {
|
|
30
|
-
[key: string]: Product;
|
|
31
|
-
}, dispatcher: React.Dispatch<CollectionsActions>, collectionId: string, curScreenData?: Collection, setCurScreenData?: React.Dispatch<React.SetStateAction<Collection>>) => void;
|
|
32
|
-
/**
|
|
33
|
-
* If product has only one variant and variant name has product name, returns false.
|
|
34
|
-
* Other cases returns true.
|
|
35
|
-
*/
|
|
36
|
-
export declare const shouldShowVariant: (data: Product) => boolean;
|
|
37
|
-
export declare const isProductPartiallyChecked: (collectionId: string, productId: string, selectedData: SelectedItems, currentCollection: Collection) => boolean;
|
|
38
|
-
export declare const isCollectionPartiallyChecked: (collectionId: string, collection: Collection, selectedCollections: SelectedItems) => boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var
|
|
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};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/delete.svg.js"),
|
|
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()}})]})};
|
|
@@ -13,7 +13,6 @@ interface CollectionsScreenInterface {
|
|
|
13
13
|
storeId: string;
|
|
14
14
|
selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
|
|
15
15
|
setCollectionId: React.Dispatch<React.SetStateAction<string>>;
|
|
16
|
-
setSelectedCollectionId: React.Dispatch<React.SetStateAction<string>>;
|
|
17
16
|
setScreen: React.Dispatch<React.SetStateAction<string>>;
|
|
18
17
|
collectionsDispatch: React.Dispatch<CollectionsActions>;
|
|
19
18
|
setSaveDisabled: React.Dispatch<boolean>;
|
|
@@ -26,22 +25,4 @@ interface CollectionsScreenInterface {
|
|
|
26
25
|
pickerType?: 'COLLECTION' | 'PRODUCT';
|
|
27
26
|
}
|
|
28
27
|
export declare const CollectionsScreen: (props: CollectionsScreenInterface) => import("react/jsx-runtime").JSX.Element;
|
|
29
|
-
export interface CollectionCardInterface {
|
|
30
|
-
customCollectionRestriction?: boolean;
|
|
31
|
-
data: Collection;
|
|
32
|
-
selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
|
|
33
|
-
setCollectionId: React.Dispatch<React.SetStateAction<string>>;
|
|
34
|
-
setSelectedCollectionId: React.Dispatch<React.SetStateAction<string>>;
|
|
35
|
-
setScreen: React.Dispatch<React.SetStateAction<string>>;
|
|
36
|
-
id: string;
|
|
37
|
-
isChecked: boolean;
|
|
38
|
-
isDisabled: boolean;
|
|
39
|
-
isPartiallyChecked: boolean;
|
|
40
|
-
hideCollectionCheckbox?: boolean;
|
|
41
|
-
renderWithoutModal?: boolean;
|
|
42
|
-
pickerType?: 'COLLECTION' | 'PRODUCT';
|
|
43
|
-
selectedCollections: SelectedItems;
|
|
44
|
-
usedInSearch?: boolean;
|
|
45
|
-
}
|
|
46
|
-
export declare const CollectionCard: (props: CollectionCardInterface) => import("react/jsx-runtime").JSX.Element;
|
|
47
28
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t,Fragment as
|
|
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};
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { TagType } from "../../tag/model";
|
|
2
1
|
import { Product, ProductVariant, SelectedItems } from '../modal';
|
|
3
2
|
import { OUT_OF_STOCK_ACTION } from '../type';
|
|
4
3
|
import { ProductVariantForRearrange } from '../variant';
|
|
@@ -32,10 +31,6 @@ export declare class ProductHelper {
|
|
|
32
31
|
* @param outOfStockAction
|
|
33
32
|
*/
|
|
34
33
|
static getProductLabels(productVariant: Product | ProductVariant, outOfStockAction?: OUT_OF_STOCK_ACTION): string | null;
|
|
35
|
-
/**
|
|
36
|
-
* For FB Rejected returns 'negative', for rest returns 'warning'
|
|
37
|
-
*/
|
|
38
|
-
static getTagType: (tagText: string) => TagType;
|
|
39
34
|
}
|
|
40
35
|
/**
|
|
41
36
|
* Loops through each collection, each product, each variant.
|
|
@@ -1 +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"
|
|
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};
|
|
@@ -7,13 +7,10 @@ export interface ProductVariant {
|
|
|
7
7
|
quantity: number;
|
|
8
8
|
skipSync?: boolean;
|
|
9
9
|
displayOrder?: number | null;
|
|
10
|
-
fbStatus?: FbProductStatus;
|
|
11
|
-
description?: string;
|
|
12
10
|
}
|
|
13
11
|
export interface Product {
|
|
14
12
|
name: string;
|
|
15
13
|
image: string;
|
|
16
|
-
description?: string;
|
|
17
14
|
variants?: {
|
|
18
15
|
[key: string]: ProductVariant;
|
|
19
16
|
};
|
|
@@ -29,10 +26,6 @@ export interface Collection {
|
|
|
29
26
|
export type SelectedItems = {
|
|
30
27
|
[key: string]: Collection;
|
|
31
28
|
};
|
|
32
|
-
export type SearchedItems = {
|
|
33
|
-
collections: SelectedItems;
|
|
34
|
-
products: SelectedItems;
|
|
35
|
-
};
|
|
36
29
|
export type CollectionFetcherReturn = Promise<{
|
|
37
30
|
collections: {
|
|
38
31
|
[key: string]: {
|
|
@@ -45,10 +38,6 @@ export type CollectionFetcherReturn = Promise<{
|
|
|
45
38
|
export type ProductFetcherReturn = Promise<{
|
|
46
39
|
[key: string]: Product;
|
|
47
40
|
}>;
|
|
48
|
-
export type FbStatusFetcherReturn = Promise<{
|
|
49
|
-
[key: string]: FbProductStatus;
|
|
50
|
-
}>;
|
|
51
|
-
export type FbProductStatus = 'APPROVED' | 'REJECTED';
|
|
52
41
|
export declare enum ScreenName {
|
|
53
42
|
Collections = "collections",
|
|
54
43
|
RearrangeProducts = "rearrange",
|
|
@@ -60,11 +49,10 @@ export type ProductPickerInterface = {
|
|
|
60
49
|
hideGlobalSearch?: boolean;
|
|
61
50
|
hideInCollectionSearch?: boolean;
|
|
62
51
|
customCollectionRestriction?: boolean;
|
|
63
|
-
searchInCollectionFetcher: (storeId: string, collectionId: string, query: string) =>
|
|
64
|
-
searchFetcher: (storeId: string, query: string) => Promise<
|
|
52
|
+
searchInCollectionFetcher: (storeId: string, collectionId: string, query: string) => Promise<string[]>;
|
|
53
|
+
searchFetcher: (storeId: string, query: string) => Promise<SelectedItems>;
|
|
65
54
|
collectionFetcher: (offset: number, storeId: string) => CollectionFetcherReturn;
|
|
66
|
-
productFetcher: (collectionId: string, storeId: string
|
|
67
|
-
fbStatusFetcher?: (storeId: string, variantIds: string[]) => FbStatusFetcherReturn;
|
|
55
|
+
productFetcher: (collectionId: string, storeId: string) => ProductFetcherReturn;
|
|
68
56
|
storeId: string;
|
|
69
57
|
selectedItems: SelectedItems;
|
|
70
58
|
onAdd: (items: SelectedItems, total: number) => void;
|
|
@@ -89,7 +77,6 @@ export type ProductPickerInterface = {
|
|
|
89
77
|
rearrangeEnabled?: boolean;
|
|
90
78
|
selectSingleItem?: boolean;
|
|
91
79
|
stickyFooter?: boolean;
|
|
92
|
-
showProductDetails?: boolean;
|
|
93
80
|
} & ({
|
|
94
81
|
startupScreen: ScreenName.RearrangeProducts;
|
|
95
82
|
rearrangeEnabled: true;
|
|
@@ -1 +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
|
|
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 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{ProductsScreen as g}from"./productScreen.js";import{RearrangeScreen as C}from"./rearrangeScreen.js";import{collectionsReducer as y,selectedColectionsReducer as b,CollectionIdContext as v}from"./reducers.js";import{SearchScreen as f}from"./searchScreen.js";import{SelectedScreen as S}from"./selectedScreen.js";import{ContainerStyle as x,ScrollContainerStyle as P}from"./style.js";import{OUT_OF_STOCK_ACTION as j}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:F,visible:R,zIndex:w,exactLimit:D,limit:E,hideCollectionCheckbox:$,hideProductCheckbox:A,outOfStockAction:V=j.BLUR,hideVariantCheckbox:B,selectProductsFromCustomCollection:L,hideSelectionCount:z,title:M,width:G,renderWithoutModal:H,onClickSave:W,pickerType:Y,hideProductVariants:K=!1,startupScreen:U=k.Collections,rearrangeEnabled:q,selectSingleItem:J=!1}=T,[N,Q]=r(y,{}),[X,Z]=i([k.Collections,k.RearrangeProducts].includes(U)?U:k.Collections),[_,ee]=i("grid"),[te,oe]=i(""),[ce,re]=i(0),[ie,se]=i(!1),[ne,le]=i(0),[de,ae]=i(""),[ue,he]=i(!1),[pe,me]=i(!1),[ge,Ce]=i(),[ye,be]=r(b,Object.keys(O).length>0?O:{}),ve=s(null);n((()=>{se(!0),me(!0),T.collectionFetcher(ce,I).then((e=>{Q({type:"fetched",data:(null==e?void 0:e.collections)||{}}),se(!1),re((e=>e+1)),me(!1)})).catch()}),[]),n((()=>{let e=0;Object.keys(ye||[]).forEach((t=>{var o;Object.keys((null===(o=ye[t])||void 0===o?void 0:o.products)||[]).forEach((o=>{var c,r;Object.keys((null===(r=null===(c=ye[t].products)||void 0===c?void 0:c[o])||void 0===r?void 0:r.variants)||[]).forEach((()=>{e+=1}))}))})),le(e)})),n((()=>{var e;te&&!(null===(e=null==N?void 0:N[te])||void 0===e?void 0:e.products)&&(se(!0),T.productFetcher(te,I).then((e=>{Object.keys(e).length&&Q({type:"productsFetched",data:{collectionId:te,products:e}}),se(!1)})).catch())}),[te]),n((()=>{const e=setTimeout((()=>{"rearrange"!==X&&(de.length?(he(!0),T.searchFetcher(I,de).then((e=>{Ce(Object.assign({},e)),Z("searchProducts"),se(!1),he(!1)}))):Z("collections"))}),800);return()=>clearTimeout(e)}),[de]),n((()=>{W&&(T.onAdd(ye,ne),fe())}),[W]),n((()=>{J&&Object.keys(ye||{}).length&&ne&&(T.onAdd(ye,ne),fe())}),[J,ye,ne]);const fe=()=>{be({type:"reset",data:{}})},Se=e(x,{children:[T.postHeader&&t("div",Object.assign({style:{padding:"0 24px"}},{children:T.postHeader})),!T.hideGlobalSearch&&t(o,{children:("collections"===X||"searchProducts"===X)&&t("div",Object.assign({style:{padding:H?"8px 16px":"12px 24px",borderBottom:"1px solid #E0E0E0"}},{children:t(a,{noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>ue?t(h,{size:"small",color:l.content.primary}):t(c,{})},id:"listInput",height:"24px",type:"text",value:de,onChangeText:e=>{e.length&&e.trim().length?ae(e):ae("")}})}))}),e(P,Object.assign({ref:ve},{children:["collections"===X&&t(m,{customCollectionRestriction:T.customCollectionRestriction,dataLoading:pe,collections:N,selectedCollectionsDispatch:be,setCollectionId:oe,setScreen:Z,selectedCollections:ye,collectionFetcher:T.collectionFetcher,storeId:I,collectionsDispatch:Q,setSaveDisabled:se,pagingControls:{curPage:ce,setCurPage:re},hideCollectionCheckbox:$,renderWithoutModal:H,pickerType:Y}),"products"===X&&te&&t(v.Provider,Object.assign({value:te},{children:t(g,{hideInCollectionSearch:T.hideInCollectionSearch,customCollectionRestriction:T.customCollectionRestriction,productFetcher:T.productFetcher,setScreen:Z,storeId:I,data:N[te],collectionsDispatch:Q,selectedCollectionsDispatch:be,selectedData:ye,setSaveDisabled:se,searchInCollectionFetcher:T.searchInCollectionFetcher,hideProductCheckbox:A,outOfStockAction:V,hideVariantCheckbox:B,selectProductsFromCustomCollection:L,renderWithoutModal:H,pickerType:Y,hideProductVariants:K})})),"view"===X&&t(S,{selectedCollections:ye||{},selectedCollectionsDispatch:be,setScreen:Z,collections:N}),"rearrange"===X&&t(C,{selectedCollections:ye||{},selectedCollectionsDispatch:be,setScreen:Z,outOfStockAction:V,rearrangeViewType:"grid"===_?"list":"grid",scrollContainerRef:ve}),"searchProducts"===X&&t(f,{customCollectionRestriction:T.customCollectionRestriction,selectedCollections:ye||{},searchedCollections:ge||{},selectedCollectionsDispatch:be,setScreen:Z,collections:N,onBackPress:()=>{ae(""),Ce({})},pickerType:Y,hideProductCheckbox:A,hideProductVariants:K,hideVariantCheckbox:B})]}))]});return t(o,{children:H?Se:t(u,Object.assign({zIndex:w,open:R,onClose:()=>{null==F||F(),fe()},headingTitle:M||("collections"===X||"products"===X?"Select Products":"view"===X?"Selected Products":"searchProducts"===X?"Searched Products":"rearrange"===X?"Rearrange Products":void 0),footerShadow:!0,centralContainerStyles:{width:G||"480px"},headerRightCustomElement:"rearrange"===X?(console.log("ignore:",ee),t(o,{})):t(o,{}),footerContainerStyle:T.stickyFooter?{position:"absolute",bottom:0,left:0,width:"100%",zIndex:9,background:l.surface.standard}:void 0,primaryButton:{buttonText:ie?"Loading...":X===k.RearrangeProducts?"Done":"Add",disabled:ie||ne<1||D&&ne<D||!D&&E&&ne>E||!1,onClick:()=>{T.onAdd(ye,ne),fe()}},wrapperStyle:T.stickyFooter?{height:"calc(100vh - 168px)"}:void 0,footerLeftCustomElement:z?t(o,{}):D&&ne>D?t(p,{tagText:`You can only select ${D} products`,type:"negative"}):E&&ne>E?t(p,{tagText:`You can only select ${E} products`,type:"negative"}):t(d,ne>0?{onClick:()=>{Z(q?k.RearrangeProducts:k.SelectedProducts)},buttonText:D?`${ne}/${D} products selected`:`${ne} products selected`,buttonType:["rearrange","view"].includes(X)?"tertiaryGray":"tertiary",disabled:["rearrange","view"].includes(X)}:{disabled:!0,buttonText:D?`${ne}/${D} products selected`:`${ne} products selected`,buttonType:"tertiaryGray"})},{children:Se}))})};export{T as ProductPickerModal,k as ScreenName};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { Collection,
|
|
2
|
+
import { Collection, Product, ProductFetcherReturn, ProductVariant, SelectedItems } from '.';
|
|
3
3
|
import { CollectionsActions, SelectedCollectionsActions } from './reducers';
|
|
4
4
|
import { OUT_OF_STOCK_ACTION } from './type';
|
|
5
5
|
interface ProductsScreenInterface {
|
|
@@ -9,8 +9,8 @@ interface ProductsScreenInterface {
|
|
|
9
9
|
collectionsDispatch: React.Dispatch<CollectionsActions>;
|
|
10
10
|
selectedData: SelectedItems;
|
|
11
11
|
selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
|
|
12
|
-
searchInCollectionFetcher: (storeId: string, collectionId: string, query: string) =>
|
|
13
|
-
productFetcher: (collectionId: string, storeId: string
|
|
12
|
+
searchInCollectionFetcher: (storeId: string, collectionId: string, query: string) => Promise<string[]>;
|
|
13
|
+
productFetcher: (collectionId: string, storeId: string) => ProductFetcherReturn;
|
|
14
14
|
storeId: string;
|
|
15
15
|
setScreen: React.Dispatch<React.SetStateAction<string>>;
|
|
16
16
|
setSaveDisabled: React.Dispatch<React.SetStateAction<boolean>>;
|
|
@@ -21,9 +21,40 @@ interface ProductsScreenInterface {
|
|
|
21
21
|
renderWithoutModal?: boolean;
|
|
22
22
|
pickerType?: 'COLLECTION' | 'PRODUCT';
|
|
23
23
|
hideProductVariants?: boolean;
|
|
24
|
-
showProductDetailInfoIcon?: boolean;
|
|
25
|
-
fbStatusFetcher?: (storeId: string, variantIds: string[]) => FbStatusFetcherReturn;
|
|
26
|
-
onProductDetailClick: (productData: Product | ProductVariant) => void;
|
|
27
24
|
}
|
|
28
25
|
export declare const ProductsScreen: (props: ProductsScreenInterface) => import("react/jsx-runtime").JSX.Element;
|
|
26
|
+
interface ProductGroupInterface {
|
|
27
|
+
collectionId: string;
|
|
28
|
+
productId: string;
|
|
29
|
+
data: Product;
|
|
30
|
+
selectedData: SelectedItems;
|
|
31
|
+
selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
|
|
32
|
+
viewOnly: boolean;
|
|
33
|
+
isProductPartiallyChecked?: boolean;
|
|
34
|
+
upliftAdditions: any;
|
|
35
|
+
hideProductCheckbox?: boolean;
|
|
36
|
+
outOfStockAction?: OUT_OF_STOCK_ACTION;
|
|
37
|
+
hideVariantCheckbox?: boolean;
|
|
38
|
+
hideProductVariants?: boolean;
|
|
39
|
+
pickerType?: 'COLLECTION' | 'PRODUCT';
|
|
40
|
+
}
|
|
41
|
+
export declare const ProductGroup: (props: ProductGroupInterface) => import("react/jsx-runtime").JSX.Element;
|
|
42
|
+
interface ProductCardInterface {
|
|
43
|
+
isVariant: boolean;
|
|
44
|
+
data: Product | ProductVariant;
|
|
45
|
+
productId: string;
|
|
46
|
+
collectionId: string;
|
|
47
|
+
variantId?: string;
|
|
48
|
+
isSelected: boolean;
|
|
49
|
+
selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
|
|
50
|
+
viewOnly: boolean;
|
|
51
|
+
isPartiallyChecked?: boolean;
|
|
52
|
+
upliftAdditions: any;
|
|
53
|
+
hideProductCheckbox?: boolean;
|
|
54
|
+
outOfStockAction?: OUT_OF_STOCK_ACTION;
|
|
55
|
+
hideVariantCheckbox?: boolean;
|
|
56
|
+
hideProductVariants?: boolean;
|
|
57
|
+
pickerType?: 'COLLECTION' | 'PRODUCT';
|
|
58
|
+
}
|
|
59
|
+
export declare const ProductCard: (props: ProductCardInterface) => import("react/jsx-runtime").JSX.Element;
|
|
29
60
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as t,jsx as e}from"react/jsx-runtime";import
|
|
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};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { SelectedItems } from '.';
|
|
3
3
|
import { SelectedCollectionsActions } from './reducers';
|
|
4
4
|
import { OUT_OF_STOCK_ACTION } from './type';
|
|
5
5
|
interface RearrangeScreenInterface {
|
|
@@ -9,8 +9,6 @@ interface RearrangeScreenInterface {
|
|
|
9
9
|
rearrangeViewType: 'grid' | 'list';
|
|
10
10
|
outOfStockAction?: OUT_OF_STOCK_ACTION;
|
|
11
11
|
scrollContainerRef: React.RefObject<HTMLDivElement>;
|
|
12
|
-
storeId: string;
|
|
13
|
-
fbStatusFetcher?: (storeId: string, variantIds: string[]) => FbStatusFetcherReturn;
|
|
14
12
|
}
|
|
15
13
|
/**
|
|
16
14
|
* Screen will be opened on two conditions -
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as
|
|
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};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { Collection,
|
|
2
|
+
import { Collection, SelectedItems } from '.';
|
|
3
3
|
export interface SelectedCollectionsActions {
|
|
4
4
|
type: string;
|
|
5
5
|
data: {
|
|
@@ -14,28 +14,4 @@ export interface CollectionsActions {
|
|
|
14
14
|
};
|
|
15
15
|
}
|
|
16
16
|
export declare function collectionsReducer(collections: Collection, action: CollectionsActions): any;
|
|
17
|
-
/**
|
|
18
|
-
* Pagination reducer used in selected screen.
|
|
19
|
-
* Used for local pagination.
|
|
20
|
-
*
|
|
21
|
-
* Actions used:
|
|
22
|
-
* paginate -> Checks if the products of the collection is already displayed, if yes addes the products, if no adds the entire collection
|
|
23
|
-
* update -> triggers a re-render.
|
|
24
|
-
* set -> adds the data to existing collections.
|
|
25
|
-
* filter -> When user unselects a product in selected screen, we filter out the selected data and show only unselected data.
|
|
26
|
-
*/
|
|
27
|
-
export declare function paginationReducer(collections: SelectedItems, action: SelectedCollectionsActions): SelectedItems;
|
|
28
|
-
export interface SearchReducerActions {
|
|
29
|
-
type: string;
|
|
30
|
-
data: SearchedItems;
|
|
31
|
-
}
|
|
32
|
-
/**
|
|
33
|
-
* Data used in search screen.
|
|
34
|
-
* To display both collections and products.
|
|
35
|
-
*
|
|
36
|
-
* Actions:
|
|
37
|
-
* set -> no change and sets the data.
|
|
38
|
-
* setProducts -> keeps the collection from search as-is and sets only products
|
|
39
|
-
*/
|
|
40
|
-
export declare function searchReducer(searchedItems: SearchedItems, action: SearchReducerActions): SearchedItems;
|
|
41
17
|
export declare const CollectionIdContext: import("react").Context<string>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{cloneDeep as t}from"lodash";import{createContext as a}from"react";function
|
|
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};
|
|
@@ -1,15 +1,12 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { Collection,
|
|
3
|
-
import {
|
|
2
|
+
import { Collection, SelectedItems } from '.';
|
|
3
|
+
import { SelectedCollectionsActions } from './reducers';
|
|
4
4
|
interface SearchScreenInterface {
|
|
5
5
|
customCollectionRestriction?: boolean;
|
|
6
6
|
selectedCollections: SelectedItems;
|
|
7
|
-
searchedCollections:
|
|
8
|
-
searchedCollectionsDispatch: React.Dispatch<SearchReducerActions>;
|
|
7
|
+
searchedCollections: SelectedItems;
|
|
9
8
|
selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
|
|
10
9
|
setScreen: React.Dispatch<React.SetStateAction<string>>;
|
|
11
|
-
setCollectionId: React.Dispatch<React.SetStateAction<string>>;
|
|
12
|
-
setSelectedCollectionId: React.Dispatch<React.SetStateAction<string>>;
|
|
13
10
|
collections: {
|
|
14
11
|
[key: string]: Collection;
|
|
15
12
|
};
|
|
@@ -18,10 +15,6 @@ interface SearchScreenInterface {
|
|
|
18
15
|
pickerType?: 'COLLECTION' | 'PRODUCT';
|
|
19
16
|
hideProductVariants?: boolean;
|
|
20
17
|
hideProductCheckbox?: boolean;
|
|
21
|
-
storeId: string;
|
|
22
|
-
fbStatusFetcher?: (storeId: string, variantIds: string[]) => FbStatusFetcherReturn;
|
|
23
|
-
hideCollectionCheckbox?: boolean;
|
|
24
|
-
renderWithoutModal?: boolean;
|
|
25
18
|
}
|
|
26
19
|
export declare const SearchScreen: (props: SearchScreenInterface) => import("react/jsx-runtime").JSX.Element;
|
|
27
20
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as
|
|
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};
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { Collection,
|
|
2
|
+
import { Collection, SelectedItems } from '.';
|
|
3
3
|
import { SelectedCollectionsActions } from './reducers';
|
|
4
|
-
import { OUT_OF_STOCK_ACTION } from './type';
|
|
5
4
|
interface SelectedScreenInterface {
|
|
6
5
|
selectedCollections: SelectedItems;
|
|
7
6
|
selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
|
|
@@ -9,9 +8,6 @@ interface SelectedScreenInterface {
|
|
|
9
8
|
collections: {
|
|
10
9
|
[key: string]: Collection;
|
|
11
10
|
};
|
|
12
|
-
outOfStockAction?: OUT_OF_STOCK_ACTION;
|
|
13
|
-
storeId: string;
|
|
14
|
-
fbStatusFetcher?: (storeId: string, variantIds: string[]) => FbStatusFetcherReturn;
|
|
15
11
|
}
|
|
16
12
|
export declare const SelectedScreen: (props: SelectedScreenInterface) => import("react/jsx-runtime").JSX.Element;
|
|
17
13
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as
|
|
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};
|
|
@@ -3,7 +3,6 @@ export declare const ScrollContainerStyle: import("styled-components").StyledCom
|
|
|
3
3
|
export declare const CollectionCardStyle: import("styled-components").StyledComponent<"div", any, {
|
|
4
4
|
isDisabled: boolean;
|
|
5
5
|
isActive: boolean;
|
|
6
|
-
usedInSearch: boolean;
|
|
7
6
|
}, never>;
|
|
8
7
|
export declare const CollectionCardInfoStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
9
8
|
export declare const CollectionCardDetailStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
|