@skodaflow/web-library 8.1.0 → 8.3.0

package/cjs/components/header/HeaderNavigationMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"HeaderNavigationMenu.js","sources":["../../../../../src/components/header/HeaderNavigationMenu.tsx"],"sourcesContent":["import React, { FC, forwardRef, ReactNode, useRef, useState } from 'react';\nimport {\n  Menu,\n  MenuProps,\n  Collapse,\n  useMediaQuery,\n  Theme,\n  useTheme,\n  CollapseProps,\n  ClickAwayListener,\n  ClickAwayListenerProps,\n} from '@mui/material';\nimport { ChevronDownIcon } from '@/src/components/icon/stroke/ChevronDownIcon';\nimport { HeaderNavigationLink, HeaderNavigationLinkProps } from './HeaderNavigationLink';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport interface HeaderNavigationMenuProps extends HeaderNavigationLinkProps {\n  /**\n   * Content of the menu, can be provided as children as well\n   */\n  menuItems?: ReactNode;\n  /**\n   * Props applied to menu\n   */\n  menuProps?: MenuProps;\n  /**\n   * Props applied to ClickAwayListener\n   */\n  clickAwayListenerProps?: Omit<ClickAwayListenerProps, 'children'>;\n  /**\n   * Props applied to menu on mobile\n   */\n  collapseProps?: CollapseProps;\n}\n\n/**\n * HeaderNavigationLink with the integration of the menu\n */\nexport const HeaderNavigationMenu: FC<HeaderNavigationMenuProps> = forwardRef(\n  (\n    {\n      children,\n      sx,\n      label,\n      icon,\n      onClick,\n      extend,\n      menuItems,\n      menuProps,\n      collapseProps,\n      clickAwayListenerProps,\n      ...rest\n    },\n    ref,\n  ) => {\n    const buttonRef = useRef(null);\n    const [anchor, setAnchor] = useState(null);\n    const theme = useTheme();\n    const downLg = useMediaQuery<Theme>(theme.breakpoints.down('lg'));\n    const mobile = extend === undefined ? downLg : extend;\n    const { sx: collapseSx, ...restCollapse } = collapseProps ?? {};\n\n    return (\n      <>\n        <HeaderNavigationLink\n          active={!!anchor}\n          extend={extend}\n          icon={\n            icon || (\n              <ChevronDownIcon\n                sx={{\n                  // same code is applied to HeaderNavigationHero.tsx\n                  '&&&': {\n                    fontSize: extend === undefined ? { xs: '20px', lg: '14px' } : ['20px', '14px'][+!extend],\n                  },\n                  color:\n                    extend === undefined\n                      ? {\n                          xs: theme.palette.mode === 'dark' ? 'onSurface.os300' : 'onSurface.os700',\n                          lg: 'currentColor',\n                        }\n                      : [theme.palette.mode === 'dark' ? 'onSurface.os300' : 'onSurface.os700', 'currentColor'][\n                          +!extend\n                        ],\n                  transform: `rotate(${anchor ? '180' : '0'}deg)`,\n                  transition:\n                    extend === undefined\n                      ? {\n                          xs: theme.transitions.create('transform', {\n                            duration: theme.transitions.duration.shortest,\n                          }),\n                          lg: 'none',\n                        }\n                      : [\n                          theme.transitions.create('transform', {\n                            duration: theme.transitions.duration.shortest,\n                          }),\n                          'none',\n                        ][+!extend],\n                }}\n              />\n            )\n          }\n          onClick={(e) => {\n            onClick?.(e);\n            setAnchor((prev) => (!prev ? e.currentTarget : null));\n          }}\n          sx={{\n            justifyContent:\n              extend === undefined\n                ? { xs: 'space-between', lg: 'flex-start' }\n                : ['space-between', 'flex-start'][+!extend],\n            ...sx,\n          }}\n          ref={ref ?? buttonRef}\n          data-testid=\"HeaderNavigationMenu\"\n          {...rest}\n        >\n          {label}\n        </HeaderNavigationLink>\n        {mobile ? (\n          <ClickAwayListener\n            onClickAway={(e) => {\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","children","sx","label","icon","onClick","extend","menuItems","menuProps","collapseProps","clickAwayListenerProps","rest","ref","buttonRef","useRef","anchor","setAnchor","useState","theme","useTheme","downLg","useMediaQuery","breakpoints","down","mobile","undefined","collapseSx","restCollapse","_jsxs","_Fragment","_jsx","HeaderNavigationLink","active","ChevronDownIcon","fontSize","xs","lg","color","palette","mode","transform","transition","transitions","create","duration","shortest","e","prev","currentTarget","justifyContent","ClickAwayListener","onClickAway","current","contains","target","Collapse","in","getInteractiveStyle","background","fontWeight","Menu","open","anchorEl","onClose"],"mappings":"wOAsCO,MAAMA,EAAsDC,EAAAA,WACjE,EAEIC,WACAC,KACAC,QACAC,OACAC,UACAC,SACAC,YACAC,YACAC,gBACAC,4BACGC,GAELC,KAEA,MAAMC,EAAYC,EAAAA,OAAO,OAClBC,EAAQC,GAAaC,EAAAA,SAAS,MAC/BC,EAAQC,EAAAA,WACRC,EAASC,EAAAA,cAAqBH,EAAMI,YAAYC,KAAK,OACrDC,OAAoBC,IAAXnB,EAAuBc,EAASd,GACvCJ,GAAIwB,KAAeC,GAAiBlB,GAAiB,CAAA,EAE7D,OACEmB,EAAAA,KAAAC,EAAAA,SAAA,CAAA5B,SAAA,CACE6B,MAACC,EAAAA,qBAAoB,CACnBC,SAAUjB,EACVT,OAAQA,EACRF,KACEA,GACE0B,MAACG,EAAAA,gBAAe,CACd/B,GAAI,CAEF,MAAO,CACLgC,cAAqBT,IAAXnB,EAAuB,CAAE6B,GAAI,OAAQC,GAAI,QAAW,CAAC,OAAQ,UAAU9B,IAEnF+B,WACaZ,IAAXnB,EACI,CACE6B,GAA2B,SAAvBjB,EAAMoB,QAAQC,KAAkB,kBAAoB,kBACxDH,GAAI,gBAEN,CAAwB,SAAvBlB,EAAMoB,QAAQC,KAAkB,kBAAoB,kBAAmB,kBACpEjC,GAEVkC,UAAW,UAAUzB,EAAS,MAAQ,UACtC0B,gBACahB,IAAXnB,EACI,CACE6B,GAAIjB,EAAMwB,YAAYC,OAAO,YAAa,CACxCC,SAAU1B,EAAMwB,YAAYE,SAASC,WAEvCT,GAAI,QAEN,CACElB,EAAMwB,YAAYC,OAAO,YAAa,CACpCC,SAAU1B,EAAMwB,YAAYE,SAASC,WAEvC,UACEvC,MAKlBD,QAAUyC,IACRzC,IAAUyC,GACV9B,EAAW+B,GAAWA,EAAyB,KAAlBD,EAAEE,gBAEjC9C,GAAI,CACF+C,oBACaxB,IAAXnB,EACI,CAAE6B,GAAI,gBAAiBC,GAAI,cAC3B,CAAC,gBAAiB,gBAAgB9B,MACrCJ,GAELU,IAAKA,GAAOC,EAAS,cACT,0BACRF,EAAIV,SAEPE,IAEFqB,EACCM,EAAAA,IAACoB,EAAAA,kBAAiB,CAChBC,YAAcL,MACTlC,GAA8CC,IAAYuC,SAASC,SAASP,GAAGQ,SAChFtC,EAAU,UAEVN,EAAsBT,SAE1B6B,EAAAA,IAACyB,WAAQ,CACPC,KAAMzC,EACNb,GAAI,CAEF,sBAAuB,IAClBuD,sBACD,CACEC,WAAY,OACZC,WAAY,MACZtB,MAA8B,SAAvBnB,EAAMoB,QAAQC,KAAkB,kBAAoB,mBAE7D,CACEmB,WAAY,OACZC,WAAY,MACZtB,MAAO,qBAIVX,MAEDC,WAEH1B,GAAYM,MAIjBuB,EAAAA,IAAC8B,EAAAA,KAAI,CAACC,OAAQ9C,EAAQ+C,SAAU/C,EAAQgD,QAAS,IAAM/C,EAAU,SAAWR,EAASP,SAClFA,GAAYM"}
+{"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  MenuList,\n  MenuProps,\n  Collapse,\n  useMediaQuery,\n  Theme,\n  useTheme,\n  CollapseProps,\n  ClickAwayListener,\n  ClickAwayListenerProps,\n} from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { ChevronDownIcon } from '@/src/components/icon/stroke/ChevronDownIcon';\nimport { HeaderNavigationLink, HeaderNavigationLinkProps } from './HeaderNavigationLink';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport interface HeaderNavigationMenuProps extends HeaderNavigationLinkProps {\n  /**\n   * Content of the menu, can be provided as children as well\n   */\n  menuItems?: ReactNode;\n  /**\n   * Props applied to menu\n   */\n  menuProps?: MenuProps;\n  /**\n   * Props applied to ClickAwayListener\n   */\n  clickAwayListenerProps?: Omit<ClickAwayListenerProps, 'children'>;\n  /**\n   * Props applied to menu on mobile\n   */\n  collapseProps?: CollapseProps;\n}\n\n/**\n * HeaderNavigationLink with the integration of the menu\n */\nexport const HeaderNavigationMenu: FC<HeaderNavigationMenuProps> = forwardRef(\n  (\n    {\n      children,\n      sx,\n      label,\n      icon,\n      onClick,\n      extend,\n      menuItems,\n      menuProps,\n      collapseProps,\n      clickAwayListenerProps,\n      ...rest\n    },\n    ref,\n  ) => {\n    const buttonRef = useRef(null);\n    const [anchor, setAnchor] = useState(null);\n    const theme = useTheme();\n    const downLg = useMediaQuery<Theme>(theme.breakpoints.down('lg'));\n    const mobile = extend === undefined ? downLg : extend;\n    const { sx: collapseSx, ...restCollapse } = collapseProps ?? {};\n\n    return (\n      <>\n        <HeaderNavigationLink\n          active={!!anchor}\n          extend={extend}\n          icon={\n            icon || (\n              <ChevronDownIcon\n                sx={{\n                  // same code is applied to HeaderNavigationHero.tsx\n                  '&&&': {\n                    fontSize: extend === undefined ? { xs: '20px', lg: '14px' } : ['20px', '14px'][+!extend],\n                  },\n                  color:\n                    extend === undefined\n                      ? {\n                          xs: theme.palette.mode === 'dark' ? 'onSurface.os300' : 'onSurface.os700',\n                          lg: 'currentColor',\n                        }\n                      : [theme.palette.mode === 'dark' ? 'onSurface.os300' : 'onSurface.os700', 'currentColor'][\n                          +!extend\n                        ],\n                  transform: `rotate(${anchor ? '180' : '0'}deg)`,\n                  transition:\n                    extend === undefined\n                      ? {\n                          xs: theme.transitions.create('transform', {\n                            duration: theme.transitions.duration.shortest,\n                          }),\n                          lg: 'none',\n                        }\n                      : [\n                          theme.transitions.create('transform', {\n                            duration: theme.transitions.duration.shortest,\n                          }),\n                          'none',\n                        ][+!extend],\n                }}\n              />\n            )\n          }\n          onClick={(e) => {\n            onClick?.(e);\n            setAnchor((prev) => (!prev ? e.currentTarget : null));\n          }}\n          sx={sxOverride(\n            {\n              justifyContent:\n                extend === undefined\n                  ? { xs: 'space-between', lg: 'flex-start' }\n                  : ['space-between', 'flex-start'][+!extend],\n            },\n            sx,\n          )}\n          ref={ref ?? buttonRef}\n          data-testid=\"HeaderNavigationMenu\"\n          {...rest}\n        >\n          {label}\n        </HeaderNavigationLink>\n        {mobile ? (\n          <ClickAwayListener\n            onClickAway={(e) => {\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={sxOverride(\n                {\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                },\n                collapseSx,\n              )}\n              {...restCollapse}\n            >\n              <MenuList>\n                {children || menuItems}\n              </MenuList>\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","children","sx","label","icon","onClick","extend","menuItems","menuProps","collapseProps","clickAwayListenerProps","rest","ref","buttonRef","useRef","anchor","setAnchor","useState","theme","useTheme","downLg","useMediaQuery","breakpoints","down","mobile","undefined","collapseSx","restCollapse","_jsxs","_Fragment","_jsx","HeaderNavigationLink","active","ChevronDownIcon","fontSize","xs","lg","color","palette","mode","transform","transition","transitions","create","duration","shortest","e","prev","currentTarget","sxOverride","justifyContent","ClickAwayListener","onClickAway","current","contains","target","Collapse","in","getInteractiveStyle","background","fontWeight","MenuList","Menu","open","anchorEl","onClose"],"mappings":"0RAwCO,MAAMA,EAAsDC,EAAAA,WACjE,EAEIC,WACAC,KACAC,QACAC,OACAC,UACAC,SACAC,YACAC,YACAC,gBACAC,4BACGC,GAELC,KAEA,MAAMC,EAAYC,EAAAA,OAAO,OAClBC,EAAQC,GAAaC,EAAAA,SAAS,MAC/BC,EAAQC,EAAAA,WACRC,EAASC,EAAAA,cAAqBH,EAAMI,YAAYC,KAAK,OACrDC,OAAoBC,IAAXnB,EAAuBc,EAASd,GACvCJ,GAAIwB,KAAeC,GAAiBlB,GAAiB,CAAA,EAE7D,OACEmB,EAAAA,KAAAC,EAAAA,SAAA,CAAA5B,SAAA,CACE6B,MAACC,EAAAA,qBAAoB,CACnBC,SAAUjB,EACVT,OAAQA,EACRF,KACEA,GACE0B,MAACG,EAAAA,gBAAe,CACd/B,GAAI,CAEF,MAAO,CACLgC,cAAqBT,IAAXnB,EAAuB,CAAE6B,GAAI,OAAQC,GAAI,QAAW,CAAC,OAAQ,UAAU9B,IAEnF+B,WACaZ,IAAXnB,EACI,CACE6B,GAA2B,SAAvBjB,EAAMoB,QAAQC,KAAkB,kBAAoB,kBACxDH,GAAI,gBAEN,CAAwB,SAAvBlB,EAAMoB,QAAQC,KAAkB,kBAAoB,kBAAmB,kBACpEjC,GAEVkC,UAAW,UAAUzB,EAAS,MAAQ,UACtC0B,gBACahB,IAAXnB,EACI,CACE6B,GAAIjB,EAAMwB,YAAYC,OAAO,YAAa,CACxCC,SAAU1B,EAAMwB,YAAYE,SAASC,WAEvCT,GAAI,QAEN,CACElB,EAAMwB,YAAYC,OAAO,YAAa,CACpCC,SAAU1B,EAAMwB,YAAYE,SAASC,WAEvC,UACEvC,MAKlBD,QAAUyC,IACRzC,IAAUyC,GACV9B,EAAW+B,GAAWA,EAAyB,KAAlBD,EAAEE,gBAEjC9C,GAAI+C,aACF,CACEC,oBACazB,IAAXnB,EACI,CAAE6B,GAAI,gBAAiBC,GAAI,cAC3B,CAAC,gBAAiB,gBAAgB9B,IAE1CJ,GAEFU,IAAKA,GAAOC,EAAS,cACT,0BACRF,EAAIV,SAEPE,IAEFqB,EACCM,EAAAA,IAACqB,EAAAA,kBAAiB,CAChBC,YAAcN,MACTlC,GAA8CC,IAAYwC,SAASC,SAASR,GAAGS,SAChFvC,EAAU,UAEVN,EAAsBT,SAE1B6B,MAAC0B,EAAAA,SAAQ,CACPC,KAAM1C,EACNb,GAAI+C,EAAAA,WACF,CAEE,sBAAuB,IAClBS,sBACD,CACEC,WAAY,OACZC,WAAY,MACZvB,MAA8B,SAAvBnB,EAAMoB,QAAQC,KAAkB,kBAAoB,mBAE7D,CACEoB,WAAY,OACZC,WAAY,MACZvB,MAAO,mBAKfX,MAEEC,WAEJG,EAAAA,IAAC+B,EAAAA,SAAQ,CAAA5D,SACNA,GAAYM,QAKnBuB,EAAAA,IAACgC,OAAI,CAACC,OAAQhD,EAAQiD,SAAUjD,EAAQkD,QAAS,IAAMjD,EAAU,SAAWR,EAASP,SAClFA,GAAYM"}

package/cjs/components/hotspotCard/HotspotCard.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("react"),o=require("@mui/material"),r=require("../icon/stroke/PlusIcon.js");const s=t.forwardRef(({sx:s,children:i,top:a,left:n,bottom:d,right:l,onBackground:p=!1,center:x=!1,open:c,setOpen:u,fadeProps:m={},popperProps:h={},clickAwayListenerProps:f={},icon:b,iconProps:v={},insideIcon:C,insideIconProps:g={},insideIconButtonProps:P={},wrapperProps:w={},cardProps:I={},...k},j)=>{const{sx:z,...B}=I,{sx:M,...y}=h,{sx:q,...S}=v,{sx:A,...O}=g,{sx:R,...W}=P,H=o.useTheme(),L=o.useMediaQuery(H.breakpoints.down("md")),T=t.useRef(null),E=t.useRef(null),[F,Q]=t.useState(c??!1),[D,G]=t.useState("left-start"),J=c??F,K=t.useCallback(void 0!==c?()=>u(!c):()=>Q(e=>!e),[c,u]),N=t.useCallback(void 0!==c?()=>u(!1):()=>Q(!1),[c,u]);return e.jsx(o.ClickAwayListener,{onClickAway:N,...f,children:e.jsxs(o.Box,{...w,children:[e.jsx(o.IconButton,{ref:j??T,onClick:K,"aria-label":"Open or Close the card",...J&&{"aria-controls":"hotspot-card"},size:"small",color:"surface",sx:{position:"absolute",zIndex:e=>e.zIndex.hotspotCard,...void 0!==a&&{top:a,...x&&{mt:"-16px"}},...void 0!==n&&{left:n,...x&&{ml:"-16px"}},...void 0!==d&&{bottom:d,...x&&{mb:"-16px"}},...void 0!==l&&{right:l,...x&&{mr:"-16px"}},...void 0===a&&void 0===n&&void 0===d&&void 0===l&&{top:"0%",left:"0%",...x&&{mt:"-16px",ml:"-16px"}},...s},...k,children:b||e.jsx(r.PlusIcon,{sx:{transform:J?"rotate(45deg)":"rotate(0deg)",transition:"transform .3s ease",...q},...S})}),e.jsx(o.Popper,{open:J,anchorEl:L?null:(j??T)?.current,transition:!0,placement:"left-start",disablePortal:!0,ref:E,modifiers:[{name:"flip",enabled:!0,options:{fallbackPlacements:["right-start"]}},{name:"preventOverflow",enabled:!0,options:{boundary:"viewport"}},{name:"updatePlacement",enabled:!0,phase:"afterWrite",fn:({state:e})=>{G(e.placement)}}],sx:{position:"fixed",top:{xs:"0",md:"auto"},left:{xs:"0",md:"auto"},width:{xs:"100%",md:"400px"},height:{xs:"100%",md:"auto"},minHeight:{xs:"100vh",md:"auto"},zIndex:e=>e.zIndex.modal,...M},...y,children:({TransitionProps:t})=>e.jsx(o.Fade,{...t,timeout:350,...m,children:e.jsxs(o.Card,{id:"hotspot-card",sx:{boxShadow:e=>e.flowShadows.xl,position:"relative",width:{xs:"100%",md:"inherit"},height:{xs:"100%",md:"auto"},top:{xs:"0",md:"-9px"},left:D.startsWith("right")?{xs:"0",md:"-41px"}:void 0,right:D.startsWith("left")?{xs:"0",md:"-41px"}:void 0,"&:after":{border:"none"},"& > .MuiBox-root":{overflow:"auto"},"& .MuiCardMedia-root":{height:{xs:"300px",md:"232px"}},"& .MuiCardContent-root, &.MuiCardContent-root:last-child":{padding:3},...z},...B,children:[e.jsx(o.IconButton,{onClick:K,"aria-label":"Close the card",size:"small",color:p?"inherit":"surface",sx:{position:"absolute",zIndex:e=>e.zIndex.hotspotCard,top:"8px",right:"8px",...R},...W,children:C||e.jsx(r.PlusIcon,{sx:{transform:J?"rotate(45deg)":"rotate(0deg)",transition:"transform .3s ease",...A},...O})}),i]})})},L?"popper-mobile":"popper-desktop")]})})});exports.HotspotCard=s;
+"use strict";var e=require("react/jsx-runtime"),t=require("react"),o=require("@mui/material"),r=require("../../utils/sxOverride/sxOverride.js"),s=require("../icon/stroke/PlusIcon.js");const i=t.forwardRef(({sx:i,children:a,top:n,left:d,bottom:l,right:p,onBackground:x=!1,center:c=!1,open:u,setOpen:m,fadeProps:h={},popperProps:f={},clickAwayListenerProps:v={},icon:b,iconProps:C={},insideIcon:g,insideIconProps:P={},insideIconButtonProps:w={},wrapperProps:I={},cardProps:j={},...k},O)=>{const{sx:z,...B}=j,{sx:M,...q}=f,{sx:y,...S}=C,{sx:A,...R}=P,{sx:W,...H}=w,L=o.useTheme(),T=o.useMediaQuery(L.breakpoints.down("md")),E=t.useRef(null),F=t.useRef(null),[Q,D]=t.useState(u??!1),[G,J]=t.useState("left-start"),K=u??Q,N=t.useCallback(void 0!==u?()=>m(!u):()=>D(e=>!e),[u,m]),U=t.useCallback(void 0!==u?()=>m(!1):()=>D(!1),[u,m]);return e.jsx(o.ClickAwayListener,{onClickAway:U,...v,children:e.jsxs(o.Box,{...I,children:[e.jsx(o.IconButton,{ref:O??E,onClick:N,"aria-label":"Open or Close the card",...K&&{"aria-controls":"hotspot-card"},size:"small",color:"surface",sx:r.sxOverride({position:"absolute",zIndex:e=>e.zIndex.hotspotCard,...void 0!==n&&{top:n,...c&&{mt:"-16px"}},...void 0!==d&&{left:d,...c&&{ml:"-16px"}},...void 0!==l&&{bottom:l,...c&&{mb:"-16px"}},...void 0!==p&&{right:p,...c&&{mr:"-16px"}},...void 0===n&&void 0===d&&void 0===l&&void 0===p&&{top:"0%",left:"0%",...c&&{mt:"-16px",ml:"-16px"}}},i),...k,children:b||e.jsx(s.PlusIcon,{sx:r.sxOverride({transform:K?"rotate(45deg)":"rotate(0deg)",transition:"transform .3s ease"},y),...S})}),e.jsx(o.Popper,{open:K,anchorEl:T?null:(O??E)?.current,transition:!0,placement:"left-start",disablePortal:!0,ref:F,modifiers:[{name:"flip",enabled:!0,options:{fallbackPlacements:["right-start"]}},{name:"preventOverflow",enabled:!0,options:{boundary:"viewport"}},{name:"updatePlacement",enabled:!0,phase:"afterWrite",fn:({state:e})=>{J(e.placement)}}],sx:r.sxOverride({position:"fixed",top:{xs:"0",md:"auto"},left:{xs:"0",md:"auto"},width:{xs:"100%",md:"400px"},height:{xs:"100%",md:"auto"},minHeight:{xs:"100vh",md:"auto"},zIndex:e=>e.zIndex.modal},M),...q,children:({TransitionProps:t})=>e.jsx(o.Fade,{...t,timeout:350,...h,children:e.jsxs(o.Card,{id:"hotspot-card",sx:r.sxOverride({boxShadow:e=>e.flowShadows.xl,position:"relative",width:{xs:"100%",md:"inherit"},height:{xs:"100%",md:"auto"},top:{xs:"0",md:"-9px"},left:G.startsWith("right")?{xs:"0",md:"-41px"}:void 0,right:G.startsWith("left")?{xs:"0",md:"-41px"}:void 0,"&:after":{border:"none"},"& > .MuiBox-root":{overflow:"auto"},"& .MuiCardMedia-root":{height:{xs:"300px",md:"232px"}},"& .MuiCardContent-root, &.MuiCardContent-root:last-child":{padding:3}},z),...B,children:[e.jsx(o.IconButton,{onClick:N,"aria-label":"Close the card",size:"small",color:x?"inherit":"surface",sx:r.sxOverride({position:"absolute",zIndex:e=>e.zIndex.hotspotCard,top:"8px",right:"8px"},W),...H,children:g||e.jsx(s.PlusIcon,{sx:r.sxOverride({transform:K?"rotate(45deg)":"rotate(0deg)",transition:"transform .3s ease"},A),...R})}),a]})})},T?"popper-mobile":"popper-desktop")]})})});exports.HotspotCard=i;
 //# sourceMappingURL=HotspotCard.js.map

package/cjs/components/hotspotCard/HotspotCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"HotspotCard.js","sources":["../../../../../src/components/hotspotCard/HotspotCard.tsx"],"sourcesContent":["import React, { forwardRef, ElementType, ReactNode, useRef, useState, useCallback } from 'react';\nimport {\n  Box,\n  BoxProps,\n  Card,\n  CardProps,\n  ClickAwayListener,\n  ClickAwayListenerProps,\n  Fade,\n  FadeProps,\n  IconButton,\n  IconButtonProps,\n  Popper,\n  PopperProps,\n  useMediaQuery,\n  useTheme,\n  SvgIconProps,\n} from '@mui/material';\nimport { PlusIcon } from '@/src/components/icon/stroke/PlusIcon';\nimport { ResponsiveStyleValue } from '@mui/system';\n\nexport interface HotspotCardProps extends Omit<IconButtonProps, 'color' | 'size'> {\n  /**\n   * top position of hotspot card\n   */\n  top?: ResponsiveStyleValue<number | string>;\n  /**\n   * left position of hotspot card\n   */\n  left?: ResponsiveStyleValue<number | string>;\n  /**\n   * bottom position of hotspot card\n   */\n  bottom?: ResponsiveStyleValue<number | string>;\n  /**\n   * right position of hotspot card\n   */\n  right?: ResponsiveStyleValue<number | string>;\n  /**\n   * Boolean that defines different design whether a HotspotCardIconButton is placed on background inside the Card, (instead of image)\n   */\n  onBackground?: boolean;\n  /**\n   * Make sure to center IconButton, helpful with left or right properties set to 50%\n   */\n  center?: boolean;\n  /**\n   * Boolean that defines whether a HotspotCard is opened.\n   *\n   * @see setOpen\n   */\n  open?: boolean;\n  /**\n   * Function that can be used to control a state of card popup\n   *\n   * @param open new open value\n   * @see open\n   */\n  setOpen?: (open: boolean) => void;\n  /**\n   * Properties that will be passed to Fade component\n   *\n   * @see Fade\n   */\n  fadeProps?: Omit<FadeProps, 'children'>;\n  /**\n   * Properties that will be passed to Popper component\n   *\n   * @see Popper\n   */\n  popperProps?: Omit<PopperProps, 'open'>;\n  /**\n   * Properties applied to ClickAwayListener\n   */\n  clickAwayListenerProps?: Omit<ClickAwayListenerProps, 'children'>;\n  /**\n   * Custom icon component to use instead of the default PlusIcon\n   */\n  icon?: ReactNode;\n  /**\n   * Properties that will be passed to the icon component\n   */\n  iconProps?: SvgIconProps;\n  /**\n   * Custom icon component to use instead of the default PlusIcon\n   */\n  insideIcon?: ReactNode;\n  /**\n   * Properties for a cose icon inside HotspotCard\n   */\n  insideIconProps?: SvgIconProps;\n  /**\n   * Properties for a IconButton inside HotspotCard\n   */\n  insideIconButtonProps?: IconButtonProps<ElementType>;\n  /**\n   * Properties for a Box element that wraps button and popper\n   */\n  wrapperProps?: BoxProps<ElementType>;\n  /**\n   * Properties for Card inside the Popper element.\n   */\n  cardProps?: CardProps<ElementType>;\n}\n\n/**\n * A card component that is toggled on and off with IconButton.\n * The card is fullscreen on mobile-size devices.\n */\nexport const HotspotCard: React.FC<HotspotCardProps> = forwardRef(\n  (\n    {\n      sx,\n      children,\n      top,\n      left,\n      bottom,\n      right,\n      onBackground = false,\n      center = false,\n      open,\n      setOpen,\n      fadeProps = {},\n      popperProps = {},\n      clickAwayListenerProps = {},\n      icon,\n      iconProps = {},\n      insideIcon,\n      insideIconProps = {},\n      insideIconButtonProps = {},\n      wrapperProps = {},\n      cardProps = {},\n      ...restProps\n    },\n    ref,\n  ) => {\n    const { sx: cardSx, ...restCard } = cardProps;\n    const { sx: popperSx, ...restPopperProps } = popperProps;\n    const { sx: iconSx, ...restIconProps } = iconProps;\n    const { sx: insideIconSx, ...restInsideIconProps } = insideIconProps;\n    const { sx: insideIconButtonSx, ...restInsideIconButtonProps } = insideIconButtonProps;\n\n    const FWLTheme = useTheme();\n    const isSmallScreen = useMediaQuery(FWLTheme.breakpoints.down('md'));\n    const btnRef = useRef(null);\n    const popperRef = useRef<HTMLDivElement>(null);\n    const [_open, _setOpen] = useState(open ?? false);\n    const [currentPlacement, setCurrentPlacement] = useState<string>('left-start');\n\n    const isOpen = open ?? _open;\n    const handleClick = useCallback(open !== undefined ? () => setOpen(!open) : () => _setOpen((prev) => !prev), [\n      open,\n      setOpen,\n    ]);\n    const handleClickAway = useCallback(open !== undefined ? () => setOpen(false) : () => _setOpen(false), [\n      open,\n      setOpen,\n    ]);\n\n    return (\n      <ClickAwayListener onClickAway={handleClickAway} {...clickAwayListenerProps}>\n        <Box {...wrapperProps}>\n          <IconButton\n            ref={ref ?? btnRef}\n            onClick={handleClick}\n            aria-label=\"Open or Close the card\"\n            {...(isOpen && { ['aria-controls']: 'hotspot-card' })}\n            size=\"small\"\n            color=\"surface\"\n            sx={{\n              position: 'absolute',\n              zIndex: (theme) => theme.zIndex.hotspotCard,\n              ...(top !== undefined && { top: top, ...(center && { mt: '-16px' }) }),\n              ...(left !== undefined && { left: left, ...(center && { ml: '-16px' }) }),\n              ...(bottom !== undefined && { bottom: bottom, ...(center && { mb: '-16px' }) }),\n              ...(right !== undefined && { right: right, ...(center && { mr: '-16px' }) }),\n              // Fallback to top-left if no position is specified\n              ...(top === undefined &&\n                left === undefined &&\n                bottom === undefined &&\n                right === undefined && {\n                  top: '0%',\n                  left: '0%',\n                  ...(center && { mt: '-16px', ml: '-16px' }),\n                }),\n              ...sx,\n            }}\n            {...restProps}\n          >\n            {icon || (\n              <PlusIcon\n                sx={{\n                  transform: isOpen ? 'rotate(45deg)' : 'rotate(0deg)',\n                  transition: 'transform .3s ease',\n                  ...iconSx,\n                }}\n                {...restIconProps}\n              />\n            )}\n          </IconButton>\n          <Popper\n            key={isSmallScreen ? 'popper-mobile' : 'popper-desktop'}\n            open={isOpen}\n            anchorEl={isSmallScreen ? null : ((ref as React.RefObject<HTMLButtonElement>) ?? btnRef)?.current}\n            transition\n            placement=\"left-start\"\n            disablePortal\n            ref={popperRef}\n            modifiers={[\n              {\n                name: 'flip',\n                enabled: true,\n                options: {\n                  fallbackPlacements: ['right-start'],\n                },\n              },\n              {\n                name: 'preventOverflow',\n                enabled: true,\n                options: {\n                  boundary: 'viewport',\n                },\n              },\n              {\n                name: 'updatePlacement',\n                enabled: true,\n                phase: 'afterWrite',\n                fn: ({ state }) => {\n                  setCurrentPlacement(state.placement);\n                },\n              },\n            ]}\n            sx={{\n              position: 'fixed',\n              top: { xs: '0', md: 'auto' },\n              left: { xs: '0', md: 'auto' },\n              width: { xs: '100%', md: '400px' },\n              height: { xs: '100%', md: 'auto' },\n              minHeight: { xs: '100vh', md: 'auto' },\n              zIndex: (theme) => theme.zIndex.modal,\n              ...popperSx,\n            }}\n            {...restPopperProps}\n          >\n            {({ TransitionProps }) => (\n              <Fade {...TransitionProps} timeout={350} {...fadeProps}>\n                <Card\n                  id=\"hotspot-card\"\n                  sx={{\n                    boxShadow: (theme) => theme.flowShadows.xl,\n                    position: 'relative',\n                    width: { xs: '100%', md: 'inherit' },\n                    height: { xs: '100%', md: 'auto' },\n                    top: { xs: '0', md: '-9px' },\n                    left: currentPlacement.startsWith('right') ? { xs: '0', md: '-41px' } : undefined,\n                    right: currentPlacement.startsWith('left') ? { xs: '0', md: '-41px' } : undefined,\n                    // remove border\n                    '&:after': {\n                      border: 'none',\n                    },\n                    // card wrapper\n                    '& > .MuiBox-root': {\n                      overflow: 'auto',\n                    },\n                    // media in card\n                    '& .MuiCardMedia-root': {\n                      height: {\n                        xs: '300px',\n                        md: '232px',\n                      },\n                    },\n                    // content\n                    '& .MuiCardContent-root, &.MuiCardContent-root:last-child': {\n                      padding: 3,\n                    },\n                    ...cardSx,\n                  }}\n                  {...restCard}\n                >\n                  <IconButton\n                    onClick={handleClick}\n                    aria-label=\"Close the card\"\n                    size=\"small\"\n                    color={onBackground ? 'inherit' : 'surface'}\n                    sx={{\n                      position: 'absolute',\n                      zIndex: (theme) => theme.zIndex.hotspotCard,\n                      top: '8px',\n                      right: '8px',\n                      ...insideIconButtonSx,\n                    }}\n                    {...restInsideIconButtonProps}\n                  >\n                    {insideIcon || (\n                      <PlusIcon\n                        sx={{\n                          transform: isOpen ? 'rotate(45deg)' : 'rotate(0deg)',\n                          transition: 'transform .3s ease',\n                          ...insideIconSx,\n                        }}\n                        {...restInsideIconProps}\n                      />\n                    )}\n                  </IconButton>\n                  {children}\n                </Card>\n              </Fade>\n            )}\n          </Popper>\n        </Box>\n      </ClickAwayListener>\n    );\n  },\n);\n"],"names":["HotspotCard","forwardRef","sx","children","top","left","bottom","right","onBackground","center","open","setOpen","fadeProps","popperProps","clickAwayListenerProps","icon","iconProps","insideIcon","insideIconProps","insideIconButtonProps","wrapperProps","cardProps","restProps","ref","cardSx","restCard","popperSx","restPopperProps","iconSx","restIconProps","insideIconSx","restInsideIconProps","insideIconButtonSx","restInsideIconButtonProps","FWLTheme","useTheme","isSmallScreen","useMediaQuery","breakpoints","down","btnRef","useRef","popperRef","_open","_setOpen","useState","currentPlacement","setCurrentPlacement","isOpen","handleClick","useCallback","undefined","prev","handleClickAway","_jsx","ClickAwayListener","onClickAway","_jsxs","Box","IconButton","onClick","size","color","position","zIndex","theme","hotspotCard","mt","ml","mb","mr","PlusIcon","transform","transition","Popper","anchorEl","current","placement","disablePortal","modifiers","name","enabled","options","fallbackPlacements","boundary","phase","fn","state","xs","md","width","height","minHeight","modal","TransitionProps","Fade","timeout","Card","id","boxShadow","flowShadows","xl","startsWith","border","overflow","padding"],"mappings":"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"}
+{"version":3,"file":"HotspotCard.js","sources":["../../../../../src/components/hotspotCard/HotspotCard.tsx"],"sourcesContent":["import React, { forwardRef, ElementType, ReactNode, useRef, useState, useCallback } from 'react';\nimport {\n  Box,\n  BoxProps,\n  Card,\n  CardProps,\n  ClickAwayListener,\n  ClickAwayListenerProps,\n  Fade,\n  FadeProps,\n  IconButton,\n  IconButtonProps,\n  Popper,\n  PopperProps,\n  useMediaQuery,\n  useTheme,\n  SvgIconProps,\n} from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { PlusIcon } from '@/src/components/icon/stroke/PlusIcon';\nimport { ResponsiveStyleValue } from '@mui/system';\n\nexport interface HotspotCardProps extends Omit<IconButtonProps, 'color' | 'size'> {\n  /**\n   * top position of hotspot card\n   */\n  top?: ResponsiveStyleValue<number | string>;\n  /**\n   * left position of hotspot card\n   */\n  left?: ResponsiveStyleValue<number | string>;\n  /**\n   * bottom position of hotspot card\n   */\n  bottom?: ResponsiveStyleValue<number | string>;\n  /**\n   * right position of hotspot card\n   */\n  right?: ResponsiveStyleValue<number | string>;\n  /**\n   * Boolean that defines different design whether a HotspotCardIconButton is placed on background inside the Card, (instead of image)\n   */\n  onBackground?: boolean;\n  /**\n   * Make sure to center IconButton, helpful with left or right properties set to 50%\n   */\n  center?: boolean;\n  /**\n   * Boolean that defines whether a HotspotCard is opened.\n   *\n   * @see setOpen\n   */\n  open?: boolean;\n  /**\n   * Function that can be used to control a state of card popup\n   *\n   * @param open new open value\n   * @see open\n   */\n  setOpen?: (open: boolean) => void;\n  /**\n   * Properties that will be passed to Fade component\n   *\n   * @see Fade\n   */\n  fadeProps?: Omit<FadeProps, 'children'>;\n  /**\n   * Properties that will be passed to Popper component\n   *\n   * @see Popper\n   */\n  popperProps?: Omit<PopperProps, 'open'>;\n  /**\n   * Properties applied to ClickAwayListener\n   */\n  clickAwayListenerProps?: Omit<ClickAwayListenerProps, 'children'>;\n  /**\n   * Custom icon component to use instead of the default PlusIcon\n   */\n  icon?: ReactNode;\n  /**\n   * Properties that will be passed to the icon component\n   */\n  iconProps?: SvgIconProps;\n  /**\n   * Custom icon component to use instead of the default PlusIcon\n   */\n  insideIcon?: ReactNode;\n  /**\n   * Properties for a cose icon inside HotspotCard\n   */\n  insideIconProps?: SvgIconProps;\n  /**\n   * Properties for a IconButton inside HotspotCard\n   */\n  insideIconButtonProps?: IconButtonProps<ElementType>;\n  /**\n   * Properties for a Box element that wraps button and popper\n   */\n  wrapperProps?: BoxProps<ElementType>;\n  /**\n   * Properties for Card inside the Popper element.\n   */\n  cardProps?: CardProps<ElementType>;\n}\n\n/**\n * A card component that is toggled on and off with IconButton.\n * The card is fullscreen on mobile-size devices.\n */\nexport const HotspotCard: React.FC<HotspotCardProps> = forwardRef(\n  (\n    {\n      sx,\n      children,\n      top,\n      left,\n      bottom,\n      right,\n      onBackground = false,\n      center = false,\n      open,\n      setOpen,\n      fadeProps = {},\n      popperProps = {},\n      clickAwayListenerProps = {},\n      icon,\n      iconProps = {},\n      insideIcon,\n      insideIconProps = {},\n      insideIconButtonProps = {},\n      wrapperProps = {},\n      cardProps = {},\n      ...restProps\n    },\n    ref,\n  ) => {\n    const { sx: cardSx, ...restCard } = cardProps;\n    const { sx: popperSx, ...restPopperProps } = popperProps;\n    const { sx: iconSx, ...restIconProps } = iconProps;\n    const { sx: insideIconSx, ...restInsideIconProps } = insideIconProps;\n    const { sx: insideIconButtonSx, ...restInsideIconButtonProps } = insideIconButtonProps;\n\n    const FWLTheme = useTheme();\n    const isSmallScreen = useMediaQuery(FWLTheme.breakpoints.down('md'));\n    const btnRef = useRef(null);\n    const popperRef = useRef<HTMLDivElement>(null);\n    const [_open, _setOpen] = useState(open ?? false);\n    const [currentPlacement, setCurrentPlacement] = useState<string>('left-start');\n\n    const isOpen = open ?? _open;\n    const handleClick = useCallback(open !== undefined ? () => setOpen(!open) : () => _setOpen((prev) => !prev), [\n      open,\n      setOpen,\n    ]);\n    const handleClickAway = useCallback(open !== undefined ? () => setOpen(false) : () => _setOpen(false), [\n      open,\n      setOpen,\n    ]);\n\n    return (\n      <ClickAwayListener onClickAway={handleClickAway} {...clickAwayListenerProps}>\n        <Box {...wrapperProps}>\n          <IconButton\n            ref={ref ?? btnRef}\n            onClick={handleClick}\n            aria-label=\"Open or Close the card\"\n            {...(isOpen && { ['aria-controls']: 'hotspot-card' })}\n            size=\"small\"\n            color=\"surface\"\n            sx={sxOverride(\n              {\n                position: 'absolute',\n                zIndex: (theme) => theme.zIndex.hotspotCard,\n                ...(top !== undefined && { top: top, ...(center && { mt: '-16px' }) }),\n                ...(left !== undefined && { left: left, ...(center && { ml: '-16px' }) }),\n                ...(bottom !== undefined && { bottom: bottom, ...(center && { mb: '-16px' }) }),\n                ...(right !== undefined && { right: right, ...(center && { mr: '-16px' }) }),\n                // Fallback to top-left if no position is specified\n                ...(top === undefined &&\n                  left === undefined &&\n                  bottom === undefined &&\n                  right === undefined && {\n                    top: '0%',\n                    left: '0%',\n                    ...(center && { mt: '-16px', ml: '-16px' }),\n                  }),\n              },\n              sx,\n            )}\n            {...restProps}\n          >\n            {icon || (\n              <PlusIcon\n                sx={sxOverride(\n                  {\n                    transform: isOpen ? 'rotate(45deg)' : 'rotate(0deg)',\n                    transition: 'transform .3s ease',\n                  },\n                  iconSx,\n                )}\n                {...restIconProps}\n              />\n            )}\n          </IconButton>\n          <Popper\n            key={isSmallScreen ? 'popper-mobile' : 'popper-desktop'}\n            open={isOpen}\n            anchorEl={isSmallScreen ? null : ((ref as React.RefObject<HTMLButtonElement>) ?? btnRef)?.current}\n            transition\n            placement=\"left-start\"\n            disablePortal\n            ref={popperRef}\n            modifiers={[\n              {\n                name: 'flip',\n                enabled: true,\n                options: {\n                  fallbackPlacements: ['right-start'],\n                },\n              },\n              {\n                name: 'preventOverflow',\n                enabled: true,\n                options: {\n                  boundary: 'viewport',\n                },\n              },\n              {\n                name: 'updatePlacement',\n                enabled: true,\n                phase: 'afterWrite',\n                fn: ({ state }) => {\n                  setCurrentPlacement(state.placement);\n                },\n              },\n            ]}\n            sx={sxOverride(\n              {\n                position: 'fixed',\n                top: { xs: '0', md: 'auto' },\n                left: { xs: '0', md: 'auto' },\n                width: { xs: '100%', md: '400px' },\n                height: { xs: '100%', md: 'auto' },\n                minHeight: { xs: '100vh', md: 'auto' },\n                zIndex: (theme) => theme.zIndex.modal,\n              },\n              popperSx,\n            )}\n            {...restPopperProps}\n          >\n            {({ TransitionProps }) => (\n              <Fade {...TransitionProps} timeout={350} {...fadeProps}>\n                <Card\n                  id=\"hotspot-card\"\n                  sx={sxOverride(\n                    {\n                      boxShadow: (theme) => theme.flowShadows.xl,\n                      position: 'relative',\n                      width: { xs: '100%', md: 'inherit' },\n                      height: { xs: '100%', md: 'auto' },\n                      top: { xs: '0', md: '-9px' },\n                      left: currentPlacement.startsWith('right') ? { xs: '0', md: '-41px' } : undefined,\n                      right: currentPlacement.startsWith('left') ? { xs: '0', md: '-41px' } : undefined,\n                      // remove border\n                      '&:after': {\n                        border: 'none',\n                      },\n                      // card wrapper\n                      '& > .MuiBox-root': {\n                        overflow: 'auto',\n                      },\n                      // media in card\n                      '& .MuiCardMedia-root': {\n                        height: {\n                          xs: '300px',\n                          md: '232px',\n                        },\n                      },\n                      // content\n                      '& .MuiCardContent-root, &.MuiCardContent-root:last-child': {\n                        padding: 3,\n                      },\n                    },\n                    cardSx,\n                  )}\n                  {...restCard}\n                >\n                  <IconButton\n                    onClick={handleClick}\n                    aria-label=\"Close the card\"\n                    size=\"small\"\n                    color={onBackground ? 'inherit' : 'surface'}\n                    sx={sxOverride(\n                      {\n                        position: 'absolute',\n                        zIndex: (theme) => theme.zIndex.hotspotCard,\n                        top: '8px',\n                        right: '8px',\n                      },\n                      insideIconButtonSx,\n                    )}\n                    {...restInsideIconButtonProps}\n                  >\n                    {insideIcon || (\n                      <PlusIcon\n                        sx={sxOverride(\n                          {\n                            transform: isOpen ? 'rotate(45deg)' : 'rotate(0deg)',\n                            transition: 'transform .3s ease',\n                          },\n                          insideIconSx,\n                        )}\n                        {...restInsideIconProps}\n                      />\n                    )}\n                  </IconButton>\n                  {children}\n                </Card>\n              </Fade>\n            )}\n          </Popper>\n        </Box>\n      </ClickAwayListener>\n    );\n  },\n);\n"],"names":["HotspotCard","forwardRef","sx","children","top","left","bottom","right","onBackground","center","open","setOpen","fadeProps","popperProps","clickAwayListenerProps","icon","iconProps","insideIcon","insideIconProps","insideIconButtonProps","wrapperProps","cardProps","restProps","ref","cardSx","restCard","popperSx","restPopperProps","iconSx","restIconProps","insideIconSx","restInsideIconProps","insideIconButtonSx","restInsideIconButtonProps","FWLTheme","useTheme","isSmallScreen","useMediaQuery","breakpoints","down","btnRef","useRef","popperRef","_open","_setOpen","useState","currentPlacement","setCurrentPlacement","isOpen","handleClick","useCallback","undefined","prev","handleClickAway","_jsx","ClickAwayListener","onClickAway","_jsxs","Box","IconButton","onClick","size","color","sxOverride","position","zIndex","theme","hotspotCard","mt","ml","mb","mr","PlusIcon","transform","transition","Popper","anchorEl","current","placement","disablePortal","modifiers","name","enabled","options","fallbackPlacements","boundary","phase","fn","state","xs","md","width","height","minHeight","modal","TransitionProps","Fade","timeout","Card","id","boxShadow","flowShadows","xl","startsWith","border","overflow","padding"],"mappings":"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"}

package/cjs/components/icon/filled/CarChargingFilledIcon.d.ts

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

package/cjs/components/icon/filled/CarChargingFilledIcon.js

@@ -0,0 +1,2 @@
+"use strict";var r=require("react/jsx-runtime"),e=require("react"),C=require("@mui/material");const H=e.forwardRef((e,H)=>r.jsxs(C.SvgIcon,{viewBox:"2 2 20 20",ref:H,...e,children:[r.jsx("path",{d:"M10.7998 5.40039C10.7999 9.04523 13.7546 12.0008 17.3994 12.001C18.3073 12.001 19.1727 11.817 19.96 11.4854V17.1016C19.9596 18.2011 19.0801 19.1013 17.9805 19.1016C17.1205 19.1016 16.2406 18.5808 16.0205 17.501H7.98047C7.76043 18.5806 6.88031 19.1014 6.02051 19.1016C4.92072 19.1016 4.04038 18.2013 4.04004 17.1016V11.2607L4.52051 10.2812H3.08008V8.68164H5.28027L6.95996 5.20117H10.8047C10.8027 5.26728 10.7998 5.33381 10.7998 5.40039ZM7.08008 14.0615H9.58008C10.24 14.6214 11.0802 14.9814 12 14.9814C12.9198 14.9814 13.76 14.6213 14.4199 14.0615H16.9199V12.5615H13.8398C13.4198 13.1412 12.7598 13.5215 12 13.5215C11.2402 13.5215 10.5802 13.1413 10.1602 12.5615H7.08008V14.0615Z"}),r.jsx("path",{d:"M16.4912 10.4764L21.2367 4.69855H17.6224L19.2778 1.08008H17.7604L13.0149 6.85796H16.6292L14.9738 10.4764H16.4912Z"})]}));exports.CarChargingFilledIcon=H;
+//# sourceMappingURL=CarChargingFilledIcon.js.map

package/cjs/components/icon/filled/CarChargingFilledIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CarChargingFilledIcon.js","sources":["../../../../../../src/components/icon/filled/CarChargingFilledIcon.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { SvgIcon, SvgIconProps } from '@mui/material';\n\n/**\n * Flow brand exclusive icon\n */\nexport const CarChargingFilledIcon: React.FC<SvgIconProps> = forwardRef((props, ref) => {\n  return (\n    <SvgIcon viewBox=\"2 2 20 20\" ref={ref} {...props}>\n      <path d=\"M10.7998 5.40039C10.7999 9.04523 13.7546 12.0008 17.3994 12.001C18.3073 12.001 19.1727 11.817 19.96 11.4854V17.1016C19.9596 18.2011 19.0801 19.1013 17.9805 19.1016C17.1205 19.1016 16.2406 18.5808 16.0205 17.501H7.98047C7.76043 18.5806 6.88031 19.1014 6.02051 19.1016C4.92072 19.1016 4.04038 18.2013 4.04004 17.1016V11.2607L4.52051 10.2812H3.08008V8.68164H5.28027L6.95996 5.20117H10.8047C10.8027 5.26728 10.7998 5.33381 10.7998 5.40039ZM7.08008 14.0615H9.58008C10.24 14.6214 11.0802 14.9814 12 14.9814C12.9198 14.9814 13.76 14.6213 14.4199 14.0615H16.9199V12.5615H13.8398C13.4198 13.1412 12.7598 13.5215 12 13.5215C11.2402 13.5215 10.5802 13.1413 10.1602 12.5615H7.08008V14.0615Z\" />\n      <path d=\"M16.4912 10.4764L21.2367 4.69855H17.6224L19.2778 1.08008H17.7604L13.0149 6.85796H16.6292L14.9738 10.4764H16.4912Z\" />\n    </SvgIcon>\n  );\n});\n"],"names":["CarChargingFilledIcon","forwardRef","props","ref","_jsxs","SvgIcon","viewBox","children","_jsx","d"],"mappings":"8FAMO,MAAMA,EAAgDC,EAAAA,WAAW,CAACC,EAAOC,IAE5EC,EAAAA,KAACC,UAAO,CAACC,QAAQ,YAAYH,IAAKA,KAASD,EAAKK,SAAA,CAC9CC,EAAAA,IAAA,OAAA,CAAMC,EAAE,2qBACRD,EAAAA,IAAA,OAAA,CAAMC,EAAE"}

package/cjs/components/icon/filled/EmissionLabelFilledIcon.d.ts

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

package/cjs/components/icon/filled/EmissionLabelFilledIcon.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),i=require("@mui/material");const L=r.forwardRef((r,L)=>e.jsx(i.SvgIcon,{viewBox:"2 2 20 20",ref:L,...r,children:e.jsx("path",{d:"M20.5986 15.7471L21 16.2266L20.5986 16.7061L16.8506 21.1992L16.627 21.4678H3V12.4805H17.873L20.5986 15.7471ZM12.3564 2.27344L16.1045 6.82422L16.502 7.30566L13.3887 10.9854H16.627L16.6289 10.9883H3V2H12.1318L12.3564 2.27344Z"})}));exports.EmissionLabelFilledIcon=L;
+//# sourceMappingURL=EmissionLabelFilledIcon.js.map

package/cjs/components/icon/filled/EmissionLabelFilledIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmissionLabelFilledIcon.js","sources":["../../../../../../src/components/icon/filled/EmissionLabelFilledIcon.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { SvgIcon, SvgIconProps } from '@mui/material';\n\n/**\n * Flow brand exclusive icon\n */\nexport const EmissionLabelFilledIcon: React.FC<SvgIconProps> = forwardRef((props, ref) => {\n  return (\n    <SvgIcon viewBox=\"2 2 20 20\" ref={ref} {...props}>\n      <path d=\"M20.5986 15.7471L21 16.2266L20.5986 16.7061L16.8506 21.1992L16.627 21.4678H3V12.4805H17.873L20.5986 15.7471ZM12.3564 2.27344L16.1045 6.82422L16.502 7.30566L13.3887 10.9854H16.627L16.6289 10.9883H3V2H12.1318L12.3564 2.27344Z\" />\n    </SvgIcon>\n  );\n});\n"],"names":["EmissionLabelFilledIcon","forwardRef","props","ref","_jsx","SvgIcon","viewBox","d"],"mappings":"8FAMO,MAAMA,EAAkDC,EAAAA,WAAW,CAACC,EAAOC,IAE9EC,EAAAA,IAACC,EAAAA,QAAO,CAACC,QAAQ,YAAYH,IAAKA,KAASD,WACzCE,EAAAA,IAAA,OAAA,CAAMG,EAAE"}

package/cjs/components/icon/filled/PictureErrorFilledIcon.d.ts

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

package/cjs/components/icon/filled/PictureErrorFilledIcon.js

@@ -0,0 +1,2 @@
+"use strict";var r=require("react/jsx-runtime"),e=require("react"),i=require("@mui/material");const t=e.forwardRef((e,t)=>r.jsx(i.SvgIcon,{viewBox:"2 2 20 20",ref:t,...e,children:r.jsx("path",{d:"M22.0459 3.03418L2.9707 22.1094L1.69727 20.8369L4.12012 18.4141V4.0791H18.4551L20.7725 1.76172L22.0459 3.03418ZM19.8799 19.8389H7.78711L9.42676 18.1992H18.2402V9.38574L19.8799 7.74609V19.8389ZM5.75977 16.7744L16.8154 5.71875H5.75977V16.7744ZM17.7803 16.4395H11.1865L14.6338 12.9912L17.7803 16.4395ZM9.28027 7.81934C10.0201 7.81942 10.6599 8.43894 10.6602 9.17871C10.6602 9.91866 10.0202 10.539 9.28027 10.5391C8.54027 10.5391 7.90039 9.91871 7.90039 9.17871C7.90062 8.43888 8.5404 7.81934 9.28027 7.81934Z"})}));exports.PictureErrorFilledIcon=t;
+//# sourceMappingURL=PictureErrorFilledIcon.js.map

package/cjs/components/icon/filled/PictureErrorFilledIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PictureErrorFilledIcon.js","sources":["../../../../../../src/components/icon/filled/PictureErrorFilledIcon.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { SvgIcon, SvgIconProps } from '@mui/material';\n\n/**\n * Flow brand exclusive icon\n */\nexport const PictureErrorFilledIcon: React.FC<SvgIconProps> = forwardRef((props, ref) => {\n  return (\n    <SvgIcon viewBox=\"2 2 20 20\" ref={ref} {...props}>\n      <path d=\"M22.0459 3.03418L2.9707 22.1094L1.69727 20.8369L4.12012 18.4141V4.0791H18.4551L20.7725 1.76172L22.0459 3.03418ZM19.8799 19.8389H7.78711L9.42676 18.1992H18.2402V9.38574L19.8799 7.74609V19.8389ZM5.75977 16.7744L16.8154 5.71875H5.75977V16.7744ZM17.7803 16.4395H11.1865L14.6338 12.9912L17.7803 16.4395ZM9.28027 7.81934C10.0201 7.81942 10.6599 8.43894 10.6602 9.17871C10.6602 9.91866 10.0202 10.539 9.28027 10.5391C8.54027 10.5391 7.90039 9.91871 7.90039 9.17871C7.90062 8.43888 8.5404 7.81934 9.28027 7.81934Z\" />\n    </SvgIcon>\n  );\n});\n"],"names":["PictureErrorFilledIcon","forwardRef","props","ref","_jsx","SvgIcon","viewBox","d"],"mappings":"8FAMO,MAAMA,EAAiDC,EAAAA,WAAW,CAACC,EAAOC,IAE7EC,EAAAA,IAACC,EAAAA,QAAO,CAACC,QAAQ,YAAYH,IAAKA,KAASD,WACzCE,EAAAA,IAAA,OAAA,CAAMG,EAAE"}

package/cjs/components/icon/filled/PowerpassFilledIcon.d.ts

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

package/cjs/components/icon/filled/PowerpassFilledIcon.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react/jsx-runtime"),r=require("react"),i=require("@mui/material");const s=r.forwardRef((r,s)=>e.jsx(i.SvgIcon,{viewBox:"2 2 20 20",ref:s,...r,children:e.jsx("path",{d:"M11.6046 6.75L17.25 12.3449L11.6035 17.9914H6.75L12.0906 12.6507L12.3992 12.3421L12.0893 12.0349L6.7567 6.75H11.6046Z"})}));exports.PowerpassFilledIcon=s;
+//# sourceMappingURL=PowerpassFilledIcon.js.map

package/cjs/components/icon/filled/PowerpassFilledIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PowerpassFilledIcon.js","sources":["../../../../../../src/components/icon/filled/PowerpassFilledIcon.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { SvgIcon, SvgIconProps } from '@mui/material';\n\n/**\n * Flow brand exclusive icon\n */\nexport const PowerpassFilledIcon: React.FC<SvgIconProps> = forwardRef((props, ref) => {\n  return (\n    <SvgIcon viewBox=\"2 2 20 20\" ref={ref} {...props}>\n      <path d=\"M11.6046 6.75L17.25 12.3449L11.6035 17.9914H6.75L12.0906 12.6507L12.3992 12.3421L12.0893 12.0349L6.7567 6.75H11.6046Z\" />\n    </SvgIcon>\n  );\n});\n"],"names":["PowerpassFilledIcon","forwardRef","props","ref","_jsx","SvgIcon","viewBox","d"],"mappings":"8FAMO,MAAMA,EAA8CC,EAAAA,WAAW,CAACC,EAAOC,IAE1EC,EAAAA,IAACC,EAAAA,QAAO,CAACC,QAAQ,YAAYH,IAAKA,KAASD,WACzCE,EAAAA,IAAA,OAAA,CAAMG,EAAE"}

package/cjs/components/icon/filled/index.d.ts

@@ -82,6 +82,7 @@ export * from './CameraFilledIcon';
 export * from './CampingFilledIcon';
 export * from './CarAccidentFilledIcon';
 export * from './CarBackFilledIcon';
+export * from './CarChargingFilledIcon';
 export * from './CarComparisonFilledIcon';
 export * from './CarHandFilledIcon';
 export * from './CarInfoFilledIcon';
@@ -159,6 +160,7 @@ export * from './DraghandleFilledIcon';
 export * from './EditFilledIcon';
 export * from './ElectricChargerFilledIcon';
 export * from './ElectricChargerOffFilledIcon';
+export * from './EmissionLabelFilledIcon';
 export * from './EmptystateFilledIcon';
 export * from './EngineFilledIcon';
 export * from './EngineOilFilledIcon';
@@ -242,6 +244,7 @@ export * from './PasteFilledIcon';
 export * from './PercentageFilledIcon';
 export * from './PetFilledIcon';
 export * from './PhoneFilledIcon';
+export * from './PictureErrorFilledIcon';
 export * from './PictureFilledIcon';
 export * from './PiggybankFilledIcon';
 export * from './PlugCCSType1FilledIcon';
@@ -251,6 +254,7 @@ export * from './PlugType1FilledIcon';
 export * from './PlugType2FilledIcon';
 export * from './PlugFilledIcon';
 export * from './PlusFilledIcon';
+export * from './PowerpassFilledIcon';
 export * from './PremiumLFilledIcon';
 export * from './PremiumMFilledIcon';
 export * from './PremiumSFilledIcon';