@skodaflow/web-library 7.16.1 → 8.0.1

package/components/footer/FooterLink.js.map

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

package/components/footer/FooterMenu.d.ts

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

package/components/footer/FooterMenu.js

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

package/components/footer/FooterMenu.js.map

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

package/components/formMessage/FormMessage.d.ts

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

package/components/formMessage/FormMessage.js

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

package/components/formMessage/FormMessage.js.map

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

package/components/formMessage/index.d.ts

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

package/components/header/Header.d.ts

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

package/components/header/Header.js

@@ -1,2 +1,2 @@
-import{__rest as e}from"tslib";import{jsxs as o,Fragment as t,jsx as s}from"react/jsx-runtime";import{forwardRef as n,useState as r,useMemo as i,Children as a,Fragment as l,isValidElement as c,cloneElement as d}from"react";import{useTheme as p,useMediaQuery as u,AppBar as b,Toolbar as g,Box as m,Drawer as x}from"@mui/material";import{MenuIcon as h}from"../icon/stroke/MenuIcon.js";import{CloseIcon as f}from"../icon/stroke/CloseIcon.js";import{getFocusRingStyle as j}from"../focusring/focusring.js";import{HeaderButton as v}from"./HeaderButton.js";import{HeaderLanguageSelect as O}from"./HeaderLanguageSelect.js";const P=n((n,P)=>{var y,I,{children:k,logo:C,navigationItems:H,buttons:w,visibleButtons:B,overheadItems:M,color:S,breakpoint:F,inContainer:T=!1,toolbarProps:z,logoProps:E,contentProps:G,mobileContentProps:L,buttonsProps:A,menuButtonProps:D,menuIcon:R,closeMenuIcon:V,drawerProps:W}=n,$=e(n,["children","logo","navigationItems","buttons","visibleButtons","overheadItems","color","breakpoint","inContainer","toolbarProps","logoProps","contentProps","mobileContentProps","buttonsProps","menuButtonProps","menuIcon","closeMenuIcon","drawerProps"]);const q=p(),J=u(q.breakpoints.down("lg")),K=null!=E?E:{},{sx:N}=K,Q=e(K,["sx"]),U=null!=G?G:{},{sx:X}=U,Y=e(U,["sx"]),Z=null!=L?L:{},{sx:_}=Z,ee=e(Z,["sx"]),oe=null!=A?A:{},{sx:te}=oe,se=e(oe,["sx"]),ne=null!=W?W:{},{sx:re,slotProps:ie}=ne,ae=e(ne,["sx","slotProps"]),le=null!=ie?ie:{},{paper:ce,backdrop:de}=le,pe=e(le,["paper","backdrop"]),ue=null!==(y=ce)&&void 0!==y?y:{},{sx:be}=ue,ge=e(ue,["sx"]),me=null!==(I=de)&&void 0!==I?I:{},{sx:xe}=me,he=e(me,["sx"]),[fe,je]=r(!1),[ve,Oe]=i(()=>{function e(o,t){const s=[];return a.forEach(o,(o,n)=>{(null==o?void 0:o.type)===l?s.push(...e(o.props.children,t)):c(o)&&[v,O].includes(null==o?void 0:o.type)&&t?s.push(d(o,{extend:!0,key:n})):s.push(o)}),(null==s?void 0:s.length)?s:void 0}if(B){const o=!0===B?void 0:e(B,!1),t=e(w,J);return J?[o,t]:[[...o||[],...t||[]],void 0]}return[e(w,!1),void 0]},[B,w,J]);return o(t,{children:[s(b,Object.assign({ref:P,"data-testid":"Header"},$,{children:o(g,Object.assign({disableGutters:!T},z,{children:[C&&s(m,Object.assign({"data-testid":"Header.logo",sx:Object.assign({color:"dark"===q.palette.mode?"brand.secondary":"brand.tertiary","& .MuiLink-root":Object.assign(Object.assign({display:"block",position:"relative",py:1},j(q)),{"&.Mui-focusVisible":{boxShadow:"none"}}),"& .MuiSvgIcon-root":{display:"block"}},N)},Q,{children:C})),s(m,Object.assign({sx:Object.assign(Object.assign(Object.assign({minWidth:"0",flexGrow:"1",alignSelf:"stretch",display:"flex",alignItems:"stretch",justifyContent:"flex-start",gap:{lg:2,xl:4}},!J&&C&&{pl:4}),{mb:"-1px"}),X),"data-testid":"Header.nav"},Y,{children:!J&&(k||H)})),(ve||J&&(k||H||Oe))&&o(m,Object.assign({sx:Object.assign({display:"flex",alignItems:"center",justifyContent:"flex-end",gap:.25,mr:{xs:-1,lg:0}},te),"data-testid":"Header.btns"},se,{children:[ve,J&&(k||H||Oe)&&s(v,Object.assign({"aria-label":"Toggle menu",extend:!1,onClick:()=>je(e=>!e)},D,{children:fe?V||s(f,{}):R||s(h,{})}),"menu")]}))]}))})),J&&(k||H||Oe)&&o(x,Object.assign({disablePortal:!0,disableEnforceFocus:!0,disableAutoFocus:!0,anchor:"top",open:fe,onClose:()=>je(!1),sx:Object.assign({zIndex:q.zIndex.appBar-10,top:q.mixins.toolbar.minHeight,bottom:"auto",height:`calc(100vh - ${q.mixins.toolbar.minHeight})`,position:"absolute"},re),slotProps:Object.assign({backdrop:Object.assign({sx:Object.assign({position:"absolute"},xe)},he),paper:Object.assign({sx:Object.assign({position:"absolute",height:"100%",display:"grid",gridTemplateRows:"auto max-content"},be)},ge)},pe)},ae,{children:[s(m,Object.assign({sx:Object.assign({p:2,overflow:"auto"},_),"data-testid":"Header.mobilenav"},ee,{children:k||H})),Oe&&s(m,{sx:{p:2,pt:0},children:s(m,{sx:{pt:.75,display:"flex",flexDirection:"column-reverse",alignItems:"stretch",justifyContent:"flex-start",borderTop:1,borderColor:"dark"===q.palette.mode?"onSurface.os700":"surface.secondary"},children:Oe})})]}))]})});export{P as Header};
+import{__rest as e}from"tslib";import{jsxs as o,Fragment as s,jsx as t}from"react/jsx-runtime";import{forwardRef as n,useState as r,useMemo as i,Children as a,Fragment as l,isValidElement as c,cloneElement as d}from"react";import{useTheme as p,useMediaQuery as u,AppBar as b,Toolbar as g,Box as m,Drawer as x}from"@mui/material";import{MenuIcon as f}from"../icon/stroke/MenuIcon.js";import{CloseIcon as h}from"../icon/stroke/CloseIcon.js";import{getFocusRingStyle as j}from"../focusring/focusring.js";import{HeaderButton as O}from"./HeaderButton.js";import{HeaderLanguageSelect as v}from"./HeaderLanguageSelect.js";const P=n((n,P)=>{var y,k,{children:I,logo:C,buttons:H,visibleButtons:w,inContainer:B=!1,toolbarProps:M,logoProps:S,contentProps:F,mobileContentProps:T,buttonsProps:z,menuButtonProps:E,menuIcon:G,closeMenuIcon:L,drawerProps:A}=n,D=e(n,["children","logo","buttons","visibleButtons","inContainer","toolbarProps","logoProps","contentProps","mobileContentProps","buttonsProps","menuButtonProps","menuIcon","closeMenuIcon","drawerProps"]);const R=p(),V=u(R.breakpoints.down("lg")),W=null!=S?S:{},{sx:$}=W,q=e(W,["sx"]),J=null!=F?F:{},{sx:K}=J,N=e(J,["sx"]),Q=null!=T?T:{},{sx:U}=Q,X=e(Q,["sx"]),Y=null!=z?z:{},{sx:Z}=Y,_=e(Y,["sx"]),ee=null!=A?A:{},{sx:oe,slotProps:se}=ee,te=e(ee,["sx","slotProps"]),ne=null!=se?se:{},{paper:re,backdrop:ie}=ne,ae=e(ne,["paper","backdrop"]),le=null!==(y=re)&&void 0!==y?y:{},{sx:ce}=le,de=e(le,["sx"]),pe=null!==(k=ie)&&void 0!==k?k:{},{sx:ue}=pe,be=e(pe,["sx"]),[ge,me]=r(!1),[xe,fe]=i(()=>{function e(o,s){const t=[];return a.forEach(o,(o,n)=>{(null==o?void 0:o.type)===l?t.push(...e(o.props.children,s)):c(o)&&[O,v].includes(null==o?void 0:o.type)&&s?t.push(d(o,{extend:!0,key:n})):t.push(o)}),(null==t?void 0:t.length)?t:void 0}if(w){const o=!0===w?void 0:e(w,!1),s=e(H,V);return V?[o,s]:[[...o||[],...s||[]],void 0]}return[e(H,!1),void 0]},[w,H,V]);return o(s,{children:[t(b,Object.assign({ref:P,"data-testid":"Header"},D,{children:o(g,Object.assign({disableGutters:!B},M,{children:[C&&t(m,Object.assign({"data-testid":"Header.logo",sx:Object.assign({color:"dark"===R.palette.mode?"brand.secondary":"brand.tertiary","& .MuiLink-root":Object.assign(Object.assign({display:"block",position:"relative",py:1},j(R)),{"&.Mui-focusVisible":{boxShadow:"none"}}),"& .MuiSvgIcon-root":{display:"block"}},$)},q,{children:C})),t(m,Object.assign({sx:Object.assign(Object.assign(Object.assign({minWidth:"0",flexGrow:"1",alignSelf:"stretch",display:"flex",alignItems:"stretch",justifyContent:"flex-start",gap:{lg:2,xl:4}},!V&&C&&{pl:4}),{mb:"-1px"}),K),"data-testid":"Header.nav"},N,{children:!V&&I})),(xe||V&&(I||fe))&&o(m,Object.assign({sx:Object.assign({display:"flex",alignItems:"center",justifyContent:"flex-end",gap:.25,mr:{xs:-1,lg:0}},Z),"data-testid":"Header.btns"},_,{children:[xe,V&&(I||fe)&&t(O,Object.assign({"aria-label":"Toggle menu",extend:!1,onClick:()=>me(e=>!e)},E,{children:ge?L||t(h,{}):G||t(f,{})}),"menu")]}))]}))})),V&&(I||fe)&&o(x,Object.assign({disablePortal:!0,disableEnforceFocus:!0,disableAutoFocus:!0,anchor:"top",open:ge,onClose:()=>me(!1),sx:Object.assign({zIndex:R.zIndex.appBar-10,top:R.mixins.toolbar.minHeight,bottom:"auto",height:`calc(100vh - ${R.mixins.toolbar.minHeight})`,position:"absolute"},oe),slotProps:Object.assign({backdrop:Object.assign({sx:Object.assign({position:"absolute"},ue)},be),paper:Object.assign({sx:Object.assign({position:"absolute",height:"100%",display:"grid",gridTemplateRows:"auto max-content"},ce)},de)},ae)},te,{children:[t(m,Object.assign({sx:Object.assign({p:2,overflow:"auto"},U),"data-testid":"Header.mobilenav"},X,{children:I})),fe&&t(m,{sx:{p:2,pt:0},children:t(m,{sx:{pt:.75,display:"flex",flexDirection:"column-reverse",alignItems:"stretch",justifyContent:"flex-start",borderTop:1,borderColor:"dark"===R.palette.mode?"onSurface.os700":"surface.secondary"},children:fe})})]}))]})});export{P as Header};
 //# sourceMappingURL=Header.js.map

package/components/header/Header.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sources":["../../../src/components/header/Header.tsx"],"sourcesContent":["import React, {\n  FC,\n  useState,\n  forwardRef,\n  ReactNode,\n  ElementType,\n  Children,\n  cloneElement,\n  useMemo,\n  Fragment,\n  isValidElement,\n} from 'react';\nimport {\n  AppBar,\n  AppBarProps,\n  BackdropProps,\n  Box,\n  BoxProps,\n  Breakpoint,\n  Drawer,\n  DrawerProps,\n  PaperProps,\n  Theme,\n  Toolbar,\n  ToolbarProps,\n  useMediaQuery,\n  useTheme,\n} from '@mui/material';\nimport { MenuIcon } from '@/src/components/icon/stroke/MenuIcon';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { HeaderButton, HeaderButtonProps } from './HeaderButton';\nimport { HeaderLanguageSelect } from './HeaderLanguageSelect';\n\nexport interface HeaderProps extends Omit<AppBarProps, 'color'> {\n  /**\n   * Logo component\n   */\n  logo?: ReactNode;\n  /**\n   * Items in the menu\n   * @deprecated place links directly as children\n   */\n  navigationItems?: ReactNode;\n  /**\n   * @deprecated no longer has any effect\n   */\n  overheadItems?: ReactNode;\n  /**\n   * @deprecated no longer has any effect\n   */\n  color?: 'light' | 'dark';\n  /**\n   * @deprecated no longer has any effect\n   */\n  breakpoint?: Breakpoint;\n  /**\n   * Wrap the navigation into container\n   * @default false\n   */\n  inContainer?: boolean;\n  /**\n   * ActionButtons on the right side\n   */\n  buttons?: ReactNode;\n  /**\n   * ActionButtons on the right side that stays visible even on mobile\n   */\n  visibleButtons?: ReactNode | true;\n  /**\n   * Properties applied to toolbar container\n   */\n  toolbarProps?: ToolbarProps<ElementType>;\n  /**\n   * Properties applied to logo wrapper\n   */\n  logoProps?: BoxProps<ElementType>;\n  /**\n   * Properties applied to content wrapper\n   */\n  contentProps?: BoxProps<ElementType>;\n  /**\n   * Properties applied to content wrapper in drawer\n   */\n  mobileContentProps?: BoxProps<ElementType>;\n  /**\n   * Properties applied to button wrapper\n   */\n  buttonsProps?: BoxProps<ElementType>;\n  /**\n   * Properties applied to hamburger menu\n   */\n  menuButtonProps?: HeaderButtonProps;\n  /**\n   * Icon of the hamburger menu\n   */\n  menuIcon?: ReactNode;\n  /**\n   * Icon of the close hamburger menu\n   */\n  closeMenuIcon?: ReactNode;\n  /**\n   * Props applied to mobile drawer\n   */\n  drawerProps?: DrawerProps;\n}\n\n/**\n * Component to render Header with navigation and action buttons at the top of the page\n */\nexport const Header: FC<HeaderProps> = forwardRef(\n  (\n    {\n      children,\n      logo,\n      navigationItems,\n      buttons,\n      visibleButtons,\n      overheadItems: _,\n      color: __,\n      breakpoint: ___,\n      inContainer = false,\n      toolbarProps,\n      logoProps,\n      contentProps,\n      mobileContentProps,\n      buttonsProps,\n      menuButtonProps,\n      menuIcon,\n      closeMenuIcon,\n      drawerProps,\n      ...rest\n    },\n    ref,\n  ) => {\n    const theme = useTheme();\n    const downLg = useMediaQuery<Theme>(theme.breakpoints.down('lg'));\n    const { sx: logoSx, ...restLogo } = logoProps ?? {};\n    const { sx: contentSx, ...restContent } = contentProps ?? {};\n    const { sx: mobileContentSx, ...restMobileContent } = mobileContentProps ?? {};\n    const { sx: buttonsSx, ...restButtons } = buttonsProps ?? {};\n    const { sx: drawerSx, slotProps: drawerSlotProps, ...restDrawer } = drawerProps ?? {};\n    const { paper: drawerPaperProps, backdrop: drawerBackdropProps, ...restDrawerSlotProps } = drawerSlotProps ?? {};\n    const { sx: drawerPaperSx, ...restDrawerPaper } = (drawerPaperProps as PaperProps) ?? {};\n    const { sx: drawerBackdropSx, ...restDrawerBackdrop } = (drawerBackdropProps as BackdropProps) ?? {};\n    const [open, setOpen] = useState(false);\n\n    /**\n     * Process visible buttons\n     */\n    const [processedButtons, drawerButtons] = useMemo(() => {\n      function flatten(nodes, extend) {\n        const result = [];\n        Children.forEach(nodes, (child, idx) => {\n          if (child?.type === Fragment) {\n            result.push(...flatten(child.props.children, extend));\n          } else if (\n            isValidElement(child) &&\n            [HeaderButton, HeaderLanguageSelect].includes(child?.type as FC) &&\n            extend\n          ) {\n            result.push(cloneElement(child, { extend: true, key: idx } as HeaderButtonProps));\n          } else {\n            result.push(child);\n          }\n        });\n        return result?.length ? result : undefined;\n      }\n\n      // check if we have visibleButtons property\n      if (visibleButtons) {\n        const flattenedVisibleButtons = visibleButtons === true ? undefined : flatten(visibleButtons, false);\n        const flattenedRestButtons = flatten(buttons, downLg);\n        // mobile\n        if (downLg) {\n          // split visible buttons and put buttons in drawer\n          return [flattenedVisibleButtons, flattenedRestButtons];\n        } else {\n          // on PC, all buttons are visible\n          return [[...(flattenedVisibleButtons || []), ...(flattenedRestButtons || [])], undefined];\n        }\n      } else {\n        // in case visibleButtons property is not provided, do not put buttons into drawer at all\n        return [flatten(buttons, false), undefined];\n      }\n    }, [visibleButtons, buttons, downLg]);\n\n    return (\n      <>\n        <AppBar ref={ref} data-testid=\"Header\" {...rest}>\n          <Toolbar disableGutters={!inContainer} {...toolbarProps}>\n            {logo && (\n              <Box\n                data-testid=\"Header.logo\"\n                sx={{\n                  color: theme.palette.mode === 'dark' ? 'brand.secondary' : 'brand.tertiary',\n                  // restyle wrapper link, same style is applied in HeaderLogo\n                  '& .MuiLink-root': {\n                    display: 'block',\n                    position: 'relative',\n                    py: 1,\n                    // add proper focus ring\n                    ...getFocusRingStyle(theme),\n                    // remove default link box shadow\n                    '&.Mui-focusVisible': {\n                      boxShadow: 'none',\n                    },\n                  },\n                  '& .MuiSvgIcon-root': {\n                    display: 'block',\n                  },\n                  ...logoSx,\n                }}\n                {...restLogo}\n              >\n                {logo}\n              </Box>\n            )}\n            <Box\n              sx={{\n                minWidth: '0',\n                flexGrow: '1',\n                alignSelf: 'stretch',\n                display: 'flex',\n                alignItems: 'stretch',\n                justifyContent: 'flex-start',\n                gap: { lg: 2, xl: 4 },\n                ...(!downLg &&\n                  logo && {\n                    // increase size between logo and nav\n                    pl: 4,\n                  }),\n                // move directly into border\n                mb: '-1px',\n                ...contentSx,\n              }}\n              data-testid=\"Header.nav\"\n              {...restContent}\n            >\n              {!downLg && (children || navigationItems)}\n            </Box>\n            {(processedButtons || (downLg && (children || navigationItems || drawerButtons))) && (\n              <Box\n                sx={{\n                  display: 'flex',\n                  alignItems: 'center',\n                  justifyContent: 'flex-end',\n                  gap: 0.25,\n                  mr: { xs: -1, lg: 0 },\n                  ...buttonsSx,\n                }}\n                data-testid=\"Header.btns\"\n                {...restButtons}\n              >\n                {processedButtons}\n                {downLg && (children || navigationItems || drawerButtons) && (\n                  <HeaderButton\n                    key=\"menu\"\n                    aria-label=\"Toggle menu\"\n                    extend={false}\n                    onClick={() => setOpen((prev) => !prev)}\n                    {...menuButtonProps}\n                  >\n                    {open ? closeMenuIcon || <CloseIcon /> : menuIcon || <MenuIcon />}\n                  </HeaderButton>\n                )}\n              </Box>\n            )}\n          </Toolbar>\n        </AppBar>\n        {downLg && (children || navigationItems || drawerButtons) && (\n          <Drawer\n            disablePortal\n            disableEnforceFocus\n            disableAutoFocus\n            anchor=\"top\"\n            open={open}\n            onClose={() => setOpen(false)}\n            sx={{\n              // bellow Header, above SecondaryNavigation\n              zIndex: theme.zIndex.appBar - 10,\n              // header offset\n              top: theme.mixins.toolbar.minHeight,\n              bottom: 'auto',\n              height: `calc(100vh - ${theme.mixins.toolbar.minHeight})`,\n              // adjust position\n              position: 'absolute',\n              ...drawerSx,\n            }}\n            slotProps={{\n              backdrop: {\n                sx: {\n                  position: 'absolute',\n                  ...drawerBackdropSx,\n                },\n                ...restDrawerBackdrop,\n              },\n              paper: {\n                sx: {\n                  position: 'absolute',\n                  height: '100%',\n                  display: 'grid',\n                  gridTemplateRows: 'auto max-content',\n                  ...drawerPaperSx,\n                },\n                ...restDrawerPaper,\n              },\n              ...restDrawerSlotProps,\n            }}\n            {...restDrawer}\n          >\n            <Box\n              sx={{\n                p: 2,\n                overflow: 'auto',\n                ...mobileContentSx,\n              }}\n              data-testid=\"Header.mobilenav\"\n              {...restMobileContent}\n            >\n              {children || navigationItems}\n            </Box>\n            {drawerButtons && (\n              <Box sx={{ p: 2, pt: 0 }}>\n                <Box\n                  sx={{\n                    pt: 0.75,\n                    display: 'flex',\n                    flexDirection: 'column-reverse',\n                    alignItems: 'stretch',\n                    justifyContent: 'flex-start',\n                    // border from appbar.theme.ts\n                    borderTop: 1,\n                    borderColor: theme.palette.mode === 'dark' ? 'onSurface.os700' : 'surface.secondary',\n                  }}\n                >\n                  {drawerButtons}\n                </Box>\n              </Box>\n            )}\n          </Drawer>\n        )}\n      </>\n    );\n  },\n);\n"],"names":["Header","forwardRef","_a","ref","children","logo","navigationItems","buttons","visibleButtons","overheadItems","_","color","__","breakpoint","___","inContainer","toolbarProps","logoProps","contentProps","mobileContentProps","buttonsProps","menuButtonProps","menuIcon","closeMenuIcon","drawerProps","rest","__rest","theme","useTheme","downLg","useMediaQuery","breakpoints","down","_d","sx","logoSx","restLogo","_e","contentSx","restContent","_f","mobileContentSx","restMobileContent","_g","buttonsSx","restButtons","_h","drawerSx","slotProps","drawerSlotProps","restDrawer","_j","paper","drawerPaperProps","backdrop","drawerBackdropProps","restDrawerSlotProps","_k","_b","drawerPaperSx","restDrawerPaper","_l","_c","drawerBackdropSx","restDrawerBackdrop","open","setOpen","useState","processedButtons","drawerButtons","useMemo","flatten","nodes","extend","result","Children","forEach","child","idx","type","Fragment","push","props","isValidElement","HeaderButton","HeaderLanguageSelect","includes","cloneElement","key","length","undefined","flattenedVisibleButtons","flattenedRestButtons","_jsxs","_jsx","AppBar","Toolbar","Object","assign","disableGutters","Box","palette","mode","display","position","py","getFocusRingStyle","boxShadow","minWidth","flexGrow","alignSelf","alignItems","justifyContent","gap","lg","xl","pl","mb","mr","xs","onClick","prev","CloseIcon","MenuIcon","Drawer","disablePortal","disableEnforceFocus","disableAutoFocus","anchor","onClose","zIndex","appBar","top","mixins","toolbar","minHeight","bottom","height","gridTemplateRows","p","overflow","pt","flexDirection","borderTop","borderColor"],"mappings":"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"}
+{"version":3,"file":"Header.js","sources":["../../../src/components/header/Header.tsx"],"sourcesContent":["import React, {\n  FC,\n  useState,\n  forwardRef,\n  ReactNode,\n  ElementType,\n  Children,\n  cloneElement,\n  useMemo,\n  Fragment,\n  isValidElement,\n} from 'react';\nimport {\n  AppBar,\n  AppBarProps,\n  BackdropProps,\n  Box,\n  BoxProps,\n  Drawer,\n  DrawerProps,\n  PaperProps,\n  Theme,\n  Toolbar,\n  ToolbarProps,\n  useMediaQuery,\n  useTheme,\n} from '@mui/material';\nimport { MenuIcon } from '@/src/components/icon/stroke/MenuIcon';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { HeaderButton, HeaderButtonProps } from './HeaderButton';\nimport { HeaderLanguageSelect } from './HeaderLanguageSelect';\n\nexport interface HeaderProps extends Omit<AppBarProps, 'color'> {\n  /**\n   * Logo component\n   */\n  logo?: ReactNode;\n  /**\n   * Wrap the navigation into container\n   * @default false\n   */\n  inContainer?: boolean;\n  /**\n   * ActionButtons on the right side\n   */\n  buttons?: ReactNode;\n  /**\n   * ActionButtons on the right side that stays visible even on mobile\n   */\n  visibleButtons?: ReactNode | true;\n  /**\n   * Properties applied to toolbar container\n   */\n  toolbarProps?: ToolbarProps<ElementType>;\n  /**\n   * Properties applied to logo wrapper\n   */\n  logoProps?: BoxProps<ElementType>;\n  /**\n   * Properties applied to content wrapper\n   */\n  contentProps?: BoxProps<ElementType>;\n  /**\n   * Properties applied to content wrapper in drawer\n   */\n  mobileContentProps?: BoxProps<ElementType>;\n  /**\n   * Properties applied to button wrapper\n   */\n  buttonsProps?: BoxProps<ElementType>;\n  /**\n   * Properties applied to hamburger menu\n   */\n  menuButtonProps?: HeaderButtonProps;\n  /**\n   * Icon of the hamburger menu\n   */\n  menuIcon?: ReactNode;\n  /**\n   * Icon of the close hamburger menu\n   */\n  closeMenuIcon?: ReactNode;\n  /**\n   * Props applied to mobile drawer\n   */\n  drawerProps?: DrawerProps;\n}\n\n/**\n * Component to render Header with navigation and action buttons at the top of the page\n */\nexport const Header: FC<HeaderProps> = forwardRef(\n  (\n    {\n      children,\n      logo,\n      buttons,\n      visibleButtons,\n      inContainer = false,\n      toolbarProps,\n      logoProps,\n      contentProps,\n      mobileContentProps,\n      buttonsProps,\n      menuButtonProps,\n      menuIcon,\n      closeMenuIcon,\n      drawerProps,\n      ...rest\n    },\n    ref,\n  ) => {\n    const theme = useTheme();\n    const downLg = useMediaQuery<Theme>(theme.breakpoints.down('lg'));\n    const { sx: logoSx, ...restLogo } = logoProps ?? {};\n    const { sx: contentSx, ...restContent } = contentProps ?? {};\n    const { sx: mobileContentSx, ...restMobileContent } = mobileContentProps ?? {};\n    const { sx: buttonsSx, ...restButtons } = buttonsProps ?? {};\n    const { sx: drawerSx, slotProps: drawerSlotProps, ...restDrawer } = drawerProps ?? {};\n    const { paper: drawerPaperProps, backdrop: drawerBackdropProps, ...restDrawerSlotProps } = drawerSlotProps ?? {};\n    const { sx: drawerPaperSx, ...restDrawerPaper } = (drawerPaperProps as PaperProps) ?? {};\n    const { sx: drawerBackdropSx, ...restDrawerBackdrop } = (drawerBackdropProps as BackdropProps) ?? {};\n    const [open, setOpen] = useState(false);\n\n    /**\n     * Process visible buttons\n     */\n    const [processedButtons, drawerButtons] = useMemo(() => {\n      function flatten(nodes, extend) {\n        const result = [];\n        Children.forEach(nodes, (child, idx) => {\n          if (child?.type === Fragment) {\n            result.push(...flatten(child.props.children, extend));\n          } else if (\n            isValidElement(child) &&\n            [HeaderButton, HeaderLanguageSelect].includes(child?.type as FC) &&\n            extend\n          ) {\n            result.push(cloneElement(child, { extend: true, key: idx } as HeaderButtonProps));\n          } else {\n            result.push(child);\n          }\n        });\n        return result?.length ? result : undefined;\n      }\n\n      // check if we have visibleButtons property\n      if (visibleButtons) {\n        const flattenedVisibleButtons = visibleButtons === true ? undefined : flatten(visibleButtons, false);\n        const flattenedRestButtons = flatten(buttons, downLg);\n        // mobile\n        if (downLg) {\n          // split visible buttons and put buttons in drawer\n          return [flattenedVisibleButtons, flattenedRestButtons];\n        } else {\n          // on PC, all buttons are visible\n          return [[...(flattenedVisibleButtons || []), ...(flattenedRestButtons || [])], undefined];\n        }\n      } else {\n        // in case visibleButtons property is not provided, do not put buttons into drawer at all\n        return [flatten(buttons, false), undefined];\n      }\n    }, [visibleButtons, buttons, downLg]);\n\n    return (\n      <>\n        <AppBar ref={ref} data-testid=\"Header\" {...rest}>\n          <Toolbar disableGutters={!inContainer} {...toolbarProps}>\n            {logo && (\n              <Box\n                data-testid=\"Header.logo\"\n                sx={{\n                  color: theme.palette.mode === 'dark' ? 'brand.secondary' : 'brand.tertiary',\n                  // restyle wrapper link, same style is applied in HeaderLogo\n                  '& .MuiLink-root': {\n                    display: 'block',\n                    position: 'relative',\n                    py: 1,\n                    // add proper focus ring\n                    ...getFocusRingStyle(theme),\n                    // remove default link box shadow\n                    '&.Mui-focusVisible': {\n                      boxShadow: 'none',\n                    },\n                  },\n                  '& .MuiSvgIcon-root': {\n                    display: 'block',\n                  },\n                  ...logoSx,\n                }}\n                {...restLogo}\n              >\n                {logo}\n              </Box>\n            )}\n            <Box\n              sx={{\n                minWidth: '0',\n                flexGrow: '1',\n                alignSelf: 'stretch',\n                display: 'flex',\n                alignItems: 'stretch',\n                justifyContent: 'flex-start',\n                gap: { lg: 2, xl: 4 },\n                ...(!downLg &&\n                  logo && {\n                    // increase size between logo and nav\n                    pl: 4,\n                  }),\n                // move directly into border\n                mb: '-1px',\n                ...contentSx,\n              }}\n              data-testid=\"Header.nav\"\n              {...restContent}\n            >\n              {!downLg && children}\n            </Box>\n            {(processedButtons || (downLg && (children || drawerButtons))) && (\n              <Box\n                sx={{\n                  display: 'flex',\n                  alignItems: 'center',\n                  justifyContent: 'flex-end',\n                  gap: 0.25,\n                  mr: { xs: -1, lg: 0 },\n                  ...buttonsSx,\n                }}\n                data-testid=\"Header.btns\"\n                {...restButtons}\n              >\n                {processedButtons}\n                {downLg && (children || drawerButtons) && (\n                  <HeaderButton\n                    key=\"menu\"\n                    aria-label=\"Toggle menu\"\n                    extend={false}\n                    onClick={() => setOpen((prev) => !prev)}\n                    {...menuButtonProps}\n                  >\n                    {open ? closeMenuIcon || <CloseIcon /> : menuIcon || <MenuIcon />}\n                  </HeaderButton>\n                )}\n              </Box>\n            )}\n          </Toolbar>\n        </AppBar>\n        {downLg && (children || drawerButtons) && (\n          <Drawer\n            disablePortal\n            disableEnforceFocus\n            disableAutoFocus\n            anchor=\"top\"\n            open={open}\n            onClose={() => setOpen(false)}\n            sx={{\n              // bellow Header, above SecondaryNavigation\n              zIndex: theme.zIndex.appBar - 10,\n              // header offset\n              top: theme.mixins.toolbar.minHeight,\n              bottom: 'auto',\n              height: `calc(100vh - ${theme.mixins.toolbar.minHeight})`,\n              // adjust position\n              position: 'absolute',\n              ...drawerSx,\n            }}\n            slotProps={{\n              backdrop: {\n                sx: {\n                  position: 'absolute',\n                  ...drawerBackdropSx,\n                },\n                ...restDrawerBackdrop,\n              },\n              paper: {\n                sx: {\n                  position: 'absolute',\n                  height: '100%',\n                  display: 'grid',\n                  gridTemplateRows: 'auto max-content',\n                  ...drawerPaperSx,\n                },\n                ...restDrawerPaper,\n              },\n              ...restDrawerSlotProps,\n            }}\n            {...restDrawer}\n          >\n            <Box\n              sx={{\n                p: 2,\n                overflow: 'auto',\n                ...mobileContentSx,\n              }}\n              data-testid=\"Header.mobilenav\"\n              {...restMobileContent}\n            >\n              {children}\n            </Box>\n            {drawerButtons && (\n              <Box sx={{ p: 2, pt: 0 }}>\n                <Box\n                  sx={{\n                    pt: 0.75,\n                    display: 'flex',\n                    flexDirection: 'column-reverse',\n                    alignItems: 'stretch',\n                    justifyContent: 'flex-start',\n                    // border from appbar.theme.ts\n                    borderTop: 1,\n                    borderColor: theme.palette.mode === 'dark' ? 'onSurface.os700' : 'surface.secondary',\n                  }}\n                >\n                  {drawerButtons}\n                </Box>\n              </Box>\n            )}\n          </Drawer>\n        )}\n      </>\n    );\n  },\n);\n"],"names":["Header","forwardRef","_a","ref","children","logo","buttons","visibleButtons","inContainer","toolbarProps","logoProps","contentProps","mobileContentProps","buttonsProps","menuButtonProps","menuIcon","closeMenuIcon","drawerProps","rest","__rest","theme","useTheme","downLg","useMediaQuery","breakpoints","down","_d","sx","logoSx","restLogo","_e","contentSx","restContent","_f","mobileContentSx","restMobileContent","_g","buttonsSx","restButtons","_h","drawerSx","slotProps","drawerSlotProps","restDrawer","_j","paper","drawerPaperProps","backdrop","drawerBackdropProps","restDrawerSlotProps","_k","_b","drawerPaperSx","restDrawerPaper","_l","_c","drawerBackdropSx","restDrawerBackdrop","open","setOpen","useState","processedButtons","drawerButtons","useMemo","flatten","nodes","extend","result","Children","forEach","child","idx","type","Fragment","push","props","isValidElement","HeaderButton","HeaderLanguageSelect","includes","cloneElement","key","length","undefined","flattenedVisibleButtons","flattenedRestButtons","_jsxs","_jsx","AppBar","Toolbar","Object","assign","disableGutters","Box","color","palette","mode","display","position","py","getFocusRingStyle","boxShadow","minWidth","flexGrow","alignSelf","alignItems","justifyContent","gap","lg","xl","pl","mb","mr","xs","onClick","prev","CloseIcon","MenuIcon","Drawer","disablePortal","disableEnforceFocus","disableAutoFocus","anchor","onClose","zIndex","appBar","top","mixins","toolbar","minHeight","bottom","height","gridTemplateRows","p","overflow","pt","flexDirection","borderTop","borderColor"],"mappings":"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"}

package/components/header/HeaderButton.d.ts

@@ -17,38 +17,8 @@ export interface HeaderButtonProps extends IconButtonProps<ElementType> {
      * Properties applied to badge
      */
     badgeProps?: BadgeProps;
-    /**
-     * @deprecated use badgeProps instead
-     */
-    indicator?: string;
-    /**
-     * @deprecated provide icon directly as children (e.g. <BellIcon />)
-     */
-    icon?: 'car' | 'bell' | 'search' | 'profile' | 'user' | 'heart' | 'shopping-bag' | 'globe' | 'login' | 'logout' | 'close' | 'circle-question' | 'hamburger';
 }
 /**
  * IconButton for the action links
  */
 export declare const HeaderButton: FC<HeaderButtonProps>;
-/** @deprecated use <HeaderButton> with icon of your choosing instead */
-export declare const HeaderBellButton: FC<HeaderButtonProps>;
-/** @deprecated use <HeaderButton> with icon of your choosing instead */
-export declare const HeaderSearchButton: FC<HeaderButtonProps>;
-/** @deprecated use <HeaderButton> with icon of your choosing instead */
-export declare const HeaderProfileButton: FC<HeaderButtonProps>;
-/** @deprecated use <HeaderButton> with icon of your choosing instead */
-export declare const HeaderHeartButton: FC<HeaderButtonProps>;
-/** @deprecated use <HeaderButton> with icon of your choosing instead */
-export declare const HeaderCartButton: FC<HeaderButtonProps>;
-/** @deprecated use <HeaderButton> with icon of your choosing instead */
-export declare const HeaderLanguageButton: FC<HeaderButtonProps>;
-/** @deprecated use <HeaderButton> with icon of your choosing instead */
-export declare const HeaderLoginButton: FC<HeaderButtonProps>;
-/** @deprecated use <HeaderButton> with icon of your choosing instead */
-export declare const HeaderLogoutButton: FC<HeaderButtonProps>;
-/** @deprecated use <HeaderButton> with icon of your choosing instead */
-export declare const HeaderCloseButton: FC<HeaderButtonProps>;
-/** @deprecated use <HeaderButton> with icon of your choosing instead */
-export declare const HeaderFaqButton: FC<HeaderButtonProps>;
-/** @deprecated use <HeaderButton> with icon of your choosing instead */
-export declare const HeaderMenuButton: FC<HeaderButtonProps>;

package/components/header/HeaderButton.js

@@ -1,2 +1,2 @@
-import{__rest as e}from"tslib";import{jsxs as r,jsx as t}from"react/jsx-runtime";import{forwardRef as i,useMemo as o}from"react";import{useTheme as s,ButtonBase as n,Badge as c,Tooltip as a,IconButton as l}from"@mui/material";import{getFocusRingStyle as m}from"../focusring/focusring.js";import{getInteractiveStyle as f}from"../../materialui/button/interactive.js";import{CarIcon as g}from"../icon/stroke/CarIcon.js";import{BellIcon as d}from"../icon/stroke/BellIcon.js";import{SearchIcon as b}from"../icon/stroke/SearchIcon.js";import{UserIcon as j}from"../icon/stroke/UserIcon.js";import{HeartIcon as p}from"../icon/stroke/HeartIcon.js";import{ShoppingBagIcon as u}from"../icon/stroke/ShoppingBagIcon.js";import{GlobeIcon as h}from"../icon/stroke/GlobeIcon.js";import{LoginIcon as O}from"../icon/stroke/LoginIcon.js";import{LogoutIcon as I}from"../icon/stroke/LogoutIcon.js";import{CloseIcon as x}from"../icon/stroke/CloseIcon.js";import{CircleQuestionIcon as k}from"../icon/stroke/CircleQuestionIcon.js";import{MenuIcon as v}from"../icon/stroke/MenuIcon.js";const y=i((i,y)=>{var{children:B,sx:C,icon:P,label:S,indicator:H,extend:M,tooltipProps:z,badgeProps:L}=i,W=e(i,["children","sx","icon","label","indicator","extend","tooltipProps","badgeProps"]);const q=s(),w=null!=z?z:{},{title:G}=w,Q=e(w,["title"]),R=o(()=>{switch(P){case"car":return g;case"bell":return d;case"search":return b;case"profile":case"user":return j;case"heart":return p;case"shopping-bag":return u;case"globe":return h;case"login":return O;case"logout":return I;case"close":return x;case"circle-question":return k;case"hamburger":return v;default:return}},[P]);return M?r(n,Object.assign({sx:Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},q.typography.list),{display:"flex",alignItems:"center",justifyContent:"flex-start",gap:1.25,py:1.5,px:1.25,"& .MuiSvgIcon-root":{fontSize:"17px"},"&.Mui-disabled":{color:"disabled.tertiary"}}),f({fontWeight:"300"},{fontWeight:"700"})),m(q)),{"&&:before":{borderRadius:"4px"}}),C),ref:y,"data-testid":"HeaderButton"},W,{children:[t(c,Object.assign({},H&&{variant:"dot",invisible:!1},L,{children:B||t(R,{})})),S||G]})):t(a,Object.assign({title:S||G},Q,{children:t(l,Object.assign({sx:C,size:"medium",ref:y,"data-testid":"HeaderButton"},W,{children:t(c,Object.assign({},H&&{variant:"dot",invisible:!1},L,{children:B||t(R,{})}))}))}))}),B=i((e,r)=>t(y,Object.assign({ref:r},e,{children:t(d,{})}))),C=i((e,r)=>t(y,Object.assign({ref:r},e,{children:t(b,{})}))),P=i((e,r)=>t(y,Object.assign({ref:r},e,{children:t(j,{})}))),S=i((e,r)=>t(y,Object.assign({ref:r},e,{children:t(p,{})}))),H=i((e,r)=>t(y,Object.assign({ref:r},e,{children:t(u,{})}))),M=i((e,r)=>t(y,Object.assign({ref:r},e,{children:t(h,{})}))),z=i((e,r)=>t(y,Object.assign({ref:r},e,{children:t(O,{})}))),L=i((e,r)=>t(y,Object.assign({ref:r},e,{children:t(I,{})}))),W=i((e,r)=>t(y,Object.assign({ref:r},e,{children:t(x,{})}))),q=i((e,r)=>t(y,Object.assign({ref:r},e,{children:t(k,{})}))),w=i((e,r)=>t(y,Object.assign({ref:r},e,{children:t(v,{})})));export{B as HeaderBellButton,y as HeaderButton,H as HeaderCartButton,W as HeaderCloseButton,q as HeaderFaqButton,S as HeaderHeartButton,M as HeaderLanguageButton,z as HeaderLoginButton,L as HeaderLogoutButton,w as HeaderMenuButton,P as HeaderProfileButton,C as HeaderSearchButton};
+import{__rest as t}from"tslib";import{jsxs as e,jsx as i}from"react/jsx-runtime";import{forwardRef as r}from"react";import{useTheme as s,ButtonBase as o,Badge as n,Tooltip as a,IconButton as l}from"@mui/material";import{getFocusRingStyle as c}from"../focusring/focusring.js";import{getInteractiveStyle as d}from"../../materialui/button/interactive.js";const b=r((r,b)=>{var{children:g,sx:p,label:m,extend:f,tooltipProps:j,badgeProps:u}=r,x=t(r,["children","sx","label","extend","tooltipProps","badgeProps"]);const O=s(),h=null!=j?j:{},{title:y}=h,P=t(h,["title"]);return f?e(o,Object.assign({sx:Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},O.typography.list),{display:"flex",alignItems:"center",justifyContent:"flex-start",gap:1.25,py:1.5,px:1.25,"& .MuiSvgIcon-root":{fontSize:"17px"},"&.Mui-disabled":{color:"disabled.tertiary"}}),d({fontWeight:"300"},{fontWeight:"700"})),c(O)),{"&&:before":{borderRadius:"4px"}}),p),ref:b,"data-testid":"HeaderButton"},x,{children:[i(n,Object.assign({},u,{children:g})),m||y]})):i(a,Object.assign({title:m||y},P,{children:i(l,Object.assign({sx:p,size:"medium",ref:b,"data-testid":"HeaderButton"},x,{children:i(n,Object.assign({},u,{children:g}))}))}))});export{b as HeaderButton};
 //# sourceMappingURL=HeaderButton.js.map

package/components/header/HeaderButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"HeaderButton.js","sources":["../../../src/components/header/HeaderButton.tsx"],"sourcesContent":["import React, { ElementType, FC, ForwardedRef, forwardRef, useMemo } from 'react';\nimport {\n  IconButton,\n  IconButtonProps,\n  ButtonBase,\n  Tooltip,\n  TooltipProps,\n  Badge,\n  BadgeProps,\n  useTheme,\n} from '@mui/material';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\nimport { CarIcon } from '@/src/components/icon/stroke/CarIcon';\nimport { BellIcon } from '@/src/components/icon/stroke/BellIcon';\nimport { SearchIcon } from '@/src/components/icon/stroke/SearchIcon';\nimport { UserIcon } from '@/src/components/icon/stroke/UserIcon';\nimport { HeartIcon } from '@/src/components/icon/stroke/HeartIcon';\nimport { ShoppingBagIcon } from '@/src/components/icon/stroke/ShoppingBagIcon';\nimport { GlobeIcon } from '@/src/components/icon/stroke/GlobeIcon';\nimport { LoginIcon } from '@/src/components/icon/stroke/LoginIcon';\nimport { LogoutIcon } from '@/src/components/icon/stroke/LogoutIcon';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\nimport { CircleQuestionIcon } from '@/src/components/icon/stroke/CircleQuestionIcon';\nimport { MenuIcon } from '@/src/components/icon/stroke/MenuIcon';\n\nexport interface HeaderButtonProps extends IconButtonProps<ElementType> {\n  /**\n   * Label for the tooltip or the text button\n   */\n  label?: TooltipProps['title'];\n  /**\n   * Change icon button with tooltip into button\n   */\n  extend?: boolean;\n  /**\n   * Properties applied to tooltip\n   */\n  tooltipProps?: Partial<TooltipProps>;\n  /**\n   * Properties applied to badge\n   */\n  badgeProps?: BadgeProps;\n  /**\n   * @deprecated use badgeProps instead\n   */\n  indicator?: string;\n  /**\n   * @deprecated provide icon directly as children (e.g. <BellIcon />)\n   */\n  icon?:\n    | 'car'\n    | 'bell'\n    | 'search'\n    | 'profile'\n    | 'user'\n    | 'heart'\n    | 'shopping-bag'\n    | 'globe'\n    | 'login'\n    | 'logout'\n    | 'close'\n    | 'circle-question'\n    | 'hamburger';\n}\n\n/**\n * IconButton for the action links\n */\nexport const HeaderButton: FC<HeaderButtonProps> = forwardRef(\n  ({ children, sx, icon, label, indicator, extend, tooltipProps, badgeProps, ...rest }, ref) => {\n    const theme = useTheme();\n    const { title, ...restTooltip } = tooltipProps ?? {};\n\n    // mapper to previous api\n    const Icon = useMemo(() => {\n      switch (icon) {\n        case 'car':\n          return CarIcon;\n        case 'bell':\n          return BellIcon;\n        case 'search':\n          return SearchIcon;\n        case 'profile':\n        case 'user':\n          return UserIcon;\n        case 'heart':\n          return HeartIcon;\n        case 'shopping-bag':\n          return ShoppingBagIcon;\n        case 'globe':\n          return GlobeIcon;\n        case 'login':\n          return LoginIcon;\n        case 'logout':\n          return LogoutIcon;\n        case 'close':\n          return CloseIcon;\n        case 'circle-question':\n          return CircleQuestionIcon;\n        case 'hamburger':\n          return MenuIcon;\n        default:\n          return undefined;\n      }\n    }, [icon]);\n\n    if (extend) {\n      return (\n        <ButtonBase\n          sx={{\n            ...theme.typography.list,\n            display: 'flex',\n            alignItems: 'center',\n            justifyContent: 'flex-start',\n            gap: 1.25,\n            py: 1.5,\n            px: 1.25,\n            // icon inside\n            '& .MuiSvgIcon-root': {\n              fontSize: '17px',\n            },\n            // disabled style\n            '&.Mui-disabled': {\n              color: 'disabled.tertiary',\n            },\n            // interactive style\n            ...getInteractiveStyle(\n              {\n                fontWeight: '300',\n              },\n              {\n                fontWeight: '700',\n              },\n            ),\n            // focus ring\n            ...getFocusRingStyle(theme),\n            '&&:before': {\n              borderRadius: '4px',\n            },\n            ...sx,\n          }}\n          ref={ref as ForwardedRef<HTMLButtonElement>}\n          data-testid=\"HeaderButton\"\n          {...rest}\n        >\n          <Badge {...(indicator && { variant: 'dot', invisible: false })} {...badgeProps}>\n            {children || <Icon />}\n          </Badge>\n          {label || title}\n        </ButtonBase>\n      );\n    }\n\n    return (\n      <Tooltip title={label || title} {...restTooltip}>\n        <IconButton\n          sx={sx}\n          size=\"medium\"\n          ref={ref as ForwardedRef<HTMLButtonElement>}\n          data-testid=\"HeaderButton\"\n          {...rest}\n        >\n          <Badge {...(indicator && { variant: 'dot', invisible: false })} {...badgeProps}>\n            {children || <Icon />}\n          </Badge>\n        </IconButton>\n      </Tooltip>\n    );\n  },\n);\n\n/** @deprecated use <HeaderButton> with icon of your choosing instead */\nexport const HeaderBellButton: FC<HeaderButtonProps> = forwardRef((props, ref) => (\n  <HeaderButton ref={ref} {...props}>\n    <BellIcon />\n  </HeaderButton>\n));\n/** @deprecated use <HeaderButton> with icon of your choosing instead */\nexport const HeaderSearchButton: FC<HeaderButtonProps> = forwardRef((props, ref) => (\n  <HeaderButton ref={ref} {...props}>\n    <SearchIcon />\n  </HeaderButton>\n));\n/** @deprecated use <HeaderButton> with icon of your choosing instead */\nexport const HeaderProfileButton: FC<HeaderButtonProps> = forwardRef((props, ref) => (\n  <HeaderButton ref={ref} {...props}>\n    <UserIcon />\n  </HeaderButton>\n));\n/** @deprecated use <HeaderButton> with icon of your choosing instead */\nexport const HeaderHeartButton: FC<HeaderButtonProps> = forwardRef((props, ref) => (\n  <HeaderButton ref={ref} {...props}>\n    <HeartIcon />\n  </HeaderButton>\n));\n/** @deprecated use <HeaderButton> with icon of your choosing instead */\nexport const HeaderCartButton: FC<HeaderButtonProps> = forwardRef((props, ref) => (\n  <HeaderButton ref={ref} {...props}>\n    <ShoppingBagIcon />\n  </HeaderButton>\n));\n/** @deprecated use <HeaderButton> with icon of your choosing instead */\nexport const HeaderLanguageButton: FC<HeaderButtonProps> = forwardRef((props, ref) => (\n  <HeaderButton ref={ref} {...props}>\n    <GlobeIcon />\n  </HeaderButton>\n));\n/** @deprecated use <HeaderButton> with icon of your choosing instead */\nexport const HeaderLoginButton: FC<HeaderButtonProps> = forwardRef((props, ref) => (\n  <HeaderButton ref={ref} {...props}>\n    <LoginIcon />\n  </HeaderButton>\n));\n/** @deprecated use <HeaderButton> with icon of your choosing instead */\nexport const HeaderLogoutButton: FC<HeaderButtonProps> = forwardRef((props, ref) => (\n  <HeaderButton ref={ref} {...props}>\n    <LogoutIcon />\n  </HeaderButton>\n));\n/** @deprecated use <HeaderButton> with icon of your choosing instead */\nexport const HeaderCloseButton: FC<HeaderButtonProps> = forwardRef((props, ref) => (\n  <HeaderButton ref={ref} {...props}>\n    <CloseIcon />\n  </HeaderButton>\n));\n/** @deprecated use <HeaderButton> with icon of your choosing instead */\nexport const HeaderFaqButton: FC<HeaderButtonProps> = forwardRef((props, ref) => (\n  <HeaderButton ref={ref} {...props}>\n    <CircleQuestionIcon />\n  </HeaderButton>\n));\n/** @deprecated use <HeaderButton> with icon of your choosing instead */\nexport const HeaderMenuButton: FC<HeaderButtonProps> = forwardRef((props, ref) => (\n  <HeaderButton ref={ref} {...props}>\n    <MenuIcon />\n  </HeaderButton>\n));\n"],"names":["HeaderButton","forwardRef","_a","ref","children","sx","icon","label","indicator","extend","tooltipProps","badgeProps","rest","__rest","theme","useTheme","_b","title","restTooltip","Icon","useMemo","CarIcon","BellIcon","SearchIcon","UserIcon","HeartIcon","ShoppingBagIcon","GlobeIcon","LoginIcon","LogoutIcon","CloseIcon","CircleQuestionIcon","MenuIcon","_jsxs","ButtonBase","Object","assign","typography","list","display","alignItems","justifyContent","gap","py","px","fontSize","color","getInteractiveStyle","fontWeight","getFocusRingStyle","borderRadius","_jsx","Badge","variant","invisible","Tooltip","IconButton","size","HeaderBellButton","props","HeaderSearchButton","HeaderProfileButton","HeaderHeartButton","HeaderCartButton","HeaderLanguageButton","HeaderLoginButton","HeaderLogoutButton","HeaderCloseButton","HeaderFaqButton","HeaderMenuButton"],"mappings":"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"}
+{"version":3,"file":"HeaderButton.js","sources":["../../../src/components/header/HeaderButton.tsx"],"sourcesContent":["import React, { ElementType, FC, ForwardedRef, forwardRef } from 'react';\nimport {\n  IconButton,\n  IconButtonProps,\n  ButtonBase,\n  Tooltip,\n  TooltipProps,\n  Badge,\n  BadgeProps,\n  useTheme,\n} from '@mui/material';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport interface HeaderButtonProps extends IconButtonProps<ElementType> {\n  /**\n   * Label for the tooltip or the text button\n   */\n  label?: TooltipProps['title'];\n  /**\n   * Change icon button with tooltip into button\n   */\n  extend?: boolean;\n  /**\n   * Properties applied to tooltip\n   */\n  tooltipProps?: Partial<TooltipProps>;\n  /**\n   * Properties applied to badge\n   */\n  badgeProps?: BadgeProps;\n}\n\n/**\n * IconButton for the action links\n */\nexport const HeaderButton: FC<HeaderButtonProps> = forwardRef(\n  ({ children, sx, label, extend, tooltipProps, badgeProps, ...rest }, ref) => {\n    const theme = useTheme();\n    const { title, ...restTooltip } = tooltipProps ?? {};\n\n    if (extend) {\n      return (\n        <ButtonBase\n          sx={{\n            ...theme.typography.list,\n            display: 'flex',\n            alignItems: 'center',\n            justifyContent: 'flex-start',\n            gap: 1.25,\n            py: 1.5,\n            px: 1.25,\n            // icon inside\n            '& .MuiSvgIcon-root': {\n              fontSize: '17px',\n            },\n            // disabled style\n            '&.Mui-disabled': {\n              color: 'disabled.tertiary',\n            },\n            // interactive style\n            ...getInteractiveStyle(\n              {\n                fontWeight: '300',\n              },\n              {\n                fontWeight: '700',\n              },\n            ),\n            // focus ring\n            ...getFocusRingStyle(theme),\n            '&&:before': {\n              borderRadius: '4px',\n            },\n            ...sx,\n          }}\n          ref={ref as ForwardedRef<HTMLButtonElement>}\n          data-testid=\"HeaderButton\"\n          {...rest}\n        >\n          <Badge {...badgeProps}>{children}</Badge>\n          {label || title}\n        </ButtonBase>\n      );\n    }\n\n    return (\n      <Tooltip title={label || title} {...restTooltip}>\n        <IconButton\n          sx={sx}\n          size=\"medium\"\n          ref={ref as ForwardedRef<HTMLButtonElement>}\n          data-testid=\"HeaderButton\"\n          {...rest}\n        >\n          <Badge {...badgeProps}>{children}</Badge>\n        </IconButton>\n      </Tooltip>\n    );\n  },\n);\n"],"names":["HeaderButton","forwardRef","_a","ref","children","sx","label","extend","tooltipProps","badgeProps","rest","__rest","theme","useTheme","_b","title","restTooltip","_jsxs","ButtonBase","Object","assign","typography","list","display","alignItems","justifyContent","gap","py","px","fontSize","color","getInteractiveStyle","fontWeight","getFocusRingStyle","borderRadius","_jsx","Badge","Tooltip","IconButton","size"],"mappings":"gWAoCO,MAAMA,EAAsCC,EACjD,CAACC,EAAoEC,KAApE,IAAAC,SAAEA,EAAQC,GAAEA,EAAEC,MAAEA,EAAKC,OAAEA,EAAMC,aAAEA,EAAYC,WAAEA,GAAUP,EAAKQ,EAAIC,EAAAT,EAAhE,gEACC,MAAMU,EAAQC,IACRC,EAA4BN,QAAAA,EAAgB,CAAA,GAA5CO,MAAEA,GAAKD,EAAKE,EAAWL,EAAAG,EAAvB,CAAA,UAEN,OAAIP,EAEAU,EAACC,EAAUC,OAAAC,OAAA,CACTf,GAAEc,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EACGR,EAAMS,WAAWC,MAAI,CACxBC,QAAS,OACTC,WAAY,SACZC,eAAgB,aAChBC,IAAK,KACLC,GAAI,IACJC,GAAI,KAEJ,qBAAsB,CACpBC,SAAU,QAGZ,iBAAkB,CAChBC,MAAO,uBAGNC,EACD,CACEC,WAAY,OAEd,CACEA,WAAY,SAIbC,EAAkBrB,IAAM,CAC3B,YAAa,CACXsB,aAAc,SAEb7B,GAELF,IAAKA,EAAsC,cAC/B,gBACRO,EAAI,CAAAN,SAAA,CAER+B,EAACC,EAAKjB,OAAAC,OAAA,GAAKX,EAAU,CAAAL,SAAGA,KACvBE,GAASS,MAMdoB,EAACE,iBAAQtB,MAAOT,GAASS,GAAWC,YAClCmB,EAACG,iBACCjC,GAAIA,EACJkC,KAAK,SACLpC,IAAKA,EAAsC,cAC/B,gBACRO,EAAI,CAAAN,SAER+B,EAACC,EAAKjB,OAAAC,OAAA,CAAA,EAAKX,EAAU,CAAAL,SAAGA"}

package/components/header/HeaderLogo.d.ts

@@ -6,20 +6,8 @@ export interface HeaderLogoProps extends LinkProps {
      * Properties applied to Logo component
      */
     logoProps?: LogoProps;
-    /**
-     * @deprecated no longer has any effect
-     */
-    src?: string;
-    /**
-     * @deprecated no longer has any effect
-     */
-    alt?: string;
 }
 /**
  * Logo with link wrapper
  */
 export declare const HeaderLogo: FC<HeaderLogoProps>;
-/**
- * @deprecated use <HeaderLogo /> component instead
- */
-export declare const HeaderSkodaLogo: FC<HeaderLogoProps>;

package/components/header/HeaderLogo.js

@@ -1,2 +1,2 @@
-import{__rest as o}from"tslib";import{jsx as r}from"react/jsx-runtime";import{forwardRef as i}from"react";import{useTheme as s,Link as e}from"@mui/material";import{Logo as t}from"../logo/Logo.js";import{getFocusRingStyle as c}from"../focusring/focusring.js";const n=i((i,n)=>{var{sx:a,children:l,href:m,logoProps:f}=i,g=o(i,["sx","children","href","logoProps"]);const p=s();return m||g.onClick?r(e,Object.assign({sx:Object.assign(Object.assign({display:"block",position:"relative",py:1},c(p)),{"&.Mui-focusVisible":{boxShadow:"none"},"& .MuiSvgIcon-root":{display:"block"}}),href:m||"#",ref:n,"aria-label":"Home"},g,{children:l||r(t,Object.assign({},f))})):l||r(t,Object.assign({sx:a,ref:n},f))}),a=i((o,i)=>r(n,Object.assign({},o,{ref:i})));export{n as HeaderLogo,a as HeaderSkodaLogo};
+import{__rest as o}from"tslib";import{jsx as r}from"react/jsx-runtime";import{forwardRef as i}from"react";import{useTheme as s,Link as e}from"@mui/material";import{Logo as t}from"../logo/Logo.js";import{getFocusRingStyle as c}from"../focusring/focusring.js";const n=i((i,n)=>{var{sx:a,children:l,href:m,logoProps:f}=i,p=o(i,["sx","children","href","logoProps"]);const g=s();return m||p.onClick?r(e,Object.assign({sx:Object.assign(Object.assign({display:"block",position:"relative",py:1},c(g)),{"&.Mui-focusVisible":{boxShadow:"none"},"& .MuiSvgIcon-root":{display:"block"}}),href:m||"#",ref:n,"aria-label":"Home"},p,{children:l||r(t,Object.assign({},f))})):l||r(t,Object.assign({sx:a,ref:n},f))});export{n as HeaderLogo};
 //# sourceMappingURL=HeaderLogo.js.map

package/components/header/HeaderLogo.js.map

@@ -1 +1 @@
-{"version":3,"file":"HeaderLogo.js","sources":["../../../src/components/header/HeaderLogo.tsx"],"sourcesContent":["import React, { FC, ForwardedRef, forwardRef } from 'react';\nimport { Link, LinkProps, useTheme } from '@mui/material';\nimport { Logo, LogoProps } from '@/src/components/logo/Logo';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\n\nexport interface HeaderLogoProps extends LinkProps {\n  /**\n   * Properties applied to Logo component\n   */\n  logoProps?: LogoProps;\n  /**\n   * @deprecated no longer has any effect\n   */\n  src?: string;\n  /**\n   * @deprecated no longer has any effect\n   */\n  alt?: string;\n}\n\n/**\n * Logo with link wrapper\n */\nexport const HeaderLogo: FC<HeaderLogoProps> = forwardRef(({ sx, children, href, logoProps, ...rest }, ref) => {\n  const theme = useTheme();\n\n  if (href || rest.onClick) {\n    return (\n      <Link\n        sx={{\n          // same style is applied in Header logo wrapper\n          display: 'block',\n          position: 'relative',\n          py: 1,\n          // add proper focus ring\n          ...getFocusRingStyle(theme),\n          // remove default link box shadow\n          '&.Mui-focusVisible': {\n            boxShadow: 'none',\n          },\n          '& .MuiSvgIcon-root': {\n            display: 'block',\n          },\n        }}\n        href={href || '#'}\n        ref={ref}\n        aria-label=\"Home\"\n        {...rest}\n      >\n        {children || <Logo {...logoProps} />}\n      </Link>\n    );\n  }\n  return children || <Logo sx={sx} ref={ref as unknown as ForwardedRef<SVGSVGElement>} {...logoProps} />;\n});\n\n/**\n * @deprecated use <HeaderLogo /> component instead\n */\nexport const HeaderSkodaLogo: FC<HeaderLogoProps> = forwardRef((props, ref) => {\n  return <HeaderLogo {...props} ref={ref} />;\n});\n"],"names":["HeaderLogo","forwardRef","_a","ref","sx","children","href","logoProps","rest","__rest","theme","useTheme","onClick","_jsx","Link","Object","assign","display","position","py","getFocusRingStyle","boxShadow","Logo","HeaderSkodaLogo","props"],"mappings":"kQAuBO,MAAMA,EAAkCC,EAAW,CAACC,EAA4CC,KAA5C,IAAAC,GAAEA,EAAEC,SAAEA,EAAQC,KAAEA,EAAIC,UAAEA,GAASL,EAAKM,EAAIC,EAAAP,EAAxC,CAAA,KAAA,WAAA,OAAA,cACzD,MAAMQ,EAAQC,IAEd,OAAIL,GAAQE,EAAKI,QAEbC,EAACC,EAAIC,OAAAC,OAAA,CACHZ,GAAEW,OAAAC,OAAAD,OAAAC,OAAA,CAEAC,QAAS,QACTC,SAAU,WACVC,GAAI,GAEDC,EAAkBV,IAAM,CAE3B,qBAAsB,CACpBW,UAAW,QAEb,qBAAsB,CACpBJ,QAAS,WAGbX,KAAMA,GAAQ,IACdH,IAAKA,EAAG,aACG,QACPK,EAAI,CAAAH,SAEPA,GAAYQ,EAACS,mBAASf,OAItBF,GAAYQ,EAACS,iBAAKlB,GAAIA,EAAID,IAAKA,GAAmDI,MAM9EgB,EAAuCtB,EAAW,CAACuB,EAAOrB,IAC9DU,EAACb,EAAUe,OAAAC,OAAA,GAAKQ,GAAOrB,IAAKA"}
+{"version":3,"file":"HeaderLogo.js","sources":["../../../src/components/header/HeaderLogo.tsx"],"sourcesContent":["import React, { FC, ForwardedRef, forwardRef } from 'react';\nimport { Link, LinkProps, useTheme } from '@mui/material';\nimport { Logo, LogoProps } from '@/src/components/logo/Logo';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\n\nexport interface HeaderLogoProps extends LinkProps {\n  /**\n   * Properties applied to Logo component\n   */\n  logoProps?: LogoProps;\n}\n\n/**\n * Logo with link wrapper\n */\nexport const HeaderLogo: FC<HeaderLogoProps> = forwardRef(({ sx, children, href, logoProps, ...rest }, ref) => {\n  const theme = useTheme();\n\n  if (href || rest.onClick) {\n    return (\n      <Link\n        sx={{\n          // same style is applied in Header logo wrapper\n          display: 'block',\n          position: 'relative',\n          py: 1,\n          // add proper focus ring\n          ...getFocusRingStyle(theme),\n          // remove default link box shadow\n          '&.Mui-focusVisible': {\n            boxShadow: 'none',\n          },\n          '& .MuiSvgIcon-root': {\n            display: 'block',\n          },\n        }}\n        href={href || '#'}\n        ref={ref}\n        aria-label=\"Home\"\n        {...rest}\n      >\n        {children || <Logo {...logoProps} />}\n      </Link>\n    );\n  }\n  return children || <Logo sx={sx} ref={ref as unknown as ForwardedRef<SVGSVGElement>} {...logoProps} />;\n});\n"],"names":["HeaderLogo","forwardRef","_a","ref","sx","children","href","logoProps","rest","__rest","theme","useTheme","onClick","_jsx","Link","Object","assign","display","position","py","getFocusRingStyle","boxShadow","Logo"],"mappings":"kQAeO,MAAMA,EAAkCC,EAAW,CAACC,EAA4CC,KAA5C,IAAAC,GAAEA,EAAEC,SAAEA,EAAQC,KAAEA,EAAIC,UAAEA,GAASL,EAAKM,EAAIC,EAAAP,EAAxC,CAAA,KAAA,WAAA,OAAA,cACzD,MAAMQ,EAAQC,IAEd,OAAIL,GAAQE,EAAKI,QAEbC,EAACC,EAAIC,OAAAC,OAAA,CACHZ,GAAEW,OAAAC,OAAAD,OAAAC,OAAA,CAEAC,QAAS,QACTC,SAAU,WACVC,GAAI,GAEDC,EAAkBV,IAAM,CAE3B,qBAAsB,CACpBW,UAAW,QAEb,qBAAsB,CACpBJ,QAAS,WAGbX,KAAMA,GAAQ,IACdH,IAAKA,EAAG,aACG,QACPK,EAAI,CAAAH,SAEPA,GAAYQ,EAACS,mBAASf,OAItBF,GAAYQ,EAACS,iBAAKlB,GAAIA,EAAID,IAAKA,GAAmDI"}

package/components/header/HeaderNavigationHero.d.ts

@@ -1,11 +1,7 @@
-import { FC, ReactNode, ElementType } from 'react';
+import { FC, ElementType } from 'react';
 import { BoxProps, ClickAwayListenerProps, ContainerProps, PortalProps, BackdropProps, CollapseProps } from '@mui/material';
 import { HeaderNavigationLinkProps } from './HeaderNavigationLink';
 export interface HeaderNavigationHeroProps extends HeaderNavigationLinkProps {
-    /**
-     * @deprecated provide as children instead
-     */
-    heroElement?: ReactNode;
     /**
      * Wrap the content into container
      * @default false

package/components/header/HeaderNavigationHero.js

@@ -1,2 +1,2 @@
-import{__rest as r}from"tslib";import{jsxs as o,Fragment as n,jsx as e}from"react/jsx-runtime";import{forwardRef as t,useRef as i,useState as s}from"react";import{useTheme as a,useMediaQuery as l,ClickAwayListener as c,Box as p,Collapse as d,Container as x,Portal as g,Backdrop as m}from"@mui/material";import{ChevronDownIcon as b}from"../icon/stroke/ChevronDownIcon.js";import{HeaderNavigationLink as u}from"./HeaderNavigationLink.js";const h=t((t,h)=>{var{children:f,sx:k,label:j,icon:v,heroElement:P,inContainer:O=!1,disableBackdrop:C=!1,onClick:w,clickAwayListenerProps:y,contentProps:H,wrapperProps:z,containerProps:I,collapseProps:A,portalProps:B,backdropProps:L}=t,S=r(t,["children","sx","label","icon","heroElement","inContainer","disableBackdrop","onClick","clickAwayListenerProps","contentProps","wrapperProps","containerProps","collapseProps","portalProps","backdropProps"]);const E=i(),[N,$]=s(!1),D=a(),W=l(D.breakpoints.down("lg")),q=null!=L?L:{},{sx:F}=q,G=r(q,["sx"]),J=null!=z?z:{},{sx:K}=J,M=r(J,["sx"]),Q=null!=H?H:{},{sx:R}=Q,T=r(Q,["sx"]);return o(n,{children:[e(u,Object.assign({active:N,icon:v||e(b,{sx:{"&&&":{fontSize:{xs:"20px",lg:"14px"}},color:{xs:"dark"===D.palette.mode?"onSurface.os300":"onSurface.os700",lg:"currentColor"},transform:`rotate(${N?"180":"0"}deg)`,transition:{xs:D.transitions.create("transform",{duration:D.transitions.duration.shortest}),lg:"none"}}}),onClick:r=>{null==w||w(r),$(r=>!r)},sx:Object.assign({justifyContent:{xs:"space-between",lg:"flex-start"}},k),ref:null!=h?h:E,"data-testid":"HeaderNavigationHero"},S,{children:j})),e(c,Object.assign({onClickAway:r=>{var o,n,e;return!(null===(e=null===(n=null!==(o=h)&&void 0!==o?o:E)||void 0===n?void 0:n.current)||void 0===e?void 0:e.contains(null==r?void 0:r.target))&&$(!1)}},y,{children:e(p,Object.assign({sx:Object.assign({position:{xs:"static",lg:"absolute"},zIndex:"10",left:"0",right:"0",top:D.mixins.toolbar.minHeight,maxHeight:`calc(100vh - ${D.mixins.toolbar.minHeight})`,overflow:"auto"},K)},M,{children:e(d,Object.assign({in:N},A,{children:e(p,Object.assign({sx:Object.assign({backgroundColor:{lg:"dark"===D.palette.mode?"surface.primary":"background.primary"},py:{xs:0,lg:2},px:O?0:{xs:1,lg:2}},R)},T,{children:O?e(x,Object.assign({maxWidth:"xl"},I,{children:P||f})):P||f}))}))}))})),!C&&!W&&e(g,Object.assign({},B,{children:e(m,Object.assign({open:N,sx:Object.assign({zIndex:D.zIndex.appBar-50},F)},G))}))]})});export{h as HeaderNavigationHero};
+import{__rest as r}from"tslib";import{jsxs as o,Fragment as n,jsx as i}from"react/jsx-runtime";import{forwardRef as s,useRef as e,useState as t}from"react";import{useTheme as a,useMediaQuery as l,ClickAwayListener as c,Box as p,Collapse as d,Container as x,Portal as g,Backdrop as m}from"@mui/material";import{ChevronDownIcon as b}from"../icon/stroke/ChevronDownIcon.js";import{HeaderNavigationLink as u}from"./HeaderNavigationLink.js";const h=s((s,h)=>{var{children:f,sx:k,label:j,icon:v,inContainer:P=!1,disableBackdrop:O=!1,onClick:C,clickAwayListenerProps:w,contentProps:y,wrapperProps:H,containerProps:z,collapseProps:I,portalProps:A,backdropProps:B}=s,L=r(s,["children","sx","label","icon","inContainer","disableBackdrop","onClick","clickAwayListenerProps","contentProps","wrapperProps","containerProps","collapseProps","portalProps","backdropProps"]);const S=e(),[N,$]=t(!1),D=a(),W=l(D.breakpoints.down("lg")),q=null!=B?B:{},{sx:E}=q,F=r(q,["sx"]),G=null!=H?H:{},{sx:J}=G,K=r(G,["sx"]),M=null!=y?y:{},{sx:Q}=M,R=r(M,["sx"]);return o(n,{children:[i(u,Object.assign({active:N,icon:v||i(b,{sx:{"&&&":{fontSize:{xs:"20px",lg:"14px"}},color:{xs:"dark"===D.palette.mode?"onSurface.os300":"onSurface.os700",lg:"currentColor"},transform:`rotate(${N?"180":"0"}deg)`,transition:{xs:D.transitions.create("transform",{duration:D.transitions.duration.shortest}),lg:"none"}}}),onClick:r=>{null==C||C(r),$(r=>!r)},sx:Object.assign({justifyContent:{xs:"space-between",lg:"flex-start"}},k),ref:null!=h?h:S,"data-testid":"HeaderNavigationHero"},L,{children:j})),i(c,Object.assign({onClickAway:r=>{var o,n,i;return!(null===(i=null===(n=null!==(o=h)&&void 0!==o?o:S)||void 0===n?void 0:n.current)||void 0===i?void 0:i.contains(null==r?void 0:r.target))&&$(!1)}},w,{children:i(p,Object.assign({sx:Object.assign({position:{xs:"static",lg:"absolute"},zIndex:"10",left:"0",right:"0",top:D.mixins.toolbar.minHeight,maxHeight:`calc(100vh - ${D.mixins.toolbar.minHeight})`,overflow:"auto"},J)},K,{children:i(d,Object.assign({in:N},I,{children:i(p,Object.assign({sx:Object.assign({backgroundColor:{lg:"dark"===D.palette.mode?"surface.primary":"background.primary"},py:{xs:0,lg:2},px:P?0:{xs:1,lg:2}},Q)},R,{children:P?i(x,Object.assign({maxWidth:"xl"},z,{children:f})):f}))}))}))})),!O&&!W&&i(g,Object.assign({},A,{children:i(m,Object.assign({open:N,sx:Object.assign({zIndex:D.zIndex.appBar-50},E)},F))}))]})});export{h as HeaderNavigationHero};
 //# sourceMappingURL=HeaderNavigationHero.js.map

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?: 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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"}
+{"version":3,"file":"HeaderNavigationHero.js","sources":["../../../src/components/header/HeaderNavigationHero.tsx"],"sourcesContent":["import React, { FC, forwardRef, 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   * 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      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                    {children}\n                  </Container>\n                ) : (\n                  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","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/HeaderNavigationLink.d.ts

@@ -19,10 +19,6 @@ export interface HeaderNavigationLinkProps extends ButtonBaseProps<ElementType>
      * Expect icon component that will be rendered after the label
      */
     icon?: ReactNode | 'arrow-ne';
-    /**
-     * @deprecated no longer has any effect, remove the property
-     */
-    index?: number;
     /**
      * Properties applied to wrapper of label
      */
@@ -40,9 +36,3 @@ export interface HeaderNavigationLinkProps extends ButtonBaseProps<ElementType>
  * Component to render styled button in the header
  */
 export declare const HeaderNavigationLink: FC<HeaderNavigationLinkProps>;
-export interface HeaderOverheadItemProps extends HeaderNavigationLinkProps {
-}
-/**
- * @deprecated remove this component, use HeaderNavigationLink instead
- */
-export declare const HeaderOverheadItem: FC<HeaderOverheadItemProps>;

package/components/header/HeaderNavigationLink.js

@@ -1,2 +1,2 @@
-import{__rest as e}from"tslib";import{jsx as t,jsxs as a}from"react/jsx-runtime";import{forwardRef as o,useMemo as i}from"react";import{useTheme as r,ButtonBase as s,Box as n}from"@mui/material";import{ArrowTopRightIcon as l}from"../icon/stroke/ArrowTopRightIcon.js";import{getFocusRingStyle as c}from"../focusring/focusring.js";import{getInteractiveStyle as p}from"../../materialui/button/interactive.js";import{getTypography as g}from"../../materialui/typography/typography.theme.js";const b=o((o,b)=>{var{sx:d,children:x,label:m,icon:u,active:f=!1,external:y=!1,index:j,labelWrapperProps:h,labelProps:k,selectedLabelProps:v}=o,O=e(o,["sx","children","label","icon","active","external","index","labelWrapperProps","labelProps","selectedLabelProps"]);const L=r(),w=null!=h?h:{},{sx:N}=w,H=e(w,["sx"]),F=null!=k?k:{},{sx:C}=F,P=e(F,["sx"]),I=null!=v?v:{},{sx:S}=I,W=e(I,["sx"]),z=i(()=>"arrow-new"===u||y?t(l,{}):u,[u,y]);return a(s,Object.assign({sx:Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},L.typography.list),{[L.breakpoints.down("lg")]:Object.assign({},g("body","rtl"===L.direction,"large")),position:"relative",zIndex:"100",display:{xs:"flex",lg:"inline-flex"},width:{xs:"100%",lg:"auto"},gap:.5,alignItems:"center",justifyContent:"flex-start",py:{xs:2,lg:1},px:{xs:1,lg:.5},transition:"transform 0.3s ease-out, color 0.3s ease-out, background-color 0.3s ease-out, border-color 0.3s ease-out, box-shadow 0.3s ease-out, opacity 0.3s ease-out","& .MuiSvgIcon-root":{fontSize:"14px"},"&:after":Object.assign({content:{xs:"none",lg:'""'},position:"absolute",left:"0",right:"0",bottom:"0",height:"1px",backgroundColor:"transparent.transparent"},f&&{height:"2px",backgroundColor:"text.primary"}),"&.Mui-disabled":{color:"disabled.tertiary"}}),p(Object.assign({color:"dark"===L.palette.mode?"onSurface.os300":"onSurface.os700","&&:after":{backgroundColor:"transparent.transparent"},"& .FlowHeaderNavigationLink-label":{opacity:"1"},"& .FlowHeaderNavigationLink-selectedLabel":{opacity:"0"}},f&&{color:"text.primary","&&:after":{backgroundColor:"text.primary"},"& .FlowHeaderNavigationLink-label":{opacity:"0"},"& .FlowHeaderNavigationLink-selectedLabel":{opacity:"1"}}),{color:"text.primary","&&:after":{backgroundColor:"text.primary"},"& .FlowHeaderNavigationLink-label":{opacity:"0"},"& .FlowHeaderNavigationLink-selectedLabel":{opacity:"1"}})),c(L)),{"&&:before":{borderRadius:"4px",top:{xs:"0",lg:"2px"},bottom:{xs:"0",lg:"-2px"}}}),d),ref:b,"data-testid":"HeaderNavigationLink"},O,{children:[(x||m)&&a(n,Object.assign({className:"FlowHeaderNavigationLink-labelWrapper",sx:Object.assign({display:"inline-flex",alignItems:"center",justifyContent:"center",textAlign:"center",position:"relative"},N)},H,{children:[t(n,Object.assign({className:"FlowHeaderNavigationLink-label",sx:Object.assign({position:"absolute",left:{xs:"0",lg:"auto"}},C)},P,{children:x||m})),t(n,Object.assign({className:"FlowHeaderNavigationLink-selectedLabel",sx:Object.assign({fontWeight:"700",opacity:"0",position:"relative"},S),"aria-hidden":"true"},W,{children:x||m}))]})),z]}))}),d=o((e,a)=>t(b,Object.assign({ref:a},e)));export{b as HeaderNavigationLink,d as HeaderOverheadItem};
+import{__rest as e}from"tslib";import{jsx as t,jsxs as a}from"react/jsx-runtime";import{forwardRef as o,useMemo as r}from"react";import{useTheme as i,ButtonBase as s,Box as n}from"@mui/material";import{ArrowTopRightIcon as l}from"../icon/stroke/ArrowTopRightIcon.js";import{getFocusRingStyle as c}from"../focusring/focusring.js";import{getInteractiveStyle as p}from"../../materialui/button/interactive.js";import{getTypography as g}from"../../materialui/typography/typography.theme.js";const b=o((o,b)=>{var{sx:d,children:x,label:m,icon:u,active:f=!1,external:y=!1,labelWrapperProps:j,labelProps:h,selectedLabelProps:k}=o,v=e(o,["sx","children","label","icon","active","external","labelWrapperProps","labelProps","selectedLabelProps"]);const L=i(),O=null!=j?j:{},{sx:w}=O,N=e(O,["sx"]),H=null!=h?h:{},{sx:F}=H,C=e(H,["sx"]),P=null!=k?k:{},{sx:I}=P,S=e(P,["sx"]),W=r(()=>"arrow-new"===u||y?t(l,{}):u,[u,y]);return a(s,Object.assign({sx:Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},L.typography.list),{[L.breakpoints.down("lg")]:Object.assign({},g("body","rtl"===L.direction,"large")),position:"relative",zIndex:"100",display:{xs:"flex",lg:"inline-flex"},width:{xs:"100%",lg:"auto"},gap:.5,alignItems:"center",justifyContent:"flex-start",py:{xs:2,lg:1},px:{xs:1,lg:.5},transition:"transform 0.3s ease-out, color 0.3s ease-out, background-color 0.3s ease-out, border-color 0.3s ease-out, box-shadow 0.3s ease-out, opacity 0.3s ease-out","& .MuiSvgIcon-root":{fontSize:"14px"},"&:after":Object.assign({content:{xs:"none",lg:'""'},position:"absolute",left:"0",right:"0",bottom:"0",height:"1px",backgroundColor:"transparent.transparent"},f&&{height:"2px",backgroundColor:"text.primary"}),"&.Mui-disabled":{color:"disabled.tertiary"}}),p(Object.assign({color:"dark"===L.palette.mode?"onSurface.os300":"onSurface.os700","&&:after":{backgroundColor:"transparent.transparent"},"& .FlowHeaderNavigationLink-label":{opacity:"1"},"& .FlowHeaderNavigationLink-selectedLabel":{opacity:"0"}},f&&{color:"text.primary","&&:after":{backgroundColor:"text.primary"},"& .FlowHeaderNavigationLink-label":{opacity:"0"},"& .FlowHeaderNavigationLink-selectedLabel":{opacity:"1"}}),{color:"text.primary","&&:after":{backgroundColor:"text.primary"},"& .FlowHeaderNavigationLink-label":{opacity:"0"},"& .FlowHeaderNavigationLink-selectedLabel":{opacity:"1"}})),c(L)),{"&&:before":{borderRadius:"4px",top:{xs:"0",lg:"2px"},bottom:{xs:"0",lg:"-2px"}}}),d),ref:b,"data-testid":"HeaderNavigationLink"},v,{children:[(x||m)&&a(n,Object.assign({className:"FlowHeaderNavigationLink-labelWrapper",sx:Object.assign({display:"inline-flex",alignItems:"center",justifyContent:"center",textAlign:"center",position:"relative"},w)},N,{children:[t(n,Object.assign({className:"FlowHeaderNavigationLink-label",sx:Object.assign({position:"absolute",left:{xs:"0",lg:"auto"}},F)},C,{children:x||m})),t(n,Object.assign({className:"FlowHeaderNavigationLink-selectedLabel",sx:Object.assign({fontWeight:"700",opacity:"0",position:"relative"},I),"aria-hidden":"true"},S,{children:x||m}))]})),W]}))});export{b as HeaderNavigationLink};
 //# sourceMappingURL=HeaderNavigationLink.js.map