@skodaflow/web-library 7.16.1 → 8.0.1

package/cjs/components/carousel/Pagination.js

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

package/cjs/components/carousel/Pagination.js.map

@@ -0,0 +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, 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}\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<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          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          {[...new Array(carousel?.slides.length || 0)].map((_, idx) => (\n            <Box\n              key={idx}\n              className={\n                !carousel?.params?.loop && carousel?.isEnd && idx === (carousel?.slides.length || 0) - 1\n                  ? 'active'\n                  : (!carousel?.isEnd || carousel.params?.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.params?.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        {[...new Array(carousel?.slides.length || 0)].map((_, idx) => {\n          const active =\n            (!carousel?.params?.loop && carousel?.isEnd && idx === (carousel?.slides.length || 0) - 1) ||\n            ((!carousel?.isEnd || carousel.params?.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: 'auto', md: '56px' },\n                flexGrow: { xs: '1', md: '0' },\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.params?.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            // from 6px to 4px\n            height: '4px',\n            // keep 32px height\n            py: '14px',\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?.params?.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            // 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              maxWidth: 'none',\n              height: '4px',\n              border: 'none',\n              backgroundColor: 'onSurface.os500',\n              // hitbox target\n              '&:after': {\n                width: `${thumbSize}px`,\n              },\n              // match transition speed of carousel\n              ...(!carouselDragging && {\n                transition: `left ${carousel?.params?.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","params","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","__","_d","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","_e","carouselDragging","setCarouselDragging","handleDragStart","handleDragEnd","handleResize","thumbSize","wrapperEl","scrollWidth","size","ceil","SliderContainer","tabIndex","valueLabelDisplay","maxWidth","border","boxShadow","content"],"mappings":"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"}

package/cjs/components/carousel/Slide.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("tslib"),r=require("react/jsx-runtime"),i=require("react"),t=require("@mui/material"),s=require("../../node_modules/swiper/swiper-react.js");const a=i.forwardRef((i,a)=>{var{children:o,sx:l}=i,n=e.__rest(i,["children","sx"]);const{params:d}=s.useSwiper();return r.jsx(t.Box,Object.assign({component:s.SwiperSlide,ref:a},n,{sx:Object.assign({display:"block",width:"auto"===(null==d?void 0:d.slidesPerView)?"auto":"100%",height:(null==d?void 0:d.autoHeight)?"auto":"100%",position:"relative",zIndex:"50",transform:"translate3d(0px, 0, 0)",flexShrink:"0",transitionProperty:"fade"===(null==d?void 0:d.effect)?"opacity":"transform","& img":{display:"block",maxWidth:"100%"}},l),children:o}))});a.displayName="SwiperSlide",exports.CarouselSlide=a;
+//# sourceMappingURL=Slide.js.map

package/cjs/components/carousel/Slide.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slide.js","sources":["../../../../../src/components/carousel/Slide.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { Box, BoxProps } from '@mui/material';\nimport { SwiperSlide, SwiperSlideProps, useSwiper } from 'swiper/react';\n\nexport interface CarouselSlideProps\n  extends Omit<SwiperSlideProps, 'children'>,\n    Omit<BoxProps, keyof SwiperSlideProps | 'component'> {\n  children?: BoxProps['children'];\n}\n\n/**\n * One slide in the carousel\n */\nexport const CarouselSlide: React.FC<CarouselSlideProps> = forwardRef(({ children, sx, ...rest }, ref) => {\n  const { params: swiperOptions } = useSwiper();\n\n  return (\n    <Box\n      component={SwiperSlide}\n      ref={ref}\n      {...rest}\n      sx={{\n        display: 'block',\n        width: swiperOptions?.slidesPerView === 'auto' ? 'auto' : '100%',\n        height: swiperOptions?.autoHeight ? 'auto' : '100%',\n        position: 'relative',\n        zIndex: '50',\n        transform: 'translate3d(0px, 0, 0)',\n        flexShrink: '0',\n        transitionProperty: swiperOptions?.effect === 'fade' ? 'opacity' : 'transform',\n        '& img': {\n          display: 'block',\n          maxWidth: '100%',\n        },\n        ...sx,\n      }}\n    >\n      {children}\n    </Box>\n  );\n});\nCarouselSlide.displayName = 'SwiperSlide';\n"],"names":["CarouselSlide","forwardRef","_a","ref","children","sx","rest","__rest","params","swiperOptions","useSwiper","_jsx","Box","Object","assign","component","SwiperSlide","display","width","slidesPerView","height","autoHeight","position","zIndex","transform","flexShrink","transitionProperty","effect","maxWidth","displayName"],"mappings":"wKAaO,MAAMA,EAA8CC,EAAAA,WAAW,CAACC,EAA2BC,SAA3BC,SAAEA,EAAQC,GAAEA,GAAEH,EAAKI,EAAIC,EAAAA,OAAAL,EAAvB,mBACrE,MAAQM,OAAQC,GAAkBC,cAElC,OACEC,EAAAA,IAACC,EAAAA,IAAGC,OAAAC,OAAA,CACFC,UAAWC,EAAAA,YACXb,IAAKA,GACDG,GACJD,GAAEQ,OAAAC,OAAA,CACAG,QAAS,QACTC,MAAwC,UAAjCT,eAAAA,EAAeU,eAA2B,OAAS,OAC1DC,QAAQX,aAAa,EAAbA,EAAeY,YAAa,OAAS,OAC7CC,SAAU,WACVC,OAAQ,KACRC,UAAW,yBACXC,WAAY,IACZC,mBAA8C,UAA1BjB,aAAa,EAAbA,EAAekB,QAAoB,UAAY,YACnE,QAAS,CACPV,QAAS,QACTW,SAAU,SAETvB,GAAED,SAGNA,OAIPJ,EAAc6B,YAAc"}

package/cjs/components/carousel/hooks.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react"),l=require("../../node_modules/swiper/swiper-react.js");function t(l,t){const[,u]=e.useState({});e.useEffect(()=>{l&&(null!=t?t:["slideChange","afterInit","reachBeginning","reachEnd","autoplayStart","autoplayStop","lock","unlock"]).forEach(e=>{l.on(e,()=>{u({})})})},[l]),e.useLayoutEffect(()=>{u({})},[])}exports.useCarousel=function(e){const u=l.useSwiper();return t(u,e),u},exports.useCarouselInstance=function(l){const[u,n]=e.useState(null);return t(u,l),[u,n]},exports.useCarouselPeekEffect=function(l){const[t,u]=e.useState(null),n=e.useRef(null),[s,r]=e.useState(!1);return e.useEffect(()=>{var e,r,o,i,a,c,d;return"reset"===t?(null===(e=null==l?void 0:l.el)||void 0===e||e.classList.remove("peek-prev"),null===(r=null==l?void 0:l.el)||void 0===r||r.classList.remove("peek-next"),n.current=setTimeout(()=>{u(null)},+((null==l?void 0:l.el.getAttribute("data-peekspeed"))||150))):t?s||(null==l||l.slideReset(0),"prev"===t?(null==l||l.slidePrev(0),null==l||l.slideNext(0)):(null==l||l.slideNext(0),null==l||l.slidePrev(0)),null===(o=null==l?void 0:l.el)||void 0===o||o.classList.add("peeking"),null===(i=null==l?void 0:l.el)||void 0===i||i.classList.add(`peek-${t}`)):(null===(a=null==l?void 0:l.el)||void 0===a||a.classList.remove("peeking"),null===(c=null==l?void 0:l.el)||void 0===c||c.classList.remove("peek-prev"),null===(d=null==l?void 0:l.el)||void 0===d||d.classList.remove("peek-next")),()=>{n.current&&clearTimeout(n.current)}},[t]),e.useEffect(()=>{null==l||l.on("touchStart",()=>{u("reset"),r(!0)}),null==l||l.on("touchEnd",()=>{u("reset"),r(!1)})},[!!l]),[t,u]};
+"use strict";var e=require("react"),l=require("../../node_modules/swiper/swiper-react.js");function u(l,u){const[,t]=e.useState({});e.useEffect(()=>{l&&(null!=u?u:["slideChange","afterInit","reachBeginning","reachEnd","autoplayStart","autoplayStop","lock","unlock"]).forEach(e=>{l.on(e,()=>{t({})})})},[l]),e.useLayoutEffect(()=>{t({})},[])}exports.useCarousel=function(e){const t=l.useSwiper();return u(t,e),t},exports.useCarouselInstance=function(l){const[t,n]=e.useState(null);return u(t,l),[t,n]},exports.useCarouselPeekEffect=function(l){const[u,t]=e.useState(null),n=e.useRef(null),[s,o]=e.useState(!1);return e.useEffect(()=>{var e,o,r,i,a,d,c,v,p,f;return"reset"===u?(null===(e=null==l?void 0:l.el)||void 0===e||e.classList.remove("peek-prev"),null===(o=null==l?void 0:l.el)||void 0===o||o.classList.remove("peek-next"),n.current=setTimeout(()=>{t(null)},+(null!==(a=null===(i=null===(r=null==l?void 0:l.el)||void 0===r?void 0:r.dataset)||void 0===i?void 0:i.peekspeed)&&void 0!==a?a:150))):u?s||(null==l||l.slideReset(0),"prev"===u?(null==l||l.slidePrev(0),null==l||l.slideNext(0)):(null==l||l.slideNext(0),null==l||l.slidePrev(0)),null===(d=null==l?void 0:l.el)||void 0===d||d.classList.add("peeking"),null===(c=null==l?void 0:l.el)||void 0===c||c.classList.add(`peek-${u}`)):(null===(v=null==l?void 0:l.el)||void 0===v||v.classList.remove("peeking"),null===(p=null==l?void 0:l.el)||void 0===p||p.classList.remove("peek-prev"),null===(f=null==l?void 0:l.el)||void 0===f||f.classList.remove("peek-next")),()=>{n.current&&clearTimeout(n.current)}},[u]),e.useEffect(()=>{null==l||l.on("touchStart",()=>{t("reset"),o(!0)}),null==l||l.on("touchEnd",()=>{t("reset"),o(!1)})},[!!l]),[u,t]};
 //# sourceMappingURL=hooks.js.map

package/cjs/components/carousel/hooks.js.map

@@ -1 +1 @@
-{"version":3,"file":"hooks.js","sources":["../../../../../src/components/carousel/hooks.ts"],"sourcesContent":["import { useState, useEffect, useLayoutEffect, useRef } from 'react';\nimport type { Swiper as CarouselInstance } from 'swiper';\nimport { useSwiper } from 'swiper/react';\nimport { SwiperEvents } from 'swiper/types';\n\n/**\n * Hook to obtain and manage CarouselInstance\n * */\nexport function useCarouselInstance(events?: (keyof SwiperEvents)[]) {\n  const [carousel, setCarousel] = useState<CarouselInstance | null>(null);\n  useRefreshInstance(carousel, events);\n\n  return [carousel, setCarousel] as const;\n}\n\n/**\n * Hook to obtain CarouselInstance inside the Carousel component\n */\nexport function useCarousel(events?: (keyof SwiperEvents)[]) {\n  const carousel = useSwiper();\n  useRefreshInstance(carousel, events);\n\n  return carousel;\n}\n\n/**\n * Internal hook that forces re-renders on events like slideChange, so the carousel.realIndex is correct\n * https://github.com/nolimits4web/swiper/issues/5577\n */\nfunction useRefreshInstance(carousel: CarouselInstance, events?: (keyof SwiperEvents)[]) {\n  // force re-render\n  const [, setRerender] = useState({});\n  useEffect(() => {\n    if (carousel) {\n      // subscribe to carousel events to trigger re-render\n      (\n        events ?? [\n          'slideChange',\n          'afterInit',\n          'reachBeginning',\n          'reachEnd',\n          'autoplayStart',\n          'autoplayStop',\n          'lock',\n          'unlock',\n        ]\n      ).forEach((evt: keyof SwiperEvents) => {\n        carousel.on(evt, () => {\n          setRerender({});\n        });\n      });\n    }\n  }, [carousel]);\n  // once everything is rendered, make sure to re-render to have proper data (initialization)\n  useLayoutEffect(() => {\n    setRerender({});\n  }, []);\n}\n\n/**\n * Manage peek effect in the Carousel by adding classes to the Carousel instance\n */\nexport function useCarouselPeekEffect(carousel: CarouselInstance) {\n  const [peek, setPeek] = useState<'prev' | 'next' | 'reset' | null>(null);\n  const peekTimeout = useRef<NodeJS.Timeout | null>(null);\n  const [disabled, setDisabled] = useState<boolean>(false);\n\n  useEffect(() => {\n    if (peek === 'reset') {\n      carousel?.el?.classList.remove('peek-prev');\n      carousel?.el?.classList.remove('peek-next');\n      peekTimeout.current = setTimeout(\n        () => {\n          setPeek(null);\n        },\n        +(carousel?.el.getAttribute('data-peekspeed') || 150),\n      ); // matches transitionDuration in the Carousel\n    } else if (peek) {\n      if (!disabled) {\n        // make sure prev/next slide is visible (loop)\n        carousel?.slideReset(0);\n        if (peek === 'prev') {\n          carousel?.slidePrev(0);\n          carousel?.slideNext(0);\n        } else {\n          carousel?.slideNext(0);\n          carousel?.slidePrev(0);\n        }\n        carousel?.el?.classList.add('peeking');\n        carousel?.el?.classList.add(`peek-${peek}`);\n      }\n    } else {\n      carousel?.el?.classList.remove('peeking');\n      carousel?.el?.classList.remove('peek-prev');\n      carousel?.el?.classList.remove('peek-next');\n    }\n\n    return () => {\n      if (peekTimeout.current) {\n        clearTimeout(peekTimeout.current);\n      }\n    };\n  }, [peek]);\n\n  /**\n   * Watch carousel instance\n   */\n  useEffect(() => {\n    // once carousel is being dragged, reset and disable peek effect\n    carousel?.on('touchStart', () => {\n      setPeek('reset');\n      setDisabled(true);\n    });\n    carousel?.on('touchEnd', () => {\n      setPeek('reset');\n      setDisabled(false);\n    });\n  }, [!!carousel]);\n\n  return [peek, setPeek] as const;\n}\n"],"names":["useRefreshInstance","carousel","events","setRerender","useState","useEffect","forEach","evt","on","useLayoutEffect","useSwiper","setCarousel","peek","setPeek","peekTimeout","useRef","disabled","setDisabled","_a","el","classList","remove","_b","current","setTimeout","getAttribute","slideReset","slidePrev","slideNext","_c","add","_d","_e","_f","_g","clearTimeout"],"mappings":"2FA6BA,SAASA,EAAmBC,EAA4BC,GAEtD,OAASC,GAAeC,EAAAA,SAAS,IACjCC,EAAAA,UAAU,KACJJ,IAGAC,QAAAA,EAAU,CACR,cACA,YACA,iBACA,WACA,gBACA,eACA,OACA,WAEFI,QAASC,IACTN,EAASO,GAAGD,EAAK,KACfJ,EAAY,CAAA,QAIjB,CAACF,IAEJQ,EAAAA,gBAAgB,KACdN,EAAY,CAAA,IACX,GACL,qBAvCM,SAAsBD,GAC1B,MAAMD,EAAWS,EAAAA,YAGjB,OAFAV,EAAmBC,EAAUC,GAEtBD,CACT,8BAfM,SAA8BC,GAClC,MAAOD,EAAUU,GAAeP,EAAAA,SAAkC,MAGlE,OAFAJ,EAAmBC,EAAUC,GAEtB,CAACD,EAAUU,EACpB,gCAiDM,SAAgCV,GACpC,MAAOW,EAAMC,GAAWT,EAAAA,SAA2C,MAC7DU,EAAcC,EAAAA,OAA8B,OAC3CC,EAAUC,GAAeb,EAAAA,UAAkB,GAsDlD,OApDAC,EAAAA,UAAU,uBA8BR,MA7Ba,UAATO,GACU,QAAZM,EAAAjB,aAAQ,EAARA,EAAUkB,UAAE,IAAAD,GAAAA,EAAEE,UAAUC,OAAO,aACnB,QAAZC,EAAArB,aAAQ,EAARA,EAAUkB,UAAE,IAAAG,GAAAA,EAAEF,UAAUC,OAAO,aAC/BP,EAAYS,QAAUC,WACpB,KACEX,EAAQ,UAERZ,aAAQ,EAARA,EAAUkB,GAAGM,aAAa,oBAAqB,OAE1Cb,EACJI,IAEHf,SAAAA,EAAUyB,WAAW,GACR,SAATd,GACFX,SAAAA,EAAU0B,UAAU,GACpB1B,SAAAA,EAAU2B,UAAU,KAEpB3B,SAAAA,EAAU2B,UAAU,GACpB3B,SAAAA,EAAU0B,UAAU,IAEV,QAAZE,EAAA5B,aAAQ,EAARA,EAAUkB,UAAE,IAAAU,GAAAA,EAAET,UAAUU,IAAI,WAChB,QAAZC,EAAA9B,aAAQ,EAARA,EAAUkB,UAAE,IAAAY,GAAAA,EAAEX,UAAUU,IAAI,QAAQlB,OAG1B,QAAZoB,EAAA/B,aAAQ,EAARA,EAAUkB,UAAE,IAAAa,GAAAA,EAAEZ,UAAUC,OAAO,WACnB,QAAZY,EAAAhC,aAAQ,EAARA,EAAUkB,UAAE,IAAAc,GAAAA,EAAEb,UAAUC,OAAO,aACnB,QAAZa,EAAAjC,aAAQ,EAARA,EAAUkB,UAAE,IAAAe,GAAAA,EAAEd,UAAUC,OAAO,cAG1B,KACDP,EAAYS,SACdY,aAAarB,EAAYS,WAG5B,CAACX,IAKJP,EAAAA,UAAU,KAERJ,SAAAA,EAAUO,GAAG,aAAc,KACzBK,EAAQ,SACRI,GAAY,KAEdhB,SAAAA,EAAUO,GAAG,WAAY,KACvBK,EAAQ,SACRI,GAAY,MAEb,GAAGhB,IAEC,CAACW,EAAMC,EAChB"}
+{"version":3,"file":"hooks.js","sources":["../../../../../src/components/carousel/hooks.ts"],"sourcesContent":["import { useState, useEffect, useLayoutEffect, useRef } from 'react';\nimport type { Swiper as CarouselInstance } from 'swiper';\nimport { useSwiper } from 'swiper/react';\nimport { SwiperEvents } from 'swiper/types';\n\n/**\n * Hook to obtain and manage CarouselInstance\n * */\nexport function useCarouselInstance(events?: (keyof SwiperEvents)[]) {\n  const [carousel, setCarousel] = useState<CarouselInstance | null>(null);\n  useRefreshInstance(carousel, events);\n\n  return [carousel, setCarousel] as const;\n}\n\n/**\n * Hook to obtain CarouselInstance inside the Carousel component\n */\nexport function useCarousel(events?: (keyof SwiperEvents)[]) {\n  const carousel = useSwiper();\n  useRefreshInstance(carousel, events);\n\n  return carousel;\n}\n\n/**\n * Internal hook that forces re-renders on events like slideChange, so the carousel.realIndex is correct\n * https://github.com/nolimits4web/swiper/issues/5577\n */\nfunction useRefreshInstance(carousel: CarouselInstance, events?: (keyof SwiperEvents)[]) {\n  // force re-render\n  const [, setRerender] = useState({});\n  useEffect(() => {\n    if (carousel) {\n      // subscribe to carousel events to trigger re-render\n      (\n        events ?? [\n          'slideChange',\n          'afterInit',\n          'reachBeginning',\n          'reachEnd',\n          'autoplayStart',\n          'autoplayStop',\n          'lock',\n          'unlock',\n        ]\n      ).forEach((evt: keyof SwiperEvents) => {\n        carousel.on(evt, () => {\n          setRerender({});\n        });\n      });\n    }\n  }, [carousel]);\n  // once everything is rendered, make sure to re-render to have proper data (initialization)\n  useLayoutEffect(() => {\n    setRerender({});\n  }, []);\n}\n\n/**\n * Manage peek effect in the Carousel by adding classes to the Carousel instance\n */\nexport function useCarouselPeekEffect(carousel: CarouselInstance) {\n  const [peek, setPeek] = useState<'prev' | 'next' | 'reset' | null>(null);\n  const peekTimeout = useRef<NodeJS.Timeout | null>(null);\n  const [disabled, setDisabled] = useState<boolean>(false);\n\n  useEffect(() => {\n    if (peek === 'reset') {\n      carousel?.el?.classList.remove('peek-prev');\n      carousel?.el?.classList.remove('peek-next');\n      peekTimeout.current = setTimeout(\n        () => {\n          setPeek(null);\n        },\n        +(carousel?.el?.dataset?.peekspeed ?? 150),\n      ); // matches transitionDuration in the Carousel\n    } else if (peek) {\n      if (!disabled) {\n        // make sure prev/next slide is visible (loop)\n        carousel?.slideReset(0);\n        if (peek === 'prev') {\n          carousel?.slidePrev(0);\n          carousel?.slideNext(0);\n        } else {\n          carousel?.slideNext(0);\n          carousel?.slidePrev(0);\n        }\n        carousel?.el?.classList.add('peeking');\n        carousel?.el?.classList.add(`peek-${peek}`);\n      }\n    } else {\n      carousel?.el?.classList.remove('peeking');\n      carousel?.el?.classList.remove('peek-prev');\n      carousel?.el?.classList.remove('peek-next');\n    }\n\n    return () => {\n      if (peekTimeout.current) {\n        clearTimeout(peekTimeout.current);\n      }\n    };\n  }, [peek]);\n\n  /**\n   * Watch carousel instance\n   */\n  useEffect(() => {\n    // once carousel is being dragged, reset and disable peek effect\n    carousel?.on('touchStart', () => {\n      setPeek('reset');\n      setDisabled(true);\n    });\n    carousel?.on('touchEnd', () => {\n      setPeek('reset');\n      setDisabled(false);\n    });\n  }, [!!carousel]);\n\n  return [peek, setPeek] as const;\n}\n"],"names":["useRefreshInstance","carousel","events","setRerender","useState","useEffect","forEach","evt","on","useLayoutEffect","useSwiper","setCarousel","peek","setPeek","peekTimeout","useRef","disabled","setDisabled","_a","el","classList","remove","_b","current","setTimeout","_e","_c","dataset","_d","peekspeed","slideReset","slidePrev","slideNext","_f","add","_g","_h","_j","_k","clearTimeout"],"mappings":"2FA6BA,SAASA,EAAmBC,EAA4BC,GAEtD,OAASC,GAAeC,EAAAA,SAAS,IACjCC,EAAAA,UAAU,KACJJ,IAGAC,QAAAA,EAAU,CACR,cACA,YACA,iBACA,WACA,gBACA,eACA,OACA,WAEFI,QAASC,IACTN,EAASO,GAAGD,EAAK,KACfJ,EAAY,CAAA,QAIjB,CAACF,IAEJQ,EAAAA,gBAAgB,KACdN,EAAY,CAAA,IACX,GACL,qBAvCM,SAAsBD,GAC1B,MAAMD,EAAWS,EAAAA,YAGjB,OAFAV,EAAmBC,EAAUC,GAEtBD,CACT,8BAfM,SAA8BC,GAClC,MAAOD,EAAUU,GAAeP,EAAAA,SAAkC,MAGlE,OAFAJ,EAAmBC,EAAUC,GAEtB,CAACD,EAAUU,EACpB,gCAiDM,SAAgCV,GACpC,MAAOW,EAAMC,GAAWT,EAAAA,SAA2C,MAC7DU,EAAcC,EAAAA,OAA8B,OAC3CC,EAAUC,GAAeb,EAAAA,UAAkB,GAsDlD,OApDAC,EAAAA,UAAU,6BA8BR,MA7Ba,UAATO,GACU,QAAZM,EAAAjB,aAAQ,EAARA,EAAUkB,UAAE,IAAAD,GAAAA,EAAEE,UAAUC,OAAO,aACnB,QAAZC,EAAArB,aAAQ,EAARA,EAAUkB,UAAE,IAAAG,GAAAA,EAAEF,UAAUC,OAAO,aAC/BP,EAAYS,QAAUC,WACpB,KACEX,EAAQ,SAEwB,QAAhCY,EAAqB,UAAT,QAAZC,EAAAzB,aAAQ,EAARA,EAAUkB,UAAE,IAAAO,OAAA,EAAAA,EAAEC,eAAO,IAAAC,OAAA,EAAAA,EAAEC,iBAAS,IAAAJ,EAAAA,EAAI,OAE/Bb,EACJI,IAEHf,SAAAA,EAAU6B,WAAW,GACR,SAATlB,GACFX,SAAAA,EAAU8B,UAAU,GACpB9B,SAAAA,EAAU+B,UAAU,KAEpB/B,SAAAA,EAAU+B,UAAU,GACpB/B,SAAAA,EAAU8B,UAAU,IAEV,QAAZE,EAAAhC,aAAQ,EAARA,EAAUkB,UAAE,IAAAc,GAAAA,EAAEb,UAAUc,IAAI,WAChB,QAAZC,EAAAlC,aAAQ,EAARA,EAAUkB,UAAE,IAAAgB,GAAAA,EAAEf,UAAUc,IAAI,QAAQtB,OAG1B,QAAZwB,EAAAnC,aAAQ,EAARA,EAAUkB,UAAE,IAAAiB,GAAAA,EAAEhB,UAAUC,OAAO,WACnB,QAAZgB,EAAApC,aAAQ,EAARA,EAAUkB,UAAE,IAAAkB,GAAAA,EAAEjB,UAAUC,OAAO,aACnB,QAAZiB,EAAArC,aAAQ,EAARA,EAAUkB,UAAE,IAAAmB,GAAAA,EAAElB,UAAUC,OAAO,cAG1B,KACDP,EAAYS,SACdgB,aAAazB,EAAYS,WAG5B,CAACX,IAKJP,EAAAA,UAAU,KAERJ,SAAAA,EAAUO,GAAG,aAAc,KACzBK,EAAQ,SACRI,GAAY,KAEdhB,SAAAA,EAAUO,GAAG,WAAY,KACvBK,EAAQ,SACRI,GAAY,MAEb,GAAGhB,IAEC,CAACW,EAAMC,EAChB"}

package/cjs/components/carousel/index.d.ts

@@ -1,7 +1,7 @@
-export * from './carousel';
-export * from './slide';
-export * from './navigation';
-export * from './pagination';
+export * from './Carousel';
+export * from './Slide';
+export * from './Navigation';
+export * from './Pagination';
+export * from './Autoplay';
 export * from './hooks';
-export * from './autoplay';
 export type { Swiper as CarouselInstance } from 'swiper';

package/cjs/components/flag/Flag.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { FlowFlagProps } from './FlowFlag';
+import * as Flags from 'country-flag-icons/react/3x2';
+export interface FlagProps extends Omit<FlowFlagProps, 'source'> {
+    /**
+     * Defines which flag to use.
+     */
+    flag: keyof typeof Flags;
+}
+/**
+ * Renders country flag icon
+ * ! usage of component is not recommended as it increases bundle size
+ */
+export declare const Flag: React.FC<FlagProps>;

package/cjs/components/flag/Flag.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("tslib"),r=require("react/jsx-runtime"),t=require("react"),a=require("./FlowFlag.js"),c=require("country-flag-icons/react/3x2"),i=require("country-flag-icons/react/1x1");function n(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach(function(t){if("default"!==t){var a=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,a.get?a:{enumerable:!0,get:function(){return e[t]}})}}),r.default=e,Object.freeze(r)}var u=n(c),l=n(i);const s=t.forwardRef((t,c)=>{var{flag:i,variant:n="circle"}=t,s=e.__rest(t,["flag","variant"]);return r.jsx(a.FlowFlag,Object.assign({source:(["circle","square"].includes(n)?l:u)[i],variant:n,ref:c},s))});exports.Flag=s;
+//# sourceMappingURL=Flag.js.map

package/cjs/components/flag/Flag.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flag.js","sources":["../../../../../src/components/flag/Flag.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { FlowFlag, FlowFlagProps } from './FlowFlag';\nimport * as Flags from 'country-flag-icons/react/3x2';\nimport * as SquareFlags from 'country-flag-icons/react/1x1';\n\nexport interface FlagProps extends Omit<FlowFlagProps, 'source'> {\n  /**\n   * Defines which flag to use.\n   */\n  flag: keyof typeof Flags;\n}\n\n/**\n * Renders country flag icon\n * ! usage of component is not recommended as it increases bundle size\n */\nexport const Flag: React.FC<FlagProps> = forwardRef(({ flag, variant = 'circle', ...rest }, ref) => {\n  return (\n    <FlowFlag\n      source={(['circle', 'square'].includes(variant) ? SquareFlags : Flags)[flag]}\n      variant={variant}\n      ref={ref}\n      {...rest}\n    />\n  );\n});\n"],"names":["Flag","forwardRef","_a","ref","flag","variant","rest","__rest","_jsx","FlowFlag","source","includes","SquareFlags","Flags"],"mappings":"ofAgBO,MAAMA,EAA4BC,EAAAA,WAAW,CAACC,EAAuCC,SAAvCC,KAAEA,EAAIC,QAAEA,EAAU,YAAaC,EAAIC,EAAAA,OAAAL,EAAnC,CAAA,OAAA,YACnD,OACEM,EAAAA,IAACC,0BACCC,QAAS,CAAC,SAAU,UAAUC,SAASN,GAAWO,EAAcC,GAAOT,GACvEC,QAASA,EACTF,IAAKA,GACDG"}

package/cjs/components/flag/FlowFlag.d.ts

@@ -0,0 +1,31 @@
+import React, { ElementType } from 'react';
+import { BoxProps } from '@mui/material';
+export interface FlowFlagProps extends Omit<BoxProps, 'component'> {
+    /**
+     * SVG of Flag, e.g. import CZFLag from 'country-flag-icons/react/3x2/CZ';
+     */
+    source?: ElementType;
+    /**
+     * The size of the flag
+     * @default small
+     */
+    size?: 'small' | 'medium' | 'large';
+    /**
+     * The width of the flag
+     */
+    width?: number;
+    /**
+     * Variants
+     * @default circle
+     */
+    variant?: '3x2' | 'circle' | 'square';
+    /**
+     * Disabled state
+     * @default false
+     */
+    disabled?: boolean;
+}
+/**
+ * Renders country flag icon
+ */
+export declare const FlowFlag: React.FC<FlowFlagProps>;

package/cjs/components/flag/FlowFlag.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("tslib"),r=require("react/jsx-runtime"),s=require("react"),i=require("@mui/material");const t=s.forwardRef((t,a)=>{var{source:c,sx:l,width:n,size:u="small",variant:o="circle",disabled:d=!1}=t,b=e.__rest(t,["source","sx","width","size","variant","disabled"]);const x=s.useMemo(()=>{switch(u){case"small":return 24;case"medium":return 44;case"large":return 56;default:return null!=n?n:24}},[u,n]);return r.jsx(i.Box,Object.assign({"data-testid":"Flag",component:null!=c?c:"div",sx:Object.assign(Object.assign(Object.assign({width:`${x}px`,flexShrink:"0",border:1,borderColor:"onSurface.os500"},["circle","square"].includes(o)&&Object.assign({height:`${x}px`},"circle"===o?{borderRadius:`${x}px`}:{})),d&&{userSelect:"none",borderColor:"disabled.tertiary",opacity:"0.65"}),l),ref:a},b))});exports.FlowFlag=t;
+//# sourceMappingURL=FlowFlag.js.map

package/cjs/components/flag/FlowFlag.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FlowFlag.js","sources":["../../../../../src/components/flag/FlowFlag.tsx"],"sourcesContent":["import React, { ElementType, forwardRef, useMemo } from 'react';\nimport { Box, BoxProps } from '@mui/material';\n\nexport interface FlowFlagProps extends Omit<BoxProps, 'component'> {\n  /**\n   * SVG of Flag, e.g. import CZFLag from 'country-flag-icons/react/3x2/CZ';\n   */\n  source?: ElementType;\n  /**\n   * The size of the flag\n   * @default small\n   */\n  size?: 'small' | 'medium' | 'large';\n  /**\n   * The width of the flag\n   */\n  width?: number;\n  /**\n   * Variants\n   * @default circle\n   */\n  variant?: '3x2' | 'circle' | 'square';\n  /**\n   * Disabled state\n   * @default false\n   */\n  disabled?: boolean;\n}\n\n/**\n * Renders country flag icon\n */\nexport const FlowFlag: React.FC<FlowFlagProps> = forwardRef(\n  ({ source, sx, width: widthProp, size = 'small', variant = 'circle', disabled = false, ...rest }, ref) => {\n    // obtain width of the flag from size and width property\n    const width = useMemo(() => {\n      switch (size) {\n        case 'small':\n          return 24;\n        case 'medium':\n          return 44;\n        case 'large':\n          return 56;\n        default:\n          return widthProp ?? 24;\n      }\n    }, [size, widthProp]);\n\n    return (\n      <Box\n        data-testid=\"Flag\"\n        component={source ?? 'div'}\n        sx={{\n          width: `${width}px`,\n          flexShrink: '0',\n          // outline to improve accessibility\n          border: 1,\n          borderColor: 'onSurface.os500',\n          // 1:1 ratio\n          ...(['circle', 'square'].includes(variant) && {\n            height: `${width}px`,\n            ...(variant === 'circle' ? { borderRadius: `${width}px` } : {}),\n          }),\n          // disabled state\n          ...(disabled && {\n            userSelect: 'none',\n            borderColor: 'disabled.tertiary',\n            opacity: '0.65',\n          }),\n          ...sx,\n        }}\n        ref={ref}\n        {...rest}\n      />\n    );\n  },\n);\n"],"names":["FlowFlag","forwardRef","_a","ref","source","sx","width","widthProp","size","variant","disabled","rest","__rest","useMemo","_jsx","Box","Object","assign","component","flexShrink","border","borderColor","includes","height","borderRadius","userSelect","opacity"],"mappings":"iHAgCO,MAAMA,EAAoCC,EAAAA,WAC/C,CAACC,EAAiGC,SAAjGC,OAAEA,EAAMC,GAAEA,EAAIC,MAAOC,EAASC,KAAEA,EAAO,QAAOC,QAAEA,EAAU,SAAQC,SAAEA,GAAW,KAAUC,EAAIC,EAAAA,OAAAV,EAA7F,CAAA,SAAA,KAAA,QAAA,OAAA,UAAA,aAEC,MAAMI,EAAQO,EAAAA,QAAQ,KACpB,OAAQL,GACN,IAAK,QACH,OAAO,GACT,IAAK,SACH,OAAO,GACT,IAAK,QACH,OAAO,GACT,QACE,OAAOD,QAAAA,EAAa,KAEvB,CAACC,EAAMD,IAEV,OACEO,EAAAA,IAACC,EAAAA,IAAGC,OAAAC,OAAA,CAAA,cACU,OACZC,UAAWd,QAAAA,EAAU,MACrBC,GAAEW,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,CACAX,MAAO,GAAGA,MACVa,WAAY,IAEZC,OAAQ,EACRC,YAAa,mBAET,CAAC,SAAU,UAAUC,SAASb,IAAQO,OAAAC,OAAA,CACxCM,OAAQ,GAAGjB,OACK,WAAZG,EAAuB,CAAEe,aAAc,GAAGlB,OAAc,CAAA,IAG1DI,GAAY,CACde,WAAY,OACZJ,YAAa,oBACbK,QAAS,SAERrB,GAELF,IAAKA,GACDQ"}

package/cjs/components/flag/index.d.ts

@@ -1 +1,2 @@
-export * from './flag';
+export * from './Flag';
+export * from './FlowFlag';

package/cjs/components/footer/Footer.d.ts

@@ -1,30 +1,10 @@
-import { ElementType, FC, ReactNode } from 'react';
+import { ElementType, FC } from 'react';
 import { BoxProps, ContainerProps } from '@mui/material';
 export interface FooterProps extends BoxProps<ElementType> {
     /**
      * Props applied to container
      */
     containerProps?: ContainerProps<ElementType>;
-    /**
-     * @deprecated
-     */
-    primaryItems?: ReactNode;
-    /**
-     * @deprecated
-     */
-    secondaryItems?: ReactNode;
-    /**
-     * @deprecated
-     */
-    copyRight?: ReactNode;
-    /**
-     * @deprecated
-     */
-    location?: ReactNode;
-    /**
-     * @deprecated
-     */
-    socialButtons?: ReactNode;
 }
 /**
  * Component to render content at the bottom of each page

package/cjs/components/footer/Footer.js

@@ -1,2 +1,2 @@
-"use strict";var o=require("tslib"),r=require("react/jsx-runtime"),t=require("react"),e=require("@mui/material"),i=require("./FooterSectionContact.js"),n=require("./FooterSectionLinks.js");const c=t.forwardRef((t,c)=>{var{sx:s,children:a,containerProps:l,primaryItems:u,secondaryItems:d,copyRight:m,location:p,socialButtons:x}=t,h=o.__rest(t,["sx","children","containerProps","primaryItems","secondaryItems","copyRight","location","socialButtons"]);return r.jsx(e.Box,Object.assign({component:"footer",sx:Object.assign({py:1,"&:has(.FlowSectionContact-root)":{py:{xs:6,lg:10}},backgroundColor:"onSurface.os800",color:"common.white",".MuiDivider-root":{borderColor:"onSurface.os700",my:4,"& + .FooterSectionMenu-root":{marginTop:-4,"& > .MuiAccordion-root:first-of-type":{borderTop:"0"}},"& + .FooterAccordion-variantCompact":{mt:-1.5,"& + .MuiDivider-root":{mt:2.5}}}},s),ref:c,"data-testid":"Footer"},h,{children:r.jsxs(e.Container,Object.assign({maxWidth:"xl"},l,{children:[(x||u)&&r.jsx(i.FooterSectionContact,{socialSlot:x,children:u}),(m||p)&&r.jsx(n.FooterSectionLinks,{textSlot:m,buttonSlot:p,children:d}),a]}))}))});exports.Footer=c;
+"use strict";var o=require("tslib"),r=require("react/jsx-runtime"),t=require("react"),e=require("@mui/material");const i=t.forwardRef((t,i)=>{var{sx:n,children:s,containerProps:c,primaryItems:a,secondaryItems:m,copyRight:d,location:u,socialButtons:l}=t,p=o.__rest(t,["sx","children","containerProps","primaryItems","secondaryItems","copyRight","location","socialButtons"]);return r.jsx(e.Box,Object.assign({component:"footer",sx:Object.assign({py:1,"&:has(.FlowSectionContact-root)":{py:{xs:6,lg:10}},backgroundColor:"onSurface.os800",color:"common.white",".MuiDivider-root":{borderColor:"onSurface.os700",my:4,"& + .FooterSectionMenu-root":{marginTop:-4,"& > .MuiAccordion-root:first-of-type":{borderTop:"0"}},"& + .FooterAccordion-variantCompact":{mt:-1.5,"& + .MuiDivider-root":{mt:2.5}}}},n),ref:i,"data-testid":"Footer"},p,{children:r.jsx(e.Container,Object.assign({maxWidth:"xl"},c,{children:s}))}))});exports.Footer=i;
 //# sourceMappingURL=Footer.js.map

package/cjs/components/footer/Footer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Footer.js","sources":["../../../../../src/components/footer/Footer.tsx"],"sourcesContent":["import React, { ElementType, FC, forwardRef, ReactNode } from 'react';\nimport { Box, BoxProps, Container, ContainerProps } from '@mui/material';\nimport { FooterSectionContact } from './FooterSectionContact';\nimport { FooterSectionLinks } from './FooterSectionLinks';\n\nexport interface FooterProps extends BoxProps<ElementType> {\n  /**\n   * Props applied to container\n   */\n  containerProps?: ContainerProps<ElementType>;\n  /**\n   * @deprecated\n   */\n  primaryItems?: ReactNode;\n  /**\n   * @deprecated\n   */\n  secondaryItems?: ReactNode;\n  /**\n   * @deprecated\n   */\n  copyRight?: ReactNode;\n  /**\n   * @deprecated\n   */\n  location?: ReactNode;\n  /**\n   * @deprecated\n   */\n  socialButtons?: ReactNode;\n}\n\n/**\n * Component to render content at the bottom of each page\n */\nexport const Footer: FC<FooterProps> = forwardRef(\n  (\n    { sx, children, containerProps, primaryItems, secondaryItems, copyRight, location, socialButtons, ...rest },\n    ref,\n  ) => {\n    return (\n      <Box\n        component=\"footer\"\n        sx={{\n          py: 1,\n          // complex footer has increased padding\n          '&:has(.FlowSectionContact-root)': {\n            py: { xs: 6, lg: 10 },\n          },\n          backgroundColor: 'onSurface.os800',\n          color: 'common.white',\n          // dividers inside\n          '.MuiDivider-root': {\n            borderColor: 'onSurface.os700',\n            my: 4,\n            // connect divider with FooterSectionMenu\n            '& + .FooterSectionMenu-root': {\n              marginTop: -4,\n              // connect divider and accordion borders\n              '& > .MuiAccordion-root:first-of-type': {\n                borderTop: '0',\n              },\n            },\n            // reduce divider space for the next compact accordion section\n            '& + .FooterAccordion-variantCompact': {\n              mt: -1.5,\n              // also reduce the space of divider after the accordion\n              '& + .MuiDivider-root': {\n                mt: 4 - 1.5,\n              },\n            },\n          },\n          ...sx,\n        }}\n        ref={ref}\n        data-testid=\"Footer\"\n        {...rest}\n      >\n        <Container maxWidth=\"xl\" {...containerProps}>\n          {(socialButtons || primaryItems) && (\n            <FooterSectionContact socialSlot={socialButtons}>{primaryItems}</FooterSectionContact>\n          )}\n          {(copyRight || location) && (\n            <FooterSectionLinks textSlot={copyRight} buttonSlot={location}>\n              {secondaryItems}\n            </FooterSectionLinks>\n          )}\n          {children}\n        </Container>\n      </Box>\n    );\n  },\n);\n"],"names":["Footer","forwardRef","_a","ref","sx","children","containerProps","primaryItems","secondaryItems","copyRight","location","socialButtons","rest","__rest","_jsx","Box","Object","assign","component","py","xs","lg","backgroundColor","color","borderColor","my","marginTop","borderTop","mt","_jsxs","Container","maxWidth","FooterSectionContact","socialSlot","FooterSectionLinks","textSlot","buttonSlot"],"mappings":"6LAmCO,MAAMA,EAA0BC,EAAAA,WACrC,CACEC,EACAC,SADAC,GAAEA,EAAEC,SAAEA,EAAQC,eAAEA,EAAcC,aAAEA,EAAYC,eAAEA,EAAcC,UAAEA,EAASC,SAAEA,EAAQC,cAAEA,GAAaT,EAAKU,EAAIC,EAAAA,OAAAX,EAAzG,2GAGA,OACEY,MAACC,EAAAA,IAAGC,OAAAC,OAAA,CACFC,UAAU,SACVd,GAAEY,OAAAC,OAAA,CACAE,GAAI,EAEJ,kCAAmC,CACjCA,GAAI,CAAEC,GAAI,EAAGC,GAAI,KAEnBC,gBAAiB,kBACjBC,MAAO,eAEP,mBAAoB,CAClBC,YAAa,kBACbC,GAAI,EAEJ,8BAA+B,CAC7BC,WAAW,EAEX,uCAAwC,CACtCC,UAAW,MAIf,sCAAuC,CACrCC,IAAI,IAEJ,uBAAwB,CACtBA,GAAI,QAIPxB,GAELD,IAAKA,EAAG,cACI,UACRS,EAAI,CAAAP,SAERwB,OAACC,EAAAA,UAASd,OAAAC,OAAA,CAACc,SAAS,MAASzB,EAAc,CAAAD,SAAA,EACvCM,GAAiBJ,IACjBO,EAAAA,IAACkB,wBAAqBC,WAAYtB,EAAaN,SAAGE,KAElDE,GAAaC,IACbI,EAAAA,IAACoB,qBAAkB,CAACC,SAAU1B,EAAW2B,WAAY1B,EAAQL,SAC1DG,IAGJH"}
+{"version":3,"file":"Footer.js","sources":["../../../../../src/components/footer/Footer.tsx"],"sourcesContent":["import React, { ElementType, FC, forwardRef } from 'react';\nimport { Box, BoxProps, Container, ContainerProps } from '@mui/material';\n\nexport interface FooterProps extends BoxProps<ElementType> {\n  /**\n   * Props applied to container\n   */\n  containerProps?: ContainerProps<ElementType>;\n}\n\n/**\n * Component to render content at the bottom of each page\n */\nexport const Footer: FC<FooterProps> = forwardRef(\n  (\n    { sx, children, containerProps, primaryItems, secondaryItems, copyRight, location, socialButtons, ...rest },\n    ref,\n  ) => {\n    return (\n      <Box\n        component=\"footer\"\n        sx={{\n          py: 1,\n          // complex footer has increased padding\n          '&:has(.FlowSectionContact-root)': {\n            py: { xs: 6, lg: 10 },\n          },\n          backgroundColor: 'onSurface.os800',\n          color: 'common.white',\n          // dividers inside\n          '.MuiDivider-root': {\n            borderColor: 'onSurface.os700',\n            my: 4,\n            // connect divider with FooterSectionMenu\n            '& + .FooterSectionMenu-root': {\n              marginTop: -4,\n              // connect divider and accordion borders\n              '& > .MuiAccordion-root:first-of-type': {\n                borderTop: '0',\n              },\n            },\n            // reduce divider space for the next compact accordion section\n            '& + .FooterAccordion-variantCompact': {\n              mt: -1.5,\n              // also reduce the space of divider after the accordion\n              '& + .MuiDivider-root': {\n                mt: 4 - 1.5,\n              },\n            },\n          },\n          ...sx,\n        }}\n        ref={ref}\n        data-testid=\"Footer\"\n        {...rest}\n      >\n        <Container maxWidth=\"xl\" {...containerProps}>\n          {children}\n        </Container>\n      </Box>\n    );\n  },\n);\n"],"names":["Footer","forwardRef","_a","ref","sx","children","containerProps","primaryItems","secondaryItems","copyRight","location","socialButtons","rest","__rest","_jsx","Box","Object","assign","component","py","xs","lg","backgroundColor","color","borderColor","my","marginTop","borderTop","mt","Container","maxWidth"],"mappings":"iHAaO,MAAMA,EAA0BC,EAAAA,WACrC,CACEC,EACAC,SADAC,GAAEA,EAAEC,SAAEA,EAAQC,eAAEA,EAAcC,aAAEA,EAAYC,eAAEA,EAAcC,UAAEA,EAASC,SAAEA,EAAQC,cAAEA,GAAaT,EAAKU,EAAIC,EAAAA,OAAAX,EAAzG,2GAGA,OACEY,MAACC,EAAAA,IAAGC,OAAAC,OAAA,CACFC,UAAU,SACVd,GAAEY,OAAAC,OAAA,CACAE,GAAI,EAEJ,kCAAmC,CACjCA,GAAI,CAAEC,GAAI,EAAGC,GAAI,KAEnBC,gBAAiB,kBACjBC,MAAO,eAEP,mBAAoB,CAClBC,YAAa,kBACbC,GAAI,EAEJ,8BAA+B,CAC7BC,WAAW,EAEX,uCAAwC,CACtCC,UAAW,MAIf,sCAAuC,CACrCC,IAAI,IAEJ,uBAAwB,CACtBA,GAAI,QAIPxB,GAELD,IAAKA,EAAG,cACI,UACRS,EAAI,CAAAP,SAERS,MAACe,EAAAA,UAASb,OAAAC,OAAA,CAACa,SAAS,MAASxB,YAC1BD"}

package/cjs/components/footer/FooterIconButton.d.ts

@@ -1,24 +1,8 @@
 import { ElementType, FC } from 'react';
 import { IconButtonProps } from '@mui/material';
 export interface FooterIconButtonProps extends IconButtonProps<ElementType> {
-    /**
-     * @deprecated provide icon directly as children (e.g. <FacebookIcon />)
-     */
-    icon?: 'facebook' | 'instagram' | 'twitter' | 'youtube' | 'linkedin' | 'heart' | 'settings' | string;
 }
 /**
  * Section for the main links
  */
 export declare const FooterIconButton: FC<FooterIconButtonProps>;
-export interface PredefinedFooterIconButtonProps extends Omit<FooterIconButtonProps, 'icon'> {
-}
-/** @deprecated use <FooterIconButton> with icon of your choosing instead */
-export declare const FacebookFooterIconButton: FC<FooterIconButtonProps>;
-/** @deprecated use <FooterIconButton> with icon of your choosing instead */
-export declare const InstagramFooterIconButton: FC<FooterIconButtonProps>;
-/** @deprecated use <FooterIconButton> with icon of your choosing instead */
-export declare const TwitterFooterIconButton: FC<FooterIconButtonProps>;
-/** @deprecated use <FooterIconButton> with icon of your choosing instead */
-export declare const YoutubeFooterIconButton: FC<FooterIconButtonProps>;
-/** @deprecated use <FooterIconButton> with icon of your choosing instead */
-export declare const LinkedinFooterIconButton: FC<FooterIconButtonProps>;

package/cjs/components/footer/FooterIconButton.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("tslib"),r=require("react/jsx-runtime"),o=require("react"),n=require("@mui/material"),t=require("../icon/stroke/FacebookIcon.js"),s=require("../icon/stroke/InstagramIcon.js"),c=require("../icon/stroke/XIcon.js"),i=require("../icon/stroke/YouTubeIcon.js"),a=require("../icon/stroke/LinkedInIcon.js"),u=require("../icon/stroke/SettingsIcon.js"),I=require("../icon/stroke/HeartIcon.js");const l=o.forwardRef((l,j)=>{var{children:b,icon:d}=l,k=e.__rest(l,["children","icon"]);const f=o.useMemo(()=>{switch(d){case"facebook":return t.FacebookIcon;case"instagram":return s.InstagramIcon;case"twitter":return c.XIcon;case"youtube":return i.YouTubeIcon;case"linkedin":return a.LinkedInIcon;case"settings":return u.SettingsIcon;case"heart":return I.HeartIcon;default:return}},[d]);return r.jsx(n.IconButton,Object.assign({size:"medium",color:"white",ref:j,"data-testid":"FooterIconButton"},k,{children:b||r.jsx(f,{})}))}),j=o.forwardRef((e,o)=>r.jsx(l,Object.assign({"aria-label":"Facebook link",ref:o},e,{children:r.jsx(t.FacebookIcon,{})}))),b=o.forwardRef((e,o)=>r.jsx(l,Object.assign({"aria-label":"Instagram link",ref:o},e,{children:r.jsx(s.InstagramIcon,{})}))),d=o.forwardRef((e,o)=>r.jsx(l,Object.assign({"aria-label":"Twitter link",ref:o},e,{children:r.jsx(c.XIcon,{})}))),k=o.forwardRef((e,o)=>r.jsx(l,Object.assign({"aria-label":"Youtube link",ref:o},e,{children:r.jsx(i.YouTubeIcon,{})}))),f=o.forwardRef((e,o)=>r.jsx(l,Object.assign({"aria-label":"Linkedin link",ref:o},e,{children:r.jsx(a.LinkedInIcon,{})})));exports.FacebookFooterIconButton=j,exports.FooterIconButton=l,exports.InstagramFooterIconButton=b,exports.LinkedinFooterIconButton=f,exports.TwitterFooterIconButton=d,exports.YoutubeFooterIconButton=k;
+"use strict";var e=require("tslib"),r=require("react/jsx-runtime"),t=require("react"),i=require("@mui/material");const o=t.forwardRef((t,o)=>{var{children:n}=t,c=e.__rest(t,["children"]);return r.jsx(i.IconButton,Object.assign({size:"medium",color:"white",ref:o,"data-testid":"FooterIconButton"},c,{children:n}))});exports.FooterIconButton=o;
 //# sourceMappingURL=FooterIconButton.js.map

package/cjs/components/footer/FooterIconButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"FooterIconButton.js","sources":["../../../../../src/components/footer/FooterIconButton.tsx"],"sourcesContent":["import React, { ElementType, FC, ForwardedRef, forwardRef, useMemo } from 'react';\nimport { IconButton, IconButtonProps } from '@mui/material';\nimport { FacebookIcon } from '@/src/components/icon/stroke/FacebookIcon';\nimport { InstagramIcon } from '@/src/components/icon/stroke/InstagramIcon';\nimport { XIcon } from '@/src/components/icon/stroke/XIcon';\nimport { YouTubeIcon } from '@/src/components/icon/stroke/YouTubeIcon';\nimport { LinkedInIcon } from '@/src/components/icon/stroke/LinkedInIcon';\nimport { SettingsIcon } from '@/src/components/icon/stroke/SettingsIcon';\nimport { HeartIcon } from '@/src/components/icon/stroke/HeartIcon';\n\nexport interface FooterIconButtonProps extends IconButtonProps<ElementType> {\n  /**\n   * @deprecated provide icon directly as children (e.g. <FacebookIcon />)\n   */\n  icon?: 'facebook' | 'instagram' | 'twitter' | 'youtube' | 'linkedin' | 'heart' | 'settings' | string;\n}\n\n/**\n * Section for the main links\n */\nexport const FooterIconButton: FC<FooterIconButtonProps> = forwardRef(({ children, icon, ...rest }, ref) => {\n  // mapper to previous api\n  const Icon = useMemo(() => {\n    switch (icon) {\n      case 'facebook':\n        return FacebookIcon;\n      case 'instagram':\n        return InstagramIcon;\n      case 'twitter':\n        return XIcon;\n      case 'youtube':\n        return YouTubeIcon;\n      case 'linkedin':\n        return LinkedInIcon;\n      case 'settings':\n        return SettingsIcon;\n      case 'heart':\n        return HeartIcon;\n      default:\n        return undefined;\n    }\n  }, [icon]);\n\n  return (\n    <IconButton\n      size=\"medium\"\n      color=\"white\"\n      ref={ref as ForwardedRef<HTMLButtonElement>}\n      data-testid=\"FooterIconButton\"\n      {...rest}\n    >\n      {children || <Icon />}\n    </IconButton>\n  );\n});\n\nexport interface PredefinedFooterIconButtonProps extends Omit<FooterIconButtonProps, 'icon'> {}\n\n/** @deprecated use <FooterIconButton> with icon of your choosing instead */\nexport const FacebookFooterIconButton: FC<FooterIconButtonProps> = forwardRef((props, ref) => (\n  <FooterIconButton aria-label=\"Facebook link\" ref={ref} {...props}>\n    <FacebookIcon />\n  </FooterIconButton>\n));\n/** @deprecated use <FooterIconButton> with icon of your choosing instead */\nexport const InstagramFooterIconButton: FC<FooterIconButtonProps> = forwardRef((props, ref) => (\n  <FooterIconButton aria-label=\"Instagram link\" ref={ref} {...props}>\n    <InstagramIcon />\n  </FooterIconButton>\n));\n/** @deprecated use <FooterIconButton> with icon of your choosing instead */\nexport const TwitterFooterIconButton: FC<FooterIconButtonProps> = forwardRef((props, ref) => (\n  <FooterIconButton aria-label=\"Twitter link\" ref={ref} {...props}>\n    <XIcon />\n  </FooterIconButton>\n));\n/** @deprecated use <FooterIconButton> with icon of your choosing instead */\nexport const YoutubeFooterIconButton: FC<FooterIconButtonProps> = forwardRef((props, ref) => (\n  <FooterIconButton aria-label=\"Youtube link\" ref={ref} {...props}>\n    <YouTubeIcon />\n  </FooterIconButton>\n));\n/** @deprecated use <FooterIconButton> with icon of your choosing instead */\nexport const LinkedinFooterIconButton: FC<FooterIconButtonProps> = forwardRef((props, ref) => (\n  <FooterIconButton aria-label=\"Linkedin link\" ref={ref} {...props}>\n    <LinkedInIcon />\n  </FooterIconButton>\n));\n"],"names":["FooterIconButton","forwardRef","_a","ref","children","icon","rest","__rest","Icon","useMemo","FacebookIcon","InstagramIcon","XIcon","YouTubeIcon","LinkedInIcon","SettingsIcon","HeartIcon","_jsx","IconButton","Object","assign","size","color","FacebookFooterIconButton","props","InstagramFooterIconButton","TwitterFooterIconButton","YoutubeFooterIconButton","LinkedinFooterIconButton"],"mappings":"2ZAoBO,MAAMA,EAA8CC,EAAAA,WAAW,CAACC,EAA6BC,SAA7BC,SAAEA,EAAQC,KAAEA,GAAIH,EAAKI,EAAIC,EAAAA,OAAAL,EAAzB,qBAErE,MAAMM,EAAOC,EAAAA,QAAQ,KACnB,OAAQJ,GACN,IAAK,WACH,OAAOK,EAAAA,aACT,IAAK,YACH,OAAOC,EAAAA,cACT,IAAK,UACH,OAAOC,EAAAA,MACT,IAAK,UACH,OAAOC,EAAAA,YACT,IAAK,WACH,OAAOC,EAAAA,aACT,IAAK,WACH,OAAOC,EAAAA,aACT,IAAK,QACH,OAAOC,EAAAA,UACT,QACE,SAEH,CAACX,IAEJ,OACEY,EAAAA,IAACC,aAAUC,OAAAC,OAAA,CACTC,KAAK,SACLC,MAAM,QACNnB,IAAKA,EAAsC,cAC/B,oBACRG,EAAI,CAAAF,SAEPA,GAAYa,EAAAA,IAACT,EAAI,SAQXe,EAAsDtB,EAAAA,WAAW,CAACuB,EAAOrB,IACpFc,EAAAA,IAACjB,EAAgBmB,OAAAC,OAAA,CAAA,aAAY,gBAAgBjB,IAAKA,GAASqB,EAAK,CAAApB,SAC9Da,EAAAA,IAACP,eAAY,CAAA,OAIJe,EAAuDxB,EAAAA,WAAW,CAACuB,EAAOrB,IACrFc,EAAAA,IAACjB,EAAgBmB,OAAAC,OAAA,CAAA,aAAY,iBAAiBjB,IAAKA,GAASqB,EAAK,CAAApB,SAC/Da,EAAAA,IAACN,gBAAa,CAAA,OAILe,EAAqDzB,EAAAA,WAAW,CAACuB,EAAOrB,IACnFc,EAAAA,IAACjB,EAAgBmB,OAAAC,OAAA,CAAA,aAAY,eAAejB,IAAKA,GAASqB,EAAK,CAAApB,SAC7Da,EAAAA,IAACL,QAAK,CAAA,OAIGe,EAAqD1B,EAAAA,WAAW,CAACuB,EAAOrB,IACnFc,EAAAA,IAACjB,EAAgBmB,OAAAC,OAAA,CAAA,aAAY,eAAejB,IAAKA,GAASqB,EAAK,CAAApB,SAC7Da,EAAAA,IAACJ,cAAW,CAAA,OAIHe,EAAsD3B,EAAAA,WAAW,CAACuB,EAAOrB,IACpFc,EAAAA,IAACjB,EAAgBmB,OAAAC,OAAA,CAAA,aAAY,gBAAgBjB,IAAKA,GAASqB,EAAK,CAAApB,SAC9Da,EAAAA,IAACH,eAAY,CAAA"}
+{"version":3,"file":"FooterIconButton.js","sources":["../../../../../src/components/footer/FooterIconButton.tsx"],"sourcesContent":["import React, { ElementType, FC, ForwardedRef, forwardRef } from 'react';\nimport { IconButton, IconButtonProps } from '@mui/material';\n\nexport interface FooterIconButtonProps extends IconButtonProps<ElementType> {}\n\n/**\n * Section for the main links\n */\nexport const FooterIconButton: FC<FooterIconButtonProps> = forwardRef(({ children, ...rest }, ref) => {\n  return (\n    <IconButton\n      size=\"medium\"\n      color=\"white\"\n      ref={ref as ForwardedRef<HTMLButtonElement>}\n      data-testid=\"FooterIconButton\"\n      {...rest}\n    >\n      {children}\n    </IconButton>\n  );\n});\n"],"names":["FooterIconButton","forwardRef","_a","ref","children","rest","__rest","_jsx","IconButton","Object","assign","size","color"],"mappings":"iHAQO,MAAMA,EAA8CC,EAAAA,WAAW,CAACC,EAAuBC,KAAvB,IAAAC,SAAEA,GAAQF,EAAKG,EAAIC,EAAAA,OAAAJ,EAAnB,cACrE,OACEK,EAAAA,IAACC,EAAAA,WAAUC,OAAAC,OAAA,CACTC,KAAK,SACLC,MAAM,QACNT,IAAKA,EAAsC,cAC/B,oBACRE,EAAI,CAAAD,SAEPA"}

package/cjs/components/footer/FooterLink.d.ts

@@ -5,18 +5,8 @@ export interface FooterLinkProps extends LinkProps<ElementType> {
      * Displayed navigation text, can be provided as children as well
      */
     label?: ReactNode;
-    /**
-     * @deprecated provide icon directly as children next to text (e.g. <PhoneIcon />)
-     */
-    icon?: 'call' | 'mail' | 'edit' | string;
 }
 /**
  * Component to render styled link in the footer
  */
 export declare const FooterLink: FC<FooterLinkProps>;
-export interface FooterNavItemProps extends FooterLinkProps {
-}
-/**
- * @deprecated remove this component, use FooterLink instead
- */
-export declare const FooterNavItem: FC<FooterNavItemProps>;

package/cjs/components/footer/FooterLink.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("tslib"),r=require("react/jsx-runtime"),t=require("react"),i=require("@mui/material"),n=require("../icon/stroke/PhoneIcon.js"),s=require("../icon/stroke/MessageIcon.js"),o=require("../icon/stroke/EditIcon.js");const c=t.forwardRef((c,a)=>{var{sx:l,icon:u,children:x,label:d}=c,f=e.__rest(c,["sx","icon","children","label"]);const j=t.useMemo(()=>{switch(u){case"call":return n.PhoneIcon;case"mail":return s.MessageIcon;case"edit":return o.EditIcon;default:return}},[u]);return r.jsxs(i.Link,Object.assign({sx:Object.assign({display:"inline-flex",gap:1.5,alignItems:"center",justifyContent:"flex-start",padding:"4px 8px","&, &:hover":{textDecoration:"underline",color:"common.white"},"& .MuiSvgIcon-root":{fontSize:"20px"}},l),variant:"list",ref:a},f,{children:[j&&r.jsx(j,{}),x||d]}))}),a=t.forwardRef((e,t)=>r.jsx(c,Object.assign({ref:t},e)));exports.FooterLink=c,exports.FooterNavItem=a;
+"use strict";var e=require("tslib"),r=require("react/jsx-runtime"),i=require("react"),t=require("@mui/material");const n=i.forwardRef((i,n)=>{var{sx:s,children:a,label:l}=i,o=e.__rest(i,["sx","children","label"]);return r.jsx(t.Link,Object.assign({sx:Object.assign({display:"inline-flex",gap:1.5,alignItems:"center",justifyContent:"flex-start",padding:"4px 8px","&, &:hover":{textDecoration:"underline",color:"common.white"},"& .MuiSvgIcon-root":{fontSize:"20px"}},s),variant:"list",ref:n},o,{children:a||l}))});exports.FooterLink=n;
 //# sourceMappingURL=FooterLink.js.map

package/cjs/components/footer/FooterLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"FooterLink.js","sources":["../../../../../src/components/footer/FooterLink.tsx"],"sourcesContent":["import React, { useMemo, ElementType, FC, forwardRef, ForwardedRef, ReactNode } from 'react';\nimport { Link, LinkProps } from '@mui/material';\nimport { PhoneIcon } from '@/src/components/icon/stroke/PhoneIcon';\nimport { MessageIcon } from '@/src/components/icon/stroke/MessageIcon';\nimport { EditIcon } from '@/src/components/icon/stroke/EditIcon';\n\nexport interface FooterLinkProps extends LinkProps<ElementType> {\n  /**\n   * Displayed navigation text, can be provided as children as well\n   */\n  label?: ReactNode;\n  /**\n   * @deprecated provide icon directly as children next to text (e.g. <PhoneIcon />)\n   */\n  icon?: 'call' | 'mail' | 'edit' | string;\n}\n\n/**\n * Component to render styled link in the footer\n */\nexport const FooterLink: FC<FooterLinkProps> = forwardRef(({ sx, icon, children, label, ...rest }, ref) => {\n  // mapper to previous api\n  const Icon = useMemo(() => {\n    switch (icon) {\n      case 'call':\n        return PhoneIcon;\n      case 'mail':\n        return MessageIcon;\n      case 'edit':\n        return EditIcon;\n      default:\n        return undefined;\n    }\n  }, [icon]);\n\n  return (\n    <Link\n      sx={{\n        // icon and text next to each other\n        display: 'inline-flex',\n        gap: 1.5,\n        alignItems: 'center',\n        justifyContent: 'flex-start',\n        padding: '4px 8px',\n        // styling\n        '&, &:hover': {\n          textDecoration: 'underline',\n          color: 'common.white',\n        },\n        // size of icon\n        '& .MuiSvgIcon-root': {\n          fontSize: '20px',\n        },\n        ...sx,\n      }}\n      variant=\"list\"\n      ref={ref as ForwardedRef<HTMLAnchorElement>}\n      {...rest}\n    >\n      {Icon && <Icon />}\n      {children || label}\n    </Link>\n  );\n});\n\nexport interface FooterNavItemProps extends FooterLinkProps {}\n/**\n * @deprecated remove this component, use FooterLink instead\n */\nexport const FooterNavItem: FC<FooterNavItemProps> = forwardRef((props, ref) => {\n  return <FooterLink ref={ref} {...props} />;\n});\n"],"names":["FooterLink","forwardRef","_a","ref","sx","icon","children","label","rest","__rest","Icon","useMemo","PhoneIcon","MessageIcon","EditIcon","_jsxs","Link","Object","assign","display","gap","alignItems","justifyContent","padding","textDecoration","color","fontSize","variant","_jsx","FooterNavItem","props"],"mappings":"6OAoBO,MAAMA,EAAkCC,EAAAA,WAAW,CAACC,EAAwCC,KAAxC,IAAAC,GAAEA,EAAEC,KAAEA,EAAIC,SAAEA,EAAQC,MAAEA,GAAKL,EAAKM,EAAIC,EAAAA,OAAAP,EAApC,CAAA,KAAA,OAAA,WAAA,UAEzD,MAAMQ,EAAOC,EAAAA,QAAQ,KACnB,OAAQN,GACN,IAAK,OACH,OAAOO,EAAAA,UACT,IAAK,OACH,OAAOC,EAAAA,YACT,IAAK,OACH,OAAOC,EAAAA,SACT,QACE,SAEH,CAACT,IAEJ,OACEU,EAAAA,KAACC,EAAAA,KAAIC,OAAAC,OAAA,CACHd,GAAEa,OAAAC,OAAA,CAEAC,QAAS,cACTC,IAAK,IACLC,WAAY,SACZC,eAAgB,aAChBC,QAAS,UAET,aAAc,CACZC,eAAgB,YAChBC,MAAO,gBAGT,qBAAsB,CACpBC,SAAU,SAETtB,GAELuB,QAAQ,OACRxB,IAAKA,GACDK,aAEHE,GAAQkB,EAAAA,IAAClB,EAAI,CAAA,GACbJ,GAAYC,QASNsB,EAAwC5B,EAAAA,WAAW,CAAC6B,EAAO3B,IAC/DyB,EAAAA,IAAC5B,EAAUiB,OAAAC,OAAA,CAACf,IAAKA,GAAS2B"}
+{"version":3,"file":"FooterLink.js","sources":["../../../../../src/components/footer/FooterLink.tsx"],"sourcesContent":["import React, { ElementType, FC, forwardRef, ForwardedRef, ReactNode } from 'react';\nimport { Link, LinkProps } from '@mui/material';\n\nexport interface FooterLinkProps extends LinkProps<ElementType> {\n  /**\n   * Displayed navigation text, can be provided as children as well\n   */\n  label?: ReactNode;\n}\n\n/**\n * Component to render styled link in the footer\n */\nexport const FooterLink: FC<FooterLinkProps> = forwardRef(({ sx, children, label, ...rest }, ref) => {\n  return (\n    <Link\n      sx={{\n        // icon and text next to each other\n        display: 'inline-flex',\n        gap: 1.5,\n        alignItems: 'center',\n        justifyContent: 'flex-start',\n        padding: '4px 8px',\n        // styling\n        '&, &:hover': {\n          textDecoration: 'underline',\n          color: 'common.white',\n        },\n        // size of icon\n        '& .MuiSvgIcon-root': {\n          fontSize: '20px',\n        },\n        ...sx,\n      }}\n      variant=\"list\"\n      ref={ref as ForwardedRef<HTMLAnchorElement>}\n      {...rest}\n    >\n      {children || label}\n    </Link>\n  );\n});\n"],"names":["FooterLink","forwardRef","_a","ref","sx","children","label","rest","__rest","_jsx","Link","Object","assign","display","gap","alignItems","justifyContent","padding","textDecoration","color","fontSize","variant"],"mappings":"iHAaO,MAAMA,EAAkCC,EAAAA,WAAW,CAACC,EAAkCC,SAAlCC,GAAEA,EAAEC,SAAEA,EAAQC,MAAEA,KAAUC,EAAIC,EAAAA,OAAAN,EAA9B,CAAA,KAAA,WAAA,UACzD,OACEO,EAAAA,IAACC,EAAAA,KAAIC,OAAAC,OAAA,CACHR,GAAEO,OAAAC,OAAA,CAEAC,QAAS,cACTC,IAAK,IACLC,WAAY,SACZC,eAAgB,aAChBC,QAAS,UAET,aAAc,CACZC,eAAgB,YAChBC,MAAO,gBAGT,qBAAsB,CACpBC,SAAU,SAEThB,GAELiB,QAAQ,OACRlB,IAAKA,GACDI,EAAI,CAAAF,SAEPA,GAAYC"}

package/cjs/components/footer/FooterMenu.d.ts

@@ -1,16 +1,6 @@
-import React, { FC, ReactNode } from 'react';
+import React, { FC } from 'react';
 import { FooterAccordionProps } from './FooterAccordion';
 export interface FooterMenuProps extends Omit<FooterAccordionProps, 'variant' | 'children'> {
-    /**
-     * Main item of Menu
-     * @deprecated rename to label
-     */
-    mainItem?: React.ReactNode;
-    /**
-     * Items in the menu
-     * @depreaceted place links directly as children
-     */
-    subItems?: ReactNode;
     /**
      * Items in the menu
      */

package/cjs/components/footer/FooterMenu.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("tslib"),o=require("react/jsx-runtime"),t=require("react"),r=require("@mui/material"),n=require("./FooterAccordion.js");const s=t.forwardRef((s,a)=>{var{sx:i,children:c,label:u,mainItem:l,accordionSummaryProps:d,subItems:p,contentProps:b,variant:m="auto"}=s,x=e.__rest(s,["sx","children","label","mainItem","accordionSummaryProps","subItems","contentProps","variant"]);const g=null!=b?b:{},{sx:j}=g,f=e.__rest(g,["sx"]),y=null!=d?d:{},{sx:O}=y,h=e.__rest(y,["sx"]),v=r.useTheme(),M=r.useMediaQuery(v.breakpoints.down("lg")),S="auto"===m?M:"accordion"===m,[F,I]=t.useState(!1);return o.jsxs(n.FooterAccordion,Object.assign({ref:a,"data-testid":"FooterMenu",expanded:!S||F,onChange:(e,o)=>I(o),variant:"standard",sx:Object.assign(Object.assign({flexBasis:{lg:"20%"},borderColor:"onSurface.os700"},!S&&{border:"none"}),i),accordionSummaryProps:Object.assign({"data-testid":"FooterMenu.label",sx:Object.assign(Object.assign({padding:"18px 0 8px","& .MuiLink-root":Object.assign(Object.assign({},v.typography.subheadline),{p:0,"&, &:hover":{textDecoration:"none",color:"common.white"}})},!S&&{overflow:"visible","&&:not(.Mui-disabled)":{cursor:"unset"},"& .MuiAccordionSummary-expandIconWrapper":{display:"none"}}),O)},h),label:u||l,contentProps:Object.assign({component:"div","data-testid":"FooterMenu.content",sx:Object.assign({display:"flex",alignItems:"flex-start",justifyContent:"flex-start",flexDirection:"column",gap:1.5,"& .MuiLink-root":Object.assign(Object.assign({},v.typography.caption2),{p:0,"&, &:hover":{textDecoration:"none",color:"onSurface.os200"}})},j)},f)},x,{children:[c,p]}),`${S}`)});exports.FooterMenu=s;
+"use strict";var e=require("tslib"),o=require("react/jsx-runtime"),r=require("react"),t=require("@mui/material"),n=require("./FooterAccordion.js");const s=r.forwardRef((s,a)=>{var{sx:i,children:c,label:u,accordionSummaryProps:l,contentProps:d,variant:p="auto"}=s,b=e.__rest(s,["sx","children","label","accordionSummaryProps","contentProps","variant"]);const x=null!=d?d:{},{sx:g}=x,m=e.__rest(x,["sx"]),j=null!=l?l:{},{sx:f}=j,y=e.__rest(j,["sx"]),O=t.useTheme(),h=t.useMediaQuery(O.breakpoints.down("lg")),v="auto"===p?h:"accordion"===p,[M,S]=r.useState(!1);return o.jsx(n.FooterAccordion,Object.assign({ref:a,"data-testid":"FooterMenu",expanded:!v||M,onChange:(e,o)=>S(o),variant:"standard",sx:Object.assign(Object.assign({flexBasis:{lg:"20%"},borderColor:"onSurface.os700"},!v&&{border:"none"}),i),accordionSummaryProps:Object.assign({"data-testid":"FooterMenu.label",sx:Object.assign(Object.assign({padding:"18px 0 8px","& .MuiLink-root":Object.assign(Object.assign({},O.typography.subheadline),{p:0,"&, &:hover":{textDecoration:"none",color:"common.white"}})},!v&&{overflow:"visible","&&:not(.Mui-disabled)":{cursor:"unset"},"& .MuiAccordionSummary-expandIconWrapper":{display:"none"}}),f)},y),label:u,contentProps:Object.assign({component:"div","data-testid":"FooterMenu.content",sx:Object.assign({display:"flex",alignItems:"flex-start",justifyContent:"flex-start",flexDirection:"column",gap:1.5,"& .MuiLink-root":Object.assign(Object.assign({},O.typography.caption2),{p:0,"&, &:hover":{textDecoration:"none",color:"onSurface.os200"}})},g)},m)},b,{children:c}),`${v}`)});exports.FooterMenu=s;
 //# sourceMappingURL=FooterMenu.js.map

package/cjs/components/footer/FooterMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"FooterMenu.js","sources":["../../../../../src/components/footer/FooterMenu.tsx"],"sourcesContent":["import React, { FC, forwardRef, ReactNode, useState } from 'react';\nimport { Theme, useMediaQuery, useTheme } from '@mui/material';\nimport { FooterAccordion, FooterAccordionProps } from './FooterAccordion';\n\nexport interface FooterMenuProps extends Omit<FooterAccordionProps, 'variant' | 'children'> {\n  /**\n   * Main item of Menu\n   * @deprecated rename to label\n   */\n  mainItem?: React.ReactNode;\n  /**\n   * Items in the menu\n   * @depreaceted place links directly as children\n   */\n  subItems?: ReactNode;\n  /**\n   * Items in the menu\n   */\n  children?: React.ReactNode;\n  /**\n   * Variant of the menu\n   * - auto: renders on large resolution as list and on mobile as accordion\n   * - list: renders as list with title\n   * - accordion: renders as collapsible accordion\n   * @default auto\n   */\n  variant?: 'auto' | 'list' | 'accordion';\n}\n\n/**\n * Section for the secondary links, copyright and optional button\n */\nexport const FooterMenu: FC<FooterMenuProps> = forwardRef(\n  (\n    { sx, children, label, mainItem, accordionSummaryProps, subItems, contentProps, variant = 'auto', ...rest },\n    ref,\n  ) => {\n    const { sx: contentSx, ...restContent } = contentProps ?? {};\n    const { sx: accSummarySx, ...restAccSummary } = accordionSummaryProps ?? {};\n    const theme = useTheme();\n    const downLg = useMediaQuery<Theme>(theme.breakpoints.down('lg'));\n    const isAccordion = variant === 'auto' ? downLg : variant === 'accordion';\n    const [expanded, setExpanded] = useState(false);\n\n    return (\n      <FooterAccordion\n        key={`${isAccordion}`}\n        ref={ref}\n        data-testid=\"FooterMenu\"\n        expanded={isAccordion ? expanded : true}\n        onChange={(_, v) => setExpanded(v)}\n        variant=\"standard\"\n        sx={{\n          // spacing in the FooterSectionMenu, take max 1/5 of space\n          flexBasis: { lg: '20%' },\n          borderColor: 'onSurface.os700',\n          ...(!isAccordion && {\n            border: 'none',\n          }),\n          ...sx,\n        }}\n        accordionSummaryProps={{\n          ['data-testid']: 'FooterMenu.label',\n          sx: {\n            // adjust proportions to be closer to menu\n            padding: '18px 0 8px',\n            // manipulates style of links inside\n            '& .MuiLink-root': {\n              ...theme.typography.subheadline,\n              p: 0,\n              '&, &:hover': {\n                textDecoration: 'none',\n                color: 'common.white',\n              },\n            },\n            ...(!isAccordion && {\n              // allow overflow of focus ring\n              overflow: 'visible',\n              // no longer clickable\n              '&&:not(.Mui-disabled)': {\n                cursor: 'unset',\n              },\n              // hide icon\n              '& .MuiAccordionSummary-expandIconWrapper': {\n                display: 'none',\n              },\n            }),\n            ...accSummarySx,\n          },\n          ...restAccSummary,\n        }}\n        label={label || mainItem}\n        contentProps={{\n          component: 'div',\n          ['data-testid']: 'FooterMenu.content',\n          sx: {\n            display: 'flex',\n            alignItems: 'flex-start',\n            justifyContent: 'flex-start',\n            flexDirection: 'column',\n            gap: 1.5,\n            // manipulates style of links inside\n            '& .MuiLink-root': {\n              ...theme.typography.caption2,\n              p: 0,\n              '&, &:hover': {\n                textDecoration: 'none',\n                color: 'onSurface.os200',\n              },\n            },\n            ...contentSx,\n          },\n          ...restContent,\n        }}\n        {...rest}\n      >\n        {children}\n        {subItems}\n      </FooterAccordion>\n    );\n  },\n);\n"],"names":["FooterMenu","forwardRef","_a","ref","sx","children","label","mainItem","accordionSummaryProps","subItems","contentProps","variant","rest","__rest","_b","contentSx","restContent","_c","accSummarySx","restAccSummary","theme","useTheme","downLg","useMediaQuery","breakpoints","down","isAccordion","expanded","setExpanded","useState","_jsxs","FooterAccordion","onChange","_","v","Object","assign","flexBasis","lg","borderColor","border","padding","typography","subheadline","p","textDecoration","color","overflow","cursor","display","component","alignItems","justifyContent","flexDirection","gap","caption2"],"mappings":"mJAgCO,MAAMA,EAAkCC,EAAAA,WAC7C,CACEC,EACAC,SADAC,GAAEA,EAAEC,SAAEA,EAAQC,MAAEA,EAAKC,SAAEA,EAAQC,sBAAEA,EAAqBC,SAAEA,EAAQC,aAAEA,EAAYC,QAAEA,EAAU,UAAWC,EAAIC,EAAAA,OAAAX,EAAzG,CAAA,KAAA,WAAA,QAAA,WAAA,wBAAA,WAAA,eAAA,YAGA,MAAMY,EAAoCJ,QAAAA,EAAgB,IAAlDN,GAAIW,GAASD,EAAKE,EAAWH,EAAAA,OAAAC,EAA/B,CAAA,OACAG,EAA0CT,QAAAA,EAAyB,IAAjEJ,GAAIc,GAAYD,EAAKE,EAAcN,EAAAA,OAAAI,EAArC,CAAA,OACAG,EAAQC,EAAAA,WACRC,EAASC,EAAAA,cAAqBH,EAAMI,YAAYC,KAAK,OACrDC,EAA0B,SAAZf,EAAqBW,EAAqB,cAAZX,GAC3CgB,EAAUC,GAAeC,EAAAA,UAAS,GAEzC,OACEC,OAACC,EAAAA,+BAEC5B,IAAKA,EAAG,cACI,aACZwB,UAAUD,GAAcC,EACxBK,SAAU,CAACC,EAAGC,IAAMN,EAAYM,GAChCvB,QAAQ,WACRP,GAAE+B,OAAAC,OAAAD,OAAAC,OAAA,CAEAC,UAAW,CAAEC,GAAI,OACjBC,YAAa,oBACRb,GAAe,CAClBc,OAAQ,SAEPpC,GAELI,sBAAqB2B,OAAAC,OAAA,CACnB,cAAiB,mBACjBhC,GAAE+B,OAAAC,OAAAD,OAAAC,OAAA,CAEAK,QAAS,aAET,kBAAiBN,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EACZhB,EAAMsB,WAAWC,aAAW,CAC/BC,EAAG,EACH,aAAc,CACZC,eAAgB,OAChBC,MAAO,oBAGNpB,GAAe,CAElBqB,SAAU,UAEV,wBAAyB,CACvBC,OAAQ,SAGV,2CAA4C,CAC1CC,QAAS,UAGV/B,IAEFC,GAELb,MAAOA,GAASC,EAChBG,4BACEwC,UAAW,MACX,cAAiB,qBACjB9C,kBACE6C,QAAS,OACTE,WAAY,aACZC,eAAgB,aAChBC,cAAe,SACfC,IAAK,IAEL,kBAAiBnB,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EACZhB,EAAMsB,WAAWa,UAAQ,CAC5BX,EAAG,EACH,aAAc,CACZC,eAAgB,OAChBC,MAAO,sBAGR/B,IAEFC,IAEDJ,EAAI,CAAAP,SAAA,CAEPA,EACAI,KAvEI,GAAGiB"}
+{"version":3,"file":"FooterMenu.js","sources":["../../../../../src/components/footer/FooterMenu.tsx"],"sourcesContent":["import React, { FC, forwardRef, useState } from 'react';\nimport { Theme, useMediaQuery, useTheme } from '@mui/material';\nimport { FooterAccordion, FooterAccordionProps } from './FooterAccordion';\n\nexport interface FooterMenuProps extends Omit<FooterAccordionProps, 'variant' | 'children'> {\n  /**\n   * Items in the menu\n   */\n  children?: React.ReactNode;\n  /**\n   * Variant of the menu\n   * - auto: renders on large resolution as list and on mobile as accordion\n   * - list: renders as list with title\n   * - accordion: renders as collapsible accordion\n   * @default auto\n   */\n  variant?: 'auto' | 'list' | 'accordion';\n}\n\n/**\n * Section for the secondary links, copyright and optional button\n */\nexport const FooterMenu: FC<FooterMenuProps> = forwardRef(\n  ({ sx, children, label, accordionSummaryProps, contentProps, variant = 'auto', ...rest }, ref) => {\n    const { sx: contentSx, ...restContent } = contentProps ?? {};\n    const { sx: accSummarySx, ...restAccSummary } = accordionSummaryProps ?? {};\n    const theme = useTheme();\n    const downLg = useMediaQuery<Theme>(theme.breakpoints.down('lg'));\n    const isAccordion = variant === 'auto' ? downLg : variant === 'accordion';\n    const [expanded, setExpanded] = useState(false);\n\n    return (\n      <FooterAccordion\n        key={`${isAccordion}`}\n        ref={ref}\n        data-testid=\"FooterMenu\"\n        expanded={isAccordion ? expanded : true}\n        onChange={(_, v) => setExpanded(v)}\n        variant=\"standard\"\n        sx={{\n          // spacing in the FooterSectionMenu, take max 1/5 of space\n          flexBasis: { lg: '20%' },\n          borderColor: 'onSurface.os700',\n          ...(!isAccordion && {\n            border: 'none',\n          }),\n          ...sx,\n        }}\n        accordionSummaryProps={{\n          ['data-testid']: 'FooterMenu.label',\n          sx: {\n            // adjust proportions to be closer to menu\n            padding: '18px 0 8px',\n            // manipulates style of links inside\n            '& .MuiLink-root': {\n              ...theme.typography.subheadline,\n              p: 0,\n              '&, &:hover': {\n                textDecoration: 'none',\n                color: 'common.white',\n              },\n            },\n            ...(!isAccordion && {\n              // allow overflow of focus ring\n              overflow: 'visible',\n              // no longer clickable\n              '&&:not(.Mui-disabled)': {\n                cursor: 'unset',\n              },\n              // hide icon\n              '& .MuiAccordionSummary-expandIconWrapper': {\n                display: 'none',\n              },\n            }),\n            ...accSummarySx,\n          },\n          ...restAccSummary,\n        }}\n        label={label}\n        contentProps={{\n          component: 'div',\n          ['data-testid']: 'FooterMenu.content',\n          sx: {\n            display: 'flex',\n            alignItems: 'flex-start',\n            justifyContent: 'flex-start',\n            flexDirection: 'column',\n            gap: 1.5,\n            // manipulates style of links inside\n            '& .MuiLink-root': {\n              ...theme.typography.caption2,\n              p: 0,\n              '&, &:hover': {\n                textDecoration: 'none',\n                color: 'onSurface.os200',\n              },\n            },\n            ...contentSx,\n          },\n          ...restContent,\n        }}\n        {...rest}\n      >\n        {children}\n      </FooterAccordion>\n    );\n  },\n);\n"],"names":["FooterMenu","forwardRef","_a","ref","sx","children","label","accordionSummaryProps","contentProps","variant","rest","__rest","_b","contentSx","restContent","_c","accSummarySx","restAccSummary","theme","useTheme","downLg","useMediaQuery","breakpoints","down","isAccordion","expanded","setExpanded","useState","_jsx","FooterAccordion","onChange","_","v","Object","assign","flexBasis","lg","borderColor","border","padding","typography","subheadline","p","textDecoration","color","overflow","cursor","display","component","alignItems","justifyContent","flexDirection","gap","caption2"],"mappings":"mJAsBO,MAAMA,EAAkCC,EAAAA,WAC7C,CAACC,EAAyFC,KAAzF,IAAAC,GAAEA,EAAEC,SAAEA,EAAQC,MAAEA,EAAKC,sBAAEA,EAAqBC,aAAEA,EAAYC,QAAEA,EAAU,QAAMP,EAAKQ,EAAIC,SAAAT,EAArF,4EACC,MAAMU,EAAoCJ,QAAAA,EAAgB,IAAlDJ,GAAIS,GAASD,EAAKE,EAAWH,EAAAA,OAAAC,EAA/B,CAAA,OACAG,EAA0CR,QAAAA,EAAyB,IAAjEH,GAAIY,GAAYD,EAAKE,EAAcN,EAAAA,OAAAI,EAArC,CAAA,OACAG,EAAQC,EAAAA,WACRC,EAASC,EAAAA,cAAqBH,EAAMI,YAAYC,KAAK,OACrDC,EAA0B,SAAZf,EAAqBW,EAAqB,cAAZX,GAC3CgB,EAAUC,GAAeC,EAAAA,UAAS,GAEzC,OACEC,MAACC,EAAAA,+BAEC1B,IAAKA,EAAG,cACI,aACZsB,UAAUD,GAAcC,EACxBK,SAAU,CAACC,EAAGC,IAAMN,EAAYM,GAChCvB,QAAQ,WACRL,GAAE6B,OAAAC,OAAAD,OAAAC,OAAA,CAEAC,UAAW,CAAEC,GAAI,OACjBC,YAAa,oBACRb,GAAe,CAClBc,OAAQ,SAEPlC,GAELG,sBAAqB0B,OAAAC,OAAA,CACnB,cAAiB,mBACjB9B,GAAE6B,OAAAC,OAAAD,OAAAC,OAAA,CAEAK,QAAS,aAET,kBAAiBN,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EACZhB,EAAMsB,WAAWC,aAAW,CAC/BC,EAAG,EACH,aAAc,CACZC,eAAgB,OAChBC,MAAO,oBAGNpB,GAAe,CAElBqB,SAAU,UAEV,wBAAyB,CACvBC,OAAQ,SAGV,2CAA4C,CAC1CC,QAAS,UAGV/B,IAEFC,GAELX,MAAOA,EACPE,aAAYyB,OAAAC,OAAA,CACVc,UAAW,MACX,cAAiB,qBACjB5C,kBACE2C,QAAS,OACTE,WAAY,aACZC,eAAgB,aAChBC,cAAe,SACfC,IAAK,IAEL,kBAAiBnB,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EACZhB,EAAMsB,WAAWa,UAAQ,CAC5BX,EAAG,EACH,aAAc,CACZC,eAAgB,OAChBC,MAAO,sBAGR/B,IAEFC,IAEDJ,EAAI,CAAAL,SAEPA,IAtEI,GAAGmB"}

package/cjs/components/formMessage/FormMessage.d.ts

@@ -0,0 +1,26 @@
+import { BoxProps, SvgIconProps, TypographyProps } from '@mui/material';
+import React, { ComponentType, ElementType } from 'react';
+export interface FormMessageProps extends BoxProps<ElementType> {
+    /**
+     * Defines which variant of Banner component should be rendered
+     * @default error
+     */
+    variant?: 'info' | 'warning' | 'error';
+    /**
+     * Properties passed to indicator icon
+     */
+    iconProps?: SvgIconProps;
+    /**
+     * Icon node to be used
+     */
+    IconComponent?: ComponentType<SvgIconProps>;
+    /**
+     * Properties passed to wrapper of children
+     */
+    typographyProps?: TypographyProps<ElementType>;
+}
+/**
+ * Message indicating form error or additional info.
+ * Intended to be used in combination with <FormGroup />
+ */
+export declare const FormMessage: React.FC<FormMessageProps>;

package/cjs/components/formMessage/FormMessage.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("tslib"),r=require("react/jsx-runtime"),i=require("../icon/filled/CircleExclamationFilledIcon.js"),n=require("../icon/filled/CircleInformationFilledIcon.js"),s=require("../icon/filled/WarningFilledIcon.js"),t=require("@mui/material"),o=require("react");const a=o.forwardRef((a,l)=>{var{children:c,variant:x="error",sx:p,iconProps:f,IconComponent:g,typographyProps:u}=a,d=e.__rest(a,["children","variant","sx","iconProps","IconComponent","typographyProps"]);const m=f||{},{sx:j}=m,h=e.__rest(m,["sx"]),I=u||{},{sx:b}=I,y=e.__rest(I,["sx"]),[q,C]=o.useMemo(()=>{switch(x){case"error":return["error.main",s.WarningFilledIcon];case"warning":return["warning.main",i.CircleExclamationFilledIcon];default:return["info.main",n.CircleInformationFilledIcon]}},[x]),F=g||C;return r.jsxs(t.Box,Object.assign({role:"alert","aria-atomic":"true","aria-live":"assertive",sx:Object.assign({display:"flex",width:"100%",alignItems:"flex-start",justifyContent:"flex-start",gap:1,textAlign:"left",color:q,pb:1},p),ref:l},d,{children:[r.jsx(F,Object.assign({sx:Object.assign({fontSize:"20px",mx:"2px"},j)},h)),r.jsx(t.Typography,Object.assign({sx:Object.assign({flexGrow:"1",fontSize:{xs:"14px"},lineHeight:{xs:"20px"},fontWeight:{xs:"400"}},b)},y,{children:c}))]}))});exports.FormMessage=a;
+//# sourceMappingURL=FormMessage.js.map

package/cjs/components/formMessage/FormMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormMessage.js","sources":["../../../../../src/components/formMessage/FormMessage.tsx"],"sourcesContent":["import { CircleExclamationFilledIcon } from '@/src/components/icon/filled/CircleExclamationFilledIcon';\nimport { CircleInformationFilledIcon } from '@/src/components/icon/filled/CircleInformationFilledIcon';\nimport { WarningFilledIcon } from '@/src/components/icon/filled/WarningFilledIcon';\nimport { Box, BoxProps, SvgIconProps, Typography, TypographyProps } from '@mui/material';\nimport React, { ComponentType, ElementType, forwardRef, useMemo } from 'react';\n\nexport interface FormMessageProps extends BoxProps<ElementType> {\n  /**\n   * Defines which variant of Banner component should be rendered\n   * @default error\n   */\n  variant?: 'info' | 'warning' | 'error';\n  /**\n   * Properties passed to indicator icon\n   */\n  iconProps?: SvgIconProps;\n  /**\n   * Icon node to be used\n   */\n  IconComponent?: ComponentType<SvgIconProps>;\n  /**\n   * Properties passed to wrapper of children\n   */\n  typographyProps?: TypographyProps<ElementType>;\n}\n\n/**\n * Message indicating form error or additional info.\n * Intended to be used in combination with <FormGroup />\n */\nexport const FormMessage: React.FC<FormMessageProps> = forwardRef(\n  ({ children, variant = 'error', sx, iconProps, IconComponent, typographyProps, ...rest }, ref) => {\n    const { sx: iconSx, ...restIcon } = iconProps || {};\n    const { sx: typographySx, ...restTypography } = typographyProps || {};\n\n    const [color, IconVariantComponent] = useMemo(() => {\n      switch (variant) {\n        case 'error':\n          return ['error.main', WarningFilledIcon];\n        case 'warning':\n          return ['warning.main', CircleExclamationFilledIcon];\n        case 'info':\n        default:\n          return ['info.main', CircleInformationFilledIcon];\n      }\n    }, [variant]);\n    const ErrorMessageIcon = IconComponent || IconVariantComponent;\n\n    return (\n      <Box\n        role=\"alert\"\n        aria-atomic=\"true\"\n        aria-live=\"assertive\"\n        sx={{\n          display: 'flex',\n          width: '100%',\n          alignItems: 'flex-start',\n          justifyContent: 'flex-start',\n          gap: 1,\n          textAlign: 'left',\n          color: color,\n          pb: 1,\n          ...sx,\n        }}\n        ref={ref}\n        {...rest}\n      >\n        <ErrorMessageIcon\n          sx={{\n            fontSize: '20px',\n            // align with checkbox/radio (return to 24px width)\n            mx: '2px',\n            ...iconSx,\n          }}\n          {...restIcon}\n        />\n        <Typography\n          sx={{\n            flexGrow: '1',\n            // custom font according to Figma\n            fontSize: { xs: '14px' },\n            lineHeight: { xs: '20px' },\n            fontWeight: { xs: '400' },\n            ...typographySx,\n          }}\n          {...restTypography}\n        >\n          {children}\n        </Typography>\n      </Box>\n    );\n  },\n);\n"],"names":["FormMessage","forwardRef","_a","ref","children","variant","sx","iconProps","IconComponent","typographyProps","rest","__rest","_b","iconSx","restIcon","_c","typographySx","restTypography","color","IconVariantComponent","useMemo","WarningFilledIcon","CircleExclamationFilledIcon","CircleInformationFilledIcon","ErrorMessageIcon","_jsxs","Box","Object","assign","role","display","width","alignItems","justifyContent","gap","textAlign","pb","_jsx","fontSize","mx","Typography","flexGrow","xs","lineHeight","fontWeight"],"mappings":"wRA8BO,MAAMA,EAA0CC,EAAAA,WACrD,CAACC,EAAyFC,KAAzF,IAAAC,SAAEA,EAAQC,QAAEA,EAAU,QAAOC,GAAEA,EAAEC,UAAEA,EAASC,cAAEA,EAAaC,gBAAEA,GAAeP,EAAKQ,EAAIC,SAAAT,EAArF,2EACC,MAAMU,EAA8BL,GAAa,IAAzCD,GAAIO,KAAWC,EAAQH,EAAAA,OAAAC,EAAzB,CAAA,OACAG,EAA0CN,GAAmB,IAA3DH,GAAIU,KAAiBC,EAAcN,EAAAA,OAAAI,EAArC,CAAA,QAECG,EAAOC,GAAwBC,EAAAA,QAAQ,KAC5C,OAAQf,GACN,IAAK,QACH,MAAO,CAAC,aAAcgB,qBACxB,IAAK,UACH,MAAO,CAAC,eAAgBC,+BAE1B,QACE,MAAO,CAAC,YAAaC,iCAExB,CAAClB,IACEmB,EAAmBhB,GAAiBW,EAE1C,OACEM,OAACC,EAAAA,IAAGC,OAAAC,OAAA,CACFC,KAAK,QAAO,cACA,OAAM,YACR,YACVvB,GAAEqB,OAAAC,OAAA,CACAE,QAAS,OACTC,MAAO,OACPC,WAAY,aACZC,eAAgB,aAChBC,IAAK,EACLC,UAAW,OACXjB,MAAOA,EACPkB,GAAI,GACD9B,GAELH,IAAKA,GACDO,EAAI,CAAAN,SAAA,CAERiC,EAAAA,IAACb,EAAgBG,OAAAC,OAAA,CACftB,GAAEqB,OAAAC,OAAA,CACAU,SAAU,OAEVC,GAAI,OACD1B,IAEDC,IAENuB,EAAAA,IAACG,EAAAA,WAAUb,OAAAC,OAAA,CACTtB,GAAEqB,OAAAC,OAAA,CACAa,SAAU,IAEVH,SAAU,CAAEI,GAAI,QAChBC,WAAY,CAAED,GAAI,QAClBE,WAAY,CAAEF,GAAI,QACf1B,IAEDC,EAAc,CAAAb,SAEjBA"}

package/cjs/components/formMessage/index.d.ts

@@ -1 +1 @@
-export * from './formMessage';
+export * from './FormMessage';

package/cjs/components/header/Header.d.ts

@@ -1,28 +1,11 @@
 import { FC, ReactNode, ElementType } from 'react';
-import { AppBarProps, BoxProps, Breakpoint, DrawerProps, ToolbarProps } from '@mui/material';
+import { AppBarProps, BoxProps, DrawerProps, ToolbarProps } from '@mui/material';
 import { HeaderButtonProps } from './HeaderButton';
 export interface HeaderProps extends Omit<AppBarProps, 'color'> {
     /**
      * Logo component
      */
     logo?: ReactNode;
-    /**
-     * Items in the menu
-     * @deprecated place links directly as children
-     */
-    navigationItems?: ReactNode;
-    /**
-     * @deprecated no longer has any effect
-     */
-    overheadItems?: ReactNode;
-    /**
-     * @deprecated no longer has any effect
-     */
-    color?: 'light' | 'dark';
-    /**
-     * @deprecated no longer has any effect
-     */
-    breakpoint?: Breakpoint;
     /**
      * Wrap the navigation into container
      * @default false