@bikdotai/bik-component-library 0.0.817-beta.5 → 0.0.817-beta.7

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-dev-runtime"),D=require("../../assets/icons/arrow_left.svg.js"),s=require("react"),x=require("../TypographyStyle.js"),h=require("./emptyState.js"),g=require("./product.js"),j=require("./reducers.js"),w=require("./style.js"),a=require("./utility.js"),E=require("../icon-button/IconButton.js"),P=y=>{const{selectedCollections:t,selectedCollectionsDispatch:S,setScreen:v,collections:N,hideProductVariants:p=!1,outOfStockAction:k,storeId:m,fbStatusFetcher:b,appType:f}=y,c=s.useRef(0),n=s.useRef(null),[l,i]=s.useReducer(j.paginationReducer,{});s.useEffect(()=>{c.current=0;const e=a.paginateSelectedItems(t,10,0);i({type:"paginate",data:e}),a.fetchFbStatusCollection(e,m,f,i,b,"set"),c.current+=1},[]),s.useEffect(()=>{i({type:"filter",data:t})},[t]),s.useEffect(()=>{const e=new IntersectionObserver(o=>{if(o[0].isIntersecting&&c.current>0){const u=a.paginateSelectedItems(t,10,c.current);i({type:"paginate",data:u}),a.fetchFbStatusCollection(u,m,f,i,b,"update"),c.current+=1}},{threshold:1});return n.current&&e.observe(n.current),()=>{n.current&&e.unobserve(n.current)}},[n,t]);const d=t;return r.jsxDEV("div",{children:[r.jsxDEV(w.SelectedScreenHeader,{children:[r.jsxDEV(E.IconButton,{Icon:D.default,onClick:()=>{v("collections")}},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:144,columnNumber:5},void 0),r.jsxDEV(x.BodyCaption,{children:"Selected Products"},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:150,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:143,columnNumber:4},void 0),r.jsxDEV("div",{children:[Object.keys(l).length>0?r.jsxDEV(r.Fragment,{children:Object.keys(l).map(e=>Object.keys(l?.[e]?.products||[]).map(o=>{let u=!1;return d?.isCustom&&(u=!0),r.jsxDEV(g.ProductGroup,{upliftAdditions:null,collectionId:e,productId:o,data:l[e].products[o],isProductPartiallyChecked:a.isProductPartiallyChecked(e,o,d,N?.[e],p),selectedData:d,selectedCollectionsDispatch:S,viewOnly:u,hideProductVariants:p,outOfStockAction:k},o,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:164,columnNumber:10},void 0)}))},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:154,columnNumber:6},void 0):r.jsxDEV(h.EmptyState,{title:"No Products Selected",subtitle:"Select products will appear here"},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:194,columnNumber:6},void 0),r.jsxDEV("div",{ref:n},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:199,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:152,columnNumber:4},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:142,columnNumber:3},void 0)};exports.SelectedScreen=P;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-dev-runtime"),N=require("../../assets/icons/arrow_left.svg.js"),c=require("react"),D=require("../TypographyStyle.js"),x=require("./emptyState.js"),g=require("./product.js"),j=require("./reducers.js"),E=require("./style.js"),u=require("./utility.js"),P=require("../icon-button/IconButton.js"),q=f=>{const{selectedCollections:t,selectedCollectionsDispatch:v,setScreen:y,collections:h,hideProductVariants:p=!1,outOfStockAction:S,storeId:m,fbStatusFetcher:b,appType:k}=f,o=c.useRef(0),n=c.useRef(null),[l,i]=c.useReducer(j.paginationReducer,{});c.useEffect(()=>{o.current=0;const e=u.paginateSelectedItems(t,10,0);i({type:"paginate",data:e}),u.fetchFbStatusCollection(e,m,k,i,b,"set"),o.current+=1},[]),c.useEffect(()=>{i({type:"filter",data:t})},[t]),c.useEffect(()=>{const e=new IntersectionObserver(s=>{if(s[0].isIntersecting&&o.current>0){const a=u.paginateSelectedItems(t,10,o.current);i({type:"paginate",data:a}),u.fetchFbStatusCollection(a,m,k,i,b,"update"),o.current+=1}},{threshold:1});return n.current&&e.observe(n.current),()=>{n.current&&e.unobserve(n.current)}},[n,t]);const d=t;return r.jsxDEV("div",{children:[r.jsxDEV(E.SelectedScreenHeader,{children:[r.jsxDEV(P.IconButton,{Icon:N.default,onClick:()=>{y("collections")}},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:144,columnNumber:5},void 0),r.jsxDEV(D.BodyCaption,{children:"Selected Products"},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:150,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:143,columnNumber:4},void 0),r.jsxDEV("div",{children:[Object.keys(l).length>0?r.jsxDEV(r.Fragment,{children:Object.keys(l).map(e=>Object.keys(l?.[e]?.products||[]).map(s=>{let a=!1;return d?.isCustom&&(a=!0),r.jsxDEV(g.ProductGroup,{upliftAdditions:null,collectionId:e,productId:s,data:l[e].products[s],isProductPartiallyChecked:u.isProductPartiallyChecked(e,s,d,h?.[e],p),selectedData:d,selectedCollectionsDispatch:v,viewOnly:a,hideProductVariants:p,outOfStockAction:S},s,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:164,columnNumber:10},void 0)}))},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:154,columnNumber:6},void 0):r.jsxDEV(x.EmptyState,{title:"No Products Selected",subtitle:"Select products will appear here"},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:194,columnNumber:6},void 0),r.jsxDEV("div",{ref:n},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:199,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:152,columnNumber:4},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/selectedScreen.tsx",lineNumber:142,columnNumber:3},void 0)};exports.SelectedScreen=q;
 //# sourceMappingURL=selectedScreen.js.map

package/dist/cjs/components/product-picker-v2/selectedScreen.js.map

@@ -1 +1 @@
-{"version":3,"file":"selectedScreen.js","sources":["../../../../src/components/product-picker-v2/selectedScreen.tsx"],"sourcesContent":["import type { ApplicationType } from '@bikdotai/bik-models/growth/models/bik-store';\nimport ArrowLeftIcon from '@src/assets/icons/arrow_left.svg';\nimport { useEffect, useReducer, useRef } from 'react';\nimport { IconButton } from '../icon-button';\nimport { BodyCaption } from '../TypographyStyle';\nimport { EmptyState } from './emptyState';\nimport { ProductGroup } from './product';\nimport { paginationReducer, type SelectedCollectionsActions } from './reducers';\nimport { SelectedScreenHeader } from './style';\nimport {\n\ttype Collection,\n\ttype FbStatusFetcherReturn,\n\tOUT_OF_STOCK_ACTION,\n\ttype Product,\n\ttype SelectedItems,\n} from './type';\nimport {\n\tfetchFbStatusCollection,\n\tisProductPartiallyChecked,\n\tpaginateSelectedItems,\n} from './utility';\n\ninterface SelectedScreenInterface {\n\tselectedCollections: SelectedItems;\n\tselectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;\n\tsetScreen: React.Dispatch<React.SetStateAction<string>>;\n\tcollections: { [key: string]: Collection };\n\thideProductVariants?: boolean;\n\toutOfStockAction?: OUT_OF_STOCK_ACTION;\n\tstoreId: string;\n\tappType: ApplicationType;\n\tfbStatusFetcher?: (\n\t\tstoreId: string,\n\t\tvariantIds: string[],\n\t\tappType: ApplicationType,\n\t) => FbStatusFetcherReturn;\n}\n\nexport const SelectedScreen = (props: SelectedScreenInterface) => {\n\tconst {\n\t\tselectedCollections,\n\t\tselectedCollectionsDispatch,\n\t\tsetScreen,\n\t\tcollections,\n\t\thideProductVariants = false,\n\t\toutOfStockAction,\n\t\tstoreId,\n\t\tfbStatusFetcher,\n\t\tappType,\n\t} = props;\n\n\tconst nextpageRef = useRef(0);\n\tconst observerTarget = useRef(null);\n\n\tconst [curScreenData, dispatchCurScreenData] = useReducer(\n\t\tpaginationReducer,\n\t\t{},\n\t);\n\n\t/**\n\t * First time load, show only 10 products.\n\t * Fetch Fb status for those 10 products.\n\t */\n\tuseEffect(() => {\n\t\tnextpageRef.current = 0;\n\n\t\tconst paginatedProducts = paginateSelectedItems(selectedCollections, 10, 0);\n\n\t\tdispatchCurScreenData({\n\t\t\ttype: 'paginate',\n\t\t\tdata: paginatedProducts,\n\t\t});\n\n\t\tfetchFbStatusCollection(\n\t\t\tpaginatedProducts,\n\t\t\tstoreId,\n\t\t\tappType,\n\t\t\tdispatchCurScreenData,\n\t\t\tfbStatusFetcher,\n\t\t\t'set',\n\t\t);\n\n\t\tnextpageRef.current += 1;\n\t}, []);\n\n\t/**\n\t * When selected collections changes, i.e. when user unselects a variant/product, filter out.\n\t */\n\tuseEffect(() => {\n\t\tdispatchCurScreenData({ type: 'filter', data: selectedCollections });\n\t}, [selectedCollections]);\n\n\t/**\n\t * Pagination logic. When scroll bar is end of the container, gets the next 10 products and fetches fb status for those 10 products.\n\t * After that, Increments next page ref which acts as offset.\n\t */\n\tuseEffect(() => {\n\t\tconst observer = new IntersectionObserver(\n\t\t\t(entries) => {\n\t\t\t\tif (entries[0].isIntersecting) {\n\t\t\t\t\tif (nextpageRef.current > 0) {\n\t\t\t\t\t\tconst paginatedProducts = paginateSelectedItems(\n\t\t\t\t\t\t\tselectedCollections,\n\t\t\t\t\t\t\t10,\n\t\t\t\t\t\t\tnextpageRef.current,\n\t\t\t\t\t\t);\n\n\t\t\t\t\t\tdispatchCurScreenData({\n\t\t\t\t\t\t\ttype: 'paginate',\n\t\t\t\t\t\t\tdata: paginatedProducts,\n\t\t\t\t\t\t});\n\n\t\t\t\t\t\tfetchFbStatusCollection(\n\t\t\t\t\t\t\tpaginatedProducts,\n\t\t\t\t\t\t\tstoreId,\n\t\t\t\t\t\t\tappType,\n\t\t\t\t\t\t\tdispatchCurScreenData,\n\t\t\t\t\t\t\tfbStatusFetcher,\n\t\t\t\t\t\t\t'update',\n\t\t\t\t\t\t);\n\t\t\t\t\t\tnextpageRef.current += 1;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t\t{ threshold: 1 },\n\t\t);\n\n\t\tif (observerTarget.current) {\n\t\t\tobserver.observe(observerTarget.current);\n\t\t}\n\n\t\treturn () => {\n\t\t\tif (observerTarget.current) {\n\t\t\t\tobserver.unobserve(observerTarget.current);\n\t\t\t}\n\t\t};\n\t}, [observerTarget, selectedCollections]);\n\n\tconst collectionsToShow = selectedCollections;\n\n\treturn (\n\t\t<div>\n\t\t\t<SelectedScreenHeader>\n\t\t\t\t<IconButton\n\t\t\t\t\tIcon={ArrowLeftIcon}\n\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\tsetScreen('collections');\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<BodyCaption>{'Selected Products'}</BodyCaption>\n\t\t\t</SelectedScreenHeader>\n\t\t\t<div>\n\t\t\t\t{Object.keys(curScreenData).length > 0 ? (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{Object.keys(curScreenData).map((collectionId) => {\n\t\t\t\t\t\t\treturn Object.keys(\n\t\t\t\t\t\t\t\tcurScreenData?.[collectionId]?.['products'] || [],\n\t\t\t\t\t\t\t).map((productId) => {\n\t\t\t\t\t\t\t\tlet viewOnly = false;\n\t\t\t\t\t\t\t\tif (collectionsToShow?.['isCustom']) {\n\t\t\t\t\t\t\t\t\tviewOnly = true;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<ProductGroup\n\t\t\t\t\t\t\t\t\t\tupliftAdditions={null}\n\t\t\t\t\t\t\t\t\t\tcollectionId={collectionId}\n\t\t\t\t\t\t\t\t\t\tproductId={productId}\n\t\t\t\t\t\t\t\t\t\tdata={\n\t\t\t\t\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\t\t\t\t\tcurScreenData[collectionId]['products'] as {\n\t\t\t\t\t\t\t\t\t\t\t\t\t[key: string]: Product;\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t)[productId]\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tisProductPartiallyChecked={isProductPartiallyChecked(\n\t\t\t\t\t\t\t\t\t\t\tcollectionId,\n\t\t\t\t\t\t\t\t\t\t\tproductId,\n\t\t\t\t\t\t\t\t\t\t\tcollectionsToShow,\n\t\t\t\t\t\t\t\t\t\t\tcollections?.[collectionId],\n\t\t\t\t\t\t\t\t\t\t\thideProductVariants,\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\tselectedData={collectionsToShow}\n\t\t\t\t\t\t\t\t\t\tselectedCollectionsDispatch={selectedCollectionsDispatch}\n\t\t\t\t\t\t\t\t\t\tviewOnly={viewOnly}\n\t\t\t\t\t\t\t\t\t\tkey={productId}\n\t\t\t\t\t\t\t\t\t\thideProductVariants={hideProductVariants}\n\t\t\t\t\t\t\t\t\t\toutOfStockAction={outOfStockAction}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t})}\n\t\t\t\t\t</>\n\t\t\t\t) : (\n\t\t\t\t\t<EmptyState\n\t\t\t\t\t\ttitle={'No Products Selected'}\n\t\t\t\t\t\tsubtitle={'Select products will appear here'}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<div ref={observerTarget}></div>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n"],"names":["SelectedScreen","props","selectedCollections","selectedCollectionsDispatch","setScreen","collections","hideProductVariants","outOfStockAction","storeId","fbStatusFetcher","appType","nextpageRef","useRef","observerTarget","curScreenData","dispatchCurScreenData","useReducer","paginationReducer","useEffect","paginatedProducts","paginateSelectedItems","fetchFbStatusCollection","observer","entries","collectionsToShow","jsxDEV","SelectedScreenHeader","IconButton","ArrowLeftIcon","this","BodyCaption","Fragment","collectionId","productId","viewOnly","ProductGroup","isProductPartiallyChecked","EmptyState"],"mappings":"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"}
+{"version":3,"file":"selectedScreen.js","sources":["../../../../src/components/product-picker-v2/selectedScreen.tsx"],"sourcesContent":["import type { ApplicationType } from '@bikdotai/bik-models/growth/models/bik-store';\nimport ArrowLeftIcon from '@src/assets/icons/arrow_left.svg';\nimport { useEffect, useReducer, useRef } from 'react';\nimport { IconButton } from '../icon-button';\nimport { BodyCaption } from '../TypographyStyle';\nimport { EmptyState } from './emptyState';\nimport { ProductGroup } from './product';\nimport { paginationReducer, type SelectedCollectionsActions } from './reducers';\nimport { SelectedScreenHeader } from './style';\nimport {\n\ttype Collection,\n\ttype FbStatusFetcherReturn,\n\tOUT_OF_STOCK_ACTION,\n\ttype Product,\n\ttype SelectedItems,\n} from './type';\nimport {\n\tfetchFbStatusCollection,\n\tisProductPartiallyChecked,\n\tpaginateSelectedItems,\n} from './utility';\n\ninterface SelectedScreenInterface {\n\tselectedCollections: SelectedItems;\n\tselectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;\n\tsetScreen: React.Dispatch<React.SetStateAction<string>>;\n\tcollections: { [key: string]: Collection };\n\thideProductVariants?: boolean;\n\toutOfStockAction?: OUT_OF_STOCK_ACTION;\n\tstoreId: string;\n\tappType: ApplicationType;\n\tfbStatusFetcher?: (\n\t\tstoreId: string,\n\t\tvariantIds: string[],\n\t\tappType: ApplicationType,\n\t) => FbStatusFetcherReturn;\n}\n\nexport const SelectedScreen = (props: SelectedScreenInterface) => {\n\tconst {\n\t\tselectedCollections,\n\t\tselectedCollectionsDispatch,\n\t\tsetScreen,\n\t\tcollections,\n\t\thideProductVariants = false,\n\t\toutOfStockAction,\n\t\tstoreId,\n\t\tfbStatusFetcher,\n\t\tappType,\n\t} = props;\n\n\tconst nextpageRef = useRef(0);\n\tconst observerTarget = useRef(null);\n\n\tconst [curScreenData, dispatchCurScreenData] = useReducer(\n\t\tpaginationReducer,\n\t\t{},\n\t);\n\n\t/**\n\t * First time load, show only 10 products.\n\t * Fetch Fb status for those 10 products.\n\t */\n\tuseEffect(() => {\n\t\tnextpageRef.current = 0;\n\n\t\tconst paginatedProducts = paginateSelectedItems(selectedCollections, 10, 0);\n\n\t\tdispatchCurScreenData({\n\t\t\ttype: 'paginate',\n\t\t\tdata: paginatedProducts,\n\t\t});\n\n\t\tfetchFbStatusCollection(\n\t\t\tpaginatedProducts,\n\t\t\tstoreId,\n\t\t\tappType,\n\t\t\tdispatchCurScreenData,\n\t\t\tfbStatusFetcher,\n\t\t\t'set',\n\t\t);\n\n\t\tnextpageRef.current += 1;\n\t}, []);\n\n\t/**\n\t * When selected collections changes, i.e. when user unselects a variant/product, filter out.\n\t */\n\tuseEffect(() => {\n\t\tdispatchCurScreenData({ type: 'filter', data: selectedCollections });\n\t}, [selectedCollections]);\n\n\t/**\n\t * Pagination logic. When scroll bar is end of the container, gets the next 10 products and fetches fb status for those 10 products.\n\t * After that, Increments next page ref which acts as offset.\n\t */\n\tuseEffect(() => {\n\t\tconst observer = new IntersectionObserver(\n\t\t\t(entries) => {\n\t\t\t\tif (entries[0].isIntersecting) {\n\t\t\t\t\tif (nextpageRef.current > 0) {\n\t\t\t\t\t\tconst paginatedProducts = paginateSelectedItems(\n\t\t\t\t\t\t\tselectedCollections,\n\t\t\t\t\t\t\t10,\n\t\t\t\t\t\t\tnextpageRef.current,\n\t\t\t\t\t\t);\n\n\t\t\t\t\t\tdispatchCurScreenData({\n\t\t\t\t\t\t\ttype: 'paginate',\n\t\t\t\t\t\t\tdata: paginatedProducts,\n\t\t\t\t\t\t});\n\n\t\t\t\t\t\tfetchFbStatusCollection(\n\t\t\t\t\t\t\tpaginatedProducts,\n\t\t\t\t\t\t\tstoreId,\n\t\t\t\t\t\t\tappType,\n\t\t\t\t\t\t\tdispatchCurScreenData,\n\t\t\t\t\t\t\tfbStatusFetcher,\n\t\t\t\t\t\t\t'update',\n\t\t\t\t\t\t);\n\t\t\t\t\t\tnextpageRef.current += 1;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t\t{ threshold: 1 },\n\t\t);\n\n\t\tif (observerTarget.current) {\n\t\t\tobserver.observe(observerTarget.current);\n\t\t}\n\n\t\treturn () => {\n\t\t\tif (observerTarget.current) {\n\t\t\t\tobserver.unobserve(observerTarget.current);\n\t\t\t}\n\t\t};\n\t}, [observerTarget, selectedCollections]);\n\n\tconst collectionsToShow = selectedCollections;\n\n\treturn (\n\t\t<div>\n\t\t\t<SelectedScreenHeader>\n\t\t\t\t<IconButton\n\t\t\t\t\tIcon={ArrowLeftIcon}\n\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\tsetScreen('collections');\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<BodyCaption>{'Selected Products'}</BodyCaption>\n\t\t\t</SelectedScreenHeader>\n\t\t\t<div>\n\t\t\t\t{Object.keys(curScreenData).length > 0 ? (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{Object.keys(curScreenData).map((collectionId) => {\n\t\t\t\t\t\t\treturn Object.keys(\n\t\t\t\t\t\t\t\tcurScreenData?.[collectionId]?.['products'] || [],\n\t\t\t\t\t\t\t).map((productId) => {\n\t\t\t\t\t\t\t\tlet viewOnly = false;\n\t\t\t\t\t\t\t\tif (collectionsToShow?.['isCustom']) {\n\t\t\t\t\t\t\t\t\tviewOnly = true;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t<ProductGroup\n\t\t\t\t\t\t\t\t\t\tupliftAdditions={null}\n\t\t\t\t\t\t\t\t\t\tcollectionId={collectionId}\n\t\t\t\t\t\t\t\t\t\tproductId={productId}\n\t\t\t\t\t\t\t\t\t\tdata={\n\t\t\t\t\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\t\t\t\t\tcurScreenData[collectionId]['products'] as {\n\t\t\t\t\t\t\t\t\t\t\t\t\t[key: string]: Product;\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t)[productId]\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tisProductPartiallyChecked={isProductPartiallyChecked(\n\t\t\t\t\t\t\t\t\t\t\tcollectionId,\n\t\t\t\t\t\t\t\t\t\t\tproductId,\n\t\t\t\t\t\t\t\t\t\t\tcollectionsToShow,\n\t\t\t\t\t\t\t\t\t\t\tcollections?.[collectionId],\n\t\t\t\t\t\t\t\t\t\t\thideProductVariants,\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\tselectedData={collectionsToShow}\n\t\t\t\t\t\t\t\t\t\tselectedCollectionsDispatch={selectedCollectionsDispatch}\n\t\t\t\t\t\t\t\t\t\tviewOnly={viewOnly}\n\t\t\t\t\t\t\t\t\t\tkey={productId}\n\t\t\t\t\t\t\t\t\t\thideProductVariants={hideProductVariants}\n\t\t\t\t\t\t\t\t\t\toutOfStockAction={outOfStockAction}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t})}\n\t\t\t\t\t</>\n\t\t\t\t) : (\n\t\t\t\t\t<EmptyState\n\t\t\t\t\t\ttitle={'No Products Selected'}\n\t\t\t\t\t\tsubtitle={'Select products will appear here'}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t<div ref={observerTarget}></div>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n"],"names":["SelectedScreen","props","selectedCollections","selectedCollectionsDispatch","setScreen","collections","hideProductVariants","outOfStockAction","storeId","fbStatusFetcher","appType","nextpageRef","useRef","observerTarget","curScreenData","dispatchCurScreenData","useReducer","paginationReducer","useEffect","paginatedProducts","paginateSelectedItems","fetchFbStatusCollection","observer","entries","collectionsToShow","jsxDEV","SelectedScreenHeader","IconButton","ArrowLeftIcon","this","BodyCaption","Fragment","collectionId","productId","viewOnly","ProductGroup","isProductPartiallyChecked","EmptyState"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-dev-runtime"),f=require("../../assets/icons/delete.svg.js"),y=require("../../assets/icons/drag_handle.svg.js"),t=require("../../constants/Theme.js"),u=require("../TypographyStyle.js"),k=require("./constants.js"),D=require("./helpers/ProductHelper.js"),x=require("./ProductPickerTag.js"),r=require("./style.js"),p=require("../shimmer-image/ShimmerImage.js"),s=require("../tooltips/Tooltip.js"),h=require("../icon-button/IconButton.js"),V=o=>{const{data:n,selectedCollectionsDispatch:c,outOfStockAction:b}=o,d=()=>{let a;return n.name.includes(n.productName)?a=n.name:a=`${n.productName} ${n.name}`,a},{dataForProductPickerTag:l,tagText:m,tagType:v}=D.ProductHelper.getDataForProductPickerTag(n,!0,b),N=`${n.currency?k.CurrencySymbols[n.currency]??"":""}${n.price??n.actualPrice??""}`,i=n.skuId;return e.jsxDEV(r.VariantCardListStyle,{children:e.jsxDEV("div",{className:"text-container",children:[e.jsxDEV(y.default,{width:24,height:24,color:t.COLORS.content.placeholder},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:76,columnNumber:5},void 0),e.jsxDEV("div",{children:e.jsxDEV(p.ShimmerImage,{width:40,height:40,imageUrl:n.image,alt:"Item",borderRadius:4},n.variantId,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:82,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:81,columnNumber:5},void 0),e.jsxDEV("div",{className:"info-container",children:[e.jsxDEV("div",{className:"tooltip-title-tag",children:[e.jsxDEV(s.Tooltip,{body:d(),placement:"bottom",delay:400,variant:"light",children:e.jsxDEV(u.TitleSmall,{numberOfLines:1,style:{flex:1,minWidth:0},children:d()},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:99,columnNumber:8},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:93,columnNumber:7},void 0),e.jsxDEV(r.ProductInfo,{children:[e.jsxDEV(x.ProductPickerTag,{isVariant:!0,data:l,tagText:m,tagType:v},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:111,columnNumber:8},void 0),e.jsxDEV(h.IconButton,{Icon:()=>e.jsxDEV(f.default,{width:24,height:24,color:t.COLORS.content.placeholder},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:119,columnNumber:10},void 0),onClick:()=>{c&&c({type:"variantUnselected",data:{productId:n.productId,variantId:n.variantId,collectionId:n.collectionId}}),o.onDelete&&o.onDelete()}},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:117,columnNumber:8},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:110,columnNumber:7},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:92,columnNumber:6},void 0),e.jsxDEV(r.ProductSubTitle,{children:[e.jsxDEV(u.BodyCaption,{color:t.COLORS.content.secondary,children:!l?.fbStatus||m?null:N},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:142,columnNumber:7},void 0),i&&e.jsxDEV(s.Tooltip,{body:i,placement:"top",children:e.jsxDEV(r.SKUIDBadge,{children:e.jsxDEV(r.EllipsedBodyTiny,{children:`SKU ID: ${i}`},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:151,columnNumber:10},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:150,columnNumber:9},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:149,columnNumber:8},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:141,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:91,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:75,columnNumber:4},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:74,columnNumber:3},void 0)},w=o=>{const{data:n}=o;return e.jsxDEV(r.VariantCardGridStyle,{children:e.jsxDEV(s.Tooltip,{body:n.name,alwaysVisible:!1,variant:"dark",placement:"bottom",children:e.jsxDEV(p.ShimmerImage,{width:72,height:72,imageUrl:n.image,alt:"Item",borderRadius:4},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:177,columnNumber:5},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:171,columnNumber:4},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:170,columnNumber:3},void 0)};exports.VariantCardGridView=w;exports.VariantCardListView=V;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-dev-runtime"),h=require("../../assets/icons/delete.svg.js"),N=require("../../assets/icons/drag_handle.svg.js"),a=require("../../constants/Theme.js"),d=require("../TypographyStyle.js"),f=require("./constants.js"),y=require("./helpers/ProductHelper.js"),D=require("./ProductPickerTag.js"),i=require("./style.js"),p=require("../shimmer-image/ShimmerImage.js"),s=require("../tooltips/Tooltip.js"),x=require("../icon-button/IconButton.js"),V=n=>{const{data:r,selectedCollectionsDispatch:c,outOfStockAction:b}=n,m=()=>{let t;return r.name.includes(r.productName)?t=r.name:t=`${r.productName} ${r.name}`,t},{dataForProductPickerTag:l,tagText:u,tagType:v}=y.ProductHelper.getDataForProductPickerTag(r,!0,b),k=`${r.currency?f.CurrencySymbols[r.currency]??"":""}${r.price??r.actualPrice??""}`,o=r.skuId;return e.jsxDEV(i.VariantCardListStyle,{children:e.jsxDEV("div",{className:"text-container",children:[e.jsxDEV(N.default,{width:24,height:24,color:a.COLORS.content.placeholder},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:76,columnNumber:5},void 0),e.jsxDEV("div",{children:e.jsxDEV(p.ShimmerImage,{width:40,height:40,imageUrl:r.image,alt:"Item",borderRadius:4},r.variantId,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:82,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:81,columnNumber:5},void 0),e.jsxDEV("div",{className:"info-container",children:[e.jsxDEV("div",{className:"tooltip-title-tag",children:[e.jsxDEV(s.Tooltip,{body:m(),placement:"bottom",delay:400,variant:"light",children:e.jsxDEV(d.TitleSmall,{numberOfLines:1,style:{flex:1,minWidth:0},children:m()},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:99,columnNumber:8},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:93,columnNumber:7},void 0),e.jsxDEV(i.ProductInfo,{children:[e.jsxDEV(D.ProductPickerTag,{isVariant:!0,data:l,tagText:u,tagType:v},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:111,columnNumber:8},void 0),e.jsxDEV(x.IconButton,{Icon:()=>e.jsxDEV(h.default,{width:24,height:24,color:a.COLORS.content.placeholder},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:119,columnNumber:10},void 0),onClick:()=>{c&&c({type:"variantUnselected",data:{productId:r.productId,variantId:r.variantId,collectionId:r.collectionId}}),n.onDelete&&n.onDelete()}},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:117,columnNumber:8},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:110,columnNumber:7},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:92,columnNumber:6},void 0),e.jsxDEV(i.ProductSubTitle,{children:[e.jsxDEV(d.BodyCaption,{color:a.COLORS.content.secondary,children:!l?.fbStatus||u?null:k},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:142,columnNumber:7},void 0),o&&e.jsxDEV(s.Tooltip,{body:o,placement:"top",children:e.jsxDEV(i.SKUIDBadge,{children:e.jsxDEV(i.EllipsedBodyTiny,{children:`SKU ID: ${o}`},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:151,columnNumber:10},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:150,columnNumber:9},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:149,columnNumber:8},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:141,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:91,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:75,columnNumber:4},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:74,columnNumber:3},void 0)},g=n=>{const{data:r}=n;return e.jsxDEV(i.VariantCardGridStyle,{children:e.jsxDEV(s.Tooltip,{body:r.name,alwaysVisible:!1,variant:"dark",placement:"bottom",children:e.jsxDEV(p.ShimmerImage,{width:72,height:72,imageUrl:r.image,alt:"Item",borderRadius:4},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:177,columnNumber:5},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:171,columnNumber:4},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variant.tsx",lineNumber:170,columnNumber:3},void 0)};exports.VariantCardGridView=g;exports.VariantCardListView=V;
 //# sourceMappingURL=variant.js.map

package/dist/cjs/components/product-picker-v2/variant.js.map

@@ -1 +1 @@
-{"version":3,"file":"variant.js","sources":["../../../../src/components/product-picker-v2/variant.tsx"],"sourcesContent":["/**\n * Has necessary types for variant.\n * 1. ProductVariantForRearrange - type\n * 2. VariantCardInterface - interface\n * 3. VariantCardListView - React component\n * 4. VariantCardGridView - React component\n */\nimport DeleteIcon from '@src/assets/icons/delete.svg';\nimport DragHandleIcon from '@src/assets/icons/drag_handle.svg';\nimport { Tooltip } from '@src/components/tooltips';\nimport { COLORS } from '@src/constants/Theme';\nimport { IconButton } from '../icon-button';\nimport { ShimmerImage } from '../shimmer-image';\nimport { BodyCaption, TitleSmall } from '../TypographyStyle';\nimport { CurrencySymbols } from './constants';\nimport { ProductHelper } from './helpers/ProductHelper';\nimport { ProductPickerTag } from './ProductPickerTag';\nimport type { SelectedCollectionsActions } from './reducers';\nimport {\n\tEllipsedBodyTiny,\n\tProductInfo,\n\tProductSubTitle,\n\tSKUIDBadge,\n\tVariantCardGridStyle,\n\tVariantCardListStyle,\n} from './style';\nimport {\n\tOUT_OF_STOCK_ACTION,\n\ttype ProductVariant,\n\ttype ProductVariantForRearrange,\n} from './type';\n\n/**\n * Props type for variant card in rearrange screen\n */\nexport interface VariantCardInterface {\n\tdata: ProductVariantForRearrange;\n\tselectedCollectionsDispatch?: React.Dispatch<SelectedCollectionsActions>;\n\toutOfStockAction?: OUT_OF_STOCK_ACTION;\n\tonDelete?: () => void;\n}\n\n/**\n * Variant card in list view format.\n * Displays image, name and delete icon\n */\nexport const VariantCardListView = (props: VariantCardInterface) => {\n\tconst { data, selectedCollectionsDispatch, outOfStockAction } = props;\n\n\tconst getDisplayName = () => {\n\t\tlet displayName;\n\n\t\tif (data.name.includes(data.productName)) {\n\t\t\tdisplayName = data.name;\n\t\t} else {\n\t\t\tdisplayName = `${data.productName} ${data.name}`;\n\t\t}\n\n\t\treturn displayName;\n\t};\n\n\tconst { dataForProductPickerTag, tagText, tagType } =\n\t\tProductHelper.getDataForProductPickerTag(data, true, outOfStockAction);\n\n\tconst currencyAndPrice = `${\n\t\tdata.currency ? CurrencySymbols[data.currency] ?? '' : ''\n\t}${data.price ?? data.actualPrice ?? ''}`;\n\n\t//show skuid for every variant\n\t//show skuid for product if there is only one variant (as the product itself is the variant)\n\tconst skuId = (data as ProductVariant).skuId;\n\n\treturn (\n\t\t<VariantCardListStyle>\n\t\t\t<div className=\"text-container\">\n\t\t\t\t<DragHandleIcon\n\t\t\t\t\twidth={24}\n\t\t\t\t\theight={24}\n\t\t\t\t\tcolor={COLORS.content.placeholder}\n\t\t\t\t/>\n\t\t\t\t<div>\n\t\t\t\t\t<ShimmerImage\n\t\t\t\t\t\tkey={data.variantId}\n\t\t\t\t\t\twidth={40}\n\t\t\t\t\t\theight={40}\n\t\t\t\t\t\timageUrl={data.image}\n\t\t\t\t\t\talt=\"Item\"\n\t\t\t\t\t\tborderRadius={4}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div className=\"info-container\">\n\t\t\t\t\t<div className=\"tooltip-title-tag\">\n\t\t\t\t\t\t<Tooltip\n\t\t\t\t\t\t\tbody={getDisplayName()}\n\t\t\t\t\t\t\tplacement={'bottom'}\n\t\t\t\t\t\t\tdelay={400}\n\t\t\t\t\t\t\tvariant=\"light\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<TitleSmall\n\t\t\t\t\t\t\t\tnumberOfLines={1}\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\t\t\tminWidth: 0,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{getDisplayName()}\n\t\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t\t</Tooltip>\n\n\t\t\t\t\t\t<ProductInfo>\n\t\t\t\t\t\t\t<ProductPickerTag\n\t\t\t\t\t\t\t\tisVariant={true}\n\t\t\t\t\t\t\t\tdata={dataForProductPickerTag}\n\t\t\t\t\t\t\t\ttagText={tagText}\n\t\t\t\t\t\t\t\ttagType={tagType}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\tIcon={() => (\n\t\t\t\t\t\t\t\t\t<DeleteIcon\n\t\t\t\t\t\t\t\t\t\twidth={24}\n\t\t\t\t\t\t\t\t\t\theight={24}\n\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.placeholder}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tselectedCollectionsDispatch &&\n\t\t\t\t\t\t\t\t\t\tselectedCollectionsDispatch({\n\t\t\t\t\t\t\t\t\t\t\ttype: 'variantUnselected',\n\t\t\t\t\t\t\t\t\t\t\tdata: {\n\t\t\t\t\t\t\t\t\t\t\t\tproductId: data.productId,\n\t\t\t\t\t\t\t\t\t\t\t\tvariantId: data.variantId,\n\t\t\t\t\t\t\t\t\t\t\t\tcollectionId: data.collectionId,\n\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t});\n\n\t\t\t\t\t\t\t\t\tprops.onDelete && props.onDelete();\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</ProductInfo>\n\t\t\t\t\t</div>\n\t\t\t\t\t<ProductSubTitle>\n\t\t\t\t\t\t<BodyCaption color={COLORS.content.secondary}>\n\t\t\t\t\t\t\t{/* in the cases where we show tags, do not show the currency and price */}\n\t\t\t\t\t\t\t{!(dataForProductPickerTag as ProductVariant)?.fbStatus || tagText\n\t\t\t\t\t\t\t\t? null\n\t\t\t\t\t\t\t\t: currencyAndPrice}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t{skuId && (\n\t\t\t\t\t\t\t<Tooltip body={skuId} placement=\"top\">\n\t\t\t\t\t\t\t\t<SKUIDBadge>\n\t\t\t\t\t\t\t\t\t<EllipsedBodyTiny>{`SKU ID: ${skuId}`}</EllipsedBodyTiny>\n\t\t\t\t\t\t\t\t</SKUIDBadge>\n\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</ProductSubTitle>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</VariantCardListStyle>\n\t);\n};\n\n/**\n * Variant card in grid view format.\n * Displays only image\n */\nexport const VariantCardGridView = (props: VariantCardInterface) => {\n\tconst { data } = props;\n\n\treturn (\n\t\t<VariantCardGridStyle>\n\t\t\t<Tooltip\n\t\t\t\tbody={data.name}\n\t\t\t\talwaysVisible={false}\n\t\t\t\tvariant=\"dark\"\n\t\t\t\tplacement={'bottom'}\n\t\t\t>\n\t\t\t\t<ShimmerImage\n\t\t\t\t\twidth={72}\n\t\t\t\t\theight={72}\n\t\t\t\t\timageUrl={data.image}\n\t\t\t\t\talt=\"Item\"\n\t\t\t\t\tborderRadius={4}\n\t\t\t\t/>\n\t\t\t</Tooltip>\n\t\t</VariantCardGridStyle>\n\t);\n};\n"],"names":["VariantCardListView","props","data","selectedCollectionsDispatch","outOfStockAction","getDisplayName","displayName","dataForProductPickerTag","tagText","tagType","ProductHelper","currencyAndPrice","CurrencySymbols","skuId","jsxDEV","VariantCardListStyle","DragHandleIcon","COLORS","this","ShimmerImage","Tooltip","TitleSmall","ProductInfo","ProductPickerTag","IconButton","DeleteIcon","ProductSubTitle","BodyCaption","SKUIDBadge","EllipsedBodyTiny","VariantCardGridView","VariantCardGridStyle"],"mappings":"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"}
+{"version":3,"file":"variant.js","sources":["../../../../src/components/product-picker-v2/variant.tsx"],"sourcesContent":["/**\n * Has necessary types for variant.\n * 1. ProductVariantForRearrange - type\n * 2. VariantCardInterface - interface\n * 3. VariantCardListView - React component\n * 4. VariantCardGridView - React component\n */\nimport DeleteIcon from '@src/assets/icons/delete.svg';\nimport DragHandleIcon from '@src/assets/icons/drag_handle.svg';\nimport { Tooltip } from '@src/components/tooltips';\nimport { COLORS } from '@src/constants/Theme';\nimport { IconButton } from '../icon-button';\nimport { ShimmerImage } from '../shimmer-image';\nimport { BodyCaption, TitleSmall } from '../TypographyStyle';\nimport { CurrencySymbols } from './constants';\nimport { ProductHelper } from './helpers/ProductHelper';\nimport { ProductPickerTag } from './ProductPickerTag';\nimport type { SelectedCollectionsActions } from './reducers';\nimport {\n\tEllipsedBodyTiny,\n\tProductInfo,\n\tProductSubTitle,\n\tSKUIDBadge,\n\tVariantCardGridStyle,\n\tVariantCardListStyle,\n} from './style';\nimport {\n\tOUT_OF_STOCK_ACTION,\n\ttype ProductVariant,\n\ttype ProductVariantForRearrange,\n} from './type';\n\n/**\n * Props type for variant card in rearrange screen\n */\nexport interface VariantCardInterface {\n\tdata: ProductVariantForRearrange;\n\tselectedCollectionsDispatch?: React.Dispatch<SelectedCollectionsActions>;\n\toutOfStockAction?: OUT_OF_STOCK_ACTION;\n\tonDelete?: () => void;\n}\n\n/**\n * Variant card in list view format.\n * Displays image, name and delete icon\n */\nexport const VariantCardListView = (props: VariantCardInterface) => {\n\tconst { data, selectedCollectionsDispatch, outOfStockAction } = props;\n\n\tconst getDisplayName = () => {\n\t\tlet displayName;\n\n\t\tif (data.name.includes(data.productName)) {\n\t\t\tdisplayName = data.name;\n\t\t} else {\n\t\t\tdisplayName = `${data.productName} ${data.name}`;\n\t\t}\n\n\t\treturn displayName;\n\t};\n\n\tconst { dataForProductPickerTag, tagText, tagType } =\n\t\tProductHelper.getDataForProductPickerTag(data, true, outOfStockAction);\n\n\tconst currencyAndPrice = `${\n\t\tdata.currency ? CurrencySymbols[data.currency] ?? '' : ''\n\t}${data.price ?? data.actualPrice ?? ''}`;\n\n\t//show skuid for every variant\n\t//show skuid for product if there is only one variant (as the product itself is the variant)\n\tconst skuId = (data as ProductVariant).skuId;\n\n\treturn (\n\t\t<VariantCardListStyle>\n\t\t\t<div className=\"text-container\">\n\t\t\t\t<DragHandleIcon\n\t\t\t\t\twidth={24}\n\t\t\t\t\theight={24}\n\t\t\t\t\tcolor={COLORS.content.placeholder}\n\t\t\t\t/>\n\t\t\t\t<div>\n\t\t\t\t\t<ShimmerImage\n\t\t\t\t\t\tkey={data.variantId}\n\t\t\t\t\t\twidth={40}\n\t\t\t\t\t\theight={40}\n\t\t\t\t\t\timageUrl={data.image}\n\t\t\t\t\t\talt=\"Item\"\n\t\t\t\t\t\tborderRadius={4}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div className=\"info-container\">\n\t\t\t\t\t<div className=\"tooltip-title-tag\">\n\t\t\t\t\t\t<Tooltip\n\t\t\t\t\t\t\tbody={getDisplayName()}\n\t\t\t\t\t\t\tplacement={'bottom'}\n\t\t\t\t\t\t\tdelay={400}\n\t\t\t\t\t\t\tvariant=\"light\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<TitleSmall\n\t\t\t\t\t\t\t\tnumberOfLines={1}\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\t\t\tminWidth: 0,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{getDisplayName()}\n\t\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t\t</Tooltip>\n\n\t\t\t\t\t\t<ProductInfo>\n\t\t\t\t\t\t\t<ProductPickerTag\n\t\t\t\t\t\t\t\tisVariant={true}\n\t\t\t\t\t\t\t\tdata={dataForProductPickerTag}\n\t\t\t\t\t\t\t\ttagText={tagText}\n\t\t\t\t\t\t\t\ttagType={tagType}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\t\tIcon={() => (\n\t\t\t\t\t\t\t\t\t<DeleteIcon\n\t\t\t\t\t\t\t\t\t\twidth={24}\n\t\t\t\t\t\t\t\t\t\theight={24}\n\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.placeholder}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tselectedCollectionsDispatch &&\n\t\t\t\t\t\t\t\t\t\tselectedCollectionsDispatch({\n\t\t\t\t\t\t\t\t\t\t\ttype: 'variantUnselected',\n\t\t\t\t\t\t\t\t\t\t\tdata: {\n\t\t\t\t\t\t\t\t\t\t\t\tproductId: data.productId,\n\t\t\t\t\t\t\t\t\t\t\t\tvariantId: data.variantId,\n\t\t\t\t\t\t\t\t\t\t\t\tcollectionId: data.collectionId,\n\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t});\n\n\t\t\t\t\t\t\t\t\tprops.onDelete && props.onDelete();\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</ProductInfo>\n\t\t\t\t\t</div>\n\t\t\t\t\t<ProductSubTitle>\n\t\t\t\t\t\t<BodyCaption color={COLORS.content.secondary}>\n\t\t\t\t\t\t\t{/* in the cases where we show tags, do not show the currency and price */}\n\t\t\t\t\t\t\t{!(dataForProductPickerTag as ProductVariant)?.fbStatus || tagText\n\t\t\t\t\t\t\t\t? null\n\t\t\t\t\t\t\t\t: currencyAndPrice}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t{skuId && (\n\t\t\t\t\t\t\t<Tooltip body={skuId} placement=\"top\">\n\t\t\t\t\t\t\t\t<SKUIDBadge>\n\t\t\t\t\t\t\t\t\t<EllipsedBodyTiny>{`SKU ID: ${skuId}`}</EllipsedBodyTiny>\n\t\t\t\t\t\t\t\t</SKUIDBadge>\n\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</ProductSubTitle>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</VariantCardListStyle>\n\t);\n};\n\n/**\n * Variant card in grid view format.\n * Displays only image\n */\nexport const VariantCardGridView = (props: VariantCardInterface) => {\n\tconst { data } = props;\n\n\treturn (\n\t\t<VariantCardGridStyle>\n\t\t\t<Tooltip\n\t\t\t\tbody={data.name}\n\t\t\t\talwaysVisible={false}\n\t\t\t\tvariant=\"dark\"\n\t\t\t\tplacement={'bottom'}\n\t\t\t>\n\t\t\t\t<ShimmerImage\n\t\t\t\t\twidth={72}\n\t\t\t\t\theight={72}\n\t\t\t\t\timageUrl={data.image}\n\t\t\t\t\talt=\"Item\"\n\t\t\t\t\tborderRadius={4}\n\t\t\t\t/>\n\t\t\t</Tooltip>\n\t\t</VariantCardGridStyle>\n\t);\n};\n"],"names":["VariantCardListView","props","data","selectedCollectionsDispatch","outOfStockAction","getDisplayName","displayName","dataForProductPickerTag","tagText","tagType","ProductHelper","currencyAndPrice","CurrencySymbols","skuId","jsxDEV","VariantCardListStyle","DragHandleIcon","COLORS","this","ShimmerImage","Tooltip","TitleSmall","ProductInfo","ProductPickerTag","IconButton","DeleteIcon","ProductSubTitle","BodyCaption","SKUIDBadge","EllipsedBodyTiny","VariantCardGridView","VariantCardGridStyle"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-dev-runtime"),c=require("@hello-pangea/dnd"),x=require("react"),b=require("../../constants/Theme.js"),N=require("./variant.js"),y=({selectedVariants:a,setSelectedVariants:i,selectedCollectionsDispatch:t,outOfStockAction:o})=>{const[p,s]=x.useState(-1);function f(n){if(n?.transform){const m=`translate(0px, ${n.transform.split(",").pop()}`;return{...n,transform:m}}return n}return e.jsxDEV(c.Droppable,{droppableId:"droppable-list",children:(n,m)=>e.jsxDEV("div",{...n.droppableProps,ref:n.innerRef,style:{backgroundColor:b.COLORS.surface.subdued,padding:"0.05px",height:a.length<8?"550px":"100%",overflow:"auto",...n.droppableProps.style},children:[a.map((r,l)=>e.jsxDEV("div",{style:{background:b.COLORS.surface.hovered,margin:"5px",boxShadow:l===p?"0px 4px 12px rgba(0, 0, 0, 0.12)":""},onMouseEnter:()=>s(l),onMouseLeave:()=>s(-1),children:e.jsxDEV(c.Draggable,{draggableId:`${r.productId}-${r.variantId}`,index:l,children:(d,k)=>e.jsxDEV("div",{ref:d.innerRef,...d.draggableProps,...d.dragHandleProps,style:f({...d.draggableProps.style,...d.draggableSnapshot}),children:e.jsxDEV(N.VariantCardListView,{data:r,selectedCollectionsDispatch:t,onDelete:()=>{const u=a.slice();u[l].displayOrder=null,u.splice(l,1),i(u)},outOfStockAction:o},`${r.productId}-${r.variantId}`,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:91,columnNumber:12},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:82,columnNumber:11},void 0)},`${r.productId}-${r.variantId}`,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:75,columnNumber:8},void 0)},`${r.productId}-${r.variantId}`,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:62,columnNumber:7},void 0)),n.placeholder&&m.isDraggingOver?e.jsxDEV("div",{style:{background:b.COLORS.surface.hovered,margin:"5px"},children:n.placeholder},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:112,columnNumber:7},void 0):null]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:50,columnNumber:5},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:48,columnNumber:3},void 0)},v=({selectedVariants:a})=>e.jsxDEV(c.Droppable,{droppableId:"droppable-horizontal",children:i=>e.jsxDEV("div",{...i.droppableProps,ref:i.innerRef,style:{display:"flex"},children:[e.jsxDEV(c.Droppable,{droppableId:"droppable-vertical",direction:"horizontal",children:t=>e.jsxDEV("div",{...t.droppableProps,ref:t.innerRef,style:{display:"flex",flexWrap:"wrap",flexDirection:"row"},children:[a.map((o,p)=>e.jsxDEV(c.Draggable,{draggableId:`${o.productId}-${o.variantId}`,index:p,children:(s,f)=>e.jsxDEV("div",{ref:s.innerRef,...s.draggableProps,...s.dragHandleProps,children:[e.jsxDEV(N.VariantCardGridView,{data:o},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:164,columnNumber:13},void 0),s.placeholder]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:159,columnNumber:12},void 0)},`${o.productId}-${o.variantId}`,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:153,columnNumber:10},void 0)),t.placeholder]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:143,columnNumber:8},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:141,columnNumber:6},void 0),i.placeholder]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:134,columnNumber:5},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:132,columnNumber:3},void 0);exports.VariantsGrid=v;exports.VariantsList=y;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-dev-runtime"),l=require("@hello-pangea/dnd"),v=require("react"),b=require("../../constants/Theme.js"),f=require("./variant.js"),h=({selectedVariants:i,setSelectedVariants:a,selectedCollectionsDispatch:t,outOfStockAction:o})=>{const[m,s]=v.useState(-1);function k(r){if(r?.transform){const u=`translate(0px, ${r.transform.split(",").pop()}`;return{...r,transform:u}}return r}return e.jsxDEV(l.Droppable,{droppableId:"droppable-list",children:(r,u)=>e.jsxDEV("div",{...r.droppableProps,ref:r.innerRef,style:{backgroundColor:b.COLORS.surface.subdued,padding:"0.05px",height:i.length<8?"550px":"100%",overflow:"auto",...r.droppableProps.style},children:[i.map((n,c)=>e.jsxDEV("div",{style:{background:b.COLORS.surface.hovered,margin:"5px",boxShadow:c===m?"0px 4px 12px rgba(0, 0, 0, 0.12)":""},onMouseEnter:()=>s(c),onMouseLeave:()=>s(-1),children:e.jsxDEV(l.Draggable,{draggableId:`${n.productId}-${n.variantId}`,index:c,children:(p,x)=>e.jsxDEV("div",{ref:p.innerRef,...p.draggableProps,...p.dragHandleProps,style:k({...p.draggableProps.style,...p.draggableSnapshot}),children:e.jsxDEV(f.VariantCardListView,{data:n,selectedCollectionsDispatch:t,onDelete:()=>{const d=i.slice();d[c].displayOrder=null,d.splice(c,1),a(d)},outOfStockAction:o},`${n.productId}-${n.variantId}`,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:91,columnNumber:12},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:82,columnNumber:11},void 0)},`${n.productId}-${n.variantId}`,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:75,columnNumber:8},void 0)},`${n.productId}-${n.variantId}`,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:62,columnNumber:7},void 0)),r.placeholder&&u.isDraggingOver?e.jsxDEV("div",{style:{background:b.COLORS.surface.hovered,margin:"5px"},children:r.placeholder},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:112,columnNumber:7},void 0):null]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:50,columnNumber:5},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:48,columnNumber:3},void 0)},N=({selectedVariants:i})=>e.jsxDEV(l.Droppable,{droppableId:"droppable-horizontal",children:a=>e.jsxDEV("div",{...a.droppableProps,ref:a.innerRef,style:{display:"flex"},children:[e.jsxDEV(l.Droppable,{droppableId:"droppable-vertical",direction:"horizontal",children:t=>e.jsxDEV("div",{...t.droppableProps,ref:t.innerRef,style:{display:"flex",flexWrap:"wrap",flexDirection:"row"},children:[i.map((o,m)=>e.jsxDEV(l.Draggable,{draggableId:`${o.productId}-${o.variantId}`,index:m,children:(s,k)=>e.jsxDEV("div",{ref:s.innerRef,...s.draggableProps,...s.dragHandleProps,children:[e.jsxDEV(f.VariantCardGridView,{data:o},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:164,columnNumber:13},void 0),s.placeholder]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:159,columnNumber:12},void 0)},`${o.productId}-${o.variantId}`,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:153,columnNumber:10},void 0)),t.placeholder]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:143,columnNumber:8},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:141,columnNumber:6},void 0),a.placeholder]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:134,columnNumber:5},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/product-picker-v2/variantComponents.tsx",lineNumber:132,columnNumber:3},void 0);exports.VariantsGrid=N;exports.VariantsList=h;
 //# sourceMappingURL=variantComponents.js.map

package/dist/cjs/components/product-picker-v2/variantComponents.js.map

@@ -1 +1 @@
-{"version":3,"file":"variantComponents.js","sources":["../../../../src/components/product-picker-v2/variantComponents.tsx"],"sourcesContent":["import { Draggable, Droppable } from '@hello-pangea/dnd';\nimport { useState } from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport type { SelectedCollectionsActions } from './reducers';\nimport { OUT_OF_STOCK_ACTION, type ProductVariantForRearrange } from './type';\nimport { VariantCardGridView, VariantCardListView } from './variant';\n\n/**\n * Props for list of variants - applicable both in list and grid view\n */\nexport type VariantsComponentProps = {\n\tselectedVariants: ProductVariantForRearrange[];\n\tsetSelectedVariants: React.Dispatch<\n\t\tReact.SetStateAction<ProductVariantForRearrange[]>\n\t>;\n\tselectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;\n\toutOfStockAction?: OUT_OF_STOCK_ACTION;\n};\n\n/**\n * Returns a react component of variants list, which are eligible to drag and drop.\n */\nexport const VariantsList = ({\n\tselectedVariants,\n\tsetSelectedVariants,\n\tselectedCollectionsDispatch,\n\toutOfStockAction,\n}: VariantsComponentProps) => {\n\tconst [selectedIndex, setSelectedIndex] = useState(-1);\n\n\t/**\n\t * This function returns style of the card.\n\t * The style doesn't allow the item to drag horizontally.\n\t */\n\tfunction getStyle(style: React.CSSProperties) {\n\t\tif (style?.transform) {\n\t\t\tconst axisLockY = `translate(0px, ${style.transform.split(',').pop()}`;\n\n\t\t\treturn {\n\t\t\t\t...style,\n\t\t\t\ttransform: axisLockY,\n\t\t\t};\n\t\t}\n\t\treturn style;\n\t}\n\n\treturn (\n\t\t<Droppable droppableId=\"droppable-list\">\n\t\t\t{(providedDroppable: any, snapshotDroppable: any) => (\n\t\t\t\t<div\n\t\t\t\t\t{...providedDroppable.droppableProps}\n\t\t\t\t\tref={providedDroppable.innerRef}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tbackgroundColor: COLORS.surface.subdued,\n\t\t\t\t\t\tpadding: '0.05px',\n\t\t\t\t\t\theight: selectedVariants.length < 8 ? '550px' : '100%',\n\t\t\t\t\t\toverflow: 'auto',\n\t\t\t\t\t\t...providedDroppable.droppableProps.style,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{selectedVariants.map((variant, index) => (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={`${variant.productId}-${variant.variantId}`}\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tbackground: COLORS.surface.hovered,\n\t\t\t\t\t\t\t\tmargin: '5px',\n\t\t\t\t\t\t\t\tboxShadow:\n\t\t\t\t\t\t\t\t\tindex === selectedIndex\n\t\t\t\t\t\t\t\t\t\t? '0px 4px 12px rgba(0, 0, 0, 0.12)'\n\t\t\t\t\t\t\t\t\t\t: '',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonMouseEnter={() => setSelectedIndex(index)}\n\t\t\t\t\t\t\tonMouseLeave={() => setSelectedIndex(-1)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Draggable\n\t\t\t\t\t\t\t\tkey={`${variant.productId}-${variant.variantId}`}\n\t\t\t\t\t\t\t\tdraggableId={`${variant.productId}-${variant.variantId}`}\n\t\t\t\t\t\t\t\tindex={index}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{(providedDraggable: any, snapshot: any) => {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tref={providedDraggable.innerRef}\n\t\t\t\t\t\t\t\t\t\t\t{...providedDraggable.draggableProps}\n\t\t\t\t\t\t\t\t\t\t\t{...providedDraggable.dragHandleProps}\n\t\t\t\t\t\t\t\t\t\t\tstyle={getStyle({\n\t\t\t\t\t\t\t\t\t\t\t\t...providedDraggable.draggableProps.style,\n\t\t\t\t\t\t\t\t\t\t\t\t...providedDraggable.draggableSnapshot,\n\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<VariantCardListView\n\t\t\t\t\t\t\t\t\t\t\t\tkey={`${variant.productId}-${variant.variantId}`}\n\t\t\t\t\t\t\t\t\t\t\t\tdata={variant}\n\t\t\t\t\t\t\t\t\t\t\t\tselectedCollectionsDispatch={\n\t\t\t\t\t\t\t\t\t\t\t\t\tselectedCollectionsDispatch\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\tonDelete={() => {\n\t\t\t\t\t\t\t\t\t\t\t\t\tconst tempSelectedVariants = selectedVariants.slice();\n\t\t\t\t\t\t\t\t\t\t\t\t\ttempSelectedVariants[index].displayOrder = null;\n\t\t\t\t\t\t\t\t\t\t\t\t\ttempSelectedVariants.splice(index, 1);\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetSelectedVariants(tempSelectedVariants);\n\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\toutOfStockAction={outOfStockAction}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t</Draggable>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t))}\n\t\t\t\t\t{providedDroppable.placeholder && snapshotDroppable.isDraggingOver ? (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tbackground: COLORS.surface.hovered,\n\t\t\t\t\t\t\t\tmargin: '5px',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{providedDroppable.placeholder}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) : null}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</Droppable>\n\t);\n};\n\n/**\n * Returns a react component of variants grid, which are eligible to drag and drop.\n */\nexport const VariantsGrid = ({ selectedVariants }: VariantsComponentProps) => {\n\treturn (\n\t\t<Droppable droppableId=\"droppable-horizontal\">\n\t\t\t{(providedHorizontal) => (\n\t\t\t\t<div\n\t\t\t\t\t{...providedHorizontal.droppableProps}\n\t\t\t\t\tref={providedHorizontal.innerRef}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Droppable droppableId=\"droppable-vertical\" direction=\"horizontal\">\n\t\t\t\t\t\t{(providedVertical) => (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t{...providedVertical.droppableProps}\n\t\t\t\t\t\t\t\tref={providedVertical.innerRef}\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\tflexWrap: 'wrap',\n\t\t\t\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{selectedVariants.map((variant, index) => (\n\t\t\t\t\t\t\t\t\t<Draggable\n\t\t\t\t\t\t\t\t\t\tkey={`${variant.productId}-${variant.variantId}`}\n\t\t\t\t\t\t\t\t\t\tdraggableId={`${variant.productId}-${variant.variantId}`}\n\t\t\t\t\t\t\t\t\t\tindex={index}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{(providedDraggable: any, snapshot: any) => (\n\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\tref={providedDraggable.innerRef}\n\t\t\t\t\t\t\t\t\t\t\t\t{...providedDraggable.draggableProps}\n\t\t\t\t\t\t\t\t\t\t\t\t{...providedDraggable.dragHandleProps}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<VariantCardGridView data={variant} />\n\t\t\t\t\t\t\t\t\t\t\t\t{providedDraggable.placeholder}\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</Draggable>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t{providedVertical.placeholder}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</Droppable>\n\t\t\t\t\t{providedHorizontal.placeholder}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</Droppable>\n\t);\n};\n"],"names":["VariantsList","selectedVariants","setSelectedVariants","selectedCollectionsDispatch","outOfStockAction","selectedIndex","setSelectedIndex","useState","getStyle","style","axisLockY","Droppable","providedDroppable","snapshotDroppable","jsxDEV","COLORS","variant","index","Draggable","providedDraggable","snapshot","VariantCardListView","tempSelectedVariants","this","VariantsGrid","providedHorizontal","providedVertical","VariantCardGridView"],"mappings":"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"}
+{"version":3,"file":"variantComponents.js","sources":["../../../../src/components/product-picker-v2/variantComponents.tsx"],"sourcesContent":["import { Draggable, Droppable } from '@hello-pangea/dnd';\nimport { useState } from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport type { SelectedCollectionsActions } from './reducers';\nimport { OUT_OF_STOCK_ACTION, type ProductVariantForRearrange } from './type';\nimport { VariantCardGridView, VariantCardListView } from './variant';\n\n/**\n * Props for list of variants - applicable both in list and grid view\n */\nexport type VariantsComponentProps = {\n\tselectedVariants: ProductVariantForRearrange[];\n\tsetSelectedVariants: React.Dispatch<\n\t\tReact.SetStateAction<ProductVariantForRearrange[]>\n\t>;\n\tselectedCollectionsDispatch: React.Dispatch<SelectedCollectionsActions>;\n\toutOfStockAction?: OUT_OF_STOCK_ACTION;\n};\n\n/**\n * Returns a react component of variants list, which are eligible to drag and drop.\n */\nexport const VariantsList = ({\n\tselectedVariants,\n\tsetSelectedVariants,\n\tselectedCollectionsDispatch,\n\toutOfStockAction,\n}: VariantsComponentProps) => {\n\tconst [selectedIndex, setSelectedIndex] = useState(-1);\n\n\t/**\n\t * This function returns style of the card.\n\t * The style doesn't allow the item to drag horizontally.\n\t */\n\tfunction getStyle(style: React.CSSProperties) {\n\t\tif (style?.transform) {\n\t\t\tconst axisLockY = `translate(0px, ${style.transform.split(',').pop()}`;\n\n\t\t\treturn {\n\t\t\t\t...style,\n\t\t\t\ttransform: axisLockY,\n\t\t\t};\n\t\t}\n\t\treturn style;\n\t}\n\n\treturn (\n\t\t<Droppable droppableId=\"droppable-list\">\n\t\t\t{(providedDroppable: any, snapshotDroppable: any) => (\n\t\t\t\t<div\n\t\t\t\t\t{...providedDroppable.droppableProps}\n\t\t\t\t\tref={providedDroppable.innerRef}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tbackgroundColor: COLORS.surface.subdued,\n\t\t\t\t\t\tpadding: '0.05px',\n\t\t\t\t\t\theight: selectedVariants.length < 8 ? '550px' : '100%',\n\t\t\t\t\t\toverflow: 'auto',\n\t\t\t\t\t\t...providedDroppable.droppableProps.style,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{selectedVariants.map((variant, index) => (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={`${variant.productId}-${variant.variantId}`}\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tbackground: COLORS.surface.hovered,\n\t\t\t\t\t\t\t\tmargin: '5px',\n\t\t\t\t\t\t\t\tboxShadow:\n\t\t\t\t\t\t\t\t\tindex === selectedIndex\n\t\t\t\t\t\t\t\t\t\t? '0px 4px 12px rgba(0, 0, 0, 0.12)'\n\t\t\t\t\t\t\t\t\t\t: '',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonMouseEnter={() => setSelectedIndex(index)}\n\t\t\t\t\t\t\tonMouseLeave={() => setSelectedIndex(-1)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Draggable\n\t\t\t\t\t\t\t\tkey={`${variant.productId}-${variant.variantId}`}\n\t\t\t\t\t\t\t\tdraggableId={`${variant.productId}-${variant.variantId}`}\n\t\t\t\t\t\t\t\tindex={index}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{(providedDraggable: any, snapshot: any) => {\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tref={providedDraggable.innerRef}\n\t\t\t\t\t\t\t\t\t\t\t{...providedDraggable.draggableProps}\n\t\t\t\t\t\t\t\t\t\t\t{...providedDraggable.dragHandleProps}\n\t\t\t\t\t\t\t\t\t\t\tstyle={getStyle({\n\t\t\t\t\t\t\t\t\t\t\t\t...providedDraggable.draggableProps.style,\n\t\t\t\t\t\t\t\t\t\t\t\t...providedDraggable.draggableSnapshot,\n\t\t\t\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<VariantCardListView\n\t\t\t\t\t\t\t\t\t\t\t\tkey={`${variant.productId}-${variant.variantId}`}\n\t\t\t\t\t\t\t\t\t\t\t\tdata={variant}\n\t\t\t\t\t\t\t\t\t\t\t\tselectedCollectionsDispatch={\n\t\t\t\t\t\t\t\t\t\t\t\t\tselectedCollectionsDispatch\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\tonDelete={() => {\n\t\t\t\t\t\t\t\t\t\t\t\t\tconst tempSelectedVariants = selectedVariants.slice();\n\t\t\t\t\t\t\t\t\t\t\t\t\ttempSelectedVariants[index].displayOrder = null;\n\t\t\t\t\t\t\t\t\t\t\t\t\ttempSelectedVariants.splice(index, 1);\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetSelectedVariants(tempSelectedVariants);\n\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\toutOfStockAction={outOfStockAction}\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t</Draggable>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t))}\n\t\t\t\t\t{providedDroppable.placeholder && snapshotDroppable.isDraggingOver ? (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tbackground: COLORS.surface.hovered,\n\t\t\t\t\t\t\t\tmargin: '5px',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{providedDroppable.placeholder}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) : null}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</Droppable>\n\t);\n};\n\n/**\n * Returns a react component of variants grid, which are eligible to drag and drop.\n */\nexport const VariantsGrid = ({ selectedVariants }: VariantsComponentProps) => {\n\treturn (\n\t\t<Droppable droppableId=\"droppable-horizontal\">\n\t\t\t{(providedHorizontal) => (\n\t\t\t\t<div\n\t\t\t\t\t{...providedHorizontal.droppableProps}\n\t\t\t\t\tref={providedHorizontal.innerRef}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Droppable droppableId=\"droppable-vertical\" direction=\"horizontal\">\n\t\t\t\t\t\t{(providedVertical) => (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t{...providedVertical.droppableProps}\n\t\t\t\t\t\t\t\tref={providedVertical.innerRef}\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\tflexWrap: 'wrap',\n\t\t\t\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{selectedVariants.map((variant, index) => (\n\t\t\t\t\t\t\t\t\t<Draggable\n\t\t\t\t\t\t\t\t\t\tkey={`${variant.productId}-${variant.variantId}`}\n\t\t\t\t\t\t\t\t\t\tdraggableId={`${variant.productId}-${variant.variantId}`}\n\t\t\t\t\t\t\t\t\t\tindex={index}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{(providedDraggable: any, snapshot: any) => (\n\t\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\t\tref={providedDraggable.innerRef}\n\t\t\t\t\t\t\t\t\t\t\t\t{...providedDraggable.draggableProps}\n\t\t\t\t\t\t\t\t\t\t\t\t{...providedDraggable.dragHandleProps}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<VariantCardGridView data={variant} />\n\t\t\t\t\t\t\t\t\t\t\t\t{providedDraggable.placeholder}\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</Draggable>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t{providedVertical.placeholder}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</Droppable>\n\t\t\t\t\t{providedHorizontal.placeholder}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</Droppable>\n\t);\n};\n"],"names":["VariantsList","selectedVariants","setSelectedVariants","selectedCollectionsDispatch","outOfStockAction","selectedIndex","setSelectedIndex","useState","getStyle","style","axisLockY","Droppable","providedDroppable","snapshotDroppable","jsxDEV","COLORS","variant","index","Draggable","providedDraggable","snapshot","VariantCardListView","tempSelectedVariants","this","VariantsGrid","providedHorizontal","providedVertical","VariantCardGridView"],"mappings":"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"}

package/dist/cjs/components/progress-bar/CircularProgressBar.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-dev-runtime"),u=require("../../assets/icons/checklistIcon.svg.js"),m=({percentage:s,width:r=200,containerStyle:l})=>{const c=s<0?0:s>100?100:s,o=r/2-r/10,n=o*Math.PI*2,t=n-n*c/100,a=r/10,i=r/3;return e.jsxDEV("div",{style:l,children:e.jsxDEV("svg",{width:r,height:r,viewBox:`0 0 ${r} ${r}`,children:[e.jsxDEV("defs",{children:e.jsxDEV("linearGradient",{id:"gradientStroke",x1:"0%",y1:"0%",x2:"100%",y2:"0%",children:[e.jsxDEV("stop",{offset:"0%",stopColor:"#7000FF"},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:22,columnNumber:7},void 0),e.jsxDEV("stop",{offset:"100%",stopColor:"#AD00FF"},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:23,columnNumber:7},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:21,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:20,columnNumber:5},void 0),e.jsxDEV("circle",{cx:r/2,cy:r/2,strokeWidth:a,r:o,strokeOpacity:.8,fill:"none",style:{stroke:"#ffffff"}},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:26,columnNumber:5},void 0),e.jsxDEV("circle",{cx:r/2,cy:r/2,strokeWidth:a,r:o,style:{stroke:"url(#gradientStroke)",strokeDasharray:n,strokeDashoffset:t},transform:`rotate(-90 ${r/2} ${r/2})`,fill:"none",strokeLinecap:"round",strokeLinejoin:"round"},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:37,columnNumber:5},void 0),e.jsxDEV(u.default,{x:r/2-i/2,width:i},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:52,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:19,columnNumber:4},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:18,columnNumber:3},void 0)};exports.default=m;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-dev-runtime"),m=require("../../assets/icons/checklistIcon.svg.js"),u=({percentage:s,width:r=200,containerStyle:t})=>{const l=s<0?0:s>100?100:s,o=r/2-r/10,n=o*Math.PI*2,c=n-n*l/100,a=r/10,i=r/3;return e.jsxDEV("div",{style:t,children:e.jsxDEV("svg",{width:r,height:r,viewBox:`0 0 ${r} ${r}`,children:[e.jsxDEV("defs",{children:e.jsxDEV("linearGradient",{id:"gradientStroke",x1:"0%",y1:"0%",x2:"100%",y2:"0%",children:[e.jsxDEV("stop",{offset:"0%",stopColor:"#7000FF"},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:22,columnNumber:7},void 0),e.jsxDEV("stop",{offset:"100%",stopColor:"#AD00FF"},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:23,columnNumber:7},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:21,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:20,columnNumber:5},void 0),e.jsxDEV("circle",{cx:r/2,cy:r/2,strokeWidth:a,r:o,strokeOpacity:.8,fill:"none",style:{stroke:"#ffffff"}},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:26,columnNumber:5},void 0),e.jsxDEV("circle",{cx:r/2,cy:r/2,strokeWidth:a,r:o,style:{stroke:"url(#gradientStroke)",strokeDasharray:n,strokeDashoffset:c},transform:`rotate(-90 ${r/2} ${r/2})`,fill:"none",strokeLinecap:"round",strokeLinejoin:"round"},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:37,columnNumber:5},void 0),e.jsxDEV(m.default,{x:r/2-i/2,width:i},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:52,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:19,columnNumber:4},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar/CircularProgressBar.tsx",lineNumber:18,columnNumber:3},void 0)};exports.default=u;
 //# sourceMappingURL=CircularProgressBar.js.map

package/dist/cjs/components/progress-bar/CircularProgressBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"CircularProgressBar.js","sources":["../../../../src/components/progress-bar/CircularProgressBar.tsx"],"sourcesContent":["import CheckListIcon from '@src/assets/icons/checklistIcon.svg';\nimport React from 'react';\n\n//TODO: Make Inner icon dynamic and support text option also\nconst CircularProgressBar: React.FC<{\n\tpercentage: number;\n\twidth?: number;\n\tcontainerStyle?: React.CSSProperties;\n}> = ({ percentage, width = 200, containerStyle }) => {\n\tconst cleanedPercentage =\n\t\tpercentage < 0 ? 0 : percentage > 100 ? 100 : percentage;\n\tconst radius = width / 2 - width / 10;\n\tconst dashArray = radius * Math.PI * 2;\n\tconst dashOffset = dashArray - (dashArray * cleanedPercentage) / 100;\n\tconst strokeWidth = width / 10;\n\tconst innerIconWidth = width / 3;\n\treturn (\n\t\t<div style={containerStyle}>\n\t\t\t<svg width={width} height={width} viewBox={`0 0 ${width} ${width}`}>\n\t\t\t\t<defs>\n\t\t\t\t\t<linearGradient id=\"gradientStroke\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"0%\">\n\t\t\t\t\t\t<stop offset=\"0%\" stopColor=\"#7000FF\" />\n\t\t\t\t\t\t<stop offset=\"100%\" stopColor=\"#AD00FF\" />\n\t\t\t\t\t</linearGradient>\n\t\t\t\t</defs>\n\t\t\t\t<circle\n\t\t\t\t\tcx={width / 2}\n\t\t\t\t\tcy={width / 2}\n\t\t\t\t\tstrokeWidth={strokeWidth}\n\t\t\t\t\tr={radius}\n\t\t\t\t\tstrokeOpacity={0.8}\n\t\t\t\t\tfill={'none'}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tstroke: '#ffffff',\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<circle\n\t\t\t\t\tcx={width / 2}\n\t\t\t\t\tcy={width / 2}\n\t\t\t\t\tstrokeWidth={strokeWidth}\n\t\t\t\t\tr={radius}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tstroke: 'url(#gradientStroke)',\n\t\t\t\t\t\tstrokeDasharray: dashArray,\n\t\t\t\t\t\tstrokeDashoffset: dashOffset,\n\t\t\t\t\t}}\n\t\t\t\t\ttransform={`rotate(-90 ${width / 2} ${width / 2})`}\n\t\t\t\t\tfill={'none'}\n\t\t\t\t\tstrokeLinecap={'round'}\n\t\t\t\t\tstrokeLinejoin={'round'}\n\t\t\t\t/>\n\t\t\t\t<CheckListIcon\n\t\t\t\t\tx={width / 2 - innerIconWidth / 2}\n\t\t\t\t\twidth={innerIconWidth}\n\t\t\t\t/>\n\t\t\t</svg>\n\t\t</div>\n\t);\n};\n\nexport default CircularProgressBar;\n"],"names":["CircularProgressBar","percentage","width","containerStyle","cleanedPercentage","radius","dashArray","dashOffset","strokeWidth","innerIconWidth","jsxDEV","this","CheckListIcon"],"mappings":"0MAIMA,EAID,CAAC,CAAE,WAAAC,EAAY,MAAAC,EAAQ,IAAK,eAAAC,KAAqB,CACrD,MAAMC,EACLH,EAAa,EAAI,EAAIA,EAAa,IAAM,IAAMA,EACzCI,EAASH,EAAQ,EAAIA,EAAQ,GAC7BI,EAAYD,EAAS,KAAK,GAAK,EAC/BE,EAAaD,EAAaA,EAAYF,EAAqB,IAC3DI,EAAcN,EAAQ,GACtBO,EAAiBP,EAAQ,EAC/B,OACCQ,EAAAA,OAAC,MAAA,CAAI,MAAOP,EACX,kBAAC,MAAA,CAAI,MAAAD,EAAc,OAAQA,EAAO,QAAS,OAAOA,CAAK,IAAIA,CAAK,GAC/D,SAAA,CAAAQ,EAAAA,OAAC,OAAA,CACA,SAAAA,EAAAA,OAAC,iBAAA,CAAe,GAAG,iBAAiB,GAAG,KAAK,GAAG,KAAK,GAAG,OAAO,GAAG,KAChE,SAAA,CAAAA,SAAC,OAAA,CAAK,OAAO,KAAK,UAAU,SAAA,EAA5B,OAAA,GAAA,CAAA,SAAA,0GAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAsC,EACtCD,SAAC,OAAA,CAAK,OAAO,OAAO,UAAU,SAAA,EAA9B,OAAA,GAAA,CAAA,SAAA,0GAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAwC,CAAA,CAAA,EAFzC,OAAA,GAAA,CAAA,SAAA,0GAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAGA,CAAA,EAJD,OAAA,GAAA,CAAA,SAAA,0GAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAKA,EACAD,EAAAA,OAAC,SAAA,CACA,GAAIR,EAAQ,EACZ,GAAIA,EAAQ,EACZ,YAAAM,EACA,EAAGH,EACH,cAAe,GACf,KAAM,OACN,MAAO,CACN,OAAQ,SAAA,CACT,EATD,OAAA,GAAA,CAAA,SAAA,0GAAA,WAAA,GAAA,aAAA,CAAA,EAAAM,MAAA,EAWAD,EAAAA,OAAC,SAAA,CACA,GAAIR,EAAQ,EACZ,GAAIA,EAAQ,EACZ,YAAAM,EACA,EAAGH,EACH,MAAO,CACN,OAAQ,uBACR,gBAAiBC,EACjB,iBAAkBC,CAAA,EAEnB,UAAW,cAAcL,EAAQ,CAAC,IAAIA,EAAQ,CAAC,IAC/C,KAAM,OACN,cAAe,QACf,eAAgB,OAAA,EAbjB,OAAA,GAAA,CAAA,SAAA,0GAAA,WAAA,GAAA,aAAA,CAAA,EAAAS,MAAA,EAeAD,EAAAA,OAACE,EAAAA,QAAA,CACA,EAAGV,EAAQ,EAAIO,EAAiB,EAChC,MAAOA,CAAA,EAFR,OAAA,GAAA,CAAA,SAAA,0GAAA,WAAA,GAAA,aAAA,CAAA,EAAAE,MAAA,CAGA,CAAA,EApCD,OAAA,GAAA,CAAA,SAAA,0GAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAqCA,CAAA,EAtCD,OAAA,GAAA,CAAA,SAAA,0GAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAuCA,CAEF"}
+{"version":3,"file":"CircularProgressBar.js","sources":["../../../../src/components/progress-bar/CircularProgressBar.tsx"],"sourcesContent":["import CheckListIcon from '@src/assets/icons/checklistIcon.svg';\nimport React from 'react';\n\n//TODO: Make Inner icon dynamic and support text option also\nconst CircularProgressBar: React.FC<{\n\tpercentage: number;\n\twidth?: number;\n\tcontainerStyle?: React.CSSProperties;\n}> = ({ percentage, width = 200, containerStyle }) => {\n\tconst cleanedPercentage =\n\t\tpercentage < 0 ? 0 : percentage > 100 ? 100 : percentage;\n\tconst radius = width / 2 - width / 10;\n\tconst dashArray = radius * Math.PI * 2;\n\tconst dashOffset = dashArray - (dashArray * cleanedPercentage) / 100;\n\tconst strokeWidth = width / 10;\n\tconst innerIconWidth = width / 3;\n\treturn (\n\t\t<div style={containerStyle}>\n\t\t\t<svg width={width} height={width} viewBox={`0 0 ${width} ${width}`}>\n\t\t\t\t<defs>\n\t\t\t\t\t<linearGradient id=\"gradientStroke\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"0%\">\n\t\t\t\t\t\t<stop offset=\"0%\" stopColor=\"#7000FF\" />\n\t\t\t\t\t\t<stop offset=\"100%\" stopColor=\"#AD00FF\" />\n\t\t\t\t\t</linearGradient>\n\t\t\t\t</defs>\n\t\t\t\t<circle\n\t\t\t\t\tcx={width / 2}\n\t\t\t\t\tcy={width / 2}\n\t\t\t\t\tstrokeWidth={strokeWidth}\n\t\t\t\t\tr={radius}\n\t\t\t\t\tstrokeOpacity={0.8}\n\t\t\t\t\tfill={'none'}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tstroke: '#ffffff',\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t\t<circle\n\t\t\t\t\tcx={width / 2}\n\t\t\t\t\tcy={width / 2}\n\t\t\t\t\tstrokeWidth={strokeWidth}\n\t\t\t\t\tr={radius}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tstroke: 'url(#gradientStroke)',\n\t\t\t\t\t\tstrokeDasharray: dashArray,\n\t\t\t\t\t\tstrokeDashoffset: dashOffset,\n\t\t\t\t\t}}\n\t\t\t\t\ttransform={`rotate(-90 ${width / 2} ${width / 2})`}\n\t\t\t\t\tfill={'none'}\n\t\t\t\t\tstrokeLinecap={'round'}\n\t\t\t\t\tstrokeLinejoin={'round'}\n\t\t\t\t/>\n\t\t\t\t<CheckListIcon\n\t\t\t\t\tx={width / 2 - innerIconWidth / 2}\n\t\t\t\t\twidth={innerIconWidth}\n\t\t\t\t/>\n\t\t\t</svg>\n\t\t</div>\n\t);\n};\n\nexport default CircularProgressBar;\n"],"names":["CircularProgressBar","percentage","width","containerStyle","cleanedPercentage","radius","dashArray","dashOffset","strokeWidth","innerIconWidth","jsxDEV","this","CheckListIcon"],"mappings":"0MAIMA,EAID,CAAC,CAAE,WAAAC,EAAY,MAAAC,EAAQ,IAAK,eAAAC,KAAqB,CACrD,MAAMC,EACLH,EAAa,EAAI,EAAIA,EAAa,IAAM,IAAMA,EACzCI,EAASH,EAAQ,EAAIA,EAAQ,GAC7BI,EAAYD,EAAS,KAAK,GAAK,EAC/BE,EAAaD,EAAaA,EAAYF,EAAqB,IAC3DI,EAAcN,EAAQ,GACtBO,EAAiBP,EAAQ,EAC/B,OACCQ,EAAAA,OAAC,MAAA,CAAI,MAAOP,EACX,kBAAC,MAAA,CAAI,MAAAD,EAAc,OAAQA,EAAO,QAAS,OAAOA,CAAK,IAAIA,CAAK,GAC/D,SAAA,CAAAQ,EAAAA,OAAC,OAAA,CACA,SAAAA,EAAAA,OAAC,iBAAA,CAAe,GAAG,iBAAiB,GAAG,KAAK,GAAG,KAAK,GAAG,OAAO,GAAG,KAChE,SAAA,CAAAA,SAAC,OAAA,CAAK,OAAO,KAAK,UAAU,SAAA,EAA5B,OAAA,GAAA,CAAA,SAAA,yIAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAsC,EACtCD,SAAC,OAAA,CAAK,OAAO,OAAO,UAAU,SAAA,EAA9B,OAAA,GAAA,CAAA,SAAA,yIAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAwC,CAAA,CAAA,EAFzC,OAAA,GAAA,CAAA,SAAA,yIAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAGA,CAAA,EAJD,OAAA,GAAA,CAAA,SAAA,yIAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAKA,EACAD,EAAAA,OAAC,SAAA,CACA,GAAIR,EAAQ,EACZ,GAAIA,EAAQ,EACZ,YAAAM,EACA,EAAGH,EACH,cAAe,GACf,KAAM,OACN,MAAO,CACN,OAAQ,SAAA,CACT,EATD,OAAA,GAAA,CAAA,SAAA,yIAAA,WAAA,GAAA,aAAA,CAAA,EAAAM,MAAA,EAWAD,EAAAA,OAAC,SAAA,CACA,GAAIR,EAAQ,EACZ,GAAIA,EAAQ,EACZ,YAAAM,EACA,EAAGH,EACH,MAAO,CACN,OAAQ,uBACR,gBAAiBC,EACjB,iBAAkBC,CAAA,EAEnB,UAAW,cAAcL,EAAQ,CAAC,IAAIA,EAAQ,CAAC,IAC/C,KAAM,OACN,cAAe,QACf,eAAgB,OAAA,EAbjB,OAAA,GAAA,CAAA,SAAA,yIAAA,WAAA,GAAA,aAAA,CAAA,EAAAS,MAAA,EAeAD,EAAAA,OAACE,EAAAA,QAAA,CACA,EAAGV,EAAQ,EAAIO,EAAiB,EAChC,MAAOA,CAAA,EAFR,OAAA,GAAA,CAAA,SAAA,yIAAA,WAAA,GAAA,aAAA,CAAA,EAAAE,MAAA,CAGA,CAAA,EApCD,OAAA,GAAA,CAAA,SAAA,yIAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAqCA,CAAA,EAtCD,OAAA,GAAA,CAAA,SAAA,yIAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAuCA,CAEF"}

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

@@ -1,7 +1,7 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-dev-runtime"),n=require("react-bootstrap"),t=require("styled-components"),s=require("../../constants/Theme.js"),a=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},i=a(t),l=e=>o.jsxDEV(r,{color:e.color?e.color:s.COLORS.content.brand,children:o.jsxDEV(n.ProgressBar,{animated:e.isAnimated,now:e.completed,style:{height:`${e.height?e.height:8}px`}},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar/ProgressBarComponent.tsx",lineNumber:17,columnNumber:4},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar/ProgressBarComponent.tsx",lineNumber:14,columnNumber:3},void 0),r=i.default.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-dev-runtime"),t=require("react-bootstrap"),s=require("styled-components"),n=require("../../constants/Theme.js"),a=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},i=a(s),l=e=>r.jsxDEV(o,{color:e.color?e.color:n.COLORS.content.brand,children:r.jsxDEV(t.ProgressBar,{animated:e.isAnimated,now:e.completed,style:{height:`${e.height?e.height:8}px`}},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar/ProgressBarComponent.tsx",lineNumber:17,columnNumber:4},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar/ProgressBarComponent.tsx",lineNumber:14,columnNumber:3},void 0),o=i.default.div`
 	flex: 50%;
 	.progress-bar {
 		background: ${e=>e.color};
 	}
-`;exports.ProgressBarComponent=l;exports.ProgressCompletedBar=r;
+`;exports.ProgressBarComponent=l;exports.ProgressCompletedBar=o;
 //# sourceMappingURL=ProgressBarComponent.js.map

package/dist/cjs/components/progress-bar/ProgressBarComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressBarComponent.js","sources":["../../../../src/components/progress-bar/ProgressBarComponent.tsx"],"sourcesContent":["import { ProgressBar } from 'react-bootstrap';\nimport styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport interface ProgressBarProps {\n\tcompleted: number;\n\tisAnimated: boolean;\n\tcolor?: string;\n\theight?: number;\n}\n\nexport const ProgressBarComponent = (props: ProgressBarProps) => {\n\treturn (\n\t\t<ProgressCompletedBar\n\t\t\tcolor={props.color ? props.color : COLORS.content.brand}\n\t\t>\n\t\t\t<ProgressBar\n\t\t\t\tanimated={props.isAnimated}\n\t\t\t\tnow={props.completed}\n\t\t\t\tstyle={{ height: `${props.height ? props.height : 8}px` }}\n\t\t\t/>\n\t\t</ProgressCompletedBar>\n\t);\n};\n\nexport const ProgressCompletedBar = styled.div<{ color: string }>`\n\tflex: 50%;\n\t.progress-bar {\n\t\tbackground: ${(props) => props.color};\n\t}\n`;\n"],"names":["ProgressBarComponent","props","jsxDEV","ProgressCompletedBar","COLORS","ProgressBar","this","styled"],"mappings":"0RAWaA,EAAwBC,GAEnCC,EAAAA,OAACC,EAAA,CACA,MAAOF,EAAM,MAAQA,EAAM,MAAQG,EAAAA,OAAO,QAAQ,MAElD,SAAAF,EAAAA,OAACG,EAAAA,YAAA,CACA,SAAUJ,EAAM,WAChB,IAAKA,EAAM,UACX,MAAO,CAAE,OAAQ,GAAGA,EAAM,OAASA,EAAM,OAAS,CAAC,IAAA,CAAK,EAHzD,OAAA,GAAA,CAAA,SAAA,2GAAA,WAAA,GAAA,aAAA,CAAA,EAAAK,MAAA,CAIA,EAPD,OAAA,GAAA,CAAA,SAAA,2GAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA,EAYWH,EAAuBI,EAAAA,QAAO;AAAA;AAAA;AAAA,gBAG1BN,GAAUA,EAAM,KAAK;AAAA;AAAA"}
+{"version":3,"file":"ProgressBarComponent.js","sources":["../../../../src/components/progress-bar/ProgressBarComponent.tsx"],"sourcesContent":["import { ProgressBar } from 'react-bootstrap';\nimport styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\n\nexport interface ProgressBarProps {\n\tcompleted: number;\n\tisAnimated: boolean;\n\tcolor?: string;\n\theight?: number;\n}\n\nexport const ProgressBarComponent = (props: ProgressBarProps) => {\n\treturn (\n\t\t<ProgressCompletedBar\n\t\t\tcolor={props.color ? props.color : COLORS.content.brand}\n\t\t>\n\t\t\t<ProgressBar\n\t\t\t\tanimated={props.isAnimated}\n\t\t\t\tnow={props.completed}\n\t\t\t\tstyle={{ height: `${props.height ? props.height : 8}px` }}\n\t\t\t/>\n\t\t</ProgressCompletedBar>\n\t);\n};\n\nexport const ProgressCompletedBar = styled.div<{ color: string }>`\n\tflex: 50%;\n\t.progress-bar {\n\t\tbackground: ${(props) => props.color};\n\t}\n`;\n"],"names":["ProgressBarComponent","props","jsxDEV","ProgressCompletedBar","COLORS","ProgressBar","this","styled"],"mappings":"0RAWaA,EAAwBC,GAEnCC,EAAAA,OAACC,EAAA,CACA,MAAOF,EAAM,MAAQA,EAAM,MAAQG,EAAAA,OAAO,QAAQ,MAElD,SAAAF,EAAAA,OAACG,EAAAA,YAAA,CACA,SAAUJ,EAAM,WAChB,IAAKA,EAAM,UACX,MAAO,CAAE,OAAQ,GAAGA,EAAM,OAASA,EAAM,OAAS,CAAC,IAAA,CAAK,EAHzD,OAAA,GAAA,CAAA,SAAA,0IAAA,WAAA,GAAA,aAAA,CAAA,EAAAK,MAAA,CAIA,EAPD,OAAA,GAAA,CAAA,SAAA,0IAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA,EAYWH,EAAuBI,EAAAA,QAAO;AAAA;AAAA;AAAA,gBAG1BN,GAAUA,EAAM,KAAK;AAAA;AAAA"}

package/dist/cjs/components/progress-bar-v2/ProgressBarV2.js

@@ -1,9 +1,9 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-dev-runtime"),h=require("styled-components"),u=require("../TypographyStyle.js"),o=require("../../constants/Theme.js"),v=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},i=v(h);var m=(e=>(e.RIGHT="right",e.LEFT="left",e.TOP="top",e.BOTTOM="bottom",e))(m||{}),b=(e=>(e.CIRCLE="circle",e.LINE="line",e))(b||{});const y=e=>{const{type:g,progress:s,progressBarThickness:a,size:t,color:d,text:l,textPosition:p,showProgress:c,matchParentWidth:f=!1}=e;let r=p;return r||(r="left"),n.jsxDEV(x,{alignment:r,children:[c&&(r==="top"||r==="left")&&n.jsxDEV(u.BodyTiny,{style:{marginBottom:r==="top"?"8px":void 0,marginRight:r==="left"?"8px":void 0},color:o.COLORS.content.secondary,children:l??`${s}% completed...`},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:52,columnNumber:6},void 0),g==="line"?n.jsxDEV(B,{size:t,progressBarThickness:a,matchParentWidth:f,children:n.jsxDEV(O,{progress:s,color:d},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:68,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:63,columnNumber:5},void 0):n.jsxDEV(k,{progress:s,color:d,size:t,children:n.jsxDEV(N,{progress:s,size:t,progressBarThickness:a},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:72,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:71,columnNumber:5},void 0),c&&(r==="bottom"||r==="right")&&n.jsxDEV(u.BodyTiny,{style:{marginTop:r==="bottom"?"8px":void 0,marginLeft:r==="right"?"8px":void 0},color:o.COLORS.content.secondary,children:l??`${s}% completed...`},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:82,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:48,columnNumber:3},void 0)},x=i.default.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-dev-runtime"),v=require("styled-components"),m=require("../TypographyStyle.js"),o=require("../../constants/Theme.js"),f=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},i=f(v);var u=(e=>(e.RIGHT="right",e.LEFT="left",e.TOP="top",e.BOTTOM="bottom",e))(u||{}),b=(e=>(e.CIRCLE="circle",e.LINE="line",e))(b||{});const k=e=>{const{type:p,progress:n,progressBarThickness:a,size:t,color:c,text:l,textPosition:g,showProgress:d,matchParentWidth:h=!1}=e;let r=g;return r||(r="left"),s.jsxDEV(y,{alignment:r,children:[d&&(r==="top"||r==="left")&&s.jsxDEV(m.BodyTiny,{style:{marginBottom:r==="top"?"8px":void 0,marginRight:r==="left"?"8px":void 0},color:o.COLORS.content.secondary,children:l??`${n}% completed...`},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:52,columnNumber:6},void 0),p==="line"?s.jsxDEV(B,{size:t,progressBarThickness:a,matchParentWidth:h,children:s.jsxDEV(O,{progress:n,color:c},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:68,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:63,columnNumber:5},void 0):s.jsxDEV(x,{progress:n,color:c,size:t,children:s.jsxDEV(N,{progress:n,size:t,progressBarThickness:a},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:72,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:71,columnNumber:5},void 0),d&&(r==="bottom"||r==="right")&&s.jsxDEV(m.BodyTiny,{style:{marginTop:r==="bottom"?"8px":void 0,marginLeft:r==="right"?"8px":void 0},color:o.COLORS.content.secondary,children:l??`${n}% completed...`},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:82,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:48,columnNumber:3},void 0)},y=i.default.div`
 	display: flex;
 	flex-direction: ${e=>e?.alignment==="top"||e?.alignment==="bottom"?"column":"row"};
 	align-items: center;
 	width: 100%;
-`,k=i.default.div`
+`,x=i.default.div`
 	width: ${e=>e.size??32}px;
 	height: ${e=>e.size??32}px;
 	border-radius: 50%;
@@ -36,5 +36,5 @@
 	width: ${e=>e.progress}%;
 	background-color: ${e=>e.color??o.COLORS.background.brand};
 	transition: width 0.3s ease-in-out;
-`;exports.ProgressBarType=b;exports.ProgressBarV2=y;exports.TextAlignment=m;
+`;exports.ProgressBarType=b;exports.ProgressBarV2=k;exports.TextAlignment=u;
 //# sourceMappingURL=ProgressBarV2.js.map

package/dist/cjs/components/progress-bar-v2/ProgressBarV2.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressBarV2.js","sources":["../../../../src/components/progress-bar-v2/ProgressBarV2.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { BodyTiny } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nexport enum TextAlignment {\n\tRIGHT = 'right',\n\tLEFT = 'left',\n\tTOP = 'top',\n\tBOTTOM = 'bottom',\n}\n\nexport enum ProgressBarType {\n\tCIRCLE = 'circle',\n\tLINE = 'line',\n}\n\nexport interface ProgressBarV2Props {\n\tprogress: number;\n\ttype: ProgressBarType;\n\tshowProgress?: boolean;\n\ttext?: string;\n\tsize?: number;\n\tprogressBarThickness?: number;\n\tcolor?: string;\n\ttextPosition?: TextAlignment;\n\tmatchParentWidth?: boolean;\n}\n\nexport const ProgressBarV2 = (props: ProgressBarV2Props) => {\n\tconst {\n\t\ttype,\n\t\tprogress,\n\t\tprogressBarThickness,\n\t\tsize,\n\t\tcolor,\n\t\ttext,\n\t\ttextPosition,\n\t\tshowProgress,\n\t\tmatchParentWidth = false,\n\t} = props;\n\n\tlet alignment = textPosition;\n\tif (!alignment) {\n\t\talignment = TextAlignment.LEFT;\n\t}\n\n\treturn (\n\t\t<MainContainer alignment={alignment}>\n\t\t\t{showProgress &&\n\t\t\t\t(alignment === TextAlignment.TOP ||\n\t\t\t\t\talignment === TextAlignment.LEFT) && (\n\t\t\t\t\t<BodyTiny\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tmarginBottom: alignment === TextAlignment.TOP ? '8px' : undefined,\n\t\t\t\t\t\t\tmarginRight: alignment === TextAlignment.LEFT ? '8px' : undefined,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t>\n\t\t\t\t\t\t{text ?? `${progress}% completed...`}\n\t\t\t\t\t</BodyTiny>\n\t\t\t\t)}\n\t\t\t{type === ProgressBarType.LINE ? (\n\t\t\t\t<BarContainer\n\t\t\t\t\tsize={size}\n\t\t\t\t\tprogressBarThickness={progressBarThickness}\n\t\t\t\t\tmatchParentWidth={matchParentWidth}\n\t\t\t\t>\n\t\t\t\t\t<InnerBarContainer progress={progress} color={color} />\n\t\t\t\t</BarContainer>\n\t\t\t) : (\n\t\t\t\t<CircleContainer progress={progress} color={color} size={size}>\n\t\t\t\t\t<InnerCircleContainer\n\t\t\t\t\t\tprogress={progress}\n\t\t\t\t\t\tsize={size}\n\t\t\t\t\t\tprogressBarThickness={progressBarThickness}\n\t\t\t\t\t/>\n\t\t\t\t</CircleContainer>\n\t\t\t)}\n\t\t\t{showProgress &&\n\t\t\t\t(alignment === TextAlignment.BOTTOM ||\n\t\t\t\t\talignment === TextAlignment.RIGHT) && (\n\t\t\t\t\t<BodyTiny\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tmarginTop: alignment === TextAlignment.BOTTOM ? '8px' : undefined,\n\t\t\t\t\t\t\tmarginLeft: alignment === TextAlignment.RIGHT ? '8px' : undefined,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t>\n\t\t\t\t\t\t{text ?? `${progress}% completed...`}\n\t\t\t\t\t</BodyTiny>\n\t\t\t\t)}\n\t\t</MainContainer>\n\t);\n};\n\nconst MainContainer = styled.div<{ alignment?: TextAlignment }>`\n\tdisplay: flex;\n\tflex-direction: ${(props) =>\n\t\tprops?.alignment === TextAlignment.TOP ||\n\t\tprops?.alignment === TextAlignment.BOTTOM\n\t\t\t? 'column'\n\t\t\t: 'row'};\n\talign-items: center;\n\twidth: 100%;\n`;\n\nconst CircleContainer = styled.div<{\n\tprogress: number;\n\tsize?: number;\n\tcolor?: string;\n}>`\n\twidth: ${(props) => props.size ?? 32}px;\n\theight: ${(props) => props.size ?? 32}px;\n\tborder-radius: 50%;\n\toverflow: hidden;\n\tbackground: conic-gradient(\n\t\t${(props) => props.color ?? COLORS.background.brand}\n\t\t\t${(props) => props.progress * 3.6}deg,\n\t\t${COLORS.content.inactive} 0deg\n\t);\n\tposition: relative;\n`;\n\nconst InnerCircleContainer = styled.div<{\n\tprogress: number;\n\tsize?: number;\n\tprogressBarThickness?: number;\n}>`\n\tbackground-color: ${COLORS.background.inactive};\n\ttransition: width 0.3s ease-in-out;\n\tposition: absolute;\n\ttop: 50%;\n\tleft: 50%;\n\ttransform: translate(-50%, -50%);\n\twidth: ${(props) =>\n\t\tprops.progressBarThickness\n\t\t\t? props.size ?? 32 - props.progressBarThickness\n\t\t\t: 20}px;\n\theight: ${(props) =>\n\t\tprops.progressBarThickness\n\t\t\t? props.size ?? 32 - props.progressBarThickness\n\t\t\t: 20}px;\n\tborder-radius: 50%;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nconst BarContainer = styled.div<{\n\tsize?: number;\n\tprogressBarThickness?: number;\n\tmatchParentWidth?: boolean;\n}>`\n\twidth: ${(props) =>\n\t\tprops.matchParentWidth ? '100%' : `${props.size ?? 90}px`};\n\theight: ${(props) => props.progressBarThickness ?? 8}px;\n\tbackground-color: ${COLORS.background.inactive};\n\tborder-radius: 4px;\n\toverflow: hidden;\n`;\n\nconst InnerBarContainer = styled.div<{\n\tprogress: number;\n\tcolor?: string;\n}>`\n\theight: 100%;\n\twidth: ${(props) => props.progress}%;\n\tbackground-color: ${(props) => props.color ?? COLORS.background.brand};\n\ttransition: width 0.3s ease-in-out;\n`;\n"],"names":["TextAlignment","ProgressBarType","ProgressBarV2","props","type","progress","progressBarThickness","size","color","text","textPosition","showProgress","matchParentWidth","alignment","jsxDEV","MainContainer","BodyTiny","COLORS","this","BarContainer","InnerBarContainer","CircleContainer","InnerCircleContainer","styled"],"mappings":"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"}
+{"version":3,"file":"ProgressBarV2.js","sources":["../../../../src/components/progress-bar-v2/ProgressBarV2.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { BodyTiny } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nexport enum TextAlignment {\n\tRIGHT = 'right',\n\tLEFT = 'left',\n\tTOP = 'top',\n\tBOTTOM = 'bottom',\n}\n\nexport enum ProgressBarType {\n\tCIRCLE = 'circle',\n\tLINE = 'line',\n}\n\nexport interface ProgressBarV2Props {\n\tprogress: number;\n\ttype: ProgressBarType;\n\tshowProgress?: boolean;\n\ttext?: string;\n\tsize?: number;\n\tprogressBarThickness?: number;\n\tcolor?: string;\n\ttextPosition?: TextAlignment;\n\tmatchParentWidth?: boolean;\n}\n\nexport const ProgressBarV2 = (props: ProgressBarV2Props) => {\n\tconst {\n\t\ttype,\n\t\tprogress,\n\t\tprogressBarThickness,\n\t\tsize,\n\t\tcolor,\n\t\ttext,\n\t\ttextPosition,\n\t\tshowProgress,\n\t\tmatchParentWidth = false,\n\t} = props;\n\n\tlet alignment = textPosition;\n\tif (!alignment) {\n\t\talignment = TextAlignment.LEFT;\n\t}\n\n\treturn (\n\t\t<MainContainer alignment={alignment}>\n\t\t\t{showProgress &&\n\t\t\t\t(alignment === TextAlignment.TOP ||\n\t\t\t\t\talignment === TextAlignment.LEFT) && (\n\t\t\t\t\t<BodyTiny\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tmarginBottom: alignment === TextAlignment.TOP ? '8px' : undefined,\n\t\t\t\t\t\t\tmarginRight: alignment === TextAlignment.LEFT ? '8px' : undefined,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t>\n\t\t\t\t\t\t{text ?? `${progress}% completed...`}\n\t\t\t\t\t</BodyTiny>\n\t\t\t\t)}\n\t\t\t{type === ProgressBarType.LINE ? (\n\t\t\t\t<BarContainer\n\t\t\t\t\tsize={size}\n\t\t\t\t\tprogressBarThickness={progressBarThickness}\n\t\t\t\t\tmatchParentWidth={matchParentWidth}\n\t\t\t\t>\n\t\t\t\t\t<InnerBarContainer progress={progress} color={color} />\n\t\t\t\t</BarContainer>\n\t\t\t) : (\n\t\t\t\t<CircleContainer progress={progress} color={color} size={size}>\n\t\t\t\t\t<InnerCircleContainer\n\t\t\t\t\t\tprogress={progress}\n\t\t\t\t\t\tsize={size}\n\t\t\t\t\t\tprogressBarThickness={progressBarThickness}\n\t\t\t\t\t/>\n\t\t\t\t</CircleContainer>\n\t\t\t)}\n\t\t\t{showProgress &&\n\t\t\t\t(alignment === TextAlignment.BOTTOM ||\n\t\t\t\t\talignment === TextAlignment.RIGHT) && (\n\t\t\t\t\t<BodyTiny\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tmarginTop: alignment === TextAlignment.BOTTOM ? '8px' : undefined,\n\t\t\t\t\t\t\tmarginLeft: alignment === TextAlignment.RIGHT ? '8px' : undefined,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t>\n\t\t\t\t\t\t{text ?? `${progress}% completed...`}\n\t\t\t\t\t</BodyTiny>\n\t\t\t\t)}\n\t\t</MainContainer>\n\t);\n};\n\nconst MainContainer = styled.div<{ alignment?: TextAlignment }>`\n\tdisplay: flex;\n\tflex-direction: ${(props) =>\n\t\tprops?.alignment === TextAlignment.TOP ||\n\t\tprops?.alignment === TextAlignment.BOTTOM\n\t\t\t? 'column'\n\t\t\t: 'row'};\n\talign-items: center;\n\twidth: 100%;\n`;\n\nconst CircleContainer = styled.div<{\n\tprogress: number;\n\tsize?: number;\n\tcolor?: string;\n}>`\n\twidth: ${(props) => props.size ?? 32}px;\n\theight: ${(props) => props.size ?? 32}px;\n\tborder-radius: 50%;\n\toverflow: hidden;\n\tbackground: conic-gradient(\n\t\t${(props) => props.color ?? COLORS.background.brand}\n\t\t\t${(props) => props.progress * 3.6}deg,\n\t\t${COLORS.content.inactive} 0deg\n\t);\n\tposition: relative;\n`;\n\nconst InnerCircleContainer = styled.div<{\n\tprogress: number;\n\tsize?: number;\n\tprogressBarThickness?: number;\n}>`\n\tbackground-color: ${COLORS.background.inactive};\n\ttransition: width 0.3s ease-in-out;\n\tposition: absolute;\n\ttop: 50%;\n\tleft: 50%;\n\ttransform: translate(-50%, -50%);\n\twidth: ${(props) =>\n\t\tprops.progressBarThickness\n\t\t\t? props.size ?? 32 - props.progressBarThickness\n\t\t\t: 20}px;\n\theight: ${(props) =>\n\t\tprops.progressBarThickness\n\t\t\t? props.size ?? 32 - props.progressBarThickness\n\t\t\t: 20}px;\n\tborder-radius: 50%;\n\tbackground: ${COLORS.surface.standard};\n`;\n\nconst BarContainer = styled.div<{\n\tsize?: number;\n\tprogressBarThickness?: number;\n\tmatchParentWidth?: boolean;\n}>`\n\twidth: ${(props) =>\n\t\tprops.matchParentWidth ? '100%' : `${props.size ?? 90}px`};\n\theight: ${(props) => props.progressBarThickness ?? 8}px;\n\tbackground-color: ${COLORS.background.inactive};\n\tborder-radius: 4px;\n\toverflow: hidden;\n`;\n\nconst InnerBarContainer = styled.div<{\n\tprogress: number;\n\tcolor?: string;\n}>`\n\theight: 100%;\n\twidth: ${(props) => props.progress}%;\n\tbackground-color: ${(props) => props.color ?? COLORS.background.brand};\n\ttransition: width 0.3s ease-in-out;\n`;\n"],"names":["TextAlignment","ProgressBarType","ProgressBarV2","props","type","progress","progressBarThickness","size","color","text","textPosition","showProgress","matchParentWidth","alignment","jsxDEV","MainContainer","BodyTiny","COLORS","this","BarContainer","InnerBarContainer","CircleContainer","InnerCircleContainer","styled"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-dev-runtime"),t=require("react"),c=require("./RadioButton.styled.js"),a=require("../TypographyStyle.js"),n=require("../../constants/Theme.js"),y=e=>{const o=t.useMemo(()=>e?.activeColor||n.COLORS.background.positive.vibrant,[e.activeColor]),l=t.useMemo(()=>e.isDisabled?n.COLORS.content.inactive:e.isActive?o:n.COLORS.content.primary,[e.isDisabled,e.isActive,o]);return i.jsxDEV("svg",{width:e.isSmall?"16":"20",height:e.isSmall?"16":"20",viewBox:e.isSmall?"0 0 16 16":"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[i.jsxDEV("circle",{cx:e.isSmall?"8":"10",cy:e.isSmall?"8":"10",r:e.isSmall?6:9,stroke:l,strokeWidth:e.isSmall?1.5:2},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:60,columnNumber:4},void 0),e.isActive&&i.jsxDEV("circle",{cx:e.isSmall?"8":"10",cy:e.isSmall?"8":"10",r:e.isSmall?3:5,fill:e.isDisabled?n.COLORS.content.inactive:o},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:68,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:53,columnNumber:3},void 0)},x=e=>{const[o,l]=t.useState(e.isActive||!1),[u,s]=t.useState(!1),[m,d]=t.useState(!1),b=()=>{if(!e.skipSelectingOff&&!e.isDisabled){const r=!o;l(r),e.onValueChange?.(r,e.value)}};t.useEffect(()=>{l(e.isActive)},[e.isActive]);const f=()=>e.label?e.boldOnChecked&&o||e.alwaysBold?i.jsxDEV(a.TitleSmall,{color:e.isDisabled?n.COLORS.text.disabled:n.COLORS.text.primary,children:e.label},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:106,columnNumber:5},void 0):e.size==="SMALL"?i.jsxDEV(a.BodyCaption,{color:e.isDisabled?n.COLORS.text.disabled:n.COLORS.text.primary,children:e.label},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:116,columnNumber:5},void 0):e.labelSize==="MEDIUM"?i.jsxDEV(a.BodySecondary,{color:e.isDisabled?n.COLORS.text.disabled:n.COLORS.text.primary,children:e.label},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:126,columnNumber:5},void 0):i.jsxDEV(a.BodyPrimary,{color:e.isDisabled?n.COLORS.text.disabled:n.COLORS.text.primary,children:e.label},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:135,columnNumber:4},void 0):i.jsxDEV(i.Fragment,{},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:101,columnNumber:11},void 0);return i.jsxDEV(c.RadioButtonContainer,{onClick:b,onMouseEnter:()=>s(!e.skipHoverState),onMouseLeave:()=>s(!1),onMouseDown:()=>d(!e.skipHoverState),onMouseUp:()=>d(!1),style:e.caption?{alignItems:"flex-start"}:{},children:[i.jsxDEV(c.RadioButtonIcon,{checked:o,hovered:u,clicked:m,isDisabled:e.isDisabled||!1,size:e.size,style:e.caption?{margin:"2px 0"}:{},children:i.jsxDEV(y,{isSmall:e.size==="SMALL",isActive:o,isDisabled:e.isDisabled||!1,activeColor:e.activeColor},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:160,columnNumber:5},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:152,columnNumber:4},void 0),i.jsxDEV("div",{style:{display:"flex",flexDirection:"column",gap:e.gapBetweenBodyAndCaption||"0px"},children:[f(),e.caption&&i.jsxDEV(a.BodyCaption,{color:e.isDisabled?n.COLORS.text.disabled:n.COLORS.text.secondary,children:e.caption},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:176,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:167,columnNumber:4},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:144,columnNumber:3},void 0)};exports.RadioButton=x;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-dev-runtime"),o=require("react"),m=require("./RadioButton.styled.js"),a=require("../TypographyStyle.js"),t=require("../../constants/Theme.js"),v=e=>{const n=o.useMemo(()=>e?.activeColor||t.COLORS.background.positive.vibrant,[e.activeColor]),s=o.useMemo(()=>e.isDisabled?t.COLORS.content.inactive:e.isActive?n:t.COLORS.content.primary,[e.isDisabled,e.isActive,n]);return i.jsxDEV("svg",{width:e.isSmall?"16":"20",height:e.isSmall?"16":"20",viewBox:e.isSmall?"0 0 16 16":"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[i.jsxDEV("circle",{cx:e.isSmall?"8":"10",cy:e.isSmall?"8":"10",r:e.isSmall?6:9,stroke:s,strokeWidth:e.isSmall?1.5:2},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:60,columnNumber:4},void 0),e.isActive&&i.jsxDEV("circle",{cx:e.isSmall?"8":"10",cy:e.isSmall?"8":"10",r:e.isSmall?3:5,fill:e.isDisabled?t.COLORS.content.inactive:n},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:68,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:53,columnNumber:3},void 0)},f=e=>{const[n,s]=o.useState(e.isActive||!1),[d,l]=o.useState(!1),[u,r]=o.useState(!1),b=()=>{if(!e.skipSelectingOff&&!e.isDisabled){const c=!n;s(c),e.onValueChange?.(c,e.value)}};o.useEffect(()=>{s(e.isActive)},[e.isActive]);const k=()=>e.label?e.boldOnChecked&&n||e.alwaysBold?i.jsxDEV(a.TitleSmall,{color:e.isDisabled?t.COLORS.text.disabled:t.COLORS.text.primary,children:e.label},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:106,columnNumber:5},void 0):e.size==="SMALL"?i.jsxDEV(a.BodyCaption,{color:e.isDisabled?t.COLORS.text.disabled:t.COLORS.text.primary,children:e.label},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:116,columnNumber:5},void 0):e.labelSize==="MEDIUM"?i.jsxDEV(a.BodySecondary,{color:e.isDisabled?t.COLORS.text.disabled:t.COLORS.text.primary,children:e.label},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:126,columnNumber:5},void 0):i.jsxDEV(a.BodyPrimary,{color:e.isDisabled?t.COLORS.text.disabled:t.COLORS.text.primary,children:e.label},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:135,columnNumber:4},void 0):i.jsxDEV(i.Fragment,{},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:101,columnNumber:11},void 0);return i.jsxDEV(m.RadioButtonContainer,{onClick:b,onMouseEnter:()=>l(!e.skipHoverState),onMouseLeave:()=>l(!1),onMouseDown:()=>r(!e.skipHoverState),onMouseUp:()=>r(!1),style:e.caption?{alignItems:"flex-start"}:{},children:[i.jsxDEV(m.RadioButtonIcon,{checked:n,hovered:d,clicked:u,isDisabled:e.isDisabled||!1,size:e.size,style:e.caption?{margin:"2px 0"}:{},children:i.jsxDEV(v,{isSmall:e.size==="SMALL",isActive:n,isDisabled:e.isDisabled||!1,activeColor:e.activeColor},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:160,columnNumber:5},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:152,columnNumber:4},void 0),i.jsxDEV("div",{style:{display:"flex",flexDirection:"column",gap:e.gapBetweenBodyAndCaption||"0px"},children:[k(),e.caption&&i.jsxDEV(a.BodyCaption,{color:e.isDisabled?t.COLORS.text.disabled:t.COLORS.text.secondary,children:e.caption},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:176,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:167,columnNumber:4},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:144,columnNumber:3},void 0)};exports.RadioButton=f;
 //# sourceMappingURL=RadioButton.js.map

package/dist/cjs/components/radioButton/RadioButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioButton.js","sources":["../../../../src/components/radioButton/RadioButton.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from 'react';\nimport {\n\tRadioButtonContainer,\n\tRadioButtonIcon,\n} from '@src/components/radioButton/RadioButton.styled';\nimport {\n\tBodyCaption,\n\tBodyPrimary,\n\tBodySecondary,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nexport type RadioButtonProps = {\n\tisActive: boolean;\n\tisDisabled?: boolean;\n\tvalue?: string;\n\tlabel?: string;\n\tcaption?: string;\n\tonValueChange: (checked: boolean, value?: string) => void;\n\tskipHoverState?: boolean;\n\tsize?: 'DEFAULT' | 'SMALL';\n\tskipSelectingOff?: boolean;\n\tlabelSize?: 'DEFAULT' | 'MEDIUM';\n\tboldOnChecked?: boolean;\n\talwaysBold?: boolean;\n\tactiveColor?: string;\n\tgapBetweenBodyAndCaption?: string;\n};\n\nconst CheckMark: React.FC<{\n\tisActive: boolean;\n\tisDisabled: boolean;\n\tisSmall: boolean;\n\tactiveColor?: string;\n}> = (props) => {\n\tconst fillColor = useMemo(\n\t\t() => props?.activeColor || COLORS.background.positive.vibrant,\n\t\t[props.activeColor],\n\t);\n\n\tconst strokeColor = useMemo(\n\t\t() =>\n\t\t\tprops.isDisabled\n\t\t\t\t? COLORS.content.inactive\n\t\t\t\t: props.isActive\n\t\t\t\t? fillColor\n\t\t\t\t: COLORS.content.primary,\n\t\t[props.isDisabled, props.isActive, fillColor],\n\t);\n\n\treturn (\n\t\t<svg\n\t\t\twidth={props.isSmall ? '16' : '20'}\n\t\t\theight={props.isSmall ? '16' : '20'}\n\t\t\tviewBox={props.isSmall ? '0 0 16 16' : '0 0 20 20'}\n\t\t\tfill=\"none\"\n\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t>\n\t\t\t<circle\n\t\t\t\tcx={props.isSmall ? '8' : '10'}\n\t\t\t\tcy={props.isSmall ? '8' : '10'}\n\t\t\t\tr={props.isSmall ? 6 : 9}\n\t\t\t\tstroke={strokeColor}\n\t\t\t\tstrokeWidth={props.isSmall ? 1.5 : 2}\n\t\t\t/>\n\t\t\t{props.isActive && (\n\t\t\t\t<circle\n\t\t\t\t\tcx={props.isSmall ? '8' : '10'}\n\t\t\t\t\tcy={props.isSmall ? '8' : '10'}\n\t\t\t\t\tr={props.isSmall ? 3 : 5}\n\t\t\t\t\tfill={props.isDisabled ? COLORS.content.inactive : fillColor}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</svg>\n\t);\n};\n\nexport const RadioButton: React.FC<RadioButtonProps> = (props) => {\n\tconst [isActive, setIsActive] = useState(props.isActive || false);\n\tconst [isHovered, setIsHovered] = useState(false);\n\tconst [isClicked, setIsClicked] = useState(false);\n\n\tconst handleCheck = () => {\n\t\tif (props.skipSelectingOff) {\n\t\t\treturn;\n\t\t}\n\t\tif (!props.isDisabled) {\n\t\t\tconst newVal = !isActive;\n\t\t\tsetIsActive(newVal);\n\t\t\tprops.onValueChange?.(newVal, props.value);\n\t\t}\n\t};\n\n\tuseEffect(() => {\n\t\tsetIsActive(props.isActive);\n\t}, [props.isActive]);\n\n\tconst renderLabel = () => {\n\t\tif (!props.label) {\n\t\t\treturn <></>;\n\t\t}\n\n\t\tif ((props.boldOnChecked && isActive) || props.alwaysBold) {\n\t\t\treturn (\n\t\t\t\t<TitleSmall\n\t\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t\t>\n\t\t\t\t\t{props.label}\n\t\t\t\t</TitleSmall>\n\t\t\t);\n\t\t}\n\n\t\tif (props.size === 'SMALL') {\n\t\t\treturn (\n\t\t\t\t<BodyCaption\n\t\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t\t>\n\t\t\t\t\t{props.label}\n\t\t\t\t</BodyCaption>\n\t\t\t);\n\t\t}\n\n\t\tif (props.labelSize === 'MEDIUM') {\n\t\t\treturn (\n\t\t\t\t<BodySecondary\n\t\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t\t>\n\t\t\t\t\t{props.label}\n\t\t\t\t</BodySecondary>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<BodyPrimary\n\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t>\n\t\t\t\t{props.label}\n\t\t\t</BodyPrimary>\n\t\t);\n\t};\n\n\treturn (\n\t\t<RadioButtonContainer\n\t\t\tonClick={handleCheck}\n\t\t\tonMouseEnter={() => setIsHovered(!props.skipHoverState)}\n\t\t\tonMouseLeave={() => setIsHovered(false)}\n\t\t\tonMouseDown={() => setIsClicked(!props.skipHoverState)}\n\t\t\tonMouseUp={() => setIsClicked(false)}\n\t\t\tstyle={props.caption ? { alignItems: 'flex-start' } : {}}\n\t\t>\n\t\t\t<RadioButtonIcon\n\t\t\t\tchecked={isActive}\n\t\t\t\thovered={isHovered}\n\t\t\t\tclicked={isClicked}\n\t\t\t\tisDisabled={props.isDisabled || false}\n\t\t\t\tsize={props.size}\n\t\t\t\tstyle={props.caption ? { margin: '2px 0' } : {}}\n\t\t\t>\n\t\t\t\t<CheckMark\n\t\t\t\t\tisSmall={props.size === 'SMALL'}\n\t\t\t\t\tisActive={isActive}\n\t\t\t\t\tisDisabled={props.isDisabled || false}\n\t\t\t\t\tactiveColor={props.activeColor}\n\t\t\t\t/>\n\t\t\t</RadioButtonIcon>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\tgap: props.gapBetweenBodyAndCaption || '0px',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{renderLabel()}\n\t\t\t\t{props.caption && (\n\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\tcolor={\n\t\t\t\t\t\t\tprops.isDisabled ? COLORS.text.disabled : COLORS.text.secondary\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{props.caption}\n\t\t\t\t\t</BodyCaption>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</RadioButtonContainer>\n\t);\n};\n"],"names":["CheckMark","props","fillColor","useMemo","COLORS","strokeColor","jsxDEV","this","RadioButton","isActive","setIsActive","useState","isHovered","setIsHovered","isClicked","setIsClicked","handleCheck","newVal","useEffect","renderLabel","TitleSmall","BodyCaption","BodySecondary","BodyPrimary","Fragment","RadioButtonContainer","RadioButtonIcon"],"mappings":"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"}
+{"version":3,"file":"RadioButton.js","sources":["../../../../src/components/radioButton/RadioButton.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from 'react';\nimport {\n\tRadioButtonContainer,\n\tRadioButtonIcon,\n} from '@src/components/radioButton/RadioButton.styled';\nimport {\n\tBodyCaption,\n\tBodyPrimary,\n\tBodySecondary,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nexport type RadioButtonProps = {\n\tisActive: boolean;\n\tisDisabled?: boolean;\n\tvalue?: string;\n\tlabel?: string;\n\tcaption?: string;\n\tonValueChange: (checked: boolean, value?: string) => void;\n\tskipHoverState?: boolean;\n\tsize?: 'DEFAULT' | 'SMALL';\n\tskipSelectingOff?: boolean;\n\tlabelSize?: 'DEFAULT' | 'MEDIUM';\n\tboldOnChecked?: boolean;\n\talwaysBold?: boolean;\n\tactiveColor?: string;\n\tgapBetweenBodyAndCaption?: string;\n};\n\nconst CheckMark: React.FC<{\n\tisActive: boolean;\n\tisDisabled: boolean;\n\tisSmall: boolean;\n\tactiveColor?: string;\n}> = (props) => {\n\tconst fillColor = useMemo(\n\t\t() => props?.activeColor || COLORS.background.positive.vibrant,\n\t\t[props.activeColor],\n\t);\n\n\tconst strokeColor = useMemo(\n\t\t() =>\n\t\t\tprops.isDisabled\n\t\t\t\t? COLORS.content.inactive\n\t\t\t\t: props.isActive\n\t\t\t\t? fillColor\n\t\t\t\t: COLORS.content.primary,\n\t\t[props.isDisabled, props.isActive, fillColor],\n\t);\n\n\treturn (\n\t\t<svg\n\t\t\twidth={props.isSmall ? '16' : '20'}\n\t\t\theight={props.isSmall ? '16' : '20'}\n\t\t\tviewBox={props.isSmall ? '0 0 16 16' : '0 0 20 20'}\n\t\t\tfill=\"none\"\n\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t>\n\t\t\t<circle\n\t\t\t\tcx={props.isSmall ? '8' : '10'}\n\t\t\t\tcy={props.isSmall ? '8' : '10'}\n\t\t\t\tr={props.isSmall ? 6 : 9}\n\t\t\t\tstroke={strokeColor}\n\t\t\t\tstrokeWidth={props.isSmall ? 1.5 : 2}\n\t\t\t/>\n\t\t\t{props.isActive && (\n\t\t\t\t<circle\n\t\t\t\t\tcx={props.isSmall ? '8' : '10'}\n\t\t\t\t\tcy={props.isSmall ? '8' : '10'}\n\t\t\t\t\tr={props.isSmall ? 3 : 5}\n\t\t\t\t\tfill={props.isDisabled ? COLORS.content.inactive : fillColor}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</svg>\n\t);\n};\n\nexport const RadioButton: React.FC<RadioButtonProps> = (props) => {\n\tconst [isActive, setIsActive] = useState(props.isActive || false);\n\tconst [isHovered, setIsHovered] = useState(false);\n\tconst [isClicked, setIsClicked] = useState(false);\n\n\tconst handleCheck = () => {\n\t\tif (props.skipSelectingOff) {\n\t\t\treturn;\n\t\t}\n\t\tif (!props.isDisabled) {\n\t\t\tconst newVal = !isActive;\n\t\t\tsetIsActive(newVal);\n\t\t\tprops.onValueChange?.(newVal, props.value);\n\t\t}\n\t};\n\n\tuseEffect(() => {\n\t\tsetIsActive(props.isActive);\n\t}, [props.isActive]);\n\n\tconst renderLabel = () => {\n\t\tif (!props.label) {\n\t\t\treturn <></>;\n\t\t}\n\n\t\tif ((props.boldOnChecked && isActive) || props.alwaysBold) {\n\t\t\treturn (\n\t\t\t\t<TitleSmall\n\t\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t\t>\n\t\t\t\t\t{props.label}\n\t\t\t\t</TitleSmall>\n\t\t\t);\n\t\t}\n\n\t\tif (props.size === 'SMALL') {\n\t\t\treturn (\n\t\t\t\t<BodyCaption\n\t\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t\t>\n\t\t\t\t\t{props.label}\n\t\t\t\t</BodyCaption>\n\t\t\t);\n\t\t}\n\n\t\tif (props.labelSize === 'MEDIUM') {\n\t\t\treturn (\n\t\t\t\t<BodySecondary\n\t\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t\t>\n\t\t\t\t\t{props.label}\n\t\t\t\t</BodySecondary>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<BodyPrimary\n\t\t\t\tcolor={props.isDisabled ? COLORS.text.disabled : COLORS.text.primary}\n\t\t\t>\n\t\t\t\t{props.label}\n\t\t\t</BodyPrimary>\n\t\t);\n\t};\n\n\treturn (\n\t\t<RadioButtonContainer\n\t\t\tonClick={handleCheck}\n\t\t\tonMouseEnter={() => setIsHovered(!props.skipHoverState)}\n\t\t\tonMouseLeave={() => setIsHovered(false)}\n\t\t\tonMouseDown={() => setIsClicked(!props.skipHoverState)}\n\t\t\tonMouseUp={() => setIsClicked(false)}\n\t\t\tstyle={props.caption ? { alignItems: 'flex-start' } : {}}\n\t\t>\n\t\t\t<RadioButtonIcon\n\t\t\t\tchecked={isActive}\n\t\t\t\thovered={isHovered}\n\t\t\t\tclicked={isClicked}\n\t\t\t\tisDisabled={props.isDisabled || false}\n\t\t\t\tsize={props.size}\n\t\t\t\tstyle={props.caption ? { margin: '2px 0' } : {}}\n\t\t\t>\n\t\t\t\t<CheckMark\n\t\t\t\t\tisSmall={props.size === 'SMALL'}\n\t\t\t\t\tisActive={isActive}\n\t\t\t\t\tisDisabled={props.isDisabled || false}\n\t\t\t\t\tactiveColor={props.activeColor}\n\t\t\t\t/>\n\t\t\t</RadioButtonIcon>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\tgap: props.gapBetweenBodyAndCaption || '0px',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{renderLabel()}\n\t\t\t\t{props.caption && (\n\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\tcolor={\n\t\t\t\t\t\t\tprops.isDisabled ? COLORS.text.disabled : COLORS.text.secondary\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{props.caption}\n\t\t\t\t\t</BodyCaption>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</RadioButtonContainer>\n\t);\n};\n"],"names":["CheckMark","props","fillColor","useMemo","COLORS","strokeColor","jsxDEV","this","RadioButton","isActive","setIsActive","useState","isHovered","setIsHovered","isClicked","setIsClicked","handleCheck","newVal","useEffect","renderLabel","TitleSmall","BodyCaption","BodySecondary","BodyPrimary","Fragment","RadioButtonContainer","RadioButtonIcon"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-dev-runtime"),r=require("react"),m=require("./RadioList.styled.js"),d=require("../TypographyStyle.js"),b=require("../../constants/Theme.js"),y=require("../radioButton/RadioButton.js"),f=e=>{const[s,o]=r.useState(e.listItems);r.useEffect(()=>{o(e.listItems)},[e.listItems]);const c=(n,u)=>{let a;const l=[...s];l.forEach(t=>{t.value===u?(a=t,t.isActive=n):t.isActive=!n}),o(l),e.onChange(a)};return i.jsxDEV(m.RadioListStyled,{children:[(e.title||e.subTitle)&&i.jsxDEV("div",{className:"title__container",children:[e.title&&i.jsxDEV(d.TitleRegular,{children:e.title},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioList/RadioList.tsx",lineNumber:48,columnNumber:22},void 0),e.subTitle&&i.jsxDEV(d.BodySecondary,{color:b.COLORS.text.secondary,children:e.subTitle},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioList/RadioList.tsx",lineNumber:50,columnNumber:7},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioList/RadioList.tsx",lineNumber:47,columnNumber:5},void 0),i.jsxDEV("div",{style:e.listContainerStyles??{},className:"list__container",children:s.map(n=>i.jsxDEV(y.RadioButton,{...n,onValueChange:c,boldOnChecked:e.boldOnChecked},n.value,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioList/RadioList.tsx",lineNumber:59,columnNumber:7},void 0))},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioList/RadioList.tsx",lineNumber:56,columnNumber:4},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/radioList/RadioList.tsx",lineNumber:45,columnNumber:3},void 0)};exports.RadioList=f;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-dev-runtime"),l=require("react"),d=require("./RadioList.styled.js"),c=require("../TypographyStyle.js"),b=require("../../constants/Theme.js"),k=require("../radioButton/RadioButton.js"),v=e=>{const[n,o]=l.useState(e.listItems);l.useEffect(()=>{o(e.listItems)},[e.listItems]);const m=(t,u)=>{let r;const a=[...n];a.forEach(s=>{s.value===u?(r=s,s.isActive=t):s.isActive=!t}),o(a),e.onChange(r)};return i.jsxDEV(d.RadioListStyled,{children:[(e.title||e.subTitle)&&i.jsxDEV("div",{className:"title__container",children:[e.title&&i.jsxDEV(c.TitleRegular,{children:e.title},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioList/RadioList.tsx",lineNumber:48,columnNumber:22},void 0),e.subTitle&&i.jsxDEV(c.BodySecondary,{color:b.COLORS.text.secondary,children:e.subTitle},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioList/RadioList.tsx",lineNumber:50,columnNumber:7},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioList/RadioList.tsx",lineNumber:47,columnNumber:5},void 0),i.jsxDEV("div",{style:e.listContainerStyles??{},className:"list__container",children:n.map(t=>i.jsxDEV(k.RadioButton,{...t,onValueChange:m,boldOnChecked:e.boldOnChecked},t.value,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioList/RadioList.tsx",lineNumber:59,columnNumber:7},void 0))},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioList/RadioList.tsx",lineNumber:56,columnNumber:4},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/radioList/RadioList.tsx",lineNumber:45,columnNumber:3},void 0)};exports.RadioList=v;
 //# sourceMappingURL=RadioList.js.map

package/dist/cjs/components/radioList/RadioList.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioList.js","sources":["../../../../src/components/radioList/RadioList.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { RadioButton, RadioButtonProps } from '@src/components/radioButton';\nimport { RadioListStyled } from '@src/components/radioList/RadioList.styled';\nimport { BodySecondary, TitleRegular } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\ntype RadioListItem = Omit<RadioButtonProps, 'onValueChange'> & {\n\tvalue: string;\n};\n\nexport type RadioListProps = {\n\ttitle?: string;\n\tsubTitle?: string;\n\tlistItems: RadioListItem[];\n\tonChange: (option: RadioListItem) => void;\n\tlistContainerStyles?: React.CSSProperties;\n\tboldOnChecked?: boolean;\n};\n\nexport const RadioList: React.FC<RadioListProps> = (props) => {\n\tconst [listOptions, setListOptions] = useState<RadioListItem[]>(\n\t\tprops.listItems,\n\t);\n\n\tuseEffect(() => {\n\t\tsetListOptions(props.listItems);\n\t}, [props.listItems]);\n\n\tconst onOptionClicked = (checked: boolean, value: string | undefined) => {\n\t\tlet selectedOption;\n\t\tconst temptListOptions = [...listOptions];\n\t\ttemptListOptions.forEach((option) => {\n\t\t\tif (option.value === value) {\n\t\t\t\tselectedOption = option;\n\t\t\t\toption['isActive'] = checked;\n\t\t\t} else {\n\t\t\t\toption['isActive'] = !checked;\n\t\t\t}\n\t\t});\n\t\tsetListOptions(temptListOptions);\n\t\tprops.onChange(selectedOption);\n\t};\n\n\treturn (\n\t\t<RadioListStyled>\n\t\t\t{(props.title || props.subTitle) && (\n\t\t\t\t<div className=\"title__container\">\n\t\t\t\t\t{props.title && <TitleRegular>{props.title}</TitleRegular>}\n\t\t\t\t\t{props.subTitle && (\n\t\t\t\t\t\t<BodySecondary color={COLORS.text.secondary}>\n\t\t\t\t\t\t\t{props.subTitle}\n\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div style={props.listContainerStyles ?? {}} className=\"list__container\">\n\t\t\t\t{listOptions.map((listItem) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<RadioButton\n\t\t\t\t\t\t\tkey={listItem.value}\n\t\t\t\t\t\t\t{...listItem}\n\t\t\t\t\t\t\tonValueChange={onOptionClicked}\n\t\t\t\t\t\t\tboldOnChecked={props.boldOnChecked}\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</RadioListStyled>\n\t);\n};\n"],"names":["RadioList","props","listOptions","setListOptions","useState","useEffect","onOptionClicked","checked","value","selectedOption","temptListOptions","option","RadioListStyled","jsxDEV","TitleRegular","this","BodySecondary","COLORS","listItem","RadioButton"],"mappings":"mSAmBaA,EAAuCC,GAAU,CAC7D,KAAM,CAACC,EAAaC,CAAc,EAAIC,EAAAA,SACrCH,EAAM,SAAA,EAGPI,EAAAA,UAAU,IAAM,CACfF,EAAeF,EAAM,SAAS,CAC/B,EAAG,CAACA,EAAM,SAAS,CAAC,EAEpB,MAAMK,EAAkB,CAACC,EAAkBC,IAA8B,CACxE,IAAIC,EACJ,MAAMC,EAAmB,CAAC,GAAGR,CAAW,EACxCQ,EAAiB,QAASC,GAAW,CAChCA,EAAO,QAAUH,GACpBC,EAAiBE,EACjBA,EAAO,SAAcJ,GAErBI,EAAO,SAAc,CAACJ,CAExB,CAAC,EACDJ,EAAeO,CAAgB,EAC/BT,EAAM,SAASQ,CAAc,CAC9B,EAEA,gBACEG,kBAAA,CACE,SAAA,EAAAX,EAAM,OAASA,EAAM,WACtBY,SAAC,MAAA,CAAI,UAAU,mBACb,SAAA,CAAAZ,EAAM,OAASY,EAAAA,OAACC,eAAA,CAAc,SAAAb,EAAM,KAAA,EAArB,OAAA,GAAA,CAAA,SAAA,6FAAA,WAAA,GAAA,aAAA,EAAA,EAAAc,MAA2B,EAC1Cd,EAAM,UACNY,EAAAA,OAACG,EAAAA,cAAA,CAAc,MAAOC,EAAAA,OAAO,KAAK,UAChC,SAAAhB,EAAM,QAAA,EADR,OAAA,GAAA,CAAA,SAAA,6FAAA,WAAA,GAAA,aAAA,CAAA,EAAAc,MAEA,CAAA,CAAA,EALF,OAAA,GAAA,CAAA,SAAA,6FAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAOA,EAEDF,EAAAA,OAAC,MAAA,CAAI,MAAOZ,EAAM,qBAAuB,CAAA,EAAI,UAAU,kBACrD,SAAAC,EAAY,IAAKgB,GAEhBL,EAAAA,OAACM,EAAAA,YAAA,CAEC,GAAGD,EACJ,cAAeZ,EACf,cAAeL,EAAM,aAAA,EAHhBiB,EAAS,MADf,GAAA,CAAA,SAAA,6FAAA,WAAA,GAAA,aAAA,CAAA,EAAAH,MAAA,CAOD,CAAA,EAVF,OAAA,GAAA,CAAA,SAAA,6FAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAWA,CAAA,CAAA,EAtBD,OAAA,GAAA,CAAA,SAAA,6FAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAuBA,CAEF"}
+{"version":3,"file":"RadioList.js","sources":["../../../../src/components/radioList/RadioList.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { RadioButton, RadioButtonProps } from '@src/components/radioButton';\nimport { RadioListStyled } from '@src/components/radioList/RadioList.styled';\nimport { BodySecondary, TitleRegular } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\ntype RadioListItem = Omit<RadioButtonProps, 'onValueChange'> & {\n\tvalue: string;\n};\n\nexport type RadioListProps = {\n\ttitle?: string;\n\tsubTitle?: string;\n\tlistItems: RadioListItem[];\n\tonChange: (option: RadioListItem) => void;\n\tlistContainerStyles?: React.CSSProperties;\n\tboldOnChecked?: boolean;\n};\n\nexport const RadioList: React.FC<RadioListProps> = (props) => {\n\tconst [listOptions, setListOptions] = useState<RadioListItem[]>(\n\t\tprops.listItems,\n\t);\n\n\tuseEffect(() => {\n\t\tsetListOptions(props.listItems);\n\t}, [props.listItems]);\n\n\tconst onOptionClicked = (checked: boolean, value: string | undefined) => {\n\t\tlet selectedOption;\n\t\tconst temptListOptions = [...listOptions];\n\t\ttemptListOptions.forEach((option) => {\n\t\t\tif (option.value === value) {\n\t\t\t\tselectedOption = option;\n\t\t\t\toption['isActive'] = checked;\n\t\t\t} else {\n\t\t\t\toption['isActive'] = !checked;\n\t\t\t}\n\t\t});\n\t\tsetListOptions(temptListOptions);\n\t\tprops.onChange(selectedOption);\n\t};\n\n\treturn (\n\t\t<RadioListStyled>\n\t\t\t{(props.title || props.subTitle) && (\n\t\t\t\t<div className=\"title__container\">\n\t\t\t\t\t{props.title && <TitleRegular>{props.title}</TitleRegular>}\n\t\t\t\t\t{props.subTitle && (\n\t\t\t\t\t\t<BodySecondary color={COLORS.text.secondary}>\n\t\t\t\t\t\t\t{props.subTitle}\n\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div style={props.listContainerStyles ?? {}} className=\"list__container\">\n\t\t\t\t{listOptions.map((listItem) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<RadioButton\n\t\t\t\t\t\t\tkey={listItem.value}\n\t\t\t\t\t\t\t{...listItem}\n\t\t\t\t\t\t\tonValueChange={onOptionClicked}\n\t\t\t\t\t\t\tboldOnChecked={props.boldOnChecked}\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t</RadioListStyled>\n\t);\n};\n"],"names":["RadioList","props","listOptions","setListOptions","useState","useEffect","onOptionClicked","checked","value","selectedOption","temptListOptions","option","RadioListStyled","jsxDEV","TitleRegular","this","BodySecondary","COLORS","listItem","RadioButton"],"mappings":"mSAmBaA,EAAuCC,GAAU,CAC7D,KAAM,CAACC,EAAaC,CAAc,EAAIC,EAAAA,SACrCH,EAAM,SAAA,EAGPI,EAAAA,UAAU,IAAM,CACfF,EAAeF,EAAM,SAAS,CAC/B,EAAG,CAACA,EAAM,SAAS,CAAC,EAEpB,MAAMK,EAAkB,CAACC,EAAkBC,IAA8B,CACxE,IAAIC,EACJ,MAAMC,EAAmB,CAAC,GAAGR,CAAW,EACxCQ,EAAiB,QAASC,GAAW,CAChCA,EAAO,QAAUH,GACpBC,EAAiBE,EACjBA,EAAO,SAAcJ,GAErBI,EAAO,SAAc,CAACJ,CAExB,CAAC,EACDJ,EAAeO,CAAgB,EAC/BT,EAAM,SAASQ,CAAc,CAC9B,EAEA,gBACEG,kBAAA,CACE,SAAA,EAAAX,EAAM,OAASA,EAAM,WACtBY,SAAC,MAAA,CAAI,UAAU,mBACb,SAAA,CAAAZ,EAAM,OAASY,EAAAA,OAACC,eAAA,CAAc,SAAAb,EAAM,KAAA,EAArB,OAAA,GAAA,CAAA,SAAA,4HAAA,WAAA,GAAA,aAAA,EAAA,EAAAc,MAA2B,EAC1Cd,EAAM,UACNY,EAAAA,OAACG,EAAAA,cAAA,CAAc,MAAOC,EAAAA,OAAO,KAAK,UAChC,SAAAhB,EAAM,QAAA,EADR,OAAA,GAAA,CAAA,SAAA,4HAAA,WAAA,GAAA,aAAA,CAAA,EAAAc,MAEA,CAAA,CAAA,EALF,OAAA,GAAA,CAAA,SAAA,4HAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAOA,EAEDF,EAAAA,OAAC,MAAA,CAAI,MAAOZ,EAAM,qBAAuB,CAAA,EAAI,UAAU,kBACrD,SAAAC,EAAY,IAAKgB,GAEhBL,EAAAA,OAACM,EAAAA,YAAA,CAEC,GAAGD,EACJ,cAAeZ,EACf,cAAeL,EAAM,aAAA,EAHhBiB,EAAS,MADf,GAAA,CAAA,SAAA,4HAAA,WAAA,GAAA,aAAA,CAAA,EAAAH,MAAA,CAOD,CAAA,EAVF,OAAA,GAAA,CAAA,SAAA,4HAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAWA,CAAA,CAAA,EAtBD,OAAA,GAAA,CAAA,SAAA,4HAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAuBA,CAEF"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-dev-runtime"),m=require("react"),c=require("../../utils/resizeImage.js"),u=require("../shimmer/ShimmerComponent/BikShimmer.js"),d=({imageUrl:s,targetSize:e,alt:t,style:a})=>{const[n,r]=m.useState("");return m.useEffect(()=>{c.resizeImage(s,e).then(i=>{r(i)}).catch(i=>{r(s)})},[s,e]),n?o.jsxDEV("img",{alt:t,src:n,height:e,width:e,style:a},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/resizeImage/index.tsx",lineNumber:44,columnNumber:3},void 0):o.jsxDEV(u.BikShimmer,{boxes:[{marginTop:"0px",height:`${e}px`,width:`${e}px`}]},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/resizeImage/index.tsx",lineNumber:32,columnNumber:4},void 0)};exports.ResizableImage=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-dev-runtime"),m=require("react"),c=require("../../utils/resizeImage.js"),u=require("../shimmer/ShimmerComponent/BikShimmer.js"),b=({imageUrl:s,targetSize:e,alt:t,style:a})=>{const[r,i]=m.useState("");return m.useEffect(()=>{c.resizeImage(s,e).then(n=>{i(n)}).catch(n=>{i(s)})},[s,e]),r?o.jsxDEV("img",{alt:t,src:r,height:e,width:e,style:a},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/resizeImage/index.tsx",lineNumber:44,columnNumber:3},void 0):o.jsxDEV(u.BikShimmer,{boxes:[{marginTop:"0px",height:`${e}px`,width:`${e}px`}]},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/resizeImage/index.tsx",lineNumber:32,columnNumber:4},void 0)};exports.ResizableImage=b;
 //# sourceMappingURL=index.js.map

package/dist/cjs/components/resizeImage/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/resizeImage/index.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { BikShimmer } from '@src/components/shimmer';\nimport { resizeImage } from '@src/utils/resizeImage';\n\nexport interface ResizableImageProps {\n\timageUrl: string;\n\ttargetSize: number;\n\talt?: string;\n\tstyle?: React.CSSProperties;\n}\n\nexport const ResizableImage: React.FC<ResizableImageProps> = ({\n\timageUrl,\n\ttargetSize,\n\talt,\n\tstyle,\n}) => {\n\tconst [resizedImageUrl, setResizedImageUrl] = useState('');\n\n\tuseEffect(() => {\n\t\tresizeImage(imageUrl, targetSize)\n\t\t\t.then((resizedImage) => {\n\t\t\t\tsetResizedImageUrl(resizedImage);\n\t\t\t})\n\t\t\t.catch((error) => {\n\t\t\t\tsetResizedImageUrl(imageUrl);\n\t\t\t});\n\t}, [imageUrl, targetSize]);\n\n\tif (!resizedImageUrl)\n\t\treturn (\n\t\t\t<BikShimmer\n\t\t\t\tboxes={[\n\t\t\t\t\t{\n\t\t\t\t\t\tmarginTop: '0px',\n\t\t\t\t\t\theight: `${targetSize}px`,\n\t\t\t\t\t\twidth: `${targetSize}px`,\n\t\t\t\t\t},\n\t\t\t\t]}\n\t\t\t/>\n\t\t);\n\n\treturn (\n\t\t<img\n\t\t\talt={alt}\n\t\t\tsrc={resizedImageUrl}\n\t\t\theight={targetSize}\n\t\t\twidth={targetSize}\n\t\t\tstyle={style}\n\t\t/>\n\t);\n};\n"],"names":["ResizableImage","imageUrl","targetSize","alt","style","resizedImageUrl","setResizedImageUrl","useState","useEffect","resizeImage","resizedImage","error","jsxDEV","this","BikShimmer"],"mappings":"2OAWaA,EAAgD,CAAC,CAC7D,SAAAC,EACA,WAAAC,EACA,IAAAC,EACA,MAAAC,CACD,IAAM,CACL,KAAM,CAACC,EAAiBC,CAAkB,EAAIC,EAAAA,SAAS,EAAE,EAYzD,OAVAC,EAAAA,UAAU,IAAM,CACfC,EAAAA,YAAYR,EAAUC,CAAU,EAC9B,KAAMQ,GAAiB,CACvBJ,EAAmBI,CAAY,CAChC,CAAC,EACA,MAAOC,GAAU,CACjBL,EAAmBL,CAAQ,CAC5B,CAAC,CACH,EAAG,CAACA,EAAUC,CAAU,CAAC,EAEpBG,EAcJO,EAAAA,OAAC,MAAA,CACA,IAAAT,EACA,IAAKE,EACL,OAAQH,EACR,MAAOA,EACP,MAAAE,CAAA,EALD,OAAA,GAAA,CAAA,SAAA,2FAAA,WAAA,GAAA,aAAA,CAAA,EAAAS,MAAA,EAZCD,EAAAA,OAACE,EAAAA,WAAA,CACA,MAAO,CACN,CACC,UAAW,MACX,OAAQ,GAAGZ,CAAU,KACrB,MAAO,GAAGA,CAAU,IAAA,CACrB,CACD,EAPD,OAAA,GAAA,CAAA,SAAA,2FAAA,WAAA,GAAA,aAAA,CAAA,EAAAW,MAAA,CAoBH"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/resizeImage/index.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { BikShimmer } from '@src/components/shimmer';\nimport { resizeImage } from '@src/utils/resizeImage';\n\nexport interface ResizableImageProps {\n\timageUrl: string;\n\ttargetSize: number;\n\talt?: string;\n\tstyle?: React.CSSProperties;\n}\n\nexport const ResizableImage: React.FC<ResizableImageProps> = ({\n\timageUrl,\n\ttargetSize,\n\talt,\n\tstyle,\n}) => {\n\tconst [resizedImageUrl, setResizedImageUrl] = useState('');\n\n\tuseEffect(() => {\n\t\tresizeImage(imageUrl, targetSize)\n\t\t\t.then((resizedImage) => {\n\t\t\t\tsetResizedImageUrl(resizedImage);\n\t\t\t})\n\t\t\t.catch((error) => {\n\t\t\t\tsetResizedImageUrl(imageUrl);\n\t\t\t});\n\t}, [imageUrl, targetSize]);\n\n\tif (!resizedImageUrl)\n\t\treturn (\n\t\t\t<BikShimmer\n\t\t\t\tboxes={[\n\t\t\t\t\t{\n\t\t\t\t\t\tmarginTop: '0px',\n\t\t\t\t\t\theight: `${targetSize}px`,\n\t\t\t\t\t\twidth: `${targetSize}px`,\n\t\t\t\t\t},\n\t\t\t\t]}\n\t\t\t/>\n\t\t);\n\n\treturn (\n\t\t<img\n\t\t\talt={alt}\n\t\t\tsrc={resizedImageUrl}\n\t\t\theight={targetSize}\n\t\t\twidth={targetSize}\n\t\t\tstyle={style}\n\t\t/>\n\t);\n};\n"],"names":["ResizableImage","imageUrl","targetSize","alt","style","resizedImageUrl","setResizedImageUrl","useState","useEffect","resizeImage","resizedImage","error","jsxDEV","this","BikShimmer"],"mappings":"2OAWaA,EAAgD,CAAC,CAC7D,SAAAC,EACA,WAAAC,EACA,IAAAC,EACA,MAAAC,CACD,IAAM,CACL,KAAM,CAACC,EAAiBC,CAAkB,EAAIC,EAAAA,SAAS,EAAE,EAYzD,OAVAC,EAAAA,UAAU,IAAM,CACfC,EAAAA,YAAYR,EAAUC,CAAU,EAC9B,KAAMQ,GAAiB,CACvBJ,EAAmBI,CAAY,CAChC,CAAC,EACA,MAAOC,GAAU,CACjBL,EAAmBL,CAAQ,CAC5B,CAAC,CACH,EAAG,CAACA,EAAUC,CAAU,CAAC,EAEpBG,EAcJO,EAAAA,OAAC,MAAA,CACA,IAAAT,EACA,IAAKE,EACL,OAAQH,EACR,MAAOA,EACP,MAAAE,CAAA,EALD,OAAA,GAAA,CAAA,SAAA,0HAAA,WAAA,GAAA,aAAA,CAAA,EAAAS,MAAA,EAZCD,EAAAA,OAACE,EAAAA,WAAA,CACA,MAAO,CACN,CACC,UAAW,MACX,OAAQ,GAAGZ,CAAU,KACrB,MAAO,GAAGA,CAAU,IAAA,CACrB,CACD,EAPD,OAAA,GAAA,CAAA,SAAA,0HAAA,WAAA,GAAA,aAAA,CAAA,EAAAW,MAAA,CAoBH"}