npm - @skodaflow/web-library - Versions diffs - 8.3.0 → 8.3.1 - Mend

@skodaflow/web-library 8.3.0 → 8.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (183) hide show

package/materialui/badge/badge.theme.js CHANGED Viewed

@@ -1,2 +1,2 @@
-const t="-2px",a={defaultProps:{color:"error",slotProps:{root:{"aria-label":null},badge:({invisible:t,...a})=>({...t?{"aria-hidden":!0}:{"aria-live":"polite","aria-atomic":!0},...a["aria-label"]&&{"aria-label":a["aria-label"]}})}},styleOverrides:{standard:{height:"16px",minWidth:"16px",fontSize:"10px",fontWeight:"bold",borderRadius:"20px",padding:"0 4px"},dot:{height:"12px",width:"12px",borderRadius:"50%"},anchorOriginTopRightRectangular:{top:t,right:t},anchorOriginTopLeftRectangular:{top:t,left:t},anchorOriginBottomRightRectangular:{bottom:t,right:t},anchorOriginBottomLeftRectangular:{bottom:t,left:t}}};export{a as flowBadge};
+const t="-2px",i={defaultProps:{color:"error",slotProps:{root:{"aria-label":null},badge:({invisible:t,...i})=>({...t?{"aria-hidden":!0}:{"aria-live":"polite","aria-atomic":!0},...i["aria-label"]&&{"aria-label":i["aria-label"]}})}},styleOverrides:{standard:{height:"16px",minWidth:"16px",fontSize:"10px",lineHeight:"10px",letterSpacing:"0.02em",fontWeight:"700",borderRadius:"20px",padding:"0 4px"},dot:{height:"12px",width:"12px",borderRadius:"50%"},anchorOriginTopRightRectangular:{top:t,right:t},anchorOriginTopLeftRectangular:{top:t,left:t},anchorOriginBottomRightRectangular:{bottom:t,right:t},anchorOriginBottomLeftRectangular:{bottom:t,left:t}}};export{i as flowBadge};
 //# sourceMappingURL=badge.theme.js.map

package/materialui/badge/badge.theme.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"badge.theme.js","sources":["../../../src/materialui/badge/badge.theme.ts"],"sourcesContent":["import { Components, Theme } from '@mui/material/styles';\n\n// 0px is default from @mui\nconst distance = '-2px';\n\nexport const flowBadge: Components<Theme>['MuiBadge'] = {\n defaultProps: {\n color: 'error',\n slotProps: {\n root: {\n // disable aria-label, we place it on the badge instead\n ['aria-label']: null,\n },\n badge: ({ invisible, ...rest }) => ({\n ...(invisible\n ? {\n ['aria-hidden']: true,\n }\n : {\n ['aria-live']: 'polite',\n ['aria-atomic']: true,\n }),\n // pass aria-label to badge from parent\n ...(rest['aria-label'] && {\n ['aria-label']: rest['aria-label'],\n }),\n }),\n },\n },\n styleOverrides: {\n standard: {\n height: '16px',\n minWidth: '16px',\n fontSize: '10px',\n fontWeight: '~~bold~~',\n borderRadius: '20px',\n padding: '0 4px',\n },\n dot: {\n height: '12px',\n width: '12px',\n borderRadius: '50%',\n },\n anchorOriginTopRightRectangular: {\n top: distance,\n right: distance,\n },\n anchorOriginTopLeftRectangular: {\n top: distance,\n left: distance,\n },\n anchorOriginBottomRightRectangular: {\n bottom: distance,\n right: distance,\n },\n anchorOriginBottomLeftRectangular: {\n bottom: distance,\n left: distance,\n },\n },\n};\n"],"names":["distance","flowBadge","defaultProps","color","slotProps","root","badge","invisible","rest","styleOverrides","standard","height","minWidth","fontSize","fontWeight","borderRadius","padding","dot","width","anchorOriginTopRightRectangular","top","right","anchorOriginTopLeftRectangular","left","anchorOriginBottomRightRectangular","bottom","anchorOriginBottomLeftRectangular"],"mappings":"AAGA,MAAMA,EAAW,OAEJC,EAA2C,CACtDC,aAAc,CACZC,MAAO,QACPC,UAAW,CACTC,KAAM,CAEJ,aAAgB,MAElBC,MAAO,EAAGC,eAAcC,MAAM,IACxBD,EACA,CACE,eAAiB,GAEnB,CACE,YAAe,SACf,eAAiB,MAGnBC,EAAK,eAAiB,CACxB,aAAgBA,EAAK,mBAK7BC,eAAgB,CACdC,SAAU,CACRC,OAAQ,OACRC,SAAU,OACVC,SAAU,OACVC,WAAY,OACZC,aAAc,OACdC,QAAS,SAEXC,IAAK,~~CACHN~~,OAAQ,~~OACRO~~,MAAO,OACPH,aAAc,OAEhBI,gCAAiC,CAC/BC,~~IAAKpB~~,~~EACLqB~~,~~MAAOrB~~,~~GAETsB~~,+BAAgC,CAC9BF,~~IAAKpB~~,~~EACLuB~~,~~KAAMvB~~,~~GAERwB~~,mCAAoC,CAClCC,~~OAAQzB~~,~~EACRqB~~,~~MAAOrB~~,~~GAET0B~~,kCAAmC,CACjCD,~~OAAQzB~~,~~EACRuB~~,~~KAAMvB~~"}
1	+ {"version":3,"file":"badge.theme.js","sources":["../../../src/materialui/badge/badge.theme.ts"],"sourcesContent":["import { Components, Theme } from '@mui/material/styles';\n\n// 0px is default from @mui\nconst distance = '-2px';\n\nexport const flowBadge: Components<Theme>['MuiBadge'] = {\n defaultProps: {\n color: 'error',\n slotProps: {\n root: {\n // disable aria-label, we place it on the badge instead\n ['aria-label']: null,\n },\n badge: ({ invisible, ...rest }) => ({\n ...(invisible\n ? {\n ['aria-hidden']: true,\n }\n : {\n ['aria-live']: 'polite',\n ['aria-atomic']: true,\n }),\n // pass aria-label to badge from parent\n ...(rest['aria-label'] && {\n ['aria-label']: rest['aria-label'],\n }),\n }),\n },\n },\n styleOverrides: {\n standard: {\n height: '16px',\n minWidth: '16px',\n fontSize: '10px',\n lineHeight: '10px',\n letterSpacing: '0.02em',\n fontWeight: '700',\n borderRadius: '20px',\n padding: '0 4px',\n },\n dot: {\n height: '12px',\n width: '12px',\n borderRadius: '50%',\n },\n anchorOriginTopRightRectangular: {\n top: distance,\n right: distance,\n },\n anchorOriginTopLeftRectangular: {\n top: distance,\n left: distance,\n },\n anchorOriginBottomRightRectangular: {\n bottom: distance,\n right: distance,\n },\n anchorOriginBottomLeftRectangular: {\n bottom: distance,\n left: distance,\n },\n },\n};\n"],"names":["distance","flowBadge","defaultProps","color","slotProps","root","badge","invisible","rest","styleOverrides","standard","height","minWidth","fontSize","lineHeight","letterSpacing","fontWeight","borderRadius","padding","dot","width","anchorOriginTopRightRectangular","top","right","anchorOriginTopLeftRectangular","left","anchorOriginBottomRightRectangular","bottom","anchorOriginBottomLeftRectangular"],"mappings":"AAGA,MAAMA,EAAW,OAEJC,EAA2C,CACtDC,aAAc,CACZC,MAAO,QACPC,UAAW,CACTC,KAAM,CAEJ,aAAgB,MAElBC,MAAO,EAAGC,eAAcC,MAAM,IACxBD,EACA,CACE,eAAiB,GAEnB,CACE,YAAe,SACf,eAAiB,MAGnBC,EAAK,eAAiB,CACxB,aAAgBA,EAAK,mBAK7BC,eAAgB,CACdC,SAAU,CACRC,OAAQ,OACRC,SAAU,OACVC,SAAU,OACVC,WAAY,OACZC,cAAe,SACfC,WAAY,MACZC,aAAc,OACdC,QAAS,SAEXC,IAAK,CACHR,OAAQ,OACRS,MAAO,OACPH,aAAc,OAEhBI,gCAAiC,CAC/BC,IAAKtB,EACLuB,MAAOvB,GAETwB,+BAAgC,CAC9BF,IAAKtB,EACLyB,KAAMzB,GAER0B,mCAAoC,CAClCC,OAAQ3B,EACRuB,MAAOvB,GAET4B,kCAAmC,CACjCD,OAAQ3B,EACRyB,KAAMzB"}

package/materialui/button/buttonBase.theme.js CHANGED Viewed

@@ -1,2 +1,2 @@
-const o={defaultProps:{disableRipple:!0},styleOverrides:{root:{"& .MuiTouchRipple-root, & .MuiTouchRipple-root > span":{maxWidth:"none"}}}};export{o as flowButtonBase};
+const i={defaultProps:{disableRipple:!0},styleOverrides:{root:{letterSpacing:"inherit",fontFamily:"inherit",fontStyle:"inherit",textTransform:"inherit",textDecoration:"inherit",fontSize:"inherit",fontWeight:"inherit",lineHeight:"inherit","& .MuiTouchRipple-root, & .MuiTouchRipple-root > span":{maxWidth:"none"}}}};export{i as flowButtonBase};
 //# sourceMappingURL=buttonBase.theme.js.map

package/materialui/button/buttonBase.theme.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"buttonBase.theme.js","sources":["../../../src/materialui/button/buttonBase.theme.ts"],"sourcesContent":["import { Components, Theme } from '@mui/material/styles';\n\nexport const flowButtonBase: Components<Theme>['MuiButtonBase'] = {\n defaultProps: {\n disableRipple: true,\n },\n styleOverrides: {\n root: {\n '& .MuiTouchRipple-root, & .MuiTouchRipple-root > span': {\n // remove generic maxWidth limitation\n maxWidth: 'none',\n },\n },\n },\n};\n"],"names":["flowButtonBase","defaultProps","disableRipple","styleOverrides","root","maxWidth"],"mappings":"AAEO,MAAMA,EAAqD,CAChEC,aAAc,CACZC,eAAe,GAEjBC,eAAgB,CACdC,KAAM,~~CACJ~~,wDAAyD,CAEvDC,SAAU"}
1	+ {"version":3,"file":"buttonBase.theme.js","sources":["../../../src/materialui/button/buttonBase.theme.ts"],"sourcesContent":["import { Components, Theme } from '@mui/material/styles';\n\nexport const flowButtonBase: Components<Theme>['MuiButtonBase'] = {\n defaultProps: {\n disableRipple: true,\n },\n styleOverrides: {\n root: {\n letterSpacing: 'inherit',\n fontFamily: 'inherit',\n fontStyle: 'inherit',\n textTransform: 'inherit',\n textDecoration: 'inherit',\n fontSize: 'inherit',\n fontWeight: 'inherit',\n lineHeight: 'inherit',\n '& .MuiTouchRipple-root, & .MuiTouchRipple-root > span': {\n // remove generic maxWidth limitation\n maxWidth: 'none',\n },\n },\n },\n};\n"],"names":["flowButtonBase","defaultProps","disableRipple","styleOverrides","root","letterSpacing","fontFamily","fontStyle","textTransform","textDecoration","fontSize","fontWeight","lineHeight","maxWidth"],"mappings":"AAEO,MAAMA,EAAqD,CAChEC,aAAc,CACZC,eAAe,GAEjBC,eAAgB,CACdC,KAAM,CACJC,cAAe,UACfC,WAAY,UACZC,UAAW,UACXC,cAAe,UACfC,eAAgB,UAChBC,SAAU,UACVC,WAAY,UACZC,WAAY,UACZ,wDAAyD,CAEvDC,SAAU"}

package/materialui/dialog/DialogTitle.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as r}from"react/jsx-runtime";import{forwardRef as o}from"react";import{Box as t,Typography as i,IconButton as s}from"@mui/material";import{sxOverride as n}from"../../utils/sxOverride/sxOverride.js";import{CloseIcon as m}from"../../components/icon/stroke/CloseIcon.js";const l=o(({onClose:o,closeIconButtonProps:l,children:c,...a},p)=>{const{sx:d,...f}=l??{};return e(t,{sx:{display:"flex",justifyContent:c?"space-between":"flex-end",alignItems:"flex-start",gap:1},children:[c&&r(i,{component:"h2",ref:p,...a,children:c}),o&&r(s,{size:"medium",onClick:e=>o(e,"backdropClick"),"aria-label":"Close",sx:n({mr:2,mt:2},d),...f,children:r(m,{})})]})});export{l as FlowDialogTitle};
+import{jsxs as e,jsx as o}from"react/jsx-runtime";import{forwardRef as r}from"react";import{Box as t,Typography as i,IconButton as s}from"@mui/material";import{sxOverride as l}from"../../utils/sxOverride/sxOverride.js";import{CloseIcon as n}from"../../components/icon/stroke/CloseIcon.js";const m=r(({onClose:r,closeIconButtonProps:m,children:c,...a},p)=>{const{sx:f,...x}=m??{};return e(t,{sx:{display:"flex",justifyContent:c?"space-between":"flex-end",alignItems:"flex-start",gap:1,flexShrink:"0"},className:"FlowDialogTitle-root",children:[c&&o(i,{component:"h2",ref:p,...a,children:c}),r&&o(s,{size:"medium",onClick:e=>r(e,"backdropClick"),"aria-label":"Close",sx:l({mr:2,mt:2},f),...x,children:o(n,{})})]})});export{m as FlowDialogTitle};
 //# sourceMappingURL=DialogTitle.js.map

package/materialui/dialog/DialogTitle.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DialogTitle.js","sources":["../../../src/materialui/dialog/DialogTitle.tsx"],"sourcesContent":["import React, { FC, forwardRef } from 'react';\nimport { DialogTitleProps, Typography, IconButton, Box } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\n\n/*\n This component serves as an extended title section for a dialog,\n * including an optional close button displayed when `onClose` prop is provided.\n */\nexport const FlowDialogTitle: FC<DialogTitleProps> = forwardRef(\n ({ onClose, closeIconButtonProps, children, ...rest }, ref) => {\n const { sx: closeIconButtonSx, ...restCloseIconButton } = closeIconButtonProps ?? {};\n\n return (\n <Box\n sx={{\n display: 'flex',\n justifyContent: children ? 'space-between' : 'flex-end',\n alignItems: 'flex-start',\n gap: 1,\n }}\n >\n {children && (\n <Typography component=\"h2\" ref={ref} {...rest}>\n {children}\n </Typography>\n )}\n {onClose && (\n <IconButton\n size=\"medium\"\n onClick={(e) => onClose(e, 'backdropClick')}\n aria-label=\"Close\"\n sx={sxOverride(\n {\n mr: 2,\n mt: 2,\n },\n closeIconButtonSx,\n )}\n {...restCloseIconButton}\n >\n <CloseIcon />\n </IconButton>\n )}\n </Box>\n );\n },\n);\n"],"names":["FlowDialogTitle","forwardRef","onClose","closeIconButtonProps","children","rest","ref","sx","closeIconButtonSx","restCloseIconButton","_jsxs","Box","display","justifyContent","alignItems","gap","_jsx","Typography","component","IconButton","size","onClick","e","sxOverride","mr","mt","CloseIcon"],"mappings":"uSASaA,EAAwCC,EACnD,EAAGC,UAASC,uBAAsBC,cAAaC,GAAQC,KACrD,MAAQC,GAAIC,KAAsBC,GAAwBN,GAAwB,CAAA,EAElF,OACEO,EAACC,EAAG,CACFJ,GAAI,CACFK,QAAS,OACTC,eAAgBT,EAAW,gBAAkB,WAC7CU,WAAY,aACZC,IAAK,~~GACNX~~,SAAA,~~CAEAA~~,~~GACCY~~,EAACC,EAAU,CAACC,UAAU,~~KAAKZ~~,IAAKA,KAASD,~~EAAID~~,~~SAC1CA,~~IAGJF,~~GACCc~~,EAACG,EAAU,CACTC,KAAK,SACLC,QAAUC,~~GAAMpB~~,~~EAAQoB~~,EAAG,iBAAgB,aAChC,~~QACXf~~,~~GAAIgB~~,EACF,CACEC,GAAI,EACJC,GAAI,~~GAENjB~~,MAEEC,EAAmBL,~~SAEvBY~~,EAACU,EAAS"}
1	+ {"version":3,"file":"DialogTitle.js","sources":["../../../src/materialui/dialog/DialogTitle.tsx"],"sourcesContent":["import React, { FC, forwardRef } from 'react';\nimport { DialogTitleProps, Typography, IconButton, Box } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\n\n/*\n This component serves as an extended title section for a dialog,\n * including an optional close button displayed when `onClose` prop is provided.\n */\nexport const FlowDialogTitle: FC<DialogTitleProps> = forwardRef(\n ({ onClose, closeIconButtonProps, children, ...rest }, ref) => {\n const { sx: closeIconButtonSx, ...restCloseIconButton } = closeIconButtonProps ?? {};\n\n return (\n <Box\n sx={{\n display: 'flex',\n justifyContent: children ? 'space-between' : 'flex-end',\n alignItems: 'flex-start',\n gap: 1,\n flexShrink: '0',\n }}\n className=\"FlowDialogTitle-root\"\n >\n {children && (\n <Typography component=\"h2\" ref={ref} {...rest}>\n {children}\n </Typography>\n )}\n {onClose && (\n <IconButton\n size=\"medium\"\n onClick={(e) => onClose(e, 'backdropClick')}\n aria-label=\"Close\"\n sx={sxOverride(\n {\n mr: 2,\n mt: 2,\n },\n closeIconButtonSx,\n )}\n {...restCloseIconButton}\n >\n <CloseIcon />\n </IconButton>\n )}\n </Box>\n );\n },\n);\n"],"names":["FlowDialogTitle","forwardRef","onClose","closeIconButtonProps","children","rest","ref","sx","closeIconButtonSx","restCloseIconButton","_jsxs","Box","display","justifyContent","alignItems","gap","flexShrink","className","_jsx","Typography","component","IconButton","size","onClick","e","sxOverride","mr","mt","CloseIcon"],"mappings":"uSASaA,EAAwCC,EACnD,EAAGC,UAASC,uBAAsBC,cAAaC,GAAQC,KACrD,MAAQC,GAAIC,KAAsBC,GAAwBN,GAAwB,CAAA,EAElF,OACEO,EAACC,EAAG,CACFJ,GAAI,CACFK,QAAS,OACTC,eAAgBT,EAAW,gBAAkB,WAC7CU,WAAY,aACZC,IAAK,EACLC,WAAY,KAEdC,UAAU,uBAAsBb,SAAA,CAE/BA,GACCc,EAACC,EAAU,CAACC,UAAU,KAAKd,IAAKA,KAASD,WACtCD,IAGJF,GACCgB,EAACG,EAAU,CACTC,KAAK,SACLC,QAAUC,GAAMtB,EAAQsB,EAAG,iBAAgB,aAChC,QACXjB,GAAIkB,EACF,CACEC,GAAI,EACJC,GAAI,GAENnB,MAEEC,EAAmBL,SAEvBc,EAACU,EAAS"}

package/materialui/slider/SliderValues.d.ts CHANGED Viewed

@@ -79,6 +79,11 @@ export interface SliderValueProps extends Omit<SliderValuesProps, 'value' | 'min
      * The single setValue for the slider value
      */
     setValue?: (newValue: number) => void;
+    /**
+     * Index of the thumb this value represents, forwarded as the second argument to `valueLabelFormat`
+     * @default 0
+     */
+    index?: number;
 }
 /**
  * Display single value of slider, allows editing with input

package/materialui/slider/SliderValues.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as e,Fragment as r,jsx as a}from"react/jsx-runtime";import{forwardRef as o,useState as l,useCallback as s}from"react";import{Box as i,Typography as t,FilledInput as n}from"@mui/material";import{sxOverride as p}from"../../utils/sxOverride/sxOverride.js";import{flowSlider as u}from"./slider.theme.js";import{getFocusRingStyle as d}from"../../components/focusring/focusring.js";const m=o(({sx:o,children:l,value:s,valueProps:t,label:n,labelProps:d,valueLabelFormat:m,setValue:c,disabled:b,min:f=u.defaultProps.min,minLabel:v,minLabelProps:P,max:h=u.defaultProps.max,maxLabel:g,maxLabelProps:y,step:S=u.defaultProps.step,sliderValueProps:k,inputProps:L,...C},V)=>{const j={disabled:b,min:f,max:h,step:S,valueLabelFormat:m,valueProps:t,inputProps:L,...k};return e(i,{ref:V,sx:p({display:"flex",alignItems:"flex-end",justifyContent:"space-between",gap:1},o),...C,children:[Array.isArray(s)||!1===s&&(v||n)&&g?e(r,{children:[a(x,{value:!1!==s&&s[0],setValue:c?e=>c([e,s[1]]):void 0,label:v||n,labelProps:P||d,...j,max:s[1]}),a(x,{value:!1!==s&&s[1],setValue:c?e=>c([s[0],e]):void 0,label:g,labelProps:y,...j,min:s[0],sx:p({textAlign:"right"},j?.sx)})]}):a(x,{value:s,setValue:c,label:n,labelProps:d,...j}),l]})}),x=o(({value:r,valueProps:o,label:u,labelProps:m,valueLabelFormat:x,setValue:c,min:b,max:f,step:v,inputProps:P,disabled:h,sx:g,...y},S)=>{const{sx:k,...L}=m??{},{sx:C,...V}=o??{},{sx:j,...F}=P??{},[w,A]=l(!1),I=s(e=>{const r=+(e||0);c(r<b?b:r>f?f:r)},[b,f,c]),z=x?x(r):r;return e(i,{ref:S,sx:p({minWidth:"82px",...(!u||!1===r)&&{pt:.5}},g),onClick:c&&!h?()=>A(!0):void 0,...y,children:[u&&a(t,{...!1===r&&{variant:"disclaimer1"},sx:p({display:"block",...!1===r?{color:e=>"dark"===e.palette.mode?"onSurface.os200":"onSurface.os700"}:{color:e=>"dark"===e.palette.mode?"onSurface.os300":"onSurface.os600",fontSize:{xs:"12px"},lineHeight:{xs:"12px"},fontWeight:{xs:"400"},py:.5,px:1}},k),...L,children:u}),w&&!h?a(n,{autoFocus:!0,onBlur:()=>A(!1),value:r,onChange:e=>I(e.target.value),onKeyUp:()=>{},inputProps:{type:"number",step:v,min:b,"aria-valuemin":b,max:f,"aria-valuemax":f,"aria-valuenow":z},disableUnderline:!0,sx:p(e=>({display:"block",borderRadius:"4px",py:"1px",px:1,border:1,borderColor:"onSurface.os500","&&, &:hover":{backgroundColor:"background.primary"},"& .MuiInputBase-input":{fieldSizing:"content",textAlign:"inherit",p:0,...e.typography[V?.variant??"disclaimer1"]},...d(e,!1,1,"&.Mui-focused"),"&&:before":{border:"none"}}),j),...F}):!1!==r&&a(t,{variant:"disclaimer1",sx:p({display:"block",px:1,whiteSpace:"nowrap",color:e=>"dark"===e.palette.mode?"onSurface.os200":"onSurface.os700",...c&&{px:1,py:"1px",border:1,borderColor:"onSurface.os500",borderRadius:"4px"}},C),...c&&{tabIndex:0,onFocus:()=>A(!0)},...V,children:z})]})});export{x as SliderValue,m as SliderValues};
+import{jsxs as e,Fragment as r,jsx as a}from"react/jsx-runtime";import{forwardRef as o,useState as l,useCallback as s}from"react";import{Box as i,Typography as n,FilledInput as t}from"@mui/material";import{sxOverride as p}from"../../utils/sxOverride/sxOverride.js";import{flowSlider as u}from"./slider.theme.js";import{getFocusRingStyle as d}from"../../components/focusring/focusring.js";const m=o(({sx:o,children:l,value:s,valueProps:n,label:t,labelProps:d,valueLabelFormat:m,setValue:c,disabled:b,min:f=u.defaultProps.min,minLabel:v,minLabelProps:P,max:h=u.defaultProps.max,maxLabel:g,maxLabelProps:y,step:S=u.defaultProps.step,sliderValueProps:k,inputProps:L,...C},V)=>{const j={disabled:b,min:f,max:h,step:S,valueLabelFormat:m,valueProps:n,inputProps:L,...k};return e(i,{ref:V,sx:p({display:"flex",alignItems:"flex-end",justifyContent:"space-between",gap:1},o),...C,children:[Array.isArray(s)||!1===s&&(v||t)&&g?e(r,{children:[a(x,{value:!1!==s&&s[0],setValue:c?e=>c([e,s[1]]):void 0,label:v||t,labelProps:P||d,...j,max:s[1],index:0}),a(x,{value:!1!==s&&s[1],setValue:c?e=>c([s[0],e]):void 0,label:g,labelProps:y,...j,min:s[0],index:1,sx:p({textAlign:"right"},j?.sx)})]}):a(x,{value:s,setValue:c,label:t,labelProps:d,...j}),l]})}),x=o(({value:r,valueProps:o,label:u,labelProps:m,valueLabelFormat:x,setValue:c,min:b,max:f,step:v,index:P=0,inputProps:h,disabled:g,sx:y,...S},k)=>{const{sx:L,...C}=m??{},{sx:V,...j}=o??{},{sx:F,...w}=h??{},[A,I]=l(!1),z=s(e=>{const r=+(e||0);c(r<b?b:r>f?f:r)},[b,f,c]),B=x?x(r,P):r;return e(i,{ref:k,sx:p({minWidth:"82px",...(!u||!1===r)&&{pt:.5}},y),onClick:c&&!g?()=>I(!0):void 0,...S,children:[u&&a(n,{...!1===r&&{variant:"disclaimer1"},sx:p({display:"block",...!1===r?{color:e=>"dark"===e.palette.mode?"onSurface.os200":"onSurface.os700"}:{color:e=>"dark"===e.palette.mode?"onSurface.os300":"onSurface.os600",fontSize:{xs:"12px"},lineHeight:{xs:"12px"},fontWeight:{xs:"400"},py:.5,px:1}},L),...C,children:u}),A&&!g?a(t,{autoFocus:!0,onBlur:()=>I(!1),value:r,onChange:e=>z(e.target.value),onKeyUp:()=>{},inputProps:{type:"number",step:v,min:b,"aria-valuemin":b,max:f,"aria-valuemax":f,"aria-valuenow":B},disableUnderline:!0,sx:p(e=>({display:"block",borderRadius:"4px",py:"1px",px:1,border:1,borderColor:"onSurface.os500","&&, &:hover":{backgroundColor:"background.primary"},"& .MuiInputBase-input":{fieldSizing:"content",textAlign:"inherit",p:0,...e.typography[j?.variant??"disclaimer1"]},...d(e,!1,1,"&.Mui-focused"),"&&:before":{border:"none"}}),F),...w}):!1!==r&&a(n,{variant:"disclaimer1",sx:p({display:"block",px:1,whiteSpace:"nowrap",color:e=>"dark"===e.palette.mode?"onSurface.os200":"onSurface.os700",...c&&{px:1,py:"1px",border:1,borderColor:"onSurface.os500",borderRadius:"4px"}},V),...c&&{tabIndex:0,onFocus:()=>I(!0)},...j,children:B})]})});export{x as SliderValue,m as SliderValues};
 //# sourceMappingURL=SliderValues.js.map

package/materialui/slider/SliderValues.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SliderValues.js","sources":["../../../src/materialui/slider/SliderValues.tsx"],"sourcesContent":["import React, { forwardRef, ElementType, ReactNode, useState, useCallback } from 'react';\nimport { Box, BoxProps, SliderProps, Typography, TypographyProps, FilledInput, FilledInputProps } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { flowSlider } from '@/src/materialui/slider/slider.theme';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\n\nexport interface SliderValuesProps extends BoxProps<ElementType> {\n /*\n The value of the slider\n /\n value: SliderProps['value'] \| false;\n /\n Properties applied to value wrapper\n /\n valueProps?: TypographyProps<ElementType>;\n /\n Label show above value\n /\n label?: ReactNode;\n /\n Properties applied to label wrapper\n /\n labelProps?: TypographyProps<ElementType>;\n /\n The format function the value label's value\n /\n valueLabelFormat?: SliderProps['valueLabelFormat'];\n /\n Provide this function to allow changing the slider value with inputs\n /\n setValue?: (newValue: unknown) => void;\n /\n Disable editing\n /\n disabled?: boolean;\n /\n The minimum allowed value of the slider\n /\n min?: SliderProps['min'];\n /\n Text shown above min selected value\n /\n minLabel?: ReactNode;\n /\n Properties applied to label wrapper\n /\n minLabelProps?: TypographyProps<ElementType>;\n /\n The maximum allowed value of the slider\n /\n max?: SliderProps['max'];\n /\n Text shown above max selected value\n /\n maxLabel?: ReactNode;\n /\n Properties applied to label wrapper\n /\n maxLabelProps?: TypographyProps<ElementType>;\n /\n The granularity with which the slider can step through values\n /\n step?: SliderProps['step'];\n /\n Properties applied to the root wrapper of each SliderValue\n /\n sliderValueProps?: BoxProps<ElementType>;\n /\n Properties applied to SliderValue input field\n /\n inputProps?: FilledInputProps;\n}\n\n/\n Wrapper that render one or two SliderValue components based on the Slider type\n /\nexport const SliderValues: React.FC<SliderValuesProps> = forwardRef(\n (\n {\n sx,\n children,\n value,\n valueProps,\n label,\n labelProps,\n valueLabelFormat,\n setValue,\n disabled,\n min = flowSlider.defaultProps.min,\n minLabel,\n minLabelProps,\n max = flowSlider.defaultProps.max,\n maxLabel,\n maxLabelProps,\n step = flowSlider.defaultProps.step,\n sliderValueProps: rawSliderValueProps,\n inputProps,\n ...rest\n },\n ref,\n ) => {\n const sliderValueProps = {\n disabled,\n min,\n max,\n step,\n valueLabelFormat,\n valueProps,\n inputProps,\n ...rawSliderValueProps,\n };\n\n return (\n <Box\n ref={ref}\n sx={sxOverride({ display: 'flex', alignItems: 'flex-end', justifyContent: 'space-between', gap: 1 }, sx)}\n {...rest}\n >\n {Array.isArray(value) \|\| (value === false && (minLabel \|\| label) && maxLabel) ? (\n <>\n <SliderValue\n value={value !== false && value[0]}\n setValue={setValue ? (newValue) => setValue([newValue, value[1]]) : undefined}\n label={minLabel \|\| label}\n labelProps={minLabelProps \|\| labelProps}\n {...sliderValueProps}\n max={value[1]}\n />\n <SliderValue\n value={value !== false && value[1]}\n setValue={setValue ? (newValue) => setValue([value[0], newValue]) : undefined}\n label={maxLabel}\n labelProps={maxLabelProps}\n {...sliderValueProps}\n min={value[0]}\n sx={sxOverride({ textAlign: 'right' }, sliderValueProps?.sx)}\n />\n </>\n ) : (\n <SliderValue value={value} setValue={setValue} label={label} labelProps={labelProps} {...sliderValueProps} />\n )}\n {children}\n </Box>\n );\n },\n);\n\nexport interface SliderValueProps extends Omit<\n SliderValuesProps,\n 'value' \| 'minLabel' \| 'minLabelProps' \| 'maxLabel' \| 'maxLabelProps'\n> {\n /\n The single value of the slider\n /\n value: number \| false;\n /\n The single setValue for the slider value\n /\n setValue?: (newValue: number) => void;\n}\n\n/\n Display single value of slider, allows editing with input\n */\nexport const SliderValue: React.FC<SliderValueProps> = forwardRef(\n (\n {\n value,\n valueProps,\n label,\n labelProps,\n valueLabelFormat,\n setValue,\n min,\n max,\n step,\n inputProps,\n disabled,\n sx,\n ...rest\n },\n ref,\n ) => {\n const { sx: labelSx, ...restLabel } = labelProps ?? {};\n const { sx: valueSx, ...restValue } = valueProps ?? {};\n const { sx: inputSx, ...restInput } = inputProps ?? {};\n const [editing, setEditing] = useState(false);\n const editValue = useCallback(\n (inputValue: string) => {\n const newValue = +(inputValue \|\| 0);\n if (newValue < min) {\n setValue(min);\n } else if (newValue > max) {\n setValue(max);\n } else {\n setValue(newValue);\n }\n },\n [min, max, setValue],\n );\n const formattedValue = valueLabelFormat ? valueLabelFormat(value) : value;\n\n return (\n <Box\n ref={ref}\n sx={sxOverride({ minWidth: '82px', ...((!label \|\| value === false) && { pt: 0.5 }) }, sx)}\n onClick={setValue && !disabled ? () => setEditing(true) : undefined}\n {...rest}\n >\n {label && (\n <Typography\n {...(value === false && {\n variant: 'disclaimer1',\n })}\n sx={sxOverride(\n {\n display: 'block',\n ...(value === false\n ? {\n color: (theme) => (theme.palette.mode === 'dark' ? 'onSurface.os200' : 'onSurface.os700'),\n }\n : {\n // os600 instead of Figma's os500 to pass A11y contrast\n color: (theme) => (theme.palette.mode === 'dark' ? 'onSurface.os300' : 'onSurface.os600'),\n fontSize: { xs: '12px' },\n lineHeight: { xs: '12px' },\n fontWeight: { xs: '400' },\n py: 0.5,\n px: 1,\n }),\n },\n labelSx,\n )}\n {...restLabel}\n >\n {label}\n </Typography>\n )}\n {editing && !disabled ? (\n <FilledInput\n autoFocus\n onBlur={() => setEditing(false)}\n value={value}\n onChange={(e) => editValue(e.target.value)}\n onKeyUp={() => {}}\n inputProps={{\n type: 'number',\n step: step,\n min: min,\n ['aria-valuemin']: min,\n max: max,\n ['aria-valuemax']: max,\n ['aria-valuenow']: formattedValue,\n }}\n disableUnderline\n sx={sxOverride(\n (theme) => ({\n display: 'block',\n borderRadius: '4px',\n py: '1px', // pixel perfect matching design\n px: 1,\n border: 1,\n borderColor: 'onSurface.os500',\n '&&, &:hover': {\n backgroundColor: 'background.primary',\n },\n // input itself\n '& .MuiInputBase-input': {\n fieldSizing: 'content',\n textAlign: 'inherit',\n p: 0,\n // matching typography style with value\n ...theme.typography[restValue?.variant ?? 'disclaimer1'],\n },\n ...getFocusRingStyle(theme, false, 1, '&.Mui-focused'),\n '&&:before': {\n border: 'none',\n },\n }),\n inputSx,\n )}\n {...restInput}\n />\n ) : (\n value !== false && (\n <Typography\n variant=\"disclaimer1\"\n sx={sxOverride(\n {\n display: 'block',\n px: 1,\n whiteSpace: 'nowrap',\n color: (theme) => (theme.palette.mode === 'dark' ? 'onSurface.os200' : 'onSurface.os700'),\n // editable\n ...(setValue && {\n px: 1,\n py: '1px',\n border: 1,\n borderColor: 'onSurface.os500',\n borderRadius: '4px',\n }),\n },\n valueSx,\n )}\n {...(setValue && {\n // allow focus with keyboard navigation\n tabIndex: 0,\n onFocus: () => setEditing(true),\n })}\n {...restValue}\n >\n {formattedValue}\n </Typography>\n )\n )}\n </Box>\n );\n },\n);\n"],"names":["SliderValues","forwardRef","sx","children","value","valueProps","label","labelProps","valueLabelFormat","setValue","disabled","min","flowSlider","defaultProps","minLabel","minLabelProps","max","maxLabel","maxLabelProps","step","sliderValueProps","rawSliderValueProps","inputProps","rest","ref","_jsxs","Box","sxOverride","display","alignItems","justifyContent","gap","Array","isArray","_Fragment","_jsx","SliderValue","newValue","undefined","textAlign","labelSx","restLabel","valueSx","restValue","inputSx","restInput","editing","setEditing","useState","editValue","useCallback","inputValue","formattedValue","minWidth","pt","onClick","Typography","variant","color","theme","palette","mode","fontSize","xs","lineHeight","fontWeight","py","px","FilledInput","autoFocus","onBlur","onChange","e","target","onKeyUp","type","disableUnderline","borderRadius","border","borderColor","backgroundColor","fieldSizing","p","typography","getFocusRingStyle","whiteSpace","tabIndex","onFocus"],"mappings":"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"}
1	+ {"version":3,"file":"SliderValues.js","sources":["../../../src/materialui/slider/SliderValues.tsx"],"sourcesContent":["import React, { forwardRef, ElementType, ReactNode, useState, useCallback } from 'react';\nimport { Box, BoxProps, SliderProps, Typography, TypographyProps, FilledInput, FilledInputProps } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { flowSlider } from '@/src/materialui/slider/slider.theme';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\n\nexport interface SliderValuesProps extends BoxProps<ElementType> {\n /*\n The value of the slider\n /\n value: SliderProps['value'] \| false;\n /\n Properties applied to value wrapper\n /\n valueProps?: TypographyProps<ElementType>;\n /\n Label show above value\n /\n label?: ReactNode;\n /\n Properties applied to label wrapper\n /\n labelProps?: TypographyProps<ElementType>;\n /\n The format function the value label's value\n /\n valueLabelFormat?: SliderProps['valueLabelFormat'];\n /\n Provide this function to allow changing the slider value with inputs\n /\n setValue?: (newValue: unknown) => void;\n /\n Disable editing\n /\n disabled?: boolean;\n /\n The minimum allowed value of the slider\n /\n min?: SliderProps['min'];\n /\n Text shown above min selected value\n /\n minLabel?: ReactNode;\n /\n Properties applied to label wrapper\n /\n minLabelProps?: TypographyProps<ElementType>;\n /\n The maximum allowed value of the slider\n /\n max?: SliderProps['max'];\n /\n Text shown above max selected value\n /\n maxLabel?: ReactNode;\n /\n Properties applied to label wrapper\n /\n maxLabelProps?: TypographyProps<ElementType>;\n /\n The granularity with which the slider can step through values\n /\n step?: SliderProps['step'];\n /\n Properties applied to the root wrapper of each SliderValue\n /\n sliderValueProps?: BoxProps<ElementType>;\n /\n Properties applied to SliderValue input field\n /\n inputProps?: FilledInputProps;\n}\n\n/\n Wrapper that render one or two SliderValue components based on the Slider type\n /\nexport const SliderValues: React.FC<SliderValuesProps> = forwardRef(\n (\n {\n sx,\n children,\n value,\n valueProps,\n label,\n labelProps,\n valueLabelFormat,\n setValue,\n disabled,\n min = flowSlider.defaultProps.min,\n minLabel,\n minLabelProps,\n max = flowSlider.defaultProps.max,\n maxLabel,\n maxLabelProps,\n step = flowSlider.defaultProps.step,\n sliderValueProps: rawSliderValueProps,\n inputProps,\n ...rest\n },\n ref,\n ) => {\n const sliderValueProps = {\n disabled,\n min,\n max,\n step,\n valueLabelFormat,\n valueProps,\n inputProps,\n ...rawSliderValueProps,\n };\n\n return (\n <Box\n ref={ref}\n sx={sxOverride({ display: 'flex', alignItems: 'flex-end', justifyContent: 'space-between', gap: 1 }, sx)}\n {...rest}\n >\n {Array.isArray(value) \|\| (value === false && (minLabel \|\| label) && maxLabel) ? (\n <>\n <SliderValue\n value={value !== false && value[0]}\n setValue={setValue ? (newValue) => setValue([newValue, value[1]]) : undefined}\n label={minLabel \|\| label}\n labelProps={minLabelProps \|\| labelProps}\n {...sliderValueProps}\n max={value[1]}\n index={0}\n />\n <SliderValue\n value={value !== false && value[1]}\n setValue={setValue ? (newValue) => setValue([value[0], newValue]) : undefined}\n label={maxLabel}\n labelProps={maxLabelProps}\n {...sliderValueProps}\n min={value[0]}\n index={1}\n sx={sxOverride({ textAlign: 'right' }, sliderValueProps?.sx)}\n />\n </>\n ) : (\n <SliderValue value={value} setValue={setValue} label={label} labelProps={labelProps} {...sliderValueProps} />\n )}\n {children}\n </Box>\n );\n },\n);\n\nexport interface SliderValueProps extends Omit<\n SliderValuesProps,\n 'value' \| 'minLabel' \| 'minLabelProps' \| 'maxLabel' \| 'maxLabelProps'\n> {\n /\n The single value of the slider\n /\n value: number \| false;\n /\n The single setValue for the slider value\n /\n setValue?: (newValue: number) => void;\n /\n Index of the thumb this value represents, forwarded as the second argument to `valueLabelFormat`\n * @default 0\n /\n index?: number;\n}\n\n/\n Display single value of slider, allows editing with input\n */\nexport const SliderValue: React.FC<SliderValueProps> = forwardRef(\n (\n {\n value,\n valueProps,\n label,\n labelProps,\n valueLabelFormat,\n setValue,\n min,\n max,\n step,\n index = 0,\n inputProps,\n disabled,\n sx,\n ...rest\n },\n ref,\n ) => {\n const { sx: labelSx, ...restLabel } = labelProps ?? {};\n const { sx: valueSx, ...restValue } = valueProps ?? {};\n const { sx: inputSx, ...restInput } = inputProps ?? {};\n const [editing, setEditing] = useState(false);\n const editValue = useCallback(\n (inputValue: string) => {\n const newValue = +(inputValue \|\| 0);\n if (newValue < min) {\n setValue(min);\n } else if (newValue > max) {\n setValue(max);\n } else {\n setValue(newValue);\n }\n },\n [min, max, setValue],\n );\n const formattedValue = valueLabelFormat ? valueLabelFormat(value, index) : value;\n\n return (\n <Box\n ref={ref}\n sx={sxOverride({ minWidth: '82px', ...((!label \|\| value === false) && { pt: 0.5 }) }, sx)}\n onClick={setValue && !disabled ? () => setEditing(true) : undefined}\n {...rest}\n >\n {label && (\n <Typography\n {...(value === false && {\n variant: 'disclaimer1',\n })}\n sx={sxOverride(\n {\n display: 'block',\n ...(value === false\n ? {\n color: (theme) => (theme.palette.mode === 'dark' ? 'onSurface.os200' : 'onSurface.os700'),\n }\n : {\n // os600 instead of Figma's os500 to pass A11y contrast\n color: (theme) => (theme.palette.mode === 'dark' ? 'onSurface.os300' : 'onSurface.os600'),\n fontSize: { xs: '12px' },\n lineHeight: { xs: '12px' },\n fontWeight: { xs: '400' },\n py: 0.5,\n px: 1,\n }),\n },\n labelSx,\n )}\n {...restLabel}\n >\n {label}\n </Typography>\n )}\n {editing && !disabled ? (\n <FilledInput\n autoFocus\n onBlur={() => setEditing(false)}\n value={value}\n onChange={(e) => editValue(e.target.value)}\n onKeyUp={() => {}}\n inputProps={{\n type: 'number',\n step: step,\n min: min,\n ['aria-valuemin']: min,\n max: max,\n ['aria-valuemax']: max,\n ['aria-valuenow']: formattedValue,\n }}\n disableUnderline\n sx={sxOverride(\n (theme) => ({\n display: 'block',\n borderRadius: '4px',\n py: '1px', // pixel perfect matching design\n px: 1,\n border: 1,\n borderColor: 'onSurface.os500',\n '&&, &:hover': {\n backgroundColor: 'background.primary',\n },\n // input itself\n '& .MuiInputBase-input': {\n fieldSizing: 'content',\n textAlign: 'inherit',\n p: 0,\n // matching typography style with value\n ...theme.typography[restValue?.variant ?? 'disclaimer1'],\n },\n ...getFocusRingStyle(theme, false, 1, '&.Mui-focused'),\n '&&:before': {\n border: 'none',\n },\n }),\n inputSx,\n )}\n {...restInput}\n />\n ) : (\n value !== false && (\n <Typography\n variant=\"disclaimer1\"\n sx={sxOverride(\n {\n display: 'block',\n px: 1,\n whiteSpace: 'nowrap',\n color: (theme) => (theme.palette.mode === 'dark' ? 'onSurface.os200' : 'onSurface.os700'),\n // editable\n ...(setValue && {\n px: 1,\n py: '1px',\n border: 1,\n borderColor: 'onSurface.os500',\n borderRadius: '4px',\n }),\n },\n valueSx,\n )}\n {...(setValue && {\n // allow focus with keyboard navigation\n tabIndex: 0,\n onFocus: () => setEditing(true),\n })}\n {...restValue}\n >\n {formattedValue}\n </Typography>\n )\n )}\n </Box>\n );\n },\n);\n"],"names":["SliderValues","forwardRef","sx","children","value","valueProps","label","labelProps","valueLabelFormat","setValue","disabled","min","flowSlider","defaultProps","minLabel","minLabelProps","max","maxLabel","maxLabelProps","step","sliderValueProps","rawSliderValueProps","inputProps","rest","ref","_jsxs","Box","sxOverride","display","alignItems","justifyContent","gap","Array","isArray","_Fragment","_jsx","SliderValue","newValue","undefined","index","textAlign","labelSx","restLabel","valueSx","restValue","inputSx","restInput","editing","setEditing","useState","editValue","useCallback","inputValue","formattedValue","minWidth","pt","onClick","Typography","variant","color","theme","palette","mode","fontSize","xs","lineHeight","fontWeight","py","px","FilledInput","autoFocus","onBlur","onChange","e","target","onKeyUp","type","disableUnderline","borderRadius","border","borderColor","backgroundColor","fieldSizing","p","typography","getFocusRingStyle","whiteSpace","tabIndex","onFocus"],"mappings":"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"}

package/materialui/stepper/StepLabelIcon.d.ts CHANGED Viewed

@@ -10,4 +10,4 @@ export declare const FlowStepLabelIcon: ({ active, completed, error, ownerState
     completed: any;
     error: any;
     ownerState: any;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;

package/materialui/stepper/StepLabelIcon.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as r,jsxs as o}from"react/jsx-runtime";import{useMemo as e,useRef as t}from"react";import{Box as n}from"@mui/material";import{CheckIcon as a}from"../../components/icon/stroke/CheckIcon.js";import{CloseIcon as i}from"../../components/icon/stroke/CloseIcon.js";const c={root:"FlowStepIcon-root",active:"FlowStepIcon-active",completed:"FlowStepIcon-completed",error:"FlowStepIcon-error",disabled:"FlowStepIcon-disabled"},d=({active:o,completed:t,error:n,ownerState:d})=>{const{disabled:p}=d??{},s=e(()=>n?i:t&&!o?a:null,[n,t,o]);return r(l,{className:[c.root,o&&c.active,t&&c.completed,n&&c.error,p&&c.disabled].filter(Boolean).join(" "),children:s&&r(s,{sx:{position:"absolute",fontSize:"inherit",color:"background.primary"}})})},l=({children:e,className:a,sx:i,...d})=>{const l=t(!1),p=t(a);return l.current||p.current===a||(l.current=!0),o(n,{sx:{display:"flex",height:"28px",width:"28px",alignItems:"center",justifyContent:"center",position:"relative",boxSizing:"border-box",fontSize:"16px","& .MuiSvgIcon-root":{zIndex:"5"},"@keyframes flowStepperActive":{"0%":{transform:"scale(1.5)",opacity:"0.8"},"100%":{transform:"scale(1)",opacity:"1"}},"@keyframes flowStepperCompleted":{"0%":{transform:"scale(.8)",opacity:"0.8"},"100%":{transform:"scale(1)",opacity:"1"}},[`& .${c.root}`]:{height:"100%",width:"100%",borderRadius:"40px",borderColor:"onSurface.os500",backgroundColor:"transparent",borderWidth:"2px",borderStyle:"solid",color:"transparent",minHeight:"20px",[`&.${c.completed}:not(.${c.active})`]:{color:"onSurface.os700",backgroundColor:r=>"dark"===r.palette.mode?"brand.secondary":"brand.primary",border:"none",height:"100%",width:"100%",animation:l.current?"flowStepperCompleted 0.4s":"none"},[`&.${c.error}, &.${c.error}.${c.completed}`]:{borderColor:"error.main",backgroundColor:"error.main"},[`&.${c.active}`]:{color:"onSurface.os700",height:"100%",width:"100%",marginRight:"0px",marginLeft:"0px",borderColor:r=>"dark"===r.palette.mode?"brand.secondary":"brand.primary","&::before":{content:'""',position:"absolute",borderRadius:"40px",backgroundColor:r=>"dark"===r.palette.mode?"brand.secondary":"brand.primary",inset:"5px",animation:l.current?"flowStepperActive 0.4s":"none",zIndex:"1"},[`&.${c.error}`]:{borderColor:"error.main","&::before":{backgroundColor:"transparent.transparent",border:3,inset:"2px",borderColor:"background.primary"}}}},...i},...d,children:[e,r(n,{className:a})]})};export{d as FlowStepLabelIcon,c as flowStepIconClasses};
+import{jsx as r,jsxs as o}from"react/jsx-runtime";import{useMemo as e,useRef as t}from"react";import{Box as n}from"@mui/material";import{CheckIcon as a}from"../../components/icon/stroke/CheckIcon.js";import{CloseIcon as i}from"../../components/icon/stroke/CloseIcon.js";const c={root:"FlowStepIcon-root",active:"FlowStepIcon-active",completed:"FlowStepIcon-completed",error:"FlowStepIcon-error",disabled:"FlowStepIcon-disabled"},d=({active:o,completed:t,error:n,ownerState:d})=>{const{disabled:p}=d??{},s=e(()=>n?i:t&&!o?a:null,[n,t,o]);return r(l,{className:[c.root,o&&c.active,t&&c.completed,n&&c.error,p&&c.disabled].filter(Boolean).join(" "),children:s&&r(s,{sx:{position:"absolute",fontSize:"inherit",color:"background.primary"}})})},l=({children:e,className:a,sx:i,...d})=>{const l=t(!1),p=t(a);return l.current||p.current===a||(l.current=!0),o(n,{sx:{display:"flex",height:"28px",width:"28px",alignItems:"center",justifyContent:"center",position:"relative",boxSizing:"border-box",fontSize:"16px","& .MuiSvgIcon-root":{zIndex:"5"},"@keyframes flowStepperActive":{"0%":{transform:"scale(1.5)",opacity:"0.8"},"100%":{transform:"scale(1)",opacity:"1"}},"@keyframes flowStepperCompleted":{"0%":{transform:"scale(.8)",opacity:"0.8"},"100%":{transform:"scale(1)",opacity:"1"}},[`& .${c.root}`]:{height:"100%",width:"100%",borderRadius:"40px",borderColor:"onSurface.os500",backgroundColor:"transparent",borderWidth:"2px",borderStyle:"solid",color:"transparent",minHeight:"20px",[`&.${c.completed}:not(.${c.active})`]:{color:"onSurface.os700",backgroundColor:r=>"dark"===r.palette.mode?"brand.secondary":"brand.primary",border:"none",height:"100%",width:"100%",animation:l.current?"flowStepperCompleted 0.4s":"none"},[`&.${c.error}, &.${c.error}.${c.completed}`]:{borderColor:"error.main",backgroundColor:"error.main"},[`&.${c.active}`]:{color:"onSurface.os700",height:"100%",width:"100%",marginRight:"0px",marginLeft:"0px",borderColor:r=>"dark"===r.palette.mode?"brand.secondary":"brand.primary","&::before":{content:'""',position:"absolute",borderRadius:"40px",backgroundColor:r=>"dark"===r.palette.mode?"brand.secondary":"brand.primary",inset:"5px",animation:l.current?"flowStepperActive 0.4s":"none",zIndex:"1"},[`&.${c.error}`]:{borderColor:"error.main","&::before":{backgroundColor:"transparent",border:3,inset:"2px",borderColor:"background.primary"}}}},...i},...d,children:[e,r(n,{className:a})]})};export{d as FlowStepLabelIcon,c as flowStepIconClasses};
 //# sourceMappingURL=StepLabelIcon.js.map

package/materialui/stepper/StepLabelIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepLabelIcon.js","sources":["../../../src/materialui/stepper/StepLabelIcon.tsx"],"sourcesContent":["import { useMemo, useRef } from 'react';\nimport { Box, BoxProps } from '@mui/material';\nimport { CheckIcon } from '@/src/components/icon/stroke/CheckIcon';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\n\nexport const flowStepIconClasses = {\n root: 'FlowStepIcon-root',\n active: 'FlowStepIcon-active',\n completed: 'FlowStepIcon-completed',\n error: 'FlowStepIcon-error',\n disabled: 'FlowStepIcon-disabled',\n};\n\nexport const FlowStepLabelIcon = ({ active, completed, error, ownerState }) => {\n const { disabled } = ownerState ?? {};\n // obtain icon based on the state\n const IconComponent = useMemo(() => {\n if (error) {\n return CloseIcon;\n } else if (completed && !active) {\n return CheckIcon;\n } else {\n return null;\n }\n }, [error, completed, active]);\n\n return (\n <FlowStepIconRoot\n className={[\n flowStepIconClasses.root,\n active && flowStepIconClasses.active,\n completed && flowStepIconClasses.completed,\n error && flowStepIconClasses.error,\n disabled && flowStepIconClasses.disabled,\n ]\n .filter(Boolean)\n .join(' ')}\n >\n {IconComponent && (\n <IconComponent\n sx={{\n position: 'absolute',\n fontSize: 'inherit',\n color: 'background.primary',\n }}\n />\n )}\n </FlowStepIconRoot>\n );\n};\n\nconst FlowStepIconRoot = ({ children, className, sx, ...restProps }: BoxProps) => {\n // during first render (and first state) do not play animation\n const animation = useRef(false);\n const initialClassName = useRef(className);\n if (!animation.current && initialClassName.current !== className) {\n animation.current = true;\n }\n\n return (\n <Box\n sx={{\n display: 'flex',\n height: '28px',\n width: '28px',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n boxSizing: 'border-box',\n fontSize: '16px',\n '& .MuiSvgIcon-root': {\n zIndex: '5',\n },\n [`@keyframes flowStepperActive`]: {\n '0%': {\n transform: 'scale(1.5)',\n opacity: '0.8',\n },\n '100%': {\n transform: 'scale(1)',\n opacity: '1',\n },\n },\n [`@keyframes flowStepperCompleted`]: {\n '0%': {\n transform: 'scale(.8)',\n opacity: '0.8',\n },\n '100%': {\n transform: 'scale(1)',\n opacity: '1',\n },\n },\n // style is also applied in stepButton.theme.ts\n [`& .${flowStepIconClasses.root}`]: {\n height: '100%',\n width: '100%',\n borderRadius: '40px',\n borderColor: 'onSurface.os500',\n backgroundColor: 'transparent',\n borderWidth: '2px',\n borderStyle: 'solid',\n color: 'transparent',\n minHeight: '20px',\n // completed\n [`&.${flowStepIconClasses.completed}:not(.${flowStepIconClasses.active})`]: {\n color: 'onSurface.os700',\n backgroundColor: (theme) => (theme.palette.mode === 'dark' ? 'brand.secondary' : 'brand.primary'),\n border: 'none',\n height: '100%',\n width: '100%',\n animation: animation.current ? 'flowStepperCompleted 0.4s' : 'none',\n },\n // error\n [`&.${flowStepIconClasses.error}, &.${flowStepIconClasses.error}.${flowStepIconClasses.completed}`]: {\n borderColor: 'error.main',\n backgroundColor: 'error.main',\n },\n // disabled style is applied from stepper.theme.ts as it has to be applied only for the non-linear variant\n // active\n [`&.${flowStepIconClasses.active}`]: {\n color: 'onSurface.os700',\n height: '100%',\n width: '100%',\n marginRight: '0px',\n marginLeft: '0px',\n borderColor: (theme) => (theme.palette.mode === 'dark' ? 'brand.secondary' : 'brand.primary'),\n '&::before': {\n content: '\"\"',\n position: 'absolute',\n borderRadius: '40px',\n backgroundColor: (theme) => (theme.palette.mode === 'dark' ? 'brand.secondary' : 'brand.primary'),\n inset: '5px',\n animation: animation.current ? 'flowStepperActive 0.4s' : 'none',\n zIndex: '1',\n },\n [`&.${flowStepIconClasses.error}`]: {\n borderColor: 'error.main',\n '&::before': {\n backgroundColor: 'transparent~~.transparent~~',\n border: 3,\n inset: '2px',\n borderColor: 'background.primary',\n },\n },\n },\n },\n ...sx,\n }}\n {...restProps}\n >\n {children}\n <Box className={className} />\n </Box>\n );\n};\n"],"names":["flowStepIconClasses","root","active","completed","error","disabled","FlowStepLabelIcon","ownerState","IconComponent","useMemo","CloseIcon","CheckIcon","_jsx","FlowStepIconRoot","className","filter","Boolean","join","children","sx","position","fontSize","color","restProps","animation","useRef","initialClassName","current","_jsxs","Box","display","height","width","alignItems","justifyContent","boxSizing","zIndex","transform","opacity","borderRadius","borderColor","backgroundColor","borderWidth","borderStyle","minHeight","theme","palette","mode","border","marginRight","marginLeft","content","inset"],"mappings":"8QAKO,MAAMA,EAAsB,CACjCC,KAAM,oBACNC,OAAQ,sBACRC,UAAW,yBACXC,MAAO,qBACPC,SAAU,yBAGCC,EAAoB,EAAGJ,SAAQC,YAAWC,QAAOG,iBAC5D,MAAMF,SAAEA,GAAaE,GAAc,CAAA,EAE7BC,EAAgBC,EAAQ,IACxBL,EACKM,EACEP,IAAcD,EAChBS,EAEA,KAER,CAACP,EAAOD,EAAWD,IAEtB,OACEU,EAACC,EAAgB,CACfC,UAAW,CACTd,EAAoBC,KACpBC,GAAUF,EAAoBE,OAC9BC,GAAaH,EAAoBG,UACjCC,GAASJ,EAAoBI,MAC7BC,GAAYL,EAAoBK,UAE/BU,OAAOC,SACPC,KAAK,KAAIC,SAEXV,GACCI,EAACJ,EAAa,CACZW,GAAI,CACFC,SAAU,WACVC,SAAU,UACVC,MAAO,2BAQbT,EAAmB,EAAGK,WAAUJ,YAAWK,QAAOI,MAEtD,MAAMC,EAAYC,GAAO,GACnBC,EAAmBD,EAAOX,GAKhC,OAJKU,EAAUG,SAAWD,EAAiBC,UAAYb,IACrDU,EAAUG,SAAU,GAIpBC,EAACC,EAAG,CACFV,GAAI,CACFW,QAAS,OACTC,OAAQ,OACRC,MAAO,OACPC,WAAY,SACZC,eAAgB,SAChBd,SAAU,WACVe,UAAW,aACXd,SAAU,OACV,qBAAsB,CACpBe,OAAQ,KAEV,+BAAkC,CAChC,KAAM,CACJC,UAAW,aACXC,QAAS,OAEX,OAAQ,CACND,UAAW,WACXC,QAAS,MAGb,kCAAqC,CACnC,KAAM,CACJD,UAAW,YACXC,QAAS,OAEX,OAAQ,CACND,UAAW,WACXC,QAAS,MAIb,CAAC,MAAMtC,EAAoBC,QAAS,CAClC8B,OAAQ,OACRC,MAAO,OACPO,aAAc,OACdC,YAAa,kBACbC,gBAAiB,cACjBC,YAAa,MACbC,YAAa,QACbrB,MAAO,cACPsB,UAAW,OAEX,CAAC,KAAK5C,EAAoBG,kBAAkBH,EAAoBE,WAAY,CAC1EoB,MAAO,kBACPmB,gBAAkBI,GAAkC,SAAvBA,EAAMC,QAAQC,KAAkB,kBAAoB,gBACjFC,OAAQ,OACRjB,OAAQ,OACRC,MAAO,OACPR,UAAWA,EAAUG,QAAU,4BAA8B,QAG/D,CAAC,KAAK3B,EAAoBI,YAAYJ,EAAoBI,SAASJ,EAAoBG,aAAc,CACnGqC,YAAa,aACbC,gBAAiB,cAInB,CAAC,KAAKzC,EAAoBE,UAAW,CACnCoB,MAAO,kBACPS,OAAQ,OACRC,MAAO,OACPiB,YAAa,MACbC,WAAY,MACZV,YAAcK,GAAkC,SAAvBA,EAAMC,QAAQC,KAAkB,kBAAoB,gBAC7E,YAAa,CACXI,QAAS,KACT/B,SAAU,WACVmB,aAAc,OACdE,gBAAkBI,GAAkC,SAAvBA,EAAMC,QAAQC,KAAkB,kBAAoB,gBACjFK,MAAO,MACP5B,UAAWA,EAAUG,QAAU,yBAA2B,OAC1DS,OAAQ,KAEV,CAAC,KAAKpC,EAAoBI,SAAU,CAClCoC,YAAa,aACb,YAAa,CACXC,gBAAiB,~~0BACjBO~~,OAAQ,EACRI,MAAO,MACPZ,YAAa,4BAKlBrB,MAEDI,EAASL,SAAA,CAEZA,EACDN,EAACiB,EAAG,CAACf,UAAWA"}
1	+ {"version":3,"file":"StepLabelIcon.js","sources":["../../../src/materialui/stepper/StepLabelIcon.tsx"],"sourcesContent":["import { useMemo, useRef } from 'react';\nimport { Box, BoxProps } from '@mui/material';\nimport { CheckIcon } from '@/src/components/icon/stroke/CheckIcon';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\n\nexport const flowStepIconClasses = {\n root: 'FlowStepIcon-root',\n active: 'FlowStepIcon-active',\n completed: 'FlowStepIcon-completed',\n error: 'FlowStepIcon-error',\n disabled: 'FlowStepIcon-disabled',\n};\n\nexport const FlowStepLabelIcon = ({ active, completed, error, ownerState }) => {\n const { disabled } = ownerState ?? {};\n // obtain icon based on the state\n const IconComponent = useMemo(() => {\n if (error) {\n return CloseIcon;\n } else if (completed && !active) {\n return CheckIcon;\n } else {\n return null;\n }\n }, [error, completed, active]);\n\n return (\n <FlowStepIconRoot\n className={[\n flowStepIconClasses.root,\n active && flowStepIconClasses.active,\n completed && flowStepIconClasses.completed,\n error && flowStepIconClasses.error,\n disabled && flowStepIconClasses.disabled,\n ]\n .filter(Boolean)\n .join(' ')}\n >\n {IconComponent && (\n <IconComponent\n sx={{\n position: 'absolute',\n fontSize: 'inherit',\n color: 'background.primary',\n }}\n />\n )}\n </FlowStepIconRoot>\n );\n};\n\nconst FlowStepIconRoot = ({ children, className, sx, ...restProps }: BoxProps) => {\n // during first render (and first state) do not play animation\n const animation = useRef(false);\n const initialClassName = useRef(className);\n if (!animation.current && initialClassName.current !== className) {\n animation.current = true;\n }\n\n return (\n <Box\n sx={{\n display: 'flex',\n height: '28px',\n width: '28px',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n boxSizing: 'border-box',\n fontSize: '16px',\n '& .MuiSvgIcon-root': {\n zIndex: '5',\n },\n [`@keyframes flowStepperActive`]: {\n '0%': {\n transform: 'scale(1.5)',\n opacity: '0.8',\n },\n '100%': {\n transform: 'scale(1)',\n opacity: '1',\n },\n },\n [`@keyframes flowStepperCompleted`]: {\n '0%': {\n transform: 'scale(.8)',\n opacity: '0.8',\n },\n '100%': {\n transform: 'scale(1)',\n opacity: '1',\n },\n },\n // style is also applied in stepButton.theme.ts\n [`& .${flowStepIconClasses.root}`]: {\n height: '100%',\n width: '100%',\n borderRadius: '40px',\n borderColor: 'onSurface.os500',\n backgroundColor: 'transparent',\n borderWidth: '2px',\n borderStyle: 'solid',\n color: 'transparent',\n minHeight: '20px',\n // completed\n [`&.${flowStepIconClasses.completed}:not(.${flowStepIconClasses.active})`]: {\n color: 'onSurface.os700',\n backgroundColor: (theme) => (theme.palette.mode === 'dark' ? 'brand.secondary' : 'brand.primary'),\n border: 'none',\n height: '100%',\n width: '100%',\n animation: animation.current ? 'flowStepperCompleted 0.4s' : 'none',\n },\n // error\n [`&.${flowStepIconClasses.error}, &.${flowStepIconClasses.error}.${flowStepIconClasses.completed}`]: {\n borderColor: 'error.main',\n backgroundColor: 'error.main',\n },\n // disabled style is applied from stepper.theme.ts as it has to be applied only for the non-linear variant\n // active\n [`&.${flowStepIconClasses.active}`]: {\n color: 'onSurface.os700',\n height: '100%',\n width: '100%',\n marginRight: '0px',\n marginLeft: '0px',\n borderColor: (theme) => (theme.palette.mode === 'dark' ? 'brand.secondary' : 'brand.primary'),\n '&::before': {\n content: '\"\"',\n position: 'absolute',\n borderRadius: '40px',\n backgroundColor: (theme) => (theme.palette.mode === 'dark' ? 'brand.secondary' : 'brand.primary'),\n inset: '5px',\n animation: animation.current ? 'flowStepperActive 0.4s' : 'none',\n zIndex: '1',\n },\n [`&.${flowStepIconClasses.error}`]: {\n borderColor: 'error.main',\n '&::before': {\n backgroundColor: 'transparent',\n border: 3,\n inset: '2px',\n borderColor: 'background.primary',\n },\n },\n },\n },\n ...sx,\n }}\n {...restProps}\n >\n {children}\n <Box className={className} />\n </Box>\n );\n};\n"],"names":["flowStepIconClasses","root","active","completed","error","disabled","FlowStepLabelIcon","ownerState","IconComponent","useMemo","CloseIcon","CheckIcon","_jsx","FlowStepIconRoot","className","filter","Boolean","join","children","sx","position","fontSize","color","restProps","animation","useRef","initialClassName","current","_jsxs","Box","display","height","width","alignItems","justifyContent","boxSizing","zIndex","transform","opacity","borderRadius","borderColor","backgroundColor","borderWidth","borderStyle","minHeight","theme","palette","mode","border","marginRight","marginLeft","content","inset"],"mappings":"8QAKO,MAAMA,EAAsB,CACjCC,KAAM,oBACNC,OAAQ,sBACRC,UAAW,yBACXC,MAAO,qBACPC,SAAU,yBAGCC,EAAoB,EAAGJ,SAAQC,YAAWC,QAAOG,iBAC5D,MAAMF,SAAEA,GAAaE,GAAc,CAAA,EAE7BC,EAAgBC,EAAQ,IACxBL,EACKM,EACEP,IAAcD,EAChBS,EAEA,KAER,CAACP,EAAOD,EAAWD,IAEtB,OACEU,EAACC,EAAgB,CACfC,UAAW,CACTd,EAAoBC,KACpBC,GAAUF,EAAoBE,OAC9BC,GAAaH,EAAoBG,UACjCC,GAASJ,EAAoBI,MAC7BC,GAAYL,EAAoBK,UAE/BU,OAAOC,SACPC,KAAK,KAAIC,SAEXV,GACCI,EAACJ,EAAa,CACZW,GAAI,CACFC,SAAU,WACVC,SAAU,UACVC,MAAO,2BAQbT,EAAmB,EAAGK,WAAUJ,YAAWK,QAAOI,MAEtD,MAAMC,EAAYC,GAAO,GACnBC,EAAmBD,EAAOX,GAKhC,OAJKU,EAAUG,SAAWD,EAAiBC,UAAYb,IACrDU,EAAUG,SAAU,GAIpBC,EAACC,EAAG,CACFV,GAAI,CACFW,QAAS,OACTC,OAAQ,OACRC,MAAO,OACPC,WAAY,SACZC,eAAgB,SAChBd,SAAU,WACVe,UAAW,aACXd,SAAU,OACV,qBAAsB,CACpBe,OAAQ,KAEV,+BAAkC,CAChC,KAAM,CACJC,UAAW,aACXC,QAAS,OAEX,OAAQ,CACND,UAAW,WACXC,QAAS,MAGb,kCAAqC,CACnC,KAAM,CACJD,UAAW,YACXC,QAAS,OAEX,OAAQ,CACND,UAAW,WACXC,QAAS,MAIb,CAAC,MAAMtC,EAAoBC,QAAS,CAClC8B,OAAQ,OACRC,MAAO,OACPO,aAAc,OACdC,YAAa,kBACbC,gBAAiB,cACjBC,YAAa,MACbC,YAAa,QACbrB,MAAO,cACPsB,UAAW,OAEX,CAAC,KAAK5C,EAAoBG,kBAAkBH,EAAoBE,WAAY,CAC1EoB,MAAO,kBACPmB,gBAAkBI,GAAkC,SAAvBA,EAAMC,QAAQC,KAAkB,kBAAoB,gBACjFC,OAAQ,OACRjB,OAAQ,OACRC,MAAO,OACPR,UAAWA,EAAUG,QAAU,4BAA8B,QAG/D,CAAC,KAAK3B,EAAoBI,YAAYJ,EAAoBI,SAASJ,EAAoBG,aAAc,CACnGqC,YAAa,aACbC,gBAAiB,cAInB,CAAC,KAAKzC,EAAoBE,UAAW,CACnCoB,MAAO,kBACPS,OAAQ,OACRC,MAAO,OACPiB,YAAa,MACbC,WAAY,MACZV,YAAcK,GAAkC,SAAvBA,EAAMC,QAAQC,KAAkB,kBAAoB,gBAC7E,YAAa,CACXI,QAAS,KACT/B,SAAU,WACVmB,aAAc,OACdE,gBAAkBI,GAAkC,SAAvBA,EAAMC,QAAQC,KAAkB,kBAAoB,gBACjFK,MAAO,MACP5B,UAAWA,EAAUG,QAAU,yBAA2B,OAC1DS,OAAQ,KAEV,CAAC,KAAKpC,EAAoBI,SAAU,CAClCoC,YAAa,aACb,YAAa,CACXC,gBAAiB,cACjBO,OAAQ,EACRI,MAAO,MACPZ,YAAa,4BAKlBrB,MAEDI,EAASL,SAAA,CAEZA,EACDN,EAACiB,EAAG,CAACf,UAAWA"}

package/materialui/table/stories/actions.d.ts CHANGED Viewed

	@@ -1 +1 @@
1	- export declare const ActionsTable: () => import("react~~/jsx-runtime~~").JSX.Element;
1	+ export declare const ActionsTable: () => import("react").JSX.Element;

package/materialui/table/stories/basic.d.ts CHANGED Viewed

	@@ -1 +1 @@
1	- export declare const BasicTable: () => import("react~~/jsx-runtime~~").JSX.Element;
1	+ export declare const BasicTable: () => import("react").JSX.Element;

package/materialui/table/stories/interactive.d.ts CHANGED Viewed

	@@ -1 +1 @@
1	- export declare const InteractiveTable: () => import("react~~/jsx-runtime~~").JSX.Element;
1	+ export declare const InteractiveTable: () => import("react").JSX.Element;

package/materialui/table/stories/pagination.d.ts CHANGED Viewed

@@ -1,3 +1,3 @@
-export declare const PaginationTable: () => import("react/jsx-runtime").JSX.Element;
-export declare const SimplePaginationDemo: () => import("react/jsx-runtime").JSX.Element;
-export declare const ChevronsPaginationDemo: () => import("react/jsx-runtime").JSX.Element;
+export declare const PaginationTable: () => import("react").JSX.Element;
+export declare const SimplePaginationDemo: () => import("react").JSX.Element;
+export declare const ChevronsPaginationDemo: () => import("react").JSX.Element;

package/materialui/table/stories/scrollbar.d.ts CHANGED Viewed

	@@ -1 +1 @@
1	- export declare const ScrollbarTable: () => import("react~~/jsx-runtime~~").JSX.Element;
1	+ export declare const ScrollbarTable: () => import("react").JSX.Element;

package/materialui/table/stories/selectSort.d.ts CHANGED Viewed

	@@ -1 +1 @@
1	- export declare const SelectSortTable: () => import("react~~/jsx-runtime~~").JSX.Element;
1	+ export declare const SelectSortTable: () => import("react").JSX.Element;

package/materialui/table/stories/small.d.ts CHANGED Viewed

	@@ -1 +1 @@
1	- export declare const SmallTable: () => import("react~~/jsx-runtime~~").JSX.Element;
1	+ export declare const SmallTable: () => import("react").JSX.Element;

package/materialui/table/tablePagination.theme.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as t,Fragment as e,jsx as o}from"react/jsx-runtime";import{Box as n}from"@mui/material";import{ArrowLeftIcon as i}from"../../components/icon/stroke/ArrowLeftIcon.js";import{ArrowRightIcon as r}from"../../components/icon/stroke/ArrowRightIcon.js";import{ChevronPreviousIcon as s}from"../../components/icon/stroke/ChevronPreviousIcon.js";import{ChevronNextIcon as a}from"../../components/icon/stroke/ChevronNextIcon.js";import{getFocusRingStyle as p}from"../../components/focusring/focusring.js";const m={defaultProps:{showFirstButton:!1,showLastButton:!1,labelDisplayedRows:({from:i,to:r,count:s,page:a})=>t(e,{children:[o(n,{component:"strong",children:a+1}),o(n,{component:"span",className:"divider",children:" / "}),o(n,{component:"span",children:Math.ceil(s/(a>=1?(i-1)/a:r-i+1))||1})]}),slots:{actions:{previousButtonIcon:i,nextButtonIcon:r,firstButtonIcon:s,lastButtonIcon:a}},slotProps:{actions:{previousButton:{size:"medium",className:"MuiTablePagination-actions-previous"},nextButton:{size:"medium",className:"MuiTablePagination-actions-next"},firstButton:{size:"medium"},lastButton:{size:"medium"}}}},styleOverrides:{root:({theme:t})=>({border:`1px solid ${t.palette.surface.secondary}`,borderRadius:"8px","&td":{border:"none",borderRadius:"0"}}),toolbar:({theme:t})=>({position:"relative",justifyContent:"center",[t.breakpoints.up("md")]:{minHeight:"80px",padding:"4px 24px"},[t.breakpoints.down("md")]:{flexWrap:"wrap",minHeight:"0",padding:"8px 16px"}}),spacer:({theme:t})=>({flexGrow:"1",flexBasis:"auto",...t.typography.body,[t.breakpoints.down("sm")]:{flexBasis:"100%",textAlign:"center"}}),selectLabel:{margin:"0"},input:({theme:t})=>({margin:"0",padding:"0",borderRadius:"4px",...t.typography.body,...p(t,!1,"0px","&.Mui-focused"),[t.breakpoints.up("xs")]:{fontWeight:"700"},"&& .MuiSelect-select":{padding:"4px 26px 4px 4px"}}),displayedRows:({theme:t,ownerState:e})=>({position:"absolute",right:24+(e.showLastButton?88:44)+"px",width:"90px",textAlign:"center",whiteSpace:"nowrap",height:"44px",display:"flex",alignItems:"center",justifyContent:"center",margin:"0",color:"dark"===t.palette.mode?t.palette.onSurface.os300:t.palette.onSurface.os700,strong:{color:t.palette.text.primary},".divider":{fontWeight:"400",margin:"0 4px"},[t.breakpoints.down("md")]:{bottom:"8px",right:"0",left:"0",margin:"0 auto"}}),actions:({theme:t})=>({margin:"0",display:"flex",alignItems:"center",justifyContent:"flex-end",flexGrow:"1","& .MuiTablePagination-actions-next":{marginLeft:"90px"},[t.breakpoints.down("md")]:{flexBasis:"100%",justifyContent:"center"}})}};export{m as flowTablePagination};
+import{jsxs as t,Fragment as e,jsx as o}from"react/jsx-runtime";import{Box as n}from"@mui/material";import{ArrowLeftIcon as i}from"../../components/icon/stroke/ArrowLeftIcon.js";import{ArrowRightIcon as r}from"../../components/icon/stroke/ArrowRightIcon.js";import{ChevronPreviousIcon as s}from"../../components/icon/stroke/ChevronPreviousIcon.js";import{ChevronNextIcon as a}from"../../components/icon/stroke/ChevronNextIcon.js";import{getFocusRingStyle as p}from"../../components/focusring/focusring.js";const m={defaultProps:{showFirstButton:!1,showLastButton:!1,labelDisplayedRows:({from:i,to:r,count:s,page:a})=>t(e,{children:[o(n,{component:"strong",children:a+1}),o(n,{component:"span",className:"divider",children:" / "}),o(n,{component:"span",children:Math.ceil(s/(a>=1?(i-1)/a:r-i+1))||1})]}),slots:{actions:{previousButtonIcon:i,nextButtonIcon:r,firstButtonIcon:s,lastButtonIcon:a}},slotProps:{actions:{previousButton:{size:"medium",className:"MuiTablePagination-actions-previous"},nextButton:{size:"medium",className:"MuiTablePagination-actions-next"},firstButton:{size:"medium"},lastButton:{size:"medium"}}}},styleOverrides:{root:({theme:t})=>({border:`1px solid ${t.palette.surface.secondary}`,borderRadius:"8px","&td":{border:"none",borderRadius:"0"}}),toolbar:({theme:t})=>({position:"relative",justifyContent:"center",[t.breakpoints.up("md")]:{minHeight:"80px",padding:"4px 24px"},[t.breakpoints.down("md")]:{flexWrap:"wrap",minHeight:"0",padding:"8px 16px"}}),spacer:({theme:t})=>({flexGrow:"1",flexBasis:"auto",...t.typography.body,[t.breakpoints.down("sm")]:{flexBasis:"100%",textAlign:"center"}}),selectLabel:{margin:"0"},input:({theme:t})=>({margin:"0",padding:"0",borderRadius:"4px",...t.typography.body,...p(t,!1,"0px","&.Mui-focused"),[t.breakpoints.up("xs")]:{fontWeight:"700"},"&& .MuiSelect-select":{padding:"4px 26px 4px 4px"}}),displayedRows:({theme:t,ownerState:e})=>({position:"absolute",right:24+(e.showLastButton?88:44)+"px",width:"90px",textAlign:"center",whiteSpace:"nowrap",height:"44px",display:"flex",alignItems:"center",justifyContent:"center",margin:"0",color:"dark"===t.palette.mode?t.palette.onSurface.os300:t.palette.onSurface.os700,strong:{color:t.palette.text.primary},".divider":{fontWeight:"400",margin:"0 4px"},[t.breakpoints.down("md")]:{bottom:"8px",right:"0",left:"0",margin:"0 auto"}}),actions:({theme:t})=>({margin:"0",display:"flex",alignItems:"center",justifyContent:"flex-end",flexGrow:"1","& .MuiTablePagination-actions-next":{..."rtl"===t.direction?{marginRight:"90px"}:{marginLeft:"90px"}},[t.breakpoints.down("md")]:{flexBasis:"100%",justifyContent:"center"}})}};export{m as flowTablePagination};
 //# sourceMappingURL=tablePagination.theme.js.map

package/materialui/table/tablePagination.theme.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tablePagination.theme.js","sources":["../../../src/materialui/table/tablePagination.theme.tsx"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme, Box } from '@mui/material';\nimport { ArrowLeftIcon } from '@/src/components/icon/stroke/ArrowLeftIcon';\nimport { ArrowRightIcon } from '@/src/components/icon/stroke/ArrowRightIcon';\nimport { ChevronPreviousIcon } from '@/src/components/icon/stroke/ChevronPreviousIcon';\nimport { ChevronNextIcon } from '@/src/components/icon/stroke/ChevronNextIcon';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\n\nexport const flowTablePagination: Components<Theme>['MuiTablePagination'] = {\n defaultProps: {\n // not recommended properties, <Pagination /> component should be utilized instead\n showFirstButton: false,\n showLastButton: false,\n // adjust label\n // we are obtaining max page from the available params\n // - first page, calculated from 'from' and 'to'\n // - other pages, calculated from 'from' - 1 and diving by current page\n labelDisplayedRows: ({ from, to, count, page }) => (\n <>\n <Box component=\"strong\">{page + 1}</Box>\n <Box component=\"span\" className=\"divider\">{` / `}</Box>\n <Box component=\"span\">{Math.ceil(count / (page >= 1 ? (from - 1) / page : to - from + 1)) \|\| 1}</Box>\n </>\n ),\n // correct icons\n slots: {\n actions: {\n // navigation arrows\n previousButtonIcon: ArrowLeftIcon,\n nextButtonIcon: ArrowRightIcon,\n // first & last extra arrow (hidden by default)\n firstButtonIcon: ChevronPreviousIcon,\n lastButtonIcon: ChevronNextIcon,\n },\n },\n slotProps: {\n actions: {\n previousButton: {\n size: 'medium',\n className: 'MuiTablePagination-actions-previous',\n },\n nextButton: {\n size: 'medium',\n className: 'MuiTablePagination-actions-next',\n },\n firstButton: {\n size: 'medium',\n },\n lastButton: {\n size: 'medium',\n },\n },\n },\n },\n styleOverrides: {\n root: ({ theme }) => ({\n // we are outside table\n border: `1px solid ${theme.palette.surface.secondary}`,\n borderRadius: '8px',\n // part of <TableFooter /> and <TableRow />\n '&td': {\n border: 'none',\n borderRadius: '0',\n },\n }),\n // wrapper under root\n toolbar: ({ theme }) => ({\n position: 'relative',\n justifyContent: 'center',\n // mimic style from tableCell.theme\n [theme.breakpoints.up('md')]: {\n minHeight: '80px',\n // right padding also affect position of displayedRows\n padding: '4px 24px',\n },\n // responsive\n [theme.breakpoints.down('md')]: {\n // support multiple rows\n flexWrap: 'wrap',\n // adjust proportions\n minHeight: '0',\n padding: '8px 16px',\n },\n }),\n // first element on left side\n spacer: ({ theme }) => ({\n // make sure to keep most of the space on the left\n flexGrow: '1',\n flexBasis: 'auto',\n // in case text is provided\n ...theme.typography.body,\n // tiny responsive\n [theme.breakpoints.down('sm')]: {\n // take whole row\n flexBasis: '100%',\n textAlign: 'center',\n },\n }),\n // 'row per page:' text\n selectLabel: {\n margin: '0',\n },\n // input field for amount of rows\n input: ({ theme }) => ({\n margin: '0',\n padding: '0',\n borderRadius: '4px',\n ...theme.typography.body,\n ...getFocusRingStyle(theme, false, '0px', '&.Mui-focused'),\n [theme.breakpoints.up('xs')]: {\n fontWeight: '700',\n },\n '&& .MuiSelect-select': {\n padding: '4px 26px 4px 4px',\n },\n }),\n // label of current page, 1/10\n displayedRows: ({ theme, ownerState }) => ({\n // move into actions\n position: 'absolute',\n // IconButton size + padding\n right: `${(ownerState.showLastButton ? 44 * 2 : 44) + 24}px`,\n // this requires fixed size, also prevents jumping\n width: '90px',\n textAlign: 'center',\n whiteSpace: 'nowrap',\n // match size of IconButtons\n height: '44px',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n // proportions and style\n margin: '0',\n color: theme.palette.mode === 'dark' ? theme.palette.onSurface.os300 : theme.palette.onSurface.os700,\n strong: {\n color: theme.palette.text.primary,\n },\n '.divider': {\n fontWeight: '400',\n margin: '0 4px',\n },\n // responsive\n [theme.breakpoints.down('md')]: {\n // move to 2nd row (matches new padding from toolbar)\n bottom: '8px',\n // move to center\n right: '0',\n left: '0',\n margin: '0 auto',\n },\n }),\n // navigation arrows, < >\n actions: ({ theme }) => ({\n margin: '0',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'flex-end',\n // make sure to keep most of the space on the right\n flexGrow: '1',\n '& .MuiTablePagination-actions-next': {\n // extra space for displayedRows\n marginLeft: '90px',\n },\n // responsive\n [theme.breakpoints.down('md')]: {\n // move to new row\n flexBasis: '100%',\n // center content\n justifyContent: 'center',\n },\n }),\n },\n};\n"],"names":["flowTablePagination","defaultProps","showFirstButton","showLastButton","labelDisplayedRows","from","to","count","page","_jsxs","_Fragment","children","_jsx","Box","component","className","Math","ceil","slots","actions","previousButtonIcon","ArrowLeftIcon","nextButtonIcon","ArrowRightIcon","firstButtonIcon","ChevronPreviousIcon","lastButtonIcon","ChevronNextIcon","slotProps","previousButton","size","nextButton","firstButton","lastButton","styleOverrides","root","theme","border","palette","surface","secondary","borderRadius","toolbar","position","justifyContent","breakpoints","up","minHeight","padding","down","flexWrap","spacer","flexGrow","flexBasis","typography","body","textAlign","selectLabel","margin","input","getFocusRingStyle","fontWeight","displayedRows","ownerState","right","width","whiteSpace","height","display","alignItems","color","mode","onSurface","os300","os700","strong","text","primary","bottom","left","marginLeft"],"mappings":"0fAQO,MAAMA,EAA+D,CAC1EC,aAAc,CAEZC,iBAAiB,EACjBC,gBAAgB,EAKhBC,mBAAoB,EAAGC,OAAMC,KAAIC,QAAOC,UACtCC,EAAAC,EAAA,CAAAC,SAAA,CACEC,EAACC,EAAG,CAACC,UAAU,SAAQH,SAAEH,EAAO,IAChCI,EAACC,EAAG,CAACC,UAAU,OAAOC,UAAU,mBAAW,QAC3CH,EAACC,EAAG,CAACC,UAAU,OAAMH,SAAEK,KAAKC,KAAKV,GAASC,GAAQ,GAAKH,EAAO,GAAKG,EAAOF,EAAKD,EAAO,KAAO,OAIjGa,MAAO,CACLC,QAAS,CAEPC,mBAAoBC,EACpBC,eAAgBC,EAEhBC,gBAAiBC,EACjBC,eAAgBC,IAGpBC,UAAW,CACTT,QAAS,CACPU,eAAgB,CACdC,KAAM,SACNf,UAAW,uCAEbgB,WAAY,CACVD,KAAM,SACNf,UAAW,mCAEbiB,YAAa,CACXF,KAAM,UAERG,WAAY,CACVH,KAAM,aAKdI,eAAgB,CACdC,KAAM,EAAGC,YAAO,CAEdC,OAAQ,aAAaD,EAAME,QAAQC,QAAQC,YAC3CC,aAAc,MAEd,MAAO,CACLJ,OAAQ,OACRI,aAAc,OAIlBC,QAAS,EAAGN,YAAO,CACjBO,SAAU,WACVC,eAAgB,SAEhB,CAACR,EAAMS,YAAYC,GAAG,OAAQ,CAC5BC,UAAW,OAEXC,QAAS,YAGX,CAACZ,EAAMS,YAAYI,KAAK,OAAQ,CAE9BC,SAAU,OAEVH,UAAW,IACXC,QAAS,cAIbG,OAAQ,EAAGf,YAAO,CAEhBgB,SAAU,IACVC,UAAW,UAERjB,EAAMkB,WAAWC,KAEpB,CAACnB,EAAMS,YAAYI,KAAK,OAAQ,CAE9BI,UAAW,OACXG,UAAW,YAIfC,YAAa,CACXC,OAAQ,KAGVC,MAAO,EAAGvB,YAAO,CACfsB,OAAQ,IACRV,QAAS,IACTP,aAAc,SACXL,EAAMkB,WAAWC,QACjBK,EAAkBxB,GAAO,EAAO,MAAO,iBAC1C,CAACA,EAAMS,YAAYC,GAAG,OAAQ,CAC5Be,WAAY,OAEd,uBAAwB,CACtBb,QAAS,sBAIbc,cAAe,EAAG1B,QAAO2B,iBAAY,CAEnCpB,SAAU,WAEVqB,MAAsD,IAA3CD,EAAW5D,eAAiB,GAAS,IAAzC,KAEP8D,MAAO,OACPT,UAAW,SACXU,WAAY,SAEZC,OAAQ,OACRC,QAAS,OACTC,WAAY,SACZzB,eAAgB,SAEhBc,OAAQ,IACRY,MAA8B,SAAvBlC,EAAME,QAAQiC,KAAkBnC,EAAME,QAAQkC,UAAUC,MAAQrC,EAAME,QAAQkC,UAAUE,MAC/FC,OAAQ,CACNL,MAAOlC,EAAME,QAAQsC,KAAKC,SAE5B,WAAY,CACVhB,WAAY,MACZH,OAAQ,SAGV,CAACtB,EAAMS,YAAYI,KAAK,OAAQ,CAE9B6B,OAAQ,MAERd,MAAO,IACPe,KAAM,IACNrB,OAAQ,YAIZvC,QAAS,EAAGiB,YAAO,CACjBsB,OAAQ,IACRU,QAAS,OACTC,WAAY,SACZzB,eAAgB,WAEhBQ,SAAU,IACV,qCAAsC,~~CAEpC4B~~,WAAY,~~QAGd~~,~~CAAC5C~~,EAAMS,YAAYI,KAAK,OAAQ,CAE9BI,UAAW,OAEXT,eAAgB"}
1	+ {"version":3,"file":"tablePagination.theme.js","sources":["../../../src/materialui/table/tablePagination.theme.tsx"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme, Box } from '@mui/material';\nimport { ArrowLeftIcon } from '@/src/components/icon/stroke/ArrowLeftIcon';\nimport { ArrowRightIcon } from '@/src/components/icon/stroke/ArrowRightIcon';\nimport { ChevronPreviousIcon } from '@/src/components/icon/stroke/ChevronPreviousIcon';\nimport { ChevronNextIcon } from '@/src/components/icon/stroke/ChevronNextIcon';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\n\nexport const flowTablePagination: Components<Theme>['MuiTablePagination'] = {\n defaultProps: {\n // not recommended properties, <Pagination /> component should be utilized instead\n showFirstButton: false,\n showLastButton: false,\n // adjust label\n // we are obtaining max page from the available params\n // - first page, calculated from 'from' and 'to'\n // - other pages, calculated from 'from' - 1 and diving by current page\n labelDisplayedRows: ({ from, to, count, page }) => (\n <>\n <Box component=\"strong\">{page + 1}</Box>\n <Box component=\"span\" className=\"divider\">{` / `}</Box>\n <Box component=\"span\">{Math.ceil(count / (page >= 1 ? (from - 1) / page : to - from + 1)) \|\| 1}</Box>\n </>\n ),\n // correct icons\n slots: {\n actions: {\n // navigation arrows\n previousButtonIcon: ArrowLeftIcon,\n nextButtonIcon: ArrowRightIcon,\n // first & last extra arrow (hidden by default)\n firstButtonIcon: ChevronPreviousIcon,\n lastButtonIcon: ChevronNextIcon,\n },\n },\n slotProps: {\n actions: {\n previousButton: {\n size: 'medium',\n className: 'MuiTablePagination-actions-previous',\n },\n nextButton: {\n size: 'medium',\n className: 'MuiTablePagination-actions-next',\n },\n firstButton: {\n size: 'medium',\n },\n lastButton: {\n size: 'medium',\n },\n },\n },\n },\n styleOverrides: {\n root: ({ theme }) => ({\n // we are outside table\n border: `1px solid ${theme.palette.surface.secondary}`,\n borderRadius: '8px',\n // part of <TableFooter /> and <TableRow />\n '&td': {\n border: 'none',\n borderRadius: '0',\n },\n }),\n // wrapper under root\n toolbar: ({ theme }) => ({\n position: 'relative',\n justifyContent: 'center',\n // mimic style from tableCell.theme\n [theme.breakpoints.up('md')]: {\n minHeight: '80px',\n // right padding also affect position of displayedRows\n padding: '4px 24px',\n },\n // responsive\n [theme.breakpoints.down('md')]: {\n // support multiple rows\n flexWrap: 'wrap',\n // adjust proportions\n minHeight: '0',\n padding: '8px 16px',\n },\n }),\n // first element on left side\n spacer: ({ theme }) => ({\n // make sure to keep most of the space on the left\n flexGrow: '1',\n flexBasis: 'auto',\n // in case text is provided\n ...theme.typography.body,\n // tiny responsive\n [theme.breakpoints.down('sm')]: {\n // take whole row\n flexBasis: '100%',\n textAlign: 'center',\n },\n }),\n // 'row per page:' text\n selectLabel: {\n margin: '0',\n },\n // input field for amount of rows\n input: ({ theme }) => ({\n margin: '0',\n padding: '0',\n borderRadius: '4px',\n ...theme.typography.body,\n ...getFocusRingStyle(theme, false, '0px', '&.Mui-focused'),\n [theme.breakpoints.up('xs')]: {\n fontWeight: '700',\n },\n '&& .MuiSelect-select': {\n padding: '4px 26px 4px 4px',\n },\n }),\n // label of current page, 1/10\n displayedRows: ({ theme, ownerState }) => ({\n // move into actions\n position: 'absolute',\n // IconButton size + padding\n right: `${(ownerState.showLastButton ? 44 * 2 : 44) + 24}px`,\n // this requires fixed size, also prevents jumping\n width: '90px',\n textAlign: 'center',\n whiteSpace: 'nowrap',\n // match size of IconButtons\n height: '44px',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n // proportions and style\n margin: '0',\n color: theme.palette.mode === 'dark' ? theme.palette.onSurface.os300 : theme.palette.onSurface.os700,\n strong: {\n color: theme.palette.text.primary,\n },\n '.divider': {\n fontWeight: '400',\n margin: '0 4px',\n },\n // responsive\n [theme.breakpoints.down('md')]: {\n // move to 2nd row (matches new padding from toolbar)\n bottom: '8px',\n // move to center\n right: '0',\n left: '0',\n margin: '0 auto',\n },\n }),\n // navigation arrows, < >\n actions: ({ theme }) => ({\n margin: '0',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'flex-end',\n // make sure to keep most of the space on the right\n flexGrow: '1',\n '& .MuiTablePagination-actions-next': {\n // extra space for displayedRows\n ...(theme.direction === \"rtl\" ? { marginRight: \"90px\" } : { marginLeft: '90px' }),\n },\n // responsive\n [theme.breakpoints.down('md')]: {\n // move to new row\n flexBasis: '100%',\n // center content\n justifyContent: 'center',\n },\n }),\n },\n};\n"],"names":["flowTablePagination","defaultProps","showFirstButton","showLastButton","labelDisplayedRows","from","to","count","page","_jsxs","_Fragment","children","_jsx","Box","component","className","Math","ceil","slots","actions","previousButtonIcon","ArrowLeftIcon","nextButtonIcon","ArrowRightIcon","firstButtonIcon","ChevronPreviousIcon","lastButtonIcon","ChevronNextIcon","slotProps","previousButton","size","nextButton","firstButton","lastButton","styleOverrides","root","theme","border","palette","surface","secondary","borderRadius","toolbar","position","justifyContent","breakpoints","up","minHeight","padding","down","flexWrap","spacer","flexGrow","flexBasis","typography","body","textAlign","selectLabel","margin","input","getFocusRingStyle","fontWeight","displayedRows","ownerState","right","width","whiteSpace","height","display","alignItems","color","mode","onSurface","os300","os700","strong","text","primary","bottom","left","direction","marginRight","marginLeft"],"mappings":"0fAQO,MAAMA,EAA+D,CAC1EC,aAAc,CAEZC,iBAAiB,EACjBC,gBAAgB,EAKhBC,mBAAoB,EAAGC,OAAMC,KAAIC,QAAOC,UACtCC,EAAAC,EAAA,CAAAC,SAAA,CACEC,EAACC,EAAG,CAACC,UAAU,SAAQH,SAAEH,EAAO,IAChCI,EAACC,EAAG,CAACC,UAAU,OAAOC,UAAU,mBAAW,QAC3CH,EAACC,EAAG,CAACC,UAAU,OAAMH,SAAEK,KAAKC,KAAKV,GAASC,GAAQ,GAAKH,EAAO,GAAKG,EAAOF,EAAKD,EAAO,KAAO,OAIjGa,MAAO,CACLC,QAAS,CAEPC,mBAAoBC,EACpBC,eAAgBC,EAEhBC,gBAAiBC,EACjBC,eAAgBC,IAGpBC,UAAW,CACTT,QAAS,CACPU,eAAgB,CACdC,KAAM,SACNf,UAAW,uCAEbgB,WAAY,CACVD,KAAM,SACNf,UAAW,mCAEbiB,YAAa,CACXF,KAAM,UAERG,WAAY,CACVH,KAAM,aAKdI,eAAgB,CACdC,KAAM,EAAGC,YAAO,CAEdC,OAAQ,aAAaD,EAAME,QAAQC,QAAQC,YAC3CC,aAAc,MAEd,MAAO,CACLJ,OAAQ,OACRI,aAAc,OAIlBC,QAAS,EAAGN,YAAO,CACjBO,SAAU,WACVC,eAAgB,SAEhB,CAACR,EAAMS,YAAYC,GAAG,OAAQ,CAC5BC,UAAW,OAEXC,QAAS,YAGX,CAACZ,EAAMS,YAAYI,KAAK,OAAQ,CAE9BC,SAAU,OAEVH,UAAW,IACXC,QAAS,cAIbG,OAAQ,EAAGf,YAAO,CAEhBgB,SAAU,IACVC,UAAW,UAERjB,EAAMkB,WAAWC,KAEpB,CAACnB,EAAMS,YAAYI,KAAK,OAAQ,CAE9BI,UAAW,OACXG,UAAW,YAIfC,YAAa,CACXC,OAAQ,KAGVC,MAAO,EAAGvB,YAAO,CACfsB,OAAQ,IACRV,QAAS,IACTP,aAAc,SACXL,EAAMkB,WAAWC,QACjBK,EAAkBxB,GAAO,EAAO,MAAO,iBAC1C,CAACA,EAAMS,YAAYC,GAAG,OAAQ,CAC5Be,WAAY,OAEd,uBAAwB,CACtBb,QAAS,sBAIbc,cAAe,EAAG1B,QAAO2B,iBAAY,CAEnCpB,SAAU,WAEVqB,MAAsD,IAA3CD,EAAW5D,eAAiB,GAAS,IAAzC,KAEP8D,MAAO,OACPT,UAAW,SACXU,WAAY,SAEZC,OAAQ,OACRC,QAAS,OACTC,WAAY,SACZzB,eAAgB,SAEhBc,OAAQ,IACRY,MAA8B,SAAvBlC,EAAME,QAAQiC,KAAkBnC,EAAME,QAAQkC,UAAUC,MAAQrC,EAAME,QAAQkC,UAAUE,MAC/FC,OAAQ,CACNL,MAAOlC,EAAME,QAAQsC,KAAKC,SAE5B,WAAY,CACVhB,WAAY,MACZH,OAAQ,SAGV,CAACtB,EAAMS,YAAYI,KAAK,OAAQ,CAE9B6B,OAAQ,MAERd,MAAO,IACPe,KAAM,IACNrB,OAAQ,YAIZvC,QAAS,EAAGiB,YAAO,CACjBsB,OAAQ,IACRU,QAAS,OACTC,WAAY,SACZzB,eAAgB,WAEhBQ,SAAU,IACV,qCAAsC,IAEZ,QAApBhB,EAAM4C,UAAsB,CAAEC,YAAa,QAAW,CAAEC,WAAY,SAG1E,CAAC9C,EAAMS,YAAYI,KAAK,OAAQ,CAE9BI,UAAW,OAEXT,eAAgB"}

package/materialui/tabs/TabPanel.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import { ElementType } from 'react';
+import React, { ElementType } from 'react';
 import { BoxProps } from '@mui/material';
 export interface TabPanelProps extends BoxProps<ElementType> {
     /**
@@ -18,4 +18,4 @@ export interface TabPanelProps extends BoxProps<ElementType> {
 /**
  * Show or hide content based on the provided value and index
  */
-export declare function TabPanel({ children, sx, value, index, keepMounted, ...rest }: TabPanelProps): import("react/jsx-runtime").JSX.Element;
+export declare function TabPanel({ children, sx, value, index, keepMounted, ...rest }: TabPanelProps): React.JSX.Element;

package/materialui/tabs/TabsScrollButton.d.ts CHANGED Viewed

@@ -7,4 +7,4 @@ export declare const TabsScrollButton: ({ direction, slots, slotProps, ownerStat
     slots: any;
     slotProps: any;
     ownerState: any;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;

package/materialui/tabs/tabs.theme.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{TabsScrollButton as e}from"./TabsScrollButton.js";import{updateFocusRingStyle as t}from"../../components/focusring/focusring.js";import{getInteractiveStyle as r}from"../button/interactive.js";import{getTypography as o}from"../typography/typography.theme.js";const a={defaultProps:{template:"underlined",scrollButtons:"auto",allowScrollButtonsMobile:!0,visibleScrollbar:!1,variant:"scrollable",slots:{scrollButtons:e}},styleOverrides:{root:({theme:e,ownerState:t})=>({minHeight:"0",alignItems:"center",gap:"0",...t.fullWidth||"fullWidth"===t.variant?{"& .MuiTab-root":{flexGrow:"1"}}:{},...t.centered?{justifyContent:"center"}:{},'&:not(:has(.MuiTab-root[aria-selected="true"]))':{"& .MuiTabs-indicator":{opacity:"0"}},"& .MuiTabs-list, & .MuiTabs-flexContainer":{gap:"16px",[e.breakpoints.up("md")]:{gap:"28px"}}}),indicator:({theme:e,ownerState:t})=>({maxWidth:"none",background:"transparent",display:"block",height:"3px",color:"dark"===e.palette.mode?e.palette.brand.secondary:e.palette.brand.primary,..."secondary"===t.indicatorColor&&{color:e.palette.text.primary},"&:before":{display:"block",content:'""',position:"absolute",left:"8px",right:"8px",top:"0",bottom:"0",backgroundColor:"currentColor"}}),scroller:({ownerState:e})=>({flexGrow:e.fullWidth||"fullWidth"===e.variant?"1":"0","&::-webkit-scrollbar:horizontal":{height:"24px"},"&::-webkit-scrollbar-thumb:horizontal, &::-webkit-scrollbar-track:horizontal":{borderWidth:"10px"}}),scrollButtons:({theme:e})=>({color:e.palette.text.primary,"&.Mui-disabled":{opacity:"1",color:e.palette.disabled.primary}})},variants:[{props:{template:"underlined"},style:({theme:e})=>({marginLeft:"-6px",marginRight:"-6px",maxWidth:"none","& .MuiTabs-scroller":{"&::-webkit-scrollbar:horizontal":{height:"16px"},"&::-webkit-scrollbar-thumb:horizontal, &::-webkit-scrollbar-track:horizontal":{borderWidth:"6px"}},"& .MuiTabs-list, & .MuiTabs-flexContainer":{padding:"6px",gap:"0"},"& .MuiTabs-indicator":{bottom:"6px","&:before":{inset:"0"}},"& .MuiTab-root":{margin:"0",padding:"12px 24px",[e.breakpoints.down("md")]:{paddingTop:"10px",paddingBottom:"10px"},borderRadius:"0",color:"dark"===e.palette.mode?e.palette.onSurface.os300:e.palette.onSurface.os700,...e.typography.subheadline,[e.breakpoints.up("xs")]:{fontWeight:"300"},"&:after":{content:'""',position:"absolute",left:"0",right:"0",bottom:"0",height:"1px",backgroundColor:e.palette.onSurface.os500},"&:hover, &.Mui-focusVisible":{"&:after":{height:"2px"}},"&.Mui-selected":{color:"dark"===e.palette.mode?e.palette.brand.secondary:e.palette.brand.primary,backgroundColor:"dark"===e.palette.mode?e.palette.surface.primary:e.palette.transparent.primary},"&.Mui-disabled":{color:e.palette.disabled.tertiary},"&.Mui-focusVisible":{zIndex:"10",boxShadow:`0 0 0 2px ${e.palette.background.primary}`,"&:before":{inset:"-2px",borderRadius:"4px"}}}})},{props:{template:"buttons"},style:({theme:e})=>({"& .MuiTabs-list, & .MuiTabs-flexContainer":{gap:"8px"},"& .MuiTabs-indicator":{display:"none"},"& .MuiTab-root":{border:"1px solid transparent",padding:"6px 16px",borderRadius:"1000px",transition:"all 0.3s ease-out",fontSize:"14px",fontWeight:"700",marginBottom:"2px",...t("0px",!1),...r({backgroundColor:"transparent",color:e.palette.onSurface.os500},{backgroundColor:e.palette.surface.primary,color:e.palette.text.primary}),"&.Mui-selected":{...r({backgroundColor:e.palette.brand.quarternary,color:e.palette.text.primary,borderColor:e.palette.brand.primary},{backgroundColor:e.palette.brand.quarternary,color:e.palette.brand.primary,borderColor:e.palette.brand.primary})},[e.breakpoints.down("md")]:{"&, &.Mui-selected, & .FlowTab-selectedLabel":{fontWeight:"400"}}}})},{props:{template:"navigation"},style:({theme:e})=>({"& .MuiTabs-list, & .MuiTabs-flexContainer":{gap:"4px"},paddingTop:"11px",[e.breakpoints.down("xl")]:{paddingTop:"13px"},[e.breakpoints.down("lg")]:{paddingTop:"8px"},"& .MuiTab-root":{marginBottom:"11px",[e.breakpoints.down("xl")]:{marginBottom:"13px"},[e.breakpoints.down("lg")]:{marginBottom:"8px"},...e.typography.list}})},{props:{template:"segmented"},style:({theme:e})=>({color:"dark"===e.palette.mode?e.palette.surface.primary:e.palette.transparent.secondary,"& .MuiTabs-scroller":{backgroundColor:"currentColor",borderRadius:"1000px"},"& .MuiTabs-list, & .MuiTabs-flexContainer":{gap:"8px"},"& .MuiTabs-indicator":{color:"dark"===e.palette.mode?e.palette.surface.secondary:e.palette.common.white,height:"100%",zIndex:"10",borderRadius:"1000px",overflow:"hidden","&:before":{inset:"0",borderRadius:"inherit",border:`2px solid ${"dark"===e.palette.mode?e.palette.brand.secondary:e.palette.text.primary}`}},"& .MuiTab-root":{margin:"0",borderRadius:"1000px",transition:"all 0.3s ease-out",padding:"6px 16px",gap:"10px",zIndex:"20","& .MuiSvgIcon-root":{fontSize:"20px",marginTop:"4px",marginBottom:"4px"},color:e.palette.text.primary,...o("subheadline","rtl"===e.direction,"small"),[e.breakpoints.up("md")]:{...o("subheadline","rtl"===e.direction,"large"),padding:"8px 16px"},[e.breakpoints.up("xs")]:{"&, &.Mui-selected, & .FlowTab-selectedLabel":{fontWeight:"400"}},"&:hover, &.Mui-focusVisible":{backgroundColor:e.palette.surface.primary},"&.Mui-selected":{color:"dark"===e.palette.mode?e.palette.brand.secondary:e.palette.text.primary,"&:hover, &.Mui-focusVisible":{backgroundColor:"transparent"}},"&.Mui-disabled":{color:e.palette.disabled.tertiary}}})}]};export{a as flowTabs};
+import{TabsScrollButton as e}from"./TabsScrollButton.js";import{updateFocusRingStyle as t}from"../../components/focusring/focusring.js";import{getInteractiveStyle as r}from"../button/interactive.js";import{getTypography as o}from"../typography/typography.theme.js";const a={defaultProps:{template:"underlined",scrollButtons:"auto",allowScrollButtonsMobile:!0,visibleScrollbar:!1,variant:"scrollable",slots:{scrollButtons:e},slotProps:{scroller:e=>!1===e.visibleScrollbar&&{style:{marginBottom:"0"}}}},styleOverrides:{root:({theme:e,ownerState:t})=>({minHeight:"0",alignItems:"center",gap:"0",...t.fullWidth||"fullWidth"===t.variant?{"& .MuiTab-root":{flexGrow:"1"}}:{},...t.centered?{justifyContent:"center"}:{},'&:not(:has(.MuiTab-root[aria-selected="true"]))':{"& .MuiTabs-indicator":{opacity:"0"}},"& .MuiTabs-list, & .MuiTabs-flexContainer":{gap:"16px",[e.breakpoints.up("md")]:{gap:"28px"}}}),indicator:({theme:e,ownerState:t})=>({maxWidth:"none",background:"transparent",display:"block",height:"3px",color:"dark"===e.palette.mode?e.palette.brand.secondary:e.palette.brand.primary,..."secondary"===t.indicatorColor&&{color:e.palette.text.primary},"&:before":{display:"block",content:'""',position:"absolute",left:"8px",right:"8px",top:"0",bottom:"0",backgroundColor:"currentColor"}}),scroller:({ownerState:e})=>({flexGrow:e.fullWidth||"fullWidth"===e.variant?"1":"0","&::-webkit-scrollbar:horizontal":{height:"24px"},"&::-webkit-scrollbar-thumb:horizontal, &::-webkit-scrollbar-track:horizontal":{borderWidth:"10px"}}),scrollButtons:({theme:e})=>({color:e.palette.text.primary,"&.Mui-disabled":{opacity:"1",color:e.palette.disabled.primary}})},variants:[{props:{template:"underlined"},style:({theme:e})=>({marginLeft:"-6px",marginRight:"-6px",maxWidth:"none","& .MuiTabs-scroller":{"&::-webkit-scrollbar:horizontal":{height:"16px"},"&::-webkit-scrollbar-thumb:horizontal, &::-webkit-scrollbar-track:horizontal":{borderWidth:"6px"}},"& .MuiTabs-list, & .MuiTabs-flexContainer":{padding:"6px",gap:"0"},"& .MuiTabs-indicator":{bottom:"6px","&:before":{inset:"0"}},"& .MuiTab-root":{margin:"0",padding:"12px 24px",[e.breakpoints.down("md")]:{paddingTop:"10px",paddingBottom:"10px"},borderRadius:"0",color:"dark"===e.palette.mode?e.palette.onSurface.os300:e.palette.onSurface.os700,...e.typography.subheadline,[e.breakpoints.up("xs")]:{fontWeight:"300"},"&:after":{content:'""',position:"absolute",left:"0",right:"0",bottom:"0",height:"1px",backgroundColor:e.palette.onSurface.os500},"&:hover, &.Mui-focusVisible":{"&:after":{height:"2px"}},"&.Mui-selected":{color:"dark"===e.palette.mode?e.palette.brand.secondary:e.palette.brand.primary,backgroundColor:"dark"===e.palette.mode?e.palette.surface.primary:e.palette.transparent.primary},"&.Mui-disabled":{color:e.palette.disabled.tertiary},"&.Mui-focusVisible":{zIndex:"10",boxShadow:`0 0 0 2px ${e.palette.background.primary}`,"&:before":{inset:"-2px",borderRadius:"4px"}}}})},{props:{template:"buttons"},style:({theme:e})=>({"& .MuiTabs-list, & .MuiTabs-flexContainer":{gap:"8px"},"& .MuiTabs-indicator":{display:"none"},"& .MuiTab-root":{border:"1px solid transparent",padding:"6px 16px",borderRadius:"1000px",transition:"all 0.3s ease-out",fontSize:"14px",fontWeight:"700",marginBottom:"2px",...t("0px",!1),...r({backgroundColor:"transparent",color:e.palette.onSurface.os500},{backgroundColor:e.palette.surface.primary,color:e.palette.text.primary}),"&.Mui-selected":{...r({backgroundColor:e.palette.brand.quarternary,color:e.palette.text.primary,borderColor:e.palette.brand.primary},{backgroundColor:e.palette.brand.quarternary,color:e.palette.brand.primary,borderColor:e.palette.brand.primary})},[e.breakpoints.down("md")]:{"&, &.Mui-selected, & .FlowTab-selectedLabel":{fontWeight:"400"}}}})},{props:{template:"navigation"},style:({theme:e})=>({"& .MuiTabs-list, & .MuiTabs-flexContainer":{gap:"4px"},paddingTop:"11px",[e.breakpoints.down("xl")]:{paddingTop:"13px"},[e.breakpoints.down("lg")]:{paddingTop:"8px"},"& .MuiTab-root":{marginBottom:"11px",[e.breakpoints.down("xl")]:{marginBottom:"13px"},[e.breakpoints.down("lg")]:{marginBottom:"8px"},...e.typography.list}})},{props:{template:"segmented"},style:({theme:e})=>({color:"dark"===e.palette.mode?e.palette.surface.primary:e.palette.transparent.secondary,"& .MuiTabs-scroller":{backgroundColor:"currentColor",borderRadius:"1000px"},"& .MuiTabs-list, & .MuiTabs-flexContainer":{gap:"8px"},"& .MuiTabs-indicator":{color:"dark"===e.palette.mode?e.palette.surface.secondary:e.palette.common.white,height:"100%",zIndex:"10",borderRadius:"1000px",overflow:"hidden","&:before":{inset:"0",borderRadius:"inherit",border:`2px solid ${"dark"===e.palette.mode?e.palette.brand.secondary:e.palette.text.primary}`}},"& .MuiTab-root":{margin:"0",borderRadius:"1000px",transition:"all 0.3s ease-out",padding:"6px 16px",gap:"10px",zIndex:"20","& .MuiSvgIcon-root":{fontSize:"20px",marginTop:"4px",marginBottom:"4px"},color:e.palette.text.primary,...o("subheadline","rtl"===e.direction,"small"),[e.breakpoints.up("md")]:{...o("subheadline","rtl"===e.direction,"large"),padding:"8px 16px"},[e.breakpoints.up("xs")]:{"&, &.Mui-selected, & .FlowTab-selectedLabel":{fontWeight:"400"}},"&:hover, &.Mui-focusVisible":{backgroundColor:e.palette.surface.primary},"&.Mui-selected":{color:"dark"===e.palette.mode?e.palette.brand.secondary:e.palette.text.primary,"&:hover, &.Mui-focusVisible":{backgroundColor:"transparent"}},"&.Mui-disabled":{color:e.palette.disabled.tertiary}}})}]};export{a as flowTabs};
 //# sourceMappingURL=tabs.theme.js.map

package/materialui/tabs/tabs.theme.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tabs.theme.js","sources":["../../../src/materialui/tabs/tabs.theme.tsx"],"sourcesContent":["import { Components, Theme } from '@mui/material/styles';\nimport { TabsScrollButton } from './TabsScrollButton';\nimport { updateFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\nimport { getTypography } from '@/src/materialui/typography/typography.theme';\n\nexport const flowTabs: Components<Theme>['MuiTabs'] = {\n defaultProps: {\n template: 'underlined',\n // for the A11y reflow-4x-zoom-scroll show scrollButtons instead of scrollbar\n scrollButtons: 'auto',\n allowScrollButtonsMobile: true,\n visibleScrollbar: false,\n variant: 'scrollable',\n slots: {\n scrollButtons: TabsScrollButton,\n },\n },\n styleOverrides: {\n root: ({ theme, ownerState }) => ({\n minHeight: '0',\n alignItems: 'center',\n // space between tabs and scroll buttons (FlowScrollButton already contains 4px)\n gap: '0',\n ...(ownerState.fullWidth \|\| ownerState.variant === 'fullWidth'\n ? {\n '& .MuiTab-root': {\n flexGrow: '1',\n },\n }\n : {}),\n // @mui omits centered property with variant scrollable,\n // therefore code bellow has no effect. In docs, we recommend utilizing sx property.\n ...(ownerState.centered ? { justifyContent: 'center' } : {}),\n // check if we don't have any tab selected\n '&:not(:has(.MuiTab-root[aria-selected=\"true\"]))': {\n // hide indicator\n '& .MuiTabs-indicator': {\n opacity: '0',\n },\n },\n // container\n // note: once we stop supporting @mui v7, can be moved directly under list: {}\n '& .MuiTabs-list, & .MuiTabs-flexContainer': {\n gap: '16px',\n [theme.breakpoints.up('md')]: {\n gap: '28px',\n },\n },\n }),\n indicator: ({ theme, ownerState }) => ({\n maxWidth: 'none',\n background: 'transparent',\n display: 'block',\n height: '3px',\n color: theme.palette.mode === 'dark' ? theme.palette.brand.secondary : theme.palette.brand.primary,\n ...(ownerState.indicatorColor === 'secondary' && {\n color: theme.palette.text.primary,\n }),\n // actual indicator line\n '&:before': {\n display: 'block',\n content: '\"\"',\n position: 'absolute',\n left: '8px',\n right: '8px',\n top: '0',\n bottom: '0',\n backgroundColor: 'currentColor',\n },\n }),\n scroller: ({ ownerState }) => ({\n flexGrow: ownerState.fullWidth \|\| ownerState.variant === 'fullWidth' ? '1' : '0',\n // restyle horizontal scrollbar\n '&::-webkit-scrollbar:horizontal': {\n height: '24px',\n },\n '&::-webkit-scrollbar-thumb:horizontal, &::-webkit-scrollbar-track:horizontal': {\n borderWidth: '10px',\n },\n }),\n scrollButtons: ({ theme }) => ({\n color: theme.palette.text.primary,\n // do not hide disabled scroll buttons\n '&.Mui-disabled': {\n opacity: '1',\n color: theme.palette.disabled.primary,\n },\n }),\n },\n variants: [\n {\n props: { template: 'underlined' },\n style: ({ theme }) => ({\n // align with rest of the page, due to extra space\n marginLeft: '-6px',\n marginRight: '-6px',\n maxWidth: 'none',\n // scroll container\n '& .MuiTabs-scroller': {\n '&::-webkit-scrollbar:horizontal': {\n height: '16px',\n },\n '&::-webkit-scrollbar-thumb:horizontal, &::-webkit-scrollbar-track:horizontal': {\n borderWidth: '6px',\n },\n },\n // container\n '& .MuiTabs-list, & .MuiTabs-flexContainer': {\n // extra space for the focus indicator\n padding: '6px',\n // remove gap between tabs\n gap: '0',\n },\n // indicator line\n '& .MuiTabs-indicator': {\n // move directly into tab border\n bottom: '6px',\n '&:before': {\n // make full-width\n inset: '0',\n },\n },\n // Tabs itself\n '& .MuiTab-root': {\n // remove space around tab in favor of padding\n margin: '0',\n // increase spacing\n padding: '12px 24px',\n // responsive\n [theme.breakpoints.down('md')]: {\n paddingTop: '10px',\n paddingBottom: '10px',\n },\n // style adjust\n borderRadius: '0',\n color: theme.palette.mode === 'dark' ? theme.palette.onSurface.os300 : theme.palette.onSurface.os700,\n // font\n ...theme.typography.subheadline,\n [theme.breakpoints.up('xs')]: {\n fontWeight: '300',\n },\n // bottom border\n '&:after': {\n content: '\"\"',\n position: 'absolute',\n left: '0',\n right: '0',\n bottom: '0',\n height: '1px',\n backgroundColor: theme.palette.onSurface.os500,\n },\n // hover effect\n '&:hover, &.Mui-focusVisible': {\n // increase size of the border\n '&:after': {\n height: '2px',\n },\n },\n // active\n '&.Mui-selected': {\n color: theme.palette.mode === 'dark' ? theme.palette.brand.secondary : theme.palette.brand.primary,\n backgroundColor:\n theme.palette.mode === 'dark' ? theme.palette.surface.primary : theme.palette.transparent.primary,\n },\n // disabled\n '&.Mui-disabled': {\n color: theme.palette.disabled.tertiary,\n },\n // focused style\n '&.Mui-focusVisible': {\n // higher z-index than others\n zIndex: '10',\n // extra white border\n boxShadow: `0 0 0 2px ${theme.palette.background.primary}`,\n '&:before': {\n // move outside\n inset: '-2px',\n // add extra border radius\n borderRadius: '4px',\n },\n },\n },\n }),\n },\n {\n props: { template: 'buttons' },\n style: ({ theme }) => ({\n // container\n '& .MuiTabs-list, & .MuiTabs-flexContainer': {\n // reduce gap between tabs\n gap: '8px',\n },\n // hide bottom line\n '& .MuiTabs-indicator': {\n display: 'none',\n },\n // restyle tabs to buttons\n '& .MuiTab-root': {\n border: '1px solid transparent',\n padding: '6px 16px',\n borderRadius: '1000px',\n transition: 'all 0.3s ease-out',\n fontSize: '14px',\n fontWeight: '700',\n marginBottom: '2px',\n ...updateFocusRingStyle('0px', false),\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.onSurface.os500,\n },\n {\n backgroundColor: theme.palette.surface.primary,\n color: theme.palette.text.primary,\n },\n ),\n '&.Mui-selected': {\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.brand.quarternary,\n color: theme.palette.text.primary,\n borderColor: theme.palette.brand.primary,\n },\n {\n backgroundColor: theme.palette.brand.quarternary,\n color: theme.palette.brand.primary,\n borderColor: theme.palette.brand.primary,\n },\n ),\n },\n // responsive\n [theme.breakpoints.down('md')]: {\n '&, &.Mui-selected, & .FlowTab-selectedLabel': {\n fontWeight: '400',\n },\n },\n },\n }),\n },\n {\n // variant used in the SecondaryNavigation\n props: { template: 'navigation' },\n style: ({ theme }) => ({\n // container\n '& .MuiTabs-list, & .MuiTabs-flexContainer': {\n // reduce gap between tabs\n gap: '4px',\n },\n // manual align\n paddingTop: '11px',\n [theme.breakpoints.down('xl')]: {\n paddingTop: '13px',\n },\n [theme.breakpoints.down('lg')]: {\n paddingTop: '8px',\n },\n // restyle tabs typography\n '& .MuiTab-root': {\n marginBottom: '11px',\n [theme.breakpoints.down('xl')]: {\n marginBottom: '13px',\n },\n [theme.breakpoints.down('lg')]: {\n marginBottom: '8px',\n },\n ...theme.typography.list,\n },\n }),\n },\n {\n props: { template: 'segmented' },\n style: ({ theme }) => ({\n // used for background\n color: theme.palette.mode === 'dark' ? theme.palette.surface.primary : theme.palette.transparent.secondary,\n // container\n '& .MuiTabs-scroller': {\n backgroundColor: 'currentColor',\n borderRadius: '1000px',\n },\n '& .MuiTabs-list, & .MuiTabs-flexContainer': {\n // reduce gap between tabs\n gap: '8px',\n },\n // restyle indicator to white bordered travelling background\n '& .MuiTabs-indicator': {\n color: theme.palette.mode === 'dark' ? theme.palette.surface.secondary : theme.palette.common.white,\n // proportion\n height: '100%',\n // z-index bellow <Tab />\n zIndex: '10',\n borderRadius: '1000px',\n // make sure border from :before is not visible when no tab is selected\n overflow: 'hidden',\n '&:before': {\n inset: '0',\n borderRadius: 'inherit',\n border: `2px solid ${theme.palette.mode === 'dark' ? theme.palette.brand.secondary : theme.palette.text.primary}`,\n },\n },\n // restyle tabs\n '& .MuiTab-root': {\n margin: '0',\n borderRadius: '1000px',\n transition: 'all 0.3s ease-out',\n // proportions\n padding: '6px 16px',\n // space between icon and text\n gap: '10px',\n // z-index above indicator\n zIndex: '20',\n // icon inside\n '& .MuiSvgIcon-root': {\n fontSize: '20px',\n marginTop: '4px',\n marginBottom: '4px',\n },\n // change typography\n color: theme.palette.text.primary,\n ...getTypography('subheadline', theme.direction === 'rtl', 'small'),\n [theme.breakpoints.up('md')]: {\n ...getTypography('subheadline', theme.direction === 'rtl', 'large'),\n // update proportions\n padding: '8px 16px',\n },\n [theme.breakpoints.up('xs')]: {\n '&, &.Mui-selected, & .FlowTab-selectedLabel': {\n fontWeight: '400',\n },\n },\n // hover and focus\n '&:hover, &.Mui-focusVisible': {\n backgroundColor: theme.palette.surface.primary,\n },\n // active\n '&.Mui-selected': {\n color: theme.palette.mode === 'dark' ? theme.palette.brand.secondary : theme.palette.text.primary,\n '&:hover, &.Mui-focusVisible': {\n backgroundColor: 'transparent',\n },\n },\n // disabled\n '&.Mui-disabled': {\n color: theme.palette.disabled.tertiary,\n },\n },\n }),\n },\n ],\n};\n"],"names":["flowTabs","defaultProps","template","scrollButtons","allowScrollButtonsMobile","visibleScrollbar","variant","slots","TabsScrollButton","styleOverrides","root","theme","ownerState","minHeight","alignItems","gap","fullWidth","flexGrow","centered","justifyContent","opacity","breakpoints","up","indicator","maxWidth","background","display","height","color","palette","mode","brand","secondary","primary","indicatorColor","text","content","position","left","right","top","bottom","backgroundColor","scroller","borderWidth","disabled","variants","props","style","marginLeft","marginRight","padding","inset","margin","down","paddingTop","paddingBottom","borderRadius","onSurface","os300","os700","typography","subheadline","fontWeight","os500","surface","transparent","tertiary","zIndex","boxShadow","border","transition","fontSize","marginBottom","updateFocusRingStyle","getInteractiveStyle","quarternary","borderColor","list","common","white","overflow","marginTop","getTypography","direction"],"mappings":"yQAMO,MAAMA,EAAyC,CACpDC,aAAc,CACZC,SAAU,aAEVC,cAAe,OACfC,0BAA0B,EAC1BC,kBAAkB,EAClBC,QAAS,aACTC,MAAO,CACLJ,cAAeK,IAGnBC,eAAgB,CACdC,KAAM,EAAGC,QAAOC,iBAAY,CAC1BC,UAAW,IACXC,WAAY,SAEZC,IAAK,OACDH,EAAWI,WAAoC,cAAvBJ,EAAWN,QACnC,CACE,iBAAkB,CAChBW,SAAU,MAGd,MAGAL,EAAWM,SAAW,CAAEC,eAAgB,UAAa,CAAA,EAEzD,kDAAmD,CAEjD,uBAAwB,CACtBC,QAAS,MAKb,4CAA6C,CAC3CL,IAAK,OACL,CAACJ,EAAMU,YAAYC,GAAG,OAAQ,CAC5BP,IAAK,WAIXQ,UAAW,EAAGZ,QAAOC,iBAAY,CAC/BY,SAAU,OACVC,WAAY,cACZC,QAAS,QACTC,OAAQ,MACRC,MAA8B,SAAvBjB,EAAMkB,QAAQC,KAAkBnB,EAAMkB,QAAQE,MAAMC,UAAYrB,EAAMkB,QAAQE,MAAME,WACzD,cAA9BrB,EAAWsB,gBAAkC,CAC/CN,MAAOjB,EAAMkB,QAAQM,KAAKF,SAG5B,WAAY,CACVP,QAAS,QACTU,QAAS,KACTC,SAAU,WACVC,KAAM,MACNC,MAAO,MACPC,IAAK,IACLC,OAAQ,IACRC,gBAAiB,kBAGrBC,SAAU,EAAG/B,iBAAY,CACvBK,SAAUL,EAAWI,WAAoC,cAAvBJ,EAAWN,QAA0B,IAAM,IAE7E,kCAAmC,CACjCqB,OAAQ,QAEV,+EAAgF,CAC9EiB,YAAa,UAGjBzC,cAAe,EAAGQ,YAAO,CACvBiB,MAAOjB,EAAMkB,QAAQM,KAAKF,QAE1B,iBAAkB,CAChBb,QAAS,IACTQ,MAAOjB,EAAMkB,QAAQgB,SAASZ,YAIpCa,SAAU,CACR,CACEC,MAAO,CAAE7C,SAAU,cACnB8C,MAAO,EAAGrC,YAAO,CAEfsC,WAAY,OACZC,YAAa,OACb1B,SAAU,OAEV,sBAAuB,CACrB,kCAAmC,CACjCG,OAAQ,QAEV,+EAAgF,CAC9EiB,YAAa,QAIjB,4CAA6C,CAE3CO,QAAS,MAETpC,IAAK,KAGP,uBAAwB,CAEtB0B,OAAQ,MACR,WAAY,CAEVW,MAAO,MAIX,iBAAkB,CAEhBC,OAAQ,IAERF,QAAS,YAET,CAACxC,EAAMU,YAAYiC,KAAK,OAAQ,CAC9BC,WAAY,OACZC,cAAe,QAGjBC,aAAc,IACd7B,MAA8B,SAAvBjB,EAAMkB,QAAQC,KAAkBnB,EAAMkB,QAAQ6B,UAAUC,MAAQhD,EAAMkB,QAAQ6B,UAAUE,SAE5FjD,EAAMkD,WAAWC,YACpB,CAACnD,EAAMU,YAAYC,GAAG,OAAQ,CAC5ByC,WAAY,OAGd,UAAW,CACT3B,QAAS,KACTC,SAAU,WACVC,KAAM,IACNC,MAAO,IACPE,OAAQ,IACRd,OAAQ,MACRe,gBAAiB/B,EAAMkB,QAAQ6B,UAAUM,OAG3C,8BAA+B,CAE7B,UAAW,CACTrC,OAAQ,QAIZ,iBAAkB,CAChBC,MAA8B,SAAvBjB,EAAMkB,QAAQC,KAAkBnB,EAAMkB,QAAQE,MAAMC,UAAYrB,EAAMkB,QAAQE,MAAME,QAC3FS,gBACyB,SAAvB/B,EAAMkB,QAAQC,KAAkBnB,EAAMkB,QAAQoC,QAAQhC,QAAUtB,EAAMkB,QAAQqC,YAAYjC,SAG9F,iBAAkB,CAChBL,MAAOjB,EAAMkB,QAAQgB,SAASsB,UAGhC,qBAAsB,CAEpBC,OAAQ,KAERC,UAAW,aAAa1D,EAAMkB,QAAQJ,WAAWQ,UACjD,WAAY,CAEVmB,MAAO,OAEPK,aAAc,YAMxB,CACEV,MAAO,CAAE7C,SAAU,WACnB8C,MAAO,EAAGrC,YAAO,CAEf,4CAA6C,CAE3CI,IAAK,OAGP,uBAAwB,CACtBW,QAAS,QAGX,iBAAkB,CAChB4C,OAAQ,wBACRnB,QAAS,WACTM,aAAc,SACdc,WAAY,oBACZC,SAAU,OACVT,WAAY,MACZU,aAAc,SACXC,EAAqB,OAAO,MAC5BC,EACD,CACEjC,gBAAiB,cACjBd,MAAOjB,EAAMkB,QAAQ6B,UAAUM,OAEjC,CACEtB,gBAAiB/B,EAAMkB,QAAQoC,QAAQhC,QACvCL,MAAOjB,EAAMkB,QAAQM,KAAKF,UAG9B,iBAAkB,IACb0C,EACD,CACEjC,gBAAiB/B,EAAMkB,QAAQE,MAAM6C,YACrChD,MAAOjB,EAAMkB,QAAQM,KAAKF,QAC1B4C,YAAalE,EAAMkB,QAAQE,MAAME,SAEnC,CACES,gBAAiB/B,EAAMkB,QAAQE,MAAM6C,YACrChD,MAAOjB,EAAMkB,QAAQE,MAAME,QAC3B4C,YAAalE,EAAMkB,QAAQE,MAAME,WAKvC,CAACtB,EAAMU,YAAYiC,KAAK,OAAQ,CAC9B,8CAA+C,CAC7CS,WAAY,YAMtB,CAEEhB,MAAO,CAAE7C,SAAU,cACnB8C,MAAO,EAAGrC,YAAO,CAEf,4CAA6C,CAE3CI,IAAK,OAGPwC,WAAY,OACZ,CAAC5C,EAAMU,YAAYiC,KAAK,OAAQ,CAC9BC,WAAY,QAEd,CAAC5C,EAAMU,YAAYiC,KAAK,OAAQ,CAC9BC,WAAY,OAGd,iBAAkB,CAChBkB,aAAc,OACd,CAAC9D,EAAMU,YAAYiC,KAAK,OAAQ,CAC9BmB,aAAc,QAEhB,CAAC9D,EAAMU,YAAYiC,KAAK,OAAQ,CAC9BmB,aAAc,UAEb9D,EAAMkD,WAAWiB,SAI1B,CACE/B,MAAO,CAAE7C,SAAU,aACnB8C,MAAO,EAAGrC,YAAO,CAEfiB,MAA8B,SAAvBjB,EAAMkB,QAAQC,KAAkBnB,EAAMkB,QAAQoC,QAAQhC,QAAUtB,EAAMkB,QAAQqC,YAAYlC,UAEjG,sBAAuB,CACrBU,gBAAiB,eACjBe,aAAc,UAEhB,4CAA6C,CAE3C1C,IAAK,OAGP,uBAAwB,CACtBa,MAA8B,SAAvBjB,EAAMkB,QAAQC,KAAkBnB,EAAMkB,QAAQoC,QAAQjC,UAAYrB,EAAMkB,QAAQkD,OAAOC,MAE9FrD,OAAQ,OAERyC,OAAQ,KACRX,aAAc,SAEdwB,SAAU,SACV,WAAY,CACV7B,MAAO,IACPK,aAAc,UACda,OAAQ,aAAoC,SAAvB3D,EAAMkB,QAAQC,KAAkBnB,EAAMkB,QAAQE,MAAMC,UAAYrB,EAAMkB,QAAQM,KAAKF,YAI5G,iBAAkB,CAChBoB,OAAQ,IACRI,aAAc,SACdc,WAAY,oBAEZpB,QAAS,WAETpC,IAAK,OAELqD,OAAQ,KAER,qBAAsB,CACpBI,SAAU,OACVU,UAAW,MACXT,aAAc,OAGhB7C,MAAOjB,EAAMkB,QAAQM,KAAKF,WACvBkD,EAAc,cAAmC,QAApBxE,EAAMyE,UAAqB,SAC3D,CAACzE,EAAMU,YAAYC,GAAG,OAAQ,IACzB6D,EAAc,cAAmC,QAApBxE,EAAMyE,UAAqB,SAE3DjC,QAAS,YAEX,CAACxC,EAAMU,YAAYC,GAAG,OAAQ,CAC5B,8CAA+C,CAC7CyC,WAAY,QAIhB,8BAA+B,CAC7BrB,gBAAiB/B,EAAMkB,QAAQoC,QAAQhC,SAGzC,iBAAkB,CAChBL,MAA8B,SAAvBjB,EAAMkB,QAAQC,KAAkBnB,EAAMkB,QAAQE,MAAMC,UAAYrB,EAAMkB,QAAQM,KAAKF,QAC1F,8BAA+B,CAC7BS,gBAAiB,gBAIrB,iBAAkB,CAChBd,MAAOjB,EAAMkB,QAAQgB,SAASsB"}
1	+ {"version":3,"file":"tabs.theme.js","sources":["../../../src/materialui/tabs/tabs.theme.tsx"],"sourcesContent":["import { Components, Theme } from '@mui/material/styles';\nimport { TabsScrollButton } from './TabsScrollButton';\nimport { updateFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\nimport { getTypography } from '@/src/materialui/typography/typography.theme';\n\nexport const flowTabs: Components<Theme>['MuiTabs'] = {\n defaultProps: {\n template: 'underlined',\n // for the A11y reflow-4x-zoom-scroll show scrollButtons instead of scrollbar\n scrollButtons: 'auto',\n allowScrollButtonsMobile: true,\n visibleScrollbar: false,\n variant: 'scrollable',\n slots: {\n scrollButtons: TabsScrollButton,\n },\n slotProps: {\n // removes @mui marginBottom outdated method to hide scrollbar, which might cause overflow issues\n // https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Tabs/Tabs.js#L515\n scroller: (ownerState) =>\n ownerState.visibleScrollbar === false && {\n style: { marginBottom: '0' },\n },\n },\n },\n styleOverrides: {\n root: ({ theme, ownerState }) => ({\n minHeight: '0',\n alignItems: 'center',\n // space between tabs and scroll buttons (FlowScrollButton already contains 4px)\n gap: '0',\n ...(ownerState.fullWidth \|\| ownerState.variant === 'fullWidth'\n ? {\n '& .MuiTab-root': {\n flexGrow: '1',\n },\n }\n : {}),\n // @mui omits centered property with variant scrollable,\n // therefore code bellow has no effect. In docs, we recommend utilizing sx property.\n ...(ownerState.centered ? { justifyContent: 'center' } : {}),\n // check if we don't have any tab selected\n '&:not(:has(.MuiTab-root[aria-selected=\"true\"]))': {\n // hide indicator\n '& .MuiTabs-indicator': {\n opacity: '0',\n },\n },\n // container\n // note: once we stop supporting @mui v7, can be moved directly under list: {}\n '& .MuiTabs-list, & .MuiTabs-flexContainer': {\n gap: '16px',\n [theme.breakpoints.up('md')]: {\n gap: '28px',\n },\n },\n }),\n indicator: ({ theme, ownerState }) => ({\n maxWidth: 'none',\n background: 'transparent',\n display: 'block',\n height: '3px',\n color: theme.palette.mode === 'dark' ? theme.palette.brand.secondary : theme.palette.brand.primary,\n ...(ownerState.indicatorColor === 'secondary' && {\n color: theme.palette.text.primary,\n }),\n // actual indicator line\n '&:before': {\n display: 'block',\n content: '\"\"',\n position: 'absolute',\n left: '8px',\n right: '8px',\n top: '0',\n bottom: '0',\n backgroundColor: 'currentColor',\n },\n }),\n scroller: ({ ownerState }) => ({\n flexGrow: ownerState.fullWidth \|\| ownerState.variant === 'fullWidth' ? '1' : '0',\n // restyle horizontal scrollbar\n '&::-webkit-scrollbar:horizontal': {\n height: '24px',\n },\n '&::-webkit-scrollbar-thumb:horizontal, &::-webkit-scrollbar-track:horizontal': {\n borderWidth: '10px',\n },\n }),\n scrollButtons: ({ theme }) => ({\n color: theme.palette.text.primary,\n // do not hide disabled scroll buttons\n '&.Mui-disabled': {\n opacity: '1',\n color: theme.palette.disabled.primary,\n },\n }),\n },\n variants: [\n {\n props: { template: 'underlined' },\n style: ({ theme }) => ({\n // align with rest of the page, due to extra space\n marginLeft: '-6px',\n marginRight: '-6px',\n maxWidth: 'none',\n // scroll container\n '& .MuiTabs-scroller': {\n '&::-webkit-scrollbar:horizontal': {\n height: '16px',\n },\n '&::-webkit-scrollbar-thumb:horizontal, &::-webkit-scrollbar-track:horizontal': {\n borderWidth: '6px',\n },\n },\n // container\n '& .MuiTabs-list, & .MuiTabs-flexContainer': {\n // extra space for the focus indicator\n padding: '6px',\n // remove gap between tabs\n gap: '0',\n },\n // indicator line\n '& .MuiTabs-indicator': {\n // move directly into tab border\n bottom: '6px',\n '&:before': {\n // make full-width\n inset: '0',\n },\n },\n // Tabs itself\n '& .MuiTab-root': {\n // remove space around tab in favor of padding\n margin: '0',\n // increase spacing\n padding: '12px 24px',\n // responsive\n [theme.breakpoints.down('md')]: {\n paddingTop: '10px',\n paddingBottom: '10px',\n },\n // style adjust\n borderRadius: '0',\n color: theme.palette.mode === 'dark' ? theme.palette.onSurface.os300 : theme.palette.onSurface.os700,\n // font\n ...theme.typography.subheadline,\n [theme.breakpoints.up('xs')]: {\n fontWeight: '300',\n },\n // bottom border\n '&:after': {\n content: '\"\"',\n position: 'absolute',\n left: '0',\n right: '0',\n bottom: '0',\n height: '1px',\n backgroundColor: theme.palette.onSurface.os500,\n },\n // hover effect\n '&:hover, &.Mui-focusVisible': {\n // increase size of the border\n '&:after': {\n height: '2px',\n },\n },\n // active\n '&.Mui-selected': {\n color: theme.palette.mode === 'dark' ? theme.palette.brand.secondary : theme.palette.brand.primary,\n backgroundColor:\n theme.palette.mode === 'dark' ? theme.palette.surface.primary : theme.palette.transparent.primary,\n },\n // disabled\n '&.Mui-disabled': {\n color: theme.palette.disabled.tertiary,\n },\n // focused style\n '&.Mui-focusVisible': {\n // higher z-index than others\n zIndex: '10',\n // extra white border\n boxShadow: `0 0 0 2px ${theme.palette.background.primary}`,\n '&:before': {\n // move outside\n inset: '-2px',\n // add extra border radius\n borderRadius: '4px',\n },\n },\n },\n }),\n },\n {\n props: { template: 'buttons' },\n style: ({ theme }) => ({\n // container\n '& .MuiTabs-list, & .MuiTabs-flexContainer': {\n // reduce gap between tabs\n gap: '8px',\n },\n // hide bottom line\n '& .MuiTabs-indicator': {\n display: 'none',\n },\n // restyle tabs to buttons\n '& .MuiTab-root': {\n border: '1px solid transparent',\n padding: '6px 16px',\n borderRadius: '1000px',\n transition: 'all 0.3s ease-out',\n fontSize: '14px',\n fontWeight: '700',\n marginBottom: '2px',\n ...updateFocusRingStyle('0px', false),\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.onSurface.os500,\n },\n {\n backgroundColor: theme.palette.surface.primary,\n color: theme.palette.text.primary,\n },\n ),\n '&.Mui-selected': {\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.brand.quarternary,\n color: theme.palette.text.primary,\n borderColor: theme.palette.brand.primary,\n },\n {\n backgroundColor: theme.palette.brand.quarternary,\n color: theme.palette.brand.primary,\n borderColor: theme.palette.brand.primary,\n },\n ),\n },\n // responsive\n [theme.breakpoints.down('md')]: {\n '&, &.Mui-selected, & .FlowTab-selectedLabel': {\n fontWeight: '400',\n },\n },\n },\n }),\n },\n {\n // variant used in the SecondaryNavigation\n props: { template: 'navigation' },\n style: ({ theme }) => ({\n // container\n '& .MuiTabs-list, & .MuiTabs-flexContainer': {\n // reduce gap between tabs\n gap: '4px',\n },\n // manual align\n paddingTop: '11px',\n [theme.breakpoints.down('xl')]: {\n paddingTop: '13px',\n },\n [theme.breakpoints.down('lg')]: {\n paddingTop: '8px',\n },\n // restyle tabs typography\n '& .MuiTab-root': {\n marginBottom: '11px',\n [theme.breakpoints.down('xl')]: {\n marginBottom: '13px',\n },\n [theme.breakpoints.down('lg')]: {\n marginBottom: '8px',\n },\n ...theme.typography.list,\n },\n }),\n },\n {\n props: { template: 'segmented' },\n style: ({ theme }) => ({\n // used for background\n color: theme.palette.mode === 'dark' ? theme.palette.surface.primary : theme.palette.transparent.secondary,\n // container\n '& .MuiTabs-scroller': {\n backgroundColor: 'currentColor',\n borderRadius: '1000px',\n },\n '& .MuiTabs-list, & .MuiTabs-flexContainer': {\n // reduce gap between tabs\n gap: '8px',\n },\n // restyle indicator to white bordered travelling background\n '& .MuiTabs-indicator': {\n color: theme.palette.mode === 'dark' ? theme.palette.surface.secondary : theme.palette.common.white,\n // proportion\n height: '100%',\n // z-index bellow <Tab />\n zIndex: '10',\n borderRadius: '1000px',\n // make sure border from :before is not visible when no tab is selected\n overflow: 'hidden',\n '&:before': {\n inset: '0',\n borderRadius: 'inherit',\n border: `2px solid ${theme.palette.mode === 'dark' ? theme.palette.brand.secondary : theme.palette.text.primary}`,\n },\n },\n // restyle tabs\n '& .MuiTab-root': {\n margin: '0',\n borderRadius: '1000px',\n transition: 'all 0.3s ease-out',\n // proportions\n padding: '6px 16px',\n // space between icon and text\n gap: '10px',\n // z-index above indicator\n zIndex: '20',\n // icon inside\n '& .MuiSvgIcon-root': {\n fontSize: '20px',\n marginTop: '4px',\n marginBottom: '4px',\n },\n // change typography\n color: theme.palette.text.primary,\n ...getTypography('subheadline', theme.direction === 'rtl', 'small'),\n [theme.breakpoints.up('md')]: {\n ...getTypography('subheadline', theme.direction === 'rtl', 'large'),\n // update proportions\n padding: '8px 16px',\n },\n [theme.breakpoints.up('xs')]: {\n '&, &.Mui-selected, & .FlowTab-selectedLabel': {\n fontWeight: '400',\n },\n },\n // hover and focus\n '&:hover, &.Mui-focusVisible': {\n backgroundColor: theme.palette.surface.primary,\n },\n // active\n '&.Mui-selected': {\n color: theme.palette.mode === 'dark' ? theme.palette.brand.secondary : theme.palette.text.primary,\n '&:hover, &.Mui-focusVisible': {\n backgroundColor: 'transparent',\n },\n },\n // disabled\n '&.Mui-disabled': {\n color: theme.palette.disabled.tertiary,\n },\n },\n }),\n },\n ],\n};\n"],"names":["flowTabs","defaultProps","template","scrollButtons","allowScrollButtonsMobile","visibleScrollbar","variant","slots","TabsScrollButton","slotProps","scroller","ownerState","style","marginBottom","styleOverrides","root","theme","minHeight","alignItems","gap","fullWidth","flexGrow","centered","justifyContent","opacity","breakpoints","up","indicator","maxWidth","background","display","height","color","palette","mode","brand","secondary","primary","indicatorColor","text","content","position","left","right","top","bottom","backgroundColor","borderWidth","disabled","variants","props","marginLeft","marginRight","padding","inset","margin","down","paddingTop","paddingBottom","borderRadius","onSurface","os300","os700","typography","subheadline","fontWeight","os500","surface","transparent","tertiary","zIndex","boxShadow","border","transition","fontSize","updateFocusRingStyle","getInteractiveStyle","quarternary","borderColor","list","common","white","overflow","marginTop","getTypography","direction"],"mappings":"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"}

package/materialui/textfield/inputBase.theme.js CHANGED Viewed

@@ -1,2 +1,2 @@
-const e={defaultProps:{},styleOverrides:{root:({theme:e})=>({color:"inherit",caretColor:e.palette.brand.primary,[e.breakpoints.up("xs")]:{fontSize:"16px",lineHeight:"24px",fontWeight:"400"},"&.Mui-focused":{color:e.palette.text.primary},"&&":{"&:before":{borderColor:"currentColor"},"&:after":{borderColor:"currentColor"}}}),input:({theme:e})=>({height:"auto","&[type=password]":{fontFamily:"Arial"},"&::-webkit-input-placeholder":{opacity:"1",color:"dark"===e.palette.mode?e.palette.onSurface.os200:e.palette.onSurface.os600},"&.Mui-disabled":{WebkitTextFillColor:"unset","&::-webkit-input-placeholder":{color:"inherit"}}})}};export{e as flowInputBase};
+const e={defaultProps:{},styleOverrides:{root:({theme:e})=>({color:"inherit",caretColor:"dark"===e.palette.mode?e.palette.brand.secondary:e.palette.brand.primary,[e.breakpoints.up("xs")]:{fontSize:"16px",lineHeight:"24px",fontWeight:"400"},"&.Mui-focused":{color:e.palette.text.primary},"&&":{"&:before":{borderColor:"currentColor"},"&:after":{borderColor:"currentColor"}}}),input:({theme:e})=>({height:"auto","&[type=password]":{fontFamily:"Arial"},"&::-webkit-input-placeholder":{opacity:"1",color:"dark"===e.palette.mode?e.palette.onSurface.os200:e.palette.onSurface.os600},"&.Mui-disabled":{WebkitTextFillColor:"unset","&::-webkit-input-placeholder":{color:"inherit"}}})}};export{e as flowInputBase};
 //# sourceMappingURL=inputBase.theme.js.map

package/materialui/textfield/inputBase.theme.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"inputBase.theme.js","sources":["../../../src/materialui/textfield/inputBase.theme.tsx"],"sourcesContent":["import { Components, Theme } from '@mui/material/styles';\n\nexport const flowInputBase: Components<Theme>['MuiInputBase'] = {\n defaultProps: {},\n styleOverrides: {\n root: ({ theme }) => ({\n color: 'inherit',\n caretColor: theme.palette.brand.primary,\n [theme.breakpoints.up('xs')]: {\n fontSize: '16px',\n lineHeight: '24px',\n fontWeight: '400',\n },\n '&.Mui-focused': {\n color: theme.palette.text.primary,\n },\n '&&': {\n '&:before': {\n borderColor: 'currentColor',\n },\n '&:after': {\n borderColor: 'currentColor',\n },\n },\n }),\n input: ({ theme }) => ({\n height: 'auto',\n // change font for password field, SkodaNext font uses '>>>' instead '***' symbol for the password\n '&[type=password]': {\n fontFamily: 'Arial',\n },\n // placeholder\n '&::-webkit-input-placeholder': {\n opacity: '1',\n color: theme.palette.mode === 'dark' ? theme.palette.onSurface.os200 : theme.palette.onSurface.os600,\n },\n '&.Mui-disabled': {\n // remove default @mui style and use currentColor instead\n WebkitTextFillColor: 'unset',\n // placeholder\n '&::-webkit-input-placeholder': {\n color: 'inherit',\n },\n },\n }),\n },\n};\n"],"names":["flowInputBase","defaultProps","styleOverrides","root","theme","color","caretColor","palette","brand","primary","breakpoints","up","fontSize","lineHeight","fontWeight","text","borderColor","input","height","fontFamily","opacity","~~mode","~~onSurface","os200","os600","WebkitTextFillColor"],"mappings":"AAEO,MAAMA,EAAmD,CAC9DC,aAAc,CAAA,EACdC,eAAgB,CACdC,KAAM,EAAGC,YAAO,CACdC,MAAO,UACPC,~~WAAYF~~,EAAMG,QAAQC,MAAMC,~~QAChC~~,~~CAACL~~,~~EAAMM~~,YAAYC,GAAG,OAAQ,CAC5BC,SAAU,OACVC,WAAY,OACZC,WAAY,OAEd,gBAAiB,~~CACfT~~,MAAOD,EAAMG,~~QAAQQ~~,KAAKN,SAE5B,KAAM,CACJ,WAAY,CACVO,YAAa,gBAEf,UAAW,CACTA,YAAa,mBAInBC,MAAO,~~EAAGb~~,YAAO,~~CACfc~~,OAAQ,OAER,mBAAoB,CAClBC,WAAY,SAGd,+BAAgC,CAC9BC,QAAS,~~IACTf~~,MAA8B,SAAvBD,EAAMG,~~QAAQc~~,~~KAAkBjB~~,EAAMG,~~QAAQe~~,UAAUC,~~MAAQnB~~,EAAMG,~~QAAQe~~,UAAUE,OAEjG,iBAAkB,CAEhBC,oBAAqB,QAErB,+BAAgC,~~CAC9BpB~~,MAAO"}
1	+ {"version":3,"file":"inputBase.theme.js","sources":["../../../src/materialui/textfield/inputBase.theme.tsx"],"sourcesContent":["import { Components, Theme } from '@mui/material/styles';\n\nexport const flowInputBase: Components<Theme>['MuiInputBase'] = {\n defaultProps: {},\n styleOverrides: {\n root: ({ theme }) => ({\n color: 'inherit',\n caretColor: theme.palette.mode === 'dark' ? theme.palette.brand.secondary : theme.palette.brand.primary,\n [theme.breakpoints.up('xs')]: {\n fontSize: '16px',\n lineHeight: '24px',\n fontWeight: '400',\n },\n '&.Mui-focused': {\n color: theme.palette.text.primary,\n },\n '&&': {\n '&:before': {\n borderColor: 'currentColor',\n },\n '&:after': {\n borderColor: 'currentColor',\n },\n },\n }),\n input: ({ theme }) => ({\n height: 'auto',\n // change font for password field, SkodaNext font uses '>>>' instead '***' symbol for the password\n '&[type=password]': {\n fontFamily: 'Arial',\n },\n // placeholder\n '&::-webkit-input-placeholder': {\n opacity: '1',\n color: theme.palette.mode === 'dark' ? theme.palette.onSurface.os200 : theme.palette.onSurface.os600,\n },\n '&.Mui-disabled': {\n // remove default @mui style and use currentColor instead\n WebkitTextFillColor: 'unset',\n // placeholder\n '&::-webkit-input-placeholder': {\n color: 'inherit',\n },\n },\n }),\n },\n};\n"],"names":["flowInputBase","defaultProps","styleOverrides","root","theme","color","caretColor","palette","mode","brand","secondary","primary","breakpoints","up","fontSize","lineHeight","fontWeight","text","borderColor","input","height","fontFamily","opacity","onSurface","os200","os600","WebkitTextFillColor"],"mappings":"AAEO,MAAMA,EAAmD,CAC9DC,aAAc,CAAA,EACdC,eAAgB,CACdC,KAAM,EAAGC,YAAO,CACdC,MAAO,UACPC,WAAmC,SAAvBF,EAAMG,QAAQC,KAAkBJ,EAAMG,QAAQE,MAAMC,UAAYN,EAAMG,QAAQE,MAAME,QAChG,CAACP,EAAMQ,YAAYC,GAAG,OAAQ,CAC5BC,SAAU,OACVC,WAAY,OACZC,WAAY,OAEd,gBAAiB,CACfX,MAAOD,EAAMG,QAAQU,KAAKN,SAE5B,KAAM,CACJ,WAAY,CACVO,YAAa,gBAEf,UAAW,CACTA,YAAa,mBAInBC,MAAO,EAAGf,YAAO,CACfgB,OAAQ,OAER,mBAAoB,CAClBC,WAAY,SAGd,+BAAgC,CAC9BC,QAAS,IACTjB,MAA8B,SAAvBD,EAAMG,QAAQC,KAAkBJ,EAAMG,QAAQgB,UAAUC,MAAQpB,EAAMG,QAAQgB,UAAUE,OAEjG,iBAAkB,CAEhBC,oBAAqB,QAErB,+BAAgC,CAC9BrB,MAAO"}

package/materialui/theme/theme.extensions.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import { BoxProps, SvgIconProps, DialogProps, IconButtonProps, ChipProps } from '@mui/material';
 import { ComponentType, CSSProperties, ElementType } from 'react';
-import type { SpinnerProps } from '@/src/components/progress/Spinner';
+import type { SpinnerProps } from '../../components/progress/Spinner';
 declare module '@mui/material/styles' {
     interface TypographyVariants {
         display: CSSProperties;

package/materialui/themeProvider/baseline.theme.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import t from"@skodaflow/web-tokens/src/tokens.json";import{generateTypography as o}from"../typography/typography.theme.js";import{fonts as r}from"./fonts.js";const n=(n,f,l,e)=>{const a={...n?{background:"unset",color:e.palette.text.primary,...o("body",f,l)}:{body:{background:"dark"===e.palette.mode?e.palette.onSurface.os900:e.palette.common.white,color:e.palette.text.primary}},[n?"&, *":"*"]:{"@supports not selector(::-webkit-scrollbar)":{scrollbarWidth:"thin",scrollbarColor:e.palette.onSurface.os500},"::-webkit-scrollbar":{border:"2px solid transparent",width:"8px",height:"8px"},"::-webkit-scrollbar-thumb":{border:"2px solid transparent",borderRadius:"100px",background:e.palette.onSurface.os500,backgroundClip:"content-box"},":not(.notracks)::-webkit-scrollbar-track":{border:"2px solid transparent",borderRadius:"100px",background:e.palette.surface.primary,backgroundClip:"content-box"},"::-webkit-scrollbar-button":{display:"none"},"::-webkit-scrollbar-corner":{backgroundColor:"transparent"},"@media not all and (min-resolution: 0.001dpcm)":{"@supports (-webkit-appearance: none)":{"[style*='overflow:hidden'], [style*='overflow: hidden']":{touchAction:"none"}}}},fallbacks:Object.values(r).filter(Boolean).length?[{"@font-face":{fontFamily:"SKODA Next"+(l?" R2L":""),src:`\n                url('${l?r?.rtlFontLightWoff2:r?.fontLightWoff2}') format('woff2'),\n                url('${l?r?.rtlFontLightWoff:r?.fontLightWoff}') format('woff'),\n                url('${l?r?.rtlFontLightTtf:r?.fontLightTtf}') format('truetype')\n              `,fontStyle:"normal",fontWeight:"300",fontDisplay:"swap"}},{"@font-face":{fontFamily:"SKODA Next"+(l?" R2L":""),src:`\n                url('${l?r?.rtlFontRegularWoff2:r?.fontRegularWoff2}') format('woff2'),\n                url('${l?r?.rtlFontRegularWoff:r?.fontRegularWoff}') format('woff'),\n                url('${l?r?.rtlFontRegularTtf:r?.fontRegularTtf}') format('truetype')\n              `,fontStyle:"normal",fontWeight:"400",fontDisplay:"swap"}},{"@font-face":{fontFamily:"SKODA Next"+(l?" R2L":""),src:`\n                url('${l?r?.rtlFontBoldWoff2:r?.fontBoldWoff2}') format('woff2'),\n                url('${l?r?.rtlFontBoldWoff:r?.fontBoldWoff}') format('woff'),\n                url('${l?r?.rtlFontBoldTtf:r?.fontBoldTtf}') format('truetype')\n              `,fontStyle:"normal",fontWeight:"700",fontDisplay:"swap"}},{"@font-face":{fontFamily:"SKODA Next"+(l?" R2L":""),src:`\n                url('${l?r?.rtlFontBlackWoff2:r?.fontBlackWoff2}') format('woff2'),\n                url('${l?r?.rtlFontBlackWoff:r?.fontBlackWoff}') format('woff'),\n                url('${l?r?.rtlFontBlackTtf:r?.fontBlackTtf}') format('truetype')\n              `,fontStyle:"normal",fontWeight:"900",fontDisplay:"swap"}}]:[]};return t["flow-typography"].forEach(t=>{const r=`${"list"===t.name.split("-")[1]?"typography-":""}${t.name.split("-")[1]}`;a[`${r}${n?':not([class^="Mui"])':""}, .${r}`]=o(r,f,l)}),a},f=(t,o)=>({styleOverrides:{root:({theme:r})=>n(!0,t,o,r)}}),l=(t,o)=>({styleOverrides:r=>n(!1,t,o,r)});export{l as getFlowCssBaseline,n as getFlowCssBaselineRoot,f as getFlowScopedCssBaseline};
+import t from"@skodaflow/web-tokens/src/tokens.json";import{generateTypography as o}from"../typography/typography.theme.js";import{fonts as r}from"./fonts.js";const n=(n,e,f,l)=>{const a={...n?{background:"unset",color:l.palette.text.primary,...o("body",e,f)}:{body:{background:"dark"===l.palette.mode?l.palette.onSurface.os900:l.palette.common.white,color:l.palette.text.primary}},[n?"&, *":"*"]:{"@supports not selector(::-webkit-scrollbar)":{scrollbarWidth:"thin",scrollbarColor:l.palette.onSurface.os500},"::-webkit-scrollbar":{border:"2px solid transparent",width:"8px",height:"8px"},"::-webkit-scrollbar-thumb":{border:"2px solid transparent",borderRadius:"100px",background:l.palette.onSurface.os500,backgroundClip:"content-box"},":not(.notracks)::-webkit-scrollbar-track":{border:"2px solid transparent",borderRadius:"100px",background:l.palette.surface.primary,backgroundClip:"content-box"},"::-webkit-scrollbar-button":{display:"none"},"::-webkit-scrollbar-corner":{backgroundColor:"transparent"},"@media not all and (min-resolution: 0.001dpcm)":{"@supports (-webkit-appearance: none)":{"[style*='overflow:hidden'], [style*='overflow: hidden']":{touchAction:"none"}}}},code:{fontFamily:"monospace",fontSize:"12px",fontWeight:"400",lineHeight:"18px",whiteSpace:"pre"},blockquote:{margin:0,paddingLeft:l.spacing(2),borderLeft:`4px solid ${l.palette.brand.secondary}`},fallbacks:Object.values(r).filter(Boolean).length?[{"@font-face":{fontFamily:"SKODA Next"+(f?" R2L":""),src:`\n                url('${f?r?.rtlFontLightWoff2:r?.fontLightWoff2}') format('woff2'),\n                url('${f?r?.rtlFontLightWoff:r?.fontLightWoff}') format('woff'),\n                url('${f?r?.rtlFontLightTtf:r?.fontLightTtf}') format('truetype')\n              `,fontStyle:"normal",fontWeight:"300",fontDisplay:"swap"}},{"@font-face":{fontFamily:"SKODA Next"+(f?" R2L":""),src:`\n                url('${f?r?.rtlFontRegularWoff2:r?.fontRegularWoff2}') format('woff2'),\n                url('${f?r?.rtlFontRegularWoff:r?.fontRegularWoff}') format('woff'),\n                url('${f?r?.rtlFontRegularTtf:r?.fontRegularTtf}') format('truetype')\n              `,fontStyle:"normal",fontWeight:"400",fontDisplay:"swap"}},{"@font-face":{fontFamily:"SKODA Next"+(f?" R2L":""),src:`\n                url('${f?r?.rtlFontBoldWoff2:r?.fontBoldWoff2}') format('woff2'),\n                url('${f?r?.rtlFontBoldWoff:r?.fontBoldWoff}') format('woff'),\n                url('${f?r?.rtlFontBoldTtf:r?.fontBoldTtf}') format('truetype')\n              `,fontStyle:"normal",fontWeight:"700",fontDisplay:"swap"}},{"@font-face":{fontFamily:"SKODA Next"+(f?" R2L":""),src:`\n                url('${f?r?.rtlFontBlackWoff2:r?.fontBlackWoff2}') format('woff2'),\n                url('${f?r?.rtlFontBlackWoff:r?.fontBlackWoff}') format('woff'),\n                url('${f?r?.rtlFontBlackTtf:r?.fontBlackTtf}') format('truetype')\n              `,fontStyle:"normal",fontWeight:"900",fontDisplay:"swap"}}]:[]};return t["flow-typography"].forEach(t=>{const r=`${"list"===t.name.split("-")[1]?"typography-":""}${t.name.split("-")[1]}`;a[`${r}${n?':not([class^="Mui"])':""}, .${r}`]=o(r,e,f)}),a},e=(t,o)=>({styleOverrides:{root:({theme:r})=>n(!0,t,o,r)}}),f=(t,o)=>({styleOverrides:r=>n(!1,t,o,r)});export{f as getFlowCssBaseline,n as getFlowCssBaselineRoot,e as getFlowScopedCssBaseline};
 //# sourceMappingURL=baseline.theme.js.map