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

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

@@ -0,0 +1,67 @@
+import React from 'react';
+import { Collection, FbStatusFetcherReturn, Product, ProductFetcherReturn, ProductVariant, SelectedItems } from '.';
+import { CollectionsActions, SelectedCollectionsActions } from './reducers';
+import { OUT_OF_STOCK_ACTION } from './type';
+interface ProductsScreenInterface {
+    hideInCollectionSearch?: boolean;
+    customCollectionRestriction?: boolean;
+    data: Collection;
+    collectionsDispatch: React.Dispatch<CollectionsActions>;
+    selectedData: SelectedItems;
+    selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
+    searchInCollectionFetcher: (storeId: string, collectionId: string, query: string) => ProductFetcherReturn;
+    productFetcher: (collectionId: string, storeId: string, limit?: number, offset?: number) => ProductFetcherReturn;
+    storeId: string;
+    setScreen: React.Dispatch<React.SetStateAction<string>>;
+    setSaveDisabled: React.Dispatch<React.SetStateAction<boolean>>;
+    hideProductCheckbox?: boolean;
+    outOfStockAction?: OUT_OF_STOCK_ACTION;
+    hideVariantCheckbox?: boolean;
+    selectProductsFromCustomCollection?: boolean;
+    renderWithoutModal?: boolean;
+    pickerType?: 'COLLECTION' | 'PRODUCT';
+    hideProductVariants?: boolean;
+    showProductDetailInfoIcon?: boolean;
+    fbStatusFetcher?: (storeId: string, variantIds: string[]) => FbStatusFetcherReturn;
+    onInfoIconClick: (productData: Product | ProductVariant) => void;
+}
+export declare const ProductsScreen: (props: ProductsScreenInterface) => import("react/jsx-runtime").JSX.Element;
+interface ProductGroupInterface {
+    collectionId: string;
+    productId: string;
+    data: Product;
+    selectedData: SelectedItems;
+    selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
+    viewOnly: boolean;
+    isProductPartiallyChecked?: boolean;
+    upliftAdditions: any;
+    hideProductCheckbox?: boolean;
+    outOfStockAction?: OUT_OF_STOCK_ACTION;
+    hideVariantCheckbox?: boolean;
+    hideProductVariants?: boolean;
+    showProductDetailInfoIcon?: boolean;
+    pickerType?: 'COLLECTION' | 'PRODUCT';
+    onInfoIconClick?: (productData: Product | ProductVariant) => void;
+}
+export declare const ProductGroup: (props: ProductGroupInterface) => import("react/jsx-runtime").JSX.Element;
+interface ProductCardInterface {
+    isVariant: boolean;
+    data: Product | ProductVariant;
+    productId: string;
+    collectionId: string;
+    variantId?: string;
+    isSelected: boolean;
+    selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
+    viewOnly: boolean;
+    isPartiallyChecked?: boolean;
+    upliftAdditions: any;
+    hideProductCheckbox?: boolean;
+    outOfStockAction?: OUT_OF_STOCK_ACTION;
+    hideVariantCheckbox?: boolean;
+    hideProductVariants?: boolean;
+    showProductDetailInfoIcon?: boolean;
+    pickerType?: 'COLLECTION' | 'PRODUCT';
+    onInfoIconClick?: (productData: Product | ProductVariant) => void;
+}
+export declare const ProductCard: (props: ProductCardInterface) => import("react/jsx-runtime").JSX.Element;
+export {};

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

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

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

@@ -0,0 +1,21 @@
+import React from 'react';
+import { FbStatusFetcherReturn, SelectedItems } from '.';
+import { SelectedCollectionsActions } from './reducers';
+import { OUT_OF_STOCK_ACTION } from './type';
+interface RearrangeScreenInterface {
+    selectedCollections: SelectedItems;
+    selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
+    setScreen: React.Dispatch<React.SetStateAction<string>>;
+    rearrangeViewType: 'grid' | 'list';
+    outOfStockAction?: OUT_OF_STOCK_ACTION;
+    scrollContainerRef: React.RefObject<HTMLDivElement>;
+    storeId: string;
+    fbStatusFetcher?: (storeId: string, variantIds: string[]) => FbStatusFetcherReturn;
+}
+/**
+ * Screen will be opened on two conditions -
+ * 1. When startupScreen is 'rearrange'- Here, this screen will be opened as beginning.
+     2. When rearrangeAfterSelectionEnabled is true - Here instead of selected products screen, rearrange screen will be opened
+ */
+export declare const RearrangeScreen: (props: RearrangeScreenInterface) => import("react/jsx-runtime").JSX.Element;
+export {};

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

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

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

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import { Collection, SelectedItems } from '.';
+export interface SelectedCollectionsActions {
+    type: string;
+    data: {
+        [key: string]: any;
+    };
+}
+export declare function selectedColectionsReducer(collections: SelectedItems, action: SelectedCollectionsActions): SelectedItems;
+export interface CollectionsActions {
+    type: string;
+    data: {
+        [key: string]: any;
+    };
+}
+export declare function collectionsReducer(collections: Collection, action: CollectionsActions): any;
+export declare const CollectionIdContext: import("react").Context<string>;

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

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

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

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+import { Collection, FbStatusFetcherReturn, SelectedItems } from '.';
+import { SelectedCollectionsActions } from './reducers';
+interface SearchScreenInterface {
+    customCollectionRestriction?: boolean;
+    selectedCollections: SelectedItems;
+    searchedCollections: SelectedItems;
+    setSearchedCollections: React.Dispatch<React.SetStateAction<SelectedItems>>;
+    selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
+    setScreen: React.Dispatch<React.SetStateAction<string>>;
+    collections: {
+        [key: string]: Collection;
+    };
+    onBackPress: () => void;
+    hideVariantCheckbox?: boolean;
+    pickerType?: 'COLLECTION' | 'PRODUCT';
+    hideProductVariants?: boolean;
+    hideProductCheckbox?: boolean;
+    storeId: string;
+    fbStatusFetcher?: (storeId: string, variantIds: string[]) => FbStatusFetcherReturn;
+}
+export declare const SearchScreen: (props: SearchScreenInterface) => import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -0,0 +1 @@
+import{jsxs as o,jsx as t,Fragment as e}from"react/jsx-runtime";import i from"../../assets/icons/arrow_left.svg.js";import{IconButton as r}from"../icon-button/IconButton.js";import{BodyCaption as c}from"../TypographyStyle.js";import{EmptyState as l}from"./emptyState.js";import{ProductGroup as s}from"./productScreen.js";import{SelectedScreenHeader as d}from"./style.js";import{useFetchFbStatusForCollections as n}from"./useFetchFbStatus.js";import{liftTheStateUp as u}from"./utility.js";const a=a=>{const{customCollectionRestriction:v,selectedCollections:p,searchedCollections:h,selectedCollectionsDispatch:m,setScreen:f,collections:y,onBackPress:j,hideVariantCheckbox:b,pickerType:k,hideProductVariants:C,hideProductCheckbox:O,storeId:P,fbStatusFetcher:S}=a;n(h,P,m,S,!0);const g=(o,t)=>{var e,i,r,c,l,s,d,n,u;let a=0,v=0;return!!((null===(i=null===(e=null==p?void 0:p[o])||void 0===e?void 0:e.products)||void 0===i?void 0:i[t])&&(null===(s=Object.keys((null===(l=null===(c=null===(r=null==y?void 0:y[o])||void 0===r?void 0:r.products)||void 0===c?void 0:c[t])||void 0===l?void 0:l.variants)||[]))||void 0===s||s.forEach((()=>v++)),Object.keys((null===(u=null===(n=null===(d=null==p?void 0:p[o])||void 0===d?void 0:d.products)||void 0===n?void 0:n[t])||void 0===u?void 0:u.variants)||[]).forEach((()=>a++)),a>0&&v!==a))};return o("div",{children:[o(d,{children:[t(r,{Icon:i,onClick:()=>{f("collections"),j()}}),t(c,{children:"Searched Products"})]}),t("div",{children:Object.keys(h).length?t(e,{children:Object.keys(h).map((o=>{var e;return Object.keys((null===(e=null==h?void 0:h[o])||void 0===e?void 0:e.products)||[]).map((e=>{let i=!1;return(null==h?void 0:h.isCustom)&&(i=!0),t(s,{collectionId:o,upliftAdditions:(t,e)=>((o,t,e)=>{const i=u(e,h[o]);m({type:t,data:Object.assign(Object.assign({},i),{isRestricted:v})})})(o,t,e),productId:e,data:h[o].products[e],isProductPartiallyChecked:g(o,e),selectedData:p,selectedCollectionsDispatch:m,viewOnly:i,hideProductCheckbox:O,hideVariantCheckbox:b,hideProductVariants:C,pickerType:k},e)}))}))}):t(l,{title:"No search results found",subtitle:"We couldn’t find the product you were looking for."})})]})};export{a as SearchScreen};

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

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import { Collection, FbStatusFetcherReturn, SelectedItems } from '.';
+import { SelectedCollectionsActions } from './reducers';
+import { OUT_OF_STOCK_ACTION } from './type';
+interface SelectedScreenInterface {
+    selectedCollections: SelectedItems;
+    selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
+    setScreen: React.Dispatch<React.SetStateAction<string>>;
+    collections: {
+        [key: string]: Collection;
+    };
+    outOfStockAction?: OUT_OF_STOCK_ACTION;
+    storeId: string;
+    fbStatusFetcher?: (storeId: string, variantIds: string[]) => FbStatusFetcherReturn;
+}
+export declare const SelectedScreen: (props: SelectedScreenInterface) => import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -0,0 +1 @@
+import{jsxs as t,jsx as o,Fragment as e}from"react/jsx-runtime";import r from"../../assets/icons/arrow_left.svg.js";import{useState as n,useRef as s,useEffect as i}from"react";import{IconButton as c}from"../icon-button/IconButton.js";import{BodyCaption as l}from"../TypographyStyle.js";import{EmptyState as d}from"./emptyState.js";import{ProductGroup as u}from"./productScreen.js";import{SelectedScreenHeader as a}from"./style.js";import{fetchFbStatus as v}from"./useFetchFbStatus copy.js";import{paginateSelectedItems as p}from"./utility.js";const f=f=>{const{selectedCollections:j,selectedCollectionsDispatch:b,setScreen:g,collections:m,outOfStockAction:O,storeId:h,fbStatusFetcher:y}=f,[S,k]=n({}),P=s(0),C=s(null);i((()=>{P.current=0;const t=p(j,10,P.current);console.log("paginated",{paginatedProducts:t,selectedCollections:j}),k(t),v(t,h,b,y,!1,k),P.current+=1}),[]),i((()=>{k((t=>{var o,e,r,n,s,i;const c=Object.assign({},t);for(const t in c)if(t in c){const l=c[t],d=j[t],u={};for(const a in l.products)if(a in l.products)if(a in(null!==(o=null==d?void 0:d.products)&&void 0!==o?o:{})){const t=l.products[a],o={};for(const s in t.variants)if(s in t.variants){void 0!==(null===(n=null===(r=null===(e=null==d?void 0:d.products)||void 0===e?void 0:e[a])||void 0===r?void 0:r.variants)||void 0===n?void 0:n[s])&&(o[s]=t.variants[s])}Object.keys(o).length>0&&(u[a]=Object.assign(Object.assign({},t),{variants:o}))}else null===(i=null===(s=null==c?void 0:c[t])||void 0===s?void 0:s.products)||void 0===i||delete i[a];c[t]=Object.assign(Object.assign({},l),{products:u})}return c})),v(S,h,b,y,!1,k)}),[j]),i((()=>{console.log("vj: observertarget",C.current);const t=new IntersectionObserver((t=>{if(console.log("vj: observertargetinside",t),t[0].isIntersecting&&(console.log("vj: nextPageRef",P.current),P.current>0)){const t=p(j,10,P.current);console.log("paginated inside observer target",{paginatedProducts:t,selectedCollections:j,curScreenData:S}),k((o=>{const e=Object.assign({},o);for(const o in t)if(Object.prototype.hasOwnProperty.call(t,o)){const r=t[o];if(Object.prototype.hasOwnProperty.call(e,o)){const t=e[o];e[o]=Object.assign(Object.assign({},t),{products:Object.assign(Object.assign({},t.products),r.products)})}else e[o]=r}return e})),P.current+=1,v(S,h,b,y,!1,k)}}),{threshold:1});return C.current&&t.observe(C.current),()=>{C.current&&t.unobserve(C.current)}}),[C,j]);const I=(t,o)=>{var e,r,n,s,i,c,l,d,u;let a=0,v=0;return!!((null===(r=null===(e=null==j?void 0:j[t])||void 0===e?void 0:e.products)||void 0===r?void 0:r[o])&&(null===(c=Object.keys((null===(i=null===(s=null===(n=null==m?void 0:m[t])||void 0===n?void 0:n.products)||void 0===s?void 0:s[o])||void 0===i?void 0:i.variants)||[]))||void 0===c||c.forEach((()=>v++)),Object.keys((null===(u=null===(d=null===(l=null==j?void 0:j[t])||void 0===l?void 0:l.products)||void 0===d?void 0:d[o])||void 0===u?void 0:u.variants)||[]).forEach((()=>a++)),a>0&&v!==a))};return t("div",{children:[t(a,{children:[o(c,{Icon:r,onClick:()=>{g("collections")}}),o(l,{children:"Selected Products"})]}),t("div",{children:[Object.keys(S).length>0?o(e,{children:Object.keys(S).map((t=>{var e;return Object.keys((null===(e=null==S?void 0:S[t])||void 0===e?void 0:e.products)||[]).map((e=>{let r=!1;return(null==S?void 0:S.isCustom)&&(r=!0),o(u,{upliftAdditions:null,collectionId:t,productId:e,data:S[t].products[e],isProductPartiallyChecked:I(t,e),selectedData:j,selectedCollectionsDispatch:b,viewOnly:r,outOfStockAction:O},e)}))}))}):o(d,{title:"No Products Selected",subtitle:"Select products will appear here"}),o("div",{ref:C})]})]})};export{f as SelectedScreen};

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

@@ -0,0 +1,19 @@
+export declare const ContainerStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ScrollContainerStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const CollectionCardStyle: import("styled-components").StyledComponent<"div", any, {
+    isDisabled: boolean;
+    isActive: boolean;
+}, never>;
+export declare const CollectionCardInfoStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const CollectionCardDetailStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ProductScreenHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ProductScreenCollectionCardStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ProductCardStyle: import("styled-components").StyledComponent<"div", any, {
+    isVariant: boolean;
+    isActive: boolean;
+}, never>;
+export declare const SelectedScreenHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const CollectionNameHolder: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const VariantCardListStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const VariantCardGridStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledHeaderRightIcon: import("styled-components").StyledComponent<"div", any, {}, never>;

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

@@ -0,0 +1,115 @@
+import e from"styled-components";import{COLORS as i}from"../../constants/Theme.js";const t=e.div`
+	display: flex;
+	background-color: white;
+	height: 600px;
+	flex-direction: column;
+`,o=e.div`
+	overflow-y: scroll;
+	overflow-x: hidden;
+`,n=e.div`
+	height: 64px;
+	background-color: ${e=>e.isDisabled?"#F0F0F0":e.isActive?i.background.positive.light:"white"};
+	border-bottom: 1px solid #e0e0e0;
+	padding: 12px 24px;
+	display: flex;
+	flex-direction: row;
+	column-gap: 16px;
+	justify-content: space-between;
+	align-items: center;
+	:hover {
+		cursor: pointer;
+		background-color: ${i.surface.hovered};
+	}
+`,r=e.div`
+	display: flex;
+	flex-direction: row;
+	justify-content: center;
+	align-items: center;
+	column-gap: 18px;
+`,d=e.div`
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+`,p=e.div`
+	display: flex;
+	flex-direction: row;
+	max-height: 32px;
+	min-height: 32px;
+	background-color: ${i.background.base};
+	justify-content: flex-start;
+	align-items: center;
+	padding: 8px 16px;
+	margin-top: 16px;
+	position: sticky;
+	top: 0;
+	z-index: 10;
+`,l=e.div`
+	display: flex;
+	flex-direction: row;
+	column-gap: 16px;
+	padding: 12px 16px;
+	border-bottom: 1px solid #e0e0e0;
+	align-items: center;
+`,c=e.div`
+	min-height: 64px;
+	background-color: ${e=>e.isActive?i.background.positive.light:"white"};
+	border-bottom: 1px solid #e0e0e0;
+	padding: 12px 16px;
+	display: flex;
+	flex-direction: row;
+	column-gap: 16px;
+	justify-content: flex-start;
+	align-items: center;
+	padding-left: ${e=>e.isVariant?"42px":"16px"};
+	:hover {
+		cursor: pointer;
+		background-color: ${i.surface.hovered};
+	}
+`,x=e.div`
+	display: flex;
+	flex-direction: row;
+	max-height: 32px;
+	min-height: 32px;
+	background-color: ${i.background.base};
+	justify-content: flex-start;
+	align-items: center;
+	padding: 8px 16px;
+	position: sticky;
+	top: 0;
+	z-index: 10;
+`,a=e.div`
+	display: flex;
+	flex-direction: column;
+`,s=e.div`
+	min-height: 72px;
+	background: white;
+	padding: 12px 16px;
+	display: flex;
+	flex-direction: row;
+	gap: 16px;
+	align-items: center;
+	justify-content: center;
+
+	.tooltip-title-tag {
+		display: flex;
+		flex: 1;
+		flex-direction: column;
+		gap: 2px;
+	}
+`,g=e.div`
+	height: 72px;
+	width: 72px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	margin: 16px;
+`;e.div`
+	display: flex;
+	width: 32px;
+	height: 32px;
+	padding: 6px;
+	justify-content: center;
+	align-items: center;
+	border: 1px solid ${i.stroke.primary};
+	border-radius: 4px;
+`;export{d as CollectionCardDetailStyle,r as CollectionCardInfoStyle,n as CollectionCardStyle,a as CollectionNameHolder,t as ContainerStyle,c as ProductCardStyle,l as ProductScreenCollectionCardStyle,p as ProductScreenHeader,o as ScrollContainerStyle,x as SelectedScreenHeader,g as VariantCardGridStyle,s as VariantCardListStyle};

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

@@ -0,0 +1,6 @@
+export declare enum OUT_OF_STOCK_ACTION {
+    HIDE = "HIDE",
+    NORMAL = "NORMAL",
+    /** @description shows OOS label  */
+    BLUR = "BLUR"
+}

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

@@ -0,0 +1 @@
+var L;!function(L){L.HIDE="HIDE",L.NORMAL="NORMAL",L.BLUR="BLUR"}(L||(L={}));export{L as OUT_OF_STOCK_ACTION};

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

@@ -0,0 +1,3 @@
+import { FbStatusFetcherReturn, SelectedItems } from './modal';
+import { SelectedCollectionsActions } from './reducers';
+export declare const fetchFbStatus: (data: SelectedItems, storeId: string, selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>, fbStatusFetcher?: ((storeId: string, variantIds: string[]) => FbStatusFetcherReturn) | undefined, autoFetch?: boolean, setSearchedCollections?: React.Dispatch<React.SetStateAction<SelectedItems>>) => void;

package/dist/esm/components/product-picker-v2/useFetchFbStatus copy.js

@@ -0,0 +1 @@
+const o=function(o,v,d,i){let l=arguments.length>5?arguments[5]:void 0;if(!i){const v=Object.assign({},o);Object.keys(v).forEach((o=>{var d,i;const l=null!==(i=null===(d=v[o])||void 0===d?void 0:d.products)&&void 0!==i?i:{};Object.keys(l).forEach((d=>{var i,l,n,t;const s=null!==(t=null===(n=null===(l=null===(i=v[o])||void 0===i?void 0:i.products)||void 0===l?void 0:l[d])||void 0===n?void 0:n.variants)&&void 0!==t?t:{};Object.keys(s).forEach((i=>{var l,n,t,s;const a=null===(s=null===(t=null===(n=null===(l=v[o])||void 0===l?void 0:l.products)||void 0===n?void 0:n[d])||void 0===t?void 0:t.variants)||void 0===s?void 0:s[i];a&&(a.fbStatus="APPROVED")}))}))})),l?l(v):d({type:"paged",data:v})}const n=(o=>{const v=[];return Object.keys(o).forEach((d=>{var i,l;const n=null!==(l=null===(i=o[d])||void 0===i?void 0:i.products)&&void 0!==l?l:{};Object.keys(n).forEach((i=>{var l,n,t,s;const a=null!==(s=null===(t=null===(n=null===(l=o[d])||void 0===l?void 0:l.products)||void 0===n?void 0:n[i])||void 0===t?void 0:t.variants)&&void 0!==s?s:{};Object.keys(a).forEach((l=>{var n,t,s,a;const c=null===(a=null===(s=null===(t=null===(n=o[d])||void 0===n?void 0:n.products)||void 0===t?void 0:t[i])||void 0===s?void 0:s.variants)||void 0===a?void 0:a[l];(null==c?void 0:c.fbStatus)||v.push(l)}))}))})),v})(o);console.log("vj: variantids",n),n.length>0&&i&&i(v,n).then((v=>{const i=Object.assign({},o);Object.keys(i).forEach((o=>{var d,l;const n=null!==(l=null===(d=i[o])||void 0===d?void 0:d.products)&&void 0!==l?l:{};Object.keys(n).forEach((d=>{var l,n,t,s;const a=null!==(s=null===(t=null===(n=null===(l=i[o])||void 0===l?void 0:l.products)||void 0===n?void 0:n[d])||void 0===t?void 0:t.variants)&&void 0!==s?s:{};Object.keys(a).forEach((l=>{var n,t,s,a;const c=null===(a=null===(s=null===(t=null===(n=i[o])||void 0===n?void 0:n.products)||void 0===t?void 0:t[d])||void 0===s?void 0:s.variants)||void 0===a?void 0:a[l];c&&"REJECTED"===v[l]?c.fbStatus="REJECTED":c&&"APPROVED"===v[l]&&(c.fbStatus="APPROVED")}))}))})),console.log("variantids",i),l?l(i):d({type:"paged",data:i})})).catch((v=>{const i=Object.assign({},o);Object.keys(i).forEach((o=>{var v,d;const l=null!==(d=null===(v=i[o])||void 0===v?void 0:v.products)&&void 0!==d?d:{};Object.keys(l).forEach((v=>{var d,l,n,t;const s=null!==(t=null===(n=null===(l=null===(d=i[o])||void 0===d?void 0:d.products)||void 0===l?void 0:l[v])||void 0===n?void 0:n.variants)&&void 0!==t?t:{};Object.keys(s).forEach((d=>{var l,n,t,s;const a=null===(s=null===(t=null===(n=null===(l=i[o])||void 0===l?void 0:l.products)||void 0===n?void 0:n[v])||void 0===t?void 0:t.variants)||void 0===s?void 0:s[d];a&&(a.fbStatus="APPROVED")}))}))})),console.log("vj: variantids",i),l?l(i):d({type:"paged",data:i})}))};export{o as fetchFbStatus};

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

@@ -0,0 +1,5 @@
+import { FbStatusFetcherReturn, SelectedItems } from './modal';
+import { SelectedCollectionsActions } from './reducers';
+export declare const useFetchFbStatusForCollections: (data: SelectedItems, storeId: string, selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>, fbStatusFetcher?: ((storeId: string, variantIds: string[]) => FbStatusFetcherReturn) | undefined, autoFetch?: boolean, setSearchedCollections?: React.Dispatch<React.SetStateAction<SelectedItems | undefined>>) => {
+    fetchFbStatus: () => void;
+};

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

@@ -0,0 +1 @@
+const o=function(o,v,d,i){let l=arguments.length>5?arguments[5]:void 0;const t=()=>{if(!i){const v=Object.assign({},o);Object.keys(v).forEach((o=>{var d,i;const l=null!==(i=null===(d=v[o])||void 0===d?void 0:d.products)&&void 0!==i?i:{};Object.keys(l).forEach((d=>{var i,l,t,n;const s=null!==(n=null===(t=null===(l=null===(i=v[o])||void 0===i?void 0:i.products)||void 0===l?void 0:l[d])||void 0===t?void 0:t.variants)&&void 0!==n?n:{};Object.keys(s).forEach((i=>{var l,t,n,s;const a=null===(s=null===(n=null===(t=null===(l=v[o])||void 0===l?void 0:l.products)||void 0===t?void 0:t[d])||void 0===n?void 0:n.variants)||void 0===s?void 0:s[i];a&&(a.fbStatus="APPROVED")}))}))})),l?l(v):d({type:"paged",data:v})}const t=(()=>{const v=[];return Object.keys(o).forEach((d=>{var i,l;const t=null!==(l=null===(i=o[d])||void 0===i?void 0:i.products)&&void 0!==l?l:{};Object.keys(t).forEach((i=>{var l,t,n,s;const a=null!==(s=null===(n=null===(t=null===(l=o[d])||void 0===l?void 0:l.products)||void 0===t?void 0:t[i])||void 0===n?void 0:n.variants)&&void 0!==s?s:{};Object.keys(a).forEach((l=>{var t,n,s,a;const c=null===(a=null===(s=null===(n=null===(t=o[d])||void 0===t?void 0:t.products)||void 0===n?void 0:n[i])||void 0===s?void 0:s.variants)||void 0===a?void 0:a[l];(null==c?void 0:c.fbStatus)||v.push(l)}))}))})),v})();console.log("vj: variantids",t),t.length>0&&i&&i(v,t).then((v=>{const i=Object.assign({},o);Object.keys(i).forEach((o=>{var d,l;const t=null!==(l=null===(d=i[o])||void 0===d?void 0:d.products)&&void 0!==l?l:{};Object.keys(t).forEach((d=>{var l,t,n,s;const a=null!==(s=null===(n=null===(t=null===(l=i[o])||void 0===l?void 0:l.products)||void 0===t?void 0:t[d])||void 0===n?void 0:n.variants)&&void 0!==s?s:{};Object.keys(a).forEach((l=>{var t,n,s,a;const c=null===(a=null===(s=null===(n=null===(t=i[o])||void 0===t?void 0:t.products)||void 0===n?void 0:n[d])||void 0===s?void 0:s.variants)||void 0===a?void 0:a[l];c&&"REJECTED"===v[l]?c.fbStatus="REJECTED":c&&"APPROVED"===v[l]&&(c.fbStatus="APPROVED")}))}))})),console.log("variantids",i),l?l(i):d({type:"paged",data:i})})).catch((v=>{const i=Object.assign({},o);Object.keys(i).forEach((o=>{var v,d;const l=null!==(d=null===(v=i[o])||void 0===v?void 0:v.products)&&void 0!==d?d:{};Object.keys(l).forEach((v=>{var d,l,t,n;const s=null!==(n=null===(t=null===(l=null===(d=i[o])||void 0===d?void 0:d.products)||void 0===l?void 0:l[v])||void 0===t?void 0:t.variants)&&void 0!==n?n:{};Object.keys(s).forEach((d=>{var l,t,n,s;const a=null===(s=null===(n=null===(t=null===(l=i[o])||void 0===l?void 0:l.products)||void 0===t?void 0:t[v])||void 0===n?void 0:n.variants)||void 0===s?void 0:s[d];a&&(a.fbStatus="APPROVED")}))}))})),console.log("vj: variantids",i),l?l(i):d({type:"paged",data:i})}))};return(!(arguments.length>4&&void 0!==arguments[4])||arguments[4])&&t(),{fetchFbStatus:t}};export{o as useFetchFbStatusForCollections};

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

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

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

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

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

@@ -0,0 +1,32 @@
+/// <reference types="react" />
+import { ProductVariant } from './modal';
+import { SelectedCollectionsActions } from './reducers';
+import { OUT_OF_STOCK_ACTION } from './type';
+/**
+ * Extended type from Product Variant, which contains ids and name.
+ */
+export type ProductVariantForRearrange = ProductVariant & {
+    variantId: string;
+    productId: string;
+    collectionId: string;
+    productName: string;
+};
+/**
+ * Props type for variant card in rearrange screen
+ */
+export interface VariantCardInterface {
+    data: ProductVariantForRearrange;
+    selectedCollectionsDispatch?: React.Dispatch<SelectedCollectionsActions>;
+    outOfStockAction?: OUT_OF_STOCK_ACTION;
+    onDelete?: () => void;
+}
+/**
+ * Variant card in list view format.
+ * Displays image, name and delete icon
+ */
+export declare const VariantCardListView: (props: VariantCardInterface) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Variant card in grid view format.
+ * Displays only image
+ */
+export declare const VariantCardGridView: (props: VariantCardInterface) => import("react/jsx-runtime").JSX.Element;

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

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

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

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+import { SelectedCollectionsActions } from './reducers';
+import { OUT_OF_STOCK_ACTION } from './type';
+import { ProductVariantForRearrange } from './variant';
+/**
+ * Props for list of variants - applicable both in list and grid view
+ */
+export type VariantsComponentProps = {
+    selectedVariants: ProductVariantForRearrange[];
+    setSelectedVariants: React.Dispatch<React.SetStateAction<ProductVariantForRearrange[]>>;
+    selectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;
+    outOfStockAction?: OUT_OF_STOCK_ACTION;
+};
+/**
+ * Returns a react component of variants list, which are eligible to drag and drop.
+ */
+export declare const VariantsList: ({ selectedVariants, setSelectedVariants, selectedCollectionsDispatch, outOfStockAction, }: VariantsComponentProps) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Returns a react component of variants grid, which are eligible to drag and drop.
+ */
+export declare const VariantsGrid: ({ selectedVariants }: VariantsComponentProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1 @@
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import{useState as a}from"react";import{Droppable as t,Draggable as s}from"react-beautiful-dnd";import{COLORS as n}from"../../constants/Theme.js";import{VariantCardListView as d,VariantCardGridView as i}from"./variant.js";const l=i=>{let{selectedVariants:l,setSelectedVariants:o,selectedCollectionsDispatch:c,outOfStockAction:p}=i;const[g,b]=a(-1);function f(e){if(null==e?void 0:e.transform){const r=`translate(0px, ${e.transform.split(",").pop()}`;return Object.assign(Object.assign({},e),{transform:r})}return e}return e(t,Object.assign({droppableId:"droppable-list"},{children:(a,t)=>r("div",Object.assign({},a.droppableProps,{ref:a.innerRef,style:Object.assign({backgroundColor:n.surface.subdued,padding:"0.05px",height:l.length<8?"550px":"100%"},a.droppableProps.style)},{children:[l.map(((r,a)=>e("div",Object.assign({style:{background:n.surface.hovered,margin:"5px",boxShadow:a===g?"0px 4px 12px rgba(0, 0, 0, 0.12)":""},onMouseEnter:()=>b(a),onMouseLeave:()=>b(-1)},{children:e(s,Object.assign({draggableId:`${r.productId}-${r.variantId}`,index:a},{children:(t,s)=>e("div",Object.assign({ref:t.innerRef},t.draggableProps,t.dragHandleProps,{style:f(Object.assign(Object.assign({},t.draggableProps.style),t.draggableSnapshot))},{children:e(d,{data:r,selectedCollectionsDispatch:c,onDelete:()=>{const e=l.slice();e[a].displayOrder=null,e.splice(a,1),o(e)},outOfStockAction:p},`${r.productId}-${r.variantId}`)}))}),`${r.productId}-${r.variantId}`)}),`${r.productId}-${r.variantId}`))),a.placeholder&&t.isDraggingOver?e("div",Object.assign({style:{background:n.surface.hovered,margin:"5px"}},{children:a.placeholder})):null]}))}))},o=a=>{let{selectedVariants:n}=a;return e(t,Object.assign({droppableId:"droppable-horizontal"},{children:a=>r("div",Object.assign({},a.droppableProps,{ref:a.innerRef,style:Object.assign(Object.assign({},a.droppableProps.style),{display:"flex"})},{children:[e(t,Object.assign({droppableId:"droppable-vertical",direction:"horizontal"},{children:a=>r("div",Object.assign({},a.droppableProps,{ref:a.innerRef,style:Object.assign(Object.assign({},a.droppableProps.style),{display:"flex",flexWrap:"wrap",flexDirection:"row"})},{children:[n.map(((a,t)=>e(s,Object.assign({draggableId:`${a.productId}-${a.variantId}`,index:t},{children:(t,s)=>r("div",Object.assign({ref:t.innerRef},t.draggableProps,t.dragHandleProps,{children:[e(i,{data:a}),t.placeholder]}))}),`${a.productId}-${a.variantId}`))),a.placeholder]}))})),a.placeholder]}))}))};export{o as VariantsGrid,l as VariantsList};

package/dist/esm/components/progress-bar/ProgressBarComponent.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+export interface ProgressBarProps {
+    completed: number;
+    isAnimated: boolean;
+    color?: string;
+    height?: number;
+}
+export declare const ProgressBarComponent: (props: ProgressBarProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ProgressCompletedBar: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & {
+    color: string;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/esm/components/progress-bar/ProgressBarComponent.js

@@ -0,0 +1 @@
+import c from"@emotion/styled/base";import{jsx as b}from"react/jsx-runtime";import{ProgressBar as o}from"react-bootstrap";import{COLORS as t}from"../../constants/Theme.js";const l=c=>b(I,Object.assign({color:c.color?c.color:t.content.brand},{children:b(o,{animated:c.isAnimated,now:c.completed,style:{height:`${c.height?c.height:8}px`}})})),I=c("div","production"===process.env.NODE_ENV?{target:"e17nsuvt0"}:{target:"e17nsuvt0",label:"ProgressCompletedBar"})("flex:50%;.progress-bar{background-color:",(c=>c.color),";}"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlByb2dyZXNzQmFyQ29tcG9uZW50LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFPK0MiLCJmaWxlIjoiUHJvZ3Jlc3NCYXJDb21wb25lbnQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsganN4IGFzIF9qc3ggfSBmcm9tIFwicmVhY3QvanN4LXJ1bnRpbWVcIjtcclxuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xyXG5pbXBvcnQgeyBQcm9ncmVzc0JhciB9IGZyb20gJ3JlYWN0LWJvb3RzdHJhcCc7XHJcbmltcG9ydCB7IENPTE9SUyB9IGZyb20gXCIuLi8uLi9jb25zdGFudHMvVGhlbWVcIjtcclxuZXhwb3J0IGNvbnN0IFByb2dyZXNzQmFyQ29tcG9uZW50ID0gKHByb3BzKSA9PiB7XHJcbiAgICByZXR1cm4gKF9qc3goUHJvZ3Jlc3NDb21wbGV0ZWRCYXIsIE9iamVjdC5hc3NpZ24oeyBjb2xvcjogcHJvcHMuY29sb3IgPyBwcm9wcy5jb2xvciA6IENPTE9SUy5jb250ZW50LmJyYW5kIH0sIHsgY2hpbGRyZW46IF9qc3goUHJvZ3Jlc3NCYXIsIHsgYW5pbWF0ZWQ6IHByb3BzLmlzQW5pbWF0ZWQsIG5vdzogcHJvcHMuY29tcGxldGVkLCBzdHlsZTogeyBoZWlnaHQ6IGAke3Byb3BzLmhlaWdodCA/IHByb3BzLmhlaWdodCA6IDh9cHhgIH0gfSkgfSkpKTtcclxufTtcclxuZXhwb3J0IGNvbnN0IFByb2dyZXNzQ29tcGxldGVkQmFyID0gc3R5bGVkLmRpdiBgXG5cdGZsZXg6IDUwJTtcblx0LnByb2dyZXNzLWJhciB7XG5cdFx0YmFja2dyb3VuZC1jb2xvcjogJHsocHJvcHMpID0+IHByb3BzLmNvbG9yfTtcblx0fVxuYDtcclxuLy8jIHNvdXJjZU1hcHBpbmdVUkw9UHJvZ3Jlc3NCYXJDb21wb25lbnQuanMubWFwIl19 */"));export{l as ProgressBarComponent,I as ProgressCompletedBar};

package/dist/esm/components/progress-bar/index.d.ts

@@ -0,0 +1 @@
+export * from './ProgressBarComponent';

package/dist/esm/components/radioButton/RadioButton.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+export type RadioButtonProps = {
+    isActive: boolean;
+    isDisabled?: boolean;
+    value?: string;
+    label?: string;
+    onValueChange: (checked: boolean, value?: string) => void;
+    skipHoverState?: boolean;
+    size?: 'DEFAULT' | 'SMALL';
+};
+export declare const RadioButton: React.FC<RadioButtonProps>;

package/dist/esm/components/radioButton/RadioButton.js

@@ -0,0 +1 @@
+import{jsxs as i,jsx as e}from"react/jsx-runtime";import{useState as s,useEffect as l}from"react";import{RadioButtonContainer as t,RadioButtonIcon as a}from"./RadioButton.styled.js";import{BodyPrimary as o,BodyCaption as r}from"../TypographyStyle.js";import{COLORS as c}from"../../constants/Theme.js";const n=s=>{const l=s.isDisabled?c.content.inactive:s.isActive?c.background.positive.vibrant:c.content.primary;return i("svg",Object.assign({width:s.isSmall?"16":"20",height:s.isSmall?"16":"20",viewBox:s.isSmall?"0 0 16 16":"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e("circle",{cx:s.isSmall?"8":"10",cy:s.isSmall?"8":"10",r:s.isSmall?6:9,stroke:l,strokeWidth:s.isSmall?1.5:2}),s.isActive&&e("circle",{cx:s.isSmall?"8":"10",cy:s.isSmall?"8":"10",r:s.isSmall?3:5,fill:s.isDisabled?c.content.inactive:c.background.positive.vibrant})]}))},d=d=>{const[m,b]=s(d.isActive||!1),[v,p]=s(!1),[S,h]=s(!1);return l((()=>{b(d.isActive)}),[d.isActive]),i(t,Object.assign({onClick:()=>{var i;if(!d.isDisabled){const e=!m;b(e),null===(i=d.onValueChange)||void 0===i||i.call(d,e,d.value)}},onMouseEnter:()=>p(!d.skipHoverState),onMouseLeave:()=>p(!1),onMouseDown:()=>h(!d.skipHoverState),onMouseUp:()=>h(!1)},{children:[e(a,Object.assign({checked:m,hovered:v,clicked:S,isDisabled:d.isDisabled||!1,size:d.size},{children:e(n,{isSmall:"SMALL"===d.size,isActive:m,isDisabled:d.isDisabled||!1})})),d.label&&"SMALL"!==d.size&&e(o,Object.assign({color:d.isDisabled?c.text.disabled:c.text.primary},{children:d.label})),d.label&&"SMALL"===d.size&&e(r,Object.assign({color:d.isDisabled?c.text.disabled:c.text.primary},{children:d.label}))]}))};export{d as RadioButton};

package/dist/esm/components/radioButton/RadioButton.styled.d.ts

@@ -0,0 +1,8 @@
+export declare const RadioButtonContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const RadioButtonIcon: import("styled-components").StyledComponent<"div", any, {
+    checked: boolean;
+    hovered: boolean;
+    clicked: boolean;
+    isDisabled: boolean;
+    size?: "SMALL" | "DEFAULT" | undefined;
+}, never>;

package/dist/esm/components/radioButton/RadioButton.styled.js

@@ -0,0 +1,22 @@
+import e,{css as i}from"styled-components";import{COLORS as t}from"../../constants/Theme.js";const s=e.div`
+	display: inline-flex;
+	gap: 8px;
+	align-items: center;
+	cursor: pointer;
+`,o=e.div`
+	width: ${e=>"SMALL"===e.size?16:20}px;
+	height: ${e=>"SMALL"===e.size?16:20}px;
+	border-radius: 50%;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	${e=>e.hovered&&i`
+			outline: ${"SMALL"===e.size?1.5:3}px solid
+				${t.surface.hovered};
+		`}
+	${e=>e.clicked&&!e.isDisabled&&i`
+			outline: ${"SMALL"===e.size?1.5:3}px solid
+				${e.checked?t.stroke.positive.lightAlt:t.surface.hovered};
+			outline-offset: 2px;
+		`}
+`;export{s as RadioButtonContainer,o as RadioButtonIcon};

package/dist/esm/components/radioButton/index.d.ts

@@ -0,0 +1 @@
+export * from './RadioButton';

package/dist/esm/components/radioList/RadioList.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { RadioButtonProps } from "../radioButton";
+type RadioListItem = Omit<RadioButtonProps, 'onValueChange'> & {
+    value: string;
+};
+export type RadioListProps = {
+    title?: string;
+    subTitle?: string;
+    listItems: RadioListItem[];
+    onChange: (option: RadioListItem) => void;
+};
+export declare const RadioList: React.FC<RadioListProps>;
+export {};

package/dist/esm/components/radioList/RadioList.js

@@ -0,0 +1 @@
+import{jsxs as t,jsx as e}from"react/jsx-runtime";import{useState as i,useEffect as s}from"react";import{RadioButton as o}from"../radioButton/RadioButton.js";import{RadioListStyled as r}from"./RadioList.styled.js";import{TitleRegular as n,BodySecondary as a}from"../TypographyStyle.js";import{COLORS as c}from"../../constants/Theme.js";const l=l=>{const[m,d]=i(l.listItems);s((()=>{d(l.listItems)}),[l.listItems]);const h=(t,e)=>{let i;const s=[...m];s.forEach((s=>{s.value===e?(i=s,s.isActive=t):s.isActive=!t})),d(s),l.onChange(i)};return t(r,{children:[(l.title||l.subTitle)&&t("div",Object.assign({className:"title__container"},{children:[l.title&&e(n,{children:l.title}),l.subTitle&&e(a,Object.assign({color:c.text.secondary},{children:l.subTitle}))]})),e("div",Object.assign({className:"list__container"},{children:m.map((t=>e(o,Object.assign({},t,{onValueChange:h}),t.value)))}))]})};export{l as RadioList};

package/dist/esm/components/radioList/RadioList.styled.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare const RadioListStyled: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/esm/components/radioList/RadioList.styled.js

@@ -0,0 +1 @@
+import t from"@emotion/styled/base";const e=t("div","production"===process.env.NODE_ENV?{target:"eik8mml0"}:{target:"eik8mml0",label:"RadioListStyled"})("production"===process.env.NODE_ENV?{name:"1w7m8q0",styles:".title__container{margin-bottom:12px;}.list__container{display:flex;flex-direction:column;gap:10px;}"}:{name:"1w7m8q0",styles:".title__container{margin-bottom:12px;}.list__container{display:flex;flex-direction:column;gap:10px;}",map:"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlJhZGlvTGlzdC5zdHlsZWQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUMwQyIsImZpbGUiOiJSYWRpb0xpc3Quc3R5bGVkLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcclxuZXhwb3J0IGNvbnN0IFJhZGlvTGlzdFN0eWxlZCA9IHN0eWxlZC5kaXYgYFxuXHQudGl0bGVfX2NvbnRhaW5lciB7XG5cdFx0bWFyZ2luLWJvdHRvbTogMTJweDtcblx0fVxuXHQubGlzdF9fY29udGFpbmVyIHtcblx0XHRkaXNwbGF5OiBmbGV4O1xuXHRcdGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG5cdFx0Z2FwOiAxMHB4O1xuXHR9XG5gO1xyXG4vLyMgc291cmNlTWFwcGluZ1VSTD1SYWRpb0xpc3Quc3R5bGVkLmpzLm1hcCJdfQ== */",toString:function(){return"You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."}});export{e as RadioListStyled};

package/dist/esm/components/radioList/index.d.ts

@@ -0,0 +1 @@
+export * from './RadioList';

package/dist/esm/components/resizeImage/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+export interface ResizableImageProps {
+    imageUrl: string;
+    targetSize: number;
+    alt?: string;
+    style?: React.CSSProperties;
+}
+export declare const ResizableImage: React.FC<ResizableImageProps>;

package/dist/esm/components/resizeImage/index.js

@@ -0,0 +1 @@
+import{jsx as t}from"react/jsx-runtime";import{useState as e,useEffect as r}from"react";import{resizeImage as i}from"../../utils/resizeImage.js";const m=m=>{let{imageUrl:o,targetSize:s,alt:a,style:c}=m;const[l,g]=e("");return r((()=>{i(o,s).then((t=>{g(t)})).catch((t=>{g(o)}))}),[o,s]),t("img",{alt:a,src:l,height:s,width:s,style:c})};export{m as ResizableImage};