@bikdotai/bik-component-library 0.0.619 → 0.0.620-mldn.0
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/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
- package/dist/cjs/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.js +1 -1
- package/dist/cjs/components/multi-level-dropdown/GroupedMenuList.d.ts +8 -0
- package/dist/cjs/components/multi-level-dropdown/MenuItem.d.ts +8 -0
- package/dist/cjs/components/multi-level-dropdown/MenuList.d.ts +8 -0
- package/dist/cjs/components/multi-level-dropdown/MultiLevelDropdown.d.ts +3 -0
- package/dist/cjs/components/multi-level-dropdown/MultiLevelDropdown.styled.d.ts +17 -0
- package/dist/cjs/components/multi-level-dropdown/index.d.ts +1 -0
- package/dist/cjs/components/multi-level-dropdown/type.d.ts +25 -0
- package/dist/cjs/components/product-picker-v2/emptyState.js +1 -0
- package/dist/cjs/components/product-picker-v2/modal.d.ts +6 -1
- package/dist/cjs/components/product-picker-v2/modal.js +1 -1
- package/dist/cjs/components/product-picker-v2/productInfoOverlay.d.ts +2 -0
- package/dist/cjs/components/product-picker-v2/productInfoOverlay.js +8 -4
- package/dist/cjs/components/product-picker-v2/style.d.ts +1 -0
- package/dist/cjs/components/product-picker-v2/style.js +12 -5
- package/dist/cjs/components/product-picker-v2/type.d.ts +6 -0
- package/dist/cjs/components/shimmer-image/ShimmerImage.d.ts +1 -0
- package/dist/cjs/components/shimmer-image/ShimmerImage.js +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
- package/dist/esm/components/dropdown/OpenedDropdown/components/searchbox/SearchBox.js +1 -1
- package/dist/esm/components/multi-level-dropdown/GroupedMenuList.d.ts +8 -0
- package/dist/esm/components/multi-level-dropdown/MenuItem.d.ts +8 -0
- package/dist/esm/components/multi-level-dropdown/MenuList.d.ts +8 -0
- package/dist/esm/components/multi-level-dropdown/MultiLevelDropdown.d.ts +3 -0
- package/dist/esm/components/multi-level-dropdown/MultiLevelDropdown.styled.d.ts +17 -0
- package/dist/esm/components/multi-level-dropdown/index.d.ts +1 -0
- package/dist/esm/components/multi-level-dropdown/type.d.ts +25 -0
- package/dist/esm/components/product-picker-v2/emptyState.js +2 -1
- package/dist/esm/components/product-picker-v2/modal.d.ts +6 -1
- package/dist/esm/components/product-picker-v2/modal.js +1 -1
- package/dist/esm/components/product-picker-v2/productInfoOverlay.d.ts +2 -0
- package/dist/esm/components/product-picker-v2/productInfoOverlay.js +8 -4
- package/dist/esm/components/product-picker-v2/style.d.ts +1 -0
- package/dist/esm/components/product-picker-v2/style.js +10 -3
- package/dist/esm/components/product-picker-v2/type.d.ts +6 -0
- package/dist/esm/components/shimmer-image/ShimmerImage.d.ts +1 -0
- package/dist/esm/components/shimmer-image/ShimmerImage.js +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const EventsTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default EventsTrigger;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const IGTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default IGTrigger;
|
package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { DropdownOption } from "../../../dropdown/type";
|
|
3
|
-
import { QueryBuilderProperty } from "../../
|
|
4
|
-
import { QueryBuilderNodeProps } from "../../
|
|
3
|
+
import { QueryBuilderProperty } from "../../Types/QueryBuilder.type";
|
|
4
|
+
import { QueryBuilderNodeProps } from "../../Types/QueryBuilderNodeProps.type";
|
|
5
5
|
declare const BaseTriggerQueryBuilderNode: React.FC<QueryBuilderNodeProps & {
|
|
6
6
|
cacheKey: string;
|
|
7
7
|
propertyAddBtnText: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("../../../../input/Input.js"),s=require("../../../../input/context/InputStyleProvider.js"),n=require("../../../../../constants/Theme.js"),o=require("../../../../../assets/icons/cross.svg.js"),i=require("../../../../../assets/icons/search.svg.js");exports.SearchBox=a=>{let{onSearch:c,version:u}=a;const[l,p]=r.useState(""),[d,h]=r.useState(!1);return e.jsx(s.InputStyleContext.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:`${"2.0"===u?.5:1}px solid ${n.COLORS.stroke.primary}`,padding:""+("2.0"===u?"6px 8px":"14px 16px")},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:e.jsx(t.Input,{noKeyDownChange:!0,skipFocus:!0,placeholder:"Search",variant:"2.0"===u?"small":"default",leftIcon:{icon:()=>e.jsx(i.default,{width:"2.0"===u?18:24,height:"2.0"===u?18:24,color:n.COLORS.content.placeholder})},rightIcon:{icon:()=>l?e.jsx(o.default,{onClick:()=>{h(!0),c(""),p("")},width:24,height:24,color:n.COLORS.content.placeholder}):e.jsx(e.Fragment,{})},reset:d,onChangeText:e=>{h(!1),p(e),c(e)}})}))};
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("../../../../input/Input.js"),s=require("../../../../input/context/InputStyleProvider.js"),n=require("../../../../../constants/Theme.js"),o=require("../../../../../assets/icons/cross.svg.js"),i=require("../../../../../assets/icons/search.svg.js");exports.SearchBox=a=>{let{onSearch:c,version:u}=a;const[l,p]=r.useState(""),[d,h]=r.useState(!1);return e.jsx(s.InputStyleContext.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:`${"2.0"===u?.5:1}px solid ${n.COLORS.stroke.primary}`,padding:""+("2.0"===u?"6px 8px":"14px 16px")},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:e.jsx(t.Input,{noKeyDownChange:!0,skipFocus:!0,placeholder:"Search",variant:"2.0"===u?"small":"default",leftIcon:{icon:()=>e.jsx(i.default,{width:"2.0"===u?18:24,height:"2.0"===u?18:24,color:n.COLORS.content.placeholder})},rightIcon:{icon:()=>l?e.jsx(o.default,{onClick:()=>{h(!0),c(""),p("")},width:"2.0"===u?18:24,height:"2.0"===u?18:24,color:n.COLORS.content.placeholder}):e.jsx(e.Fragment,{})},reset:d,onChangeText:e=>{h(!1),p(e),c(e)}})}))};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { GroupedOption, MultiLevelDropdownOption } from './type';
|
|
3
|
+
export declare const GroupedMenuList: React.FC<{
|
|
4
|
+
width: string;
|
|
5
|
+
onDropdownItemClick: (option: MultiLevelDropdownOption, parents: MultiLevelDropdownOption[]) => void;
|
|
6
|
+
option: GroupedOption;
|
|
7
|
+
parents: MultiLevelDropdownOption[];
|
|
8
|
+
}>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { MultiLevelDropdownOption, SingleOption } from './type';
|
|
3
|
+
export declare const MenuItem: React.FC<{
|
|
4
|
+
width: string;
|
|
5
|
+
onDropdownItemClick: (option: MultiLevelDropdownOption, parents: MultiLevelDropdownOption[]) => void;
|
|
6
|
+
option: SingleOption;
|
|
7
|
+
parents: MultiLevelDropdownOption[];
|
|
8
|
+
}>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { MultiLevelDropdownOption } from './type';
|
|
3
|
+
export declare const MenuList: React.FC<{
|
|
4
|
+
width: string;
|
|
5
|
+
onDropdownItemClick: (option: MultiLevelDropdownOption, parents: MultiLevelDropdownOption[]) => void;
|
|
6
|
+
options: MultiLevelDropdownOption[];
|
|
7
|
+
parents: MultiLevelDropdownOption[];
|
|
8
|
+
}>;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
export declare const DropdownContainer: import("styled-components").StyledComponent<"div", any, {
|
|
2
|
+
width?: string | undefined;
|
|
3
|
+
}, never>;
|
|
4
|
+
export declare const NoResultsContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
5
|
+
export declare const GroupedMenuListContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
6
|
+
export declare const StyledMenuList: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
7
|
+
export declare const MenuItemWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
8
|
+
export interface MenuItemContainerProps {
|
|
9
|
+
isSelected?: boolean;
|
|
10
|
+
isHovered?: boolean;
|
|
11
|
+
isSubMenuOpen?: boolean;
|
|
12
|
+
isDisabled?: boolean;
|
|
13
|
+
}
|
|
14
|
+
export declare const MenuItemContainer: import("styled-components").StyledComponent<"div", any, MenuItemContainerProps, never>;
|
|
15
|
+
export declare const ContentContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
16
|
+
export declare const SubMenuWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
17
|
+
export declare const Container: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './MultiLevelDropdown';
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export interface MultiLevelDropdownProps {
|
|
3
|
+
options: MultiLevelDropdownOption[];
|
|
4
|
+
width?: string;
|
|
5
|
+
isSearchable?: boolean;
|
|
6
|
+
onDropdownItemClick: (option: MultiLevelDropdownOption, parents: MultiLevelDropdownOption[]) => void;
|
|
7
|
+
}
|
|
8
|
+
export type GroupedOption = {
|
|
9
|
+
label: string;
|
|
10
|
+
options: SingleOption[];
|
|
11
|
+
trailingIcon?: JSX.Element;
|
|
12
|
+
leadingIcon?: JSX.Element;
|
|
13
|
+
};
|
|
14
|
+
export type SingleOption = {
|
|
15
|
+
label: string;
|
|
16
|
+
value: string;
|
|
17
|
+
subText?: string;
|
|
18
|
+
trailingIcon?: JSX.Element;
|
|
19
|
+
leadingIcon?: JSX.Element;
|
|
20
|
+
customComponent?: JSX.Element;
|
|
21
|
+
disabled?: boolean;
|
|
22
|
+
selected?: boolean;
|
|
23
|
+
children?: SingleOption[];
|
|
24
|
+
};
|
|
25
|
+
export type MultiLevelDropdownOption = SingleOption | GroupedOption;
|
|
@@ -4,4 +4,5 @@
|
|
|
4
4
|
flex-direction: column;
|
|
5
5
|
align-items: center;
|
|
6
6
|
justify-content: center;
|
|
7
|
+
text-align: center;
|
|
7
8
|
`;exports.EmptyState=r=>{let{title:i,subtitle:l}=r;return e.jsxs(o,{children:[e.jsx(t.default,{width:48,height:48}),e.jsx(n.TitleRegular,Object.assign({style:{marginTop:8}},{children:i})),e.jsx(n.BodySecondary,Object.assign({style:{color:s.COLORS.content.secondary,marginTop:4}},{children:l}))]})};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { OUT_OF_STOCK_ACTION } from './type';
|
|
2
|
+
import { FooterForNonModalI, OUT_OF_STOCK_ACTION } from './type';
|
|
3
3
|
export interface ProductVariant {
|
|
4
4
|
name: string;
|
|
5
5
|
price: string;
|
|
@@ -10,6 +10,7 @@ export interface ProductVariant {
|
|
|
10
10
|
fbStatus?: FbProductStatus;
|
|
11
11
|
description?: string;
|
|
12
12
|
id?: string;
|
|
13
|
+
actualPrice?: string;
|
|
13
14
|
}
|
|
14
15
|
export interface Product {
|
|
15
16
|
name: string;
|
|
@@ -19,6 +20,8 @@ export interface Product {
|
|
|
19
20
|
[key: string]: ProductVariant;
|
|
20
21
|
};
|
|
21
22
|
id?: string;
|
|
23
|
+
handle?: string;
|
|
24
|
+
currency?: string;
|
|
22
25
|
}
|
|
23
26
|
export interface Collection {
|
|
24
27
|
name: string;
|
|
@@ -95,6 +98,8 @@ export type ProductPickerInterface = {
|
|
|
95
98
|
showProductDetails?: boolean;
|
|
96
99
|
containerStyle?: React.CSSProperties;
|
|
97
100
|
crossButtonInsideHeader?: boolean;
|
|
101
|
+
footerForNonModal?: FooterForNonModalI;
|
|
102
|
+
useDynamicInfoImageSize?: boolean;
|
|
98
103
|
} & ({
|
|
99
104
|
startupScreen: ScreenName.RearrangeProducts;
|
|
100
105
|
rearrangeEnabled: true;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react/jsx-runtime"),o=require("../../assets/icons/search.svg.js"),c=require("react"),r=require("../../constants/Theme.js"),s=require("../../assets/icons/cross.svg.js"),n=require("../button/Button.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react/jsx-runtime"),o=require("../../assets/icons/search.svg.js"),c=require("react"),r=require("../../constants/Theme.js"),s=require("../../assets/icons/cross.svg.js"),n=require("../button/Button.js"),i=require("../input/Input.js"),l=require("../modals/styledModal.js"),a=require("../spinner/Spinner.js"),d=require("../tag/Tag.js"),u=require("./collectionScreen.js"),h=require("./productInfoOverlay.js"),p=require("./productScreen.js"),S=require("./rearrangeScreen.js"),x=require("./reducers.js"),C=require("./searchScreen.js"),g=require("./selectedScreen.js"),j=require("./style.js"),y=require("./type.js");exports.ScreenName=void 0,(e=exports.ScreenName||(exports.ScreenName={})).Collections="collections",e.RearrangeProducts="rearrange",e.SelectedProducts="view",e.SearchProducts="searchProducts",e.Products="products";exports.ProductPickerModal=e=>{const{storeId:m,selectedItems:f,onClose:b,visible:v,zIndex:I,exactLimit:k,limit:P,hideCollectionCheckbox:O,hideProductCheckbox:F,outOfStockAction:R=y.OUT_OF_STOCK_ACTION.BLUR,hideVariantCheckbox:T,selectProductsFromCustomCollection:D,hideSelectionCount:q,title:E,width:N,left:w,renderWithoutModal:A,onClickSave:B,pickerType:L,hideProductVariants:M=!1,startupScreen:z=exports.ScreenName.Collections,rearrangeEnabled:V,selectSingleItem:$=!1,showProductDetails:_,containerStyle:H,crossButtonInsideHeader:W=!1,footerForNonModal:G={}}=e,[K,U]=c.useReducer(x.collectionsReducer,{}),[Y,J]=c.useState([exports.ScreenName.Collections,exports.ScreenName.RearrangeProducts].includes(z)?z:exports.ScreenName.Collections),[Q,X]=c.useState("grid"),[Z,ee]=c.useState(""),[te,oe]=c.useState(""),[ce,re]=c.useState(0),[se,ne]=c.useState(!1),[ie,le]=c.useState(0),[ae,de]=c.useState(""),[ue,he]=c.useState(!1),[pe,Se]=c.useState(!1),[xe,Ce]=c.useReducer(x.searchReducer,{collections:{},products:{}}),[ge,je]=c.useReducer(x.selectedColectionsReducer,Object.keys(f).length>0?f:{}),ye=c.useRef(null),[me,fe]=c.useState(!1),[be,ve]=c.useState();c.useEffect((()=>{ne(!0),Se(!0),e.collectionFetcher(ce,m).then((e=>{U({type:"fetched",data:(null==e?void 0:e.collections)||{}}),ne(!1),re((e=>e+1)),Se(!1)})).catch()}),[]),c.useEffect((()=>{let e=0;M?Object.keys(ge||[]).forEach((t=>{var o;Object.keys((null===(o=ge[t])||void 0===o?void 0:o.products)||[]).forEach((o=>{var c;"-1"!==t&&ge[-1]&&(null===(c=ge[-1].products)||void 0===c?void 0:c[o])||(e+=1)}))})):Object.keys(ge||[]).forEach((t=>{var o;Object.keys((null===(o=ge[t])||void 0===o?void 0:o.products)||[]).forEach((o=>{var c,r;Object.keys((null===(r=null===(c=ge[t].products)||void 0===c?void 0:c[o])||void 0===r?void 0:r.variants)||[]).forEach((()=>{e+=1}))}))})),le(e)}),[K,ge,M]),c.useEffect((()=>{te&&(ne(!0),e.productFetcher(te,m).then((e=>{Object.keys(e).length&&U({type:"productsFetched",data:{collectionId:te,products:e}}),ne(!1)})).catch())}),[te]),c.useEffect((()=>{const t=setTimeout((()=>{"rearrange"!==Y&&(ae.length||"collections"!==Y)&&(ae.length?(he(!0),e.searchFetcher(m,ae).then((e=>{"collections"in e&&"products"in e?(Ce({type:"set",data:e}),U({type:"searched",data:e.collections})):(Ce({type:"set",data:{collections:{},products:e}}),U({type:"searched",data:e})),J("searchProducts"),ne(!1),he(!1)}))):J("collections"))}),800);return()=>clearTimeout(t)}),[ae]),c.useEffect((()=>{B&&(e.onAdd(ge,ie),Ie())}),[B]),c.useEffect((()=>{$&&Object.keys(ge||{}).length&&ie&&(e.onAdd(ge,ie),Ie())}),[$,ge,ie]);const Ie=()=>{je({type:"reset",data:{}})},ke=()=>k&&ie>k?t.jsx(d.Tag,{tagText:`You can only select ${k} products`,type:"negative"}):P&&ie>P?t.jsx(d.Tag,{tagText:`You can only select ${P} products`,type:"negative"}):ie>0?t.jsx(n.Button,{onClick:()=>{J(V?exports.ScreenName.RearrangeProducts:exports.ScreenName.SelectedProducts)},buttonText:k?`${ie}/${k} products selected`:`${ie} products selected`,buttonType:["rearrange","view"].includes(Y)?"tertiaryGray":"tertiary",disabled:["rearrange","view"].includes(Y)}):t.jsx(n.Button,{disabled:!0,buttonText:k?`${ie}/${k} products selected`:`${ie} products selected`,buttonType:"tertiaryGray"}),Pe=e=>se?"Loading...":Y===exports.ScreenName.RearrangeProducts?null!=e?e:"Done":null!=e?e:"Add",Oe=t.jsxs(j.ContainerStyle,Object.assign({style:null!=H?H:{}},{children:[e.postHeader&&t.jsx("div",Object.assign({style:{padding:"0 24px"}},{children:e.postHeader})),!e.hideGlobalSearch&&t.jsx(t.Fragment,{children:("collections"===Y||"searchProducts"===Y)&&t.jsx("div",Object.assign({style:{padding:A?"8px 16px":"12px 24px",borderBottom:"1px solid #E0E0E0"}},{children:t.jsx(i.Input,{placeholder:"Search for collections and products, or type a product ID",noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>ue?t.jsx(a.Spinner,{size:"small",color:r.COLORS.content.primary}):t.jsx(o.default,{})},id:"listInput",height:"24px",type:"text",value:ae,onChangeText:e=>{e.length&&e.trim().length?de(e):de("")}})}))}),t.jsxs(j.ScrollContainerStyle,Object.assign({ref:ye,screenName:Y},{children:["collections"===Y&&t.jsx(u.CollectionsScreen,{customCollectionRestriction:e.customCollectionRestriction,dataLoading:pe,collections:K,selectedCollectionsDispatch:je,setCollectionId:ee,setSelectedCollectionId:oe,setScreen:J,selectedCollections:ge,collectionFetcher:e.collectionFetcher,storeId:m,collectionsDispatch:U,setSaveDisabled:ne,pagingControls:{curPage:ce,setCurPage:re},hideCollectionCheckbox:O,renderWithoutModal:A,pickerType:L,scrollContainerRef:ye}),"products"===Y&&Z&&t.jsx(x.CollectionIdContext.Provider,Object.assign({value:Z},{children:t.jsx(p.ProductsScreen,{hideInCollectionSearch:e.hideInCollectionSearch,customCollectionRestriction:e.customCollectionRestriction,productFetcher:e.productFetcher,setScreen:J,storeId:m,data:K[Z],collectionsDispatch:U,selectedCollectionsDispatch:je,selectedData:ge,setSaveDisabled:ne,searchInCollectionFetcher:e.searchInCollectionFetcher,hideProductCheckbox:F,outOfStockAction:R,hideVariantCheckbox:T,selectProductsFromCustomCollection:D,renderWithoutModal:A,pickerType:L,hideProductVariants:M,fbStatusFetcher:e.fbStatusFetcher,onProductDetailClick:e=>{fe(!0),ve(e)},showProductDetailInfoIcon:_,scrollContainerRef:ye})})),"view"===Y&&t.jsx(g.SelectedScreen,{selectedCollections:ge||{},selectedCollectionsDispatch:je,setScreen:J,collections:K,hideProductVariants:M,outOfStockAction:R,storeId:m,fbStatusFetcher:e.fbStatusFetcher}),"rearrange"===Y&&t.jsx(S.RearrangeScreen,{selectedCollections:ge||{},selectedCollectionsDispatch:je,setScreen:J,outOfStockAction:R,rearrangeViewType:"grid"===Q?"list":"grid",scrollContainerRef:ye,storeId:m,fbStatusFetcher:e.fbStatusFetcher}),"searchProducts"===Y&&t.jsx(C.SearchScreen,{customCollectionRestriction:e.customCollectionRestriction,selectedCollections:ge||{},searchedCollections:xe||{},searchedCollectionsDispatch:Ce,selectedCollectionsDispatch:je,setScreen:J,collections:K,onBackPress:()=>{de(""),Ce({type:"set",data:{collections:{},products:{}}})},pickerType:L,hideProductCheckbox:F,hideProductVariants:M,hideVariantCheckbox:T,storeId:m,fbStatusFetcher:e.fbStatusFetcher,setCollectionId:ee,setSelectedCollectionId:oe,renderWithoutModal:A,hideCollectionCheckbox:O,outOfStockAction:R})]}))]}));return t.jsx(t.Fragment,{children:A?t.jsxs(t.Fragment,{children:[Oe,G.renderFooter?t.jsxs(j.StyledFooterForNonModal,{children:[ke(),t.jsx(n.Button,{buttonText:Pe(G.primaryButtonText),disabled:!G.isLoading&&(se||ie<1||k&&ie<k||!k&&P&&ie>P)||G.primaryButtonDisabled,isLoading:G.isLoading,onClick:()=>{e.onAdd(ge,ie),Ie(),J([exports.ScreenName.Collections,exports.ScreenName.RearrangeProducts].includes(z)?z:exports.ScreenName.Collections)}})]}):t.jsx(t.Fragment,{}),me&&be?t.jsx(h.ProductInfoOverlay,{productData:be,outOfStockAction:R,useDynamicInfoImageSize:e.useDynamicInfoImageSize,onClose:()=>{fe(!1)}}):t.jsx(t.Fragment,{})]}):t.jsxs(l.StyledModal,Object.assign({zIndex:I,open:v,onClose:()=>{null==b||b(),Ie()},headingTitle:E||("collections"===Y||"products"===Y?"Select Products":"view"===Y?"Selected Products":"searchProducts"===Y?"Searched Results":"rearrange"===Y?"Rearrange Products":void 0),footerShadow:!0,centralContainerStyles:{width:N||"600px",left:w||"auto"},headerRightCustomElement:W?t.jsx("div",Object.assign({style:{cursor:"pointer",display:"flex"},onClick:b},{children:t.jsx(s.default,{width:20,height:20,color:r.COLORS.content.secondary})})):t.jsx(t.Fragment,{}),footerContainerStyle:e.stickyFooter?{position:"absolute",bottom:0,left:0,width:"100%",zIndex:9,background:r.COLORS.surface.standard}:void 0,primaryButton:{buttonText:Pe(),disabled:se||ie<1||k&&ie<k||!k&&P&&ie>P||!1,onClick:()=>{e.onAdd(ge,ie),Ie()}},wrapperStyle:e.stickyFooter?{height:"calc(100vh - 168px)"}:void 0,footerLeftCustomElement:q?t.jsx(t.Fragment,{}):ke(),hideCrossButton:me||W},{children:[Oe,me&&be?t.jsx(h.ProductInfoOverlay,{productData:be,useDynamicInfoImageSize:e.useDynamicInfoImageSize,outOfStockAction:R,onClose:()=>{fe(!1)}}):t.jsx(t.Fragment,{})]}))})};
|
|
@@ -10,8 +10,10 @@ export declare const ProductInfoOverlay: (props: {
|
|
|
10
10
|
productData: Product | ProductVariant;
|
|
11
11
|
onClose: () => void;
|
|
12
12
|
outOfStockAction?: OUT_OF_STOCK_ACTION;
|
|
13
|
+
useDynamicInfoImageSize?: boolean;
|
|
13
14
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
14
15
|
export declare const ProductInfoCard: (props: {
|
|
15
16
|
productData: Product | ProductVariant;
|
|
16
17
|
outOfStockAction?: OUT_OF_STOCK_ACTION;
|
|
18
|
+
useDynamicInfoImageSize?: boolean;
|
|
17
19
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("styled-components"),o=require("../../constants/Theme.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("styled-components"),o=require("../../constants/Theme.js"),i=require("../../assets/icons/cross.svg.js"),r=require("../icon-button/IconButton.js"),a=require("../shimmer-image/ShimmerImage.js"),n=require("../TypographyStyle.js"),s=require("./ProductPickerTag.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=d(t);const u=t=>{var i;const r=void 0===t.productData.variants;return e.jsxs(f,{children:[e.jsx(m,{children:e.jsx(a.ShimmerImage,{useDynamicInfoImageSize:t.useDynamicInfoImageSize,imageUrl:t.productData.image,width:200,height:200,borderRadius:4})}),e.jsxs(g,{children:[e.jsx(n.TitleRegular,Object.assign({style:{display:"flex"}},{children:t.productData.name})),e.jsx(n.BodyCaption,Object.assign({color:o.COLORS.content.secondary},{children:`Product ID: ${t.productData.id}`})),e.jsx(n.BodyCaption,{className:"overlay-description",dangerouslySetInnerHTML:{__html:null!==(i=t.productData.description)&&void 0!==i?i:""}}),e.jsx(s.ProductPickerTag,{isVariant:r,data:t.productData,outOfStockAction:t.outOfStockAction})]})]})},l=c.default.div`
|
|
2
2
|
display: flex;
|
|
3
3
|
flex: 1;
|
|
4
4
|
background: rgba(0, 0, 0, 0.5);
|
|
@@ -38,11 +38,15 @@
|
|
|
38
38
|
padding: 24px;
|
|
39
39
|
gap: 24px;
|
|
40
40
|
border-radius: 8px 8px 0px 0px;
|
|
41
|
-
`,
|
|
41
|
+
`,m=c.default.div`
|
|
42
42
|
display: flex;
|
|
43
|
-
|
|
43
|
+
max-width: min(50%, 200px);
|
|
44
|
+
flex-direction: column;
|
|
45
|
+
justify-content: center;
|
|
46
|
+
align-items: center;
|
|
47
|
+
`,g=c.default.div`
|
|
44
48
|
display: flex;
|
|
45
49
|
flex: 1;
|
|
46
50
|
flex-direction: column;
|
|
47
51
|
gap: 4px;
|
|
48
|
-
`;exports.ProductInfoCard=
|
|
52
|
+
`;exports.ProductInfoCard=u,exports.ProductInfoOverlay=t=>e.jsxs(l,{children:[e.jsx(p,{}),e.jsx(x,{children:e.jsx(r.IconButton,{className:"close-button",onClick:t.onClose,Icon:i.default,width:20,height:20})}),e.jsx(u,{productData:t.productData,outOfStockAction:t.outOfStockAction,useDynamicInfoImageSize:t.useDynamicInfoImageSize})]});
|
|
@@ -20,3 +20,4 @@ export declare const CollectionNameHolder: import("styled-components").StyledCom
|
|
|
20
20
|
export declare const VariantCardListStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
21
21
|
export declare const VariantCardGridStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
22
22
|
export declare const StyledHeaderRightIcon: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
23
|
+
export declare const StyledFooterForNonModal: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../constants/Theme.js"),i=require("./modal.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=o(e);const
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../constants/Theme.js"),i=require("./modal.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=o(e);const n=r.default.div`
|
|
2
2
|
display: flex;
|
|
3
3
|
background-color: white;
|
|
4
4
|
height: 75vh;
|
|
5
5
|
flex-direction: column;
|
|
6
|
-
`,
|
|
6
|
+
`,l=r.default.div`
|
|
7
7
|
overflow-y: scroll;
|
|
8
8
|
overflow-x: hidden;
|
|
9
9
|
|
|
@@ -36,11 +36,11 @@
|
|
|
36
36
|
justify-content: center;
|
|
37
37
|
align-items: center;
|
|
38
38
|
column-gap: 18px;
|
|
39
|
-
`,
|
|
39
|
+
`,p=r.default.div`
|
|
40
40
|
display: flex;
|
|
41
41
|
flex-direction: column;
|
|
42
42
|
justify-content: center;
|
|
43
|
-
`,
|
|
43
|
+
`,c=r.default.div`
|
|
44
44
|
display: flex;
|
|
45
45
|
flex-direction: row;
|
|
46
46
|
max-height: 32px;
|
|
@@ -127,4 +127,11 @@
|
|
|
127
127
|
align-items: center;
|
|
128
128
|
border: 1px solid ${t.COLORS.stroke.primary};
|
|
129
129
|
border-radius: 4px;
|
|
130
|
-
|
|
130
|
+
`;const h=r.default.div`
|
|
131
|
+
padding: 16px 24px;
|
|
132
|
+
display: flex;
|
|
133
|
+
align-items: center;
|
|
134
|
+
justify-content: space-between;
|
|
135
|
+
margin-top: auto;
|
|
136
|
+
width: 100%;
|
|
137
|
+
`;exports.CollectionCardDetailStyle=p,exports.CollectionCardInfoStyle=a,exports.CollectionCardStyle=d,exports.CollectionNameHolder=u,exports.ContainerStyle=n,exports.ProductCardStyle=x,exports.ProductScreenCollectionCardStyle=s,exports.ProductScreenHeader=c,exports.ScrollContainerStyle=l,exports.SelectedScreenHeader=f,exports.StyledFooterForNonModal=h,exports.VariantCardGridStyle=y,exports.VariantCardListStyle=g;
|
|
@@ -6,6 +6,7 @@ export type ShimmerImageProps = {
|
|
|
6
6
|
alt?: string;
|
|
7
7
|
borderRadius?: number;
|
|
8
8
|
defaultImageUrl?: string;
|
|
9
|
+
useDynamicInfoImageSize?: boolean;
|
|
9
10
|
};
|
|
10
11
|
export declare const DEFAULT_IMAGE = "https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c";
|
|
11
12
|
export declare const ShimmerImage: React.FC<ShimmerImageProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("../shimmer/ShimmerComponent/BikShimmer.js");const r="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c";exports.DEFAULT_IMAGE=r,exports.ShimmerImage=s=>{let{imageUrl:a,width:o,height:l,borderRadius:n,alt:c,useDynamicInfoImageSize:d,defaultImageUrl:m=r}=s;const[u,h]=t.useState(!0),[g,b]=t.useState(!1);return t.useEffect((()=>{const e=new Image;return e.src=a,e.onload=()=>{b(!1),h(!1)},e.onerror=()=>{b(!0),h(!1)},()=>{e.onload=null,e.onerror=null}}),[a]),e.jsxs("div",Object.assign({style:Object.assign(Object.assign({position:"relative",width:d?`min(100%, ${o}px)`:o},d?{aspectRatio:1}:{height:l}),{borderRadius:n})},{children:[u&&e.jsx(i.BikShimmer,{boxes:[{height:`${l}px`,width:`${o}px`,marginTop:"0px"}]}),g?e.jsx("img",{src:m,alt:null!=c?c:"Image",style:{borderRadius:null!=n?n:0,display:"block",width:"100%",height:"100%",objectFit:"cover"}}):e.jsx("img",{src:a,alt:null!=c?c:"Image",style:{borderRadius:null!=n?n:0,display:u?"none":"block",width:"100%",height:"100%",objectFit:"cover"}})]}))};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const EventsTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default EventsTrigger;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const IGTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default IGTrigger;
|
package/dist/esm/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
package/dist/esm/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { DropdownOption } from "../../../dropdown/type";
|
|
3
|
-
import { QueryBuilderProperty } from "../../
|
|
4
|
-
import { QueryBuilderNodeProps } from "../../
|
|
3
|
+
import { QueryBuilderProperty } from "../../Types/QueryBuilder.type";
|
|
4
|
+
import { QueryBuilderNodeProps } from "../../Types/QueryBuilderNodeProps.type";
|
|
5
5
|
declare const BaseTriggerQueryBuilderNode: React.FC<QueryBuilderNodeProps & {
|
|
6
6
|
cacheKey: string;
|
|
7
7
|
propertyAddBtnText: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as o,Fragment as r}from"react/jsx-runtime";import{useState as t}from"react";import{Input as e}from"../../../../input/Input.js";import{InputStyleContext as n}from"../../../../input/context/InputStyleProvider.js";import{COLORS as i}from"../../../../../constants/Theme.js";import s from"../../../../../assets/icons/cross.svg.js";import c from"../../../../../assets/icons/search.svg.js";const p=p=>{let{onSearch:a,version:m}=p;const[l,h]=t(""),[d,g]=t(!1);return o(n.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:`${"2.0"===m?.5:1}px solid ${i.stroke.primary}`,padding:""+("2.0"===m?"6px 8px":"14px 16px")},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:o(e,{noKeyDownChange:!0,skipFocus:!0,placeholder:"Search",variant:"2.0"===m?"small":"default",leftIcon:{icon:()=>o(c,{width:"2.0"===m?18:24,height:"2.0"===m?18:24,color:i.content.placeholder})},rightIcon:{icon:()=>l?o(s,{onClick:()=>{g(!0),a(""),h("")},width:24,height:24,color:i.content.placeholder}):o(r,{})},reset:d,onChangeText:o=>{g(!1),h(o),a(o)}})}))};export{p as SearchBox};
|
|
1
|
+
import{jsx as o,Fragment as r}from"react/jsx-runtime";import{useState as t}from"react";import{Input as e}from"../../../../input/Input.js";import{InputStyleContext as n}from"../../../../input/context/InputStyleProvider.js";import{COLORS as i}from"../../../../../constants/Theme.js";import s from"../../../../../assets/icons/cross.svg.js";import c from"../../../../../assets/icons/search.svg.js";const p=p=>{let{onSearch:a,version:m}=p;const[l,h]=t(""),[d,g]=t(!1);return o(n.Provider,Object.assign({value:{InputWrapper:{borderRadius:0,border:0,borderBottom:`${"2.0"===m?.5:1}px solid ${i.stroke.primary}`,padding:""+("2.0"===m?"6px 8px":"14px 16px")},IconHolder:{marginLeft:0},input:{marginLeft:4,minHeight:"100%"}}},{children:o(e,{noKeyDownChange:!0,skipFocus:!0,placeholder:"Search",variant:"2.0"===m?"small":"default",leftIcon:{icon:()=>o(c,{width:"2.0"===m?18:24,height:"2.0"===m?18:24,color:i.content.placeholder})},rightIcon:{icon:()=>l?o(s,{onClick:()=>{g(!0),a(""),h("")},width:"2.0"===m?18:24,height:"2.0"===m?18:24,color:i.content.placeholder}):o(r,{})},reset:d,onChangeText:o=>{g(!1),h(o),a(o)}})}))};export{p as SearchBox};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { GroupedOption, MultiLevelDropdownOption } from './type';
|
|
3
|
+
export declare const GroupedMenuList: React.FC<{
|
|
4
|
+
width: string;
|
|
5
|
+
onDropdownItemClick: (option: MultiLevelDropdownOption, parents: MultiLevelDropdownOption[]) => void;
|
|
6
|
+
option: GroupedOption;
|
|
7
|
+
parents: MultiLevelDropdownOption[];
|
|
8
|
+
}>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { MultiLevelDropdownOption, SingleOption } from './type';
|
|
3
|
+
export declare const MenuItem: React.FC<{
|
|
4
|
+
width: string;
|
|
5
|
+
onDropdownItemClick: (option: MultiLevelDropdownOption, parents: MultiLevelDropdownOption[]) => void;
|
|
6
|
+
option: SingleOption;
|
|
7
|
+
parents: MultiLevelDropdownOption[];
|
|
8
|
+
}>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { MultiLevelDropdownOption } from './type';
|
|
3
|
+
export declare const MenuList: React.FC<{
|
|
4
|
+
width: string;
|
|
5
|
+
onDropdownItemClick: (option: MultiLevelDropdownOption, parents: MultiLevelDropdownOption[]) => void;
|
|
6
|
+
options: MultiLevelDropdownOption[];
|
|
7
|
+
parents: MultiLevelDropdownOption[];
|
|
8
|
+
}>;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
export declare const DropdownContainer: import("styled-components").StyledComponent<"div", any, {
|
|
2
|
+
width?: string | undefined;
|
|
3
|
+
}, never>;
|
|
4
|
+
export declare const NoResultsContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
5
|
+
export declare const GroupedMenuListContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
6
|
+
export declare const StyledMenuList: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
7
|
+
export declare const MenuItemWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
8
|
+
export interface MenuItemContainerProps {
|
|
9
|
+
isSelected?: boolean;
|
|
10
|
+
isHovered?: boolean;
|
|
11
|
+
isSubMenuOpen?: boolean;
|
|
12
|
+
isDisabled?: boolean;
|
|
13
|
+
}
|
|
14
|
+
export declare const MenuItemContainer: import("styled-components").StyledComponent<"div", any, MenuItemContainerProps, never>;
|
|
15
|
+
export declare const ContentContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
16
|
+
export declare const SubMenuWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
17
|
+
export declare const Container: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './MultiLevelDropdown';
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export interface MultiLevelDropdownProps {
|
|
3
|
+
options: MultiLevelDropdownOption[];
|
|
4
|
+
width?: string;
|
|
5
|
+
isSearchable?: boolean;
|
|
6
|
+
onDropdownItemClick: (option: MultiLevelDropdownOption, parents: MultiLevelDropdownOption[]) => void;
|
|
7
|
+
}
|
|
8
|
+
export type GroupedOption = {
|
|
9
|
+
label: string;
|
|
10
|
+
options: SingleOption[];
|
|
11
|
+
trailingIcon?: JSX.Element;
|
|
12
|
+
leadingIcon?: JSX.Element;
|
|
13
|
+
};
|
|
14
|
+
export type SingleOption = {
|
|
15
|
+
label: string;
|
|
16
|
+
value: string;
|
|
17
|
+
subText?: string;
|
|
18
|
+
trailingIcon?: JSX.Element;
|
|
19
|
+
leadingIcon?: JSX.Element;
|
|
20
|
+
customComponent?: JSX.Element;
|
|
21
|
+
disabled?: boolean;
|
|
22
|
+
selected?: boolean;
|
|
23
|
+
children?: SingleOption[];
|
|
24
|
+
};
|
|
25
|
+
export type MultiLevelDropdownOption = SingleOption | GroupedOption;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import{jsxs as t,jsx as e}from"react/jsx-runtime";import
|
|
1
|
+
import{jsxs as t,jsx as e}from"react/jsx-runtime";import n from"../../assets/icons/box_round.svg.js";import o from"styled-components";import{COLORS as r}from"../../constants/Theme.js";import{TitleRegular as i,BodySecondary as s}from"../TypographyStyle.js";const c=o=>{let{title:c,subtitle:m}=o;return t(l,{children:[e(n,{width:48,height:48}),e(i,Object.assign({style:{marginTop:8}},{children:c})),e(s,Object.assign({style:{color:r.content.secondary,marginTop:4}},{children:m}))]})},l=o.div`
|
|
2
2
|
height: 400px;
|
|
3
3
|
display: flex;
|
|
4
4
|
flex-direction: column;
|
|
5
5
|
align-items: center;
|
|
6
6
|
justify-content: center;
|
|
7
|
+
text-align: center;
|
|
7
8
|
`;export{c as EmptyState};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { OUT_OF_STOCK_ACTION } from './type';
|
|
2
|
+
import { FooterForNonModalI, OUT_OF_STOCK_ACTION } from './type';
|
|
3
3
|
export interface ProductVariant {
|
|
4
4
|
name: string;
|
|
5
5
|
price: string;
|
|
@@ -10,6 +10,7 @@ export interface ProductVariant {
|
|
|
10
10
|
fbStatus?: FbProductStatus;
|
|
11
11
|
description?: string;
|
|
12
12
|
id?: string;
|
|
13
|
+
actualPrice?: string;
|
|
13
14
|
}
|
|
14
15
|
export interface Product {
|
|
15
16
|
name: string;
|
|
@@ -19,6 +20,8 @@ export interface Product {
|
|
|
19
20
|
[key: string]: ProductVariant;
|
|
20
21
|
};
|
|
21
22
|
id?: string;
|
|
23
|
+
handle?: string;
|
|
24
|
+
currency?: string;
|
|
22
25
|
}
|
|
23
26
|
export interface Collection {
|
|
24
27
|
name: string;
|
|
@@ -95,6 +98,8 @@ export type ProductPickerInterface = {
|
|
|
95
98
|
showProductDetails?: boolean;
|
|
96
99
|
containerStyle?: React.CSSProperties;
|
|
97
100
|
crossButtonInsideHeader?: boolean;
|
|
101
|
+
footerForNonModal?: FooterForNonModalI;
|
|
102
|
+
useDynamicInfoImageSize?: boolean;
|
|
98
103
|
} & ({
|
|
99
104
|
startupScreen: ScreenName.RearrangeProducts;
|
|
100
105
|
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 s,useRef as i,useEffect 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 d from"../../assets/icons/cross.svg.js";import{Button as a}from"../button/Button.js";import{Input as u}from"../input/Input.js";import{StyledModal as h}from"../modals/styledModal.js";import{Spinner as p}from"../spinner/Spinner.js";import{Tag as m}from"../tag/Tag.js";import{CollectionsScreen as C}from"./collectionScreen.js";import{ProductInfoOverlay as g}from"./productInfoOverlay.js";import{ProductsScreen as f}from"./productScreen.js";import{RearrangeScreen as y}from"./rearrangeScreen.js";import{collectionsReducer as b,searchReducer as S,selectedColectionsReducer as v,CollectionIdContext as k}from"./reducers.js";import{SearchScreen as I}from"./searchScreen.js";import{SelectedScreen as x}from"./selectedScreen.js";import{ContainerStyle as j,ScrollContainerStyle as P,StyledFooterForNonModal as D}from"./style.js";import{OUT_OF_STOCK_ACTION as F}from"./type.js";var O;!function(e){e.Collections="collections",e.RearrangeProducts="rearrange",e.SelectedProducts="view",e.SearchProducts="searchProducts",e.Products="products"}(O||(O={}));const T=T=>{const{storeId:R,selectedItems:w,onClose:A,visible:E,zIndex:B,exactLimit:z,limit:L,hideCollectionCheckbox:V,hideProductCheckbox:$,outOfStockAction:M=F.BLUR,hideVariantCheckbox:H,selectProductsFromCustomCollection:W,hideSelectionCount:G,title:N,width:Y,left:K,renderWithoutModal:U,onClickSave:q,pickerType:J,hideProductVariants:Q=!1,startupScreen:X=O.Collections,rearrangeEnabled:Z,selectSingleItem:_=!1,showProductDetails:ee,containerStyle:te,crossButtonInsideHeader:oe=!1,footerForNonModal:ce={}}=T,[re,se]=r(b,{}),[ie,ne]=s([O.Collections,O.RearrangeProducts].includes(X)?X:O.Collections),[le,de]=s("grid"),[ae,ue]=s(""),[he,pe]=s(""),[me,Ce]=s(0),[ge,fe]=s(!1),[ye,be]=s(0),[Se,ve]=s(""),[ke,Ie]=s(!1),[xe,je]=s(!1),[Pe,De]=r(S,{collections:{},products:{}}),[Fe,Oe]=r(v,Object.keys(w).length>0?w:{}),Te=i(null),[Re,we]=s(!1),[Ae,Ee]=s();n((()=>{fe(!0),je(!0),T.collectionFetcher(me,R).then((e=>{se({type:"fetched",data:(null==e?void 0:e.collections)||{}}),fe(!1),Ce((e=>e+1)),je(!1)})).catch()}),[]),n((()=>{let e=0;Q?Object.keys(Fe||[]).forEach((t=>{var o;Object.keys((null===(o=Fe[t])||void 0===o?void 0:o.products)||[]).forEach((o=>{var c;"-1"!==t&&Fe[-1]&&(null===(c=Fe[-1].products)||void 0===c?void 0:c[o])||(e+=1)}))})):Object.keys(Fe||[]).forEach((t=>{var o;Object.keys((null===(o=Fe[t])||void 0===o?void 0:o.products)||[]).forEach((o=>{var c,r;Object.keys((null===(r=null===(c=Fe[t].products)||void 0===c?void 0:c[o])||void 0===r?void 0:r.variants)||[]).forEach((()=>{e+=1}))}))})),be(e)}),[re,Fe,Q]),n((()=>{he&&(fe(!0),T.productFetcher(he,R).then((e=>{Object.keys(e).length&&se({type:"productsFetched",data:{collectionId:he,products:e}}),fe(!1)})).catch())}),[he]),n((()=>{const e=setTimeout((()=>{"rearrange"!==ie&&(Se.length||"collections"!==ie)&&(Se.length?(Ie(!0),T.searchFetcher(R,Se).then((e=>{"collections"in e&&"products"in e?(De({type:"set",data:e}),se({type:"searched",data:e.collections})):(De({type:"set",data:{collections:{},products:e}}),se({type:"searched",data:e})),ne("searchProducts"),fe(!1),Ie(!1)}))):ne("collections"))}),800);return()=>clearTimeout(e)}),[Se]),n((()=>{q&&(T.onAdd(Fe,ye),Be())}),[q]),n((()=>{_&&Object.keys(Fe||{}).length&&ye&&(T.onAdd(Fe,ye),Be())}),[_,Fe,ye]);const Be=()=>{Oe({type:"reset",data:{}})},ze=()=>z&&ye>z?t(m,{tagText:`You can only select ${z} products`,type:"negative"}):L&&ye>L?t(m,{tagText:`You can only select ${L} products`,type:"negative"}):t(a,ye>0?{onClick:()=>{ne(Z?O.RearrangeProducts:O.SelectedProducts)},buttonText:z?`${ye}/${z} products selected`:`${ye} products selected`,buttonType:["rearrange","view"].includes(ie)?"tertiaryGray":"tertiary",disabled:["rearrange","view"].includes(ie)}:{disabled:!0,buttonText:z?`${ye}/${z} products selected`:`${ye} products selected`,buttonType:"tertiaryGray"}),Le=e=>ge?"Loading...":ie===O.RearrangeProducts?null!=e?e:"Done":null!=e?e:"Add",Ve=e(j,Object.assign({style:null!=te?te:{}},{children:[T.postHeader&&t("div",Object.assign({style:{padding:"0 24px"}},{children:T.postHeader})),!T.hideGlobalSearch&&t(o,{children:("collections"===ie||"searchProducts"===ie)&&t("div",Object.assign({style:{padding:U?"8px 16px":"12px 24px",borderBottom:"1px solid #E0E0E0"}},{children:t(u,{placeholder:"Search for collections and products, or type a product ID",noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>ke?t(p,{size:"small",color:l.content.primary}):t(c,{})},id:"listInput",height:"24px",type:"text",value:Se,onChangeText:e=>{e.length&&e.trim().length?ve(e):ve("")}})}))}),e(P,Object.assign({ref:Te,screenName:ie},{children:["collections"===ie&&t(C,{customCollectionRestriction:T.customCollectionRestriction,dataLoading:xe,collections:re,selectedCollectionsDispatch:Oe,setCollectionId:ue,setSelectedCollectionId:pe,setScreen:ne,selectedCollections:Fe,collectionFetcher:T.collectionFetcher,storeId:R,collectionsDispatch:se,setSaveDisabled:fe,pagingControls:{curPage:me,setCurPage:Ce},hideCollectionCheckbox:V,renderWithoutModal:U,pickerType:J,scrollContainerRef:Te}),"products"===ie&&ae&&t(k.Provider,Object.assign({value:ae},{children:t(f,{hideInCollectionSearch:T.hideInCollectionSearch,customCollectionRestriction:T.customCollectionRestriction,productFetcher:T.productFetcher,setScreen:ne,storeId:R,data:re[ae],collectionsDispatch:se,selectedCollectionsDispatch:Oe,selectedData:Fe,setSaveDisabled:fe,searchInCollectionFetcher:T.searchInCollectionFetcher,hideProductCheckbox:$,outOfStockAction:M,hideVariantCheckbox:H,selectProductsFromCustomCollection:W,renderWithoutModal:U,pickerType:J,hideProductVariants:Q,fbStatusFetcher:T.fbStatusFetcher,onProductDetailClick:e=>{we(!0),Ee(e)},showProductDetailInfoIcon:ee,scrollContainerRef:Te})})),"view"===ie&&t(x,{selectedCollections:Fe||{},selectedCollectionsDispatch:Oe,setScreen:ne,collections:re,hideProductVariants:Q,outOfStockAction:M,storeId:R,fbStatusFetcher:T.fbStatusFetcher}),"rearrange"===ie&&t(y,{selectedCollections:Fe||{},selectedCollectionsDispatch:Oe,setScreen:ne,outOfStockAction:M,rearrangeViewType:"grid"===le?"list":"grid",scrollContainerRef:Te,storeId:R,fbStatusFetcher:T.fbStatusFetcher}),"searchProducts"===ie&&t(I,{customCollectionRestriction:T.customCollectionRestriction,selectedCollections:Fe||{},searchedCollections:Pe||{},searchedCollectionsDispatch:De,selectedCollectionsDispatch:Oe,setScreen:ne,collections:re,onBackPress:()=>{ve(""),De({type:"set",data:{collections:{},products:{}}})},pickerType:J,hideProductCheckbox:$,hideProductVariants:Q,hideVariantCheckbox:H,storeId:R,fbStatusFetcher:T.fbStatusFetcher,setCollectionId:ue,setSelectedCollectionId:pe,renderWithoutModal:U,hideCollectionCheckbox:V,outOfStockAction:M})]}))]}));return t(o,{children:U?e(o,{children:[Ve,ce.renderFooter?e(D,{children:[ze(),t(a,{buttonText:Le(ce.primaryButtonText),disabled:!ce.isLoading&&(ge||ye<1||z&&ye<z||!z&&L&&ye>L)||ce.primaryButtonDisabled,isLoading:ce.isLoading,onClick:()=>{T.onAdd(Fe,ye),Be(),ne([O.Collections,O.RearrangeProducts].includes(X)?X:O.Collections)}})]}):t(o,{}),Re&&Ae?t(g,{productData:Ae,outOfStockAction:M,useDynamicInfoImageSize:T.useDynamicInfoImageSize,onClose:()=>{we(!1)}}):t(o,{})]}):e(h,Object.assign({zIndex:B,open:E,onClose:()=>{null==A||A(),Be()},headingTitle:N||("collections"===ie||"products"===ie?"Select Products":"view"===ie?"Selected Products":"searchProducts"===ie?"Searched Results":"rearrange"===ie?"Rearrange Products":void 0),footerShadow:!0,centralContainerStyles:{width:Y||"600px",left:K||"auto"},headerRightCustomElement:oe?t("div",Object.assign({style:{cursor:"pointer",display:"flex"},onClick:A},{children:t(d,{width:20,height:20,color:l.content.secondary})})):t(o,{}),footerContainerStyle:T.stickyFooter?{position:"absolute",bottom:0,left:0,width:"100%",zIndex:9,background:l.surface.standard}:void 0,primaryButton:{buttonText:Le(),disabled:ge||ye<1||z&&ye<z||!z&&L&&ye>L||!1,onClick:()=>{T.onAdd(Fe,ye),Be()}},wrapperStyle:T.stickyFooter?{height:"calc(100vh - 168px)"}:void 0,footerLeftCustomElement:G?t(o,{}):ze(),hideCrossButton:Re||oe},{children:[Ve,Re&&Ae?t(g,{productData:Ae,useDynamicInfoImageSize:T.useDynamicInfoImageSize,outOfStockAction:M,onClose:()=>{we(!1)}}):t(o,{})]}))})};export{T as ProductPickerModal,O as ScreenName};
|
|
@@ -10,8 +10,10 @@ export declare const ProductInfoOverlay: (props: {
|
|
|
10
10
|
productData: Product | ProductVariant;
|
|
11
11
|
onClose: () => void;
|
|
12
12
|
outOfStockAction?: OUT_OF_STOCK_ACTION;
|
|
13
|
+
useDynamicInfoImageSize?: boolean;
|
|
13
14
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
14
15
|
export declare const ProductInfoCard: (props: {
|
|
15
16
|
productData: Product | ProductVariant;
|
|
16
17
|
outOfStockAction?: OUT_OF_STOCK_ACTION;
|
|
18
|
+
useDynamicInfoImageSize?: boolean;
|
|
17
19
|
}) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{jsxs as o,jsx as t}from"react/jsx-runtime";import i from"styled-components";import{COLORS as
|
|
1
|
+
import{jsxs as o,jsx as t}from"react/jsx-runtime";import i from"styled-components";import{COLORS as e}from"../../constants/Theme.js";import r from"../../assets/icons/cross.svg.js";import{IconButton as a}from"../icon-button/IconButton.js";import{ShimmerImage as n}from"../shimmer-image/ShimmerImage.js";import{TitleRegular as c,BodyCaption as d}from"../TypographyStyle.js";import{ProductPickerTag as s}from"./ProductPickerTag.js";const l=i=>o(m,{children:[t(u,{}),t(f,{children:t(a,{className:"close-button",onClick:i.onClose,Icon:r,width:20,height:20})}),t(p,{productData:i.productData,outOfStockAction:i.outOfStockAction,useDynamicInfoImageSize:i.useDynamicInfoImageSize})]}),p=i=>{var r;const a=void 0===i.productData.variants;return o(x,{children:[t(g,{children:t(n,{useDynamicInfoImageSize:i.useDynamicInfoImageSize,imageUrl:i.productData.image,width:200,height:200,borderRadius:4})}),o(h,{children:[t(c,Object.assign({style:{display:"flex"}},{children:i.productData.name})),t(d,Object.assign({color:e.content.secondary},{children:`Product ID: ${i.productData.id}`})),t(d,{className:"overlay-description",dangerouslySetInnerHTML:{__html:null!==(r=i.productData.description)&&void 0!==r?r:""}}),t(s,{isVariant:a,data:i.productData,outOfStockAction:i.outOfStockAction})]})]})},m=i.div`
|
|
2
2
|
display: flex;
|
|
3
3
|
flex: 1;
|
|
4
4
|
background: rgba(0, 0, 0, 0.5);
|
|
@@ -21,7 +21,7 @@ import{jsxs as o,jsx as t}from"react/jsx-runtime";import i from"styled-component
|
|
|
21
21
|
display: flex;
|
|
22
22
|
flex: 1;
|
|
23
23
|
background: rgba(0, 0, 0, 0.5);
|
|
24
|
-
`,
|
|
24
|
+
`,f=i.div`
|
|
25
25
|
position: relative;
|
|
26
26
|
|
|
27
27
|
.close-button {
|
|
@@ -29,10 +29,10 @@ import{jsxs as o,jsx as t}from"react/jsx-runtime";import i from"styled-component
|
|
|
29
29
|
top: -50px;
|
|
30
30
|
right: 0px;
|
|
31
31
|
margin: 10px;
|
|
32
|
-
background: ${
|
|
32
|
+
background: ${e.surface.standard};
|
|
33
33
|
border-radius: 50%;
|
|
34
34
|
}
|
|
35
|
-
`,
|
|
35
|
+
`,x=i.div`
|
|
36
36
|
display: flex;
|
|
37
37
|
background: white;
|
|
38
38
|
padding: 24px;
|
|
@@ -40,6 +40,10 @@ import{jsxs as o,jsx as t}from"react/jsx-runtime";import i from"styled-component
|
|
|
40
40
|
border-radius: 8px 8px 0px 0px;
|
|
41
41
|
`,g=i.div`
|
|
42
42
|
display: flex;
|
|
43
|
+
max-width: min(50%, 200px);
|
|
44
|
+
flex-direction: column;
|
|
45
|
+
justify-content: center;
|
|
46
|
+
align-items: center;
|
|
43
47
|
`,h=i.div`
|
|
44
48
|
display: flex;
|
|
45
49
|
flex: 1;
|
|
@@ -20,3 +20,4 @@ export declare const CollectionNameHolder: import("styled-components").StyledCom
|
|
|
20
20
|
export declare const VariantCardListStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
21
21
|
export declare const VariantCardGridStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
22
22
|
export declare const StyledHeaderRightIcon: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
23
|
+
export declare const StyledFooterForNonModal: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -75,7 +75,7 @@ import e from"styled-components";import{COLORS as i}from"../../constants/Theme.j
|
|
|
75
75
|
cursor: pointer;
|
|
76
76
|
background-color: ${i.surface.hovered};
|
|
77
77
|
}
|
|
78
|
-
`,
|
|
78
|
+
`,s=e.div`
|
|
79
79
|
display: flex;
|
|
80
80
|
flex-direction: row;
|
|
81
81
|
max-height: 32px;
|
|
@@ -87,7 +87,7 @@ import e from"styled-components";import{COLORS as i}from"../../constants/Theme.j
|
|
|
87
87
|
position: sticky;
|
|
88
88
|
top: 0;
|
|
89
89
|
z-index: 10;
|
|
90
|
-
`,
|
|
90
|
+
`,x=e.div`
|
|
91
91
|
display: flex;
|
|
92
92
|
flex-direction: column;
|
|
93
93
|
`,g=e.div`
|
|
@@ -127,4 +127,11 @@ import e from"styled-components";import{COLORS as i}from"../../constants/Theme.j
|
|
|
127
127
|
align-items: center;
|
|
128
128
|
border: 1px solid ${i.stroke.primary};
|
|
129
129
|
border-radius: 4px;
|
|
130
|
-
`;
|
|
130
|
+
`;const m=e.div`
|
|
131
|
+
padding: 16px 24px;
|
|
132
|
+
display: flex;
|
|
133
|
+
align-items: center;
|
|
134
|
+
justify-content: space-between;
|
|
135
|
+
margin-top: auto;
|
|
136
|
+
width: 100%;
|
|
137
|
+
`;export{p as CollectionCardDetailStyle,d as CollectionCardInfoStyle,r as CollectionCardStyle,x as CollectionNameHolder,o as ContainerStyle,a as ProductCardStyle,c as ProductScreenCollectionCardStyle,l as ProductScreenHeader,n as ScrollContainerStyle,s as SelectedScreenHeader,m as StyledFooterForNonModal,f as VariantCardGridStyle,g as VariantCardListStyle};
|
|
@@ -6,6 +6,7 @@ export type ShimmerImageProps = {
|
|
|
6
6
|
alt?: string;
|
|
7
7
|
borderRadius?: number;
|
|
8
8
|
defaultImageUrl?: string;
|
|
9
|
+
useDynamicInfoImageSize?: boolean;
|
|
9
10
|
};
|
|
10
11
|
export declare const DEFAULT_IMAGE = "https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c";
|
|
11
12
|
export declare const ShimmerImage: React.FC<ShimmerImageProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as
|
|
1
|
+
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useState as i,useEffect as o}from"react";import{BikShimmer as r}from"../shimmer/ShimmerComponent/BikShimmer.js";const a="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c",s=s=>{let{imageUrl:l,width:n,height:c,borderRadius:m,alt:d,useDynamicInfoImageSize:h,defaultImageUrl:b=a}=s;const[g,p]=i(!0),[u,f]=i(!1);return o((()=>{const e=new Image;return e.src=l,e.onload=()=>{f(!1),p(!1)},e.onerror=()=>{f(!0),p(!1)},()=>{e.onload=null,e.onerror=null}}),[l]),e("div",Object.assign({style:Object.assign(Object.assign({position:"relative",width:h?`min(100%, ${n}px)`:n},h?{aspectRatio:1}:{height:c}),{borderRadius:m})},{children:[g&&t(r,{boxes:[{height:`${c}px`,width:`${n}px`,marginTop:"0px"}]}),t("img",u?{src:b,alt:null!=d?d:"Image",style:{borderRadius:null!=m?m:0,display:"block",width:"100%",height:"100%",objectFit:"cover"}}:{src:l,alt:null!=d?d:"Image",style:{borderRadius:null!=m?m:0,display:g?"none":"block",width:"100%",height:"100%",objectFit:"cover"}})]}))};export{a as DEFAULT_IMAGE,s as ShimmerImage};
|