@skodaflow/web-library 7.13.1 → 7.14.0

package/cjs/organisms/common/menuCardComponent/menuCardComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"menuCardComponent.js","sources":["../../../../../../src/organisms/common/menuCardComponent/menuCardComponent.tsx"],"sourcesContent":["import React, { FC, useCallback, useRef, useState } from 'react';\nimport { Icon } from '../../../components/icon';\nimport { styled } from '@mui/system';\nimport { CardMenu, CardMenuItemsArray } from '../../../components/cardMenu/cardMenu';\nimport { SxProps } from '@mui/system';\nimport { Theme } from '@mui/material/styles';\nimport { Placement } from '../../../utils/enum';\n\nexport interface MenuCardComponentProps {\n  /**\n   * The content of the component.\n   */\n  items: CardMenuItemsArray;\n  /**\n   * React useState hook set function used to update the passed items to the component.\n   */\n  setItems?: React.Dispatch<React.SetStateAction<CardMenuItemsArray>>;\n  /**\n   * If header is provided, a text will be displayed on top of the elements.\n   */\n  header?: string;\n  /**\n   * If true, multiple item select will be enabled. Property 'setItems' must be provided in order allowMultiselect to work.\n   * Items: CardMenuItemsArray provided to the component must have isChecked propery provided in order allowMultiselect to work..\n   */\n  allowMultiselect?: boolean;\n  /**\n   * Callback fired when item is clicked.\n   */\n  onItemClick?: (itemText: string) => void;\n  /**\n   *  The system prop that allows defining system overrides as well as additional CSS styles.\n   */\n  sx?: SxProps<Theme>;\n  /**\n   *  Override or extend the styles applied to the component.\n   */\n  classes?: object;\n  /**\n   * Popper placement. Default is 'bottom'.\n   */\n  placement?: Placement;\n  /**\n   * If true, a switch button is added to the items allowing to select or deselect all of the items.\n   * Property allowMultiselect should be true in order hasToggleSelection to work. Only available for the desktop version of the MenuCard.\n   */\n  hasToggleSelection?: boolean;\n}\n\nconst MenuCardComponent: FC<MenuCardComponentProps> = ({ ...props }) => {\n  const [isOpen, setIsOpen] = useState(false);\n  const anchorRef = useRef(null);\n\n  const setOpen = useCallback(() => setIsOpen(true), []);\n\n  const setClosed = useCallback(() => setIsOpen(false), []);\n\n  return (\n    <MenuCardStyled className=\"menuCardComponent\">\n      <Icon ref={anchorRef} onClick={setOpen} name=\"vertical\" />\n      <CardMenu {...props} open={isOpen} onClose={setClosed} anchorRef={anchorRef} />\n    </MenuCardStyled>\n  );\n};\n\nconst MenuCardStyled = styled('div')<{ theme? }>(() => {\n  let style = {};\n\n  style = {\n    ...style,\n    position: 'absolute',\n    zIndex: 4,\n    cursor: 'pointer',\n    top: '24px',\n    width: '20px',\n    height: '30px',\n    right: '24px',\n    '& > .MuiIcon-root': {\n      width: '20px',\n      height: '30px',\n      fontSize: '20px',\n    },\n    '& > div': {\n      marginRight: '40px',\n    },\n  };\n\n  return style;\n});\n\nexport default MenuCardComponent;\n"],"names":["MenuCardStyled","styled","style","Object","assign","position","zIndex","cursor","top","width","height","right","fontSize","marginRight","_a","props","__rest","isOpen","setIsOpen","useState","anchorRef","useRef","setOpen","useCallback","setClosed","_jsxs","className","children","_jsx","Icon","ref","onClick","name","CardMenu","open","onClose"],"mappings":"sUAiDA,MAgBMA,EAAiBC,EAAAA,OAAO,MAAPA,EAA0B,KAC/C,IAAIC,EAAQ,CAAE,EAqBd,OAnBAA,EACKC,OAAAC,OAAAD,OAAAC,OAAA,GAAAF,GACH,CAAAG,SAAU,WACVC,OAAQ,EACRC,OAAQ,UACRC,IAAK,OACLC,MAAO,OACPC,OAAQ,OACRC,MAAO,OACP,oBAAqB,CACnBF,MAAO,OACPC,OAAQ,OACRE,SAAU,QAEZ,UAAW,CACTC,YAAa,UAIVX,CAAK,oBAtCyCY,QAAKC,EAAKC,EAAAA,OAAAF,EAAV,IACrD,MAAOG,EAAQC,GAAaC,EAAAA,UAAS,GAC/BC,EAAYC,EAAMA,OAAC,MAEnBC,EAAUC,EAAAA,aAAY,IAAML,GAAU,IAAO,IAE7CM,EAAYD,EAAAA,aAAY,IAAML,GAAU,IAAQ,IAEtD,OACEO,EAAAA,KAACzB,GAAe0B,UAAU,oBACxBC,SAAA,CAAAC,EAAAA,IAACC,EAAAA,KAAK,CAAAC,IAAKV,EAAWW,QAAST,EAASU,KAAK,aAC7CJ,MAACK,EAAQA,SAAA9B,OAAAC,OAAA,CAAA,EAAKW,EAAO,CAAAmB,KAAMjB,EAAQkB,QAASX,EAAWJ,UAAWA,OACnD"}
+{"version":3,"file":"menuCardComponent.js","sources":["../../../../../../src/organisms/common/menuCardComponent/menuCardComponent.tsx"],"sourcesContent":["import React, { FC, useCallback, useRef, useState } from 'react';\nimport { Icon } from '../../../components/icon';\nimport { styled, SxProps, Theme } from '@mui/material';\nimport { CardMenu, CardMenuItemsArray } from '../../../components/cardMenu/cardMenu';\nimport { Placement } from '../../../utils/enum';\n\nexport interface MenuCardComponentProps {\n  /**\n   * The content of the component.\n   */\n  items: CardMenuItemsArray;\n  /**\n   * React useState hook set function used to update the passed items to the component.\n   */\n  setItems?: React.Dispatch<React.SetStateAction<CardMenuItemsArray>>;\n  /**\n   * If header is provided, a text will be displayed on top of the elements.\n   */\n  header?: string;\n  /**\n   * If true, multiple item select will be enabled. Property 'setItems' must be provided in order allowMultiselect to work.\n   * Items: CardMenuItemsArray provided to the component must have isChecked propery provided in order allowMultiselect to work..\n   */\n  allowMultiselect?: boolean;\n  /**\n   * Callback fired when item is clicked.\n   */\n  onItemClick?: (itemText: string) => void;\n  /**\n   *  The system prop that allows defining system overrides as well as additional CSS styles.\n   */\n  sx?: SxProps<Theme>;\n  /**\n   *  Override or extend the styles applied to the component.\n   */\n  classes?: object;\n  /**\n   * Popper placement. Default is 'bottom'.\n   */\n  placement?: Placement;\n  /**\n   * If true, a switch button is added to the items allowing to select or deselect all of the items.\n   * Property allowMultiselect should be true in order hasToggleSelection to work. Only available for the desktop version of the MenuCard.\n   */\n  hasToggleSelection?: boolean;\n}\n\nconst MenuCardComponent: FC<MenuCardComponentProps> = ({ ...props }) => {\n  const [isOpen, setIsOpen] = useState(false);\n  const anchorRef = useRef(null);\n\n  const setOpen = useCallback(() => setIsOpen(true), []);\n\n  const setClosed = useCallback(() => setIsOpen(false), []);\n\n  return (\n    <MenuCardStyled className=\"menuCardComponent\">\n      <Icon ref={anchorRef} onClick={setOpen} name=\"vertical\" />\n      <CardMenu {...props} open={isOpen} onClose={setClosed} anchorRef={anchorRef} />\n    </MenuCardStyled>\n  );\n};\n\nconst MenuCardStyled = styled('div')<{ theme? }>(() => {\n  let style = {};\n\n  style = {\n    ...style,\n    position: 'absolute',\n    zIndex: 4,\n    cursor: 'pointer',\n    top: '24px',\n    width: '20px',\n    height: '30px',\n    right: '24px',\n    '& > .MuiIcon-root': {\n      width: '20px',\n      height: '30px',\n      fontSize: '20px',\n    },\n    '& > div': {\n      marginRight: '40px',\n    },\n  };\n\n  return style;\n});\n\nexport default MenuCardComponent;\n"],"names":["MenuCardStyled","styled","style","Object","assign","position","zIndex","cursor","top","width","height","right","fontSize","marginRight","_a","props","__rest","isOpen","setIsOpen","useState","anchorRef","useRef","setOpen","useCallback","setClosed","_jsxs","className","children","_jsx","Icon","ref","onClick","name","CardMenu","open","onClose"],"mappings":"wUA+CA,MAgBMA,EAAiBC,EAAAA,OAAO,MAAPA,EAA0B,KAC/C,IAAIC,EAAQ,CAAE,EAqBd,OAnBAA,EACKC,OAAAC,OAAAD,OAAAC,OAAA,GAAAF,GACH,CAAAG,SAAU,WACVC,OAAQ,EACRC,OAAQ,UACRC,IAAK,OACLC,MAAO,OACPC,OAAQ,OACRC,MAAO,OACP,oBAAqB,CACnBF,MAAO,OACPC,OAAQ,OACRE,SAAU,QAEZ,UAAW,CACTC,YAAa,UAIVX,CAAK,oBAtCyCY,QAAKC,EAAKC,EAAAA,OAAAF,EAAV,IACrD,MAAOG,EAAQC,GAAaC,EAAAA,UAAS,GAC/BC,EAAYC,EAAMA,OAAC,MAEnBC,EAAUC,EAAAA,aAAY,IAAML,GAAU,IAAO,IAE7CM,EAAYD,EAAAA,aAAY,IAAML,GAAU,IAAQ,IAEtD,OACEO,EAAAA,KAACzB,GAAe0B,UAAU,oBACxBC,SAAA,CAAAC,EAAAA,IAACC,EAAAA,KAAK,CAAAC,IAAKV,EAAWW,QAAST,EAASU,KAAK,aAC7CJ,MAACK,EAAQA,SAAA9B,OAAAC,OAAA,CAAA,EAAKW,EAAO,CAAAmB,KAAMjB,EAAQkB,QAASX,EAAWJ,UAAWA,OACnD"}

package/cjs/organisms/notification/NotificationCenterHeaderButton.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("tslib"),r=require("react/jsx-runtime"),i=require("@mui/material");require("@mui/system");var t=require("react");require("../../layout/Header/HeaderButton.js"),require("../../layout/Header/HeaderContext.js"),require("../../components/icon/icon.js"),require("../../components/icon/icon.definitions.js"),require("../../layout/Header/HeaderNavigationHero.js"),require("../../layout/Header/HeaderOverheadItem.js");var o=require("../../layout/Header/PredefinedHeaderButtons.js");require("../../utils/enum.js");var n=require("../../utils/useClosure/useClosure.js"),s=require("./NotificationCenter.js");exports.NotificationCenterHeaderButton=a=>{const{isOpen:u,onToggle:c,onClose:d}=n.useClosure(!1),l=t.useRef(null),{indicator:j}=a,q=e.__rest(a,["indicator"]);return r.jsxs(r.Fragment,{children:[r.jsx(o.HeaderBellButton,{ref:l,onClick:c,color:u&&"grey",indicator:a.indicator,"data-testid":"NotificationCenterHeaderButton"}),r.jsx(i.Popper,{open:u,anchorEl:l.current,placement:"bottom-end",modifiers:[{name:"offset",options:{offset:[0,28]}}],children:r.jsx(i.ClickAwayListener,{onClickAway:d,children:r.jsx(i.Box,{children:r.jsx(s.NotificationCenter,Object.assign({},q))})})})]})};
+"use strict";var e=require("tslib"),r=require("react/jsx-runtime"),i=require("@mui/material"),t=require("react");require("../../layout/Header/HeaderButton.js"),require("../../layout/Header/HeaderContext.js"),require("../../components/icon/icon.js"),require("../../components/icon/icon.definitions.js"),require("../../layout/Header/HeaderNavigationHero.js"),require("../../layout/Header/HeaderOverheadItem.js");var o=require("../../layout/Header/PredefinedHeaderButtons.js");require("../../utils/enum.js");var n=require("../../utils/useClosure/useClosure.js"),s=require("./NotificationCenter.js");exports.NotificationCenterHeaderButton=a=>{const{isOpen:u,onToggle:c,onClose:d}=n.useClosure(!1),l=t.useRef(null),{indicator:j}=a,q=e.__rest(a,["indicator"]);return r.jsxs(r.Fragment,{children:[r.jsx(o.HeaderBellButton,{ref:l,onClick:c,color:u&&"grey",indicator:a.indicator,"data-testid":"NotificationCenterHeaderButton"}),r.jsx(i.Popper,{open:u,anchorEl:l.current,placement:"bottom-end",modifiers:[{name:"offset",options:{offset:[0,28]}}],children:r.jsx(i.ClickAwayListener,{onClickAway:d,children:r.jsx(i.Box,{children:r.jsx(s.NotificationCenter,Object.assign({},q))})})})]})};
 //# sourceMappingURL=NotificationCenterHeaderButton.js.map

package/cjs/organisms/notification/NotificationCenterHeaderButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"NotificationCenterHeaderButton.js","sources":["../../../../../src/organisms/notification/NotificationCenterHeaderButton.tsx"],"sourcesContent":["import { HeaderBellButton } from '@/src/layout/Header';\nimport { useClosure } from '@/src/utils';\nimport { Box, ClickAwayListener, Popper } from '@mui/material';\nimport { NotificationCenter, NotificationCenterProps } from './NotificationCenter';\nimport { useRef } from 'react';\nimport { IndicatorProps } from '@/src/components/indicator';\n\nexport type NotificationCenterHeaderButtonProps = NotificationCenterProps & {\n  indicator?: IndicatorProps['color'];\n};\n\nexport const NotificationCenterHeaderButton: React.FC<NotificationCenterHeaderButtonProps> = (props) => {\n  const { isOpen, onToggle, onClose } = useClosure(false);\n  const buttonRef = useRef(null);\n  const { indicator, ...notificationCenterProps } = props;\n  return (\n    <>\n      <HeaderBellButton\n        ref={buttonRef}\n        onClick={onToggle}\n        color={isOpen && 'grey'}\n        indicator={props.indicator}\n        data-testid=\"NotificationCenterHeaderButton\"\n      />\n      <Popper\n        open={isOpen}\n        anchorEl={buttonRef.current}\n        placement=\"bottom-end\"\n        modifiers={[\n          {\n            name: 'offset',\n            options: {\n              offset: [0, 28],\n            },\n          },\n        ]}\n      >\n        <ClickAwayListener onClickAway={onClose}>\n          <Box>\n            <NotificationCenter {...notificationCenterProps} />\n          </Box>\n        </ClickAwayListener>\n      </Popper>\n    </>\n  );\n};\n"],"names":["props","isOpen","onToggle","onClose","useClosure","buttonRef","useRef","indicator","notificationCenterProps","__rest","_jsxs","_jsx","HeaderBellButton","ref","onClick","color","jsx","Popper","open","anchorEl","current","placement","modifiers","name","options","offset","children","ClickAwayListener","onClickAway","Box","NotificationCenter","Object","assign"],"mappings":"spBAW8FA,IAC5F,MAAMC,OAAEA,EAAMC,SAAEA,EAAQC,QAAEA,GAAYC,EAAAA,YAAW,GAC3CC,EAAYC,EAAMA,OAAC,OACnBC,UAAEA,GAA0CP,EAA5BQ,EAAuBC,EAAAA,OAAKT,EAA5C,CAAyC,cAC/C,OACEU,EAAAA,2BACEC,EAAAA,IAACC,EAAAA,kBACCC,IAAKR,EACLS,QAASZ,EACTa,MAAOd,GAAU,OACjBM,UAAWP,EAAMO,UACL,cAAA,mCAEdI,EAAAK,IAACC,EAAMA,OACL,CAAAC,KAAMjB,EACNkB,SAAUd,EAAUe,QACpBC,UAAU,aACVC,UAAW,CACT,CACEC,KAAM,SACNC,QAAS,CACPC,OAAQ,CAAC,EAAG,OAKlBC,SAAAf,MAACgB,EAAAA,kBAAkB,CAAAC,YAAazB,EAAOuB,SACrCf,EAAAA,IAACkB,EAAGA,IAAA,CAAAH,SACFf,MAACmB,qBAAkBC,OAAAC,OAAA,GAAKxB,YAI7B"}
+{"version":3,"file":"NotificationCenterHeaderButton.js","sources":["../../../../../src/organisms/notification/NotificationCenterHeaderButton.tsx"],"sourcesContent":["import { HeaderBellButton } from '@/src/layout/Header';\nimport { useClosure } from '@/src/utils';\nimport { Box, ClickAwayListener, Popper } from '@mui/material';\nimport { NotificationCenter, NotificationCenterProps } from './NotificationCenter';\nimport { useRef } from 'react';\nimport { IndicatorProps } from '@/src/components/indicator';\n\nexport type NotificationCenterHeaderButtonProps = NotificationCenterProps & {\n  indicator?: IndicatorProps['color'];\n};\n\nexport const NotificationCenterHeaderButton: React.FC<NotificationCenterHeaderButtonProps> = (props) => {\n  const { isOpen, onToggle, onClose } = useClosure(false);\n  const buttonRef = useRef(null);\n  const { indicator, ...notificationCenterProps } = props;\n  return (\n    <>\n      <HeaderBellButton\n        ref={buttonRef}\n        onClick={onToggle}\n        color={isOpen && 'grey'}\n        indicator={props.indicator}\n        data-testid=\"NotificationCenterHeaderButton\"\n      />\n      <Popper\n        open={isOpen}\n        anchorEl={buttonRef.current}\n        placement=\"bottom-end\"\n        modifiers={[\n          {\n            name: 'offset',\n            options: {\n              offset: [0, 28],\n            },\n          },\n        ]}\n      >\n        <ClickAwayListener onClickAway={onClose}>\n          <Box>\n            <NotificationCenter {...notificationCenterProps} />\n          </Box>\n        </ClickAwayListener>\n      </Popper>\n    </>\n  );\n};\n"],"names":["props","isOpen","onToggle","onClose","useClosure","buttonRef","useRef","indicator","notificationCenterProps","__rest","_jsxs","_jsx","HeaderBellButton","ref","onClick","color","jsx","Popper","open","anchorEl","current","placement","modifiers","name","options","offset","children","ClickAwayListener","onClickAway","Box","NotificationCenter","Object","assign"],"mappings":"2nBAW8FA,IAC5F,MAAMC,OAAEA,EAAMC,SAAEA,EAAQC,QAAEA,GAAYC,EAAAA,YAAW,GAC3CC,EAAYC,EAAMA,OAAC,OACnBC,UAAEA,GAA0CP,EAA5BQ,EAAuBC,EAAAA,OAAKT,EAA5C,CAAyC,cAC/C,OACEU,EAAAA,2BACEC,EAAAA,IAACC,EAAAA,kBACCC,IAAKR,EACLS,QAASZ,EACTa,MAAOd,GAAU,OACjBM,UAAWP,EAAMO,UACL,cAAA,mCAEdI,EAAAK,IAACC,EAAMA,OACL,CAAAC,KAAMjB,EACNkB,SAAUd,EAAUe,QACpBC,UAAU,aACVC,UAAW,CACT,CACEC,KAAM,SACNC,QAAS,CACPC,OAAQ,CAAC,EAAG,OAKlBC,SAAAf,MAACgB,EAAAA,kBAAkB,CAAAC,YAAazB,EAAOuB,SACrCf,EAAAA,IAACkB,EAAGA,IAAA,CAAAH,SACFf,MAACmB,qBAAkBC,OAAAC,OAAA,GAAKxB,YAI7B"}

package/cjs/organisms/textCta/textCta.js

@@ -1,2 +1,2 @@
-"use strict";var t=require("tslib"),e=require("react/jsx-runtime"),i=require("react"),n=require("../../components/label/label.js"),o=require("@mui/material"),r=require("../../components/button/button.js"),s=require("../../components/icon/icon.js");require("../../components/icon/icon.definitions.js");const a=i.forwardRef(((a,l)=>{var{label:x,headlineTitle:d,text:c,showFirstButton:h=!1,showSecondButton:m=!1,onClickFirstBtn:u,onClickSecondBtn:g,firstButtonProps:S,secondButtonProps:B,listItems:b,showAppStore:j=!1,showPlayStore:f=!1,appStoreProps:C,playStoreProps:w}=a,y=t.__rest(a,["label","headlineTitle","text","showFirstButton","showSecondButton","onClickFirstBtn","onClickSecondBtn","firstButtonProps","secondButtonProps","listItems","showAppStore","showPlayStore","appStoreProps","playStoreProps"]);const k=i.useCallback((t=>{window.open(t,"_blank")}),[]),P=i.useCallback(((t,e,i)=>{i&&k(i),e&&e(t)}),[k]),v=i.useCallback(((t,i)=>{const n=Object.assign(Object.assign({},t),{url:t.url||null});return e.jsx(r.Button,Object.assign({},n,{onClick:t=>P(t,i,n.url)}))}),[P]);return e.jsxs(p,Object.assign({ref:l,listItems:b},y,{children:[x&&e.jsx(n.Label,{label:x}),d&&e.jsx("div",{className:"headlineContainer",children:e.jsx(o.Typography,{className:"textCtaHeadline",children:d})}),c&&e.jsx("p",{className:`textCtaText ${f&&"isPlayStore"}`,children:c}),b&&b.length>0&&e.jsx(o.List,{className:"textCtaList",children:b.map(((t,i)=>e.jsxs(o.ListItem,{disableGutters:!0,children:[e.jsx(s.Icon,{name:t.icon||"check"}),t.text]},"text-cta-list-item"+i)))}),e.jsxs("div",{className:"textCtaBtnGroup",children:[(!j||!f)&&e.jsxs(e.Fragment,{children:[h&&v(S,u),m&&v(B,g)]}),(!h||!m)&&e.jsxs(e.Fragment,{children:[j&&e.jsx("span",{className:"appStoreBadge",onClick:()=>k(C.url),children:e.jsx("img",{src:C.img,alt:C.alt})}),f&&e.jsx("span",{className:"playStoreBadge",dangerouslySetInnerHTML:{__html:w}})]})]})]}))})),l=t=>{switch(t){case"h1":return{fontSize:"44px",lineHeight:"52px"};case"h2":return{fontSize:"36px",lineHeight:"44px"};case"h3":return{fontSize:"30px",lineHeight:"36px"};case"h4":return{fontSize:"24px",lineHeight:"28px"};default:return{fontSize:"18px",lineHeight:"28px"}}},p=o.styled("div",{shouldForwardProp:t=>"listItems"!==t&&"headlineVariant"!==t})((e=>{var{theme:i}=e,n=t.__rest(e,["theme"]);let o={};return o={"& > span":{margin:0},"& > div.headlineContainer":{marginBottom:"10px",marginTop:"5px","& > .textCtaHeadline":Object.assign({fontWeight:"bold"},l(n.headlineVariant))},"& > div.subheadlineContainer":{marginBottom:"10px","& > .textCtaSubheadline":{fontWeight:"bold",fontSize:"18px",lineHeight:"28px"}},"& > .textCtaList":{marginBottom:"10px"},"& > .textCtaText":{fontSize:"18px",lineHeight:"28px",margin:"12px 0 16px 0","&.isPlayStore":{marginBottom:"2px"}},"& > div.textCtaBtnGroup":{display:"flex",alignItems:"center",justifyContent:"flex-start",flexWrap:"wrap","& > div":{[i.breakpoints.down("sm")]:{width:"100%"}},"& > .appStoreBadge":{cursor:"pointer",marginRight:"8px","& > img":{height:"40px"}},"& > .playStoreBadge":{cursor:"pointer","& img":{maxWidth:"153px"}},"& .MuiButton-root":{paddingLeft:"16px",paddingRight:"16px",paddingBottom:"2px",fontSize:"14px",minWidth:"93px",height:"32px",[i.breakpoints.down("sm")]:{height:"44px",width:"100%"}},"& .MuiButton-root:first-of-type":{marginRight:"16px",marginBottom:0,[i.breakpoints.down("sm")]:{marginBottom:"16px"}}}," & > .MuiList-root":{padding:"0px","& > .MuiListItem-root":{padding:"0px 0px 6px 0px","& > .MuiIcon-root":{width:"20px",height:"24px",fontSize:"14px"}}}},o}));exports.TextCta=a;
+"use strict";var t=require("tslib"),e=require("react/jsx-runtime"),i=require("react"),n=require("../../components/label/label.js"),o=require("@mui/material"),r=require("../../components/button/button.js"),s=require("../../components/icon/icon.js");require("../../components/icon/icon.definitions.js");const a=i.forwardRef(((a,l)=>{var{label:x,headlineTitle:d,text:c,showFirstButton:h=!1,showSecondButton:u=!1,onClickFirstBtn:m,onClickSecondBtn:g,firstButtonProps:B,secondButtonProps:S,listItems:b,showAppStore:j=!1,showPlayStore:f=!1,appStoreProps:C,playStoreProps:w}=a,y=t.__rest(a,["label","headlineTitle","text","showFirstButton","showSecondButton","onClickFirstBtn","onClickSecondBtn","firstButtonProps","secondButtonProps","listItems","showAppStore","showPlayStore","appStoreProps","playStoreProps"]);const k=i.useCallback((t=>{window.open(t,"_blank")}),[]),P=i.useCallback(((t,e,i)=>{i&&k(i),e&&e(t)}),[k]),v=i.useCallback(((t,i)=>{const n=Object.assign(Object.assign({},t),{url:t.url||null});return e.jsx(r.Button,Object.assign({},n,{onClick:t=>P(t,i,n.url)}))}),[P]);return e.jsxs(p,Object.assign({ref:l,listItems:b},y,{children:[x&&e.jsx(n.Label,{label:x}),d&&e.jsx("div",{className:"headlineContainer",children:e.jsx(o.Typography,{className:"textCtaHeadline",children:d})}),c&&e.jsx("p",{className:`textCtaText ${f&&"isPlayStore"}`,children:c}),b&&b.length>0&&e.jsx(o.List,{className:"textCtaList",children:b.map(((t,i)=>e.jsxs(o.ListItem,{disableGutters:!0,children:[e.jsx(s.Icon,{name:t.icon||"check"}),t.text]},"text-cta-list-item"+i)))}),e.jsxs("div",{className:"textCtaBtnGroup",children:[(!j||!f)&&e.jsxs(e.Fragment,{children:[h&&v(B,m),u&&v(S,g)]}),(!h||!u)&&e.jsxs(e.Fragment,{children:[j&&e.jsx(o.ButtonBase,{className:"appStoreBadge",onClick:()=>k(C.url),children:e.jsx("img",{src:C.img,alt:C.alt})}),f&&e.jsx("span",{className:"playStoreBadge",dangerouslySetInnerHTML:{__html:w}})]})]})]}))})),l=t=>{switch(t){case"h1":return{fontSize:"44px",lineHeight:"52px"};case"h2":return{fontSize:"36px",lineHeight:"44px"};case"h3":return{fontSize:"30px",lineHeight:"36px"};case"h4":return{fontSize:"24px",lineHeight:"28px"};default:return{fontSize:"18px",lineHeight:"28px"}}},p=o.styled("div",{shouldForwardProp:t=>"listItems"!==t&&"headlineVariant"!==t})((e=>{var{theme:i}=e,n=t.__rest(e,["theme"]);let o={};return o={"& > span":{margin:0},"& > div.headlineContainer":{marginBottom:"10px",marginTop:"5px","& > .textCtaHeadline":Object.assign({fontWeight:"bold"},l(n.headlineVariant))},"& > div.subheadlineContainer":{marginBottom:"10px","& > .textCtaSubheadline":{fontWeight:"bold",fontSize:"18px",lineHeight:"28px"}},"& > .textCtaList":{marginBottom:"10px"},"& > .textCtaText":{fontSize:"18px",lineHeight:"28px",margin:"12px 0 16px 0","&.isPlayStore":{marginBottom:"2px"}},"& > div.textCtaBtnGroup":{display:"flex",alignItems:"center",justifyContent:"flex-start",flexWrap:"wrap","& > div":{[i.breakpoints.down("sm")]:{width:"100%"}},"& > .appStoreBadge":{cursor:"pointer",marginRight:"8px","& > img":{height:"40px"}},"& > .playStoreBadge":{cursor:"pointer","& img":{maxWidth:"153px"}},"& .MuiButton-root":{paddingLeft:"16px",paddingRight:"16px",paddingBottom:"2px",fontSize:"14px",minWidth:"93px",height:"32px",[i.breakpoints.down("sm")]:{height:"44px",width:"100%"}},"& .MuiButton-root:first-of-type":{marginRight:"16px",marginBottom:0,[i.breakpoints.down("sm")]:{marginBottom:"16px"}}}," & > .MuiList-root":{padding:"0px","& > .MuiListItem-root":{padding:"0px 0px 6px 0px","& > .MuiIcon-root":{width:"20px",height:"24px",fontSize:"14px"}}}},o}));exports.TextCta=a;
 //# sourceMappingURL=textCta.js.map

package/cjs/organisms/textCta/textCta.js.map

@@ -1 +1 @@
-{"version":3,"file":"textCta.js","sources":["../../../../../src/organisms/textCta/textCta.tsx"],"sourcesContent":["import React, { useCallback, forwardRef } from 'react';\nimport { Label } from '../../components/label';\nimport { List, ListItem, Typography, styled } from '@mui/material';\nimport { Button, ButtonProps } from '../../components/button';\nimport { Icon, IconNameProp } from '../../components/icon';\n\nexport type variants = 'subHeadline' | 'h1' | 'h2' | 'h3' | 'h4';\n\nexport interface TextCtaProps {\n  /**\n   * label to be shown on the top of component\n   */\n  label?: string;\n\n  /**\n   * headline to be shown on the top of component\n   */\n  headlineTitle?: string;\n  /**\n   * headline type variant\n   */\n  headlineVariant?: variants;\n\n  /**\n   * text to be shown under headline/subheadline\n   */\n  text?: string;\n\n  /**\n   * Show the primary button if true. Must fill the firstButtonProps\n   */\n  showFirstButton?: boolean;\n\n  /**\n   * Show the secondary button if true. Must fill the secondButtonProps\n   */\n  showSecondButton?: boolean;\n\n  /**\n   * props primary button. Same of skoda button component\n   */\n  firstButtonProps?: ButtonProps & { url?: string };\n\n  /**\n   * props secondary button. Same of skoda button component\n   */\n  secondButtonProps?: ButtonProps & { url?: string };\n\n  /**\n   * callback on click primary button\n   */\n  onClickFirstBtn?: (e: unknown) => void;\n\n  /**\n   * callback on click secondary button\n   */\n  onClickSecondBtn?: (e: unknown) => void;\n\n  /**\n   * If true, shows the AppStore badge\n   */\n  showAppStore?: boolean;\n\n  /**\n   * If true, shows the PlayStore badge\n   */\n  showPlayStore?: boolean;\n\n  /**\n   * List items show icon and text\n   * default icon for list is the check,it's possible to configure using the icon name provide in the Icon component\n   */\n  listItems?: {\n    text?: string;\n    icon?: IconNameProp;\n  }[];\n\n  /**\n   *object appStore Badge:\n   * {url: \"url\",\talt: ' alt description image', img: 'image badges'}\n   */\n  appStoreProps?: Record<string, string>;\n\n  /**\n   * object playStore Badge\n   * {url: \"url\",\talt: ' alt description image', img: 'image badges'}\n   */\n  playStoreProps?: unknown;\n}\n\n/**\n * @deprecated use TextAndCta component instead\n */\nexport const TextCta = forwardRef<HTMLDivElement, TextCtaProps>(\n  (\n    {\n      label,\n      headlineTitle,\n      text,\n      showFirstButton = false,\n      showSecondButton = false,\n      onClickFirstBtn,\n      onClickSecondBtn,\n      firstButtonProps,\n      secondButtonProps,\n      listItems,\n      showAppStore = false,\n      showPlayStore = false,\n      appStoreProps,\n      playStoreProps,\n      ...props\n    },\n    ref,\n  ) => {\n    const handleUrlClick = useCallback((url) => {\n      window.open(url, '_blank');\n    }, []);\n\n    const handleOnClickBtn = useCallback(\n      (e: unknown, callback: (e: unknown) => void, url: string) => {\n        if (url) {\n          handleUrlClick(url);\n        }\n        callback && callback(e);\n      },\n      [handleUrlClick],\n    );\n\n    const handleRenderBtn = useCallback(\n      (btnProps: ButtonProps & { url?: string }, onClickHandler: (e: unknown) => void) => {\n        const propsA = {\n          ...btnProps,\n          url: btnProps.url || null,\n        };\n        return <Button {...propsA} onClick={(e) => handleOnClickBtn(e, onClickHandler, propsA.url)} />;\n      },\n      [handleOnClickBtn],\n    );\n\n    return (\n      <TextCtaContainerStyled ref={ref} listItems={listItems} {...props}>\n        {label && <Label label={label} />}\n        {headlineTitle && (\n          <div className=\"headlineContainer\">\n            <Typography className=\"textCtaHeadline\">{headlineTitle}</Typography>\n          </div>\n        )}\n        {text && <p className={`textCtaText ${showPlayStore && 'isPlayStore'}`}>{text}</p>}\n        {listItems && listItems.length > 0 && (\n          <List className=\"textCtaList\">\n            {listItems.map((item, index) => {\n              return (\n                <ListItem key={'text-cta-list-item' + index} disableGutters>\n                  <Icon name={item.icon || 'check'} />\n                  {item.text}\n                </ListItem>\n              );\n            })}\n          </List>\n        )}\n        <div className=\"textCtaBtnGroup\">\n          {(!showAppStore || !showPlayStore) && (\n            <>\n              {showFirstButton && handleRenderBtn(firstButtonProps, onClickFirstBtn)}\n              {showSecondButton && handleRenderBtn(secondButtonProps, onClickSecondBtn)}\n            </>\n          )}\n          {(!showFirstButton || !showSecondButton) && (\n            <>\n              {showAppStore && (\n                <span className=\"appStoreBadge\" onClick={() => handleUrlClick(appStoreProps.url)}>\n                  <img src={appStoreProps.img} alt={appStoreProps.alt} />\n                </span>\n              )}\n              {showPlayStore && (\n                <span className=\"playStoreBadge\" dangerouslySetInnerHTML={{ __html: playStoreProps }}></span>\n              )}\n            </>\n          )}\n        </div>\n      </TextCtaContainerStyled>\n    );\n  },\n);\n\n//Set the correct font and lineheight depending on the prop variant passed\nconst getHeadlineStyle = (headlineVariant: variants) => {\n  switch (headlineVariant) {\n    case 'h1':\n      return {\n        fontSize: '44px',\n        lineHeight: '52px',\n      };\n    case 'h2':\n      return {\n        fontSize: '36px',\n        lineHeight: '44px',\n      };\n    case 'h3':\n      return {\n        fontSize: '30px',\n        lineHeight: '36px',\n      };\n    case 'h4':\n      return {\n        fontSize: '24px',\n        lineHeight: '28px',\n      };\n    default:\n      return {\n        fontSize: '18px',\n        lineHeight: '28px',\n      };\n  }\n};\n\n/**\n * @description Button styling defintion based on props\n */\nconst TextCtaContainerStyled = styled('div', {\n  shouldForwardProp: (prop) => prop !== 'listItems' && prop !== 'headlineVariant',\n})<TextCtaProps>(({ theme, ...args }) => {\n  let styles = {};\n\n  styles = {\n    '& > span': {\n      margin: 0,\n    },\n    '& > div.headlineContainer': {\n      marginBottom: '10px',\n      marginTop: '5px',\n      '& > .textCtaHeadline': {\n        fontWeight: 'bold',\n        ...getHeadlineStyle(args.headlineVariant),\n      },\n    },\n    '& > div.subheadlineContainer': {\n      marginBottom: '10px',\n      '& > .textCtaSubheadline': {\n        fontWeight: 'bold',\n        fontSize: '18px',\n        lineHeight: '28px',\n      },\n    },\n    '& > .textCtaList': {\n      marginBottom: '10px',\n    },\n    '& > .textCtaText': {\n      fontSize: '18px',\n      lineHeight: '28px',\n      margin: '12px 0 16px 0',\n      '&.isPlayStore': {\n        marginBottom: '2px',\n      },\n    },\n    '& > div.textCtaBtnGroup': {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'flex-start',\n      flexWrap: 'wrap',\n      '& > div': {\n        [theme.breakpoints.down('sm')]: {\n          width: '100%',\n        },\n      },\n      '& > .appStoreBadge': {\n        cursor: 'pointer',\n        marginRight: '8px',\n        '& > img': {\n          height: '40px',\n        },\n      },\n      '& > .playStoreBadge': {\n        cursor: 'pointer',\n        '& img': {\n          maxWidth: '153px',\n        },\n      },\n      '& .MuiButton-root': {\n        paddingLeft: '16px',\n        paddingRight: '16px',\n        paddingBottom: '2px',\n        fontSize: '14px',\n        minWidth: '93px',\n        height: '32px',\n        [theme.breakpoints.down('sm')]: {\n          height: '44px',\n          width: '100%',\n        },\n      },\n      '& .MuiButton-root:first-of-type': {\n        marginRight: '16px',\n        marginBottom: 0,\n        [theme.breakpoints.down('sm')]: {\n          marginBottom: '16px',\n        },\n      },\n    },\n    ' & > .MuiList-root': {\n      padding: '0px',\n      '& > .MuiListItem-root': {\n        padding: '0px 0px 6px 0px',\n\n        '& > .MuiIcon-root': {\n          width: '20px',\n          height: '24px',\n          fontSize: '14px',\n        },\n      },\n    },\n  };\n\n  return styles;\n});\n"],"names":["TextCta","forwardRef","_a","ref","label","headlineTitle","text","showFirstButton","showSecondButton","onClickFirstBtn","onClickSecondBtn","firstButtonProps","secondButtonProps","listItems","showAppStore","showPlayStore","appStoreProps","playStoreProps","props","__rest","handleUrlClick","useCallback","url","window","open","handleOnClickBtn","e","callback","handleRenderBtn","btnProps","onClickHandler","propsA","Object","assign","_jsx","Button","onClick","_jsxs","jsxs","TextCtaContainerStyled","Label","className","children","Typography","length","List","map","item","index","ListItem","disableGutters","jsx","Icon","name","icon","_Fragment","src","img","alt","dangerouslySetInnerHTML","__html","getHeadlineStyle","headlineVariant","fontSize","lineHeight","styled","shouldForwardProp","prop","theme","args","styles","margin","marginBottom","marginTop","fontWeight","display","alignItems","justifyContent","flexWrap","breakpoints","down","width","cursor","marginRight","height","maxWidth","paddingLeft","paddingRight","paddingBottom","minWidth","padding"],"mappings":"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"}
+{"version":3,"file":"textCta.js","sources":["../../../../../src/organisms/textCta/textCta.tsx"],"sourcesContent":["import React, { useCallback, forwardRef } from 'react';\nimport { Label } from '../../components/label';\nimport { List, ListItem, Typography, styled, ButtonBase } from '@mui/material';\nimport { Button, ButtonProps } from '../../components/button';\nimport { Icon, IconNameProp } from '../../components/icon';\n\nexport type variants = 'subHeadline' | 'h1' | 'h2' | 'h3' | 'h4';\n\nexport interface TextCtaProps {\n  /**\n   * label to be shown on the top of component\n   */\n  label?: string;\n\n  /**\n   * headline to be shown on the top of component\n   */\n  headlineTitle?: string;\n  /**\n   * headline type variant\n   */\n  headlineVariant?: variants;\n\n  /**\n   * text to be shown under headline/subheadline\n   */\n  text?: string;\n\n  /**\n   * Show the primary button if true. Must fill the firstButtonProps\n   */\n  showFirstButton?: boolean;\n\n  /**\n   * Show the secondary button if true. Must fill the secondButtonProps\n   */\n  showSecondButton?: boolean;\n\n  /**\n   * props primary button. Same of skoda button component\n   */\n  firstButtonProps?: ButtonProps & { url?: string };\n\n  /**\n   * props secondary button. Same of skoda button component\n   */\n  secondButtonProps?: ButtonProps & { url?: string };\n\n  /**\n   * callback on click primary button\n   */\n  onClickFirstBtn?: (e: unknown) => void;\n\n  /**\n   * callback on click secondary button\n   */\n  onClickSecondBtn?: (e: unknown) => void;\n\n  /**\n   * If true, shows the AppStore badge\n   */\n  showAppStore?: boolean;\n\n  /**\n   * If true, shows the PlayStore badge\n   */\n  showPlayStore?: boolean;\n\n  /**\n   * List items show icon and text\n   * default icon for list is the check,it's possible to configure using the icon name provide in the Icon component\n   */\n  listItems?: {\n    text?: string;\n    icon?: IconNameProp;\n  }[];\n\n  /**\n   *object appStore Badge:\n   * {url: \"url\",\talt: ' alt description image', img: 'image badges'}\n   */\n  appStoreProps?: Record<string, string>;\n\n  /**\n   * object playStore Badge\n   * {url: \"url\",\talt: ' alt description image', img: 'image badges'}\n   */\n  playStoreProps?: unknown;\n}\n\n/**\n * @deprecated use TextAndCta component instead\n */\nexport const TextCta = forwardRef<HTMLDivElement, TextCtaProps>(\n  (\n    {\n      label,\n      headlineTitle,\n      text,\n      showFirstButton = false,\n      showSecondButton = false,\n      onClickFirstBtn,\n      onClickSecondBtn,\n      firstButtonProps,\n      secondButtonProps,\n      listItems,\n      showAppStore = false,\n      showPlayStore = false,\n      appStoreProps,\n      playStoreProps,\n      ...props\n    },\n    ref,\n  ) => {\n    const handleUrlClick = useCallback((url) => {\n      window.open(url, '_blank');\n    }, []);\n\n    const handleOnClickBtn = useCallback(\n      (e: unknown, callback: (e: unknown) => void, url: string) => {\n        if (url) {\n          handleUrlClick(url);\n        }\n        callback && callback(e);\n      },\n      [handleUrlClick],\n    );\n\n    const handleRenderBtn = useCallback(\n      (btnProps: ButtonProps & { url?: string }, onClickHandler: (e: unknown) => void) => {\n        const propsA = {\n          ...btnProps,\n          url: btnProps.url || null,\n        };\n        return <Button {...propsA} onClick={(e) => handleOnClickBtn(e, onClickHandler, propsA.url)} />;\n      },\n      [handleOnClickBtn],\n    );\n\n    return (\n      <TextCtaContainerStyled ref={ref} listItems={listItems} {...props}>\n        {label && <Label label={label} />}\n        {headlineTitle && (\n          <div className=\"headlineContainer\">\n            <Typography className=\"textCtaHeadline\">{headlineTitle}</Typography>\n          </div>\n        )}\n        {text && <p className={`textCtaText ${showPlayStore && 'isPlayStore'}`}>{text}</p>}\n        {listItems && listItems.length > 0 && (\n          <List className=\"textCtaList\">\n            {listItems.map((item, index) => {\n              return (\n                <ListItem key={'text-cta-list-item' + index} disableGutters>\n                  <Icon name={item.icon || 'check'} />\n                  {item.text}\n                </ListItem>\n              );\n            })}\n          </List>\n        )}\n        <div className=\"textCtaBtnGroup\">\n          {(!showAppStore || !showPlayStore) && (\n            <>\n              {showFirstButton && handleRenderBtn(firstButtonProps, onClickFirstBtn)}\n              {showSecondButton && handleRenderBtn(secondButtonProps, onClickSecondBtn)}\n            </>\n          )}\n          {(!showFirstButton || !showSecondButton) && (\n            <>\n              {showAppStore && (\n                <ButtonBase className=\"appStoreBadge\" onClick={() => handleUrlClick(appStoreProps.url)}>\n                  <img src={appStoreProps.img} alt={appStoreProps.alt} />\n                </ButtonBase>\n              )}\n              {showPlayStore && (\n                <span className=\"playStoreBadge\" dangerouslySetInnerHTML={{ __html: playStoreProps }}></span>\n              )}\n            </>\n          )}\n        </div>\n      </TextCtaContainerStyled>\n    );\n  },\n);\n\n//Set the correct font and lineheight depending on the prop variant passed\nconst getHeadlineStyle = (headlineVariant: variants) => {\n  switch (headlineVariant) {\n    case 'h1':\n      return {\n        fontSize: '44px',\n        lineHeight: '52px',\n      };\n    case 'h2':\n      return {\n        fontSize: '36px',\n        lineHeight: '44px',\n      };\n    case 'h3':\n      return {\n        fontSize: '30px',\n        lineHeight: '36px',\n      };\n    case 'h4':\n      return {\n        fontSize: '24px',\n        lineHeight: '28px',\n      };\n    default:\n      return {\n        fontSize: '18px',\n        lineHeight: '28px',\n      };\n  }\n};\n\n/**\n * @description Button styling defintion based on props\n */\nconst TextCtaContainerStyled = styled('div', {\n  shouldForwardProp: (prop) => prop !== 'listItems' && prop !== 'headlineVariant',\n})<TextCtaProps>(({ theme, ...args }) => {\n  let styles = {};\n\n  styles = {\n    '& > span': {\n      margin: 0,\n    },\n    '& > div.headlineContainer': {\n      marginBottom: '10px',\n      marginTop: '5px',\n      '& > .textCtaHeadline': {\n        fontWeight: 'bold',\n        ...getHeadlineStyle(args.headlineVariant),\n      },\n    },\n    '& > div.subheadlineContainer': {\n      marginBottom: '10px',\n      '& > .textCtaSubheadline': {\n        fontWeight: 'bold',\n        fontSize: '18px',\n        lineHeight: '28px',\n      },\n    },\n    '& > .textCtaList': {\n      marginBottom: '10px',\n    },\n    '& > .textCtaText': {\n      fontSize: '18px',\n      lineHeight: '28px',\n      margin: '12px 0 16px 0',\n      '&.isPlayStore': {\n        marginBottom: '2px',\n      },\n    },\n    '& > div.textCtaBtnGroup': {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'flex-start',\n      flexWrap: 'wrap',\n      '& > div': {\n        [theme.breakpoints.down('sm')]: {\n          width: '100%',\n        },\n      },\n      '& > .appStoreBadge': {\n        cursor: 'pointer',\n        marginRight: '8px',\n        '& > img': {\n          height: '40px',\n        },\n      },\n      '& > .playStoreBadge': {\n        cursor: 'pointer',\n        '& img': {\n          maxWidth: '153px',\n        },\n      },\n      '& .MuiButton-root': {\n        paddingLeft: '16px',\n        paddingRight: '16px',\n        paddingBottom: '2px',\n        fontSize: '14px',\n        minWidth: '93px',\n        height: '32px',\n        [theme.breakpoints.down('sm')]: {\n          height: '44px',\n          width: '100%',\n        },\n      },\n      '& .MuiButton-root:first-of-type': {\n        marginRight: '16px',\n        marginBottom: 0,\n        [theme.breakpoints.down('sm')]: {\n          marginBottom: '16px',\n        },\n      },\n    },\n    ' & > .MuiList-root': {\n      padding: '0px',\n      '& > .MuiListItem-root': {\n        padding: '0px 0px 6px 0px',\n\n        '& > .MuiIcon-root': {\n          width: '20px',\n          height: '24px',\n          fontSize: '14px',\n        },\n      },\n    },\n  };\n\n  return styles;\n});\n"],"names":["TextCta","forwardRef","_a","ref","label","headlineTitle","text","showFirstButton","showSecondButton","onClickFirstBtn","onClickSecondBtn","firstButtonProps","secondButtonProps","listItems","showAppStore","showPlayStore","appStoreProps","playStoreProps","props","__rest","handleUrlClick","useCallback","url","window","open","handleOnClickBtn","e","callback","handleRenderBtn","btnProps","onClickHandler","propsA","Object","assign","_jsx","Button","onClick","_jsxs","jsxs","TextCtaContainerStyled","Label","className","children","Typography","length","List","map","item","index","ListItem","disableGutters","jsx","Icon","name","icon","_Fragment","ButtonBase","src","img","alt","dangerouslySetInnerHTML","__html","getHeadlineStyle","headlineVariant","fontSize","lineHeight","styled","shouldForwardProp","prop","theme","args","styles","margin","marginBottom","marginTop","fontWeight","display","alignItems","justifyContent","flexWrap","breakpoints","down","width","cursor","marginRight","height","maxWidth","paddingLeft","paddingRight","paddingBottom","minWidth","padding"],"mappings":"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"}

package/cjs/organisms/tile/tile.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("tslib"),t=require("react/jsx-runtime"),i=require("react"),a=require("@mui/system"),r=require("../../components/label/label.js"),l=require("@mui/material"),o=require("../common/menuCardComponent/menuCardComponent.js"),n=require("../../utils/utilities.js"),s=require("../../components/common/imageComponent.js");const p=a=>{var{tileContentPinned:p="top",isBorderRadius:m=!0,promotionalVariant:c="large"}=a,x=e.__rest(a,["tileContentPinned","isBorderRadius","promotionalVariant"]);const[u,h]=i.useState(!1),g=t.jsx("div",{className:"tileImage",children:x.tileImageURLOnHover&&u?t.jsx(s.default,{image:x.tileImageURLOnHover,alt:x.tileAltImage},"imageUrl_onHover"):t.jsx(s.default,{image:x.tileImageURL,alt:x.tileAltImage,fallbackImage:x.tileImageURLFallback},"imageUrl")}),b=t.jsxs("div",{className:"tilePriceWrapper",children:[x.tilePriceTotal&&t.jsx("span",{className:"disclaimer tilePriceTotal",children:x.tilePriceTotal}),x.tilePriceTotal&&x.tilePriceMonth&&t.jsx(l.Divider,{orientation:"vertical",flexItem:!0}),x.tilePriceMonth&&t.jsx("span",{className:"disclaimer tilePriceMonth",children:x.tilePriceMonth})]});return t.jsx(d,{promotionalLabel:x.promotionalLabel,isBorderRadius:m,tileContentPinned:p,children:t.jsxs("div",{className:"tileWrapper",onMouseEnter:()=>{u||h(!0)},onMouseLeave:()=>{h(!1)},children:[x.isMenuDropdown&&t.jsx("div",{className:"tileDropdownMenu",onMouseEnter:()=>h(!1),onMouseLeave:()=>h(!0),children:t.jsx(o.default,Object.assign({},x.menuCardComponentProps))}),x.promotionalLabel&&t.jsx("div",{className:"tilePromotionalLabel",children:t.jsx(r.Label,{type:"promotional",variant:c,label:n.handleMaxChars(x.promotionalLabel,30)})}),"bottom"===p&&g,t.jsxs("div",{className:"tileContent",children:[x.generalLabel&&t.jsx("div",{className:"tileGeneralLabel",children:t.jsx(r.Label,{label:n.handleMaxChars(x.generalLabel,30)})}),t.jsx("h4",{className:"tileTitle",children:n.handleMaxChars(x.title,20)}),x.featureLabel&&t.jsx("div",{className:"tileFeatureLabel",children:t.jsx(r.Label,{type:"feature",variant:x.featureLabelVariant,label:n.handleMaxChars(x.featureLabel,30)})}),"bottom"===p&&b]}),"top"===p&&g,"top"===p&&b]})})};p.defaultProps={isBorderRadius:!0,promotionalVariant:"large"};const d=a.styled("div")((t=>{var{theme:i}=t,a=e.__rest(t,["theme"]);let r={};const{tileContentPinned:l,promotionalLabel:o,isBorderRadius:n}=a;return r={height:"100%","& .tileWrapper, & .tileWrapper *":{boxSizing:"border-box"},"& .tileWrapper":{position:"relative",borderRadius:n?"8px":0,height:"100%",display:"flex",flexDirection:"column",justifyContent:"space-between",backgroundColor:i.palette.surface.primary,padding:"0 0 24px 0",border:`1px solid ${i.palette.surface.secondary}`},"& .tileDropdownMenu":{position:"absolute",right:0,top:0,".menuCardComponent":{top:0,right:0,width:"58px",height:"58px",display:"flex",alignItems:"center",justifyContent:"center"}},"& .tileContent":{paddingTop:o?"40px":"16px"},"& .tilePromotionalLabel":{width:"100%",maxWidth:"calc(100% - 64px)",position:"absolute",top:"0",left:"0"},"& .tileGeneralLabel":{padding:"0 24px",marginBottom:"0",position:"relative",zIndex:"1","& span":{margin:"0"}},"& .tileTitle":{margin:"0 0 6px 0",padding:"0 24px",position:"relative",zIndex:"1"},"& .tileFeatureLabel":{margin:"0",padding:"0 24px",position:"relative",zIndex:"1","& span":{margin:"0"}},"& .tileImage":{height:"176px",marginTop:"top"===l?"-32px":"16px",marginBottom:"bottom"===l?"-32px":"0",[i.breakpoints.up("md")]:{height:"200px"},[i.breakpoints.up("lg")]:{height:"186px"},[i.breakpoints.up("xl")]:{height:"265px"},"& img":{position:"relative",zIndex:"0",objectFit:"contain",objectPosition:"center",display:"block",height:"100%",width:"100%"}},"& .tilePriceWrapper":{display:"flex",flexDirection:"row",flexWrap:"wrap",width:"100%",padding:"0 24px",marginTop:"bottom"===l?"8px":"0","& .tilePriceTotal":{fontWeight:"bold"},"& hr":{margin:"0 8px",borderColor:i.palette.transparent.secondary}}},r}));exports.Tile=p;
+"use strict";var e=require("tslib"),t=require("react/jsx-runtime"),i=require("react"),a=require("@mui/material/styles"),r=require("../../components/label/label.js"),l=require("@mui/material"),o=require("../common/menuCardComponent/menuCardComponent.js"),n=require("../../utils/utilities.js"),s=require("../../components/common/imageComponent.js");const p=a=>{var{tileContentPinned:p="top",isBorderRadius:m=!0,promotionalVariant:c="large"}=a,x=e.__rest(a,["tileContentPinned","isBorderRadius","promotionalVariant"]);const[u,h]=i.useState(!1),g=t.jsx("div",{className:"tileImage",children:x.tileImageURLOnHover&&u?t.jsx(s.default,{image:x.tileImageURLOnHover,alt:x.tileAltImage},"imageUrl_onHover"):t.jsx(s.default,{image:x.tileImageURL,alt:x.tileAltImage,fallbackImage:x.tileImageURLFallback},"imageUrl")}),b=t.jsxs("div",{className:"tilePriceWrapper",children:[x.tilePriceTotal&&t.jsx("span",{className:"disclaimer tilePriceTotal",children:x.tilePriceTotal}),x.tilePriceTotal&&x.tilePriceMonth&&t.jsx(l.Divider,{orientation:"vertical",flexItem:!0}),x.tilePriceMonth&&t.jsx("span",{className:"disclaimer tilePriceMonth",children:x.tilePriceMonth})]});return t.jsx(d,{promotionalLabel:x.promotionalLabel,isBorderRadius:m,tileContentPinned:p,children:t.jsxs(l.ButtonBase,{className:"tileWrapper",onMouseEnter:()=>{u||h(!0)},onMouseLeave:()=>{h(!1)},onClick:()=>h((e=>!e)),children:[x.isMenuDropdown&&t.jsx(l.ButtonBase,{className:"tileDropdownMenu",onMouseEnter:()=>h(!1),onMouseLeave:()=>h(!0),children:t.jsx(o.default,Object.assign({},x.menuCardComponentProps))}),x.promotionalLabel&&t.jsx("div",{className:"tilePromotionalLabel",children:t.jsx(r.Label,{type:"promotional",variant:c,label:n.handleMaxChars(x.promotionalLabel,30)})}),"bottom"===p&&g,t.jsxs("div",{className:"tileContent",children:[x.generalLabel&&t.jsx("div",{className:"tileGeneralLabel",children:t.jsx(r.Label,{label:n.handleMaxChars(x.generalLabel,30)})}),t.jsx("h4",{className:"tileTitle",children:n.handleMaxChars(x.title,20)}),x.featureLabel&&t.jsx("div",{className:"tileFeatureLabel",children:t.jsx(r.Label,{type:"feature",variant:x.featureLabelVariant,label:n.handleMaxChars(x.featureLabel,30)})}),"bottom"===p&&b]}),"top"===p&&g,"top"===p&&b]})})};p.defaultProps={isBorderRadius:!0,promotionalVariant:"large"};const d=a.styled("div")((t=>{var{theme:i}=t,a=e.__rest(t,["theme"]);let r={};const{tileContentPinned:l,promotionalLabel:o,isBorderRadius:n}=a;return r={height:"100%","& .tileWrapper, & .tileWrapper *":{boxSizing:"border-box"},"& .tileWrapper":{position:"relative",borderRadius:n?"8px":0,height:"100%",display:"flex",flexDirection:"column",justifyContent:"space-between",backgroundColor:i.palette.surface.primary,padding:"0 0 24px 0",border:`1px solid ${i.palette.surface.secondary}`},"& .tileDropdownMenu":{position:"absolute",right:0,top:0,".menuCardComponent":{top:0,right:0,width:"58px",height:"58px",display:"flex",alignItems:"center",justifyContent:"center"}},"& .tileContent":{paddingTop:o?"40px":"16px"},"& .tilePromotionalLabel":{width:"100%",maxWidth:"calc(100% - 64px)",position:"absolute",top:"0",left:"0"},"& .tileGeneralLabel":{padding:"0 24px",marginBottom:"0",position:"relative",zIndex:"1","& span":{margin:"0"}},"& .tileTitle":{margin:"0 0 6px 0",padding:"0 24px",position:"relative",zIndex:"1"},"& .tileFeatureLabel":{margin:"0",padding:"0 24px",position:"relative",zIndex:"1","& span":{margin:"0"}},"& .tileImage":{height:"176px",marginTop:"top"===l?"-32px":"16px",marginBottom:"bottom"===l?"-32px":"0",[i.breakpoints.up("md")]:{height:"200px"},[i.breakpoints.up("lg")]:{height:"186px"},[i.breakpoints.up("xl")]:{height:"265px"},"& img":{position:"relative",zIndex:"0",objectFit:"contain",objectPosition:"center",display:"block",height:"100%",width:"100%"}},"& .tilePriceWrapper":{display:"flex",flexDirection:"row",flexWrap:"wrap",width:"100%",padding:"0 24px",marginTop:"bottom"===l?"8px":"0","& .tilePriceTotal":{fontWeight:"bold"},"& hr":{margin:"0 8px",borderColor:i.palette.transparent.secondary}}},r}));exports.Tile=p;
 //# sourceMappingURL=tile.js.map

package/cjs/organisms/tile/tile.js.map

@@ -1 +1 @@
-{"version":3,"file":"tile.js","sources":["../../../../../src/organisms/tile/tile.tsx"],"sourcesContent":["import React, { useState, HTMLAttributes, FC } from 'react';\nimport { styled } from '@mui/system';\nimport { Label } from '../../components/label';\nimport { Divider } from '@mui/material';\nimport MenuCardComponent, { MenuCardComponentProps } from '../common/menuCardComponent/menuCardComponent';\nimport { handleMaxChars } from '../../utils/utilities';\nimport ImageComponent from '../../components/common/imageComponent';\n\n/**\n * @interface TileStylingProps\n * @description The props of the tile component that are additionally used for styling.\n */\n\nexport interface TileStylingProps {\n  /**\n   * Style with or without the border radius\n   */\n  isBorderRadius?: boolean;\n  /**\n   * tile Text pinned position\n   */\n  tileContentPinned?: 'top' | 'bottom';\n  /**\n   * Promotional Label text\n   */\n  promotionalLabel?: string;\n  /**\n   * Promotional Label text\n   */\n  promotionalVariant?: 'large' | 'small';\n}\n\n/**\n * @interface TileProps\n * @description  Properties are inherited from HTML div element and TileStylingProps interface.\n */\nexport interface TileProps extends TileStylingProps, HTMLAttributes<HTMLDivElement> {\n  /**\n   * If true the menu dropdown is showing\n   */\n  isMenuDropdown?: boolean;\n  /**\n   * General Label\n   */\n  generalLabel?: string;\n  /**\n   * Title name text\n   */\n  title?: string;\n  /**\n   * Feature Label\n   */\n  featureLabel?: string;\n  /**\n   * Feature Label Variant\n   */\n  featureLabelVariant?: 'primary' | 'neutral' | 'secondary';\n  /**\n   * URL image\n   */\n  tileImageURL: string;\n  /**\n   *  The source of the onError image.\n   */\n  tileImageURLFallback?: string;\n  /**\n   * URL image\n   */\n  tileAltImage?: string;\n  /**\n   * URL image which apply on hover if is changeImageOnHover is true\n   */\n  tileImageURLOnHover?: string;\n  /**\n   * tile feature info total price\n   */\n  tilePriceTotal?: string;\n  /**\n   * tile feature info monthly price\n   */\n  tilePriceMonth?: string;\n  /**\n   * MenuCardComponent props.\n   */\n  menuCardComponentProps?: MenuCardComponentProps;\n}\n\n/**\n * @description SkodaFlow CardPhotoFixed component.\n * Properties are inherited from HTML Div element.\n * @param props CardPhotoFixedProps\n * @returns React Functional Component\n * @deprecated\n */\n\nexport const Tile: FC<TileProps> = ({\n  tileContentPinned = 'top',\n  isBorderRadius = true,\n  promotionalVariant = 'large',\n  ...props\n}) => {\n  const [isMouseOver, setIsMouseOver] = useState(false);\n  const handleMouseEnter = () => {\n    if (!isMouseOver) {\n      setIsMouseOver(true);\n    }\n  };\n\n  const handleMouseLeave = () => {\n    setIsMouseOver(false);\n  };\n\n  const tileImageElement = (\n    <div className=\"tileImage\">\n      {props.tileImageURLOnHover && isMouseOver ? (\n        <ImageComponent key={'imageUrl_onHover'} image={props.tileImageURLOnHover} alt={props.tileAltImage} />\n      ) : (\n        <ImageComponent\n          key={'imageUrl'}\n          image={props.tileImageURL}\n          alt={props.tileAltImage}\n          fallbackImage={props.tileImageURLFallback}\n        />\n      )}\n    </div>\n  );\n  const pricingElement = (\n    <div className=\"tilePriceWrapper\">\n      {props.tilePriceTotal && <span className=\"disclaimer tilePriceTotal\">{props.tilePriceTotal}</span>}\n      {props.tilePriceTotal && props.tilePriceMonth && <Divider orientation=\"vertical\" flexItem />}\n      {props.tilePriceMonth && <span className=\"disclaimer tilePriceMonth\">{props.tilePriceMonth}</span>}\n    </div>\n  );\n\n  return (\n    <TileStyled\n      promotionalLabel={props.promotionalLabel}\n      isBorderRadius={isBorderRadius}\n      tileContentPinned={tileContentPinned}\n    >\n      <div className=\"tileWrapper\" onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave}>\n        {props.isMenuDropdown && (\n          <div\n            className=\"tileDropdownMenu\"\n            onMouseEnter={() => setIsMouseOver(false)}\n            onMouseLeave={() => setIsMouseOver(true)}\n          >\n            <MenuCardComponent {...props.menuCardComponentProps} />\n          </div>\n        )}\n        {props.promotionalLabel && (\n          <div className=\"tilePromotionalLabel\">\n            <Label type=\"promotional\" variant={promotionalVariant} label={handleMaxChars(props.promotionalLabel, 30)} />\n          </div>\n        )}\n        {tileContentPinned === 'bottom' && tileImageElement}\n        <div className=\"tileContent\">\n          {props.generalLabel && (\n            <div className=\"tileGeneralLabel\">\n              <Label label={handleMaxChars(props.generalLabel, 30)} />\n            </div>\n          )}\n          <h4 className=\"tileTitle\">{handleMaxChars(props.title, 20)}</h4>\n          {props.featureLabel && (\n            <div className=\"tileFeatureLabel\">\n              <Label\n                type=\"feature\"\n                variant={props.featureLabelVariant}\n                label={handleMaxChars(props.featureLabel, 30)}\n              />\n            </div>\n          )}\n          {tileContentPinned === 'bottom' && pricingElement}\n        </div>\n        {tileContentPinned === 'top' && tileImageElement}\n        {tileContentPinned === 'top' && pricingElement}\n      </div>\n    </TileStyled>\n  );\n};\n\nTile.defaultProps = {\n  isBorderRadius: true,\n  promotionalVariant: 'large',\n};\nconst TileStyled = styled('div')<TileStylingProps & { theme? }>(({ theme, ...args }) => {\n  let styles = {};\n  const { tileContentPinned, promotionalLabel, isBorderRadius } = args;\n\n  styles = {\n    height: '100%',\n    '& .tileWrapper, & .tileWrapper *': {\n      boxSizing: 'border-box',\n    },\n    '& .tileWrapper': {\n      position: 'relative',\n      borderRadius: isBorderRadius ? '8px' : 0,\n      height: '100%',\n      display: 'flex',\n      flexDirection: 'column',\n      justifyContent: 'space-between',\n      backgroundColor: theme.palette.surface.primary,\n      padding: '0 0 24px 0',\n      border: `1px solid ${theme.palette.surface.secondary}`,\n    },\n    '& .tileDropdownMenu': {\n      position: 'absolute',\n      right: 0,\n      top: 0,\n      '.menuCardComponent': {\n        top: 0,\n        right: 0,\n        width: '58px',\n        height: '58px',\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n      },\n    },\n    '& .tileContent': {\n      paddingTop: promotionalLabel ? '40px' : '16px',\n    },\n    '& .tilePromotionalLabel': {\n      width: '100%',\n      maxWidth: 'calc(100% - 64px)',\n      position: 'absolute',\n      top: '0',\n      left: '0',\n    },\n    '& .tileGeneralLabel': {\n      padding: '0 24px',\n      marginBottom: '0',\n      position: 'relative',\n      zIndex: '1',\n      '& span': {\n        margin: '0',\n      },\n    },\n    '& .tileTitle': {\n      margin: '0 0 6px 0',\n      padding: '0 24px',\n      position: 'relative',\n      zIndex: '1',\n    },\n    '& .tileFeatureLabel': {\n      margin: '0',\n      padding: '0 24px',\n      position: 'relative',\n      zIndex: '1',\n      '& span': {\n        margin: '0',\n      },\n    },\n    '& .tileImage': {\n      height: '176px',\n      marginTop: tileContentPinned === 'top' ? '-32px' : '16px',\n      marginBottom: tileContentPinned === 'bottom' ? '-32px' : '0',\n      [theme.breakpoints.up('md')]: {\n        height: '200px',\n      },\n      [theme.breakpoints.up('lg')]: {\n        height: '186px',\n      },\n      [theme.breakpoints.up('xl')]: {\n        height: '265px',\n      },\n      '& img': {\n        position: 'relative',\n        zIndex: '0',\n        objectFit: 'contain',\n        objectPosition: 'center',\n        display: 'block',\n        height: '100%',\n        width: '100%',\n      },\n    },\n    '& .tilePriceWrapper': {\n      display: 'flex',\n      flexDirection: 'row',\n      flexWrap: 'wrap',\n      width: '100%',\n      padding: '0 24px',\n      marginTop: tileContentPinned === 'bottom' ? '8px' : '0',\n      '& .tilePriceTotal': {\n        fontWeight: 'bold',\n      },\n      '& hr': {\n        margin: '0 8px',\n        borderColor: theme.palette.transparent.secondary,\n      },\n    },\n  };\n\n  return styles;\n});\n"],"names":["Tile","_a","tileContentPinned","isBorderRadius","promotionalVariant","props","__rest","isMouseOver","setIsMouseOver","useState","tileImageElement","_jsx","className","children","tileImageURLOnHover","jsx","ImageComponent","image","alt","tileAltImage","tileImageURL","fallbackImage","tileImageURLFallback","pricingElement","_jsxs","jsxs","tilePriceTotal","tilePriceMonth","Divider","orientation","flexItem","TileStyled","promotionalLabel","onMouseEnter","onMouseLeave","isMenuDropdown","MenuCardComponent","Object","assign","menuCardComponentProps","Label","type","variant","label","handleMaxChars","generalLabel","title","featureLabel","featureLabelVariant","defaultProps","styled","theme","args","styles","height","boxSizing","position","borderRadius","display","flexDirection","justifyContent","backgroundColor","palette","surface","primary","padding","border","secondary","right","top","width","alignItems","paddingTop","maxWidth","left","marginBottom","zIndex","margin","marginTop","breakpoints","up","objectFit","objectPosition","flexWrap","fontWeight","borderColor","transparent"],"mappings":"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"}
+{"version":3,"file":"tile.js","sources":["../../../../../src/organisms/tile/tile.tsx"],"sourcesContent":["import React, { useState, HTMLAttributes, FC } from 'react';\nimport { styled } from '@mui/material/styles';\nimport { Label } from '../../components/label';\nimport { Divider, ButtonBase } from '@mui/material';\nimport MenuCardComponent, { MenuCardComponentProps } from '../common/menuCardComponent/menuCardComponent';\nimport { handleMaxChars } from '../../utils/utilities';\nimport ImageComponent from '../../components/common/imageComponent';\n\n/**\n * @interface TileStylingProps\n * @description The props of the tile component that are additionally used for styling.\n */\n\nexport interface TileStylingProps {\n  /**\n   * Style with or without the border radius\n   */\n  isBorderRadius?: boolean;\n  /**\n   * tile Text pinned position\n   */\n  tileContentPinned?: 'top' | 'bottom';\n  /**\n   * Promotional Label text\n   */\n  promotionalLabel?: string;\n  /**\n   * Promotional Label text\n   */\n  promotionalVariant?: 'large' | 'small';\n}\n\n/**\n * @interface TileProps\n * @description  Properties are inherited from HTML div element and TileStylingProps interface.\n */\nexport interface TileProps extends TileStylingProps, HTMLAttributes<HTMLDivElement> {\n  /**\n   * If true the menu dropdown is showing\n   */\n  isMenuDropdown?: boolean;\n  /**\n   * General Label\n   */\n  generalLabel?: string;\n  /**\n   * Title name text\n   */\n  title?: string;\n  /**\n   * Feature Label\n   */\n  featureLabel?: string;\n  /**\n   * Feature Label Variant\n   */\n  featureLabelVariant?: 'primary' | 'neutral' | 'secondary';\n  /**\n   * URL image\n   */\n  tileImageURL: string;\n  /**\n   *  The source of the onError image.\n   */\n  tileImageURLFallback?: string;\n  /**\n   * URL image\n   */\n  tileAltImage?: string;\n  /**\n   * URL image which apply on hover if is changeImageOnHover is true\n   */\n  tileImageURLOnHover?: string;\n  /**\n   * tile feature info total price\n   */\n  tilePriceTotal?: string;\n  /**\n   * tile feature info monthly price\n   */\n  tilePriceMonth?: string;\n  /**\n   * MenuCardComponent props.\n   */\n  menuCardComponentProps?: MenuCardComponentProps;\n}\n\n/**\n * @description SkodaFlow CardPhotoFixed component.\n * Properties are inherited from HTML Div element.\n * @param props CardPhotoFixedProps\n * @returns React Functional Component\n * @deprecated\n */\n\nexport const Tile: FC<TileProps> = ({\n  tileContentPinned = 'top',\n  isBorderRadius = true,\n  promotionalVariant = 'large',\n  ...props\n}) => {\n  const [isMouseOver, setIsMouseOver] = useState(false);\n  const handleMouseEnter = () => {\n    if (!isMouseOver) {\n      setIsMouseOver(true);\n    }\n  };\n\n  const handleMouseLeave = () => {\n    setIsMouseOver(false);\n  };\n\n  const tileImageElement = (\n    <div className=\"tileImage\">\n      {props.tileImageURLOnHover && isMouseOver ? (\n        <ImageComponent key={'imageUrl_onHover'} image={props.tileImageURLOnHover} alt={props.tileAltImage} />\n      ) : (\n        <ImageComponent\n          key={'imageUrl'}\n          image={props.tileImageURL}\n          alt={props.tileAltImage}\n          fallbackImage={props.tileImageURLFallback}\n        />\n      )}\n    </div>\n  );\n  const pricingElement = (\n    <div className=\"tilePriceWrapper\">\n      {props.tilePriceTotal && <span className=\"disclaimer tilePriceTotal\">{props.tilePriceTotal}</span>}\n      {props.tilePriceTotal && props.tilePriceMonth && <Divider orientation=\"vertical\" flexItem />}\n      {props.tilePriceMonth && <span className=\"disclaimer tilePriceMonth\">{props.tilePriceMonth}</span>}\n    </div>\n  );\n\n  return (\n    <TileStyled\n      promotionalLabel={props.promotionalLabel}\n      isBorderRadius={isBorderRadius}\n      tileContentPinned={tileContentPinned}\n    >\n      <ButtonBase\n        className=\"tileWrapper\"\n        onMouseEnter={handleMouseEnter}\n        onMouseLeave={handleMouseLeave}\n        onClick={() => setIsMouseOver((prev) => !prev)}\n      >\n        {props.isMenuDropdown && (\n          <ButtonBase\n            className=\"tileDropdownMenu\"\n            onMouseEnter={() => setIsMouseOver(false)}\n            onMouseLeave={() => setIsMouseOver(true)}\n          >\n            <MenuCardComponent {...props.menuCardComponentProps} />\n          </ButtonBase>\n        )}\n        {props.promotionalLabel && (\n          <div className=\"tilePromotionalLabel\">\n            <Label type=\"promotional\" variant={promotionalVariant} label={handleMaxChars(props.promotionalLabel, 30)} />\n          </div>\n        )}\n        {tileContentPinned === 'bottom' && tileImageElement}\n        <div className=\"tileContent\">\n          {props.generalLabel && (\n            <div className=\"tileGeneralLabel\">\n              <Label label={handleMaxChars(props.generalLabel, 30)} />\n            </div>\n          )}\n          <h4 className=\"tileTitle\">{handleMaxChars(props.title, 20)}</h4>\n          {props.featureLabel && (\n            <div className=\"tileFeatureLabel\">\n              <Label\n                type=\"feature\"\n                variant={props.featureLabelVariant}\n                label={handleMaxChars(props.featureLabel, 30)}\n              />\n            </div>\n          )}\n          {tileContentPinned === 'bottom' && pricingElement}\n        </div>\n        {tileContentPinned === 'top' && tileImageElement}\n        {tileContentPinned === 'top' && pricingElement}\n      </ButtonBase>\n    </TileStyled>\n  );\n};\n\nTile.defaultProps = {\n  isBorderRadius: true,\n  promotionalVariant: 'large',\n};\nconst TileStyled = styled('div')<TileStylingProps & { theme? }>(({ theme, ...args }) => {\n  let styles = {};\n  const { tileContentPinned, promotionalLabel, isBorderRadius } = args;\n\n  styles = {\n    height: '100%',\n    '& .tileWrapper, & .tileWrapper *': {\n      boxSizing: 'border-box',\n    },\n    '& .tileWrapper': {\n      position: 'relative',\n      borderRadius: isBorderRadius ? '8px' : 0,\n      height: '100%',\n      display: 'flex',\n      flexDirection: 'column',\n      justifyContent: 'space-between',\n      backgroundColor: theme.palette.surface.primary,\n      padding: '0 0 24px 0',\n      border: `1px solid ${theme.palette.surface.secondary}`,\n    },\n    '& .tileDropdownMenu': {\n      position: 'absolute',\n      right: 0,\n      top: 0,\n      '.menuCardComponent': {\n        top: 0,\n        right: 0,\n        width: '58px',\n        height: '58px',\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n      },\n    },\n    '& .tileContent': {\n      paddingTop: promotionalLabel ? '40px' : '16px',\n    },\n    '& .tilePromotionalLabel': {\n      width: '100%',\n      maxWidth: 'calc(100% - 64px)',\n      position: 'absolute',\n      top: '0',\n      left: '0',\n    },\n    '& .tileGeneralLabel': {\n      padding: '0 24px',\n      marginBottom: '0',\n      position: 'relative',\n      zIndex: '1',\n      '& span': {\n        margin: '0',\n      },\n    },\n    '& .tileTitle': {\n      margin: '0 0 6px 0',\n      padding: '0 24px',\n      position: 'relative',\n      zIndex: '1',\n    },\n    '& .tileFeatureLabel': {\n      margin: '0',\n      padding: '0 24px',\n      position: 'relative',\n      zIndex: '1',\n      '& span': {\n        margin: '0',\n      },\n    },\n    '& .tileImage': {\n      height: '176px',\n      marginTop: tileContentPinned === 'top' ? '-32px' : '16px',\n      marginBottom: tileContentPinned === 'bottom' ? '-32px' : '0',\n      [theme.breakpoints.up('md')]: {\n        height: '200px',\n      },\n      [theme.breakpoints.up('lg')]: {\n        height: '186px',\n      },\n      [theme.breakpoints.up('xl')]: {\n        height: '265px',\n      },\n      '& img': {\n        position: 'relative',\n        zIndex: '0',\n        objectFit: 'contain',\n        objectPosition: 'center',\n        display: 'block',\n        height: '100%',\n        width: '100%',\n      },\n    },\n    '& .tilePriceWrapper': {\n      display: 'flex',\n      flexDirection: 'row',\n      flexWrap: 'wrap',\n      width: '100%',\n      padding: '0 24px',\n      marginTop: tileContentPinned === 'bottom' ? '8px' : '0',\n      '& .tilePriceTotal': {\n        fontWeight: 'bold',\n      },\n      '& hr': {\n        margin: '0 8px',\n        borderColor: theme.palette.transparent.secondary,\n      },\n    },\n  };\n\n  return styles;\n});\n"],"names":["Tile","_a","tileContentPinned","isBorderRadius","promotionalVariant","props","__rest","isMouseOver","setIsMouseOver","useState","tileImageElement","_jsx","className","children","tileImageURLOnHover","jsx","ImageComponent","image","alt","tileAltImage","tileImageURL","fallbackImage","tileImageURLFallback","pricingElement","_jsxs","jsxs","tilePriceTotal","tilePriceMonth","Divider","orientation","flexItem","TileStyled","promotionalLabel","ButtonBase","onMouseEnter","onMouseLeave","onClick","prev","isMenuDropdown","MenuCardComponent","Object","assign","menuCardComponentProps","Label","type","variant","label","handleMaxChars","generalLabel","title","featureLabel","featureLabelVariant","defaultProps","styled","theme","args","styles","height","boxSizing","position","borderRadius","display","flexDirection","justifyContent","backgroundColor","palette","surface","primary","padding","border","secondary","right","top","width","alignItems","paddingTop","maxWidth","left","marginBottom","zIndex","margin","marginTop","breakpoints","up","objectFit","objectPosition","flexWrap","fontWeight","borderColor","transparent"],"mappings":"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"}

package/cjs/production/Button/Button.js

@@ -1,4 +1,4 @@
-"use strict";var o=require("tslib"),r=require("react/jsx-runtime"),e=require("@mui/material"),n=require("@mui/system");const a=n.keyframes`
+"use strict";var o=require("tslib"),r=require("react/jsx-runtime"),e=require("@mui/material"),n=require("@mui/material/styles");const a=n.keyframes`
   0% { background-color: #43861D; }
   50% { background-color: #96DC6F; }
   100% {background-color: #43861D; }

package/cjs/production/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../../../../src/production/Button/Button.tsx"],"sourcesContent":["import { Button as MuiButton, ButtonProps as MuiButtonProps, styled } from '@mui/material';\nimport React from 'react';\nimport { keyframes } from '@mui/system';\n\nconst greenBlink = keyframes`\n  0% { background-color: #43861D; }\n  50% { background-color: #96DC6F; }\n  100% {background-color: #43861D; }\n`;\nconst orangeBlink = keyframes`\n  0% { background-color: #DE7C13; }\n  50% { background-color: #F2B879; }\n  100% {background-color: #DE7C13; }\n`;\nconst redBlink = keyframes`\n  0% { background-color: #CE332A; }\n  50% { background-color: #EC908B; }\n  100% {background-color: #CE332A; }\n`;\nconst blueBlink = keyframes`\n  0% { background-color: #2A78CD; }\n  50% { background-color: #80B1E5; }\n  100% {background-color: #2A78CD; }\n`;\nconst whiteBlink = keyframes`\n  0% { background-color: #fff; }\n  50% { background-color: #D8D8D8; }\n  100% {background-color: #fff; }\n`;\nconst darkBlink = keyframes`\n  0% { border-color: #161718; }\n  50% { border-color: #D8D8D8; }\n  100% {border-color: #161718; }\n`;\nconst lightBlink = keyframes`\n0% { border-color: #eee; }\n50% { border-color: #454546; }\n100% {border-color: #eee; }\n`;\nconst disabledBlink = keyframes`\n  0% { background-color: #D8D8D8; }\n  50% { background-color: #EEEEEE; }\n  100% {background-color: #D8D8D8; }\n`;\n\nexport type ButtonProps = Omit<\n  MuiButtonProps,\n  'nonce' | 'color' | 'disableElevation' | 'disableFocusRipple' | 'disableRipple' | 'classes' | 'variant'\n> & {\n  blinking?: boolean;\n  variant?: 'success' | 'warning' | 'alert' | 'info' | 'white' | 'dark' | 'light';\n};\n\nconst ButtonBase: React.FC<ButtonProps> = ({ blinking, variant, ...props }) => <MuiButton {...props} variant=\"text\" />;\n\n/**\n * @deprecated use production components from production web library\n *  https://www.npmjs.com/package/@skodaflow/production-web-library\n */\n// eslint-disable-next-line sonarjs/cognitive-complexity\nexport const Button = styled(ButtonBase)<ButtonProps>(({ theme, variant = 'success', blinking, disabled }) => ({\n  minWidth: '150px',\n  color: theme.palette.common.white,\n\n  ...(variant === 'success' && {\n    backgroundColor: '#43861D',\n    '&:hover': {\n      backgroundColor: '#55a628',\n    },\n    ...(blinking && {\n      animation: `${greenBlink} 1s infinite ${theme.transitions.easing.easeInOut}`,\n    }),\n  }),\n\n  ...(variant === 'warning' && {\n    backgroundColor: '#DE7C13',\n    '&:hover': {\n      backgroundColor: '#df8f38',\n    },\n    ...(blinking && {\n      animation: `${orangeBlink} 1s infinite ${theme.transitions.easing.easeInOut}`,\n    }),\n  }),\n\n  ...(variant === 'alert' && {\n    backgroundColor: '#CE332A',\n    '&:hover': {\n      backgroundColor: '#d84a42',\n    },\n    ...(blinking && {\n      animation: `${redBlink} 1s infinite ${theme.transitions.easing.easeInOut}`,\n    }),\n  }),\n\n  ...(variant === 'info' && {\n    backgroundColor: '#2A78CD',\n    '&:hover': {\n      backgroundColor: '#4a8fdb',\n    },\n    ...(blinking && {\n      animation: `${blueBlink} 1s infinite ${theme.transitions.easing.easeInOut}`,\n    }),\n  }),\n\n  ...(variant === 'white' && {\n    backgroundColor: theme.palette.common.white,\n    color: theme.palette.text.primary,\n    '&:hover': {\n      backgroundColor: '#e1e1e1',\n    },\n    border: `2px solid ${theme.palette.text.primary}`,\n    ...(blinking && {\n      animation: `${whiteBlink} 1s infinite ${theme.transitions.easing.easeInOut}`,\n    }),\n  }),\n\n  ...(variant === 'dark' && {\n    backgroundColor: 'transparent',\n    border: `2px solid #161718`,\n    color: theme.palette.text.primary,\n    ...(blinking && {\n      animation: `${darkBlink} 1s infinite ${theme.transitions.easing.easeInOut}`,\n    }),\n  }),\n\n  ...(variant === 'light' && {\n    backgroundColor: 'transparent',\n    border: `2px solid ${theme.palette.common.white}`,\n    ...(blinking && {\n      animation: `${lightBlink} 1s infinite ${theme.transitions.easing.easeInOut}`,\n    }),\n  }),\n\n  ...(disabled && {\n    backgroundColor: '#D8D8D8',\n    color: theme.palette.action.disabled,\n    borderColor: theme.palette.action.disabled,\n    ...(blinking && {\n      animation: `${disabledBlink} 1s infinite ${theme.transitions.easing.easeInOut}`,\n    }),\n  }),\n}));\n"],"names":["greenBlink","keyframes","orangeBlink","redBlink","blueBlink","whiteBlink","darkBlink","lightBlink","disabledBlink","Button","styled","_a","blinking","variant","props","__rest","_jsx","jsx","MuiButton","Object","assign","theme","disabled","minWidth","color","palette","common","white","backgroundColor","animation","transitions","easing","easeInOut","text","primary","border","action","borderColor"],"mappings":"uHAIA,MAAMA,EAAaC,EAAAA,SAAS;;;;EAKtBC,EAAcD,EAAAA,SAAS;;;;EAKvBE,EAAWF,EAAAA,SAAS;;;;EAKpBG,EAAYH,EAAAA,SAAS;;;;EAKrBI,EAAaJ,EAAAA,SAAS;;;;EAKtBK,EAAYL,EAAAA,SAAS;;;;EAKrBM,EAAaN,EAAAA,SAAS;;;;EAKtBO,EAAgBP,EAAAA,SAAS;;;;EAqBlBQ,EAASC,EAAAA,QAPqBC,QAAAC,SAAEA,EAAQC,QAAEA,GAAOF,EAAKG,EAAKC,EAAAA,OAAAJ,EAA7B,wBAAoC,OAAAK,EAAAC,IAACC,SAAcC,OAAAC,OAAA,GAAAN,GAAOD,QAAQ,SAAS,GAOhGH,EAAgC,EAAGW,QAAOR,UAAU,UAAWD,WAAUU,+HAC7FC,SAAU,QACVC,MAAOH,EAAMI,QAAQC,OAAOC,OAEZ,YAAZd,GAAqBM,OAAAC,OAAA,CACvBQ,gBAAiB,UACjB,UAAW,CACTA,gBAAiB,YAEfhB,GAAY,CACdiB,UAAW,GAAG7B,iBAA0BqB,EAAMS,YAAYC,OAAOC,eAIrD,YAAZnB,GAAqBM,OAAAC,OAAA,CACvBQ,gBAAiB,UACjB,UAAW,CACTA,gBAAiB,YAEfhB,GAAY,CACdiB,UAAW,GAAG3B,iBAA2BmB,EAAMS,YAAYC,OAAOC,eAItD,UAAZnB,GAAmBM,OAAAC,OAAA,CACrBQ,gBAAiB,UACjB,UAAW,CACTA,gBAAiB,YAEfhB,GAAY,CACdiB,UAAW,GAAG1B,iBAAwBkB,EAAMS,YAAYC,OAAOC,eAInD,SAAZnB,GAAkBM,OAAAC,OAAA,CACpBQ,gBAAiB,UACjB,UAAW,CACTA,gBAAiB,YAEfhB,GAAY,CACdiB,UAAW,GAAGzB,iBAAyBiB,EAAMS,YAAYC,OAAOC,eAIpD,UAAZnB,GAAmBM,OAAAC,OAAA,CACrBQ,gBAAiBP,EAAMI,QAAQC,OAAOC,MACtCH,MAAOH,EAAMI,QAAQQ,KAAKC,QAC1B,UAAW,CACTN,gBAAiB,WAEnBO,OAAQ,aAAad,EAAMI,QAAQQ,KAAKC,WACpCtB,GAAY,CACdiB,UAAW,GAAGxB,iBAA0BgB,EAAMS,YAAYC,OAAOC,eAIrD,SAAZnB,GAAkBM,OAAAC,OAAA,CACpBQ,gBAAiB,cACjBO,OAAQ,oBACRX,MAAOH,EAAMI,QAAQQ,KAAKC,SACtBtB,GAAY,CACdiB,UAAW,GAAGvB,iBAAyBe,EAAMS,YAAYC,OAAOC,eAIpD,UAAZnB,GACFM,OAAAC,OAAA,CAAAQ,gBAAiB,cACjBO,OAAQ,aAAad,EAAMI,QAAQC,OAAOC,SACtCf,GAAY,CACdiB,UAAW,GAAGtB,iBAA0Bc,EAAMS,YAAYC,OAAOC,eAIjEV,GACFH,OAAAC,OAAA,CAAAQ,gBAAiB,UACjBJ,MAAOH,EAAMI,QAAQW,OAAOd,SAC5Be,YAAahB,EAAMI,QAAQW,OAAOd,UAC9BV,GAAY,CACdiB,UAAW,GAAGrB,iBAA6Ba,EAAMS,YAAYC,OAAOC"}
+{"version":3,"file":"Button.js","sources":["../../../../../src/production/Button/Button.tsx"],"sourcesContent":["import { Button as MuiButton, ButtonProps as MuiButtonProps, styled } from '@mui/material';\nimport React from 'react';\nimport { keyframes } from '@mui/material/styles';\n\nconst greenBlink = keyframes`\n  0% { background-color: #43861D; }\n  50% { background-color: #96DC6F; }\n  100% {background-color: #43861D; }\n`;\nconst orangeBlink = keyframes`\n  0% { background-color: #DE7C13; }\n  50% { background-color: #F2B879; }\n  100% {background-color: #DE7C13; }\n`;\nconst redBlink = keyframes`\n  0% { background-color: #CE332A; }\n  50% { background-color: #EC908B; }\n  100% {background-color: #CE332A; }\n`;\nconst blueBlink = keyframes`\n  0% { background-color: #2A78CD; }\n  50% { background-color: #80B1E5; }\n  100% {background-color: #2A78CD; }\n`;\nconst whiteBlink = keyframes`\n  0% { background-color: #fff; }\n  50% { background-color: #D8D8D8; }\n  100% {background-color: #fff; }\n`;\nconst darkBlink = keyframes`\n  0% { border-color: #161718; }\n  50% { border-color: #D8D8D8; }\n  100% {border-color: #161718; }\n`;\nconst lightBlink = keyframes`\n0% { border-color: #eee; }\n50% { border-color: #454546; }\n100% {border-color: #eee; }\n`;\nconst disabledBlink = keyframes`\n  0% { background-color: #D8D8D8; }\n  50% { background-color: #EEEEEE; }\n  100% {background-color: #D8D8D8; }\n`;\n\nexport type ButtonProps = Omit<\n  MuiButtonProps,\n  'nonce' | 'color' | 'disableElevation' | 'disableFocusRipple' | 'disableRipple' | 'classes' | 'variant'\n> & {\n  blinking?: boolean;\n  variant?: 'success' | 'warning' | 'alert' | 'info' | 'white' | 'dark' | 'light';\n};\n\nconst ButtonBase: React.FC<ButtonProps> = ({ blinking, variant, ...props }) => <MuiButton {...props} variant=\"text\" />;\n\n/**\n * @deprecated use production components from production web library\n *  https://www.npmjs.com/package/@skodaflow/production-web-library\n */\n// eslint-disable-next-line sonarjs/cognitive-complexity\nexport const Button = styled(ButtonBase)<ButtonProps>(({ theme, variant = 'success', blinking, disabled }) => ({\n  minWidth: '150px',\n  color: theme.palette.common.white,\n\n  ...(variant === 'success' && {\n    backgroundColor: '#43861D',\n    '&:hover': {\n      backgroundColor: '#55a628',\n    },\n    ...(blinking && {\n      animation: `${greenBlink} 1s infinite ${theme.transitions.easing.easeInOut}`,\n    }),\n  }),\n\n  ...(variant === 'warning' && {\n    backgroundColor: '#DE7C13',\n    '&:hover': {\n      backgroundColor: '#df8f38',\n    },\n    ...(blinking && {\n      animation: `${orangeBlink} 1s infinite ${theme.transitions.easing.easeInOut}`,\n    }),\n  }),\n\n  ...(variant === 'alert' && {\n    backgroundColor: '#CE332A',\n    '&:hover': {\n      backgroundColor: '#d84a42',\n    },\n    ...(blinking && {\n      animation: `${redBlink} 1s infinite ${theme.transitions.easing.easeInOut}`,\n    }),\n  }),\n\n  ...(variant === 'info' && {\n    backgroundColor: '#2A78CD',\n    '&:hover': {\n      backgroundColor: '#4a8fdb',\n    },\n    ...(blinking && {\n      animation: `${blueBlink} 1s infinite ${theme.transitions.easing.easeInOut}`,\n    }),\n  }),\n\n  ...(variant === 'white' && {\n    backgroundColor: theme.palette.common.white,\n    color: theme.palette.text.primary,\n    '&:hover': {\n      backgroundColor: '#e1e1e1',\n    },\n    border: `2px solid ${theme.palette.text.primary}`,\n    ...(blinking && {\n      animation: `${whiteBlink} 1s infinite ${theme.transitions.easing.easeInOut}`,\n    }),\n  }),\n\n  ...(variant === 'dark' && {\n    backgroundColor: 'transparent',\n    border: `2px solid #161718`,\n    color: theme.palette.text.primary,\n    ...(blinking && {\n      animation: `${darkBlink} 1s infinite ${theme.transitions.easing.easeInOut}`,\n    }),\n  }),\n\n  ...(variant === 'light' && {\n    backgroundColor: 'transparent',\n    border: `2px solid ${theme.palette.common.white}`,\n    ...(blinking && {\n      animation: `${lightBlink} 1s infinite ${theme.transitions.easing.easeInOut}`,\n    }),\n  }),\n\n  ...(disabled && {\n    backgroundColor: '#D8D8D8',\n    color: theme.palette.action.disabled,\n    borderColor: theme.palette.action.disabled,\n    ...(blinking && {\n      animation: `${disabledBlink} 1s infinite ${theme.transitions.easing.easeInOut}`,\n    }),\n  }),\n}));\n"],"names":["greenBlink","keyframes","orangeBlink","redBlink","blueBlink","whiteBlink","darkBlink","lightBlink","disabledBlink","Button","styled","_a","blinking","variant","props","__rest","_jsx","jsx","MuiButton","Object","assign","theme","disabled","minWidth","color","palette","common","white","backgroundColor","animation","transitions","easing","easeInOut","text","primary","border","action","borderColor"],"mappings":"gIAIA,MAAMA,EAAaC,EAAAA,SAAS;;;;EAKtBC,EAAcD,EAAAA,SAAS;;;;EAKvBE,EAAWF,EAAAA,SAAS;;;;EAKpBG,EAAYH,EAAAA,SAAS;;;;EAKrBI,EAAaJ,EAAAA,SAAS;;;;EAKtBK,EAAYL,EAAAA,SAAS;;;;EAKrBM,EAAaN,EAAAA,SAAS;;;;EAKtBO,EAAgBP,EAAAA,SAAS;;;;EAqBlBQ,EAASC,EAAAA,QAPqBC,QAAAC,SAAEA,EAAQC,QAAEA,GAAOF,EAAKG,EAAKC,EAAAA,OAAAJ,EAA7B,wBAAoC,OAAAK,EAAAC,IAACC,SAAcC,OAAAC,OAAA,GAAAN,GAAOD,QAAQ,SAAS,GAOhGH,EAAgC,EAAGW,QAAOR,UAAU,UAAWD,WAAUU,+HAC7FC,SAAU,QACVC,MAAOH,EAAMI,QAAQC,OAAOC,OAEZ,YAAZd,GAAqBM,OAAAC,OAAA,CACvBQ,gBAAiB,UACjB,UAAW,CACTA,gBAAiB,YAEfhB,GAAY,CACdiB,UAAW,GAAG7B,iBAA0BqB,EAAMS,YAAYC,OAAOC,eAIrD,YAAZnB,GAAqBM,OAAAC,OAAA,CACvBQ,gBAAiB,UACjB,UAAW,CACTA,gBAAiB,YAEfhB,GAAY,CACdiB,UAAW,GAAG3B,iBAA2BmB,EAAMS,YAAYC,OAAOC,eAItD,UAAZnB,GAAmBM,OAAAC,OAAA,CACrBQ,gBAAiB,UACjB,UAAW,CACTA,gBAAiB,YAEfhB,GAAY,CACdiB,UAAW,GAAG1B,iBAAwBkB,EAAMS,YAAYC,OAAOC,eAInD,SAAZnB,GAAkBM,OAAAC,OAAA,CACpBQ,gBAAiB,UACjB,UAAW,CACTA,gBAAiB,YAEfhB,GAAY,CACdiB,UAAW,GAAGzB,iBAAyBiB,EAAMS,YAAYC,OAAOC,eAIpD,UAAZnB,GAAmBM,OAAAC,OAAA,CACrBQ,gBAAiBP,EAAMI,QAAQC,OAAOC,MACtCH,MAAOH,EAAMI,QAAQQ,KAAKC,QAC1B,UAAW,CACTN,gBAAiB,WAEnBO,OAAQ,aAAad,EAAMI,QAAQQ,KAAKC,WACpCtB,GAAY,CACdiB,UAAW,GAAGxB,iBAA0BgB,EAAMS,YAAYC,OAAOC,eAIrD,SAAZnB,GAAkBM,OAAAC,OAAA,CACpBQ,gBAAiB,cACjBO,OAAQ,oBACRX,MAAOH,EAAMI,QAAQQ,KAAKC,SACtBtB,GAAY,CACdiB,UAAW,GAAGvB,iBAAyBe,EAAMS,YAAYC,OAAOC,eAIpD,UAAZnB,GACFM,OAAAC,OAAA,CAAAQ,gBAAiB,cACjBO,OAAQ,aAAad,EAAMI,QAAQC,OAAOC,SACtCf,GAAY,CACdiB,UAAW,GAAGtB,iBAA0Bc,EAAMS,YAAYC,OAAOC,eAIjEV,GACFH,OAAAC,OAAA,CAAAQ,gBAAiB,UACjBJ,MAAOH,EAAMI,QAAQW,OAAOd,SAC5Be,YAAahB,EAAMI,QAAQW,OAAOd,UAC9BV,GAAY,CACdiB,UAAW,GAAGrB,iBAA6Ba,EAAMS,YAAYC,OAAOC"}

package/components/backdrop/backdrop.d.ts

@@ -1,6 +1,5 @@
 import React, { HTMLAttributes, ReactNode } from 'react';
-import { SxProps } from '@mui/system';
-import { Theme } from '@mui/material';
+import { SxProps, Theme } from '@mui/material';
 export interface BackdropProps extends HTMLAttributes<HTMLDivElement> {
     /**
      *  If true, the component is shown. Default value false

package/components/backdrop/backdrop.js.map

@@ -1 +1 @@
-{"version":3,"file":"backdrop.js","sources":["../../../src/components/backdrop/backdrop.tsx"],"sourcesContent":["import React, { HTMLAttributes, ReactNode, forwardRef, useEffect } from 'react';\nimport { SxProps } from '@mui/system';\nimport useBackdrop from '../../components/common/hook/backdrop';\nimport { styled, Theme, Backdrop as MuiBackdrop } from '@mui/material';\n\nexport interface BackdropProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   *  If true, the component is shown. Default value false\n   */\n  open: boolean;\n  /**\n   *  Override or extend the styles applied to the component.\n   */\n  classes?: object;\n  /**\n   *  The component used for the root node. Either a string to use a HTML element or a component.\n   */\n  component?: string | ReactNode;\n  /**\n   *  The components used for each slot inside the Backdrop. Either a string to use a HTML element or a component.\n   */\n  components?: object;\n  /**\n   * The props used for each slot inside the Backdrop.\n   */\n  componentsProps?: object;\n  /**\n   * If true, the backdrop is invisible. It can be used when rendering a popover or a custom select component. Default value is false\n   */\n  invisible?: boolean;\n  /**\n   * The system prop that allows defining system overrides as well as additional CSS styles. See the `sx` page for more details.\n   */\n  sx?: SxProps<Theme>;\n  /**\n   The duration for the transition, in milliseconds. You may specify a single timeout for all transitions, or individually with an object.\n   */\n  transitionDuration?: number | object;\n  /**\n   * Additional onClose callback that needs to be provided when the state of the backdrop is controlled from outside.\n   */\n  onClose?: (isOpen: boolean) => void;\n}\n\n/**\n * @deprecated This component is deprecated. Use themed Backdrop component from @mui/material instead\n */\nexport const Backdrop = forwardRef<HTMLDivElement, BackdropProps>(({ open, onClose, ...props }, ref) => {\n  const { openBackdrop, handleCloseBackdrop, setOpenBackdrop } = useBackdrop();\n\n  const handleClose = () => {\n    handleCloseBackdrop();\n    onClose && onClose(false);\n  };\n\n  useEffect(() => {\n    setOpenBackdrop(open);\n  }, [open, setOpenBackdrop]);\n\n  return (\n    <BackdropStyled\n      ref={ref}\n      classes={props.classes}\n      open={openBackdrop}\n      onClick={handleClose}\n      invisible={props.invisible}\n      sx={props.sx}\n      transitionDuration={props.transitionDuration}\n    >\n      {props.children}\n    </BackdropStyled>\n  );\n});\n\nconst BackdropStyled = styled(MuiBackdrop)<BackdropProps>(({ theme, ...args }) => {\n  if (args.invisible)\n    return {\n      backgroundColor: theme.palette.transparent.backdrop,\n      backdropFilter: 'blur(0px)',\n    };\n\n  return null;\n});\n"],"names":["Backdrop","forwardRef","_a","ref","open","onClose","props","__rest","openBackdrop","handleCloseBackdrop","setOpenBackdrop","useBackdrop","useEffect","_jsx","BackdropStyled","classes","onClick","invisible","sx","transitionDuration","children","styled","MuiBackdrop","theme","backgroundColor","palette","transparent","backdrop","backdropFilter"],"mappings":"wNA+Ca,MAAAA,EAAWC,GAA0C,CAACC,EAA6BC,SAA7BC,KAAEA,EAAIC,QAAEA,GAAOH,EAAKI,EAAKC,EAAAL,EAAzB,oBACjE,MAAMM,aAAEA,EAAYC,oBAAEA,EAAmBC,gBAAEA,GAAoBC,IAW/D,OAJAC,GAAU,KACRF,EAAgBN,EAAK,GACpB,CAACA,EAAMM,IAGRG,EAACC,EAAc,CACbX,IAAKA,EACLY,QAAST,EAAMS,QACfX,KAAMI,EACNQ,QAdgB,KAClBP,IACAJ,GAAWA,GAAQ,EAAM,EAavBY,UAAWX,EAAMW,UACjBC,GAAIZ,EAAMY,GACVC,mBAAoBb,EAAMa,mBAAkBC,SAE3Cd,EAAMc,UACQ,IAIfN,EAAiBO,EAAOC,EAAPD,EAAoCnB,IAAA,IAAAqB,MAAEA,GAAgBrB,EAC3E,OADyEK,EAAAL,EAAhB,WAChDe,UACA,CACLO,gBAAiBD,EAAME,QAAQC,YAAYC,SAC3CC,eAAgB,aAGb,IAAI"}
+{"version":3,"file":"backdrop.js","sources":["../../../src/components/backdrop/backdrop.tsx"],"sourcesContent":["import React, { HTMLAttributes, ReactNode, forwardRef, useEffect } from 'react';\nimport useBackdrop from '../../components/common/hook/backdrop';\nimport { SxProps, styled, Theme, Backdrop as MuiBackdrop } from '@mui/material';\n\nexport interface BackdropProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   *  If true, the component is shown. Default value false\n   */\n  open: boolean;\n  /**\n   *  Override or extend the styles applied to the component.\n   */\n  classes?: object;\n  /**\n   *  The component used for the root node. Either a string to use a HTML element or a component.\n   */\n  component?: string | ReactNode;\n  /**\n   *  The components used for each slot inside the Backdrop. Either a string to use a HTML element or a component.\n   */\n  components?: object;\n  /**\n   * The props used for each slot inside the Backdrop.\n   */\n  componentsProps?: object;\n  /**\n   * If true, the backdrop is invisible. It can be used when rendering a popover or a custom select component. Default value is false\n   */\n  invisible?: boolean;\n  /**\n   * The system prop that allows defining system overrides as well as additional CSS styles. See the `sx` page for more details.\n   */\n  sx?: SxProps<Theme>;\n  /**\n   The duration for the transition, in milliseconds. You may specify a single timeout for all transitions, or individually with an object.\n   */\n  transitionDuration?: number | object;\n  /**\n   * Additional onClose callback that needs to be provided when the state of the backdrop is controlled from outside.\n   */\n  onClose?: (isOpen: boolean) => void;\n}\n\n/**\n * @deprecated This component is deprecated. Use themed Backdrop component from @mui/material instead\n */\nexport const Backdrop = forwardRef<HTMLDivElement, BackdropProps>(({ open, onClose, ...props }, ref) => {\n  const { openBackdrop, handleCloseBackdrop, setOpenBackdrop } = useBackdrop();\n\n  const handleClose = () => {\n    handleCloseBackdrop();\n    onClose && onClose(false);\n  };\n\n  useEffect(() => {\n    setOpenBackdrop(open);\n  }, [open, setOpenBackdrop]);\n\n  return (\n    <BackdropStyled\n      ref={ref}\n      classes={props.classes}\n      open={openBackdrop}\n      onClick={handleClose}\n      invisible={props.invisible}\n      sx={props.sx}\n      transitionDuration={props.transitionDuration}\n    >\n      {props.children}\n    </BackdropStyled>\n  );\n});\n\nconst BackdropStyled = styled(MuiBackdrop)<BackdropProps>(({ theme, ...args }) => {\n  if (args.invisible)\n    return {\n      backgroundColor: theme.palette.transparent.backdrop,\n      backdropFilter: 'blur(0px)',\n    };\n\n  return null;\n});\n"],"names":["Backdrop","forwardRef","_a","ref","open","onClose","props","__rest","openBackdrop","handleCloseBackdrop","setOpenBackdrop","useBackdrop","useEffect","_jsx","BackdropStyled","classes","onClick","invisible","sx","transitionDuration","children","styled","MuiBackdrop","theme","backgroundColor","palette","transparent","backdrop","backdropFilter"],"mappings":"wNA8Ca,MAAAA,EAAWC,GAA0C,CAACC,EAA6BC,SAA7BC,KAAEA,EAAIC,QAAEA,GAAOH,EAAKI,EAAKC,EAAAL,EAAzB,oBACjE,MAAMM,aAAEA,EAAYC,oBAAEA,EAAmBC,gBAAEA,GAAoBC,IAW/D,OAJAC,GAAU,KACRF,EAAgBN,EAAK,GACpB,CAACA,EAAMM,IAGRG,EAACC,EAAc,CACbX,IAAKA,EACLY,QAAST,EAAMS,QACfX,KAAMI,EACNQ,QAdgB,KAClBP,IACAJ,GAAWA,GAAQ,EAAM,EAavBY,UAAWX,EAAMW,UACjBC,GAAIZ,EAAMY,GACVC,mBAAoBb,EAAMa,mBAAkBC,SAE3Cd,EAAMc,UACQ,IAIfN,EAAiBO,EAAOC,EAAPD,EAAoCnB,IAAA,IAAAqB,MAAEA,GAAgBrB,EAC3E,OADyEK,EAAAL,EAAhB,WAChDe,UACA,CACLO,gBAAiBD,EAAME,QAAQC,YAAYC,SAC3CC,eAAgB,aAGb,IAAI"}

package/components/cardMenu/cardMenu.d.ts

@@ -1,7 +1,6 @@
 import React, { HTMLAttributes } from 'react';
+import { SxProps, Theme } from '@mui/material';
 import { IconNameProp } from '../icon';
-import { SxProps } from '@mui/system';
-import { Theme } from '@mui/material/styles';
 import { Placement } from '../../utils/enum';
 /**
  * @interface CardMenuItem

package/components/cardMenu/cardMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"cardMenu.js","sources":["../../../src/components/cardMenu/cardMenu.tsx"],"sourcesContent":["import React, { HTMLAttributes, forwardRef } from 'react';\nimport useWindowSize from '../common/hook/useWindowSize';\nimport {\n  List,\n  ListItem,\n  ListItemButton,\n  ListItemIcon,\n  ListItemText,\n  MenuItem,\n  ClickAwayListener,\n  Divider,\n} from '@mui/material';\nimport { Icon, IconNameProp } from '../icon';\nimport { Checkbox } from '../checkbox';\nimport { SxProps } from '@mui/system';\nimport { Theme } from '@mui/material/styles';\nimport { Placement } from '../../utils/enum';\nimport { ToggleSwitch } from '../toggleSwitch';\nimport { useCardMenu } from './hooks/useCardMenu';\nimport { PopperStyled } from './styled/popperStyled';\nimport { MenuListStyled } from './styled/menuListStyled';\nimport { DrawerStyled } from './styled/drawerStyled';\n\n/**\n * @interface CardMenuItem\n * @description The interface describing the object that has to be provided to the array property 'items' in CardMenu component.\n * If url is provided the menuItem becomes link.\n */\nexport interface CardMenuItem {\n  text: string;\n  callback?: () => void;\n  disabled?: boolean;\n  icon?: IconNameProp;\n  isChecked?: boolean;\n  url?: string;\n  target?: string;\n}\n/**\n * @type CardMenuItemsArray\n * @description Array of CardMenuItem.\n */\nexport type CardMenuItemsArray = Array<CardMenuItem>;\n\n/**\n * @interface CardMenuProps\n * @description Base definition of SkodaFlow CardMenu independent on core implementation.\n * Properties are inherited from HTML Div element.\n */\nexport interface CardMenuProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * If true the drawer is shown.\n   */\n  open: boolean;\n  /**\n   * The content of the component.\n   */\n  items: CardMenuItemsArray;\n  /**\n   * React useState hook set function used to update the passed items to the component.\n   */\n  setItems?: React.Dispatch<React.SetStateAction<CardMenuItemsArray>>;\n  /**\n   * Callback fired when the component requests to be closed.\n   */\n  onClose: () => void;\n  /**\n   * An HTML element used to set the position of the popper.\n   */\n  anchorRef: React.RefObject<HTMLElement>;\n  /**\n   * If header is provided, a text will be displayed on top of the elements.\n   */\n  header?: string;\n  /**\n   * If true, multiple item select will be enabled. Property 'setItems' must be provided in order allowMultiselect to work.\n   * Items: CardMenuItemsArray provided to the component must have isChecked propery provided in order allowMultiselect to work..\n   */\n  allowMultiselect?: boolean;\n  /**\n   * Callback fired when item is clicked.\n   */\n  onItemClick?: (itemText: string) => void;\n  /**\n   *  The system prop that allows defining system overrides as well as additional CSS styles.\n   */\n  sx?: SxProps<Theme>;\n  /**\n   *  Override or extend the styles applied to the component.\n   */\n  classes?: object;\n  /**\n   * Popper placement. Default is 'bottom'.\n   */\n  placement?: Placement;\n  /**\n   * If true, a switch button is added to the items allowing to select or deselect all of the items.\n   * Property allowMultiselect should be true in order hasToggleSelection to work. Only available for the desktop version of the MenuCard.\n   */\n  hasToggleSelection?: boolean;\n  /**\n   * The toggle label displayed when groupToggleSelection is true. Default is \"Select all\".\n   */\n  toggleLabel?: string;\n  /** Renders the popper with border radius */\n  rounded?: boolean;\n}\n\n/** @deprecated Use Menu component from @mui/material */\nexport const CardMenu = forwardRef<HTMLDivElement, CardMenuProps>(\n  (\n    {\n      items,\n      setItems,\n      open,\n      header,\n      anchorRef,\n      allowMultiselect,\n      hasToggleSelection,\n      onItemClick,\n      onClose,\n      sx,\n      classes,\n      placement,\n      toggleLabel,\n      rounded,\n    },\n    ref,\n  ) => {\n    const { isMobile } = useWindowSize();\n    const { isToggleChecked, onClickHandler, onToggleChange } = useCardMenu(\n      items,\n      allowMultiselect,\n      setItems,\n      onItemClick,\n      onClose,\n    );\n\n    return (\n      <>\n        {isMobile ? (\n          <DrawerStyled\n            open={open}\n            onClose={onClose}\n            anchor=\"bottom\"\n            sx={sx}\n            ref={ref}\n            classes={classes}\n            hasHeader={!!header}\n            data-testid=\"CardMenu\"\n          >\n            {header && (\n              <div className=\"drawer-header\" data-testid=\"CardMenu.header\">\n                {header}\n              </div>\n            )}\n            <List>\n              {items.map((item) => {\n                return (\n                  <React.Fragment key={item.text}>\n                    <ListItem\n                      data-testid=\"CardMenu.item\"\n                      data-state={item.disabled ? 'disabled' : undefined}\n                      disableGutters\n                    >\n                      <ListItemButton disabled={item.disabled} onClick={() => onClickHandler(item)}>\n                        {item.icon && (\n                          <ListItemIcon>\n                            <Icon name={item.icon} fontSize=\"small\" />\n                          </ListItemIcon>\n                        )}\n                        <ListItemText primaryTypographyProps={{ noWrap: true }} primary={item.text} />\n                        {allowMultiselect && (\n                          <Checkbox checked={item.isChecked} disabled={item.disabled} data-testid=\"CardMenu.check\" />\n                        )}\n                      </ListItemButton>\n                    </ListItem>\n                    <Divider variant=\"middle\" />\n                  </React.Fragment>\n                );\n              })}\n            </List>\n          </DrawerStyled>\n        ) : (\n          <PopperStyled\n            open={open}\n            anchorEl={anchorRef.current}\n            placement={placement}\n            ref={ref}\n            rounded={rounded}\n            data-testid=\"CardMenu\"\n          >\n            <ClickAwayListener onClickAway={onClose}>\n              <MenuListStyled allowMultiselect={allowMultiselect} sx={sx} classes={classes}>\n                {header && (\n                  <MenuItem className=\"menu-item-header\" data-testid=\"CardMenu.header\">\n                    <ListItemText primaryTypographyProps={{ noWrap: true }} primary={header} />\n                    <ListItemIcon onClick={onClose} data-testid=\"CardMenu.close\">\n                      <Icon name=\"close\" fontSize=\"small\" />\n                    </ListItemIcon>\n                  </MenuItem>\n                )}\n                {header && <Divider variant=\"middle\" className=\"menu-item-divider\" />}\n                {allowMultiselect && hasToggleSelection && (\n                  <MenuItem className=\"menu-select-all\" data-testid=\"CardMenu.toggle\">\n                    <ListItemText\n                      primaryTypographyProps={{ noWrap: true }}\n                      primary={toggleLabel ? toggleLabel : 'Select all'}\n                    />\n                    <ToggleSwitch onChange={onToggleChange} checked={isToggleChecked} compact />\n                  </MenuItem>\n                )}\n\n                <div className=\"menu-content-items\">\n                  {items.map((item) => {\n                    return (\n                      <MenuItem\n                        key={item.text}\n                        disabled={item.disabled}\n                        onClick={() => onClickHandler(item)}\n                        data-testid=\"CardMenu.item\"\n                        data-state={item.disabled ? 'disabled' : undefined}\n                      >\n                        {item.icon && (\n                          <ListItemIcon>\n                            <Icon name={item.icon} fontSize=\"small\" />\n                          </ListItemIcon>\n                        )}\n                        <ListItemText primaryTypographyProps={{ noWrap: true }} primary={item.text} />\n                        {allowMultiselect && (\n                          <Checkbox checked={item.isChecked} disabled={item.disabled} data-testid=\"CardMenu.check\" />\n                        )}\n                      </MenuItem>\n                    );\n                  })}\n                </div>\n              </MenuListStyled>\n            </ClickAwayListener>\n          </PopperStyled>\n        )}\n      </>\n    );\n  },\n);\n"],"names":["CardMenu","forwardRef","items","setItems","open","header","anchorRef","allowMultiselect","hasToggleSelection","onItemClick","onClose","sx","classes","placement","toggleLabel","rounded","ref","isMobile","useWindowSize","isToggleChecked","onClickHandler","onToggleChange","useCardMenu","_jsx","_Fragment","children","_jsxs","DrawerStyled","anchor","hasHeader","className","List","map","item","React","Fragment","ListItem","disabled","undefined","disableGutters","ListItemButton","onClick","icon","ListItemIcon","Icon","name","fontSize","ListItemText","primaryTypographyProps","noWrap","primary","text","Checkbox","checked","isChecked","Divider","variant","PopperStyled","anchorEl","current","ClickAwayListener","onClickAway","MenuListStyled","MenuItem","ToggleSwitch","onChange","compact"],"mappings":"gtBA4Ga,MAAAA,EAAWC,GACtB,EAEIC,QACAC,WACAC,OACAC,SACAC,YACAC,mBACAC,qBACAC,cACAC,UACAC,KACAC,UACAC,YACAC,cACAC,WAEFC,KAEA,MAAMC,SAAEA,GAAaC,KACfC,gBAAEA,EAAeC,eAAEA,EAAcC,eAAEA,GAAmBC,EAC1DpB,EACAK,EACAJ,EACAM,EACAC,GAGF,OACEa,EAAAC,EAAA,CAAAC,SACGR,EACCS,EAACC,EAAY,CACXvB,KAAMA,EACNM,QAASA,EACTkB,OAAO,SACPjB,GAAIA,EACJK,IAAKA,EACLJ,QAASA,EACTiB,YAAaxB,EACD,cAAA,WAEXoB,SAAA,CAAApB,GACCkB,EAAK,MAAA,CAAAO,UAAU,gBAAe,cAAa,kBAAiBL,SACzDpB,IAGLkB,EAACQ,EAAI,CAAAN,SACFvB,EAAM8B,KAAKC,GAERP,EAACQ,EAAMC,SACL,CAAAV,SAAA,CAAAF,EAACa,EAAQ,CAAA,cACK,gBAAe,aACfH,EAAKI,SAAW,gBAAaC,EACzCC,gBAAc,EAAAd,SAEdC,EAACc,EAAe,CAAAH,SAAUJ,EAAKI,SAAUI,QAAS,IAAMrB,EAAea,GACpER,SAAA,CAAAQ,EAAKS,MACJnB,EAACoB,EACC,CAAAlB,SAAAF,EAACqB,EAAI,CAACC,KAAMZ,EAAKS,KAAMI,SAAS,YAGpCvB,EAACwB,EAAY,CAACC,uBAAwB,CAAEC,QAAQ,GAAQC,QAASjB,EAAKkB,OACrE5C,GACCgB,EAAC6B,EAAS,CAAAC,QAASpB,EAAKqB,UAAWjB,SAAUJ,EAAKI,SAAsB,cAAA,wBAI9Ed,EAACgC,EAAO,CAACC,QAAQ,aAlBEvB,EAAKkB,aAyBlC5B,EAACkC,GACCrD,KAAMA,EACNsD,SAAUpD,EAAUqD,QACpB9C,UAAWA,EACXG,IAAKA,EACLD,QAASA,EACG,cAAA,oBAEZQ,EAACqC,GAAkBC,YAAanD,EAC9Be,SAAAC,EAACoC,EAAe,CAAAvD,iBAAkBA,EAAkBI,GAAIA,EAAIC,QAASA,EAClEa,SAAA,CAAApB,GACCqB,EAACqC,EAAS,CAAAjC,UAAU,mBAAkB,cAAa,kBACjDL,SAAA,CAAAF,EAACwB,EAAa,CAAAC,uBAAwB,CAAEC,QAAQ,GAAQC,QAAS7C,IACjEkB,EAACoB,EAAY,CAACF,QAAS/B,gBAAqB,iBAAgBe,SAC1DF,EAACqB,EAAI,CAACC,KAAK,QAAQC,SAAS,eAIjCzC,GAAUkB,EAACgC,EAAQ,CAAAC,QAAQ,SAAS1B,UAAU,sBAC9CvB,GAAoBC,GACnBkB,EAACqC,GAASjC,UAAU,kBAA8B,cAAA,4BAChDP,EAACwB,GACCC,uBAAwB,CAAEC,QAAQ,GAClCC,QAASpC,GAA4B,eAEvCS,EAACyC,GAAaC,SAAU5C,EAAgBgC,QAASlC,EAAiB+C,SAAU,OAIhF3C,EAAA,MAAA,CAAKO,UAAU,8BACZ5B,EAAM8B,KAAKC,GAERP,EAACqC,EAAQ,CAEP1B,SAAUJ,EAAKI,SACfI,QAAS,IAAMrB,EAAea,GAAK,cACvB,gBAAe,aACfA,EAAKI,SAAW,gBAAaC,EAExCb,SAAA,CAAAQ,EAAKS,MACJnB,EAACoB,EAAY,CAAAlB,SACXF,EAACqB,GAAKC,KAAMZ,EAAKS,KAAMI,SAAS,YAGpCvB,EAACwB,EAAa,CAAAC,uBAAwB,CAAEC,QAAQ,GAAQC,QAASjB,EAAKkB,OACrE5C,GACCgB,EAAC6B,GAASC,QAASpB,EAAKqB,UAAWjB,SAAUJ,EAAKI,SAAQ,cAAc,qBAbrEJ,EAAKkB,kBAuBzB"}
+{"version":3,"file":"cardMenu.js","sources":["../../../src/components/cardMenu/cardMenu.tsx"],"sourcesContent":["import React, { HTMLAttributes, forwardRef } from 'react';\nimport useWindowSize from '../common/hook/useWindowSize';\nimport {\n  List,\n  ListItem,\n  ListItemButton,\n  ListItemIcon,\n  ListItemText,\n  MenuItem,\n  ClickAwayListener,\n  Divider,\n  SxProps,\n  Theme,\n} from '@mui/material';\nimport { Icon, IconNameProp } from '../icon';\nimport { Checkbox } from '../checkbox';\nimport { Placement } from '../../utils/enum';\nimport { ToggleSwitch } from '../toggleSwitch';\nimport { useCardMenu } from './hooks/useCardMenu';\nimport { PopperStyled } from './styled/popperStyled';\nimport { MenuListStyled } from './styled/menuListStyled';\nimport { DrawerStyled } from './styled/drawerStyled';\n\n/**\n * @interface CardMenuItem\n * @description The interface describing the object that has to be provided to the array property 'items' in CardMenu component.\n * If url is provided the menuItem becomes link.\n */\nexport interface CardMenuItem {\n  text: string;\n  callback?: () => void;\n  disabled?: boolean;\n  icon?: IconNameProp;\n  isChecked?: boolean;\n  url?: string;\n  target?: string;\n}\n/**\n * @type CardMenuItemsArray\n * @description Array of CardMenuItem.\n */\nexport type CardMenuItemsArray = Array<CardMenuItem>;\n\n/**\n * @interface CardMenuProps\n * @description Base definition of SkodaFlow CardMenu independent on core implementation.\n * Properties are inherited from HTML Div element.\n */\nexport interface CardMenuProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * If true the drawer is shown.\n   */\n  open: boolean;\n  /**\n   * The content of the component.\n   */\n  items: CardMenuItemsArray;\n  /**\n   * React useState hook set function used to update the passed items to the component.\n   */\n  setItems?: React.Dispatch<React.SetStateAction<CardMenuItemsArray>>;\n  /**\n   * Callback fired when the component requests to be closed.\n   */\n  onClose: () => void;\n  /**\n   * An HTML element used to set the position of the popper.\n   */\n  anchorRef: React.RefObject<HTMLElement>;\n  /**\n   * If header is provided, a text will be displayed on top of the elements.\n   */\n  header?: string;\n  /**\n   * If true, multiple item select will be enabled. Property 'setItems' must be provided in order allowMultiselect to work.\n   * Items: CardMenuItemsArray provided to the component must have isChecked propery provided in order allowMultiselect to work..\n   */\n  allowMultiselect?: boolean;\n  /**\n   * Callback fired when item is clicked.\n   */\n  onItemClick?: (itemText: string) => void;\n  /**\n   *  The system prop that allows defining system overrides as well as additional CSS styles.\n   */\n  sx?: SxProps<Theme>;\n  /**\n   *  Override or extend the styles applied to the component.\n   */\n  classes?: object;\n  /**\n   * Popper placement. Default is 'bottom'.\n   */\n  placement?: Placement;\n  /**\n   * If true, a switch button is added to the items allowing to select or deselect all of the items.\n   * Property allowMultiselect should be true in order hasToggleSelection to work. Only available for the desktop version of the MenuCard.\n   */\n  hasToggleSelection?: boolean;\n  /**\n   * The toggle label displayed when groupToggleSelection is true. Default is \"Select all\".\n   */\n  toggleLabel?: string;\n  /** Renders the popper with border radius */\n  rounded?: boolean;\n}\n\n/** @deprecated Use Menu component from @mui/material */\nexport const CardMenu = forwardRef<HTMLDivElement, CardMenuProps>(\n  (\n    {\n      items,\n      setItems,\n      open,\n      header,\n      anchorRef,\n      allowMultiselect,\n      hasToggleSelection,\n      onItemClick,\n      onClose,\n      sx,\n      classes,\n      placement,\n      toggleLabel,\n      rounded,\n    },\n    ref,\n  ) => {\n    const { isMobile } = useWindowSize();\n    const { isToggleChecked, onClickHandler, onToggleChange } = useCardMenu(\n      items,\n      allowMultiselect,\n      setItems,\n      onItemClick,\n      onClose,\n    );\n\n    return (\n      <>\n        {isMobile ? (\n          <DrawerStyled\n            open={open}\n            onClose={onClose}\n            anchor=\"bottom\"\n            sx={sx}\n            ref={ref}\n            classes={classes}\n            hasHeader={!!header}\n            data-testid=\"CardMenu\"\n          >\n            {header && (\n              <div className=\"drawer-header\" data-testid=\"CardMenu.header\">\n                {header}\n              </div>\n            )}\n            <List>\n              {items.map((item) => {\n                return (\n                  <React.Fragment key={item.text}>\n                    <ListItem\n                      data-testid=\"CardMenu.item\"\n                      data-state={item.disabled ? 'disabled' : undefined}\n                      disableGutters\n                    >\n                      <ListItemButton disabled={item.disabled} onClick={() => onClickHandler(item)}>\n                        {item.icon && (\n                          <ListItemIcon>\n                            <Icon name={item.icon} fontSize=\"small\" />\n                          </ListItemIcon>\n                        )}\n                        <ListItemText primaryTypographyProps={{ noWrap: true }} primary={item.text} />\n                        {allowMultiselect && (\n                          <Checkbox checked={item.isChecked} disabled={item.disabled} data-testid=\"CardMenu.check\" />\n                        )}\n                      </ListItemButton>\n                    </ListItem>\n                    <Divider variant=\"middle\" />\n                  </React.Fragment>\n                );\n              })}\n            </List>\n          </DrawerStyled>\n        ) : (\n          <PopperStyled\n            open={open}\n            anchorEl={anchorRef.current}\n            placement={placement}\n            ref={ref}\n            rounded={rounded}\n            data-testid=\"CardMenu\"\n          >\n            <ClickAwayListener onClickAway={onClose}>\n              <MenuListStyled allowMultiselect={allowMultiselect} sx={sx} classes={classes}>\n                {header && (\n                  <MenuItem className=\"menu-item-header\" data-testid=\"CardMenu.header\">\n                    <ListItemText primaryTypographyProps={{ noWrap: true }} primary={header} />\n                    <ListItemIcon onClick={onClose} data-testid=\"CardMenu.close\">\n                      <Icon name=\"close\" fontSize=\"small\" />\n                    </ListItemIcon>\n                  </MenuItem>\n                )}\n                {header && <Divider variant=\"middle\" className=\"menu-item-divider\" />}\n                {allowMultiselect && hasToggleSelection && (\n                  <MenuItem className=\"menu-select-all\" data-testid=\"CardMenu.toggle\">\n                    <ListItemText\n                      primaryTypographyProps={{ noWrap: true }}\n                      primary={toggleLabel ? toggleLabel : 'Select all'}\n                    />\n                    <ToggleSwitch onChange={onToggleChange} checked={isToggleChecked} compact />\n                  </MenuItem>\n                )}\n\n                <div className=\"menu-content-items\">\n                  {items.map((item) => {\n                    return (\n                      <MenuItem\n                        key={item.text}\n                        disabled={item.disabled}\n                        onClick={() => onClickHandler(item)}\n                        data-testid=\"CardMenu.item\"\n                        data-state={item.disabled ? 'disabled' : undefined}\n                      >\n                        {item.icon && (\n                          <ListItemIcon>\n                            <Icon name={item.icon} fontSize=\"small\" />\n                          </ListItemIcon>\n                        )}\n                        <ListItemText primaryTypographyProps={{ noWrap: true }} primary={item.text} />\n                        {allowMultiselect && (\n                          <Checkbox checked={item.isChecked} disabled={item.disabled} data-testid=\"CardMenu.check\" />\n                        )}\n                      </MenuItem>\n                    );\n                  })}\n                </div>\n              </MenuListStyled>\n            </ClickAwayListener>\n          </PopperStyled>\n        )}\n      </>\n    );\n  },\n);\n"],"names":["CardMenu","forwardRef","items","setItems","open","header","anchorRef","allowMultiselect","hasToggleSelection","onItemClick","onClose","sx","classes","placement","toggleLabel","rounded","ref","isMobile","useWindowSize","isToggleChecked","onClickHandler","onToggleChange","useCardMenu","_jsx","_Fragment","children","_jsxs","DrawerStyled","anchor","hasHeader","className","List","map","item","React","Fragment","ListItem","disabled","undefined","disableGutters","ListItemButton","onClick","icon","ListItemIcon","Icon","name","fontSize","ListItemText","primaryTypographyProps","noWrap","primary","text","Checkbox","checked","isChecked","Divider","variant","PopperStyled","anchorEl","current","ClickAwayListener","onClickAway","MenuListStyled","MenuItem","ToggleSwitch","onChange","compact"],"mappings":"gtBA4Ga,MAAAA,EAAWC,GACtB,EAEIC,QACAC,WACAC,OACAC,SACAC,YACAC,mBACAC,qBACAC,cACAC,UACAC,KACAC,UACAC,YACAC,cACAC,WAEFC,KAEA,MAAMC,SAAEA,GAAaC,KACfC,gBAAEA,EAAeC,eAAEA,EAAcC,eAAEA,GAAmBC,EAC1DpB,EACAK,EACAJ,EACAM,EACAC,GAGF,OACEa,EAAAC,EAAA,CAAAC,SACGR,EACCS,EAACC,EAAY,CACXvB,KAAMA,EACNM,QAASA,EACTkB,OAAO,SACPjB,GAAIA,EACJK,IAAKA,EACLJ,QAASA,EACTiB,YAAaxB,EACD,cAAA,WAEXoB,SAAA,CAAApB,GACCkB,EAAK,MAAA,CAAAO,UAAU,gBAAe,cAAa,kBAAiBL,SACzDpB,IAGLkB,EAACQ,EAAI,CAAAN,SACFvB,EAAM8B,KAAKC,GAERP,EAACQ,EAAMC,SACL,CAAAV,SAAA,CAAAF,EAACa,EAAQ,CAAA,cACK,gBAAe,aACfH,EAAKI,SAAW,gBAAaC,EACzCC,gBAAc,EAAAd,SAEdC,EAACc,EAAe,CAAAH,SAAUJ,EAAKI,SAAUI,QAAS,IAAMrB,EAAea,GACpER,SAAA,CAAAQ,EAAKS,MACJnB,EAACoB,EACC,CAAAlB,SAAAF,EAACqB,EAAI,CAACC,KAAMZ,EAAKS,KAAMI,SAAS,YAGpCvB,EAACwB,EAAY,CAACC,uBAAwB,CAAEC,QAAQ,GAAQC,QAASjB,EAAKkB,OACrE5C,GACCgB,EAAC6B,EAAS,CAAAC,QAASpB,EAAKqB,UAAWjB,SAAUJ,EAAKI,SAAsB,cAAA,wBAI9Ed,EAACgC,EAAO,CAACC,QAAQ,aAlBEvB,EAAKkB,aAyBlC5B,EAACkC,GACCrD,KAAMA,EACNsD,SAAUpD,EAAUqD,QACpB9C,UAAWA,EACXG,IAAKA,EACLD,QAASA,EACG,cAAA,oBAEZQ,EAACqC,GAAkBC,YAAanD,EAC9Be,SAAAC,EAACoC,EAAe,CAAAvD,iBAAkBA,EAAkBI,GAAIA,EAAIC,QAASA,EAClEa,SAAA,CAAApB,GACCqB,EAACqC,EAAS,CAAAjC,UAAU,mBAAkB,cAAa,kBACjDL,SAAA,CAAAF,EAACwB,EAAa,CAAAC,uBAAwB,CAAEC,QAAQ,GAAQC,QAAS7C,IACjEkB,EAACoB,EAAY,CAACF,QAAS/B,gBAAqB,iBAAgBe,SAC1DF,EAACqB,EAAI,CAACC,KAAK,QAAQC,SAAS,eAIjCzC,GAAUkB,EAACgC,EAAQ,CAAAC,QAAQ,SAAS1B,UAAU,sBAC9CvB,GAAoBC,GACnBkB,EAACqC,GAASjC,UAAU,kBAA8B,cAAA,4BAChDP,EAACwB,GACCC,uBAAwB,CAAEC,QAAQ,GAClCC,QAASpC,GAA4B,eAEvCS,EAACyC,GAAaC,SAAU5C,EAAgBgC,QAASlC,EAAiB+C,SAAU,OAIhF3C,EAAA,MAAA,CAAKO,UAAU,8BACZ5B,EAAM8B,KAAKC,GAERP,EAACqC,EAAQ,CAEP1B,SAAUJ,EAAKI,SACfI,QAAS,IAAMrB,EAAea,GAAK,cACvB,gBAAe,aACfA,EAAKI,SAAW,gBAAaC,EAExCb,SAAA,CAAAQ,EAAKS,MACJnB,EAACoB,EAAY,CAAAlB,SACXF,EAACqB,GAAKC,KAAMZ,EAAKS,KAAMI,SAAS,YAGpCvB,EAACwB,EAAa,CAAAC,uBAAwB,CAAEC,QAAQ,GAAQC,QAASjB,EAAKkB,OACrE5C,GACCgB,EAAC6B,GAASC,QAASpB,EAAKqB,UAAWjB,SAAUJ,EAAKI,SAAQ,cAAc,qBAbrEJ,EAAKkB,kBAuBzB"}

package/components/cardMenu/styled/drawerStyled.d.ts

@@ -1,3 +1,3 @@
-export declare const DrawerStyled: import("@emotion/styled").StyledComponent<import("@mui/material").DrawerProps & import("@mui/system").MUIStyledCommonProps<import("@mui/system").Theme> & {
+export declare const DrawerStyled: import("@emotion/styled").StyledComponent<import("@mui/material").DrawerProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
     hasHeader: boolean;
 }, {}, {}>;

package/components/cardMenu/styled/drawerStyled.js

@@ -1,2 +1,2 @@
-import{styled as i}from"@mui/system";import{Drawer as e}from"@mui/material";const o=i(e,{shouldForwardProp:i=>"hasHeader"!==i})((({theme:i,hasHeader:e})=>({"& .MuiPaper-root > .MuiList-root":{fontSize:"16px",fontWeight:400,paddingBottom:"32px",listStyleType:"none",maxHeight:"201px",marginTop:e?"9px":"0px","& > .MuiListItem-root":{lineHeight:"24px",padding:"23px 16px 11px 16px",display:"flex","&:hover":{background:i.palette.surface.primary},"& > .MuiListItemIcon-root":{display:"inline-block",lineHeight:"21px",minWidth:"unset",width:"20px",marginRight:"8px","& > .MuiIcon-root":{color:i.palette.text.primary,display:"inline"}},"& > .MuiTypography-root":{flex:1}}},".MuiPaper-root > .drawer-header":{padding:"16px 16px 0px 16px",fontWeight:"bold",lineHeight:"24px",fontSize:"20px",wordBreak:"break-all"},"& > .MuiPaper-root":{borderTopLeftRadius:"16px",borderTopRightRadius:"16px"}})));export{o as DrawerStyled};
+import{styled as i}from"@mui/material/styles";import{Drawer as e}from"@mui/material";const o=i(e,{shouldForwardProp:i=>"hasHeader"!==i})((({theme:i,hasHeader:e})=>({"& .MuiPaper-root > .MuiList-root":{fontSize:"16px",fontWeight:400,paddingBottom:"32px",listStyleType:"none",maxHeight:"201px",marginTop:e?"9px":"0px","& > .MuiListItem-root":{lineHeight:"24px",padding:"23px 16px 11px 16px",display:"flex","&:hover":{background:i.palette.surface.primary},"& > .MuiListItemIcon-root":{display:"inline-block",lineHeight:"21px",minWidth:"unset",width:"20px",marginRight:"8px","& > .MuiIcon-root":{color:i.palette.text.primary,display:"inline"}},"& > .MuiTypography-root":{flex:1}}},".MuiPaper-root > .drawer-header":{padding:"16px 16px 0px 16px",fontWeight:"bold",lineHeight:"24px",fontSize:"20px",wordBreak:"break-all"},"& > .MuiPaper-root":{borderTopLeftRadius:"16px",borderTopRightRadius:"16px"}})));export{o as DrawerStyled};
 //# sourceMappingURL=drawerStyled.js.map

package/components/cardMenu/styled/drawerStyled.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawerStyled.js","sources":["../../../../src/components/cardMenu/styled/drawerStyled.tsx"],"sourcesContent":["import { styled } from '@mui/system';\nimport { Drawer } from '@mui/material';\n\nexport const DrawerStyled = styled(Drawer, {\n  shouldForwardProp: (prop) => prop !== 'hasHeader',\n})<{ hasHeader: boolean }>(({ theme, hasHeader }) => {\n  return {\n    '& .MuiPaper-root > .MuiList-root': {\n      fontSize: '16px',\n      fontWeight: 400,\n      paddingBottom: '32px',\n      listStyleType: 'none',\n      maxHeight: '201px',\n      marginTop: hasHeader ? '9px' : '0px',\n      '& > .MuiListItem-root': {\n        lineHeight: '24px',\n        padding: '23px 16px 11px 16px',\n        display: 'flex',\n        '&:hover': {\n          background: theme.palette.surface.primary,\n        },\n        '& > .MuiListItemIcon-root': {\n          display: 'inline-block',\n          lineHeight: '21px',\n          minWidth: 'unset',\n          width: '20px',\n          marginRight: '8px',\n          '& > .MuiIcon-root': {\n            color: theme.palette.text.primary,\n            display: 'inline',\n          },\n        },\n        '& > .MuiTypography-root': {\n          flex: 1,\n        },\n      },\n    },\n    '.MuiPaper-root > .drawer-header': {\n      padding: '16px 16px 0px 16px',\n      fontWeight: 'bold',\n      lineHeight: '24px',\n      fontSize: '20px',\n      wordBreak: 'break-all',\n    },\n    '& > .MuiPaper-root': {\n      borderTopLeftRadius: '16px',\n      borderTopRightRadius: '16px',\n    },\n  };\n});\n"],"names":["DrawerStyled","styled","Drawer","shouldForwardProp","prop","theme","hasHeader","fontSize","fontWeight","paddingBottom","listStyleType","maxHeight","marginTop","lineHeight","padding","display","background","palette","surface","primary","minWidth","width","marginRight","color","text","flex","wordBreak","borderTopLeftRadius","borderTopRightRadius"],"mappings":"4EAGa,MAAAA,EAAeC,EAAOC,EAAQ,CACzCC,kBAAoBC,GAAkB,cAATA,GADHH,EAED,EAAGI,QAAOC,gBAC5B,CACL,mCAAoC,CAClCC,SAAU,OACVC,WAAY,IACZC,cAAe,OACfC,cAAe,OACfC,UAAW,QACXC,UAAWN,EAAY,MAAQ,MAC/B,wBAAyB,CACvBO,WAAY,OACZC,QAAS,sBACTC,QAAS,OACT,UAAW,CACTC,WAAYX,EAAMY,QAAQC,QAAQC,SAEpC,4BAA6B,CAC3BJ,QAAS,eACTF,WAAY,OACZO,SAAU,QACVC,MAAO,OACPC,YAAa,MACb,oBAAqB,CACnBC,MAAOlB,EAAMY,QAAQO,KAAKL,QAC1BJ,QAAS,WAGb,0BAA2B,CACzBU,KAAM,KAIZ,kCAAmC,CACjCX,QAAS,qBACTN,WAAY,OACZK,WAAY,OACZN,SAAU,OACVmB,UAAW,aAEb,qBAAsB,CACpBC,oBAAqB,OACrBC,qBAAsB"}
+{"version":3,"file":"drawerStyled.js","sources":["../../../../src/components/cardMenu/styled/drawerStyled.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\nimport { Drawer } from '@mui/material';\n\nexport const DrawerStyled = styled(Drawer, {\n  shouldForwardProp: (prop) => prop !== 'hasHeader',\n})<{ hasHeader: boolean }>(({ theme, hasHeader }) => {\n  return {\n    '& .MuiPaper-root > .MuiList-root': {\n      fontSize: '16px',\n      fontWeight: 400,\n      paddingBottom: '32px',\n      listStyleType: 'none',\n      maxHeight: '201px',\n      marginTop: hasHeader ? '9px' : '0px',\n      '& > .MuiListItem-root': {\n        lineHeight: '24px',\n        padding: '23px 16px 11px 16px',\n        display: 'flex',\n        '&:hover': {\n          background: theme.palette.surface.primary,\n        },\n        '& > .MuiListItemIcon-root': {\n          display: 'inline-block',\n          lineHeight: '21px',\n          minWidth: 'unset',\n          width: '20px',\n          marginRight: '8px',\n          '& > .MuiIcon-root': {\n            color: theme.palette.text.primary,\n            display: 'inline',\n          },\n        },\n        '& > .MuiTypography-root': {\n          flex: 1,\n        },\n      },\n    },\n    '.MuiPaper-root > .drawer-header': {\n      padding: '16px 16px 0px 16px',\n      fontWeight: 'bold',\n      lineHeight: '24px',\n      fontSize: '20px',\n      wordBreak: 'break-all',\n    },\n    '& > .MuiPaper-root': {\n      borderTopLeftRadius: '16px',\n      borderTopRightRadius: '16px',\n    },\n  };\n});\n"],"names":["DrawerStyled","styled","Drawer","shouldForwardProp","prop","theme","hasHeader","fontSize","fontWeight","paddingBottom","listStyleType","maxHeight","marginTop","lineHeight","padding","display","background","palette","surface","primary","minWidth","width","marginRight","color","text","flex","wordBreak","borderTopLeftRadius","borderTopRightRadius"],"mappings":"qFAGa,MAAAA,EAAeC,EAAOC,EAAQ,CACzCC,kBAAoBC,GAAkB,cAATA,GADHH,EAED,EAAGI,QAAOC,gBAC5B,CACL,mCAAoC,CAClCC,SAAU,OACVC,WAAY,IACZC,cAAe,OACfC,cAAe,OACfC,UAAW,QACXC,UAAWN,EAAY,MAAQ,MAC/B,wBAAyB,CACvBO,WAAY,OACZC,QAAS,sBACTC,QAAS,OACT,UAAW,CACTC,WAAYX,EAAMY,QAAQC,QAAQC,SAEpC,4BAA6B,CAC3BJ,QAAS,eACTF,WAAY,OACZO,SAAU,QACVC,MAAO,OACPC,YAAa,MACb,oBAAqB,CACnBC,MAAOlB,EAAMY,QAAQO,KAAKL,QAC1BJ,QAAS,WAGb,0BAA2B,CACzBU,KAAM,KAIZ,kCAAmC,CACjCX,QAAS,qBACTN,WAAY,OACZK,WAAY,OACZN,SAAU,OACVmB,UAAW,aAEb,qBAAsB,CACpBC,oBAAqB,OACrBC,qBAAsB"}

package/components/cardMenu/styled/popperStyled.d.ts

@@ -1,4 +1,4 @@
-export declare const PopperStyled: import("@emotion/styled").StyledComponent<import("@mui/base").PopperOwnProps & Omit<any, keyof import("@mui/base").PopperOwnProps> & import("@mui/system").MUIStyledCommonProps<import("@mui/system").Theme> & {
+export declare const PopperStyled: import("@emotion/styled").StyledComponent<import("@mui/material").PopperProps & import("react").RefAttributes<HTMLDivElement> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
     theme?: any;
     isMobile?: boolean;
     rounded?: boolean;

package/components/cardMenu/styled/popperStyled.js

@@ -1,2 +1,2 @@
-import{styled as r}from"@mui/system";import{Popper as o}from"@mui/base";const d=r(o,{shouldForwardProp:r=>"rounded"!==r})((({theme:r,rounded:o})=>({zIndex:"100",background:r.palette.background.primary,"& > *":{borderRadius:o?"4px":void 0}})));export{d as PopperStyled};
+import{styled as r}from"@mui/material/styles";import{Popper as o}from"@mui/material";const d=r(o,{shouldForwardProp:r=>"rounded"!==r})((({theme:r,rounded:o})=>({zIndex:"100",background:r.palette.background.primary,"& > *":{borderRadius:o?"4px":void 0}})));export{d as PopperStyled};
 //# sourceMappingURL=popperStyled.js.map

package/components/cardMenu/styled/popperStyled.js.map

@@ -1 +1 @@
-{"version":3,"file":"popperStyled.js","sources":["../../../../src/components/cardMenu/styled/popperStyled.tsx"],"sourcesContent":["import { styled } from '@mui/system';\nimport { Popper } from '@mui/base';\n\nexport const PopperStyled = styled(Popper, {\n  shouldForwardProp: (propName) => propName !== 'rounded',\n})<{\n  theme?: any;\n  isMobile?: boolean;\n  rounded?: boolean;\n}>(({ theme, rounded }) => {\n  return {\n    zIndex: '100',\n    background: theme.palette.background.primary,\n    '& > *': {\n      borderRadius: rounded ? '4px' : undefined,\n    },\n  };\n});\n"],"names":["PopperStyled","styled","Popper","shouldForwardProp","propName","theme","rounded","zIndex","background","palette","primary","borderRadius","undefined"],"mappings":"wEAGa,MAAAA,EAAeC,EAAOC,EAAQ,CACzCC,kBAAoBC,GAA0B,YAAbA,GADPH,EAMzB,EAAGI,QAAOC,cACJ,CACLC,OAAQ,MACRC,WAAYH,EAAMI,QAAQD,WAAWE,QACrC,QAAS,CACPC,aAAcL,EAAU,WAAQM"}
+{"version":3,"file":"popperStyled.js","sources":["../../../../src/components/cardMenu/styled/popperStyled.tsx"],"sourcesContent":["import { styled } from '@mui/material/styles';\nimport { Popper } from '@mui/material';\n\nexport const PopperStyled = styled(Popper, {\n  shouldForwardProp: (propName) => propName !== 'rounded',\n})<{\n  theme?: any;\n  isMobile?: boolean;\n  rounded?: boolean;\n}>(({ theme, rounded }) => {\n  return {\n    zIndex: '100',\n    background: theme.palette.background.primary,\n    '& > *': {\n      borderRadius: rounded ? '4px' : undefined,\n    },\n  };\n});\n"],"names":["PopperStyled","styled","Popper","shouldForwardProp","propName","theme","rounded","zIndex","background","palette","primary","borderRadius","undefined"],"mappings":"qFAGa,MAAAA,EAAeC,EAAOC,EAAQ,CACzCC,kBAAoBC,GAA0B,YAAbA,GADPH,EAMzB,EAAGI,QAAOC,cACJ,CACLC,OAAQ,MACRC,WAAYH,EAAMI,QAAQD,WAAWE,QACrC,QAAS,CACPC,aAAcL,EAAU,WAAQM"}

package/components/carousel/navigation.js

@@ -1,2 +1,2 @@
-import{__rest as r}from"tslib";import{jsxs as o,Fragment as e,jsx as s}from"react/jsx-runtime";import{useMemo as t}from"react";import{useCarousel as n,useCarouselPeekEffect as i}from"./hooks.js";import{useTheme as a}from"@mui/system";import{useMediaQuery as c,IconButton as l}from"@mui/material";import{ChevronLeftIcon as p}from"../icon/stroke/ChevronLeftIcon.js";import{ChevronRightIcon as m}from"../icon/stroke/ChevronRightIcon.js";import{ArrowLeftIcon as d}from"../icon/stroke/ArrowLeftIcon.js";import{ArrowRightIcon as u}from"../icon/stroke/ArrowRightIcon.js";import{getInteractiveStyle as b}from"../../materialui/button/interactive.js";function g({carousel:g,peekEffect:f=!1,prevButtonProps:j,prevIconProps:x,PrevIconComponent:O,nextButtonProps:k,nextIconProps:v,NextIconComponent:C,arrows:P=!0,onBackground:h=!1}){const I=n(),y=g||I,M="fade"!==(null==y?void 0:y.originalParams.effect)&&f,B=a(),E=c(B.breakpoints.up("md")),L=j||{},{sx:w}=L,N=r(L,["sx"]),A=k||{},{sx:R}=A,z=r(A,["sx"]),[S,q]=i(y),D=O||(P?d:p),F=C||(P?u:m),G=t((()=>Object.assign(Object.assign({position:"absolute",zIndex:"100",top:"50%",mt:"-22px"},b({color:"text.primary",borderColor:h?"transparent.transparent":"onSurface.os600",backgroundColor:h?"transparent.transparent":"surface.primary"},{backgroundColor:"surface.secondary"})),{"&.Mui-disabled":{color:"disabled.tertiary",borderColor:"disabled.primary",backgroundColor:h?"transparent.transparent":"disabled.secondary"}})),[]);return o(e,{children:[s(l,Object.assign({disabled:y&&!y.originalParams.loop&&y.isBeginning,onClick:()=>{null==y||y.slidePrev(),M&&S&&q("reset")},onMouseEnter:()=>E&&M&&q("prev"),onMouseLeave:()=>M&&S&&q("reset"),sx:Object.assign(Object.assign(Object.assign({},G),{left:"16px"}),w),"aria-label":"Previous slide","aria-controls":"carousel",color:"surface"},N,{children:"rtl"===B.direction?s(F,Object.assign({},x)):s(D,Object.assign({},x))})),s(l,Object.assign({disabled:y&&!y.originalParams.loop&&y.isEnd,onClick:()=>{null==y||y.slideNext(),M&&S&&q("reset")},onMouseEnter:()=>E&&M&&q("next"),onMouseLeave:()=>M&&S&&q("reset"),sx:Object.assign(Object.assign(Object.assign({},G),{right:"16px"}),R),"aria-label":"Next slide","aria-controls":"carousel",color:"surface"},z,{children:"rtl"===B.direction?s(D,Object.assign({},v)):s(F,Object.assign({},v))}))]})}export{g as CarouselNavigation};
+import{__rest as r}from"tslib";import{jsxs as o,Fragment as e,jsx as s}from"react/jsx-runtime";import{useMemo as t}from"react";import{useCarousel as n,useCarouselPeekEffect as i}from"./hooks.js";import{useTheme as a,useMediaQuery as c,IconButton as l}from"@mui/material";import{ChevronLeftIcon as p}from"../icon/stroke/ChevronLeftIcon.js";import{ChevronRightIcon as d}from"../icon/stroke/ChevronRightIcon.js";import{ArrowLeftIcon as m}from"../icon/stroke/ArrowLeftIcon.js";import{ArrowRightIcon as u}from"../icon/stroke/ArrowRightIcon.js";import{getInteractiveStyle as x}from"../../materialui/button/interactive.js";function b({carousel:b,peekEffect:g=!1,prevButtonProps:f,prevIconProps:j,PrevIconComponent:O,nextButtonProps:k,nextIconProps:v,NextIconComponent:h,arrows:C=!0,onBackground:I=!1}){const P=n(),y=b||P,M="fade"!==(null==y?void 0:y.originalParams.effect)&&g,w=a(),B=c(w.breakpoints.up("md")),E=f||{},{sx:L}=E,z=r(E,["sx"]),N=k||{},{sx:S}=N,A=r(N,["sx"]),[R,q]=i(y),D=O||(C?m:p),F=h||(C?u:d),G=t((()=>Object.assign(Object.assign({position:"absolute",zIndex:"100",top:"50%",mt:"-22px",width:{xs:"32px",md:"40px",xl:"44px"},height:{xs:"32px",md:"40px",xl:"44px"},"& .MuiSvgIcon-root":{fontSize:{xs:"17px",xl:"20px"}}},x({color:"text.primary",borderColor:I?"transparent.transparent":"onSurface.os100",backgroundColor:I?"transparent.transparent":"surface.primary"},{backgroundColor:"surface.secondary"})),{"&.Mui-disabled":{color:"disabled.tertiary",borderColor:I?"transparent.transparent":"disabled.secondary",backgroundColor:I?"transparent.transparent":"disabled.secondary"}})),[]);return o(e,{children:[s(l,Object.assign({disabled:y&&!y.originalParams.loop&&y.isBeginning,onClick:()=>{null==y||y.slidePrev(),M&&R&&q("reset")},onMouseEnter:()=>B&&M&&q("prev"),onMouseLeave:()=>M&&R&&q("reset"),sx:Object.assign(Object.assign(Object.assign({},G),{left:"16px"}),L),"aria-label":"Previous slide","aria-controls":"carousel",color:"surface",size:"medium"},z,{children:"rtl"===w.direction?s(F,Object.assign({},j)):s(D,Object.assign({},j))})),s(l,Object.assign({disabled:y&&!y.originalParams.loop&&y.isEnd,onClick:()=>{null==y||y.slideNext(),M&&R&&q("reset")},onMouseEnter:()=>B&&M&&q("next"),onMouseLeave:()=>M&&R&&q("reset"),sx:Object.assign(Object.assign(Object.assign({},G),{right:"16px"}),S),"aria-label":"Next slide","aria-controls":"carousel",color:"surface"},A,{children:"rtl"===w.direction?s(D,Object.assign({},v)):s(F,Object.assign({},v))}))]})}export{b as CarouselNavigation};
 //# sourceMappingURL=navigation.js.map

package/components/carousel/navigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigation.js","sources":["../../../src/components/carousel/navigation.tsx"],"sourcesContent":["import React, { useMemo, ElementType } from 'react';\nimport { useCarousel, useCarouselPeekEffect } from './hooks';\nimport { useTheme } from '@mui/system';\nimport { CSSObject, IconButton, IconButtonProps, SvgIconProps, useMediaQuery } from '@mui/material';\nimport type { Swiper as CarouselInstance } from 'swiper';\nimport { ChevronLeftIcon } from '@/src/components/icon/stroke/ChevronLeftIcon';\nimport { ChevronRightIcon } from '@/src/components/icon/stroke/ChevronRightIcon';\nimport { ArrowLeftIcon } from '@/src/components/icon/stroke/ArrowLeftIcon';\nimport { ArrowRightIcon } from '@/src/components/icon/stroke/ArrowRightIcon';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport interface CarouselNavigationProps {\n  /**\n   * Optional Carousel instance from useCarouselInstance hook\n   */\n  carousel?: CarouselInstance;\n  /**\n   * Enable/disable peek effect on hover\n   * @default: false\n   */\n  peekEffect?: boolean;\n  /**\n   * Previous Slide IconButton\n   */\n  prevButtonProps?: Partial<IconButtonProps>;\n  /**\n   * Previous icon props\n   */\n  prevIconProps?: SvgIconProps;\n  /**\n   * Previous icon node\n   */\n  PrevIconComponent?: ElementType<SvgIconProps>;\n  /**\n   * Next Slide IconButton\n   */\n  nextButtonProps?: Partial<IconButtonProps>;\n  /**\n   * Previous icon props\n   */\n  nextIconProps?: SvgIconProps;\n  /**\n   * Next icon node\n   */\n  NextIconComponent?: ElementType<SvgIconProps>;\n  /**\n   * Replaces Chevrons with Arrows\n   * @default true\n   */\n  arrows?: boolean;\n  /**\n   * Enable if placing on a plain background (not on top of an image/video)\n   * @default false\n   */\n  onBackground?: boolean;\n}\n\n/**\n * Left & Right navigation arrows\n */\nexport function CarouselNavigation({\n  carousel: carouselProp,\n  peekEffect: propPeekEffect = false,\n  prevButtonProps,\n  prevIconProps,\n  PrevIconComponent,\n  nextButtonProps,\n  nextIconProps,\n  NextIconComponent,\n  arrows = true,\n  onBackground = false,\n}: CarouselNavigationProps) {\n  const carouselHook = useCarousel();\n  const carousel = carouselProp || carouselHook;\n  const peekEffect = carousel?.originalParams.effect !== 'fade' && propPeekEffect;\n  const theme = useTheme();\n  const upMD = useMediaQuery(theme.breakpoints.up('md'));\n  const { sx: prevSx, ...restPrev } = prevButtonProps || {};\n  const { sx: nextSx, ...restNext } = nextButtonProps || {};\n  const [peek, setPeek] = useCarouselPeekEffect(carousel);\n  const PrevIcon = PrevIconComponent || (arrows ? ArrowLeftIcon : ChevronLeftIcon);\n  const NextIcon = NextIconComponent || (arrows ? ArrowRightIcon : ChevronRightIcon);\n\n  // shared style between buttons\n  const sharedSx = useMemo<CSSObject>(\n    () => ({\n      // absolute inside the carousel position\n      position: 'absolute',\n      zIndex: '100',\n      top: '50%',\n      // manual v-align, half the icon size\n      mt: '-22px',\n      // highlight border\n      ...getInteractiveStyle(\n        {\n          color: 'text.primary',\n          borderColor: onBackground ? 'transparent.transparent' : 'onSurface.os600',\n          backgroundColor: onBackground ? 'transparent.transparent' : 'surface.primary',\n        },\n        {\n          backgroundColor: 'surface.secondary',\n        },\n      ),\n      // disabled state\n      '&.Mui-disabled': {\n        color: 'disabled.tertiary',\n        borderColor: 'disabled.primary',\n        backgroundColor: onBackground ? 'transparent.transparent' : 'disabled.secondary',\n      },\n    }),\n    [],\n  );\n\n  return (\n    <>\n      <IconButton\n        disabled={carousel && !carousel.originalParams.loop && carousel.isBeginning}\n        onClick={() => {\n          carousel?.slidePrev();\n          peekEffect && peek && setPeek('reset');\n        }}\n        onMouseEnter={() => upMD && peekEffect && setPeek('prev')}\n        onMouseLeave={() => peekEffect && peek && setPeek('reset')}\n        sx={{\n          ...sharedSx,\n          left: '16px',\n          ...prevSx,\n        }}\n        aria-label=\"Previous slide\"\n        aria-controls=\"carousel\"\n        color=\"surface\"\n        {...restPrev}\n      >\n        {theme.direction === 'rtl' ? <NextIcon {...prevIconProps} /> : <PrevIcon {...prevIconProps} />}\n      </IconButton>\n      <IconButton\n        disabled={carousel && !carousel.originalParams.loop && carousel.isEnd}\n        onClick={() => {\n          carousel?.slideNext();\n          peekEffect && peek && setPeek('reset');\n        }}\n        onMouseEnter={() => upMD && peekEffect && setPeek('next')}\n        onMouseLeave={() => peekEffect && peek && setPeek('reset')}\n        sx={{\n          ...sharedSx,\n          right: '16px',\n          ...nextSx,\n        }}\n        aria-label=\"Next slide\"\n        aria-controls=\"carousel\"\n        color=\"surface\"\n        {...restNext}\n      >\n        {theme.direction === 'rtl' ? <PrevIcon {...nextIconProps} /> : <NextIcon {...nextIconProps} />}\n      </IconButton>\n    </>\n  );\n}\n"],"names":["CarouselNavigation","carousel","carouselProp","peekEffect","propPeekEffect","prevButtonProps","prevIconProps","PrevIconComponent","nextButtonProps","nextIconProps","NextIconComponent","arrows","onBackground","carouselHook","useCarousel","originalParams","effect","theme","useTheme","upMD","useMediaQuery","breakpoints","up","_a","sx","prevSx","restPrev","__rest","_b","nextSx","restNext","peek","setPeek","useCarouselPeekEffect","PrevIcon","ArrowLeftIcon","ChevronLeftIcon","NextIcon","ArrowRightIcon","ChevronRightIcon","sharedSx","useMemo","Object","assign","position","zIndex","top","mt","getInteractiveStyle","color","borderColor","backgroundColor","_jsxs","_jsx","IconButton","disabled","loop","isBeginning","onClick","slidePrev","onMouseEnter","onMouseLeave","left","children","direction","isEnd","slideNext","right"],"mappings":"ioBA4DgB,SAAAA,GACdC,SAAUC,EACVC,WAAYC,GAAiB,EAAKC,gBAClCA,EAAeC,cACfA,EAAaC,kBACbA,EAAiBC,gBACjBA,EAAeC,cACfA,EAAaC,kBACbA,EAAiBC,OACjBA,GAAS,EAAIC,aACbA,GAAe,IAEf,MAAMC,EAAeC,IACfb,EAAWC,GAAgBW,EAC3BV,EAAiD,UAApCF,aAAA,EAAAA,EAAUc,eAAeC,SAAqBZ,EAC3Da,EAAQC,IACRC,EAAOC,EAAcH,EAAMI,YAAYC,GAAG,OAC1CC,EAA8BlB,GAAmB,IAA/CmB,GAAIC,KAAWC,EAAjBC,EAAAJ,EAAA,CAAA,OACAK,EAA8BpB,GAAmB,IAA/CgB,GAAIK,KAAWC,EAAjBH,EAAAC,EAAA,CAAA,QACCG,EAAMC,GAAWC,EAAsBhC,GACxCiC,EAAW3B,IAAsBI,EAASwB,EAAgBC,GAC1DC,EAAW3B,IAAsBC,EAAS2B,EAAiBC,GAG3DC,EAAWC,GACf,IAAMC,OAAAC,OAAAD,OAAAC,OAAA,CAEJC,SAAU,WACVC,OAAQ,MACRC,IAAK,MAELC,GAAI,SAEDC,EACD,CACEC,MAAO,eACPC,YAAatC,EAAe,0BAA4B,kBACxDuC,gBAAiBvC,EAAe,0BAA4B,mBAE9D,CACEuC,gBAAiB,uBAEpB,CAED,iBAAkB,CAChBF,MAAO,oBACPC,YAAa,mBACbC,gBAAiBvC,EAAe,0BAA4B,yBAGhE,IAGF,OACEwC,eACEC,EAACC,iBACCC,SAAUtD,IAAaA,EAASc,eAAeyC,MAAQvD,EAASwD,YAChEC,QAAS,KACPzD,SAAAA,EAAU0D,YACVxD,GAAc4B,GAAQC,EAAQ,QAAQ,EAExC4B,aAAc,IAAMzC,GAAQhB,GAAc6B,EAAQ,QAClD6B,aAAc,IAAM1D,GAAc4B,GAAQC,EAAQ,SAClDR,GAAEkB,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EACGH,GACH,CAAAsB,KAAM,SACHrC,GAEM,aAAA,iCACG,WACdwB,MAAM,WACFvB,EAAQ,CAAAqC,SAES,QAApB9C,EAAM+C,UAAsBX,EAAChB,EAAaK,OAAAC,OAAA,CAAA,EAAArC,IAAoB+C,EAACnB,mBAAa5B,OAE/E+C,EAACC,EACCZ,OAAAC,OAAA,CAAAY,SAAUtD,IAAaA,EAASc,eAAeyC,MAAQvD,EAASgE,MAChEP,QAAS,KACPzD,SAAAA,EAAUiE,YACV/D,GAAc4B,GAAQC,EAAQ,QAAQ,EAExC4B,aAAc,IAAMzC,GAAQhB,GAAc6B,EAAQ,QAClD6B,aAAc,IAAM1D,GAAc4B,GAAQC,EAAQ,SAClDR,GAAEkB,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EACGH,GAAQ,CACX2B,MAAO,SACJtC,GAEM,aAAA,aACG,gBAAA,WACdoB,MAAM,WACFnB,EAEH,CAAAiC,SAAoB,QAApB9C,EAAM+C,UAAsBX,EAACnB,EAAQQ,OAAAC,OAAA,CAAA,EAAKlC,IAAoB4C,EAAChB,mBAAa5B,SAIrF"}
+{"version":3,"file":"navigation.js","sources":["../../../src/components/carousel/navigation.tsx"],"sourcesContent":["import React, { useMemo, ElementType } from 'react';\nimport { useCarousel, useCarouselPeekEffect } from './hooks';\nimport { useTheme, IconButton, IconButtonProps, SvgIconProps, useMediaQuery } from '@mui/material';\nimport type { Swiper as CarouselInstance } from 'swiper';\nimport { ChevronLeftIcon } from '@/src/components/icon/stroke/ChevronLeftIcon';\nimport { ChevronRightIcon } from '@/src/components/icon/stroke/ChevronRightIcon';\nimport { ArrowLeftIcon } from '@/src/components/icon/stroke/ArrowLeftIcon';\nimport { ArrowRightIcon } from '@/src/components/icon/stroke/ArrowRightIcon';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport interface CarouselNavigationProps {\n  /**\n   * Optional Carousel instance from useCarouselInstance hook\n   */\n  carousel?: CarouselInstance;\n  /**\n   * Enable/disable peek effect on hover\n   * @default: false\n   */\n  peekEffect?: boolean;\n  /**\n   * Previous Slide IconButton\n   */\n  prevButtonProps?: Partial<IconButtonProps>;\n  /**\n   * Previous icon props\n   */\n  prevIconProps?: SvgIconProps;\n  /**\n   * Previous icon node\n   */\n  PrevIconComponent?: ElementType<SvgIconProps>;\n  /**\n   * Next Slide IconButton\n   */\n  nextButtonProps?: Partial<IconButtonProps>;\n  /**\n   * Previous icon props\n   */\n  nextIconProps?: SvgIconProps;\n  /**\n   * Next icon node\n   */\n  NextIconComponent?: ElementType<SvgIconProps>;\n  /**\n   * Replaces Chevrons with Arrows\n   * @default true\n   */\n  arrows?: boolean;\n  /**\n   * Enable if placing on a plain background (not on top of an image/video)\n   * @default false\n   */\n  onBackground?: boolean;\n}\n\n/**\n * Left & Right navigation arrows\n */\nexport function CarouselNavigation({\n  carousel: carouselProp,\n  peekEffect: propPeekEffect = false,\n  prevButtonProps,\n  prevIconProps,\n  PrevIconComponent,\n  nextButtonProps,\n  nextIconProps,\n  NextIconComponent,\n  arrows = true,\n  onBackground = false,\n}: CarouselNavigationProps) {\n  const carouselHook = useCarousel();\n  const carousel = carouselProp || carouselHook;\n  const peekEffect = carousel?.originalParams.effect !== 'fade' && propPeekEffect;\n  const theme = useTheme();\n  const upMD = useMediaQuery(theme.breakpoints.up('md'));\n  const { sx: prevSx, ...restPrev } = prevButtonProps || {};\n  const { sx: nextSx, ...restNext } = nextButtonProps || {};\n  const [peek, setPeek] = useCarouselPeekEffect(carousel);\n  const PrevIcon = PrevIconComponent || (arrows ? ArrowLeftIcon : ChevronLeftIcon);\n  const NextIcon = NextIconComponent || (arrows ? ArrowRightIcon : ChevronRightIcon);\n\n  // shared style between buttons\n  const sharedSx = useMemo(\n    () => ({\n      // absolute inside the carousel position\n      position: 'absolute',\n      zIndex: '100',\n      top: '50%',\n      // manual v-align, half the icon size\n      mt: '-22px',\n      // responsive\n      width: { xs: '32px', md: '40px', xl: '44px' },\n      height: { xs: '32px', md: '40px', xl: '44px' },\n      '& .MuiSvgIcon-root': {\n        fontSize: { xs: '17px', xl: '20px' },\n      },\n      // highlight border\n      ...getInteractiveStyle(\n        {\n          color: 'text.primary',\n          borderColor: onBackground ? 'transparent.transparent' : 'onSurface.os100',\n          backgroundColor: onBackground ? 'transparent.transparent' : 'surface.primary',\n        },\n        {\n          backgroundColor: 'surface.secondary',\n        },\n      ),\n      // disabled state\n      '&.Mui-disabled': {\n        color: 'disabled.tertiary',\n        borderColor: onBackground ? 'transparent.transparent' : 'disabled.secondary',\n        backgroundColor: onBackground ? 'transparent.transparent' : 'disabled.secondary',\n      },\n    }),\n    [],\n  );\n\n  return (\n    <>\n      <IconButton\n        disabled={carousel && !carousel.originalParams.loop && carousel.isBeginning}\n        onClick={() => {\n          carousel?.slidePrev();\n          peekEffect && peek && setPeek('reset');\n        }}\n        onMouseEnter={() => upMD && peekEffect && setPeek('prev')}\n        onMouseLeave={() => peekEffect && peek && setPeek('reset')}\n        sx={{\n          ...sharedSx,\n          left: '16px',\n          ...prevSx,\n        }}\n        aria-label=\"Previous slide\"\n        aria-controls=\"carousel\"\n        color=\"surface\"\n        size=\"medium\"\n        {...restPrev}\n      >\n        {theme.direction === 'rtl' ? <NextIcon {...prevIconProps} /> : <PrevIcon {...prevIconProps} />}\n      </IconButton>\n      <IconButton\n        disabled={carousel && !carousel.originalParams.loop && carousel.isEnd}\n        onClick={() => {\n          carousel?.slideNext();\n          peekEffect && peek && setPeek('reset');\n        }}\n        onMouseEnter={() => upMD && peekEffect && setPeek('next')}\n        onMouseLeave={() => peekEffect && peek && setPeek('reset')}\n        sx={{\n          ...sharedSx,\n          right: '16px',\n          ...nextSx,\n        }}\n        aria-label=\"Next slide\"\n        aria-controls=\"carousel\"\n        color=\"surface\"\n        {...restNext}\n      >\n        {theme.direction === 'rtl' ? <PrevIcon {...nextIconProps} /> : <NextIcon {...nextIconProps} />}\n      </IconButton>\n    </>\n  );\n}\n"],"names":["CarouselNavigation","carousel","carouselProp","peekEffect","propPeekEffect","prevButtonProps","prevIconProps","PrevIconComponent","nextButtonProps","nextIconProps","NextIconComponent","arrows","onBackground","carouselHook","useCarousel","originalParams","effect","theme","useTheme","upMD","useMediaQuery","breakpoints","up","_a","sx","prevSx","restPrev","__rest","_b","nextSx","restNext","peek","setPeek","useCarouselPeekEffect","PrevIcon","ArrowLeftIcon","ChevronLeftIcon","NextIcon","ArrowRightIcon","ChevronRightIcon","sharedSx","useMemo","Object","assign","position","zIndex","top","mt","width","xs","md","xl","height","fontSize","getInteractiveStyle","color","borderColor","backgroundColor","_jsxs","_jsx","IconButton","disabled","loop","isBeginning","onClick","slidePrev","onMouseEnter","onMouseLeave","left","size","children","direction","isEnd","slideNext","right"],"mappings":"wmBA2DgB,SAAAA,GACdC,SAAUC,EACVC,WAAYC,GAAiB,EAAKC,gBAClCA,EAAeC,cACfA,EAAaC,kBACbA,EAAiBC,gBACjBA,EAAeC,cACfA,EAAaC,kBACbA,EAAiBC,OACjBA,GAAS,EAAIC,aACbA,GAAe,IAEf,MAAMC,EAAeC,IACfb,EAAWC,GAAgBW,EAC3BV,EAAiD,UAApCF,aAAA,EAAAA,EAAUc,eAAeC,SAAqBZ,EAC3Da,EAAQC,IACRC,EAAOC,EAAcH,EAAMI,YAAYC,GAAG,OAC1CC,EAA8BlB,GAAmB,IAA/CmB,GAAIC,KAAWC,EAAjBC,EAAAJ,EAAA,CAAA,OACAK,EAA8BpB,GAAmB,IAA/CgB,GAAIK,KAAWC,EAAjBH,EAAAC,EAAA,CAAA,QACCG,EAAMC,GAAWC,EAAsBhC,GACxCiC,EAAW3B,IAAsBI,EAASwB,EAAgBC,GAC1DC,EAAW3B,IAAsBC,EAAS2B,EAAiBC,GAG3DC,EAAWC,GACf,IAAMC,OAAAC,OAAAD,OAAAC,OAAA,CAEJC,SAAU,WACVC,OAAQ,MACRC,IAAK,MAELC,GAAI,QAEJC,MAAO,CAAEC,GAAI,OAAQC,GAAI,OAAQC,GAAI,QACrCC,OAAQ,CAAEH,GAAI,OAAQC,GAAI,OAAQC,GAAI,QACtC,qBAAsB,CACpBE,SAAU,CAAEJ,GAAI,OAAQE,GAAI,UAG3BG,EACD,CACEC,MAAO,eACPC,YAAa5C,EAAe,0BAA4B,kBACxD6C,gBAAiB7C,EAAe,0BAA4B,mBAE9D,CACE6C,gBAAiB,uBAEpB,CAED,iBAAkB,CAChBF,MAAO,oBACPC,YAAa5C,EAAe,0BAA4B,qBACxD6C,gBAAiB7C,EAAe,0BAA4B,yBAGhE,IAGF,OACE8C,eACEC,EAACC,iBACCC,SAAU5D,IAAaA,EAASc,eAAe+C,MAAQ7D,EAAS8D,YAChEC,QAAS,KACP/D,SAAAA,EAAUgE,YACV9D,GAAc4B,GAAQC,EAAQ,QAAQ,EAExCkC,aAAc,IAAM/C,GAAQhB,GAAc6B,EAAQ,QAClDmC,aAAc,IAAMhE,GAAc4B,GAAQC,EAAQ,SAClDR,GACKkB,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,GAAAH,IACH4B,KAAM,SACH3C,gBAEM,iBAAgB,gBACb,WACd8B,MAAM,UACNc,KAAK,UACD3C,EAEH,CAAA4C,SAAoB,QAApBrD,EAAMsD,UAAsBZ,EAACtB,mBAAa/B,IAAoBqD,EAACzB,EAAaQ,OAAAC,OAAA,CAAA,EAAArC,OAE/EqD,EAACC,EAAUlB,OAAAC,OAAA,CACTkB,SAAU5D,IAAaA,EAASc,eAAe+C,MAAQ7D,EAASuE,MAChER,QAAS,KACP/D,SAAAA,EAAUwE,YACVtE,GAAc4B,GAAQC,EAAQ,QAAQ,EAExCkC,aAAc,IAAM/C,GAAQhB,GAAc6B,EAAQ,QAClDmC,aAAc,IAAMhE,GAAc4B,GAAQC,EAAQ,SAClDR,GAAEkB,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EACGH,GAAQ,CACXkC,MAAO,SACJ7C,GAEM,aAAA,aACG,gBAAA,WACd0B,MAAM,WACFzB,EAEH,CAAAwC,SAAoB,QAApBrD,EAAMsD,UAAsBZ,EAACzB,EAAQQ,OAAAC,OAAA,CAAA,EAAKlC,IAAoBkD,EAACtB,mBAAa5B,SAIrF"}

package/components/carousel/pagination.d.ts

@@ -9,10 +9,14 @@ export interface CarouselPaginationVariantProps extends Omit<BoxProps<ElementTyp
 }
 export interface CarouselPaginationDotsProps extends CarouselPaginationVariantProps {
     variant?: 'dots';
+    /**
+     * Properties applied to wrapper of dots
+     */
+    dotsWrapperProps?: BoxProps<ElementType>;
     /**
      * Properties applied to each dot
      */
-    dotProps?: Partial<BoxProps<ElementType>>;
+    dotProps?: BoxProps<ElementType>;
 }
 export interface CarouselPaginationFractionProps extends CarouselPaginationVariantProps {
     variant?: 'fraction';