@skodaflow/web-library 7.16.0 → 7.16.1

package/components/advancedTable/agGridIcons.js.map

@@ -1 +1 @@
-{"version":3,"file":"agGridIcons.js","sources":["../../../src/components/advancedTable/agGridIcons.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport type { SvgIconProps } from '@mui/material';\nimport { renderToString } from 'react-dom/server';\nimport { ChevronDownIcon } from '../icon/stroke/ChevronDownIcon';\nimport {\n  ArrowCircleDownIcon,\n  ArrowCircleUpIcon,\n  ArrowLeftIcon,\n  ArrowRightIcon,\n  ChevronNextIcon,\n  ChevronPreviousIcon,\n} from '../icon/stroke';\nimport { ArrowCircleDownFilledIcon, ArrowCircleUpFilledIcon } from '../icon';\n\nconst getSvg = (Icon: FC<SvgIconProps>) => {\n  return renderToString(<Icon xmlns=\"http://www.w3.org/2000/svg\" />);\n};\n\nexport const agGridIconsDefinition = {\n  previous: { svg: getSvg(ArrowLeftIcon) },\n  next: { svg: getSvg(ArrowRightIcon) },\n  first: { svg: getSvg(ChevronPreviousIcon) },\n  last: { svg: getSvg(ChevronNextIcon) },\n  'small-down': { svg: getSvg(ChevronDownIcon) },\n  asc: { svg: getSvg(ArrowCircleUpFilledIcon) },\n  ascHover: { svg: getSvg(ArrowCircleUpIcon) },\n  desc: { svg: getSvg(ArrowCircleDownFilledIcon) },\n  descHover: { svg: getSvg(ArrowCircleDownIcon) },\n};\n\n/** Maps AG Grid icons to Skoda Flow library icons, overrides icons in AG Grid Theme */\nexport const skodaAgGridIconOverrides = (customIcons?: { name: string; svgIcon: FC<SvgIconProps> }[]) => {\n  return {\n    type: 'image' as const,\n    mask: true, // for icons to use AG Grid currentColor\n    icons: {\n      ...agGridIconsDefinition,\n      ...Object.fromEntries((customIcons ?? []).map((icon) => [icon.name, { svg: getSvg(icon.svgIcon) }])),\n    },\n  };\n};\n\nexport const agGridCssIcons = {\n  '.ag-icon-desc:hover::before': {\n    maskImage: `url(data:image/svg+xml;utf8,${encodeURIComponent(agGridIconsDefinition.descHover.svg)})`,\n  },\n  '.ag-icon-asc:hover::before': {\n    maskImage: `url(data:image/svg+xml;utf8,${encodeURIComponent(agGridIconsDefinition.ascHover.svg)})`,\n  },\n};\n"],"names":["getSvg","Icon","renderToString","_jsx","xmlns","agGridIconsDefinition","previous","svg","ArrowLeftIcon","next","ArrowRightIcon","first","ChevronPreviousIcon","last","ChevronNextIcon","ChevronDownIcon","asc","ArrowCircleUpFilledIcon","ascHover","ArrowCircleUpIcon","desc","ArrowCircleDownFilledIcon","descHover","ArrowCircleDownIcon","skodaAgGridIconOverrides","customIcons","type","mask","icons","Object","fromEntries","map","icon","name","svgIcon","agGridCssIcons","maskImage","encodeURIComponent"],"mappings":"ql+BAcA,MAAMA,EAAUC,GACPC,EAAeC,EAACF,EAAI,CAACG,MAAM,gCAGvBC,EAAwB,CACnCC,SAAU,CAAEC,IAAKP,EAAOQ,IACxBC,KAAM,CAAEF,IAAKP,EAAOU,IACpBC,MAAO,CAAEJ,IAAKP,EAAOY,IACrBC,KAAM,CAAEN,IAAKP,EAAOc,IACpB,aAAc,CAAEP,IAAKP,EAAOe,IAC5BC,IAAK,CAAET,IAAKP,EAAOiB,IACnBC,SAAU,CAAEX,IAAKP,EAAOmB,IACxBC,KAAM,CAAEb,IAAKP,EAAOqB,IACpBC,UAAW,CAAEf,IAAKP,EAAOuB,KAIdC,EAA4BC,IAChC,CACLC,KAAM,QACNC,MAAM,EACNC,qCACKvB,GACAwB,OAAOC,aAAaL,QAAAA,EAAe,IAAIM,IAAKC,GAAS,CAACA,EAAKC,KAAM,CAAE1B,IAAKP,EAAOgC,EAAKE,gBAKhFC,EAAiB,CAC5B,8BAA+B,CAC7BC,UAAW,+BAA+BC,mBAAmBhC,EAAsBiB,UAAUf,SAE/F,6BAA8B,CAC5B6B,UAAW,+BAA+BC,mBAAmBhC,EAAsBa,SAASX"}
+{"version":3,"file":"agGridIcons.js","sources":["../../../src/components/advancedTable/agGridIcons.tsx"],"sourcesContent":["// hotfix to avoid using react-dom/server which can cause issues in Next\n// later the source of flow-icons2 should be used instead\nexport const agGridIconsDefinition = {\n  previous: {\n    // ArrowLeftIcon\n    svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12.86 18.24L11.58 19.52L4.02 11.96L11.58 4.4L12.86 5.68L7.56 10.92H19.58V13H7.56L12.86 18.24Z\"></path></svg>',\n  },\n  next: {\n    // ArrowRightIcon\n    svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M4.42 10.92H16.44L11.14 5.68L12.42 4.4L19.98 11.96L12.42 19.52L11.14 18.24L16.44 13H4.42V10.92Z\"></path></svg>',\n  },\n  first: {\n    // ChevronPreviousIcon\n    svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M9.3 11.96L17.36 5L18.64 6.44L12.1 11.96L18.64 17.48L17.36 18.92L9.3 11.96ZM6.3 5.32H8.26V18.6H6.3V5.32Z\"></path></svg>',\n  },\n  last: {\n    // ChevronNextIcon\n    svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M14.7 11.96L6.64 18.92L5.36 17.48L11.9 11.96L5.36 6.44L6.64 5L14.7 11.96ZM17.7 18.6H15.74V5.32H17.7V18.6Z\"></path></svg>',\n  },\n  'small-down': {\n    // ChevronDownIcon\n    svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 16.42L4.64 9.06L6.12 7.58L12 13.46L17.88 7.58L19.36 9.06L12 16.42Z\"></path></svg>',\n  },\n  asc: {\n    // ArrowCircleUpFilledIcon\n    svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74ZM11.22 15.92H12.78V10.4L15.34 13.04L16.3 12.1L11.96 7.76L7.7 12.1L8.66 13.04L11.22 10.34V15.92Z\"></path></svg>',\n  },\n  ascHover: {\n    // ArrowCircleUpIcon\n    svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74ZM12 4.98C8.2 4.98 5.06 8.14 5.06 11.96C5.06 15.78 8.2 18.94 12 18.94C15.8 18.94 18.94 15.78 18.94 11.96C18.94 8.14 15.8 4.98 12 4.98ZM11.22 15.92V10.36L8.66 13.04L7.7 12.1L12 7.76L16.3 12.1L15.34 13.04L12.78 10.36V15.92H11.22Z\"></path></svg>',\n  },\n  desc: {\n    // ArrowCircleDownFilledIcon\n    svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18ZM12.78 8H11.22V13.52L8.66 10.88L7.7 11.82L12.04 16.16L16.3 11.82L15.34 10.88L12.78 13.58V8Z\"></path></svg>',\n  },\n  descHover: {\n    // ArrowCircleDownIcon\n    svg: '<svg class=\"MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1umw9bq-MuiSvgIcon-root\" focusable=\"false\" aria-hidden=\"true\" viewBox=\"2 2 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 3.18C16.82 3.18 20.82 7.16 20.82 11.96C20.82 16.76 16.82 20.74 12 20.74C7.18 20.74 3.18 16.76 3.18 11.96C3.18 7.16 7.18 3.18 12 3.18ZM12 18.94C15.8 18.94 18.94 15.78 18.94 11.96C18.94 8.14 15.8 4.98 12 4.98C8.2 4.98 5.06 8.14 5.06 11.96C5.06 15.78 8.2 18.94 12 18.94ZM12.78 8V13.56L15.34 10.88L16.3 11.82L12 16.16L7.7 11.82L8.66 10.88L11.22 13.56V8H12.78Z\"></path></svg>',\n  },\n};\n\n/** Maps AG Grid icons to Skoda Flow library icons, overrides icons in AG Grid Theme */\nexport const skodaAgGridIconOverrides = (customIcons?: { name: string; svg: string }[]) => {\n  return {\n    type: 'image' as const,\n    mask: true, // for icons to use AG Grid currentColor\n    icons: {\n      ...agGridIconsDefinition,\n      ...Object.fromEntries((customIcons ?? []).map((icon) => [icon.name, { svg: icon.svg }])),\n    },\n  };\n};\n\nexport const agGridCssIcons = {\n  '.ag-icon-desc:hover::before': {\n    maskImage: `url(data:image/svg+xml;utf8,${encodeURIComponent(agGridIconsDefinition.descHover.svg)})`,\n  },\n  '.ag-icon-asc:hover::before': {\n    maskImage: `url(data:image/svg+xml;utf8,${encodeURIComponent(agGridIconsDefinition.ascHover.svg)})`,\n  },\n};\n"],"names":["agGridIconsDefinition","previous","svg","next","first","last","asc","ascHover","desc","descHover","skodaAgGridIconOverrides","customIcons","type","mask","icons","Object","fromEntries","map","icon","name","agGridCssIcons","maskImage","encodeURIComponent"],"mappings":"AAEO,MAAMA,EAAwB,CACnCC,SAAU,CAERC,IAAK,ySAEPC,KAAM,CAEJD,IAAK,0SAEPE,MAAO,CAELF,IAAK,mTAEPG,KAAM,CAEJH,IAAK,oTAEP,aAAc,CAEZA,IAAK,iRAEPI,IAAK,CAEHJ,IAAK,obAEPK,SAAU,CAERL,IAAK,ujBAEPM,KAAM,CAEJN,IAAK,+aAEPO,UAAW,CAETP,IAAK,mjBAKIQ,EAA4BC,IAChC,CACLC,KAAM,QACNC,MAAM,EACNC,qCACKd,GACAe,OAAOC,aAAaL,QAAAA,EAAe,IAAIM,IAAKC,GAAS,CAACA,EAAKC,KAAM,CAAEjB,IAAKgB,EAAKhB,WAKzEkB,EAAiB,CAC5B,8BAA+B,CAC7BC,UAAW,+BAA+BC,mBAAmBtB,EAAsBS,UAAUP,SAE/F,6BAA8B,CAC5BmB,UAAW,+BAA+BC,mBAAmBtB,EAAsBO,SAASL"}

package/components/carousel/pagination.js

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

package/components/carousel/pagination.js.map

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

package/components/common/imageComponent.d.ts

@@ -20,5 +20,8 @@ interface ImageComponentProps {
      */
     fallbackImage?: string;
 }
+/**
+ * @deprecated use Image component instead
+ */
 declare const ImageComponent: ({ image, alt, fallbackImage, height, width }: ImageComponentProps) => import("react/jsx-runtime").JSX.Element;
 export default ImageComponent;

package/components/common/imageComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"imageComponent.js","sources":["../../../src/components/common/imageComponent.tsx"],"sourcesContent":["import React, { useCallback, useState } from 'react';\n\ninterface ImageComponentProps {\n  /**\n   * The source of the image.\n   */\n  image: string;\n  /**\n   * The alt description of the image.\n   */\n  alt?: string;\n  /**\n   * The height of the image.\n   */\n  height?: string;\n  /**\n   * The width of the image.\n   */\n  width?: string;\n  /**\n   * The source of the onError image.\n   */\n  fallbackImage?: string;\n}\nconst ImageComponent = ({ image, alt, fallbackImage, height, width }: ImageComponentProps) => {\n  const [imgError, setImgError] = useState(false);\n\n  const setImageError = useCallback(() => setImgError(true), []);\n\n  if (!imgError) {\n    return <img src={image} height={height} width={width} alt={alt} onError={setImageError} />;\n  } else {\n    return <img src={fallbackImage} alt={alt} />;\n  }\n};\n\nexport default ImageComponent;\n"],"names":["ImageComponent","image","alt","fallbackImage","height","width","imgError","setImgError","useState","setImageError","useCallback","_jsx","src","onError"],"mappings":"0FAwBA,MAAMA,EAAiB,EAAGC,QAAOC,MAAKC,gBAAeC,SAAQC,YAC3D,MAAOC,EAAUC,GAAeC,GAAS,GAEnCC,EAAgBC,EAAY,IAAMH,GAAY,GAAO,IAE3D,OAGSI,EAAA,MAHJL,EAGI,CAAKM,IAAKT,EAAeD,IAAKA,GAF9B,CAAKU,IAAKX,EAAOG,OAAQA,EAAQC,MAAOA,EAAOH,IAAKA,EAAKW,QAASJ"}
+{"version":3,"file":"imageComponent.js","sources":["../../../src/components/common/imageComponent.tsx"],"sourcesContent":["import React, { useCallback, useState } from 'react';\n\ninterface ImageComponentProps {\n  /**\n   * The source of the image.\n   */\n  image: string;\n  /**\n   * The alt description of the image.\n   */\n  alt?: string;\n  /**\n   * The height of the image.\n   */\n  height?: string;\n  /**\n   * The width of the image.\n   */\n  width?: string;\n  /**\n   * The source of the onError image.\n   */\n  fallbackImage?: string;\n}\n\n/**\n * @deprecated use Image component instead\n */\nconst ImageComponent = ({ image, alt, fallbackImage, height, width }: ImageComponentProps) => {\n  const [imgError, setImgError] = useState(false);\n\n  const setImageError = useCallback(() => setImgError(true), []);\n\n  if (!imgError) {\n    return <img src={image} height={height} width={width} alt={alt} onError={setImageError} />;\n  } else {\n    return <img src={fallbackImage} alt={alt} />;\n  }\n};\n\nexport default ImageComponent;\n"],"names":["ImageComponent","image","alt","fallbackImage","height","width","imgError","setImgError","useState","setImageError","useCallback","_jsx","src","onError"],"mappings":"0FA4BA,MAAMA,EAAiB,EAAGC,QAAOC,MAAKC,gBAAeC,SAAQC,YAC3D,MAAOC,EAAUC,GAAeC,GAAS,GAEnCC,EAAgBC,EAAY,IAAMH,GAAY,GAAO,IAE3D,OAGSI,EAAA,MAHJL,EAGI,CAAKM,IAAKT,EAAeD,IAAKA,GAF9B,CAAKU,IAAKX,EAAOG,OAAQA,EAAQC,MAAOA,EAAOH,IAAKA,EAAKW,QAASJ"}

package/components/footer/FooterAccordion.js

@@ -1,2 +1,2 @@
-import{__rest as o}from"tslib";import{jsxs as r,jsx as t}from"react/jsx-runtime";import{forwardRef as a}from"react";import{useTheme as c,Accordion as e,AccordionSummary as n,AccordionDetails as i,Typography as s}from"@mui/material";import{getInteractiveStyle as l}from"../../materialui/button/interactive.js";const d=a((a,d)=>{var{sx:p,children:m,className:u,label:b,accordionSummaryProps:g,accordionDetailsProps:j,contentProps:f,variant:h="compact"}=a,x=o(a,["sx","children","className","label","accordionSummaryProps","accordionDetailsProps","contentProps","variant"]);const O=null!=g?g:{},{sx:A}=O,y=o(O,["sx"]),C=c();return r(e,Object.assign({ref:d,"data-testid":"FooterAccordion",className:["FooterAccordion-root",`FooterAccordion-variant${h.charAt(0).toUpperCase()}${h.slice(1)}`,u].filter(Boolean).join(", "),sx:Object.assign(Object.assign({color:"currentColor"},"compact"===h&&{border:"none"}),p)},x,{children:[t(n,Object.assign({"data-testid":"FooterAccordion.label","aria-controls":"footer-accordion",id:"footer-accordion",sx:Object.assign(Object.assign({color:"currentColor","&:hover":{color:"currentColor","& .MuiAccordion-IconButton":{backgroundColor:C.palette.transparent.tertiary}},"& .MuiAccordion-IconButton":Object.assign({height:"32px",width:"32px"},l({backgroundColor:"transparent",color:C.palette.onSurface.os0},{color:C.palette.onSurface.os0,backgroundColor:C.palette.transparent.tertiary}))},"compact"===h&&Object.assign(Object.assign({},C.typography.caption2),{p:"0",gap:1.5,justifyContent:"flex-start","& .MuiAccordionSummary-content":{flexGrow:"0"}})),A)},y,{children:b})),t(i,Object.assign({"data-testid":"FooterAccordion.children"},j,{children:t(s,Object.assign({variant:"disclaimer1"},f,{children:m}))}))]}))});export{d as FooterAccordion};
+import{__rest as o}from"tslib";import{jsxs as r,jsx as t}from"react/jsx-runtime";import{forwardRef as a}from"react";import{useTheme as c,Accordion as e,AccordionSummary as n,AccordionDetails as i,Typography as s}from"@mui/material";import{getInteractiveStyle as l}from"../../materialui/button/interactive.js";const d=a((a,d)=>{var{sx:p,children:m,className:u,label:b,accordionSummaryProps:g,accordionDetailsProps:j,contentProps:f,variant:h="compact"}=a,x=o(a,["sx","children","className","label","accordionSummaryProps","accordionDetailsProps","contentProps","variant"]);const O=null!=g?g:{},{sx:A}=O,y=o(O,["sx"]),C=c();return r(e,Object.assign({ref:d,"data-testid":"FooterAccordion",className:["FooterAccordion-root",`FooterAccordion-variant${h.charAt(0).toUpperCase()}${h.slice(1)}`,u].filter(Boolean).join(" "),sx:Object.assign(Object.assign({color:"currentColor"},"compact"===h&&{border:"none"}),p)},x,{children:[t(n,Object.assign({"data-testid":"FooterAccordion.label","aria-controls":"footer-accordion",id:"footer-accordion",sx:Object.assign(Object.assign({color:"currentColor","&:hover":{color:"currentColor","& .MuiAccordion-IconButton":{backgroundColor:C.palette.transparent.tertiary}},"& .MuiAccordion-IconButton":Object.assign({height:"32px",width:"32px"},l({backgroundColor:"transparent",color:C.palette.onSurface.os0},{color:C.palette.onSurface.os0,backgroundColor:C.palette.transparent.tertiary}))},"compact"===h&&Object.assign(Object.assign({},C.typography.caption2),{p:"0",gap:1.5,justifyContent:"flex-start","& .MuiAccordionSummary-content":{flexGrow:"0"}})),A)},y,{children:b})),t(i,Object.assign({"data-testid":"FooterAccordion.children"},j,{children:t(s,Object.assign({variant:"disclaimer1"},f,{children:m}))}))]}))});export{d as FooterAccordion};
 //# sourceMappingURL=FooterAccordion.js.map

package/components/footer/FooterAccordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"FooterAccordion.js","sources":["../../../src/components/footer/FooterAccordion.tsx"],"sourcesContent":["import React, { FC, forwardRef, ReactNode, ElementType } from 'react';\nimport {\n  Accordion,\n  AccordionSummary,\n  AccordionDetails,\n  AccordionProps,\n  AccordionSummaryProps,\n  AccordionDetailsProps,\n  Typography,\n  TypographyProps,\n  useTheme,\n} from '@mui/material';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport interface FooterAccordionProps extends Omit<AccordionProps, 'variant'> {\n  /**\n   * Label of the Accordion\n   */\n  label?: ReactNode;\n  /**\n   * Props applied to the wrapper of label\n   */\n  accordionSummaryProps?: AccordionSummaryProps<ElementType>;\n  /**\n   * Props applied to the content of the accodion\n   */\n  accordionDetailsProps?: AccordionDetailsProps;\n  /**\n   * Properties applied to wrapper of children\n   */\n  contentProps?: TypographyProps<ElementType>;\n  /**\n   * Variant of accordion\n   * @default compact\n   */\n  variant?: 'compact' | 'standard';\n}\n\n/**\n * Collapsible footer section\n */\nexport const FooterAccordion: FC<FooterAccordionProps> = forwardRef(\n  (\n    {\n      sx,\n      children,\n      className,\n      label,\n      accordionSummaryProps,\n      accordionDetailsProps,\n      contentProps,\n      variant = 'compact',\n      ...rest\n    },\n    ref,\n  ) => {\n    const { sx: accordionSummarySx, ...restAccordionSummary } = accordionSummaryProps ?? {};\n    const theme = useTheme();\n\n    return (\n      <Accordion\n        ref={ref}\n        data-testid=\"FooterAccordion\"\n        className={[\n          'FooterAccordion-root',\n          `FooterAccordion-variant${variant.charAt(0).toUpperCase()}${variant.slice(1)}`,\n          className,\n        ]\n          .filter(Boolean)\n          .join(', ')}\n        sx={{\n          // recolor to dark mode\n          color: 'currentColor',\n          ...(variant === 'compact' && {\n            border: 'none',\n          }),\n          ...sx,\n        }}\n        {...rest}\n      >\n        <AccordionSummary\n          data-testid=\"FooterAccordion.label\"\n          aria-controls=\"footer-accordion\"\n          id=\"footer-accordion\"\n          sx={{\n            // recolor to dark mode\n            color: 'currentColor',\n            '&:hover': {\n              color: 'currentColor',\n              // hover over IconButton\n              '& .MuiAccordion-IconButton': {\n                backgroundColor: theme.palette.transparent.tertiary,\n              },\n            },\n            // change variant of icon button to small & white\n            '& .MuiAccordion-IconButton': {\n              height: '32px',\n              width: '32px',\n              ...getInteractiveStyle(\n                {\n                  backgroundColor: 'transparent',\n                  color: theme.palette.onSurface.os0,\n                },\n                {\n                  color: theme.palette.onSurface.os0,\n                  backgroundColor: theme.palette.transparent.tertiary,\n                },\n              ),\n            },\n            ...(variant === 'compact' && {\n              ...theme.typography.caption2,\n              p: '0',\n              gap: 1.5,\n              justifyContent: 'flex-start',\n              // move icon next to label\n              '& .MuiAccordionSummary-content': {\n                flexGrow: '0',\n              },\n            }),\n            ...accordionSummarySx,\n          }}\n          {...restAccordionSummary}\n        >\n          {label}\n        </AccordionSummary>\n        <AccordionDetails data-testid=\"FooterAccordion.children\" {...accordionDetailsProps}>\n          <Typography variant=\"disclaimer1\" {...contentProps}>\n            {children}\n          </Typography>\n        </AccordionDetails>\n      </Accordion>\n    );\n  },\n);\n"],"names":["FooterAccordion","forwardRef","_a","ref","sx","children","className","label","accordionSummaryProps","accordionDetailsProps","contentProps","variant","rest","__rest","_b","accordionSummarySx","restAccordionSummary","theme","useTheme","_jsxs","Accordion","Object","assign","charAt","toUpperCase","slice","filter","Boolean","join","color","border","_jsx","AccordionSummary","id","backgroundColor","palette","transparent","tertiary","height","width","getInteractiveStyle","onSurface","os0","typography","caption2","p","gap","justifyContent","flexGrow","AccordionDetails","Typography"],"mappings":"qTAyCO,MAAMA,EAA4CC,EACvD,CACEC,EAWAC,SAXAC,GACEA,EAAEC,SACFA,EAAQC,UACRA,EAASC,MACTA,EAAKC,sBACLA,EAAqBC,sBACrBA,EAAqBC,aACrBA,EAAYC,QACZA,EAAU,aACPC,EAAIC,EAAAX,EATT,CAAA,KAAA,WAAA,YAAA,QAAA,wBAAA,wBAAA,eAAA,YAaA,MAAMY,EAAsDN,QAAAA,EAAyB,IAA7EJ,GAAIW,GAAkBD,EAAKE,EAAoBH,EAAAC,EAAjD,CAAA,OACAG,EAAQC,IAEd,OACEC,EAACC,EAASC,OAAAC,OAAA,CACRnB,IAAKA,EAAG,cACI,kBACZG,UAAW,CACT,uBACA,0BAA0BK,EAAQY,OAAO,GAAGC,gBAAgBb,EAAQc,MAAM,KAC1EnB,GAECoB,OAAOC,SACPC,KAAK,MACRxB,GAAEiB,OAAAC,OAAAD,OAAAC,OAAA,CAEAO,MAAO,gBACS,YAAZlB,GAAyB,CAC3BmB,OAAQ,SAEP1B,IAEDQ,EAAI,CAAAP,SAAA,CAER0B,EAACC,EAAgBX,OAAAC,OAAA,CAAA,cACH,wBAAuB,gBACrB,mBACdW,GAAG,mBACH7B,GAAEiB,OAAAC,OAAAD,OAAAC,OAAA,CAEAO,MAAO,eACP,UAAW,CACTA,MAAO,eAEP,6BAA8B,CAC5BK,gBAAiBjB,EAAMkB,QAAQC,YAAYC,WAI/C,6BAA4BhB,OAAAC,OAAA,CAC1BgB,OAAQ,OACRC,MAAO,QACJC,EACD,CACEN,gBAAiB,cACjBL,MAAOZ,EAAMkB,QAAQM,UAAUC,KAEjC,CACEb,MAAOZ,EAAMkB,QAAQM,UAAUC,IAC/BR,gBAAiBjB,EAAMkB,QAAQC,YAAYC,aAIjC,YAAZ1B,GAAqBU,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EACpBL,EAAM0B,WAAWC,WACpBC,EAAG,IACHC,IAAK,IACLC,eAAgB,aAEhB,iCAAkC,CAChCC,SAAU,QAGXjC,IAEDC,EAAoB,CAAAX,SAEvBE,KAEHwB,EAACkB,EAAgB5B,OAAAC,OAAA,CAAA,cAAa,4BAA+Bb,EAAqB,CAAAJ,SAChF0B,EAACmB,EAAU7B,OAAAC,OAAA,CAACX,QAAQ,eAAkBD,EAAY,CAAAL,SAC/CA"}
+{"version":3,"file":"FooterAccordion.js","sources":["../../../src/components/footer/FooterAccordion.tsx"],"sourcesContent":["import React, { FC, forwardRef, ReactNode, ElementType } from 'react';\nimport {\n  Accordion,\n  AccordionSummary,\n  AccordionDetails,\n  AccordionProps,\n  AccordionSummaryProps,\n  AccordionDetailsProps,\n  Typography,\n  TypographyProps,\n  useTheme,\n} from '@mui/material';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport interface FooterAccordionProps extends Omit<AccordionProps, 'variant'> {\n  /**\n   * Label of the Accordion\n   */\n  label?: ReactNode;\n  /**\n   * Props applied to the wrapper of label\n   */\n  accordionSummaryProps?: AccordionSummaryProps<ElementType>;\n  /**\n   * Props applied to the content of the accodion\n   */\n  accordionDetailsProps?: AccordionDetailsProps;\n  /**\n   * Properties applied to wrapper of children\n   */\n  contentProps?: TypographyProps<ElementType>;\n  /**\n   * Variant of accordion\n   * @default compact\n   */\n  variant?: 'compact' | 'standard';\n}\n\n/**\n * Collapsible footer section\n */\nexport const FooterAccordion: FC<FooterAccordionProps> = forwardRef(\n  (\n    {\n      sx,\n      children,\n      className,\n      label,\n      accordionSummaryProps,\n      accordionDetailsProps,\n      contentProps,\n      variant = 'compact',\n      ...rest\n    },\n    ref,\n  ) => {\n    const { sx: accordionSummarySx, ...restAccordionSummary } = accordionSummaryProps ?? {};\n    const theme = useTheme();\n\n    return (\n      <Accordion\n        ref={ref}\n        data-testid=\"FooterAccordion\"\n        className={[\n          'FooterAccordion-root',\n          `FooterAccordion-variant${variant.charAt(0).toUpperCase()}${variant.slice(1)}`,\n          className,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n        sx={{\n          // recolor to dark mode\n          color: 'currentColor',\n          ...(variant === 'compact' && {\n            border: 'none',\n          }),\n          ...sx,\n        }}\n        {...rest}\n      >\n        <AccordionSummary\n          data-testid=\"FooterAccordion.label\"\n          aria-controls=\"footer-accordion\"\n          id=\"footer-accordion\"\n          sx={{\n            // recolor to dark mode\n            color: 'currentColor',\n            '&:hover': {\n              color: 'currentColor',\n              // hover over IconButton\n              '& .MuiAccordion-IconButton': {\n                backgroundColor: theme.palette.transparent.tertiary,\n              },\n            },\n            // change variant of icon button to small & white\n            '& .MuiAccordion-IconButton': {\n              height: '32px',\n              width: '32px',\n              ...getInteractiveStyle(\n                {\n                  backgroundColor: 'transparent',\n                  color: theme.palette.onSurface.os0,\n                },\n                {\n                  color: theme.palette.onSurface.os0,\n                  backgroundColor: theme.palette.transparent.tertiary,\n                },\n              ),\n            },\n            ...(variant === 'compact' && {\n              ...theme.typography.caption2,\n              p: '0',\n              gap: 1.5,\n              justifyContent: 'flex-start',\n              // move icon next to label\n              '& .MuiAccordionSummary-content': {\n                flexGrow: '0',\n              },\n            }),\n            ...accordionSummarySx,\n          }}\n          {...restAccordionSummary}\n        >\n          {label}\n        </AccordionSummary>\n        <AccordionDetails data-testid=\"FooterAccordion.children\" {...accordionDetailsProps}>\n          <Typography variant=\"disclaimer1\" {...contentProps}>\n            {children}\n          </Typography>\n        </AccordionDetails>\n      </Accordion>\n    );\n  },\n);\n"],"names":["FooterAccordion","forwardRef","_a","ref","sx","children","className","label","accordionSummaryProps","accordionDetailsProps","contentProps","variant","rest","__rest","_b","accordionSummarySx","restAccordionSummary","theme","useTheme","_jsxs","Accordion","Object","assign","charAt","toUpperCase","slice","filter","Boolean","join","color","border","_jsx","AccordionSummary","id","backgroundColor","palette","transparent","tertiary","height","width","getInteractiveStyle","onSurface","os0","typography","caption2","p","gap","justifyContent","flexGrow","AccordionDetails","Typography"],"mappings":"qTAyCO,MAAMA,EAA4CC,EACvD,CACEC,EAWAC,SAXAC,GACEA,EAAEC,SACFA,EAAQC,UACRA,EAASC,MACTA,EAAKC,sBACLA,EAAqBC,sBACrBA,EAAqBC,aACrBA,EAAYC,QACZA,EAAU,aACPC,EAAIC,EAAAX,EATT,CAAA,KAAA,WAAA,YAAA,QAAA,wBAAA,wBAAA,eAAA,YAaA,MAAMY,EAAsDN,QAAAA,EAAyB,IAA7EJ,GAAIW,GAAkBD,EAAKE,EAAoBH,EAAAC,EAAjD,CAAA,OACAG,EAAQC,IAEd,OACEC,EAACC,EAASC,OAAAC,OAAA,CACRnB,IAAKA,EAAG,cACI,kBACZG,UAAW,CACT,uBACA,0BAA0BK,EAAQY,OAAO,GAAGC,gBAAgBb,EAAQc,MAAM,KAC1EnB,GAECoB,OAAOC,SACPC,KAAK,KACRxB,GAAEiB,OAAAC,OAAAD,OAAAC,OAAA,CAEAO,MAAO,gBACS,YAAZlB,GAAyB,CAC3BmB,OAAQ,SAEP1B,IAEDQ,EAAI,CAAAP,SAAA,CAER0B,EAACC,EAAgBX,OAAAC,OAAA,CAAA,cACH,wBAAuB,gBACrB,mBACdW,GAAG,mBACH7B,GAAEiB,OAAAC,OAAAD,OAAAC,OAAA,CAEAO,MAAO,eACP,UAAW,CACTA,MAAO,eAEP,6BAA8B,CAC5BK,gBAAiBjB,EAAMkB,QAAQC,YAAYC,WAI/C,6BAA4BhB,OAAAC,OAAA,CAC1BgB,OAAQ,OACRC,MAAO,QACJC,EACD,CACEN,gBAAiB,cACjBL,MAAOZ,EAAMkB,QAAQM,UAAUC,KAEjC,CACEb,MAAOZ,EAAMkB,QAAQM,UAAUC,IAC/BR,gBAAiBjB,EAAMkB,QAAQC,YAAYC,aAIjC,YAAZ1B,GAAqBU,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EACpBL,EAAM0B,WAAWC,WACpBC,EAAG,IACHC,IAAK,IACLC,eAAgB,aAEhB,iCAAkC,CAChCC,SAAU,QAGXjC,IAEDC,EAAoB,CAAAX,SAEvBE,KAEHwB,EAACkB,EAAgB5B,OAAAC,OAAA,CAAA,cAAa,4BAA+Bb,EAAqB,CAAAJ,SAChF0B,EAACmB,EAAU7B,OAAAC,OAAA,CAACX,QAAQ,eAAkBD,EAAY,CAAAL,SAC/CA"}

package/components/footer/FooterSectionContact.js

@@ -1,2 +1,2 @@
-import{__rest as t}from"tslib";import{jsxs as e,jsx as s}from"react/jsx-runtime";import{forwardRef as o}from"react";import{Box as a}from"@mui/material";const l=o((o,l)=>{var{sx:n,children:c,className:r,contactSlot:i,contactSlotProps:x,socialSlot:f,socialSlotProps:p}=o,m=t(o,["sx","children","className","contactSlot","contactSlotProps","socialSlot","socialSlotProps"]);const g=null!=x?x:{},{sx:d}=g,S=t(g,["sx"]),j=null!=p?p:{},{sx:u}=j,b=t(j,["sx"]);return e(a,Object.assign({sx:Object.assign({display:"flex",alignItems:{xs:"flex-start",lg:"center"},justifyContent:"space-between",flexWrap:"wrap",gap:{xs:4,lg:2},flexDirection:{xs:"column",lg:"row"}},n),ref:l,"data-testid":"FooterSectionContact",className:["FlowSectionContact-root",r].filter(Boolean).join(", ")},m,{children:[e(a,Object.assign({sx:Object.assign({display:"flex",alignItems:{xs:"flex-start",lg:"center"},justifyContent:"flex-start",flexWrap:"wrap",gap:2,flexDirection:{xs:"column",lg:"row"}},d),"data-testid":"FooterSectionContact.contact"},S,{children:[c,i]})),s(a,Object.assign({sx:Object.assign({display:"flex",alignItems:"center",justifyContent:{xs:"flex-start",lg:"flex-end"},flexWrap:"wrap",gap:.5},u),"data-testid":"FooterSectionContact.social"},b,{children:f}))]}))});export{l as FooterSectionContact};
+import{__rest as t}from"tslib";import{jsxs as e,jsx as s}from"react/jsx-runtime";import{forwardRef as o}from"react";import{Box as a}from"@mui/material";const l=o((o,l)=>{var{sx:n,children:c,className:r,contactSlot:i,contactSlotProps:x,socialSlot:f,socialSlotProps:p}=o,m=t(o,["sx","children","className","contactSlot","contactSlotProps","socialSlot","socialSlotProps"]);const g=null!=x?x:{},{sx:d}=g,S=t(g,["sx"]),j=null!=p?p:{},{sx:u}=j,b=t(j,["sx"]);return e(a,Object.assign({sx:Object.assign({display:"flex",alignItems:{xs:"flex-start",lg:"center"},justifyContent:"space-between",flexWrap:"wrap",gap:{xs:4,lg:2},flexDirection:{xs:"column",lg:"row"}},n),ref:l,"data-testid":"FooterSectionContact",className:["FlowSectionContact-root",r].filter(Boolean).join(" ")},m,{children:[e(a,Object.assign({sx:Object.assign({display:"flex",alignItems:{xs:"flex-start",lg:"center"},justifyContent:"flex-start",flexWrap:"wrap",gap:2,flexDirection:{xs:"column",lg:"row"}},d),"data-testid":"FooterSectionContact.contact"},S,{children:[c,i]})),s(a,Object.assign({sx:Object.assign({display:"flex",alignItems:"center",justifyContent:{xs:"flex-start",lg:"flex-end"},flexWrap:"wrap",gap:.5},u),"data-testid":"FooterSectionContact.social"},b,{children:f}))]}))});export{l as FooterSectionContact};
 //# sourceMappingURL=FooterSectionContact.js.map

package/components/footer/FooterSectionContact.js.map

@@ -1 +1 @@
-{"version":3,"file":"FooterSectionContact.js","sources":["../../../src/components/footer/FooterSectionContact.tsx"],"sourcesContent":["import React, { ElementType, FC, forwardRef, ReactNode } from 'react';\nimport { Box, BoxProps } from '@mui/material';\n\nexport interface FooterSectionContactProps extends BoxProps<ElementType> {\n  /**\n   * Items that should be rendered in left side\n   */\n  contactSlot?: ReactNode;\n  /**\n   * Properties applied to the contact wrapper\n   */\n  contactSlotProps?: BoxProps<ElementType>;\n  /**\n   * Items that should be rendered in right side\n   */\n  socialSlot?: ReactNode;\n  /**\n   * Properties applied to the social wrapper\n   */\n  socialSlotProps?: BoxProps<ElementType>;\n}\n\n/**\n * Section for the main contact links and social media\n */\nexport const FooterSectionContact: FC<FooterSectionContactProps> = forwardRef(\n  ({ sx, children, className, contactSlot, contactSlotProps, socialSlot, socialSlotProps, ...rest }, ref) => {\n    const { sx: contactSlotSx, ...restContactSlot } = contactSlotProps ?? {};\n    const { sx: socialSlotSx, ...restSocialSlot } = socialSlotProps ?? {};\n\n    return (\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: { xs: 'flex-start', lg: 'center' },\n          justifyContent: 'space-between',\n          flexWrap: 'wrap',\n          gap: { xs: 4, lg: 2 },\n          flexDirection: { xs: 'column', lg: 'row' },\n          ...sx,\n        }}\n        ref={ref}\n        data-testid=\"FooterSectionContact\"\n        className={['FlowSectionContact-root', className].filter(Boolean).join(', ')}\n        {...rest}\n      >\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: { xs: 'flex-start', lg: 'center' },\n            justifyContent: 'flex-start',\n            flexWrap: 'wrap',\n            gap: 2,\n            flexDirection: {\n              xs: 'column',\n              lg: 'row',\n            },\n            ...contactSlotSx,\n          }}\n          data-testid=\"FooterSectionContact.contact\"\n          {...restContactSlot}\n        >\n          {children}\n          {contactSlot}\n        </Box>\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: 'center',\n            justifyContent: { xs: 'flex-start', lg: 'flex-end' },\n            flexWrap: 'wrap',\n            gap: 0.5,\n            ...socialSlotSx,\n          }}\n          data-testid=\"FooterSectionContact.social\"\n          {...restSocialSlot}\n        >\n          {socialSlot}\n        </Box>\n      </Box>\n    );\n  },\n);\n"],"names":["FooterSectionContact","forwardRef","_a","ref","sx","children","className","contactSlot","contactSlotProps","socialSlot","socialSlotProps","rest","__rest","_b","contactSlotSx","restContactSlot","_c","socialSlotSx","restSocialSlot","_jsxs","Box","Object","assign","display","alignItems","xs","lg","justifyContent","flexWrap","gap","flexDirection","filter","Boolean","join","_jsx"],"mappings":"wJAyBO,MAAMA,EAAsDC,EACjE,CAACC,EAAkGC,KAAlG,IAAAC,GAAEA,EAAEC,SAAEA,EAAQC,UAAEA,EAASC,YAAEA,EAAWC,iBAAEA,EAAgBC,WAAEA,EAAUC,gBAAEA,GAAeR,EAAKS,EAAIC,EAAAV,EAA9F,+FACC,MAAMW,EAA4CL,QAAAA,EAAoB,IAA9DJ,GAAIU,GAAaD,EAAKE,EAAeH,EAAAC,EAAvC,CAAA,OACAG,EAA0CN,QAAAA,EAAmB,IAA3DN,GAAIa,GAAYD,EAAKE,EAAcN,EAAAI,EAArC,CAAA,OAEN,OACEG,EAACC,EAAGC,OAAAC,OAAA,CACFlB,GAAEiB,OAAAC,OAAA,CACAC,QAAS,OACTC,WAAY,CAAEC,GAAI,aAAcC,GAAI,UACpCC,eAAgB,gBAChBC,SAAU,OACVC,IAAK,CAAEJ,GAAI,EAAGC,GAAI,GAClBI,cAAe,CAAEL,GAAI,SAAUC,GAAI,QAChCtB,GAELD,IAAKA,EAAG,cACI,uBACZG,UAAW,CAAC,0BAA2BA,GAAWyB,OAAOC,SAASC,KAAK,OACnEtB,EAAI,CAAAN,SAAA,CAERc,EAACC,EAAGC,OAAAC,OAAA,CACFlB,GAAEiB,OAAAC,OAAA,CACAC,QAAS,OACTC,WAAY,CAAEC,GAAI,aAAcC,GAAI,UACpCC,eAAgB,aAChBC,SAAU,OACVC,IAAK,EACLC,cAAe,CACbL,GAAI,SACJC,GAAI,QAEHZ,GAAa,cAEN,gCACRC,aAEHV,EACAE,MAEH2B,EAACd,EAAGC,OAAAC,OAAA,CACFlB,GAAEiB,OAAAC,OAAA,CACAC,QAAS,OACTC,WAAY,SACZG,eAAgB,CAAEF,GAAI,aAAcC,GAAI,YACxCE,SAAU,OACVC,IAAK,IACFZ,GAAY,cAEL,+BACRC,EAAc,CAAAb,SAEjBI"}
+{"version":3,"file":"FooterSectionContact.js","sources":["../../../src/components/footer/FooterSectionContact.tsx"],"sourcesContent":["import React, { ElementType, FC, forwardRef, ReactNode } from 'react';\nimport { Box, BoxProps } from '@mui/material';\n\nexport interface FooterSectionContactProps extends BoxProps<ElementType> {\n  /**\n   * Items that should be rendered in left side\n   */\n  contactSlot?: ReactNode;\n  /**\n   * Properties applied to the contact wrapper\n   */\n  contactSlotProps?: BoxProps<ElementType>;\n  /**\n   * Items that should be rendered in right side\n   */\n  socialSlot?: ReactNode;\n  /**\n   * Properties applied to the social wrapper\n   */\n  socialSlotProps?: BoxProps<ElementType>;\n}\n\n/**\n * Section for the main contact links and social media\n */\nexport const FooterSectionContact: FC<FooterSectionContactProps> = forwardRef(\n  ({ sx, children, className, contactSlot, contactSlotProps, socialSlot, socialSlotProps, ...rest }, ref) => {\n    const { sx: contactSlotSx, ...restContactSlot } = contactSlotProps ?? {};\n    const { sx: socialSlotSx, ...restSocialSlot } = socialSlotProps ?? {};\n\n    return (\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: { xs: 'flex-start', lg: 'center' },\n          justifyContent: 'space-between',\n          flexWrap: 'wrap',\n          gap: { xs: 4, lg: 2 },\n          flexDirection: { xs: 'column', lg: 'row' },\n          ...sx,\n        }}\n        ref={ref}\n        data-testid=\"FooterSectionContact\"\n        className={['FlowSectionContact-root', className].filter(Boolean).join(' ')}\n        {...rest}\n      >\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: { xs: 'flex-start', lg: 'center' },\n            justifyContent: 'flex-start',\n            flexWrap: 'wrap',\n            gap: 2,\n            flexDirection: {\n              xs: 'column',\n              lg: 'row',\n            },\n            ...contactSlotSx,\n          }}\n          data-testid=\"FooterSectionContact.contact\"\n          {...restContactSlot}\n        >\n          {children}\n          {contactSlot}\n        </Box>\n        <Box\n          sx={{\n            display: 'flex',\n            alignItems: 'center',\n            justifyContent: { xs: 'flex-start', lg: 'flex-end' },\n            flexWrap: 'wrap',\n            gap: 0.5,\n            ...socialSlotSx,\n          }}\n          data-testid=\"FooterSectionContact.social\"\n          {...restSocialSlot}\n        >\n          {socialSlot}\n        </Box>\n      </Box>\n    );\n  },\n);\n"],"names":["FooterSectionContact","forwardRef","_a","ref","sx","children","className","contactSlot","contactSlotProps","socialSlot","socialSlotProps","rest","__rest","_b","contactSlotSx","restContactSlot","_c","socialSlotSx","restSocialSlot","_jsxs","Box","Object","assign","display","alignItems","xs","lg","justifyContent","flexWrap","gap","flexDirection","filter","Boolean","join","_jsx"],"mappings":"wJAyBO,MAAMA,EAAsDC,EACjE,CAACC,EAAkGC,KAAlG,IAAAC,GAAEA,EAAEC,SAAEA,EAAQC,UAAEA,EAASC,YAAEA,EAAWC,iBAAEA,EAAgBC,WAAEA,EAAUC,gBAAEA,GAAeR,EAAKS,EAAIC,EAAAV,EAA9F,+FACC,MAAMW,EAA4CL,QAAAA,EAAoB,IAA9DJ,GAAIU,GAAaD,EAAKE,EAAeH,EAAAC,EAAvC,CAAA,OACAG,EAA0CN,QAAAA,EAAmB,IAA3DN,GAAIa,GAAYD,EAAKE,EAAcN,EAAAI,EAArC,CAAA,OAEN,OACEG,EAACC,EAAGC,OAAAC,OAAA,CACFlB,GAAEiB,OAAAC,OAAA,CACAC,QAAS,OACTC,WAAY,CAAEC,GAAI,aAAcC,GAAI,UACpCC,eAAgB,gBAChBC,SAAU,OACVC,IAAK,CAAEJ,GAAI,EAAGC,GAAI,GAClBI,cAAe,CAAEL,GAAI,SAAUC,GAAI,QAChCtB,GAELD,IAAKA,EAAG,cACI,uBACZG,UAAW,CAAC,0BAA2BA,GAAWyB,OAAOC,SAASC,KAAK,MACnEtB,EAAI,CAAAN,SAAA,CAERc,EAACC,EAAGC,OAAAC,OAAA,CACFlB,GAAEiB,OAAAC,OAAA,CACAC,QAAS,OACTC,WAAY,CAAEC,GAAI,aAAcC,GAAI,UACpCC,eAAgB,aAChBC,SAAU,OACVC,IAAK,EACLC,cAAe,CACbL,GAAI,SACJC,GAAI,QAEHZ,GAAa,cAEN,gCACRC,aAEHV,EACAE,MAEH2B,EAACd,EAAGC,OAAAC,OAAA,CACFlB,GAAEiB,OAAAC,OAAA,CACAC,QAAS,OACTC,WAAY,SACZG,eAAgB,CAAEF,GAAI,aAAcC,GAAI,YACxCE,SAAU,OACVC,IAAK,IACFZ,GAAY,cAEL,+BACRC,EAAc,CAAAb,SAEjBI"}

package/components/footer/FooterSectionLinks.js

@@ -1,2 +1,2 @@
-import{__rest as t}from"tslib";import{jsxs as e,jsx as o}from"react/jsx-runtime";import{forwardRef as s}from"react";import{useTheme as r,Box as n,Typography as i,Button as l}from"@mui/material";const a=s((s,a)=>{var{sx:c,children:x,className:p,textSlot:g,buttonSlot:u,buttonSlotProps:d,textTypographyProps:m,buttonProps:b,linksWrapperProps:f}=s,h=t(s,["sx","children","className","textSlot","buttonSlot","buttonSlotProps","textTypographyProps","buttonProps","linksWrapperProps"]);const j=null!=m?m:{},{sx:S}=j,y=t(j,["sx"]),O=null!=f?f:{},{sx:k}=O,w=t(O,["sx"]),P=null!=d?d:{},{sx:L}=P,F=t(P,["sx"]),v=null!=b?b:{},{label:W}=v,C=t(v,["label"]),D=r();return e(n,Object.assign({sx:Object.assign({display:"flex",alignItems:{xs:"flex-start",lg:"center"},justifyContent:"space-between",flexWrap:"wrap",gap:2,flexDirection:{xs:"column",lg:"row"}},c),ref:a,"data-testid":"FooterSectionLinks",className:["FooterSectionLinks-root",p].filter(Boolean).join(", ")},h,{children:[g&&o(i,Object.assign({variant:"disclaimer1",sx:Object.assign(Object.assign({my:{xs:2,lg:0},color:"onSurface.os200"},x&&{display:"inline-flex",alignItems:"center",justifyContent:"flex-start",mr:{lg:2},"&:after":{content:{xs:"none",lg:"''"},display:"block",height:"14px",width:"1px",backgroundColor:"onSurface.os700",ml:4},order:{xs:1,lg:0}}),S),"data-testid":"FooterSectionLinks.text"},y,{children:g})),x&&o(n,Object.assign({sx:Object.assign({display:"flex",alignItems:{xs:"flex-start",lg:"center"},flexDirection:{xs:"column",lg:"row"},flexWrap:"wrap",flexGrow:"1",gap:{xs:2,lg:3},"& .MuiButton-root":{alignSelf:{xs:"stretch",lg:"auto"}},"& .MuiLink-root":Object.assign(Object.assign({},D.typography.disclaimer1),{p:0,"&, &:hover":{textDecoration:"underline",color:"common.white"}})},k),"data-testid":"FooterSectionLinks.content"},w,{children:x})),(u||W)&&o(n,Object.assign({"data-testid":"FooterSectionLinks.button",sx:Object.assign({order:2},L)},F,{children:u||o(l,Object.assign({variant:"shortcut",color:"inherit"},C,{children:W}))}))]}))});export{a as FooterSectionLinks};
+import{__rest as t}from"tslib";import{jsxs as e,jsx as o}from"react/jsx-runtime";import{forwardRef as s}from"react";import{useTheme as r,Box as n,Typography as i,Button as l}from"@mui/material";const a=s((s,a)=>{var{sx:c,children:x,className:p,textSlot:g,buttonSlot:u,buttonSlotProps:d,textTypographyProps:m,buttonProps:b,linksWrapperProps:f}=s,h=t(s,["sx","children","className","textSlot","buttonSlot","buttonSlotProps","textTypographyProps","buttonProps","linksWrapperProps"]);const j=null!=m?m:{},{sx:S}=j,y=t(j,["sx"]),O=null!=f?f:{},{sx:k}=O,w=t(O,["sx"]),P=null!=d?d:{},{sx:L}=P,F=t(P,["sx"]),v=null!=b?b:{},{label:W}=v,C=t(v,["label"]),D=r();return e(n,Object.assign({sx:Object.assign({display:"flex",alignItems:{xs:"flex-start",lg:"center"},justifyContent:"space-between",flexWrap:"wrap",gap:2,flexDirection:{xs:"column",lg:"row"}},c),ref:a,"data-testid":"FooterSectionLinks",className:["FooterSectionLinks-root",p].filter(Boolean).join(" ")},h,{children:[g&&o(i,Object.assign({variant:"disclaimer1",sx:Object.assign(Object.assign({my:{xs:2,lg:0},color:"onSurface.os200"},x&&{display:"inline-flex",alignItems:"center",justifyContent:"flex-start",mr:{lg:2},"&:after":{content:{xs:"none",lg:"''"},display:"block",height:"14px",width:"1px",backgroundColor:"onSurface.os700",ml:4},order:{xs:1,lg:0}}),S),"data-testid":"FooterSectionLinks.text"},y,{children:g})),x&&o(n,Object.assign({sx:Object.assign({display:"flex",alignItems:{xs:"flex-start",lg:"center"},flexDirection:{xs:"column",lg:"row"},flexWrap:"wrap",flexGrow:"1",gap:{xs:2,lg:3},"& .MuiButton-root":{alignSelf:{xs:"stretch",lg:"auto"}},"& .MuiLink-root":Object.assign(Object.assign({},D.typography.disclaimer1),{p:0,"&, &:hover":{textDecoration:"underline",color:"common.white"}})},k),"data-testid":"FooterSectionLinks.content"},w,{children:x})),(u||W)&&o(n,Object.assign({"data-testid":"FooterSectionLinks.button",sx:Object.assign({order:2},L)},F,{children:u||o(l,Object.assign({variant:"shortcut",color:"inherit"},C,{children:W}))}))]}))});export{a as FooterSectionLinks};
 //# sourceMappingURL=FooterSectionLinks.js.map

package/components/footer/FooterSectionLinks.js.map

@@ -1 +1 @@
-{"version":3,"file":"FooterSectionLinks.js","sources":["../../../src/components/footer/FooterSectionLinks.tsx"],"sourcesContent":["import React, { ElementType, FC, forwardRef } from 'react';\nimport { Box, BoxProps, Button, ButtonProps, Typography, TypographyProps, useTheme } from '@mui/material';\n\nexport interface FooterSectionLinksProps extends BoxProps<ElementType> {\n  /**\n   * Text wrapped by styled Typography component\n   */\n  textSlot?: React.ReactNode;\n  /**\n   * Properties applied to text typography\n   */\n  textTypographyProps?: TypographyProps<ElementType>;\n  /**\n   * Alternative to providing button props\n   */\n  buttonSlot?: React.ReactNode;\n  /**\n   * Properties applied to button wrapper\n   */\n  buttonSlotProps?: BoxProps<ElementType>;\n  /**\n   * Props for button\n   */\n  buttonProps?: ButtonProps & { label?: React.ReactNode };\n  /**\n   * Properties applied to link container\n   */\n  linksWrapperProps?: BoxProps<ElementType>;\n}\n\n/**\n * Section for the secondary links, copyright and optional button\n */\nexport const FooterSectionLinks: FC<FooterSectionLinksProps> = forwardRef(\n  (\n    {\n      sx,\n      children,\n      className,\n      textSlot,\n      buttonSlot,\n      buttonSlotProps,\n      textTypographyProps,\n      buttonProps,\n      linksWrapperProps,\n      ...rest\n    },\n    ref,\n  ) => {\n    const { sx: testSx, ...restText } = textTypographyProps ?? {};\n    const { sx: linksWrapperSx, ...restLinksWrapper } = linksWrapperProps ?? {};\n    const { sx: buttonSlotSx, ...restButtonSlot } = buttonSlotProps ?? {};\n    const { label, ...restButton } = buttonProps ?? {};\n    const theme = useTheme();\n\n    return (\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: { xs: 'flex-start', lg: 'center' },\n          justifyContent: 'space-between',\n          flexWrap: 'wrap',\n          gap: 2,\n          flexDirection: { xs: 'column', lg: 'row' },\n          ...sx,\n        }}\n        ref={ref}\n        data-testid=\"FooterSectionLinks\"\n        className={['FooterSectionLinks-root', className].filter(Boolean).join(', ')}\n        {...rest}\n      >\n        {textSlot && (\n          <Typography\n            variant=\"disclaimer1\"\n            sx={{\n              my: { xs: 2, lg: 0 },\n              color: 'onSurface.os200',\n              ...(children && {\n                display: 'inline-flex',\n                alignItems: 'center',\n                justifyContent: 'flex-start',\n                // separator between text and links\n                mr: { lg: 2 },\n                '&:after': {\n                  content: { xs: 'none', lg: \"''\" },\n                  display: 'block',\n                  height: '14px',\n                  width: '1px',\n                  backgroundColor: 'onSurface.os700',\n                  ml: 4,\n                },\n                // move after the links on mobile\n                order: { xs: 1, lg: 0 },\n              }),\n              ...testSx,\n            }}\n            data-testid=\"FooterSectionLinks.text\"\n            {...restText}\n          >\n            {textSlot}\n          </Typography>\n        )}\n        {children && (\n          <Box\n            sx={{\n              display: 'flex',\n              alignItems: { xs: 'flex-start', lg: 'center' },\n              flexDirection: { xs: 'column', lg: 'row' },\n              flexWrap: 'wrap',\n              flexGrow: '1',\n              gap: { xs: 2, lg: 3 },\n              // manipulate style of buttons inside\n              '& .MuiButton-root': {\n                alignSelf: { xs: 'stretch', lg: 'auto' },\n              },\n              // manipulates style of links inside\n              '& .MuiLink-root': {\n                ...theme.typography.disclaimer1,\n                p: 0,\n                '&, &:hover': {\n                  textDecoration: 'underline',\n                  color: 'common.white',\n                },\n              },\n              ...linksWrapperSx,\n            }}\n            data-testid=\"FooterSectionLinks.content\"\n            {...restLinksWrapper}\n          >\n            {children}\n          </Box>\n        )}\n        {(buttonSlot || label) && (\n          <Box data-testid=\"FooterSectionLinks.button\" sx={{ order: 2, ...buttonSlotSx }} {...restButtonSlot}>\n            {buttonSlot || (\n              <Button variant=\"shortcut\" color=\"inherit\" {...restButton}>\n                {label}\n              </Button>\n            )}\n          </Box>\n        )}\n      </Box>\n    );\n  },\n);\n"],"names":["FooterSectionLinks","forwardRef","_a","ref","sx","children","className","textSlot","buttonSlot","buttonSlotProps","textTypographyProps","buttonProps","linksWrapperProps","rest","__rest","_b","testSx","restText","_c","linksWrapperSx","restLinksWrapper","_d","buttonSlotSx","restButtonSlot","_e","label","restButton","theme","useTheme","_jsxs","Box","Object","assign","display","alignItems","xs","lg","justifyContent","flexWrap","gap","flexDirection","filter","Boolean","join","_jsx","Typography","variant","my","color","mr","content","height","width","backgroundColor","ml","order","flexGrow","alignSelf","typography","disclaimer1","p","textDecoration","Button"],"mappings":"kMAiCO,MAAMA,EAAkDC,EAC7D,CACEC,EAYAC,SAZAC,GACEA,EAAEC,SACFA,EAAQC,UACRA,EAASC,SACTA,EAAQC,WACRA,EAAUC,gBACVA,EAAeC,oBACfA,EAAmBC,YACnBA,EAAWC,kBACXA,KACGC,EAAIC,EAAAZ,EAVT,CAAA,KAAA,WAAA,YAAA,WAAA,aAAA,kBAAA,sBAAA,cAAA,sBAcA,MAAMa,EAA8BL,QAAAA,EAAuB,IAAnDN,GAAIY,GAAMD,EAAKE,EAAQH,EAAAC,EAAzB,CAAA,OACAG,EAA8CN,QAAAA,EAAqB,IAAjER,GAAIe,GAAcD,EAAKE,EAAgBN,EAAAI,EAAzC,CAAA,OACAG,EAA0CZ,QAAAA,EAAmB,IAA3DL,GAAIkB,GAAYD,EAAKE,EAAcT,EAAAO,EAArC,CAAA,OACAG,EAA2Bb,QAAAA,EAAe,CAAA,GAA1Cc,MAAEA,GAAKD,EAAKE,EAAUZ,EAAAU,EAAtB,CAAA,UACAG,EAAQC,IAEd,OACEC,EAACC,EAAGC,OAAAC,OAAA,CACF5B,GAAE2B,OAAAC,OAAA,CACAC,QAAS,OACTC,WAAY,CAAEC,GAAI,aAAcC,GAAI,UACpCC,eAAgB,gBAChBC,SAAU,OACVC,IAAK,EACLC,cAAe,CAAEL,GAAI,SAAUC,GAAI,QAChChC,GAELD,IAAKA,EAAG,cACI,qBACZG,UAAW,CAAC,0BAA2BA,GAAWmC,OAAOC,SAASC,KAAK,OACnE9B,EAAI,CAAAR,SAAA,CAEPE,GACCqC,EAACC,iBACCC,QAAQ,cACR1C,gCACE2C,GAAI,CAAEZ,GAAI,EAAGC,GAAI,GACjBY,MAAO,mBACH3C,GAAY,CACd4B,QAAS,cACTC,WAAY,SACZG,eAAgB,aAEhBY,GAAI,CAAEb,GAAI,GACV,UAAW,CACTc,QAAS,CAAEf,GAAI,OAAQC,GAAI,MAC3BH,QAAS,QACTkB,OAAQ,OACRC,MAAO,MACPC,gBAAiB,kBACjBC,GAAI,GAGNC,MAAO,CAAEpB,GAAI,EAAGC,GAAI,KAEnBpB,GAAM,cAEC,2BACRC,EAAQ,CAAAZ,SAEXE,KAGJF,GACCuC,EAACd,EAAGC,OAAAC,OAAA,CACF5B,GAAE2B,OAAAC,OAAA,CACAC,QAAS,OACTC,WAAY,CAAEC,GAAI,aAAcC,GAAI,UACpCI,cAAe,CAAEL,GAAI,SAAUC,GAAI,OACnCE,SAAU,OACVkB,SAAU,IACVjB,IAAK,CAAEJ,GAAI,EAAGC,GAAI,GAElB,oBAAqB,CACnBqB,UAAW,CAAEtB,GAAI,UAAWC,GAAI,SAGlC,kBAAiBL,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EACZL,EAAM+B,WAAWC,aAAW,CAC/BC,EAAG,EACH,aAAc,CACZC,eAAgB,YAChBb,MAAO,mBAGR7B,GAAc,cAEP,8BACRC,YAEHf,MAGHG,GAAciB,IACdmB,EAACd,EAAGC,OAAAC,OAAA,CAAA,cAAa,4BAA4B5B,GAAE2B,OAAAC,OAAA,CAAIuB,MAAO,GAAMjC,IAAoBC,EAAc,CAAAlB,SAC/FG,GACCoC,EAACkB,EAAM/B,OAAAC,OAAA,CAACc,QAAQ,WAAWE,MAAM,WAActB,EAAU,CAAArB,SACtDoB"}
+{"version":3,"file":"FooterSectionLinks.js","sources":["../../../src/components/footer/FooterSectionLinks.tsx"],"sourcesContent":["import React, { ElementType, FC, forwardRef } from 'react';\nimport { Box, BoxProps, Button, ButtonProps, Typography, TypographyProps, useTheme } from '@mui/material';\n\nexport interface FooterSectionLinksProps extends BoxProps<ElementType> {\n  /**\n   * Text wrapped by styled Typography component\n   */\n  textSlot?: React.ReactNode;\n  /**\n   * Properties applied to text typography\n   */\n  textTypographyProps?: TypographyProps<ElementType>;\n  /**\n   * Alternative to providing button props\n   */\n  buttonSlot?: React.ReactNode;\n  /**\n   * Properties applied to button wrapper\n   */\n  buttonSlotProps?: BoxProps<ElementType>;\n  /**\n   * Props for button\n   */\n  buttonProps?: ButtonProps & { label?: React.ReactNode };\n  /**\n   * Properties applied to link container\n   */\n  linksWrapperProps?: BoxProps<ElementType>;\n}\n\n/**\n * Section for the secondary links, copyright and optional button\n */\nexport const FooterSectionLinks: FC<FooterSectionLinksProps> = forwardRef(\n  (\n    {\n      sx,\n      children,\n      className,\n      textSlot,\n      buttonSlot,\n      buttonSlotProps,\n      textTypographyProps,\n      buttonProps,\n      linksWrapperProps,\n      ...rest\n    },\n    ref,\n  ) => {\n    const { sx: testSx, ...restText } = textTypographyProps ?? {};\n    const { sx: linksWrapperSx, ...restLinksWrapper } = linksWrapperProps ?? {};\n    const { sx: buttonSlotSx, ...restButtonSlot } = buttonSlotProps ?? {};\n    const { label, ...restButton } = buttonProps ?? {};\n    const theme = useTheme();\n\n    return (\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: { xs: 'flex-start', lg: 'center' },\n          justifyContent: 'space-between',\n          flexWrap: 'wrap',\n          gap: 2,\n          flexDirection: { xs: 'column', lg: 'row' },\n          ...sx,\n        }}\n        ref={ref}\n        data-testid=\"FooterSectionLinks\"\n        className={['FooterSectionLinks-root', className].filter(Boolean).join(' ')}\n        {...rest}\n      >\n        {textSlot && (\n          <Typography\n            variant=\"disclaimer1\"\n            sx={{\n              my: { xs: 2, lg: 0 },\n              color: 'onSurface.os200',\n              ...(children && {\n                display: 'inline-flex',\n                alignItems: 'center',\n                justifyContent: 'flex-start',\n                // separator between text and links\n                mr: { lg: 2 },\n                '&:after': {\n                  content: { xs: 'none', lg: \"''\" },\n                  display: 'block',\n                  height: '14px',\n                  width: '1px',\n                  backgroundColor: 'onSurface.os700',\n                  ml: 4,\n                },\n                // move after the links on mobile\n                order: { xs: 1, lg: 0 },\n              }),\n              ...testSx,\n            }}\n            data-testid=\"FooterSectionLinks.text\"\n            {...restText}\n          >\n            {textSlot}\n          </Typography>\n        )}\n        {children && (\n          <Box\n            sx={{\n              display: 'flex',\n              alignItems: { xs: 'flex-start', lg: 'center' },\n              flexDirection: { xs: 'column', lg: 'row' },\n              flexWrap: 'wrap',\n              flexGrow: '1',\n              gap: { xs: 2, lg: 3 },\n              // manipulate style of buttons inside\n              '& .MuiButton-root': {\n                alignSelf: { xs: 'stretch', lg: 'auto' },\n              },\n              // manipulates style of links inside\n              '& .MuiLink-root': {\n                ...theme.typography.disclaimer1,\n                p: 0,\n                '&, &:hover': {\n                  textDecoration: 'underline',\n                  color: 'common.white',\n                },\n              },\n              ...linksWrapperSx,\n            }}\n            data-testid=\"FooterSectionLinks.content\"\n            {...restLinksWrapper}\n          >\n            {children}\n          </Box>\n        )}\n        {(buttonSlot || label) && (\n          <Box data-testid=\"FooterSectionLinks.button\" sx={{ order: 2, ...buttonSlotSx }} {...restButtonSlot}>\n            {buttonSlot || (\n              <Button variant=\"shortcut\" color=\"inherit\" {...restButton}>\n                {label}\n              </Button>\n            )}\n          </Box>\n        )}\n      </Box>\n    );\n  },\n);\n"],"names":["FooterSectionLinks","forwardRef","_a","ref","sx","children","className","textSlot","buttonSlot","buttonSlotProps","textTypographyProps","buttonProps","linksWrapperProps","rest","__rest","_b","testSx","restText","_c","linksWrapperSx","restLinksWrapper","_d","buttonSlotSx","restButtonSlot","_e","label","restButton","theme","useTheme","_jsxs","Box","Object","assign","display","alignItems","xs","lg","justifyContent","flexWrap","gap","flexDirection","filter","Boolean","join","_jsx","Typography","variant","my","color","mr","content","height","width","backgroundColor","ml","order","flexGrow","alignSelf","typography","disclaimer1","p","textDecoration","Button"],"mappings":"kMAiCO,MAAMA,EAAkDC,EAC7D,CACEC,EAYAC,SAZAC,GACEA,EAAEC,SACFA,EAAQC,UACRA,EAASC,SACTA,EAAQC,WACRA,EAAUC,gBACVA,EAAeC,oBACfA,EAAmBC,YACnBA,EAAWC,kBACXA,KACGC,EAAIC,EAAAZ,EAVT,CAAA,KAAA,WAAA,YAAA,WAAA,aAAA,kBAAA,sBAAA,cAAA,sBAcA,MAAMa,EAA8BL,QAAAA,EAAuB,IAAnDN,GAAIY,GAAMD,EAAKE,EAAQH,EAAAC,EAAzB,CAAA,OACAG,EAA8CN,QAAAA,EAAqB,IAAjER,GAAIe,GAAcD,EAAKE,EAAgBN,EAAAI,EAAzC,CAAA,OACAG,EAA0CZ,QAAAA,EAAmB,IAA3DL,GAAIkB,GAAYD,EAAKE,EAAcT,EAAAO,EAArC,CAAA,OACAG,EAA2Bb,QAAAA,EAAe,CAAA,GAA1Cc,MAAEA,GAAKD,EAAKE,EAAUZ,EAAAU,EAAtB,CAAA,UACAG,EAAQC,IAEd,OACEC,EAACC,EAAGC,OAAAC,OAAA,CACF5B,GAAE2B,OAAAC,OAAA,CACAC,QAAS,OACTC,WAAY,CAAEC,GAAI,aAAcC,GAAI,UACpCC,eAAgB,gBAChBC,SAAU,OACVC,IAAK,EACLC,cAAe,CAAEL,GAAI,SAAUC,GAAI,QAChChC,GAELD,IAAKA,EAAG,cACI,qBACZG,UAAW,CAAC,0BAA2BA,GAAWmC,OAAOC,SAASC,KAAK,MACnE9B,EAAI,CAAAR,SAAA,CAEPE,GACCqC,EAACC,iBACCC,QAAQ,cACR1C,gCACE2C,GAAI,CAAEZ,GAAI,EAAGC,GAAI,GACjBY,MAAO,mBACH3C,GAAY,CACd4B,QAAS,cACTC,WAAY,SACZG,eAAgB,aAEhBY,GAAI,CAAEb,GAAI,GACV,UAAW,CACTc,QAAS,CAAEf,GAAI,OAAQC,GAAI,MAC3BH,QAAS,QACTkB,OAAQ,OACRC,MAAO,MACPC,gBAAiB,kBACjBC,GAAI,GAGNC,MAAO,CAAEpB,GAAI,EAAGC,GAAI,KAEnBpB,GAAM,cAEC,2BACRC,EAAQ,CAAAZ,SAEXE,KAGJF,GACCuC,EAACd,EAAGC,OAAAC,OAAA,CACF5B,GAAE2B,OAAAC,OAAA,CACAC,QAAS,OACTC,WAAY,CAAEC,GAAI,aAAcC,GAAI,UACpCI,cAAe,CAAEL,GAAI,SAAUC,GAAI,OACnCE,SAAU,OACVkB,SAAU,IACVjB,IAAK,CAAEJ,GAAI,EAAGC,GAAI,GAElB,oBAAqB,CACnBqB,UAAW,CAAEtB,GAAI,UAAWC,GAAI,SAGlC,kBAAiBL,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EACZL,EAAM+B,WAAWC,aAAW,CAC/BC,EAAG,EACH,aAAc,CACZC,eAAgB,YAChBb,MAAO,mBAGR7B,GAAc,cAEP,8BACRC,YAEHf,MAGHG,GAAciB,IACdmB,EAACd,EAAGC,OAAAC,OAAA,CAAA,cAAa,4BAA4B5B,GAAE2B,OAAAC,OAAA,CAAIuB,MAAO,GAAMjC,IAAoBC,EAAc,CAAAlB,SAC/FG,GACCoC,EAACkB,EAAM/B,OAAAC,OAAA,CAACc,QAAQ,WAAWE,MAAM,WAActB,EAAU,CAAArB,SACtDoB"}

package/components/footer/FooterSectionMenu.js

@@ -1,2 +1,2 @@
-import{__rest as t}from"tslib";import{jsx as o}from"react/jsx-runtime";import{forwardRef as s}from"react";import{Box as r}from"@mui/material";const e=s((s,e)=>{var{sx:l,children:c,className:a,contactSlot:i,contactSlotProps:n,socialSlot:m,socialSlotProps:x}=s,p=t(s,["sx","children","className","contactSlot","contactSlotProps","socialSlot","socialSlotProps"]);return o(r,Object.assign({sx:Object.assign({display:"flex",alignItems:{xs:"stretch",lg:"flex-start"},justifyContent:"stretch",flexDirection:{xs:"column",lg:"row"},gap:{xs:0,lg:2},mb:{xs:4,lg:8}},l),ref:e,"data-testid":"FooterSectionMenu",className:["FooterSectionMenu-root",a].filter(Boolean).join(", ")},p,{children:c}))});export{e as FooterSectionMenu};
+import{__rest as t}from"tslib";import{jsx as o}from"react/jsx-runtime";import{forwardRef as s}from"react";import{Box as r}from"@mui/material";const e=s((s,e)=>{var{sx:l,children:c,className:a,contactSlot:i,contactSlotProps:n,socialSlot:m,socialSlotProps:x}=s,p=t(s,["sx","children","className","contactSlot","contactSlotProps","socialSlot","socialSlotProps"]);return o(r,Object.assign({sx:Object.assign({display:"flex",alignItems:{xs:"stretch",lg:"flex-start"},justifyContent:"stretch",flexDirection:{xs:"column",lg:"row"},gap:{xs:0,lg:2},mb:{xs:4,lg:8}},l),ref:e,"data-testid":"FooterSectionMenu",className:["FooterSectionMenu-root",a].filter(Boolean).join(" ")},p,{children:c}))});export{e as FooterSectionMenu};
 //# sourceMappingURL=FooterSectionMenu.js.map

package/components/footer/FooterSectionMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"FooterSectionMenu.js","sources":["../../../src/components/footer/FooterSectionMenu.tsx"],"sourcesContent":["import React, { ElementType, FC, forwardRef } from 'react';\nimport { Box, BoxProps } from '@mui/material';\n\nexport interface FooterSectionMenuProps extends BoxProps<ElementType> {}\n\n/**\n * Section for the multiple FooterMenu\n */\nexport const FooterSectionMenu: FC<FooterSectionMenuProps> = forwardRef(\n  ({ sx, children, className, contactSlot, contactSlotProps, socialSlot, socialSlotProps, ...rest }, ref) => {\n    return (\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: { xs: 'stretch', lg: 'flex-start' },\n          justifyContent: 'stretch',\n          flexDirection: { xs: 'column', lg: 'row' },\n          gap: { xs: 0, lg: 2 },\n          mb: { xs: 4, lg: 8 },\n          ...sx,\n        }}\n        ref={ref}\n        data-testid=\"FooterSectionMenu\"\n        className={['FooterSectionMenu-root', className].filter(Boolean).join(', ')}\n        {...rest}\n      >\n        {children}\n      </Box>\n    );\n  },\n);\n"],"names":["FooterSectionMenu","forwardRef","_a","ref","sx","children","className","contactSlot","contactSlotProps","socialSlot","socialSlotProps","rest","__rest","_jsx","Box","Object","assign","display","alignItems","xs","lg","justifyContent","flexDirection","gap","mb","filter","Boolean","join"],"mappings":"8IAQO,MAAMA,EAAgDC,EAC3D,CAACC,EAAkGC,KAAlG,IAAAC,GAAEA,EAAEC,SAAEA,EAAQC,UAAEA,EAASC,YAAEA,EAAWC,iBAAEA,EAAgBC,WAAEA,EAAUC,gBAAEA,GAAeR,EAAKS,EAAIC,EAAAV,EAA9F,+FACC,OACEW,EAACC,EAAGC,OAAAC,OAAA,CACFZ,GAAEW,OAAAC,OAAA,CACAC,QAAS,OACTC,WAAY,CAAEC,GAAI,UAAWC,GAAI,cACjCC,eAAgB,UAChBC,cAAe,CAAEH,GAAI,SAAUC,GAAI,OACnCG,IAAK,CAAEJ,GAAI,EAAGC,GAAI,GAClBI,GAAI,CAAEL,GAAI,EAAGC,GAAI,IACdhB,GAELD,IAAKA,gBACO,oBACZG,UAAW,CAAC,yBAA0BA,GAAWmB,OAAOC,SAASC,KAAK,OAClEhB,EAAI,CAAAN,SAEPA"}
+{"version":3,"file":"FooterSectionMenu.js","sources":["../../../src/components/footer/FooterSectionMenu.tsx"],"sourcesContent":["import React, { ElementType, FC, forwardRef } from 'react';\nimport { Box, BoxProps } from '@mui/material';\n\nexport interface FooterSectionMenuProps extends BoxProps<ElementType> {}\n\n/**\n * Section for the multiple FooterMenu\n */\nexport const FooterSectionMenu: FC<FooterSectionMenuProps> = forwardRef(\n  ({ sx, children, className, contactSlot, contactSlotProps, socialSlot, socialSlotProps, ...rest }, ref) => {\n    return (\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: { xs: 'stretch', lg: 'flex-start' },\n          justifyContent: 'stretch',\n          flexDirection: { xs: 'column', lg: 'row' },\n          gap: { xs: 0, lg: 2 },\n          mb: { xs: 4, lg: 8 },\n          ...sx,\n        }}\n        ref={ref}\n        data-testid=\"FooterSectionMenu\"\n        className={['FooterSectionMenu-root', className].filter(Boolean).join(' ')}\n        {...rest}\n      >\n        {children}\n      </Box>\n    );\n  },\n);\n"],"names":["FooterSectionMenu","forwardRef","_a","ref","sx","children","className","contactSlot","contactSlotProps","socialSlot","socialSlotProps","rest","__rest","_jsx","Box","Object","assign","display","alignItems","xs","lg","justifyContent","flexDirection","gap","mb","filter","Boolean","join"],"mappings":"8IAQO,MAAMA,EAAgDC,EAC3D,CAACC,EAAkGC,KAAlG,IAAAC,GAAEA,EAAEC,SAAEA,EAAQC,UAAEA,EAASC,YAAEA,EAAWC,iBAAEA,EAAgBC,WAAEA,EAAUC,gBAAEA,GAAeR,EAAKS,EAAIC,EAAAV,EAA9F,+FACC,OACEW,EAACC,EAAGC,OAAAC,OAAA,CACFZ,GAAEW,OAAAC,OAAA,CACAC,QAAS,OACTC,WAAY,CAAEC,GAAI,UAAWC,GAAI,cACjCC,eAAgB,UAChBC,cAAe,CAAEH,GAAI,SAAUC,GAAI,OACnCG,IAAK,CAAEJ,GAAI,EAAGC,GAAI,GAClBI,GAAI,CAAEL,GAAI,EAAGC,GAAI,IACdhB,GAELD,IAAKA,gBACO,oBACZG,UAAW,CAAC,yBAA0BA,GAAWmB,OAAOC,SAASC,KAAK,MAClEhB,EAAI,CAAAN,SAEPA"}

package/components/header/HeaderNavigationHero.d.ts

@@ -19,7 +19,7 @@ export interface HeaderNavigationHeroProps extends HeaderNavigationLinkProps {
     /**
      * Props applied to ClickAwayListener
      */
-    clickAwayListenerProps?: ClickAwayListenerProps;
+    clickAwayListenerProps?: Omit<ClickAwayListenerProps, 'children'>;
     /**
      * Props applied to main wrapper of content
      */

package/components/header/HeaderNavigationHero.js.map

@@ -1 +1 @@
-{"version":3,"file":"HeaderNavigationHero.js","sources":["../../../src/components/header/HeaderNavigationHero.tsx"],"sourcesContent":["import React, { FC, forwardRef, ReactNode, useState, ElementType, useRef } from 'react';\nimport {\n  Collapse,\n  Backdrop,\n  ClickAwayListener,\n  Box,\n  BoxProps,\n  Portal,\n  Container,\n  ClickAwayListenerProps,\n  ContainerProps,\n  PortalProps,\n  BackdropProps,\n  CollapseProps,\n  useMediaQuery,\n  Theme,\n  useTheme,\n} from '@mui/material';\nimport { ChevronDownIcon } from '@/src/components/icon/stroke/ChevronDownIcon';\nimport { HeaderNavigationLink, HeaderNavigationLinkProps } from './HeaderNavigationLink';\n\nexport interface HeaderNavigationHeroProps extends HeaderNavigationLinkProps {\n  /**\n   * @deprecated provide as children instead\n   */\n  heroElement?: ReactNode;\n  /**\n   * Wrap the content into container\n   * @default false\n   */\n  inContainer?: boolean;\n  /**\n   * Controls appearance of backdrop when content opens\n   * @default false\n   */\n  disableBackdrop?: boolean;\n  /**\n   * Props applied to ClickAwayListener\n   */\n  clickAwayListenerProps?: ClickAwayListenerProps;\n  /**\n   * Props applied to main wrapper of content\n   */\n  contentProps?: BoxProps<ElementType>;\n  /**\n   * Props applied to main wrapper before collapsible\n   */\n  wrapperProps?: BoxProps<ElementType>;\n  /**\n   * Props applied to Container if inContainer property is provided\n   */\n  containerProps?: ContainerProps;\n  /**\n   * Props applied to Collapse component\n   */\n  collapseProp?: CollapseProps;\n  /**\n   * Props applied to Portal if disableBackdrop property is not provided\n   */\n  portalProps?: PortalProps;\n  /**\n   * Props applied to Backdrop if disableBackdrop property is not provided\n   */\n  backdropProps?: BackdropProps;\n}\n\n/**\n * HeaderNavigationLink with the integration of the complex hero menu\n */\nexport const HeaderNavigationHero: FC<HeaderNavigationHeroProps> = forwardRef(\n  (\n    {\n      children,\n      sx,\n      label,\n      icon,\n      heroElement,\n      inContainer = false,\n      disableBackdrop = false,\n      onClick,\n      clickAwayListenerProps,\n      contentProps,\n      wrapperProps,\n      containerProps,\n      collapseProps,\n      portalProps,\n      backdropProps,\n      ...rest\n    },\n    ref,\n  ) => {\n    const buttonRef = useRef();\n    const [open, setOpen] = useState(false);\n    const theme = useTheme();\n    const downLg = useMediaQuery<Theme>(theme.breakpoints.down('lg'));\n    const { sx: backdropSx, ...restBackdrop } = backdropProps ?? {};\n    const { sx: wrapperSx, ...restWrapper } = wrapperProps ?? {};\n    const { sx: contentSx, ...restContent } = contentProps ?? {};\n\n    return (\n      <>\n        <HeaderNavigationLink\n          active={open}\n          icon={\n            icon || (\n              <ChevronDownIcon\n                sx={{\n                  '&&&': {\n                    fontSize: { xs: '20px', lg: '14px' },\n                  },\n                  color: {\n                    xs: theme.palette.mode === 'dark' ? 'onSurface.os300' : 'onSurface.os700',\n                    lg: 'currentColor',\n                  },\n                  transform: `rotate(${open ? '180' : '0'}deg)`,\n                  transition: {\n                    xs: theme.transitions.create('transform', {\n                      duration: theme.transitions.duration.shortest,\n                    }),\n                    lg: 'none',\n                  },\n                }}\n              />\n            )\n          }\n          onClick={(e) => {\n            onClick?.(e);\n            setOpen((prev) => !prev);\n          }}\n          sx={{\n            justifyContent: { xs: 'space-between', lg: 'flex-start' },\n            ...sx,\n          }}\n          ref={ref ?? buttonRef}\n          data-testid=\"HeaderNavigationHero\"\n          {...rest}\n        >\n          {label}\n        </HeaderNavigationLink>\n        <ClickAwayListener\n          onClickAway={(e) =>\n            !((ref as React.RefObject<HTMLButtonElement>) ?? buttonRef)?.current?.contains(e?.target as Node) &&\n            setOpen(false)\n          }\n          {...clickAwayListenerProps}\n        >\n          <Box\n            sx={{\n              position: { xs: 'static', lg: 'absolute' },\n              zIndex: '10',\n              left: '0',\n              right: '0',\n              top: theme.mixins.toolbar.minHeight,\n              maxHeight: `calc(100vh - ${theme.mixins.toolbar.minHeight})`,\n              overflow: 'auto',\n              ...wrapperSx,\n            }}\n            {...restWrapper}\n          >\n            <Collapse in={open} {...collapseProps}>\n              <Box\n                sx={{\n                  backgroundColor: { lg: theme.palette.mode === 'dark' ? 'surface.primary' : 'background.primary' },\n                  py: { xs: 0, lg: 2 },\n                  px: inContainer ? 0 : { xs: 1, lg: 2 },\n                  ...contentSx,\n                }}\n                {...restContent}\n              >\n                {inContainer ? (\n                  <Container maxWidth=\"xl\" {...containerProps}>\n                    {heroElement || children}\n                  </Container>\n                ) : (\n                  heroElement || children\n                )}\n              </Box>\n            </Collapse>\n          </Box>\n        </ClickAwayListener>\n        {!disableBackdrop && !downLg && (\n          <Portal {...portalProps}>\n            <Backdrop open={open} sx={{ zIndex: theme.zIndex.appBar - 50, ...backdropSx }} {...restBackdrop} />\n          </Portal>\n        )}\n      </>\n    );\n  },\n);\n"],"names":["HeaderNavigationHero","forwardRef","_a","ref","children","sx","label","icon","heroElement","inContainer","disableBackdrop","onClick","clickAwayListenerProps","contentProps","wrapperProps","containerProps","collapseProps","portalProps","backdropProps","rest","__rest","buttonRef","useRef","open","setOpen","useState","theme","useTheme","downLg","useMediaQuery","breakpoints","down","_b","backdropSx","restBackdrop","_c","wrapperSx","restWrapper","_d","contentSx","restContent","_jsxs","_Fragment","_jsx","HeaderNavigationLink","Object","assign","active","ChevronDownIcon","fontSize","xs","lg","color","palette","mode","transform","transition","transitions","create","duration","shortest","e","prev","justifyContent","ClickAwayListener","onClickAway","current","contains","target","Box","position","zIndex","left","right","top","mixins","toolbar","minHeight","maxHeight","overflow","Collapse","in","backgroundColor","py","px","Container","maxWidth","Portal","Backdrop","appBar"],"mappings":"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"}
+{"version":3,"file":"HeaderNavigationHero.js","sources":["../../../src/components/header/HeaderNavigationHero.tsx"],"sourcesContent":["import React, { FC, forwardRef, ReactNode, useState, ElementType, useRef } from 'react';\nimport {\n  Collapse,\n  Backdrop,\n  ClickAwayListener,\n  Box,\n  BoxProps,\n  Portal,\n  Container,\n  ClickAwayListenerProps,\n  ContainerProps,\n  PortalProps,\n  BackdropProps,\n  CollapseProps,\n  useMediaQuery,\n  Theme,\n  useTheme,\n} from '@mui/material';\nimport { ChevronDownIcon } from '@/src/components/icon/stroke/ChevronDownIcon';\nimport { HeaderNavigationLink, HeaderNavigationLinkProps } from './HeaderNavigationLink';\n\nexport interface HeaderNavigationHeroProps extends HeaderNavigationLinkProps {\n  /**\n   * @deprecated provide as children instead\n   */\n  heroElement?: ReactNode;\n  /**\n   * Wrap the content into container\n   * @default false\n   */\n  inContainer?: boolean;\n  /**\n   * Controls appearance of backdrop when content opens\n   * @default false\n   */\n  disableBackdrop?: boolean;\n  /**\n   * Props applied to ClickAwayListener\n   */\n  clickAwayListenerProps?: Omit<ClickAwayListenerProps, 'children'>;\n  /**\n   * Props applied to main wrapper of content\n   */\n  contentProps?: BoxProps<ElementType>;\n  /**\n   * Props applied to main wrapper before collapsible\n   */\n  wrapperProps?: BoxProps<ElementType>;\n  /**\n   * Props applied to Container if inContainer property is provided\n   */\n  containerProps?: ContainerProps;\n  /**\n   * Props applied to Collapse component\n   */\n  collapseProp?: CollapseProps;\n  /**\n   * Props applied to Portal if disableBackdrop property is not provided\n   */\n  portalProps?: PortalProps;\n  /**\n   * Props applied to Backdrop if disableBackdrop property is not provided\n   */\n  backdropProps?: BackdropProps;\n}\n\n/**\n * HeaderNavigationLink with the integration of the complex hero menu\n */\nexport const HeaderNavigationHero: FC<HeaderNavigationHeroProps> = forwardRef(\n  (\n    {\n      children,\n      sx,\n      label,\n      icon,\n      heroElement,\n      inContainer = false,\n      disableBackdrop = false,\n      onClick,\n      clickAwayListenerProps,\n      contentProps,\n      wrapperProps,\n      containerProps,\n      collapseProps,\n      portalProps,\n      backdropProps,\n      ...rest\n    },\n    ref,\n  ) => {\n    const buttonRef = useRef();\n    const [open, setOpen] = useState(false);\n    const theme = useTheme();\n    const downLg = useMediaQuery<Theme>(theme.breakpoints.down('lg'));\n    const { sx: backdropSx, ...restBackdrop } = backdropProps ?? {};\n    const { sx: wrapperSx, ...restWrapper } = wrapperProps ?? {};\n    const { sx: contentSx, ...restContent } = contentProps ?? {};\n\n    return (\n      <>\n        <HeaderNavigationLink\n          active={open}\n          icon={\n            icon || (\n              <ChevronDownIcon\n                sx={{\n                  '&&&': {\n                    fontSize: { xs: '20px', lg: '14px' },\n                  },\n                  color: {\n                    xs: theme.palette.mode === 'dark' ? 'onSurface.os300' : 'onSurface.os700',\n                    lg: 'currentColor',\n                  },\n                  transform: `rotate(${open ? '180' : '0'}deg)`,\n                  transition: {\n                    xs: theme.transitions.create('transform', {\n                      duration: theme.transitions.duration.shortest,\n                    }),\n                    lg: 'none',\n                  },\n                }}\n              />\n            )\n          }\n          onClick={(e) => {\n            onClick?.(e);\n            setOpen((prev) => !prev);\n          }}\n          sx={{\n            justifyContent: { xs: 'space-between', lg: 'flex-start' },\n            ...sx,\n          }}\n          ref={ref ?? buttonRef}\n          data-testid=\"HeaderNavigationHero\"\n          {...rest}\n        >\n          {label}\n        </HeaderNavigationLink>\n        <ClickAwayListener\n          onClickAway={(e) =>\n            !((ref as React.RefObject<HTMLButtonElement>) ?? buttonRef)?.current?.contains(e?.target as Node) &&\n            setOpen(false)\n          }\n          {...clickAwayListenerProps}\n        >\n          <Box\n            sx={{\n              position: { xs: 'static', lg: 'absolute' },\n              zIndex: '10',\n              left: '0',\n              right: '0',\n              top: theme.mixins.toolbar.minHeight,\n              maxHeight: `calc(100vh - ${theme.mixins.toolbar.minHeight})`,\n              overflow: 'auto',\n              ...wrapperSx,\n            }}\n            {...restWrapper}\n          >\n            <Collapse in={open} {...collapseProps}>\n              <Box\n                sx={{\n                  backgroundColor: { lg: theme.palette.mode === 'dark' ? 'surface.primary' : 'background.primary' },\n                  py: { xs: 0, lg: 2 },\n                  px: inContainer ? 0 : { xs: 1, lg: 2 },\n                  ...contentSx,\n                }}\n                {...restContent}\n              >\n                {inContainer ? (\n                  <Container maxWidth=\"xl\" {...containerProps}>\n                    {heroElement || children}\n                  </Container>\n                ) : (\n                  heroElement || children\n                )}\n              </Box>\n            </Collapse>\n          </Box>\n        </ClickAwayListener>\n        {!disableBackdrop && !downLg && (\n          <Portal {...portalProps}>\n            <Backdrop open={open} sx={{ zIndex: theme.zIndex.appBar - 50, ...backdropSx }} {...restBackdrop} />\n          </Portal>\n        )}\n      </>\n    );\n  },\n);\n"],"names":["HeaderNavigationHero","forwardRef","_a","ref","children","sx","label","icon","heroElement","inContainer","disableBackdrop","onClick","clickAwayListenerProps","contentProps","wrapperProps","containerProps","collapseProps","portalProps","backdropProps","rest","__rest","buttonRef","useRef","open","setOpen","useState","theme","useTheme","downLg","useMediaQuery","breakpoints","down","_b","backdropSx","restBackdrop","_c","wrapperSx","restWrapper","_d","contentSx","restContent","_jsxs","_Fragment","_jsx","HeaderNavigationLink","Object","assign","active","ChevronDownIcon","fontSize","xs","lg","color","palette","mode","transform","transition","transitions","create","duration","shortest","e","prev","justifyContent","ClickAwayListener","onClickAway","current","contains","target","Box","position","zIndex","left","right","top","mixins","toolbar","minHeight","maxHeight","overflow","Collapse","in","backgroundColor","py","px","Container","maxWidth","Portal","Backdrop","appBar"],"mappings":"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"}

package/components/header/HeaderNavigationMenu.d.ts

@@ -13,7 +13,7 @@ export interface HeaderNavigationMenuProps extends HeaderNavigationLinkProps {
     /**
      * Props applied to ClickAwayListener
      */
-    clickAwayListenerProps?: ClickAwayListenerProps;
+    clickAwayListenerProps?: Omit<ClickAwayListenerProps, 'children'>;
     /**
      * Props applied to menu on mobile
      */

package/components/header/HeaderNavigationMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"HeaderNavigationMenu.js","sources":["../../../src/components/header/HeaderNavigationMenu.tsx"],"sourcesContent":["import React, { FC, forwardRef, ReactNode, useRef, useState } from 'react';\nimport {\n  Menu,\n  MenuProps,\n  Collapse,\n  useMediaQuery,\n  Theme,\n  useTheme,\n  CollapseProps,\n  ClickAwayListener,\n  ClickAwayListenerProps,\n} from '@mui/material';\nimport { ChevronDownIcon } from '@/src/components/icon/stroke/ChevronDownIcon';\nimport { HeaderNavigationLink, HeaderNavigationLinkProps } from './HeaderNavigationLink';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport interface HeaderNavigationMenuProps extends HeaderNavigationLinkProps {\n  /**\n   * Content of the menu, can be provided as children as well\n   */\n  menuItems?: ReactNode;\n  /**\n   * Props applied to menu\n   */\n  menuProps?: MenuProps;\n  /**\n   * Props applied to ClickAwayListener\n   */\n  clickAwayListenerProps?: ClickAwayListenerProps;\n  /**\n   * Props applied to menu on mobile\n   */\n  collapseProps?: CollapseProps;\n}\n\n/**\n * HeaderNavigationLink with the integration of the menu\n */\nexport const HeaderNavigationMenu: FC<HeaderNavigationMenuProps> = forwardRef(\n  (\n    { children, sx, label, icon, onClick, menuItems, menuProps, collapseProps, clickAwayListenerProps, ...rest },\n    ref,\n  ) => {\n    const buttonRef = useRef();\n    const [anchor, setAnchor] = useState(null);\n    const theme = useTheme();\n    const downLg = useMediaQuery<Theme>(theme.breakpoints.down('lg'));\n    const { sx: collapseSx, ...restCollapse } = collapseProps ?? {};\n\n    return (\n      <>\n        <HeaderNavigationLink\n          active={!!anchor}\n          icon={\n            icon || (\n              <ChevronDownIcon\n                sx={{\n                  // same code is applied to HeaderNavigationHero.tsx\n                  '&&&': {\n                    fontSize: { xs: '20px', lg: '14px' },\n                  },\n                  color: {\n                    xs: theme.palette.mode === 'dark' ? 'onSurface.os300' : 'onSurface.os700',\n                    lg: 'currentColor',\n                  },\n                  transform: `rotate(${anchor ? '180' : '0'}deg)`,\n                  transition: {\n                    xs: theme.transitions.create('transform', {\n                      duration: theme.transitions.duration.shortest,\n                    }),\n                    lg: 'none',\n                  },\n                }}\n              />\n            )\n          }\n          onClick={(e) => {\n            onClick?.(e);\n            setAnchor((prev) => (!prev ? e.currentTarget : null));\n          }}\n          sx={{\n            justifyContent: { xs: 'space-between', lg: 'flex-start' },\n            ...sx,\n          }}\n          ref={ref ?? buttonRef}\n          data-testid=\"HeaderNavigationMenu\"\n          {...rest}\n        >\n          {label}\n        </HeaderNavigationLink>\n        {downLg ? (\n          <ClickAwayListener\n            onClickAway={(e) => {\n              console.log(e.target);\n              !((ref as React.RefObject<HTMLButtonElement>) ?? buttonRef)?.current?.contains(e?.target as Node) &&\n                setAnchor(null);\n            }}\n            {...clickAwayListenerProps}\n          >\n            <Collapse\n              in={!!anchor}\n              sx={{\n                // style menu items inside\n                '& .MuiMenuItem-root': {\n                  ...getInteractiveStyle(\n                    {\n                      background: 'none',\n                      fontWeight: '300',\n                      color: theme.palette.mode === 'dark' ? 'onSurface.os300' : 'onSurface.os700',\n                    },\n                    {\n                      background: 'none',\n                      fontWeight: '700',\n                      color: 'currentColor',\n                    },\n                  ),\n                },\n                ...collapseSx,\n              }}\n              {...restCollapse}\n            >\n              {children || menuItems}\n            </Collapse>\n          </ClickAwayListener>\n        ) : (\n          <Menu open={!!anchor} anchorEl={anchor} onClose={() => setAnchor(null)} {...menuProps}>\n            {children || menuItems}\n          </Menu>\n        )}\n      </>\n    );\n  },\n);\n"],"names":["HeaderNavigationMenu","forwardRef","_a","ref","children","sx","label","icon","onClick","menuItems","menuProps","collapseProps","clickAwayListenerProps","rest","__rest","buttonRef","useRef","anchor","setAnchor","useState","theme","useTheme","downLg","useMediaQuery","breakpoints","down","_b","collapseSx","restCollapse","_jsxs","_jsx","HeaderNavigationLink","active","ChevronDownIcon","fontSize","xs","lg","color","palette","mode","transform","transition","transitions","create","duration","shortest","e","prev","currentTarget","Object","assign","justifyContent","ClickAwayListener","onClickAway","console","log","target","current","contains","Collapse","in","getInteractiveStyle","background","fontWeight","Menu","open","anchorEl","onClose"],"mappings":"ydAsCO,MAAMA,EAAsDC,EACjE,CACEC,EACAC,SADAC,SAAEA,EAAQC,GAAEA,EAAEC,MAAEA,EAAKC,KAAEA,EAAIC,QAAEA,EAAOC,UAAEA,EAASC,UAAEA,EAASC,cAAEA,EAAaC,uBAAEA,KAA2BC,EAAIC,EAAAZ,EAA1G,CAAA,WAAA,KAAA,QAAA,OAAA,UAAA,YAAA,YAAA,gBAAA,2BAGA,MAAMa,EAAYC,KACXC,EAAQC,GAAaC,EAAS,MAC/BC,EAAQC,IACRC,EAASC,EAAqBH,EAAMI,YAAYC,KAAK,OACrDC,EAAsCf,QAAAA,EAAiB,IAArDN,GAAIsB,GAAUD,EAAKE,EAAYd,EAAAY,EAAjC,CAAA,OAEN,OACEG,eACEC,EAACC,iBACCC,SAAUf,EACVV,KACEA,GACEuB,EAACG,EAAe,CACd5B,GAAI,CAEF,MAAO,CACL6B,SAAU,CAAEC,GAAI,OAAQC,GAAI,SAE9BC,MAAO,CACLF,GAA2B,SAAvBf,EAAMkB,QAAQC,KAAkB,kBAAoB,kBACxDH,GAAI,gBAENI,UAAW,UAAUvB,EAAS,MAAQ,UACtCwB,WAAY,CACVN,GAAIf,EAAMsB,YAAYC,OAAO,YAAa,CACxCC,SAAUxB,EAAMsB,YAAYE,SAASC,WAEvCT,GAAI,WAMd5B,QAAUsC,IACRtC,SAAAA,EAAUsC,GACV5B,EAAW6B,GAAWA,EAAyB,KAAlBD,EAAEE,gBAEjC3C,GAAE4C,OAAAC,OAAA,CACAC,eAAgB,CAAEhB,GAAI,gBAAiBC,GAAI,eACxC/B,GAELF,IAAKA,QAAAA,EAAOY,gBACA,wBACRF,EAAI,CAAAT,SAEPE,KAEFgB,EACCQ,EAACsB,EAAiBH,OAAAC,OAAA,CAChBG,YAAcP,cACZQ,QAAQC,IAAIT,EAAEU,oBAC6C,QAA1D9B,EAA4C,UAA1CvB,SAA0C,IAAAD,EAAAA,EAAIa,SAAU,IAAAW,OAAA,EAAAA,EAAE+B,8BAASC,SAASZ,eAAAA,EAAGU,UAChFtC,EAAU,QAEVN,EAAsB,CAAAR,SAE1B0B,EAAC6B,EAAQV,OAAAC,OAAA,CACPU,KAAM3C,EACNZ,GAAE4C,OAAAC,OAAA,CAEA,sBAAqBD,OAAAC,OAAA,CAAA,EAChBW,EACD,CACEC,WAAY,OACZC,WAAY,MACZ1B,MAA8B,SAAvBjB,EAAMkB,QAAQC,KAAkB,kBAAoB,mBAE7D,CACEuB,WAAY,OACZC,WAAY,MACZ1B,MAAO,mBAIVV,IAEDC,YAEHxB,GAAYK,QAIjBqB,EAACkC,EAAIf,OAAAC,OAAA,CAACe,OAAQhD,EAAQiD,SAAUjD,EAAQkD,QAAS,IAAMjD,EAAU,OAAWR,YACzEN,GAAYK"}
+{"version":3,"file":"HeaderNavigationMenu.js","sources":["../../../src/components/header/HeaderNavigationMenu.tsx"],"sourcesContent":["import React, { FC, forwardRef, ReactNode, useRef, useState } from 'react';\nimport {\n  Menu,\n  MenuProps,\n  Collapse,\n  useMediaQuery,\n  Theme,\n  useTheme,\n  CollapseProps,\n  ClickAwayListener,\n  ClickAwayListenerProps,\n} from '@mui/material';\nimport { ChevronDownIcon } from '@/src/components/icon/stroke/ChevronDownIcon';\nimport { HeaderNavigationLink, HeaderNavigationLinkProps } from './HeaderNavigationLink';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport interface HeaderNavigationMenuProps extends HeaderNavigationLinkProps {\n  /**\n   * Content of the menu, can be provided as children as well\n   */\n  menuItems?: ReactNode;\n  /**\n   * Props applied to menu\n   */\n  menuProps?: MenuProps;\n  /**\n   * Props applied to ClickAwayListener\n   */\n  clickAwayListenerProps?: Omit<ClickAwayListenerProps, 'children'>;\n  /**\n   * Props applied to menu on mobile\n   */\n  collapseProps?: CollapseProps;\n}\n\n/**\n * HeaderNavigationLink with the integration of the menu\n */\nexport const HeaderNavigationMenu: FC<HeaderNavigationMenuProps> = forwardRef(\n  (\n    { children, sx, label, icon, onClick, menuItems, menuProps, collapseProps, clickAwayListenerProps, ...rest },\n    ref,\n  ) => {\n    const buttonRef = useRef();\n    const [anchor, setAnchor] = useState(null);\n    const theme = useTheme();\n    const downLg = useMediaQuery<Theme>(theme.breakpoints.down('lg'));\n    const { sx: collapseSx, ...restCollapse } = collapseProps ?? {};\n\n    return (\n      <>\n        <HeaderNavigationLink\n          active={!!anchor}\n          icon={\n            icon || (\n              <ChevronDownIcon\n                sx={{\n                  // same code is applied to HeaderNavigationHero.tsx\n                  '&&&': {\n                    fontSize: { xs: '20px', lg: '14px' },\n                  },\n                  color: {\n                    xs: theme.palette.mode === 'dark' ? 'onSurface.os300' : 'onSurface.os700',\n                    lg: 'currentColor',\n                  },\n                  transform: `rotate(${anchor ? '180' : '0'}deg)`,\n                  transition: {\n                    xs: theme.transitions.create('transform', {\n                      duration: theme.transitions.duration.shortest,\n                    }),\n                    lg: 'none',\n                  },\n                }}\n              />\n            )\n          }\n          onClick={(e) => {\n            onClick?.(e);\n            setAnchor((prev) => (!prev ? e.currentTarget : null));\n          }}\n          sx={{\n            justifyContent: { xs: 'space-between', lg: 'flex-start' },\n            ...sx,\n          }}\n          ref={ref ?? buttonRef}\n          data-testid=\"HeaderNavigationMenu\"\n          {...rest}\n        >\n          {label}\n        </HeaderNavigationLink>\n        {downLg ? (\n          <ClickAwayListener\n            onClickAway={(e) => {\n              console.log(e.target);\n              !((ref as React.RefObject<HTMLButtonElement>) ?? buttonRef)?.current?.contains(e?.target as Node) &&\n                setAnchor(null);\n            }}\n            {...clickAwayListenerProps}\n          >\n            <Collapse\n              in={!!anchor}\n              sx={{\n                // style menu items inside\n                '& .MuiMenuItem-root': {\n                  ...getInteractiveStyle(\n                    {\n                      background: 'none',\n                      fontWeight: '300',\n                      color: theme.palette.mode === 'dark' ? 'onSurface.os300' : 'onSurface.os700',\n                    },\n                    {\n                      background: 'none',\n                      fontWeight: '700',\n                      color: 'currentColor',\n                    },\n                  ),\n                },\n                ...collapseSx,\n              }}\n              {...restCollapse}\n            >\n              {children || menuItems}\n            </Collapse>\n          </ClickAwayListener>\n        ) : (\n          <Menu open={!!anchor} anchorEl={anchor} onClose={() => setAnchor(null)} {...menuProps}>\n            {children || menuItems}\n          </Menu>\n        )}\n      </>\n    );\n  },\n);\n"],"names":["HeaderNavigationMenu","forwardRef","_a","ref","children","sx","label","icon","onClick","menuItems","menuProps","collapseProps","clickAwayListenerProps","rest","__rest","buttonRef","useRef","anchor","setAnchor","useState","theme","useTheme","downLg","useMediaQuery","breakpoints","down","_b","collapseSx","restCollapse","_jsxs","_jsx","HeaderNavigationLink","active","ChevronDownIcon","fontSize","xs","lg","color","palette","mode","transform","transition","transitions","create","duration","shortest","e","prev","currentTarget","Object","assign","justifyContent","ClickAwayListener","onClickAway","console","log","target","current","contains","Collapse","in","getInteractiveStyle","background","fontWeight","Menu","open","anchorEl","onClose"],"mappings":"ydAsCO,MAAMA,EAAsDC,EACjE,CACEC,EACAC,SADAC,SAAEA,EAAQC,GAAEA,EAAEC,MAAEA,EAAKC,KAAEA,EAAIC,QAAEA,EAAOC,UAAEA,EAASC,UAAEA,EAASC,cAAEA,EAAaC,uBAAEA,KAA2BC,EAAIC,EAAAZ,EAA1G,CAAA,WAAA,KAAA,QAAA,OAAA,UAAA,YAAA,YAAA,gBAAA,2BAGA,MAAMa,EAAYC,KACXC,EAAQC,GAAaC,EAAS,MAC/BC,EAAQC,IACRC,EAASC,EAAqBH,EAAMI,YAAYC,KAAK,OACrDC,EAAsCf,QAAAA,EAAiB,IAArDN,GAAIsB,GAAUD,EAAKE,EAAYd,EAAAY,EAAjC,CAAA,OAEN,OACEG,eACEC,EAACC,iBACCC,SAAUf,EACVV,KACEA,GACEuB,EAACG,EAAe,CACd5B,GAAI,CAEF,MAAO,CACL6B,SAAU,CAAEC,GAAI,OAAQC,GAAI,SAE9BC,MAAO,CACLF,GAA2B,SAAvBf,EAAMkB,QAAQC,KAAkB,kBAAoB,kBACxDH,GAAI,gBAENI,UAAW,UAAUvB,EAAS,MAAQ,UACtCwB,WAAY,CACVN,GAAIf,EAAMsB,YAAYC,OAAO,YAAa,CACxCC,SAAUxB,EAAMsB,YAAYE,SAASC,WAEvCT,GAAI,WAMd5B,QAAUsC,IACRtC,SAAAA,EAAUsC,GACV5B,EAAW6B,GAAWA,EAAyB,KAAlBD,EAAEE,gBAEjC3C,GAAE4C,OAAAC,OAAA,CACAC,eAAgB,CAAEhB,GAAI,gBAAiBC,GAAI,eACxC/B,GAELF,IAAKA,QAAAA,EAAOY,gBACA,wBACRF,EAAI,CAAAT,SAEPE,KAEFgB,EACCQ,EAACsB,EAAiBH,OAAAC,OAAA,CAChBG,YAAcP,cACZQ,QAAQC,IAAIT,EAAEU,oBAC6C,QAA1D9B,EAA4C,UAA1CvB,SAA0C,IAAAD,EAAAA,EAAIa,SAAU,IAAAW,OAAA,EAAAA,EAAE+B,8BAASC,SAASZ,eAAAA,EAAGU,UAChFtC,EAAU,QAEVN,EAAsB,CAAAR,SAE1B0B,EAAC6B,EAAQV,OAAAC,OAAA,CACPU,KAAM3C,EACNZ,GAAE4C,OAAAC,OAAA,CAEA,sBAAqBD,OAAAC,OAAA,CAAA,EAChBW,EACD,CACEC,WAAY,OACZC,WAAY,MACZ1B,MAA8B,SAAvBjB,EAAMkB,QAAQC,KAAkB,kBAAoB,mBAE7D,CACEuB,WAAY,OACZC,WAAY,MACZ1B,MAAO,mBAIVV,IAEDC,YAEHxB,GAAYK,QAIjBqB,EAACkC,EAAIf,OAAAC,OAAA,CAACe,OAAQhD,EAAQiD,SAAUjD,EAAQkD,QAAS,IAAMjD,EAAU,OAAWR,YACzEN,GAAYK"}

package/components/hotspotCard/hotspotCard.d.ts

@@ -54,7 +54,7 @@ export interface HotspotCardProps extends Omit<IconButtonProps, 'color' | 'size'
     /**
      * Properties applied to ClickAwayListener
      */
-    clickAwayListenerProps?: ClickAwayListenerProps;
+    clickAwayListenerProps?: Omit<ClickAwayListenerProps, 'children'>;
     /**
      * Custom icon component to use instead of the default PlusIcon
      */