@skodaflow/web-library 4.0.3 → 4.2.0

package/components/snackbar/snackbar.js

@@ -1,2 +1,2 @@
-import{__rest as e}from"tslib";import{jsx as o}from"react/jsx-runtime";import i,{useMemo as r,useCallback as n}from"react";import{styled as t}from"@mui/material/styles";import a from"@mui/material/Snackbar";import{SnackbarMessage as s}from"./snackbarMessage.js";const c=i.forwardRef((({open:e,setOpen:i,icon:t,message:a,header:c,handleAction:d,autoHideDuration:l,actionButtonTitle:p,handleClose:u,closeOnClickaway:h,anchorOrigin:f,disableWindowBlurListener:g,resumeHideDuration:x,TransitionProps:b},k)=>{const w=r((()=>p&&o("button",{onClick:d,children:p})),[p,d]),B=r((()=>o(s,{icon:t,header:c,message:a})),[c,t,a]),T=n(((e,o)=>{(h||"clickaway"!==o)&&(u&&u(e,o),i(!1))}),[h,u,i]);return o(m,{actionButtonTitle:p,open:e,autoHideDuration:l,onClose:T,icon:t,header:c,message:B,action:w,anchorOrigin:f,disableWindowBlurListener:g,resumeHideDuration:x,TransitionProps:b,ref:k})})),d=e=>"alert"===e||"warning"===e||"success"===e,m=t(a,{shouldForwardProp:e=>"actionButtonTitle"!==e})((o=>{var i=e(o,["theme"]);return{"& .MuiPaper-root":{paddingLeft:d(i.icon)?"18px":"16px",paddingTop:i.header?"12px":"8px",paddingBottom:i.header?"12px":"8px","& > .MuiSnackbarContent-message":{"& > div":{"& .custom-snackbar-divider":{display:i.actionButtonTitle?"flex":"none"}}}}}}));export{c as Snackbar,d as checkForIcon};
+import{__rest as e}from"tslib";import{jsx as i}from"react/jsx-runtime";import{forwardRef as o,useMemo as r,useCallback as n}from"react";import{styled as t}from"@mui/material/styles";import a from"@mui/material/Snackbar";import{SnackbarMessage as s}from"./snackbarMessage.js";const c=o((({open:e,setOpen:o,icon:t,message:a,header:c,handleAction:d,autoHideDuration:l,actionButtonTitle:p,handleClose:u,closeOnClickaway:h,anchorOrigin:g,disableWindowBlurListener:f,resumeHideDuration:x,TransitionProps:b},k)=>{const B=r((()=>p&&i("button",{onClick:d,children:p})),[p,d]),T=r((()=>i(s,{icon:t,header:c,message:a})),[c,t,a]),w=n(((e,i)=>{(h||"clickaway"!==i)&&(u&&u(e,i),o(!1))}),[h,u,o]);return i(m,{actionButtonTitle:p,open:e,autoHideDuration:l,onClose:w,icon:t,header:c,message:T,action:B,anchorOrigin:g,disableWindowBlurListener:f,resumeHideDuration:x,TransitionProps:b,ref:k})})),d=e=>"alert"===e||"warning"===e||"success"===e,m=t(a,{shouldForwardProp:e=>"actionButtonTitle"!==e})((i=>{var o=e(i,["theme"]);return{"& .MuiPaper-root":{paddingLeft:d(o.icon)?"18px":"16px",paddingTop:o.header?"12px":"8px",paddingBottom:o.header?"12px":"8px","& > .MuiSnackbarContent-message":{"& > div":{"& .custom-snackbar-divider":{display:o.actionButtonTitle?"flex":"none"}}}}}}));export{c as Snackbar,d as checkForIcon};
 //# sourceMappingURL=snackbar.js.map

package/components/snackbar/snackbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"snackbar.js","sources":["../../../src/components/snackbar/snackbar.tsx"],"sourcesContent":[null],"names":["Snackbar","React","forwardRef","open","setOpen","icon","message","header","handleAction","autoHideDuration","actionButtonTitle","handleClose","closeOnClickaway","anchorOrigin","disableWindowBlurListener","resumeHideDuration","TransitionProps","ref","actionComponent","useMemo","_jsx","onClick","children","messageComponent","SnackbarMessage","mainHandleClose","useCallback","event","reason","SnackbarStyled","onClose","action","checkForIcon","styled","MuiSnackbar","shouldForwardProp","prop","_a","args","__rest","paddingLeft","paddingTop","paddingBottom","display"],"mappings":"sQAyFa,MAAAA,EAAWC,EAAMC,YAC5B,EAEIC,OACAC,UACAC,OACAC,UACAC,SACAC,eACAC,mBACAC,oBACAC,cACAC,mBACAC,eACAC,4BACAC,qBACAC,mBAEFC,KAEA,MAAMC,EAAkBC,GAAQ,IACvBT,GAAqBU,EAAQ,SAAA,CAAAC,QAASb,EAAYc,SAAGZ,KAC3D,CAACA,EAAmBF,IACjBe,EAAmBJ,GACvB,IAAMC,EAACI,EAAe,CAACnB,KAAMA,EAAME,OAAQA,EAAQD,QAASA,KAC5D,CAACC,EAAQF,EAAMC,IAGXmB,EAAkBC,GACtB,CAACC,EAAqCC,MAC/BhB,GAA+B,cAAXgB,KAIrBjB,GAAaA,EAAYgB,EAAOC,GACpCxB,GAAQ,GAAM,GAEhB,CAACQ,EAAkBD,EAAaP,IAGlC,OACEgB,EAACS,EACC,CAAAnB,kBAAmBA,EACnBP,KAAMA,EACNM,iBAAkBA,EAClBqB,QAASL,EACTpB,KAAMA,EACNE,OAAQA,EACRD,QAASiB,EACTQ,OAAQb,EACRL,aAAcA,EACdC,0BAA2BA,EAC3BC,mBAAoBA,EACpBC,gBAAiBA,EACjBC,IAAKA,GAEP,IAIOe,EAAgB3B,GACX,UAATA,GAA6B,YAATA,GAA+B,YAATA,EAM7CwB,EAAiBI,EAAOC,EAAa,CACzCC,kBAAoBC,GAAkB,sBAATA,GADRH,EAQpBI,IAAA,IAAYC,EAAIC,EAAAF,EAAhB,WACD,MAAO,CACL,mBAAoB,CAClBG,YAAaR,EAAaM,EAAKjC,MAAQ,OAAS,OAChDoC,WAAYH,EAAK/B,OAAS,OAAS,MACnCmC,cAAeJ,EAAK/B,OAAS,OAAS,MACtC,kCAAmC,CACjC,UAAW,CACT,6BAA8B,CAC5BoC,QAASL,EAAK5B,kBAAoB,OAAS,WAKpD"}
+{"version":3,"file":"snackbar.js","sources":["../../../src/components/snackbar/snackbar.tsx"],"sourcesContent":["import { __rest } from \"tslib\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { forwardRef, useCallback, useMemo } from 'react';\nimport { styled } from '@mui/material/styles';\nimport MuiSnackbar from '@mui/material/Snackbar';\nimport { SnackbarMessage } from './snackbarMessage';\n/**\n * @description SkodaFlow Snackbar component.\n * Properties are inherited from HTML Div element.\n * @param props SnackbarProps\n * @returns React Functional Component\n */\nexport const Snackbar = forwardRef(({ open, setOpen, icon, message, header, handleAction, autoHideDuration, actionButtonTitle, handleClose, closeOnClickaway, anchorOrigin, disableWindowBlurListener, resumeHideDuration, TransitionProps, }, ref) => {\n    const actionComponent = useMemo(() => {\n        return actionButtonTitle && _jsx(\"button\", { onClick: handleAction, children: actionButtonTitle });\n    }, [actionButtonTitle, handleAction]);\n    const messageComponent = useMemo(() => _jsx(SnackbarMessage, { icon: icon, header: header, message: message }), [header, icon, message]);\n    const mainHandleClose = useCallback((event, reason) => {\n        if (!closeOnClickaway && reason === 'clickaway') {\n            return;\n        }\n        if (handleClose)\n            handleClose(event, reason);\n        setOpen(false);\n    }, [closeOnClickaway, handleClose, setOpen]);\n    return (_jsx(SnackbarStyled, { actionButtonTitle: actionButtonTitle, open: open, autoHideDuration: autoHideDuration, onClose: mainHandleClose, icon: icon, header: header, message: messageComponent, action: actionComponent, anchorOrigin: anchorOrigin, disableWindowBlurListener: disableWindowBlurListener, resumeHideDuration: resumeHideDuration, TransitionProps: TransitionProps, ref: ref }));\n});\nexport const checkForIcon = (icon) => {\n    return icon === 'alert' || icon === 'warning' || icon === 'success';\n};\n/**\n * @description Snackbar styling defintion based on props\n */\nconst SnackbarStyled = styled(MuiSnackbar, {\n    shouldForwardProp: (prop) => prop !== 'actionButtonTitle',\n})((_a) => {\n    var { theme } = _a, args = __rest(_a, [\"theme\"]);\n    return {\n        '& .MuiPaper-root': {\n            paddingLeft: checkForIcon(args.icon) ? '18px' : '16px',\n            paddingTop: args.header ? '12px' : '8px',\n            paddingBottom: args.header ? '12px' : '8px',\n            '& > .MuiSnackbarContent-message': {\n                '& > div': {\n                    '& .custom-snackbar-divider': {\n                        display: args.actionButtonTitle ? 'flex' : 'none',\n                    },\n                },\n            },\n        },\n    };\n});\n//# sourceMappingURL=snackbar.js.map"],"names":["Snackbar","forwardRef","open","setOpen","icon","message","header","handleAction","autoHideDuration","actionButtonTitle","handleClose","closeOnClickaway","anchorOrigin","disableWindowBlurListener","resumeHideDuration","TransitionProps","ref","actionComponent","useMemo","_jsx","onClick","children","messageComponent","SnackbarMessage","mainHandleClose","useCallback","event","reason","SnackbarStyled","onClose","action","checkForIcon","styled","MuiSnackbar","shouldForwardProp","prop","_a","args","__rest","paddingLeft","paddingTop","paddingBottom","display"],"mappings":"mRAYY,MAACA,EAAWC,GAAW,EAAGC,OAAMC,UAASC,OAAMC,UAASC,SAAQC,eAAcC,mBAAkBC,oBAAmBC,cAAaC,mBAAkBC,eAAcC,4BAA2BC,qBAAoBC,mBAAoBC,KAC3O,MAAMC,EAAkBC,GAAQ,IACrBT,GAAqBU,EAAK,SAAU,CAAEC,QAASb,EAAcc,SAAUZ,KAC/E,CAACA,EAAmBF,IACjBe,EAAmBJ,GAAQ,IAAMC,EAAKI,EAAiB,CAAEnB,KAAMA,EAAME,OAAQA,EAAQD,QAASA,KAAY,CAACC,EAAQF,EAAMC,IACzHmB,EAAkBC,GAAY,CAACC,EAAOC,MACnChB,GAA+B,cAAXgB,KAGrBjB,GACAA,EAAYgB,EAAOC,GACvBxB,GAAQ,GAAM,GACf,CAACQ,EAAkBD,EAAaP,IACnC,OAAQgB,EAAKS,EAAgB,CAAEnB,kBAAmBA,EAAmBP,KAAMA,EAAMM,iBAAkBA,EAAkBqB,QAASL,EAAiBpB,KAAMA,EAAME,OAAQA,EAAQD,QAASiB,EAAkBQ,OAAQb,EAAiBL,aAAcA,EAAcC,0BAA2BA,EAA2BC,mBAAoBA,EAAoBC,gBAAiBA,EAAiBC,IAAKA,GAAQ,IAE/Xe,EAAgB3B,GACT,UAATA,GAA6B,YAATA,GAA+B,YAATA,EAK/CwB,EAAiBI,EAAOC,EAAa,CACvCC,kBAAoBC,GAAkB,sBAATA,GADVH,EAEnBI,IACG,IAAiBC,EAAOC,EAAOF,EAAI,CAAC,UACvC,MAAO,CACH,mBAAoB,CAChBG,YAAaR,EAAaM,EAAKjC,MAAQ,OAAS,OAChDoC,WAAYH,EAAK/B,OAAS,OAAS,MACnCmC,cAAeJ,EAAK/B,OAAS,OAAS,MACtC,kCAAmC,CAC/B,UAAW,CACP,6BAA8B,CAC1BoC,QAASL,EAAK5B,kBAAoB,OAAS,WAK9D"}

package/components/snackbar/snackbarMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"snackbarMessage.js","sources":["../../../src/components/snackbar/snackbarMessage.tsx"],"sourcesContent":[null],"names":["SnackbarMessage","header","icon","message","IconComponent","useMemo","_icon","iconToReturn","_jsx","Icon","className","fontSize","iconStyle","children","_jsxs","SnackbarMessageStyled","styled","_a","args","__rest","display","paddingBottom","lineHeight","paddingLeft","checkForIcon","borderLeft","theme","palette","onSurface","os600","height"],"mappings":"mPAwBO,MAAMA,EAA0C,EAAGC,SAAQC,OAAMC,cACtE,MAAMC,EAA8CC,GAClD,IACE,EAAGH,KAAMI,MACP,IAAIC,EAAe,KAEnB,OAAQD,GACN,IAAK,QACHC,EAAeC,EAACC,EAAK,CAAAC,UAAU,0BAA0BC,SAAS,UAAUC,UAAU,WACtF,MACF,IAAK,UACHL,EAAeC,EAACC,EAAK,CAAAC,UAAU,eAAeC,SAAS,UAAUC,UAAU,WAC3E,MACF,IAAK,UACHL,EAAeC,EAACC,EAAK,CAAAC,UAAU,qBAAqBC,SAAS,UAAUC,UAAU,WAIrF,OAAOL,EAAeC,UAAME,UAAU,wBAAuBG,SAAEN,IAAuBA,CAAY,GAEtG,IAEF,OACEO,EAACC,EAAqB,CAACd,OAAQA,EAAQC,KAAMA,EAC1CW,SAAA,CAAAX,GAAQM,EAACJ,GAAcF,KAAMA,IAC9BY,EAAA,MAAA,CAAKJ,UAAU,oDACZT,GAAUa,sBAAMb,KACjBa,EAAA,IAAA,CAAAD,SAAA,CAAA,IAAKV,EAAO,UAEdK,EAAA,MAAA,CAAKE,UAAU,mCACbF,EAAW,MAAA,CAAA,OAGf,EAMSO,EAAwBC,EAAO,MAAPA,EAAkEC,QAAKC,EAAIC,EAAAF,EAAT,IACrG,MAAO,CACL,6CAA8C,CAC5CG,QAASF,EAAKjB,OAAS,QAAU,QAEnC,MAAO,CACLmB,QAASF,EAAKjB,OAAS,QAAU,SACjCoB,cAAeH,EAAKjB,OAAS,MAAQ,OAEvC,2BAA4B,CAC1B,SAAU,CACRqB,WAAYJ,EAAKjB,OAAS,OAAS,UAGvC,6BAA8B,CAC5BsB,YAAaC,EAAaN,EAAKhB,MAAQ,OAAS,OAChD,UAAW,CACTuB,WAAY,aAAaP,EAAKQ,MAAMC,QAAQC,UAAUC,QACtDC,OAAQZ,EAAKjB,OAAS,OAAS,SAGpC"}
+{"version":3,"file":"snackbarMessage.js","sources":["../../../src/components/snackbar/snackbarMessage.tsx"],"sourcesContent":["import { __rest } from \"tslib\";\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { useMemo } from 'react';\nimport { Icon } from '../icon';\nimport { styled } from '@mui/material/styles';\nimport { checkForIcon } from './snackbar';\nexport const SnackbarMessage = ({ header, icon, message }) => {\n    const IconComponent = useMemo(() => ({ icon: _icon }) => {\n        let iconToReturn = null;\n        switch (_icon) {\n            case 'alert':\n                iconToReturn = _jsx(Icon, { className: \"triangle-up-exclamation\", fontSize: \"inherit\", iconStyle: \"filled\" });\n                break;\n            case 'success':\n                iconToReturn = _jsx(Icon, { className: \"circle-check\", fontSize: \"inherit\", iconStyle: \"filled\" });\n                break;\n            case 'warning':\n                iconToReturn = _jsx(Icon, { className: \"circle-exclamation\", fontSize: \"inherit\", iconStyle: \"filled\" });\n                break;\n        }\n        return iconToReturn ? _jsx(\"span\", { className: \"snackbar-icon-wrapper\", children: iconToReturn }) : iconToReturn;\n    }, []);\n    return (_jsxs(SnackbarMessageStyled, { header: header, icon: icon, children: [icon && _jsx(IconComponent, { icon: icon }), _jsxs(\"div\", { className: \"styled-message-header-message-container\", children: [header && _jsxs(\"h3\", { children: [\" \", header] }), _jsxs(\"p\", { children: [\" \", message, \" \"] })] }), _jsx(\"div\", { className: \"custom-snackbar-divider\", children: _jsx(\"div\", {}) })] }));\n};\n/**\n * @description SnackbarMessageStyled styling defintion based on props\n */\nexport const SnackbarMessageStyled = styled('div')((_a) => {\n    var args = __rest(_a, []);\n    return {\n        '& .styled-message-header-message-container': {\n            display: args.header ? 'block' : 'flex',\n        },\n        '& p': {\n            display: args.header ? 'block' : 'inline',\n            paddingBottom: args.header ? '0px' : '2px',\n        },\n        '& .snackbar-icon-wrapper': {\n            '& span': {\n                lineHeight: args.header ? '20px' : 'unset',\n            },\n        },\n        '& .custom-snackbar-divider': {\n            paddingLeft: checkForIcon(args.icon) ? '24px' : '56px',\n            '& > div': {\n                borderLeft: `1px solid ${args.theme.palette.onSurface.os600}`,\n                height: args.header ? '48px' : '32px',\n            },\n        },\n    };\n});\n//# sourceMappingURL=snackbarMessage.js.map"],"names":["SnackbarMessage","header","icon","message","IconComponent","useMemo","_icon","iconToReturn","_jsx","Icon","className","fontSize","iconStyle","children","_jsxs","SnackbarMessageStyled","styled","_a","args","__rest","display","paddingBottom","lineHeight","paddingLeft","checkForIcon","borderLeft","theme","palette","onSurface","os600","height"],"mappings":"mPAMY,MAACA,EAAkB,EAAGC,SAAQC,OAAMC,cAC5C,MAAMC,EAAgBC,GAAQ,IAAM,EAAGH,KAAMI,MACzC,IAAIC,EAAe,KACnB,OAAQD,GACJ,IAAK,QACDC,EAAeC,EAAKC,EAAM,CAAEC,UAAW,0BAA2BC,SAAU,UAAWC,UAAW,WAClG,MACJ,IAAK,UACDL,EAAeC,EAAKC,EAAM,CAAEC,UAAW,eAAgBC,SAAU,UAAWC,UAAW,WACvF,MACJ,IAAK,UACDL,EAAeC,EAAKC,EAAM,CAAEC,UAAW,qBAAsBC,SAAU,UAAWC,UAAW,WAGrG,OAAOL,EAAeC,EAAK,OAAQ,CAAEE,UAAW,wBAAyBG,SAAUN,IAAkBA,CAAY,GAClH,IACH,OAAQO,EAAMC,EAAuB,CAAEd,OAAQA,EAAQC,KAAMA,EAAMW,SAAU,CAACX,GAAQM,EAAKJ,EAAe,CAAEF,KAAMA,IAASY,EAAM,MAAO,CAAEJ,UAAW,0CAA2CG,SAAU,CAACZ,GAAUa,EAAM,KAAM,CAAED,SAAU,CAAC,IAAKZ,KAAYa,EAAM,IAAK,CAAED,SAAU,CAAC,IAAKV,EAAS,UAAaK,EAAK,MAAO,CAAEE,UAAW,0BAA2BG,SAAUL,EAAK,MAAO,CAAE,OAAU,EAK/XO,EAAwBC,EAAO,MAAPA,EAAeC,IAChD,IAAIC,EAAOC,EAAOF,EAAI,IACtB,MAAO,CACH,6CAA8C,CAC1CG,QAASF,EAAKjB,OAAS,QAAU,QAErC,MAAO,CACHmB,QAASF,EAAKjB,OAAS,QAAU,SACjCoB,cAAeH,EAAKjB,OAAS,MAAQ,OAEzC,2BAA4B,CACxB,SAAU,CACNqB,WAAYJ,EAAKjB,OAAS,OAAS,UAG3C,6BAA8B,CAC1BsB,YAAaC,EAAaN,EAAKhB,MAAQ,OAAS,OAChD,UAAW,CACPuB,WAAY,aAAaP,EAAKQ,MAAMC,QAAQC,UAAUC,QACtDC,OAAQZ,EAAKjB,OAAS,OAAS,SAG1C"}

package/components/stepper/stepper.d.ts

@@ -1,7 +1,7 @@
-import React from 'react';
+import { FC, HTMLAttributes, ReactNode } from 'react';
 import { SxProps } from '@mui/system';
 import { Theme } from '@mui/material';
-export interface StepperProps extends React.HTMLAttributes<HTMLDivElement> {
+export interface StepperProps extends HTMLAttributes<HTMLDivElement> {
     /**
      *  The activeStep of a stepper.
      */
@@ -17,7 +17,7 @@ export interface StepperProps extends React.HTMLAttributes<HTMLDivElement> {
     /**
      *  Two or more <Step /> components.
      */
-    children: React.ReactNode;
+    children: ReactNode;
     /**
      *  Override or extend the styles applied to the component.
      */
@@ -39,4 +39,4 @@ export interface StepperProps extends React.HTMLAttributes<HTMLDivElement> {
      */
     step?: Array<string>;
 }
-export declare const Stepper: React.ForwardRefExoticComponent<StepperProps & React.RefAttributes<HTMLDivElement>>;
+export declare const Stepper: FC<StepperProps>;

package/components/stepper/stepper.js

@@ -1,2 +1,2 @@
-import{__rest as e}from"tslib";import{jsx as o}from"react/jsx-runtime";import r from"react";import t from"@mui/material/Stepper";import{styled as n}from"@mui/material/styles";import{StepConnector as a,stepConnectorClasses as i,Step as l,StepLabel as c}from"@mui/material";import{flowColors as d}from"../../design/skoda/palette.theme.js";const s=r.forwardRef(((r,n)=>{var{activeStep:a,alternativeLabel:i,children:d,classes:s,connector:m,nonLinear:u,orientation:f,step:g}=r,x=e(r,["activeStep","alternativeLabel","children","classes","connector","nonLinear","orientation","step"]);const S={lineHeight:"16px",fontSize:"12px",fontWeight:"400"};return o(b,{children:o("div",{children:o(t,Object.assign({className:"controllerContainer"},x,{activeStep:a,sx:{maxWidth:800,display:"flex",alignItems:"center",spacing:4},alternativeLabel:i,connector:o(h,{}),children:g.map((e=>o(l,{children:o(c,{style:S,StepIconComponent:p,children:e})},e)))}))})})}));function p(e){const{active:r,completed:t,className:n}=e;return o(m,{className:n,children:o("div",r?{className:"QontoStepIcon-active"}:t?{className:"QontoStepIcon-completedIcon"}:{className:"QontoStepIcon-circle"})})}const m=n("div")((({theme:e})=>{let o={};return o={color:"dark"===e.palette.mode?e.palette.grey[700]:"#464748",display:"flex",height:22,alignItems:"center","& .QontoStepIcon-completedIcon":{color:d.onSurface.os700,width:12,height:12,borderRadius:"50%",backgroundColor:"currentColor","&:hover":{borderRadius:"50%",border:`1.5px solid ${d.onSurface.os700}`,color:d.brand.secondary}},"& .QontoStepIcon-active":{color:d.onSurface.os700,width:18,height:18,borderRadius:"50%",marginRight:"5.25px",marginLeft:"0px",backgroundColor:"currentColor","&:hover":{borderRadius:"50%",border:`1.5px solid ${d.onSurface.os700}`,color:d.brand.secondary}},"& .QontoStepIcon-circle":{width:12,height:12,borderRadius:"50%",border:"1.5px solid #C4C6C7",color:"transparent","&:hover":{cursor:"pointer",borderRadius:"50%",border:`1.5px solid ${d.disabled.tertiary}`,backgroundColor:d.disabled.secondary}}},o})),h=n(a)((({theme:e})=>({[`&.${i.alternativeLabel}`]:{top:10,left:"calc(-50% + 8px)",right:"calc(50% + 8px)"},[`&.${i.active}`]:{[`& .${i.line}`]:{borderColor:d.onSurface.os700,width:"60px"}},[`&.${i.completed}`]:{[`& .${i.line}`]:{borderColor:d.onSurface.os700}},[`& .${i.line}`]:{borderColor:"dark"===e.palette.mode?e.palette.grey[800]:d.disabled.primary,borderTopWidth:3,borderRadius:1}}))),b=n("div")((({theme:e})=>{let o={};return o={"& .controllerContainer":{display:"flex",alignItems:"center",fontFamily:"SKODA Next",fontStyle:"normal",fontWeight:"700",fontSize:"12px",lineHeight:"16px"}},o}));export{s as Stepper};
+import{__rest as e}from"tslib";import{jsx as o}from"react/jsx-runtime";import r from"@mui/material/Stepper";import{styled as t}from"@mui/material/styles";import{StepConnector as n,stepConnectorClasses as i,Step as a,StepLabel as l}from"@mui/material";import{flowColors as c}from"../../design/skoda/palette.theme.js";const d=t=>{var{activeStep:n,alternativeLabel:i,children:c,classes:d,connector:p,nonLinear:b,orientation:u,step:f}=t,g=e(t,["activeStep","alternativeLabel","children","classes","connector","nonLinear","orientation","step"]);const x={lineHeight:"16px",fontSize:"12px",fontWeight:"400"};return o(h,{children:o("div",{children:o(r,Object.assign({className:"controllerContainer"},g,{activeStep:n,sx:{maxWidth:800,display:"flex",alignItems:"center",spacing:4},alternativeLabel:i,connector:o(m,{}),children:f.map((e=>o(a,{children:o(l,{style:x,StepIconComponent:s,children:e})},e)))}))})})};function s(e){const{active:r,completed:t,className:n}=e;return o(p,{className:n,children:o("div",r?{className:"QontoStepIcon-active"}:t?{className:"QontoStepIcon-completedIcon"}:{className:"QontoStepIcon-circle"})})}const p=t("div")((({theme:e})=>{let o={};return o={color:"dark"===e.palette.mode?e.palette.grey[700]:"#464748",display:"flex",height:22,alignItems:"center","& .QontoStepIcon-completedIcon":{color:c.onSurface.os700,width:12,height:12,borderRadius:"50%",backgroundColor:"currentColor","&:hover":{borderRadius:"50%",border:`1.5px solid ${c.onSurface.os700}`,color:c.brand.secondary}},"& .QontoStepIcon-active":{color:c.onSurface.os700,width:18,height:18,borderRadius:"50%",marginRight:"5.25px",marginLeft:"0px",backgroundColor:"currentColor","&:hover":{borderRadius:"50%",border:`1.5px solid ${c.onSurface.os700}`,color:c.brand.secondary}},"& .QontoStepIcon-circle":{width:12,height:12,borderRadius:"50%",border:"1.5px solid #C4C6C7",color:"transparent","&:hover":{cursor:"pointer",borderRadius:"50%",border:`1.5px solid ${c.disabled.tertiary}`,backgroundColor:c.disabled.secondary}}},o})),m=t(n)((({theme:e})=>({[`&.${i.alternativeLabel}`]:{top:10,left:"calc(-50% + 8px)",right:"calc(50% + 8px)"},[`&.${i.active}`]:{[`& .${i.line}`]:{borderColor:c.onSurface.os700,width:"60px"}},[`&.${i.completed}`]:{[`& .${i.line}`]:{borderColor:c.onSurface.os700}},[`& .${i.line}`]:{borderColor:"dark"===e.palette.mode?e.palette.grey[800]:c.disabled.primary,borderTopWidth:3,borderRadius:1}}))),h=t("div")((()=>{let e={};return e={"& .controllerContainer":{display:"flex",alignItems:"center",fontFamily:"SKODA Next",fontStyle:"normal",fontWeight:"700",fontSize:"12px",lineHeight:"16px"}},e}));export{d as Stepper};
 //# sourceMappingURL=stepper.js.map

package/components/stepper/stepper.js.map

@@ -1 +1 @@
-{"version":3,"file":"stepper.js","sources":["../../../src/components/stepper/stepper.tsx"],"sourcesContent":[null],"names":["Stepper","React","forwardRef","_a","ref","activeStep","alternativeLabel","children","classes","connector","nonLinear","orientation","step","props","__rest","styles","lineHeight","fontSize","fontWeight","_jsx","StepperStyled","MuiStepper","Object","assign","className","sx","maxWidth","display","alignItems","spacing","QontoConnector","map","label","Step","StepLabel","style","StepIconComponent","QontoStepIcon","active","completed","QontoStepIconRoot","styled","theme","color","palette","mode","grey","height","flowColors","onSurface","os700","width","borderRadius","backgroundColor","border","brand","secondary","marginRight","marginLeft","cursor","disabled","tertiary","StepConnector","stepConnectorClasses","top","left","right","line","borderColor","primary","borderTopWidth","fontFamily","fontStyle"],"mappings":"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"}
+{"version":3,"file":"stepper.js","sources":["../../../src/components/stepper/stepper.tsx"],"sourcesContent":["import { __rest } from \"tslib\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport MuiStepper from '@mui/material/Stepper';\nimport { styled } from '@mui/material/styles';\nimport { Step, StepConnector, stepConnectorClasses, StepLabel } from '@mui/material';\nimport { flowColors } from '../../design/skoda/palette.theme';\nexport const Stepper = (_a) => {\n    var { activeStep, alternativeLabel, children, classes, connector, nonLinear, orientation, step } = _a, props = __rest(_a, [\"activeStep\", \"alternativeLabel\", \"children\", \"classes\", \"connector\", \"nonLinear\", \"orientation\", \"step\"]);\n    const styles = {\n        lineHeight: '16px',\n        fontSize: '12px',\n        fontWeight: '400',\n    };\n    const desktopStepper = () => (_jsx(\"div\", { children: _jsx(MuiStepper, Object.assign({ className: \"controllerContainer\" }, props, { activeStep: activeStep, sx: {\n                maxWidth: 800,\n                display: 'flex',\n                alignItems: 'center',\n                spacing: 4,\n            }, alternativeLabel: alternativeLabel, connector: _jsx(QontoConnector, {}), children: step.map((label) => (_jsx(Step, { children: _jsx(StepLabel, { style: styles, StepIconComponent: QontoStepIcon, children: label }) }, label))) })) }));\n    return _jsx(StepperStyled, { children: desktopStepper() });\n};\nfunction QontoStepIcon(props) {\n    const { active, completed, className } = props;\n    return (_jsx(QontoStepIconRoot, { className: className, children: active ? (_jsx(\"div\", { className: \"QontoStepIcon-active\" })) : completed ? (_jsx(\"div\", { className: \"QontoStepIcon-completedIcon\" })) : (_jsx(\"div\", { className: \"QontoStepIcon-circle\" })) }));\n}\nconst QontoStepIconRoot = styled('div')(({ theme }) => {\n    let style = {};\n    style = {\n        color: theme.palette.mode === 'dark' ? theme.palette.grey[700] : '#464748',\n        display: 'flex',\n        height: 22,\n        alignItems: 'center',\n        '& .QontoStepIcon-completedIcon': {\n            color: flowColors.onSurface.os700,\n            width: 12,\n            height: 12,\n            borderRadius: '50%',\n            backgroundColor: 'currentColor',\n            '&:hover': {\n                borderRadius: '50%',\n                border: `1.5px solid ${flowColors.onSurface.os700}`,\n                color: flowColors.brand.secondary,\n            },\n        },\n        '& .QontoStepIcon-active': {\n            color: flowColors.onSurface.os700,\n            width: 18,\n            height: 18,\n            borderRadius: '50%',\n            marginRight: '5.25px',\n            marginLeft: '0px',\n            backgroundColor: 'currentColor',\n            '&:hover': {\n                borderRadius: '50%',\n                border: `1.5px solid ${flowColors.onSurface.os700}`,\n                color: flowColors.brand.secondary,\n            },\n        },\n        '& .QontoStepIcon-circle': {\n            width: 12,\n            height: 12,\n            borderRadius: '50%',\n            border: '1.5px solid #C4C6C7',\n            color: 'transparent',\n            '&:hover': {\n                cursor: 'pointer',\n                borderRadius: '50%',\n                border: `1.5px solid ${flowColors.disabled.tertiary}`,\n                backgroundColor: flowColors.disabled.secondary,\n            },\n        },\n    };\n    return style;\n});\nconst QontoConnector = styled(StepConnector)(({ theme }) => ({\n    [`&.${stepConnectorClasses.alternativeLabel}`]: {\n        top: 10,\n        left: 'calc(-50% + 8px)',\n        right: 'calc(50% + 8px)',\n    },\n    [`&.${stepConnectorClasses.active}`]: {\n        [`& .${stepConnectorClasses.line}`]: {\n            borderColor: flowColors.onSurface.os700,\n            width: '60px',\n        },\n    },\n    [`&.${stepConnectorClasses.completed}`]: {\n        [`& .${stepConnectorClasses.line}`]: {\n            borderColor: flowColors.onSurface.os700,\n        },\n    },\n    [`& .${stepConnectorClasses.line}`]: {\n        borderColor: theme.palette.mode === 'dark' ? theme.palette.grey[800] : flowColors.disabled.primary,\n        borderTopWidth: 3,\n        borderRadius: 1,\n    },\n}));\nconst StepperStyled = styled('div')(() => {\n    let style = {};\n    const SKODA_NEXT = 'SKODA Next';\n    style = {\n        '& .controllerContainer': {\n            display: 'flex',\n            alignItems: 'center',\n            fontFamily: SKODA_NEXT,\n            fontStyle: 'normal',\n            fontWeight: '700',\n            fontSize: '12px',\n            lineHeight: '16px',\n        },\n    };\n    return style;\n});\n//# sourceMappingURL=stepper.js.map"],"names":["Stepper","_a","activeStep","alternativeLabel","children","classes","connector","nonLinear","orientation","step","props","__rest","styles","lineHeight","fontSize","fontWeight","_jsx","StepperStyled","MuiStepper","Object","assign","className","sx","maxWidth","display","alignItems","spacing","QontoConnector","map","label","Step","StepLabel","style","StepIconComponent","QontoStepIcon","active","completed","QontoStepIconRoot","styled","theme","color","palette","mode","grey","height","flowColors","onSurface","os700","width","borderRadius","backgroundColor","border","brand","secondary","marginRight","marginLeft","cursor","disabled","tertiary","StepConnector","stepConnectorClasses","top","left","right","line","borderColor","primary","borderTopWidth","fontFamily","fontStyle"],"mappings":"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"}

package/components/tab/hook/useTabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTabs.js","sources":["../../../../src/components/tab/hook/useTabs.ts"],"sourcesContent":[null],"names":["useTabs","theme","useTheme","handleOverflowingTabs","useCallback","tabsRef","windowWidth","children","setMenuChildren","tabsListContainer","current","closest","querySelectorAll","tabsList","moreBtn","find","item","id","forEach","style","display","hiddenItems","primaryWidth","offsetWidth","primaryItems","filter","moreBtnWidth","offsetLeft","push","length","arr","filteredChildren","React","Children","toArray","child","props","value","breakpoints","values","lg","handleIsMobileView","variantSecondaryNavigation","isMobileView","setIsMobileView","setWindowWidth","window","innerWidth","md","a11yProps","index"],"mappings":"gFAGM,MAAAA,EAAU,KACd,MAAMC,EAAQC,IAiEd,MAAO,CACLC,sBAhE4BC,GAC5B,CAACC,EAASC,EAAaC,EAAUC,KAC/B,MACMC,EADiBJ,EAAQK,QAAQC,QAAQ,OACNC,iBAAiB,OAAO,GAC3DC,EAAWJ,EAAkBG,iBAAiB,gBAC9CE,EAAU,IAAID,GAAUE,MAAMC,GAAqB,oBAAZA,EAAKC,KAClDJ,EAASK,SAASF,IAChBA,EAAKG,MAAMC,QAAU,aAAa,IAGpC,MAAMC,EAAc,GACdC,EAAeb,EAAkBc,YACjCC,EAAe,IAAIX,GAAUY,QAAQT,GAAqB,oBAAZA,EAAKC,KACnDS,EAAeZ,EAAQS,YAAc,GAU3C,GARAC,EAAaN,SAASF,IAChBM,GAAgBN,EAAKW,YAAcX,EAAKO,YAAcG,KACxDV,EAAKG,MAAMC,QAAU,OACrBC,EAAYO,KAAKZ,EAAKC,IACvB,IAIEI,EAAYQ,OAEV,CACL,MAAMC,EAAM,GACZT,EAAYH,SAASF,IACnB,MAAMe,EAAmBC,EAAMC,SAASC,QAAQ3B,GAAUQ,MACvDoB,GAAenB,IAAS,cAAgBmB,EAAMC,MAAMC,QAEnDN,GACFD,EAAIF,KAAKG,EACV,IAEHvB,EAAgBsB,EACjB,MAZChB,EAAQK,MAAMC,QAAU,MAYzB,GAEH,CAACnB,EAAMqC,YAAYC,OAAOC,KA2B1BC,mBAxByBrC,GACzB,CAACsC,EAA4BC,EAAcC,EAAiBC,KAC1DA,EAAeC,OAAOC,YAClBL,IACEI,OAAOC,YAAc9C,EAAMqC,YAAYC,OAAOS,KAAOL,EACvDC,GAAgB,GACPE,OAAOC,WAAa9C,EAAMqC,YAAYC,OAAOS,IACtDJ,GAAgB,GAEnB,GAEH,CAAC3C,EAAMqC,YAAYC,OAAOS,KAc1BC,UAVgB7C,GAAa8C,IACtB,CACLjC,GAAI,cAAciC,IAClB,gBAAiB,mBAAmBA,OAErC,IAMF"}
+{"version":3,"file":"useTabs.js","sources":["../../../../src/components/tab/hook/useTabs.ts"],"sourcesContent":["import { useTheme } from '@mui/material';\nimport React, { useCallback } from 'react';\nconst useTabs = () => {\n    const theme = useTheme();\n    //HANDLE THE RENDER OF THE MORE BTN TABS AND THE OVERFLOWING TABS THAT MUST BE SHOWN INSIDE THE DROPDOWN\n    const handleOverflowingTabs = useCallback((tabsRef, windowWidth, children, setMenuChildren) => {\n        const tabsListParent = tabsRef.current.closest('div');\n        const tabsListContainer = tabsListParent.querySelectorAll('div')[1];\n        const tabsList = tabsListContainer.querySelectorAll('.MuiTab-root');\n        const moreBtn = [...tabsList].find((item) => item.id === 'simple-tab-more');\n        tabsList.forEach((item) => {\n            item.style.display = 'inline-flex';\n        });\n        //if the screen size is desktop view, handle more btn, else hide more btn\n        const hiddenItems = [];\n        const primaryWidth = tabsListContainer.offsetWidth;\n        const primaryItems = [...tabsList].filter((item) => item.id !== 'simple-tab-more');\n        const moreBtnWidth = moreBtn.offsetWidth + 58;\n        //we are hiding tabs if the overflow the tabs container\n        primaryItems.forEach((item) => {\n            if (primaryWidth <= item.offsetLeft + (item.offsetWidth + moreBtnWidth)) {\n                item.style.display = 'none';\n                hiddenItems.push(item.id);\n            }\n        });\n        // if there are hidden elements (overflowing) show the more tabs and add hidden elements inisde the menu list\n        //else hide more button\n        if (!hiddenItems.length) {\n            moreBtn.style.display = 'none';\n        }\n        else {\n            const arr = [];\n            hiddenItems.forEach((item) => {\n                const filteredChildren = React.Children.toArray(children).find((child) => item === 'simple-tab-' + child.props.value);\n                if (filteredChildren) {\n                    arr.push(filteredChildren);\n                }\n            });\n            setMenuChildren(arr);\n        }\n    }, [theme.breakpoints.values.lg]);\n    const handleIsMobileView = useCallback((variantSecondaryNavigation, isMobileView, setIsMobileView, setWindowWidth) => {\n        setWindowWidth(window.innerWidth);\n        if (variantSecondaryNavigation) {\n            if (window.innerWidth <= theme.breakpoints.values.md && !isMobileView) {\n                setIsMobileView(true);\n            }\n            else if (window.innerWidth > theme.breakpoints.values.md) {\n                setIsMobileView(false);\n            }\n        }\n    }, [theme.breakpoints.values.md]);\n    //Returns the id and the aria controls for the tab component\n    const a11yProps = useCallback((index) => {\n        return {\n            id: `simple-tab-${index}`,\n            'aria-controls': `simple-tabpanel-${index}`,\n        };\n    }, []);\n    return {\n        handleOverflowingTabs,\n        handleIsMobileView,\n        a11yProps,\n    };\n};\nexport default useTabs;\n//# sourceMappingURL=useTabs.js.map"],"names":["useTabs","theme","useTheme","handleOverflowingTabs","useCallback","tabsRef","windowWidth","children","setMenuChildren","tabsListContainer","current","closest","querySelectorAll","tabsList","moreBtn","find","item","id","forEach","style","display","hiddenItems","primaryWidth","offsetWidth","primaryItems","filter","moreBtnWidth","offsetLeft","push","length","arr","filteredChildren","React","Children","toArray","child","props","value","breakpoints","values","lg","handleIsMobileView","variantSecondaryNavigation","isMobileView","setIsMobileView","setWindowWidth","window","innerWidth","md","a11yProps","index"],"mappings":"gFAEK,MAACA,EAAU,KACZ,MAAMC,EAAQC,IAwDd,MAAO,CACHC,sBAvD0BC,GAAY,CAACC,EAASC,EAAaC,EAAUC,KACvE,MACMC,EADiBJ,EAAQK,QAAQC,QAAQ,OACNC,iBAAiB,OAAO,GAC3DC,EAAWJ,EAAkBG,iBAAiB,gBAC9CE,EAAU,IAAID,GAAUE,MAAMC,GAAqB,oBAAZA,EAAKC,KAClDJ,EAASK,SAASF,IACdA,EAAKG,MAAMC,QAAU,aAAa,IAGtC,MAAMC,EAAc,GACdC,EAAeb,EAAkBc,YACjCC,EAAe,IAAIX,GAAUY,QAAQT,GAAqB,oBAAZA,EAAKC,KACnDS,EAAeZ,EAAQS,YAAc,GAU3C,GARAC,EAAaN,SAASF,IACdM,GAAgBN,EAAKW,YAAcX,EAAKO,YAAcG,KACtDV,EAAKG,MAAMC,QAAU,OACrBC,EAAYO,KAAKZ,EAAKC,IACzB,IAIAI,EAAYQ,OAGZ,CACD,MAAMC,EAAM,GACZT,EAAYH,SAASF,IACjB,MAAMe,EAAmBC,EAAMC,SAASC,QAAQ3B,GAAUQ,MAAMoB,GAAUnB,IAAS,cAAgBmB,EAAMC,MAAMC,QAC3GN,GACAD,EAAIF,KAAKG,EACZ,IAELvB,EAAgBsB,EACnB,MAXGhB,EAAQK,MAAMC,QAAU,MAW3B,GACF,CAACnB,EAAMqC,YAAYC,OAAOC,KAqBzBC,mBApBuBrC,GAAY,CAACsC,EAA4BC,EAAcC,EAAiBC,KAC/FA,EAAeC,OAAOC,YAClBL,IACII,OAAOC,YAAc9C,EAAMqC,YAAYC,OAAOS,KAAOL,EACrDC,GAAgB,GAEXE,OAAOC,WAAa9C,EAAMqC,YAAYC,OAAOS,IAClDJ,GAAgB,GAEvB,GACF,CAAC3C,EAAMqC,YAAYC,OAAOS,KAWzBC,UATc7C,GAAa8C,IACpB,CACHjC,GAAI,cAAciC,IAClB,gBAAiB,mBAAmBA,OAEzC,IAKF"}

package/components/tab/menuTab.js

@@ -1,2 +1,2 @@
-import{__rest as e}from"tslib";import{jsx as o,jsxs as r,Fragment as a}from"react/jsx-runtime";import i,{useContext as l,useState as t,useCallback as n,useEffect as c}from"react";import{TabsContext as p}from"./tabs.js";import{MenuItem as s,Popper as m,ClickAwayListener as d,Fade as b,styled as h,MenuList as u}from"@mui/material";import{Icon as f}from"../icon/icon.js";import x from"./tabStyled.js";import v from"./hook/useTabs.js";const k=i.forwardRef(((h,u)=>{var{label:k,value:C,onClick:g,children:j,showBackdrop:y}=h;e(h,["label","value","onClick","children","showBackdrop"]);const{activeTab:T,updateActiveTab:S,smallSize:z}=l(p),[A,P]=t(!1),[B,N]=t(!1),[O,R]=t(null),[E,H]=t(null),{a11yProps:I}=v(),M=n((e=>{e.href?window.open(e.href,e.target):S(e.value,!0),N(!1),e.onClick&&e.onClick(e.value),e.analyticsCallback&&e.analyticsCallback(e.value),H(e.label)}),[S]),q=n((e=>{N(!B),R(e.currentTarget)}),[B]),D=n((()=>i.Children.map(j,(e=>o(s,{style:{fontSize:"16px"},onClick:()=>M(e.props),children:e.props.label})))),[j,M]);return c((()=>{P(T===C)}),[T,A,C]),r(a,{children:[o(x,Object.assign({ref:u,wrapped:!0,onClick:q,smallSize:z,isActive:A,value:C,tabIndex:1,label:E||k},I(C),{icon:o(f,{className:B?"chevron-up":"chevron-down"}),iconPosition:"end",className:"MuiTab-more"})),o(m,{open:B,anchorEl:O,placement:"bottom",transition:!0,children:({TransitionProps:e})=>o(d,{onClickAway:()=>N(!1),children:o(b,Object.assign({},e,{timeout:350,children:o(w,{id:"more-tabs-menu",children:D()})}))})})]})})),w=h(u)((({theme:e})=>({top:"13px",left:"27px",boxShadow:"rgb(0 0 0 / 15%) 0px 3px 8px",borderRadius:"4px",padding:"0px",width:"131px",maxHeight:"240px",overflow:"overlay"})));export{k as MenuTab};
+import{jsx as e,jsxs as o,Fragment as a}from"react/jsx-runtime";import r,{forwardRef as i,useContext as l,useState as t,useCallback as n,useEffect as c}from"react";import{TabsContext as p}from"./tabs.js";import{MenuItem as s,Popper as m,ClickAwayListener as d,Fade as b,styled as u,MenuList as h}from"@mui/material";import{Icon as x}from"../icon/icon.js";import f from"./tabStyled.js";import v from"./hook/useTabs.js";const k=i((({label:i,value:u,children:h},k)=>{const{activeTab:C,updateActiveTab:g,smallSize:j}=l(p),[y,T]=t(!1),[S,z]=t(!1),[A,P]=t(null),[N,O]=t(null),{a11yProps:E}=v(),H=n((e=>{e.href?window.open(e.href,e.target):g(e.value,!0),z(!1),e.onClick&&e.onClick(e.value),e.analyticsCallback&&e.analyticsCallback(e.value),O(e.label)}),[g]),I=n((e=>{z(!S),P(e.currentTarget)}),[S]),M=n((()=>r.Children.map(h,(o=>e(s,{style:{fontSize:"16px"},onClick:()=>H(o.props),children:o.props.label})))),[h,H]);return c((()=>{T(C===u)}),[C,y,u]),o(a,{children:[e(f,Object.assign({ref:k,wrapped:!0,onClick:I,smallSize:j,isActive:y,value:u,tabIndex:1,label:N||i},E(u),{icon:e(x,{className:S?"chevron-up":"chevron-down"}),iconPosition:"end",className:"MuiTab-more"})),e(m,{open:S,anchorEl:A,placement:"bottom",transition:!0,children:({TransitionProps:o})=>e(d,{onClickAway:()=>z(!1),children:e(b,Object.assign({},o,{timeout:350,children:e(w,{id:"more-tabs-menu",children:M()})}))})})]})})),w=u(h)((()=>({top:"13px",left:"27px",boxShadow:"rgb(0 0 0 / 15%) 0px 3px 8px",borderRadius:"4px",padding:"0px",width:"131px",maxHeight:"240px",overflow:"overlay"})));export{k as MenuTab};
 //# sourceMappingURL=menuTab.js.map

package/components/tab/menuTab.js.map

@@ -1 +1 @@
-{"version":3,"file":"menuTab.js","sources":["../../../src/components/tab/menuTab.tsx"],"sourcesContent":[null],"names":["MenuTab","React","forwardRef","_a","ref","label","value","onClick","children","showBackdrop","__rest","activeTab","updateActiveTab","smallSize","useContext","TabsContext","isActive","setIsActive","useState","open","setOpen","anchorEl","setAnchorEl","selectedLabel","setSelectedLabel","a11yProps","useTabs","handleOnClick","useCallback","_props","href","window","target","analyticsCallback","handleOpenMenu","e","currentTarget","handleMenuItems","Children","map","child","_jsx","MenuItem","style","fontSize","props","useEffect","_jsxs","_Fragment","TabStyled","Object","assign","wrapped","tabIndex","icon","Icon","className","iconPosition","Popper","placement","transition","TransitionProps","ClickAwayListener","onClickAway","Fade","timeout","MenuStyled","id","styled","MenuList","theme","top","left","boxShadow","borderRadius","padding","width","maxHeight","overflow"],"mappings":"ibA+CO,MAAMA,EAAUC,EAAMC,YAC3B,CAACC,EAA6DC,KAA7D,IAAAC,MAAEA,EAAKC,MAAEA,EAAKC,QAAEA,EAAOC,SAAEA,EAAQC,aAAEA,GAAwBN,EAAFO,EAAAP,EAAzD,uDACC,MAAMQ,UAAEA,EAASC,gBAAEA,EAAeC,UAAEA,GAAcC,EAAWC,IACtDC,EAAUC,GAAeC,GAAS,IAClCC,EAAMC,GAAWF,GAAS,IAC1BG,EAAUC,GAAeJ,EAAS,OAClCK,EAAeC,GAAoBN,EAAS,OAC7CO,UAAEA,GAAcC,IAKhBC,EAAgBC,GACnBC,IACMA,EAAOC,KAGVC,OAAOZ,KAAKU,EAAOC,KAAMD,EAAOG,QAFhCpB,EAAgBiB,EAAOvB,OAAO,GAIhCc,GAAQ,GACRS,EAAOtB,SAAWsB,EAAOtB,QAAQsB,EAAOvB,OACxCuB,EAAOI,mBAAqBJ,EAAOI,kBAAkBJ,EAAOvB,OAC5DkB,EAAiBK,EAAOxB,MAAM,GAEhC,CAACO,IAGGsB,EAAiBN,GACpBO,IACCf,GAASD,GACTG,EAAYa,EAAEC,cAAc,GAE9B,CAACjB,IAIGkB,EAAkBT,GAAY,IAC3B3B,EAAMqC,SAASC,IAAI/B,GAAWgC,GAEjCC,EAACC,EAAQ,CAACC,MAAO,CAAEC,SAAU,QAAUrC,QAAS,IAAMoB,EAAca,EAAMK,OAAMrC,SAC7EgC,EAAMK,MAAMxC,WAIlB,CAACG,EAAUmB,IAWd,OARAmB,GAAU,KAEN7B,EADEN,IAAcL,EAIjB,GACA,CAACK,EAAWK,EAAUV,IAGvByC,EAAAC,EAAA,CAAAxC,SAAA,CACEiC,EAACQ,EACCC,OAAAC,OAAA,CAAA/C,IAAKA,EACLgD,SACA,EAAA7C,QAAS2B,EACTrB,UAAWA,EACXG,SAAUA,EACVV,MAAOA,EACP+C,SAAU,EACVhD,MAAOkB,GAAiBlB,GACpBoB,EAAUnB,GAAM,CACpBgD,KAAMb,EAACc,GAAKC,UAAWrC,EAAO,aAAe,iBAC7CsC,aAAa,MACbD,UAAU,iBAEZf,EAACiB,EAAM,CAACvC,KAAMA,EAAME,SAAUA,EAAUsC,UAAU,SAASC,YACxD,EAAApD,SAAA,EAAGqD,qBACFpB,EAACqB,EAAiB,CAACC,YAAa,IAAM3C,GAAQ,GAC5CZ,SAAAiC,EAACuB,EAAId,OAAAC,OAAA,CAAA,EAAKU,EAAe,CAAEI,QAAS,IAClCzD,SAAAiC,EAACyB,EAAU,CAACC,GAAG,iBAAgB3D,SAAE6B,eAM3C,IAIA6B,EAAaE,EAAOC,EAAPD,EAA0B,EAAGE,YACvC,CACLC,IAAK,OACLC,KAAM,OACNC,UAAW,+BACXC,aAAc,MACdC,QAAS,MACTC,MAAO,QACPC,UAAW,QACXC,SAAU"}
+{"version":3,"file":"menuTab.js","sources":["../../../src/components/tab/menuTab.tsx"],"sourcesContent":["import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport React, { useState, useContext, useEffect, useCallback, forwardRef } from 'react';\nimport { TabsContext } from './tabs';\nimport { ClickAwayListener, Fade, MenuItem, MenuList, Popper, styled } from '@mui/material';\nimport { Icon } from '../icon';\nimport TabStyled from './tabStyled';\nimport useTabs from './hook/useTabs';\n/**\n * @description SkodaFlow Tab component.\n * @param props TabProps\n * @returns React Functional Component\n */\nexport const MenuTab = forwardRef(({ label, value, children }, ref) => {\n    const { activeTab, updateActiveTab, smallSize } = useContext(TabsContext);\n    const [isActive, setIsActive] = useState(false);\n    const [open, setOpen] = useState(false);\n    const [anchorEl, setAnchorEl] = useState(null);\n    const [selectedLabel, setSelectedLabel] = useState(null);\n    const { a11yProps } = useTabs();\n    //On tab clicked: set the new activeTab selected\n    //if is a menu tab: set the anchor element for the menu and set the width of the menu equal to the tab component\n    //then call the onClick from outside\n    const handleOnClick = useCallback((_props) => {\n        if (!_props.href) {\n            updateActiveTab(_props.value, true);\n        }\n        else {\n            window.open(_props.href, _props.target);\n        }\n        setOpen(false);\n        _props.onClick && _props.onClick(_props.value);\n        _props.analyticsCallback && _props.analyticsCallback(_props.value);\n        setSelectedLabel(_props.label);\n    }, [updateActiveTab]);\n    const handleOpenMenu = useCallback((e) => {\n        setOpen(!open);\n        setAnchorEl(e.currentTarget);\n    }, [open]);\n    //RETURNS ALL THE TABS OVERFLOWING AS MENU ITEMS\n    const handleMenuItems = useCallback(() => {\n        return React.Children.map(children, (child) => {\n            return (_jsx(MenuItem, { style: { fontSize: '16px' }, onClick: () => handleOnClick(child.props), children: child.props.label }));\n        });\n    }, [children, handleOnClick]);\n    //If the activeTab is equal to the current tab, set active\n    useEffect(() => {\n        if (activeTab === value) {\n            setIsActive(true);\n        }\n        else {\n            setIsActive(false);\n        }\n    }, [activeTab, isActive, value]);\n    return (_jsxs(_Fragment, { children: [_jsx(TabStyled, Object.assign({ ref: ref, wrapped: true, onClick: handleOpenMenu, smallSize: smallSize, isActive: isActive, value: value, tabIndex: 1, label: selectedLabel || label }, a11yProps(value), { icon: _jsx(Icon, { className: open ? 'chevron-up' : 'chevron-down' }), iconPosition: \"end\", className: \"MuiTab-more\" })), _jsx(Popper, { open: open, anchorEl: anchorEl, placement: \"bottom\", transition: true, children: ({ TransitionProps }) => (_jsx(ClickAwayListener, { onClickAway: () => setOpen(false), children: _jsx(Fade, Object.assign({}, TransitionProps, { timeout: 350, children: _jsx(MenuStyled, { id: \"more-tabs-menu\", children: handleMenuItems() }) })) })) })] }));\n});\nconst MenuStyled = styled(MenuList)(() => {\n    return {\n        top: '13px',\n        left: '27px',\n        boxShadow: 'rgb(0 0 0 / 15%) 0px 3px 8px',\n        borderRadius: '4px',\n        padding: '0px',\n        width: '131px',\n        maxHeight: '240px',\n        overflow: 'overlay',\n    };\n});\n//# sourceMappingURL=menuTab.js.map"],"names":["MenuTab","forwardRef","label","value","children","ref","activeTab","updateActiveTab","smallSize","useContext","TabsContext","isActive","setIsActive","useState","open","setOpen","anchorEl","setAnchorEl","selectedLabel","setSelectedLabel","a11yProps","useTabs","handleOnClick","useCallback","_props","href","window","target","onClick","analyticsCallback","handleOpenMenu","e","currentTarget","handleMenuItems","React","Children","map","child","_jsx","MenuItem","style","fontSize","props","useEffect","_jsxs","_Fragment","TabStyled","Object","assign","wrapped","tabIndex","icon","Icon","className","iconPosition","Popper","placement","transition","TransitionProps","ClickAwayListener","onClickAway","Fade","timeout","MenuStyled","id","styled","MenuList","top","left","boxShadow","borderRadius","padding","width","maxHeight","overflow"],"mappings":"kaAYY,MAACA,EAAUC,GAAW,EAAGC,QAAOC,QAAOC,YAAYC,KAC3D,MAAMC,UAAEA,EAASC,gBAAEA,EAAeC,UAAEA,GAAcC,EAAWC,IACtDC,EAAUC,GAAeC,GAAS,IAClCC,EAAMC,GAAWF,GAAS,IAC1BG,EAAUC,GAAeJ,EAAS,OAClCK,EAAeC,GAAoBN,EAAS,OAC7CO,UAAEA,GAAcC,IAIhBC,EAAgBC,GAAaC,IAC1BA,EAAOC,KAIRC,OAAOZ,KAAKU,EAAOC,KAAMD,EAAOG,QAHhCpB,EAAgBiB,EAAOrB,OAAO,GAKlCY,GAAQ,GACRS,EAAOI,SAAWJ,EAAOI,QAAQJ,EAAOrB,OACxCqB,EAAOK,mBAAqBL,EAAOK,kBAAkBL,EAAOrB,OAC5DgB,EAAiBK,EAAOtB,MAAM,GAC/B,CAACK,IACEuB,EAAiBP,GAAaQ,IAChChB,GAASD,GACTG,EAAYc,EAAEC,cAAc,GAC7B,CAAClB,IAEEmB,EAAkBV,GAAY,IACzBW,EAAMC,SAASC,IAAIhC,GAAWiC,GACzBC,EAAKC,EAAU,CAAEC,MAAO,CAAEC,SAAU,QAAUb,QAAS,IAAMN,EAAce,EAAMK,OAAQtC,SAAUiC,EAAMK,MAAMxC,WAE5H,CAACE,EAAUkB,IAUd,OARAqB,GAAU,KAEF/B,EADAN,IAAcH,EAKjB,GACF,CAACG,EAAWK,EAAUR,IACjByC,EAAMC,EAAW,CAAEzC,SAAU,CAACkC,EAAKQ,EAAWC,OAAOC,OAAO,CAAE3C,IAAKA,EAAK4C,SAAS,EAAMrB,QAASE,EAAgBtB,UAAWA,EAAWG,SAAUA,EAAUR,MAAOA,EAAO+C,SAAU,EAAGhD,MAAOgB,GAAiBhB,GAASkB,EAAUjB,GAAQ,CAAEgD,KAAMb,EAAKc,EAAM,CAAEC,UAAWvC,EAAO,aAAe,iBAAmBwC,aAAc,MAAOD,UAAW,iBAAmBf,EAAKiB,EAAQ,CAAEzC,KAAMA,EAAME,SAAUA,EAAUwC,UAAW,SAAUC,YAAY,EAAMrD,SAAU,EAAGsD,qBAAuBpB,EAAKqB,EAAmB,CAAEC,YAAa,IAAM7C,GAAQ,GAAQX,SAAUkC,EAAKuB,EAAMd,OAAOC,OAAO,CAAE,EAAEU,EAAiB,CAAEI,QAAS,IAAK1D,SAAUkC,EAAKyB,EAAY,CAAEC,GAAI,iBAAkB5D,SAAU6B,eAAqC,IAE3sB8B,EAAaE,EAAOC,EAAPD,EAAiB,KACzB,CACHE,IAAK,OACLC,KAAM,OACNC,UAAW,+BACXC,aAAc,MACdC,QAAS,MACTC,MAAO,QACPC,UAAW,QACXC,SAAU"}

package/components/tab/secondaryNavigation/secondaryNavigationTabs.d.ts

@@ -1,9 +1,9 @@
-import React from 'react';
+import { FC, HTMLAttributes } from 'react';
 /**
  * @interface AppBarProps
  * @description Base definition of SkodaFlow Tabs component independent on core implementation.
  */
-export interface AppBarProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'color'> {
+export interface AppBarProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'color'> {
     /**
      * Label to use for tab that wrap overlowing tabs
      */
@@ -26,4 +26,4 @@ export interface AppBarProps extends Omit<React.HTMLAttributes<HTMLDivElement>,
  * @param props AppBarProps
  * @returns React Functional Component
  */
-export declare const SecondaryNavigationTabs: React.ForwardRefExoticComponent<AppBarProps & React.RefAttributes<HTMLDivElement>>;
+export declare const SecondaryNavigationTabs: FC<AppBarProps>;

package/components/tab/secondaryNavigation/secondaryNavigationTabs.js

@@ -1,2 +1,2 @@
-import{__rest as e}from"tslib";import{jsxs as o,jsx as r,Fragment as i}from"react/jsx-runtime";import t,{useState as n,useCallback as a,useEffect as p}from"react";import l from"@mui/material/AppBar";import c from"@mui/material/Toolbar";import{Icon as s}from"../../icon/icon.js";import d from"./secondaryTabStyled.js";import{MenuItem as m,Box as h,ClickAwayListener as b,Fade as u,styled as x,Backdrop as g,Popper as f,MenuList as v}from"@mui/material";import{Divider as k}from"../../divider/divider.js";import{flowColors as y}from"../../../design/skoda/palette.theme.js";const C=t.forwardRef(((l,x)=>{var{currentActiveTab:g,setCurrentActiveTab:f,children:v,labelMoreItem:y}=l;e(l,["currentActiveTab","setCurrentActiveTab","children","labelMoreItem"]);const[C,z]=n(null),[R,S]=n(null),[I,M]=n(!1),[O,B]=n(null),L=a((e=>{f(e.value),e.onClick&&e.onClick()}),[f]),N=a(((e,o)=>{M(!I),S(e.currentTarget)}),[I]),D=a((e=>e.href?o("a",{href:e.href,target:e.target||null,children:[r(s,{color:"inherit",className:e.icon||"more-horizontal"}),e.label]}):o(i,{children:[r(s,{color:"inherit",className:e.icon||"more-horizontal"}),e.label]})),[]),H=a((e=>{B(e.label),e.href?window.open(e.href,e.target):f(e.value),M(!1),e.onClick&&e.onClick(e.value)}),[f]),P=a((()=>C.slice(3).map(((e,i)=>o("div",{children:[r(m,{onClick:()=>H(e.props),children:e.props.label},i),r(k,{orientation:"horizontal",textAlign:"center",variant:"middle"})]},e.props.label)))),[C,H]);return p((()=>{z(t.Children.toArray(v))}),[v]),r(w,{position:"fixed",color:"transparent",children:r(c,{children:r(h,{sx:{display:"flex"},children:C&&o(i,{children:[r(d,Object.assign({},C[0].props,{isActive:g===C[0].props.value,onClick:()=>{L(C[0].props)},children:D(C[0].props)}),"secondary-tab-0"),r(d,Object.assign({},C[1].props,{isActive:g===C[1].props.value,onClick:()=>{L(C[1].props)},children:D(C[1].props)}),"secondary-tab-1"),r(d,Object.assign({},C[2].props,{isActive:g===C[2].props.value,onClick:()=>{L(C[2].props)},children:D(C[2].props)}),"secondary-tab-2"),C.length>4&&o(i,{children:[o(d,{isActive:I,moreTab:!0,selectedMenuLabel:O,onClick:e=>{N(e,"secondary-tab-more")},children:[r(s,{color:"inherit",className:"more-vertical"}),O]},"secondary-tab-more"),r(A,{open:I,anchorEl:R,placement:"top",transition:!0,disablePortal:!1,children:({TransitionProps:e})=>r(b,{onClickAway:()=>M(!1),children:r(T,{open:I,onClick:()=>M(!1),children:r(u,Object.assign({},e,{timeout:350,children:r(j,{id:"more-tabs-menu",children:P()})}))})})})]}),C.length<=4&&r(d,Object.assign({},C[3].props,{isActive:g===C[3].props.value,onClick:()=>{L(C[3].props)},children:D(C[3].props)}),"secondary-tab-3")]})})})})})),T=x(g)((({theme:e})=>({zIndex:2e3}))),A=x(f)((({theme:e})=>({transform:"unset !important",position:"static !important",zIndex:2e3}))),j=x(v)((({theme:e})=>({position:"absolute",bottom:"0",left:0,width:"100%",padding:"26px 0px 27px 0px",background:"white",boxSizing:"border-box",borderTopLeftRadius:"16px",borderTopRightRadius:"16px",zIndex:2e3,boxShadow:"rgb(0 0 0 / 15%) 0px 3px 8px","& .MuiDivider-root":{display:"block",marginTop:"0px !important",marginBottom:"0px !important"},"& div:first-of-type":{"& > li":{borderTopLeftRadius:"16px",borderTopRightRadius:"16px"}},"& > div > li":{fontSize:"16px",fontWeight:"400",color:e.palette.onSurface.os900,paddingTop:"11px",paddingBottom:"11px"}}))),w=x(l)((o=>(e(o,["theme"]),{maxHeigth:"56px",padding:"0px",top:"auto",bottom:0,boxShadow:"none",borderTop:`1px solid ${y.transparent.secondary}`,backgroundColor:y.background.primary,"& > div.MuiToolbar-root":{maxHeight:"56px",padding:"0px","& > div":{width:"100%",justifyContent:"space-evenly","& > div":{"&> a":{padding:0,textDecoration:"none"}}}}})));export{C as SecondaryNavigationTabs};
+import{jsxs as o,jsx as r,Fragment as e}from"react/jsx-runtime";import i,{useState as t,useCallback as n,useEffect as a}from"react";import p from"@mui/material/AppBar";import l from"@mui/material/Toolbar";import{Icon as s}from"../../icon/icon.js";import d from"./secondaryTabStyled.js";import{styled as c,Backdrop as m,Popper as h,MenuList as b,MenuItem as x,Box as u,ClickAwayListener as g,Fade as f}from"@mui/material";import{Divider as v}from"../../divider/divider.js";import{flowColors as k}from"../../../design/skoda/palette.theme.js";const y=({currentActiveTab:p,setCurrentActiveTab:c,children:m})=>{const[h,b]=t(null),[k,y]=t(null),[w,z]=t(!1),[R,S]=t(null),O=n((o=>{c(o.value),o.onClick&&o.onClick()}),[c]),B=n((o=>{z(!w),y(o.currentTarget)}),[w]),I=n((i=>i.href?o("a",{href:i.href,target:i.target||null,children:[r(s,{color:"inherit",className:i.icon||"more-horizontal"}),i.label]}):o(e,{children:[r(s,{color:"inherit",className:i.icon||"more-horizontal"}),i.label]})),[]),L=n((o=>{S(o.label),o.href?window.open(o.href,o.target):c(o.value),z(!1),o.onClick&&o.onClick(o.value)}),[c]),M=n((()=>h.slice(3).map(((e,i)=>o("div",{children:[r(x,{onClick:()=>L(e.props),children:e.props.label},i),r(v,{orientation:"horizontal",textAlign:"center",variant:"middle"})]},e.props.label)))),[h,L]);return a((()=>{b(i.Children.toArray(m))}),[m]),r(A,{position:"fixed",color:"transparent",children:r(l,{children:r(u,{sx:{display:"flex"},children:h&&o(e,{children:[r(d,Object.assign({},h[0].props,{isActive:p===h[0].props.value,onClick:()=>{O(h[0].props)},children:I(h[0].props)}),"secondary-tab-0"),r(d,Object.assign({},h[1].props,{isActive:p===h[1].props.value,onClick:()=>{O(h[1].props)},children:I(h[1].props)}),"secondary-tab-1"),r(d,Object.assign({},h[2].props,{isActive:p===h[2].props.value,onClick:()=>{O(h[2].props)},children:I(h[2].props)}),"secondary-tab-2"),h.length>4&&o(e,{children:[o(d,{isActive:w,moreTab:!0,selectedMenuLabel:R,onClick:B,children:[r(s,{color:"inherit",className:"more-vertical"}),R]},"secondary-tab-more"),r(T,{open:w,anchorEl:k,placement:"top",transition:!0,disablePortal:!1,children:({TransitionProps:o})=>r(g,{onClickAway:()=>z(!1),children:r(C,{open:w,onClick:()=>z(!1),children:r(f,Object.assign({},o,{timeout:350,children:r(j,{id:"more-tabs-menu",children:M()})}))})})})]}),h.length<=4&&r(d,Object.assign({},h[3].props,{isActive:p===h[3].props.value,onClick:()=>{O(h[3].props)},children:I(h[3].props)}),"secondary-tab-3")]})})})})},C=c(m)((()=>({zIndex:2e3}))),T=c(h)((()=>({transform:"unset !important",position:"static !important",zIndex:2e3}))),j=c(b)((({theme:o})=>({position:"absolute",bottom:"0",left:0,width:"100%",padding:"26px 0px 27px 0px",background:"white",boxSizing:"border-box",borderTopLeftRadius:"16px",borderTopRightRadius:"16px",zIndex:2e3,boxShadow:"rgb(0 0 0 / 15%) 0px 3px 8px","& .MuiDivider-root":{display:"block",marginTop:"0px !important",marginBottom:"0px !important"},"& div:first-of-type":{"& > li":{borderTopLeftRadius:"16px",borderTopRightRadius:"16px"}},"& > div > li":{fontSize:"16px",fontWeight:"400",color:o.palette.onSurface.os900,paddingTop:"11px",paddingBottom:"11px"}}))),A=c(p)((()=>({maxHeigth:"56px",padding:"0px",top:"auto",bottom:0,boxShadow:"none",borderTop:`1px solid ${k.transparent.secondary}`,backgroundColor:k.background.primary,"& > div.MuiToolbar-root":{maxHeight:"56px",padding:"0px","& > div":{width:"100%",justifyContent:"space-evenly","& > div":{"&> a":{padding:0,textDecoration:"none"}}}}})));export{y as SecondaryNavigationTabs};
 //# sourceMappingURL=secondaryNavigationTabs.js.map

package/components/tab/secondaryNavigation/secondaryNavigationTabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"secondaryNavigationTabs.js","sources":["../../../../src/components/tab/secondaryNavigation/secondaryNavigationTabs.tsx"],"sourcesContent":[null],"names":["SecondaryNavigationTabs","React","forwardRef","_a","ref","currentActiveTab","setCurrentActiveTab","children","labelMoreItem","__rest","childrenArr","setChildrenArr","useState","anchorEl","setAnchorEl","open","setOpen","selectedMenuLabel","setSelectedMenuLabel","handleActiveTab","useCallback","_props","value","onClick","handleMenuTabClick","e","currentTarget","handleRenderTabType","href","_jsxs","target","_jsx","Icon","color","className","icon","label","onClickMenuItem","window","handleMenuItems","slice","map","item","i","MenuItem","props","Divider","orientation","textAlign","variant","useEffect","Children","toArray","AppBarStyled","position","Toolbar","Box","sx","display","_Fragment","SecondaryTabStyled","Object","assign","isActive","length","moreTab","PopperStyled","placement","transition","disablePortal","TransitionProps","ClickAwayListener","onClickAway","BackdropStyled","Fade","timeout","MenuStyled","id","styled","Backdrop","theme","zIndex","Popper","transform","MenuList","bottom","left","width","padding","background","boxSizing","borderTopLeftRadius","borderTopRightRadius","boxShadow","marginTop","marginBottom","fontSize","fontWeight","palette","onSurface","os900","paddingTop","paddingBottom","MuiAppBar","maxHeigth","top","borderTop","flowColors","transparent","secondary","backgroundColor","primary","maxHeight","justifyContent","textDecoration"],"mappings":"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"}
+{"version":3,"file":"secondaryNavigationTabs.js","sources":["../../../../src/components/tab/secondaryNavigation/secondaryNavigationTabs.tsx"],"sourcesContent":["import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport React, { useCallback, useEffect, useState } from 'react';\nimport MuiAppBar from '@mui/material/AppBar';\nimport Toolbar from '@mui/material/Toolbar';\nimport { Icon } from '../../icon';\nimport SecondaryTabStyled from './secondaryTabStyled';\nimport { MenuItem, ClickAwayListener, Fade, MenuList, Popper, styled, Box, Backdrop } from '@mui/material';\nimport { Divider } from '../../divider';\nimport { flowColors } from '../../../design/skoda/palette.theme';\n/**\n * @description SkodaFlow Checkbox component.\n * Properties are inherited from HTML Button element.\n * @param props AppBarProps\n * @returns React Functional Component\n */\nexport const SecondaryNavigationTabs = ({ currentActiveTab, setCurrentActiveTab, children }) => {\n    const [childrenArr, setChildrenArr] = useState(null);\n    const [anchorEl, setAnchorEl] = useState(null);\n    const [open, setOpen] = useState(false);\n    const [selectedMenuLabel, setSelectedMenuLabel] = useState(null);\n    //handle the active tab selected\n    const handleActiveTab = useCallback((_props) => {\n        setCurrentActiveTab(_props.value);\n        _props.onClick && _props.onClick();\n    }, [setCurrentActiveTab]);\n    //handle the click on tab of type menu\n    const handleMenuTabClick = useCallback((e) => {\n        setOpen(!open);\n        setAnchorEl(e.currentTarget);\n    }, [open]);\n    //render a link tab or not based on type\n    const handleRenderTabType = useCallback((_props) => {\n        if (_props.href) {\n            return (_jsxs(\"a\", { href: _props.href, target: _props.target || null, children: [_jsx(Icon, { color: \"inherit\", className: _props.icon || 'more-horizontal' }), _props.label] }));\n        }\n        else {\n            return (_jsxs(_Fragment, { children: [_jsx(Icon, { color: \"inherit\", className: _props.icon || 'more-horizontal' }), _props.label] }));\n        }\n    }, []);\n    //handle the event triggered on onclick based on tab type (link or tab)\n    const onClickMenuItem = useCallback((_props) => {\n        setSelectedMenuLabel(_props.label);\n        if (!_props.href) {\n            setCurrentActiveTab(_props.value);\n        }\n        else {\n            window.open(_props.href, _props.target);\n        }\n        setOpen(false);\n        _props.onClick && _props.onClick(_props.value);\n    }, [setCurrentActiveTab]);\n    //returns the list of menu items\n    const handleMenuItems = useCallback(() => {\n        const menuItems = childrenArr.slice(3);\n        return menuItems.map((item, i) => {\n            return (_jsxs(\"div\", { children: [_jsx(MenuItem, { onClick: () => onClickMenuItem(item.props), children: item.props.label }, i), _jsx(Divider, { orientation: \"horizontal\", textAlign: \"center\", variant: \"middle\" })] }, item.props.label));\n        });\n    }, [childrenArr, onClickMenuItem]);\n    useEffect(() => {\n        setChildrenArr(React.Children.toArray(children));\n    }, [children]);\n    return (_jsx(AppBarStyled, { position: \"fixed\", color: \"transparent\", children: _jsx(Toolbar, { children: _jsx(Box, { sx: { display: 'flex' }, children: childrenArr && (_jsxs(_Fragment, { children: [_jsx(SecondaryTabStyled, Object.assign({}, childrenArr[0].props, { isActive: currentActiveTab === childrenArr[0].props.value, onClick: () => {\n                                handleActiveTab(childrenArr[0].props);\n                            }, children: handleRenderTabType(childrenArr[0].props) }), `secondary-tab-0`), _jsx(SecondaryTabStyled, Object.assign({}, childrenArr[1].props, { isActive: currentActiveTab === childrenArr[1].props.value, onClick: () => {\n                                handleActiveTab(childrenArr[1].props);\n                            }, children: handleRenderTabType(childrenArr[1].props) }), `secondary-tab-1`), _jsx(SecondaryTabStyled, Object.assign({}, childrenArr[2].props, { isActive: currentActiveTab === childrenArr[2].props.value, onClick: () => {\n                                handleActiveTab(childrenArr[2].props);\n                            }, children: handleRenderTabType(childrenArr[2].props) }), `secondary-tab-2`), childrenArr.length > 4 && (_jsxs(_Fragment, { children: [_jsxs(SecondaryTabStyled, { isActive: open, moreTab: true, selectedMenuLabel: selectedMenuLabel, onClick: handleMenuTabClick, children: [_jsx(Icon, { color: \"inherit\", className: 'more-vertical' }), selectedMenuLabel] }, `secondary-tab-more`), _jsx(PopperStyled, { open: open, anchorEl: anchorEl, placement: \"top\", transition: true, disablePortal: false, children: ({ TransitionProps }) => (_jsx(ClickAwayListener, { onClickAway: () => setOpen(false), children: _jsx(BackdropStyled, { open: open, onClick: () => setOpen(false), children: _jsx(Fade, Object.assign({}, TransitionProps, { timeout: 350, children: _jsx(MenuStyled, { id: \"more-tabs-menu\", children: handleMenuItems() }) })) }) })) })] })), childrenArr.length <= 4 && (_jsx(SecondaryTabStyled, Object.assign({}, childrenArr[3].props, { isActive: currentActiveTab === childrenArr[3].props.value, onClick: () => {\n                                handleActiveTab(childrenArr[3].props);\n                            }, children: handleRenderTabType(childrenArr[3].props) }), `secondary-tab-3`))] })) }) }) }));\n};\nconst BackdropStyled = styled(Backdrop)(() => {\n    return {\n        zIndex: 2000,\n    };\n});\nconst PopperStyled = styled(Popper)(() => {\n    const style = {\n        transform: 'unset !important',\n        position: 'static !important',\n        zIndex: 2000,\n    };\n    return style;\n});\nconst MenuStyled = styled(MenuList)(({ theme }) => {\n    return {\n        position: 'absolute',\n        bottom: '0',\n        left: 0,\n        width: '100%',\n        padding: '26px 0px 27px 0px',\n        background: 'white',\n        boxSizing: 'border-box',\n        borderTopLeftRadius: '16px',\n        borderTopRightRadius: '16px',\n        zIndex: 2000,\n        boxShadow: 'rgb(0 0 0 / 15%) 0px 3px 8px',\n        '& .MuiDivider-root': {\n            display: 'block',\n            marginTop: '0px !important',\n            marginBottom: '0px !important',\n        },\n        '& div:first-of-type': {\n            '& > li': {\n                borderTopLeftRadius: '16px',\n                borderTopRightRadius: '16px',\n            },\n        },\n        '& > div > li': {\n            fontSize: '16px',\n            fontWeight: '400',\n            color: theme.palette.onSurface.os900,\n            paddingTop: '11px',\n            paddingBottom: '11px',\n        },\n    };\n});\n/**\n * @description Tabs styling definition based on props\n */\nconst AppBarStyled = styled(MuiAppBar)(() => {\n    return {\n        maxHeigth: '56px',\n        padding: '0px',\n        top: 'auto',\n        bottom: 0,\n        boxShadow: 'none',\n        borderTop: `1px solid ${flowColors.transparent.secondary}`,\n        backgroundColor: flowColors.background.primary,\n        '& > div.MuiToolbar-root': {\n            maxHeight: '56px',\n            padding: '0px',\n            '& > div': {\n                width: '100%',\n                justifyContent: 'space-evenly',\n                '& > div': {\n                    '&> a': {\n                        padding: 0,\n                        textDecoration: 'none',\n                    },\n                },\n            },\n        },\n    };\n});\n//# sourceMappingURL=secondaryNavigationTabs.js.map"],"names":["SecondaryNavigationTabs","currentActiveTab","setCurrentActiveTab","children","childrenArr","setChildrenArr","useState","anchorEl","setAnchorEl","open","setOpen","selectedMenuLabel","setSelectedMenuLabel","handleActiveTab","useCallback","_props","value","onClick","handleMenuTabClick","e","currentTarget","handleRenderTabType","href","_jsxs","target","_jsx","Icon","color","className","icon","label","_Fragment","onClickMenuItem","window","handleMenuItems","slice","map","item","i","MenuItem","props","Divider","orientation","textAlign","variant","useEffect","React","Children","toArray","AppBarStyled","position","Toolbar","Box","sx","display","SecondaryTabStyled","Object","assign","isActive","length","moreTab","PopperStyled","placement","transition","disablePortal","TransitionProps","ClickAwayListener","onClickAway","BackdropStyled","Fade","timeout","MenuStyled","id","styled","Backdrop","zIndex","Popper","transform","MenuList","theme","bottom","left","width","padding","background","boxSizing","borderTopLeftRadius","borderTopRightRadius","boxShadow","marginTop","marginBottom","fontSize","fontWeight","palette","onSurface","os900","paddingTop","paddingBottom","MuiAppBar","maxHeigth","top","borderTop","flowColors","transparent","secondary","backgroundColor","primary","maxHeight","justifyContent","textDecoration"],"mappings":"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"}

package/components/tab/secondaryNavigation/secondaryTabStyled.d.ts

@@ -1,10 +1,11 @@
 /// <reference types="react" />
+import { Theme } from '@mui/material';
 declare const SecondaryTabStyled: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: import("react").ElementType<any>;
 } & {
     isActive?: boolean;
-    theme?: any;
+    theme?: Theme;
     href?: string;
     key: string;
     moreTab?: boolean;

package/components/tab/secondaryNavigation/secondaryTabStyled.js.map

@@ -1 +1 @@
-{"version":3,"file":"secondaryTabStyled.js","sources":["../../../../src/components/tab/secondaryNavigation/secondaryTabStyled.tsx"],"sourcesContent":[null],"names":["SecondaryTabStyled","styled","isActive","theme","href","moreTab","selectedMenuLabel","styles","color","palette","brand","primary","text","cursor","paddingLeft","paddingRight","fontSize","fontWeight","textTransform","whiteSpace","overflow","textOverflow","width","textAlign","display","flexDirection","margin","marginTop","height","marginBottom","Object","assign","secondary","textDecoration"],"mappings":"+BAEM,MAAAA,EAAqBC,EAAO,MAAPA,EAOxB,EAAGC,WAAUC,QAAOC,OAAMC,UAASC,wBACpC,IAAIC,EAAS,CAAA,EAyDb,OAxDAA,iCACKA,GAAM,CACTC,MAAON,EAAWC,EAAMM,QAAQC,MAAMC,QAAUR,EAAMM,QAAQG,KAAKD,QACnEE,OAAQ,UACRC,YAAa,OACbC,aAAc,OACdC,SAAU,OACVC,WAAY,SACZC,cAAe,OACfC,WAAY,SACZC,SAAU,SACVC,aAAc,WACdC,MAAO,MACPC,UAAW,SACXC,QAAS,OACTC,cAAe,SACf,wBAAyB,CACvBjB,MAAON,EAAWC,EAAMM,QAAQC,MAAMC,QAAUR,EAAMM,QAAQG,KAAKD,QACnEe,OAAQ,SACRC,UAAWtB,IAAYC,EAAoB,MAAQ,EACnDkB,QAAS,QACTR,SAAU,kBACVM,MAAO,OACPM,OAAQ,OACRC,aAAc,UAIdzB,IACFG,EACKuB,OAAAC,OAAAD,OAAAC,OAAA,GAAAxB,GACH,CAAA,QAAS,CACPC,MAAON,EAAWC,EAAMM,QAAQC,MAAMsB,UAAY7B,EAAMM,QAAQG,KAAKD,QACrEE,OAAQ,UACRW,QAAS,QACTS,eAAgB,OAChBnB,YAAa,OACbC,aAAc,OACdC,SAAU,OACVC,WAAY,SACZC,cAAe,OACfC,WAAY,SACZC,SAAU,SACVC,aAAc,WACd,wBAAyB,CACvBb,MAAON,EAAWC,EAAMM,QAAQC,MAAMsB,UAAY7B,EAAMM,QAAQG,KAAKD,QACrEe,OAAQ,SACRF,QAAS,QACTR,SAAU,kBACVM,MAAO,OACPM,OAAQ,YAMTrB,CAAM"}
+{"version":3,"file":"secondaryTabStyled.js","sources":["../../../../src/components/tab/secondaryNavigation/secondaryTabStyled.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nconst SecondaryTabStyled = styled('div')(({ isActive, theme, href, moreTab, selectedMenuLabel }) => {\n    let styles = {};\n    styles = Object.assign(Object.assign({}, styles), { color: isActive ? theme.palette.brand.primary : theme.palette.text.primary, cursor: 'pointer', paddingLeft: '12px', paddingRight: '14px', fontSize: '10px', fontWeight: 'normal', textTransform: 'none', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis', width: '25%', textAlign: 'center', display: 'flex', flexDirection: 'column', '& > span.MuiIcon-root': {\n            color: isActive ? theme.palette.brand.primary : theme.palette.text.primary,\n            margin: '0 auto',\n            marginTop: moreTab || !selectedMenuLabel ? '9px' : 0,\n            display: 'block',\n            fontSize: '24px !Important',\n            width: '24px',\n            height: '25px',\n            marginBottom: '-4px',\n        } });\n    if (href) {\n        styles = Object.assign(Object.assign({}, styles), { '& > a': {\n                color: isActive ? theme.palette.brand.secondary : theme.palette.text.primary,\n                cursor: 'pointer',\n                display: 'block',\n                textDecoration: 'none',\n                paddingLeft: '12px',\n                paddingRight: '14px',\n                fontSize: '10px',\n                fontWeight: 'normal',\n                textTransform: 'none',\n                whiteSpace: 'nowrap',\n                overflow: 'hidden',\n                textOverflow: 'ellipsis',\n                '& > span.MuiIcon-root': {\n                    color: isActive ? theme.palette.brand.secondary : theme.palette.text.primary,\n                    margin: '0 auto',\n                    display: 'block',\n                    fontSize: '24px !Important',\n                    width: '24px',\n                    height: '25px',\n                },\n            } });\n    }\n    return styles;\n});\nexport default SecondaryTabStyled;\n//# sourceMappingURL=secondaryTabStyled.js.map"],"names":["SecondaryTabStyled","styled","isActive","theme","href","moreTab","selectedMenuLabel","styles","Object","assign","color","palette","brand","primary","text","cursor","paddingLeft","paddingRight","fontSize","fontWeight","textTransform","whiteSpace","overflow","textOverflow","width","textAlign","display","flexDirection","margin","marginTop","height","marginBottom","secondary","textDecoration"],"mappings":"+BACK,MAACA,EAAqBC,EAAO,MAAPA,EAAc,EAAGC,WAAUC,QAAOC,OAAMC,UAASC,wBACxE,IAAIC,EAAS,CAAA,EAmCb,OAlCAA,EAASC,OAAOC,OAAOD,OAAOC,OAAO,CAAE,EAAEF,GAAS,CAAEG,MAAOR,EAAWC,EAAMQ,QAAQC,MAAMC,QAAUV,EAAMQ,QAAQG,KAAKD,QAASE,OAAQ,UAAWC,YAAa,OAAQC,aAAc,OAAQC,SAAU,OAAQC,WAAY,SAAUC,cAAe,OAAQC,WAAY,SAAUC,SAAU,SAAUC,aAAc,WAAYC,MAAO,MAAOC,UAAW,SAAUC,QAAS,OAAQC,cAAe,SAAU,wBAAyB,CAC/ZjB,MAAOR,EAAWC,EAAMQ,QAAQC,MAAMC,QAAUV,EAAMQ,QAAQG,KAAKD,QACnEe,OAAQ,SACRC,UAAWxB,IAAYC,EAAoB,MAAQ,EACnDoB,QAAS,QACTR,SAAU,kBACVM,MAAO,OACPM,OAAQ,OACRC,aAAc,UAElB3B,IACAG,EAASC,OAAOC,OAAOD,OAAOC,OAAO,GAAIF,GAAS,CAAE,QAAS,CACrDG,MAAOR,EAAWC,EAAMQ,QAAQC,MAAMoB,UAAY7B,EAAMQ,QAAQG,KAAKD,QACrEE,OAAQ,UACRW,QAAS,QACTO,eAAgB,OAChBjB,YAAa,OACbC,aAAc,OACdC,SAAU,OACVC,WAAY,SACZC,cAAe,OACfC,WAAY,SACZC,SAAU,SACVC,aAAc,WACd,wBAAyB,CACrBb,MAAOR,EAAWC,EAAMQ,QAAQC,MAAMoB,UAAY7B,EAAMQ,QAAQG,KAAKD,QACrEe,OAAQ,SACRF,QAAS,QACTR,SAAU,kBACVM,MAAO,OACPM,OAAQ,YAIjBvB,CAAM"}

package/components/tab/tab.js

@@ -1,2 +1,2 @@
-import{__rest as a}from"tslib";import{jsx as e,Fragment as l}from"react/jsx-runtime";import r,{useContext as t,useState as i,useCallback as o,useEffect as c}from"react";import s from"./hook/useTabs.js";import{TabsContext as b}from"./tabs.js";import n from"./tabStyled.js";const m=r.forwardRef(((r,m)=>{var{label:p,value:f,onClick:d,analyticsCallback:v,href:u,children:h,target:k,ariaLabel:j}=r;a(r,["label","value","onClick","analyticsCallback","href","children","target","ariaLabel"]);const{activeTab:C,updateActiveTab:g,smallSize:x}=t(b),[y,S]=i(!1),{a11yProps:w}=s(),z=o((a=>{g(f,!1),v&&v(a),d&&d(a)}),[f,d,g,v]),A=o((()=>e(n,u?Object.assign({wrapped:!0,ref:m,smallSize:x,isActive:y,"aria-label":j,value:f,label:p,tabIndex:y?0:-1},w(f),{component:"a",href:u,target:k,onClick:a=>z(a)}):Object.assign({wrapped:!0,ref:m,"aria-label":j,tabIndex:y?0:-1,smallSize:x,isActive:y,onClick:a=>z(a),value:f,label:p},w(f)))),[u,x,y,k,f,p,w,j,z,m]);return c((()=>{S(C===f)}),[C,f]),e(l,{children:A()})}));export{m as Tab};
+import{jsx as a,Fragment as e}from"react/jsx-runtime";import{forwardRef as t,useContext as r,useState as l,useCallback as i,useEffect as o}from"react";import s from"./hook/useTabs.js";import{TabsContext as c}from"./tabs.js";import b from"./tabStyled.js";const m=t((({label:t,value:m,onClick:n,analyticsCallback:p,href:f,target:d,ariaLabel:u},v)=>{const{activeTab:j,updateActiveTab:k,smallSize:g}=r(c),[h,x]=l(!1),{a11yProps:C}=s(),S=i((a=>{k(m,!1),p&&p(a),n&&n(a)}),[m,n,k,p]),y=i((()=>a(b,f?Object.assign({wrapped:!0,ref:v,smallSize:g,isActive:h,"aria-label":u,value:m,label:t,tabIndex:h?0:-1},C(m),{component:"a",href:f,target:d,onClick:a=>S(a)}):Object.assign({wrapped:!0,ref:v,"aria-label":u,tabIndex:h?0:-1,smallSize:g,isActive:h,onClick:a=>S(a),value:m,label:t},C(m)))),[f,g,h,d,m,t,C,u,S,v]);return o((()=>{x(j===m)}),[j,m]),a(e,{children:y()})}));export{m as Tab};
 //# sourceMappingURL=tab.js.map

package/components/tab/tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab.js","sources":["../../../src/components/tab/tab.tsx"],"sourcesContent":[null],"names":["Tab","React","forwardRef","_a","ref","label","value","onClick","analyticsCallback","href","children","target","ariaLabel","__rest","activeTab","updateActiveTab","smallSize","useContext","TabsContext","isActive","setIsActive","useState","a11yProps","useTabs","handleOnClick","useCallback","e","handleTabType","_jsx","TabStyled","Object","assign","wrapped","tabIndex","component","useEffect","_Fragment"],"mappings":"gRA6DO,MAAMA,EAAMC,EAAMC,YACvB,CAACC,EAA2FC,SAA3FC,MAAEA,EAAKC,MAAEA,EAAKC,QAAEA,EAAOC,kBAAEA,EAAiBC,KAAEA,EAAIC,SAAEA,EAAQC,OAAEA,EAAMC,UAAEA,GAAST,EAAUU,EAAAV,EAAvF,wFACC,MAAMW,UAAEA,EAASC,gBAAEA,EAAeC,UAAEA,GAAcC,EAAWC,IACtDC,EAAUC,GAAeC,GAAS,IACnCC,UAAEA,GAAcC,IAKhBC,EAAgBC,GACnBC,IACCX,EAAgBT,GAAO,GACvBE,GAAqBA,EAAkBkB,GACvCnB,GAAWA,EAAQmB,EAAE,GAEvB,CAACpB,EAAOC,EAASQ,EAAiBP,IAK9BmB,EAAgBF,GAAY,IAG5BG,EAACC,EAFDpB,EAEUqB,OAAAC,OAAA,CACRC,SACA,EAAA5B,IAAKA,EACLY,UAAWA,EACXG,SAAUA,EAAQ,aACNP,EACZN,MAAOA,EACPD,MAAOA,EACP4B,SAAUd,EAAW,GAAK,GACtBG,EAAUhB,GAAM,CACpB4B,UAAW,IACXzB,KAAMA,EACNE,OAAQA,EACRJ,QAAUmB,GAAMF,EAAcE,KAM9BI,OAAAC,OAAA,CAAAC,SACA,EAAA5B,IAAKA,EACO,aAAAQ,EACZqB,SAAUd,EAAW,GAAK,EAC1BH,UAAWA,EACXG,SAAUA,EACVZ,QAAUmB,GAAMF,EAAcE,GAC9BpB,MAAOA,EACPD,MAAOA,GACHiB,EAAUhB,MAInB,CAACG,EAAMO,EAAWG,EAAUR,EAAQL,EAAOD,EAAOiB,EAAWV,EAAWY,EAAepB,IAW1F,OARA+B,GAAU,KAENf,EADEN,IAAcR,EAIjB,GACA,CAACQ,EAAWR,IAERsB,EAAGQ,EAAA,CAAA1B,SAAAiB,KAAmB"}
+{"version":3,"file":"tab.js","sources":["../../../src/components/tab/tab.tsx"],"sourcesContent":["import { jsx as _jsx, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport { useState, useContext, useEffect, useCallback, forwardRef } from 'react';\nimport useTabs from './hook/useTabs';\nimport { TabsContext } from './tabs';\nimport TabStyled from './tabStyled';\n/**\n * @description SkodaFlow Tab component.\n * @param props TabProps\n * @returns React Functional Component\n */\nexport const Tab = forwardRef(({ label, value, onClick, analyticsCallback, href, target, ariaLabel }, ref) => {\n    const { activeTab, updateActiveTab, smallSize } = useContext(TabsContext);\n    const [isActive, setIsActive] = useState(false);\n    const { a11yProps } = useTabs();\n    //On tab clicked: set the new activeTab selected\n    //if is a menu tab: set the anchor element for the menu and set the width of the menu equal to the tab component\n    //then call the onClick from outside\n    const handleOnClick = useCallback((e) => {\n        updateActiveTab(value, false);\n        analyticsCallback && analyticsCallback(e);\n        onClick && onClick(e);\n    }, [value, onClick, updateActiveTab, analyticsCallback]);\n    //IF href prop is present: render the Link Tab\n    //Otherwise render the default tab\n    const handleTabType = useCallback(() => {\n        if (href) {\n            return (_jsx(TabStyled, Object.assign({ wrapped: true, ref: ref, smallSize: smallSize, isActive: isActive, \"aria-label\": ariaLabel, value: value, label: label, tabIndex: isActive ? 0 : -1 }, a11yProps(value), { component: 'a', href: href, target: target, onClick: (e) => handleOnClick(e) })));\n        }\n        else {\n            return (_jsx(TabStyled, Object.assign({ wrapped: true, ref: ref, \"aria-label\": ariaLabel, tabIndex: isActive ? 0 : -1, smallSize: smallSize, isActive: isActive, onClick: (e) => handleOnClick(e), value: value, label: label }, a11yProps(value))));\n        }\n    }, [href, smallSize, isActive, target, value, label, a11yProps, ariaLabel, handleOnClick, ref]);\n    //If the activeTab is equal to the current tab, set active\n    useEffect(() => {\n        if (activeTab === value) {\n            setIsActive(true);\n        }\n        else {\n            setIsActive(false);\n        }\n    }, [activeTab, value]);\n    return _jsx(_Fragment, { children: handleTabType() });\n});\n//# sourceMappingURL=tab.js.map"],"names":["Tab","forwardRef","label","value","onClick","analyticsCallback","href","target","ariaLabel","ref","activeTab","updateActiveTab","smallSize","useContext","TabsContext","isActive","setIsActive","useState","a11yProps","useTabs","handleOnClick","useCallback","e","handleTabType","_jsx","TabStyled","Object","assign","wrapped","tabIndex","component","useEffect","_Fragment","children"],"mappings":"8PAUY,MAACA,EAAMC,GAAW,EAAGC,QAAOC,QAAOC,UAASC,oBAAmBC,OAAMC,SAAQC,aAAaC,KAClG,MAAMC,UAAEA,EAASC,gBAAEA,EAAeC,UAAEA,GAAcC,EAAWC,IACtDC,EAAUC,GAAeC,GAAS,IACnCC,UAAEA,GAAcC,IAIhBC,EAAgBC,GAAaC,IAC/BX,EAAgBR,GAAO,GACvBE,GAAqBA,EAAkBiB,GACvClB,GAAWA,EAAQkB,EAAE,GACtB,CAACnB,EAAOC,EAASO,EAAiBN,IAG/BkB,EAAgBF,GAAY,IAElBG,EAAKC,EADbnB,EACwBoB,OAAOC,OAAO,CAAEC,SAAS,EAAMnB,IAAKA,EAAKG,UAAWA,EAAWG,SAAUA,EAAU,aAAcP,EAAWL,MAAOA,EAAOD,MAAOA,EAAO2B,SAAUd,EAAW,GAAK,GAAKG,EAAUf,GAAQ,CAAE2B,UAAW,IAAKxB,KAAMA,EAAMC,OAAQA,EAAQH,QAAUkB,GAAMF,EAAcE,KAGrQI,OAAOC,OAAO,CAAEC,SAAS,EAAMnB,IAAKA,EAAK,aAAcD,EAAWqB,SAAUd,EAAW,GAAK,EAAGH,UAAWA,EAAWG,SAAUA,EAAUX,QAAUkB,GAAMF,EAAcE,GAAInB,MAAOA,EAAOD,MAAOA,GAASgB,EAAUf,MAEhP,CAACG,EAAMM,EAAWG,EAAUR,EAAQJ,EAAOD,EAAOgB,EAAWV,EAAWY,EAAeX,IAU1F,OARAsB,GAAU,KAEFf,EADAN,IAAcP,EAKjB,GACF,CAACO,EAAWP,IACRqB,EAAKQ,EAAW,CAAEC,SAAUV,KAAkB"}

package/components/tab/tabPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabPanel.js","sources":["../../../src/components/tab/tabPanel.tsx"],"sourcesContent":[null],"names":["TabPanel","props","children","value","index","other","__rest","_jsx","Object","assign","role","hidden","id"],"mappings":"uEAuBa,MAAAA,EAAqCC,IAChD,MAAMC,SAAEA,EAAQC,MAAEA,EAAKC,MAAEA,GAAoBH,EAAVI,EAAUC,EAAAL,EAAvC,CAAA,WAAA,QAAA,UAEN,OACEM,EAAA,MAAAC,OAAAC,OAAA,CACEC,KAAK,WACLC,OAAQR,IAAUC,EAClBQ,GAAI,mBAAmBR,IACN,kBAAA,cAAcA,KAC3BC,EAAK,CAAAH,SAERC,IAAUC,GAASF,IAEtB"}
+{"version":3,"file":"tabPanel.js","sources":["../../../src/components/tab/tabPanel.tsx"],"sourcesContent":["import { __rest } from \"tslib\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const TabPanel = (props) => {\n    const { children, value, index } = props, other = __rest(props, [\"children\", \"value\", \"index\"]);\n    return (_jsx(\"div\", Object.assign({ role: \"tabpanel\", hidden: value !== index, id: `simple-tabpanel-${index}`, \"aria-labelledby\": `simple-tab-${index}` }, other, { children: value === index && children })));\n};\n//# sourceMappingURL=tabPanel.js.map"],"names":["TabPanel","props","children","value","index","other","__rest","_jsx","Object","assign","role","hidden","id"],"mappings":"uEAEY,MAACA,EAAYC,IACrB,MAAMC,SAAEA,EAAQC,MAAEA,EAAKC,MAAEA,GAAUH,EAAOI,EAAQC,EAAOL,EAAO,CAAC,WAAY,QAAS,UACtF,OAAQM,EAAK,MAAOC,OAAOC,OAAO,CAAEC,KAAM,WAAYC,OAAQR,IAAUC,EAAOQ,GAAI,mBAAmBR,IAAS,kBAAmB,cAAcA,KAAWC,EAAO,CAAEH,SAAUC,IAAUC,GAASF,IAAc"}

package/components/tab/tabStyled.d.ts

@@ -2,37 +2,12 @@
 /**
  * @description Tabs styling definition based on props
  */
-declare const TabStyled: import("@emotion/styled").StyledComponent<{
-    children?: null;
-    classes?: Partial<import("@mui/material/Tab").TabClasses>;
-    disabled?: boolean;
-    disableFocusRipple?: boolean;
-    icon?: string | import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
-    iconPosition?: "bottom" | "top" | "end" | "start";
-    label?: import("react").ReactNode;
-    sx?: import("@mui/system").SxProps<import("@mui/material").Theme>;
-    value?: any;
-    wrapped?: boolean;
-} & Omit<{
-    action?: import("react").Ref<import("@mui/material").ButtonBaseActions>;
-    centerRipple?: boolean;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonBaseClasses>;
-    disabled?: boolean;
-    disableRipple?: boolean;
-    disableTouchRipple?: boolean;
-    focusRipple?: boolean;
-    focusVisibleClassName?: string;
-    LinkComponent?: import("react").ElementType<any>;
-    onFocusVisible?: import("react").FocusEventHandler<any>;
-    sx?: import("@mui/system").SxProps<import("@mui/material").Theme>;
-    tabIndex?: number;
-    TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps>;
-    touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions>;
-}, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+declare const TabStyled: import("@emotion/styled").StyledComponent<import("@mui/material/Tab").TabOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: import("react").Ref<HTMLDivElement>;
-}, "disabled" | keyof import("@mui/material/OverridableComponent").CommonProps | "label" | "tabIndex" | "children" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "icon" | "iconPosition" | "value" | "wrapped"> & {
+}, "disabled" | "className" | "style" | "classes" | "action" | "centerRipple" | "children" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "icon" | "iconPosition" | "label" | "value" | "wrapped"> & {
     theme?: import("@emotion/react").Theme;
+} & {
+    component?: import("react").ElementType<any>;
 } & {
     isActive?: boolean;
     smallSize?: boolean;

package/components/tab/tabStyled.js

@@ -1,2 +1,2 @@
-import{__rest as t}from"tslib";import e from"@emotion/styled";import o from"@mui/material/Tab";const i=e(o,{shouldForwardProp:t=>"isActive"!==t&&"smallSize"!==t&&"ref"!==t})((e=>{var{isActive:o,smallSize:i,theme:r}=e;t(e,["isActive","smallSize","theme"]);let a={minWidth:"fit-content",fontWeight:"700",padding:0,color:r.palette.onSurface.os500,opacity:1,fontSize:"20px",textTransform:"none",transition:"color .3s ease-out",minHeight:"32px",maxHeight:"32px",marginTop:"4px",fontFamily:"SKODA Next",letterSpacing:"0.02857em","&:focus":{paddingLeft:"5px",paddingRight:"5px",border:`2px solid ${r.palette.text.primary}`,boxSizing:" border-box"},"&:hover":{color:r.palette.text.primary,position:"relative",overflow:"visible","& > .MuiIcon-root":{color:r.palette.text.primary},"&:after":{content:'""',display:"block",position:"absolute",height:"3px",backgroundColor:r.palette.brand.primary,width:"100%",bottom:"-12px",left:0}},"&:active":{color:r.palette.text.primary},"& > .MuiIcon-root":{fontSize:"20px !Important",width:"20px",height:"30px",color:r.palette.onSurface.os500}};return a=Object.assign(Object.assign({},a),{[r.breakpoints.down("sm")]:{fontSize:"14px",minWidth:"56px",marginTop:"6px"}}),o&&(a=Object.assign(Object.assign({},a),{color:r.palette.text.primary})),i&&(a=Object.assign(Object.assign({},a),{fontSize:"14px",minWidth:"56px",marginTop:"6px","& > .MuiIcon-root":{fontSize:"15px !important",width:"15px",height:"22px"}})),a}));export{i as default};
+import t from"@emotion/styled";import o from"@mui/material/Tab";const e=t(o,{shouldForwardProp:t=>"isActive"!==t&&"smallSize"!==t&&"ref"!==t})((({isActive:t,smallSize:o,theme:e})=>{let i={minWidth:"fit-content",fontWeight:"700",padding:0,color:e.palette.onSurface.os500,opacity:1,fontSize:"20px",textTransform:"none",transition:"color .3s ease-out",minHeight:"32px",maxHeight:"32px",marginTop:"4px",fontFamily:"SKODA Next",letterSpacing:"0.02857em","&:focus":{paddingLeft:"5px",paddingRight:"5px",border:`2px solid ${e.palette.text.primary}`,boxSizing:" border-box"},"&:hover":{color:e.palette.text.primary,position:"relative",overflow:"visible","& > .MuiIcon-root":{color:e.palette.text.primary},"&:after":{content:'""',display:"block",position:"absolute",height:"3px",backgroundColor:e.palette.brand.primary,width:"100%",bottom:"-12px",left:0}},"&:active":{color:e.palette.text.primary},"& > .MuiIcon-root":{fontSize:"20px !Important",width:"20px",height:"30px",color:e.palette.onSurface.os500}};return i=Object.assign(Object.assign({},i),{[e.breakpoints.down("sm")]:{fontSize:"14px",minWidth:"56px",marginTop:"6px"}}),t&&(i=Object.assign(Object.assign({},i),{color:e.palette.text.primary})),o&&(i=Object.assign(Object.assign({},i),{fontSize:"14px",minWidth:"56px",marginTop:"6px","& > .MuiIcon-root":{fontSize:"15px !important",width:"15px",height:"22px"}})),i}));export{e as default};
 //# sourceMappingURL=tabStyled.js.map

package/components/tab/tabStyled.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabStyled.js","sources":["../../../src/components/tab/tabStyled.tsx"],"sourcesContent":[null],"names":["TabStyled","styled","MuiTab","shouldForwardProp","prop","_a","isActive","smallSize","theme","__rest","styles","minWidth","fontWeight","padding","color","palette","onSurface","os500","opacity","fontSize","textTransform","transition","minHeight","maxHeight","marginTop","fontFamily","letterSpacing","paddingLeft","paddingRight","border","text","primary","boxSizing","position","overflow","content","display","height","backgroundColor","brand","width","bottom","left","Object","assign","breakpoints","down"],"mappings":"+FAMA,MAAMA,EAAYC,EAAOC,EAAQ,CAC/BC,kBAAoBC,GAAkB,aAATA,GAAgC,cAATA,GAAiC,QAATA,GAD5DH,EAWfI,QAAAC,SAAEA,EAAQC,UAAEA,EAASC,MAAEA,KAAvBC,EAAAJ,EAAA,CAAA,WAAA,YAAA,UACD,IAAIK,EAAc,CAChBC,SAAU,cACVC,WAAY,MACZC,QAAS,EACTC,MAAON,EAAMO,QAAQC,UAAUC,MAC/BC,QAAS,EACTC,SAAU,OACVC,cAAe,OACfC,WAAY,qBACZC,UAAW,OACXC,UAAW,OACXC,UAAW,MACXC,WAAY,aACZC,cAAe,YACf,UAAW,CACTC,YAAa,MACbC,aAAc,MACdC,OAAQ,aAAarB,EAAMO,QAAQe,KAAKC,UACxCC,UAAW,eAEb,UAAW,CACTlB,MAAON,EAAMO,QAAQe,KAAKC,QAC1BE,SAAU,WACVC,SAAU,UACV,oBAAqB,CACnBpB,MAAON,EAAMO,QAAQe,KAAKC,SAE5B,UAAW,CACTI,QAAS,KACTC,QAAS,QACTH,SAAU,WACVI,OAAQ,MACRC,gBAAiB9B,EAAMO,QAAQwB,MAAMR,QACrCS,MAAO,OACPC,OAAQ,QACRC,KAAM,IAGV,WAAY,CACV5B,MAAON,EAAMO,QAAQe,KAAKC,SAE5B,oBAAqB,CACnBZ,SAAU,kBACVqB,MAAO,OACPH,OAAQ,OACRvB,MAAON,EAAMO,QAAQC,UAAUC,QAiCnC,OA7BAP,EACKiC,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAAlC,GACH,CAAA,CAACF,EAAMqC,YAAYC,KAAK,OAAQ,CAC9B3B,SAAU,OACVR,SAAU,OACVa,UAAW,SAIXlB,IACFI,EACKiC,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAAlC,GACH,CAAAI,MAAON,EAAMO,QAAQe,KAAKC,WAI1BxB,IACFG,iCACKA,GAAM,CACTS,SAAU,OACVR,SAAU,OACVa,UAAW,MACX,oBAAqB,CACnBL,SAAU,kBACVqB,MAAO,OACPH,OAAQ,WAIP3B,CAAM"}
+{"version":3,"file":"tabStyled.js","sources":["../../../src/components/tab/tabStyled.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport MuiTab from '@mui/material/Tab';\n/**\n * @description Tabs styling definition based on props\n */\nconst TabStyled = styled(MuiTab, {\n    shouldForwardProp: (prop) => prop !== 'isActive' && prop !== 'smallSize' && prop !== 'ref',\n})(({ isActive, smallSize, theme }) => {\n    let styles = {\n        minWidth: 'fit-content',\n        fontWeight: '700',\n        padding: 0,\n        color: theme.palette.onSurface.os500,\n        opacity: 1,\n        fontSize: '20px',\n        textTransform: 'none',\n        transition: 'color .3s ease-out',\n        minHeight: '32px',\n        maxHeight: '32px',\n        marginTop: '4px',\n        fontFamily: 'SKODA Next',\n        letterSpacing: '0.02857em',\n        '&:focus': {\n            paddingLeft: '5px',\n            paddingRight: '5px',\n            border: `2px solid ${theme.palette.text.primary}`,\n            boxSizing: ' border-box',\n        },\n        '&:hover': {\n            color: theme.palette.text.primary,\n            position: 'relative',\n            overflow: 'visible',\n            '& > .MuiIcon-root': {\n                color: theme.palette.text.primary,\n            },\n            '&:after': {\n                content: '\"\"',\n                display: 'block',\n                position: 'absolute',\n                height: '3px',\n                backgroundColor: theme.palette.brand.primary,\n                width: '100%',\n                bottom: '-12px',\n                left: 0,\n            },\n        },\n        '&:active': {\n            color: theme.palette.text.primary,\n        },\n        '& > .MuiIcon-root': {\n            fontSize: '20px !Important',\n            width: '20px',\n            height: '30px',\n            color: theme.palette.onSurface.os500,\n        },\n    };\n    styles = Object.assign(Object.assign({}, styles), { [theme.breakpoints.down('sm')]: {\n            fontSize: '14px',\n            minWidth: '56px',\n            marginTop: '6px',\n        } });\n    if (isActive) {\n        styles = Object.assign(Object.assign({}, styles), { color: theme.palette.text.primary });\n    }\n    if (smallSize) {\n        styles = Object.assign(Object.assign({}, styles), { fontSize: '14px', minWidth: '56px', marginTop: '6px', '& > .MuiIcon-root': {\n                fontSize: '15px !important',\n                width: '15px',\n                height: '22px',\n            } });\n    }\n    return styles;\n});\nexport default TabStyled;\n//# sourceMappingURL=tabStyled.js.map"],"names":["TabStyled","styled","MuiTab","shouldForwardProp","prop","isActive","smallSize","theme","styles","minWidth","fontWeight","padding","color","palette","onSurface","os500","opacity","fontSize","textTransform","transition","minHeight","maxHeight","marginTop","fontFamily","letterSpacing","paddingLeft","paddingRight","border","text","primary","boxSizing","position","overflow","content","display","height","backgroundColor","brand","width","bottom","left","Object","assign","breakpoints","down"],"mappings":"gEAKK,MAACA,EAAYC,EAAOC,EAAQ,CAC7BC,kBAAoBC,GAAkB,aAATA,GAAgC,cAATA,GAAiC,QAATA,GAD9DH,EAEf,EAAGI,WAAUC,YAAWC,YACvB,IAAIC,EAAS,CACTC,SAAU,cACVC,WAAY,MACZC,QAAS,EACTC,MAAOL,EAAMM,QAAQC,UAAUC,MAC/BC,QAAS,EACTC,SAAU,OACVC,cAAe,OACfC,WAAY,qBACZC,UAAW,OACXC,UAAW,OACXC,UAAW,MACXC,WAAY,aACZC,cAAe,YACf,UAAW,CACPC,YAAa,MACbC,aAAc,MACdC,OAAQ,aAAapB,EAAMM,QAAQe,KAAKC,UACxCC,UAAW,eAEf,UAAW,CACPlB,MAAOL,EAAMM,QAAQe,KAAKC,QAC1BE,SAAU,WACVC,SAAU,UACV,oBAAqB,CACjBpB,MAAOL,EAAMM,QAAQe,KAAKC,SAE9B,UAAW,CACPI,QAAS,KACTC,QAAS,QACTH,SAAU,WACVI,OAAQ,MACRC,gBAAiB7B,EAAMM,QAAQwB,MAAMR,QACrCS,MAAO,OACPC,OAAQ,QACRC,KAAM,IAGd,WAAY,CACR5B,MAAOL,EAAMM,QAAQe,KAAKC,SAE9B,oBAAqB,CACjBZ,SAAU,kBACVqB,MAAO,OACPH,OAAQ,OACRvB,MAAOL,EAAMM,QAAQC,UAAUC,QAkBvC,OAfAP,EAASiC,OAAOC,OAAOD,OAAOC,OAAO,CAAE,EAAElC,GAAS,CAAE,CAACD,EAAMoC,YAAYC,KAAK,OAAQ,CAC5E3B,SAAU,OACVR,SAAU,OACVa,UAAW,SAEfjB,IACAG,EAASiC,OAAOC,OAAOD,OAAOC,OAAO,CAAA,EAAIlC,GAAS,CAAEI,MAAOL,EAAMM,QAAQe,KAAKC,WAE9EvB,IACAE,EAASiC,OAAOC,OAAOD,OAAOC,OAAO,CAAE,EAAElC,GAAS,CAAES,SAAU,OAAQR,SAAU,OAAQa,UAAW,MAAO,oBAAqB,CACvHL,SAAU,kBACVqB,MAAO,OACPH,OAAQ,WAGb3B,CAAM"}

package/components/tab/tabs.d.ts

@@ -1,16 +1,16 @@
-import React from 'react';
+import React, { FC, HTMLAttributes } from 'react';
 import { Theme } from '@mui/material/styles';
 import { SxProps } from '@mui/system';
 export declare const TabsContext: React.Context<{
     activeTab: any;
-    updateActiveTab: (value: any, fromMenu: boolean) => void;
+    updateActiveTab: (...args: any[]) => void;
     smallSize: boolean;
 }>;
 /**
  * @interface TabsProps
  * @description Base definition of SkodaFlow Tabs component independent on core implementation.
  */
-export interface TabsProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'color'> {
+export interface TabsProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'color'> {
     /**
      * Size of every single tab
      */
@@ -52,4 +52,4 @@ export interface TabsProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'o
  * @param props TabsProps
  * @returns React Functional Component
  */
-export declare const Tabs: React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLButtonElement>>;
+export declare const Tabs: FC<TabsProps>;

package/components/tab/tabs.js

@@ -1,2 +1,2 @@
-import{__rest as e}from"tslib";import{jsx as i,Fragment as a,jsxs as r}from"react/jsx-runtime";import t,{useState as o,useRef as n,useCallback as s,useEffect as l}from"react";import d from"@mui/material/Tabs";import{styled as m}from"@mui/material/styles";import{SecondaryNavigationTabs as c}from"./secondaryNavigation/secondaryNavigationTabs.js";import{MenuTab as b}from"./menuTab.js";import u from"./hook/useTabs.js";import{useTheme as v}from"@mui/material";import{flowColors as g}from"../../design/skoda/palette.theme.js";const p=t.createContext({activeTab:null,updateActiveTab:(e,i)=>{},smallSize:!1}),f=t.forwardRef(((d,m)=>{var{handleChange:g,defaultActiveTab:f,smallSize:T,variantSecondaryNavigation:x,children:j,sx:w,classes:M,labelMoreItem:S="More",activeTab:z}=d,O=e(d,["handleChange","defaultActiveTab","smallSize","variantSecondaryNavigation","children","sx","classes","labelMoreItem","activeTab"]);const[y,L]=o(null!=z?z:f),[A,C]=o(null),[k,N]=o(!1),[E,I]=o([]),[R,D]=o(!1),[P,B]=o(!1),F=n(null),V=n(null),{handleOverflowingTabs:W,handleIsMobileView:q}=u(),G=v(),H=s(((e,i)=>{B(i),L(e)}),[]),J=s((()=>{q(x,k,N,C)}),[q,k,x]);return l((()=>{L(null!=z?z:f)}),[z,f]),l((()=>(J(),window.addEventListener("resize",J),()=>{window.removeEventListener("resize",J)}))),l((()=>{g&&g(y)}),[y,g]),l((()=>{I(t.Children.toArray(j))}),[j]),l((()=>{F&&F.current&&W(V,A,j,I)}),[A,W,j]),l((()=>{document.addEventListener("mousedown",(function(e){D(!0)})),document.addEventListener("keydown",(function(e){D(!1)}))}),[]),l((()=>{}),[O]),i(a,{children:x&&k?i(c,{labelMoreItem:S,currentActiveTab:y,setCurrentActiveTab:e=>L(e),children:j}):i(p.Provider,{value:{activeTab:y,updateActiveTab:H,smallSize:T},children:r(h,{ref:V,variant:A<=G.breakpoints.values.lg?"scrollable":"fullWidth",scrollButtons:!1,smallSize:T,value:P?"more":y,mouseDown:R,sx:w,classes:M,children:[j,i(b,{value:"more",ref:F,label:S,children:E})]})})})})),h=m(d,{shouldForwardProp:e=>"variantSecondaryNavigation"!==e&&"smallSize"!==e&&"mouseDown"!==e})((i=>{var a=e(i,["isActive","theme"]);let r={};return r=Object.assign(Object.assign({},r),{boxSizing:"border-box","& *":{boxSizing:"border-box"},"& > div":{"& > div > .MuiTab-root:last-child":{marginRight:"10px"},"& > div":{marginLeft:"2px",width:"100%"},"& > .MuiTabs-indicator":{height:"3px",backgroundColor:g.brand.primary},"& > div > .MuiTab-root":{marginLeft:"56px"}}}),a.smallSize&&(r=Object.assign(Object.assign({},r),{"& > div":{"& > div > .MuiTab-root:last-child":{marginRight:"10px"},"& > div":{marginLeft:"2px"},"& > div > .MuiTab-root":{marginLeft:"40px","&:after":{bottom:"-11px"}}},"& .MuiTabs-indicator":{backgroundColor:g.brand.primary}})),a.mouseDown&&(r=Object.assign(Object.assign({},r),{"& > div":Object.assign(Object.assign({},r["& > div"]),{"& > div > .MuiTab-root":Object.assign(Object.assign({},r["& > div"]["& > div > .MuiTab-root"]),{"&:focus":{border:0,paddingLeft:0,paddingRight:0}})})})),r}));export{f as Tabs,p as TabsContext};
+import{__rest as e}from"tslib";import{jsx as i,Fragment as a,jsxs as r}from"react/jsx-runtime";import t,{useState as o,useRef as n,useCallback as s,useEffect as l}from"react";import d from"@mui/material/Tabs";import{styled as m}from"@mui/material/styles";import{SecondaryNavigationTabs as c}from"./secondaryNavigation/secondaryNavigationTabs.js";import{MenuTab as b}from"./menuTab.js";import u from"./hook/useTabs.js";import{useTheme as v}from"@mui/material";import{flowColors as g}from"../../design/skoda/palette.theme.js";import p from"lodash/noop";const h=t.createContext({activeTab:null,updateActiveTab:p,smallSize:!1}),f=d=>{var{handleChange:m,defaultActiveTab:g,smallSize:p,variantSecondaryNavigation:f,children:x,sx:j,classes:w,labelMoreItem:M="More",activeTab:S}=d,z=e(d,["handleChange","defaultActiveTab","smallSize","variantSecondaryNavigation","children","sx","classes","labelMoreItem","activeTab"]);const[O,y]=o(null!=S?S:g),[L,A]=o(null),[C,k]=o(!1),[N,E]=o([]),[I,D]=o(!1),[R,P]=o(!1),B=n(null),F=n(null),{handleOverflowingTabs:V,handleIsMobileView:W}=u(),q=v(),G=s(((e,i)=>{P(i),y(e)}),[]),H=s((()=>{W(f,C,k,A)}),[W,C,f]);return l((()=>{y(null!=S?S:g)}),[S,g]),l((()=>(H(),window.addEventListener("resize",H),()=>{window.removeEventListener("resize",H)}))),l((()=>{m&&m(O)}),[O,m]),l((()=>{E(t.Children.toArray(x))}),[x]),l((()=>{B&&B.current&&V(F,L,x,E)}),[L,V,x]),l((()=>{document.addEventListener("mousedown",(function(){D(!0)})),document.addEventListener("keydown",(function(){D(!1)}))}),[]),l((()=>{}),[z]),i(a,{children:f&&C?i(c,{labelMoreItem:M,currentActiveTab:O,setCurrentActiveTab:e=>y(e),children:x}):i(h.Provider,{value:{activeTab:O,updateActiveTab:G,smallSize:p},children:r(T,{ref:F,variant:L<=q.breakpoints.values.lg?"scrollable":"fullWidth",scrollButtons:!1,smallSize:p,value:R?"more":O,mouseDown:I,sx:j,classes:w,children:[x,i(b,{value:"more",ref:B,label:M,children:N})]})})})},T=m(d,{shouldForwardProp:e=>"variantSecondaryNavigation"!==e&&"smallSize"!==e&&"mouseDown"!==e})((i=>{var a=e(i,["isActive","theme"]);let r={};return r=Object.assign(Object.assign({},r),{boxSizing:"border-box","& *":{boxSizing:"border-box"},"& > div":{"& > div > .MuiTab-root:last-child":{marginRight:"10px"},"& > div":{marginLeft:"2px",width:"100%"},"& > .MuiTabs-indicator":{height:"3px",backgroundColor:g.brand.primary},"& > div > .MuiTab-root":{marginLeft:"56px"}}}),a.smallSize&&(r=Object.assign(Object.assign({},r),{"& > div":{"& > div > .MuiTab-root:last-child":{marginRight:"10px"},"& > div":{marginLeft:"2px"},"& > div > .MuiTab-root":{marginLeft:"40px","&:after":{bottom:"-11px"}}},"& .MuiTabs-indicator":{backgroundColor:g.brand.primary}})),a.mouseDown&&(r=Object.assign(Object.assign({},r),{"& > div":Object.assign(Object.assign({},r["& > div"]),{"& > div > .MuiTab-root":Object.assign(Object.assign({},r["& > div"]["& > div > .MuiTab-root"]),{"&:focus":{border:0,paddingLeft:0,paddingRight:0}})})})),r}));export{f as Tabs,h as TabsContext};
 //# sourceMappingURL=tabs.js.map

package/components/tab/tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.js","sources":["../../../src/components/tab/tabs.tsx"],"sourcesContent":[null],"names":["TabsContext","React","createContext","activeTab","updateActiveTab","value","fromMenu","smallSize","Tabs","forwardRef","_a","ref","handleChange","defaultActiveTab","variantSecondaryNavigation","children","sx","classes","labelMoreItem","props","__rest","currentActiveTab","setCurrentActiveTab","useState","windowWidth","setWindowWidth","isMobileView","setIsMobileView","menuChildren","setMenuChildren","mouseDown","setMouseDown","activeMenuItem","setActiveMenuItem","moreBtnRef","useRef","tabsRef","handleOverflowingTabs","handleIsMobileView","useTabs","theme","useTheme","useCallback","handleMobileView","useEffect","window","addEventListener","removeEventListener","Children","toArray","current","document","event","_jsx","_Fragment","SecondaryNavigationTabs","val","Provider","_jsxs","TabsStyled","variant","breakpoints","values","lg","scrollButtons","MenuTab","label","styled","MuiTabs","shouldForwardProp","prop","styles","Object","assign","boxSizing","marginRight","marginLeft","width","height","backgroundColor","flowColors","brand","primary","bottom","border","paddingLeft","paddingRight"],"mappings":"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"}
+{"version":3,"file":"tabs.js","sources":["../../../src/components/tab/tabs.tsx"],"sourcesContent":["import { __rest } from \"tslib\";\nimport { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from \"react/jsx-runtime\";\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\nimport MuiTabs from '@mui/material/Tabs';\nimport { styled } from '@mui/material/styles';\nimport { SecondaryNavigationTabs } from './secondaryNavigation/secondaryNavigationTabs';\nimport { MenuTab } from './menuTab';\nimport useTabs from './hook/useTabs';\nimport { useTheme } from '@mui/material';\nimport { flowColors } from '../../design/skoda/palette.theme';\nimport noop from 'lodash/noop';\nexport const TabsContext = React.createContext({\n    activeTab: null,\n    updateActiveTab: noop,\n    smallSize: false,\n});\n/**\n * @description SkodaFlow Checkbox component.\n * Properties are inherited from HTML Button element.\n * @param props TabsProps\n * @returns React Functional Component\n */\nexport const Tabs = (_a) => {\n    var { handleChange, defaultActiveTab, smallSize, variantSecondaryNavigation, children, sx, classes, labelMoreItem = 'More', activeTab } = _a, props = __rest(_a, [\"handleChange\", \"defaultActiveTab\", \"smallSize\", \"variantSecondaryNavigation\", \"children\", \"sx\", \"classes\", \"labelMoreItem\", \"activeTab\"]);\n    const [currentActiveTab, setCurrentActiveTab] = useState(activeTab !== null && activeTab !== void 0 ? activeTab : defaultActiveTab);\n    const [windowWidth, setWindowWidth] = useState(null);\n    const [isMobileView, setIsMobileView] = useState(false);\n    const [menuChildren, setMenuChildren] = useState([]);\n    const [mouseDown, setMouseDown] = useState(false);\n    const [activeMenuItem, setActiveMenuItem] = useState(false);\n    const moreBtnRef = useRef(null);\n    const tabsRef = useRef(null);\n    const { handleOverflowingTabs, handleIsMobileView } = useTabs();\n    const theme = useTheme();\n    const updateActiveTab = useCallback((value, fromMenu) => {\n        setActiveMenuItem(fromMenu);\n        setCurrentActiveTab(value);\n    }, []);\n    const handleMobileView = useCallback(() => {\n        handleIsMobileView(variantSecondaryNavigation, isMobileView, setIsMobileView, setWindowWidth);\n    }, [handleIsMobileView, isMobileView, variantSecondaryNavigation]);\n    useEffect(() => {\n        setCurrentActiveTab(activeTab !== null && activeTab !== void 0 ? activeTab : defaultActiveTab);\n    }, [activeTab, defaultActiveTab]);\n    useEffect(() => {\n        handleMobileView();\n        window.addEventListener('resize', handleMobileView);\n        return () => {\n            window.removeEventListener('resize', handleMobileView);\n        };\n    });\n    useEffect(() => {\n        handleChange && handleChange(currentActiveTab);\n    }, [currentActiveTab, handleChange]);\n    //Set the initial more btn menu list\n    useEffect(() => {\n        setMenuChildren(React.Children.toArray(children));\n    }, [children]);\n    //on screen resize: if the more btn is rendered, handle the more btn menu and the overflowing tabs\n    useEffect(() => {\n        if (moreBtnRef && moreBtnRef.current) {\n            handleOverflowingTabs(tabsRef, windowWidth, children, setMenuChildren);\n        }\n    }, [windowWidth, handleOverflowingTabs, children]);\n    useEffect(() => {\n        document.addEventListener('mousedown', function () {\n            setMouseDown(true);\n        });\n        document.addEventListener('keydown', function () {\n            setMouseDown(false);\n        });\n    }, []);\n    useEffect(() => { }, [props]);\n    return (_jsx(_Fragment, { children: variantSecondaryNavigation && isMobileView ? (_jsx(SecondaryNavigationTabs, { labelMoreItem: labelMoreItem, currentActiveTab: currentActiveTab, setCurrentActiveTab: (val) => setCurrentActiveTab(val), children: children })) : (_jsx(TabsContext.Provider, { value: { activeTab: currentActiveTab, updateActiveTab, smallSize }, children: _jsxs(TabsStyled, { ref: tabsRef, variant: windowWidth <= theme.breakpoints.values.lg ? 'scrollable' : 'fullWidth', scrollButtons: false, smallSize: smallSize, value: activeMenuItem ? 'more' : currentActiveTab, mouseDown: mouseDown, sx: sx, classes: classes, children: [children, _jsx(MenuTab, { value: \"more\", ref: moreBtnRef, label: labelMoreItem, children: menuChildren })] }) })) }));\n};\n/**\n * @description Tabs styling definition based on props\n */\nconst TabsStyled = styled(MuiTabs, {\n    shouldForwardProp: (prop) => prop !== 'variantSecondaryNavigation' && prop !== 'smallSize' && prop !== 'mouseDown',\n})((_a) => {\n    var { isActive, theme } = _a, props = __rest(_a, [\"isActive\", \"theme\"]);\n    let styles = {};\n    styles = Object.assign(Object.assign({}, styles), { boxSizing: 'border-box', '& *': {\n            boxSizing: 'border-box',\n        }, '& > div': {\n            '& > div > .MuiTab-root:last-child': {\n                marginRight: '10px',\n            },\n            '& > div': {\n                marginLeft: '2px',\n                width: '100%',\n            },\n            '& > .MuiTabs-indicator': {\n                height: '3px',\n                backgroundColor: flowColors.brand.primary,\n            },\n            '& > div > .MuiTab-root': {\n                marginLeft: '56px',\n            },\n        } });\n    if (props.smallSize) {\n        styles = Object.assign(Object.assign({}, styles), { '& > div': {\n                '& > div > .MuiTab-root:last-child': {\n                    marginRight: '10px',\n                },\n                '& > div': {\n                    marginLeft: '2px',\n                },\n                '& > div > .MuiTab-root': {\n                    marginLeft: '40px',\n                    '&:after': {\n                        bottom: '-11px',\n                    },\n                },\n            }, '& .MuiTabs-indicator': {\n                backgroundColor: flowColors.brand.primary,\n            } });\n    }\n    if (props.mouseDown) {\n        styles = Object.assign(Object.assign({}, styles), { '& > div': Object.assign(Object.assign({}, styles['& > div']), { '& > div > .MuiTab-root': Object.assign(Object.assign({}, styles['& > div']['& > div > .MuiTab-root']), { '&:focus': {\n                        border: 0,\n                        paddingLeft: 0,\n                        paddingRight: 0,\n                    } }) }) });\n    }\n    return styles;\n});\n//# sourceMappingURL=tabs.js.map"],"names":["TabsContext","React","createContext","activeTab","updateActiveTab","noop","smallSize","Tabs","_a","handleChange","defaultActiveTab","variantSecondaryNavigation","children","sx","classes","labelMoreItem","props","__rest","currentActiveTab","setCurrentActiveTab","useState","windowWidth","setWindowWidth","isMobileView","setIsMobileView","menuChildren","setMenuChildren","mouseDown","setMouseDown","activeMenuItem","setActiveMenuItem","moreBtnRef","useRef","tabsRef","handleOverflowingTabs","handleIsMobileView","useTabs","theme","useTheme","useCallback","value","fromMenu","handleMobileView","useEffect","window","addEventListener","removeEventListener","Children","toArray","current","document","_jsx","_Fragment","SecondaryNavigationTabs","val","Provider","_jsxs","TabsStyled","ref","variant","breakpoints","values","lg","scrollButtons","MenuTab","label","styled","MuiTabs","shouldForwardProp","prop","styles","Object","assign","boxSizing","marginRight","marginLeft","width","height","backgroundColor","flowColors","brand","primary","bottom","border","paddingLeft","paddingRight"],"mappings":"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"}