@skodaflow/web-library 3.4.0-alpha.0 → 4.0.0

package/build/components/stepper/stepper.d.ts

@@ -1,42 +1,42 @@
-import React from 'react';
-import { SxProps } from '@mui/system';
-import { Theme } from '@mui/material';
-export interface StepperProps extends React.HTMLAttributes<HTMLDivElement> {
-    /**
-     *  The activeStep of a stepper.
-     */
-    activeStep?: number;
-    /**
-     *  if true, orientation is horizontal, then the step label will be positioned under the icon..
-     */
-    alternativeLabel?: boolean;
-    /**
-     *  The system prop that allows defining system overrides as well as additional CSS styles.
-     */
-    sx?: SxProps<Theme>;
-    /**
-     *  Two or more <Step /> components.
-     */
-    children?: Node;
-    /**
-     *  Override or extend the styles applied to the component.
-     */
-    classes?: object;
-    /**
-     *  An element to be placed between each step.
-     */
-    connector?: Element;
-    /**
-     *  If set the Stepper will not assist in controlling steps for linear flow.
-     */
-    nonLinear?: boolean;
-    /**
-     *  The component orientation (layout flow direction).
-     */
-    orientation?: 'horizontal';
-    /**
-     *  The total steps.
-     */
-    step?: Array<string>;
-}
-export declare const Stepper: React.ForwardRefExoticComponent<StepperProps & React.RefAttributes<HTMLDivElement>>;
+import React from 'react';
+import { SxProps } from '@mui/system';
+import { Theme } from '@mui/material';
+export interface StepperProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     *  The activeStep of a stepper.
+     */
+    activeStep?: number;
+    /**
+     *  if true, orientation is horizontal, then the step label will be positioned under the icon..
+     */
+    alternativeLabel?: boolean;
+    /**
+     *  The system prop that allows defining system overrides as well as additional CSS styles.
+     */
+    sx?: SxProps<Theme>;
+    /**
+     *  Two or more <Step /> components.
+     */
+    children: React.ReactNode;
+    /**
+     *  Override or extend the styles applied to the component.
+     */
+    classes?: object;
+    /**
+     *  An element to be placed between each step.
+     */
+    connector?: Element;
+    /**
+     *  If set the Stepper will not assist in controlling steps for linear flow.
+     */
+    nonLinear?: boolean;
+    /**
+     *  The component orientation (layout flow direction).
+     */
+    orientation?: 'horizontal';
+    /**
+     *  The total steps.
+     */
+    step?: Array<string>;
+}
+export declare const Stepper: React.ForwardRefExoticComponent<StepperProps & React.RefAttributes<HTMLDivElement>>;

package/build/components/stepper/stepper.js

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

package/build/components/stepper/stepper.js.map

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

package/build/components/tab/examples.d.ts

@@ -0,0 +1,3 @@
+export declare const BasicUsage: () => import("react/jsx-runtime").JSX.Element;
+export declare const Links: () => import("react/jsx-runtime").JSX.Element;
+export declare const ChangingTabs: () => import("react/jsx-runtime").JSX.Element;

package/build/components/tab/hook/useTabs.d.ts

@@ -1,9 +1,9 @@
-declare const useTabs: () => {
-    handleOverflowingTabs: (tabsRef: any, windowWidth: any, children: any, setMenuChildren: any) => void;
-    handleIsMobileView: (variantSecondaryNavigation: any, isMobileView: any, setIsMobileView: any, setWindowWidth: any) => void;
-    a11yProps: (index: string | number) => {
-        id: string;
-        'aria-controls': string;
-    };
-};
-export default useTabs;
+declare const useTabs: () => {
+    handleOverflowingTabs: (tabsRef: any, windowWidth: any, children: any, setMenuChildren: any) => void;
+    handleIsMobileView: (variantSecondaryNavigation: any, isMobileView: any, setIsMobileView: any, setWindowWidth: any) => void;
+    a11yProps: (index: string | number) => {
+        id: string;
+        'aria-controls': string;
+    };
+};
+export default useTabs;

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

@@ -0,0 +1,2 @@
+import{useTheme as e}from"@mui/material";import i,{useCallback as t}from"react";const o=()=>{const o=e();return{handleOverflowingTabs:t(((e,t,o,s)=>{const l=e.current.closest("div").querySelectorAll("div")[1],r=l.querySelectorAll(".MuiTab-root"),n=[...r].find((e=>"simple-tab-more"===e.id));r.forEach((e=>{e.style.display="inline-flex"}));const a=[],d=l.offsetWidth,f=[...r].filter((e=>"simple-tab-more"!==e.id)),p=n.offsetWidth+58;if(f.forEach((e=>{d<=e.offsetLeft+(e.offsetWidth+p)&&(e.style.display="none",a.push(e.id))})),a.length){const e=[];a.forEach((t=>{const s=i.Children.toArray(o).find((e=>t==="simple-tab-"+e.props.value));s&&e.push(s)})),s(e)}else n.style.display="none"}),[o.breakpoints.values.lg]),handleIsMobileView:t(((e,i,t,s)=>{s(window.innerWidth),e&&(window.innerWidth<=o.breakpoints.values.md&&!i?t(!0):window.innerWidth>o.breakpoints.values.md&&t(!1))}),[o.breakpoints.values.md]),a11yProps:t((e=>({id:`simple-tab-${e}`,"aria-controls":`simple-tabpanel-${e}`})),[])}};export{o as default};
+//# sourceMappingURL=useTabs.js.map

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

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

package/build/components/tab/index.d.ts

@@ -1,4 +1,4 @@
-export * from './tab';
-export * from './tabPanel';
-export * from './tabs';
-export * from './secondaryNavigation/secondaryNavigationTabs';
+export * from './tab';
+export * from './tabPanel';
+export * from './tabs';
+export * from './secondaryNavigation/secondaryNavigationTabs';

package/build/components/tab/menuTab.d.ts

@@ -1,36 +1,36 @@
-import React from 'react';
-/**
- * @interface TabProps
- * @description Base definition of SkodaFlow Tabs component independent on core implementation.
- */
-export interface TabProps {
-    /**
-     *  Text shown as the tab title
-     */
-    label: string;
-    /**
-     *  Value of the tab
-     */
-    value: any;
-    /**
-     *  children useful to render menu items
-     */
-    children: any;
-    /**
-     * @description Triggered when element is changed.
-     * @param e React original event object
-     * @param value Current changed value
-     */
-    /**
-     *  If true a backdrop is applied.
-     */
-    showBackdrop?: boolean;
-    onChange?: (event: React.SyntheticEvent, newValue: number | string) => void;
-    onClick?: (e: any) => void;
-}
-/**
- * @description SkodaFlow Tab component.
- * @param props TabProps
- * @returns React Functional Component
- */
-export declare const MenuTab: React.ForwardRefExoticComponent<TabProps & React.RefAttributes<HTMLDivElement>>;
+import React from 'react';
+/**
+ * @interface TabProps
+ * @description Base definition of SkodaFlow Tabs component independent on core implementation.
+ */
+export interface TabProps {
+    /**
+     *  Text shown as the tab title
+     */
+    label: string;
+    /**
+     *  Value of the tab
+     */
+    value: any;
+    /**
+     *  children useful to render menu items
+     */
+    children: any;
+    /**
+     * @description Triggered when element is changed.
+     * @param e React original event object
+     * @param value Current changed value
+     */
+    /**
+     *  If true a backdrop is applied.
+     */
+    showBackdrop?: boolean;
+    onChange?: (event: React.SyntheticEvent, newValue: number | string) => void;
+    onClick?: (e: any) => void;
+}
+/**
+ * @description SkodaFlow Tab component.
+ * @param props TabProps
+ * @returns React Functional Component
+ */
+export declare const MenuTab: React.ForwardRefExoticComponent<TabProps & React.RefAttributes<HTMLDivElement>>;

package/build/components/tab/menuTab.js

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

package/build/components/tab/menuTab.js.map

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

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

@@ -1,29 +1,29 @@
-import React 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'> {
-    /**
-     * Label to use for tab that wrap overlowing tabs
-     */
-    labelMoreItem?: string;
-    /**
-     * the current active tab index to be activated on the screen
-     */
-    currentActiveTab?: string | number;
-    /**
-     * @description Triggered when element is changed.
-     * @param e React original event object
-     * @param value Current changed value
-     */
-    handleChange?: (newValue: any) => void;
-    setCurrentActiveTab?: (val: number | string) => void;
-}
-/**
- * @description SkodaFlow Checkbox component.
- * Properties are inherited from HTML Button element.
- * @param props AppBarProps
- * @returns React Functional Component
- */
-export declare const SecondaryNavigationTabs: React.ForwardRefExoticComponent<AppBarProps & React.RefAttributes<HTMLDivElement>>;
+import React 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'> {
+    /**
+     * Label to use for tab that wrap overlowing tabs
+     */
+    labelMoreItem?: string;
+    /**
+     * the current active tab index to be activated on the screen
+     */
+    currentActiveTab?: string | number;
+    /**
+     * @description Triggered when element is changed.
+     * @param e React original event object
+     * @param value Current changed value
+     */
+    handleChange?: (newValue: any) => void;
+    setCurrentActiveTab?: (val: number | string) => void;
+}
+/**
+ * @description SkodaFlow Checkbox component.
+ * Properties are inherited from HTML Button element.
+ * @param props AppBarProps
+ * @returns React Functional Component
+ */
+export declare const SecondaryNavigationTabs: React.ForwardRefExoticComponent<AppBarProps & React.RefAttributes<HTMLDivElement>>;

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

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

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

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

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

@@ -1,13 +1,13 @@
-/// <reference types="react" />
-declare const SecondaryTabStyled: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
-} & {
-    isActive?: boolean;
-    theme?: any;
-    href?: string;
-    key: string;
-    moreTab?: boolean;
-    selectedMenuLabel?: string;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export default SecondaryTabStyled;
+/// <reference types="react" />
+declare const SecondaryTabStyled: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
+} & {
+    isActive?: boolean;
+    theme?: any;
+    href?: string;
+    key: string;
+    moreTab?: boolean;
+    selectedMenuLabel?: string;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export default SecondaryTabStyled;

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

@@ -0,0 +1,2 @@
+import t from"@emotion/styled";const e=t("div")((({isActive:t,theme:e,href:o,moreTab:r,selectedMenuLabel:a})=>{let i={};return i=Object.assign(Object.assign({},i),{color:t?e.palette.brand.primary:e.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":{color:t?e.palette.brand.primary:e.palette.text.primary,margin:"0 auto",marginTop:r||!a?"9px":0,display:"block",fontSize:"24px !Important",width:"24px",height:"25px",marginBottom:"-4px"}}),o&&(i=Object.assign(Object.assign({},i),{"& > a":{color:t?e.palette.brand.secondary:e.palette.text.primary,cursor:"pointer",display:"block",textDecoration:"none",paddingLeft:"12px",paddingRight:"14px",fontSize:"10px",fontWeight:"normal",textTransform:"none",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis","& > span.MuiIcon-root":{color:t?e.palette.brand.secondary:e.palette.text.primary,margin:"0 auto",display:"block",fontSize:"24px !Important",width:"24px",height:"25px"}}})),i}));export{e as default};
+//# sourceMappingURL=secondaryTabStyled.js.map

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

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

package/build/components/tab/tab.d.ts

@@ -1,48 +1,49 @@
-import React from 'react';
-/**
- * @interface TabProps
- * @description Base definition of SkodaFlow Tabs component independent on core implementation.
- */
-export interface TabProps {
-    /**
-     *  Text shown as the tab title
-     */
-    label?: string;
-    /**
-     *  Value of the tab
-     */
-    value: any;
-    /**
-     * href for the link tab
-     */
-    href?: string;
-    /**
-     * target for the anchor tag
-     */
-    target?: string;
-    /**
-     * ariaLabel applied to the tab component
-     */
-    ariaLabel?: string;
-    /**
-     * icon shown when in secondary navigation
-     */
-    icon?: string;
-    /**
-     * @description Triggered when element is changed.
-     * @param e React original event object
-     * @param value Current changed value
-     */
-    onChange?: (event: React.SyntheticEvent, newValue: number) => void;
-    onClick?: (e: any) => void;
-    /**
-     * Callback for analytics
-     */
-    analyticsCallback?: (payload?: any) => void;
-}
-/**
- * @description SkodaFlow Tab component.
- * @param props TabProps
- * @returns React Functional Component
- */
-export declare const Tab: React.ForwardRefExoticComponent<TabProps & React.RefAttributes<HTMLDivElement>>;
+import React from 'react';
+/**
+ * @interface TabProps
+ * @description Base definition of SkodaFlow Tabs component independent on core implementation.
+ */
+export interface TabProps {
+    /**
+     *  Text shown as the tab title
+     */
+    label?: string;
+    /**
+     *  Value of the tab
+     */
+    value: any;
+    /**
+     * href for the link tab
+     */
+    href?: string;
+    /**
+     * target for the anchor tag
+     */
+    target?: string;
+    /**
+     * ariaLabel applied to the tab component
+     */
+    ariaLabel?: string;
+    /**
+     * icon shown when in secondary navigation
+     */
+    icon?: string;
+    /**
+     * @description Triggered when element is changed.
+     * @param e React original event object
+     * @param value Current changed value
+     */
+    onChange?: (event: React.SyntheticEvent, newValue: number) => void;
+    onClick?: (e: any) => void;
+    /**
+     * Callback for analytics
+     */
+    analyticsCallback?: (payload?: any) => void;
+    children?: React.ReactNode;
+}
+/**
+ * @description SkodaFlow Tab component.
+ * @param props TabProps
+ * @returns React Functional Component
+ */
+export declare const Tab: React.ForwardRefExoticComponent<TabProps & React.RefAttributes<HTMLDivElement>>;

package/build/components/tab/tab.js

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

package/build/components/tab/tab.js.map

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

package/build/components/tab/tabPanel.d.ts

@@ -1,20 +1,20 @@
-import React, { ReactNode } from 'react';
-/**
- * @interface TabPanelProps
- * @description Interface of TabPanel component.
- */
-export interface TabPanelProps {
-    /**
-     *  Content displayed inside the tab panel
-     */
-    children?: ReactNode;
-    /**
-     *  value of the tab panel equal to the tab selected
-     */
-    value?: number | string;
-    /**
-     *  index of the tab panel
-     */
-    index?: number | string;
-}
-export declare const TabPanel: React.FC<TabPanelProps>;
+import React, { ReactNode } from 'react';
+/**
+ * @interface TabPanelProps
+ * @description Interface of TabPanel component.
+ */
+export interface TabPanelProps {
+    /**
+     *  Content displayed inside the tab panel
+     */
+    children?: ReactNode;
+    /**
+     *  value of the tab panel equal to the tab selected
+     */
+    value?: number | string;
+    /**
+     *  index of the tab panel
+     */
+    index?: number | string;
+}
+export declare const TabPanel: React.FC<TabPanelProps>;

package/build/components/tab/tabPanel.js

@@ -0,0 +1,2 @@
+import{__rest as e}from"tslib";import{jsx as i}from"react/jsx-runtime";const l=l=>{const{children:r,value:n,index:t}=l,a=e(l,["children","value","index"]);return i("div",Object.assign({role:"tabpanel",hidden:n!==t,id:`simple-tabpanel-${t}`,"aria-labelledby":`simple-tab-${t}`},a,{children:n===t&&r}))};export{l as TabPanel};
+//# sourceMappingURL=tabPanel.js.map

package/build/components/tab/tabPanel.js.map

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