@skodaflow/web-library 7.14.0 → 7.15.0

package/cjs/components/alert/AlertButton.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { ButtonProps } from '@mui/material';
-export interface AlertButtonProps extends Omit<ButtonProps, 'variant' | 'color' | 'size'> {
+export interface AlertButtonProps extends ButtonProps {
 }
 /**
  * AlertButton is a proxy component to <Button variant="text" color="white" size="small" />

package/cjs/components/alert/AlertButton.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("@mui/material");const i=r.forwardRef(((r,i)=>e.jsx(t.Button,Object.assign({},r,{ref:i,variant:"text",color:"white",size:"small"}))));exports.AlertButton=i;
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),t=require("@mui/material");const i=r.forwardRef(((r,i)=>e.jsx(t.Button,Object.assign({ref:i,variant:"text",color:"white",size:"small"},r))));exports.AlertButton=i;
 //# sourceMappingURL=AlertButton.js.map

package/cjs/components/alert/AlertButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"AlertButton.js","sources":["../../../../../src/components/alert/AlertButton.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { Button, ButtonProps } from '@mui/material';\n\nexport interface AlertButtonProps extends Omit<ButtonProps, 'variant' | 'color' | 'size'> {}\n\n/**\n * AlertButton is a proxy component to <Button variant=\"text\" color=\"white\" size=\"small\" />\n */\nexport const AlertButton: React.FC<AlertButtonProps> = forwardRef((props, ref) => {\n  return <Button {...props} ref={ref} variant=\"text\" color=\"white\" size=\"small\" />;\n});\n"],"names":["AlertButton","forwardRef","props","ref","_jsx","Button","Object","assign","variant","color","size"],"mappings":"8FAQa,MAAAA,EAA0CC,EAAUA,YAAC,CAACC,EAAOC,IACjEC,EAAAA,IAACC,EAAAA,OAAWC,OAAAC,OAAA,CAAA,EAAAL,GAAOC,IAAKA,EAAKK,QAAQ,OAAOC,MAAM,QAAQC,KAAK"}
+{"version":3,"file":"AlertButton.js","sources":["../../../../../src/components/alert/AlertButton.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { Button, ButtonProps } from '@mui/material';\n\nexport interface AlertButtonProps extends ButtonProps {}\n\n/**\n * AlertButton is a proxy component to <Button variant=\"text\" color=\"white\" size=\"small\" />\n */\nexport const AlertButton: React.FC<AlertButtonProps> = forwardRef((props, ref) => {\n  return <Button ref={ref} variant=\"text\" color=\"white\" size=\"small\" {...props} />;\n});\n"],"names":["AlertButton","forwardRef","props","ref","_jsx","Button","Object","assign","variant","color","size"],"mappings":"8FAQa,MAAAA,EAA0CC,EAAUA,YAAC,CAACC,EAAOC,IACjEC,EAAAA,IAACC,EAAAA,OAAOC,OAAAC,OAAA,CAAAJ,IAAKA,EAAKK,QAAQ,OAAOC,MAAM,QAAQC,KAAK,SAAYR"}

package/cjs/components/alert/AlertNotificationButton.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { ButtonProps } from '@mui/material';
+export interface AlertNotificationButtonProps extends ButtonProps {
+}
+/**
+ * AlertNotificationButton is a proxy component to <Button variant="text" color="secondary" size="small" />
+ */
+export declare const AlertNotificationButton: React.FC<AlertNotificationButtonProps>;

package/cjs/components/alert/AlertNotificationButton.js

@@ -0,0 +1,2 @@
+"use strict";var r=require("react/jsx-runtime"),e=require("react"),t=require("@mui/material");const i=e.forwardRef(((e,i)=>r.jsx(t.Button,Object.assign({ref:i,variant:"text",color:"secondary",size:"small"},e))));exports.AlertNotificationButton=i;
+//# sourceMappingURL=AlertNotificationButton.js.map

package/cjs/components/alert/AlertNotificationButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AlertNotificationButton.js","sources":["../../../../../src/components/alert/AlertNotificationButton.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { Button, ButtonProps } from '@mui/material';\n\nexport interface AlertNotificationButtonProps extends ButtonProps {}\n\n/**\n * AlertNotificationButton is a proxy component to <Button variant=\"text\" color=\"secondary\" size=\"small\" />\n */\nexport const AlertNotificationButton: React.FC<AlertNotificationButtonProps> = forwardRef((props, ref) => {\n  return <Button ref={ref} variant=\"text\" color=\"secondary\" size=\"small\" {...props} />;\n});\n"],"names":["AlertNotificationButton","forwardRef","props","ref","_jsx","Button","Object","assign","variant","color","size"],"mappings":"8FAQa,MAAAA,EAAkEC,EAAUA,YAAC,CAACC,EAAOC,IACzFC,EAAAA,IAACC,EAAAA,OAAOC,OAAAC,OAAA,CAAAJ,IAAKA,EAAKK,QAAQ,OAAOC,MAAM,YAAYC,KAAK,SAAYR"}

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

@@ -1,2 +1,3 @@
 export * from './Alert';
 export * from './AlertButton';
+export * from './AlertNotificationButton';

package/cjs/components/banner/BannerButton.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { ButtonProps } from '@mui/material';
+export interface BannerButtonProps extends ButtonProps {
+}
+/**
+ * BannerButton is a proxy component to <Button variant="outlined" color="secondary" size="small" />
+ */
+export declare const BannerButton: React.FC<BannerButtonProps>;

package/cjs/components/banner/BannerButton.js

@@ -0,0 +1,2 @@
+"use strict";var r=require("react/jsx-runtime"),e=require("react"),t=require("@mui/material");const a=e.forwardRef(((e,a)=>r.jsx(t.Button,Object.assign({ref:a,variant:"outlined",color:"secondary",size:"small"},e))));exports.BannerButton=a;
+//# sourceMappingURL=BannerButton.js.map

package/cjs/components/banner/BannerButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BannerButton.js","sources":["../../../../../src/components/banner/BannerButton.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { Button, ButtonProps } from '@mui/material';\n\nexport interface BannerButtonProps extends ButtonProps {}\n\n/**\n * BannerButton is a proxy component to <Button variant=\"outlined\" color=\"secondary\" size=\"small\" />\n */\nexport const BannerButton: React.FC<BannerButtonProps> = forwardRef((props, ref) => {\n  return <Button ref={ref} variant=\"outlined\" color=\"secondary\" size=\"small\" {...props} />;\n});\n"],"names":["BannerButton","forwardRef","props","ref","_jsx","Button","Object","assign","variant","color","size"],"mappings":"8FAQa,MAAAA,EAA4CC,EAAUA,YAAC,CAACC,EAAOC,IACnEC,EAAAA,IAACC,EAAAA,OAAOC,OAAAC,OAAA,CAAAJ,IAAKA,EAAKK,QAAQ,WAAWC,MAAM,YAAYC,KAAK,SAAYR"}

package/cjs/components/banner/BannerDismissButton.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { ButtonProps } from '@mui/material';
+export interface BannerDismissButtonProps extends ButtonProps {
+}
+/**
+ * BannerDismissButton is a proxy component to <Button variant="text" color="secondary" size="small" />
+ */
+export declare const BannerDismissButton: React.FC<BannerDismissButtonProps>;

package/cjs/components/banner/BannerDismissButton.js

@@ -0,0 +1,2 @@
+"use strict";var r=require("react/jsx-runtime"),e=require("react"),t=require("@mui/material");const s=e.forwardRef(((e,s)=>r.jsx(t.Button,Object.assign({ref:s,variant:"text",color:"secondary",size:"small"},e))));exports.BannerDismissButton=s;
+//# sourceMappingURL=BannerDismissButton.js.map

package/cjs/components/banner/BannerDismissButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BannerDismissButton.js","sources":["../../../../../src/components/banner/BannerDismissButton.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { Button, ButtonProps } from '@mui/material';\n\nexport interface BannerDismissButtonProps extends ButtonProps {}\n\n/**\n * BannerDismissButton is a proxy component to <Button variant=\"text\" color=\"secondary\" size=\"small\" />\n */\nexport const BannerDismissButton: React.FC<BannerDismissButtonProps> = forwardRef((props, ref) => {\n  return <Button ref={ref} variant=\"text\" color=\"secondary\" size=\"small\" {...props} />;\n});\n"],"names":["BannerDismissButton","forwardRef","props","ref","_jsx","Button","Object","assign","variant","color","size"],"mappings":"8FAQa,MAAAA,EAA0DC,EAAUA,YAAC,CAACC,EAAOC,IACjFC,EAAAA,IAACC,EAAAA,OAAOC,OAAAC,OAAA,CAAAJ,IAAKA,EAAKK,QAAQ,OAAOC,MAAM,YAAYC,KAAK,SAAYR"}

package/cjs/components/banner/banner.d.ts

@@ -22,7 +22,7 @@ export interface BannerProps extends BoxProps<ElementType> {
     /**
      * Properties passed to wrapper of children
      */
-    typographyProps?: TypographyProps;
+    typographyProps?: TypographyProps<ElementType>;
     /**
      * Properties applied to wrapper of content (Icon and Typography)
      */

package/cjs/components/banner/banner.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("tslib"),r=require("react/jsx-runtime"),t=require("../icon/filled/CircleExclamationFilledIcon.js"),n=require("../icon/filled/CircleInformationFilledIcon.js"),s=require("../icon/filled/WarningFilledIcon.js"),i=require("@mui/material"),a=require("react"),o=require("../focusring/focusring.js");const l=a.forwardRef(((l,c)=>{var{children:x,variant:p="info",size:d="large",sx:g,iconProps:u,IconComponent:f,typographyProps:m,wrapperProps:j,buttons:b,buttonsWrapperProps:h,onClick:y}=l,w=e.__rest(l,["children","variant","size","sx","iconProps","IconComponent","typographyProps","wrapperProps","buttons","buttonsWrapperProps","onClick"]);const C=i.useTheme(),I=u||{},{sx:O}=I,_=e.__rest(I,["sx"]),B=m||{},{sx:q}=B,P=e.__rest(B,["sx"]),v=j||{},{sx:F}=v,k=e.__rest(v,["sx"]),S=h||{},{sx:W}=S,z=e.__rest(S,["sx"]),[E,G,R]=a.useMemo((()=>{switch(p){case"error":return["error.main","error.light",s.WarningFilledIcon];case"warning":return["warning.main","warning.light",t.CircleExclamationFilledIcon];default:return["info.main","info.light",n.CircleInformationFilledIcon]}}),[p]),T=f||R;return r.jsxs(i.Box,Object.assign({"data-testid":"Banner",role:"alert","aria-atomic":"true","aria-live":"assertive",onClick:y,sx:Object.assign(Object.assign({display:"flex",width:"100%",flexDirection:{xs:"column",md:"row"},alignItems:{xs:"flex-start",md:"center"},justifyContent:"space-between",px:2,py:"small"===d?1:{xs:2,md:1},gap:1,borderLeft:6,borderColor:E,backgroundColor:"dark"===C.palette.mode?"onSurface.os900":G,textAlign:"left"},y&&Object.assign({position:"relative",cursor:"pointer"},o.getFocusRingStyle(C,!0,"2px"))),g),ref:c},w,{children:[r.jsxs(i.Box,Object.assign({"data-testid":"Banner.wrapper",sx:Object.assign({flexGrow:"1",display:"flex",alignItems:"flex-start",justifyContent:"flex-start",gap:1,py:.5},F)},k,{children:[r.jsx(T,Object.assign({"data-testid":"Banner.icon",sx:Object.assign({color:E},O)},_)),r.jsx(i.Typography,Object.assign({"data-testid":"Banner.text",sx:Object.assign({color:"text.primary",flexGrow:"1",fontSize:{xl:"16px"},lineHeight:{xl:"24px"}},q)},P,{children:x}))]})),b&&r.jsx(i.Box,Object.assign({"data-testid":"Banner.buttons",sx:Object.assign({display:"flex",alignItems:"center",justifyContent:"space-between",gap:1,flexShrink:"0",ml:{xs:4,md:0},alignSelf:"flex-end"},W)},z,{children:b}))]}))}));exports.Banner=l;
+"use strict";var e=require("tslib"),r=require("react/jsx-runtime"),n=require("../icon/filled/CircleExclamationFilledIcon.js"),t=require("../icon/filled/CircleInformationFilledIcon.js"),s=require("../icon/filled/WarningFilledIcon.js"),i=require("@mui/material"),a=require("react"),o=require("../focusring/focusring.js");const l=a.forwardRef(((l,c)=>{var{children:x,variant:p="info",size:d="large",sx:u,iconProps:g,IconComponent:f,typographyProps:m,wrapperProps:j,buttons:b,buttonsWrapperProps:h,onClick:y}=l,w=e.__rest(l,["children","variant","size","sx","iconProps","IconComponent","typographyProps","wrapperProps","buttons","buttonsWrapperProps","onClick"]);const C=i.useTheme(),I=null!=g?g:{},{sx:O}=I,_=e.__rest(I,["sx"]),B=null!=m?m:{},{sx:q}=B,P=e.__rest(B,["sx"]),v=null!=j?j:{},{sx:F}=v,k=e.__rest(v,["sx"]),S=null!=h?h:{},{sx:W}=S,z=e.__rest(S,["sx"]),[E,G,R]=a.useMemo((()=>{switch(p){case"error":return["error.main","error.light",s.WarningFilledIcon];case"warning":return["warning.main","warning.light",n.CircleExclamationFilledIcon];default:return["info.main","info.light",t.CircleInformationFilledIcon]}}),[p]),T=null!=f?f:R;return r.jsxs(i.Box,Object.assign({"data-testid":"Banner",role:"alert","aria-atomic":"true","aria-live":"assertive",onClick:y,sx:Object.assign(Object.assign({display:"flex",width:"100%",flexDirection:{xs:"column",md:"row"},alignItems:{xs:"flex-start",md:"center"},justifyContent:"space-between",px:2,py:"small"===d?1:{xs:2,md:1},gap:1,borderLeft:6,borderColor:E,backgroundColor:"dark"===C.palette.mode?"onSurface.os900":G,textAlign:"left"},y&&Object.assign({position:"relative",cursor:"pointer"},o.getFocusRingStyle(C,!0,"2px"))),u),ref:c},w,{children:[r.jsxs(i.Box,Object.assign({"data-testid":"Banner.wrapper",sx:Object.assign({flexGrow:"1",display:"flex",alignItems:"flex-start",justifyContent:"flex-start",gap:1,py:.5},F)},k,{children:[r.jsx(T,Object.assign({"data-testid":"Banner.icon",sx:Object.assign({color:E},O)},_)),r.jsx(i.Typography,Object.assign({"data-testid":"Banner.text",sx:Object.assign({color:"text.primary",flexGrow:"1",fontSize:{xl:"16px"},lineHeight:{xl:"24px"}},q)},P,{children:x}))]})),b&&r.jsx(i.Box,Object.assign({"data-testid":"Banner.buttons",sx:Object.assign({display:"flex",alignItems:"center",justifyContent:"space-between",gap:1,flexShrink:"0",ml:{xs:4,md:0},alignSelf:"flex-end"},W)},z,{children:b}))]}))}));exports.Banner=l;
 //# sourceMappingURL=banner.js.map

package/cjs/components/banner/banner.js.map

@@ -1 +1 @@
-{"version":3,"file":"banner.js","sources":["../../../../../src/components/banner/banner.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, useTheme } from '@mui/material';\nimport React, { ElementType, forwardRef, ReactNode, useMemo } from 'react';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\n\nexport interface BannerProps extends BoxProps<ElementType> {\n  /**\n   * Defines which variant of Banner component should be rendered\n   * @default info\n   */\n  variant?: 'info' | 'warning' | 'error';\n  /**\n   * Set the proportions\n   * @default large\n   */\n  size?: 'large' | 'small';\n  /**\n   * Properties passed to indicator icon\n   */\n  iconProps?: SvgIconProps;\n  /**\n   * Icon node to be used\n   */\n  IconComponent?: ElementType<SvgIconProps>;\n  /**\n   * Properties passed to wrapper of children\n   */\n  typographyProps?: TypographyProps;\n  /**\n   * Properties applied to wrapper of content (Icon and Typography)\n   */\n  wrapperProps?: BoxProps<ElementType>;\n  /**\n   * ReactNode that renders buttons. If multiple buttons are needed, wrap them in React.Fragment\n   */\n  buttons?: ReactNode;\n  /**\n   * Properties applied to wrapper element of buttons\n   */\n  buttonsWrapperProps?: BoxProps<ElementType>;\n}\n\n/**\n * Alert notification banner\n */\nexport const Banner: React.FC<BannerProps> = forwardRef(\n  (\n    {\n      children,\n      variant = 'info',\n      size = 'large',\n      sx,\n      iconProps,\n      IconComponent,\n      typographyProps,\n      wrapperProps,\n      buttons,\n      buttonsWrapperProps,\n      onClick,\n      ...rest\n    },\n    ref,\n  ) => {\n    const theme = useTheme();\n    const { sx: iconSx, ...restIcon } = iconProps || {};\n    const { sx: typographySx, ...restTypography } = typographyProps || {};\n    const { sx: wrapperSx, ...restWrapper } = wrapperProps || {};\n    const { sx: buttonsWrapperSx, ...restButtonsWrapper } = buttonsWrapperProps || {};\n\n    const [borderColor, backgroundColor, IconVariantComponent] = useMemo(() => {\n      switch (variant) {\n        case 'error':\n          return ['error.main', 'error.light', WarningFilledIcon];\n        case 'warning':\n          return ['warning.main', 'warning.light', CircleExclamationFilledIcon];\n        case 'info':\n        default:\n          return ['info.main', 'info.light', CircleInformationFilledIcon];\n      }\n    }, [variant]);\n    const BannerIcon = IconComponent || IconVariantComponent;\n\n    return (\n      <Box\n        data-testid=\"Banner\"\n        role=\"alert\"\n        aria-atomic=\"true\"\n        aria-live=\"assertive\"\n        onClick={onClick}\n        sx={{\n          display: 'flex',\n          width: '100%',\n          // on mobile content and button bellow each other\n          flexDirection: { xs: 'column', md: 'row' },\n          alignItems: { xs: 'flex-start', md: 'center' },\n          justifyContent: 'space-between',\n          // proportions\n          px: 2,\n          py: size === 'small' ? 1 : { xs: 2, md: 1 },\n          gap: 1,\n          // style\n          borderLeft: 6,\n          borderColor: borderColor,\n          backgroundColor: theme.palette.mode === 'dark' ? 'onSurface.os900' : backgroundColor,\n          textAlign: 'left',\n          // clickable style\n          ...(onClick && {\n            position: 'relative',\n            cursor: 'pointer',\n            // focused style\n            ...getFocusRingStyle(theme, true, '2px'),\n          }),\n          ...sx,\n        }}\n        ref={ref}\n        {...rest}\n      >\n        <Box\n          data-testid=\"Banner.wrapper\"\n          sx={{\n            // align icon and content\n            flexGrow: '1',\n            display: 'flex',\n            alignItems: 'flex-start',\n            justifyContent: 'flex-start',\n            gap: 1,\n            py: 0.5,\n            ...wrapperSx,\n          }}\n          {...restWrapper}\n        >\n          <BannerIcon\n            data-testid=\"Banner.icon\"\n            sx={{\n              color: borderColor,\n              ...iconSx,\n            }}\n            {...restIcon}\n          />\n          <Typography\n            data-testid=\"Banner.text\"\n            sx={{\n              color: 'text.primary',\n              flexGrow: '1',\n              // custom font according to Figma\n              fontSize: { xl: '16px' },\n              lineHeight: { xl: '24px' },\n              ...typographySx,\n            }}\n            {...restTypography}\n          >\n            {children}\n          </Typography>\n        </Box>\n        {buttons && (\n          <Box\n            data-testid=\"Banner.buttons\"\n            sx={{\n              display: 'flex',\n              alignItems: 'center',\n              justifyContent: 'space-between',\n              gap: 1,\n              // always show buttons next to each other\n              flexShrink: '0',\n              // on mobile align with text\n              ml: { xs: 4, md: 0 },\n              // on mobile move to the right side\n              alignSelf: 'flex-end',\n              ...buttonsWrapperSx,\n            }}\n            {...restButtonsWrapper}\n          >\n            {buttons}\n          </Box>\n        )}\n      </Box>\n    );\n  },\n);\n"],"names":["Banner","forwardRef","_a","ref","children","variant","size","sx","iconProps","IconComponent","typographyProps","wrapperProps","buttons","buttonsWrapperProps","onClick","rest","__rest","theme","useTheme","_b","iconSx","restIcon","_c","typographySx","restTypography","_d","wrapperSx","restWrapper","_e","buttonsWrapperSx","restButtonsWrapper","borderColor","backgroundColor","IconVariantComponent","useMemo","WarningFilledIcon","CircleExclamationFilledIcon","CircleInformationFilledIcon","BannerIcon","_jsxs","Box","Object","assign","role","display","width","flexDirection","xs","md","alignItems","justifyContent","px","py","gap","borderLeft","palette","mode","textAlign","position","cursor","getFocusRingStyle","jsxs","flexGrow","_jsx","jsx","color","Typography","fontSize","xl","lineHeight","flexShrink","ml","alignSelf"],"mappings":"+TA+Ca,MAAAA,EAAgCC,EAAUA,YACrD,CACEC,EAcAC,KAdA,IAAAC,SACEA,EAAQC,QACRA,EAAU,OAAMC,KAChBA,EAAO,QAAOC,GACdA,EAAEC,UACFA,EAASC,cACTA,EAAaC,gBACbA,EAAeC,aACfA,EAAYC,QACZA,EAAOC,oBACPA,EAAmBC,QACnBA,GAEDZ,EADIa,EAAIC,EAAAA,OAAAd,EAZT,2IAgBA,MAAMe,EAAQC,EAAAA,WACRC,EAA8BX,GAAa,IAAzCD,GAAIa,KAAWC,EAAjBL,EAAAA,OAAAG,EAAA,CAAA,OACAG,EAA0CZ,GAAmB,IAA3DH,GAAIgB,KAAiBC,EAAvBR,EAAAA,OAAAM,EAAA,CAAA,OACAG,EAAoCd,GAAgB,IAAlDJ,GAAImB,KAAcC,EAApBX,EAAAA,OAAAS,EAAA,CAAA,OACAG,EAAkDf,GAAuB,IAAvEN,GAAIsB,KAAqBC,EAA3Bd,EAAAA,OAAAY,EAAA,CAAA,QAECG,EAAaC,EAAiBC,GAAwBC,EAAOA,SAAC,KACnE,OAAQ7B,GACN,IAAK,QACH,MAAO,CAAC,aAAc,cAAe8B,qBACvC,IAAK,UACH,MAAO,CAAC,eAAgB,gBAAiBC,+BAE3C,QACE,MAAO,CAAC,YAAa,aAAcC,kCAEtC,CAAChC,IACEiC,EAAa7B,GAAiBwB,EAEpC,OACEM,OAACC,EAAAA,IACaC,OAAAC,OAAA,CAAA,cAAA,SACZC,KAAK,QACO,cAAA,OACF,YAAA,YACV7B,QAASA,EACTP,GAAEkC,OAAAC,OAAAD,OAAAC,OAAA,CACAE,QAAS,OACTC,MAAO,OAEPC,cAAe,CAAEC,GAAI,SAAUC,GAAI,OACnCC,WAAY,CAAEF,GAAI,aAAcC,GAAI,UACpCE,eAAgB,gBAEhBC,GAAI,EACJC,GAAa,UAAT9C,EAAmB,EAAI,CAAEyC,GAAI,EAAGC,GAAI,GACxCK,IAAK,EAELC,WAAY,EACZvB,YAAaA,EACbC,gBAAwC,SAAvBf,EAAMsC,QAAQC,KAAkB,kBAAoBxB,EACrEyB,UAAW,QAEP3C,GAAO2B,OAAAC,OAAA,CACTgB,SAAU,WACVC,OAAQ,WAELC,EAAiBA,kBAAC3C,GAAO,EAAM,SAEjCV,GAELJ,IAAKA,GACDY,EAAI,CAAAX,SAAA,CAERmC,EAACsB,KAAArB,MACaC,OAAAC,OAAA,CAAA,cAAA,iBACZnC,GAAEkC,OAAAC,OAAA,CAEAoB,SAAU,IACVlB,QAAS,OACTK,WAAY,aACZC,eAAgB,aAChBG,IAAK,EACLD,GAAI,IACD1B,IAEDC,EAEJ,CAAAvB,SAAA,CAAA2D,EAAAC,IAAC1B,EACaG,OAAAC,OAAA,CAAA,cAAA,cACZnC,GACEkC,OAAAC,OAAA,CAAAuB,MAAOlC,GACJX,IAEDC,IAEN0C,MAACG,EAAAA,WAAUzB,OAAAC,OAAA,CAAA,cACG,cACZnC,GAAEkC,OAAAC,OAAA,CACAuB,MAAO,eACPH,SAAU,IAEVK,SAAU,CAAEC,GAAI,QAChBC,WAAY,CAAED,GAAI,SACf7C,IAEDC,EAAc,CAAApB,SAEjBA,SAGJQ,GACCmD,MAACvB,EAAGA,IAAAC,OAAAC,OAAA,CAAA,cACU,iBACZnC,GACEkC,OAAAC,OAAA,CAAAE,QAAS,OACTK,WAAY,SACZC,eAAgB,gBAChBG,IAAK,EAELiB,WAAY,IAEZC,GAAI,CAAExB,GAAI,EAAGC,GAAI,GAEjBwB,UAAW,YACR3C,IAEDC,EAEH,CAAA1B,SAAAQ,QAGD"}
+{"version":3,"file":"banner.js","sources":["../../../../../src/components/banner/banner.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, useTheme } from '@mui/material';\nimport React, { ElementType, forwardRef, ReactNode, useMemo } from 'react';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\n\nexport interface BannerProps extends BoxProps<ElementType> {\n  /**\n   * Defines which variant of Banner component should be rendered\n   * @default info\n   */\n  variant?: 'info' | 'warning' | 'error';\n  /**\n   * Set the proportions\n   * @default large\n   */\n  size?: 'large' | 'small';\n  /**\n   * Properties passed to indicator icon\n   */\n  iconProps?: SvgIconProps;\n  /**\n   * Icon node to be used\n   */\n  IconComponent?: ElementType<SvgIconProps>;\n  /**\n   * Properties passed to wrapper of children\n   */\n  typographyProps?: TypographyProps<ElementType>;\n  /**\n   * Properties applied to wrapper of content (Icon and Typography)\n   */\n  wrapperProps?: BoxProps<ElementType>;\n  /**\n   * ReactNode that renders buttons. If multiple buttons are needed, wrap them in React.Fragment\n   */\n  buttons?: ReactNode;\n  /**\n   * Properties applied to wrapper element of buttons\n   */\n  buttonsWrapperProps?: BoxProps<ElementType>;\n}\n\n/**\n * Alert notification banner\n */\nexport const Banner: React.FC<BannerProps> = forwardRef(\n  (\n    {\n      children,\n      variant = 'info',\n      size = 'large',\n      sx,\n      iconProps,\n      IconComponent,\n      typographyProps,\n      wrapperProps,\n      buttons,\n      buttonsWrapperProps,\n      onClick,\n      ...rest\n    },\n    ref,\n  ) => {\n    const theme = useTheme();\n    const { sx: iconSx, ...restIcon } = iconProps ?? {};\n    const { sx: typographySx, ...restTypography } = typographyProps ?? {};\n    const { sx: wrapperSx, ...restWrapper } = wrapperProps ?? {};\n    const { sx: buttonsWrapperSx, ...restButtonsWrapper } = buttonsWrapperProps ?? {};\n\n    const [borderColor, backgroundColor, IconVariantComponent] = useMemo(() => {\n      switch (variant) {\n        case 'error':\n          return ['error.main', 'error.light', WarningFilledIcon];\n        case 'warning':\n          return ['warning.main', 'warning.light', CircleExclamationFilledIcon];\n        case 'info':\n        default:\n          return ['info.main', 'info.light', CircleInformationFilledIcon];\n      }\n    }, [variant]);\n    const BannerIcon = IconComponent ?? IconVariantComponent;\n\n    return (\n      <Box\n        data-testid=\"Banner\"\n        role=\"alert\"\n        aria-atomic=\"true\"\n        aria-live=\"assertive\"\n        onClick={onClick}\n        sx={{\n          display: 'flex',\n          width: '100%',\n          // on mobile content and button bellow each other\n          flexDirection: { xs: 'column', md: 'row' },\n          alignItems: { xs: 'flex-start', md: 'center' },\n          justifyContent: 'space-between',\n          // proportions\n          px: 2,\n          py: size === 'small' ? 1 : { xs: 2, md: 1 },\n          gap: 1,\n          // style\n          borderLeft: 6,\n          borderColor: borderColor,\n          backgroundColor: theme.palette.mode === 'dark' ? 'onSurface.os900' : backgroundColor,\n          textAlign: 'left',\n          // clickable style\n          ...(onClick && {\n            position: 'relative',\n            cursor: 'pointer',\n            // focused style\n            ...getFocusRingStyle(theme, true, '2px'),\n          }),\n          ...sx,\n        }}\n        ref={ref}\n        {...rest}\n      >\n        <Box\n          data-testid=\"Banner.wrapper\"\n          sx={{\n            // align icon and content\n            flexGrow: '1',\n            display: 'flex',\n            alignItems: 'flex-start',\n            justifyContent: 'flex-start',\n            gap: 1,\n            py: 0.5,\n            ...wrapperSx,\n          }}\n          {...restWrapper}\n        >\n          <BannerIcon\n            data-testid=\"Banner.icon\"\n            sx={{\n              color: borderColor,\n              ...iconSx,\n            }}\n            {...restIcon}\n          />\n          <Typography\n            data-testid=\"Banner.text\"\n            sx={{\n              color: 'text.primary',\n              flexGrow: '1',\n              // custom font according to Figma\n              fontSize: { xl: '16px' },\n              lineHeight: { xl: '24px' },\n              ...typographySx,\n            }}\n            {...restTypography}\n          >\n            {children}\n          </Typography>\n        </Box>\n        {buttons && (\n          <Box\n            data-testid=\"Banner.buttons\"\n            sx={{\n              display: 'flex',\n              alignItems: 'center',\n              justifyContent: 'space-between',\n              gap: 1,\n              // always show buttons next to each other\n              flexShrink: '0',\n              // on mobile align with text\n              ml: { xs: 4, md: 0 },\n              // on mobile move to the right side\n              alignSelf: 'flex-end',\n              ...buttonsWrapperSx,\n            }}\n            {...restButtonsWrapper}\n          >\n            {buttons}\n          </Box>\n        )}\n      </Box>\n    );\n  },\n);\n"],"names":["Banner","forwardRef","_a","ref","children","variant","size","sx","iconProps","IconComponent","typographyProps","wrapperProps","buttons","buttonsWrapperProps","onClick","rest","__rest","theme","useTheme","_b","iconSx","restIcon","_c","typographySx","restTypography","_d","wrapperSx","restWrapper","_e","buttonsWrapperSx","restButtonsWrapper","borderColor","backgroundColor","IconVariantComponent","useMemo","WarningFilledIcon","CircleExclamationFilledIcon","CircleInformationFilledIcon","BannerIcon","_jsxs","Box","Object","assign","role","display","width","flexDirection","xs","md","alignItems","justifyContent","px","py","gap","borderLeft","palette","mode","textAlign","position","cursor","getFocusRingStyle","jsxs","flexGrow","_jsx","jsx","color","Typography","fontSize","xl","lineHeight","flexShrink","ml","alignSelf"],"mappings":"+TA+Ca,MAAAA,EAAgCC,EAAUA,YACrD,CACEC,EAcAC,KAdA,IAAAC,SACEA,EAAQC,QACRA,EAAU,OAAMC,KAChBA,EAAO,QAAOC,GACdA,EAAEC,UACFA,EAASC,cACTA,EAAaC,gBACbA,EAAeC,aACfA,EAAYC,QACZA,EAAOC,oBACPA,EAAmBC,QACnBA,GAEDZ,EADIa,EAAIC,EAAAA,OAAAd,EAZT,2IAgBA,MAAMe,EAAQC,EAAAA,WACRC,EAA8BX,QAAAA,EAAa,IAAzCD,GAAIa,GAAuCD,EAA5BE,EAAjBL,EAAAA,OAAAG,EAAA,CAAA,OACAG,EAA0CZ,QAAAA,EAAmB,IAA3DH,GAAIgB,GAAyDD,EAAxCE,EAAvBR,EAAAA,OAAAM,EAAA,CAAA,OACAG,EAAoCd,QAAAA,EAAgB,IAAlDJ,GAAImB,GAAgDD,EAAlCE,EAApBX,EAAAA,OAAAS,EAAA,CAAA,OACAG,EAAkDf,QAAAA,EAAuB,IAAvEN,GAAIsB,GAAqED,EAAhDE,EAA3Bd,EAAAA,OAAAY,EAAA,CAAA,QAECG,EAAaC,EAAiBC,GAAwBC,EAAOA,SAAC,KACnE,OAAQ7B,GACN,IAAK,QACH,MAAO,CAAC,aAAc,cAAe8B,qBACvC,IAAK,UACH,MAAO,CAAC,eAAgB,gBAAiBC,+BAE3C,QACE,MAAO,CAAC,YAAa,aAAcC,kCAEtC,CAAChC,IACEiC,EAAa7B,QAAAA,EAAiBwB,EAEpC,OACEM,OAACC,EAAAA,IACaC,OAAAC,OAAA,CAAA,cAAA,SACZC,KAAK,QACO,cAAA,OACF,YAAA,YACV7B,QAASA,EACTP,GAAEkC,OAAAC,OAAAD,OAAAC,OAAA,CACAE,QAAS,OACTC,MAAO,OAEPC,cAAe,CAAEC,GAAI,SAAUC,GAAI,OACnCC,WAAY,CAAEF,GAAI,aAAcC,GAAI,UACpCE,eAAgB,gBAEhBC,GAAI,EACJC,GAAa,UAAT9C,EAAmB,EAAI,CAAEyC,GAAI,EAAGC,GAAI,GACxCK,IAAK,EAELC,WAAY,EACZvB,YAAaA,EACbC,gBAAwC,SAAvBf,EAAMsC,QAAQC,KAAkB,kBAAoBxB,EACrEyB,UAAW,QAEP3C,GAAO2B,OAAAC,OAAA,CACTgB,SAAU,WACVC,OAAQ,WAELC,EAAiBA,kBAAC3C,GAAO,EAAM,SAEjCV,GAELJ,IAAKA,GACDY,EAAI,CAAAX,SAAA,CAERmC,EAACsB,KAAArB,MACaC,OAAAC,OAAA,CAAA,cAAA,iBACZnC,GAAEkC,OAAAC,OAAA,CAEAoB,SAAU,IACVlB,QAAS,OACTK,WAAY,aACZC,eAAgB,aAChBG,IAAK,EACLD,GAAI,IACD1B,IAEDC,EAEJ,CAAAvB,SAAA,CAAA2D,EAAAC,IAAC1B,EACaG,OAAAC,OAAA,CAAA,cAAA,cACZnC,GACEkC,OAAAC,OAAA,CAAAuB,MAAOlC,GACJX,IAEDC,IAEN0C,MAACG,EAAAA,WAAUzB,OAAAC,OAAA,CAAA,cACG,cACZnC,GAAEkC,OAAAC,OAAA,CACAuB,MAAO,eACPH,SAAU,IAEVK,SAAU,CAAEC,GAAI,QAChBC,WAAY,CAAED,GAAI,SACf7C,IAEDC,EAAc,CAAApB,SAEjBA,SAGJQ,GACCmD,MAACvB,EAAGA,IAAAC,OAAAC,OAAA,CAAA,cACU,iBACZnC,GACEkC,OAAAC,OAAA,CAAAE,QAAS,OACTK,WAAY,SACZC,eAAgB,gBAChBG,IAAK,EAELiB,WAAY,IAEZC,GAAI,CAAExB,GAAI,EAAGC,GAAI,GAEjBwB,UAAW,YACR3C,IAEDC,EAEH,CAAA1B,SAAAQ,QAGD"}

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

@@ -1 +1,3 @@
 export * from './banner';
+export * from './BannerButton';
+export * from './BannerDismissButton';

package/cjs/components/errorContent/ErrorContent.d.ts

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

package/cjs/components/errorContent/ErrorContent.js

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

package/cjs/components/errorContent/ErrorContent.js.map

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

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

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

package/cjs/components/footer/Footer.js

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

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

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

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

@@ -0,0 +1,29 @@
+import { FC, ReactNode, ElementType } from 'react';
+import { AccordionProps, AccordionSummaryProps, AccordionDetailsProps, TypographyProps } from '@mui/material';
+export interface FooterAccordionProps extends Omit<AccordionProps, 'variant'> {
+    /**
+     * Label of the Accordion
+     */
+    label?: ReactNode;
+    /**
+     * Props applied to the wrapper of label
+     */
+    accordionSummaryProps?: AccordionSummaryProps<ElementType>;
+    /**
+     * Props applied to the content of the accodion
+     */
+    accordionDetailsProps?: AccordionDetailsProps;
+    /**
+     * Properties applied to wrapper of children
+     */
+    contentProps?: TypographyProps<ElementType>;
+    /**
+     * Variant of accordion
+     * @default compact
+     */
+    variant?: 'compact' | 'standard';
+}
+/**
+ * Collapsible footer section
+ */
+export declare const FooterAccordion: FC<FooterAccordionProps>;

package/cjs/components/footer/FooterAccordion.js

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"FooterAccordion.js","sources":["../../../../../src/components/footer/FooterAccordion.tsx"],"sourcesContent":["import React, { FC, forwardRef, ReactNode, ElementType } from 'react';\nimport {\n  Accordion,\n  AccordionSummary,\n  AccordionDetails,\n  AccordionProps,\n  AccordionSummaryProps,\n  AccordionDetailsProps,\n  Typography,\n  TypographyProps,\n  useTheme,\n} from '@mui/material';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport interface FooterAccordionProps extends Omit<AccordionProps, 'variant'> {\n  /**\n   * Label of the Accordion\n   */\n  label?: ReactNode;\n  /**\n   * Props applied to the wrapper of label\n   */\n  accordionSummaryProps?: AccordionSummaryProps<ElementType>;\n  /**\n   * Props applied to the content of the accodion\n   */\n  accordionDetailsProps?: AccordionDetailsProps;\n  /**\n   * Properties applied to wrapper of children\n   */\n  contentProps?: TypographyProps<ElementType>;\n  /**\n   * Variant of accordion\n   * @default compact\n   */\n  variant?: 'compact' | 'standard';\n}\n\n/**\n * Collapsible footer section\n */\nexport const FooterAccordion: FC<FooterAccordionProps> = forwardRef(\n  (\n    {\n      sx,\n      children,\n      className,\n      label,\n      accordionSummaryProps,\n      accordionDetailsProps,\n      contentProps,\n      variant = 'compact',\n      ...rest\n    },\n    ref,\n  ) => {\n    const { sx: accordionSummarySx, ...restAccordionSummary } = accordionSummaryProps ?? {};\n    const theme = useTheme();\n\n    return (\n      <Accordion\n        ref={ref}\n        data-testid=\"FooterAccordion\"\n        className={[\n          'FooterAccordion-root',\n          `FooterAccordion-variant${variant.charAt(0).toUpperCase()}${variant.slice(1)}`,\n          className,\n        ]\n          .filter(Boolean)\n          .join(', ')}\n        sx={{\n          // recolor to dark mode\n          color: 'currentColor',\n          ...(variant === 'compact' && {\n            border: 'none',\n          }),\n          ...sx,\n        }}\n        {...rest}\n      >\n        <AccordionSummary\n          data-testid=\"FooterAccordion.label\"\n          aria-controls=\"footer-accordion\"\n          id=\"footer-accordion\"\n          sx={{\n            // recolor to dark mode\n            color: 'currentColor',\n            '&:hover': {\n              color: 'currentColor',\n              // hover over IconButton\n              '& .MuiAccordion-IconButton': {\n                backgroundColor: theme.palette.transparent.tertiary,\n              },\n            },\n            // change variant of icon button to small & white\n            '& .MuiAccordion-IconButton': {\n              height: '32px',\n              width: '32px',\n              ...getInteractiveStyle(\n                {\n                  backgroundColor: 'transparent',\n                  color: theme.palette.onSurface.os0,\n                },\n                {\n                  color: theme.palette.onSurface.os0,\n                  backgroundColor: theme.palette.transparent.tertiary,\n                },\n              ),\n            },\n            ...(variant === 'compact' && {\n              ...theme.typography.caption2,\n              p: '0',\n              gap: 1.5,\n              justifyContent: 'flex-start',\n              // move icon next to label\n              '& .MuiAccordionSummary-content': {\n                flexGrow: '0',\n              },\n            }),\n            ...accordionSummarySx,\n          }}\n          {...restAccordionSummary}\n        >\n          {label}\n        </AccordionSummary>\n        <AccordionDetails data-testid=\"FooterAccordion.children\" {...accordionDetailsProps}>\n          <Typography variant=\"disclaimer1\" {...contentProps}>\n            {children}\n          </Typography>\n        </AccordionDetails>\n      </Accordion>\n    );\n  },\n);\n"],"names":["FooterAccordion","forwardRef","_a","ref","sx","children","className","label","accordionSummaryProps","accordionDetailsProps","contentProps","variant","rest","__rest","_b","accordionSummarySx","restAccordionSummary","theme","useTheme","_jsxs","jsxs","Accordion","Object","assign","charAt","toUpperCase","slice","filter","Boolean","join","color","border","_jsx","AccordionSummary","id","backgroundColor","palette","transparent","tertiary","height","width","getInteractiveStyle","onSurface","os0","typography","caption2","p","gap","justifyContent","flexGrow","AccordionDetails","jsx","Typography"],"mappings":"qKAyCa,MAAAA,EAA4CC,EAAUA,YACjE,CACEC,EAWAC,SAXAC,GACEA,EAAEC,SACFA,EAAQC,UACRA,EAASC,MACTA,EAAKC,sBACLA,EAAqBC,sBACrBA,EAAqBC,aACrBA,EAAYC,QACZA,EAAU,aACPC,EATLC,EAAAA,OAAAX,EAAA,CAAA,KAAA,WAAA,YAAA,QAAA,wBAAA,wBAAA,eAAA,YAaA,MAAMY,EAAsDN,QAAAA,EAAyB,IAA7EJ,GAAIW,GAA2ED,EAApDE,EAA7BH,EAAAA,OAAAC,EAAA,CAAA,OACAG,EAAQC,EAAAA,WAEd,OACEC,EAACC,KAAAC,YACCC,OAAAC,OAAA,CAAApB,IAAKA,EACO,cAAA,kBACZG,UAAW,CACT,uBACA,0BAA0BK,EAAQa,OAAO,GAAGC,gBAAgBd,EAAQe,MAAM,KAC1EpB,GAECqB,OAAOC,SACPC,KAAK,MACRzB,GAAEkB,OAAAC,OAAAD,OAAAC,OAAA,CAEAO,MAAO,gBACS,YAAZnB,GAAyB,CAC3BoB,OAAQ,SAEP3B,IAEDQ,EAAI,CAAAP,SAAA,CAER2B,MAACC,EAAAA,iBAAgBX,OAAAC,OAAA,CAAA,cACH,wBAAuB,gBACrB,mBACdW,GAAG,mBACH9B,GAAEkB,OAAAC,OAAAD,OAAAC,OAAA,CAEAO,MAAO,eACP,UAAW,CACTA,MAAO,eAEP,6BAA8B,CAC5BK,gBAAiBlB,EAAMmB,QAAQC,YAAYC,WAI/C,6BAA4BhB,OAAAC,OAAA,CAC1BgB,OAAQ,OACRC,MAAO,QACJC,sBACD,CACEN,gBAAiB,cACjBL,MAAOb,EAAMmB,QAAQM,UAAUC,KAEjC,CACEb,MAAOb,EAAMmB,QAAQM,UAAUC,IAC/BR,gBAAiBlB,EAAMmB,QAAQC,YAAYC,aAIjC,YAAZ3B,GACCW,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAAN,EAAM2B,WAAWC,WACpBC,EAAG,IACHC,IAAK,IACLC,eAAgB,aAEhB,iCAAkC,CAChCC,SAAU,QAGXlC,IAEDC,EAAoB,CAAAX,SAEvBE,KAEHyB,EAAAA,IAACkB,EAAAA,iBAAgB5B,OAAAC,OAAA,CAAA,cAAa,4BAA+Bd,EAC3D,CAAAJ,SAAA2B,EAAAmB,IAACC,EAAUA,WAAA9B,OAAAC,OAAA,CAACZ,QAAQ,eAAkBD,EAAY,CAAAL,SAC/CA,WAGK"}

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

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

package/cjs/components/footer/FooterIconButton.js

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"FooterIconButton.js","sources":["../../../../../src/components/footer/FooterIconButton.tsx"],"sourcesContent":["import React, { ElementType, FC, ForwardedRef, forwardRef, useMemo } from 'react';\nimport { IconButton, IconButtonProps } from '@mui/material';\nimport { FacebookIcon } from '@/src/components/icon/stroke/FacebookIcon';\nimport { InstagramIcon } from '@/src/components/icon/stroke/InstagramIcon';\nimport { XIcon } from '@/src/components/icon/stroke/XIcon';\nimport { YouTubeIcon } from '@/src/components/icon/stroke/YouTubeIcon';\nimport { LinkedInIcon } from '@/src/components/icon/stroke/LinkedInIcon';\nimport { SettingsIcon } from '@/src/components/icon/stroke/SettingsIcon';\nimport { HeartIcon } from '@/src/components/icon/stroke/HeartIcon';\n\nexport interface FooterIconButtonProps extends IconButtonProps<ElementType> {\n  /**\n   * @deprecated provide icon directly as children (e.g. <FacebookIcon />)\n   */\n  icon?: 'facebook' | 'instagram' | 'twitter' | 'youtube' | 'linkedin' | 'heart' | 'settings' | string;\n}\n\n/**\n * Section for the main links\n */\nexport const FooterIconButton: FC<FooterIconButtonProps> = forwardRef(({ children, icon, ...rest }, ref) => {\n  // mapper to previous api\n  const Icon = useMemo(() => {\n    switch (icon) {\n      case 'facebook':\n        return FacebookIcon;\n      case 'instagram':\n        return InstagramIcon;\n      case 'twitter':\n        return XIcon;\n      case 'youtube':\n        return YouTubeIcon;\n      case 'linkedin':\n        return LinkedInIcon;\n      case 'settings':\n        return SettingsIcon;\n      case 'heart':\n        return HeartIcon;\n      default:\n        return undefined;\n    }\n  }, [icon]);\n\n  return (\n    <IconButton\n      size=\"medium\"\n      color=\"white\"\n      ref={ref as ForwardedRef<HTMLButtonElement>}\n      data-testid=\"FooterIconButton\"\n      {...rest}\n    >\n      {children || <Icon />}\n    </IconButton>\n  );\n});\n\nexport interface PredefinedFooterIconButtonProps extends Omit<FooterIconButtonProps, 'icon'> {}\n\n/** @deprecated use <FooterIconButton> with icon of your choosing instead */\nexport const FacebookFooterIconButton: FC<FooterIconButtonProps> = forwardRef((props, ref) => (\n  <FooterIconButton aria-label=\"Facebook link\" ref={ref} {...props}>\n    <FacebookIcon />\n  </FooterIconButton>\n));\n/** @deprecated use <FooterIconButton> with icon of your choosing instead */\nexport const InstagramFooterIconButton: FC<FooterIconButtonProps> = forwardRef((props, ref) => (\n  <FooterIconButton aria-label=\"Instagram link\" ref={ref} {...props}>\n    <InstagramIcon />\n  </FooterIconButton>\n));\n/** @deprecated use <FooterIconButton> with icon of your choosing instead */\nexport const TwitterFooterIconButton: FC<FooterIconButtonProps> = forwardRef((props, ref) => (\n  <FooterIconButton aria-label=\"Twitter link\" ref={ref} {...props}>\n    <XIcon />\n  </FooterIconButton>\n));\n/** @deprecated use <FooterIconButton> with icon of your choosing instead */\nexport const YoutubeFooterIconButton: FC<FooterIconButtonProps> = forwardRef((props, ref) => (\n  <FooterIconButton aria-label=\"Youtube link\" ref={ref} {...props}>\n    <YouTubeIcon />\n  </FooterIconButton>\n));\n/** @deprecated use <FooterIconButton> with icon of your choosing instead */\nexport const LinkedinFooterIconButton: FC<FooterIconButtonProps> = forwardRef((props, ref) => (\n  <FooterIconButton aria-label=\"Linkedin link\" ref={ref} {...props}>\n    <LinkedInIcon />\n  </FooterIconButton>\n));\n"],"names":["FooterIconButton","forwardRef","_a","ref","children","icon","rest","__rest","Icon","useMemo","FacebookIcon","InstagramIcon","XIcon","YouTubeIcon","LinkedInIcon","SettingsIcon","HeartIcon","_jsx","jsx","IconButton","Object","assign","size","color","FacebookFooterIconButton","props","InstagramFooterIconButton","TwitterFooterIconButton","YoutubeFooterIconButton","LinkedinFooterIconButton"],"mappings":"2ZAoBa,MAAAA,EAA8CC,EAAUA,YAAC,CAACC,EAA6BC,SAA7BC,SAAEA,EAAQC,KAAEA,GAAIH,EAAKI,EAAIC,EAAAA,OAAAL,EAAzB,qBAErE,MAAMM,EAAOC,EAAAA,SAAQ,KACnB,OAAQJ,GACN,IAAK,WACH,OAAOK,EAAYA,aACrB,IAAK,YACH,OAAOC,EAAaA,cACtB,IAAK,UACH,OAAOC,EAAKA,MACd,IAAK,UACH,OAAOC,EAAWA,YACpB,IAAK,WACH,OAAOC,EAAYA,aACrB,IAAK,WACH,OAAOC,EAAYA,aACrB,IAAK,QACH,OAAOC,EAASA,UAClB,QACE,UAEH,CAACX,IAEJ,OACEY,EAACC,IAAAC,aACCC,OAAAC,OAAA,CAAAC,KAAK,SACLC,MAAM,QACNpB,IAAKA,EACO,cAAA,oBACRG,EAEH,CAAAF,SAAAA,GAAYa,EAAAA,IAACT,EAAI,MACP,IAOJgB,EAAsDvB,EAAAA,YAAW,CAACwB,EAAOtB,IACpFc,EAAAC,IAAClB,EAAgBoB,OAAAC,OAAA,CAAA,aAAY,gBAAgBlB,IAAKA,GAASsB,EACzD,CAAArB,SAAAa,EAAAC,IAACR,eAAY,CAAA,QAIJgB,EAAuDzB,EAAAA,YAAW,CAACwB,EAAOtB,IACrFc,EAAAC,IAAClB,EAAgBoB,OAAAC,OAAA,CAAA,aAAY,iBAAiBlB,IAAKA,GAASsB,EAC1D,CAAArB,SAAAa,EAAAC,IAACP,gBAAa,CAAA,QAILgB,EAAqD1B,EAAAA,YAAW,CAACwB,EAAOtB,IACnFc,EAAAC,IAAClB,EAAgBoB,OAAAC,OAAA,CAAA,aAAY,eAAelB,IAAKA,GAASsB,EACxD,CAAArB,SAAAa,EAAAC,IAACN,QAAK,CAAA,QAIGgB,EAAqD3B,EAAAA,YAAW,CAACwB,EAAOtB,IACnFc,EAAAC,IAAClB,EAAgBoB,OAAAC,OAAA,CAAA,aAAY,eAAelB,IAAKA,GAASsB,EACxD,CAAArB,SAAAa,EAAAC,IAACL,cAAW,CAAA,QAIHgB,EAAsD5B,EAAAA,YAAW,CAACwB,EAAOtB,IACpFc,EAAAC,IAAClB,EAAgBoB,OAAAC,OAAA,CAAA,aAAY,gBAAgBlB,IAAKA,GAASsB,EACzD,CAAArB,SAAAa,EAAAC,IAACJ,eAAY,CAAA"}

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

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

package/cjs/components/footer/FooterLink.js

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

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

@@ -0,0 +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","jsx","FooterNavItem","props"],"mappings":"6OAoBa,MAAAA,EAAkCC,EAAUA,YAAC,CAACC,EAAwCC,KAAxC,IAAAC,GAAEA,EAAEC,KAAEA,EAAIC,SAAEA,EAAQC,MAAEA,GAAKL,EAAKM,EAAhCC,EAAAA,OAAAP,EAAA,CAAA,KAAA,OAAA,WAAA,UAEzD,MAAMQ,EAAOC,EAAAA,SAAQ,KACnB,OAAQN,GACN,IAAK,OACH,OAAOO,EAASA,UAClB,IAAK,OACH,OAAOC,EAAWA,YACpB,IAAK,OACH,OAAOC,EAAQA,SACjB,QACE,UAEH,CAACT,IAEJ,OACEU,EAAAA,KAACC,EAAAA,KAAIC,OAAAC,OAAA,CACHd,GAAEa,OAAAC,OAAA,CAEAC,QAAS,cACTC,IAAK,IACLC,WAAY,SACZC,eAAgB,aAChBC,QAAS,UAET,aAAc,CACZC,eAAgB,YAChBC,MAAO,gBAGT,qBAAsB,CACpBC,SAAU,SAETtB,GAELuB,QAAQ,OACRxB,IAAKA,GACDK,aAEHE,GAAQkB,EAACC,IAAAnB,EAAO,CAAA,GAChBJ,GAAYC,KACR,IAQEuB,EAAwC7B,EAAUA,YAAC,CAAC8B,EAAO5B,IAC/DyB,EAAAC,IAAC7B,EAAWiB,OAAAC,OAAA,CAAAf,IAAKA,GAAS4B"}

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

@@ -0,0 +1,30 @@
+import React, { FC, ReactNode } 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
+     */
+    children?: React.ReactNode;
+    /**
+     * Variant of the menu
+     * - auto: renders on large resolution as list and on mobile as accordion
+     * - list: renders as list with title
+     * - accordion: renders as collapsible accordion
+     * @default auto
+     */
+    variant?: 'auto' | 'list' | 'accordion';
+}
+/**
+ * Section for the secondary links, copyright and optional button
+ */
+export declare const FooterMenu: FC<FooterMenuProps>;

package/cjs/components/footer/FooterMenu.js

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

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

@@ -0,0 +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":"mJAgCa,MAAAA,EAAkCC,EAAUA,YACvD,CACEC,EACAC,SADAC,GAAEA,EAAEC,SAAEA,EAAQC,MAAEA,EAAKC,SAAEA,EAAQC,sBAAEA,EAAqBC,SAAEA,EAAQC,aAAEA,EAAYC,QAAEA,EAAU,UAAWC,EAArGC,EAAAA,OAAAX,EAAA,CAAA,KAAA,WAAA,QAAA,WAAA,wBAAA,WAAA,eAAA,YAGA,MAAMY,EAAoCJ,QAAAA,EAAgB,IAAlDN,GAAIW,GAAgDD,EAAlCE,EAApBH,EAAAA,OAAAC,EAAA,CAAA,OACAG,EAA0CT,QAAAA,EAAyB,IAAjEJ,GAAIc,GAA+DD,EAA9CE,EAAvBN,EAAAA,OAAAI,EAAA,CAAA,OACAG,EAAQC,EAAAA,WACRC,EAASC,EAAAA,cAAqBH,EAAMI,YAAYC,KAAK,OACrDC,EAA0B,SAAZf,EAAqBW,EAAqB,cAAZX,GAC3CgB,EAAUC,GAAeC,EAAAA,UAAS,GAEzC,OACEC,OAACC,EAAAA,+BAEC5B,IAAKA,EACO,cAAA,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,kBACKN,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAAhB,EAAMsB,WAAWC,aACpB,CAAAC,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,kBACKnB,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAAhB,EAAMsB,WAAWa,UACpB,CAAAX,EAAG,EACH,aAAc,CACZC,eAAgB,OAChBC,MAAO,sBAGR/B,IAEFC,IAEDJ,EAEH,CAAAP,SAAA,CAAAA,EACAI,KAvEI,GAAGiB,IAwEQ"}

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

@@ -0,0 +1,24 @@
+import { ElementType, FC, ReactNode } from 'react';
+import { BoxProps } from '@mui/material';
+export interface FooterSectionContactProps extends BoxProps<ElementType> {
+    /**
+     * Items that should be rendered in left side
+     */
+    contactSlot?: ReactNode;
+    /**
+     * Properties applied to the contact wrapper
+     */
+    contactSlotProps?: BoxProps<ElementType>;
+    /**
+     * Items that should be rendered in right side
+     */
+    socialSlot?: ReactNode;
+    /**
+     * Properties applied to the social wrapper
+     */
+    socialSlotProps?: BoxProps<ElementType>;
+}
+/**
+ * Section for the main contact links and social media
+ */
+export declare const FooterSectionContact: FC<FooterSectionContactProps>;

package/cjs/components/footer/FooterSectionContact.js

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

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

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

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

@@ -0,0 +1,34 @@
+import React, { ElementType, FC } from 'react';
+import { BoxProps, ButtonProps, TypographyProps } from '@mui/material';
+export interface FooterSectionLinksProps extends BoxProps<ElementType> {
+    /**
+     * Text wrapped by styled Typography component
+     */
+    textSlot?: React.ReactNode;
+    /**
+     * Properties applied to text typography
+     */
+    textTypographyProps?: TypographyProps<ElementType>;
+    /**
+     * Alternative to providing button props
+     */
+    buttonSlot?: React.ReactNode;
+    /**
+     * Properties applied to button wrapper
+     */
+    buttonSlotProps?: BoxProps<ElementType>;
+    /**
+     * Props for button
+     */
+    buttonProps?: ButtonProps & {
+        label?: React.ReactNode;
+    };
+    /**
+     * Properties applied to link container
+     */
+    linksWrapperProps?: BoxProps<ElementType>;
+}
+/**
+ * Section for the secondary links, copyright and optional button
+ */
+export declare const FooterSectionLinks: FC<FooterSectionLinksProps>;

package/cjs/components/footer/FooterSectionLinks.js

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