@bikdotai/bik-component-library 0.0.807-beta.2 → 0.0.808-beta.0

package/dist/esm/components/carousel-preview/CarouselPreview.js

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import o from"../../assets/icons/aiContentIcon.svg.js";import l from"react";import t from"react-slick";import{Container as s,CarouselSlickContainer as i}from"./CarouselPreview.style.js";import n from"./CarouselPreviewCard.js";import{AiContentBadge as a}from"../template-preview/TemplatePreview.styled.js";import{useTemplateModalContext as d}from"../template-context-mapper/context/templateModalContext.js";import{determineCardIndex as c,isRCSChannel as m}from"../template-preview/helpers/templateMiscHelper.js";import{RCSCarousalContainer as u}from"../template-preview/RCS/RCSPreview.styled.js";import{CustomCarouselRightArrow as p,CustomCarouselLeftArrow as v}from"./CustomCarouselArrows.js";const w=l.forwardRef((l=>{let{channel:t,template:i,isPreview:p,removeBottomBorder:v,borderRadius:w,showArrows:C,hideBorder:f,showSampleValues:P}=l;var g,j;const{sliderRef:x,selectedCarouselIndex:I,cardCount:b,setIsCarouselHovered:R,cardIndex:S,showVariablePicker:A}=d(),V=-1==S?c(t):S,B=null===(j=null===(g=null==i?void 0:i.components)||void 0===g?void 0:g[V])||void 0===j?void 0:j.cards,T=(null==B?void 0:B.length)?e(h,{cards:B,cardCount:null!=b?b:0,selectedCarouselIndex:null!=I?I:-1,sliderRef:x,isPreview:p,showArrows:C,channel:t,template:i,setIsCarouselHovered:R,showSampleValues:!!P,showVariablePicker:A}):null;return m(t)?e(u,Object.assign({borderRadius:w},{children:T})):r(s,Object.assign({removeBottomBorder:v,borderRadius:w,hideBorder:f},{children:[(!!(null==i?void 0:i.aiContentConfigId)||!!(null==i?void 0:i.isAiGenerated))&&e(a,{children:e(o,{width:48,height:48})}),e(n,{channel:t,currentTemplate:i,carouselCardIndex:-1,isPreview:p,width:"77%"}),T]}))})),h=r=>{let{cards:o,cardCount:l,selectedCarouselIndex:s,sliderRef:a,isPreview:d,showArrows:c,channel:m,template:u,setIsCarouselHovered:w,showSampleValues:h,showVariablePicker:C}=r;return e(i,Object.assign({cardCount:l,selectedCarouselIndex:s,onMouseEnter:()=>!C&&(null==w?void 0:w(!0)),onMouseLeave:()=>!C&&(null==w?void 0:w(!1))},{children:e(t,Object.assign({ref:a,swipeToSlide:!0,draggable:!0,swipe:!0,infinite:!1,focusOnSelect:!d,centerMode:!0,arrows:c,adaptiveHeight:!0,nextArrow:e(p,{isPreview:null!=d&&d}),prevArrow:e(v,{isPreview:null!=d&&d})},{children:null==o?void 0:o.map(((r,o)=>{var l,t;const s={components:r.components,mapping:null===(t=null===(l=null==u?void 0:u.mapping)||void 0===l?void 0:l.cards)||void 0===t?void 0:t[o],content:null==u?void 0:u.content,templateType:null==u?void 0:u.templateType};return e(n,{channel:m,currentTemplate:s,carouselCardIndex:o,isPreview:d,width:"100%",showSampleValues:h},o)}))}))}))};export{w as CarouselPreview};
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import o from"../../assets/icons/aiContentIcon.svg.js";import l from"react";import t from"react-slick";import{Container as s,CarouselSlickContainer as i}from"./CarouselPreview.style.js";import n from"./CarouselPreviewCard.js";import{AiContentBadge as a}from"../template-preview/TemplatePreview.styled.js";import{useTemplateModalContext as d}from"../template-context-mapper/context/templateModalContext.js";import{determineCardIndex as c,isRCSChannel as m}from"../template-preview/helpers/templateMiscHelper.js";import{RCSCarousalContainer as p}from"../template-preview/RCS/RCSPreview.styled.js";import{CustomCarouselRightArrow as u,CustomCarouselLeftArrow as v}from"./CustomCarouselArrows.js";const w=l.forwardRef((({channel:l,template:t,isPreview:i,removeBottomBorder:u,borderRadius:v,showArrows:w,hideBorder:C,showSampleValues:f})=>{var P,g;const{sliderRef:j,selectedCarouselIndex:x,cardCount:I,setIsCarouselHovered:b,cardIndex:R,showVariablePicker:S}=d(),A=-1==R?c(l):R,V=null===(g=null===(P=null==t?void 0:t.components)||void 0===P?void 0:P[A])||void 0===g?void 0:g.cards,B=(null==V?void 0:V.length)?e(h,{cards:V,cardCount:null!=I?I:0,selectedCarouselIndex:null!=x?x:-1,sliderRef:j,isPreview:i,showArrows:w,channel:l,template:t,setIsCarouselHovered:b,showSampleValues:!!f,showVariablePicker:S}):null;return m(l)?e(p,Object.assign({borderRadius:v},{children:B})):r(s,Object.assign({removeBottomBorder:u,borderRadius:v,hideBorder:C},{children:[(!!(null==t?void 0:t.aiContentConfigId)||!!(null==t?void 0:t.isAiGenerated))&&e(a,{children:e(o,{width:48,height:48})}),e(n,{channel:l,currentTemplate:t,carouselCardIndex:-1,isPreview:i,width:"77%"}),B]}))})),h=({cards:r,cardCount:o,selectedCarouselIndex:l,sliderRef:s,isPreview:a,showArrows:d,channel:c,template:m,setIsCarouselHovered:p,showSampleValues:w,showVariablePicker:h})=>e(i,Object.assign({cardCount:o,selectedCarouselIndex:l,onMouseEnter:()=>!h&&(null==p?void 0:p(!0)),onMouseLeave:()=>!h&&(null==p?void 0:p(!1))},{children:e(t,Object.assign({ref:s,swipeToSlide:!0,draggable:!0,swipe:!0,infinite:!1,focusOnSelect:!a,centerMode:!0,arrows:d,adaptiveHeight:!0,nextArrow:e(u,{isPreview:null!=a&&a}),prevArrow:e(v,{isPreview:null!=a&&a})},{children:null==r?void 0:r.map(((r,o)=>{var l,t;const s={components:r.components,mapping:null===(t=null===(l=null==m?void 0:m.mapping)||void 0===l?void 0:l.cards)||void 0===t?void 0:t[o],content:null==m?void 0:m.content,templateType:null==m?void 0:m.templateType};return e(n,{channel:c,currentTemplate:s,carouselCardIndex:o,isPreview:a,width:"100%",showSampleValues:w},o)}))}))}));export{w as CarouselPreview};
 //# sourceMappingURL=CarouselPreview.js.map

package/dist/esm/components/carousel-preview/CarouselPreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"CarouselPreview.js","sources":["../../../../src/components/carousel-preview/CarouselPreview.tsx"],"sourcesContent":["/* eslint-disable react/display-name */\nimport AiContentIcon from '@src/assets/icons/aiContentIcon.svg';\nimport React from 'react';\nimport Slider from 'react-slick';\nimport 'slick-carousel/slick/slick-theme.css';\nimport 'slick-carousel/slick/slick.css';\nimport {\n\tCarouselSlickContainer,\n\tContainer,\n} from '@src/components/carousel-preview/CarouselPreview.style';\nimport CarouselPreviewCard from '@src/components/carousel-preview/CarouselPreviewCard';\nimport { CHANNEL_TYPE } from '@src/components/template-preview/models/Channels';\nimport {\n\tWhatsAppCarouselTemplate,\n\tWhatsAppCarouselTemplateCards,\n} from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport { AiContentBadge } from '@src/components/template-preview/TemplatePreview.styled';\nimport { useTemplateModalContext } from '../template-context-mapper/context/templateModalContext';\nimport {\n\tdetermineCardIndex,\n\tisRCSChannel,\n} from '../template-preview/helpers/templateMiscHelper';\nimport { AllTemplateTypes } from '../template-preview/models/types';\nimport { RCSCarousalContainer } from '../template-preview/RCS/RCSPreview.styled';\nimport {\n\tCustomCarouselLeftArrow,\n\tCustomCarouselRightArrow,\n} from './CustomCarouselArrows';\n\nexport const CarouselPreview = React.forwardRef<\n\tHTMLDivElement,\n\t{\n\t\tchannel: CHANNEL_TYPE;\n\t\ttemplate: AllTemplateTypes;\n\t\tshowSampleValues?: boolean;\n\t\tisPreview?: boolean;\n\t\tremoveBottomBorder?: boolean;\n\t\tborderRadius?: string;\n\t\tshowArrows?: boolean;\n\t\thideBorder?: boolean;\n\t}\n>(\n\t({\n\t\tchannel,\n\t\ttemplate,\n\t\tisPreview,\n\t\tremoveBottomBorder,\n\t\tborderRadius,\n\t\tshowArrows,\n\t\thideBorder,\n\t\tshowSampleValues,\n\t}) => {\n\t\tconst {\n\t\t\tsliderRef,\n\t\t\tselectedCarouselIndex,\n\t\t\tcardCount,\n\t\t\tsetIsCarouselHovered,\n\t\t\tcardIndex: cardsIndex,\n\t\t\tshowVariablePicker,\n\t\t} = useTemplateModalContext();\n\n\t\tconst cardIndex =\n\t\t\tcardsIndex == -1 ? determineCardIndex(channel) : cardsIndex;\n\t\tconst cards = (template as WhatsAppCarouselTemplate)?.components?.[\n\t\t\tcardIndex\n\t\t]?.cards;\n\n\t\tconst carouselSlider = cards?.length ? (\n\t\t\t<CarouselSlider\n\t\t\t\tcards={cards}\n\t\t\t\tcardCount={cardCount ?? 0}\n\t\t\t\tselectedCarouselIndex={selectedCarouselIndex ?? -1}\n\t\t\t\tsliderRef={sliderRef}\n\t\t\t\tisPreview={isPreview}\n\t\t\t\tshowArrows={showArrows}\n\t\t\t\tchannel={channel}\n\t\t\t\ttemplate={template as WhatsAppCarouselTemplate}\n\t\t\t\tsetIsCarouselHovered={setIsCarouselHovered}\n\t\t\t\tshowSampleValues={!!showSampleValues}\n\t\t\t\tshowVariablePicker={showVariablePicker}\n\t\t\t/>\n\t\t) : null;\n\n\t\tif (isRCSChannel(channel)) {\n\t\t\treturn (\n\t\t\t\t<RCSCarousalContainer borderRadius={borderRadius}>\n\t\t\t\t\t{carouselSlider}\n\t\t\t\t</RCSCarousalContainer>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<Container\n\t\t\t\tremoveBottomBorder={removeBottomBorder}\n\t\t\t\tborderRadius={borderRadius}\n\t\t\t\thideBorder={hideBorder}\n\t\t\t>\n\t\t\t\t{(!!template?.['aiContentConfigId'] ||\n\t\t\t\t\t!!template?.['isAiGenerated']) && (\n\t\t\t\t\t<AiContentBadge>\n\t\t\t\t\t\t<AiContentIcon width={48} height={48} />\n\t\t\t\t\t</AiContentBadge>\n\t\t\t\t)}\n\t\t\t\t<CarouselPreviewCard\n\t\t\t\t\tchannel={channel}\n\t\t\t\t\tcurrentTemplate={template}\n\t\t\t\t\tcarouselCardIndex={-1}\n\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\twidth=\"77%\"\n\t\t\t\t/>\n\t\t\t\t{carouselSlider}\n\t\t\t</Container>\n\t\t);\n\t},\n);\n\nconst CarouselSlider = ({\n\tcards,\n\tcardCount,\n\tselectedCarouselIndex,\n\tsliderRef,\n\tisPreview,\n\tshowArrows,\n\tchannel,\n\ttemplate,\n\tsetIsCarouselHovered,\n\tshowSampleValues,\n\tshowVariablePicker,\n}: {\n\tcards: WhatsAppCarouselTemplateCards[];\n\tcardCount: number;\n\tselectedCarouselIndex: number;\n\tsliderRef: any;\n\tisPreview?: boolean;\n\tshowArrows?: boolean;\n\tchannel: CHANNEL_TYPE;\n\ttemplate: WhatsAppCarouselTemplate;\n\tsetIsCarouselHovered?: (value: boolean) => void;\n\tshowSampleValues?: boolean;\n\tshowVariablePicker?: boolean;\n}) => (\n\t<CarouselSlickContainer\n\t\tcardCount={cardCount}\n\t\tselectedCarouselIndex={selectedCarouselIndex}\n\t\tonMouseEnter={() => !showVariablePicker && setIsCarouselHovered?.(true)}\n\t\tonMouseLeave={() => !showVariablePicker && setIsCarouselHovered?.(false)}\n\t>\n\t\t<Slider\n\t\t\tref={sliderRef}\n\t\t\tswipeToSlide\n\t\t\tdraggable\n\t\t\tswipe\n\t\t\tinfinite={false}\n\t\t\tfocusOnSelect={!isPreview}\n\t\t\tcenterMode\n\t\t\tarrows={showArrows}\n\t\t\tadaptiveHeight\n\t\t\tnextArrow={<CustomCarouselRightArrow isPreview={isPreview ?? false} />}\n\t\t\tprevArrow={<CustomCarouselLeftArrow isPreview={isPreview ?? false} />}\n\t\t>\n\t\t\t{cards?.map((carousel, index) => {\n\t\t\t\tconst currentCarousel = {\n\t\t\t\t\tcomponents: carousel.components,\n\t\t\t\t\tmapping: template?.mapping?.cards?.[index],\n\t\t\t\t\tcontent: template?.['content'],\n\t\t\t\t\ttemplateType: template?.['templateType'],\n\t\t\t\t};\n\t\t\t\treturn (\n\t\t\t\t\t<CarouselPreviewCard\n\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\tchannel={channel}\n\t\t\t\t\t\tcurrentTemplate={currentCarousel}\n\t\t\t\t\t\tcarouselCardIndex={index}\n\t\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t})}\n\t\t</Slider>\n\t</CarouselSlickContainer>\n);\n"],"names":["CarouselPreview","React","forwardRef","_ref","channel","template","isPreview","removeBottomBorder","borderRadius","showArrows","hideBorder","showSampleValues","sliderRef","selectedCarouselIndex","cardCount","setIsCarouselHovered","cardIndex","cardsIndex","showVariablePicker","useTemplateModalContext","determineCardIndex","cards","_b","_a","components","carouselSlider","length","_jsx","CarouselSlider","isRCSChannel","RCSCarousalContainer","Object","assign","children","_jsxs","Container","AiContentBadge","AiContentIcon","width","height","CarouselPreviewCard","currentTemplate","carouselCardIndex","_ref2","CarouselSlickContainer","onMouseEnter","onMouseLeave","Slider","ref","swipeToSlide","draggable","swipe","infinite","focusOnSelect","centerMode","arrows","adaptiveHeight","nextArrow","CustomCarouselRightArrow","prevArrow","CustomCarouselLeftArrow","map","carousel","index","currentCarousel","mapping","content","templateType"],"mappings":"uuBA6BO,MAAMA,EAAkBC,EAAMC,YAapCC,IASK,IATJC,QACAA,EAAOC,SACPA,EAAQC,UACRA,EAASC,mBACTA,EAAkBC,aAClBA,EAAYC,WACZA,EAAUC,WACVA,EAAUC,iBACVA,GACAR,UACA,MAAMS,UACLA,EAASC,sBACTA,EAAqBC,UACrBA,EAASC,qBACTA,EACAC,UAAWC,EAAUC,mBACrBA,GACGC,IAEEH,GACU,GAAfC,EAAmBG,EAAmBhB,GAAWa,EAC5CI,EAEL,QAFaC,EACb,QADcC,EAAAlB,aAAQ,EAARA,EAAuCmB,kBACrD,IAAAD,OAAA,EAAAA,EAAAP,UACA,IAAAM,OAAA,EAAAA,EAAED,MAEGI,GAAiBJ,aAAA,EAAAA,EAAOK,QAC7BC,EAACC,GACAP,MAAOA,EACPP,UAAWA,QAAAA,EAAa,EACxBD,sBAAuBA,QAAAA,GAA0B,EACjDD,UAAWA,EACXN,UAAWA,EACXG,WAAYA,EACZL,QAASA,EACTC,SAAUA,EACVU,qBAAsBA,EACtBJ,mBAAoBA,EACpBO,mBAAoBA,IAElB,KAEJ,OAAIW,EAAazB,GAEfuB,EAACG,EAAqBC,OAAAC,OAAA,CAAAxB,aAAcA,GAClC,CAAAyB,SAAAR,KAMHS,EAACC,EAASJ,OAAAC,OAAA,CACTzB,mBAAoBA,EACpBC,aAAcA,EACdE,WAAYA,GAAU,CAAAuB,SAAA,KAElB5B,aAAQ,EAARA,EAA8B,uBAC/BA,aAAA,EAAAA,EAA0B,iBAC5BsB,EAACS,EAAc,CAAAH,SACdN,EAACU,EAAc,CAAAC,MAAO,GAAIC,OAAQ,OAGpCZ,EAACa,EACA,CAAApC,QAASA,EACTqC,gBAAiBpC,EACjBqC,mBAAoB,EACpBpC,UAAWA,EACXgC,MAAM,QAENb,KACU,IAKTG,EAAiBe,IAAA,IAACtB,MACvBA,EAAKP,UACLA,EAASD,sBACTA,EAAqBD,UACrBA,EAASN,UACTA,EAASG,WACTA,EAAUL,QACVA,EAAOC,SACPA,EAAQU,qBACRA,EAAoBJ,iBACpBA,EAAgBO,mBAChBA,GAaAyB,EAAA,OACAhB,EAACiB,EACAb,OAAAC,OAAA,CAAAlB,UAAWA,EACXD,sBAAuBA,EACvBgC,aAAcA,KAAO3B,IAAsBH,aAAoB,EAApBA,GAAuB,IAClE+B,aAAcA,KAAO5B,IAAsBH,aAAoB,EAApBA,GAAuB,KAElE,CAAAkB,SAAAN,EAACoB,EAAMhB,OAAAC,OAAA,CACNgB,IAAKpC,EACLqC,cACA,EAAAC,aACAC,OAAK,EACLC,UAAU,EACVC,eAAgB/C,EAChBgD,YACA,EAAAC,OAAQ9C,EACR+C,gBAAc,EACdC,UAAW9B,EAAC+B,EAAwB,CAACpD,UAAWA,SAAAA,IAChDqD,UAAWhC,EAACiC,EAAwB,CAAAtD,UAAWA,SAAAA,KAAsB,CAAA2B,SAEpEZ,aAAA,EAAAA,EAAOwC,KAAI,CAACC,EAAUC,aACtB,MAAMC,EAAkB,CACvBxC,WAAYsC,EAAStC,WACrByC,QAAiC,QAAxB3C,EAAiB,QAAjBC,EAAAlB,aAAQ,EAARA,EAAU4D,eAAO,IAAA1C,OAAA,EAAAA,EAAEF,aAAK,IAAAC,OAAA,EAAAA,EAAGyC,GACpCG,QAAS7D,eAAAA,EAAoB,QAC7B8D,aAAc9D,eAAAA,EAAyB,cAExC,OACCsB,EAACa,EAAmB,CAEnBpC,QAASA,EACTqC,gBAAiBuB,EACjBtB,kBAAmBqB,EACnBzD,UAAWA,EACXgC,MAAM,OACN3B,iBAAkBA,GANboD,EAOJ,SAImB"}
+{"version":3,"file":"CarouselPreview.js","sources":["../../../../src/components/carousel-preview/CarouselPreview.tsx"],"sourcesContent":["/* eslint-disable react/display-name */\nimport AiContentIcon from '@src/assets/icons/aiContentIcon.svg';\nimport React from 'react';\nimport Slider from 'react-slick';\nimport 'slick-carousel/slick/slick-theme.css';\nimport 'slick-carousel/slick/slick.css';\nimport {\n\tCarouselSlickContainer,\n\tContainer,\n} from '@src/components/carousel-preview/CarouselPreview.style';\nimport CarouselPreviewCard from '@src/components/carousel-preview/CarouselPreviewCard';\nimport { CHANNEL_TYPE } from '@src/components/template-preview/models/Channels';\nimport {\n\tWhatsAppCarouselTemplate,\n\tWhatsAppCarouselTemplateCards,\n} from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport { AiContentBadge } from '@src/components/template-preview/TemplatePreview.styled';\nimport { useTemplateModalContext } from '../template-context-mapper/context/templateModalContext';\nimport {\n\tdetermineCardIndex,\n\tisRCSChannel,\n} from '../template-preview/helpers/templateMiscHelper';\nimport { AllTemplateTypes } from '../template-preview/models/types';\nimport { RCSCarousalContainer } from '../template-preview/RCS/RCSPreview.styled';\nimport {\n\tCustomCarouselLeftArrow,\n\tCustomCarouselRightArrow,\n} from './CustomCarouselArrows';\n\nexport const CarouselPreview = React.forwardRef<\n\tHTMLDivElement,\n\t{\n\t\tchannel: CHANNEL_TYPE;\n\t\ttemplate: AllTemplateTypes;\n\t\tshowSampleValues?: boolean;\n\t\tisPreview?: boolean;\n\t\tremoveBottomBorder?: boolean;\n\t\tborderRadius?: string;\n\t\tshowArrows?: boolean;\n\t\thideBorder?: boolean;\n\t}\n>(\n\t({\n\t\tchannel,\n\t\ttemplate,\n\t\tisPreview,\n\t\tremoveBottomBorder,\n\t\tborderRadius,\n\t\tshowArrows,\n\t\thideBorder,\n\t\tshowSampleValues,\n\t}) => {\n\t\tconst {\n\t\t\tsliderRef,\n\t\t\tselectedCarouselIndex,\n\t\t\tcardCount,\n\t\t\tsetIsCarouselHovered,\n\t\t\tcardIndex: cardsIndex,\n\t\t\tshowVariablePicker,\n\t\t} = useTemplateModalContext();\n\n\t\tconst cardIndex =\n\t\t\tcardsIndex == -1 ? determineCardIndex(channel) : cardsIndex;\n\t\tconst cards = (template as WhatsAppCarouselTemplate)?.components?.[\n\t\t\tcardIndex\n\t\t]?.cards;\n\n\t\tconst carouselSlider = cards?.length ? (\n\t\t\t<CarouselSlider\n\t\t\t\tcards={cards}\n\t\t\t\tcardCount={cardCount ?? 0}\n\t\t\t\tselectedCarouselIndex={selectedCarouselIndex ?? -1}\n\t\t\t\tsliderRef={sliderRef}\n\t\t\t\tisPreview={isPreview}\n\t\t\t\tshowArrows={showArrows}\n\t\t\t\tchannel={channel}\n\t\t\t\ttemplate={template as WhatsAppCarouselTemplate}\n\t\t\t\tsetIsCarouselHovered={setIsCarouselHovered}\n\t\t\t\tshowSampleValues={!!showSampleValues}\n\t\t\t\tshowVariablePicker={showVariablePicker}\n\t\t\t/>\n\t\t) : null;\n\n\t\tif (isRCSChannel(channel)) {\n\t\t\treturn (\n\t\t\t\t<RCSCarousalContainer borderRadius={borderRadius}>\n\t\t\t\t\t{carouselSlider}\n\t\t\t\t</RCSCarousalContainer>\n\t\t\t);\n\t\t}\n\n\t\treturn (\n\t\t\t<Container\n\t\t\t\tremoveBottomBorder={removeBottomBorder}\n\t\t\t\tborderRadius={borderRadius}\n\t\t\t\thideBorder={hideBorder}\n\t\t\t>\n\t\t\t\t{(!!template?.['aiContentConfigId'] ||\n\t\t\t\t\t!!template?.['isAiGenerated']) && (\n\t\t\t\t\t<AiContentBadge>\n\t\t\t\t\t\t<AiContentIcon width={48} height={48} />\n\t\t\t\t\t</AiContentBadge>\n\t\t\t\t)}\n\t\t\t\t<CarouselPreviewCard\n\t\t\t\t\tchannel={channel}\n\t\t\t\t\tcurrentTemplate={template}\n\t\t\t\t\tcarouselCardIndex={-1}\n\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\twidth=\"77%\"\n\t\t\t\t/>\n\t\t\t\t{carouselSlider}\n\t\t\t</Container>\n\t\t);\n\t},\n);\n\nconst CarouselSlider = ({\n\tcards,\n\tcardCount,\n\tselectedCarouselIndex,\n\tsliderRef,\n\tisPreview,\n\tshowArrows,\n\tchannel,\n\ttemplate,\n\tsetIsCarouselHovered,\n\tshowSampleValues,\n\tshowVariablePicker,\n}: {\n\tcards: WhatsAppCarouselTemplateCards[];\n\tcardCount: number;\n\tselectedCarouselIndex: number;\n\tsliderRef: any;\n\tisPreview?: boolean;\n\tshowArrows?: boolean;\n\tchannel: CHANNEL_TYPE;\n\ttemplate: WhatsAppCarouselTemplate;\n\tsetIsCarouselHovered?: (value: boolean) => void;\n\tshowSampleValues?: boolean;\n\tshowVariablePicker?: boolean;\n}) => (\n\t<CarouselSlickContainer\n\t\tcardCount={cardCount}\n\t\tselectedCarouselIndex={selectedCarouselIndex}\n\t\tonMouseEnter={() => !showVariablePicker && setIsCarouselHovered?.(true)}\n\t\tonMouseLeave={() => !showVariablePicker && setIsCarouselHovered?.(false)}\n\t>\n\t\t<Slider\n\t\t\tref={sliderRef}\n\t\t\tswipeToSlide\n\t\t\tdraggable\n\t\t\tswipe\n\t\t\tinfinite={false}\n\t\t\tfocusOnSelect={!isPreview}\n\t\t\tcenterMode\n\t\t\tarrows={showArrows}\n\t\t\tadaptiveHeight\n\t\t\tnextArrow={<CustomCarouselRightArrow isPreview={isPreview ?? false} />}\n\t\t\tprevArrow={<CustomCarouselLeftArrow isPreview={isPreview ?? false} />}\n\t\t>\n\t\t\t{cards?.map((carousel, index) => {\n\t\t\t\tconst currentCarousel = {\n\t\t\t\t\tcomponents: carousel.components,\n\t\t\t\t\tmapping: template?.mapping?.cards?.[index],\n\t\t\t\t\tcontent: template?.['content'],\n\t\t\t\t\ttemplateType: template?.['templateType'],\n\t\t\t\t};\n\t\t\t\treturn (\n\t\t\t\t\t<CarouselPreviewCard\n\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\tchannel={channel}\n\t\t\t\t\t\tcurrentTemplate={currentCarousel}\n\t\t\t\t\t\tcarouselCardIndex={index}\n\t\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\t\twidth=\"100%\"\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t})}\n\t\t</Slider>\n\t</CarouselSlickContainer>\n);\n"],"names":["CarouselPreview","React","forwardRef","channel","template","isPreview","removeBottomBorder","borderRadius","showArrows","hideBorder","showSampleValues","sliderRef","selectedCarouselIndex","cardCount","setIsCarouselHovered","cardIndex","cardsIndex","showVariablePicker","useTemplateModalContext","determineCardIndex","cards","_b","_a","components","carouselSlider","length","_jsx","CarouselSlider","isRCSChannel","RCSCarousalContainer","Object","assign","children","_jsxs","Container","AiContentBadge","AiContentIcon","width","height","CarouselPreviewCard","currentTemplate","carouselCardIndex","CarouselSlickContainer","onMouseEnter","onMouseLeave","Slider","ref","swipeToSlide","draggable","swipe","infinite","focusOnSelect","centerMode","arrows","adaptiveHeight","nextArrow","CustomCarouselRightArrow","prevArrow","CustomCarouselLeftArrow","map","carousel","index","currentCarousel","mapping","content","templateType"],"mappings":"6uBA6BaA,EAAkBC,EAAMC,YAapC,EACCC,UACAC,WACAC,YACAC,qBACAC,eACAC,aACAC,aACAC,+BAEA,MAAMC,UACLA,EAASC,sBACTA,EAAqBC,UACrBA,EAASC,qBACTA,EACAC,UAAWC,EAAUC,mBACrBA,GACGC,IAEEH,GACU,GAAfC,EAAmBG,EAAmBhB,GAAWa,EAC5CI,EAEL,QAFaC,EACb,QADcC,EAAAlB,aAAQ,EAARA,EAAuCmB,kBACrD,IAAAD,OAAA,EAAAA,EAAAP,UACA,IAAAM,OAAA,EAAAA,EAAED,MAEGI,GAAiBJ,aAAA,EAAAA,EAAOK,QAC7BC,EAACC,GACAP,MAAOA,EACPP,UAAWA,QAAAA,EAAa,EACxBD,sBAAuBA,QAAAA,GAA0B,EACjDD,UAAWA,EACXN,UAAWA,EACXG,WAAYA,EACZL,QAASA,EACTC,SAAUA,EACVU,qBAAsBA,EACtBJ,mBAAoBA,EACpBO,mBAAoBA,IAElB,KAEJ,OAAIW,EAAazB,GAEfuB,EAACG,EAAqBC,OAAAC,OAAA,CAAAxB,aAAcA,GAClC,CAAAyB,SAAAR,KAMHS,EAACC,EAASJ,OAAAC,OAAA,CACTzB,mBAAoBA,EACpBC,aAAcA,EACdE,WAAYA,GAAU,CAAAuB,SAAA,KAElB5B,aAAQ,EAARA,EAA8B,uBAC/BA,aAAA,EAAAA,EAA0B,iBAC5BsB,EAACS,EAAc,CAAAH,SACdN,EAACU,EAAc,CAAAC,MAAO,GAAIC,OAAQ,OAGpCZ,EAACa,EACA,CAAApC,QAASA,EACTqC,gBAAiBpC,EACjBqC,mBAAoB,EACpBpC,UAAWA,EACXgC,MAAM,QAENb,KACU,IAKTG,EAAiBA,EACtBP,QACAP,YACAD,wBACAD,YACAN,YACAG,aACAL,UACAC,WACAU,uBACAJ,mBACAO,wBAcAS,EAACgB,EACAZ,OAAAC,OAAA,CAAAlB,UAAWA,EACXD,sBAAuBA,EACvB+B,aAAcA,KAAO1B,IAAsBH,aAAoB,EAApBA,GAAuB,IAClE8B,aAAcA,KAAO3B,IAAsBH,aAAoB,EAApBA,GAAuB,KAElE,CAAAkB,SAAAN,EAACmB,EAAMf,OAAAC,OAAA,CACNe,IAAKnC,EACLoC,cACA,EAAAC,aACAC,OAAK,EACLC,UAAU,EACVC,eAAgB9C,EAChB+C,YACA,EAAAC,OAAQ7C,EACR8C,gBAAc,EACdC,UAAW7B,EAAC8B,EAAwB,CAACnD,UAAWA,SAAAA,IAChDoD,UAAW/B,EAACgC,EAAwB,CAAArD,UAAWA,SAAAA,KAAsB,CAAA2B,SAEpEZ,aAAA,EAAAA,EAAOuC,KAAI,CAACC,EAAUC,aACtB,MAAMC,EAAkB,CACvBvC,WAAYqC,EAASrC,WACrBwC,QAAiC,QAAxB1C,EAAiB,QAAjBC,EAAAlB,aAAQ,EAARA,EAAU2D,eAAO,IAAAzC,OAAA,EAAAA,EAAEF,aAAK,IAAAC,OAAA,EAAAA,EAAGwC,GACpCG,QAAS5D,eAAAA,EAAoB,QAC7B6D,aAAc7D,eAAAA,EAAyB,cAExC,OACCsB,EAACa,EAAmB,CAEnBpC,QAASA,EACTqC,gBAAiBsB,EACjBrB,kBAAmBoB,EACnBxD,UAAWA,EACXgC,MAAM,OACN3B,iBAAkBA,GANbmD,EAOJ"}

package/dist/esm/components/carousel-preview/CarouselPreviewCard.js

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import t from"react";import{useTemplateModalContext as p}from"../template-context-mapper/context/templateModalContext.js";import{TemplatePreview as a}from"../template-preview/TemplatePreview.js";import"../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import"../../constants/Theme.js";import"../curtain/CurtainHelper.js";import"../variable-picker-v3/model.js";import"../template-preview/models/TemplateMeta.js";import"../template-preview/models/WhatsAppTemplate.js";import"../template-preview/models/Channels.js";import{determineCardIndex as r}from"../template-preview/helpers/templateMiscHelper.js";const i=t.forwardRef((t=>{let{channel:i,currentTemplate:l,showSampleValues:s,carouselCardIndex:m,isPreview:o,width:n}=t;var d,h,c;const{cardWidth:v,template:w,cardIndex:u}=p(),j=-1==u?r(i):u,f=(null!==(c=null===(h=null===(d=null==w?void 0:w.components)||void 0===d?void 0:d[j].cards)||void 0===h?void 0:h.length)&&void 0!==c?c:0)-1===m?12:0;return e("div",Object.assign({style:{width:n||v,height:(null!=m?m:-1)>-1?"100%":"auto"}},{children:e(a,{showSampleValues:s,template:l,channel:i,size:"small",hideHeader:!0,carouselCardIndex:m,isWhatsappCarousel:!0,isPreview:o,whatsAppSpecificMeta:{templateContainerStyles:{marginRight:f,height:"100%"}}})}))}));export{i as default};
+import{jsx as e}from"react/jsx-runtime";import t from"react";import{useTemplateModalContext as p}from"../template-context-mapper/context/templateModalContext.js";import{TemplatePreview as a}from"../template-preview/TemplatePreview.js";import"../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import"../../constants/Theme.js";import"../curtain/CurtainHelper.js";import"../variable-picker-v3/model.js";import"../template-preview/models/TemplateMeta.js";import"../template-preview/models/WhatsAppTemplate.js";import"../template-preview/models/Channels.js";import{determineCardIndex as r}from"../template-preview/helpers/templateMiscHelper.js";const i=t.forwardRef((({channel:t,currentTemplate:i,showSampleValues:l,carouselCardIndex:s,isPreview:m,width:o})=>{var n,d,h;const{cardWidth:c,template:v,cardIndex:w}=p(),u=-1==w?r(t):w,j=(null!==(h=null===(d=null===(n=null==v?void 0:v.components)||void 0===n?void 0:n[u].cards)||void 0===d?void 0:d.length)&&void 0!==h?h:0)-1===s?12:0;return e("div",Object.assign({style:{width:o||c,height:(null!=s?s:-1)>-1?"100%":"auto"}},{children:e(a,{showSampleValues:l,template:i,channel:t,size:"small",hideHeader:!0,carouselCardIndex:s,isWhatsappCarousel:!0,isPreview:m,whatsAppSpecificMeta:{templateContainerStyles:{marginRight:j,height:"100%"}}})}))}));export{i as default};
 //# sourceMappingURL=CarouselPreviewCard.js.map

package/dist/esm/components/carousel-preview/CarouselPreviewCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"CarouselPreviewCard.js","sources":["../../../../src/components/carousel-preview/CarouselPreviewCard.tsx"],"sourcesContent":["/* eslint-disable react/display-name */\nimport React from 'react';\nimport { useTemplateModalContext } from '@src/components/template-context-mapper/context/templateModalContext';\nimport { TemplatePreview } from '@src/components/template-preview';\nimport { CHANNEL_TYPE } from '@src/components/template-preview/models/Channels';\nimport { WhatsAppCarouselTemplate } from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport { determineCardIndex } from '../template-preview/helpers/templateMiscHelper';\n\nconst CarouselPreviewCard = React.forwardRef<\n\tHTMLDivElement,\n\t{\n\t\tchannel: CHANNEL_TYPE;\n\t\tcurrentTemplate: any;\n\t\tshowSampleValues?: boolean;\n\t\tcarouselCardIndex?: number;\n\t\tisPreview?: boolean;\n\t\twidth?: string;\n\t}\n>(\n\t({\n\t\tchannel,\n\t\tcurrentTemplate,\n\t\tshowSampleValues,\n\t\tcarouselCardIndex,\n\t\tisPreview,\n\t\twidth,\n\t}) => {\n\t\tconst {\n\t\t\tcardWidth,\n\t\t\ttemplate,\n\t\t\tcardIndex: cardInd,\n\t\t} = useTemplateModalContext();\n\t\tconst cardIndex =\n\t\t\tcardInd == -1 ? determineCardIndex(channel) : cardInd;\n\t\tconst marginRight =\n\t\t\t((template as WhatsAppCarouselTemplate)?.components?.[cardIndex].cards\n\t\t\t\t?.length ?? 0) -\n\t\t\t\t1 ===\n\t\t\tcarouselCardIndex\n\t\t\t\t? 12\n\t\t\t\t: 0;\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\twidth: width ? width : cardWidth,\n\t\t\t\t\theight: (carouselCardIndex ?? -1) > -1 ? '100%' : 'auto',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<TemplatePreview\n\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\ttemplate={currentTemplate}\n\t\t\t\t\tchannel={channel}\n\t\t\t\t\tsize={'small'}\n\t\t\t\t\thideHeader\n\t\t\t\t\tcarouselCardIndex={carouselCardIndex}\n\t\t\t\t\tisWhatsappCarousel={true}\n\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\twhatsAppSpecificMeta={{\n\t\t\t\t\t\ttemplateContainerStyles: {\n\t\t\t\t\t\t\tmarginRight: marginRight,\n\t\t\t\t\t\t\theight: '100%',\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);\n\t},\n);\n\nexport default CarouselPreviewCard;\n"],"names":["CarouselPreviewCard","React","forwardRef","_ref","channel","currentTemplate","showSampleValues","carouselCardIndex","isPreview","width","cardWidth","template","cardIndex","cardInd","useTemplateModalContext","determineCardIndex","marginRight","_c","_a","components","cards","_b","length","_jsx","Object","assign","style","height","children","TemplatePreview","size","hideHeader","isWhatsappCarousel","whatsAppSpecificMeta","templateContainerStyles"],"mappings":"isBAQA,MAAMA,EAAsBC,EAAMC,YAWjCC,IAOK,IAPJC,QACAA,EAAOC,gBACPA,EAAeC,iBACfA,EAAgBC,kBAChBA,EAAiBC,UACjBA,EAASC,MACTA,GACAN,YACA,MAAMO,UACLA,EAASC,SACTA,EACAC,UAAWC,GACRC,IACEF,GACO,GAAZC,EAAgBE,EAAmBX,GAAWS,EACzCG,GAEQ,QADZC,EACE,kBADDC,EAAAP,aAAQ,EAARA,EAAuCQ,iCAAaP,GAAWQ,aAC9D,IAAAC,OAAA,EAAAA,EAAAC,cAAU,IAAAL,EAAAA,EAAA,GACZ,IACDV,EACG,GACA,EACJ,OACCgB,EACC,MAAAC,OAAAC,OAAA,CAAAC,MAAO,CACNjB,MAAOA,GAAgBC,EACvBiB,QAASpB,QAAAA,GAAsB,IAAM,EAAI,OAAS,SAClD,CAAAqB,SAEDL,EAACM,EACA,CAAAvB,iBAAkBA,EAClBK,SAAUN,EACVD,QAASA,EACT0B,KAAM,QACNC,YAAU,EACVxB,kBAAmBA,EACnByB,oBAAoB,EACpBxB,UAAWA,EACXyB,qBAAsB,CACrBC,wBAAyB,CACxBlB,YAAaA,EACbW,OAAQ,aAIN"}
+{"version":3,"file":"CarouselPreviewCard.js","sources":["../../../../src/components/carousel-preview/CarouselPreviewCard.tsx"],"sourcesContent":["/* eslint-disable react/display-name */\nimport React from 'react';\nimport { useTemplateModalContext } from '@src/components/template-context-mapper/context/templateModalContext';\nimport { TemplatePreview } from '@src/components/template-preview';\nimport { CHANNEL_TYPE } from '@src/components/template-preview/models/Channels';\nimport { WhatsAppCarouselTemplate } from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport { determineCardIndex } from '../template-preview/helpers/templateMiscHelper';\n\nconst CarouselPreviewCard = React.forwardRef<\n\tHTMLDivElement,\n\t{\n\t\tchannel: CHANNEL_TYPE;\n\t\tcurrentTemplate: any;\n\t\tshowSampleValues?: boolean;\n\t\tcarouselCardIndex?: number;\n\t\tisPreview?: boolean;\n\t\twidth?: string;\n\t}\n>(\n\t({\n\t\tchannel,\n\t\tcurrentTemplate,\n\t\tshowSampleValues,\n\t\tcarouselCardIndex,\n\t\tisPreview,\n\t\twidth,\n\t}) => {\n\t\tconst {\n\t\t\tcardWidth,\n\t\t\ttemplate,\n\t\t\tcardIndex: cardInd,\n\t\t} = useTemplateModalContext();\n\t\tconst cardIndex =\n\t\t\tcardInd == -1 ? determineCardIndex(channel) : cardInd;\n\t\tconst marginRight =\n\t\t\t((template as WhatsAppCarouselTemplate)?.components?.[cardIndex].cards\n\t\t\t\t?.length ?? 0) -\n\t\t\t\t1 ===\n\t\t\tcarouselCardIndex\n\t\t\t\t? 12\n\t\t\t\t: 0;\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\twidth: width ? width : cardWidth,\n\t\t\t\t\theight: (carouselCardIndex ?? -1) > -1 ? '100%' : 'auto',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<TemplatePreview\n\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\ttemplate={currentTemplate}\n\t\t\t\t\tchannel={channel}\n\t\t\t\t\tsize={'small'}\n\t\t\t\t\thideHeader\n\t\t\t\t\tcarouselCardIndex={carouselCardIndex}\n\t\t\t\t\tisWhatsappCarousel={true}\n\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\twhatsAppSpecificMeta={{\n\t\t\t\t\t\ttemplateContainerStyles: {\n\t\t\t\t\t\t\tmarginRight: marginRight,\n\t\t\t\t\t\t\theight: '100%',\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);\n\t},\n);\n\nexport default CarouselPreviewCard;\n"],"names":["CarouselPreviewCard","React","forwardRef","channel","currentTemplate","showSampleValues","carouselCardIndex","isPreview","width","cardWidth","template","cardIndex","cardInd","useTemplateModalContext","determineCardIndex","marginRight","_c","_a","components","cards","_b","length","_jsx","Object","assign","style","height","children","TemplatePreview","size","hideHeader","isWhatsappCarousel","whatsAppSpecificMeta","templateContainerStyles"],"mappings":"isBAQA,MAAMA,EAAsBC,EAAMC,YAWjC,EACCC,UACAC,kBACAC,mBACAC,oBACAC,YACAC,sBAEA,MAAMC,UACLA,EAASC,SACTA,EACAC,UAAWC,GACRC,IACEF,GACO,GAAZC,EAAgBE,EAAmBX,GAAWS,EACzCG,GAEQ,QADZC,EACE,kBADDC,EAAAP,aAAQ,EAARA,EAAuCQ,iCAAaP,GAAWQ,aAC9D,IAAAC,OAAA,EAAAA,EAAAC,cAAU,IAAAL,EAAAA,EAAA,GACZ,IACDV,EACG,GACA,EACJ,OACCgB,EACC,MAAAC,OAAAC,OAAA,CAAAC,MAAO,CACNjB,MAAOA,GAAgBC,EACvBiB,QAASpB,QAAAA,GAAsB,IAAM,EAAI,OAAS,SAClD,CAAAqB,SAEDL,EAACM,EACA,CAAAvB,iBAAkBA,EAClBK,SAAUN,EACVD,QAASA,EACT0B,KAAM,QACNC,YAAU,EACVxB,kBAAmBA,EACnByB,oBAAoB,EACpBxB,UAAWA,EACXyB,qBAAsB,CACrBC,wBAAyB,CACxBlB,YAAaA,EACbW,OAAQ,aAIN"}

package/dist/esm/components/carousel-secondary/CarouselSecondary.js

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import r from"../../assets/icons/chevronLeft2.svg.js";import s from"../../assets/icons/chevronLeft.svg.js";import o from"../../assets/icons/chevronRight2.svg.js";import i from"../../assets/icons/chevronRight.svg.js";import{useState as n,useRef as l,useEffect as c}from"react";import{Button as a}from"../button/Button.js";import{CarouselContainer as m,CarouselBody as g,CarouselPage as d,CarouselFooter as h,PageIndicator as p,Indicator as v}from"./CarouselSecondary.style.js";import{CarouselVersion as u}from"./model.js";export{CarouselVersion}from"./model.js";const f=f=>{let{pages:b,onComplete:j,textAlign:y,version:V,onCompleteText:x}=f;const[C,T]=n(0),k=l(null);return c((()=>{k.current&&k.current.scrollTo({left:k.current.offsetWidth*C,behavior:"smooth"})}),[C]),e(m,Object.assign({version:V||u.V1},{children:[t(g,Object.assign({ref:k,textAlign:y},{children:b.map(((e,r)=>t(d,Object.assign({isActive:r===C},{children:e}),r)))})),e(h,Object.assign({version:V||u.V1},{children:[t("div",Object.assign({style:{visibility:V===u.V2&&0===C?"hidden":"visible"}},{children:t(a,{buttonText:"Back",buttonType:"tertiaryGray",onClick:()=>{T((e=>0===e?e:e-1))},size:V===u.V2?"small":"medium",LeadingIcon:V===u.V2?r:s,disabled:!C})})),t(p,{children:b.map(((e,r)=>t(v,{isActive:r===C,version:V||u.V1,onClick:()=>{T(r)}},r)))}),t(a,{buttonText:C===b.length-1?x||"Get started":"Next",buttonType:C===b.length-1||V===u.V2?"tertiary":"tertiaryGray",onClick:()=>{T((e=>e===b.length-1?e:e+1)),C===b.length-1&&j()},size:V===u.V2?"small":"medium",TrailingIcon:C<b.length-1?V===u.V2?o:i:void 0,style:V===u.V2?{}:{background:"transparent"}})]}))]}))};export{f as CarouselSecondary};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import r from"../../assets/icons/chevronLeft2.svg.js";import s from"../../assets/icons/chevronLeft.svg.js";import o from"../../assets/icons/chevronRight2.svg.js";import i from"../../assets/icons/chevronRight.svg.js";import{useState as n,useRef as l,useEffect as c}from"react";import{Button as a}from"../button/Button.js";import{CarouselContainer as m,CarouselBody as g,CarouselPage as d,CarouselFooter as h,PageIndicator as p,Indicator as v}from"./CarouselSecondary.style.js";import{CarouselVersion as u}from"./model.js";export{CarouselVersion}from"./model.js";const f=({pages:f,onComplete:b,textAlign:j,version:y,onCompleteText:V})=>{const[x,C]=n(0),T=l(null);return c((()=>{T.current&&T.current.scrollTo({left:T.current.offsetWidth*x,behavior:"smooth"})}),[x]),e(m,Object.assign({version:y||u.V1},{children:[t(g,Object.assign({ref:T,textAlign:j},{children:f.map(((e,r)=>t(d,Object.assign({isActive:r===x},{children:e}),r)))})),e(h,Object.assign({version:y||u.V1},{children:[t("div",Object.assign({style:{visibility:y===u.V2&&0===x?"hidden":"visible"}},{children:t(a,{buttonText:"Back",buttonType:"tertiaryGray",onClick:()=>{C((e=>0===e?e:e-1))},size:y===u.V2?"small":"medium",LeadingIcon:y===u.V2?r:s,disabled:!x})})),t(p,{children:f.map(((e,r)=>t(v,{isActive:r===x,version:y||u.V1,onClick:()=>{C(r)}},r)))}),t(a,{buttonText:x===f.length-1?V||"Get started":"Next",buttonType:x===f.length-1||y===u.V2?"tertiary":"tertiaryGray",onClick:()=>{C((e=>e===f.length-1?e:e+1)),x===f.length-1&&b()},size:y===u.V2?"small":"medium",TrailingIcon:x<f.length-1?y===u.V2?o:i:void 0,style:y===u.V2?{}:{background:"transparent"}})]}))]}))};export{f as CarouselSecondary};
 //# sourceMappingURL=CarouselSecondary.js.map

package/dist/esm/components/carousel-secondary/CarouselSecondary.js.map

@@ -1 +1 @@
-{"version":3,"file":"CarouselSecondary.js","sources":["../../../../src/components/carousel-secondary/CarouselSecondary.tsx"],"sourcesContent":["import ChevronLeftIcon2 from '@src/assets/icons/chevronLeft2.svg';\nimport ChevronLeftIcon from '@src/assets/icons/chevronLeft.svg';\nimport ChevronRightIcon2 from '@src/assets/icons/chevronRight2.svg';\nimport ChevronRightIcon from '@src/assets/icons/chevronRight.svg';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { Button } from '@src/components/button/Button';\nimport {\n\tCarouselBody,\n\tCarouselContainer,\n\tCarouselFooter,\n\tCarouselPage,\n\tIndicator,\n\tPageIndicator,\n} from './CarouselSecondary.style';\nimport { CarouselVersion } from './model';\n\nexport interface CarouselProps {\n\tpages: Array<React.FunctionComponent<React.SVGAttributes<SVGElement>> | any>;\n\tonComplete: () => void;\n\ttextAlign?: string;\n\tversion?: CarouselVersion;\n\tonCompleteText?: string;\n}\n\nexport const CarouselSecondary: React.FC<CarouselProps> = ({\n\tpages,\n\tonComplete,\n\ttextAlign,\n\tversion,\n\tonCompleteText,\n}) => {\n\tconst [currentPage, setCurrentPage] = useState(0);\n\tconst carouselRef = useRef<HTMLDivElement>(null);\n\n\tconst handleNextPage = () => {\n\t\tsetCurrentPage((prevPage) =>\n\t\t\tprevPage === pages.length - 1 ? prevPage : prevPage + 1,\n\t\t);\n\t\tif (currentPage === pages.length - 1) onComplete();\n\t};\n\n\tconst handlePrevPage = () => {\n\t\tsetCurrentPage((prevPage) => (prevPage === 0 ? prevPage : prevPage - 1));\n\t};\n\n\tconst handlePageClick = (pageIndex) => {\n\t\tsetCurrentPage(pageIndex);\n\t};\n\n\tuseEffect(() => {\n\t\tif (carouselRef.current) {\n\t\t\tcarouselRef.current.scrollTo({\n\t\t\t\tleft: carouselRef.current.offsetWidth * currentPage,\n\t\t\t\tbehavior: 'smooth',\n\t\t\t});\n\t\t}\n\t}, [currentPage]);\n\n\treturn (\n\t\t<CarouselContainer version={version ? version : CarouselVersion.V1}>\n\t\t\t<CarouselBody ref={carouselRef} textAlign={textAlign}>\n\t\t\t\t{pages.map((page, index) => (\n\t\t\t\t\t<CarouselPage key={index} isActive={index === currentPage}>\n\t\t\t\t\t\t{page}\n\t\t\t\t\t</CarouselPage>\n\t\t\t\t))}\n\t\t\t</CarouselBody>\n\t\t\t<CarouselFooter version={version ? version : CarouselVersion.V1}>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tvisibility:\n\t\t\t\t\t\t\tversion === CarouselVersion.V2 && currentPage === 0\n\t\t\t\t\t\t\t\t? 'hidden'\n\t\t\t\t\t\t\t\t: 'visible',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Back'}\n\t\t\t\t\t\tbuttonType={'tertiaryGray'}\n\t\t\t\t\t\tonClick={handlePrevPage}\n\t\t\t\t\t\tsize={version === CarouselVersion.V2 ? 'small' : 'medium'}\n\t\t\t\t\t\tLeadingIcon={\n\t\t\t\t\t\t\tversion === CarouselVersion.V2\n\t\t\t\t\t\t\t\t? ChevronLeftIcon2\n\t\t\t\t\t\t\t\t: ChevronLeftIcon\n\t\t\t\t\t\t}\n\t\t\t\t\t\tdisabled={!currentPage}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<PageIndicator>\n\t\t\t\t\t{pages.map((_, index) => (\n\t\t\t\t\t\t<Indicator\n\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\tisActive={index === currentPage}\n\t\t\t\t\t\t\tversion={version ? version : CarouselVersion.V1}\n\t\t\t\t\t\t\tonClick={() => handlePageClick(index)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</PageIndicator>\n\t\t\t\t<Button\n\t\t\t\t\tbuttonText={\n\t\t\t\t\t\tcurrentPage === pages.length - 1\n\t\t\t\t\t\t\t? onCompleteText\n\t\t\t\t\t\t\t\t? onCompleteText\n\t\t\t\t\t\t\t\t: 'Get started'\n\t\t\t\t\t\t\t: 'Next'\n\t\t\t\t\t}\n\t\t\t\t\tbuttonType={\n\t\t\t\t\t\tcurrentPage === pages.length - 1\n\t\t\t\t\t\t\t? 'tertiary'\n\t\t\t\t\t\t\t: version === CarouselVersion.V2\n\t\t\t\t\t\t\t? 'tertiary'\n\t\t\t\t\t\t\t: 'tertiaryGray'\n\t\t\t\t\t}\n\t\t\t\t\tonClick={handleNextPage}\n\t\t\t\t\tsize={version === CarouselVersion.V2 ? 'small' : 'medium'}\n\t\t\t\t\tTrailingIcon={\n\t\t\t\t\t\tcurrentPage < pages.length - 1\n\t\t\t\t\t\t\t? version === CarouselVersion.V2\n\t\t\t\t\t\t\t\t? ChevronRightIcon2\n\t\t\t\t\t\t\t\t: ChevronRightIcon\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tstyle={\n\t\t\t\t\t\tversion === CarouselVersion.V2 ? {} : { background: 'transparent' }\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</CarouselFooter>\n\t\t</CarouselContainer>\n\t);\n};\nexport { CarouselVersion };\n"],"names":["CarouselSecondary","_ref","pages","onComplete","textAlign","version","onCompleteText","currentPage","setCurrentPage","useState","carouselRef","useRef","useEffect","current","scrollTo","left","offsetWidth","behavior","_jsxs","CarouselContainer","Object","assign","CarouselVersion","V1","children","_jsx","CarouselBody","ref","map","page","index","CarouselPage","isActive","CarouselFooter","style","visibility","V2","Button","buttonText","buttonType","onClick","handlePrevPage","prevPage","size","LeadingIcon","ChevronLeftIcon2","ChevronLeftIcon","disabled","PageIndicator","_","Indicator","length","handleNextPage","TrailingIcon","ChevronRightIcon2","ChevronRightIcon","undefined","background"],"mappings":"mmBAwBaA,MAAAA,EAA6CC,IAMrD,IANsDC,MAC1DA,EAAKC,WACLA,EAAUC,UACVA,EAASC,QACTA,EAAOC,eACPA,GACAL,EACA,MAAOM,EAAaC,GAAkBC,EAAS,GACzCC,EAAcC,EAAuB,MA0B3C,OATAC,GAAU,KACLF,EAAYG,SACfH,EAAYG,QAAQC,SAAS,CAC5BC,KAAML,EAAYG,QAAQG,YAAcT,EACxCU,SAAU,UAEX,GACC,CAACV,IAGHW,EAACC,EAAkBC,OAAAC,OAAA,CAAAhB,QAASA,GAAoBiB,EAAgBC,IAAE,CAAAC,SAAA,CACjEC,EAACC,iBAAaC,IAAKjB,EAAaN,UAAWA,GACzC,CAAAoB,SAAAtB,EAAM0B,KAAI,CAACC,EAAMC,IACjBL,EAACM,EAAyBX,OAAAC,OAAA,CAAAW,SAAUF,IAAUvB,GAAW,CAAAiB,SACvDK,IADiBC,QAKrBZ,EAACe,iBAAe5B,QAASA,GAAoBiB,EAAgBC,IAC5D,CAAAC,SAAA,CAAAC,EAAA,MAAAL,OAAAC,OAAA,CACCa,MAAO,CACNC,WACC9B,IAAYiB,EAAgBc,IAAsB,IAAhB7B,EAC/B,SACA,YACJ,CAAAiB,SAEDC,EAACY,EAAM,CACNC,WAAY,OACZC,WAAY,eACZC,QAtCkBC,KACtBjC,GAAgBkC,GAA2B,IAAbA,EAAiBA,EAAWA,EAAW,GAAG,EAsCpEC,KAAMtC,IAAYiB,EAAgBc,GAAK,QAAU,SACjDQ,YACCvC,IAAYiB,EAAgBc,GACzBS,EACAC,EAEJC,UAAWxC,OAGbkB,EAACuB,EACC,CAAAxB,SAAAtB,EAAM0B,KAAI,CAACqB,EAAGnB,IACdL,EAACyB,EAEA,CAAAlB,SAAUF,IAAUvB,EACpBF,QAASA,GAAoBiB,EAAgBC,GAC7CiB,QAASA,KAjDdhC,EAiDoCsB,EAH1B,GAAAA,OAORL,EAACY,EAAM,CACNC,WACC/B,IAAgBL,EAAMiD,OAAS,EAC5B7C,GAEC,cACD,OAEJiC,WACChC,IAAgBL,EAAMiD,OAAS,GAE5B9C,IAAYiB,EAAgBc,GAD5B,WAGA,eAEJI,QAhFmBY,KACtB5C,GAAgBkC,GACfA,IAAaxC,EAAMiD,OAAS,EAAIT,EAAWA,EAAW,IAEnDnC,IAAgBL,EAAMiD,OAAS,GAAGhD,GAAY,EA6E/CwC,KAAMtC,IAAYiB,EAAgBc,GAAK,QAAU,SACjDiB,aACC9C,EAAcL,EAAMiD,OAAS,EAC1B9C,IAAYiB,EAAgBc,GAC3BkB,EACAC,OACDC,EAEJtB,MACC7B,IAAYiB,EAAgBc,GAAK,CAAA,EAAK,CAAEqB,WAAY,wBAIpC"}
+{"version":3,"file":"CarouselSecondary.js","sources":["../../../../src/components/carousel-secondary/CarouselSecondary.tsx"],"sourcesContent":["import ChevronLeftIcon2 from '@src/assets/icons/chevronLeft2.svg';\nimport ChevronLeftIcon from '@src/assets/icons/chevronLeft.svg';\nimport ChevronRightIcon2 from '@src/assets/icons/chevronRight2.svg';\nimport ChevronRightIcon from '@src/assets/icons/chevronRight.svg';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { Button } from '@src/components/button/Button';\nimport {\n\tCarouselBody,\n\tCarouselContainer,\n\tCarouselFooter,\n\tCarouselPage,\n\tIndicator,\n\tPageIndicator,\n} from './CarouselSecondary.style';\nimport { CarouselVersion } from './model';\n\nexport interface CarouselProps {\n\tpages: Array<React.FunctionComponent<React.SVGAttributes<SVGElement>> | any>;\n\tonComplete: () => void;\n\ttextAlign?: string;\n\tversion?: CarouselVersion;\n\tonCompleteText?: string;\n}\n\nexport const CarouselSecondary: React.FC<CarouselProps> = ({\n\tpages,\n\tonComplete,\n\ttextAlign,\n\tversion,\n\tonCompleteText,\n}) => {\n\tconst [currentPage, setCurrentPage] = useState(0);\n\tconst carouselRef = useRef<HTMLDivElement>(null);\n\n\tconst handleNextPage = () => {\n\t\tsetCurrentPage((prevPage) =>\n\t\t\tprevPage === pages.length - 1 ? prevPage : prevPage + 1,\n\t\t);\n\t\tif (currentPage === pages.length - 1) onComplete();\n\t};\n\n\tconst handlePrevPage = () => {\n\t\tsetCurrentPage((prevPage) => (prevPage === 0 ? prevPage : prevPage - 1));\n\t};\n\n\tconst handlePageClick = (pageIndex) => {\n\t\tsetCurrentPage(pageIndex);\n\t};\n\n\tuseEffect(() => {\n\t\tif (carouselRef.current) {\n\t\t\tcarouselRef.current.scrollTo({\n\t\t\t\tleft: carouselRef.current.offsetWidth * currentPage,\n\t\t\t\tbehavior: 'smooth',\n\t\t\t});\n\t\t}\n\t}, [currentPage]);\n\n\treturn (\n\t\t<CarouselContainer version={version ? version : CarouselVersion.V1}>\n\t\t\t<CarouselBody ref={carouselRef} textAlign={textAlign}>\n\t\t\t\t{pages.map((page, index) => (\n\t\t\t\t\t<CarouselPage key={index} isActive={index === currentPage}>\n\t\t\t\t\t\t{page}\n\t\t\t\t\t</CarouselPage>\n\t\t\t\t))}\n\t\t\t</CarouselBody>\n\t\t\t<CarouselFooter version={version ? version : CarouselVersion.V1}>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tvisibility:\n\t\t\t\t\t\t\tversion === CarouselVersion.V2 && currentPage === 0\n\t\t\t\t\t\t\t\t? 'hidden'\n\t\t\t\t\t\t\t\t: 'visible',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Back'}\n\t\t\t\t\t\tbuttonType={'tertiaryGray'}\n\t\t\t\t\t\tonClick={handlePrevPage}\n\t\t\t\t\t\tsize={version === CarouselVersion.V2 ? 'small' : 'medium'}\n\t\t\t\t\t\tLeadingIcon={\n\t\t\t\t\t\t\tversion === CarouselVersion.V2\n\t\t\t\t\t\t\t\t? ChevronLeftIcon2\n\t\t\t\t\t\t\t\t: ChevronLeftIcon\n\t\t\t\t\t\t}\n\t\t\t\t\t\tdisabled={!currentPage}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<PageIndicator>\n\t\t\t\t\t{pages.map((_, index) => (\n\t\t\t\t\t\t<Indicator\n\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\tisActive={index === currentPage}\n\t\t\t\t\t\t\tversion={version ? version : CarouselVersion.V1}\n\t\t\t\t\t\t\tonClick={() => handlePageClick(index)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</PageIndicator>\n\t\t\t\t<Button\n\t\t\t\t\tbuttonText={\n\t\t\t\t\t\tcurrentPage === pages.length - 1\n\t\t\t\t\t\t\t? onCompleteText\n\t\t\t\t\t\t\t\t? onCompleteText\n\t\t\t\t\t\t\t\t: 'Get started'\n\t\t\t\t\t\t\t: 'Next'\n\t\t\t\t\t}\n\t\t\t\t\tbuttonType={\n\t\t\t\t\t\tcurrentPage === pages.length - 1\n\t\t\t\t\t\t\t? 'tertiary'\n\t\t\t\t\t\t\t: version === CarouselVersion.V2\n\t\t\t\t\t\t\t? 'tertiary'\n\t\t\t\t\t\t\t: 'tertiaryGray'\n\t\t\t\t\t}\n\t\t\t\t\tonClick={handleNextPage}\n\t\t\t\t\tsize={version === CarouselVersion.V2 ? 'small' : 'medium'}\n\t\t\t\t\tTrailingIcon={\n\t\t\t\t\t\tcurrentPage < pages.length - 1\n\t\t\t\t\t\t\t? version === CarouselVersion.V2\n\t\t\t\t\t\t\t\t? ChevronRightIcon2\n\t\t\t\t\t\t\t\t: ChevronRightIcon\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tstyle={\n\t\t\t\t\t\tversion === CarouselVersion.V2 ? {} : { background: 'transparent' }\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</CarouselFooter>\n\t\t</CarouselContainer>\n\t);\n};\nexport { CarouselVersion };\n"],"names":["CarouselSecondary","pages","onComplete","textAlign","version","onCompleteText","currentPage","setCurrentPage","useState","carouselRef","useRef","useEffect","current","scrollTo","left","offsetWidth","behavior","_jsxs","CarouselContainer","Object","assign","CarouselVersion","V1","children","_jsx","CarouselBody","ref","map","page","index","CarouselPage","isActive","CarouselFooter","style","visibility","V2","Button","buttonText","buttonType","onClick","handlePrevPage","prevPage","size","LeadingIcon","ChevronLeftIcon2","ChevronLeftIcon","disabled","PageIndicator","_","Indicator","length","handleNextPage","TrailingIcon","ChevronRightIcon2","ChevronRightIcon","undefined","background"],"mappings":"mmBAwBO,MAAMA,EAA6CA,EACzDC,QACAC,aACAC,YACAC,UACAC,qBAEA,MAAOC,EAAaC,GAAkBC,EAAS,GACzCC,EAAcC,EAAuB,MA0B3C,OATAC,GAAU,KACLF,EAAYG,SACfH,EAAYG,QAAQC,SAAS,CAC5BC,KAAML,EAAYG,QAAQG,YAAcT,EACxCU,SAAU,UAEX,GACC,CAACV,IAGHW,EAACC,EAAkBC,OAAAC,OAAA,CAAAhB,QAASA,GAAoBiB,EAAgBC,IAAE,CAAAC,SAAA,CACjEC,EAACC,iBAAaC,IAAKjB,EAAaN,UAAWA,GACzC,CAAAoB,SAAAtB,EAAM0B,KAAI,CAACC,EAAMC,IACjBL,EAACM,EAAyBX,OAAAC,OAAA,CAAAW,SAAUF,IAAUvB,GAAW,CAAAiB,SACvDK,IADiBC,QAKrBZ,EAACe,iBAAe5B,QAASA,GAAoBiB,EAAgBC,IAC5D,CAAAC,SAAA,CAAAC,EAAA,MAAAL,OAAAC,OAAA,CACCa,MAAO,CACNC,WACC9B,IAAYiB,EAAgBc,IAAsB,IAAhB7B,EAC/B,SACA,YACJ,CAAAiB,SAEDC,EAACY,EAAM,CACNC,WAAY,OACZC,WAAY,eACZC,QAtCkBC,KACtBjC,GAAgBkC,GAA2B,IAAbA,EAAiBA,EAAWA,EAAW,GAAG,EAsCpEC,KAAMtC,IAAYiB,EAAgBc,GAAK,QAAU,SACjDQ,YACCvC,IAAYiB,EAAgBc,GACzBS,EACAC,EAEJC,UAAWxC,OAGbkB,EAACuB,EACC,CAAAxB,SAAAtB,EAAM0B,KAAI,CAACqB,EAAGnB,IACdL,EAACyB,EAEA,CAAAlB,SAAUF,IAAUvB,EACpBF,QAASA,GAAoBiB,EAAgBC,GAC7CiB,QAASA,KAjDdhC,EAiDoCsB,EAH1B,GAAAA,OAORL,EAACY,EAAM,CACNC,WACC/B,IAAgBL,EAAMiD,OAAS,EAC5B7C,GAEC,cACD,OAEJiC,WACChC,IAAgBL,EAAMiD,OAAS,GAE5B9C,IAAYiB,EAAgBc,GAD5B,WAGA,eAEJI,QAhFmBY,KACtB5C,GAAgBkC,GACfA,IAAaxC,EAAMiD,OAAS,EAAIT,EAAWA,EAAW,IAEnDnC,IAAgBL,EAAMiD,OAAS,GAAGhD,GAAY,EA6E/CwC,KAAMtC,IAAYiB,EAAgBc,GAAK,QAAU,SACjDiB,aACC9C,EAAcL,EAAMiD,OAAS,EAC1B9C,IAAYiB,EAAgBc,GAC3BkB,EACAC,OACDC,EAEJtB,MACC7B,IAAYiB,EAAgBc,GAAK,CAAA,EAAK,CAAEqB,WAAY,wBAIpC"}

package/dist/esm/components/code-block/CodeBlock.js

@@ -1,2 +1,2 @@
-import{__awaiter as e}from"../../_virtual/_tslib.js";import{jsxs as t,jsx as o,Fragment as i}from"react/jsx-runtime";import{useState as r,useEffect as s}from"react";import{Toaster as c}from"../toaster/Toaster.js";import{Container as d,Header as n,TitleSection as a,Title as l,LanguageBadge as m,CopyButton as h,CodeContainer as p,LineNumbers as g,Code as u}from"./CodeBlock.styled.js";import{highlightCode as j}from"./CodeBlockHelper.js";import{CodeLanguage as b}from"./types.js";const f=f=>{let{code:v="",language:y=b.JAVASCRIPT,title:C="",hideLineNumbers:x=!1,maxHeight:O="400px",maxWidth:M,theme:H="dark",hideHeader:T=!1,hideCopy:k=!1}=f;const[_,L]=r(!1),[w,B]=r(!1),[F,S]=r("success"),[A,I]=r(v);s((()=>{let t=!0;return e(void 0,void 0,void 0,(function*(){try{const e=yield import(`./languageSpecificFormatting/${y}_file.ts`);if((null==e?void 0:e.format)&&t)return void I(e.format(v))}catch(e){}t&&I(v)})),()=>{t=!1}}),[v,y]);const P=A.split("\n");return t(d,Object.assign({themeMode:H,maxWidth:M},{children:[!T&&t(n,Object.assign({themeMode:H},{children:[t(a,{children:[!!C&&C&&o(l,Object.assign({themeMode:H},{children:C})),o(m,Object.assign({bg:(W=y,{javascript:"#FEC02D",python:"#3776ab",java:"#ed8b00",css:"#1572b6",html:"#e34c26",json:"#000000"}[W.toLowerCase()]||("dark"===H?"#6e7681":"#656d76")),color:(e=>{const t={javascript:"#000"};return(null==t?void 0:t[e.toLowerCase()])||"#fff"})(y)},{children:y}))]}),!k&&o(h,Object.assign({themeMode:H,onClick:()=>e(void 0,void 0,void 0,(function*(){try{yield navigator.clipboard.writeText(v),L(!0),S("success"),B(!0),setTimeout((()=>L(!1)),2e3)}catch(e){S("error"),B(!0)}}))},{children:o(i,_?{children:"✓ Copied"}:{children:"Copy"})}))]})),t(p,Object.assign({maxHeight:O},{children:[!x&&o(g,Object.assign({themeMode:H},{children:P.map(((e,t)=>o("div",{children:t+1},t)))})),o(u,Object.assign({themeMode:H},{children:P.map(((e,t)=>o("div",{style:{minHeight:e.trim()?"20px":"0px"},dangerouslySetInnerHTML:{__html:j(e,y,H)||" "}},t)))}))]})),w&&o(c,{text:"success"===F?"Code copied to clipboard!":"Failed to copy code",autoClose:2e3,type:F,hideProgressBar:!0,onCloseToast:()=>B(!1)})]}));var W};export{f as CodeBlock};
+import{__awaiter as e}from"../../_virtual/_tslib.js";import{jsxs as t,jsx as o,Fragment as i}from"react/jsx-runtime";import{useState as r,useEffect as s}from"react";import{Toaster as c}from"../toaster/Toaster.js";import{Container as d,Header as n,TitleSection as a,Title as l,LanguageBadge as m,CopyButton as h,CodeContainer as p,LineNumbers as g,Code as u}from"./CodeBlock.styled.js";import{highlightCode as j}from"./CodeBlockHelper.js";import{CodeLanguage as b}from"./types.js";const f=({code:f="",language:v=b.JAVASCRIPT,title:y="",hideLineNumbers:C=!1,maxHeight:x="400px",maxWidth:O,theme:M="dark",hideHeader:H=!1,hideCopy:T=!1})=>{const[k,_]=r(!1),[L,w]=r(!1),[B,F]=r("success"),[S,A]=r(f);s((()=>{let t=!0;return e(void 0,void 0,void 0,(function*(){try{const e=yield import(`./languageSpecificFormatting/${v}_file.ts`);if((null==e?void 0:e.format)&&t)return void A(e.format(f))}catch(e){}t&&A(f)})),()=>{t=!1}}),[f,v]);const I=S.split("\n");return t(d,Object.assign({themeMode:M,maxWidth:O},{children:[!H&&t(n,Object.assign({themeMode:M},{children:[t(a,{children:[!!y&&y&&o(l,Object.assign({themeMode:M},{children:y})),o(m,Object.assign({bg:(P=v,{javascript:"#FEC02D",python:"#3776ab",java:"#ed8b00",css:"#1572b6",html:"#e34c26",json:"#000000"}[P.toLowerCase()]||("dark"===M?"#6e7681":"#656d76")),color:(e=>{const t={javascript:"#000"};return(null==t?void 0:t[e.toLowerCase()])||"#fff"})(v)},{children:v}))]}),!T&&o(h,Object.assign({themeMode:M,onClick:()=>e(void 0,void 0,void 0,(function*(){try{yield navigator.clipboard.writeText(f),_(!0),F("success"),w(!0),setTimeout((()=>_(!1)),2e3)}catch(e){F("error"),w(!0)}}))},{children:o(i,k?{children:"✓ Copied"}:{children:"Copy"})}))]})),t(p,Object.assign({maxHeight:x},{children:[!C&&o(g,Object.assign({themeMode:M},{children:I.map(((e,t)=>o("div",{children:t+1},t)))})),o(u,Object.assign({themeMode:M},{children:I.map(((e,t)=>o("div",{style:{minHeight:e.trim()?"20px":"0px"},dangerouslySetInnerHTML:{__html:j(e,v,M)||" "}},t)))}))]})),L&&o(c,{text:"success"===B?"Code copied to clipboard!":"Failed to copy code",autoClose:2e3,type:B,hideProgressBar:!0,onCloseToast:()=>w(!1)})]}));var P};export{f as CodeBlock};
 //# sourceMappingURL=CodeBlock.js.map

package/dist/esm/components/code-block/CodeBlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"CodeBlock.js","sources":["../../../../src/components/code-block/CodeBlock.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { Toaster } from '@src/components/toaster/Toaster';\nimport {\n\tCode,\n\tCodeContainer,\n\tContainer,\n\tCopyButton,\n\tHeader,\n\tLanguageBadge,\n\tLineNumbers,\n\tTitle,\n\tTitleSection,\n} from './CodeBlock.styled';\nimport { highlightCode } from './CodeBlockHelper';\nimport { CodeBlockProps, CodeLanguage } from './types';\n\n// optional types extraction\n\nexport const CodeBlock = ({\n\tcode = '',\n\tlanguage = CodeLanguage.JAVASCRIPT,\n\ttitle = '',\n\thideLineNumbers = false,\n\tmaxHeight = '400px',\n\tmaxWidth,\n\ttheme = 'dark',\n\thideHeader = false,\n\thideCopy = false,\n}: CodeBlockProps) => {\n\tconst [copied, setCopied] = useState(false);\n\tconst [showToaster, setShowToaster] = useState(false);\n\tconst [toasterType, setToasterType] = useState<'success' | 'error'>(\n\t\t'success',\n\t);\n\n\tconst handleCopy = async () => {\n\t\ttry {\n\t\t\tawait navigator.clipboard.writeText(code);\n\t\t\tsetCopied(true);\n\t\t\tsetToasterType('success');\n\t\t\tsetShowToaster(true);\n\t\t\tsetTimeout(() => setCopied(false), 2000);\n\t\t} catch (err) {\n\t\t\tsetToasterType('error');\n\t\t\tsetShowToaster(true);\n\t\t}\n\t};\n\n\t// Apply language-specific formatting\n\tconst [formattedCode, setFormattedCode] = useState(code);\n\n\tuseEffect(() => {\n\t\tlet isMounted = true;\n\t\tconst formatCode = async () => {\n\t\t\ttry {\n\t\t\t\tconst formatterModule = await import(\n\t\t\t\t\t/* webpackChunkName: \"languageSpecificFormatting-[request]\" */\n\t\t\t\t\t`./languageSpecificFormatting/${language}_file.ts`\n\t\t\t\t);\n\t\t\t\tif (formatterModule?.format && isMounted) {\n\t\t\t\t\tsetFormattedCode(formatterModule.format(code));\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t} catch {\n\t\t\t\t// No formatter found — just use original\n\t\t\t}\n\t\t\tif (isMounted) setFormattedCode(code);\n\t\t};\n\n\t\tformatCode();\n\t\treturn () => {\n\t\t\tisMounted = false;\n\t\t};\n\t}, [code, language]);\n\n\tconst lines = formattedCode.split('\\n');\n\n\tconst getLanguageBadgeColor = (lang: CodeLanguage) => {\n\t\tconst colors: Record<CodeLanguage, string> = {\n\t\t\tjavascript: '#FEC02D',\n\t\t\tpython: '#3776ab',\n\t\t\tjava: '#ed8b00',\n\t\t\tcss: '#1572b6',\n\t\t\thtml: '#e34c26',\n\t\t\tjson: '#000000',\n\t\t};\n\t\treturn (\n\t\t\tcolors[lang.toLowerCase()] || (theme === 'dark' ? '#6e7681' : '#656d76')\n\t\t);\n\t};\n\n\tconst getBadgeTextColor = (lang: CodeLanguage) => {\n\t\tconst colors: Record<string, string> = {\n\t\t\tjavascript: '#000',\n\t\t};\n\t\treturn colors?.[lang.toLowerCase()] || '#fff';\n\t};\n\n\treturn (\n\t\t<Container themeMode={theme} maxWidth={maxWidth}>\n\t\t\t{!hideHeader && (\n\t\t\t\t<Header themeMode={theme}>\n\t\t\t\t\t<TitleSection>\n\t\t\t\t\t\t{!!title && title && <Title themeMode={theme}>{title}</Title>}\n\t\t\t\t\t\t<LanguageBadge\n\t\t\t\t\t\t\tbg={getLanguageBadgeColor(language)}\n\t\t\t\t\t\t\tcolor={getBadgeTextColor(language)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{language}\n\t\t\t\t\t\t</LanguageBadge>\n\t\t\t\t\t</TitleSection>\n\t\t\t\t\t{!hideCopy && (\n\t\t\t\t\t\t<CopyButton themeMode={theme} onClick={handleCopy}>\n\t\t\t\t\t\t\t{copied ? <>✓ Copied</> : <>Copy</>}\n\t\t\t\t\t\t</CopyButton>\n\t\t\t\t\t)}\n\t\t\t\t</Header>\n\t\t\t)}\n\n\t\t\t<CodeContainer maxHeight={maxHeight}>\n\t\t\t\t{!hideLineNumbers && (\n\t\t\t\t\t<LineNumbers themeMode={theme}>\n\t\t\t\t\t\t{lines.map((_, index) => (\n\t\t\t\t\t\t\t<div key={index}>{index + 1}</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</LineNumbers>\n\t\t\t\t)}\n\t\t\t\t<Code themeMode={theme}>\n\t\t\t\t\t{lines.map((line, index) => (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\tstyle={{ minHeight: line.trim() ? '20px' : '0px' }}\n\t\t\t\t\t\t\tdangerouslySetInnerHTML={{\n\t\t\t\t\t\t\t\t__html: highlightCode(line, language, theme) || '&nbsp;',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</Code>\n\t\t\t</CodeContainer>\n\t\t\t{showToaster && (\n\t\t\t\t<Toaster\n\t\t\t\t\ttext={\n\t\t\t\t\t\ttoasterType === 'success'\n\t\t\t\t\t\t\t? 'Code copied to clipboard!'\n\t\t\t\t\t\t\t: 'Failed to copy code'\n\t\t\t\t\t}\n\t\t\t\t\tautoClose={2000}\n\t\t\t\t\ttype={toasterType}\n\t\t\t\t\thideProgressBar\n\t\t\t\t\tonCloseToast={() => setShowToaster(false)}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</Container>\n\t);\n};\n"],"names":["CodeBlock","_ref","code","language","CodeLanguage","JAVASCRIPT","title","hideLineNumbers","maxHeight","maxWidth","theme","hideHeader","hideCopy","copied","setCopied","useState","showToaster","setShowToaster","toasterType","setToasterType","formattedCode","setFormattedCode","useEffect","isMounted","__awaiter","formatterModule","import","format","_a","lines","split","_jsxs","Container","themeMode","Header","Object","assign","TitleSection","_jsx","Title","children","LanguageBadge","bg","lang","javascript","python","java","css","html","json","toLowerCase","color","colors","getBadgeTextColor","CopyButton","onClick","handleCopy","navigator","clipboard","writeText","setTimeout","err","_Fragment","CodeContainer","LineNumbers","map","_","index","Code","line","style","minHeight","trim","dangerouslySetInnerHTML","__html","highlightCode","Toaster","text","autoClose","type","hideProgressBar","onCloseToast"],"mappings":"geAkBaA,MAAAA,EAAYC,IAUJ,IAVKC,KACzBA,EAAO,GAAEC,SACTA,EAAWC,EAAaC,WAAUC,MAClCA,EAAQ,GAAEC,gBACVA,GAAkB,EAAKC,UACvBA,EAAY,QAAOC,SACnBA,EAAQC,MACRA,EAAQ,OAAMC,WACdA,GAAa,EAAKC,SAClBA,GAAW,GACKX,EAChB,MAAOY,EAAQC,GAAaC,GAAS,IAC9BC,EAAaC,GAAkBF,GAAS,IACxCG,EAAaC,GAAkBJ,EACrC,YAiBMK,EAAeC,GAAoBN,EAASb,GAEnDoB,GAAU,KACT,IAAIC,GAAY,EAkBhB,OAjB8BC,OAAA,OAAA,OAAA,GAAA,YAC7B,IACC,MAAMC,QAAwBC,OAEG,gCAAAvB,aAEjC,IAAIsB,aAAe,EAAfA,EAAiBE,SAAUJ,EAE9B,YADAF,EAAiBI,EAAgBE,OAAOzB,GAGzC,CAAC,MAAM0B,GACP,CAEGL,GAAWF,EAAiBnB,EACjC,IAGO,KACNqB,GAAY,CAAK,CACjB,GACC,CAACrB,EAAMC,IAEV,MAAM0B,EAAQT,EAAcU,MAAM,MAuBlC,OACCC,EAACC,iBAAUC,UAAWvB,EAAOD,SAAUA,eACpCE,GACDoB,EAACG,EAAOC,OAAAC,OAAA,CAAAH,UAAWvB,cAClBqB,EAACM,eACG/B,GAASA,GAASgC,EAACC,EAAMJ,OAAAC,OAAA,CAAAH,UAAWvB,GAAK,CAAA8B,SAAGlC,KAC/CgC,EAACG,iBACAC,IA5ByBC,EA4BCxC,EA3Bc,CAC5CyC,WAAY,UACZC,OAAQ,UACRC,KAAM,UACNC,IAAK,UACLC,KAAM,UACNC,KAAM,WAGCN,EAAKO,iBAA6B,SAAVxC,EAAmB,UAAY,YAmB1DyC,MAfqBR,KAC1B,MAAMS,EAAiC,CACtCR,WAAY,QAEb,OAAOQ,eAAAA,EAAST,EAAKO,iBAAkB,MAAM,EAWjCG,CAAkBlD,cAExBA,SAGDS,GACD0B,EAACgB,iBAAWrB,UAAWvB,EAAO6C,QA7EhBC,IAAWhC,OAAA,OAAA,OAAA,GAAA,YAC7B,UACOiC,UAAUC,UAAUC,UAAUzD,GACpCY,GAAU,GACVK,EAAe,WACfF,GAAe,GACf2C,YAAW,IAAM9C,GAAU,IAAQ,IACnC,CAAC,MAAO+C,GACR1C,EAAe,SACfF,GAAe,EACf,CACF,KAkEsD,CAAAuB,SACtCF,EAAawB,EAAtBjD,EAAsB,CAAA2B,SAAA,YAAG,CAAAA,SAAA,gBAM9BT,EAACgC,EAAa5B,OAAAC,OAAA,CAAC5B,UAAWA,GACxB,CAAAgC,SAAA,EAACjC,GACD+B,EAAC0B,EAAW7B,OAAAC,OAAA,CAACH,UAAWvB,GACtB,CAAA8B,SAAAX,EAAMoC,KAAI,CAACC,EAAGC,IACd7B,kBAAkB6B,EAAQ,GAAhBA,QAIb7B,EAAC8B,iBAAKnC,UAAWvB,GACf,CAAA8B,SAAAX,EAAMoC,KAAI,CAACI,EAAMF,IACjB7B,EAEC,MAAA,CAAAgC,MAAO,CAAEC,UAAWF,EAAKG,OAAS,OAAS,OAC3CC,wBAAyB,CACxBC,OAAQC,EAAcN,EAAMlE,EAAUO,IAAU,WAH5CyD,YASRnD,GACAsB,EAACsC,EAAO,CACPC,KACiB,YAAhB3D,EACG,4BACA,sBAEJ4D,UAAW,IACXC,KAAM7D,EACN8D,iBAAe,EACfC,aAAcA,IAAMhE,GAAe,SAxER0B,KA2ElB"}
+{"version":3,"file":"CodeBlock.js","sources":["../../../../src/components/code-block/CodeBlock.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { Toaster } from '@src/components/toaster/Toaster';\nimport {\n\tCode,\n\tCodeContainer,\n\tContainer,\n\tCopyButton,\n\tHeader,\n\tLanguageBadge,\n\tLineNumbers,\n\tTitle,\n\tTitleSection,\n} from './CodeBlock.styled';\nimport { highlightCode } from './CodeBlockHelper';\nimport { CodeBlockProps, CodeLanguage } from './types';\n\n// optional types extraction\n\nexport const CodeBlock = ({\n\tcode = '',\n\tlanguage = CodeLanguage.JAVASCRIPT,\n\ttitle = '',\n\thideLineNumbers = false,\n\tmaxHeight = '400px',\n\tmaxWidth,\n\ttheme = 'dark',\n\thideHeader = false,\n\thideCopy = false,\n}: CodeBlockProps) => {\n\tconst [copied, setCopied] = useState(false);\n\tconst [showToaster, setShowToaster] = useState(false);\n\tconst [toasterType, setToasterType] = useState<'success' | 'error'>(\n\t\t'success',\n\t);\n\n\tconst handleCopy = async () => {\n\t\ttry {\n\t\t\tawait navigator.clipboard.writeText(code);\n\t\t\tsetCopied(true);\n\t\t\tsetToasterType('success');\n\t\t\tsetShowToaster(true);\n\t\t\tsetTimeout(() => setCopied(false), 2000);\n\t\t} catch (err) {\n\t\t\tsetToasterType('error');\n\t\t\tsetShowToaster(true);\n\t\t}\n\t};\n\n\t// Apply language-specific formatting\n\tconst [formattedCode, setFormattedCode] = useState(code);\n\n\tuseEffect(() => {\n\t\tlet isMounted = true;\n\t\tconst formatCode = async () => {\n\t\t\ttry {\n\t\t\t\tconst formatterModule = await import(\n\t\t\t\t\t/* webpackChunkName: \"languageSpecificFormatting-[request]\" */\n\t\t\t\t\t`./languageSpecificFormatting/${language}_file.ts`\n\t\t\t\t);\n\t\t\t\tif (formatterModule?.format && isMounted) {\n\t\t\t\t\tsetFormattedCode(formatterModule.format(code));\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t} catch {\n\t\t\t\t// No formatter found — just use original\n\t\t\t}\n\t\t\tif (isMounted) setFormattedCode(code);\n\t\t};\n\n\t\tformatCode();\n\t\treturn () => {\n\t\t\tisMounted = false;\n\t\t};\n\t}, [code, language]);\n\n\tconst lines = formattedCode.split('\\n');\n\n\tconst getLanguageBadgeColor = (lang: CodeLanguage) => {\n\t\tconst colors: Record<CodeLanguage, string> = {\n\t\t\tjavascript: '#FEC02D',\n\t\t\tpython: '#3776ab',\n\t\t\tjava: '#ed8b00',\n\t\t\tcss: '#1572b6',\n\t\t\thtml: '#e34c26',\n\t\t\tjson: '#000000',\n\t\t};\n\t\treturn (\n\t\t\tcolors[lang.toLowerCase()] || (theme === 'dark' ? '#6e7681' : '#656d76')\n\t\t);\n\t};\n\n\tconst getBadgeTextColor = (lang: CodeLanguage) => {\n\t\tconst colors: Record<string, string> = {\n\t\t\tjavascript: '#000',\n\t\t};\n\t\treturn colors?.[lang.toLowerCase()] || '#fff';\n\t};\n\n\treturn (\n\t\t<Container themeMode={theme} maxWidth={maxWidth}>\n\t\t\t{!hideHeader && (\n\t\t\t\t<Header themeMode={theme}>\n\t\t\t\t\t<TitleSection>\n\t\t\t\t\t\t{!!title && title && <Title themeMode={theme}>{title}</Title>}\n\t\t\t\t\t\t<LanguageBadge\n\t\t\t\t\t\t\tbg={getLanguageBadgeColor(language)}\n\t\t\t\t\t\t\tcolor={getBadgeTextColor(language)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{language}\n\t\t\t\t\t\t</LanguageBadge>\n\t\t\t\t\t</TitleSection>\n\t\t\t\t\t{!hideCopy && (\n\t\t\t\t\t\t<CopyButton themeMode={theme} onClick={handleCopy}>\n\t\t\t\t\t\t\t{copied ? <>✓ Copied</> : <>Copy</>}\n\t\t\t\t\t\t</CopyButton>\n\t\t\t\t\t)}\n\t\t\t\t</Header>\n\t\t\t)}\n\n\t\t\t<CodeContainer maxHeight={maxHeight}>\n\t\t\t\t{!hideLineNumbers && (\n\t\t\t\t\t<LineNumbers themeMode={theme}>\n\t\t\t\t\t\t{lines.map((_, index) => (\n\t\t\t\t\t\t\t<div key={index}>{index + 1}</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</LineNumbers>\n\t\t\t\t)}\n\t\t\t\t<Code themeMode={theme}>\n\t\t\t\t\t{lines.map((line, index) => (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\tstyle={{ minHeight: line.trim() ? '20px' : '0px' }}\n\t\t\t\t\t\t\tdangerouslySetInnerHTML={{\n\t\t\t\t\t\t\t\t__html: highlightCode(line, language, theme) || '&nbsp;',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</Code>\n\t\t\t</CodeContainer>\n\t\t\t{showToaster && (\n\t\t\t\t<Toaster\n\t\t\t\t\ttext={\n\t\t\t\t\t\ttoasterType === 'success'\n\t\t\t\t\t\t\t? 'Code copied to clipboard!'\n\t\t\t\t\t\t\t: 'Failed to copy code'\n\t\t\t\t\t}\n\t\t\t\t\tautoClose={2000}\n\t\t\t\t\ttype={toasterType}\n\t\t\t\t\thideProgressBar\n\t\t\t\t\tonCloseToast={() => setShowToaster(false)}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</Container>\n\t);\n};\n"],"names":["CodeBlock","code","language","CodeLanguage","JAVASCRIPT","title","hideLineNumbers","maxHeight","maxWidth","theme","hideHeader","hideCopy","copied","setCopied","useState","showToaster","setShowToaster","toasterType","setToasterType","formattedCode","setFormattedCode","useEffect","isMounted","__awaiter","formatterModule","import","format","_a","lines","split","_jsxs","Container","themeMode","Header","Object","assign","TitleSection","_jsx","Title","children","LanguageBadge","bg","lang","javascript","python","java","css","html","json","toLowerCase","color","colors","getBadgeTextColor","CopyButton","onClick","handleCopy","navigator","clipboard","writeText","setTimeout","err","_Fragment","CodeContainer","LineNumbers","map","_","index","Code","line","style","minHeight","trim","dangerouslySetInnerHTML","__html","highlightCode","Toaster","text","autoClose","type","hideProgressBar","onCloseToast"],"mappings":"geAkBO,MAAMA,EAAYA,EACxBC,OAAO,GACPC,WAAWC,EAAaC,WACxBC,QAAQ,GACRC,mBAAkB,EAClBC,YAAY,QACZC,WACAC,QAAQ,OACRC,cAAa,EACbC,YAAW,MAEX,MAAOC,EAAQC,GAAaC,GAAS,IAC9BC,EAAaC,GAAkBF,GAAS,IACxCG,EAAaC,GAAkBJ,EACrC,YAiBMK,EAAeC,GAAoBN,EAASb,GAEnDoB,GAAU,KACT,IAAIC,GAAY,EAkBhB,OAjB8BC,OAAA,OAAA,OAAA,GAAA,YAC7B,IACC,MAAMC,QAAwBC,OAE7B,gCAAgCvB,aAEjC,IAAIsB,aAAe,EAAfA,EAAiBE,SAAUJ,EAE9B,YADAF,EAAiBI,EAAgBE,OAAOzB,GAGzC,CAAC,MAAM0B,GACP,CAEGL,GAAWF,EAAiBnB,EACjC,IAGO,KACNqB,GAAY,CAAK,CACjB,GACC,CAACrB,EAAMC,IAEV,MAAM0B,EAAQT,EAAcU,MAAM,MAuBlC,OACCC,EAACC,iBAAUC,UAAWvB,EAAOD,SAAUA,eACpCE,GACDoB,EAACG,EAAOC,OAAAC,OAAA,CAAAH,UAAWvB,cAClBqB,EAACM,eACG/B,GAASA,GAASgC,EAACC,EAAMJ,OAAAC,OAAA,CAAAH,UAAWvB,GAAK,CAAA8B,SAAGlC,KAC/CgC,EAACG,iBACAC,IA5ByBC,EA4BCxC,EA3Bc,CAC5CyC,WAAY,UACZC,OAAQ,UACRC,KAAM,UACNC,IAAK,UACLC,KAAM,UACNC,KAAM,WAGCN,EAAKO,iBAA6B,SAAVxC,EAAmB,UAAY,YAmB1DyC,MAfqBR,KAC1B,MAAMS,EAAiC,CACtCR,WAAY,QAEb,OAAOQ,eAAAA,EAAST,EAAKO,iBAAkB,MAAM,EAWjCG,CAAkBlD,cAExBA,SAGDS,GACD0B,EAACgB,iBAAWrB,UAAWvB,EAAO6C,QA7EhBC,IAAWhC,OAAA,OAAA,OAAA,GAAA,YAC7B,UACOiC,UAAUC,UAAUC,UAAUzD,GACpCY,GAAU,GACVK,EAAe,WACfF,GAAe,GACf2C,YAAW,IAAM9C,GAAU,IAAQ,IACnC,CAAC,MAAO+C,GACR1C,EAAe,SACfF,GAAe,EACf,CACF,KAkEsD,CAAAuB,SACtCF,EAAawB,EAAtBjD,EAAsB,CAAA2B,SAAA,YAAG,CAAAA,SAAA,gBAM9BT,EAACgC,EAAa5B,OAAAC,OAAA,CAAC5B,UAAWA,GACxB,CAAAgC,SAAA,EAACjC,GACD+B,EAAC0B,EAAW7B,OAAAC,OAAA,CAACH,UAAWvB,GACtB,CAAA8B,SAAAX,EAAMoC,KAAI,CAACC,EAAGC,IACd7B,kBAAkB6B,EAAQ,GAAhBA,QAIb7B,EAAC8B,iBAAKnC,UAAWvB,GACf,CAAA8B,SAAAX,EAAMoC,KAAI,CAACI,EAAMF,IACjB7B,EAEC,MAAA,CAAAgC,MAAO,CAAEC,UAAWF,EAAKG,OAAS,OAAS,OAC3CC,wBAAyB,CACxBC,OAAQC,EAAcN,EAAMlE,EAAUO,IAAU,WAH5CyD,YASRnD,GACAsB,EAACsC,EAAO,CACPC,KACiB,YAAhB3D,EACG,4BACA,sBAEJ4D,UAAW,IACXC,KAAM7D,EACN8D,iBAAe,EACfC,aAAcA,IAAMhE,GAAe,SAxER0B,KA2ElB"}

package/dist/esm/components/code-block/CodeBlock.styled.js

@@ -1,17 +1,17 @@
-import e from"styled-components";const r=e.div`
-	background-color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#0d1117":"#ffffff"}};
+import e from"styled-components";const o=e.div`
+	background-color: ${({themeMode:e})=>"dark"===e?"#0d1117":"#ffffff"};
 	border: 1px solid
-		${e=>{let{themeMode:r}=e;return"dark"===r?"#30363d":"#d0d7de"}};
+		${({themeMode:e})=>"dark"===e?"#30363d":"#d0d7de"};
 	border-radius: 6px;
 	overflow: hidden;
 	font-family: ui-monospace, SFMono-Regular, 'SF Mono', Consolas,
 		'Liberation Mono', Menlo, monospace;
 	margin-bottom: 1rem;
-	${e=>{let{maxWidth:r}=e;return r&&`max-width: ${r};`}}
-`,o=e.div`
-	background-color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#161b22":"#f6f8fa"}};
+	${({maxWidth:e})=>e&&`max-width: ${e};`}
+`,r=e.div`
+	background-color: ${({themeMode:e})=>"dark"===e?"#161b22":"#f6f8fa"};
 	border-bottom: 1px solid
-		${e=>{let{themeMode:r}=e;return"dark"===r?"#30363d":"#d0d7de"}};
+		${({themeMode:e})=>"dark"===e?"#30363d":"#d0d7de"};
 	padding: 8px 16px;
 	display: flex;
 	justify-content: space-between;
@@ -24,33 +24,33 @@ import e from"styled-components";const r=e.div`
 	width: 12px;
 	height: 12px;
 	border-radius: 50%;
-	background-color: ${e=>{let{color:r}=e;return r}};
-`;const t=e.div`
+	background-color: ${({color:e})=>e};
+`;const d=e.div`
 	display: flex;
 	align-items: center;
 	gap: 8px;
 	flex: 1;
 	margin-left: 12px;
-`,d=e.span`
-	color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#f0f6fc":"#24292f"}};
+`,t=e.span`
+	color: ${({themeMode:e})=>"dark"===e?"#f0f6fc":"#24292f"};
 	font-size: 14px;
 	font-weight: 500;
-`,n=e.div`
-	background-color: ${e=>{let{bg:r}=e;return r}};
-	color: ${e=>{let{color:r}=e;return r||"#ffffff"}};
+`,i=e.div`
+	background-color: ${({bg:e})=>e};
+	color: ${({color:e})=>e||"#ffffff"};
 	padding: 2px 6px;
 	border-radius: 4px;
 	font-size: 12px;
 	font-weight: 400;
 	text-transform: Capitalize;
 	font-family: Inter;
-`,i=e.button`
+`,n=e.button`
 	background-color: transparent;
 	border: 1px solid
-		${e=>{let{themeMode:r}=e;return"dark"===r?"#30363d":"#616161"}};
+		${({themeMode:e})=>"dark"===e?"#30363d":"#616161"};
 	border-radius: 4px;
 	padding: 4px 12px;
-	color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#f0f6fc":"#24292f"}};
+	color: ${({themeMode:e})=>"dark"===e?"#f0f6fc":"#24292f"};
 	font-size: 12px;
 	cursor: pointer;
 	display: flex;
@@ -59,31 +59,31 @@ import e from"styled-components";const r=e.div`
 	transition: background-color 0.2s ease;
 	font-family: Inter;
 	&:hover {
-		background-color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#21262d":"#f3f4f6"}};
+		background-color: ${({themeMode:e})=>"dark"===e?"#21262d":"#f3f4f6"};
 	}
-`,l=e.div`
-	max-height: ${e=>{let{maxHeight:r}=e;return r}};
+`,a=e.div`
+	max-height: ${({maxHeight:e})=>e};
 	overflow: auto;
 	display: flex;
 	/* Ensure this is the only scroll container */
 	min-width: 0;
-`,a=e.div`
-	background-color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#0d1117":"#f6f8fa"}};
-	color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#6e7681":"#656d76"}};
+`,f=e.div`
+	background-color: ${({themeMode:e})=>"dark"===e?"#0d1117":"#f6f8fa"};
+	color: ${({themeMode:e})=>"dark"===e?"#6e7681":"#656d76"};
 	padding: 16px 12px;
 	font-size: 12px;
 	line-height: 20px;
 	text-align: right;
 	user-select: none;
 	border-right: 1px solid
-		${e=>{let{themeMode:r}=e;return"dark"===r?"#21262d":"#d0d7de"}};
+		${({themeMode:e})=>"dark"===e?"#21262d":"#d0d7de"};
 	min-width: 40px;
-`,f=e.pre`
+`,l=e.pre`
 	flex: 1;
 	padding: 16px;
 	font-size: 12px;
 	line-height: 20px;
-	color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#f0f6fc":"#24292f"}};
+	color: ${({themeMode:e})=>"dark"===e?"#f0f6fc":"#24292f"};
 	background-color: transparent;
 	margin: 0;
 	white-space: pre;
@@ -92,21 +92,21 @@ import e from"styled-components";const r=e.div`
 	min-width: 0; /* Ensures proper shrinking in flex container */
 
 	.keyword {
-		color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#79c0ff":"#0969da"}};
+		color: ${({themeMode:e})=>"dark"===e?"#79c0ff":"#0969da"};
 		font-weight: 600;
 	}
 
 	.string {
-		color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#a5d6ff":"#0a3069"}};
+		color: ${({themeMode:e})=>"dark"===e?"#a5d6ff":"#0a3069"};
 	}
 
 	.comment {
-		color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#8b949e":"#656d76"}};
+		color: ${({themeMode:e})=>"dark"===e?"#8b949e":"#656d76"};
 		font-style: italic;
 	}
 
 	.number {
-		color: ${e=>{let{themeMode:r}=e;return"dark"===r?"#79c0ff":"#0969da"}};
+		color: ${({themeMode:e})=>"dark"===e?"#79c0ff":"#0969da"};
 	}
-`;export{f as Code,l as CodeContainer,r as Container,i as CopyButton,o as Header,n as LanguageBadge,a as LineNumbers,d as Title,t as TitleSection};
+`;export{l as Code,a as CodeContainer,o as Container,n as CopyButton,r as Header,i as LanguageBadge,f as LineNumbers,t as Title,d as TitleSection};
 //# sourceMappingURL=CodeBlock.styled.js.map

package/dist/esm/components/code-block/CodeBlock.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"CodeBlock.styled.js","sources":["../../../../src/components/code-block/CodeBlock.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const Container = styled.div<{\n\tthemeMode: 'dark' | 'light';\n\tmaxWidth?: string;\n}>`\n\tbackground-color: ${({ themeMode }) =>\n\t\tthemeMode === 'dark' ? '#0d1117' : '#ffffff'};\n\tborder: 1px solid\n\t\t${({ themeMode }) => (themeMode === 'dark' ? '#30363d' : '#d0d7de')};\n\tborder-radius: 6px;\n\toverflow: hidden;\n\tfont-family: ui-monospace, SFMono-Regular, 'SF Mono', Consolas,\n\t\t'Liberation Mono', Menlo, monospace;\n\tmargin-bottom: 1rem;\n\t${({ maxWidth }) => maxWidth && `max-width: ${maxWidth};`}\n`;\n\nexport const Header = styled.div<{ themeMode: 'dark' | 'light' }>`\n\tbackground-color: ${({ themeMode }) =>\n\t\tthemeMode === 'dark' ? '#161b22' : '#f6f8fa'};\n\tborder-bottom: 1px solid\n\t\t${({ themeMode }) => (themeMode === 'dark' ? '#30363d' : '#d0d7de')};\n\tpadding: 8px 16px;\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n`;\n\nexport const WindowControls = styled.div`\n\tdisplay: flex;\n\tgap: 6px;\n\talign-items: center;\n`;\n\nexport const Dot = styled.div<{ color: string }>`\n\twidth: 12px;\n\theight: 12px;\n\tborder-radius: 50%;\n\tbackground-color: ${({ color }) => color};\n`;\n\nexport const TitleSection = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tflex: 1;\n\tmargin-left: 12px;\n`;\n\nexport const Title = styled.span<{ themeMode: 'dark' | 'light' }>`\n\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#f0f6fc' : '#24292f')};\n\tfont-size: 14px;\n\tfont-weight: 500;\n`;\n\nexport const LanguageBadge = styled.div<{ bg: string; color?: string }>`\n\tbackground-color: ${({ bg }) => bg};\n\tcolor: ${({ color }) => color || '#ffffff'};\n\tpadding: 2px 6px;\n\tborder-radius: 4px;\n\tfont-size: 12px;\n\tfont-weight: 400;\n\ttext-transform: Capitalize;\n\tfont-family: Inter;\n`;\n\nexport const CopyButton = styled.button<{ themeMode: 'dark' | 'light' }>`\n\tbackground-color: transparent;\n\tborder: 1px solid\n\t\t${({ themeMode }) => (themeMode === 'dark' ? '#30363d' : '#616161')};\n\tborder-radius: 4px;\n\tpadding: 4px 12px;\n\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#f0f6fc' : '#24292f')};\n\tfont-size: 12px;\n\tcursor: pointer;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 4px;\n\ttransition: background-color 0.2s ease;\n\tfont-family: Inter;\n\t&:hover {\n\t\tbackground-color: ${({ themeMode }) =>\n\t\t\tthemeMode === 'dark' ? '#21262d' : '#f3f4f6'};\n\t}\n`;\n\nexport const CodeContainer = styled.div<{ maxHeight: string }>`\n\tmax-height: ${({ maxHeight }) => maxHeight};\n\toverflow: auto;\n\tdisplay: flex;\n\t/* Ensure this is the only scroll container */\n\tmin-width: 0;\n`;\n\nexport const LineNumbers = styled.div<{ themeMode: 'dark' | 'light' }>`\n\tbackground-color: ${({ themeMode }) =>\n\t\tthemeMode === 'dark' ? '#0d1117' : '#f6f8fa'};\n\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#6e7681' : '#656d76')};\n\tpadding: 16px 12px;\n\tfont-size: 12px;\n\tline-height: 20px;\n\ttext-align: right;\n\tuser-select: none;\n\tborder-right: 1px solid\n\t\t${({ themeMode }) => (themeMode === 'dark' ? '#21262d' : '#d0d7de')};\n\tmin-width: 40px;\n`;\n\nexport const Code = styled.pre<{ themeMode: 'dark' | 'light' }>`\n\tflex: 1;\n\tpadding: 16px;\n\tfont-size: 12px;\n\tline-height: 20px;\n\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#f0f6fc' : '#24292f')};\n\tbackground-color: transparent;\n\tmargin: 0;\n\twhite-space: pre;\n\t/* Remove overflow-x from here since parent handles all scrolling */\n\toverflow: visible;\n\tmin-width: 0; /* Ensures proper shrinking in flex container */\n\n\t.keyword {\n\t\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#79c0ff' : '#0969da')};\n\t\tfont-weight: 600;\n\t}\n\n\t.string {\n\t\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#a5d6ff' : '#0a3069')};\n\t}\n\n\t.comment {\n\t\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#8b949e' : '#656d76')};\n\t\tfont-style: italic;\n\t}\n\n\t.number {\n\t\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#79c0ff' : '#0969da')};\n\t}\n`;\n"],"names":["Container","styled","div","_ref","themeMode","_ref2","_ref3","maxWidth","Header","_ref4","_ref5","_ref6","color","TitleSection","Title","span","_ref7","LanguageBadge","_ref8","bg","_ref9","CopyButton","button","_ref10","_ref11","_ref12","CodeContainer","_ref13","maxHeight","LineNumbers","_ref14","_ref15","_ref16","Code","pre","_ref17","_ref18","_ref19","_ref20","_ref21"],"mappings":"iCAEaA,MAAAA,EAAYC,EAAOC,GAG9B;qBACmBC,IAAA,IAACC,UAAEA,GAAWD,EAAA,MACnB,SAAdC,EAAuB,UAAY,SAAS;;IAE1CC,IAAA,IAACD,UAAEA,GAAWC,EAAA,MAAoB,SAAdD,EAAuB,UAAY,SAAS;;;;;;GAMjEE,IAAA,IAACC,SAAEA,GAAUD,EAAA,OAAKC,GAA0B,cAAAA,IAAW;EAG7CC,EAASP,EAAOC,GAAoC;qBAC5CO,IAAA,IAACL,UAAEA,GAAWK,EAAA,MACnB,SAAdL,EAAuB,UAAY,SAAS;;IAE1CM,IAAA,IAACN,UAAEA,GAAWM,EAAA,MAAoB,SAAdN,EAAuB,UAAY,SAAS;;;;;EAOtCH,EAAOC,GAAG;;;;EAMrBD,EAAOC,GAAsB;;;;qBAI3BS,IAAA,IAACC,MAAEA,GAAOD,EAAA,OAAKC,CAAK;EAG5BC,MAAAA,EAAeZ,EAAOC,GAAG;;;;;;EAQzBY,EAAQb,EAAOc,IAAqC;UACvDC,IAAA,IAACZ,UAAEA,GAAWY,EAAA,MAAoB,SAAdZ,EAAuB,UAAY,SAAS;;;EAK7Da,EAAgBhB,EAAOC,GAAmC;qBAClDgB,IAAA,IAACC,GAAEA,GAAID,EAAA,OAAKC,CAAE;UACzBC,IAAA,IAACR,MAAEA,GAAOQ,EAAA,OAAKR,GAAS,SAAS;;;;;;;EAS9BS,EAAapB,EAAOqB,MAAuC;;;IAGpEC,IAAA,IAACnB,UAAEA,GAAWmB,EAAA,MAAoB,SAAdnB,EAAuB,UAAY,SAAS;;;UAG1DoB,IAAA,IAACpB,UAAEA,GAAWoB,EAAA,MAAoB,SAAdpB,EAAuB,UAAY,SAAS;;;;;;;;;sBASpDqB,IAAA,IAACrB,UAAEA,GAAWqB,EAAA,MACnB,SAAdrB,EAAuB,UAAY,SAAS;;EAIlCsB,EAAgBzB,EAAOC,GAA0B;eAC/CyB,IAAA,IAACC,UAAEA,GAAWD,EAAA,OAAKC,CAAS;;;;;EAO9BC,EAAc5B,EAAOC,GAAoC;qBACjD4B,IAAA,IAAC1B,UAAEA,GAAW0B,EAAA,MACnB,SAAd1B,EAAuB,UAAY,SAAS;UACpC2B,IAAA,IAAC3B,UAAEA,GAAW2B,EAAA,MAAoB,SAAd3B,EAAuB,UAAY,SAAS;;;;;;;IAOtE4B,IAAA,IAAC5B,UAAEA,GAAW4B,EAAA,MAAoB,SAAd5B,EAAuB,UAAY,SAAS;;EAIvD6B,EAAOhC,EAAOiC,GAAoC;;;;;UAKrDC,IAAA,IAAC/B,UAAEA,GAAW+B,EAAA,MAAoB,SAAd/B,EAAuB,UAAY,SAAS;;;;;;;;;WAS/DgC,IAAA,IAAChC,UAAEA,GAAWgC,EAAA,MAAoB,SAAdhC,EAAuB,UAAY,SAAS;;;;;WAKhEiC,IAAA,IAACjC,UAAEA,GAAWiC,EAAA,MAAoB,SAAdjC,EAAuB,UAAY,SAAS;;;;WAIhEkC,IAAA,IAAClC,UAAEA,GAAWkC,EAAA,MAAoB,SAAdlC,EAAuB,UAAY,SAAS;;;;;WAKhEmC,IAAA,IAACnC,UAAEA,GAAWmC,EAAA,MAAoB,SAAdnC,EAAuB,UAAY,SAAS;;"}
+{"version":3,"file":"CodeBlock.styled.js","sources":["../../../../src/components/code-block/CodeBlock.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const Container = styled.div<{\n\tthemeMode: 'dark' | 'light';\n\tmaxWidth?: string;\n}>`\n\tbackground-color: ${({ themeMode }) =>\n\t\tthemeMode === 'dark' ? '#0d1117' : '#ffffff'};\n\tborder: 1px solid\n\t\t${({ themeMode }) => (themeMode === 'dark' ? '#30363d' : '#d0d7de')};\n\tborder-radius: 6px;\n\toverflow: hidden;\n\tfont-family: ui-monospace, SFMono-Regular, 'SF Mono', Consolas,\n\t\t'Liberation Mono', Menlo, monospace;\n\tmargin-bottom: 1rem;\n\t${({ maxWidth }) => maxWidth && `max-width: ${maxWidth};`}\n`;\n\nexport const Header = styled.div<{ themeMode: 'dark' | 'light' }>`\n\tbackground-color: ${({ themeMode }) =>\n\t\tthemeMode === 'dark' ? '#161b22' : '#f6f8fa'};\n\tborder-bottom: 1px solid\n\t\t${({ themeMode }) => (themeMode === 'dark' ? '#30363d' : '#d0d7de')};\n\tpadding: 8px 16px;\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n`;\n\nexport const WindowControls = styled.div`\n\tdisplay: flex;\n\tgap: 6px;\n\talign-items: center;\n`;\n\nexport const Dot = styled.div<{ color: string }>`\n\twidth: 12px;\n\theight: 12px;\n\tborder-radius: 50%;\n\tbackground-color: ${({ color }) => color};\n`;\n\nexport const TitleSection = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tflex: 1;\n\tmargin-left: 12px;\n`;\n\nexport const Title = styled.span<{ themeMode: 'dark' | 'light' }>`\n\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#f0f6fc' : '#24292f')};\n\tfont-size: 14px;\n\tfont-weight: 500;\n`;\n\nexport const LanguageBadge = styled.div<{ bg: string; color?: string }>`\n\tbackground-color: ${({ bg }) => bg};\n\tcolor: ${({ color }) => color || '#ffffff'};\n\tpadding: 2px 6px;\n\tborder-radius: 4px;\n\tfont-size: 12px;\n\tfont-weight: 400;\n\ttext-transform: Capitalize;\n\tfont-family: Inter;\n`;\n\nexport const CopyButton = styled.button<{ themeMode: 'dark' | 'light' }>`\n\tbackground-color: transparent;\n\tborder: 1px solid\n\t\t${({ themeMode }) => (themeMode === 'dark' ? '#30363d' : '#616161')};\n\tborder-radius: 4px;\n\tpadding: 4px 12px;\n\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#f0f6fc' : '#24292f')};\n\tfont-size: 12px;\n\tcursor: pointer;\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 4px;\n\ttransition: background-color 0.2s ease;\n\tfont-family: Inter;\n\t&:hover {\n\t\tbackground-color: ${({ themeMode }) =>\n\t\t\tthemeMode === 'dark' ? '#21262d' : '#f3f4f6'};\n\t}\n`;\n\nexport const CodeContainer = styled.div<{ maxHeight: string }>`\n\tmax-height: ${({ maxHeight }) => maxHeight};\n\toverflow: auto;\n\tdisplay: flex;\n\t/* Ensure this is the only scroll container */\n\tmin-width: 0;\n`;\n\nexport const LineNumbers = styled.div<{ themeMode: 'dark' | 'light' }>`\n\tbackground-color: ${({ themeMode }) =>\n\t\tthemeMode === 'dark' ? '#0d1117' : '#f6f8fa'};\n\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#6e7681' : '#656d76')};\n\tpadding: 16px 12px;\n\tfont-size: 12px;\n\tline-height: 20px;\n\ttext-align: right;\n\tuser-select: none;\n\tborder-right: 1px solid\n\t\t${({ themeMode }) => (themeMode === 'dark' ? '#21262d' : '#d0d7de')};\n\tmin-width: 40px;\n`;\n\nexport const Code = styled.pre<{ themeMode: 'dark' | 'light' }>`\n\tflex: 1;\n\tpadding: 16px;\n\tfont-size: 12px;\n\tline-height: 20px;\n\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#f0f6fc' : '#24292f')};\n\tbackground-color: transparent;\n\tmargin: 0;\n\twhite-space: pre;\n\t/* Remove overflow-x from here since parent handles all scrolling */\n\toverflow: visible;\n\tmin-width: 0; /* Ensures proper shrinking in flex container */\n\n\t.keyword {\n\t\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#79c0ff' : '#0969da')};\n\t\tfont-weight: 600;\n\t}\n\n\t.string {\n\t\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#a5d6ff' : '#0a3069')};\n\t}\n\n\t.comment {\n\t\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#8b949e' : '#656d76')};\n\t\tfont-style: italic;\n\t}\n\n\t.number {\n\t\tcolor: ${({ themeMode }) => (themeMode === 'dark' ? '#79c0ff' : '#0969da')};\n\t}\n`;\n"],"names":["Container","styled","div","themeMode","maxWidth","Header","color","TitleSection","Title","span","LanguageBadge","bg","CopyButton","button","CodeContainer","maxHeight","LineNumbers","Code","pre"],"mappings":"iCAEaA,MAAAA,EAAYC,EAAOC,GAG9B;qBACmB,EAAGC,eACR,SAAdA,EAAuB,UAAY;;IAEjC,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;;;;;GAMxD,EAAGC,cAAeA,GAAY,cAAcA;EAGlCC,EAASJ,EAAOC,GAAoC;qBAC5C,EAAGC,eACR,SAAdA,EAAuB,UAAY;;IAEjC,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;;;;EAO7BF,EAAOC,GAAG;;;;EAMrBD,EAAOC,GAAsB;;;;qBAI3B,EAAGI,WAAYA;EAGvBC,MAAAA,EAAeN,EAAOC,GAAG;;;;;;EAQzBM,EAAQP,EAAOQ,IAAqC;UACvD,EAAGN,eAA+B,SAAdA,EAAuB,UAAY;;;EAKpDO,EAAgBT,EAAOC,GAAmC;qBAClD,EAAGS,QAASA;UACvB,EAAGL,WAAYA,GAAS;;;;;;;EASrBM,EAAaX,EAAOY,MAAuC;;;IAGpE,EAAGV,eAA+B,SAAdA,EAAuB,UAAY;;;UAGjD,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;;;;;;;;sBAS3C,EAAGA,eACR,SAAdA,EAAuB,UAAY;;EAIzBW,EAAgBb,EAAOC,GAA0B;eAC/C,EAAGa,eAAgBA;;;;;EAOrBC,EAAcf,EAAOC,GAAoC;qBACjD,EAAGC,eACR,SAAdA,EAAuB,UAAY;UAC3B,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;;;;;;IAO7D,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;EAI9Cc,EAAOhB,EAAOiB,GAAoC;;;;;UAKrD,EAAGf,eAA+B,SAAdA,EAAuB,UAAY;;;;;;;;;WAStD,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;;;;WAKvD,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;;;WAIvD,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;;;;WAKvD,EAAGA,eAA+B,SAAdA,EAAuB,UAAY;;"}

package/dist/esm/components/code-block/CodeBlockHelper.js

@@ -1,2 +1,2 @@
-import{keywordsMap as o}from"./keywordMap.js";import*as e from"./languageSpecificFormatting/javascript_file.js";const l={javascript:e},n=o=>{let e=0;for(let l=0;l<o.length;l++)e=(e<<5)-e+o.charCodeAt(l),e|=0;return Math.abs(e)},r=function(e,r){let s=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"dark";const a=e.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;");const c=o[r.toLowerCase()]||[],t=(e=>{let{theme:r,lang:s}=e;var a,c;const t=o[s.toLowerCase()]||[],g={};let i={},p=[];const d=l[s.toLowerCase()];if(d)try{i=(null===(a=d.colorOverWrite)||void 0===a?void 0:a.call(d,r))||{},p=(null===(c=d.colorMap)||void 0===c?void 0:c.call(d,r))||[],console.log(`Formatter found for ${s} (${r}):`,{overrides:Object.keys(i),colorMapLength:p.length,colorMapColors:p})}catch(o){console.warn(`Failed to load formatting for ${s}:`,o)}else console.log(`No formatter found for ${s}`);const f="dark"===r?{primary:"#79c0ff",secondary:"#a5d6ff",tertiary:"#ff7b72",quaternary:"#d2a8ff"}:{primary:"#0969da",secondary:"#207d57ff",tertiary:"#d1242f",quaternary:"#8250df"},$=Object.values(f);return console.log(`Processing ${t.length} keywords for ${s}`),t.forEach((o=>{if(null==i?void 0:i[o])g[o]=i[o],["function","console","log"].includes(o)&&console.log(`${o}: using override color ${i[o]}`);else if(p&&p.length>0){const e=n(o)%p.length;g[o]=p[e],["function","console","log"].includes(o)&&console.log(`${o}: using colorMap[${e}] = ${p[e]}`)}else{const e=n(o)%$.length;g[o]=$[e],["function","console","log"].includes(o)&&console.log(`${o}: using fallback color ${$[e]}`)}})),g})({theme:s,lang:r});let g=a;g=g.replace(/(["'`])(?:\\.|(?!\1).)*\1/g,'<span class="string">$&</span>'),g=g.replace(/\/\/.*$/gm,'<span class="comment">$&</span>'),g=g.replace(/\/\*[\s\S]*?\*\//g,'<span class="comment">$&</span>'),g=g.replace(/#.*$/gm,'<span class="comment">$&</span>'),g=g.replace(/\b\d+\.?\d*\b/g,'<span class="number">$&</span>');const i=c.sort(((o,e)=>e.length-o.length));return console.log(`Processing ${r} keywords in order:`,i),i.forEach((o=>{let e;e="css"===r.toLowerCase()?new RegExp(`(^|[\\s:])\\b(${o.replace(/-/g,"\\-")})(?=\\s*:|\\s|$)(?![^<]*>)`,"g"):new RegExp(`\\b(${o})\\b(?![^<]*>)`,"g");const l=g;g="css"===r.toLowerCase()?g.replace(e,`$1<span style="color: ${t[o]}">$2</span>`):g.replace(e,`<span style="color: ${t[o]}">$1</span>`),l!==g&&["background","background-color","color"].includes(o)&&console.log(`${o} -> ${t[o]} (made changes)`)})),g};export{r as highlightCode};
+import{keywordsMap as o}from"./keywordMap.js";import*as e from"./languageSpecificFormatting/javascript_file.js";const l={javascript:e},r=o=>{let e=0;for(let l=0;l<o.length;l++)e=(e<<5)-e+o.charCodeAt(l),e|=0;return Math.abs(e)},s=(e,s,n="dark")=>{const a=e.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;");const c=o[s.toLowerCase()]||[],t=(({theme:e,lang:s})=>{var n,a;const c=o[s.toLowerCase()]||[],t={};let g={},p=[];const i=l[s.toLowerCase()];if(i)try{g=(null===(n=i.colorOverWrite)||void 0===n?void 0:n.call(i,e))||{},p=(null===(a=i.colorMap)||void 0===a?void 0:a.call(i,e))||[],console.log(`Formatter found for ${s} (${e}):`,{overrides:Object.keys(g),colorMapLength:p.length,colorMapColors:p})}catch(o){console.warn(`Failed to load formatting for ${s}:`,o)}else console.log(`No formatter found for ${s}`);const d="dark"===e?{primary:"#79c0ff",secondary:"#a5d6ff",tertiary:"#ff7b72",quaternary:"#d2a8ff"}:{primary:"#0969da",secondary:"#207d57ff",tertiary:"#d1242f",quaternary:"#8250df"},f=Object.values(d);return console.log(`Processing ${c.length} keywords for ${s}`),c.forEach((o=>{if(null==g?void 0:g[o])t[o]=g[o],["function","console","log"].includes(o)&&console.log(`${o}: using override color ${g[o]}`);else if(p&&p.length>0){const e=r(o)%p.length;t[o]=p[e],["function","console","log"].includes(o)&&console.log(`${o}: using colorMap[${e}] = ${p[e]}`)}else{const e=r(o)%f.length;t[o]=f[e],["function","console","log"].includes(o)&&console.log(`${o}: using fallback color ${f[e]}`)}})),t})({theme:n,lang:s});let g=a;g=g.replace(/(["'`])(?:\\.|(?!\1).)*\1/g,'<span class="string">$&</span>'),g=g.replace(/\/\/.*$/gm,'<span class="comment">$&</span>'),g=g.replace(/\/\*[\s\S]*?\*\//g,'<span class="comment">$&</span>'),g=g.replace(/#.*$/gm,'<span class="comment">$&</span>'),g=g.replace(/\b\d+\.?\d*\b/g,'<span class="number">$&</span>');const p=c.sort(((o,e)=>e.length-o.length));return console.log(`Processing ${s} keywords in order:`,p),p.forEach((o=>{let e;e="css"===s.toLowerCase()?new RegExp(`(^|[\\s:])\\b(${o.replace(/-/g,"\\-")})(?=\\s*:|\\s|$)(?![^<]*>)`,"g"):new RegExp(`\\b(${o})\\b(?![^<]*>)`,"g");const l=g;g="css"===s.toLowerCase()?g.replace(e,`$1<span style="color: ${t[o]}">$2</span>`):g.replace(e,`<span style="color: ${t[o]}">$1</span>`),l!==g&&["background","background-color","color"].includes(o)&&console.log(`${o} -> ${t[o]} (made changes)`)})),g};export{s as highlightCode};
 //# sourceMappingURL=CodeBlockHelper.js.map

package/dist/esm/components/code-block/CodeBlockHelper.js.map

@@ -1 +1 @@
-{"version":3,"file":"CodeBlockHelper.js","sources":["../../../../src/components/code-block/CodeBlockHelper.ts"],"sourcesContent":["import { keywordsMap } from './keywordMap';\nimport * as javascriptFormatter from './languageSpecificFormatting/javascript_file';\nimport { CodeLanguage, CodeThemeMode } from './types';\n\n// Language formatter registry\nconst languageFormatters = {\n\tjavascript: javascriptFormatter,\n} as const;\n\nconst hashString = (str: string) => {\n\tlet hash = 0;\n\tfor (let i = 0; i < str.length; i++) {\n\t\thash = (hash << 5) - hash + str.charCodeAt(i);\n\t\thash |= 0; // force 32-bit\n\t}\n\treturn Math.abs(hash);\n};\n\n// Utility: generate consistent random color from string\nexport const randomStringToColor = (str: string) => {\n\tlet hash = 0;\n\tfor (let i = 0; i < str.length; i++) {\n\t\thash = str.charCodeAt(i) + ((hash << 5) - hash);\n\t}\n\tconst c = (hash & 0x00ffffff).toString(16).toUpperCase();\n\treturn `#${'00000'.substring(0, 6 - c.length) + c}`;\n};\n\n// Import language-specific formatters directly\n\nconst getKeywordColorAccordingToLang = ({\n\ttheme,\n\tlang,\n}: {\n\ttheme: CodeThemeMode;\n\tlang: CodeLanguage;\n}): Record<string, string> => {\n\tconst langKeywords = keywordsMap[lang.toLowerCase()] || [];\n\tconst returnKeywords: Record<string, string> = {};\n\n\t// Get language-specific color configuration\n\tlet colorOverwriteObject: Record<string, string> = {};\n\tlet colorCodeList: string[] = [];\n\n\t// Try to get language-specific formatting using the registry\n\tconst formatter =\n\t\tlanguageFormatters[lang.toLowerCase() as keyof typeof languageFormatters];\n\tif (formatter) {\n\t\ttry {\n\t\t\tcolorOverwriteObject = formatter.colorOverWrite?.(theme) || {};\n\t\t\tcolorCodeList = formatter.colorMap?.(theme) || [];\n\t\t\tconsole.log(`Formatter found for ${lang} (${theme}):`, {\n\t\t\t\toverrides: Object.keys(colorOverwriteObject),\n\t\t\t\tcolorMapLength: colorCodeList.length,\n\t\t\t\tcolorMapColors: colorCodeList,\n\t\t\t});\n\t\t} catch (error) {\n\t\t\tconsole.warn(`Failed to load formatting for ${lang}:`, error);\n\t\t}\n\t} else {\n\t\tconsole.log(`No formatter found for ${lang}`);\n\t}\n\n\t// Fallback theme-based colors if no language-specific colors are available\n\tconst fallbackThemeColors =\n\t\ttheme === 'dark'\n\t\t\t? {\n\t\t\t\t\tprimary: '#79c0ff',\n\t\t\t\t\tsecondary: '#a5d6ff',\n\t\t\t\t\ttertiary: '#ff7b72',\n\t\t\t\t\tquaternary: '#d2a8ff',\n\t\t\t  }\n\t\t\t: {\n\t\t\t\t\tprimary: '#0969da',\n\t\t\t\t\tsecondary: '#207d57ff',\n\t\t\t\t\ttertiary: '#d1242f',\n\t\t\t\t\tquaternary: '#8250df',\n\t\t\t  };\n\n\tconst fallbackColorList = Object.values(fallbackThemeColors);\n\n\tconsole.log(`Processing ${langKeywords.length} keywords for ${lang}`);\n\n\tlangKeywords.forEach((kw) => {\n\t\tif (colorOverwriteObject?.[kw]) {\n\t\t\t// Priority 1: Use specific color override\n\t\t\treturnKeywords[kw] = colorOverwriteObject[kw];\n\t\t\tif (['function', 'console', 'log'].includes(kw)) {\n\t\t\t\tconsole.log(`${kw}: using override color ${colorOverwriteObject[kw]}`);\n\t\t\t}\n\t\t} else if (colorCodeList && colorCodeList.length > 0) {\n\t\t\t// Priority 2: Use color from language-specific color map\n\t\t\tconst hash = hashString(kw) % colorCodeList.length;\n\t\t\treturnKeywords[kw] = colorCodeList[hash];\n\t\t\tif (['function', 'console', 'log'].includes(kw)) {\n\t\t\t\tconsole.log(`${kw}: using colorMap[${hash}] = ${colorCodeList[hash]}`);\n\t\t\t}\n\t\t} else {\n\t\t\t// Priority 3: Use fallback theme color\n\t\t\tconst colorIndex = hashString(kw) % fallbackColorList.length;\n\t\t\treturnKeywords[kw] = fallbackColorList[colorIndex];\n\t\t\tif (['function', 'console', 'log'].includes(kw)) {\n\t\t\t\tconsole.log(\n\t\t\t\t\t`${kw}: using fallback color ${fallbackColorList[colorIndex]}`,\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\t});\n\n\treturn returnKeywords;\n};\n\nexport const highlightCode = (\n\tcode: string,\n\tlang: CodeLanguage,\n\ttheme: CodeThemeMode = 'dark',\n) => {\n\t// Escape HTML entities in code content only (not our span tags)\n\tconst escapeHtml = (str: string) => {\n\t\treturn str\n\t\t\t.replace(/&/g, '&amp;')\n\t\t\t.replace(/</g, '&lt;')\n\t\t\t.replace(/>/g, '&gt;');\n\t};\n\n\t// Escape HTML tags in the original code first\n\tconst escapedCode = escapeHtml(code);\n\tconst langKeywords = keywordsMap[lang.toLowerCase()] || [];\n\n\t// Assign consistent colors to each keyword\n\tconst keywordColors: Record<string, string> = getKeywordColorAccordingToLang({\n\t\ttheme,\n\t\tlang,\n\t});\n\n\tlet highlighted = escapedCode;\n\n\t// Strings first\n\thighlighted = highlighted.replace(\n\t\t/([\"'`])(?:\\\\.|(?!\\1).)*\\1/g,\n\t\t`<span class=\"string\">$&</span>`,\n\t);\n\n\t// Comments\n\thighlighted = highlighted.replace(\n\t\t/\\/\\/.*$/gm,\n\t\t`<span class=\"comment\">$&</span>`,\n\t);\n\thighlighted = highlighted.replace(\n\t\t/\\/\\*[\\s\\S]*?\\*\\//g,\n\t\t`<span class=\"comment\">$&</span>`,\n\t);\n\thighlighted = highlighted.replace(\n\t\t/#.*$/gm,\n\t\t`<span class=\"comment\">$&</span>`,\n\t);\n\n\t// Numbers\n\thighlighted = highlighted.replace(\n\t\t/\\b\\d+\\.?\\d*\\b/g,\n\t\t`<span class=\"number\">$&</span>`,\n\t);\n\n\t// Keywords with per-word color\n\t// Sort keywords by length (longest first) to avoid partial matches\n\tconst sortedKeywords = langKeywords.sort((a, b) => b.length - a.length);\n\n\tconsole.log(`Processing ${lang} keywords in order:`, sortedKeywords);\n\n\tsortedKeywords.forEach((keyword) => {\n\t\t// Use different regex patterns based on language\n\t\tlet regex: RegExp;\n\n\t\tif (lang.toLowerCase() === 'css') {\n\t\t\t// For CSS, match properties that are either at start of word or after whitespace/colon\n\t\t\t// and end with colon, whitespace, or end of line\n\t\t\tregex = new RegExp(\n\t\t\t\t`(^|[\\\\s:])\\\\b(${keyword.replace(\n\t\t\t\t\t/-/g,\n\t\t\t\t\t'\\\\-',\n\t\t\t\t)})(?=\\\\s*:|\\\\s|$)(?![^<]*>)`,\n\t\t\t\t'g',\n\t\t\t);\n\t\t} else {\n\t\t\t// For other languages, use standard word boundaries\n\t\t\tregex = new RegExp(`\\\\b(${keyword})\\\\b(?![^<]*>)`, 'g');\n\t\t}\n\n\t\tconst beforeReplace = highlighted;\n\n\t\tif (lang.toLowerCase() === 'css') {\n\t\t\t// For CSS, preserve the leading character (space/colon) and only wrap the keyword\n\t\t\thighlighted = highlighted.replace(\n\t\t\t\tregex,\n\t\t\t\t`$1<span style=\"color: ${keywordColors[keyword]}\">$2</span>`,\n\t\t\t);\n\t\t} else {\n\t\t\thighlighted = highlighted.replace(\n\t\t\t\tregex,\n\t\t\t\t`<span style=\"color: ${keywordColors[keyword]}\">$1</span>`,\n\t\t\t);\n\t\t}\n\n\t\t// Log if this keyword made any changes\n\t\tif (\n\t\t\tbeforeReplace !== highlighted &&\n\t\t\t['background', 'background-color', 'color'].includes(keyword)\n\t\t) {\n\t\t\tconsole.log(`${keyword} -> ${keywordColors[keyword]} (made changes)`);\n\t\t}\n\t});\n\treturn highlighted;\n};\n"],"names":["languageFormatters","javascript","javascriptFormatter","hashString","str","hash","i","length","charCodeAt","Math","abs","highlightCode","code","lang","theme","arguments","undefined","escapedCode","replace","langKeywords","keywordsMap","toLowerCase","keywordColors","_ref","returnKeywords","colorOverwriteObject","colorCodeList","formatter","_a","colorOverWrite","call","_b","colorMap","console","log","overrides","Object","keys","colorMapLength","colorMapColors","error","warn","fallbackThemeColors","primary","secondary","tertiary","quaternary","fallbackColorList","values","forEach","kw","includes","colorIndex","getKeywordColorAccordingToLang","highlighted","sortedKeywords","sort","a","b","keyword","regex","RegExp","beforeReplace"],"mappings":"gHAKA,MAAMA,EAAqB,CAC1BC,WAAYC,GAGPC,EAAcC,IACnB,IAAIC,EAAO,EACX,IAAK,IAAIC,EAAI,EAAGA,EAAIF,EAAIG,OAAQD,IAC/BD,GAAQA,GAAQ,GAAKA,EAAOD,EAAII,WAAWF,GAC3CD,GAAQ,EAET,OAAOI,KAAKC,IAAIL,EAAK,EAiGTM,EAAgB,SAC5BC,EACAC,GAEG,IADHC,EAAAC,UAAAR,OAAA,QAAAS,IAAAD,UAAA,GAAAA,UAAA,GAAuB,OAGvB,MAQME,EAAyBL,EAN5BM,QAAQ,KAAM,SACdA,QAAQ,KAAM,QACdA,QAAQ,KAAM,QAKjB,MAAMC,EAAeC,EAAYP,EAAKQ,gBAAkB,GAGlDC,EApGgCC,KAMV,IANWT,MACvCA,EAAKD,KACLA,GAIAU,UACA,MAAMJ,EAAeC,EAAYP,EAAKQ,gBAAkB,GAClDG,EAAyC,CAAA,EAG/C,IAAIC,EAA+C,CAAA,EAC/CC,EAA0B,GAG9B,MAAMC,EACL3B,EAAmBa,EAAKQ,eACzB,GAAIM,EACH,IACCF,GAA+C,QAAxBG,EAAAD,EAAUE,sBAAc,IAAAD,OAAA,EAAAA,EAAAE,KAAAH,EAAGb,KAAU,GAC5DY,GAAkC,QAAlBK,EAAAJ,EAAUK,gBAAQ,IAAAD,OAAA,EAAAA,EAAAD,KAAAH,EAAGb,KAAU,GAC/CmB,QAAQC,IAAI,uBAAuBrB,MAASC,MAAW,CACtDqB,UAAWC,OAAOC,KAAKZ,GACvBa,eAAgBZ,EAAcnB,OAC9BgC,eAAgBb,GAEjB,CAAC,MAAOc,GACRP,QAAQQ,KAAK,iCAAiC5B,KAAS2B,EACvD,MAEDP,QAAQC,8BAA8BrB,KAIvC,MAAM6B,EACK,SAAV5B,EACG,CACA6B,QAAS,UACTC,UAAW,UACXC,SAAU,UACVC,WAAY,WAEZ,CACAH,QAAS,UACTC,UAAW,YACXC,SAAU,UACVC,WAAY,WAGVC,EAAoBX,OAAOY,OAAON,GA8BxC,OA5BAT,QAAQC,IAAkB,cAAAf,EAAaZ,uBAAuBM,KAE9DM,EAAa8B,SAASC,IACrB,GAAIzB,aAAoB,EAApBA,EAAuByB,GAE1B1B,EAAe0B,GAAMzB,EAAqByB,GACtC,CAAC,WAAY,UAAW,OAAOC,SAASD,IAC3CjB,QAAQC,IAAI,GAAGgB,2BAA4BzB,EAAqByB,WAE3D,GAAIxB,GAAiBA,EAAcnB,OAAS,EAAG,CAErD,MAAMF,EAAOF,EAAW+C,GAAMxB,EAAcnB,OAC5CiB,EAAe0B,GAAMxB,EAAcrB,GAC/B,CAAC,WAAY,UAAW,OAAO8C,SAASD,IAC3CjB,QAAQC,IAAI,GAAGgB,qBAAsB7C,QAAWqB,EAAcrB,KAE/D,KAAM,CAEN,MAAM+C,EAAajD,EAAW+C,GAAMH,EAAkBxC,OACtDiB,EAAe0B,GAAMH,EAAkBK,GACnC,CAAC,WAAY,UAAW,OAAOD,SAASD,IAC3CjB,QAAQC,IACP,GAAGgB,2BAA4BH,EAAkBK,KAGnD,KAGK5B,CAAc,EAqByB6B,CAA+B,CAC5EvC,QACAD,SAGD,IAAIyC,EAAcrC,EAGlBqC,EAAcA,EAAYpC,QACzB,6BACgC,kCAIjCoC,EAAcA,EAAYpC,QACzB,YACiC,mCAElCoC,EAAcA,EAAYpC,QACzB,oBACiC,mCAElCoC,EAAcA,EAAYpC,QACzB,SACiC,mCAIlCoC,EAAcA,EAAYpC,QACzB,iBACgC,kCAKjC,MAAMqC,EAAiBpC,EAAaqC,MAAK,CAACC,EAAGC,IAAMA,EAAEnD,OAASkD,EAAElD,SA8ChE,OA5CA0B,QAAQC,IAAI,cAAcrB,uBAA2B0C,GAErDA,EAAeN,SAASU,IAEvB,IAAIC,EAKHA,EAH0B,QAAvB/C,EAAKQ,cAGA,IAAIwC,OACX,iBAAiBF,EAAQzC,QACxB,KACA,mCAED,KAIO,IAAI2C,OAAO,OAAOF,kBAAyB,KAGpD,MAAMG,EAAgBR,EAIrBA,EAF0B,QAAvBzC,EAAKQ,cAEMiC,EAAYpC,QACzB0C,EACyB,yBAAAtC,EAAcqC,iBAG1BL,EAAYpC,QACzB0C,EACuB,uBAAAtC,EAAcqC,iBAMtCG,IAAkBR,GAClB,CAAC,aAAc,mBAAoB,SAASH,SAASQ,IAErD1B,QAAQC,IAAI,GAAGyB,QAAcrC,EAAcqC,oBAC3C,IAEKL,CACR"}
+{"version":3,"file":"CodeBlockHelper.js","sources":["../../../../src/components/code-block/CodeBlockHelper.ts"],"sourcesContent":["import { keywordsMap } from './keywordMap';\nimport * as javascriptFormatter from './languageSpecificFormatting/javascript_file';\nimport { CodeLanguage, CodeThemeMode } from './types';\n\n// Language formatter registry\nconst languageFormatters = {\n\tjavascript: javascriptFormatter,\n} as const;\n\nconst hashString = (str: string) => {\n\tlet hash = 0;\n\tfor (let i = 0; i < str.length; i++) {\n\t\thash = (hash << 5) - hash + str.charCodeAt(i);\n\t\thash |= 0; // force 32-bit\n\t}\n\treturn Math.abs(hash);\n};\n\n// Utility: generate consistent random color from string\nexport const randomStringToColor = (str: string) => {\n\tlet hash = 0;\n\tfor (let i = 0; i < str.length; i++) {\n\t\thash = str.charCodeAt(i) + ((hash << 5) - hash);\n\t}\n\tconst c = (hash & 0x00ffffff).toString(16).toUpperCase();\n\treturn `#${'00000'.substring(0, 6 - c.length) + c}`;\n};\n\n// Import language-specific formatters directly\n\nconst getKeywordColorAccordingToLang = ({\n\ttheme,\n\tlang,\n}: {\n\ttheme: CodeThemeMode;\n\tlang: CodeLanguage;\n}): Record<string, string> => {\n\tconst langKeywords = keywordsMap[lang.toLowerCase()] || [];\n\tconst returnKeywords: Record<string, string> = {};\n\n\t// Get language-specific color configuration\n\tlet colorOverwriteObject: Record<string, string> = {};\n\tlet colorCodeList: string[] = [];\n\n\t// Try to get language-specific formatting using the registry\n\tconst formatter =\n\t\tlanguageFormatters[lang.toLowerCase() as keyof typeof languageFormatters];\n\tif (formatter) {\n\t\ttry {\n\t\t\tcolorOverwriteObject = formatter.colorOverWrite?.(theme) || {};\n\t\t\tcolorCodeList = formatter.colorMap?.(theme) || [];\n\t\t\tconsole.log(`Formatter found for ${lang} (${theme}):`, {\n\t\t\t\toverrides: Object.keys(colorOverwriteObject),\n\t\t\t\tcolorMapLength: colorCodeList.length,\n\t\t\t\tcolorMapColors: colorCodeList,\n\t\t\t});\n\t\t} catch (error) {\n\t\t\tconsole.warn(`Failed to load formatting for ${lang}:`, error);\n\t\t}\n\t} else {\n\t\tconsole.log(`No formatter found for ${lang}`);\n\t}\n\n\t// Fallback theme-based colors if no language-specific colors are available\n\tconst fallbackThemeColors =\n\t\ttheme === 'dark'\n\t\t\t? {\n\t\t\t\t\tprimary: '#79c0ff',\n\t\t\t\t\tsecondary: '#a5d6ff',\n\t\t\t\t\ttertiary: '#ff7b72',\n\t\t\t\t\tquaternary: '#d2a8ff',\n\t\t\t  }\n\t\t\t: {\n\t\t\t\t\tprimary: '#0969da',\n\t\t\t\t\tsecondary: '#207d57ff',\n\t\t\t\t\ttertiary: '#d1242f',\n\t\t\t\t\tquaternary: '#8250df',\n\t\t\t  };\n\n\tconst fallbackColorList = Object.values(fallbackThemeColors);\n\n\tconsole.log(`Processing ${langKeywords.length} keywords for ${lang}`);\n\n\tlangKeywords.forEach((kw) => {\n\t\tif (colorOverwriteObject?.[kw]) {\n\t\t\t// Priority 1: Use specific color override\n\t\t\treturnKeywords[kw] = colorOverwriteObject[kw];\n\t\t\tif (['function', 'console', 'log'].includes(kw)) {\n\t\t\t\tconsole.log(`${kw}: using override color ${colorOverwriteObject[kw]}`);\n\t\t\t}\n\t\t} else if (colorCodeList && colorCodeList.length > 0) {\n\t\t\t// Priority 2: Use color from language-specific color map\n\t\t\tconst hash = hashString(kw) % colorCodeList.length;\n\t\t\treturnKeywords[kw] = colorCodeList[hash];\n\t\t\tif (['function', 'console', 'log'].includes(kw)) {\n\t\t\t\tconsole.log(`${kw}: using colorMap[${hash}] = ${colorCodeList[hash]}`);\n\t\t\t}\n\t\t} else {\n\t\t\t// Priority 3: Use fallback theme color\n\t\t\tconst colorIndex = hashString(kw) % fallbackColorList.length;\n\t\t\treturnKeywords[kw] = fallbackColorList[colorIndex];\n\t\t\tif (['function', 'console', 'log'].includes(kw)) {\n\t\t\t\tconsole.log(\n\t\t\t\t\t`${kw}: using fallback color ${fallbackColorList[colorIndex]}`,\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\t});\n\n\treturn returnKeywords;\n};\n\nexport const highlightCode = (\n\tcode: string,\n\tlang: CodeLanguage,\n\ttheme: CodeThemeMode = 'dark',\n) => {\n\t// Escape HTML entities in code content only (not our span tags)\n\tconst escapeHtml = (str: string) => {\n\t\treturn str\n\t\t\t.replace(/&/g, '&amp;')\n\t\t\t.replace(/</g, '&lt;')\n\t\t\t.replace(/>/g, '&gt;');\n\t};\n\n\t// Escape HTML tags in the original code first\n\tconst escapedCode = escapeHtml(code);\n\tconst langKeywords = keywordsMap[lang.toLowerCase()] || [];\n\n\t// Assign consistent colors to each keyword\n\tconst keywordColors: Record<string, string> = getKeywordColorAccordingToLang({\n\t\ttheme,\n\t\tlang,\n\t});\n\n\tlet highlighted = escapedCode;\n\n\t// Strings first\n\thighlighted = highlighted.replace(\n\t\t/([\"'`])(?:\\\\.|(?!\\1).)*\\1/g,\n\t\t`<span class=\"string\">$&</span>`,\n\t);\n\n\t// Comments\n\thighlighted = highlighted.replace(\n\t\t/\\/\\/.*$/gm,\n\t\t`<span class=\"comment\">$&</span>`,\n\t);\n\thighlighted = highlighted.replace(\n\t\t/\\/\\*[\\s\\S]*?\\*\\//g,\n\t\t`<span class=\"comment\">$&</span>`,\n\t);\n\thighlighted = highlighted.replace(\n\t\t/#.*$/gm,\n\t\t`<span class=\"comment\">$&</span>`,\n\t);\n\n\t// Numbers\n\thighlighted = highlighted.replace(\n\t\t/\\b\\d+\\.?\\d*\\b/g,\n\t\t`<span class=\"number\">$&</span>`,\n\t);\n\n\t// Keywords with per-word color\n\t// Sort keywords by length (longest first) to avoid partial matches\n\tconst sortedKeywords = langKeywords.sort((a, b) => b.length - a.length);\n\n\tconsole.log(`Processing ${lang} keywords in order:`, sortedKeywords);\n\n\tsortedKeywords.forEach((keyword) => {\n\t\t// Use different regex patterns based on language\n\t\tlet regex: RegExp;\n\n\t\tif (lang.toLowerCase() === 'css') {\n\t\t\t// For CSS, match properties that are either at start of word or after whitespace/colon\n\t\t\t// and end with colon, whitespace, or end of line\n\t\t\tregex = new RegExp(\n\t\t\t\t`(^|[\\\\s:])\\\\b(${keyword.replace(\n\t\t\t\t\t/-/g,\n\t\t\t\t\t'\\\\-',\n\t\t\t\t)})(?=\\\\s*:|\\\\s|$)(?![^<]*>)`,\n\t\t\t\t'g',\n\t\t\t);\n\t\t} else {\n\t\t\t// For other languages, use standard word boundaries\n\t\t\tregex = new RegExp(`\\\\b(${keyword})\\\\b(?![^<]*>)`, 'g');\n\t\t}\n\n\t\tconst beforeReplace = highlighted;\n\n\t\tif (lang.toLowerCase() === 'css') {\n\t\t\t// For CSS, preserve the leading character (space/colon) and only wrap the keyword\n\t\t\thighlighted = highlighted.replace(\n\t\t\t\tregex,\n\t\t\t\t`$1<span style=\"color: ${keywordColors[keyword]}\">$2</span>`,\n\t\t\t);\n\t\t} else {\n\t\t\thighlighted = highlighted.replace(\n\t\t\t\tregex,\n\t\t\t\t`<span style=\"color: ${keywordColors[keyword]}\">$1</span>`,\n\t\t\t);\n\t\t}\n\n\t\t// Log if this keyword made any changes\n\t\tif (\n\t\t\tbeforeReplace !== highlighted &&\n\t\t\t['background', 'background-color', 'color'].includes(keyword)\n\t\t) {\n\t\t\tconsole.log(`${keyword} -> ${keywordColors[keyword]} (made changes)`);\n\t\t}\n\t});\n\treturn highlighted;\n};\n"],"names":["languageFormatters","javascript","javascriptFormatter","hashString","str","hash","i","length","charCodeAt","Math","abs","highlightCode","code","lang","theme","escapedCode","replace","langKeywords","keywordsMap","toLowerCase","keywordColors","getKeywordColorAccordingToLang","returnKeywords","colorOverwriteObject","colorCodeList","formatter","_a","colorOverWrite","call","_b","colorMap","console","log","overrides","Object","keys","colorMapLength","colorMapColors","error","warn","fallbackThemeColors","primary","secondary","tertiary","quaternary","fallbackColorList","values","forEach","kw","includes","colorIndex","highlighted","sortedKeywords","sort","a","b","keyword","regex","RegExp","beforeReplace"],"mappings":"gHAKA,MAAMA,EAAqB,CAC1BC,WAAYC,GAGPC,EAAcC,IACnB,IAAIC,EAAO,EACX,IAAK,IAAIC,EAAI,EAAGA,EAAIF,EAAIG,OAAQD,IAC/BD,GAAQA,GAAQ,GAAKA,EAAOD,EAAII,WAAWF,GAC3CD,GAAQ,EAET,OAAOI,KAAKC,IAAIL,EAAK,EAiGTM,EAAgBA,CAC5BC,EACAC,EACAC,EAAuB,UAGvB,MAQMC,EAAyBH,EAN5BI,QAAQ,KAAM,SACdA,QAAQ,KAAM,QACdA,QAAQ,KAAM,QAKjB,MAAMC,EAAeC,EAAYL,EAAKM,gBAAkB,GAGlDC,EApGgCC,GACtCP,QACAD,mBAKA,MAAMI,EAAeC,EAAYL,EAAKM,gBAAkB,GAClDG,EAAyC,CAAA,EAG/C,IAAIC,EAA+C,CAAA,EAC/CC,EAA0B,GAG9B,MAAMC,EACLzB,EAAmBa,EAAKM,eACzB,GAAIM,EACH,IACCF,GAA+C,QAAxBG,EAAAD,EAAUE,sBAAc,IAAAD,OAAA,EAAAA,EAAAE,KAAAH,EAAGX,KAAU,GAC5DU,GAAkC,QAAlBK,EAAAJ,EAAUK,gBAAQ,IAAAD,OAAA,EAAAA,EAAAD,KAAAH,EAAGX,KAAU,GAC/CiB,QAAQC,IAAI,uBAAuBnB,MAASC,MAAW,CACtDmB,UAAWC,OAAOC,KAAKZ,GACvBa,eAAgBZ,EAAcjB,OAC9B8B,eAAgBb,GAEjB,CAAC,MAAOc,GACRP,QAAQQ,KAAK,iCAAiC1B,KAASyB,EACvD,MAEDP,QAAQC,IAAI,0BAA0BnB,KAIvC,MAAM2B,EACK,SAAV1B,EACG,CACA2B,QAAS,UACTC,UAAW,UACXC,SAAU,UACVC,WAAY,WAEZ,CACAH,QAAS,UACTC,UAAW,YACXC,SAAU,UACVC,WAAY,WAGVC,EAAoBX,OAAOY,OAAON,GA8BxC,OA5BAT,QAAQC,IAAI,cAAcf,EAAaV,uBAAuBM,KAE9DI,EAAa8B,SAASC,IACrB,GAAIzB,aAAoB,EAApBA,EAAuByB,GAE1B1B,EAAe0B,GAAMzB,EAAqByB,GACtC,CAAC,WAAY,UAAW,OAAOC,SAASD,IAC3CjB,QAAQC,IAAI,GAAGgB,2BAA4BzB,EAAqByB,WAE3D,GAAIxB,GAAiBA,EAAcjB,OAAS,EAAG,CAErD,MAAMF,EAAOF,EAAW6C,GAAMxB,EAAcjB,OAC5Ce,EAAe0B,GAAMxB,EAAcnB,GAC/B,CAAC,WAAY,UAAW,OAAO4C,SAASD,IAC3CjB,QAAQC,IAAI,GAAGgB,qBAAsB3C,QAAWmB,EAAcnB,KAE/D,KAAM,CAEN,MAAM6C,EAAa/C,EAAW6C,GAAMH,EAAkBtC,OACtDe,EAAe0B,GAAMH,EAAkBK,GACnC,CAAC,WAAY,UAAW,OAAOD,SAASD,IAC3CjB,QAAQC,IACP,GAAGgB,2BAA4BH,EAAkBK,KAGnD,KAGK5B,CAAc,EAqByBD,CAA+B,CAC5EP,QACAD,SAGD,IAAIsC,EAAcpC,EAGlBoC,EAAcA,EAAYnC,QACzB,6BACA,kCAIDmC,EAAcA,EAAYnC,QACzB,YACA,mCAEDmC,EAAcA,EAAYnC,QACzB,oBACA,mCAEDmC,EAAcA,EAAYnC,QACzB,SACA,mCAIDmC,EAAcA,EAAYnC,QACzB,iBACA,kCAKD,MAAMoC,EAAiBnC,EAAaoC,MAAK,CAACC,EAAGC,IAAMA,EAAEhD,OAAS+C,EAAE/C,SA8ChE,OA5CAwB,QAAQC,IAAI,cAAcnB,uBAA2BuC,GAErDA,EAAeL,SAASS,IAEvB,IAAIC,EAKHA,EAH0B,QAAvB5C,EAAKM,cAGA,IAAIuC,OACX,iBAAiBF,EAAQxC,QACxB,KACA,mCAED,KAIO,IAAI0C,OAAO,OAAOF,kBAAyB,KAGpD,MAAMG,EAAgBR,EAIrBA,EAF0B,QAAvBtC,EAAKM,cAEMgC,EAAYnC,QACzByC,EACA,yBAAyBrC,EAAcoC,iBAG1BL,EAAYnC,QACzByC,EACA,uBAAuBrC,EAAcoC,iBAMtCG,IAAkBR,GAClB,CAAC,aAAc,mBAAoB,SAASF,SAASO,IAErDzB,QAAQC,IAAI,GAAGwB,QAAcpC,EAAcoC,oBAC3C,IAEKL,CAAW"}

package/dist/esm/components/country-code-picker/CountryPicker.js

@@ -1,2 +1,2 @@
-import{jsxs as o,jsx as e,Fragment as t}from"react/jsx-runtime";import n from"../../assets/icons/chevronDown.svg.js";import{useState as r,useMemo as s}from"react";import{CountriesData as d}from"./CountryCodePicker.modal.js";import{StyledCountryOption as i,StyledCountryPickerContainer as c}from"./CountryPicker.styled.js";import{DropdownPopover as p}from"../dropdown/DropdownPopover/index.js";import"../dropdown/Dropdown.js";import"../dropdown/ChipDropdown.js";import"../zeroState/ZeroState.js";import{COLORS as l}from"../../constants/Theme.js";import"../../_virtual/_tslib.js";import"lodash/debounce";import{BodySecondary as m}from"../TypographyStyle.js";import"../dropdown/OpenedDropdown/components/description/Description.styled.js";import"../checkBox/CheckBox.styled.js";import"../list-item/ListItem.js";import"../dropdown/OpenedDropdown/components/menu/FreeFormMenu.styled.js";import"../dropdown/OpenedDropdown/components/menu/MenuItem.js";import"../dropdown/OpenedDropdown/components/menu/MenuList.styled.js";import"../button/Button.js";import"../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js";import"../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js";import"../icon-button/IconButton.js";import"../input/Input.js";import"../dropdown/MenuItem/MenuItem.js";const a=a=>{let{version:u,onCountrySelect:h,selectedCountry:j,popoverWidth:y="300px",height:w,placement:g="bottom-start",placementStrategy:b="absolute",disabled:v=!1,hideFlagImage:O=!1,containerStyles:f,placeholder:C="Select a country",showCountryCode:D=!0,countryTextStyle:S,onDropdownClick:x}=a;var I;const[k,B]=r(j),M=null!=j?j:k,L=M?`https://flagcdn.com/${null===(I=M.code)||void 0===I?void 0:I.toLowerCase()}.svg`:void 0,N=s((()=>d.map((t=>{var n;const r=`https://flagcdn.com/${null===(n=t.code)||void 0===n?void 0:n.toLowerCase()}.svg`;return{value:t.code,label:t.name,searchKey:t.name,customComponent:o(i,{children:[!O&&e("img",{src:r,className:"country-flag",alt:t.name}),o("div",Object.assign({className:"country-info"},{children:[e(m,Object.assign({style:Object.assign({color:l.text.primary},S)},{children:t.name})),D&&e(m,Object.assign({style:{color:l.text.secondary,fontSize:"12px"}},{children:t.code}))]}))]}),selected:(null==M?void 0:M.code)===t.code}}))),[null==M?void 0:M.code,O,D,S]);return e(p,Object.assign({version:u,isSearchable:!0,width:y,placement:g,strategy:b,options:N,disabled:v,onSelect:o=>(o=>{const e=d.find((e=>e.code===o.value));e&&(void 0===j&&B(e),h(e))})(o)},{children:o(c,Object.assign({height:w,style:f,onClick:x,disabled:v},{children:[e("div",Object.assign({className:"content__wrapper"},{children:M?o(t,{children:[!O&&L&&e("img",{src:L,className:"country-flag",alt:M.name}),e(m,Object.assign({style:S},{children:M.name}))]}):e(m,Object.assign({style:Object.assign({color:l.text.disabled},S)},{children:C}))})),e(n,{width:24,height:24,color:v?l.text.disabled:l.content.primary})]}))}))};export{a as CountryPicker};
+import{jsxs as o,jsx as e,Fragment as t}from"react/jsx-runtime";import n from"../../assets/icons/chevronDown.svg.js";import{useState as r,useMemo as s}from"react";import{CountriesData as d}from"./CountryCodePicker.modal.js";import{StyledCountryOption as i,StyledCountryPickerContainer as c}from"./CountryPicker.styled.js";import{DropdownPopover as p}from"../dropdown/DropdownPopover/index.js";import"../dropdown/Dropdown.js";import"../dropdown/ChipDropdown.js";import"../zeroState/ZeroState.js";import{COLORS as l}from"../../constants/Theme.js";import"../../_virtual/_tslib.js";import"lodash/debounce";import{BodySecondary as m}from"../TypographyStyle.js";import"../dropdown/OpenedDropdown/components/description/Description.styled.js";import"../checkBox/CheckBox.styled.js";import"../list-item/ListItem.js";import"../dropdown/OpenedDropdown/components/menu/FreeFormMenu.styled.js";import"../dropdown/OpenedDropdown/components/menu/MenuItem.js";import"../dropdown/OpenedDropdown/components/menu/MenuList.styled.js";import"../button/Button.js";import"../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js";import"../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js";import"../icon-button/IconButton.js";import"../input/Input.js";import"../dropdown/MenuItem/MenuItem.js";const a=({version:a,onCountrySelect:u,selectedCountry:h,popoverWidth:j="300px",height:y,placement:w="bottom-start",placementStrategy:g="absolute",disabled:b=!1,hideFlagImage:v=!1,containerStyles:O,placeholder:f="Select a country",showCountryCode:C=!0,countryTextStyle:D,onDropdownClick:S})=>{var x;const[I,k]=r(h),B=null!=h?h:I,M=B?`https://flagcdn.com/${null===(x=B.code)||void 0===x?void 0:x.toLowerCase()}.svg`:void 0,L=s((()=>d.map((t=>{var n;const r=`https://flagcdn.com/${null===(n=t.code)||void 0===n?void 0:n.toLowerCase()}.svg`;return{value:t.code,label:t.name,searchKey:t.name,customComponent:o(i,{children:[!v&&e("img",{src:r,className:"country-flag",alt:t.name}),o("div",Object.assign({className:"country-info"},{children:[e(m,Object.assign({style:Object.assign({color:l.text.primary},D)},{children:t.name})),C&&e(m,Object.assign({style:{color:l.text.secondary,fontSize:"12px"}},{children:t.code}))]}))]}),selected:(null==B?void 0:B.code)===t.code}}))),[null==B?void 0:B.code,v,C,D]);return e(p,Object.assign({version:a,isSearchable:!0,width:j,placement:w,strategy:g,options:L,disabled:b,onSelect:o=>(o=>{const e=d.find((e=>e.code===o.value));e&&(void 0===h&&k(e),u(e))})(o)},{children:o(c,Object.assign({height:y,style:O,onClick:S,disabled:b},{children:[e("div",Object.assign({className:"content__wrapper"},{children:B?o(t,{children:[!v&&M&&e("img",{src:M,className:"country-flag",alt:B.name}),e(m,Object.assign({style:D},{children:B.name}))]}):e(m,Object.assign({style:Object.assign({color:l.text.disabled},D)},{children:f}))})),e(n,{width:24,height:24,color:b?l.text.disabled:l.content.primary})]}))}))};export{a as CountryPicker};
 //# sourceMappingURL=CountryPicker.js.map

package/dist/esm/components/country-code-picker/CountryPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"CountryPicker.js","sources":["../../../../src/components/country-code-picker/CountryPicker.tsx"],"sourcesContent":["import { Placement, PositioningStrategy } from '@popperjs/core';\nimport DownIcon from '@src/assets/icons/chevronDown.svg';\nimport React, { useMemo, useState } from 'react';\nimport {\n\tCountriesData,\n\tCountryCode,\n} from '@src/components/country-code-picker/CountryCodePicker.modal';\nimport {\n\tStyledCountryOption,\n\tStyledCountryPickerContainer,\n} from '@src/components/country-code-picker/CountryPicker.styled';\nimport { DropdownPopover } from '@src/components/dropdown';\nimport { DropdownOption, SingleOption } from '@src/components/dropdown/type';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\n/**\n * Props for the CountryPicker component\n */\nexport interface CountryPickerProps {\n\t/**\n\t * Version of the dropdown popover to use\n\t */\n\tversion: '1.0' | '2.0';\n\t/**\n\t * Callback function when a country is selected\n\t */\n\tonCountrySelect: (country: CountryCode) => void;\n\t/**\n\t * Currently selected country\n\t */\n\tselectedCountry?: CountryCode;\n\t/**\n\t * Width of the popover dropdown\n\t * @default \"300px\"\n\t */\n\tpopoverWidth?: string;\n\t/**\n\t * Height of the picker container\n\t */\n\theight?: string;\n\t/**\n\t * Placement of the dropdown relative to the trigger\n\t * @default \"bottom-start\"\n\t */\n\tplacement?: Placement;\n\t/**\n\t * Positioning strategy for the dropdown\n\t * @default \"absolute\"\n\t */\n\tplacementStrategy?: PositioningStrategy;\n\t/**\n\t * Whether the picker is disabled\n\t * @default false\n\t */\n\tdisabled?: boolean;\n\t/**\n\t * Whether to hide the flag image\n\t * @default false\n\t */\n\thideFlagImage?: boolean;\n\t/**\n\t * Custom styles for the container\n\t */\n\tcontainerStyles?: React.CSSProperties;\n\t/**\n\t * Placeholder text when no country is selected\n\t * @default \"Select a country\"\n\t */\n\tplaceholder?: string;\n\t/**\n\t * Whether to show country code alongside name\n\t * @default true\n\t */\n\tshowCountryCode?: boolean;\n\t/**\n\t * Custom text style for the country name\n\t */\n\tcountryTextStyle?: React.CSSProperties;\n\t/**\n\t * Callback when dropdown is clicked\n\t */\n\tonDropdownClick?: () => void;\n}\n\nexport const CountryPicker: React.FC<CountryPickerProps> = ({\n\tversion,\n\tonCountrySelect,\n\tselectedCountry,\n\tpopoverWidth = '300px',\n\theight,\n\tplacement = 'bottom-start',\n\tplacementStrategy = 'absolute',\n\tdisabled = false,\n\thideFlagImage = false,\n\tcontainerStyles,\n\tplaceholder = 'Select a country',\n\tshowCountryCode = true,\n\tcountryTextStyle,\n\tonDropdownClick,\n}) => {\n\tconst [internalSelectedCountry, setInternalSelectedCountry] = useState<\n\t\tCountryCode | undefined\n\t>(selectedCountry);\n\n\t// Derive the current selected country (controlled vs uncontrolled)\n\tconst currentCountry = selectedCountry ?? internalSelectedCountry;\n\n\tconst selectedFlag = currentCountry\n\t\t? `https://flagcdn.com/${currentCountry.code?.toLowerCase()}.svg`\n\t\t: undefined;\n\n\tconst getCountryOptions = useMemo((): DropdownOption[] => {\n\t\treturn CountriesData.map((country) => {\n\t\t\tconst flag = `https://flagcdn.com/${country.code?.toLowerCase()}.svg`;\n\t\t\treturn {\n\t\t\t\tvalue: country.code,\n\t\t\t\tlabel: country.name,\n\t\t\t\tsearchKey: country.name,\n\t\t\t\tcustomComponent: (\n\t\t\t\t\t<StyledCountryOption>\n\t\t\t\t\t\t{!hideFlagImage && (\n\t\t\t\t\t\t\t<img src={flag} className=\"country-flag\" alt={country.name} />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<div className=\"country-info\">\n\t\t\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tcolor: COLORS.text.primary,\n\t\t\t\t\t\t\t\t\t...countryTextStyle,\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{country.name}\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t{showCountryCode && (\n\t\t\t\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\tcolor: COLORS.text.secondary,\n\t\t\t\t\t\t\t\t\t\tfontSize: '12px',\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\t\t{country.code}\n\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</StyledCountryOption>\n\t\t\t\t),\n\t\t\t\tselected: currentCountry?.code === country.code,\n\t\t\t};\n\t\t});\n\t}, [currentCountry?.code, hideFlagImage, showCountryCode, countryTextStyle]);\n\n\tconst handleCountrySelect = (option: SingleOption) => {\n\t\tconst matchingCountry = CountriesData.find(\n\t\t\t(country) => country.code === option.value,\n\t\t);\n\t\tif (matchingCountry) {\n\t\t\t// Only update internal state if in uncontrolled mode\n\t\t\tif (selectedCountry === undefined) {\n\t\t\t\tsetInternalSelectedCountry(matchingCountry);\n\t\t\t}\n\t\t\tonCountrySelect(matchingCountry);\n\t\t}\n\t};\n\n\treturn (\n\t\t<DropdownPopover\n\t\t\tversion={version}\n\t\t\tisSearchable\n\t\t\twidth={popoverWidth}\n\t\t\tplacement={placement}\n\t\t\tstrategy={placementStrategy}\n\t\t\toptions={getCountryOptions}\n\t\t\tdisabled={disabled}\n\t\t\tonSelect={(option) => handleCountrySelect(option as SingleOption)}\n\t\t>\n\t\t\t<StyledCountryPickerContainer\n\t\t\t\theight={height}\n\t\t\t\tstyle={containerStyles}\n\t\t\t\tonClick={onDropdownClick}\n\t\t\t\tdisabled={disabled}\n\t\t\t>\n\t\t\t\t<div className=\"content__wrapper\">\n\t\t\t\t\t{currentCountry ? (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{!hideFlagImage && selectedFlag && (\n\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\tsrc={selectedFlag}\n\t\t\t\t\t\t\t\t\tclassName=\"country-flag\"\n\t\t\t\t\t\t\t\t\talt={currentCountry.name}\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<BodySecondary style={countryTextStyle}>\n\t\t\t\t\t\t\t\t{currentCountry.name}\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t</>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tcolor: COLORS.text.disabled,\n\t\t\t\t\t\t\t\t...countryTextStyle,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{placeholder}\n\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t<DownIcon\n\t\t\t\t\twidth={24}\n\t\t\t\t\theight={24}\n\t\t\t\t\tcolor={disabled ? COLORS.text.disabled : COLORS.content.primary}\n\t\t\t\t/>\n\t\t\t</StyledCountryPickerContainer>\n\t\t</DropdownPopover>\n\t);\n};\n"],"names":["CountryPicker","_ref","version","onCountrySelect","selectedCountry","popoverWidth","height","placement","placementStrategy","disabled","hideFlagImage","containerStyles","placeholder","showCountryCode","countryTextStyle","onDropdownClick","internalSelectedCountry","setInternalSelectedCountry","useState","currentCountry","selectedFlag","_a","code","toLowerCase","undefined","getCountryOptions","useMemo","CountriesData","map","country","flag","value","label","name","searchKey","customComponent","_jsxs","StyledCountryOption","children","_jsx","src","className","alt","Object","assign","BodySecondary","style","color","COLORS","text","primary","secondary","fontSize","selected","DropdownPopover","isSearchable","width","strategy","options","onSelect","option","matchingCountry","find","handleCountrySelect","StyledCountryPickerContainer","onClick","_Fragment","DownIcon","content"],"mappings":"oyCAqFaA,MAAAA,EAA8CC,IAetD,IAfuDC,QAC3DA,EAAOC,gBACPA,EAAeC,gBACfA,EAAeC,aACfA,EAAe,QAAOC,OACtBA,EAAMC,UACNA,EAAY,eAAcC,kBAC1BA,EAAoB,WAAUC,SAC9BA,GAAW,EAAKC,cAChBA,GAAgB,EAAKC,gBACrBA,EAAeC,YACfA,EAAc,mBAAkBC,gBAChCA,GAAkB,EAAIC,iBACtBA,EAAgBC,gBAChBA,GACAd,QACA,MAAOe,EAAyBC,GAA8BC,EAE5Dd,GAGIe,EAAiBf,QAAAA,EAAmBY,EAEpCI,EAAeD,yBACwB,QAAnBE,EAAAF,EAAeG,YAAI,IAAAD,OAAA,EAAAA,EAAEE,yBAC5CC,EAEGC,EAAoBC,GAAQ,IAC1BC,EAAcC,KAAKC,UACzB,MAAMC,EAAO,uBAAqC,QAAdT,EAAAQ,EAAQP,YAAM,IAAAD,OAAA,EAAAA,EAAAE,oBAClD,MAAO,CACNQ,MAAOF,EAAQP,KACfU,MAAOH,EAAQI,KACfC,UAAWL,EAAQI,KACnBE,gBACCC,EAACC,EAAmB,CAAAC,SAAA,EACjB5B,GACD6B,EAAK,MAAA,CAAAC,IAAKV,EAAMW,UAAU,eAAeC,IAAKb,EAAQI,OAEvDG,EAAA,MAAAO,OAAAC,OAAA,CAAKH,UAAU,gBACd,CAAAH,SAAA,CAAAC,EAACM,EAAaF,OAAAC,OAAA,CACbE,MAAKH,OAAAC,OAAA,CACJG,MAAOC,EAAOC,KAAKC,SAChBpC,IAAgB,CAAAwB,SAGnBT,EAAQI,QAETpB,GACA0B,EAACM,EACAF,OAAAC,OAAA,CAAAE,MAAO,CACNC,MAAOC,EAAOC,KAAKE,UACnBC,SAAU,SACV,CAAAd,SAEAT,EAAQP,eAMd+B,UAAUlC,aAAc,EAAdA,EAAgBG,QAASO,EAAQP,KAC3C,KAEA,CAACH,eAAAA,EAAgBG,KAAMZ,EAAeG,EAAiBC,IAe1D,OACCyB,EAACe,EACAX,OAAAC,OAAA,CAAA1C,QAASA,EACTqD,cAAY,EACZC,MAAOnD,EACPE,UAAWA,EACXkD,SAAUjD,EACVkD,QAASjC,EACThB,SAAUA,EACVkD,SAAWC,GAtBgBA,KAC5B,MAAMC,EAAkBlC,EAAcmC,MACpCjC,GAAYA,EAAQP,OAASsC,EAAO7B,QAElC8B,SAEqBrC,IAApBpB,GACHa,EAA2B4C,GAE5B1D,EAAgB0D,GAChB,EAYsBE,CAAoBH,IAAuB,CAAAtB,SAEjEF,EAAC4B,EAA4BrB,OAAAC,OAAA,CAC5BtC,OAAQA,EACRwC,MAAOnC,EACPsD,QAASlD,EACTN,SAAUA,GAAQ,CAAA6B,SAAA,CAElBC,EAAK,MAAAI,OAAAC,OAAA,CAAAH,UAAU,oBAAkB,CAAAH,SAC/BnB,EACAiB,EAAA8B,EAAA,CAAA5B,SAAA,EACG5B,GAAiBU,GAClBmB,EACC,MAAA,CAAAC,IAAKpB,EACLqB,UAAU,eACVC,IAAKvB,EAAec,OAGtBM,EAACM,EAAaF,OAAAC,OAAA,CAACE,MAAOhC,aACpBK,EAAec,WAIlBM,EAACM,EACAF,OAAAC,OAAA,CAAAE,qBACCC,MAAOC,EAAOC,KAAKxC,UAChBK,IAAgB,CAAAwB,SAGnB1B,QAIJ2B,EAAC4B,EAAQ,CACRX,MAAO,GACPlD,OAAQ,GACRyC,MAAOtC,EAAWuC,EAAOC,KAAKxC,SAAWuC,EAAOoB,QAAQlB,gBAGzC"}
+{"version":3,"file":"CountryPicker.js","sources":["../../../../src/components/country-code-picker/CountryPicker.tsx"],"sourcesContent":["import { Placement, PositioningStrategy } from '@popperjs/core';\nimport DownIcon from '@src/assets/icons/chevronDown.svg';\nimport React, { useMemo, useState } from 'react';\nimport {\n\tCountriesData,\n\tCountryCode,\n} from '@src/components/country-code-picker/CountryCodePicker.modal';\nimport {\n\tStyledCountryOption,\n\tStyledCountryPickerContainer,\n} from '@src/components/country-code-picker/CountryPicker.styled';\nimport { DropdownPopover } from '@src/components/dropdown';\nimport { DropdownOption, SingleOption } from '@src/components/dropdown/type';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\n/**\n * Props for the CountryPicker component\n */\nexport interface CountryPickerProps {\n\t/**\n\t * Version of the dropdown popover to use\n\t */\n\tversion: '1.0' | '2.0';\n\t/**\n\t * Callback function when a country is selected\n\t */\n\tonCountrySelect: (country: CountryCode) => void;\n\t/**\n\t * Currently selected country\n\t */\n\tselectedCountry?: CountryCode;\n\t/**\n\t * Width of the popover dropdown\n\t * @default \"300px\"\n\t */\n\tpopoverWidth?: string;\n\t/**\n\t * Height of the picker container\n\t */\n\theight?: string;\n\t/**\n\t * Placement of the dropdown relative to the trigger\n\t * @default \"bottom-start\"\n\t */\n\tplacement?: Placement;\n\t/**\n\t * Positioning strategy for the dropdown\n\t * @default \"absolute\"\n\t */\n\tplacementStrategy?: PositioningStrategy;\n\t/**\n\t * Whether the picker is disabled\n\t * @default false\n\t */\n\tdisabled?: boolean;\n\t/**\n\t * Whether to hide the flag image\n\t * @default false\n\t */\n\thideFlagImage?: boolean;\n\t/**\n\t * Custom styles for the container\n\t */\n\tcontainerStyles?: React.CSSProperties;\n\t/**\n\t * Placeholder text when no country is selected\n\t * @default \"Select a country\"\n\t */\n\tplaceholder?: string;\n\t/**\n\t * Whether to show country code alongside name\n\t * @default true\n\t */\n\tshowCountryCode?: boolean;\n\t/**\n\t * Custom text style for the country name\n\t */\n\tcountryTextStyle?: React.CSSProperties;\n\t/**\n\t * Callback when dropdown is clicked\n\t */\n\tonDropdownClick?: () => void;\n}\n\nexport const CountryPicker: React.FC<CountryPickerProps> = ({\n\tversion,\n\tonCountrySelect,\n\tselectedCountry,\n\tpopoverWidth = '300px',\n\theight,\n\tplacement = 'bottom-start',\n\tplacementStrategy = 'absolute',\n\tdisabled = false,\n\thideFlagImage = false,\n\tcontainerStyles,\n\tplaceholder = 'Select a country',\n\tshowCountryCode = true,\n\tcountryTextStyle,\n\tonDropdownClick,\n}) => {\n\tconst [internalSelectedCountry, setInternalSelectedCountry] = useState<\n\t\tCountryCode | undefined\n\t>(selectedCountry);\n\n\t// Derive the current selected country (controlled vs uncontrolled)\n\tconst currentCountry = selectedCountry ?? internalSelectedCountry;\n\n\tconst selectedFlag = currentCountry\n\t\t? `https://flagcdn.com/${currentCountry.code?.toLowerCase()}.svg`\n\t\t: undefined;\n\n\tconst getCountryOptions = useMemo((): DropdownOption[] => {\n\t\treturn CountriesData.map((country) => {\n\t\t\tconst flag = `https://flagcdn.com/${country.code?.toLowerCase()}.svg`;\n\t\t\treturn {\n\t\t\t\tvalue: country.code,\n\t\t\t\tlabel: country.name,\n\t\t\t\tsearchKey: country.name,\n\t\t\t\tcustomComponent: (\n\t\t\t\t\t<StyledCountryOption>\n\t\t\t\t\t\t{!hideFlagImage && (\n\t\t\t\t\t\t\t<img src={flag} className=\"country-flag\" alt={country.name} />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t<div className=\"country-info\">\n\t\t\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tcolor: COLORS.text.primary,\n\t\t\t\t\t\t\t\t\t...countryTextStyle,\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{country.name}\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t{showCountryCode && (\n\t\t\t\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\tcolor: COLORS.text.secondary,\n\t\t\t\t\t\t\t\t\t\tfontSize: '12px',\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\t\t{country.code}\n\t\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</StyledCountryOption>\n\t\t\t\t),\n\t\t\t\tselected: currentCountry?.code === country.code,\n\t\t\t};\n\t\t});\n\t}, [currentCountry?.code, hideFlagImage, showCountryCode, countryTextStyle]);\n\n\tconst handleCountrySelect = (option: SingleOption) => {\n\t\tconst matchingCountry = CountriesData.find(\n\t\t\t(country) => country.code === option.value,\n\t\t);\n\t\tif (matchingCountry) {\n\t\t\t// Only update internal state if in uncontrolled mode\n\t\t\tif (selectedCountry === undefined) {\n\t\t\t\tsetInternalSelectedCountry(matchingCountry);\n\t\t\t}\n\t\t\tonCountrySelect(matchingCountry);\n\t\t}\n\t};\n\n\treturn (\n\t\t<DropdownPopover\n\t\t\tversion={version}\n\t\t\tisSearchable\n\t\t\twidth={popoverWidth}\n\t\t\tplacement={placement}\n\t\t\tstrategy={placementStrategy}\n\t\t\toptions={getCountryOptions}\n\t\t\tdisabled={disabled}\n\t\t\tonSelect={(option) => handleCountrySelect(option as SingleOption)}\n\t\t>\n\t\t\t<StyledCountryPickerContainer\n\t\t\t\theight={height}\n\t\t\t\tstyle={containerStyles}\n\t\t\t\tonClick={onDropdownClick}\n\t\t\t\tdisabled={disabled}\n\t\t\t>\n\t\t\t\t<div className=\"content__wrapper\">\n\t\t\t\t\t{currentCountry ? (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{!hideFlagImage && selectedFlag && (\n\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\tsrc={selectedFlag}\n\t\t\t\t\t\t\t\t\tclassName=\"country-flag\"\n\t\t\t\t\t\t\t\t\talt={currentCountry.name}\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<BodySecondary style={countryTextStyle}>\n\t\t\t\t\t\t\t\t{currentCountry.name}\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t</>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tcolor: COLORS.text.disabled,\n\t\t\t\t\t\t\t\t...countryTextStyle,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{placeholder}\n\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t<DownIcon\n\t\t\t\t\twidth={24}\n\t\t\t\t\theight={24}\n\t\t\t\t\tcolor={disabled ? COLORS.text.disabled : COLORS.content.primary}\n\t\t\t\t/>\n\t\t\t</StyledCountryPickerContainer>\n\t\t</DropdownPopover>\n\t);\n};\n"],"names":["CountryPicker","version","onCountrySelect","selectedCountry","popoverWidth","height","placement","placementStrategy","disabled","hideFlagImage","containerStyles","placeholder","showCountryCode","countryTextStyle","onDropdownClick","internalSelectedCountry","setInternalSelectedCountry","useState","currentCountry","selectedFlag","_a","code","toLowerCase","undefined","getCountryOptions","useMemo","CountriesData","map","country","flag","value","label","name","searchKey","customComponent","_jsxs","StyledCountryOption","children","_jsx","src","className","alt","Object","assign","BodySecondary","style","color","COLORS","text","primary","secondary","fontSize","selected","DropdownPopover","isSearchable","width","strategy","options","onSelect","option","matchingCountry","find","handleCountrySelect","StyledCountryPickerContainer","onClick","_Fragment","DownIcon","content"],"mappings":"oyCAqFO,MAAMA,EAA8CA,EAC1DC,UACAC,kBACAC,kBACAC,eAAe,QACfC,SACAC,YAAY,eACZC,oBAAoB,WACpBC,YAAW,EACXC,iBAAgB,EAChBC,kBACAC,cAAc,mBACdC,mBAAkB,EAClBC,mBACAC,4BAEA,MAAOC,EAAyBC,GAA8BC,EAE5Dd,GAGIe,EAAiBf,QAAAA,EAAmBY,EAEpCI,EAAeD,EAClB,uBAA0C,QAAnBE,EAAAF,EAAeG,YAAI,IAAAD,OAAA,EAAAA,EAAEE,yBAC5CC,EAEGC,EAAoBC,GAAQ,IAC1BC,EAAcC,KAAKC,UACzB,MAAMC,EAAO,uBAAqC,QAAdT,EAAAQ,EAAQP,YAAM,IAAAD,OAAA,EAAAA,EAAAE,oBAClD,MAAO,CACNQ,MAAOF,EAAQP,KACfU,MAAOH,EAAQI,KACfC,UAAWL,EAAQI,KACnBE,gBACCC,EAACC,EAAmB,CAAAC,SAAA,EACjB5B,GACD6B,EAAK,MAAA,CAAAC,IAAKV,EAAMW,UAAU,eAAeC,IAAKb,EAAQI,OAEvDG,EAAA,MAAAO,OAAAC,OAAA,CAAKH,UAAU,gBACd,CAAAH,SAAA,CAAAC,EAACM,EAAaF,OAAAC,OAAA,CACbE,MAAKH,OAAAC,OAAA,CACJG,MAAOC,EAAOC,KAAKC,SAChBpC,IAAgB,CAAAwB,SAGnBT,EAAQI,QAETpB,GACA0B,EAACM,EACAF,OAAAC,OAAA,CAAAE,MAAO,CACNC,MAAOC,EAAOC,KAAKE,UACnBC,SAAU,SACV,CAAAd,SAEAT,EAAQP,eAMd+B,UAAUlC,aAAc,EAAdA,EAAgBG,QAASO,EAAQP,KAC3C,KAEA,CAACH,eAAAA,EAAgBG,KAAMZ,EAAeG,EAAiBC,IAe1D,OACCyB,EAACe,EACAX,OAAAC,OAAA,CAAA1C,QAASA,EACTqD,cAAY,EACZC,MAAOnD,EACPE,UAAWA,EACXkD,SAAUjD,EACVkD,QAASjC,EACThB,SAAUA,EACVkD,SAAWC,GAtBgBA,KAC5B,MAAMC,EAAkBlC,EAAcmC,MACpCjC,GAAYA,EAAQP,OAASsC,EAAO7B,QAElC8B,SAEqBrC,IAApBpB,GACHa,EAA2B4C,GAE5B1D,EAAgB0D,GAChB,EAYsBE,CAAoBH,IAAuB,CAAAtB,SAEjEF,EAAC4B,EAA4BrB,OAAAC,OAAA,CAC5BtC,OAAQA,EACRwC,MAAOnC,EACPsD,QAASlD,EACTN,SAAUA,GAAQ,CAAA6B,SAAA,CAElBC,EAAK,MAAAI,OAAAC,OAAA,CAAAH,UAAU,oBAAkB,CAAAH,SAC/BnB,EACAiB,EAAA8B,EAAA,CAAA5B,SAAA,EACG5B,GAAiBU,GAClBmB,EACC,MAAA,CAAAC,IAAKpB,EACLqB,UAAU,eACVC,IAAKvB,EAAec,OAGtBM,EAACM,EAAaF,OAAAC,OAAA,CAACE,MAAOhC,aACpBK,EAAec,WAIlBM,EAACM,EACAF,OAAAC,OAAA,CAAAE,qBACCC,MAAOC,EAAOC,KAAKxC,UAChBK,IAAgB,CAAAwB,SAGnB1B,QAIJ2B,EAAC4B,EAAQ,CACRX,MAAO,GACPlD,OAAQ,GACRyC,MAAOtC,EAAWuC,EAAOC,KAAKxC,SAAWuC,EAAOoB,QAAQlB,gBAGzC"}