@skodaflow/web-library 7.13.1 → 7.15.0

package/components/header/Header.js

@@ -0,0 +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};
+//# sourceMappingURL=Header.js.map

package/components/header/Header.js.map

@@ -0,0 +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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"}

package/components/header/HeaderButton.d.ts

@@ -0,0 +1,54 @@
+import { ElementType, FC } from 'react';
+import { IconButtonProps, TooltipProps, BadgeProps } from '@mui/material';
+export interface HeaderButtonProps extends IconButtonProps<ElementType> {
+    /**
+     * Label for the tooltip or the text button
+     */
+    label?: TooltipProps['title'];
+    /**
+     * Change icon button with tooltip into button
+     */
+    extend?: boolean;
+    /**
+     * Properties applied to tooltip
+     */
+    tooltipProps?: Partial<TooltipProps>;
+    /**
+     * 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

@@ -0,0 +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};
+//# sourceMappingURL=HeaderButton.js.map

package/components/header/HeaderButton.js.map

@@ -0,0 +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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"}

package/components/header/HeaderLanguageSelect.d.ts

@@ -0,0 +1,45 @@
+import { FC } from 'react';
+import { MenuProps, MenuItemProps, RadioProps, ListItemTextProps } from '@mui/material';
+import { HeaderButtonProps } from './HeaderButton';
+type HeaderLanguageType = string | {
+    short?: string;
+    full?: string;
+};
+export interface HeaderLanguageSelectProps extends HeaderButtonProps {
+    /**
+     * List of languages
+     */
+    languages?: HeaderLanguageType[];
+    /**
+     * Index of selected language
+     * @default 0
+     */
+    defaultLanguage?: number;
+    /**
+     * Function that is triggered on language change
+     * @param language - provided language
+     * @param index - index of language
+     */
+    onSelect?: (language: HeaderLanguageType, index: number) => void;
+    /**
+     * Props applied to menu
+     */
+    menuProps?: MenuProps;
+    /**
+     * Props applied to each MenuItem
+     */
+    menuItemProps?: MenuItemProps;
+    /**
+     * Props applied to Radio inside MenuItem
+     */
+    radioProps?: RadioProps;
+    /**
+     * Props applied to ListItemText inside MenuIte
+     */
+    listItemTextProps?: ListItemTextProps;
+}
+/**
+ * IconButton with menu selector for languages
+ */
+export declare const HeaderLanguageSelect: FC<HeaderLanguageSelectProps>;
+export {};

package/components/header/HeaderLanguageSelect.js

@@ -0,0 +1,2 @@
+import{__rest as e}from"tslib";import{jsxs as r,Fragment as t,jsx as n}from"react/jsx-runtime";import{forwardRef as o,useState as l}from"react";import{Menu as s,MenuItem as a,Radio as i,ListItemText as c}from"@mui/material";import{HeaderButton as m}from"./HeaderButton.js";import{GlobeIcon as u}from"../icon/stroke/GlobeIcon.js";const d=o(((o,d)=>{var{children:p,languages:g,onSelect:f,defaultLanguage:h=0,menuProps:b,menuItemProps:j,radioProps:P,listItemTextProps:I}=o,x=e(o,["children","languages","onSelect","defaultLanguage","menuProps","menuItemProps","radioProps","listItemTextProps"]);const[O,k]=l(null),[C,L]=l(h);return r(t,{children:[n(m,Object.assign({onClick:e=>k(e.currentTarget),ref:d,"data-testid":"HeaderLanguageSelect"},x,{children:p||n(u,{})})),n(s,Object.assign({open:!!O,anchorEl:O,onClose:()=>k(null)},b,{children:null==g?void 0:g.map(((e,t)=>{const o=C===t,l="string"==typeof e?e:e.full;return r(a,Object.assign({selected:o,onClick:()=>{null==f||f(e,t),L(t)}},j,{children:[n(i,Object.assign({checked:o,tabIndex:-1},P)),n(c,Object.assign({},I,{children:l}))]}),l)}))}))]})}));export{d as HeaderLanguageSelect};
+//# sourceMappingURL=HeaderLanguageSelect.js.map

package/components/header/HeaderLanguageSelect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HeaderLanguageSelect.js","sources":["../../../src/components/header/HeaderLanguageSelect.tsx"],"sourcesContent":["import React, { FC, forwardRef, useState } from 'react';\nimport {\n  Menu,\n  MenuItem,\n  Radio,\n  ListItemText,\n  MenuProps,\n  MenuItemProps,\n  RadioProps,\n  ListItemTextProps,\n} from '@mui/material';\nimport { HeaderButton, HeaderButtonProps } from './HeaderButton';\nimport { GlobeIcon } from '@/src/components/icon/stroke/GlobeIcon';\n\ntype HeaderLanguageType = string | { short?: string; full?: string };\n\nexport interface HeaderLanguageSelectProps extends HeaderButtonProps {\n  /**\n   * List of languages\n   */\n  languages?: HeaderLanguageType[];\n  /**\n   * Index of selected language\n   * @default 0\n   */\n  defaultLanguage?: number;\n  /**\n   * Function that is triggered on language change\n   * @param language - provided language\n   * @param index - index of language\n   */\n  onSelect?: (language: HeaderLanguageType, index: number) => void;\n  /**\n   * Props applied to menu\n   */\n  menuProps?: MenuProps;\n  /**\n   * Props applied to each MenuItem\n   */\n  menuItemProps?: MenuItemProps;\n  /**\n   * Props applied to Radio inside MenuItem\n   */\n  radioProps?: RadioProps;\n  /**\n   * Props applied to ListItemText inside MenuIte\n   */\n  listItemTextProps?: ListItemTextProps;\n}\n\n/**\n * IconButton with menu selector for languages\n */\nexport const HeaderLanguageSelect: FC<HeaderLanguageSelectProps> = forwardRef(\n  (\n    {\n      children,\n      languages,\n      onSelect,\n      defaultLanguage = 0,\n      menuProps,\n      menuItemProps,\n      radioProps,\n      listItemTextProps,\n      ...rest\n    },\n    ref,\n  ) => {\n    const [anchor, setAnchor] = useState(null);\n    const [selected, setSelected] = useState(defaultLanguage);\n\n    return (\n      <>\n        <HeaderButton\n          onClick={(e) => setAnchor(e.currentTarget)}\n          ref={ref}\n          data-testid=\"HeaderLanguageSelect\"\n          {...rest}\n        >\n          {children || <GlobeIcon />}\n        </HeaderButton>\n        <Menu open={!!anchor} anchorEl={anchor} onClose={() => setAnchor(null)} {...menuProps}>\n          {languages?.map((lang, idx) => {\n            const isSelected = selected === idx;\n            const value = typeof lang === 'string' ? lang : lang.full;\n\n            return (\n              <MenuItem\n                key={value}\n                selected={isSelected}\n                onClick={() => {\n                  onSelect?.(lang, idx);\n                  setSelected(idx);\n                }}\n                {...menuItemProps}\n              >\n                <Radio checked={isSelected} tabIndex={-1} {...radioProps} />\n                <ListItemText {...listItemTextProps}>{value}</ListItemText>\n              </MenuItem>\n            );\n          })}\n        </Menu>\n      </>\n    );\n  },\n);\n"],"names":["HeaderLanguageSelect","forwardRef","_a","ref","children","languages","onSelect","defaultLanguage","menuProps","menuItemProps","radioProps","listItemTextProps","rest","__rest","anchor","setAnchor","useState","selected","setSelected","_jsxs","_Fragment","_jsx","HeaderButton","onClick","e","currentTarget","GlobeIcon","Menu","Object","assign","open","anchorEl","onClose","map","lang","idx","isSelected","value","full","MenuItem","Radio","checked","tabIndex","ListItemText"],"mappings":"yUAqDa,MAAAA,EAAsDC,GACjE,CACEC,EAWAC,SAXAC,SACEA,EAAQC,UACRA,EAASC,SACTA,EAAQC,gBACRA,EAAkB,EAACC,UACnBA,EAASC,cACTA,EAAaC,WACbA,EAAUC,kBACVA,KACGC,EATLC,EAAAX,EAAA,CAAA,WAAA,YAAA,WAAA,kBAAA,YAAA,gBAAA,aAAA,sBAaA,MAAOY,EAAQC,GAAaC,EAAS,OAC9BC,EAAUC,GAAeF,EAAST,GAEzC,OACEY,EAAAC,EAAA,CAAAhB,SAAA,CACEiB,EAACC,iBACCC,QAAUC,GAAMT,EAAUS,EAAEC,eAC5BtB,IAAKA,EAAG,cACI,wBACRS,EAEH,CAAAR,SAAAA,GAAYiB,EAACK,EAAY,CAAA,MAE5BL,EAACM,EAAKC,OAAAC,OAAA,CAAAC,OAAQhB,EAAQiB,SAAUjB,EAAQkB,QAAS,IAAMjB,EAAU,OAAWP,EAAS,CAAAJ,SAClFC,aAAA,EAAAA,EAAW4B,KAAI,CAACC,EAAMC,KACrB,MAAMC,EAAanB,IAAakB,EAC1BE,EAAwB,iBAATH,EAAoBA,EAAOA,EAAKI,KAErD,OACEnB,EAACoB,EAECX,OAAAC,OAAA,CAAAZ,SAAUmB,EACVb,QAAS,KACPjB,SAAAA,EAAW4B,EAAMC,GACjBjB,EAAYiB,EAAI,GAEd1B,EAEJ,CAAAL,SAAA,CAAAiB,EAACmB,EAAKZ,OAAAC,OAAA,CAACY,QAASL,EAAYM,UAAY,GAAMhC,IAC9CW,EAACsB,EAAiBf,OAAAC,OAAA,CAAA,EAAAlB,EAAoB,CAAAP,SAAAiC,QATjCA,EAUI,SAIhB"}

package/components/header/HeaderLogo.d.ts

@@ -0,0 +1,25 @@
+import { FC } from 'react';
+import { LinkProps } from '@mui/material';
+import { LogoProps } from '@/src/components/logo/Logo';
+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

@@ -0,0 +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};
+//# sourceMappingURL=HeaderLogo.js.map

package/components/header/HeaderLogo.js.map

@@ -0,0 +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":"kQAuBa,MAAAA,EAAkCC,GAAW,CAACC,EAA4CC,KAA5C,IAAAC,GAAEA,EAAEC,SAAEA,EAAQC,KAAEA,EAAIC,UAAEA,GAASL,EAAKM,EAApCC,EAAAP,EAAA,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,EACM,aAAA,QACPK,EAAI,CAAAH,SAEPA,GAAYQ,EAACS,mBAASf,OAItBF,GAAYQ,EAACS,iBAAKlB,GAAIA,EAAID,IAAKA,GAAmDI,GAAa,IAM3FgB,EAAuCtB,GAAW,CAACuB,EAAOrB,IAC9DU,EAACb,EAAee,OAAAC,OAAA,GAAAQ,GAAOrB,IAAKA"}

package/components/header/HeaderNavigationHero.d.ts

@@ -0,0 +1,51 @@
+import { FC, ReactNode, 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
+     */
+    inContainer?: boolean;
+    /**
+     * Controls appearance of backdrop when content opens
+     * @default false
+     */
+    disableBackdrop?: boolean;
+    /**
+     * Props applied to ClickAwayListener
+     */
+    clickAwayListenerProps?: ClickAwayListenerProps;
+    /**
+     * Props applied to main wrapper of content
+     */
+    contentProps?: BoxProps<ElementType>;
+    /**
+     * Props applied to main wrapper before collapsible
+     */
+    wrapperProps?: BoxProps<ElementType>;
+    /**
+     * Props applied to Container if inContainer property is provided
+     */
+    containerProps?: ContainerProps;
+    /**
+     * Props applied to Collapse component
+     */
+    collapseProp?: CollapseProps;
+    /**
+     * Props applied to Portal if disableBackdrop property is not provided
+     */
+    portalProps?: PortalProps;
+    /**
+     * Props applied to Backdrop if disableBackdrop property is not provided
+     */
+    backdropProps?: BackdropProps;
+}
+/**
+ * HeaderNavigationLink with the integration of the complex hero menu
+ */
+export declare const HeaderNavigationHero: FC<HeaderNavigationHeroProps>;

package/components/header/HeaderNavigationHero.js

@@ -0,0 +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};
+//# sourceMappingURL=HeaderNavigationHero.js.map

package/components/header/HeaderNavigationHero.js.map

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

package/components/header/HeaderNavigationLink.d.ts

@@ -0,0 +1,48 @@
+import { ElementType, FC, ReactNode } from 'react';
+import { ButtonBaseProps, BoxProps } from '@mui/material';
+export interface HeaderNavigationLinkProps extends ButtonBaseProps<ElementType> {
+    /**
+     * Displayed navigation text, can be provided as children as well
+     */
+    label?: ReactNode;
+    /**
+     * Marks item currently active
+     * @default false
+     */
+    active?: boolean;
+    /**
+     * Indicates external link
+     * @default false
+     */
+    external?: boolean;
+    /**
+     * 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
+     */
+    labelWrapperProps?: BoxProps<ElementType>;
+    /**
+     * Properties applied to default label
+     */
+    labelProps?: BoxProps<ElementType>;
+    /**
+     * Properties applied to selected label
+     */
+    selectedLabelProps?: BoxProps<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

@@ -0,0 +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/theme/theme.typography.js";const b=o(((o,b)=>{var{sx:d,children:x,label:m,icon:u,active:f=!1,external:j=!1,index:y,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||j?t(l,{}):u),[u,j]);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};
+//# sourceMappingURL=HeaderNavigationLink.js.map

package/components/header/HeaderNavigationLink.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HeaderNavigationLink.js","sources":["../../../src/components/header/HeaderNavigationLink.tsx"],"sourcesContent":["import React, { useMemo, ElementType, FC, forwardRef, ReactNode, ForwardedRef } from 'react';\nimport { ButtonBase, ButtonBaseProps, Box, BoxProps, useTheme } from '@mui/material';\nimport { ArrowTopRightIcon } from '@/src/components/icon/stroke/ArrowTopRightIcon';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\nimport { getTypography } from '@/src/materialui/theme/theme.typography';\n\nexport interface HeaderNavigationLinkProps extends ButtonBaseProps<ElementType> {\n  /**\n   * Displayed navigation text, can be provided as children as well\n   */\n  label?: ReactNode;\n  /**\n   * Marks item currently active\n   * @default false\n   */\n  active?: boolean;\n  /**\n   * Indicates external link\n   * @default false\n   */\n  external?: boolean;\n  /**\n   * Expect icon component that will be rendered after the label\n   */\n  icon?: ReactNode | 'arrow-ne';\n  /**\n   * @deprecated no longer has any effect, remove the property\n   */\n  index?: number;\n  /**\n   * Properties applied to wrapper of label\n   */\n  labelWrapperProps?: BoxProps<ElementType>;\n  /**\n   * Properties applied to default label\n   */\n  labelProps?: BoxProps<ElementType>;\n  /**\n   * Properties applied to selected label\n   */\n  selectedLabelProps?: BoxProps<ElementType>;\n}\n\n/**\n * Component to render styled button in the header\n */\nexport const HeaderNavigationLink: FC<HeaderNavigationLinkProps> = forwardRef(\n  (\n    {\n      sx,\n      children,\n      label,\n      icon,\n      active = false,\n      external = false,\n      index: _,\n      labelWrapperProps,\n      labelProps,\n      selectedLabelProps,\n      ...rest\n    },\n    ref,\n  ) => {\n    const theme = useTheme();\n    const { sx: labelWrapperSx, ...restLabelWrapper } = labelWrapperProps ?? {};\n    const { sx: labelSx, ...restLabel } = labelProps ?? {};\n    const { sx: selectedLabelSx, ...restSelectedLabel } = selectedLabelProps ?? {};\n    // mapper to previous api\n    const linkIcon = useMemo(() => {\n      return icon === 'arrow-new' || external ? <ArrowTopRightIcon /> : icon;\n    }, [icon, external]);\n\n    return (\n      <ButtonBase\n        sx={{\n          ...theme.typography.list,\n          [theme.breakpoints.down('lg')]: {\n            // switch to 'large body' typography according to figma\n            ...getTypography('body', theme.direction === 'rtl', 'large'),\n          },\n          position: 'relative',\n          zIndex: '100',\n          // icon and text next to each other\n          display: { xs: 'flex', lg: 'inline-flex' },\n          width: { xs: '100%', lg: 'auto' },\n          gap: 0.5,\n          alignItems: 'center',\n          justifyContent: 'flex-start',\n          py: { xs: 2, lg: 1 },\n          px: { xs: 1, lg: 0.5 },\n          transition:\n            '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',\n          // size of icon\n          '& .MuiSvgIcon-root': {\n            fontSize: '14px',\n          },\n          // bottom border\n          '&:after': {\n            content: { xs: 'none', lg: '\"\"' },\n            position: 'absolute',\n            left: '0',\n            right: '0',\n            // move directly into border of appbar\n            bottom: '0',\n            height: '1px',\n            backgroundColor: 'transparent.transparent',\n            ...(active && {\n              height: '2px',\n              backgroundColor: 'text.primary',\n            }),\n          },\n          // disabled style\n          '&.Mui-disabled': {\n            color: 'disabled.tertiary',\n          },\n          // interactive style\n          ...getInteractiveStyle(\n            {\n              color: theme.palette.mode === 'dark' ? 'onSurface.os300' : 'onSurface.os700',\n              '&&:after': {\n                backgroundColor: 'transparent.transparent',\n              },\n              '& .FlowHeaderNavigationLink-label': {\n                opacity: '1',\n              },\n              '& .FlowHeaderNavigationLink-selectedLabel': {\n                opacity: '0',\n              },\n              // active state is same as hover state\n              ...(active && {\n                color: 'text.primary',\n                '&&:after': {\n                  backgroundColor: 'text.primary',\n                },\n                '& .FlowHeaderNavigationLink-label': {\n                  opacity: '0',\n                },\n                '& .FlowHeaderNavigationLink-selectedLabel': {\n                  opacity: '1',\n                },\n              }),\n            },\n            {\n              color: 'text.primary',\n              '&&:after': {\n                backgroundColor: 'text.primary',\n              },\n              '& .FlowHeaderNavigationLink-label': {\n                opacity: '0',\n              },\n              '& .FlowHeaderNavigationLink-selectedLabel': {\n                opacity: '1',\n              },\n            },\n          ),\n          ...getFocusRingStyle(theme),\n          // adjust focus ring\n          '&&:before': {\n            borderRadius: '4px',\n            // make sure top border is not cropped\n            top: { xs: '0', lg: '2px' },\n            bottom: { xs: '0', lg: '-2px' },\n          },\n          ...sx,\n        }}\n        ref={ref as ForwardedRef<HTMLButtonElement>}\n        data-testid=\"HeaderNavigationLink\"\n        {...rest}\n      >\n        {(children || label) && (\n          <Box\n            className=\"FlowHeaderNavigationLink-labelWrapper\"\n            sx={{\n              display: 'inline-flex',\n              alignItems: 'center',\n              justifyContent: 'center',\n              textAlign: 'center',\n              position: 'relative',\n              ...labelWrapperSx,\n            }}\n            {...restLabelWrapper}\n          >\n            <Box\n              className=\"FlowHeaderNavigationLink-label\"\n              sx={{\n                position: 'absolute',\n                left: { xs: '0', lg: 'auto' },\n                ...labelSx,\n              }}\n              {...restLabel}\n            >\n              {children || label}\n            </Box>\n            <Box\n              className=\"FlowHeaderNavigationLink-selectedLabel\"\n              sx={{\n                fontWeight: '700',\n                opacity: '0',\n                position: 'relative',\n                ...selectedLabelSx,\n              }}\n              aria-hidden=\"true\"\n              {...restSelectedLabel}\n            >\n              {children || label}\n            </Box>\n          </Box>\n        )}\n        {linkIcon}\n      </ButtonBase>\n    );\n  },\n);\n\nexport interface HeaderOverheadItemProps extends HeaderNavigationLinkProps {}\n/**\n * @deprecated remove this component, use HeaderNavigationLink instead\n */\nexport const HeaderOverheadItem: FC<HeaderOverheadItemProps> = forwardRef((props, ref) => {\n  return <HeaderNavigationLink ref={ref} {...props} />;\n});\n"],"names":["HeaderNavigationLink","forwardRef","_a","ref","sx","children","label","icon","active","external","index","_","labelWrapperProps","labelProps","selectedLabelProps","rest","__rest","theme","useTheme","_b","labelWrapperSx","restLabelWrapper","_c","labelSx","restLabel","_d","selectedLabelSx","restSelectedLabel","linkIcon","useMemo","_jsx","ArrowTopRightIcon","_jsxs","ButtonBase","Object","assign","typography","list","breakpoints","down","getTypography","direction","position","zIndex","display","xs","lg","width","gap","alignItems","justifyContent","py","px","transition","fontSize","content","left","right","bottom","height","backgroundColor","color","getInteractiveStyle","palette","mode","opacity","getFocusRingStyle","borderRadius","top","Box","className","textAlign","fontWeight","HeaderOverheadItem","props"],"mappings":"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"}

package/components/header/HeaderNavigationMenu.d.ts

@@ -0,0 +1,25 @@
+import { FC, ReactNode } from 'react';
+import { MenuProps, CollapseProps, ClickAwayListenerProps } from '@mui/material';
+import { HeaderNavigationLinkProps } from './HeaderNavigationLink';
+export interface HeaderNavigationMenuProps extends HeaderNavigationLinkProps {
+    /**
+     * Content of the menu, can be provided as children as well
+     */
+    menuItems?: ReactNode;
+    /**
+     * Props applied to menu
+     */
+    menuProps?: MenuProps;
+    /**
+     * Props applied to ClickAwayListener
+     */
+    clickAwayListenerProps?: ClickAwayListenerProps;
+    /**
+     * Props applied to menu on mobile
+     */
+    collapseProps?: CollapseProps;
+}
+/**
+ * HeaderNavigationLink with the integration of the menu
+ */
+export declare const HeaderNavigationMenu: FC<HeaderNavigationMenuProps>;

package/components/header/HeaderNavigationMenu.js

@@ -0,0 +1,2 @@
+import{__rest as o}from"tslib";import{jsxs as n,Fragment as e,jsx as r}from"react/jsx-runtime";import{forwardRef as t,useRef as i,useState as s}from"react";import{useTheme as l,useMediaQuery as a,ClickAwayListener as c,Collapse as u,Menu as m}from"@mui/material";import{ChevronDownIcon as d}from"../icon/stroke/ChevronDownIcon.js";import{HeaderNavigationLink as g}from"./HeaderNavigationLink.js";import{getInteractiveStyle as p}from"../../materialui/button/interactive.js";const f=t(((t,f)=>{var{children:x,sx:b,label:k,icon:v,onClick:h,menuItems:j,menuProps:C,collapseProps:O,clickAwayListenerProps:w}=t,P=o(t,["children","sx","label","icon","onClick","menuItems","menuProps","collapseProps","clickAwayListenerProps"]);const S=i(),[y,I]=s(null),A=l(),L=a(A.breakpoints.down("lg")),M=null!=O?O:{},{sx:H}=M,N=o(M,["sx"]);return n(e,{children:[r(g,Object.assign({active:!!y,icon:v||r(d,{sx:{"&&&":{fontSize:{xs:"20px",lg:"14px"}},color:{xs:"dark"===A.palette.mode?"onSurface.os300":"onSurface.os700",lg:"currentColor"},transform:`rotate(${y?"180":"0"}deg)`,transition:{xs:A.transitions.create("transform",{duration:A.transitions.duration.shortest}),lg:"none"}}}),onClick:o=>{null==h||h(o),I((n=>n?null:o.currentTarget))},sx:Object.assign({justifyContent:{xs:"space-between",lg:"flex-start"}},b),ref:null!=f?f:S,"data-testid":"HeaderNavigationMenu"},P,{children:k})),L?r(c,Object.assign({onClickAway:o=>{var n,e,r;console.log(o.target),!(null===(r=null===(e=null!==(n=f)&&void 0!==n?n:S)||void 0===e?void 0:e.current)||void 0===r?void 0:r.contains(null==o?void 0:o.target))&&I(null)}},w,{children:r(u,Object.assign({in:!!y,sx:Object.assign({"& .MuiMenuItem-root":Object.assign({},p({background:"none",fontWeight:"300",color:"dark"===A.palette.mode?"onSurface.os300":"onSurface.os700"},{background:"none",fontWeight:"700",color:"currentColor"}))},H)},N,{children:x||j}))})):r(m,Object.assign({open:!!y,anchorEl:y,onClose:()=>I(null)},C,{children:x||j}))]})}));export{f as HeaderNavigationMenu};
+//# sourceMappingURL=HeaderNavigationMenu.js.map

package/components/header/HeaderNavigationMenu.js.map

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

package/{cjs/layout/Header → components/header}/index.d.ts

@@ -1,11 +1,7 @@
 export * from './Header';
-export * from './HeaderNavigationLink';
-export * from './HeaderNavigationLinkLabel';
+export * from './HeaderLogo';
 export * from './HeaderButton';
 export * from './HeaderLanguageSelect';
+export * from './HeaderNavigationLink';
 export * from './HeaderNavigationMenu';
-export * from './HeaderSkodaLogo';
 export * from './HeaderNavigationHero';
-export * from './HeaderLogo';
-export * from './HeaderOverheadItem';
-export * from './PredefinedHeaderButtons';

package/components/icon/filled/BatteryDischargeFilledIcon.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { SvgIconProps } from '@mui/material';
+/**
+ * Flow brand exclusive icon
+ */
+export declare const BatteryDischargeFilledIcon: React.FC<SvgIconProps>;

package/components/icon/filled/BatteryDischargeFilledIcon.js

@@ -0,0 +1,2 @@
+import{jsx as L}from"react/jsx-runtime";import{forwardRef as H}from"react";import{SvgIcon as r}from"@mui/material";const t=H(((H,t)=>L(r,Object.assign({viewBox:"2 2 20 20",ref:t},H,{children:L("path",{d:"M12.6816 15.9141H12.6885V16.7871L14.9922 14.459L15.9727 15.4404L15.7959 15.6162L15.498 15.9141H15.502L13.7773 17.6387H13.7725L11.9238 19.4873L8.05176 15.6162L7.875 15.4404L8.85547 14.459L10.2949 15.9141H10.3027L11.166 16.7861V11.1367H12.6816V15.9141ZM18.002 8.03906C19.3273 8.03927 20.4014 9.1141 20.4014 10.4395V15.2393C20.4013 16.5645 19.3272 17.6385 18.002 17.6387H15.6875L16.7568 16.5693L16.7559 16.5684L16.9307 16.3965L17.416 15.9141H18.002C18.3745 15.9139 18.6767 15.6118 18.6768 15.2393V10.4395C18.6768 10.0668 18.3746 9.76388 18.002 9.76367H6.00195C5.62916 9.76367 5.32617 10.0667 5.32617 10.4395V15.2393C5.32628 15.612 5.62923 15.9141 6.00195 15.9141H6.44434L6.92969 16.3965L7.10449 16.5684L7.10352 16.5693L8.17285 17.6387H6.00195C4.67653 17.6387 3.60167 16.5647 3.60156 15.2393V10.4395C3.60156 9.11397 4.67647 8.03906 6.00195 8.03906H18.002ZM9.24023 6.86523H5.64062V5.14062H9.24023V6.86523ZM18.3574 6.86523H14.7578V5.14062H18.3574V6.86523Z"})}))));export{t as BatteryDischargeFilledIcon};
+//# sourceMappingURL=BatteryDischargeFilledIcon.js.map

package/components/icon/filled/BatteryDischargeFilledIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BatteryDischargeFilledIcon.js","sources":["../../../../src/components/icon/filled/BatteryDischargeFilledIcon.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { SvgIcon, SvgIconProps } from '@mui/material';\n\n/**\n * Flow brand exclusive icon\n */\nexport const BatteryDischargeFilledIcon: React.FC<SvgIconProps> = forwardRef((props, ref) => {\n  return (\n    <SvgIcon viewBox=\"2 2 20 20\" ref={ref} {...props}>\n      <path d=\"M12.6816 15.9141H12.6885V16.7871L14.9922 14.459L15.9727 15.4404L15.7959 15.6162L15.498 15.9141H15.502L13.7773 17.6387H13.7725L11.9238 19.4873L8.05176 15.6162L7.875 15.4404L8.85547 14.459L10.2949 15.9141H10.3027L11.166 16.7861V11.1367H12.6816V15.9141ZM18.002 8.03906C19.3273 8.03927 20.4014 9.1141 20.4014 10.4395V15.2393C20.4013 16.5645 19.3272 17.6385 18.002 17.6387H15.6875L16.7568 16.5693L16.7559 16.5684L16.9307 16.3965L17.416 15.9141H18.002C18.3745 15.9139 18.6767 15.6118 18.6768 15.2393V10.4395C18.6768 10.0668 18.3746 9.76388 18.002 9.76367H6.00195C5.62916 9.76367 5.32617 10.0667 5.32617 10.4395V15.2393C5.32628 15.612 5.62923 15.9141 6.00195 15.9141H6.44434L6.92969 16.3965L7.10449 16.5684L7.10352 16.5693L8.17285 17.6387H6.00195C4.67653 17.6387 3.60167 16.5647 3.60156 15.2393V10.4395C3.60156 9.11397 4.67647 8.03906 6.00195 8.03906H18.002ZM9.24023 6.86523H5.64062V5.14062H9.24023V6.86523ZM18.3574 6.86523H14.7578V5.14062H18.3574V6.86523Z\" />\n    </SvgIcon>\n  );\n});\n"],"names":["BatteryDischargeFilledIcon","forwardRef","props","ref","_jsx","SvgIcon","Object","assign","viewBox","d"],"mappings":"mHAMa,MAAAA,EAAqDC,GAAW,CAACC,EAAOC,IAEjFC,EAACC,EAAOC,OAAAC,OAAA,CAACC,QAAQ,YAAYL,IAAKA,GAASD,YACzCE,EAAM,OAAA,CAAAK,EAAE"}

package/components/icon/filled/BicycleFilledIcon.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { SvgIconProps } from '@mui/material';
+/**
+ * Flow brand exclusive icon
+ */
+export declare const BicycleFilledIcon: React.FC<SvgIconProps>;

package/components/icon/filled/BicycleFilledIcon.js

@@ -0,0 +1,2 @@
+import{jsx as C}from"react/jsx-runtime";import{forwardRef as L}from"react";import{SvgIcon as r}from"@mui/material";const H=L(((L,H)=>C(r,Object.assign({viewBox:"2 2 20 20",ref:H},L,{children:C("path",{d:"M11.1116 6.14844L10.3489 6.89844H9.00708L9.90747 9.25H15.1741L14.4856 7.39648L14.1106 6.40625H17.7991C18.4569 6.4063 19.0226 6.58418 19.4358 6.94238C19.8526 7.30376 20.0501 7.79541 20.053 8.28027C20.0584 9.2288 19.311 10.1629 18.135 10.1631H17.9436L17.385 8.66309H18.135C18.4175 8.66294 18.554 8.50801 18.553 8.28906C18.5519 7.88254 18.1348 7.90624 17.7991 7.90625H16.2747L17.6272 11.5459C17.8614 11.506 18.1023 11.4844 18.3479 11.4844C20.6986 11.4845 22.6047 13.3904 22.6047 15.7412C22.6046 18.0919 20.6986 19.9979 18.3479 19.998C15.9971 19.998 14.0912 18.092 14.0911 15.7412C14.0911 14.1667 14.9461 12.792 16.217 12.0557L15.9387 11.3076L12.6506 16.2383C12.4374 16.5578 12.0788 16.7499 11.6946 16.75H9.78735C9.33419 18.6136 7.65558 19.9979 5.65259 19.998C3.30181 19.998 1.39588 18.092 1.39575 15.7412C1.39575 13.3904 3.30173 11.4844 5.65259 11.4844C6.19132 11.4844 6.70651 11.585 7.18091 11.7676L8.51489 9.81055L7.40063 6.89844H5.68481V5.39844H10.3489L11.1116 6.14844ZM5.65259 12.9844C4.13016 12.9844 2.89575 14.2188 2.89575 15.7412C2.89588 17.2635 4.13024 18.498 5.65259 18.498C6.81845 18.4979 7.81319 17.7728 8.21606 16.75H5.96216C5.03839 16.75 4.49083 15.7156 5.01099 14.9521L6.2981 13.0625C6.09089 13.0127 5.87505 12.9844 5.65259 12.9844ZM18.1663 12.9932L19.2395 15.8799L17.8333 16.4033L16.7522 13.4951C16.0501 13.9948 15.5911 14.8138 15.5911 15.7412C15.5912 17.2635 16.8256 18.498 18.3479 18.498C19.8701 18.4979 21.1046 17.2635 21.1047 15.7412C21.1047 14.2189 19.8702 12.9845 18.3479 12.9844C18.2869 12.9844 18.2263 12.9893 18.1663 12.9932ZM6.62329 15.25H8.36255C8.26175 14.6899 7.99401 14.1885 7.60962 13.8008L6.62329 15.25ZM8.46411 12.5469C9.23398 13.2251 9.7568 14.1764 9.88013 15.25H10.6125C10.5883 15.2107 10.5672 15.1687 10.55 15.124L9.16821 11.5146L8.46411 12.5469ZM11.9504 14.585L14.509 10.75H10.4817L11.9504 14.585Z"})}))));export{H as BicycleFilledIcon};
+//# sourceMappingURL=BicycleFilledIcon.js.map

package/components/icon/filled/BicycleFilledIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BicycleFilledIcon.js","sources":["../../../../src/components/icon/filled/BicycleFilledIcon.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { SvgIcon, SvgIconProps } from '@mui/material';\n\n/**\n * Flow brand exclusive icon\n */\nexport const BicycleFilledIcon: React.FC<SvgIconProps> = forwardRef((props, ref) => {\n  return (\n    <SvgIcon viewBox=\"2 2 20 20\" ref={ref} {...props}>\n      <path d=\"M11.1116 6.14844L10.3489 6.89844H9.00708L9.90747 9.25H15.1741L14.4856 7.39648L14.1106 6.40625H17.7991C18.4569 6.4063 19.0226 6.58418 19.4358 6.94238C19.8526 7.30376 20.0501 7.79541 20.053 8.28027C20.0584 9.2288 19.311 10.1629 18.135 10.1631H17.9436L17.385 8.66309H18.135C18.4175 8.66294 18.554 8.50801 18.553 8.28906C18.5519 7.88254 18.1348 7.90624 17.7991 7.90625H16.2747L17.6272 11.5459C17.8614 11.506 18.1023 11.4844 18.3479 11.4844C20.6986 11.4845 22.6047 13.3904 22.6047 15.7412C22.6046 18.0919 20.6986 19.9979 18.3479 19.998C15.9971 19.998 14.0912 18.092 14.0911 15.7412C14.0911 14.1667 14.9461 12.792 16.217 12.0557L15.9387 11.3076L12.6506 16.2383C12.4374 16.5578 12.0788 16.7499 11.6946 16.75H9.78735C9.33419 18.6136 7.65558 19.9979 5.65259 19.998C3.30181 19.998 1.39588 18.092 1.39575 15.7412C1.39575 13.3904 3.30173 11.4844 5.65259 11.4844C6.19132 11.4844 6.70651 11.585 7.18091 11.7676L8.51489 9.81055L7.40063 6.89844H5.68481V5.39844H10.3489L11.1116 6.14844ZM5.65259 12.9844C4.13016 12.9844 2.89575 14.2188 2.89575 15.7412C2.89588 17.2635 4.13024 18.498 5.65259 18.498C6.81845 18.4979 7.81319 17.7728 8.21606 16.75H5.96216C5.03839 16.75 4.49083 15.7156 5.01099 14.9521L6.2981 13.0625C6.09089 13.0127 5.87505 12.9844 5.65259 12.9844ZM18.1663 12.9932L19.2395 15.8799L17.8333 16.4033L16.7522 13.4951C16.0501 13.9948 15.5911 14.8138 15.5911 15.7412C15.5912 17.2635 16.8256 18.498 18.3479 18.498C19.8701 18.4979 21.1046 17.2635 21.1047 15.7412C21.1047 14.2189 19.8702 12.9845 18.3479 12.9844C18.2869 12.9844 18.2263 12.9893 18.1663 12.9932ZM6.62329 15.25H8.36255C8.26175 14.6899 7.99401 14.1885 7.60962 13.8008L6.62329 15.25ZM8.46411 12.5469C9.23398 13.2251 9.7568 14.1764 9.88013 15.25H10.6125C10.5883 15.2107 10.5672 15.1687 10.55 15.124L9.16821 11.5146L8.46411 12.5469ZM11.9504 14.585L14.509 10.75H10.4817L11.9504 14.585Z\" />\n    </SvgIcon>\n  );\n});\n"],"names":["BicycleFilledIcon","forwardRef","props","ref","_jsx","SvgIcon","Object","assign","viewBox","d"],"mappings":"mHAMa,MAAAA,EAA4CC,GAAW,CAACC,EAAOC,IAExEC,EAACC,EAAOC,OAAAC,OAAA,CAACC,QAAQ,YAAYL,IAAKA,GAASD,YACzCE,EAAM,OAAA,CAAAK,EAAE"}

package/components/icon/filled/BoltDischargeFilledIcon.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { SvgIconProps } from '@mui/material';
+/**
+ * Flow brand exclusive icon
+ */
+export declare const BoltDischargeFilledIcon: React.FC<SvgIconProps>;

package/components/icon/filled/BoltDischargeFilledIcon.js

@@ -0,0 +1,2 @@
+import{jsx as L}from"react/jsx-runtime";import{forwardRef as r}from"react";import{SvgIcon as t}from"@mui/material";const e=r(((r,e)=>L(t,Object.assign({viewBox:"2 2 20 20",ref:e},r,{children:L("path",{d:"M18.9531 19.2656L21.0869 17.1084L21.2637 16.9297L21.4414 17.1074L22.0664 17.7334L22.2432 17.9102L18.3721 21.7812L18.1953 21.959L18.0186 21.7812L14.3232 18.0869L14.1465 17.9102L15.127 16.9297L15.3037 17.1084L17.4365 19.2656V13.75H18.9531V19.2656ZM10.0596 10.7998H16.5596L7.36035 21.2803H6.13965L8.01953 13.1406H1.5L10.7197 2.66016H11.9404L10.0596 10.7998Z"})}))));export{e as BoltDischargeFilledIcon};
+//# sourceMappingURL=BoltDischargeFilledIcon.js.map

package/components/icon/filled/BoltDischargeFilledIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BoltDischargeFilledIcon.js","sources":["../../../../src/components/icon/filled/BoltDischargeFilledIcon.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { SvgIcon, SvgIconProps } from '@mui/material';\n\n/**\n * Flow brand exclusive icon\n */\nexport const BoltDischargeFilledIcon: React.FC<SvgIconProps> = forwardRef((props, ref) => {\n  return (\n    <SvgIcon viewBox=\"2 2 20 20\" ref={ref} {...props}>\n      <path d=\"M18.9531 19.2656L21.0869 17.1084L21.2637 16.9297L21.4414 17.1074L22.0664 17.7334L22.2432 17.9102L18.3721 21.7812L18.1953 21.959L18.0186 21.7812L14.3232 18.0869L14.1465 17.9102L15.127 16.9297L15.3037 17.1084L17.4365 19.2656V13.75H18.9531V19.2656ZM10.0596 10.7998H16.5596L7.36035 21.2803H6.13965L8.01953 13.1406H1.5L10.7197 2.66016H11.9404L10.0596 10.7998Z\" />\n    </SvgIcon>\n  );\n});\n"],"names":["BoltDischargeFilledIcon","forwardRef","props","ref","_jsx","SvgIcon","Object","assign","viewBox","d"],"mappings":"mHAMa,MAAAA,EAAkDC,GAAW,CAACC,EAAOC,IAE9EC,EAACC,EAAOC,OAAAC,OAAA,CAACC,QAAQ,YAAYL,IAAKA,GAASD,YACzCE,EAAM,OAAA,CAAAK,EAAE"}

package/components/icon/filled/BoltOffFilledIcon.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { SvgIconProps } from '@mui/material';
+/**
+ * Flow brand exclusive icon
+ */
+export declare const BoltOffFilledIcon: React.FC<SvgIconProps>;

package/components/icon/filled/BoltOffFilledIcon.js

@@ -0,0 +1,2 @@
+import{jsx as r}from"react/jsx-runtime";import{forwardRef as L}from"react";import{SvgIcon as t}from"@mui/material";const e=L(((L,e)=>r(t,Object.assign({viewBox:"2 2 20 20",ref:e},L,{children:r("path",{d:"M22.0452 3.03613L14.2825 10.7988H14.2991L10.6985 14.3984L10.7024 14.3779L2.96997 22.1113L1.69751 20.8389L9.39673 13.1396H4.46997L13.6897 2.65918H14.9104L13.4172 9.11816L20.7727 1.76367L22.0452 3.03613ZM10.3303 21.2793H9.10962L9.93286 17.71L16.845 10.7988H19.5295L10.3303 21.2793Z"})}))));export{e as BoltOffFilledIcon};
+//# sourceMappingURL=BoltOffFilledIcon.js.map

package/components/icon/filled/BoltOffFilledIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BoltOffFilledIcon.js","sources":["../../../../src/components/icon/filled/BoltOffFilledIcon.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { SvgIcon, SvgIconProps } from '@mui/material';\n\n/**\n * Flow brand exclusive icon\n */\nexport const BoltOffFilledIcon: React.FC<SvgIconProps> = forwardRef((props, ref) => {\n  return (\n    <SvgIcon viewBox=\"2 2 20 20\" ref={ref} {...props}>\n      <path d=\"M22.0452 3.03613L14.2825 10.7988H14.2991L10.6985 14.3984L10.7024 14.3779L2.96997 22.1113L1.69751 20.8389L9.39673 13.1396H4.46997L13.6897 2.65918H14.9104L13.4172 9.11816L20.7727 1.76367L22.0452 3.03613ZM10.3303 21.2793H9.10962L9.93286 17.71L16.845 10.7988H19.5295L10.3303 21.2793Z\" />\n    </SvgIcon>\n  );\n});\n"],"names":["BoltOffFilledIcon","forwardRef","props","ref","_jsx","SvgIcon","Object","assign","viewBox","d"],"mappings":"mHAMa,MAAAA,EAA4CC,GAAW,CAACC,EAAOC,IAExEC,EAACC,EAAOC,OAAAC,OAAA,CAACC,QAAQ,YAAYL,IAAKA,GAASD,YACzCE,EAAM,OAAA,CAAAK,EAAE"}