npm - @bikdotai/bik-component-library - Versions diffs - 0.0.817-beta.4 → 0.0.817-beta.6 - Mend

@bikdotai/bik-component-library 0.0.817-beta.4 → 0.0.817-beta.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1802) hide show

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

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

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

	@@ -1 +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":"8hBA8CaA,EAAuBC,GAAgC,CACnE,KAAM,CAAE,KAAAC,EAAM,4BAAAC,EAA6B,iBAAAC,CAAA,EAAqBH,EAE1DI,EAAiB,IAAM,CAC5B,IAAIC,EAEJ,OAAIJ,EAAK,KAAK,SAASA,EAAK,WAAW,EACtCI,EAAcJ,EAAK,KAEnBI,EAAc,GAAGJ,EAAK,WAAW,IAAIA,EAAK,IAAI,GAGxCI,CACR,EAEM,CAAE,wBAAAC,EAAyB,QAAAC,EAAS,QAAAC,CAAA,EACzCC,EAAAA,cAAc,2BAA2BR,EAAM,GAAME,CAAgB,EAEhEO,EAAmB,GACxBT,EAAK,SAAWU,EAAAA,gBAAgBV,EAAK,QAAQ,GAAK,GAAK,EACxD,GAAGA,EAAK,OAASA,EAAK,aAAe,EAAE,GAIjCW,EAASX,EAAwB,MAEvC,OACCY,EAAAA,OAACC,uBAAA,CACA,SAAAD,EAAAA,OAAC,MAAA,CAAI,UAAU,iBACd,SAAA,CAAAA,EAAAA,OAACE,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOC,EAAAA,OAAO,QAAQ,WAAA,EAHvB,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAA,WAKC,MAAA,CACA,SAAAJ,EAAAA,OAACK,EAAAA,aAAA,CAEA,MAAO,GACP,OAAQ,GACR,SAAUjB,EAAK,MACf,IAAI,OACJ,aAAc,CAAA,EALTA,EAAK,UADX,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAgB,MAAA,CAOA,EARD,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAA,MASA,EACAJ,EAAAA,OAAC,MAAA,CAAI,UAAU,iBACd,SAAA,CAAAA,EAAAA,OAAC,MAAA,CAAI,UAAU,oBACd,SAAA,CAAAA,EAAAA,OAACM,EAAAA,QAAA,CACA,KAAMf,EAAA,EACN,UAAW,SACX,MAAO,IACP,QAAQ,QAER,SAAAS,EAAAA,OAACO,EAAAA,WAAA,CACA,cAAe,EACf,MAAO,CACN,KAAM,EACN,SAAU,CAAA,EAGV,SAAAhB,EAAA,CAAe,EAPjB,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAa,MAAA,CAQA,EAdD,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA,WAiBCI,EAAAA,YAAA,CACA,SAAA,CAAAR,EAAAA,OAACS,EAAAA,iBAAA,CACA,UAAW,GACX,KAAMhB,EACN,QAAAC,EACA,QAAAC,CAAA,EAJD,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAS,MAAA,EAMAJ,EAAAA,OAACU,EAAAA,WAAA,CACA,KAAM,IACLV,EAAAA,OAACW,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOR,EAAAA,OAAO,QAAQ,WAAA,EAHvB,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,IAAA,aAAA,EAAA,EAAAC,MAAA,EAMD,QAAS,IAAM,CACdf,GACCA,EAA4B,CAC3B,KAAM,oBACN,KAAM,CACL,UAAWD,EAAK,UAChB,UAAWA,EAAK,UAChB,aAAcA,EAAK,YAAA,CACpB,CACA,EAEFD,EAAM,UAAYA,EAAM,SAAA,CACzB,CAAA,EApBD,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAiB,MAAA,CAqBA,CAAA,EA5BD,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAA,MA6BA,CAAA,CAAA,EA/CD,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAA,MAgDA,WACCQ,EAAAA,gBAAA,CACA,SAAA,CAAAZ,EAAAA,OAACa,EAAAA,YAAA,CAAY,MAAOV,EAAAA,OAAO,QAAQ,UAEjC,UAAEV,GAA4C,UAAYC,EACxD,KACAG,CAAA,EAJJ,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAO,MAKA,EACCL,GACAC,EAAAA,OAACM,EAAAA,QAAA,CAAQ,KAAMP,EAAO,UAAU,MAC/B,SAAAC,EAAAA,OAACc,EAAAA,WAAA,CACA,SAAAd,EAAAA,OAACe,mBAAA,CAAkB,SAAA,WAAWhB,CAAK,EAAA,EAAnC,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,IAAA,aAAA,EAAA,EAAAK,MAAsC,CAAA,EADvC,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAA,MAEA,CAAA,EAHD,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAA,MAIA,CAAA,CAAA,EAZF,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAA,MAcA,CAAA,CAAA,EAhED,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAA,MAiEA,CAAA,CAAA,EAjFD,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAA,MAkFA,CAAA,EAnFD,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAA,MAoFA,CAEF,EAMaY,EAAuB7B,GAAgC,CACnE,KAAM,CAAE,KAAAC,GAASD,EAEjB,gBACE8B,EAAAA,qBAAA,CACA,SAAAjB,EAAAA,OAACM,EAAAA,QAAA,CACA,KAAMlB,EAAK,KACX,cAAe,GACf,QAAQ,OACR,UAAW,SAEX,SAAAY,EAAAA,OAACK,EAAAA,aAAA,CACA,MAAO,GACP,OAAQ,GACR,SAAUjB,EAAK,MACf,IAAI,OACJ,aAAc,CAAA,EALf,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAgB,MAAA,CAMA,EAZD,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAA,MAAA,CAaA,EAdD,OAAA,GAAA,CAAA,SAAA,~~mGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAA,MAeA,CAEF"}
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":"8hBA8CaA,EAAuBC,GAAgC,CACnE,KAAM,CAAE,KAAAC,EAAM,4BAAAC,EAA6B,iBAAAC,CAAA,EAAqBH,EAE1DI,EAAiB,IAAM,CAC5B,IAAIC,EAEJ,OAAIJ,EAAK,KAAK,SAASA,EAAK,WAAW,EACtCI,EAAcJ,EAAK,KAEnBI,EAAc,GAAGJ,EAAK,WAAW,IAAIA,EAAK,IAAI,GAGxCI,CACR,EAEM,CAAE,wBAAAC,EAAyB,QAAAC,EAAS,QAAAC,CAAA,EACzCC,EAAAA,cAAc,2BAA2BR,EAAM,GAAME,CAAgB,EAEhEO,EAAmB,GACxBT,EAAK,SAAWU,EAAAA,gBAAgBV,EAAK,QAAQ,GAAK,GAAK,EACxD,GAAGA,EAAK,OAASA,EAAK,aAAe,EAAE,GAIjCW,EAASX,EAAwB,MAEvC,OACCY,EAAAA,OAACC,uBAAA,CACA,SAAAD,EAAAA,OAAC,MAAA,CAAI,UAAU,iBACd,SAAA,CAAAA,EAAAA,OAACE,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOC,EAAAA,OAAO,QAAQ,WAAA,EAHvB,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAA,WAKC,MAAA,CACA,SAAAJ,EAAAA,OAACK,EAAAA,aAAA,CAEA,MAAO,GACP,OAAQ,GACR,SAAUjB,EAAK,MACf,IAAI,OACJ,aAAc,CAAA,EALTA,EAAK,UADX,GAAA,CAAA,SAAA,oGAAA,WAAA,GAAA,aAAA,CAAA,EAAAgB,MAAA,CAOA,EARD,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MASA,EACAJ,EAAAA,OAAC,MAAA,CAAI,UAAU,iBACd,SAAA,CAAAA,EAAAA,OAAC,MAAA,CAAI,UAAU,oBACd,SAAA,CAAAA,EAAAA,OAACM,EAAAA,QAAA,CACA,KAAMf,EAAA,EACN,UAAW,SACX,MAAO,IACP,QAAQ,QAER,SAAAS,EAAAA,OAACO,EAAAA,WAAA,CACA,cAAe,EACf,MAAO,CACN,KAAM,EACN,SAAU,CAAA,EAGV,SAAAhB,EAAA,CAAe,EAPjB,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,GAAA,aAAA,CAAA,EAAAa,MAAA,CAQA,EAdD,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA,WAiBCI,EAAAA,YAAA,CACA,SAAA,CAAAR,EAAAA,OAACS,EAAAA,iBAAA,CACA,UAAW,GACX,KAAMhB,EACN,QAAAC,EACA,QAAAC,CAAA,EAJD,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,IAAA,aAAA,CAAA,EAAAS,MAAA,EAMAJ,EAAAA,OAACU,EAAAA,WAAA,CACA,KAAM,IACLV,EAAAA,OAACW,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOR,EAAAA,OAAO,QAAQ,WAAA,EAHvB,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,IAAA,aAAA,EAAA,EAAAC,MAAA,EAMD,QAAS,IAAM,CACdf,GACCA,EAA4B,CAC3B,KAAM,oBACN,KAAM,CACL,UAAWD,EAAK,UAChB,UAAWA,EAAK,UAChB,aAAcA,EAAK,YAAA,CACpB,CACA,EAEFD,EAAM,UAAYA,EAAM,SAAA,CACzB,CAAA,EApBD,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,IAAA,aAAA,CAAA,EAAAiB,MAAA,CAqBA,CAAA,EA5BD,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,IAAA,aAAA,CAAA,EAAAA,MA6BA,CAAA,CAAA,EA/CD,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAgDA,WACCQ,EAAAA,gBAAA,CACA,SAAA,CAAAZ,EAAAA,OAACa,EAAAA,YAAA,CAAY,MAAOV,EAAAA,OAAO,QAAQ,UAEjC,UAAEV,GAA4C,UAAYC,EACxD,KACAG,CAAA,EAJJ,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,IAAA,aAAA,CAAA,EAAAO,MAKA,EACCL,GACAC,EAAAA,OAACM,EAAAA,QAAA,CAAQ,KAAMP,EAAO,UAAU,MAC/B,SAAAC,EAAAA,OAACc,EAAAA,WAAA,CACA,SAAAd,EAAAA,OAACe,mBAAA,CAAkB,SAAA,WAAWhB,CAAK,EAAA,EAAnC,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,IAAA,aAAA,EAAA,EAAAK,MAAsC,CAAA,EADvC,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,IAAA,aAAA,CAAA,EAAAA,MAEA,CAAA,EAHD,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,IAAA,aAAA,CAAA,EAAAA,MAIA,CAAA,CAAA,EAZF,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,IAAA,aAAA,CAAA,EAAAA,MAcA,CAAA,CAAA,EAhED,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAiEA,CAAA,CAAA,EAjFD,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAkFA,CAAA,EAnFD,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAoFA,CAEF,EAMaY,EAAuB7B,GAAgC,CACnE,KAAM,CAAE,KAAAC,GAASD,EAEjB,gBACE8B,EAAAA,qBAAA,CACA,SAAAjB,EAAAA,OAACM,EAAAA,QAAA,CACA,KAAMlB,EAAK,KACX,cAAe,GACf,QAAQ,OACR,UAAW,SAEX,SAAAY,EAAAA,OAACK,EAAAA,aAAA,CACA,MAAO,GACP,OAAQ,GACR,SAAUjB,EAAK,MACf,IAAI,OACJ,aAAc,CAAA,EALf,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,IAAA,aAAA,CAAA,EAAAgB,MAAA,CAMA,EAZD,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,IAAA,aAAA,CAAA,EAAAA,MAAA,CAaA,EAdD,OAAA,GAAA,CAAA,SAAA,oGAAA,WAAA,IAAA,aAAA,CAAA,EAAAA,MAeA,CAEF"}

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

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

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

	@@ -1 +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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"}
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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"}

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

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

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

	@@ -1 +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"}
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,2GAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAsC,EACtCD,SAAC,OAAA,CAAK,OAAO,OAAO,UAAU,SAAA,EAA9B,OAAA,GAAA,CAAA,SAAA,2GAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAwC,CAAA,CAAA,EAFzC,OAAA,GAAA,CAAA,SAAA,2GAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAGA,CAAA,EAJD,OAAA,GAAA,CAAA,SAAA,2GAAA,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,2GAAA,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,2GAAA,WAAA,GAAA,aAAA,CAAA,EAAAS,MAAA,EAeAD,EAAAA,OAACE,EAAAA,QAAA,CACA,EAAGV,EAAQ,EAAIO,EAAiB,EAChC,MAAOA,CAAA,EAFR,OAAA,GAAA,CAAA,SAAA,2GAAA,WAAA,GAAA,aAAA,CAAA,EAAAE,MAAA,CAGA,CAAA,EApCD,OAAA,GAAA,CAAA,SAAA,2GAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAqCA,CAAA,EAtCD,OAAA,GAAA,CAAA,SAAA,2GAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAuCA,CAEF"}

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

@@ -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"),n=require("styled-components"),s=require("../../constants/Theme.js"),a=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},c=a(n),i=e=>r.jsxDEV(o,{color:e.color?e.color:s.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/prateekchouhan/Projects/bik-component-library/src/components/progress-bar/ProgressBarComponent.tsx",lineNumber:17,columnNumber:4},void 0)},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/progress-bar/ProgressBarComponent.tsx",lineNumber:14,columnNumber:3},void 0),o=c.default.div`
 	flex: 50%;
 	.progress-bar {
 		background: ${e=>e.color};
 	}
-`;exports.ProgressBarComponent=l;exports.ProgressCompletedBar=r;
+`;exports.ProgressBarComponent=i;exports.ProgressCompletedBar=o;
 //# sourceMappingURL=ProgressBarComponent.js.map

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

	@@ -1 +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"}
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,4GAAA,WAAA,GAAA,aAAA,CAAA,EAAAK,MAAA,CAIA,EAPD,OAAA,GAAA,CAAA,SAAA,4GAAA,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 CHANGED Viewed

@@ -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 n=require("react/jsx-dev-runtime"),f=require("styled-components"),u=require("../TypographyStyle.js"),o=require("../../constants/Theme.js"),v=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},t=v(f);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 k=e=>{const{type:g,progress:s,progressBarThickness:a,size:i,color:c,text:d,textPosition:p,showProgress:l,matchParentWidth:h=!1}=e;let r=p;return r||(r="left"),n.jsxDEV(x,{alignment:r,children:[l&&(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:d??`${s}% completed...`},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:52,columnNumber:6},void 0),g==="line"?n.jsxDEV(P,{size:i,progressBarThickness:a,matchParentWidth:h,children:n.jsxDEV(B,{progress:s,color:c},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:68,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:63,columnNumber:5},void 0):n.jsxDEV(y,{progress:s,color:c,size:i,children:n.jsxDEV(N,{progress:s,size:i,progressBarThickness:a},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:72,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:71,columnNumber:5},void 0),l&&(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:d??`${s}% completed...`},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:82,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/progress-bar-v2/ProgressBarV2.tsx",lineNumber:48,columnNumber:3},void 0)},x=t.default.div`
 	display: flex;
 	flex-direction: ${e=>e?.alignment==="top"||e?.alignment==="bottom"?"column":"row"};
 	align-items: center;
 	width: 100%;
-`,k=i.default.div`
+`,y=t.default.div`
 	width: ${e=>e.size??32}px;
 	height: ${e=>e.size??32}px;
 	border-radius: 50%;
@@ -14,7 +14,7 @@
 		${o.COLORS.content.inactive} 0deg
 	);
 	position: relative;
-`,N=i.default.div`
+`,N=t.default.div`
 	background-color: ${o.COLORS.background.inactive};
 	transition: width 0.3s ease-in-out;
 	position: absolute;
@@ -25,16 +25,16 @@
 	height: ${e=>e.progressBarThickness?e.size??32-e.progressBarThickness:20}px;
 	border-radius: 50%;
 	background: ${o.COLORS.surface.standard};
-`,B=i.default.div`
+`,P=t.default.div`
 	width: ${e=>e.matchParentWidth?"100%":`${e.size??90}px`};
 	height: ${e=>e.progressBarThickness??8}px;
 	background-color: ${o.COLORS.background.inactive};
 	border-radius: 4px;
 	overflow: hidden;
-`,O=i.default.div`
+`,B=t.default.div`
 	height: 100%;
 	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=m;
 //# sourceMappingURL=ProgressBarV2.js.map

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

	@@ -1 +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":"gSAIO,IAAKA,GAAAA,IACXA,EAAA,MAAQ,QACRA,EAAA,KAAO,OACPA,EAAA,IAAM,MACNA,EAAA,OAAS,SAJEA,IAAAA,GAAA,CAAA,CAAA,EAOAC,GAAAA,IACXA,EAAA,OAAS,SACTA,EAAA,KAAO,OAFIA,IAAAA,GAAA,CAAA,CAAA,EAiBL,MAAMC,EAAiBC,GAA8B,CAC3D,KAAM,CACL,KAAAC,EACA,SAAAC,EACA,qBAAAC,EACA,KAAAC,EACA,MAAAC,EACA,KAAAC,EACA,aAAAC,EACA,aAAAC,EACA,iBAAAC,EAAmB,EAAA,EAChBT,EAEJ,IAAIU,EAAYH,EAChB,OAAKG,IACJA,EAAY,QAIZC,SAACC,GAAc,UAAAF,EACb,SAAA,CAAAF,IACCE,IAAc,OACdA,IAAc,SACdC,EAAAA,OAACE,EAAAA,SAAA,CACA,MAAO,CACN,aAAcH,IAAc,MAAoB,MAAQ,OACxD,YAAaA,IAAc,OAAqB,MAAQ,MAAA,EAEzD,MAAOI,EAAAA,OAAO,QAAQ,UAErB,SAAAR,GAAQ,GAAGJ,CAAQ,gBAAA,EAPrB,OAAA,GAAA,CAAA,SAAA,~~uGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAa,MAAA,EAUDd,IAAS,OACTU,EAAAA,OAACK,EAAA,CACA,KAAAZ,EACA,qBAAAD,EACA,iBAAAM,EAEA,SAAAE,EAAAA,OAACM,EAAA,CAAkB,SAAAf,EAAoB,MAAAG,CAAA,EAAvC,OAAA,GAAA,CAAA,SAAA,~~uGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAU,MAAqD,CAAA,EALtD,OAAA,GAAA,CAAA,SAAA,~~uGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA,EAQAJ,EAAAA,OAACO,EAAA,CAAgB,SAAAhB,EAAoB,MAAAG,EAAc,KAAAD,EAClD,SAAAO,EAAAA,OAACQ,EAAA,CACA,SAAAjB,EACA,KAAAE,EACA,qBAAAD,CAAA,EAHD,OAAA,GAAA,CAAA,SAAA,~~uGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAY,MAAA,CAIA,EALD,OAAA,GAAA,CAAA,SAAA,~~uGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAA,MAMA,EAEAP,IACCE,IAAc,UACdA,IAAc,UACdC,EAAAA,OAACE,EAAAA,SAAA,CACA,MAAO,CACN,UAAWH,IAAc,SAAuB,MAAQ,OACxD,WAAYA,IAAc,QAAsB,MAAQ,MAAA,EAEzD,MAAOI,EAAAA,OAAO,QAAQ,UAErB,SAAAR,GAAQ,GAAGJ,CAAQ,gBAAA,EAPrB,OAAA,GAAA,CAAA,SAAA,~~uGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAa,MAAA,CAQA,CAAA,EA1CH,OAAA,GAAA,CAAA,SAAA,~~uGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAA,MA4CA,CAEF,EAEMH,EAAgBQ,EAAAA,QAAO;AAAA;AAAA,mBAETpB,GAClBA,GAAO,YAAc,OACrBA,GAAO,YAAc,SAClB,SACA,KAAK;AAAA;AAAA;AAAA,EAKJkB,EAAkBE,EAAAA,QAAO;AAAA,UAKpBpB,GAAUA,EAAM,MAAQ,EAAE;AAAA,WACzBA,GAAUA,EAAM,MAAQ,EAAE;AAAA;AAAA;AAAA;AAAA,IAIjCA,GAAUA,EAAM,OAASc,EAAAA,OAAO,WAAW,KAAK;AAAA,KAC/Cd,GAAUA,EAAM,SAAW,GAAG;AAAA,IAChCc,EAAAA,OAAO,QAAQ,QAAQ;AAAA;AAAA;AAAA,EAKrBK,EAAuBC,EAAAA,QAAO;AAAA,qBAKfN,EAAAA,OAAO,WAAW,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAMpCd,GACTA,EAAM,qBACHA,EAAM,MAAQ,GAAKA,EAAM,qBACzB,EAAE;AAAA,WACKA,GACVA,EAAM,qBACHA,EAAM,MAAQ,GAAKA,EAAM,qBACzB,EAAE;AAAA;AAAA,eAEQc,EAAAA,OAAO,QAAQ,QAAQ;AAAA,EAGhCE,EAAeI,EAAAA,QAAO;AAAA,UAKjBpB,GACTA,EAAM,iBAAmB,OAAS,GAAGA,EAAM,MAAQ,EAAE,IAAI;AAAA,WAC/CA,GAAUA,EAAM,sBAAwB,CAAC;AAAA,qBAChCc,EAAAA,OAAO,WAAW,QAAQ;AAAA;AAAA;AAAA,EAKzCG,EAAoBG,EAAAA,QAAO;AAAA;AAAA,UAKtBpB,GAAUA,EAAM,QAAQ;AAAA,qBACbA,GAAUA,EAAM,OAASc,EAAAA,OAAO,WAAW,KAAK;AAAA;AAAA"}
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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"}

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

@@ -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 t=require("react/jsx-dev-runtime"),o=require("react"),d=require("./RadioButton.styled.js"),a=require("../TypographyStyle.js"),i=require("../../constants/Theme.js"),h=e=>{const n=o.useMemo(()=>e?.activeColor||i.COLORS.background.positive.vibrant,[e.activeColor]),l=o.useMemo(()=>e.isDisabled?i.COLORS.content.inactive:e.isActive?n:i.COLORS.content.primary,[e.isDisabled,e.isActive,n]);return t.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:[t.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/prateekchouhan/Projects/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:60,columnNumber:4},void 0),e.isActive&&t.jsxDEV("circle",{cx:e.isSmall?"8":"10",cy:e.isSmall?"8":"10",r:e.isSmall?3:5,fill:e.isDisabled?i.COLORS.content.inactive:n},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:68,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:53,columnNumber:3},void 0)},x=e=>{const[n,l]=o.useState(e.isActive||!1),[u,s]=o.useState(!1),[m,r]=o.useState(!1),b=()=>{if(!e.skipSelectingOff&&!e.isDisabled){const c=!n;l(c),e.onValueChange?.(c,e.value)}};o.useEffect(()=>{l(e.isActive)},[e.isActive]);const f=()=>e.label?e.boldOnChecked&&n||e.alwaysBold?t.jsxDEV(a.TitleSmall,{color:e.isDisabled?i.COLORS.text.disabled:i.COLORS.text.primary,children:e.label},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:106,columnNumber:5},void 0):e.size==="SMALL"?t.jsxDEV(a.BodyCaption,{color:e.isDisabled?i.COLORS.text.disabled:i.COLORS.text.primary,children:e.label},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:116,columnNumber:5},void 0):e.labelSize==="MEDIUM"?t.jsxDEV(a.BodySecondary,{color:e.isDisabled?i.COLORS.text.disabled:i.COLORS.text.primary,children:e.label},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:126,columnNumber:5},void 0):t.jsxDEV(a.BodyPrimary,{color:e.isDisabled?i.COLORS.text.disabled:i.COLORS.text.primary,children:e.label},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:135,columnNumber:4},void 0):t.jsxDEV(t.Fragment,{},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:101,columnNumber:11},void 0);return t.jsxDEV(d.RadioButtonContainer,{onClick:b,onMouseEnter:()=>s(!e.skipHoverState),onMouseLeave:()=>s(!1),onMouseDown:()=>r(!e.skipHoverState),onMouseUp:()=>r(!1),style:e.caption?{alignItems:"flex-start"}:{},children:[t.jsxDEV(d.RadioButtonIcon,{checked:n,hovered:u,clicked:m,isDisabled:e.isDisabled||!1,size:e.size,style:e.caption?{margin:"2px 0"}:{},children:t.jsxDEV(h,{isSmall:e.size==="SMALL",isActive:n,isDisabled:e.isDisabled||!1,activeColor:e.activeColor},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:160,columnNumber:5},void 0)},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:152,columnNumber:4},void 0),t.jsxDEV("div",{style:{display:"flex",flexDirection:"column",gap:e.gapBetweenBodyAndCaption||"0px"},children:[f(),e.caption&&t.jsxDEV(a.BodyCaption,{color:e.isDisabled?i.COLORS.text.disabled:i.COLORS.text.secondary,children:e.caption},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:176,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:167,columnNumber:4},void 0)]},void 0,!0,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/radioButton/RadioButton.tsx",lineNumber:144,columnNumber:3},void 0)};exports.RadioButton=x;
 //# sourceMappingURL=RadioButton.js.map

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

	@@ -1 +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":"0PA8BMA,EAKAC,GAAU,CACf,MAAMC,EAAYC,EAAAA,QACjB,IAAMF,GAAO,aAAeG,EAAAA,OAAO,WAAW,SAAS,QACvD,CAACH,EAAM,WAAW,CAAA,EAGbI,EAAcF,EAAAA,QACnB,IACCF,EAAM,WACHG,EAAAA,OAAO,QAAQ,SACfH,EAAM,SACNC,EACAE,EAAAA,OAAO,QAAQ,QACnB,CAACH,EAAM,WAAYA,EAAM,SAAUC,CAAS,CAAA,EAG7C,OACCI,EAAAA,OAAC,MAAA,CACA,MAAOL,EAAM,QAAU,KAAO,KAC9B,OAAQA,EAAM,QAAU,KAAO,KAC/B,QAASA,EAAM,QAAU,YAAc,YACvC,KAAK,OACL,MAAM,6BAEN,SAAA,CAAAK,EAAAA,OAAC,SAAA,CACA,GAAIL,EAAM,QAAU,IAAM,KAC1B,GAAIA,EAAM,QAAU,IAAM,KAC1B,EAAGA,EAAM,QAAU,EAAI,EACvB,OAAQI,EACR,YAAaJ,EAAM,QAAU,IAAM,CAAA,EALpC,OAAA,GAAA,CAAA,SAAA,~~iGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAM,MAAA,EAOCN,EAAM,UACNK,EAAAA,OAAC,SAAA,CACA,GAAIL,EAAM,QAAU,IAAM,KAC1B,GAAIA,EAAM,QAAU,IAAM,KAC1B,EAAGA,EAAM,QAAU,EAAI,EACvB,KAAMA,EAAM,WAAaG,EAAAA,OAAO,QAAQ,SAAWF,CAAA,EAJpD,OAAA,GAAA,CAAA,SAAA,~~iGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAK,MAAA,CAKA,CAAA,EApBF,OAAA,GAAA,CAAA,SAAA,~~iGAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA,CAwBF,EAEaC,EAA2CP,GAAU,CACjE,KAAM,CAACQ,EAAUC,CAAW,EAAIC,EAAAA,SAASV,EAAM,UAAY,EAAK,EAC1D,CAACW,EAAWC,CAAY,EAAIF,EAAAA,SAAS,EAAK,EAC1C,CAACG,EAAWC,CAAY,EAAIJ,EAAAA,SAAS,EAAK,EAE1CK,EAAc,IAAM,CACzB,GAAI,CAAAf,EAAM,kBAGN,CAACA,EAAM,WAAY,CACtB,MAAMgB,EAAS,CAACR,EAChBC,EAAYO,CAAM,EAClBhB,EAAM,gBAAgBgB,EAAQhB,EAAM,KAAK,CAC1C,CACD,EAEAiB,EAAAA,UAAU,IAAM,CACfR,EAAYT,EAAM,QAAQ,CAC3B,EAAG,CAACA,EAAM,QAAQ,CAAC,EAEnB,MAAMkB,EAAc,IACdlB,EAAM,MAINA,EAAM,eAAiBQ,GAAaR,EAAM,WAE7CK,EAAAA,OAACc,EAAAA,WAAA,CACA,MAAOnB,EAAM,WAAaG,EAAAA,OAAO,KAAK,SAAWA,EAAAA,OAAO,KAAK,QAE5D,SAAAH,EAAM,KAAA,EAHR,OAAA,GAAA,CAAA,SAAA,~~iGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAM,MAAA,EAQEN,EAAM,OAAS,QAEjBK,EAAAA,OAACe,EAAAA,YAAA,CACA,MAAOpB,EAAM,WAAaG,EAAAA,OAAO,KAAK,SAAWA,EAAAA,OAAO,KAAK,QAE5D,SAAAH,EAAM,KAAA,EAHR,OAAA,GAAA,CAAA,SAAA,~~iGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAM,MAAA,EAQEN,EAAM,YAAc,SAEtBK,EAAAA,OAACgB,EAAAA,cAAA,CACA,MAAOrB,EAAM,WAAaG,EAAAA,OAAO,KAAK,SAAWA,EAAAA,OAAO,KAAK,QAE5D,SAAAH,EAAM,KAAA,EAHR,OAAA,GAAA,CAAA,SAAA,~~iGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAM,MAAA,EASDD,EAAAA,OAACiB,EAAAA,YAAA,CACA,MAAOtB,EAAM,WAAaG,EAAAA,OAAO,KAAK,SAAWA,EAAAA,OAAO,KAAK,QAE5D,SAAAH,EAAM,KAAA,EAHR,OAAA,GAAA,CAAA,SAAA,~~iGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAM,MAAA,EAlCOD,EAAAA,OAAAkB,EAAAA,SAAA,GAAA,OAAA,GAAA,CAAA,SAAA,~~iGAAA~~,WAAA,IAAA,aAAA,EAAA,EAAAjB,MAAE,EA0CX,OACCD,EAAAA,OAACmB,EAAAA,qBAAA,CACA,QAAST,EACT,aAAc,IAAMH,EAAa,CAACZ,EAAM,cAAc,EACtD,aAAc,IAAMY,EAAa,EAAK,EACtC,YAAa,IAAME,EAAa,CAACd,EAAM,cAAc,EACrD,UAAW,IAAMc,EAAa,EAAK,EACnC,MAAOd,EAAM,QAAU,CAAE,WAAY,YAAA,EAAiB,CAAA,EAEtD,SAAA,CAAAK,EAAAA,OAACoB,EAAAA,gBAAA,CACA,QAASjB,EACT,QAASG,EACT,QAASE,EACT,WAAYb,EAAM,YAAc,GAChC,KAAMA,EAAM,KACZ,MAAOA,EAAM,QAAU,CAAE,OAAQ,OAAA,EAAY,CAAA,EAE7C,SAAAK,EAAAA,OAACN,EAAA,CACA,QAASC,EAAM,OAAS,QACxB,SAAAQ,EACA,WAAYR,EAAM,YAAc,GAChC,YAAaA,EAAM,WAAA,EAJpB,OAAA,GAAA,CAAA,SAAA,~~iGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAM,MAAA,CAKA,EAbD,OAAA,GAAA,CAAA,SAAA,~~iGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAA,MAAA,EAeAD,EAAAA,OAAC,MAAA,CACA,MAAO,CACN,QAAS,OACT,cAAe,SACf,IAAKL,EAAM,0BAA4B,KAAA,EAGvC,SAAA,CAAAkB,EAAA,EACAlB,EAAM,SACNK,EAAAA,OAACe,EAAAA,YAAA,CACA,MACCpB,EAAM,WAAaG,EAAAA,OAAO,KAAK,SAAWA,EAAAA,OAAO,KAAK,UAGtD,SAAAH,EAAM,OAAA,EALR,OAAA,GAAA,CAAA,SAAA,~~iGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAM,MAAA,CAMA,CAAA,EAfF,OAAA,GAAA,CAAA,SAAA,~~iGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAA,MAAA,CAiBA,CAAA,EAxCD,OAAA,GAAA,CAAA,SAAA,~~iGAAA~~,WAAA,IAAA,aAAA,CAAA,EAAAA,MAAA,CA2CF"}
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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"}

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

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

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

	@@ -1 +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"}
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,8FAAA,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,8FAAA,WAAA,GAAA,aAAA,CAAA,EAAAc,MAEA,CAAA,CAAA,EALF,OAAA,GAAA,CAAA,SAAA,8FAAA,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,8FAAA,WAAA,GAAA,aAAA,CAAA,EAAAH,MAAA,CAOD,CAAA,EAVF,OAAA,GAAA,CAAA,SAAA,8FAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAWA,CAAA,CAAA,EAtBD,OAAA,GAAA,CAAA,SAAA,8FAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAuBA,CAEF"}

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

@@ -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"),u=require("../../utils/resizeImage.js"),a=require("../shimmer/ShimmerComponent/BikShimmer.js"),l=({imageUrl:r,targetSize:e,alt:t,style:c})=>{const[s,i]=m.useState("");return m.useEffect(()=>{u.resizeImage(r,e).then(n=>{i(n)}).catch(n=>{i(r)})},[r,e]),s?o.jsxDEV("img",{alt:t,src:s,height:e,width:e,style:c},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/resizeImage/index.tsx",lineNumber:44,columnNumber:3},void 0):o.jsxDEV(a.BikShimmer,{boxes:[{marginTop:"0px",height:`${e}px`,width:`${e}px`}]},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/resizeImage/index.tsx",lineNumber:32,columnNumber:4},void 0)};exports.ResizableImage=l;
 //# sourceMappingURL=index.js.map

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

	@@ -1 +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"}
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,4FAAA,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,4FAAA,WAAA,GAAA,aAAA,CAAA,EAAAW,MAAA,CAoBH"}

package/dist/cjs/components/searchBar/searchBar.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react/jsx-dev-runtime"),B=require("../../assets/icons/searchIcon.js"),t=require("react"),E=require("../../assets/icons/cross.svg.js"),V=require("../input/Input.js"),q=e=>{const{isEnabled:s,onEnter:d,placeholder:S,width:g,variant:m,validate:v,isActive:o}=e,[h,n]=t.useState("search"),[f,i]=t.useState("default"),[C,a]=t.useState(o?"active":s?"none":"disabled"),[r,u]=t.useState(e.initialValue||e.searchValue||"");t.useEffect(()=>{u(e.searchValue??""),e.searchValue?.trim()?.length?n("cross"):n("search")},[e.searchValue]),t.useEffect(()=>{a(o?"active":s?"none":"disabled")},[s,o]),t.useEffect(()=>{e.reset&&b()},[e?.reset]);const I=(c,l)=>{if(e.onChange(c),u(c),l?.type==="keydown"&&(l.which===13||l.keyCode===13)){k(c);return}c.trim().length?n("cross"):n("search")},k=c=>{s&&d(c)},b=()=>{n("search"),i("default"),u(""),e.onChange(""),a("none"),d("")};return y.jsxDEV(V.Input,{"data-test":e["data-test"],id:"search-bar",validate:v,onFocus:()=>{r.length&&n("cross"),f==="default"&&s&&(i("clicked"),a("active"))},width:g,state:C,leftIcon:h==="search"&&f==="default"?{icon:B.SearchIcon}:void 0,rightIcon:h==="cross"&&!e.suffixButton?{icon:E.default,callback:()=>{b(),e.onClickCross&&e.onClickCross()}}:void 0,onChangeText:I,placeholder:S,variant:m,value:r,onBlur:()=>{r.length||i("default"),a("none")},button:{text:"",buttonProps:e.suffixButton}},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/searchBar/searchBar.tsx",lineNumber:101,columnNumber:3},void 0)};exports.SearchBar=q;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const B=require("react/jsx-dev-runtime"),E=require("../../assets/icons/searchIcon.js"),t=require("react"),V=require("../../assets/icons/cross.svg.js"),y=require("../input/Input.js"),q=e=>{const{isEnabled:s,onEnter:d,placeholder:S,width:g,variant:m,validate:v,isActive:i}=e,[h,n]=t.useState("search"),[f,o]=t.useState("default"),[C,a]=t.useState(i?"active":s?"none":"disabled"),[r,u]=t.useState(e.initialValue||e.searchValue||"");t.useEffect(()=>{u(e.searchValue??""),e.searchValue?.trim()?.length?n("cross"):n("search")},[e.searchValue]),t.useEffect(()=>{a(i?"active":s?"none":"disabled")},[s,i]),t.useEffect(()=>{e.reset&&b()},[e?.reset]);const k=(c,l)=>{if(e.onChange(c),u(c),l?.type==="keydown"&&(l.which===13||l.keyCode===13)){I(c);return}c.trim().length?n("cross"):n("search")},I=c=>{s&&d(c)},b=()=>{n("search"),o("default"),u(""),e.onChange(""),a("none"),d("")};return B.jsxDEV(y.Input,{"data-test":e["data-test"],id:"search-bar",validate:v,onFocus:()=>{r.length&&n("cross"),f==="default"&&s&&(o("clicked"),a("active"))},width:g,state:C,leftIcon:h==="search"&&f==="default"?{icon:E.SearchIcon}:void 0,rightIcon:h==="cross"&&!e.suffixButton?{icon:V.default,callback:()=>{b(),e.onClickCross&&e.onClickCross()}}:void 0,onChangeText:k,placeholder:S,variant:m,value:r,onBlur:()=>{r.length||o("default"),a("none")},button:{text:"",buttonProps:e.suffixButton}},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/searchBar/searchBar.tsx",lineNumber:101,columnNumber:3},void 0)};exports.SearchBar=q;
 //# sourceMappingURL=searchBar.js.map

package/dist/cjs/components/searchBar/searchBar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"searchBar.js","sources":["../../../../src/components/searchBar/searchBar.tsx"],"sourcesContent":["import { SearchIcon } from '@src/assets/icons/searchIcon';\nimport { useEffect, useState } from 'react';\nimport CrossIcon from '../../assets/icons/cross.svg';\nimport { ButtonProps } from '../button/model';\nimport { Input } from '../input/Input';\nimport { InputVariant } from '../input/Input.model';\n\nexport interface SearchBarProps {\n\twidth: string;\n\tisEnabled: boolean;\n\tonChange: (searchText: string) => void;\n\tonEnter: (searchText: string) => void;\n\tplaceholder: string;\n\tvariant: InputVariant;\n\tvalidate?: (input?: string \| number) => [boolean, string];\n\tinitialValue?: string;\n\treset?: boolean;\n\tonClickCross?: () => void;\n\tisActive?: boolean;\n\tsuffixButton?: ButtonProps;\n\tsearchValue?: string;\n\t'data-test'?: string;\n}\n\ntype ActiveStates = 'none' \| 'disabled' \| 'active';\ntype Mode = 'default' \| 'clicked';\n\nexport const SearchBar = (props: SearchBarProps) => {\n\tconst {\n\t\tisEnabled,\n\t\tonEnter,\n\t\tplaceholder,\n\t\twidth,\n\t\tvariant,\n\t\tvalidate,\n\t\tisActive,\n\t} = props;\n\tconst [icon, setIcon] = useState<string>('search');\n\tconst [mode, setMode] = useState<Mode>('default');\n\tconst [inputState, setInputState] = useState<ActiveStates>(\n\t\tisActive ? 'active' : isEnabled ? 'none' : 'disabled',\n\t);\n\tconst [value, setValue] = useState<string>(\n\t\tprops.initialValue \|\| props.searchValue \|\| '',\n\t);\n\n\tuseEffect(() => {\n\t\tsetValue(props.searchValue ?? '');\n\t\tif (props.searchValue?.trim()?.length) {\n\t\t\tsetIcon('cross');\n\t\t} else {\n\t\t\tsetIcon('search');\n\t\t}\n\t}, [props.searchValue]);\n\n\tuseEffect(() => {\n\t\tisActive\n\t\t\t? setInputState('active')\n\t\t\t: isEnabled\n\t\t\t? setInputState('none')\n\t\t\t: setInputState('disabled');\n\t}, [isEnabled, isActive]);\n\n\tuseEffect(() => {\n\t\tprops.reset && resetSearch();\n\t}, [props?.reset]);\n\n\tconst handleOnChange = (searchText: string, event: any) => {\n\t\tprops.onChange(searchText);\n\t\tsetValue(searchText);\n\n\t\tif (\n\t\t\tevent?.type === 'keydown' &&\n\t\t\t(event.which === 13 \|\| event.keyCode === 13)\n\t\t) {\n\t\t\thandleEnter(searchText);\n\t\t\treturn;\n\t\t}\n\n\t\tif (searchText.trim().length) {\n\t\t\tsetIcon('cross');\n\t\t} else {\n\t\t\tsetIcon('search');\n\t\t}\n\t};\n\n\tconst handleEnter = (searchText: string) => {\n\t\tisEnabled && onEnter(searchText);\n\t};\n\n\tconst resetSearch = () => {\n\t\tsetIcon('search');\n\t\tsetMode('default');\n\t\tsetValue('');\n\t\tprops.onChange('');\n\t\tsetInputState('none');\n\t\tonEnter('');\n\t};\n\n\treturn (\n\t\t<Input\n\t\t\tdata-test={props['data-test']}\n\t\t\tid=\"search-bar\"\n\t\t\tvalidate={validate}\n\t\t\tonFocus={() => {\n\t\t\t\tif (value.length) setIcon('cross');\n\t\t\t\tif (mode === 'default') {\n\t\t\t\t\tif (isEnabled) {\n\t\t\t\t\t\tsetMode('clicked');\n\t\t\t\t\t\tsetInputState('active');\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}}\n\t\t\twidth={width}\n\t\t\tstate={inputState}\n\t\t\tleftIcon={\n\t\t\t\ticon === 'search' && mode === 'default'\n\t\t\t\t\t? {\n\t\t\t\t\t\t\ticon: SearchIcon,\n\t\t\t\t\t }\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\trightIcon={\n\t\t\t\ticon === 'cross' && !props.suffixButton\n\t\t\t\t\t? {\n\t\t\t\t\t\t\ticon: CrossIcon,\n\t\t\t\t\t\t\tcallback: () => {\n\t\t\t\t\t\t\t\tresetSearch();\n\t\t\t\t\t\t\t\tprops.onClickCross && props.onClickCross();\n\t\t\t\t\t\t\t},\n\t\t\t\t\t }\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\tonChangeText={handleOnChange}\n\t\t\tplaceholder={placeholder}\n\t\t\tvariant={variant}\n\t\t\tvalue={value}\n\t\t\tonBlur={() => {\n\t\t\t\tif (!value.length) {\n\t\t\t\t\tsetMode('default');\n\t\t\t\t}\n\t\t\t\tsetInputState('none');\n\t\t\t}}\n\t\t\tbutton={{ text: '', buttonProps: props.suffixButton }}\n\t\t/>\n\t);\n};\n"],"names":["SearchBar","props","isEnabled","onEnter","placeholder","width","variant","validate","isActive","icon","setIcon","useState","mode","setMode","inputState","setInputState","value","setValue","useEffect","resetSearch","handleOnChange","searchText","event","handleEnter","jsxDEV","Input","SearchIcon","CrossIcon","this"],"mappings":"sQA2BaA,EAAaC,GAA0B,CACnD,KAAM,CACL,UAAAC,EACA,QAAAC,EACA,YAAAC,EACA,MAAAC,EACA,QAAAC,EACA,SAAAC,EACA,SAAAC,CAAA,EACGP,EACE,CAACQ,EAAMC,CAAO,EAAIC,EAAAA,SAAiB,QAAQ,EAC3C,CAACC,EAAMC,CAAO,EAAIF,EAAAA,SAAe,SAAS,EAC1C,CAACG,EAAYC,CAAa,EAAIJ,EAAAA,SACnCH,EAAW,SAAWN,EAAY,OAAS,UAAA,EAEtC,CAACc,EAAOC,CAAQ,EAAIN,EAAAA,SACzBV,EAAM,cAAgBA,EAAM,aAAe,EAAA,EAG5CiB,EAAAA,UAAU,IAAM,CACfD,EAAShB,EAAM,aAAe,EAAE,EAC5BA,EAAM,aAAa,KAAA,GAAQ,OAC9BS,EAAQ,OAAO,EAEfA,EAAQ,QAAQ,CAElB,EAAG,CAACT,EAAM,WAAW,CAAC,EAEtBiB,EAAAA,UAAU,IAAM,CAEZH,EADHP,EACiB,SACdN,EACc,OACA,UAHQ,CAI1B,EAAG,CAACA,EAAWM,CAAQ,CAAC,EAExBU,EAAAA,UAAU,IAAM,CACfjB,EAAM,OAASkB,EAAA,CAChB,EAAG,CAAClB,GAAO,KAAK,CAAC,EAEjB,MAAMmB,EAAiB,CAACC,EAAoBC,IAAe,CAI1D,GAHArB,EAAM,SAASoB,CAAU,EACzBJ,EAASI,CAAU,EAGlBC,GAAO,OAAS,YACfA,EAAM,QAAU,IAAMA,EAAM,UAAY,IACxC,CACDC,EAAYF,CAAU,EACtB,MACD,CAEIA,EAAW,KAAA,EAAO,OACrBX,EAAQ,OAAO,EAEfA,EAAQ,QAAQ,CAElB,EAEMa,EAAeF,GAAuB,CAC3CnB,GAAaC,EAAQkB,CAAU,CAChC,EAEMF,EAAc,IAAM,CACzBT,EAAQ,QAAQ,EAChBG,EAAQ,SAAS,EACjBI,EAAS,EAAE,EACXhB,EAAM,SAAS,EAAE,EACjBc,EAAc,MAAM,EACpBZ,EAAQ,EAAE,CACX,EAEA,OACCqB,EAAAA,OAACC,EAAAA,MAAA,CACA,YAAWxB,EAAM,WAAW,EAC5B,GAAG,aACH,SAAAM,EACA,QAAS,IAAM,CACVS,EAAM,QAAQN,EAAQ,OAAO,EAC7BE,IAAS,WACRV,IACHW,EAAQ,SAAS,EACjBE,EAAc,QAAQ,EAGzB,EACA,MAAAV,EACA,MAAOS,EACP,SACCL,IAAS,UAAYG,IAAS,UAC3B,CACA,KAAMc,EAAAA,UAAA,EAEN,OAEJ,UACCjB,IAAS,SAAW,CAACR,EAAM,aACxB,CACA,KAAM0B,EAAAA,QACN,SAAU,IAAM,CACfR,EAAA,EACAlB,EAAM,cAAgBA,EAAM,aAAA,CAC7B,CAAA,EAEA,OAEJ,aAAcmB,EACd,YAAAhB,EACA,QAAAE,EACA,MAAAU,EACA,OAAQ,IAAM,CACRA,EAAM,QACVH,EAAQ,SAAS,EAElBE,EAAc,MAAM,CACrB,EACA,OAAQ,CAAE,KAAM,GAAI,YAAad,EAAM,YAAA,CAAa,EA3CrD,OAAA,GAAA,CAAA,SAAA,~~6FAAA~~,WAAA,IAAA,aAAA,CAAA,EAAA2B,MAAA,CA8CF"}
1	+ {"version":3,"file":"searchBar.js","sources":["../../../../src/components/searchBar/searchBar.tsx"],"sourcesContent":["import { SearchIcon } from '@src/assets/icons/searchIcon';\nimport { useEffect, useState } from 'react';\nimport CrossIcon from '../../assets/icons/cross.svg';\nimport { ButtonProps } from '../button/model';\nimport { Input } from '../input/Input';\nimport { InputVariant } from '../input/Input.model';\n\nexport interface SearchBarProps {\n\twidth: string;\n\tisEnabled: boolean;\n\tonChange: (searchText: string) => void;\n\tonEnter: (searchText: string) => void;\n\tplaceholder: string;\n\tvariant: InputVariant;\n\tvalidate?: (input?: string \| number) => [boolean, string];\n\tinitialValue?: string;\n\treset?: boolean;\n\tonClickCross?: () => void;\n\tisActive?: boolean;\n\tsuffixButton?: ButtonProps;\n\tsearchValue?: string;\n\t'data-test'?: string;\n}\n\ntype ActiveStates = 'none' \| 'disabled' \| 'active';\ntype Mode = 'default' \| 'clicked';\n\nexport const SearchBar = (props: SearchBarProps) => {\n\tconst {\n\t\tisEnabled,\n\t\tonEnter,\n\t\tplaceholder,\n\t\twidth,\n\t\tvariant,\n\t\tvalidate,\n\t\tisActive,\n\t} = props;\n\tconst [icon, setIcon] = useState<string>('search');\n\tconst [mode, setMode] = useState<Mode>('default');\n\tconst [inputState, setInputState] = useState<ActiveStates>(\n\t\tisActive ? 'active' : isEnabled ? 'none' : 'disabled',\n\t);\n\tconst [value, setValue] = useState<string>(\n\t\tprops.initialValue \|\| props.searchValue \|\| '',\n\t);\n\n\tuseEffect(() => {\n\t\tsetValue(props.searchValue ?? '');\n\t\tif (props.searchValue?.trim()?.length) {\n\t\t\tsetIcon('cross');\n\t\t} else {\n\t\t\tsetIcon('search');\n\t\t}\n\t}, [props.searchValue]);\n\n\tuseEffect(() => {\n\t\tisActive\n\t\t\t? setInputState('active')\n\t\t\t: isEnabled\n\t\t\t? setInputState('none')\n\t\t\t: setInputState('disabled');\n\t}, [isEnabled, isActive]);\n\n\tuseEffect(() => {\n\t\tprops.reset && resetSearch();\n\t}, [props?.reset]);\n\n\tconst handleOnChange = (searchText: string, event: any) => {\n\t\tprops.onChange(searchText);\n\t\tsetValue(searchText);\n\n\t\tif (\n\t\t\tevent?.type === 'keydown' &&\n\t\t\t(event.which === 13 \|\| event.keyCode === 13)\n\t\t) {\n\t\t\thandleEnter(searchText);\n\t\t\treturn;\n\t\t}\n\n\t\tif (searchText.trim().length) {\n\t\t\tsetIcon('cross');\n\t\t} else {\n\t\t\tsetIcon('search');\n\t\t}\n\t};\n\n\tconst handleEnter = (searchText: string) => {\n\t\tisEnabled && onEnter(searchText);\n\t};\n\n\tconst resetSearch = () => {\n\t\tsetIcon('search');\n\t\tsetMode('default');\n\t\tsetValue('');\n\t\tprops.onChange('');\n\t\tsetInputState('none');\n\t\tonEnter('');\n\t};\n\n\treturn (\n\t\t<Input\n\t\t\tdata-test={props['data-test']}\n\t\t\tid=\"search-bar\"\n\t\t\tvalidate={validate}\n\t\t\tonFocus={() => {\n\t\t\t\tif (value.length) setIcon('cross');\n\t\t\t\tif (mode === 'default') {\n\t\t\t\t\tif (isEnabled) {\n\t\t\t\t\t\tsetMode('clicked');\n\t\t\t\t\t\tsetInputState('active');\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}}\n\t\t\twidth={width}\n\t\t\tstate={inputState}\n\t\t\tleftIcon={\n\t\t\t\ticon === 'search' && mode === 'default'\n\t\t\t\t\t? {\n\t\t\t\t\t\t\ticon: SearchIcon,\n\t\t\t\t\t }\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\trightIcon={\n\t\t\t\ticon === 'cross' && !props.suffixButton\n\t\t\t\t\t? {\n\t\t\t\t\t\t\ticon: CrossIcon,\n\t\t\t\t\t\t\tcallback: () => {\n\t\t\t\t\t\t\t\tresetSearch();\n\t\t\t\t\t\t\t\tprops.onClickCross && props.onClickCross();\n\t\t\t\t\t\t\t},\n\t\t\t\t\t }\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\tonChangeText={handleOnChange}\n\t\t\tplaceholder={placeholder}\n\t\t\tvariant={variant}\n\t\t\tvalue={value}\n\t\t\tonBlur={() => {\n\t\t\t\tif (!value.length) {\n\t\t\t\t\tsetMode('default');\n\t\t\t\t}\n\t\t\t\tsetInputState('none');\n\t\t\t}}\n\t\t\tbutton={{ text: '', buttonProps: props.suffixButton }}\n\t\t/>\n\t);\n};\n"],"names":["SearchBar","props","isEnabled","onEnter","placeholder","width","variant","validate","isActive","icon","setIcon","useState","mode","setMode","inputState","setInputState","value","setValue","useEffect","resetSearch","handleOnChange","searchText","event","handleEnter","jsxDEV","Input","SearchIcon","CrossIcon","this"],"mappings":"sQA2BaA,EAAaC,GAA0B,CACnD,KAAM,CACL,UAAAC,EACA,QAAAC,EACA,YAAAC,EACA,MAAAC,EACA,QAAAC,EACA,SAAAC,EACA,SAAAC,CAAA,EACGP,EACE,CAACQ,EAAMC,CAAO,EAAIC,EAAAA,SAAiB,QAAQ,EAC3C,CAACC,EAAMC,CAAO,EAAIF,EAAAA,SAAe,SAAS,EAC1C,CAACG,EAAYC,CAAa,EAAIJ,EAAAA,SACnCH,EAAW,SAAWN,EAAY,OAAS,UAAA,EAEtC,CAACc,EAAOC,CAAQ,EAAIN,EAAAA,SACzBV,EAAM,cAAgBA,EAAM,aAAe,EAAA,EAG5CiB,EAAAA,UAAU,IAAM,CACfD,EAAShB,EAAM,aAAe,EAAE,EAC5BA,EAAM,aAAa,KAAA,GAAQ,OAC9BS,EAAQ,OAAO,EAEfA,EAAQ,QAAQ,CAElB,EAAG,CAACT,EAAM,WAAW,CAAC,EAEtBiB,EAAAA,UAAU,IAAM,CAEZH,EADHP,EACiB,SACdN,EACc,OACA,UAHQ,CAI1B,EAAG,CAACA,EAAWM,CAAQ,CAAC,EAExBU,EAAAA,UAAU,IAAM,CACfjB,EAAM,OAASkB,EAAA,CAChB,EAAG,CAAClB,GAAO,KAAK,CAAC,EAEjB,MAAMmB,EAAiB,CAACC,EAAoBC,IAAe,CAI1D,GAHArB,EAAM,SAASoB,CAAU,EACzBJ,EAASI,CAAU,EAGlBC,GAAO,OAAS,YACfA,EAAM,QAAU,IAAMA,EAAM,UAAY,IACxC,CACDC,EAAYF,CAAU,EACtB,MACD,CAEIA,EAAW,KAAA,EAAO,OACrBX,EAAQ,OAAO,EAEfA,EAAQ,QAAQ,CAElB,EAEMa,EAAeF,GAAuB,CAC3CnB,GAAaC,EAAQkB,CAAU,CAChC,EAEMF,EAAc,IAAM,CACzBT,EAAQ,QAAQ,EAChBG,EAAQ,SAAS,EACjBI,EAAS,EAAE,EACXhB,EAAM,SAAS,EAAE,EACjBc,EAAc,MAAM,EACpBZ,EAAQ,EAAE,CACX,EAEA,OACCqB,EAAAA,OAACC,EAAAA,MAAA,CACA,YAAWxB,EAAM,WAAW,EAC5B,GAAG,aACH,SAAAM,EACA,QAAS,IAAM,CACVS,EAAM,QAAQN,EAAQ,OAAO,EAC7BE,IAAS,WACRV,IACHW,EAAQ,SAAS,EACjBE,EAAc,QAAQ,EAGzB,EACA,MAAAV,EACA,MAAOS,EACP,SACCL,IAAS,UAAYG,IAAS,UAC3B,CACA,KAAMc,EAAAA,UAAA,EAEN,OAEJ,UACCjB,IAAS,SAAW,CAACR,EAAM,aACxB,CACA,KAAM0B,EAAAA,QACN,SAAU,IAAM,CACfR,EAAA,EACAlB,EAAM,cAAgBA,EAAM,aAAA,CAC7B,CAAA,EAEA,OAEJ,aAAcmB,EACd,YAAAhB,EACA,QAAAE,EACA,MAAAU,EACA,OAAQ,IAAM,CACRA,EAAM,QACVH,EAAQ,SAAS,EAElBE,EAAc,MAAM,CACrB,EACA,OAAQ,CAAE,KAAM,GAAI,YAAad,EAAM,YAAA,CAAa,EA3CrD,OAAA,GAAA,CAAA,SAAA,8FAAA,WAAA,IAAA,aAAA,CAAA,EAAA2B,MAAA,CA8CF"}

package/dist/cjs/components/shimmer/ShimmerComponent/BikShimmer.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-dev-runtime"),s=require("./ShimmerStyled.js"),n=e=>r.jsxDEV(s.ShimmerStyled,{isBrand:e.isBrand,direction:e.direction,gap:e.gap,children:e.boxes.map((i,m)=>r.jsxDEV("div",{className:"shine",style:{width:i.width,height:i.height,marginTop:i.marginTop||"16px",borderRadius:i.borderRadius||"4px"}},m,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/shimmer/ShimmerComponent/BikShimmer.tsx",lineNumber:27,columnNumber:6},void 0))},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/shimmer/ShimmerComponent/BikShimmer.tsx",lineNumber:20,columnNumber:3},void 0);exports.BikShimmer=n;exports.default=n;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-dev-runtime"),t=require("./ShimmerStyled.js"),m=e=>r.jsxDEV(t.ShimmerStyled,{isBrand:e.isBrand,direction:e.direction,gap:e.gap,children:e.boxes.map((i,n)=>r.jsxDEV("div",{className:"shine",style:{width:i.width,height:i.height,marginTop:i.marginTop||"16px",borderRadius:i.borderRadius||"4px"}},n,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/shimmer/ShimmerComponent/BikShimmer.tsx",lineNumber:27,columnNumber:6},void 0))},void 0,!1,{fileName:"/Users/prateekchouhan/Projects/bik-component-library/src/components/shimmer/ShimmerComponent/BikShimmer.tsx",lineNumber:20,columnNumber:3},void 0);exports.BikShimmer=m;exports.default=m;
 //# sourceMappingURL=BikShimmer.js.map

package/dist/cjs/components/shimmer/ShimmerComponent/BikShimmer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BikShimmer.js","sources":["../../../../../src/components/shimmer/ShimmerComponent/BikShimmer.tsx"],"sourcesContent":["import { FunctionComponent } from 'react';\nimport { ShimmerStyled } from './ShimmerStyled';\n\nexport interface ShimmerBox {\n\theight: string;\n\twidth: string;\n\tmarginTop?: string;\n\tborderRadius?: string;\n}\n\nexport interface BikShimmerProps {\n\tboxes: ShimmerBox[];\n\tisBrand?: boolean;\n\tgap?: string;\n\tdirection?: 'row' \| 'column';\n}\n\nexport const BikShimmer: FunctionComponent<BikShimmerProps> = (props) => {\n\treturn (\n\t\t<ShimmerStyled\n\t\t\tisBrand={props.isBrand}\n\t\t\tdirection={props.direction}\n\t\t\tgap={props.gap}\n\t\t>\n\t\t\t{props.boxes.map((box, index) => {\n\t\t\t\treturn (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={'shine'}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\twidth: box.width,\n\t\t\t\t\t\t\theight: box.height,\n\t\t\t\t\t\t\tmarginTop: box.marginTop \|\| '16px',\n\t\t\t\t\t\t\tborderRadius: box.borderRadius \|\| '4px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tkey={index}\n\t\t\t\t\t></div>\n\t\t\t\t);\n\t\t\t})}\n\t\t</ShimmerStyled>\n\t);\n};\n\nexport default BikShimmer;\n"],"names":["BikShimmer","props","jsxDEV","ShimmerStyled","box","index","this"],"mappings":"qLAiBaA,EAAkDC,GAE7DC,EAAAA,OAACC,EAAAA,cAAA,CACA,QAASF,EAAM,QACf,UAAWA,EAAM,UACjB,IAAKA,EAAM,IAEV,SAAAA,EAAM,MAAM,IAAI,CAACG,EAAKC,IAErBH,EAAAA,OAAC,MAAA,CACA,UAAW,QACX,MAAO,CACN,MAAOE,EAAI,MACX,OAAQA,EAAI,OACZ,UAAWA,EAAI,WAAa,OAC5B,aAAcA,EAAI,cAAgB,KAAA,CACnC,EACKC,EARN,GAAA,CAAA,SAAA,~~6GAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAA,CAWD,CAAA,EAlBF,OAAA,GAAA,CAAA,SAAA,~~6GAAA~~,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA"}
1	+ {"version":3,"file":"BikShimmer.js","sources":["../../../../../src/components/shimmer/ShimmerComponent/BikShimmer.tsx"],"sourcesContent":["import { FunctionComponent } from 'react';\nimport { ShimmerStyled } from './ShimmerStyled';\n\nexport interface ShimmerBox {\n\theight: string;\n\twidth: string;\n\tmarginTop?: string;\n\tborderRadius?: string;\n}\n\nexport interface BikShimmerProps {\n\tboxes: ShimmerBox[];\n\tisBrand?: boolean;\n\tgap?: string;\n\tdirection?: 'row' \| 'column';\n}\n\nexport const BikShimmer: FunctionComponent<BikShimmerProps> = (props) => {\n\treturn (\n\t\t<ShimmerStyled\n\t\t\tisBrand={props.isBrand}\n\t\t\tdirection={props.direction}\n\t\t\tgap={props.gap}\n\t\t>\n\t\t\t{props.boxes.map((box, index) => {\n\t\t\t\treturn (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={'shine'}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\twidth: box.width,\n\t\t\t\t\t\t\theight: box.height,\n\t\t\t\t\t\t\tmarginTop: box.marginTop \|\| '16px',\n\t\t\t\t\t\t\tborderRadius: box.borderRadius \|\| '4px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tkey={index}\n\t\t\t\t\t></div>\n\t\t\t\t);\n\t\t\t})}\n\t\t</ShimmerStyled>\n\t);\n};\n\nexport default BikShimmer;\n"],"names":["BikShimmer","props","jsxDEV","ShimmerStyled","box","index","this"],"mappings":"qLAiBaA,EAAkDC,GAE7DC,EAAAA,OAACC,EAAAA,cAAA,CACA,QAASF,EAAM,QACf,UAAWA,EAAM,UACjB,IAAKA,EAAM,IAEV,SAAAA,EAAM,MAAM,IAAI,CAACG,EAAKC,IAErBH,EAAAA,OAAC,MAAA,CACA,UAAW,QACX,MAAO,CACN,MAAOE,EAAI,MACX,OAAQA,EAAI,OACZ,UAAWA,EAAI,WAAa,OAC5B,aAAcA,EAAI,cAAgB,KAAA,CACnC,EACKC,EARN,GAAA,CAAA,SAAA,8GAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAA,CAWD,CAAA,EAlBF,OAAA,GAAA,CAAA,SAAA,8GAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA"}