@bikdotai/bik-component-library 0.0.456-0 → 0.0.456-beta.1
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/ProductPickerShimmer.d.ts +3 -0
- package/dist/cjs/components/product-picker-v2/ProductPickerShimmer.js +1 -0
- package/dist/cjs/components/product-picker-v2/ProductPickerTag.d.ts +19 -0
- package/dist/cjs/components/product-picker-v2/ProductPickerTag.js +1 -0
- package/dist/cjs/components/product-picker-v2/collectionScreen.d.ts +19 -0
- package/dist/cjs/components/product-picker-v2/collectionScreen.js +1 -1
- package/dist/cjs/components/product-picker-v2/helpers/ProductHelper.d.ts +5 -0
- package/dist/cjs/components/product-picker-v2/helpers/ProductHelper.js +1 -1
- package/dist/cjs/components/product-picker-v2/modal.d.ts +16 -3
- package/dist/cjs/components/product-picker-v2/modal.js +1 -1
- package/dist/cjs/components/product-picker-v2/product.d.ts +43 -0
- package/dist/cjs/components/product-picker-v2/product.js +1 -0
- package/dist/cjs/components/product-picker-v2/productInfoOverlay.d.ts +17 -0
- package/dist/cjs/components/product-picker-v2/productInfoOverlay.js +39 -0
- package/dist/cjs/components/product-picker-v2/productScreen.d.ts +6 -37
- package/dist/cjs/components/product-picker-v2/productScreen.js +1 -1
- package/dist/cjs/components/product-picker-v2/rearrangeScreen.d.ts +3 -1
- package/dist/cjs/components/product-picker-v2/rearrangeScreen.js +1 -1
- package/dist/cjs/components/product-picker-v2/reducers.d.ts +25 -1
- package/dist/cjs/components/product-picker-v2/reducers.js +1 -1
- package/dist/cjs/components/product-picker-v2/searchScreen.d.ts +10 -3
- package/dist/cjs/components/product-picker-v2/searchScreen.js +1 -1
- package/dist/cjs/components/product-picker-v2/selectedScreen.d.ts +5 -2
- package/dist/cjs/components/product-picker-v2/selectedScreen.js +1 -1
- package/dist/cjs/components/product-picker-v2/style.d.ts +1 -0
- package/dist/cjs/components/product-picker-v2/style.js +32 -12
- package/dist/cjs/components/product-picker-v2/utility.d.ts +37 -0
- package/dist/cjs/components/product-picker-v2/utility.js +1 -1
- package/dist/cjs/components/product-picker-v2/variant.js +1 -1
- package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.js +1 -1
- package/dist/cjs/components/template-context-mapper/modalElements/ProductBox.d.ts +1 -0
- package/dist/cjs/components/template-context-mapper/modalElements/ProductBox.js +2 -2
- package/dist/esm/components/product-picker-v2/ProductPickerShimmer.d.ts +3 -0
- package/dist/esm/components/product-picker-v2/ProductPickerShimmer.js +1 -0
- package/dist/esm/components/product-picker-v2/ProductPickerTag.d.ts +19 -0
- package/dist/esm/components/product-picker-v2/ProductPickerTag.js +1 -0
- package/dist/esm/components/product-picker-v2/collectionScreen.d.ts +19 -0
- package/dist/esm/components/product-picker-v2/collectionScreen.js +1 -1
- package/dist/esm/components/product-picker-v2/helpers/ProductHelper.d.ts +5 -0
- package/dist/esm/components/product-picker-v2/helpers/ProductHelper.js +1 -1
- package/dist/esm/components/product-picker-v2/modal.d.ts +16 -3
- package/dist/esm/components/product-picker-v2/modal.js +1 -1
- package/dist/esm/components/product-picker-v2/product.d.ts +43 -0
- package/dist/esm/components/product-picker-v2/product.js +1 -0
- package/dist/esm/components/product-picker-v2/productInfoOverlay.d.ts +17 -0
- package/dist/esm/components/product-picker-v2/productInfoOverlay.js +39 -0
- package/dist/esm/components/product-picker-v2/productScreen.d.ts +6 -37
- package/dist/esm/components/product-picker-v2/productScreen.js +1 -1
- package/dist/esm/components/product-picker-v2/rearrangeScreen.d.ts +3 -1
- package/dist/esm/components/product-picker-v2/rearrangeScreen.js +1 -1
- package/dist/esm/components/product-picker-v2/reducers.d.ts +25 -1
- package/dist/esm/components/product-picker-v2/reducers.js +1 -1
- package/dist/esm/components/product-picker-v2/searchScreen.d.ts +10 -3
- package/dist/esm/components/product-picker-v2/searchScreen.js +1 -1
- package/dist/esm/components/product-picker-v2/selectedScreen.d.ts +5 -2
- package/dist/esm/components/product-picker-v2/selectedScreen.js +1 -1
- package/dist/esm/components/product-picker-v2/style.d.ts +1 -0
- package/dist/esm/components/product-picker-v2/style.js +32 -12
- package/dist/esm/components/product-picker-v2/utility.d.ts +37 -0
- package/dist/esm/components/product-picker-v2/utility.js +1 -1
- package/dist/esm/components/product-picker-v2/variant.js +1 -1
- package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.js +1 -1
- package/dist/esm/components/template-context-mapper/modalElements/ProductBox.d.ts +1 -0
- package/dist/esm/components/template-context-mapper/modalElements/ProductBox.js +2 -2
- package/package.json +1 -1
- package/dist/cjs/components/product-picker-v2/helpers/AllProductHelper.d.ts +0 -4
- package/dist/cjs/components/product-picker-v2/helpers/AllProductHelper.js +0 -1
- package/dist/esm/components/product-picker-v2/helpers/AllProductHelper.d.ts +0 -4
- package/dist/esm/components/product-picker-v2/helpers/AllProductHelper.js +0 -1
|
@@ -1 +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("../icon-button/IconButton.js"),i=require("../TypographyStyle.js"),
|
|
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("react"),l=require("../icon-button/IconButton.js"),i=require("../TypographyStyle.js"),c=require("./collectionScreen.js"),s=require("./emptyState.js"),d=require("./product.js"),r=require("./style.js"),n=require("./utility.js");exports.SearchScreen=u=>{const{customCollectionRestriction:a,selectedCollections:h,searchedCollections:p,searchedCollectionsDispatch:v,selectedCollectionsDispatch:C,setScreen:j,collections:y,onBackPress:k,hideVariantCheckbox:x,pickerType:b,hideProductVariants:S,hideProductCheckbox:P,storeId:m,fbStatusFetcher:f,setCollectionId:I,setSelectedCollectionId:g,hideCollectionCheckbox:q,renderWithoutModal:O}=u;o.useEffect((()=>{var e;n.fetchFbStatusCollection(null!==(e=p.products)&&void 0!==e?e:{},m,v,f,"setProducts")}),[null==p?void 0:p.products]);const D=!!a&&(null==h?void 0:h.isCustom);return e.jsxs("div",{children:[e.jsxs(r.SelectedScreenHeader,{children:[e.jsx(l.IconButton,{Icon:t.default,onClick:()=>{j("collections"),k()}}),e.jsx(i.BodyCaption,{children:"Searched Products"})]}),e.jsx("div",{children:Object.keys(null==p?void 0:p.products).length||Object.keys(null==p?void 0:p.collections).length?e.jsxs(e.Fragment,{children:[e.jsx(e.Fragment,{children:Object.keys(null==p?void 0:p.collections).map((t=>e.jsx(c.CollectionCard,{customCollectionRestriction:a,data:null==y?void 0:y[t],isDisabled:D&&!(null==h?void 0:h[t]),isChecked:!!(null==h?void 0:h[t]),isPartiallyChecked:n.isCollectionPartiallyChecked(t,null==y?void 0:y[t],h),selectedCollectionsDispatch:C,setCollectionId:I,setSelectedCollectionId:g,setScreen:j,id:t,hideCollectionCheckbox:q||"-1"===t,selectedCollections:h,renderWithoutModal:O,pickerType:b,usedInSearch:!0},t)))}),e.jsx(e.Fragment,{children:Object.keys(null==p?void 0:p.products).map((t=>{var o,l;return Object.keys((null===(l=null===(o=null==p?void 0:p.products)||void 0===o?void 0:o[t])||void 0===l?void 0:l.products)||[]).map((o=>{var l,i,c;let s=!1;return(null===(l=null==p?void 0:p.products)||void 0===l?void 0:l.isCustom)&&(s=!0),e.jsx(d.ProductGroup,{collectionId:t,upliftAdditions:(e,o)=>((e,t,o)=>{var l;const i=n.liftTheStateUp(o,null===(l=null==p?void 0:p.products)||void 0===l?void 0:l[e]);C({type:t,data:Object.assign(Object.assign({},i),{isRestricted:a})})})(t,e,o),productId:o,data:(null===(i=null==p?void 0:p.products)||void 0===i?void 0:i[t].products)[o],isProductPartiallyChecked:n.isProductPartiallyChecked(t,o,h,null===(c=p.products)||void 0===c?void 0:c[t]),selectedData:h,selectedCollectionsDispatch:C,viewOnly:s,hideProductCheckbox:P,hideVariantCheckbox:x,hideProductVariants:S,pickerType:b},o)}))}))})]}):e.jsx(s.EmptyState,{title:"No search results found",subtitle:"We couldn’t find the product you were looking for."})})]})};
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { Collection, SelectedItems } from '.';
|
|
2
|
+
import { Collection, FbStatusFetcherReturn, SelectedItems } from '.';
|
|
3
3
|
import { SelectedCollectionsActions } from './reducers';
|
|
4
|
+
import { OUT_OF_STOCK_ACTION } from './type';
|
|
4
5
|
interface SelectedScreenInterface {
|
|
5
6
|
selectedCollections: SelectedItems;
|
|
6
7
|
selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
|
|
@@ -8,7 +9,9 @@ interface SelectedScreenInterface {
|
|
|
8
9
|
collections: {
|
|
9
10
|
[key: string]: Collection;
|
|
10
11
|
};
|
|
11
|
-
|
|
12
|
+
outOfStockAction?: OUT_OF_STOCK_ACTION;
|
|
13
|
+
storeId: string;
|
|
14
|
+
fbStatusFetcher?: (storeId: string, variantIds: string[]) => FbStatusFetcherReturn;
|
|
12
15
|
}
|
|
13
16
|
export declare const SelectedScreen: (props: SelectedScreenInterface) => import("react/jsx-runtime").JSX.Element;
|
|
14
17
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_left.svg.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_left.svg.js"),r=require("react"),c=require("../icon-button/IconButton.js"),s=require("../TypographyStyle.js"),n=require("./emptyState.js"),o=require("./product.js"),u=require("./reducers.js"),i=require("./style.js"),l=require("./utility.js");exports.SelectedScreen=d=>{const{selectedCollections:a,selectedCollectionsDispatch:p,setScreen:j,collections:f,outOfStockAction:y,storeId:S,fbStatusFetcher:h}=d,v=r.useRef(0),b=r.useRef(null),[x,g]=r.useReducer(u.paginationReducer,{});return r.useEffect((()=>{v.current=0;const e=l.paginateSelectedItems(a,10,0);g({type:"paginate",data:e}),l.fetchFbStatusCollection(e,S,g,h,"set"),v.current+=1}),[]),r.useEffect((()=>{g({type:"filter",data:a})}),[a]),r.useEffect((()=>{const e=new IntersectionObserver((e=>{if(e[0].isIntersecting&&v.current>0){const e=l.paginateSelectedItems(a,10,v.current);g({type:"paginate",data:e}),l.fetchFbStatusCollection(e,S,g,h,"update"),v.current+=1}}),{threshold:1});return b.current&&e.observe(b.current),()=>{b.current&&e.unobserve(b.current)}}),[b,a]),e.jsxs("div",{children:[e.jsxs(i.SelectedScreenHeader,{children:[e.jsx(c.IconButton,{Icon:t.default,onClick:()=>{j("collections")}}),e.jsx(s.BodyCaption,{children:"Selected Products"})]}),e.jsxs("div",{children:[Object.keys(x).length>0?e.jsx(e.Fragment,{children:Object.keys(x).map((t=>{var r;return Object.keys((null===(r=null==x?void 0:x[t])||void 0===r?void 0:r.products)||[]).map((r=>{let c=!1;return(null==a?void 0:a.isCustom)&&(c=!0),e.jsx(o.ProductGroup,{upliftAdditions:null,collectionId:t,productId:r,data:x[t].products[r],isProductPartiallyChecked:l.isProductPartiallyChecked(t,r,a,null==f?void 0:f[t]),selectedData:a,selectedCollectionsDispatch:p,viewOnly:c,outOfStockAction:y},r)}))}))}):e.jsx(n.EmptyState,{title:"No Products Selected",subtitle:"Select products will appear here"}),e.jsx("div",{ref:b})]})]})};
|
|
@@ -3,6 +3,7 @@ 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;
|
|
6
7
|
}, never>;
|
|
7
8
|
export declare const CollectionCardInfoStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
8
9
|
export declare const CollectionCardDetailStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -1,17 +1,26 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../constants/Theme.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=i(e);const r=o.default.div`
|
|
2
2
|
display: flex;
|
|
3
3
|
background-color: white;
|
|
4
|
-
|
|
5
|
-
min-height: 600px;
|
|
4
|
+
height: 600px;
|
|
6
5
|
flex-direction: column;
|
|
7
6
|
`,l=o.default.div`
|
|
8
7
|
overflow-y: scroll;
|
|
9
8
|
overflow-x: hidden;
|
|
10
|
-
|
|
9
|
+
|
|
10
|
+
::-webkit-scrollbar {
|
|
11
|
+
display: block;
|
|
12
|
+
width: 8px;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
::-webkit-scrollbar-thumb {
|
|
16
|
+
background-color: #888;
|
|
17
|
+
border-radius: 8px;
|
|
18
|
+
}
|
|
19
|
+
`,n=o.default.div`
|
|
11
20
|
height: 64px;
|
|
12
21
|
background-color: ${e=>e.isDisabled?"#F0F0F0":e.isActive?t.COLORS.background.positive.light:"white"};
|
|
13
22
|
border-bottom: 1px solid #e0e0e0;
|
|
14
|
-
padding: 12px 24px;
|
|
23
|
+
padding: ${e=>e.usedInSearch?"12px 16px":"12px 24px"};
|
|
15
24
|
display: flex;
|
|
16
25
|
flex-direction: row;
|
|
17
26
|
column-gap: 16px;
|
|
@@ -21,7 +30,7 @@
|
|
|
21
30
|
cursor: pointer;
|
|
22
31
|
background-color: ${t.COLORS.surface.hovered};
|
|
23
32
|
}
|
|
24
|
-
`,
|
|
33
|
+
`,d=o.default.div`
|
|
25
34
|
display: flex;
|
|
26
35
|
flex-direction: row;
|
|
27
36
|
justify-content: center;
|
|
@@ -41,6 +50,9 @@
|
|
|
41
50
|
align-items: center;
|
|
42
51
|
padding: 8px 16px;
|
|
43
52
|
margin-top: 16px;
|
|
53
|
+
position: sticky;
|
|
54
|
+
top: 0;
|
|
55
|
+
z-index: 10;
|
|
44
56
|
`,c=o.default.div`
|
|
45
57
|
display: flex;
|
|
46
58
|
flex-direction: row;
|
|
@@ -49,7 +61,7 @@
|
|
|
49
61
|
border-bottom: 1px solid #e0e0e0;
|
|
50
62
|
align-items: center;
|
|
51
63
|
`,x=o.default.div`
|
|
52
|
-
height: 64px;
|
|
64
|
+
min-height: 64px;
|
|
53
65
|
background-color: ${e=>e.isActive?t.COLORS.background.positive.light:"white"};
|
|
54
66
|
border-bottom: 1px solid #e0e0e0;
|
|
55
67
|
padding: 12px 16px;
|
|
@@ -72,18 +84,26 @@
|
|
|
72
84
|
justify-content: flex-start;
|
|
73
85
|
align-items: center;
|
|
74
86
|
padding: 8px 16px;
|
|
75
|
-
|
|
87
|
+
position: sticky;
|
|
88
|
+
top: 0;
|
|
89
|
+
z-index: 10;
|
|
90
|
+
`,u=o.default.div`
|
|
76
91
|
display: flex;
|
|
77
92
|
flex-direction: column;
|
|
78
|
-
`,
|
|
79
|
-
height: 72px;
|
|
93
|
+
`,f=o.default.div`
|
|
94
|
+
min-height: 72px;
|
|
80
95
|
background: white;
|
|
81
96
|
padding: 12px 16px;
|
|
82
97
|
display: flex;
|
|
83
98
|
flex-direction: row;
|
|
84
|
-
gap: 16px;
|
|
85
99
|
align-items: center;
|
|
86
|
-
justify-content:
|
|
100
|
+
justify-content: space-between;
|
|
101
|
+
|
|
102
|
+
.text-container {
|
|
103
|
+
display: flex;
|
|
104
|
+
justify-content: space-between;
|
|
105
|
+
gap: 16px;
|
|
106
|
+
}
|
|
87
107
|
|
|
88
108
|
.tooltip-title-tag {
|
|
89
109
|
display: flex;
|
|
@@ -107,4 +127,4 @@
|
|
|
107
127
|
align-items: center;
|
|
108
128
|
border: 1px solid ${t.COLORS.stroke.primary};
|
|
109
129
|
border-radius: 4px;
|
|
110
|
-
`,exports.CollectionCardDetailStyle=a,exports.CollectionCardInfoStyle=
|
|
130
|
+
`,exports.CollectionCardDetailStyle=a,exports.CollectionCardInfoStyle=d,exports.CollectionCardStyle=n,exports.CollectionNameHolder=u,exports.ContainerStyle=r,exports.ProductCardStyle=x,exports.ProductScreenCollectionCardStyle=c,exports.ProductScreenHeader=p,exports.ScrollContainerStyle=l,exports.SelectedScreenHeader=s,exports.VariantCardGridStyle=g,exports.VariantCardListStyle=f;
|
|
@@ -1 +1,38 @@
|
|
|
1
|
+
import { Collection, FbStatusFetcherReturn, Product, SelectedItems } from './modal';
|
|
2
|
+
import { CollectionsActions } from './reducers';
|
|
1
3
|
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 o=require("lodash");function t(o,t,l){if(!o)return{};const i=Object.keys(o).slice(l,l+t),n={};return i.forEach((t=>{n[t]=o[t]})),n}const l=(o,t,l)=>{Object.keys(o).forEach((t=>{var l,i;const n=null!==(i=null===(l=o[t])||void 0===l?void 0:l.products)&&void 0!==i?i:{};Object.keys(n).forEach((l=>{var i,n,d,v;const s=null!==(v=null===(d=null===(n=null===(i=o[t])||void 0===i?void 0:i.products)||void 0===n?void 0:n[l])||void 0===d?void 0:d.variants)&&void 0!==v?v:{};Object.keys(s).forEach((i=>{var n,d,v,s;const e=null===(s=null===(v=null===(d=null===(n=o[t])||void 0===n?void 0:n.products)||void 0===d?void 0:d[l])||void 0===v?void 0:v.variants)||void 0===s?void 0:s[i];e&&!e.fbStatus&&(e.fbStatus="APPROVED")}))}))})),t({type:l,data:o})};exports.fetchFbStatusCollection=function(o,t,i,n){let d=arguments.length>4&&void 0!==arguments[4]?arguments[4]:"paged";n||l(o,i,d);const v=(o=>{const t=[];return Object.keys(o).forEach((l=>{var i,n;const d=null!==(n=null===(i=o[l])||void 0===i?void 0:i.products)&&void 0!==n?n:{};Object.keys(d).forEach((i=>{var n,d,v,s;const e=null!==(s=null===(v=null===(d=null===(n=o[l])||void 0===n?void 0:n.products)||void 0===d?void 0:d[i])||void 0===v?void 0:v.variants)&&void 0!==s?s:{};Object.keys(e).forEach((n=>{var d,v,s,e;const r=null===(e=null===(s=null===(v=null===(d=o[l])||void 0===d?void 0:d.products)||void 0===v?void 0:v[i])||void 0===s?void 0:s.variants)||void 0===e?void 0:e[n];(null==r?void 0:r.fbStatus)||t.push(n)}))}))})),t})(o);v.length>0&&n&&n(t,v).then((t=>{const l=Object.assign({},o);Object.keys(l).forEach((o=>{var i,n;const d=null!==(n=null===(i=l[o])||void 0===i?void 0:i.products)&&void 0!==n?n:{};Object.keys(d).forEach((i=>{var n,d,v,s;const e=null!==(s=null===(v=null===(d=null===(n=l[o])||void 0===n?void 0:n.products)||void 0===d?void 0:d[i])||void 0===v?void 0:v.variants)&&void 0!==s?s:{};Object.keys(e).forEach((n=>{var d,v,s,e;const r=null===(e=null===(s=null===(v=null===(d=l[o])||void 0===d?void 0:d.products)||void 0===v?void 0:v[i])||void 0===s?void 0:s.variants)||void 0===e?void 0:e[n];r&&"REJECTED"===t[n]?r.fbStatus="REJECTED":r&&"APPROVED"===t[n]&&(r.fbStatus="APPROVED")}))}))})),i({type:d,data:l})})).catch((t=>{console.error("Error in fbStatusFetcher",t),l(o,i,d)}))},exports.getVariantIdsToFetchAtProductLevel=(o,t)=>{const l=[];return Object.keys(null!=o?o:{}).forEach((i=>{var n,d;const v=null!==(d=null===(n=null==o?void 0:o[i])||void 0===n?void 0:n.variants)&&void 0!==d?d:{};Object.keys(v).forEach((n=>{var d,v,s,e,r;let u;u=t?null===(s=null===(v=null===(d=null==t?void 0:t.products)||void 0===d?void 0:d[i])||void 0===v?void 0:v.variants)||void 0===s?void 0:s[n]:null===(r=null===(e=null==o?void 0:o[i])||void 0===e?void 0:e.variants)||void 0===r?void 0:r[n],(null==u?void 0:u.fbStatus)||l.push(n)}))})),l},exports.isCollectionPartiallyChecked=(o,t,l)=>{var i;let n=0,d=0;if(l[o]){const v=null==t?void 0:t.products;v&&Object.keys(v).forEach((o=>{var t;const l=null===(t=v[o])||void 0===t?void 0:t.variants;l&&Object.keys(l).forEach((o=>n+=1))}));const s=null===(i=l[o])||void 0===i?void 0:i.products;return s&&Object.keys(s).forEach((o=>{var t;const l=null===(t=s[o])||void 0===t?void 0:t.variants;l&&Object.keys(l).forEach((o=>d+=1))})),!(n<=0&&d>0)&&(d>0&&n!==d)}return!1},exports.isProductPartiallyChecked=(o,t,l,i)=>{var n,d,v,s,e,r,u,c,a,p,f,b,O,h,y,j,E,k,g;let P=0,S=0;if(null===(d=null===(n=null==l?void 0:l[o])||void 0===n?void 0:n.products)||void 0===d?void 0:d[t]){const n=(null===(e=null===(s=null===(v=null==l?void 0:l[o])||void 0===v?void 0:v.products)||void 0===s?void 0:s[t])||void 0===e?void 0:e.variants)||[];if(1===Object.keys(n).length)for(const i in n){const n=null===(u=null===(r=null==l?void 0:l[o])||void 0===r?void 0:r.products)||void 0===u?void 0:u[t],d=null===(f=null===(p=null===(a=null===(c=null==l?void 0:l[o])||void 0===c?void 0:c.products)||void 0===a?void 0:a[t])||void 0===p?void 0:p.variants)||void 0===f?void 0:f[i];if(null===(b=null==d?void 0:d.name)||void 0===b?void 0:b.includes(null!==(O=null==n?void 0:n.name)&&void 0!==O?O:""))return!1}if(null===(j=Object.keys((null===(y=null===(h=null==i?void 0:i.products)||void 0===h?void 0:h[t])||void 0===y?void 0:y.variants)||[]))||void 0===j||j.forEach((()=>S++)),Object.keys((null===(g=null===(k=null===(E=null==l?void 0:l[o])||void 0===E?void 0:E.products)||void 0===k?void 0:k[t])||void 0===g?void 0:g.variants)||[]).forEach((()=>P++)),P>0&&S!==P)return!0}return!1},exports.liftTheStateUp=(t,l)=>{const i=o.cloneDeep(l);if(delete i.products,(t=Object.assign(Object.assign({},t),{catalogOnlyData:i})).productId&&l.products){const n=o.cloneDeep(l.products[t.productId]);(null==n?void 0:n.variants)&&delete n.variants,t=Object.assign(Object.assign({},t),{catalogOnlyData:i,productOnlyData:n})}return t},exports.markVariantsAsApprovedProductsLevel=(o,t,l,i,n)=>{const d=Object.assign({},o);if(Object.keys(o).forEach((t=>{var l,i;Object.keys(null!==(i=null===(l=null==o?void 0:o[t])||void 0===l?void 0:l.variants)&&void 0!==i?i:{}).forEach((l=>{var i,n;const v=null===(i=null==o?void 0:o[t].variants)||void 0===i?void 0:i[l];v&&(v.fbStatus="APPROVED");const s=null===(n=null==d?void 0:d[t])||void 0===n?void 0:n.variants;s&&s[l]&&(s[l]=v)}))})),i&&n){const o=Object.assign({},i);o.products=d,n(o),t({type:"productsPaged",data:{collectionId:l,products:d}})}else t({type:"productsPaged",data:{collectionId:l,products:d}})},exports.paginateSelectedItems=function(o,l,i){var n;const d={};let v=0;for(const s in o)if(Object.prototype.hasOwnProperty.call(o,s)){const e=o[s],r=t(e.products,l,i-v);r&&Object.keys(r).length>0&&(d[s]=Object.assign(Object.assign({},e),{products:r})),v+=Object.keys(null!==(n=e.products)&&void 0!==n?n:{}).length}return d},exports.shouldShowVariant=o=>{const t=Object.keys(o.variants||[]);let l=!1;return!(t.length<=1)||(t.forEach((t=>{var i,n;l=null!==(n=null===(i=o.variants)||void 0===i?void 0:i[t].name.includes(o.name))&&void 0!==n&&n})),!l)};
|
|
@@ -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"),i=require("../../assets/icons/drag_handle.svg.js"),r=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"),l=require("./style.js"),d=require("../tooltips/Tooltip.js");exports.VariantCardGridView=t=>{const{data:i}=t;return e.jsx(l.VariantCardGridStyle,{children:e.jsx(d.Tooltip,Object.assign({body:i.name,alwaysVisible:!1,variant:"dark",placement:"bottom"},{children:e.jsx(s.ShimmerImage,{width:72,height:72,imageUrl:i.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(l.VariantCardListStyle,{children:[e.jsxs("div",Object.assign({className:"text-container"},{children:[e.jsx(i.default,{width:24,height:24,color:r.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(d.Tooltip,Object.assign({body:g(!1),placement:"bottom",delay:400,variant:"light"},{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:r.COLORS.content.placeholder}),onClick:()=>{h&&h({type:"variantUnselected",data:{productId:m.productId,variantId:m.variantId,collectionId:m.collectionId}}),u.onDelete&&u.onDelete()}})]})};
|
package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/PlusIcon.js"),r=require("lodash"),a=require("react"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/PlusIcon.js"),r=require("lodash"),a=require("react"),l=require("../../add-variableV2/AddVariableV2SideModal.js");require("../../../_virtual/_tslib.js"),require("../../add-variableV2/AddVariableV2.styled.js");var i=require("../../button/Button.js");require("../../icon-button/IconButton.js"),require("../../input/Input.js"),require("../../tooltips/Tooltip.js");var s=require("../../../constants/Theme.js");require("../../modals/modal.styled.js"),require("../../switch/Switch.js");var o=require("../../TypographyStyle.js"),n=require("../../product-picker-v2/modal.js"),d=require("../context/templateModalContext.js"),c=require("./EditWhatsAppTemplateV2.js"),u=require("./ProductBox.js");require("../../template-preview/TemplatePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js"),require("../../curtain/CurtainHelper.js"),require("../../template-preview/models/TemplateMeta.js");var p=require("../../template-preview/models/WhatsAppTemplate.js");exports.default=m=>{let{template:h,whatsappSpecificPickerMeta:g,showVariableModal:v,variableList:j,variableListForImage:b,discountCode:x,setDiscountCode:y}=m;var f,C;const{selectedCarouselIndex:q,setTemplate:I,pickerConf:O,isProductCarouselType:w,pod:P,cardCount:T,carouselProducts:S,setCarouselProducts:k,isError:B,cardImages:V,disableEditVariable:L,onDeleteSelectedProducts:A}=d.useTemplateModalContext(),[M,E]=a.useState(-1==q?"First Message (Step 1/2)":"Carousel Cards (Step 2/2)"),[F,D]=a.useState(!1),[R,W]=a.useState(!1),[_,z]=a.useState(!1);a.useEffect((()=>{E(-1==q?"First Message (Step 1/2)":"Carousel Cards (Step 2/2)")}),[q]);return e.jsxs("div",{children:[e.jsx(o.TitleMedium,Object.assign({style:{marginLeft:10,marginBottom:10}},{children:M})),w&&(null!==(f=null==S?void 0:S.length)&&void 0!==f?f:0)>0&&null!=q&&q>=0&&e.jsxs("div",Object.assign({style:{display:"flex",rowGap:16,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[e.jsx(u.ProductBox,{editItem:()=>{1===(null==S?void 0:S.length)&&"variable"===S[0].name?z(!0):D(!F)},cardBody:1===(null==S?void 0:S.length)&&"variable"===S[0].name?`${S[0].productName}`:`${null==S?void 0:S.length} Products Selected`,hideIcon:1===(null==S?void 0:S.length)&&"variable"===S[0].name,deleteItem:()=>{if(1===(null==S?void 0:S.length)&&"variable"===S[0].name)return void(null==k||k([]));const e=r.cloneDeep(Object.assign({},h));e&&(null==V||V.forEach(((t,r)=>{var a;e.components[1].cards[r].components[0].example.header_handle=[null!==(a=V[r])&&void 0!==a?a:""]})),null==I||I(e)),null==k||k([]),null==A||A()}}),S&&(null==S?void 0:S.length)>0&&"variable"!=S[0].name&&e.jsx(i.Button,{disabled:(null!==(C=null==S?void 0:S.length)&&void 0!==C?C:0)<=1,style:{alignSelf:"flex-end",background:s.COLORS.surface.subdued},onClick:()=>{W(!0),D(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!L&&w&&0===(null==S?void 0:S.length)&&null!=q&&q>=0&&e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{marginLeft:12}},{children:[e.jsx(o.TitleRegular,{children:"Product(s)"}),e.jsx(o.BodySecondary,{children:`Select ${null!=T?T:1} products`})]})),e.jsxs("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:12,marginRight:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[e.jsx(i.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:B?`2px dashed ${s.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:B?"tertiaryGray":"dashBold",LeadingIcon:t.default,onClick:e=>{D(!0)}}),P===p.POD.CHATBOT&&e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{display:"flex",flex:1,alignItems:"center",justifyContent:"space-between",flexDirection:"row",width:"100%"}},{children:[e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginRight:8}}),e.jsx(o.BodyCaption,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8}})]})),e.jsx(i.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%"},size:"medium",buttonText:"Add Product(s) Variable",buttonType:"dashBold",LeadingIcon:t.default,onClick:e=>{z(!0)}})]})]}))]}),e.jsx(c.default,{whatsappSpecificPickerMeta:g,template:h,onTemplateChange:e=>{null==I||I(e)},showVariableModal:v,variableList:j,variableListForImage:b,discountCode:x,setDiscountCode:y}),F&&O&&e.jsx(n.ProductPickerModal,{zIndex:200,rearrangeEnabled:R,storeId:O.storeId,selectedItems:(e=>{if(e.length>0){const t={};for(const r of e){const e=null==r?void 0:r.collectionId,a=r.productId,l=r.variantId;e in t||(t[e]={products:{},name:"",image:"",isSmartCollection:!1}),a in t[e].products||(t[e].products[a]={variants:{},name:(null==r?void 0:r.productName)||"",image:(null==r?void 0:r.productImage)||""}),t[e].products[a].variants[l]={name:(null==r?void 0:r.name)||"",price:"",image:(null==r?void 0:r.image)||"",quantity:r.quantity||0,displayOrder:r.displayOrder}}return t}return{}})(null!=S?S:[]),collectionFetcher:O.fetchCollections,productFetcher:O.fetchProducts,onAdd:(e,t)=>{W(!1);const a=[];delete e.isCustom;for(const t of Object.keys(e)){const r=e[t].products;if(void 0!==r&&Object.keys(r).length)for(const e of Object.keys(r)){const l=r[e].variants;if(void 0!==l&&Object.keys(l).length)for(const i of Object.keys(l)){const{name:s,image:o,quantity:n,displayOrder:d}=l[i],c={name:s,image:o,quantity:n,variantId:i,productId:e,displayOrder:d,collectionId:t,productName:r[e].name,productImage:r[e].image};a.push(c)}}}const l=a.sort(((e,t)=>e.displayOrder-t.displayOrder)),i=a.map((e=>e.image)),s=r.cloneDeep(Object.assign({},h));s&&(i.forEach(((e,t)=>{var r;s.components[1].cards[t].components[0].example.header_handle=e?[e]:[null!==(r=null==V?void 0:V[t])&&void 0!==r?r:""]})),null==I||I(s)),null==k||k(l),D(!1)},searchInCollectionFetcher:O.searchInCollection,searchFetcher:O.searchProducts,visible:F,onClose:()=>{D(!1)},exactLimit:null!=T?T:1}),_&&e.jsx(l.AddVariableV2SideModal,{zIndex:2e3,data:null!=j?j:[],showVariable:_,setShowVariable:z,placeholder:"Add a variable",customTrigger:e=>{null==k||k([{name:"variable",productName:e.actualValue}])}})]})};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/box.svg.js"),i=require("../../../assets/icons/delete.svg.js"),n=require("../../../assets/icons/edit.svg.js"),s=require("styled-components"),o=require("../../icon-button/IconButton.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/box.svg.js"),i=require("../../../assets/icons/delete.svg.js"),n=require("../../../assets/icons/edit.svg.js"),s=require("styled-components"),o=require("../../icon-button/IconButton.js"),l=require("../../TypographyStyle.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const c=r(s).default.div`
|
|
2
2
|
width: ${e=>e.width};
|
|
3
3
|
padding: 12px;
|
|
4
4
|
display: flex;
|
|
@@ -44,4 +44,4 @@
|
|
|
44
44
|
color: #000000;
|
|
45
45
|
}
|
|
46
46
|
}
|
|
47
|
-
`;exports.ProductBox=s=>{const{cardBody:
|
|
47
|
+
`;exports.ProductBox=s=>{const{cardBody:r,deleteItem:d,editItem:a,hideIcon:f}=s;return e.jsxs(c,Object.assign({width:"100%"},{children:[!f&&e.jsx("div",Object.assign({style:{width:36,height:36}},{children:e.jsx(t.default,{})})),e.jsx("div",Object.assign({className:"card-body"},{children:e.jsx(l.TitleSmall,{children:r})})),e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center"}},{children:[a&&e.jsx(o.IconButton,{style:{display:"flex"},Icon:n.default,onClick:e=>{a(),e.stopPropagation()}}),e.jsx(o.IconButton,{style:{display:"flex",color:"#919191"},Icon:i.default,onClick:e=>{d(),e.stopPropagation()}})]}))]}))};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{jsx as r,Fragment as i}from"react/jsx-runtime";import{BikShimmer as m}from"../shimmer/ShimmerComponent/BikShimmer.js";const t=t=>{const{limit:e}=t;return r(i,{children:Array.from({length:null!=e?e:5}).map(((i,t)=>r("div",Object.assign({style:{borderBottom:"1px solid #E0E0E0"}},{children:r(m,{boxes:[{height:"64px",width:"100%",marginTop:"0px"}]})}),t)))})};export{t as ProductPickerShimmer};
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { Product, ProductVariant } from './modal';
|
|
2
|
+
import { OUT_OF_STOCK_ACTION } from './type';
|
|
3
|
+
export type ProductPickerTagType = {
|
|
4
|
+
isVariant: boolean;
|
|
5
|
+
data: Product | ProductVariant;
|
|
6
|
+
outOfStockAction?: OUT_OF_STOCK_ACTION;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Used in Product Screen, Search Screen, Selected Screen and Rearrange Screen.
|
|
10
|
+
* Wherever product card is shown, we use this component.
|
|
11
|
+
*
|
|
12
|
+
* New logic: When product has only one variant and variant name is same as product name,
|
|
13
|
+
* we consider that a variant and do operations as variant.
|
|
14
|
+
*
|
|
15
|
+
* Note: If there is no Fb rejected tag in the variant, we show a shimmer,
|
|
16
|
+
* meanwhile hit the API to get FB status.
|
|
17
|
+
*
|
|
18
|
+
*/
|
|
19
|
+
export declare const ProductPickerTag: (props: ProductPickerTagType) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
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};
|
|
@@ -13,6 +13,7 @@ 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>>;
|
|
16
17
|
setScreen: React.Dispatch<React.SetStateAction<string>>;
|
|
17
18
|
collectionsDispatch: React.Dispatch<CollectionsActions>;
|
|
18
19
|
setSaveDisabled: React.Dispatch<boolean>;
|
|
@@ -25,4 +26,22 @@ interface CollectionsScreenInterface {
|
|
|
25
26
|
pickerType?: 'COLLECTION' | 'PRODUCT';
|
|
26
27
|
}
|
|
27
28
|
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;
|
|
28
47
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t,Fragment as
|
|
1
|
+
import{jsxs as e,jsx as t,Fragment as i}from"react/jsx-runtime";import o from"../../assets/icons/chevronRight.svg.js";import{useRef as c,useState as l,useEffect as s}from"react";import{CheckBox as n}from"../checkBox/CheckBox.js";import{IconButton as r}from"../icon-button/IconButton.js";import{Tag as d}from"../tag/Tag.js";import{Tooltip as a}from"../tooltips/Tooltip.js";import{TitleRegular as u,BodyPrimary as h}from"../TypographyStyle.js";import{EmptyState as p}from"./emptyState.js";import{ProductPickerShimmer as m}from"./ProductPickerShimmer.js";import{CollectionCardStyle as C,CollectionCardInfoStyle as g,CollectionCardDetailStyle as y,CollectionNameHolder as b}from"./style.js";import{isCollectionPartiallyChecked as f}from"./utility.js";const k=(e,t,i)=>{if(e.length<=t)return e;const o=e.slice(0,t-1);return(i?o.slice(0,o.lastIndexOf(" ")):o)+"..."},v=i=>{const{customCollectionRestriction:o,dataLoading:n,collections:r,selectedCollectionsDispatch:d,setCollectionId:a,setSelectedCollectionId:u,selectedCollections:h,setScreen:C,collectionFetcher:g,collectionsDispatch:y,pagingControls:b,storeId:k,setSaveDisabled:v,hideCollectionCheckbox:I,renderWithoutModal:O,pickerType:S}=i,P=c(null),x=c(b.curPage),D=!!o&&(null==h?void 0:h.isCustom),[T,L]=l(!1),R=c(!1);return s((()=>{x.current=b.curPage}),[b.curPage]),s((()=>{const e=new IntersectionObserver((e=>{e[0].isIntersecting&&x.current>0&&!R.current&&(v(!0),L(!0),g(x.current,k).then((e=>{y({type:"paged",data:(null==e?void 0:e.collections)||{}}),b.setCurPage(x.current+1),L(!1),v(!1),Object.keys(e).length||(R.current=!0)})).catch())}),{threshold:1});return P.current&&e.observe(P.current),()=>{P.current&&e.unobserve(P.current)}}),[P]),e("div",{children:[Object.keys(r).length?Object.keys(r).map((e=>t(j,{customCollectionRestriction:o,data:r[e],isDisabled:D&&!(null==h?void 0:h[e]),isChecked:!!(null==h?void 0:h[e]),isPartiallyChecked:f(e,null==r?void 0:r[e],h),selectedCollectionsDispatch:d,setCollectionId:a,setSelectedCollectionId:u,setScreen:C,id:e,hideCollectionCheckbox:I||"-1"===e,selectedCollections:h,renderWithoutModal:O,pickerType:S},e))):n?t(m,{}):t(p,{title:"No collections to show",subtitle:"We couldn’t find any collection."}),t("div",{ref:P}),T&&t(m,{})]})},j=c=>{const{customCollectionRestriction:l,data:s,selectedCollectionsDispatch:p,setCollectionId:m,setSelectedCollectionId:f,isPartiallyChecked:k,setScreen:v,id:j,isChecked:I,isDisabled:O,hideCollectionCheckbox:S,pickerType:P,selectedCollections:x,usedInSearch:D}=c;return e(C,Object.assign({isDisabled:O,onClick:e=>{if(!O){if("COLLECTION"===P)return e.stopPropagation(),p({type:"reset",data:{}}),p({type:"selected",data:{id:j,val:s,isRestricted:l}}),void m(j);m(j),v("products")}},isActive:!!x[j],usedInSearch:null!=D&&D},{children:[e(g,{children:[!S&&t(n,{isDisabled:O,isChecked:I,isPartiallyChecked:k,onValueChange:function(e,t,i){null==i||i.stopPropagation(),p(e?{type:"selected",data:{id:j,val:s,isRestricted:l}}:{type:"unselected",data:{id:j}}),f(e?j:"")}}),t(y,{children:t(a,Object.assign({body:s.name,placement:"bottom",delay:400,variant:"light"},{children:e(b,{children:[t(D?h:u,Object.assign({numberOfLines:1},{children:s.name})),s.isSmartCollection?t("div",Object.assign({style:{display:"flex"}},{children:t(d,{tagText:"Smart Collection",type:"warning"})})):t(i,{})]})}))})]}),"COLLECTION"!==P&&t(r,{height:12,width:12,disabled:O,Icon:o})]}))};export{j as CollectionCard,v as CollectionsScreen,k as truncate};
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { TagType } from "../../tag/model";
|
|
1
2
|
import { Product, ProductVariant, SelectedItems } from '../modal';
|
|
2
3
|
import { OUT_OF_STOCK_ACTION } from '../type';
|
|
3
4
|
import { ProductVariantForRearrange } from '../variant';
|
|
@@ -31,6 +32,10 @@ export declare class ProductHelper {
|
|
|
31
32
|
* @param outOfStockAction
|
|
32
33
|
*/
|
|
33
34
|
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;
|
|
34
39
|
}
|
|
35
40
|
/**
|
|
36
41
|
* 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"};class
|
|
1
|
+
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};
|
|
@@ -7,10 +7,13 @@ export interface ProductVariant {
|
|
|
7
7
|
quantity: number;
|
|
8
8
|
skipSync?: boolean;
|
|
9
9
|
displayOrder?: number | null;
|
|
10
|
+
fbStatus?: FbProductStatus;
|
|
11
|
+
description?: string;
|
|
10
12
|
}
|
|
11
13
|
export interface Product {
|
|
12
14
|
name: string;
|
|
13
15
|
image: string;
|
|
16
|
+
description?: string;
|
|
14
17
|
variants?: {
|
|
15
18
|
[key: string]: ProductVariant;
|
|
16
19
|
};
|
|
@@ -26,6 +29,10 @@ export interface Collection {
|
|
|
26
29
|
export type SelectedItems = {
|
|
27
30
|
[key: string]: Collection;
|
|
28
31
|
};
|
|
32
|
+
export type SearchedItems = {
|
|
33
|
+
collections: SelectedItems;
|
|
34
|
+
products: SelectedItems;
|
|
35
|
+
};
|
|
29
36
|
export type CollectionFetcherReturn = Promise<{
|
|
30
37
|
collections: {
|
|
31
38
|
[key: string]: {
|
|
@@ -38,6 +45,10 @@ export type CollectionFetcherReturn = Promise<{
|
|
|
38
45
|
export type ProductFetcherReturn = Promise<{
|
|
39
46
|
[key: string]: Product;
|
|
40
47
|
}>;
|
|
48
|
+
export type FbStatusFetcherReturn = Promise<{
|
|
49
|
+
[key: string]: FbProductStatus;
|
|
50
|
+
}>;
|
|
51
|
+
export type FbProductStatus = 'APPROVED' | 'REJECTED';
|
|
41
52
|
export declare enum ScreenName {
|
|
42
53
|
Collections = "collections",
|
|
43
54
|
RearrangeProducts = "rearrange",
|
|
@@ -49,10 +60,11 @@ export type ProductPickerInterface = {
|
|
|
49
60
|
hideGlobalSearch?: boolean;
|
|
50
61
|
hideInCollectionSearch?: boolean;
|
|
51
62
|
customCollectionRestriction?: boolean;
|
|
52
|
-
searchInCollectionFetcher: (storeId: string, collectionId: string, query: string) =>
|
|
53
|
-
searchFetcher: (storeId: string, query: string) => Promise<SelectedItems>;
|
|
63
|
+
searchInCollectionFetcher: (storeId: string, collectionId: string, query: string) => ProductFetcherReturn;
|
|
64
|
+
searchFetcher: (storeId: string, query: string) => Promise<SearchedItems | SelectedItems>;
|
|
54
65
|
collectionFetcher: (offset: number, storeId: string) => CollectionFetcherReturn;
|
|
55
|
-
productFetcher: (collectionId: string, storeId: string) => ProductFetcherReturn;
|
|
66
|
+
productFetcher: (collectionId: string, storeId: string, limit?: number, offset?: number) => ProductFetcherReturn;
|
|
67
|
+
fbStatusFetcher?: (storeId: string, variantIds: string[]) => FbStatusFetcherReturn;
|
|
56
68
|
storeId: string;
|
|
57
69
|
selectedItems: SelectedItems;
|
|
58
70
|
onAdd: (items: SelectedItems, total: number) => void;
|
|
@@ -77,6 +89,7 @@ export type ProductPickerInterface = {
|
|
|
77
89
|
rearrangeEnabled?: boolean;
|
|
78
90
|
selectSingleItem?: boolean;
|
|
79
91
|
stickyFooter?: boolean;
|
|
92
|
+
showProductDetails?: boolean;
|
|
80
93
|
} & ({
|
|
81
94
|
startupScreen: ScreenName.RearrangeProducts;
|
|
82
95
|
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 s,useRef as i,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{ProductInfoOverlay as C}from"./productInfoOverlay.js";import{ProductsScreen as g}from"./productScreen.js";import{RearrangeScreen as b}from"./rearrangeScreen.js";import{collectionsReducer as f,searchReducer as y,selectedColectionsReducer as S,CollectionIdContext as v}from"./reducers.js";import{SearchScreen as k}from"./searchScreen.js";import{SelectedScreen as P}from"./selectedScreen.js";import{ContainerStyle as x,ScrollContainerStyle as j}from"./style.js";import{OUT_OF_STOCK_ACTION as I}from"./type.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:D,selectedItems:O,onClose:w,visible:R,zIndex:E,exactLimit:A,limit:$,hideCollectionCheckbox:V,hideProductCheckbox:B,outOfStockAction:L=I.BLUR,hideVariantCheckbox:M,selectProductsFromCustomCollection:z,hideSelectionCount:W,title:G,width:H,renderWithoutModal:Y,onClickSave:K,pickerType:U,hideProductVariants:q=!1,startupScreen:J=F.Collections,rearrangeEnabled:N,selectSingleItem:Q=!1,showProductDetails:X}=T,[Z,_]=r(f,{}),[ee,te]=s([F.Collections,F.RearrangeProducts].includes(J)?J:F.Collections),[oe,ce]=s("grid"),[re,se]=s(""),[ie,ne]=s(""),[le,de]=s(0),[ae,ue]=s(!1),[he,pe]=s(0),[me,Ce]=s(""),[ge,be]=s(!1),[fe,ye]=s(!1),[Se,ve]=r(y,{collections:{},products:{}}),[ke,Pe]=r(S,Object.keys(O).length>0?O:{}),xe=i(null),[je,Ie]=s(!1),[Fe,Te]=s();n((()=>{ue(!0),ye(!0),T.collectionFetcher(le,D).then((e=>{_({type:"fetched",data:(null==e?void 0:e.collections)||{}}),ue(!1),de((e=>e+1)),ye(!1)})).catch()}),[]),n((()=>{let e=0;Object.keys(ke||[]).forEach((t=>{var o;Object.keys((null===(o=ke[t])||void 0===o?void 0:o.products)||[]).forEach((o=>{var c,r;Object.keys((null===(r=null===(c=ke[t].products)||void 0===c?void 0:c[o])||void 0===r?void 0:r.variants)||[]).forEach((()=>{e+=1}))}))})),pe(e)})),n((()=>{ie&&(ue(!0),T.productFetcher(ie,D).then((e=>{Object.keys(e).length&&_({type:"productsFetched",data:{collectionId:ie,products:e}}),ue(!1)})).catch())}),[ie]),n((()=>{const e=setTimeout((()=>{"rearrange"!==ee&&(me.length?(be(!0),T.searchFetcher(D,me).then((e=>{"collections"in e&&"products"in e?(ve({type:"set",data:e}),_({type:"searched",data:e.collections})):(ve({type:"set",data:{collections:{},products:e}}),_({type:"searched",data:e})),te("searchProducts"),ue(!1),be(!1)}))):te("collections"))}),800);return()=>clearTimeout(e)}),[me]),n((()=>{K&&(T.onAdd(ke,he),De())}),[K]),n((()=>{Q&&Object.keys(ke||{}).length&&he&&(T.onAdd(ke,he),De())}),[Q,ke,he]);const De=()=>{Pe({type:"reset",data:{}})},Oe=e(x,{children:[T.postHeader&&t("div",Object.assign({style:{padding:"0 24px"}},{children:T.postHeader})),!T.hideGlobalSearch&&t(o,{children:("collections"===ee||"searchProducts"===ee)&&t("div",Object.assign({style:{padding:Y?"8px 16px":"12px 24px",borderBottom:"1px solid #E0E0E0"}},{children:t(a,{noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>ge?t(h,{size:"small",color:l.content.primary}):t(c,{})},id:"listInput",height:"24px",type:"text",value:me,onChangeText:e=>{e.length&&e.trim().length?Ce(e):Ce("")}})}))}),e(j,Object.assign({ref:xe},{children:["collections"===ee&&t(m,{customCollectionRestriction:T.customCollectionRestriction,dataLoading:fe,collections:Z,selectedCollectionsDispatch:Pe,setCollectionId:se,setSelectedCollectionId:ne,setScreen:te,selectedCollections:ke,collectionFetcher:T.collectionFetcher,storeId:D,collectionsDispatch:_,setSaveDisabled:ue,pagingControls:{curPage:le,setCurPage:de},hideCollectionCheckbox:V,renderWithoutModal:Y,pickerType:U}),"products"===ee&&re&&t(v.Provider,Object.assign({value:re},{children:t(g,{hideInCollectionSearch:T.hideInCollectionSearch,customCollectionRestriction:T.customCollectionRestriction,productFetcher:T.productFetcher,setScreen:te,storeId:D,data:Z[re],collectionsDispatch:_,selectedCollectionsDispatch:Pe,selectedData:ke,setSaveDisabled:ue,searchInCollectionFetcher:T.searchInCollectionFetcher,hideProductCheckbox:B,outOfStockAction:L,hideVariantCheckbox:M,selectProductsFromCustomCollection:z,renderWithoutModal:Y,pickerType:U,hideProductVariants:q,fbStatusFetcher:T.fbStatusFetcher,onProductDetailClick:e=>{Ie(!0),Te(e)},showProductDetailInfoIcon:X})})),"view"===ee&&t(P,{selectedCollections:ke||{},selectedCollectionsDispatch:Pe,setScreen:te,collections:Z,outOfStockAction:L,storeId:D,fbStatusFetcher:T.fbStatusFetcher}),"rearrange"===ee&&t(b,{selectedCollections:ke||{},selectedCollectionsDispatch:Pe,setScreen:te,outOfStockAction:L,rearrangeViewType:"grid"===oe?"list":"grid",scrollContainerRef:xe,storeId:D,fbStatusFetcher:T.fbStatusFetcher}),"searchProducts"===ee&&t(k,{customCollectionRestriction:T.customCollectionRestriction,selectedCollections:ke||{},searchedCollections:Se||{},searchedCollectionsDispatch:ve,selectedCollectionsDispatch:Pe,setScreen:te,collections:Z,onBackPress:()=>{Ce(""),ve({type:"set",data:{collections:{},products:{}}})},pickerType:U,hideProductCheckbox:B,hideProductVariants:q,hideVariantCheckbox:M,storeId:D,fbStatusFetcher:T.fbStatusFetcher,setCollectionId:se,setSelectedCollectionId:ne,renderWithoutModal:Y,hideCollectionCheckbox:V})]}))]});return t(o,{children:Y?Oe:e(u,Object.assign({zIndex:E,open:R,onClose:()=>{null==w||w(),De()},headingTitle:G||("collections"===ee||"products"===ee?"Select Products":"view"===ee?"Selected Products":"searchProducts"===ee?"Searched Products":"rearrange"===ee?"Rearrange Products":void 0),footerShadow:!0,centralContainerStyles:{width:H||"600px"},headerRightCustomElement:"rearrange"===ee?(console.log("ignore:",ce),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:ae?"Loading...":ee===F.RearrangeProducts?"Done":"Add",disabled:ae||he<1||A&&he<A||!A&&$&&he>$||!1,onClick:()=>{T.onAdd(ke,he),De()}},wrapperStyle:T.stickyFooter?{height:"calc(100vh - 168px)"}:void 0,footerLeftCustomElement:W?t(o,{}):A&&he>A?t(p,{tagText:`You can only select ${A} products`,type:"negative"}):$&&he>$?t(p,{tagText:`You can only select ${$} products`,type:"negative"}):t(d,he>0?{onClick:()=>{te(N?F.RearrangeProducts:F.SelectedProducts)},buttonText:A?`${he}/${A} products selected`:`${he} products selected`,buttonType:["rearrange","view"].includes(ee)?"tertiaryGray":"tertiary",disabled:["rearrange","view"].includes(ee)}:{disabled:!0,buttonText:A?`${he}/${A} products selected`:`${he} products selected`,buttonType:"tertiaryGray"}),hideCrossButton:je},{children:[Oe,je&&Fe?t(C,{productData:Fe,outOfStockAction:L,onClose:()=>{Ie(!1)}}):t(o,{})]}))})};export{T as ProductPickerModal,F as ScreenName};
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { Product, ProductVariant, SelectedItems } from './modal';
|
|
3
|
+
import { SelectedCollectionsActions } from './reducers';
|
|
4
|
+
import { OUT_OF_STOCK_ACTION } from './type';
|
|
5
|
+
interface ProductGroupInterface {
|
|
6
|
+
collectionId: string;
|
|
7
|
+
productId: string;
|
|
8
|
+
data: Product;
|
|
9
|
+
selectedData: SelectedItems;
|
|
10
|
+
selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
|
|
11
|
+
viewOnly: boolean;
|
|
12
|
+
isProductPartiallyChecked?: boolean;
|
|
13
|
+
upliftAdditions: any;
|
|
14
|
+
hideProductCheckbox?: boolean;
|
|
15
|
+
outOfStockAction?: OUT_OF_STOCK_ACTION;
|
|
16
|
+
hideVariantCheckbox?: boolean;
|
|
17
|
+
hideProductVariants?: boolean;
|
|
18
|
+
showProductDetailInfoIcon?: boolean;
|
|
19
|
+
pickerType?: 'COLLECTION' | 'PRODUCT';
|
|
20
|
+
onProductDetailClick?: (productData: Product | ProductVariant) => void;
|
|
21
|
+
}
|
|
22
|
+
export declare const ProductGroup: (props: ProductGroupInterface) => import("react/jsx-runtime").JSX.Element;
|
|
23
|
+
interface ProductCardInterface {
|
|
24
|
+
isVariant: boolean;
|
|
25
|
+
data: Product | ProductVariant;
|
|
26
|
+
productId: string;
|
|
27
|
+
collectionId: string;
|
|
28
|
+
variantId?: string;
|
|
29
|
+
isSelected: boolean;
|
|
30
|
+
selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
|
|
31
|
+
viewOnly: boolean;
|
|
32
|
+
isPartiallyChecked?: boolean;
|
|
33
|
+
upliftAdditions: any;
|
|
34
|
+
hideProductCheckbox?: boolean;
|
|
35
|
+
outOfStockAction?: OUT_OF_STOCK_ACTION;
|
|
36
|
+
hideVariantCheckbox?: boolean;
|
|
37
|
+
hideProductVariants?: boolean;
|
|
38
|
+
showProductDetailInfoIcon?: boolean;
|
|
39
|
+
pickerType?: 'COLLECTION' | 'PRODUCT';
|
|
40
|
+
onProductDetailClick?: (productData: Product | ProductVariant) => void;
|
|
41
|
+
}
|
|
42
|
+
export declare const ProductCard: (props: ProductCardInterface) => import("react/jsx-runtime").JSX.Element;
|
|
43
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{jsxs as t,jsx as i,Fragment as o}from"react/jsx-runtime";import{COLORS as e}from"../../constants/Theme.js";import c from"../../assets/icons/info.svg.js";import{CheckBox as d}from"../checkBox/CheckBox.js";import{IconButton as n}from"../icon-button/IconButton.js";import{ShimmerImage as l}from"../shimmer-image/ShimmerImage.js";import{Tooltip as a}from"../tooltips/Tooltip.js";import{BodyPrimary as r}from"../TypographyStyle.js";import{ProductPickerTag as s}from"./ProductPickerTag.js";import{ProductCardStyle as u}from"./style.js";import{shouldShowVariant as p}from"./utility.js";const h=o=>{const{collectionId:e,productId:c,data:d,selectedData:n,selectedCollectionsDispatch:l,viewOnly:a,upliftAdditions:r,isProductPartiallyChecked:s,hideProductCheckbox:u,outOfStockAction:h,hideVariantCheckbox:m,hideProductVariants:I,pickerType:f,onProductDetailClick:k,showProductDetailInfoIcon:y}=o,C=t=>{var i,o,d,l,a,r;if(!(null===(o=null===(i=null==n?void 0:n[e])||void 0===i?void 0:i.products)||void 0===o?void 0:o[c]))return!1;return!!(null===(r=null===(a=null===(l=null===(d=null==n?void 0:n[e])||void 0===d?void 0:d.products)||void 0===l?void 0:l[c])||void 0===a?void 0:a.variants)||void 0===r?void 0:r[t])};return t("div",{children:[i(v,{isVariant:!1,data:d,productId:c,collectionId:e,isSelected:!!(null===(b=null===(P=null==n?void 0:n[e])||void 0===P?void 0:P.products)||void 0===b?void 0:b[c]),isPartiallyChecked:s,selectedCollectionsDispatch:l,upliftAdditions:r,viewOnly:a,hideProductCheckbox:u,hideVariantCheckbox:m,hideProductVariants:I,pickerType:f,outOfStockAction:h,onProductDetailClick:k,showProductDetailInfoIcon:y},c),I?null:p(d)&&Object.keys(d.variants||[]).map((t=>i(v,{isVariant:!0,hideVariantCheckbox:m,data:d.variants[t],variantId:t,productId:c,viewOnly:a,upliftAdditions:r,collectionId:e,isSelected:C(t),selectedCollectionsDispatch:l,outOfStockAction:h,onProductDetailClick:k,showProductDetailInfoIcon:y},t)))]});var P,b},v=p=>{const{isVariant:h,data:v,productId:m,collectionId:I,variantId:f,isSelected:k,selectedCollectionsDispatch:y,viewOnly:C,upliftAdditions:P,isPartiallyChecked:b,hideProductCheckbox:j,outOfStockAction:g,hideVariantCheckbox:O,hideProductVariants:x,pickerType:D,onProductDetailClick:S,showProductDetailInfoIcon:V}=p;return t(u,Object.assign({isVariant:h,onClick:t=>{"PRODUCT"===D&&x&&(t.stopPropagation(),y({type:"reset",data:{}}),P("variantSelected",{productId:m,variantId:f||Object.keys(v.variants)[0],collectionId:I,variant:v}))},isActive:k},{children:[h&&!C&&!O||!h&&!C&&!j?i(d,{isChecked:k,isPartiallyChecked:b||!1,onValueChange:function(t){h?t?P("variantSelected",{productId:m,variantId:f,collectionId:I,variant:v}):y({type:"variantUnselected",data:{productId:m,variantId:f,collectionId:I}}):t?P("productSelected",{productId:m,collectionId:I,product:v}):y({type:"productUnselected",data:{productId:m,collectionId:I}})}}):i(o,{}),i("div",{children:i(l,{width:40,height:40,imageUrl:v.image,alt:"Item",borderRadius:4})}),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:[i(a,Object.assign({variant:"light",body:v.name,placement:"bottom",delay:400},{children:i(r,Object.assign({numberOfLines:1},{children:v.name}))})),V&&i(n,{onClick:()=>{null==S||S(v)},Icon:()=>i(c,{width:20,height:20,color:e.content.placeholder})})]})),i(s,{isVariant:h,data:v,outOfStockAction:g})]}))]}))};export{v as ProductCard,h as ProductGroup};
|