npm - @skodaflow/web-library - Versions diffs - 7.13.1 → 7.15.0 - Mend

@skodaflow/web-library 7.13.1 → 7.15.0

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

Files changed (798) hide show

package/components/cardMenu/styled/drawerStyled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"drawerStyled.js","sources":["../../../../src/components/cardMenu/styled/drawerStyled.tsx"],"sourcesContent":["import { styled } from '@mui/~~system~~';\nimport { Drawer } from '@mui/material';\n\nexport const DrawerStyled = styled(Drawer, {\n shouldForwardProp: (prop) => prop !== 'hasHeader',\n})<{ hasHeader: boolean }>(({ theme, hasHeader }) => {\n return {\n '& .MuiPaper-root > .MuiList-root': {\n fontSize: '16px',\n fontWeight: 400,\n paddingBottom: '32px',\n listStyleType: 'none',\n maxHeight: '201px',\n marginTop: hasHeader ? '9px' : '0px',\n '& > .MuiListItem-root': {\n lineHeight: '24px',\n padding: '23px 16px 11px 16px',\n display: 'flex',\n '&:hover': {\n background: theme.palette.surface.primary,\n },\n '& > .MuiListItemIcon-root': {\n display: 'inline-block',\n lineHeight: '21px',\n minWidth: 'unset',\n width: '20px',\n marginRight: '8px',\n '& > .MuiIcon-root': {\n color: theme.palette.text.primary,\n display: 'inline',\n },\n },\n '& > .MuiTypography-root': {\n flex: 1,\n },\n },\n },\n '.MuiPaper-root > .drawer-header': {\n padding: '16px 16px 0px 16px',\n fontWeight: 'bold',\n lineHeight: '24px',\n fontSize: '20px',\n wordBreak: 'break-all',\n },\n '& > .MuiPaper-root': {\n borderTopLeftRadius: '16px',\n borderTopRightRadius: '16px',\n },\n };\n});\n"],"names":["DrawerStyled","styled","Drawer","shouldForwardProp","prop","theme","hasHeader","fontSize","fontWeight","paddingBottom","listStyleType","maxHeight","marginTop","lineHeight","padding","display","background","palette","surface","primary","minWidth","width","marginRight","color","text","flex","wordBreak","borderTopLeftRadius","borderTopRightRadius"],"mappings":"~~4EAGa~~,MAAAA,EAAeC,EAAOC,EAAQ,CACzCC,kBAAoBC,GAAkB,cAATA,GADHH,EAED,EAAGI,QAAOC,gBAC5B,CACL,mCAAoC,CAClCC,SAAU,OACVC,WAAY,IACZC,cAAe,OACfC,cAAe,OACfC,UAAW,QACXC,UAAWN,EAAY,MAAQ,MAC/B,wBAAyB,CACvBO,WAAY,OACZC,QAAS,sBACTC,QAAS,OACT,UAAW,CACTC,WAAYX,EAAMY,QAAQC,QAAQC,SAEpC,4BAA6B,CAC3BJ,QAAS,eACTF,WAAY,OACZO,SAAU,QACVC,MAAO,OACPC,YAAa,MACb,oBAAqB,CACnBC,MAAOlB,EAAMY,QAAQO,KAAKL,QAC1BJ,QAAS,WAGb,0BAA2B,CACzBU,KAAM,KAIZ,kCAAmC,CACjCX,QAAS,qBACTN,WAAY,OACZK,WAAY,OACZN,SAAU,OACVmB,UAAW,aAEb,qBAAsB,CACpBC,oBAAqB,OACrBC,qBAAsB"}
1	+ {"version":3,"file":"drawerStyled.js","sources":["../../../../src/components/cardMenu/styled/drawerStyled.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\nimport { Drawer } from '@mui/material';\n\nexport const DrawerStyled = styled(Drawer, {\n shouldForwardProp: (prop) => prop !== 'hasHeader',\n})<{ hasHeader: boolean }>(({ theme, hasHeader }) => {\n return {\n '& .MuiPaper-root > .MuiList-root': {\n fontSize: '16px',\n fontWeight: 400,\n paddingBottom: '32px',\n listStyleType: 'none',\n maxHeight: '201px',\n marginTop: hasHeader ? '9px' : '0px',\n '& > .MuiListItem-root': {\n lineHeight: '24px',\n padding: '23px 16px 11px 16px',\n display: 'flex',\n '&:hover': {\n background: theme.palette.surface.primary,\n },\n '& > .MuiListItemIcon-root': {\n display: 'inline-block',\n lineHeight: '21px',\n minWidth: 'unset',\n width: '20px',\n marginRight: '8px',\n '& > .MuiIcon-root': {\n color: theme.palette.text.primary,\n display: 'inline',\n },\n },\n '& > .MuiTypography-root': {\n flex: 1,\n },\n },\n },\n '.MuiPaper-root > .drawer-header': {\n padding: '16px 16px 0px 16px',\n fontWeight: 'bold',\n lineHeight: '24px',\n fontSize: '20px',\n wordBreak: 'break-all',\n },\n '& > .MuiPaper-root': {\n borderTopLeftRadius: '16px',\n borderTopRightRadius: '16px',\n },\n };\n});\n"],"names":["DrawerStyled","styled","Drawer","shouldForwardProp","prop","theme","hasHeader","fontSize","fontWeight","paddingBottom","listStyleType","maxHeight","marginTop","lineHeight","padding","display","background","palette","surface","primary","minWidth","width","marginRight","color","text","flex","wordBreak","borderTopLeftRadius","borderTopRightRadius"],"mappings":"qFAGa,MAAAA,EAAeC,EAAOC,EAAQ,CACzCC,kBAAoBC,GAAkB,cAATA,GADHH,EAED,EAAGI,QAAOC,gBAC5B,CACL,mCAAoC,CAClCC,SAAU,OACVC,WAAY,IACZC,cAAe,OACfC,cAAe,OACfC,UAAW,QACXC,UAAWN,EAAY,MAAQ,MAC/B,wBAAyB,CACvBO,WAAY,OACZC,QAAS,sBACTC,QAAS,OACT,UAAW,CACTC,WAAYX,EAAMY,QAAQC,QAAQC,SAEpC,4BAA6B,CAC3BJ,QAAS,eACTF,WAAY,OACZO,SAAU,QACVC,MAAO,OACPC,YAAa,MACb,oBAAqB,CACnBC,MAAOlB,EAAMY,QAAQO,KAAKL,QAC1BJ,QAAS,WAGb,0BAA2B,CACzBU,KAAM,KAIZ,kCAAmC,CACjCX,QAAS,qBACTN,WAAY,OACZK,WAAY,OACZN,SAAU,OACVmB,UAAW,aAEb,qBAAsB,CACpBC,oBAAqB,OACrBC,qBAAsB"}

package/components/cardMenu/styled/popperStyled.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-export declare const PopperStyled: import("@emotion/styled").StyledComponent<import("@mui/base").PopperOwnProps & Omit<any, keyof import("@mui/base").PopperOwnProps> & import("@mui/system").MUIStyledCommonProps<import("@mui/system").Theme> & {
+export declare const PopperStyled: import("@emotion/styled").StyledComponent<import("@mui/material").PopperProps & import("react").RefAttributes<HTMLDivElement> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
     theme?: any;
     isMobile?: boolean;
     rounded?: boolean;

package/components/cardMenu/styled/popperStyled.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{styled as r}from"@mui/system";import{Popper as o}from"@mui/base";const d=r(o,{shouldForwardProp:r=>"rounded"!==r})((({theme:r,rounded:o})=>({zIndex:"100",background:r.palette.background.primary,"& > *":{borderRadius:o?"4px":void 0}})));export{d as PopperStyled};
+import{styled as r}from"@mui/material/styles";import{Popper as o}from"@mui/material";const d=r(o,{shouldForwardProp:r=>"rounded"!==r})((({theme:r,rounded:o})=>({zIndex:"100",background:r.palette.background.primary,"& > *":{borderRadius:o?"4px":void 0}})));export{d as PopperStyled};
 //# sourceMappingURL=popperStyled.js.map

package/components/cardMenu/styled/popperStyled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"popperStyled.js","sources":["../../../../src/components/cardMenu/styled/popperStyled.tsx"],"sourcesContent":["import { styled } from '@mui/~~system~~';\nimport { Popper } from '@mui/~~base~~';\n\nexport const PopperStyled = styled(Popper, {\n shouldForwardProp: (propName) => propName !== 'rounded',\n})<{\n theme?: any;\n isMobile?: boolean;\n rounded?: boolean;\n}>(({ theme, rounded }) => {\n return {\n zIndex: '100',\n background: theme.palette.background.primary,\n '& > *': {\n borderRadius: rounded ? '4px' : undefined,\n },\n };\n});\n"],"names":["PopperStyled","styled","Popper","shouldForwardProp","propName","theme","rounded","zIndex","background","palette","primary","borderRadius","undefined"],"mappings":"~~wEAGa~~,MAAAA,EAAeC,EAAOC,EAAQ,CACzCC,kBAAoBC,GAA0B,YAAbA,GADPH,EAMzB,EAAGI,QAAOC,cACJ,CACLC,OAAQ,MACRC,WAAYH,EAAMI,QAAQD,WAAWE,QACrC,QAAS,CACPC,aAAcL,EAAU,WAAQM"}
1	+ {"version":3,"file":"popperStyled.js","sources":["../../../../src/components/cardMenu/styled/popperStyled.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\nimport { Popper } from '@mui/material';\n\nexport const PopperStyled = styled(Popper, {\n shouldForwardProp: (propName) => propName !== 'rounded',\n})<{\n theme?: any;\n isMobile?: boolean;\n rounded?: boolean;\n}>(({ theme, rounded }) => {\n return {\n zIndex: '100',\n background: theme.palette.background.primary,\n '& > *': {\n borderRadius: rounded ? '4px' : undefined,\n },\n };\n});\n"],"names":["PopperStyled","styled","Popper","shouldForwardProp","propName","theme","rounded","zIndex","background","palette","primary","borderRadius","undefined"],"mappings":"qFAGa,MAAAA,EAAeC,EAAOC,EAAQ,CACzCC,kBAAoBC,GAA0B,YAAbA,GADPH,EAMzB,EAAGI,QAAOC,cACJ,CACLC,OAAQ,MACRC,WAAYH,EAAMI,QAAQD,WAAWE,QACrC,QAAS,CACPC,aAAcL,EAAU,WAAQM"}

package/components/carousel/navigation.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{__rest as r}from"tslib";import{jsxs as o,Fragment as e,jsx as s}from"react/jsx-runtime";import{useMemo as t}from"react";import{useCarousel as n,useCarouselPeekEffect as i}from"./hooks.js";import{useTheme as a}from"@mui/system";import{useMediaQuery as c,IconButton as l}from"@mui/material";import{ChevronLeftIcon as p}from"../icon/stroke/ChevronLeftIcon.js";import{ChevronRightIcon as m}from"../icon/stroke/ChevronRightIcon.js";import{ArrowLeftIcon as d}from"../icon/stroke/ArrowLeftIcon.js";import{ArrowRightIcon as u}from"../icon/stroke/ArrowRightIcon.js";import{getInteractiveStyle as b}from"../../materialui/button/interactive.js";function g({carousel:g,peekEffect:f=!1,prevButtonProps:j,prevIconProps:x,PrevIconComponent:O,nextButtonProps:k,nextIconProps:v,NextIconComponent:C,arrows:P=!0,onBackground:h=!1}){const I=n(),y=g||I,M="fade"!==(null==y?void 0:y.originalParams.effect)&&f,B=a(),E=c(B.breakpoints.up("md")),L=j||{},{sx:w}=L,N=r(L,["sx"]),A=k||{},{sx:R}=A,z=r(A,["sx"]),[S,q]=i(y),D=O||(P?d:p),F=C||(P?u:m),G=t((()=>Object.assign(Object.assign({position:"absolute",zIndex:"100",top:"50%",mt:"-22px"},b({color:"text.primary",borderColor:h?"transparent.transparent":"onSurface.os600",backgroundColor:h?"transparent.transparent":"surface.primary"},{backgroundColor:"surface.secondary"})),{"&.Mui-disabled":{color:"disabled.tertiary",borderColor:"disabled.primary",backgroundColor:h?"transparent.transparent":"disabled.secondary"}})),[]);return o(e,{children:[s(l,Object.assign({disabled:y&&!y.originalParams.loop&&y.isBeginning,onClick:()=>{null==y||y.slidePrev(),M&&S&&q("reset")},onMouseEnter:()=>E&&M&&q("prev"),onMouseLeave:()=>M&&S&&q("reset"),sx:Object.assign(Object.assign(Object.assign({},G),{left:"16px"}),w),"aria-label":"Previous slide","aria-controls":"carousel",color:"surface"},N,{children:"rtl"===B.direction?s(F,Object.assign({},x)):s(D,Object.assign({},x))})),s(l,Object.assign({disabled:y&&!y.originalParams.loop&&y.isEnd,onClick:()=>{null==y||y.slideNext(),M&&S&&q("reset")},onMouseEnter:()=>E&&M&&q("next"),onMouseLeave:()=>M&&S&&q("reset"),sx:Object.assign(Object.assign(Object.assign({},G),{right:"16px"}),R),"aria-label":"Next slide","aria-controls":"carousel",color:"surface"},z,{children:"rtl"===B.direction?s(D,Object.assign({},v)):s(F,Object.assign({},v))}))]})}export{g as CarouselNavigation};
+import{__rest as r}from"tslib";import{jsxs as o,Fragment as e,jsx as s}from"react/jsx-runtime";import{useMemo as t}from"react";import{useCarousel as n,useCarouselPeekEffect as i}from"./hooks.js";import{useTheme as a,useMediaQuery as c,IconButton as l}from"@mui/material";import{ChevronLeftIcon as p}from"../icon/stroke/ChevronLeftIcon.js";import{ChevronRightIcon as d}from"../icon/stroke/ChevronRightIcon.js";import{ArrowLeftIcon as m}from"../icon/stroke/ArrowLeftIcon.js";import{ArrowRightIcon as u}from"../icon/stroke/ArrowRightIcon.js";import{getInteractiveStyle as x}from"../../materialui/button/interactive.js";function b({carousel:b,peekEffect:g=!1,prevButtonProps:f,prevIconProps:j,PrevIconComponent:O,nextButtonProps:k,nextIconProps:v,NextIconComponent:h,arrows:C=!0,onBackground:I=!1}){const P=n(),y=b||P,M="fade"!==(null==y?void 0:y.originalParams.effect)&&g,w=a(),B=c(w.breakpoints.up("md")),E=f||{},{sx:L}=E,z=r(E,["sx"]),N=k||{},{sx:S}=N,A=r(N,["sx"]),[R,q]=i(y),D=O||(C?m:p),F=h||(C?u:d),G=t((()=>Object.assign(Object.assign({position:"absolute",zIndex:"100",top:"50%",mt:"-22px",width:{xs:"32px",md:"40px",xl:"44px"},height:{xs:"32px",md:"40px",xl:"44px"},"& .MuiSvgIcon-root":{fontSize:{xs:"17px",xl:"20px"}}},x({color:"text.primary",borderColor:I?"transparent.transparent":"onSurface.os100",backgroundColor:I?"transparent.transparent":"surface.primary"},{backgroundColor:"surface.secondary"})),{"&.Mui-disabled":{color:"disabled.tertiary",borderColor:I?"transparent.transparent":"disabled.secondary",backgroundColor:I?"transparent.transparent":"disabled.secondary"}})),[]);return o(e,{children:[s(l,Object.assign({disabled:y&&!y.originalParams.loop&&y.isBeginning,onClick:()=>{null==y||y.slidePrev(),M&&R&&q("reset")},onMouseEnter:()=>B&&M&&q("prev"),onMouseLeave:()=>M&&R&&q("reset"),sx:Object.assign(Object.assign(Object.assign({},G),{left:"16px"}),L),"aria-label":"Previous slide","aria-controls":"carousel",color:"surface",size:"medium"},z,{children:"rtl"===w.direction?s(F,Object.assign({},j)):s(D,Object.assign({},j))})),s(l,Object.assign({disabled:y&&!y.originalParams.loop&&y.isEnd,onClick:()=>{null==y||y.slideNext(),M&&R&&q("reset")},onMouseEnter:()=>B&&M&&q("next"),onMouseLeave:()=>M&&R&&q("reset"),sx:Object.assign(Object.assign(Object.assign({},G),{right:"16px"}),S),"aria-label":"Next slide","aria-controls":"carousel",color:"surface"},A,{children:"rtl"===w.direction?s(D,Object.assign({},v)):s(F,Object.assign({},v))}))]})}export{b as CarouselNavigation};
 //# sourceMappingURL=navigation.js.map

package/components/carousel/navigation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"navigation.js","sources":["../../../src/components/carousel/navigation.tsx"],"sourcesContent":["import React, { useMemo, ElementType } from 'react';\nimport { useCarousel, useCarouselPeekEffect } from './hooks';\nimport { useTheme ~~} from '@mui/system';\nimport { CSSObject~~, IconButton, IconButtonProps, SvgIconProps, useMediaQuery } from '@mui/material';\nimport type { Swiper as CarouselInstance } from 'swiper';\nimport { ChevronLeftIcon } from '@/src/components/icon/stroke/ChevronLeftIcon';\nimport { ChevronRightIcon } from '@/src/components/icon/stroke/ChevronRightIcon';\nimport { ArrowLeftIcon } from '@/src/components/icon/stroke/ArrowLeftIcon';\nimport { ArrowRightIcon } from '@/src/components/icon/stroke/ArrowRightIcon';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport interface CarouselNavigationProps {\n /*\n Optional Carousel instance from useCarouselInstance hook\n /\n carousel?: CarouselInstance;\n /\n Enable/disable peek effect on hover\n * @default: false\n /\n peekEffect?: boolean;\n /\n Previous Slide IconButton\n /\n prevButtonProps?: Partial<IconButtonProps>;\n /\n Previous icon props\n /\n prevIconProps?: SvgIconProps;\n /\n Previous icon node\n /\n PrevIconComponent?: ElementType<SvgIconProps>;\n /\n Next Slide IconButton\n /\n nextButtonProps?: Partial<IconButtonProps>;\n /\n Previous icon props\n /\n nextIconProps?: SvgIconProps;\n /\n Next icon node\n /\n NextIconComponent?: ElementType<SvgIconProps>;\n /\n Replaces Chevrons with Arrows\n * @default true\n /\n arrows?: boolean;\n /\n Enable if placing on a plain background (not on top of an image/video)\n * @default false\n /\n onBackground?: boolean;\n}\n\n/\n Left & Right navigation arrows\n */\nexport function CarouselNavigation({\n carousel: carouselProp,\n peekEffect: propPeekEffect = false,\n prevButtonProps,\n prevIconProps,\n PrevIconComponent,\n nextButtonProps,\n nextIconProps,\n NextIconComponent,\n arrows = true,\n onBackground = false,\n}: CarouselNavigationProps) {\n const carouselHook = useCarousel();\n const carousel = carouselProp \|\| carouselHook;\n const peekEffect = carousel?.originalParams.effect !== 'fade' && propPeekEffect;\n const theme = useTheme();\n const upMD = useMediaQuery(theme.breakpoints.up('md'));\n const { sx: prevSx, ...restPrev } = prevButtonProps \|\| {};\n const { sx: nextSx, ...restNext } = nextButtonProps \|\| {};\n const [peek, setPeek] = useCarouselPeekEffect(carousel);\n const PrevIcon = PrevIconComponent \|\| (arrows ? ArrowLeftIcon : ChevronLeftIcon);\n const NextIcon = NextIconComponent \|\| (arrows ? ArrowRightIcon : ChevronRightIcon);\n\n // shared style between buttons\n const sharedSx = useMemo~~<CSSObject>~~(\n () => ({\n // absolute inside the carousel position\n position: 'absolute',\n zIndex: '100',\n top: '50%',\n // manual v-align, half the icon size\n mt: '-22px',\n // highlight border\n ...getInteractiveStyle(\n {\n color: 'text.primary',\n borderColor: onBackground ? 'transparent.transparent' : 'onSurface.~~os600~~',\n backgroundColor: onBackground ? 'transparent.transparent' : 'surface.primary',\n },\n {\n backgroundColor: 'surface.secondary',\n },\n ),\n // disabled state\n '&.Mui-disabled': {\n color: 'disabled.tertiary',\n borderColor: 'disabled.~~primary~~',\n backgroundColor: onBackground ? 'transparent.transparent' : 'disabled.secondary',\n },\n }),\n [],\n );\n\n return (\n <>\n <IconButton\n disabled={carousel && !carousel.originalParams.loop && carousel.isBeginning}\n onClick={() => {\n carousel?.slidePrev();\n peekEffect && peek && setPeek('reset');\n }}\n onMouseEnter={() => upMD && peekEffect && setPeek('prev')}\n onMouseLeave={() => peekEffect && peek && setPeek('reset')}\n sx={{\n ...sharedSx,\n left: '16px',\n ...prevSx,\n }}\n aria-label=\"Previous slide\"\n aria-controls=\"carousel\"\n color=\"surface\"\n {...restPrev}\n >\n {theme.direction === 'rtl' ? <NextIcon {...prevIconProps} /> : <PrevIcon {...prevIconProps} />}\n </IconButton>\n <IconButton\n disabled={carousel && !carousel.originalParams.loop && carousel.isEnd}\n onClick={() => {\n carousel?.slideNext();\n peekEffect && peek && setPeek('reset');\n }}\n onMouseEnter={() => upMD && peekEffect && setPeek('next')}\n onMouseLeave={() => peekEffect && peek && setPeek('reset')}\n sx={{\n ...sharedSx,\n right: '16px',\n ...nextSx,\n }}\n aria-label=\"Next slide\"\n aria-controls=\"carousel\"\n color=\"surface\"\n {...restNext}\n >\n {theme.direction === 'rtl' ? <PrevIcon {...nextIconProps} /> : <NextIcon {...nextIconProps} />}\n </IconButton>\n </>\n );\n}\n"],"names":["CarouselNavigation","carousel","carouselProp","peekEffect","propPeekEffect","prevButtonProps","prevIconProps","PrevIconComponent","nextButtonProps","nextIconProps","NextIconComponent","arrows","onBackground","carouselHook","useCarousel","originalParams","effect","theme","useTheme","upMD","useMediaQuery","breakpoints","up","_a","sx","prevSx","restPrev","__rest","_b","nextSx","restNext","peek","setPeek","useCarouselPeekEffect","PrevIcon","ArrowLeftIcon","ChevronLeftIcon","NextIcon","ArrowRightIcon","ChevronRightIcon","sharedSx","useMemo","Object","assign","position","zIndex","top","mt","getInteractiveStyle","color","borderColor","backgroundColor","_jsxs","_jsx","IconButton","disabled","loop","isBeginning","onClick","slidePrev","onMouseEnter","onMouseLeave","left","children","direction","isEnd","slideNext","right"],"mappings":"~~ioBA4DgB~~,SAAAA,GACdC,SAAUC,EACVC,WAAYC,GAAiB,EAAKC,gBAClCA,EAAeC,cACfA,EAAaC,kBACbA,EAAiBC,gBACjBA,EAAeC,cACfA,EAAaC,kBACbA,EAAiBC,OACjBA,GAAS,EAAIC,aACbA,GAAe,IAEf,MAAMC,EAAeC,IACfb,EAAWC,GAAgBW,EAC3BV,EAAiD,UAApCF,aAAA,EAAAA,EAAUc,eAAeC,SAAqBZ,EAC3Da,EAAQC,IACRC,EAAOC,EAAcH,EAAMI,YAAYC,GAAG,OAC1CC,EAA8BlB,GAAmB,IAA/CmB,GAAIC,KAAWC,EAAjBC,EAAAJ,EAAA,CAAA,OACAK,EAA8BpB,GAAmB,IAA/CgB,GAAIK,KAAWC,EAAjBH,EAAAC,EAAA,CAAA,QACCG,EAAMC,GAAWC,EAAsBhC,GACxCiC,EAAW3B,IAAsBI,EAASwB,EAAgBC,GAC1DC,EAAW3B,IAAsBC,EAAS2B,EAAiBC,GAG3DC,EAAWC,GACf,IAAMC,OAAAC,OAAAD,OAAAC,OAAA,CAEJC,SAAU,WACVC,OAAQ,MACRC,IAAK,MAELC,GAAI,~~SAEDC~~,EACD,CACEC,MAAO,eACPC,~~YAAatC~~,EAAe,0BAA4B,~~kBACxDuC~~,~~gBAAiBvC~~,EAAe,0BAA4B,mBAE9D,~~CACEuC~~,gBAAiB,uBAEpB,CAED,iBAAkB,CAChBF,MAAO,oBACPC,~~YAAa~~,~~mBACbC~~,~~gBAAiBvC~~,EAAe,0BAA4B,yBAGhE,IAGF,~~OACEwC~~,eACEC,EAACC,iBACCC,~~SAAUtD~~,IAAaA,EAASc,~~eAAeyC~~,~~MAAQvD~~,~~EAASwD~~,YAChEC,QAAS,~~KACPzD~~,SAAAA,~~EAAU0D~~,~~YACVxD~~,GAAc4B,GAAQC,EAAQ,QAAQ,~~EAExC4B~~,aAAc,~~IAAMzC~~,GAAQhB,GAAc6B,EAAQ,~~QAClD6B~~,aAAc,~~IAAM1D~~,GAAc4B,GAAQC,EAAQ,SAClDR,~~GAAEkB~~,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,~~CAAA~~,~~EACGH~~,~~GACH,CAAAsB,~~KAAM,~~SACHrC~~,~~GAEM~~,~~aAAA~~,~~iCACG~~,~~WACdwB~~,MAAM,~~WACFvB~~,~~EAAQ~~,~~CAAAqC~~,~~SAES~~,~~QAApB9C~~,~~EAAM+C~~,~~UAAsBX~~,~~EAAChB~~,~~EAAaK~~,OAAAC,OAAA,CAAA,EAAArC,~~IAAoB+C,EAACnB,mBAAa5B,~~OAE/~~E+C~~,EAACC,~~EACCZ~~,OAAAC,OAAA,~~CAAAY~~,~~SAAUtD~~,IAAaA,EAASc,~~eAAeyC~~,~~MAAQvD~~,~~EAASgE~~,~~MAChEP~~,QAAS,~~KACPzD~~,SAAAA,~~EAAUiE~~,~~YACV/D~~,GAAc4B,GAAQC,EAAQ,QAAQ,~~EAExC4B~~,aAAc,~~IAAMzC~~,GAAQhB,GAAc6B,EAAQ,~~QAClD6B~~,aAAc,~~IAAM1D~~,GAAc4B,GAAQC,EAAQ,SAClDR,GAAEkB,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EACGH,GAAQ,~~CACX2B~~,MAAO,~~SACJtC~~,GAEM,aAAA,aACG,gBAAA,~~WACdoB~~,MAAM,~~WACFnB~~,EAEH,~~CAAAiC~~,SAAoB,~~QAApB9C~~,~~EAAM+C~~,~~UAAsBX~~,~~EAACnB~~,EAAQQ,OAAAC,OAAA,CAAA,EAAKlC,~~IAAoB4C~~,~~EAAChB~~,mBAAa5B,SAIrF"}
1	+ {"version":3,"file":"navigation.js","sources":["../../../src/components/carousel/navigation.tsx"],"sourcesContent":["import React, { useMemo, ElementType } from 'react';\nimport { useCarousel, useCarouselPeekEffect } from './hooks';\nimport { useTheme, IconButton, IconButtonProps, SvgIconProps, useMediaQuery } from '@mui/material';\nimport type { Swiper as CarouselInstance } from 'swiper';\nimport { ChevronLeftIcon } from '@/src/components/icon/stroke/ChevronLeftIcon';\nimport { ChevronRightIcon } from '@/src/components/icon/stroke/ChevronRightIcon';\nimport { ArrowLeftIcon } from '@/src/components/icon/stroke/ArrowLeftIcon';\nimport { ArrowRightIcon } from '@/src/components/icon/stroke/ArrowRightIcon';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport interface CarouselNavigationProps {\n /*\n Optional Carousel instance from useCarouselInstance hook\n /\n carousel?: CarouselInstance;\n /\n Enable/disable peek effect on hover\n * @default: false\n /\n peekEffect?: boolean;\n /\n Previous Slide IconButton\n /\n prevButtonProps?: Partial<IconButtonProps>;\n /\n Previous icon props\n /\n prevIconProps?: SvgIconProps;\n /\n Previous icon node\n /\n PrevIconComponent?: ElementType<SvgIconProps>;\n /\n Next Slide IconButton\n /\n nextButtonProps?: Partial<IconButtonProps>;\n /\n Previous icon props\n /\n nextIconProps?: SvgIconProps;\n /\n Next icon node\n /\n NextIconComponent?: ElementType<SvgIconProps>;\n /\n Replaces Chevrons with Arrows\n * @default true\n /\n arrows?: boolean;\n /\n Enable if placing on a plain background (not on top of an image/video)\n * @default false\n /\n onBackground?: boolean;\n}\n\n/\n Left & Right navigation arrows\n */\nexport function CarouselNavigation({\n carousel: carouselProp,\n peekEffect: propPeekEffect = false,\n prevButtonProps,\n prevIconProps,\n PrevIconComponent,\n nextButtonProps,\n nextIconProps,\n NextIconComponent,\n arrows = true,\n onBackground = false,\n}: CarouselNavigationProps) {\n const carouselHook = useCarousel();\n const carousel = carouselProp \|\| carouselHook;\n const peekEffect = carousel?.originalParams.effect !== 'fade' && propPeekEffect;\n const theme = useTheme();\n const upMD = useMediaQuery(theme.breakpoints.up('md'));\n const { sx: prevSx, ...restPrev } = prevButtonProps \|\| {};\n const { sx: nextSx, ...restNext } = nextButtonProps \|\| {};\n const [peek, setPeek] = useCarouselPeekEffect(carousel);\n const PrevIcon = PrevIconComponent \|\| (arrows ? ArrowLeftIcon : ChevronLeftIcon);\n const NextIcon = NextIconComponent \|\| (arrows ? ArrowRightIcon : ChevronRightIcon);\n\n // shared style between buttons\n const sharedSx = useMemo(\n () => ({\n // absolute inside the carousel position\n position: 'absolute',\n zIndex: '100',\n top: '50%',\n // manual v-align, half the icon size\n mt: '-22px',\n // responsive\n width: { xs: '32px', md: '40px', xl: '44px' },\n height: { xs: '32px', md: '40px', xl: '44px' },\n '& .MuiSvgIcon-root': {\n fontSize: { xs: '17px', xl: '20px' },\n },\n // highlight border\n ...getInteractiveStyle(\n {\n color: 'text.primary',\n borderColor: onBackground ? 'transparent.transparent' : 'onSurface.os100',\n backgroundColor: onBackground ? 'transparent.transparent' : 'surface.primary',\n },\n {\n backgroundColor: 'surface.secondary',\n },\n ),\n // disabled state\n '&.Mui-disabled': {\n color: 'disabled.tertiary',\n borderColor: onBackground ? 'transparent.transparent' : 'disabled.secondary',\n backgroundColor: onBackground ? 'transparent.transparent' : 'disabled.secondary',\n },\n }),\n [],\n );\n\n return (\n <>\n <IconButton\n disabled={carousel && !carousel.originalParams.loop && carousel.isBeginning}\n onClick={() => {\n carousel?.slidePrev();\n peekEffect && peek && setPeek('reset');\n }}\n onMouseEnter={() => upMD && peekEffect && setPeek('prev')}\n onMouseLeave={() => peekEffect && peek && setPeek('reset')}\n sx={{\n ...sharedSx,\n left: '16px',\n ...prevSx,\n }}\n aria-label=\"Previous slide\"\n aria-controls=\"carousel\"\n color=\"surface\"\n size=\"medium\"\n {...restPrev}\n >\n {theme.direction === 'rtl' ? <NextIcon {...prevIconProps} /> : <PrevIcon {...prevIconProps} />}\n </IconButton>\n <IconButton\n disabled={carousel && !carousel.originalParams.loop && carousel.isEnd}\n onClick={() => {\n carousel?.slideNext();\n peekEffect && peek && setPeek('reset');\n }}\n onMouseEnter={() => upMD && peekEffect && setPeek('next')}\n onMouseLeave={() => peekEffect && peek && setPeek('reset')}\n sx={{\n ...sharedSx,\n right: '16px',\n ...nextSx,\n }}\n aria-label=\"Next slide\"\n aria-controls=\"carousel\"\n color=\"surface\"\n {...restNext}\n >\n {theme.direction === 'rtl' ? <PrevIcon {...nextIconProps} /> : <NextIcon {...nextIconProps} />}\n </IconButton>\n </>\n );\n}\n"],"names":["CarouselNavigation","carousel","carouselProp","peekEffect","propPeekEffect","prevButtonProps","prevIconProps","PrevIconComponent","nextButtonProps","nextIconProps","NextIconComponent","arrows","onBackground","carouselHook","useCarousel","originalParams","effect","theme","useTheme","upMD","useMediaQuery","breakpoints","up","_a","sx","prevSx","restPrev","__rest","_b","nextSx","restNext","peek","setPeek","useCarouselPeekEffect","PrevIcon","ArrowLeftIcon","ChevronLeftIcon","NextIcon","ArrowRightIcon","ChevronRightIcon","sharedSx","useMemo","Object","assign","position","zIndex","top","mt","width","xs","md","xl","height","fontSize","getInteractiveStyle","color","borderColor","backgroundColor","_jsxs","_jsx","IconButton","disabled","loop","isBeginning","onClick","slidePrev","onMouseEnter","onMouseLeave","left","size","children","direction","isEnd","slideNext","right"],"mappings":"wmBA2DgB,SAAAA,GACdC,SAAUC,EACVC,WAAYC,GAAiB,EAAKC,gBAClCA,EAAeC,cACfA,EAAaC,kBACbA,EAAiBC,gBACjBA,EAAeC,cACfA,EAAaC,kBACbA,EAAiBC,OACjBA,GAAS,EAAIC,aACbA,GAAe,IAEf,MAAMC,EAAeC,IACfb,EAAWC,GAAgBW,EAC3BV,EAAiD,UAApCF,aAAA,EAAAA,EAAUc,eAAeC,SAAqBZ,EAC3Da,EAAQC,IACRC,EAAOC,EAAcH,EAAMI,YAAYC,GAAG,OAC1CC,EAA8BlB,GAAmB,IAA/CmB,GAAIC,KAAWC,EAAjBC,EAAAJ,EAAA,CAAA,OACAK,EAA8BpB,GAAmB,IAA/CgB,GAAIK,KAAWC,EAAjBH,EAAAC,EAAA,CAAA,QACCG,EAAMC,GAAWC,EAAsBhC,GACxCiC,EAAW3B,IAAsBI,EAASwB,EAAgBC,GAC1DC,EAAW3B,IAAsBC,EAAS2B,EAAiBC,GAG3DC,EAAWC,GACf,IAAMC,OAAAC,OAAAD,OAAAC,OAAA,CAEJC,SAAU,WACVC,OAAQ,MACRC,IAAK,MAELC,GAAI,QAEJC,MAAO,CAAEC,GAAI,OAAQC,GAAI,OAAQC,GAAI,QACrCC,OAAQ,CAAEH,GAAI,OAAQC,GAAI,OAAQC,GAAI,QACtC,qBAAsB,CACpBE,SAAU,CAAEJ,GAAI,OAAQE,GAAI,UAG3BG,EACD,CACEC,MAAO,eACPC,YAAa5C,EAAe,0BAA4B,kBACxD6C,gBAAiB7C,EAAe,0BAA4B,mBAE9D,CACE6C,gBAAiB,uBAEpB,CAED,iBAAkB,CAChBF,MAAO,oBACPC,YAAa5C,EAAe,0BAA4B,qBACxD6C,gBAAiB7C,EAAe,0BAA4B,yBAGhE,IAGF,OACE8C,eACEC,EAACC,iBACCC,SAAU5D,IAAaA,EAASc,eAAe+C,MAAQ7D,EAAS8D,YAChEC,QAAS,KACP/D,SAAAA,EAAUgE,YACV9D,GAAc4B,GAAQC,EAAQ,QAAQ,EAExCkC,aAAc,IAAM/C,GAAQhB,GAAc6B,EAAQ,QAClDmC,aAAc,IAAMhE,GAAc4B,GAAQC,EAAQ,SAClDR,GACKkB,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,GAAAH,IACH4B,KAAM,SACH3C,gBAEM,iBAAgB,gBACb,WACd8B,MAAM,UACNc,KAAK,UACD3C,EAEH,CAAA4C,SAAoB,QAApBrD,EAAMsD,UAAsBZ,EAACtB,mBAAa/B,IAAoBqD,EAACzB,EAAaQ,OAAAC,OAAA,CAAA,EAAArC,OAE/EqD,EAACC,EAAUlB,OAAAC,OAAA,CACTkB,SAAU5D,IAAaA,EAASc,eAAe+C,MAAQ7D,EAASuE,MAChER,QAAS,KACP/D,SAAAA,EAAUwE,YACVtE,GAAc4B,GAAQC,EAAQ,QAAQ,EAExCkC,aAAc,IAAM/C,GAAQhB,GAAc6B,EAAQ,QAClDmC,aAAc,IAAMhE,GAAc4B,GAAQC,EAAQ,SAClDR,GAAEkB,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EACGH,GAAQ,CACXkC,MAAO,SACJ7C,GAEM,aAAA,aACG,gBAAA,WACd0B,MAAM,WACFzB,EAEH,CAAAwC,SAAoB,QAApBrD,EAAMsD,UAAsBZ,EAACzB,EAAQQ,OAAAC,OAAA,CAAA,EAAKlC,IAAoBkD,EAACtB,mBAAa5B,SAIrF"}

package/components/carousel/pagination.d.ts CHANGED Viewed

@@ -9,10 +9,14 @@ export interface CarouselPaginationVariantProps extends Omit<BoxProps<ElementTyp
 }
 export interface CarouselPaginationDotsProps extends CarouselPaginationVariantProps {
     variant?: 'dots';
+    /**
+     * Properties applied to wrapper of dots
+     */
+    dotsWrapperProps?: BoxProps<ElementType>;
     /**
      * Properties applied to each dot
      */
-    dotProps?: Partial<BoxProps<ElementType>>;
+    dotProps?: BoxProps<ElementType>;
 }
 export interface CarouselPaginationFractionProps extends CarouselPaginationVariantProps {
     variant?: 'fraction';

package/components/carousel/pagination.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{__rest as o}from"tslib";import{jsx as r,jsxs as s}from"react/jsx-runtime";import{forwardRef as e,useMemo as i,useState as n,useRef as l,useEffect as t}from"react";import{Box as a,Button as c,Slider as d}from"@mui/material";import{useCarousel as u}from"./hooks.js";import{getInteractiveStyle as p}from"../../materialui/button/interactive.js";import{SliderContainer as g}from"../../materialui/slider/sliderContainer.js";const x=e(((s,e)=>{var{carousel:n,position:l,variant:t,sx:a}=s,c=o(s,["carousel","position","variant","sx"]);const d=u(),p=n||d,g=i((()=>{switch(t){case"scrollbar":return f;case"slider":case"progress":return b;case"fraction":return m;case"lines":return v;default:return h}}),[t]),x=i((()=>"inside"===l?Object.assign({position:"absolute",zIndex:"90",bottom:"0",left:"0",right:"0"},a):a),[l,JSON.stringify(a)]);return r(g,Object.assign({carousel:p,sx:x,ref:e},c))})),h=e(((s,e)=>{var{carousel:i,dotProps:n,sx:l}=s,t=o(s,["carousel","dotProps","sx"]);const c=n||{},{sx:d}=c,u=o(c,["sx"]);return r(a,Object.assign({sx:Object.assign({px:2,height:"40px",display:"flex",alignItems:"center",justifyContent:"center",gap:1,pointerEvents:"none"},l),ref:e},t,{children:[...Array((null==i?void 0:i.slides.length)||0)].map(((o,s)=>r(a,Object.assign({className:!(null==i?void 0:i.originalParams.loop)&&(null==i?void 0:i.isEnd)&&s===((null==i?void 0:i.slides.length)||0)-1?"active":(null==i?void 0:i.isEnd)&&!i.originalParams.loop||s!==(null==i?void 0:i.realIndex)?void 0:"active",sx:Object.assign({p:"0",width:"8px",height:"8px",borderRadius:"100%",backgroundColor:"onSurface.os500",transition:"all 0.3s ease-out","&.active":{width:"12px",height:"12px",backgroundColor:"text.primary"}},d)},u),s)))}))})),m=e(((e,i)=>{var{carousel:n,buttonProps:l,sx:t}=e,d=o(e,["carousel","buttonProps","sx"]);const u=l||{},{sx:g}=u,x=o(u,["sx"]);return r(a,Object.assign({sx:Object.assign({display:"flex",alignItems:"center",justifyContent:"center",p:2},t),ref:i},d,{children:r(c,Object.assign({variant:"text","aria-controls":"carousel",sx:Object.assign(Object.assign({px:2,py:.25,borderRadius:"4px",fontSize:"18px",lineHeight:"28px",letterSpacing:"0.02em"},p({backgroundColor:"transparent.backdrop"},{backgroundColor:"onSurface.os100"})),g),onClick:()=>(null==n?void 0:n.isEnd)&&!n.originalParams.loop?null==n?void 0:n.slideTo(0):null==n?void 0:n.slideNext()},x,{children:s(a,{component:"span",children:[r(a,{component:"span",sx:{fontWeight:"700",color:"onSurface.os900"},children:`${((null==n?void 0:n.realIndex)||0)+1}`}),r(a,{component:"span",sx:{color:"onSurface.os700",fontWeight:"400",mx:.5},children:" / "}),r(a,{component:"span",sx:{color:"onSurface.os700",fontWeight:"300"},children:`${(null==n?void 0:n.slides.length)||0}`})]})}))}))})),v=e(((e,i)=>{var{carousel:n,sx:l,linesProps:t,lineProgress:d,lineProgressProps:u}=e,g=o(e,["carousel","sx","linesProps","lineProgress","lineProgressProps"]);const x=t||{},{sx:h}=x,m=o(x,["sx"]),v=u||{},{sx:b}=v,f=o(v,["sx"]);return r(a,Object.assign({sx:Object.assign({display:"flex",alignItems:"center",justifyContent:{xs:"stretch",md:"center"},flexGrow:{xs:"1",md:0},gap:1,p:2},l),ref:i},g,{children:[...Array((null==n?void 0:n.slides.length)||0)].map(((o,e)=>{const i=!(null==n?void 0:n.originalParams.loop)&&(null==n?void 0:n.isEnd)&&e===((null==n?void 0:n.slides.length)||0)-1||(!(null==n?void 0:n.isEnd)||n.originalParams.loop)&&e===(null==n?void 0:n.realIndex),l=e<=((null==n?void 0:n.realIndex)||0);return s(c,Object.assign({color:"inherit",className:i?"active":void 0,sx:Object.assign(Object.assign({p:0,minHeight:"0",height:i||l?"8px":"4px",borderRadius:i||l?"4px":"2px",width:{xs:"100%",md:"56px"},justifyContent:"flex-start"},p({backgroundColor:"surface.primary","& .progress-line":{backgroundColor:"brand.secondary"}},{backgroundColor:"surface.secondary","& .progress-line":{backgroundColor:"brandHover.secondary"}})),h),"aria-controls":"carousel",onClick:()=>null==n?void 0:n[n.originalParams.loop?"slideToLoop":"slideTo"](e)},m,{children:[r(a,{sx:{position:"absolute",top:"50%",left:"0",right:"0",height:"24px",transform:"translateY(-50%)",pointerEvents:"auto"}}),r(a,{sx:{borderRadius:"4px",height:"100%",width:"100%",overflow:"hidden"},children:r(a,Object.assign({className:"progress-line",role:i?"progress":void 0,"aria-valuenow":i?d:void 0,"aria-valuemin":0,"aria-valuemax":100,sx:Object.assign({opacity:void 0!==d||l?"1":"0",width:"100%",backgroundColor:"brand.secondary",height:"100%",transformOrigin:"left",transform:`scaleX(${void 0!==d&&i?d/100:l?1:0})`,transition:(void 0!==d?"transform 300ms ease-in-out, ":"")+"opacity 300ms ease-out, background-color 300ms ease-out"},b)},f))})]}),e)}))}))})),b=e(((s,e)=>{var i,{carousel:c,sliderProps:u,sx:p,progressProps:g}=s,x=o(s,["carousel","sliderProps","sx","progressProps"]);const h=u||{},{sx:m}=h,v=o(h,["sx"]),[b,f]=n(Math.round(100*((null==c?void 0:c.progress)||0))),j=l(!1),[,O]=n({});return t((()=>{j.current||f(Math.round(100*((null==c?void 0:c.progress)||0)))}),[null==c?void 0:c.progress]),t((()=>{if(c){const o=()=>{j.current||O({})};return c.on("sliderMove",o),()=>{c.off("sliderMove",o)}}}),[c]),r(a,Object.assign({sx:Object.assign({my:2},p),ref:e},x,{children:r(d,Object.assign({value:b,min:0,max:100,onChange:(o,r)=>{j.current=!0,null==c||c.setProgress(r/100,150),f(r)},onChangeCommitted:()=>{null==c||c.slideToClosest(300),j.current=!1},sx:Object.assign({display:"block",height:"4px",".MuiSlider-rail":{color:"surface.primary"},".MuiSlider-track":{color:"onSurface.os500",transitionDuration:`${null!==(i=null==c?void 0:c.originalParams.speed)&&void 0!==i?i:300}ms`},".MuiSlider-thumb":{display:"none"}},m),"aria-controls":"carousel"},v))}))})),f=e(((s,e)=>{var l,a,{carousel:c,sliderProps:d}=s,u=o(s,["carousel","sliderProps"]);const p=d||{},{sx:x}=p,h=o(p,["sx"]),[m,v]=n(!1),[,f]=n({});t((()=>{if(c){const o=()=>v(!0),r=()=>v(!1),s=()=>f({});return c.on("touchStart",o),c.on("touchEnd",r),c.on("resize",s),()=>{c.off("touchStart",o),c.off("touchEnd",r),c.off("resize",s)}}}),[c]);const j=i((()=>{var o,r;if((null===(o=null==c?void 0:c.wrapperEl)||void 0===o?void 0:o.scrollWidth)&&(null==c?void 0:c.width)){const o=Math.ceil((null==c?void 0:c.width)**2/(null===(r=null==c?void 0:c.wrapperEl)||void 0===r?void 0:r.scrollWidth));return Math.max(o,40)}return 40}),[null===(l=null==c?void 0:c.wrapperEl)||void 0===l?void 0:l.scrollWidth,null==c?void 0:c.width]);return r(b,Object.assign({ref:e,carousel:c,component:g,thumbSize:j,sliderProps:Object.assign({tabIndex:-1,valueLabelDisplay:"off",sx:Object.assign({display:"block",height:"4px",".MuiSlider-rail, .MuiSlider-track":{color:"surface.primary"},".MuiSlider-thumb":Object.assign(Object.assign({display:"flex",width:`${j}px`,height:"4px",border:"none",backgroundColor:"onSurface.os500"},!m&&{transition:`left ${null!==(a=null==c?void 0:c.originalParams.speed)&&void 0!==a?a:300}ms ease-out`}),{"&.Mui-focusVisible":{boxShadow:"none","&:before":{content:"none"}}})},x)},h)},u))}));export{x as CarouselPagination,h as DotsVariant,m as FractionVariant,v as LinesVariant,f as ScrollbarVariant,b as SliderVariant};
+import{__rest as o}from"tslib";import{jsx as s,jsxs as r}from"react/jsx-runtime";import{forwardRef as e,useMemo as i,useState as n,useRef as l,useEffect as t}from"react";import{Box as a,Button as d,Slider as c}from"@mui/material";import{useCarousel as u}from"./hooks.js";import{getInteractiveStyle as p}from"../../materialui/button/interactive.js";import{SliderContainer as g}from"../../materialui/slider/sliderContainer.js";const x=e(((r,e)=>{var{carousel:n,position:l,variant:t,sx:a}=r,d=o(r,["carousel","position","variant","sx"]);const c=u(),p=n||c,g=i((()=>{switch(t){case"scrollbar":return f;case"slider":case"progress":return v;case"fraction":return h;case"lines":return b;default:return m}}),[t]),x=i((()=>"inside"===l?Object.assign({position:"absolute",zIndex:"90",bottom:"0",left:"0",right:"0"},a):a),[l,JSON.stringify(a)]);return s(g,Object.assign({carousel:p,sx:x,ref:e,position:l},d))})),m=e(((r,e)=>{var{carousel:i,dotsWrapperProps:n,dotProps:l,position:t,sx:d}=r,c=o(r,["carousel","dotsWrapperProps","dotProps","position","sx"]);const u=null!=n?n:{},{sx:p}=u,g=o(u,["sx"]),x=null!=l?l:{},{sx:m}=x,h=o(x,["sx"]);return s(a,Object.assign({sx:Object.assign({p:2,display:"flex",alignItems:"center",justifyContent:"center"},d),ref:e},c,{children:s(a,Object.assign({sx:Object.assign(Object.assign({display:"flex",alignItems:"center",justifyContent:"center",borderRadius:"1000px",py:.5,px:1,gap:.5,width:12*((null==i?void 0:i.slides.length)||0)+4*(((null==i?void 0:i.slides.length)||1)-1)+4+16+"px"},"inside"===t&&{backgroundColor:o=>"dark"===o.palette.mode?"surface.primary":"transparent.backdrop"}),p)},g,{children:[...Array((null==i?void 0:i.slides.length)||0)].map(((o,r)=>s(a,Object.assign({className:!(null==i?void 0:i.originalParams.loop)&&(null==i?void 0:i.isEnd)&&r===((null==i?void 0:i.slides.length)||0)-1?"active":(null==i?void 0:i.isEnd)&&!i.originalParams.loop||r!==(null==i?void 0:i.realIndex)?void 0:"active",sx:Object.assign({p:"0",width:"12px",height:"12px",transform:"scale(0.6667)",borderRadius:"100%",backgroundColor:"onSurface.os500",transition:"transform 0.3s ease-out, background-color 0.3s ease-out, margin 0.3s ease-out","&.active":{transform:"scale(1)",backgroundColor:"text.primary",margin:"0 2px"}},m)},h),r)))}))}))})),h=e(((e,i)=>{var{carousel:n,buttonProps:l,position:t,sx:c}=e,u=o(e,["carousel","buttonProps","position","sx"]);const g=null!=l?l:{},{sx:x}=g,m=o(g,["sx"]);return s(a,Object.assign({sx:Object.assign({display:"flex",alignItems:"center",justifyContent:"center",p:2},c),ref:i},u,{children:s(d,Object.assign({variant:"text","aria-controls":"carousel",sx:Object.assign(Object.assign({px:2,py:.25,borderRadius:"4px",fontSize:"18px",lineHeight:"28px",letterSpacing:"0.02em"},p({backgroundColor:"transparent.backdrop"},{backgroundColor:"onSurface.os100"})),x),onClick:()=>(null==n?void 0:n.isEnd)&&!n.originalParams.loop?null==n?void 0:n.slideTo(0):null==n?void 0:n.slideNext()},m,{children:r(a,{component:"span",children:[s(a,{component:"span",sx:{fontWeight:"700",color:"onSurface.os900"},children:`${((null==n?void 0:n.realIndex)||0)+1}`}),s(a,{component:"span",sx:{color:"onSurface.os700",fontWeight:"400",mx:.5},children:" / "}),s(a,{component:"span",sx:{color:"onSurface.os700",fontWeight:"300"},children:`${(null==n?void 0:n.slides.length)||0}`})]})}))}))})),b=e(((e,i)=>{var{carousel:n,sx:l,linesProps:t,lineProgress:c,lineProgressProps:u,position:g}=e,x=o(e,["carousel","sx","linesProps","lineProgress","lineProgressProps","position"]);const m=null!=t?t:{},{sx:h}=m,b=o(m,["sx"]),v=null!=u?u:{},{sx:f}=v,j=o(v,["sx"]);return s(a,Object.assign({sx:Object.assign({display:"flex",alignItems:"center",justifyContent:{xs:"stretch",md:"center"},flexGrow:{xs:"1",md:0},gap:1,p:2},l),ref:i},x,{children:[...Array((null==n?void 0:n.slides.length)||0)].map(((o,e)=>{const i=!(null==n?void 0:n.originalParams.loop)&&(null==n?void 0:n.isEnd)&&e===((null==n?void 0:n.slides.length)||0)-1||(!(null==n?void 0:n.isEnd)||n.originalParams.loop)&&e===(null==n?void 0:n.realIndex),l=e<=((null==n?void 0:n.realIndex)||0);return r(d,Object.assign({color:"inherit",className:i?"active":void 0,sx:Object.assign(Object.assign({p:0,minHeight:"0",height:i||l?"8px":"4px",borderRadius:i||l?"4px":"2px",width:{xs:"100%",md:"56px"},justifyContent:"flex-start"},p({backgroundColor:"surface.primary","& .progress-line":{backgroundColor:"brand.secondary"}},{backgroundColor:"surface.secondary","& .progress-line":{backgroundColor:"brandHover.secondary"}})),h),"aria-controls":"carousel",onClick:()=>null==n?void 0:n[n.originalParams.loop?"slideToLoop":"slideTo"](e)},b,{children:[s(a,{sx:{position:"absolute",top:"50%",left:"0",right:"0",height:"24px",transform:"translateY(-50%)",pointerEvents:"auto"}}),s(a,{sx:{borderRadius:"4px",height:"100%",width:"100%",overflow:"hidden"},children:s(a,Object.assign({className:"progress-line",role:i?"progress":void 0,"aria-valuenow":i?c:void 0,"aria-valuemin":0,"aria-valuemax":100,sx:Object.assign({opacity:void 0!==c||l?"1":"0",width:"100%",backgroundColor:"brand.secondary",height:"100%",transformOrigin:"left",transform:`scaleX(${void 0!==c&&i?c/100:l?1:0})`,transition:(void 0!==c?"transform 300ms ease-in-out, ":"")+"opacity 300ms ease-out, background-color 300ms ease-out"},f)},j))})]}),e)}))}))})),v=e(((r,e)=>{var i,{carousel:d,sliderProps:u,sx:p,progressProps:g,position:x}=r,m=o(r,["carousel","sliderProps","sx","progressProps","position"]);const h=null!=u?u:{},{sx:b}=h,v=o(h,["sx"]),[f,j]=n(Math.round(100*((null==d?void 0:d.progress)||0))),O=l(!1),[,y]=n({});return t((()=>{O.current||j(Math.round(100*((null==d?void 0:d.progress)||0)))}),[null==d?void 0:d.progress]),t((()=>{if(d){const o=()=>{O.current||y({})};return d.on("sliderMove",o),()=>{d.off("sliderMove",o)}}}),[d]),s(a,Object.assign({sx:Object.assign({my:2},p),ref:e},m,{children:s(c,Object.assign({value:f,min:0,max:100,onChange:(o,s)=>{O.current=!0,null==d||d.setProgress(s/100,150),j(s)},onChangeCommitted:()=>{null==d||d.slideToClosest(300),O.current=!1},sx:Object.assign({display:"block",height:"4px",".MuiSlider-rail":{color:"surface.primary"},".MuiSlider-track":{color:"onSurface.os500",transitionDuration:`${null!==(i=null==d?void 0:d.originalParams.speed)&&void 0!==i?i:300}ms`},".MuiSlider-thumb":{display:"none"}},b),"aria-controls":"carousel"},v))}))})),f=e(((r,e)=>{var l,a,{carousel:d,sliderProps:c,position:u}=r,p=o(r,["carousel","sliderProps","position"]);const x=null!=c?c:{},{sx:m}=x,h=o(x,["sx"]),[b,f]=n(!1),[,j]=n({});t((()=>{if(d){const o=()=>f(!0),s=()=>f(!1),r=()=>j({});return d.on("touchStart",o),d.on("touchEnd",s),d.on("resize",r),()=>{d.off("touchStart",o),d.off("touchEnd",s),d.off("resize",r)}}}),[d]);const O=i((()=>{var o,s;if((null===(o=null==d?void 0:d.wrapperEl)||void 0===o?void 0:o.scrollWidth)&&(null==d?void 0:d.width)){const o=Math.ceil((null==d?void 0:d.width)**2/(null===(s=null==d?void 0:d.wrapperEl)||void 0===s?void 0:s.scrollWidth));return Math.max(o,40)}return 40}),[null===(l=null==d?void 0:d.wrapperEl)||void 0===l?void 0:l.scrollWidth,null==d?void 0:d.width]);return s(v,Object.assign({ref:e,carousel:d,component:g,thumbSize:O,sliderProps:Object.assign({tabIndex:-1,valueLabelDisplay:"off",sx:Object.assign({display:"block",height:"4px",".MuiSlider-rail, .MuiSlider-track":{color:"surface.primary"},".MuiSlider-thumb":Object.assign(Object.assign({display:"flex",width:`${O}px`,height:"4px",border:"none",backgroundColor:"onSurface.os500"},!b&&{transition:`left ${null!==(a=null==d?void 0:d.originalParams.speed)&&void 0!==a?a:300}ms ease-out`}),{"&.Mui-focusVisible":{boxShadow:"none","&:before":{content:"none"}}})},m)},h)},p))}));export{x as CarouselPagination,m as DotsVariant,h as FractionVariant,b as LinesVariant,f as ScrollbarVariant,v as SliderVariant};
 //# sourceMappingURL=pagination.js.map

package/components/carousel/pagination.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pagination.js","sources":["../../../src/components/carousel/pagination.tsx"],"sourcesContent":["import React, { ElementType, forwardRef, useEffect, useMemo, useState, useRef } from 'react';\nimport { Box, BoxProps, Button, ButtonProps, Slider, SliderProps, LinearProgressProps, CSSObject } from '@mui/material';\nimport { useCarousel } from './hooks';\nimport type { Swiper as CarouselInstance } from 'swiper';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\nimport { SliderContainer } from '@/src/materialui/slider/sliderContainer';\n\nexport interface CarouselPaginationVariantProps extends Omit<BoxProps<ElementType>, 'children' \| 'position'> {\n /*\n Carousel instance from useCarousel hook\n /\n carousel: CarouselInstance;\n}\nexport interface CarouselPaginationDotsProps extends CarouselPaginationVariantProps {\n variant?: 'dots';\n /\n Properties applied to each dot\n /\n dotProps?: Partial<BoxProps<ElementType>>;\n}\nexport interface CarouselPaginationFractionProps extends CarouselPaginationVariantProps {\n variant?: 'fraction';\n /\n Properties applied to button used to render text\n /\n buttonProps?: ButtonProps;\n}\nexport interface CarouselPaginationLinesProps extends CarouselPaginationVariantProps {\n variant?: 'lines';\n /\n Properties applied to each line\n /\n linesProps?: ButtonProps;\n /\n Show progress in active line instead\n /\n lineProgress?: number;\n /\n Properties applied to active line progress\n /\n lineProgressProps?: BoxProps<ElementType>;\n}\n/\n @deprecated use `slider` variant instead\n /\nexport interface CarouselPaginationProgressProps extends CarouselPaginationVariantProps {\n variant?: 'progress';\n /\n @deprecated\n /\n progressProps?: LinearProgressProps;\n /\n Properties applied to Slider\n /\n sliderProps?: SliderProps;\n}\nexport interface CarouselPaginationSliderProps extends CarouselPaginationVariantProps {\n variant?: 'slider';\n /\n Properties applied to Slider\n /\n sliderProps?: SliderProps;\n}\nexport interface CarouselPaginationScrollbarProps extends CarouselPaginationVariantProps {\n variant?: 'scrollbar';\n /\n Properties applied to Slider\n /\n sliderProps?: SliderProps;\n}\nexport interface CarouselPaginationBaseProps {\n /\n Optional Carousel instance from useCarouselInstance hook\n /\n carousel?: CarouselInstance;\n /\n Append style to wrapper box to change position of control\n * @default outside\n /\n position?: 'outside' \| 'inside';\n}\nexport type CarouselPaginationProps = CarouselPaginationBaseProps &\n (\n \| Omit<CarouselPaginationDotsProps, 'carousel'>\n \| Omit<CarouselPaginationFractionProps, 'carousel'>\n \| Omit<CarouselPaginationLinesProps, 'carousel'>\n \| Omit<CarouselPaginationProgressProps, 'carousel'>\n \| Omit<CarouselPaginationSliderProps, 'carousel'>\n \| Omit<CarouselPaginationScrollbarProps, 'carousel'>\n );\n\n/\n Pagination controls\n /\nexport const CarouselPagination: React.FC<CarouselPaginationProps> = forwardRef(\n ({ carousel: carouselProp, position, variant, sx: rawSx, ...rest }, ref) => {\n const carouselHook = useCarousel();\n const carousel = carouselProp \|\| carouselHook;\n // decide on component used\n const VariantComponent = useMemo(() => {\n switch (variant) {\n case 'scrollbar':\n return ScrollbarVariant;\n case 'slider':\n case 'progress':\n return SliderVariant;\n case 'fraction':\n return FractionVariant;\n case 'lines':\n return LinesVariant;\n case 'dots':\n return DotsVariant;\n default:\n return DotsVariant;\n }\n }, [variant]);\n // position extra styling applied to wrapper\n const sx = useMemo<CSSObject \| BoxProps['sx']>(() => {\n if (position === 'inside') {\n return {\n position: 'absolute',\n zIndex: '90',\n bottom: '0',\n left: '0',\n right: '0',\n ...rawSx,\n };\n } else {\n return rawSx;\n }\n }, [position, JSON.stringify(rawSx)]);\n\n return <VariantComponent carousel={carousel} sx={sx} ref={ref} {...rest} />;\n },\n);\n\n/\n Dots variant (...)\n /\nexport const DotsVariant: React.FC<CarouselPaginationDotsProps> = forwardRef(\n ({ carousel, dotProps, sx, ...rest }, ref) => {\n const { sx: dotSx, ...restDot } = dotProps \|\| {};\n\n return (\n <Box\n sx={{\n px: 2,\n height: '40px',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n gap: 1,\n pointerEvents: 'none',\n ...sx,\n }}\n ref={ref}\n {...rest}\n >\n {[...Array(carousel?.slides.length \|\| 0)].map((_, idx) => (\n <Box\n key={idx}\n className={\n !carousel?.originalParams.loop && carousel?.isEnd && idx === (carousel?.slides.length \|\| 0) - 1\n ? 'active'\n : (!carousel?.isEnd \|\| carousel.originalParams.loop) && idx === carousel?.realIndex\n ? 'active'\n : undefined\n }\n sx={{\n p: '0',\n width: '8px',\n height: '8px',\n borderRadius: '100%',\n backgroundColor: 'onSurface.os500',\n transition: 'all 0.3s ease-out',\n '&.active': {\n width: '12px',\n height: '12px',\n backgroundColor: 'text.primary',\n },\n ...dotSx,\n }}\n {...restDot}\n />\n ))}\n </Box>\n );\n },\n);\n\n/\n Fraction variant (text 1/3)\n /\nexport const FractionVariant: React.FC<CarouselPaginationFractionProps> = forwardRef(\n ({ carousel, buttonProps, sx, ...rest }, ref) => {\n const { sx: buttonSx, ...restButton } = buttonProps \|\| {};\n\n return (\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n // space is needed for focus overflow\n p: 2,\n ...sx,\n }}\n ref={ref}\n {...rest}\n >\n <Button\n variant=\"text\"\n aria-controls=\"carousel\"\n sx={{\n px: 2,\n py: 0.25,\n borderRadius: '4px',\n // custom typography according to Figma (Pagination/Compact)\n fontSize: '18px',\n lineHeight: '28px',\n letterSpacing: '0.02em',\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent.backdrop',\n },\n {\n backgroundColor: 'onSurface.os100',\n },\n ),\n ...buttonSx,\n }}\n onClick={() =>\n // at the end, slide to beginning\n carousel?.isEnd && !carousel.originalParams.loop ? carousel?.slideTo(0) : carousel?.slideNext()\n }\n {...restButton}\n >\n <Box component=\"span\">\n <Box component=\"span\" sx={{ fontWeight: '700', color: 'onSurface.os900' }}>\n {`${(carousel?.realIndex \|\| 0) + 1}`}\n </Box>\n <Box component=\"span\" sx={{ color: 'onSurface.os700', fontWeight: '400', mx: 0.5 }}>\n {' / '}\n </Box>\n <Box component=\"span\" sx={{ color: 'onSurface.os700', fontWeight: '300' }}>\n {`${carousel?.slides.length \|\| 0}`}\n </Box>\n </Box>\n </Button>\n </Box>\n );\n },\n);\n\n/\n Lines variant (- - -)\n /\nexport const LinesVariant: React.FC<CarouselPaginationLinesProps> = forwardRef(\n ({ carousel, sx, linesProps, lineProgress, lineProgressProps, ...rest }, ref) => {\n const { sx: lineSx, ...lineRest } = linesProps \|\| {};\n const { sx: lineProgressSx, ...lineProgressRest } = lineProgressProps \|\| {};\n\n return (\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n justifyContent: { xs: 'stretch', md: 'center' },\n flexGrow: { xs: '1', md: 0 },\n gap: 1,\n // space is needed for focus overflow\n p: 2,\n ...sx,\n }}\n ref={ref}\n {...rest}\n >\n {[...Array(carousel?.slides.length \|\| 0)].map((_, idx) => {\n const active =\n (!carousel?.originalParams.loop && carousel?.isEnd && idx === (carousel?.slides.length \|\| 0) - 1) \|\|\n ((!carousel?.isEnd \|\| carousel.originalParams.loop) && idx === carousel?.realIndex);\n const seen = idx <= (carousel?.realIndex \|\| 0);\n\n return (\n <Button\n key={idx}\n color=\"inherit\"\n className={active ? 'active' : undefined}\n sx={{\n p: 0,\n minHeight: '0',\n height: active \|\| seen ? '8px' : '4px',\n borderRadius: active \|\| seen ? '4px' : '2px',\n width: { xs: '100%', md: '56px' },\n justifyContent: 'flex-start',\n ...getInteractiveStyle(\n {\n backgroundColor: 'surface.primary',\n '& .progress-line': {\n backgroundColor: 'brand.secondary',\n },\n },\n {\n backgroundColor: 'surface.secondary',\n '& .progress-line': {\n backgroundColor: 'brandHover.secondary',\n },\n },\n ),\n ...lineSx,\n }}\n aria-controls=\"carousel\"\n onClick={() => carousel?.[carousel.originalParams.loop ? 'slideToLoop' : 'slideTo'](idx)}\n {...lineRest}\n >\n <Box\n sx={{\n // invisible hitbox expanding clickable area\n position: 'absolute',\n top: '50%',\n left: '0',\n right: '0',\n height: '24px', // Minimum a11y click area\n transform: 'translateY(-50%)',\n pointerEvents: 'auto',\n }}\n />\n <Box sx={{ borderRadius: '4px', height: '100%', width: '100%', overflow: 'hidden' }}>\n <Box\n className=\"progress-line\"\n role={active ? 'progress' : undefined} // Only the active one gets a role\n aria-valuenow={active ? lineProgress : undefined}\n aria-valuemin={0}\n aria-valuemax={100}\n sx={{\n opacity: lineProgress !== undefined \|\| seen ? '1' : '0',\n width: '100%',\n backgroundColor: 'brand.secondary',\n height: '100%',\n transformOrigin: 'left',\n transform: `scaleX(${lineProgress !== undefined && active ? lineProgress / 100 : seen ? 1 : 0})`,\n transition: `${lineProgress !== undefined ? 'transform 300ms ease-in-out, ' : ''}opacity 300ms ease-out, background-color 300ms ease-out`,\n ...lineProgressSx,\n }}\n {...lineProgressRest}\n />\n </Box>\n </Button>\n );\n })}\n </Box>\n );\n },\n);\n\n/\n Slider variant (___)\n /\nexport const SliderVariant: React.FC<CarouselPaginationSliderProps> = forwardRef(\n ({ carousel, sliderProps, sx, progressProps: __, ...rest }, ref) => {\n const { sx: sliderSx, ...restSlider } = sliderProps \|\| {};\n // slider current value that might not match carousel progress\n const [value, setValue] = useState<number>(Math.round((carousel?.progress \|\| 0) 100));\n // watch user manipulating slider\n const dragging = useRef<boolean>(false);\n const [, setRerender] = useState({});\n // monitor carousel progress to update slider value\n useEffect(() => {\n if (!dragging.current) {\n setValue(Math.round((carousel?.progress \|\| 0) * 100));\n }\n }, [carousel?.progress]);\n // extra monitor of states\n useEffect(() => {\n if (carousel) {\n const handleMove = () => {\n if (!dragging.current) {\n setRerender({});\n }\n };\n\n // monitor of movement to immediately move thumb\n carousel.on('sliderMove', handleMove);\n\n return () => {\n carousel.off('sliderMove', handleMove);\n };\n }\n }, [carousel]);\n\n return (\n <Box sx={{ my: 2, ...sx }} ref={ref} {...rest}>\n <Slider\n value={value}\n min={0}\n max={100}\n onChange={(_, newValue: number) => {\n // prevent value updates from carousel progress\n dragging.current = true;\n // smoothly move carousel\n carousel?.setProgress(newValue / 100, 150);\n // update slider value\n setValue(newValue);\n }}\n onChangeCommitted={() => {\n // make sure to slide to correct position after user stop touching slider\n carousel?.slideToClosest(300);\n // enable changing value from carousel progress\n dragging.current = false;\n }}\n sx={{\n display: 'block',\n height: '4px',\n // restyle to less prominent variant\n '.MuiSlider-rail': {\n color: 'surface.primary',\n },\n '.MuiSlider-track': {\n color: 'onSurface.os500',\n // match transition speed of carousel\n transitionDuration: `${carousel?.originalParams.speed ?? 300}ms`,\n },\n // hide control thumb\n '.MuiSlider-thumb': {\n display: 'none',\n },\n ...sliderSx,\n }}\n aria-controls=\"carousel\"\n {...restSlider}\n />\n </Box>\n );\n },\n);\n\n/*\n Scrollbar variant (_--)\n /\nexport const ScrollbarVariant: React.FC<CarouselPaginationSliderProps> = forwardRef(\n ({ carousel, sliderProps, ...rest }, ref) => {\n const { sx: sliderSx, ...restSlider } = sliderProps \|\| {};\n // watch states\n const [carouselDragging, setCarouselDragging] = useState<boolean>(false);\n const [, setRerender] = useState({});\n // extra monitor of states\n useEffect(() => {\n if (carousel) {\n const handleDragStart = () => setCarouselDragging(true);\n const handleDragEnd = () => setCarouselDragging(false);\n const handleResize = () => setRerender({});\n\n // monitor of dragging to remove thumb transition for immediate feedback\n carousel.on('touchStart', handleDragStart);\n carousel.on('touchEnd', handleDragEnd);\n // monitor resize to change size of the thumb\n carousel.on('resize', handleResize);\n\n return () => {\n carousel.off('touchStart', handleDragStart);\n carousel.off('touchEnd', handleDragEnd);\n carousel.off('resize', handleResize);\n };\n }\n }, [carousel]);\n // calculate size of the thumb based on the visible content and full content\n const thumbSize = useMemo<number>(() => {\n if (carousel?.wrapperEl?.scrollWidth && carousel?.width) {\n const size = Math.ceil(carousel?.width * 2 / carousel?.wrapperEl?.scrollWidth);\n return Math.max(size, 40);\n }\n return 40;\n }, [carousel?.wrapperEl?.scrollWidth, carousel?.width]);\n\n return (\n <SliderVariant\n ref={ref}\n carousel={carousel}\n component={SliderContainer}\n thumbSize={thumbSize}\n sliderProps={{\n // prevent selection via keyboard, Carousel can be already controlled with Keyboard and we are not showing focus ring\n tabIndex: -1,\n // remove valueLabel tooltip above thumb\n valueLabelDisplay: 'off',\n sx: {\n display: 'block',\n height: '4px',\n // restyle to match scrollbar\n '.MuiSlider-rail, .MuiSlider-track': {\n color: 'surface.primary',\n },\n '.MuiSlider-thumb': {\n display: 'flex',\n width: `${thumbSize}px`,\n height: '4px',\n border: 'none',\n backgroundColor: 'onSurface.os500',\n // match transition speed of carousel\n ...(!carouselDragging && {\n transition: `left ${carousel?.originalParams.speed ?? 300}ms ease-out`,\n }),\n // remove focus style\n '&.Mui-focusVisible': {\n boxShadow: 'none',\n '&:before': {\n content: 'none',\n },\n },\n },\n ...sliderSx,\n },\n ...restSlider,\n }}\n {...rest}\n />\n );\n },\n);\n"],"names":["CarouselPagination","forwardRef","_a","ref","carousel","carouselProp","position","variant","sx","rawSx","rest","__rest","carouselHook","useCarousel","VariantComponent","useMemo","ScrollbarVariant","SliderVariant","FractionVariant","LinesVariant","DotsVariant","Object","assign","zIndex","bottom","left","right","JSON","stringify","_jsx","dotProps","_b","dotSx","restDot","Box","px","height","display","alignItems","justifyContent","gap","pointerEvents","children","Array","slides","length","map","_","idx","className","originalParams","loop","isEnd","realIndex","undefined","p","width","borderRadius","backgroundColor","transition","buttonProps","buttonSx","restButton","Button","py","fontSize","lineHeight","letterSpacing","getInteractiveStyle","onClick","slideTo","slideNext","_jsxs","component","fontWeight","color","mx","linesProps","lineProgress","lineProgressProps","lineSx","lineRest","_c","lineProgressSx","lineProgressRest","xs","md","flexGrow","active","seen","minHeight","top","transform","overflow","role","opacity","transformOrigin","sliderProps","progressProps","__","sliderSx","restSlider","value","setValue","useState","Math","round","progress","dragging","useRef","setRerender","useEffect","current","handleMove","on","off","my","Slider","min","max","onChange","newValue","setProgress","onChangeCommitted","slideToClosest","transitionDuration","speed","_d","carouselDragging","setCarouselDragging","handleDragStart","handleDragEnd","handleResize","thumbSize","wrapperEl","scrollWidth","size","ceil","SliderContainer","tabIndex","valueLabelDisplay","border","boxShadow","content"],"mappings":"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"}
1	+ {"version":3,"file":"pagination.js","sources":["../../../src/components/carousel/pagination.tsx"],"sourcesContent":["import React, { ElementType, forwardRef, useEffect, useMemo, useState, useRef } from 'react';\nimport { Box, BoxProps, Button, ButtonProps, Slider, SliderProps, LinearProgressProps, CSSObject } from '@mui/material';\nimport { useCarousel } from './hooks';\nimport type { Swiper as CarouselInstance } from 'swiper';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\nimport { SliderContainer } from '@/src/materialui/slider/sliderContainer';\n\nexport interface CarouselPaginationVariantProps extends Omit<BoxProps<ElementType>, 'children' \| 'position'> {\n /*\n Carousel instance from useCarousel hook\n /\n carousel: CarouselInstance;\n}\nexport interface CarouselPaginationDotsProps extends CarouselPaginationVariantProps {\n variant?: 'dots';\n /\n Properties applied to wrapper of dots\n /\n dotsWrapperProps?: BoxProps<ElementType>;\n /\n Properties applied to each dot\n /\n dotProps?: BoxProps<ElementType>;\n}\nexport interface CarouselPaginationFractionProps extends CarouselPaginationVariantProps {\n variant?: 'fraction';\n /\n Properties applied to button used to render text\n /\n buttonProps?: ButtonProps;\n}\nexport interface CarouselPaginationLinesProps extends CarouselPaginationVariantProps {\n variant?: 'lines';\n /\n Properties applied to each line\n /\n linesProps?: ButtonProps;\n /\n Show progress in active line instead\n /\n lineProgress?: number;\n /\n Properties applied to active line progress\n /\n lineProgressProps?: BoxProps<ElementType>;\n}\n/\n @deprecated use `slider` variant instead\n /\nexport interface CarouselPaginationProgressProps extends CarouselPaginationVariantProps {\n variant?: 'progress';\n /\n @deprecated\n /\n progressProps?: LinearProgressProps;\n /\n Properties applied to Slider\n /\n sliderProps?: SliderProps;\n}\nexport interface CarouselPaginationSliderProps extends CarouselPaginationVariantProps {\n variant?: 'slider';\n /\n Properties applied to Slider\n /\n sliderProps?: SliderProps;\n}\nexport interface CarouselPaginationScrollbarProps extends CarouselPaginationVariantProps {\n variant?: 'scrollbar';\n /\n Properties applied to Slider\n /\n sliderProps?: SliderProps;\n}\nexport interface CarouselPaginationBaseProps {\n /\n Optional Carousel instance from useCarouselInstance hook\n /\n carousel?: CarouselInstance;\n /\n Append style to wrapper box to change position of control\n * @default outside\n /\n position?: 'outside' \| 'inside';\n}\nexport type CarouselPaginationProps = CarouselPaginationBaseProps &\n (\n \| Omit<CarouselPaginationDotsProps, 'carousel'>\n \| Omit<CarouselPaginationFractionProps, 'carousel'>\n \| Omit<CarouselPaginationLinesProps, 'carousel'>\n \| Omit<CarouselPaginationProgressProps, 'carousel'>\n \| Omit<CarouselPaginationSliderProps, 'carousel'>\n \| Omit<CarouselPaginationScrollbarProps, 'carousel'>\n );\n\n/\n Pagination controls\n /\nexport const CarouselPagination: React.FC<CarouselPaginationProps> = forwardRef(\n ({ carousel: carouselProp, position, variant, sx: rawSx, ...rest }, ref) => {\n const carouselHook = useCarousel();\n const carousel = carouselProp \|\| carouselHook;\n // decide on component used\n const VariantComponent = useMemo(() => {\n switch (variant) {\n case 'scrollbar':\n return ScrollbarVariant;\n case 'slider':\n case 'progress':\n return SliderVariant;\n case 'fraction':\n return FractionVariant;\n case 'lines':\n return LinesVariant;\n case 'dots':\n return DotsVariant;\n default:\n return DotsVariant;\n }\n }, [variant]);\n // position extra styling applied to wrapper\n const sx = useMemo<CSSObject \| BoxProps['sx']>(() => {\n if (position === 'inside') {\n return {\n position: 'absolute',\n zIndex: '90',\n bottom: '0',\n left: '0',\n right: '0',\n ...rawSx,\n };\n } else {\n return rawSx;\n }\n }, [position, JSON.stringify(rawSx)]);\n\n return <VariantComponent carousel={carousel} sx={sx} ref={ref} position={position} {...rest} />;\n },\n);\n\n/\n Dots variant (...)\n /\nexport const DotsVariant: React.FC<CarouselPaginationDotsProps> = forwardRef(\n ({ carousel, dotsWrapperProps, dotProps, position, sx, ...rest }, ref) => {\n const { sx: dotsWrapperSx, ...restDotsWrapper } = dotsWrapperProps ?? {};\n const { sx: dotSx, ...restDot } = dotProps ?? {};\n\n return (\n <Box\n sx={{\n p: 2,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n ...sx,\n }}\n ref={ref}\n {...rest}\n >\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: '1000px',\n py: 0.5,\n px: 1,\n gap: 0.5,\n // ensure width does not change during transition\n // dots width space + gap space + extra active dot space + padding\n width: `${(carousel?.slides.length \|\| 0) 12 + ((carousel?.slides.length \|\| 1) - 1) * 4 + 4 + 16}px`,\n // on image variant from Figma\n ...(position === 'inside' && {\n backgroundColor: (theme) => (theme.palette.mode === 'dark' ? 'surface.primary' : 'transparent.backdrop'),\n }),\n ...dotsWrapperSx,\n }}\n {...restDotsWrapper}\n >\n {[...Array(carousel?.slides.length \|\| 0)].map((_, idx) => (\n <Box\n key={idx}\n className={\n !carousel?.originalParams.loop && carousel?.isEnd && idx === (carousel?.slides.length \|\| 0) - 1\n ? 'active'\n : (!carousel?.isEnd \|\| carousel.originalParams.loop) && idx === carousel?.realIndex\n ? 'active'\n : undefined\n }\n sx={{\n p: '0',\n width: '12px',\n height: '12px',\n // scale to 8px\n transform: 'scale(0.6667)',\n borderRadius: '100%',\n backgroundColor: 'onSurface.os500',\n transition: 'transform 0.3s ease-out, background-color 0.3s ease-out, margin 0.3s ease-out',\n '&.active': {\n transform: 'scale(1)',\n backgroundColor: 'text.primary',\n margin: '0 2px',\n },\n ...dotSx,\n }}\n {...restDot}\n />\n ))}\n </Box>\n </Box>\n );\n },\n);\n\n/*\n Fraction variant (text 1/3)\n /\nexport const FractionVariant: React.FC<CarouselPaginationFractionProps> = forwardRef(\n ({ carousel, buttonProps, position, sx, ...rest }, ref) => {\n const { sx: buttonSx, ...restButton } = buttonProps ?? {};\n\n return (\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n // space is needed for focus overflow\n p: 2,\n ...sx,\n }}\n ref={ref}\n {...rest}\n >\n <Button\n variant=\"text\"\n aria-controls=\"carousel\"\n sx={{\n px: 2,\n py: 0.25,\n borderRadius: '4px',\n // custom typography according to Figma (Pagination/Compact)\n fontSize: '18px',\n lineHeight: '28px',\n letterSpacing: '0.02em',\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent.backdrop',\n },\n {\n backgroundColor: 'onSurface.os100',\n },\n ),\n ...buttonSx,\n }}\n onClick={() =>\n // at the end, slide to beginning\n carousel?.isEnd && !carousel.originalParams.loop ? carousel?.slideTo(0) : carousel?.slideNext()\n }\n {...restButton}\n >\n <Box component=\"span\">\n <Box component=\"span\" sx={{ fontWeight: '700', color: 'onSurface.os900' }}>\n {`${(carousel?.realIndex \|\| 0) + 1}`}\n </Box>\n <Box component=\"span\" sx={{ color: 'onSurface.os700', fontWeight: '400', mx: 0.5 }}>\n {' / '}\n </Box>\n <Box component=\"span\" sx={{ color: 'onSurface.os700', fontWeight: '300' }}>\n {`${carousel?.slides.length \|\| 0}`}\n </Box>\n </Box>\n </Button>\n </Box>\n );\n },\n);\n\n/\n Lines variant (- - -)\n /\nexport const LinesVariant: React.FC<CarouselPaginationLinesProps> = forwardRef(\n ({ carousel, sx, linesProps, lineProgress, lineProgressProps, position, ...rest }, ref) => {\n const { sx: lineSx, ...lineRest } = linesProps ?? {};\n const { sx: lineProgressSx, ...lineProgressRest } = lineProgressProps ?? {};\n\n return (\n <Box\n sx={{\n display: 'flex',\n alignItems: 'center',\n justifyContent: { xs: 'stretch', md: 'center' },\n flexGrow: { xs: '1', md: 0 },\n gap: 1,\n // space is needed for focus overflow\n p: 2,\n ...sx,\n }}\n ref={ref}\n {...rest}\n >\n {[...Array(carousel?.slides.length \|\| 0)].map((_, idx) => {\n const active =\n (!carousel?.originalParams.loop && carousel?.isEnd && idx === (carousel?.slides.length \|\| 0) - 1) \|\|\n ((!carousel?.isEnd \|\| carousel.originalParams.loop) && idx === carousel?.realIndex);\n const seen = idx <= (carousel?.realIndex \|\| 0);\n\n return (\n <Button\n key={idx}\n color=\"inherit\"\n className={active ? 'active' : undefined}\n sx={{\n p: 0,\n minHeight: '0',\n height: active \|\| seen ? '8px' : '4px',\n borderRadius: active \|\| seen ? '4px' : '2px',\n width: { xs: '100%', md: '56px' },\n justifyContent: 'flex-start',\n ...getInteractiveStyle(\n {\n backgroundColor: 'surface.primary',\n '& .progress-line': {\n backgroundColor: 'brand.secondary',\n },\n },\n {\n backgroundColor: 'surface.secondary',\n '& .progress-line': {\n backgroundColor: 'brandHover.secondary',\n },\n },\n ),\n ...lineSx,\n }}\n aria-controls=\"carousel\"\n onClick={() => carousel?.[carousel.originalParams.loop ? 'slideToLoop' : 'slideTo'](idx)}\n {...lineRest}\n >\n <Box\n sx={{\n // invisible hitbox expanding clickable area\n position: 'absolute',\n top: '50%',\n left: '0',\n right: '0',\n height: '24px', // Minimum a11y click area\n transform: 'translateY(-50%)',\n pointerEvents: 'auto',\n }}\n />\n <Box sx={{ borderRadius: '4px', height: '100%', width: '100%', overflow: 'hidden' }}>\n <Box\n className=\"progress-line\"\n role={active ? 'progress' : undefined} // Only the active one gets a role\n aria-valuenow={active ? lineProgress : undefined}\n aria-valuemin={0}\n aria-valuemax={100}\n sx={{\n opacity: lineProgress !== undefined \|\| seen ? '1' : '0',\n width: '100%',\n backgroundColor: 'brand.secondary',\n height: '100%',\n transformOrigin: 'left',\n transform: `scaleX(${lineProgress !== undefined && active ? lineProgress / 100 : seen ? 1 : 0})`,\n transition: `${lineProgress !== undefined ? 'transform 300ms ease-in-out, ' : ''}opacity 300ms ease-out, background-color 300ms ease-out`,\n ...lineProgressSx,\n }}\n {...lineProgressRest}\n />\n </Box>\n </Button>\n );\n })}\n </Box>\n );\n },\n);\n\n/\n Slider variant (___)\n /\nexport const SliderVariant: React.FC<CarouselPaginationSliderProps> = forwardRef(\n ({ carousel, sliderProps, sx, progressProps: __, position, ...rest }, ref) => {\n const { sx: sliderSx, ...restSlider } = sliderProps ?? {};\n // slider current value that might not match carousel progress\n const [value, setValue] = useState<number>(Math.round((carousel?.progress \|\| 0) 100));\n // watch user manipulating slider\n const dragging = useRef<boolean>(false);\n const [, setRerender] = useState({});\n // monitor carousel progress to update slider value\n useEffect(() => {\n if (!dragging.current) {\n setValue(Math.round((carousel?.progress \|\| 0) * 100));\n }\n }, [carousel?.progress]);\n // extra monitor of states\n useEffect(() => {\n if (carousel) {\n const handleMove = () => {\n if (!dragging.current) {\n setRerender({});\n }\n };\n\n // monitor of movement to immediately move thumb\n carousel.on('sliderMove', handleMove);\n\n return () => {\n carousel.off('sliderMove', handleMove);\n };\n }\n }, [carousel]);\n\n return (\n <Box sx={{ my: 2, ...sx }} ref={ref} {...rest}>\n <Slider\n value={value}\n min={0}\n max={100}\n onChange={(_, newValue: number) => {\n // prevent value updates from carousel progress\n dragging.current = true;\n // smoothly move carousel\n carousel?.setProgress(newValue / 100, 150);\n // update slider value\n setValue(newValue);\n }}\n onChangeCommitted={() => {\n // make sure to slide to correct position after user stop touching slider\n carousel?.slideToClosest(300);\n // enable changing value from carousel progress\n dragging.current = false;\n }}\n sx={{\n display: 'block',\n height: '4px',\n // restyle to less prominent variant\n '.MuiSlider-rail': {\n color: 'surface.primary',\n },\n '.MuiSlider-track': {\n color: 'onSurface.os500',\n // match transition speed of carousel\n transitionDuration: `${carousel?.originalParams.speed ?? 300}ms`,\n },\n // hide control thumb\n '.MuiSlider-thumb': {\n display: 'none',\n },\n ...sliderSx,\n }}\n aria-controls=\"carousel\"\n {...restSlider}\n />\n </Box>\n );\n },\n);\n\n/*\n Scrollbar variant (_--)\n /\nexport const ScrollbarVariant: React.FC<CarouselPaginationSliderProps> = forwardRef(\n ({ carousel, sliderProps, position, ...rest }, ref) => {\n const { sx: sliderSx, ...restSlider } = sliderProps ?? {};\n // watch states\n const [carouselDragging, setCarouselDragging] = useState<boolean>(false);\n const [, setRerender] = useState({});\n // extra monitor of states\n useEffect(() => {\n if (carousel) {\n const handleDragStart = () => setCarouselDragging(true);\n const handleDragEnd = () => setCarouselDragging(false);\n const handleResize = () => setRerender({});\n\n // monitor of dragging to remove thumb transition for immediate feedback\n carousel.on('touchStart', handleDragStart);\n carousel.on('touchEnd', handleDragEnd);\n // monitor resize to change size of the thumb\n carousel.on('resize', handleResize);\n\n return () => {\n carousel.off('touchStart', handleDragStart);\n carousel.off('touchEnd', handleDragEnd);\n carousel.off('resize', handleResize);\n };\n }\n }, [carousel]);\n // calculate size of the thumb based on the visible content and full content\n const thumbSize = useMemo<number>(() => {\n if (carousel?.wrapperEl?.scrollWidth && carousel?.width) {\n const size = Math.ceil(carousel?.width * 2 / carousel?.wrapperEl?.scrollWidth);\n return Math.max(size, 40);\n }\n return 40;\n }, [carousel?.wrapperEl?.scrollWidth, carousel?.width]);\n\n return (\n <SliderVariant\n ref={ref}\n carousel={carousel}\n component={SliderContainer}\n thumbSize={thumbSize}\n sliderProps={{\n // prevent selection via keyboard, Carousel can be already controlled with Keyboard and we are not showing focus ring\n tabIndex: -1,\n // remove valueLabel tooltip above thumb\n valueLabelDisplay: 'off',\n sx: {\n display: 'block',\n height: '4px',\n // restyle to match scrollbar\n '.MuiSlider-rail, .MuiSlider-track': {\n color: 'surface.primary',\n },\n '.MuiSlider-thumb': {\n display: 'flex',\n width: `${thumbSize}px`,\n height: '4px',\n border: 'none',\n backgroundColor: 'onSurface.os500',\n // match transition speed of carousel\n ...(!carouselDragging && {\n transition: `left ${carousel?.originalParams.speed ?? 300}ms ease-out`,\n }),\n // remove focus style\n '&.Mui-focusVisible': {\n boxShadow: 'none',\n '&:before': {\n content: 'none',\n },\n },\n },\n ...sliderSx,\n },\n ...restSlider,\n }}\n {...rest}\n />\n );\n },\n);\n"],"names":["CarouselPagination","forwardRef","_a","ref","carousel","carouselProp","position","variant","sx","rawSx","rest","__rest","carouselHook","useCarousel","VariantComponent","useMemo","ScrollbarVariant","SliderVariant","FractionVariant","LinesVariant","DotsVariant","Object","assign","zIndex","bottom","left","right","JSON","stringify","_jsx","dotsWrapperProps","dotProps","_b","dotsWrapperSx","restDotsWrapper","_c","dotSx","restDot","Box","p","display","alignItems","justifyContent","children","borderRadius","py","px","gap","width","slides","length","backgroundColor","theme","palette","mode","Array","map","_","idx","className","originalParams","loop","isEnd","realIndex","undefined","height","transform","transition","margin","buttonProps","buttonSx","restButton","Button","fontSize","lineHeight","letterSpacing","getInteractiveStyle","onClick","slideTo","slideNext","_jsxs","component","fontWeight","color","mx","linesProps","lineProgress","lineProgressProps","lineSx","lineRest","lineProgressSx","lineProgressRest","xs","md","flexGrow","active","seen","minHeight","top","pointerEvents","overflow","role","opacity","transformOrigin","sliderProps","progressProps","__","sliderSx","restSlider","value","setValue","useState","Math","round","progress","dragging","useRef","setRerender","useEffect","current","handleMove","on","off","my","Slider","min","max","onChange","newValue","setProgress","onChangeCommitted","slideToClosest","transitionDuration","speed","_d","carouselDragging","setCarouselDragging","handleDragStart","handleDragEnd","handleResize","thumbSize","wrapperEl","scrollWidth","size","ceil","SliderContainer","tabIndex","valueLabelDisplay","border","boxShadow","content"],"mappings":"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"}

package/components/chip/chipFocusVisibleStyled.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-declare const ChipFocusVisibleStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/system").Theme> & {
+declare const ChipFocusVisibleStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
     focusVisible: boolean;
     variant: any;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/chip/chipFocusVisibleStyled.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{styled as e}from"@mui/system";const i=e("div")((({theme:e,focusVisible:i,variant:o})=>({display:"inline-flex",borderRadius:"image"===o?6:50,transition:"none",boxShadow:i?`0 0 0 2px ${e.palette.onSurface.os900}`:void 0})));export{i as default};
+import{styled as e}from"@mui/material/styles";const i=e("div")((({theme:e,focusVisible:i,variant:a})=>({display:"inline-flex",borderRadius:"image"===a?6:50,transition:"none",boxShadow:i?`0 0 0 2px ${e.palette.onSurface.os900}`:void 0})));export{i as default};
 //# sourceMappingURL=chipFocusVisibleStyled.js.map

package/components/chip/chipFocusVisibleStyled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"chipFocusVisibleStyled.js","sources":["../../../src/components/chip/chipFocusVisibleStyled.tsx"],"sourcesContent":["import { styled } from '@mui/~~system~~';\n\nconst ChipFocusVisibleStyled = styled('div')<{ focusVisible: boolean; variant: any }>(({\n theme,\n focusVisible,\n variant,\n}) => {\n return {\n display: 'inline-flex',\n borderRadius: variant === 'image' ? 6 : 50,\n transition: 'none',\n boxShadow: focusVisible ? `0 0 0 2px ${theme.palette.onSurface.os900}` : undefined,\n };\n});\n\nexport default ChipFocusVisibleStyled;\n"],"names":["ChipFocusVisibleStyled","styled","theme","focusVisible","variant","display","borderRadius","transition","boxShadow","palette","onSurface","os900","undefined"],"mappings":"~~qCAEA~~,MAAMA,EAAyBC,EAAO,MAAPA,EAAuD,EACpFC,QACAC,eACAC,cAEO,CACLC,QAAS,cACTC,aAA0B,UAAZF,EAAsB,EAAI,GACxCG,WAAY,OACZC,UAAWL,EAAe,aAAaD,EAAMO,QAAQC,UAAUC,aAAUC"}
1	+ {"version":3,"file":"chipFocusVisibleStyled.js","sources":["../../../src/components/chip/chipFocusVisibleStyled.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\n\nconst ChipFocusVisibleStyled = styled('div')<{ focusVisible: boolean; variant: any }>(({\n theme,\n focusVisible,\n variant,\n}) => {\n return {\n display: 'inline-flex',\n borderRadius: variant === 'image' ? 6 : 50,\n transition: 'none',\n boxShadow: focusVisible ? `0 0 0 2px ${theme.palette.onSurface.os900}` : undefined,\n };\n});\n\nexport default ChipFocusVisibleStyled;\n"],"names":["ChipFocusVisibleStyled","styled","theme","focusVisible","variant","display","borderRadius","transition","boxShadow","palette","onSurface","os900","undefined"],"mappings":"8CAEA,MAAMA,EAAyBC,EAAO,MAAPA,EAAuD,EACpFC,QACAC,eACAC,cAEO,CACLC,QAAS,cACTC,aAA0B,UAAZF,EAAsB,EAAI,GACxCG,WAAY,OACZC,UAAWL,EAAe,aAAaD,EAAMO,QAAQC,UAAUC,aAAUC"}

package/components/common/menuContainer.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{__rest as e}from"tslib";import{jsx as i}from"react/jsx-runtime";import{styled as t}from"@mui/system";import{Menu as s}from"../menu/menu.js";import{MenuEmpty as o}from"./menuEmpty.js";const n=t=>{var{setIsOpen:n,isEmptyMenu:r}=t,p=e(t,["setIsOpen","isEmptyMenu"]);return i(l,{marginTop:p.marginTop+"px",width:p.fullWidth?"100%":p.width+"px",isOpen:p.isOpen,disabled:p.disabled,children:r?i(o,{children:p.children}):i(s,{items:p.items,hasIcon:p.hasIcon,multipleSelection:p.multipleSelection,groupToggleSelection:p.groupToggleSelection,groupLabel:p.groupLabel,reactHook:p.reactHook,setIsOpen:n,toggleLabel:p.toggleLabel})})},l=t("div")((i=>{var{theme:t}=i,s=e(i,["theme"]);let o={};return o={width:s.width,marginTop:s.marginTop,transition:"0.3s ease-out",display:"inline-block",position:"absolute",zIndex:"10"},o=s.isOpen&&!s.disabled?Object.assign(Object.assign({},o),{visibility:"visible",opacity:"100%"}):Object.assign(Object.assign({},o),{visibility:"hidden",opacity:"0%"}),o}));export{n as default};
+import{__rest as e}from"tslib";import{jsx as i}from"react/jsx-runtime";import{styled as t}from"@mui/material/styles";import{Menu as s}from"../menu/menu.js";import{MenuEmpty as o}from"./menuEmpty.js";const n=t=>{var{setIsOpen:n,isEmptyMenu:r}=t,a=e(t,["setIsOpen","isEmptyMenu"]);return i(l,{marginTop:a.marginTop+"px",width:a.fullWidth?"100%":a.width+"px",isOpen:a.isOpen,disabled:a.disabled,children:r?i(o,{children:a.children}):i(s,{items:a.items,hasIcon:a.hasIcon,multipleSelection:a.multipleSelection,groupToggleSelection:a.groupToggleSelection,groupLabel:a.groupLabel,reactHook:a.reactHook,setIsOpen:n,toggleLabel:a.toggleLabel})})},l=t("div")((i=>{var{theme:t}=i,s=e(i,["theme"]);let o={};return o={width:s.width,marginTop:s.marginTop,transition:"0.3s ease-out",display:"inline-block",position:"absolute",zIndex:"10"},o=s.isOpen&&!s.disabled?Object.assign(Object.assign({},o),{visibility:"visible",opacity:"100%"}):Object.assign(Object.assign({},o),{visibility:"hidden",opacity:"0%"}),o}));export{n as default};
 //# sourceMappingURL=menuContainer.js.map

package/components/common/menuContainer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"menuContainer.js","sources":["../../../src/components/common/menuContainer.tsx"],"sourcesContent":["import React from 'react';\nimport { styled } from '@mui/~~system~~';\nimport { Menu, MenuReactUseStateHook, MenuItems } from '../menu';\nimport MenuEmpty from './menuEmpty';\n\nexport interface MenuContainerProps {\n disabled?: boolean;\n items?: MenuItems;\n hasIcon?: boolean;\n multipleSelection?: boolean;\n groupLabel?: string;\n reactHook?: MenuReactUseStateHook;\n groupToggleSelection?: boolean;\n isOpen?: boolean;\n marginTop?: number;\n width?: number;\n fullWidth?: boolean;\n setIsOpen?: React.Dispatch<React.SetStateAction<boolean>>;\n isEmptyMenu?: boolean;\n toggleLabel?: string;\n children?: React.ReactNode;\n}\n\nconst MenuContainer: React.FC<MenuContainerProps> = ({ setIsOpen, isEmptyMenu, ...props }) => {\n return (\n <StyledDiv\n marginTop={props.marginTop + 'px'}\n width={props.fullWidth ? '100%' : props.width + 'px'}\n isOpen={props.isOpen}\n disabled={props.disabled}\n >\n {isEmptyMenu ? (\n <MenuEmpty>{props.children}</MenuEmpty>\n ) : (\n <Menu\n items={props.items}\n hasIcon={props.hasIcon}\n multipleSelection={props.multipleSelection}\n groupToggleSelection={props.groupToggleSelection}\n groupLabel={props.groupLabel}\n reactHook={props.reactHook}\n setIsOpen={setIsOpen}\n toggleLabel={props.toggleLabel}\n />\n )}\n </StyledDiv>\n );\n};\n\nconst StyledDiv = styled('div')<{\n marginTop?: string;\n isOpen: boolean;\n disabled: boolean;\n width?: string;\n}>(({ theme, ...args }) => {\n let styles = {};\n\n styles = {\n width: args.width,\n marginTop: args.marginTop,\n transition: '0.3s ease-out',\n display: 'inline-block',\n position: 'absolute',\n zIndex: '10',\n };\n\n if (args.isOpen && !args.disabled) {\n styles = { ...styles, visibility: 'visible', opacity: '100%' };\n } else {\n styles = { ...styles, visibility: 'hidden', opacity: '0%' };\n }\n\n return styles;\n});\n\nexport default MenuContainer;\n"],"names":["MenuContainer","_a","setIsOpen","isEmptyMenu","props","__rest","_jsx","StyledDiv","marginTop","width","fullWidth","isOpen","disabled","children","MenuEmpty","Menu","items","hasIcon","multipleSelection","groupToggleSelection","groupLabel","reactHook","toggleLabel","styled","theme","args","styles","transition","display","position","zIndex","Object","assign","visibility","opacity"],"mappings":"~~8LAuBA~~,MAAMA,EAA+CC,QAAAC,UAAEA,EAASC,YAAEA,GAAWF,EAAKG,EAAKC,EAAAJ,EAAlC,6BACnD,OACEK,EAACC,EACC,CAAAC,UAAWJ,EAAMI,UAAY,KAC7BC,MAAOL,EAAMM,UAAY,OAASN,EAAMK,MAAQ,KAChDE,OAAQP,EAAMO,OACdC,SAAUR,EAAMQ,SAEfC,SAAAV,EACCG,EAACQ,EAAW,CAAAD,SAAAT,EAAMS,WAElBP,EAACS,EAAI,CACHC,MAAOZ,EAAMY,MACbC,QAASb,EAAMa,QACfC,kBAAmBd,EAAMc,kBACzBC,qBAAsBf,EAAMe,qBAC5BC,WAAYhB,EAAMgB,WAClBC,UAAWjB,EAAMiB,UACjBnB,UAAWA,EACXoB,YAAalB,EAAMkB,eAGb,EAIVf,EAAYgB,EAAO,MAAPA,EAKdtB,IAAA,IAAAuB,MAAEA,GAAgBvB,EAANwB,EAAIpB,EAAAJ,EAAhB,WACF,IAAIyB,EAAS,CAAE,EAiBf,OAfAA,EAAS,CACPjB,MAAOgB,EAAKhB,MACZD,UAAWiB,EAAKjB,UAChBmB,WAAY,gBACZC,QAAS,eACTC,SAAU,WACVC,OAAQ,MAIRJ,EADED,EAAKd,SAAWc,EAAKb,SACjBmB,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAQN,GAAM,CAAEO,WAAY,UAAWC,QAAS,SAEhDH,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAQN,GAAM,CAAEO,WAAY,SAAUC,QAAS,OAGhDR,CAAM"}
1	+ {"version":3,"file":"menuContainer.js","sources":["../../../src/components/common/menuContainer.tsx"],"sourcesContent":["import React from 'react';\nimport { styled } from '@mui/material/styles';\nimport { Menu, MenuReactUseStateHook, MenuItems } from '../menu';\nimport MenuEmpty from './menuEmpty';\n\nexport interface MenuContainerProps {\n disabled?: boolean;\n items?: MenuItems;\n hasIcon?: boolean;\n multipleSelection?: boolean;\n groupLabel?: string;\n reactHook?: MenuReactUseStateHook;\n groupToggleSelection?: boolean;\n isOpen?: boolean;\n marginTop?: number;\n width?: number;\n fullWidth?: boolean;\n setIsOpen?: React.Dispatch<React.SetStateAction<boolean>>;\n isEmptyMenu?: boolean;\n toggleLabel?: string;\n children?: React.ReactNode;\n}\n\nconst MenuContainer: React.FC<MenuContainerProps> = ({ setIsOpen, isEmptyMenu, ...props }) => {\n return (\n <StyledDiv\n marginTop={props.marginTop + 'px'}\n width={props.fullWidth ? '100%' : props.width + 'px'}\n isOpen={props.isOpen}\n disabled={props.disabled}\n >\n {isEmptyMenu ? (\n <MenuEmpty>{props.children}</MenuEmpty>\n ) : (\n <Menu\n items={props.items}\n hasIcon={props.hasIcon}\n multipleSelection={props.multipleSelection}\n groupToggleSelection={props.groupToggleSelection}\n groupLabel={props.groupLabel}\n reactHook={props.reactHook}\n setIsOpen={setIsOpen}\n toggleLabel={props.toggleLabel}\n />\n )}\n </StyledDiv>\n );\n};\n\nconst StyledDiv = styled('div')<{\n marginTop?: string;\n isOpen: boolean;\n disabled: boolean;\n width?: string;\n}>(({ theme, ...args }) => {\n let styles = {};\n\n styles = {\n width: args.width,\n marginTop: args.marginTop,\n transition: '0.3s ease-out',\n display: 'inline-block',\n position: 'absolute',\n zIndex: '10',\n };\n\n if (args.isOpen && !args.disabled) {\n styles = { ...styles, visibility: 'visible', opacity: '100%' };\n } else {\n styles = { ...styles, visibility: 'hidden', opacity: '0%' };\n }\n\n return styles;\n});\n\nexport default MenuContainer;\n"],"names":["MenuContainer","_a","setIsOpen","isEmptyMenu","props","__rest","_jsx","StyledDiv","marginTop","width","fullWidth","isOpen","disabled","children","MenuEmpty","Menu","items","hasIcon","multipleSelection","groupToggleSelection","groupLabel","reactHook","toggleLabel","styled","theme","args","styles","transition","display","position","zIndex","Object","assign","visibility","opacity"],"mappings":"uMAuBA,MAAMA,EAA+CC,QAAAC,UAAEA,EAASC,YAAEA,GAAWF,EAAKG,EAAKC,EAAAJ,EAAlC,6BACnD,OACEK,EAACC,EACC,CAAAC,UAAWJ,EAAMI,UAAY,KAC7BC,MAAOL,EAAMM,UAAY,OAASN,EAAMK,MAAQ,KAChDE,OAAQP,EAAMO,OACdC,SAAUR,EAAMQ,SAEfC,SAAAV,EACCG,EAACQ,EAAW,CAAAD,SAAAT,EAAMS,WAElBP,EAACS,EAAI,CACHC,MAAOZ,EAAMY,MACbC,QAASb,EAAMa,QACfC,kBAAmBd,EAAMc,kBACzBC,qBAAsBf,EAAMe,qBAC5BC,WAAYhB,EAAMgB,WAClBC,UAAWjB,EAAMiB,UACjBnB,UAAWA,EACXoB,YAAalB,EAAMkB,eAGb,EAIVf,EAAYgB,EAAO,MAAPA,EAKdtB,IAAA,IAAAuB,MAAEA,GAAgBvB,EAANwB,EAAIpB,EAAAJ,EAAhB,WACF,IAAIyB,EAAS,CAAE,EAiBf,OAfAA,EAAS,CACPjB,MAAOgB,EAAKhB,MACZD,UAAWiB,EAAKjB,UAChBmB,WAAY,gBACZC,QAAS,eACTC,SAAU,WACVC,OAAQ,MAIRJ,EADED,EAAKd,SAAWc,EAAKb,SACjBmB,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAQN,GAAM,CAAEO,WAAY,UAAWC,QAAS,SAEhDH,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAQN,GAAM,CAAEO,WAAY,SAAUC,QAAS,OAGhDR,CAAM"}

package/components/common/styled/buttonFocusVisibleStyled.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-declare const ButtonFocusVisibleStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/system").Theme> & {
+declare const ButtonFocusVisibleStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
     focusVisible: boolean;
     isNavigationVariant: boolean;
     fullWidth?: boolean;

package/components/common/styled/buttonFocusVisibleStyled.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{styled as i}from"@mui/system";const o=i("div")((({theme:i,focusVisible:o,isNavigationVariant:t,fullWidth:a})=>({display:"inline-flex",padding:1,borderRadius:t?4:50,transition:"none",boxShadow:o?`0 0 0 2px ${i.palette.onSurface.os900}`:void 0,width:a?"100%":null})));export{o as default};
+import{styled as i}from"@mui/material/styles";const a=i("div")((({theme:i,focusVisible:a,isNavigationVariant:t,fullWidth:e})=>({display:"inline-flex",padding:1,borderRadius:t?4:50,transition:"none",boxShadow:a?`0 0 0 2px ${i.palette.onSurface.os900}`:void 0,width:e?"100%":null})));export{a as default};
 //# sourceMappingURL=buttonFocusVisibleStyled.js.map

package/components/common/styled/buttonFocusVisibleStyled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"buttonFocusVisibleStyled.js","sources":["../../../../src/components/common/styled/buttonFocusVisibleStyled.tsx"],"sourcesContent":["import { styled } from '@mui/~~system~~';\n\nconst ButtonFocusVisibleStyled = styled('div')<{\n focusVisible: boolean;\n isNavigationVariant: boolean;\n fullWidth?: boolean;\n}>(({ theme, focusVisible, isNavigationVariant, fullWidth }) => {\n return {\n display: 'inline-flex',\n padding: 1,\n borderRadius: isNavigationVariant ? 4 : 50,\n transition: 'none',\n boxShadow: focusVisible ? `0 0 0 2px ${theme.palette.onSurface.os900}` : undefined,\n width: fullWidth ? '100%' : null,\n };\n});\n\nexport default ButtonFocusVisibleStyled;\n"],"names":["ButtonFocusVisibleStyled","styled","theme","focusVisible","isNavigationVariant","fullWidth","display","padding","borderRadius","transition","boxShadow","palette","onSurface","os900","undefined","width"],"mappings":"~~qCAEA~~,MAAMA,EAA2BC,EAAO,MAAPA,EAI9B,EAAGC,QAAOC,eAAcC,sBAAqBC,gBACvC,CACLC,QAAS,cACTC,QAAS,EACTC,aAAcJ,EAAsB,EAAI,GACxCK,WAAY,OACZC,UAAWP,EAAe,aAAaD,EAAMS,QAAQC,UAAUC,aAAUC,EACzEC,MAAOV,EAAY,OAAS"}
1	+ {"version":3,"file":"buttonFocusVisibleStyled.js","sources":["../../../../src/components/common/styled/buttonFocusVisibleStyled.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\n\nconst ButtonFocusVisibleStyled = styled('div')<{\n focusVisible: boolean;\n isNavigationVariant: boolean;\n fullWidth?: boolean;\n}>(({ theme, focusVisible, isNavigationVariant, fullWidth }) => {\n return {\n display: 'inline-flex',\n padding: 1,\n borderRadius: isNavigationVariant ? 4 : 50,\n transition: 'none',\n boxShadow: focusVisible ? `0 0 0 2px ${theme.palette.onSurface.os900}` : undefined,\n width: fullWidth ? '100%' : null,\n };\n});\n\nexport default ButtonFocusVisibleStyled;\n"],"names":["ButtonFocusVisibleStyled","styled","theme","focusVisible","isNavigationVariant","fullWidth","display","padding","borderRadius","transition","boxShadow","palette","onSurface","os900","undefined","width"],"mappings":"8CAEA,MAAMA,EAA2BC,EAAO,MAAPA,EAI9B,EAAGC,QAAOC,eAAcC,sBAAqBC,gBACvC,CACLC,QAAS,cACTC,QAAS,EACTC,aAAcJ,EAAsB,EAAI,GACxCK,WAAY,OACZC,UAAWP,EAAe,aAAaD,EAAMS,QAAQC,UAAUC,aAAUC,EACzEC,MAAOV,EAAY,OAAS"}

package/components/common/styled/formControlLabelStyled.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import { FormControlLabelProps as MuiFormControlLabelProps } from '@mui/material';
-declare const FormControlLabelStyled: import("@emotion/styled").StyledComponent<MuiFormControlLabelProps & import("@mui/system").MUIStyledCommonProps<import("@mui/system").Theme> & {
+declare const FormControlLabelStyled: import("@emotion/styled").StyledComponent<MuiFormControlLabelProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
     error?: boolean;
     theme?: any;
 }, {}, {}>;

package/components/common/styled/formControlLabelStyled.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{styled as r}from"@mui/system";import{FormControlLabel as o}from"@mui/material";const e=r(o,{shouldForwardProp:r=>"error"!==r})((({theme:r,error:o})=>({color:o?r.palette.alert.main:void 0})));export{e as default};
+import{styled as r}from"@mui/material/styles";import{FormControlLabel as o}from"@mui/material";const e=r(o,{shouldForwardProp:r=>"error"!==r})((({theme:r,error:o})=>({color:o?r.palette.alert.main:void 0})));export{e as default};
 //# sourceMappingURL=formControlLabelStyled.js.map

package/components/common/styled/formControlLabelStyled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"formControlLabelStyled.js","sources":["../../../../src/components/common/styled/formControlLabelStyled.tsx"],"sourcesContent":["import { styled } from '@mui/~~system~~';\nimport {\n FormControlLabelProps as MuiFormControlLabelProps,\n FormControlLabel as MuiFormControlLabel,\n} from '@mui/material';\n\nconst FormControlLabelStyled = styled(MuiFormControlLabel, {\n shouldForwardProp: (prop) => prop !== 'error',\n})<MuiFormControlLabelProps & { error?: boolean; theme?: any }>(({ theme, error }) => {\n return {\n color: error ? theme.palette.alert['main'] : undefined,\n };\n});\n\nexport default FormControlLabelStyled;\n"],"names":["FormControlLabelStyled","styled","MuiFormControlLabel","shouldForwardProp","prop","theme","error","color","palette","alert","undefined"],"mappings":"~~sFAMA~~,MAAMA,EAAyBC,EAAOC,EAAqB,CACzDC,kBAAoBC,GAAkB,UAATA,GADAH,EAEiC,EAAGI,QAAOC,YACjE,CACLC,MAAOD,EAAQD,EAAMG,QAAQC,MAAY,UAAIC"}
1	+ {"version":3,"file":"formControlLabelStyled.js","sources":["../../../../src/components/common/styled/formControlLabelStyled.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\nimport {\n FormControlLabelProps as MuiFormControlLabelProps,\n FormControlLabel as MuiFormControlLabel,\n} from '@mui/material';\n\nconst FormControlLabelStyled = styled(MuiFormControlLabel, {\n shouldForwardProp: (prop) => prop !== 'error',\n})<MuiFormControlLabelProps & { error?: boolean; theme?: any }>(({ theme, error }) => {\n return {\n color: error ? theme.palette.alert['main'] : undefined,\n };\n});\n\nexport default FormControlLabelStyled;\n"],"names":["FormControlLabelStyled","styled","MuiFormControlLabel","shouldForwardProp","prop","theme","error","color","palette","alert","undefined"],"mappings":"+FAMA,MAAMA,EAAyBC,EAAOC,EAAqB,CACzDC,kBAAoBC,GAAkB,UAATA,GADAH,EAEiC,EAAGI,QAAOC,YACjE,CACLC,MAAOD,EAAQD,EAAMG,QAAQC,MAAY,UAAIC"}

package/components/common/styled/helperTextContainerStyled.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-declare const HelperTextContainerStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/system").Theme> & {
+declare const HelperTextContainerStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
     theme?: any;
     disabled?: boolean;
     hasError?: boolean;

package/components/common/styled/sliderValuesStyled.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-declare const SliderValuesStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/system").Theme> & {
+declare const SliderValuesStyled: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
     theme?: any;
     disabled?: boolean;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/common/styled/sliderValuesStyled.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{styled as e}from"@mui/system";const o=e("div")((({theme:e,disabled:o})=>{const t=e.palette.disabled.primary;return{color:o?t:e.palette.onSurface.os700,fontSize:"14px",fontWeight:"normal",lineHeight:"20px","& input":{outline:"none",border:"0px",background:"transparent",color:o?t:e.palette.onSurface.os700,paddingTop:"0 !important"},"& span":{color:o?t:e.palette.onSurface.os700},"& .range-values":{display:"flex","& .middle-side":{flexGrow:1}},"& label":{display:"block",color:o?t:e.palette.onSurface.os500,fontSize:"12px",lineHeight:"16px"}}}));export{o as default};
+import{styled as e}from"@mui/material/styles";const o=e("div")((({theme:e,disabled:o})=>{const t=e.palette.disabled.primary;return{color:o?t:e.palette.onSurface.os700,fontSize:"14px",fontWeight:"normal",lineHeight:"20px","& input":{outline:"none",border:"0px",background:"transparent",color:o?t:e.palette.onSurface.os700,paddingTop:"0 !important"},"& span":{color:o?t:e.palette.onSurface.os700},"& .range-values":{display:"flex","& .middle-side":{flexGrow:1}},"& label":{display:"block",color:o?t:e.palette.onSurface.os500,fontSize:"12px",lineHeight:"16px"}}}));export{o as default};
 //# sourceMappingURL=sliderValuesStyled.js.map

package/components/common/styled/sliderValuesStyled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sliderValuesStyled.js","sources":["../../../../src/components/common/styled/sliderValuesStyled.tsx"],"sourcesContent":["import { styled } from '@mui/~~system~~';\n\nconst SliderValuesStyled = styled('div')<{ theme?: any; disabled?: boolean }>(({ theme, disabled }) => {\n const colorDisabled = theme.palette.disabled.primary;\n return {\n color: disabled ? colorDisabled : theme.palette.onSurface.os700,\n fontSize: '14px',\n fontWeight: 'normal',\n lineHeight: '20px',\n '& input': {\n outline: 'none',\n border: '0px',\n background: 'transparent',\n color: disabled ? colorDisabled : theme.palette.onSurface.os700,\n paddingTop: '0 !important',\n },\n '& span': {\n color: disabled ? colorDisabled : theme.palette.onSurface.os700,\n },\n '& .range-values': {\n display: 'flex',\n '& .middle-side': {\n flexGrow: 1,\n },\n },\n '& label': {\n display: 'block',\n color: disabled ? colorDisabled : theme.palette.onSurface.os500,\n fontSize: '12px',\n lineHeight: '16px',\n },\n };\n});\n\nexport default SliderValuesStyled;\n"],"names":["SliderValuesStyled","styled","theme","disabled","colorDisabled","palette","primary","color","onSurface","os700","fontSize","fontWeight","lineHeight","outline","border","background","paddingTop","display","flexGrow","os500"],"mappings":"~~qCAEA~~,MAAMA,EAAqBC,EAAO,MAAPA,EAAmD,EAAGC,QAAOC,eACtF,MAAMC,EAAgBF,EAAMG,QAAQF,SAASG,QAC7C,MAAO,CACLC,MAAOJ,EAAWC,EAAgBF,EAAMG,QAAQG,UAAUC,MAC1DC,SAAU,OACVC,WAAY,SACZC,WAAY,OACZ,UAAW,CACTC,QAAS,OACTC,OAAQ,MACRC,WAAY,cACZR,MAAOJ,EAAWC,EAAgBF,EAAMG,QAAQG,UAAUC,MAC1DO,WAAY,gBAEd,SAAU,CACRT,MAAOJ,EAAWC,EAAgBF,EAAMG,QAAQG,UAAUC,OAE5D,kBAAmB,CACjBQ,QAAS,OACT,iBAAkB,CAChBC,SAAU,IAGd,UAAW,CACTD,QAAS,QACTV,MAAOJ,EAAWC,EAAgBF,EAAMG,QAAQG,UAAUW,MAC1DT,SAAU,OACVE,WAAY,QAEf"}
1	+ {"version":3,"file":"sliderValuesStyled.js","sources":["../../../../src/components/common/styled/sliderValuesStyled.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\n\nconst SliderValuesStyled = styled('div')<{ theme?: any; disabled?: boolean }>(({ theme, disabled }) => {\n const colorDisabled = theme.palette.disabled.primary;\n return {\n color: disabled ? colorDisabled : theme.palette.onSurface.os700,\n fontSize: '14px',\n fontWeight: 'normal',\n lineHeight: '20px',\n '& input': {\n outline: 'none',\n border: '0px',\n background: 'transparent',\n color: disabled ? colorDisabled : theme.palette.onSurface.os700,\n paddingTop: '0 !important',\n },\n '& span': {\n color: disabled ? colorDisabled : theme.palette.onSurface.os700,\n },\n '& .range-values': {\n display: 'flex',\n '& .middle-side': {\n flexGrow: 1,\n },\n },\n '& label': {\n display: 'block',\n color: disabled ? colorDisabled : theme.palette.onSurface.os500,\n fontSize: '12px',\n lineHeight: '16px',\n },\n };\n});\n\nexport default SliderValuesStyled;\n"],"names":["SliderValuesStyled","styled","theme","disabled","colorDisabled","palette","primary","color","onSurface","os700","fontSize","fontWeight","lineHeight","outline","border","background","paddingTop","display","flexGrow","os500"],"mappings":"8CAEA,MAAMA,EAAqBC,EAAO,MAAPA,EAAmD,EAAGC,QAAOC,eACtF,MAAMC,EAAgBF,EAAMG,QAAQF,SAASG,QAC7C,MAAO,CACLC,MAAOJ,EAAWC,EAAgBF,EAAMG,QAAQG,UAAUC,MAC1DC,SAAU,OACVC,WAAY,SACZC,WAAY,OACZ,UAAW,CACTC,QAAS,OACTC,OAAQ,MACRC,WAAY,cACZR,MAAOJ,EAAWC,EAAgBF,EAAMG,QAAQG,UAAUC,MAC1DO,WAAY,gBAEd,SAAU,CACRT,MAAOJ,EAAWC,EAAgBF,EAAMG,QAAQG,UAAUC,OAE5D,kBAAmB,CACjBQ,QAAS,OACT,iBAAkB,CAChBC,SAAU,IAGd,UAAW,CACTD,QAAS,QACTV,MAAOJ,EAAWC,EAAgBF,EAAMG,QAAQG,UAAUW,MAC1DT,SAAU,OACVE,WAAY,QAEf"}

package/components/customPickersActionBar/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{__rest as t}from"tslib";import{jsx as n,jsxs as o}from"react/jsx-runtime";import{DialogActions as e,Button as r}from"@mui/material";import{Stack as i}from"@mui/system";import{usePickersTranslations as c}from"@mui/x-date-pickers";const l=l=>{const{actions:a,onAccept:d,onCancel:m,onClear:s,onSetToday:u}=l,p=t(l,["actions","onAccept","onCancel","onClear","onSetToday"]),y=c();return(null==a?void 0:a.length)?n(e,Object.assign({},p,{children:o(i,{direction:"row",justifyContent:"space-between",children:[o(i,{direction:"row",children:[a.includes("clear")&&n(r,{variant:"text",color:"primary",onClick:s,children:y.clearButtonLabel}),a.includes("today")&&n(r,{variant:"text",color:"primary",onClick:u,children:y.todayButtonLabel})]}),o(i,{direction:"row",children:[a.includes("cancel")&&n(r,{variant:"text",color:"primary",onClick:m,children:y.cancelButtonLabel}),a.includes("accept")&&n(r,{variant:"text",color:"primary",onClick:d,children:y.okButtonLabel})]})]})})):null};export{l as CustomPickersActionBar};
+import{__rest as n}from"tslib";import{jsx as t,jsxs as e}from"react/jsx-runtime";import{DialogActions as o,Stack as r,Button as c}from"@mui/material";import{usePickersTranslations as i}from"@mui/x-date-pickers";const l=l=>{const{actions:a,onAccept:d,onCancel:m,onClear:s,onSetToday:u}=l,p=n(l,["actions","onAccept","onCancel","onClear","onSetToday"]),h=i();return(null==a?void 0:a.length)?t(o,Object.assign({},p,{children:e(r,{direction:"row",justifyContent:"space-between",children:[e(r,{direction:"row",children:[a.includes("clear")&&t(c,{variant:"text",color:"primary",onClick:s,children:h.clearButtonLabel}),a.includes("today")&&t(c,{variant:"text",color:"primary",onClick:u,children:h.todayButtonLabel})]}),e(r,{direction:"row",children:[a.includes("cancel")&&t(c,{variant:"text",color:"primary",onClick:m,children:h.cancelButtonLabel}),a.includes("accept")&&t(c,{variant:"text",color:"primary",onClick:d,children:h.okButtonLabel})]})]})})):null};export{l as CustomPickersActionBar};
 //# sourceMappingURL=index.js.map

package/components/customPickersActionBar/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../../src/components/customPickersActionBar/index.tsx"],"sourcesContent":["import { Button, DialogActions } from '@mui/material';\nimport { ~~Stack } from '@mui/system';\nimport {~~ PickersActionBarProps, usePickersTranslations } from '@mui/x-date-pickers';\n\nexport const CustomPickersActionBar = (props: PickersActionBarProps) => {\n const { actions, onAccept, onCancel, onClear, onSetToday, ...other } = props;\n const localeText = usePickersTranslations();\n\n if (!actions?.length) return null;\n\n return (\n <DialogActions {...other}>\n <Stack direction=\"row\" justifyContent=\"space-between\">\n <Stack direction=\"row\">\n {actions.includes('clear') && (\n <Button variant=\"text\" color=\"primary\" onClick={onClear}>\n {localeText.clearButtonLabel}\n </Button>\n )}\n {actions.includes('today') && (\n <Button variant=\"text\" color=\"primary\" onClick={onSetToday}>\n {localeText.todayButtonLabel}\n </Button>\n )}\n </Stack>\n <Stack direction=\"row\">\n {actions.includes('cancel') && (\n <Button variant=\"text\" color=\"primary\" onClick={onCancel}>\n {localeText.cancelButtonLabel}\n </Button>\n )}\n {actions.includes('accept') && (\n <Button variant=\"text\" color=\"primary\" onClick={onAccept}>\n {localeText.okButtonLabel}\n </Button>\n )}\n </Stack>\n </Stack>\n </DialogActions>\n );\n};\n"],"names":["CustomPickersActionBar","props","actions","onAccept","onCancel","onClear","onSetToday","other","__rest","localeText","usePickersTranslations","length","_jsx","DialogActions","Object","assign","children","_jsxs","Stack","direction","justifyContent","includes","Button","variant","color","onClick","clearButtonLabel","todayButtonLabel","cancelButtonLabel","okButtonLabel"],"mappings":"~~4OAIa~~,MAAAA,EAA0BC,IACrC,MAAMC,QAAEA,EAAOC,SAAEA,EAAQC,SAAEA,EAAQC,QAAEA,EAAOC,WAAEA,GAAyBL,EAAVM,EAAKC,EAAKP,EAAjE,CAAA,UAAA,WAAA,WAAA,UAAA,eACAQ,EAAaC,IAEnB,OAAKR,aAAA,EAAAA,EAASS,QAGZC,EAACC,EAAaC,OAAAC,OAAA,CAAA,EAAKR,EACjB,CAAAS,SAAAC,EAACC,EAAK,CAACC,UAAU,MAAMC,eAAe,gBAAeJ,SAAA,CACnDC,EAACC,EAAM,CAAAC,UAAU,gBACdjB,EAAQmB,SAAS,UAChBT,EAACU,EAAO,CAAAC,QAAQ,OAAOC,MAAM,UAAUC,QAASpB,EAAOW,SACpDP,EAAWiB,mBAGfxB,EAAQmB,SAAS,UAChBT,EAACU,EAAO,CAAAC,QAAQ,OAAOC,MAAM,UAAUC,QAASnB,EAC7CU,SAAAP,EAAWkB,sBAIlBV,EAACC,EAAK,CAACC,UAAU,MACdH,SAAA,CAAAd,EAAQmB,SAAS,WAChBT,EAACU,EAAM,CAACC,QAAQ,OAAOC,MAAM,UAAUC,QAASrB,EAC7CY,SAAAP,EAAWmB,oBAGf1B,EAAQmB,SAAS,WAChBT,EAACU,EAAM,CAACC,QAAQ,OAAOC,MAAM,UAAUC,QAAStB,EAC7Ca,SAAAP,EAAWoB,yBAzBK,IA8BX"}
1	+ {"version":3,"file":"index.js","sources":["../../../src/components/customPickersActionBar/index.tsx"],"sourcesContent":["import { Stack, Button, DialogActions } from '@mui/material';\nimport { PickersActionBarProps, usePickersTranslations } from '@mui/x-date-pickers';\n\nexport const CustomPickersActionBar = (props: PickersActionBarProps) => {\n const { actions, onAccept, onCancel, onClear, onSetToday, ...other } = props;\n const localeText = usePickersTranslations();\n\n if (!actions?.length) return null;\n\n return (\n <DialogActions {...other}>\n <Stack direction=\"row\" justifyContent=\"space-between\">\n <Stack direction=\"row\">\n {actions.includes('clear') && (\n <Button variant=\"text\" color=\"primary\" onClick={onClear}>\n {localeText.clearButtonLabel}\n </Button>\n )}\n {actions.includes('today') && (\n <Button variant=\"text\" color=\"primary\" onClick={onSetToday}>\n {localeText.todayButtonLabel}\n </Button>\n )}\n </Stack>\n <Stack direction=\"row\">\n {actions.includes('cancel') && (\n <Button variant=\"text\" color=\"primary\" onClick={onCancel}>\n {localeText.cancelButtonLabel}\n </Button>\n )}\n {actions.includes('accept') && (\n <Button variant=\"text\" color=\"primary\" onClick={onAccept}>\n {localeText.okButtonLabel}\n </Button>\n )}\n </Stack>\n </Stack>\n </DialogActions>\n );\n};\n"],"names":["CustomPickersActionBar","props","actions","onAccept","onCancel","onClear","onSetToday","other","__rest","localeText","usePickersTranslations","length","_jsx","DialogActions","Object","assign","children","_jsxs","Stack","direction","justifyContent","includes","Button","variant","color","onClick","clearButtonLabel","todayButtonLabel","cancelButtonLabel","okButtonLabel"],"mappings":"mNAGa,MAAAA,EAA0BC,IACrC,MAAMC,QAAEA,EAAOC,SAAEA,EAAQC,SAAEA,EAAQC,QAAEA,EAAOC,WAAEA,GAAyBL,EAAVM,EAAKC,EAAKP,EAAjE,CAAA,UAAA,WAAA,WAAA,UAAA,eACAQ,EAAaC,IAEnB,OAAKR,aAAA,EAAAA,EAASS,QAGZC,EAACC,EAAaC,OAAAC,OAAA,CAAA,EAAKR,EACjB,CAAAS,SAAAC,EAACC,EAAK,CAACC,UAAU,MAAMC,eAAe,gBAAeJ,SAAA,CACnDC,EAACC,EAAM,CAAAC,UAAU,gBACdjB,EAAQmB,SAAS,UAChBT,EAACU,EAAO,CAAAC,QAAQ,OAAOC,MAAM,UAAUC,QAASpB,EAAOW,SACpDP,EAAWiB,mBAGfxB,EAAQmB,SAAS,UAChBT,EAACU,EAAO,CAAAC,QAAQ,OAAOC,MAAM,UAAUC,QAASnB,EAC7CU,SAAAP,EAAWkB,sBAIlBV,EAACC,EAAK,CAACC,UAAU,MACdH,SAAA,CAAAd,EAAQmB,SAAS,WAChBT,EAACU,EAAM,CAACC,QAAQ,OAAOC,MAAM,UAAUC,QAASrB,EAC7CY,SAAAP,EAAWmB,oBAGf1B,EAAQmB,SAAS,WAChBT,EAACU,EAAM,CAACC,QAAQ,OAAOC,MAAM,UAAUC,QAAStB,EAC7Ca,SAAAP,EAAWoB,yBAzBK,IA8BX"}

package/components/errorContent/ErrorContent.d.ts ADDED Viewed

@@ -0,0 +1,48 @@
+import { BoxProps, TypographyProps } from '@mui/material';
+import { ElementType, FC, ReactNode } from 'react';
+export interface ErrorContentProps extends BoxProps<ElementType> {
+    /**
+     * Error Status code, eg. 404 or 500
+     */
+    status?: ReactNode;
+    /**
+     * Short message describing the error
+     */
+    message?: ReactNode;
+    /**
+     * Longer description of the error
+     */
+    description?: ReactNode;
+    /**
+     * Actions that user can interact with
+     */
+    actions?: ReactNode;
+    /**
+     * Stacktrace of an error
+     */
+    stacktrace?: ReactNode;
+    /**
+     * Properties passed to status code
+     */
+    statusProps?: TypographyProps<ElementType>;
+    /**
+     * Properties passed to message
+     */
+    messageProps?: TypographyProps<ElementType>;
+    /**
+     * Properties passed to description
+     */
+    descriptionProps?: TypographyProps<ElementType>;
+    /**
+     * Properties passed to wrapper of actions
+     */
+    actionsProps?: BoxProps<ElementType>;
+    /**
+     * Properties passed to code stacktrace
+     */
+    stacktraceProps?: BoxProps<ElementType>;
+}
+/**
+ * Component that renders an information about error
+ */
+export declare const ErrorContent: FC<ErrorContentProps>;

package/components/errorContent/ErrorContent.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import{__rest as t}from"tslib";import{jsxs as e,jsx as s}from"react/jsx-runtime";import{Box as r,Typography as n}from"@mui/material";import{forwardRef as i}from"react";const a=i(((i,a)=>{var{sx:o,children:c,status:d,message:p,actions:l,description:m,stacktrace:x,statusProps:g,messageProps:h,descriptionProps:u,actionsProps:f,stacktraceProps:b}=i,j=t(i,["sx","children","status","message","actions","description","stacktrace","statusProps","messageProps","descriptionProps","actionsProps","stacktraceProps"]);const P=null!=f?f:{},{sx:O}=P,y=t(P,["sx"]),C=null!=b?b:{},{sx:k}=C,v=t(C,["sx"]);return e(r,Object.assign({sx:Object.assign({display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:{xs:2,md:4},textAlign:"center",margin:"0 auto",width:"600px",maxWidth:"100%",p:2},o),ref:a},j,{children:[d&&s(n,Object.assign({component:"h1",variant:"display","data-testid":"ErrorContent.status"},g,{children:d})),p&&s(n,Object.assign({component:"h2",variant:"h3","data-testid":"ErrorContent.message"},h,{children:p})),m&&s(n,Object.assign({"data-testid":"ErrorContent.description"},u,{children:m})),c,l&&s(r,Object.assign({sx:Object.assign({display:"flex",gap:1,flexDirection:{xs:"column",md:"row"},alignItems:{xs:"stretch",md:"center"},justifyContent:"center"},O),"data-testid":"ErrorContent.actions"},y,{children:l})),x&&s(r,Object.assign({component:"code",sx:Object.assign({display:"block",border:1,borderColor:"divider",whiteSpace:"pre",overflow:"auto",py:1,px:2,borderRadius:"8px",fontFamily:"monospace",fontSize:"11px",lineHeight:"18px",textAlign:"left",alignSelf:"stretch"},k),"data-testid":"ErrorContent.stacktrace"},v,{children:x}))]}))}));export{a as ErrorContent};
2	+ //# sourceMappingURL=ErrorContent.js.map

package/components/errorContent/ErrorContent.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"ErrorContent.js","sources":["../../../src/components/errorContent/ErrorContent.tsx"],"sourcesContent":["import { Box, BoxProps, Typography, TypographyProps } from '@mui/material';\nimport React, { ElementType, FC, forwardRef, ReactNode } from 'react';\n\nexport interface ErrorContentProps extends BoxProps<ElementType> {\n /**\n * Error Status code, eg. 404 or 500\n */\n status?: ReactNode;\n /**\n * Short message describing the error\n */\n message?: ReactNode;\n /**\n * Longer description of the error\n */\n description?: ReactNode;\n /**\n * Actions that user can interact with\n */\n actions?: ReactNode;\n /**\n * Stacktrace of an error\n */\n stacktrace?: ReactNode;\n /**\n * Properties passed to status code\n */\n statusProps?: TypographyProps<ElementType>;\n /**\n * Properties passed to message\n */\n messageProps?: TypographyProps<ElementType>;\n /**\n * Properties passed to description\n */\n descriptionProps?: TypographyProps<ElementType>;\n /**\n * Properties passed to wrapper of actions\n */\n actionsProps?: BoxProps<ElementType>;\n /**\n * Properties passed to code stacktrace\n */\n stacktraceProps?: BoxProps<ElementType>;\n}\n\n/**\n * Component that renders an information about error\n */\nexport const ErrorContent: FC<ErrorContentProps> = forwardRef(\n (\n {\n sx,\n children,\n status,\n message,\n actions,\n description,\n stacktrace,\n statusProps,\n messageProps,\n descriptionProps,\n actionsProps,\n stacktraceProps,\n ...rest\n },\n ref,\n ) => {\n const { sx: actionsSx, ...restActions } = actionsProps ?? {};\n const { sx: stacktraceSx, ...restStacktrace } = stacktraceProps ?? {};\n\n return (\n <Box\n sx={{\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'center',\n justifyContent: 'center',\n gap: { xs: 2, md: 4 },\n textAlign: 'center',\n margin: '0 auto',\n width: '600px',\n maxWidth: '100%',\n p: 2,\n ...sx,\n }}\n ref={ref}\n {...rest}\n >\n {status && (\n <Typography component=\"h1\" variant=\"display\" data-testid=\"ErrorContent.status\" {...statusProps}>\n {status}\n </Typography>\n )}\n {message && (\n <Typography component=\"h2\" variant=\"h3\" data-testid=\"ErrorContent.message\" {...messageProps}>\n {message}\n </Typography>\n )}\n {description && (\n <Typography data-testid=\"ErrorContent.description\" {...descriptionProps}>\n {description}\n </Typography>\n )}\n {children}\n {actions && (\n <Box\n sx={{\n display: 'flex',\n gap: 1,\n flexDirection: { xs: 'column', md: 'row' },\n alignItems: { xs: 'stretch', md: 'center' },\n justifyContent: 'center',\n ...actionsSx,\n }}\n data-testid=\"ErrorContent.actions\"\n {...restActions}\n >\n {actions}\n </Box>\n )}\n {stacktrace && (\n <Box\n component=\"code\"\n sx={{\n display: 'block',\n border: 1,\n borderColor: 'divider',\n whiteSpace: 'pre',\n overflow: 'auto',\n py: 1,\n px: 2,\n borderRadius: '8px',\n fontFamily: 'monospace',\n fontSize: '11px',\n lineHeight: '18px',\n textAlign: 'left',\n alignSelf: 'stretch',\n ...stacktraceSx,\n }}\n data-testid=\"ErrorContent.stacktrace\"\n {...restStacktrace}\n >\n {stacktrace}\n </Box>\n )}\n </Box>\n );\n },\n);\n"],"names":["ErrorContent","forwardRef","_a","ref","sx","children","status","message","actions","description","stacktrace","statusProps","messageProps","descriptionProps","actionsProps","stacktraceProps","rest","__rest","_b","actionsSx","restActions","_c","stacktraceSx","restStacktrace","_jsxs","Box","Object","assign","display","flexDirection","alignItems","justifyContent","gap","xs","md","textAlign","margin","width","maxWidth","p","_jsx","Typography","component","variant","border","borderColor","whiteSpace","overflow","py","px","borderRadius","fontFamily","fontSize","lineHeight","alignSelf"],"mappings":"wKAiDa,MAAAA,EAAsCC,GACjD,CACEC,EAeAC,KAfA,IAAAC,GACEA,EAAEC,SACFA,EAAQC,OACRA,EAAMC,QACNA,EAAOC,QACPA,EAAOC,YACPA,EAAWC,WACXA,EAAUC,YACVA,EAAWC,aACXA,EAAYC,iBACZA,EAAgBC,aAChBA,EAAYC,gBACZA,GAAeb,EACZc,EAbLC,EAAAf,EAAA,CAAA,KAAA,WAAA,SAAA,UAAA,UAAA,cAAA,aAAA,cAAA,eAAA,mBAAA,eAAA,oBAiBA,MAAMgB,EAAoCJ,QAAAA,EAAgB,IAAlDV,GAAIe,GAAgDD,EAAlCE,EAApBH,EAAAC,EAAA,CAAA,OACAG,EAA0CN,QAAAA,EAAmB,IAA3DX,GAAIkB,GAAyDD,EAAxCE,EAAvBN,EAAAI,EAAA,CAAA,OAEN,OACEG,EAACC,EACCC,OAAAC,OAAA,CAAAvB,GACEsB,OAAAC,OAAA,CAAAC,QAAS,OACTC,cAAe,SACfC,WAAY,SACZC,eAAgB,SAChBC,IAAK,CAAEC,GAAI,EAAGC,GAAI,GAClBC,UAAW,SACXC,OAAQ,SACRC,MAAO,QACPC,SAAU,OACVC,EAAG,GACAnC,GAELD,IAAKA,GACDa,EAEH,CAAAX,SAAA,CAAAC,GACCkC,EAACC,EAAWf,OAAAC,OAAA,CAAAe,UAAU,KAAKC,QAAQ,UAAsB,cAAA,uBAA0BhC,EAChF,CAAAN,SAAAC,KAGJC,GACCiC,EAACC,EAAWf,OAAAC,OAAA,CAAAe,UAAU,KAAKC,QAAQ,KAAiB,cAAA,wBAA2B/B,EAC5E,CAAAP,SAAAE,KAGJE,GACC+B,EAACC,EAAuBf,OAAAC,OAAA,CAAA,cAAA,4BAA+Bd,EACpD,CAAAR,SAAAI,KAGJJ,EACAG,GACCgC,EAACf,EACCC,OAAAC,OAAA,CAAAvB,GACEsB,OAAAC,OAAA,CAAAC,QAAS,OACTI,IAAK,EACLH,cAAe,CAAEI,GAAI,SAAUC,GAAI,OACnCJ,WAAY,CAAEG,GAAI,UAAWC,GAAI,UACjCH,eAAgB,UACbZ,GAEO,cAAA,wBACRC,EAEH,CAAAf,SAAAG,KAGJE,GACC8B,EAACf,EACCC,OAAAC,OAAA,CAAAe,UAAU,OACVtC,GACEsB,OAAAC,OAAA,CAAAC,QAAS,QACTgB,OAAQ,EACRC,YAAa,UACbC,WAAY,MACZC,SAAU,OACVC,GAAI,EACJC,GAAI,EACJC,aAAc,MACdC,WAAY,YACZC,SAAU,OACVC,WAAY,OACZlB,UAAW,OACXmB,UAAW,WACRhC,GAEO,cAAA,2BACRC,EAEH,CAAAlB,SAAAK,QAGD"}