npm - @skodaflow/web-library - Versions diffs - 8.4.0 → 8.5.0 - Mend

@skodaflow/web-library 8.4.0 → 8.5.0

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 (238) hide show

package/materialui/accordion/AccordionSummaryExpandWrapper.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AccordionSummaryExpandWrapper.js","sources":["../../../src/materialui/accordion/AccordionSummaryExpandWrapper.tsx"],"sourcesContent":["import React, { FC, ElementType, forwardRef } from 'react';\nimport { Box, BoxProps, IconButton, useTheme, AccordionSummaryOwnerState } from '@mui/material';\n\n/*\n AccordionSummary.slots.expandIconWrapper that replaces expand icon\n * Wrapper is used instead of expandIcon to gain access to ownerState\n */\nexport const FlowAccordionSummaryExpandWrapper: FC<\n BoxProps<ElementType> & {\n // @mui extend ownerState with expanded and disabled properties\n // https://github.com/mui/material-ui/blob/master/packages/mui-material/src/AccordionSummary/AccordionSummary.js#L132\n ownerState: AccordionSummaryOwnerState & { expanded: boolean; disabled: boolean; disableGutters: boolean };\n }\n> = forwardRef(({ ownerState, children, ...rest }, ref) => {\n const { expanded, disabled } = ownerState;\n const theme = useTheme();\n\n return (\n <Box\n component=\"span\"\n sx={{\n flexShrink: '0',\n mr: '6px',\n transform: 'rotate(0deg)',\n transition: theme.transitions.create('transform', {\n duration: theme.transitions.duration.shortest,\n }),\n '&.Mui-expanded': {\n transform: 'rotate(180deg)',\n },\n }}\n ref={ref}\n {...rest}\n >\n <IconButton\n aria-label=\"Toggle accordion\"\n aria-~~expanded={expanded}~~\n ~~className=\"MuiAccordion~~-~~IconButton~~\"\n color={theme.palette.mode === 'dark' ? 'white' : 'secondary'}\n size=\"medium\"\n disabled={disabled}\n >\n {children}\n </IconButton>\n </Box>\n );\n});\n"],"names":["FlowAccordionSummaryExpandWrapper","forwardRef","ownerState","children","rest","ref","expanded","disabled","theme","useTheme","_jsx","Box","component","~~sx","~~flexShrink","mr","transform","transition","transitions","create","duration","shortest","IconButton","~~className","~~color","palette","mode","size"],"mappings":"~~6IAOO~~,~~MAAMA~~,~~EAMTC,~~EAAW,EAAGC,aAAYC,cAAaC,GAAQC,~~KACjD~~,MAAMC,SAAEA,EAAQC,SAAEA,~~GAAaL~~,~~EACzBM~~,EAAQC,~~IAEd~~,~~OACEC~~,EAACC,EAAG,CACFC,UAAU,~~OACVC~~,GAAI,~~CACFC~~,WAAY,IACZC,GAAI,MACJC,UAAW,eACXC,~~WAAYT~~,~~EAAMU~~,YAAYC,OAAO,YAAa,CAChDC,~~SAAUZ~~,~~EAAMU~~,YAAYE,SAASC,WAEvC,iBAAkB,CAChBL,UAAW,~~mBAGfX~~,IAAKA,KACDD,~~EAAID~~,~~SAERO~~,~~EAACY,~~EAAU,CAAA,aACE,~~mCACIhB~~,~~EACfiB~~,~~UAAU~~,~~0BACVC,~~MAA8B,~~SAAvBhB~~,~~EAAMiB~~,QAAQC,KAAkB,QAAU,YACjDC,KAAK,SACLpB,SAAUA,~~WAETJ~~"}
1	+ {"version":3,"file":"AccordionSummaryExpandWrapper.js","sources":["../../../src/materialui/accordion/AccordionSummaryExpandWrapper.tsx"],"sourcesContent":["import React, { FC, ElementType, forwardRef } from 'react';\nimport { Box, BoxProps, IconButton, IconButtonProps, useTheme, AccordionSummaryOwnerState } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\n\n/*\n AccordionSummary.slots.expandIconWrapper that replaces expand icon\n * Wrapper is used instead of expandIcon to gain access to ownerState\n /\nexport const FlowAccordionSummaryExpandWrapper: FC<\n BoxProps<ElementType> & {\n // @mui extend ownerState with expanded and disabled properties\n // https://github.com/mui/material-ui/blob/master/packages/mui-material/src/AccordionSummary/AccordionSummary.js#L132\n ownerState: AccordionSummaryOwnerState & { expanded: boolean; disabled: boolean; disableGutters: boolean };\n /\n Properties applied to expand/collapse IconButton, passed via `slotProps.expandIconWrapper`\n */\n iconButtonProps?: IconButtonProps;\n }\n> = forwardRef(({ ownerState, iconButtonProps, children, ...rest }, ref) => {\n const { expanded, disabled } = ownerState;\n const theme = useTheme();\n const { sx: iconButtonSx, className: iconButtonClassName, ...restIconButton } = iconButtonProps ?? {};\n\n return (\n <Box\n component=\"span\"\n sx={{\n flexShrink: '0',\n mr: '6px',\n transform: 'rotate(0deg)',\n transition: theme.transitions.create('transform', {\n duration: theme.transitions.duration.shortest,\n }),\n '&.Mui-expanded': {\n transform: 'rotate(180deg)',\n },\n }}\n ref={ref}\n {...rest}\n >\n <IconButton\n aria-label=\"Toggle accordion\"\n // @mui uses AccordionSummary aria-controls as id of the AccordionDetails region\n aria-controls={ownerState['aria-controls']}\n color={theme.palette.mode === 'dark' ? 'white' : 'secondary'}\n size=\"medium\"\n sx={sxOverride({}, iconButtonSx)}\n {...restIconButton}\n aria-expanded={expanded}\n disabled={disabled}\n className={['MuiAccordion-IconButton', iconButtonClassName].filter(Boolean).join(' ')}\n >\n {children}\n </IconButton>\n </Box>\n );\n});\n"],"names":["FlowAccordionSummaryExpandWrapper","forwardRef","ownerState","iconButtonProps","children","rest","ref","expanded","disabled","theme","useTheme","sx","iconButtonSx","className","iconButtonClassName","restIconButton","_jsx","Box","component","flexShrink","mr","transform","transition","transitions","create","duration","shortest","IconButton","color","palette","mode","size","sxOverride","filter","Boolean","join"],"mappings":"qNAQaA,EAUTC,EAAW,EAAGC,aAAYC,kBAAiBC,cAAaC,GAAQC,KAClE,MAAMC,SAAEA,EAAQC,SAAEA,GAAaN,EACzBO,EAAQC,KACNC,GAAIC,EAAcC,UAAWC,KAAwBC,GAAmBZ,GAAmB,CAAA,EAEnG,OACEa,EAACC,EAAG,CACFC,UAAU,OACVP,GAAI,CACFQ,WAAY,IACZC,GAAI,MACJC,UAAW,eACXC,WAAYb,EAAMc,YAAYC,OAAO,YAAa,CAChDC,SAAUhB,EAAMc,YAAYE,SAASC,WAEvC,iBAAkB,CAChBL,UAAW,mBAGff,IAAKA,KACDD,WAEJW,EAACW,EAAU,CAAA,aACE,mCAEIzB,EAAW,iBAC1B0B,MAA8B,SAAvBnB,EAAMoB,QAAQC,KAAkB,QAAU,YACjDC,KAAK,SACLpB,GAAIqB,EAAW,CAAA,EAAIpB,MACfG,EAAc,gBACHR,EACfC,SAAUA,EACVK,UAAW,CAAC,0BAA2BC,GAAqBmB,OAAOC,SAASC,KAAK,KAAI/B,SAEpFA"}

package/materialui/alert/alertTitle.theme.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"alertTitle.theme.js","sources":["../../../src/materialui/alert/alertTitle.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\n\nexport const flowAlertTitle: Components<Theme>['MuiAlertTitle'] = {\n defaultProps: {\n variant: 'caption2',\n component: 'h4',\n },\n styleOverrides: {\n // override MUI default\n root: {\n marginTop: '0',\n }\n }\n};\n"],"names":["flowAlertTitle","defaultProps","variant","component","styleOverrides","root","marginTop"],"mappings":"AAGO,MAAMA,EAAqD,CAChEC,aAAc,CACZC,QAAS,WACTC,UAAW,MAEbC,eAAgB,CAEdC,KAAM,CACJC,UAAW"}
1	+ {"version":3,"file":"alertTitle.theme.js","sources":["../../../src/materialui/alert/alertTitle.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\n\nexport const flowAlertTitle: Components<Theme>['MuiAlertTitle'] = {\n defaultProps: {\n variant: 'caption2',\n component: 'h4',\n },\n styleOverrides: {\n // override MUI default\n root: {\n marginTop: '0',\n },\n },\n};\n"],"names":["flowAlertTitle","defaultProps","variant","component","styleOverrides","root","marginTop"],"mappings":"AAGO,MAAMA,EAAqD,CAChEC,aAAc,CACZC,QAAS,WACTC,UAAW,MAEbC,eAAgB,CAEdC,KAAM,CACJC,UAAW"}

package/materialui/card/Card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Card.js","sources":["../../../src/materialui/card/Card.tsx"],"sourcesContent":["import React, { FC, forwardRef } from 'react';\nimport { Paper, Box, CardProps } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { CheckIcon } from '@/src/components/icon/stroke/CheckIcon';\nimport { PlusIcon } from '@/src/components/icon/stroke/PlusIcon';\nimport { MinusIcon } from '@/src/components/icon/stroke/MinusIcon';\nimport { updateFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\nimport { Spinner } from '@/src/components/progress/Spinner';\n\n/*\n Standard MUI Card extended with custom properties\n */\nexport const FlowCard: FC<CardProps> = forwardRef(\n (\n {\n children,\n isSelected,\n disableIcon = true,\n iconSlots,\n iconPlacement = 'top-end',\n iconProps,\n hoverIconProps,\n iconWrapperProps,\n contentWrapperProps,\n onClick,\n disabled,\n color,\n loading,\n loadingProps,\n ...rest\n },\n ref,\n ) => {\n const { sx: wrapperSx, ...restWrapper } = contentWrapperProps \|\| {};\n const { sx: iconWrapperSx, className: iconWrapperClassName, ...restIconWrapper } = iconWrapperProps \|\| {};\n const { sx: iconSx, ...restIcon } = iconProps \|\| {};\n const { sx: hoverIconSx, ...restHoverIcon } = hoverIconProps \|\| {};\n const { sx: loadingSpinnerSx, ...restLoadingProps } = loadingProps \|\| {};\n const { icon, selectedIcon, hoverIcon, hoverSelectedIcon } = {\n icon: PlusIcon,\n selectedIcon: CheckIcon,\n hoverIcon: PlusIcon,\n hoverSelectedIcon: MinusIcon,\n ...(iconSlots \|\| {}),\n };\n const IconComponent = !disabled && isSelected ? selectedIcon : icon;\n const HoverIconComponent = !disabled && isSelected ? hoverSelectedIcon : hoverIcon;\n const showLoadingSpinner = loading && !disabled;\n\n return (\n <Paper color={color} onClick={disabled ? undefined : onClick} {...rest} ref={ref}>\n <Box\n sx={sxOverride({ borderRadius: 'inherit', overflow: 'hidden', height: '100%' }, wrapperSx)}\n {...restWrapper}\n >\n {!disableIcon && (\n <Box\n sx={sxOverride(\n {\n // circle\n border: 1,\n borderColor: 'onSurface.os100',\n backgroundColor: 'background.primary',\n ...(color === 'secondary' && {\n backgroundColor: 'surface.primary',\n }),\n borderRadius: '1000px',\n p: showLoadingSpinner ? '3px' : '5px',\n // reset IconButton style\n width: 'auto',\n height: 'auto',\n transition: 'none',\n // interactive and selected effect is controlled by card.theme\n // placement\n position: 'absolute',\n ...(iconPlacement.includes('top') ? { top: '16px' } : {}),\n ...(iconPlacement.includes('bottom') ? { bottom: '16px' } : {}),\n ...(iconPlacement.includes('start') ? { left: '16px' } : {}),\n ...(iconPlacement.includes('end') ? { right: '16px' } : {}),\n // Box overwritten to button\n '&.MuiButtonBase-root': {\n ...updateFocusRingStyle(1),\n // remove smooth transition effect to match card behavior\n '&:before': {\n transition: 'none',\n },\n // same style is also applied in card.theme\n ...getInteractiveStyle(\n {\n backgroundColor: 'background.primary',\n ...(color === 'secondary' && {\n backgroundColor: 'surface.primary',\n }),\n ...(isSelected && {\n backgroundColor: 'brand.primary',\n borderColor: 'brand.primary',\n color: 'common.white',\n }),\n ...(showLoadingSpinner && isSelected && {\n backgroundColor: 'brandHover.primary',\n borderColor: 'brandHover.primary',\n }),\n ...(!showLoadingSpinner && {\n '.MuiSvgIcon-root': {\n '&:first-of-type': {\n display: 'block',\n },\n '&:last-of-type': {\n display: 'none',\n },\n },\n }),\n },\n {\n backgroundColor: 'surface.primary',\n ...(color === 'secondary' && {\n backgroundColor: 'surface.secondary',\n }),\n ...(isSelected && {\n backgroundColor: 'brandHover.primary',\n borderColor: 'brandHover.primary',\n color: 'common.white',\n }),\n // flip icon being shown\n ...(!showLoadingSpinner && {\n '.MuiSvgIcon-root': {\n '&:first-of-type': {\n display: 'none',\n },\n '&:last-of-type': {\n display: 'block',\n },\n },\n }),\n },\n ),\n },\n },\n iconWrapperSx,\n )}\n className={['FlowCard-Icon-root', iconWrapperClassName].filter(Boolean).join(' ')}\n {...restIconWrapper}\n >\n {showLoadingSpinner ? (\n <Spinner\n data-testid=\"Card.LoadingSpinner\"\n size={24}\n sx={sxOverride(\n {\n display: 'block',\n width: '24px',\n height: '24px',\n ...(isSelected && {\n '& .FlowSpinner-circle-primary': {\n stroke: (theme) => theme.palette.brand.secondary,\n },\n '& .FlowSpinner-circle-secondary': {\n stroke: (theme) => theme.palette.transparent.secondary,\n },\n }),\n },\n loadingSpinnerSx,\n )}\n {...restLoadingProps}\n />\n ) : (\n <>\n <IconComponent\n data-testid=\"Card.Icon\"\n sx={sxOverride({ display: 'block', fontSize: '20px' }, iconSx)}\n {...restIcon}\n />\n <HoverIconComponent\n data-testid=\"Card.HoverIcon\"\n sx={sxOverride({ display: 'none', fontSize: '20px' }, hoverIconSx)}\n {...restHoverIcon}\n />\n </>\n )}\n </Box>\n )}\n {children}\n </Box>\n </Paper>\n );\n },\n);\n"],"names":["FlowCard","forwardRef","children","isSelected","disableIcon","iconSlots","iconPlacement","iconProps","hoverIconProps","iconWrapperProps","contentWrapperProps","onClick","disabled","color","loading","loadingProps","rest","ref","sx","wrapperSx","restWrapper","iconWrapperSx","className","iconWrapperClassName","restIconWrapper","iconSx","restIcon","hoverIconSx","restHoverIcon","loadingSpinnerSx","restLoadingProps","icon","selectedIcon","hoverIcon","hoverSelectedIcon","PlusIcon","CheckIcon","MinusIcon","IconComponent","HoverIconComponent","showLoadingSpinner","_jsx","Paper","undefined","_jsxs","Box","sxOverride","borderRadius","overflow","height","border","borderColor","backgroundColor","p","width","transition","position","includes","top","bottom","left","right","updateFocusRingStyle","getInteractiveStyle","display","filter","Boolean","join","Spinner","size","stroke","theme","palette","brand","secondary","transparent","_Fragment","fontSize"],"mappings":"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"}
1	+ {"version":3,"file":"Card.js","sources":["../../../src/materialui/card/Card.tsx"],"sourcesContent":["import React, { FC, forwardRef } from 'react';\nimport { Paper, Box, CardProps } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { CheckIcon } from '@/src/components/icon/stroke/CheckIcon';\nimport { PlusIcon } from '@/src/components/icon/stroke/PlusIcon';\nimport { MinusIcon } from '@/src/components/icon/stroke/MinusIcon';\nimport { updateFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\nimport { Spinner } from '@/src/components/progress/Spinner';\n\n/*\n Standard MUI Card extended with custom properties\n */\nexport const FlowCard: FC<CardProps> = forwardRef(\n (\n {\n children,\n isSelected,\n disableIcon = true,\n iconSlots,\n iconPlacement = 'top-end',\n iconProps,\n hoverIconProps,\n iconWrapperProps,\n contentWrapperProps,\n onClick,\n disabled,\n color,\n loading,\n loadingProps,\n ...rest\n },\n ref,\n ) => {\n const { sx: wrapperSx, ...restWrapper } = contentWrapperProps \|\| {};\n const { sx: iconWrapperSx, className: iconWrapperClassName, ...restIconWrapper } = iconWrapperProps \|\| {};\n const { sx: iconSx, ...restIcon } = iconProps \|\| {};\n const { sx: hoverIconSx, ...restHoverIcon } = hoverIconProps \|\| {};\n const { sx: loadingSpinnerSx, ...restLoadingProps } = loadingProps \|\| {};\n const { icon, selectedIcon, hoverIcon, hoverSelectedIcon } = {\n icon: PlusIcon,\n selectedIcon: CheckIcon,\n hoverIcon: PlusIcon,\n hoverSelectedIcon: MinusIcon,\n ...(iconSlots \|\| {}),\n };\n const IconComponent = !disabled && isSelected ? selectedIcon : icon;\n const HoverIconComponent = !disabled && isSelected ? hoverSelectedIcon : hoverIcon;\n const showLoadingSpinner = loading && !disabled;\n\n return (\n <Paper color={color} onClick={disabled ? undefined : onClick} {...rest} ref={ref}>\n <Box\n sx={sxOverride({ borderRadius: 'inherit', overflow: 'hidden', height: '100%' }, wrapperSx)}\n {...restWrapper}\n >\n {!disableIcon && (\n <Box\n sx={sxOverride(\n {\n // circle\n border: 1,\n borderColor: 'onSurface.os100',\n backgroundColor: 'background.primary',\n ...(color === 'secondary' && {\n backgroundColor: 'surface.primary',\n }),\n borderRadius: '1000px',\n p: showLoadingSpinner ? '3px' : '5px',\n // reset IconButton style\n width: 'auto',\n height: 'auto',\n transition: 'none',\n // interactive and selected effect is controlled by card.theme\n // placement\n position: 'absolute',\n ...(iconPlacement.includes('top') ? { top: '16px' } : {}),\n ...(iconPlacement.includes('bottom') ? { bottom: '16px' } : {}),\n ...(iconPlacement.includes('start') ? { left: '16px' } : {}),\n ...(iconPlacement.includes('end') ? { right: '16px' } : {}),\n // Box overwritten to button\n '&.MuiButtonBase-root': {\n ...updateFocusRingStyle(1),\n // remove smooth transition effect to match card behavior\n '&:before': {\n transition: 'none',\n },\n // same style is also applied in card.theme\n ...getInteractiveStyle(\n {\n backgroundColor: 'background.primary',\n ...(color === 'secondary' && {\n backgroundColor: 'surface.primary',\n }),\n ...(isSelected && {\n backgroundColor: 'brand.primary',\n borderColor: 'brand.primary',\n color: 'common.white',\n }),\n ...(showLoadingSpinner &&\n isSelected && {\n backgroundColor: 'brandHover.primary',\n borderColor: 'brandHover.primary',\n }),\n ...(!showLoadingSpinner && {\n '.MuiSvgIcon-root': {\n '&:first-of-type': {\n display: 'block',\n },\n '&:last-of-type': {\n display: 'none',\n },\n },\n }),\n },\n {\n backgroundColor: 'surface.primary',\n ...(color === 'secondary' && {\n backgroundColor: 'surface.secondary',\n }),\n ...(isSelected && {\n backgroundColor: 'brandHover.primary',\n borderColor: 'brandHover.primary',\n color: 'common.white',\n }),\n // flip icon being shown\n ...(!showLoadingSpinner && {\n '.MuiSvgIcon-root': {\n '&:first-of-type': {\n display: 'none',\n },\n '&:last-of-type': {\n display: 'block',\n },\n },\n }),\n },\n ),\n },\n },\n iconWrapperSx,\n )}\n className={['FlowCard-Icon-root', iconWrapperClassName].filter(Boolean).join(' ')}\n {...restIconWrapper}\n >\n {showLoadingSpinner ? (\n <Spinner\n data-testid=\"Card.LoadingSpinner\"\n size={24}\n sx={sxOverride(\n {\n display: 'block',\n width: '24px',\n height: '24px',\n ...(isSelected && {\n '& .FlowSpinner-circle-primary': {\n stroke: (theme) => theme.palette.brand.secondary,\n },\n '& .FlowSpinner-circle-secondary': {\n stroke: (theme) => theme.palette.transparent.secondary,\n },\n }),\n },\n loadingSpinnerSx,\n )}\n {...restLoadingProps}\n />\n ) : (\n <>\n <IconComponent\n data-testid=\"Card.Icon\"\n sx={sxOverride({ display: 'block', fontSize: '20px' }, iconSx)}\n {...restIcon}\n />\n <HoverIconComponent\n data-testid=\"Card.HoverIcon\"\n sx={sxOverride({ display: 'none', fontSize: '20px' }, hoverIconSx)}\n {...restHoverIcon}\n />\n </>\n )}\n </Box>\n )}\n {children}\n </Box>\n </Paper>\n );\n },\n);\n"],"names":["FlowCard","forwardRef","children","isSelected","disableIcon","iconSlots","iconPlacement","iconProps","hoverIconProps","iconWrapperProps","contentWrapperProps","onClick","disabled","color","loading","loadingProps","rest","ref","sx","wrapperSx","restWrapper","iconWrapperSx","className","iconWrapperClassName","restIconWrapper","iconSx","restIcon","hoverIconSx","restHoverIcon","loadingSpinnerSx","restLoadingProps","icon","selectedIcon","hoverIcon","hoverSelectedIcon","PlusIcon","CheckIcon","MinusIcon","IconComponent","HoverIconComponent","showLoadingSpinner","_jsx","Paper","undefined","_jsxs","Box","sxOverride","borderRadius","overflow","height","border","borderColor","backgroundColor","p","width","transition","position","includes","top","bottom","left","right","updateFocusRingStyle","getInteractiveStyle","display","filter","Boolean","join","Spinner","size","stroke","theme","palette","brand","secondary","transparent","_Fragment","fontSize"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-import{FlowCard as r}from"./Card.js";import{getFocusRingStyle as o}from"../../components/focusring/focusring.js";import{getInteractiveStyle as e}from"../button/interactive.js";const a={defaultProps:{elevation:0,component:r},styleOverrides:{root:({theme:r,color:a,disabled:t,isSelected:l,loading:d})=>({backgroundColor:"secondary"===a?r.palette.surface.primary:r.palette.background.primary,position:"relative",borderRadius:"8px",overflow:"visible",border:"1px solid transparent","&::after":{content:'""',position:"absolute",maxWidth:"none",borderStyle:"solid",borderRadius:"inherit",pointerEvents:"none",zIndex:"1",inset:"-1px",borderWidth:"1px",borderColor:r.palette.onSurface.os100,...!t&&l&&{inset:"-3px",borderWidth:"3px",borderColor:r.palette.brand.primary}},...!t&&l&&{"& .FlowCard-Icon-root":{color:r.palette.common.white,backgroundColor:r.palette.brand.primary,borderColor:r.palette.brand.primary,...d&&{backgroundColor:r.palette.brandHover.primary,borderColor:r.palette.brandHover.primary}},"&:hover":{"&::after":{borderColor:r.palette.brandHover.primary}}},...!t&&{"&:has(.MuiCardActionArea-root)":{...e({"&::after":{inset:"-1px",borderWidth:"1px",borderColor:r.palette.onSurface.os100,...l&&{inset:"-3px",borderWidth:"3px",borderColor:r.palette.brand.primary}},"& .FlowCard-Icon-root":{backgroundColor:r.palette.background.primary,..."secondary"===a&&{backgroundColor:r.palette.surface.primary},...l&&{backgroundColor:r.palette.brand.primary,borderColor:r.palette.brand.primary},...l&&d&&{backgroundColor:r.palette.brandHover.primary,borderColor:r.palette.brandHover.primary}},...!d&&{"& .FlowCard-Icon-root .MuiSvgIcon-root":{"&:first-of-type":{display:"block"},"&:last-of-type":{display:"none"}}}},{"&::after":{inset:"-3px",borderWidth:"3px",...l&&{borderColor:r.palette.brandHover.primary}},"& .FlowCard-Icon-root":{backgroundColor:r.palette.surface.primary,..."secondary"===a&&{backgroundColor:r.palette.surface.secondary},...l&&{backgroundColor:r.palette.brandHover.primary,borderColor:r.palette.brandHover.primary}},...!d&&{"& .FlowCard-Icon-root .MuiSvgIcon-root":{"&:first-of-type":{display:"none"},"&:last-of-type":{display:"block"}}}},null,null,"&:has(.MuiCardActionArea-root.Mui-focusVisible)")},...o(r,!1,3,":has(.MuiCardActionArea-root.Mui-focusVisible, .FlowFlippingCardContent-root.Mui-focusVisible)")},...t&&{backgroundColor:r.palette.surface.primary,borderColor:r.palette.disabled.secondary,cursor:"not-allowed",userSelect:"none",pointerEvents:"none","& .FlowCard-Icon-root":{backgroundColor:r.palette.disabled.secondary,color:r.palette.disabled.tertiary},"&, & .MuiTypography-root":{color:r.palette.disabled.tertiary},"& img":{opacity:"0.6"}}})},variants:[{props:{raised:!0},style:({theme:r})=>({boxShadow:r.flowShadows.xs})}]};export{a as flowCard};
+import{FlowCard as o}from"./Card.js";import{getFocusRingStyle as r}from"../../components/focusring/focusring.js";import{getInteractiveStyle as e}from"../button/interactive.js";const a={defaultProps:{elevation:0,component:o},styleOverrides:{root:({theme:o,color:a,disabled:t,isSelected:l,loading:n})=>({backgroundColor:"secondary"===a?o.palette.surface.primary:o.palette.background.primary,position:"relative",borderRadius:"8px",overflow:"visible",border:"1px solid transparent","&::after":{content:'""',position:"absolute",maxWidth:"none",pointerEvents:"none",zIndex:"1",inset:"0",borderRadius:"inherit",boxShadow:`0 0 0 1px ${o.palette.onSurface.os100}`,...!t&&l&&{boxShadow:`0 0 0 3px ${o.palette.brand.primary}`}},...!t&&l&&{"& .FlowCard-Icon-root":{color:o.palette.common.white,backgroundColor:o.palette.brand.primary,borderColor:o.palette.brand.primary,...n&&{backgroundColor:o.palette.brandHover.primary,borderColor:o.palette.brandHover.primary}},"&:hover":{"&::after":{boxShadow:`0 0 0 3px ${o.palette.brandHover.primary}`}}},...!t&&{"&:has(.MuiCardActionArea-root)":{...e({"&::after":{boxShadow:`0 0 0 1px ${o.palette.onSurface.os100}`,...l&&{boxShadow:`0 0 0 3px ${o.palette.brand.primary}`}},"& .FlowCard-Icon-root":{backgroundColor:o.palette.background.primary,..."secondary"===a&&{backgroundColor:o.palette.surface.primary},...l&&{backgroundColor:o.palette.brand.primary,borderColor:o.palette.brand.primary},...l&&n&&{backgroundColor:o.palette.brandHover.primary,borderColor:o.palette.brandHover.primary}},...!n&&{"& .FlowCard-Icon-root .MuiSvgIcon-root":{"&:first-of-type":{display:"block"},"&:last-of-type":{display:"none"}}}},{"&::after":{boxShadow:`0 0 0 3px ${o.palette.onSurface.os100}`,...l&&{boxShadow:`0 0 0 3px ${o.palette.brandHover.primary}`}},"& .FlowCard-Icon-root":{backgroundColor:o.palette.surface.primary,..."secondary"===a&&{backgroundColor:o.palette.surface.secondary},...l&&{backgroundColor:o.palette.brandHover.primary,borderColor:o.palette.brandHover.primary}},...!n&&{"& .FlowCard-Icon-root .MuiSvgIcon-root":{"&:first-of-type":{display:"none"},"&:last-of-type":{display:"block"}}}},null,null,"&:has(.MuiCardActionArea-root.Mui-focusVisible)")},...r(o,!1,3,":has(.MuiCardActionArea-root.Mui-focusVisible, .FlowFlippingCardContent-root.Mui-focusVisible)")},...t&&{backgroundColor:o.palette.surface.primary,borderColor:o.palette.disabled.secondary,cursor:"not-allowed",userSelect:"none",pointerEvents:"none","& .FlowCard-Icon-root":{backgroundColor:o.palette.disabled.secondary,color:o.palette.disabled.tertiary},"&, & .MuiTypography-root":{color:o.palette.disabled.tertiary},"& img":{opacity:"0.6"}}})},variants:[{props:{raised:!0},style:({theme:o})=>({boxShadow:o.flowShadows.xs})}]};export{a as flowCard};
 //# sourceMappingURL=card.theme.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"card.theme.js","sources":["../../../src/materialui/card/card.theme.tsx"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\nimport { FlowCard } from './Card';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport const flowCard: Components<Theme>['MuiCard'] = {\n defaultProps: {\n elevation: 0,\n // we use custom Card component that extends @mui card greatly\n component: FlowCard,\n },\n styleOverrides: {\n root: ({ theme, color, disabled, isSelected, loading }) => ({\n backgroundColor: color === 'secondary' ? theme.palette.surface.primary : theme.palette.background.primary,\n position: 'relative',\n borderRadius: '8px',\n overflow: 'visible',\n // adding standard border and changing its width on hover creates layout shift\n // therefore we use absolute positioned border\n border: '1px solid transparent',\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n maxWidth: 'none',\n ~~borderStyle~~: '~~solid~~',\n ~~borderRadius~~: '~~inherit~~',\n ~~pointerEvents~~: '~~none~~',\n ~~zIndex~~: '1',\n // same style is applied for the interactive effect bellow\n // ~~into~~ the transparent border\n ~~inset~~: ~~'-1px',\n borderWidth:~~ '1px~~',\n borderColor:~~ theme.palette.onSurface.os100,\n // selected\n ...(!disabled &&\n isSelected && {\n // keep 1px inside\n ~~inset~~: ~~'-3px',\n borderWidth:~~ '3px~~',\n borderColor:~~ theme.palette.brand.primary,\n }),\n },\n // selected\n ...(!disabled &&\n isSelected && {\n // change style of icon\n '& .FlowCard-Icon-root': {\n color: theme.palette.common.white,\n backgroundColor: theme.palette.brand.primary,\n borderColor: theme.palette.brand.primary,\n ...(loading && {\n backgroundColor: theme.palette.brandHover.primary,\n borderColor: theme.palette.brandHover.primary,\n }),\n },\n // hover effect that for non-link selected card\n '&:hover': {\n '&::after': {\n ~~borderColor~~: theme.palette.brandHover.primary,\n },\n },\n }),\n // hover effect is applied only if FlowIconButton exists\n ...(!disabled && {\n '&:has(.MuiCardActionArea-root)': {\n ...getInteractiveStyle(\n {\n '&::after': {\n ~~inset~~: ~~'-1px',\n borderWidth:~~ '1px~~',\n borderColor:~~ theme.palette.onSurface.os100,\n // selected\n ...(isSelected && {\n ~~inset~~: ~~'-3px',\n borderWidth:~~ '3px~~',\n borderColor:~~ theme.palette.brand.primary,\n }),\n },\n // same style is also in Card.tsx\n '& .FlowCard-Icon-root': {\n backgroundColor: theme.palette.background.primary,\n ...(color === 'secondary' && {\n backgroundColor: theme.palette.surface.primary,\n }),\n ...(isSelected && {\n backgroundColor: theme.palette.brand.primary,\n borderColor: theme.palette.brand.primary,\n }),\n ...(isSelected && loading && {\n backgroundColor: theme.palette.brandHover.primary,\n borderColor: theme.palette.brandHover.primary,\n }),\n },\n ...(!loading && {\n '& .FlowCard-Icon-root .MuiSvgIcon-root': {\n '&:first-of-type': {\n display: 'block',\n },\n '&:last-of-type': {\n display: 'none',\n },\n },\n }),\n },\n {\n // adjust style of border\n '&::after': {\n ~~inset~~: '-3px~~',\n borderWidth:~~ ~~'3px',\~~n ...(isSelected && {\n ~~borderColor~~: theme.palette.brandHover.primary,\n }),\n },\n // change style of icon\n '& .FlowCard-Icon-root': {\n backgroundColor: theme.palette.surface.primary,\n ...(color === 'secondary' && {\n backgroundColor: theme.palette.surface.secondary,\n }),\n ...(isSelected && {\n backgroundColor: theme.palette.brandHover.primary,\n borderColor: theme.palette.brandHover.primary,\n }),\n },\n // flip icon being shown\n ...(!loading && {\n '& .FlowCard-Icon-root .MuiSvgIcon-root': {\n '&:first-of-type': {\n display: 'none',\n },\n '&:last-of-type': {\n display: 'block',\n },\n },\n }),\n },\n null,\n null,\n '&:has(.MuiCardActionArea-root.Mui-focusVisible)',\n ),\n },\n ...getFocusRingStyle(\n theme,\n false,\n 3,\n ':has(.MuiCardActionArea-root.Mui-focusVisible, .FlowFlippingCardContent-root.Mui-focusVisible)',\n ),\n }),\n // disabled style\n ...(disabled && {\n backgroundColor: theme.palette.surface.primary,\n borderColor: theme.palette.disabled.secondary,\n cursor: 'not-allowed',\n userSelect: 'none',\n pointerEvents: 'none',\n // change style of icon\n '& .FlowCard-Icon-root': {\n backgroundColor: theme.palette.disabled.secondary,\n color: theme.palette.disabled.tertiary,\n },\n // important selector to overwrite Typography sx color styling\n '&, & .MuiTypography-root': {\n color: theme.palette.disabled.tertiary,\n },\n // change visibility of images\n '& img': {\n opacity: '0.6',\n },\n }),\n }),\n },\n variants: [\n {\n props: { raised: true },\n style: ({ theme }) => ({\n boxShadow: theme.flowShadows['xs'],\n }),\n },\n ],\n};\n"],"names":["flowCard","defaultProps","elevation","component","FlowCard","styleOverrides","root","theme","color","disabled","isSelected","loading","backgroundColor","palette","surface","primary","background","position","borderRadius","overflow","border","content","maxWidth","~~borderStyle","~~pointerEvents","zIndex","inset","~~borderWidth~~","~~borderColor","~~onSurface","os100","brand","common","white","brandHover","getInteractiveStyle","display","secondary","getFocusRingStyle","cursor","userSelect","tertiary","opacity","variants","props","raised","style","~~boxShadow","~~flowShadows"],"mappings":"gLAMO,MAAMA,EAAyC,CACpDC,aAAc,CACZC,UAAW,EAEXC,UAAWC,GAEbC,eAAgB,CACdC,KAAM,EAAGC,QAAOC,QAAOC,WAAUC,aAAYC,cAAS,CACpDC,gBAA2B,cAAVJ,EAAwBD,EAAMM,QAAQC,QAAQC,QAAUR,EAAMM,QAAQG,WAAWD,QAClGE,SAAU,WACVC,aAAc,MACdC,SAAU,UAGVC,OAAQ,wBACR,WAAY,CACVC,QAAS,KACTJ,SAAU,WACVK,SAAU,OACVC,~~YAAa,QACbL,aAAc,UACdM,~~cAAe,OACfC,OAAQ,~~IAGRC~~,MAAO,~~OACPC~~,~~YAAa~~,~~MACbC~~,~~YAAarB~~,EAAMM,~~QAAQgB~~,UAAUC,~~UAEhCrB~~,GACHC,GAAc,CAEZgB,~~MAAO~~,~~OACPC~~,~~YAAa,MACbC,YAAarB,~~EAAMM,~~QAAQkB~~,~~MAAMhB~~,~~cAIlCN~~,GACHC,GAAc,CAEZ,wBAAyB,CACvBF,MAAOD,EAAMM,~~QAAQmB~~,OAAOC,~~MAC5BrB~~,gBAAiBL,EAAMM,~~QAAQkB~~,~~MAAMhB~~,~~QACrCa~~,~~YAAarB~~,EAAMM,~~QAAQkB~~,~~MAAMhB~~,WAC7BJ,GAAW,CACbC,gBAAiBL,EAAMM,~~QAAQqB~~,~~WAAWnB~~,~~QAC1Ca~~,~~YAAarB~~,EAAMM,~~QAAQqB~~,~~WAAWnB~~,UAI1C,UAAW,CACT,WAAY,~~CACVa~~,~~YAAarB~~,EAAMM,~~QAAQqB~~,~~WAAWnB~~,~~eAKzCN~~,GAAY,CACf,iCAAkC,~~IAC7B0B~~,EACD,CACE,WAAY,~~CACVT~~,~~MAAO~~,~~OACPC~~,~~YAAa,MACbC,YAAarB,~~EAAMM,~~QAAQgB~~,UAAUC,~~SAEjCpB~~,GAAc,CAChBgB,~~MAAO~~,~~OACPC~~,~~YAAa,MACbC,YAAarB,~~EAAMM,~~QAAQkB~~,~~MAAMhB~~,~~UAIrC~~,wBAAyB,CACvBH,gBAAiBL,EAAMM,QAAQG,WAAWD,WAC5B,cAAVP,GAAyB,CAC3BI,gBAAiBL,EAAMM,QAAQC,QAAQC,YAErCL,GAAc,CAChBE,gBAAiBL,EAAMM,~~QAAQkB~~,~~MAAMhB~~,~~QACrCa~~,~~YAAarB~~,EAAMM,~~QAAQkB~~,~~MAAMhB~~,YAE/BL,~~GAAcC~~,GAAW,~~CAC3BC~~,gBAAiBL,EAAMM,~~QAAQqB~~,~~WAAWnB~~,~~QAC1Ca~~,~~YAAarB~~,EAAMM,~~QAAQqB~~,~~WAAWnB~~,~~cAGrCJ~~,GAAW,CACd,yCAA0C,CACxC,kBAAmB,~~CACjByB~~,QAAS,SAEX,iBAAkB,CAChBA,QAAS,WAKjB,CAEE,WAAY,~~CACVV~~,~~MAAO~~,~~OACPC~~,~~YAAa~~,~~SACTjB~~,GAAc,~~CAChBkB~~,~~YAAarB~~,EAAMM,~~QAAQqB~~,~~WAAWnB~~,~~UAI1C~~,wBAAyB,CACvBH,gBAAiBL,EAAMM,QAAQC,QAAQC,WACzB,cAAVP,GAAyB,CAC3BI,gBAAiBL,EAAMM,QAAQC,~~QAAQuB~~,~~cAErC3B~~,GAAc,CAChBE,gBAAiBL,EAAMM,~~QAAQqB~~,~~WAAWnB~~,~~QAC1Ca~~,~~YAAarB~~,EAAMM,~~QAAQqB~~,~~WAAWnB~~,cAIrCJ,GAAW,CACd,yCAA0C,CACxC,kBAAmB,~~CACjByB~~,QAAS,QAEX,iBAAkB,CAChBA,QAAS,YAKjB,KACA,KACA,uDAGDE,~~EACD/B~~,GACA,EACA,EACA,sGAIAE,GAAY,CACdG,gBAAiBL,EAAMM,QAAQC,QAAQC,~~QACvCa~~,~~YAAarB~~,EAAMM,QAAQJ,~~SAAS4B~~,UACpCE,OAAQ,cACRC,WAAY,OACZhB,cAAe,OAEf,wBAAyB,~~CACvBZ~~,gBAAiBL,EAAMM,QAAQJ,~~SAAS4B~~,~~UACxC7B~~,MAAOD,EAAMM,QAAQJ,~~SAASgC~~,UAGhC,2BAA4B,~~CAC1BjC~~,MAAOD,EAAMM,QAAQJ,~~SAASgC~~,UAGhC,QAAS,CACPC,QAAS,WAKjBC,SAAU,CACR,CACEC,MAAO,CAAEC,QAAQ,GACjBC,MAAO,~~EAAGvC~~,YAAO,~~CACfwC~~,~~UAAWxC~~,~~EAAMyC~~,YAAgB"}
1	+ {"version":3,"file":"card.theme.js","sources":["../../../src/materialui/card/card.theme.tsx"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\nimport { FlowCard } from './Card';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport const flowCard: Components<Theme>['MuiCard'] = {\n defaultProps: {\n elevation: 0,\n // we use custom Card component that extends @mui card greatly\n component: FlowCard,\n },\n styleOverrides: {\n root: ({ theme, color, disabled, isSelected, loading }) => ({\n backgroundColor: color === 'secondary' ? theme.palette.surface.primary : theme.palette.background.primary,\n position: 'relative',\n borderRadius: '8px',\n overflow: 'visible',\n // adding standard border and changing its width on hover creates layout shift\n // therefore we use absolute positioned border\n border: '1px solid transparent',\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n maxWidth: 'none',\n pointerEvents: 'none',\n zIndex: '1',\n inset: '0',\n borderRadius: 'inherit',\n // same style is applied for the interactive effect bellow\n // 1px fills the transparent border\n boxShadow: `0 0 0 1px ${theme.palette.onSurface.os100}`,\n // selected\n ...(!disabled &&\n isSelected && {\n // keep 1px inside\n boxShadow: `0 0 0 3px ${theme.palette.brand.primary}`,\n }),\n },\n // selected\n ...(!disabled &&\n isSelected && {\n // change style of icon\n '& .FlowCard-Icon-root': {\n color: theme.palette.common.white,\n backgroundColor: theme.palette.brand.primary,\n borderColor: theme.palette.brand.primary,\n ...(loading && {\n backgroundColor: theme.palette.brandHover.primary,\n borderColor: theme.palette.brandHover.primary,\n }),\n },\n // hover effect that for non-link selected card\n '&:hover': {\n '&::after': {\n boxShadow: `0 0 0 3px ${theme.palette.brandHover.primary}`,\n },\n },\n }),\n // hover effect is applied only if FlowIconButton exists\n ...(!disabled && {\n '&:has(.MuiCardActionArea-root)': {\n ...getInteractiveStyle(\n {\n '&::after': {\n boxShadow: `0 0 0 1px ${theme.palette.onSurface.os100}`,\n // selected\n ...(isSelected && {\n boxShadow: `0 0 0 3px ${theme.palette.brand.primary}`,\n }),\n },\n // same style is also in Card.tsx\n '& .FlowCard-Icon-root': {\n backgroundColor: theme.palette.background.primary,\n ...(color === 'secondary' && {\n backgroundColor: theme.palette.surface.primary,\n }),\n ...(isSelected && {\n backgroundColor: theme.palette.brand.primary,\n borderColor: theme.palette.brand.primary,\n }),\n ...(isSelected &&\n loading && {\n backgroundColor: theme.palette.brandHover.primary,\n borderColor: theme.palette.brandHover.primary,\n }),\n },\n ...(!loading && {\n '& .FlowCard-Icon-root .MuiSvgIcon-root': {\n '&:first-of-type': {\n display: 'block',\n },\n '&:last-of-type': {\n display: 'none',\n },\n },\n }),\n },\n {\n // adjust style of border\n '&::after': {\n boxShadow: `0 0 0 3px ${theme.palette.onSurface.os100}`,\n ...(isSelected && {\n boxShadow: `0 0 0 3px ${theme.palette.brandHover.primary}`,\n }),\n },\n // change style of icon\n '& .FlowCard-Icon-root': {\n backgroundColor: theme.palette.surface.primary,\n ...(color === 'secondary' && {\n backgroundColor: theme.palette.surface.secondary,\n }),\n ...(isSelected && {\n backgroundColor: theme.palette.brandHover.primary,\n borderColor: theme.palette.brandHover.primary,\n }),\n },\n // flip icon being shown\n ...(!loading && {\n '& .FlowCard-Icon-root .MuiSvgIcon-root': {\n '&:first-of-type': {\n display: 'none',\n },\n '&:last-of-type': {\n display: 'block',\n },\n },\n }),\n },\n null,\n null,\n '&:has(.MuiCardActionArea-root.Mui-focusVisible)',\n ),\n },\n ...getFocusRingStyle(\n theme,\n false,\n 3,\n ':has(.MuiCardActionArea-root.Mui-focusVisible, .FlowFlippingCardContent-root.Mui-focusVisible)',\n ),\n }),\n // disabled style\n ...(disabled && {\n backgroundColor: theme.palette.surface.primary,\n borderColor: theme.palette.disabled.secondary,\n cursor: 'not-allowed',\n userSelect: 'none',\n pointerEvents: 'none',\n // change style of icon\n '& .FlowCard-Icon-root': {\n backgroundColor: theme.palette.disabled.secondary,\n color: theme.palette.disabled.tertiary,\n },\n // important selector to overwrite Typography sx color styling\n '&, & .MuiTypography-root': {\n color: theme.palette.disabled.tertiary,\n },\n // change visibility of images\n '& img': {\n opacity: '0.6',\n },\n }),\n }),\n },\n variants: [\n {\n props: { raised: true },\n style: ({ theme }) => ({\n boxShadow: theme.flowShadows['xs'],\n }),\n },\n ],\n};\n"],"names":["flowCard","defaultProps","elevation","component","FlowCard","styleOverrides","root","theme","color","disabled","isSelected","loading","backgroundColor","palette","surface","primary","background","position","borderRadius","overflow","border","content","maxWidth","pointerEvents","zIndex","inset","boxShadow","onSurface","os100","brand","common","white","borderColor","brandHover","getInteractiveStyle","display","secondary","getFocusRingStyle","cursor","userSelect","tertiary","opacity","variants","props","raised","style","flowShadows"],"mappings":"gLAMO,MAAMA,EAAyC,CACpDC,aAAc,CACZC,UAAW,EAEXC,UAAWC,GAEbC,eAAgB,CACdC,KAAM,EAAGC,QAAOC,QAAOC,WAAUC,aAAYC,cAAS,CACpDC,gBAA2B,cAAVJ,EAAwBD,EAAMM,QAAQC,QAAQC,QAAUR,EAAMM,QAAQG,WAAWD,QAClGE,SAAU,WACVC,aAAc,MACdC,SAAU,UAGVC,OAAQ,wBACR,WAAY,CACVC,QAAS,KACTJ,SAAU,WACVK,SAAU,OACVC,cAAe,OACfC,OAAQ,IACRC,MAAO,IACPP,aAAc,UAGdQ,UAAW,aAAanB,EAAMM,QAAQc,UAAUC,YAE3CnB,GACHC,GAAc,CAEZgB,UAAW,aAAanB,EAAMM,QAAQgB,MAAMd,gBAI7CN,GACHC,GAAc,CAEZ,wBAAyB,CACvBF,MAAOD,EAAMM,QAAQiB,OAAOC,MAC5BnB,gBAAiBL,EAAMM,QAAQgB,MAAMd,QACrCiB,YAAazB,EAAMM,QAAQgB,MAAMd,WAC7BJ,GAAW,CACbC,gBAAiBL,EAAMM,QAAQoB,WAAWlB,QAC1CiB,YAAazB,EAAMM,QAAQoB,WAAWlB,UAI1C,UAAW,CACT,WAAY,CACVW,UAAW,aAAanB,EAAMM,QAAQoB,WAAWlB,iBAKpDN,GAAY,CACf,iCAAkC,IAC7ByB,EACD,CACE,WAAY,CACVR,UAAW,aAAanB,EAAMM,QAAQc,UAAUC,WAE5ClB,GAAc,CAChBgB,UAAW,aAAanB,EAAMM,QAAQgB,MAAMd,YAIhD,wBAAyB,CACvBH,gBAAiBL,EAAMM,QAAQG,WAAWD,WAC5B,cAAVP,GAAyB,CAC3BI,gBAAiBL,EAAMM,QAAQC,QAAQC,YAErCL,GAAc,CAChBE,gBAAiBL,EAAMM,QAAQgB,MAAMd,QACrCiB,YAAazB,EAAMM,QAAQgB,MAAMd,YAE/BL,GACFC,GAAW,CACTC,gBAAiBL,EAAMM,QAAQoB,WAAWlB,QAC1CiB,YAAazB,EAAMM,QAAQoB,WAAWlB,cAGvCJ,GAAW,CACd,yCAA0C,CACxC,kBAAmB,CACjBwB,QAAS,SAEX,iBAAkB,CAChBA,QAAS,WAKjB,CAEE,WAAY,CACVT,UAAW,aAAanB,EAAMM,QAAQc,UAAUC,WAC5ClB,GAAc,CAChBgB,UAAW,aAAanB,EAAMM,QAAQoB,WAAWlB,YAIrD,wBAAyB,CACvBH,gBAAiBL,EAAMM,QAAQC,QAAQC,WACzB,cAAVP,GAAyB,CAC3BI,gBAAiBL,EAAMM,QAAQC,QAAQsB,cAErC1B,GAAc,CAChBE,gBAAiBL,EAAMM,QAAQoB,WAAWlB,QAC1CiB,YAAazB,EAAMM,QAAQoB,WAAWlB,cAIrCJ,GAAW,CACd,yCAA0C,CACxC,kBAAmB,CACjBwB,QAAS,QAEX,iBAAkB,CAChBA,QAAS,YAKjB,KACA,KACA,uDAGDE,EACD9B,GACA,EACA,EACA,sGAIAE,GAAY,CACdG,gBAAiBL,EAAMM,QAAQC,QAAQC,QACvCiB,YAAazB,EAAMM,QAAQJ,SAAS2B,UACpCE,OAAQ,cACRC,WAAY,OACZhB,cAAe,OAEf,wBAAyB,CACvBX,gBAAiBL,EAAMM,QAAQJ,SAAS2B,UACxC5B,MAAOD,EAAMM,QAAQJ,SAAS+B,UAGhC,2BAA4B,CAC1BhC,MAAOD,EAAMM,QAAQJ,SAAS+B,UAGhC,QAAS,CACPC,QAAS,WAKjBC,SAAU,CACR,CACEC,MAAO,CAAEC,QAAQ,GACjBC,MAAO,EAAGtC,YAAO,CACfmB,UAAWnB,EAAMuC,YAAgB"}

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

@@ -1,2 +1,2 @@
-const e={styleOverrides:{root:({theme:e})=>({borderColor:e.palette.surface.secondary,"&:after, &:before":{borderColor:"inherit"}})}};export{e as flowDivider};
+const e={defaultProps:{"aria-hidden":!0},styleOverrides:{root:({theme:e})=>({borderColor:e.palette.surface.secondary,"&:after, &:before":{borderColor:"inherit"}})}};export{e as flowDivider};
 //# sourceMappingURL=divider.theme.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"divider.theme.js","sources":["../../../src/materialui/divider/divider.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\n\nexport const flowDivider: Components<Theme>['MuiDivider'] = {\n styleOverrides: {\n root: ({ theme }) => ({\n borderColor: theme.palette.surface.secondary,\n '&:after, &:before': {\n borderColor: 'inherit',\n },\n }),\n },\n};\n"],"names":["flowDivider","styleOverrides","root","theme","borderColor","palette","surface","secondary"],"mappings":"AAGO,MAAMA,EAA+C,CAC1DC,eAAgB,CACdC,KAAM,EAAGC,YAAO,CACdC,YAAaD,EAAME,QAAQC,QAAQC,UACnC,oBAAqB,CACnBH,YAAa"}
1	+ {"version":3,"file":"divider.theme.js","sources":["../../../src/materialui/divider/divider.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\n\nexport const flowDivider: Components<Theme>['MuiDivider'] = {\n defaultProps: {\n // decorative line, Flow does not support content inside\n ['aria-hidden']: true,\n },\n styleOverrides: {\n root: ({ theme }) => ({\n borderColor: theme.palette.surface.secondary,\n '&:after, &:before': {\n borderColor: 'inherit',\n },\n }),\n },\n};\n"],"names":["flowDivider","defaultProps","styleOverrides","root","theme","borderColor","palette","surface","secondary"],"mappings":"AAGO,MAAMA,EAA+C,CAC1DC,aAAc,CAEZ,eAAiB,GAEnBC,eAAgB,CACdC,KAAM,EAAGC,YAAO,CACdC,YAAaD,EAAME,QAAQC,QAAQC,UACnC,oBAAqB,CACnBH,YAAa"}

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

@@ -1,2 +1,2 @@
-import r from"@skodaflow/web-tokens/src/tokens.json";const a=(a,e)=>{const t=r["flow-typography"].find(r=>r.name===`${e}-${a}`);return t?{height:t.style.lineHeight}:{}},e=(r,e)=>({...a(r,"small"),[e.breakpoints.up("md")]:{...a(r,"medium")},[e.breakpoints.up("xl")]:{...a(r,"large")}}),t=()=>({borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%"}),s={defaultProps:{animation:"wave","aria-label":"placeholder",role:"progressbar"},styleOverrides:{text:{borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%"},circular:{flexShrink:"0"},wave:({theme:r})=>({backgroundColor:r.palette.onSurface.os100,"&:after":{background:`\n          linear-gradient(\n            90deg,\n            transparent,\n            ${r.palette.surface.secondary},\n            transparent\n          )\n        `},..."dark"===r.palette.mode&&{backgroundColor:r.palette.surface.secondary,"&:after":{background:`\n             linear-gradient(\n               90deg,\n               transparent,\n               ${r.palette.surface.primary},\n               transparent\n             )\n           `}}})},variants:[{props:{variant:"display"},style:({theme:r})=>({...e("display",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"600px"})},{props:{variant:"h1"},style:({theme:r})=>({...e("h1",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"540px"})},{props:{variant:"h2"},style:({theme:r})=>({...e("h2",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"510px"})},{props:{variant:"h3"},style:({theme:r})=>({...e("h3",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"480px"})},{props:{variant:"h4"},style:({theme:r})=>({...e("h4",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"450px"})},{props:{variant:"subheadline"},style:({theme:r})=>({...e("subheadline",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"420px"})},{props:{variant:"body"},style:({theme:r})=>({...e("body",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"480px"})},{props:{variant:"disclaimer"},style:({theme:r})=>({...e("disclaimer",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"360px"})},{props:{variant:"disclaimer1"},style:({theme:r})=>({...e("disclaimer1",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"360px"})},{props:{variant:"disclaimer2"},style:({theme:r})=>({...e("disclaimer2",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"360px"})},{props:{variant:"caption1"},style:({theme:r})=>({...e("caption1",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"300px"})},{props:{variant:"caption2"},style:({theme:r})=>({...e("caption2",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"300px"})},{props:{variant:"list"},style:({theme:r})=>({...e("list",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"600px"})}]};export{s as flowSkeleton,e as getResponsiveLineHeight,t as getTextVariantStyle,a as getTypographyLineHeight};
+import r from"@skodaflow/web-tokens/src/tokens.json";const a=(a,e)=>{const t=r["flow-typography"].find(r=>r.name===`${e}-${a}`);return t?{height:t.style.lineHeight}:{}},e=(r,e)=>({...a(r,"small"),[e.breakpoints.up("md")]:{...a(r,"medium")},[e.breakpoints.up("xl")]:{...a(r,"large")}}),t=()=>({borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%"}),s={defaultProps:{animation:"wave","aria-hidden":!0},styleOverrides:{text:{borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%"},circular:{flexShrink:"0"},wave:({theme:r})=>({backgroundColor:r.palette.onSurface.os100,"&:after":{background:`\n          linear-gradient(\n            90deg,\n            transparent,\n            ${r.palette.surface.secondary},\n            transparent\n          )\n        `},..."dark"===r.palette.mode&&{backgroundColor:r.palette.surface.secondary,"&:after":{background:`\n             linear-gradient(\n               90deg,\n               transparent,\n               ${r.palette.surface.primary},\n               transparent\n             )\n           `}}})},variants:[{props:{variant:"display"},style:({theme:r})=>({...e("display",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"600px"})},{props:{variant:"h1"},style:({theme:r})=>({...e("h1",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"540px"})},{props:{variant:"h2"},style:({theme:r})=>({...e("h2",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"510px"})},{props:{variant:"h3"},style:({theme:r})=>({...e("h3",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"480px"})},{props:{variant:"h4"},style:({theme:r})=>({...e("h4",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"450px"})},{props:{variant:"subheadline"},style:({theme:r})=>({...e("subheadline",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"420px"})},{props:{variant:"body"},style:({theme:r})=>({...e("body",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"480px"})},{props:{variant:"disclaimer"},style:({theme:r})=>({...e("disclaimer",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"360px"})},{props:{variant:"disclaimer1"},style:({theme:r})=>({...e("disclaimer1",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"360px"})},{props:{variant:"disclaimer2"},style:({theme:r})=>({...e("disclaimer2",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"360px"})},{props:{variant:"caption1"},style:({theme:r})=>({...e("caption1",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"300px"})},{props:{variant:"caption2"},style:({theme:r})=>({...e("caption2",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"300px"})},{props:{variant:"list"},style:({theme:r})=>({...e("list",r),borderRadius:"4px",transform:"scale(1, 0.60)",transformOrigin:"0 55%",width:"600px"})}]};export{s as flowSkeleton,e as getResponsiveLineHeight,t as getTextVariantStyle,a as getTypographyLineHeight};
 //# sourceMappingURL=skeleton.theme.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"skeleton.theme.js","sources":["../../../src/materialui/skeleton/skeleton.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { CSSObject, Theme } from '@mui/material';\nimport tokens from '@skodaflow/web-tokens/src/tokens.json';\nimport { TypographySize } from '../typography/typography.theme';\n\nexport const getTypographyLineHeight = (element: string, size: TypographySize): CSSObject => {\n const typo = tokens['flow-typography'].find((el) => el.name === `${size}-${element}`);\n if (typo) {\n return {\n height: typo['style'].lineHeight,\n };\n } else {\n return {};\n }\n};\n\nexport const getResponsiveLineHeight = (element: string, theme: Theme): CSSObject => {\n return {\n ...getTypographyLineHeight(element, 'small'),\n [theme.breakpoints.up('md')]: {\n ...getTypographyLineHeight(element, 'medium'),\n },\n [theme.breakpoints.up('xl')]: {\n ...getTypographyLineHeight(element, 'large'),\n },\n };\n};\n\nexport const getTextVariantStyle = (): CSSObject => ({\n borderRadius: '4px',\n // style taken from @mui, lowering size\n transform: 'scale(1, 0.60)',\n transformOrigin: '0 55%',\n});\n\nexport const flowSkeleton: Components<Theme>['MuiSkeleton'] = {\n defaultProps: {\n animation: 'wave',\n ['aria-~~label~~']: ~~'placeholder'~~,\n ~~role: 'progressbar',\n~~ },\n styleOverrides: {\n text: {\n ...getTextVariantStyle(),\n },\n circular: {\n flexShrink: '0',\n },\n wave: ({ theme }) => ({\n backgroundColor: theme.palette.onSurface.os100,\n '&:after': {\n background: `\n linear-gradient(\n 90deg,\n transparent,\n ${theme.palette.surface.secondary},\n transparent\n )\n `,\n },\n ...(theme.palette.mode === 'dark' && {\n backgroundColor: theme.palette.surface.secondary,\n '&:after': {\n background: `\n linear-gradient(\n 90deg,\n transparent,\n ${theme.palette.surface.primary},\n transparent\n )\n `,\n },\n }),\n }),\n },\n variants: [\n {\n props: { variant: 'display' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('display', theme),\n ...getTextVariantStyle(),\n width: '600px',\n }),\n },\n {\n props: { variant: 'h1' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('h1', theme),\n ...getTextVariantStyle(),\n width: '540px',\n }),\n },\n {\n props: { variant: 'h2' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('h2', theme),\n ...getTextVariantStyle(),\n width: '510px',\n }),\n },\n {\n props: { variant: 'h3' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('h3', theme),\n ...getTextVariantStyle(),\n width: '480px',\n }),\n },\n {\n props: { variant: 'h4' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('h4', theme),\n ...getTextVariantStyle(),\n width: '450px',\n }),\n },\n {\n props: { variant: 'subheadline' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('subheadline', theme),\n ...getTextVariantStyle(),\n width: '420px',\n }),\n },\n {\n props: { variant: 'body' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('body', theme),\n ...getTextVariantStyle(),\n width: '480px',\n }),\n },\n {\n props: { variant: 'disclaimer' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('disclaimer', theme),\n ...getTextVariantStyle(),\n width: '360px',\n }),\n },\n {\n props: { variant: 'disclaimer1' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('disclaimer1', theme),\n ...getTextVariantStyle(),\n width: '360px',\n }),\n },\n {\n props: { variant: 'disclaimer2' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('disclaimer2', theme),\n ...getTextVariantStyle(),\n width: '360px',\n }),\n },\n {\n props: { variant: 'caption1' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('caption1', theme),\n ...getTextVariantStyle(),\n width: '300px',\n }),\n },\n {\n props: { variant: 'caption2' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('caption2', theme),\n ...getTextVariantStyle(),\n width: '300px',\n }),\n },\n {\n props: { variant: 'list' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('list', theme),\n ...getTextVariantStyle(),\n width: '600px',\n }),\n },\n ],\n};\n"],"names":["getTypographyLineHeight","element","size","typo","tokens","find","el","name","height","lineHeight","getResponsiveLineHeight","theme","breakpoints","up","getTextVariantStyle","borderRadius","transform","transformOrigin","flowSkeleton","defaultProps","animation","~~role","~~styleOverrides","text","circular","flexShrink","wave","backgroundColor","palette","onSurface","os100","background","surface","secondary","mode","primary","variants","props","variant","style","width"],"mappings":"2DAKaA,EAA0B,CAACC,EAAiBC,KACvD,MAAMC,EAAOC,EAAO,mBAAmBC,KAAMC,GAAOA,EAAGC,OAAS,GAAGL,KAAQD,KAC3E,OAAIE,EACK,CACLK,OAAQL,EAAY,MAAEM,YAGjB,CAAA,GAIEC,EAA0B,CAACT,EAAiBU,KAChD,IACFX,EAAwBC,EAAS,SACpC,CAACU,EAAMC,YAAYC,GAAG,OAAQ,IACzBb,EAAwBC,EAAS,WAEtC,CAACU,EAAMC,YAAYC,GAAG,OAAQ,IACzBb,EAAwBC,EAAS,YAK7Ba,EAAsB,KAAA,CACjCC,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,UAGNC,EAAiD,CAC5DC,aAAc,CACZC,UAAW,~~OACX~~,~~aAAgB~~,~~cAChBC~~,~~KAAM,eAERC,~~eAAgB,CACdC,KAAM,~~CAbRR~~,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,~~SAafO~~,SAAU,CACRC,WAAY,KAEdC,KAAM,~~EAAGf~~,YAAO,~~CACdgB~~,~~gBAAiBhB~~,~~EAAMiB~~,QAAQC,UAAUC,MACzC,UAAW,CACTC,WAAY,~~2FAINpB~~,~~EAAMiB~~,QAAQI,QAAQC,iEAKH,~~SAAvBtB~~,~~EAAMiB~~,QAAQM,MAAmB,CACnCP,~~gBAAiBhB~~,~~EAAMiB~~,QAAQI,QAAQC,UACvC,UAAW,CACTF,WAAY,~~uGAILpB~~,~~EAAMiB~~,QAAQI,QAAQG,yEAQrCC,SAAU,CACR,CACEC,MAAO,CAAEC,QAAS,WAClBC,MAAO,~~EAAG5B~~,YAAO,IACZD,EAAwB,UAAWC,GAlD5CI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,~~QAiDXuB~~,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,MAClBC,MAAO,~~EAAG5B~~,YAAO,IACZD,EAAwB,KAAMC,GA1DvCI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,~~QAyDXuB~~,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,MAClBC,MAAO,~~EAAG5B~~,YAAO,IACZD,EAAwB,KAAMC,GAlEvCI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,~~QAiEXuB~~,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,MAClBC,MAAO,~~EAAG5B~~,YAAO,IACZD,EAAwB,KAAMC,GA1EvCI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,~~QAyEXuB~~,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,MAClBC,MAAO,~~EAAG5B~~,YAAO,IACZD,EAAwB,KAAMC,GAlFvCI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,~~QAiFXuB~~,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,eAClBC,MAAO,~~EAAG5B~~,YAAO,IACZD,EAAwB,cAAeC,GA1FhDI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,~~QAyFXuB~~,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,QAClBC,MAAO,~~EAAG5B~~,YAAO,IACZD,EAAwB,OAAQC,GAlGzCI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,~~QAiGXuB~~,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,cAClBC,MAAO,~~EAAG5B~~,YAAO,IACZD,EAAwB,aAAcC,GA1G/CI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,~~QAyGXuB~~,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,eAClBC,MAAO,~~EAAG5B~~,YAAO,IACZD,EAAwB,cAAeC,GAlHhDI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,~~QAiHXuB~~,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,eAClBC,MAAO,~~EAAG5B~~,YAAO,IACZD,EAAwB,cAAeC,GA1HhDI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,~~QAyHXuB~~,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,YAClBC,MAAO,~~EAAG5B~~,YAAO,IACZD,EAAwB,WAAYC,GAlI7CI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,~~QAiIXuB~~,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,YAClBC,MAAO,~~EAAG5B~~,YAAO,IACZD,EAAwB,WAAYC,GA1I7CI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,~~QAyIXuB~~,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,QAClBC,MAAO,~~EAAG5B~~,YAAO,IACZD,EAAwB,OAAQC,GAlJzCI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,~~QAiJXuB~~,MAAO"}
1	+ {"version":3,"file":"skeleton.theme.js","sources":["../../../src/materialui/skeleton/skeleton.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { CSSObject, Theme } from '@mui/material';\nimport tokens from '@skodaflow/web-tokens/src/tokens.json';\nimport { TypographySize } from '../typography/typography.theme';\n\nexport const getTypographyLineHeight = (element: string, size: TypographySize): CSSObject => {\n const typo = tokens['flow-typography'].find((el) => el.name === `${size}-${element}`);\n if (typo) {\n return {\n height: typo['style'].lineHeight,\n };\n } else {\n return {};\n }\n};\n\nexport const getResponsiveLineHeight = (element: string, theme: Theme): CSSObject => {\n return {\n ...getTypographyLineHeight(element, 'small'),\n [theme.breakpoints.up('md')]: {\n ...getTypographyLineHeight(element, 'medium'),\n },\n [theme.breakpoints.up('xl')]: {\n ...getTypographyLineHeight(element, 'large'),\n },\n };\n};\n\nexport const getTextVariantStyle = (): CSSObject => ({\n borderRadius: '4px',\n // style taken from @mui, lowering size\n transform: 'scale(1, 0.60)',\n transformOrigin: '0 55%',\n});\n\nexport const flowSkeleton: Components<Theme>['MuiSkeleton'] = {\n defaultProps: {\n animation: 'wave',\n // decorative placeholder, the loading state is announced by aria-busy on the loaded region\n ['aria-hidden']: true,\n },\n styleOverrides: {\n text: {\n ...getTextVariantStyle(),\n },\n circular: {\n flexShrink: '0',\n },\n wave: ({ theme }) => ({\n backgroundColor: theme.palette.onSurface.os100,\n '&:after': {\n background: `\n linear-gradient(\n 90deg,\n transparent,\n ${theme.palette.surface.secondary},\n transparent\n )\n `,\n },\n ...(theme.palette.mode === 'dark' && {\n backgroundColor: theme.palette.surface.secondary,\n '&:after': {\n background: `\n linear-gradient(\n 90deg,\n transparent,\n ${theme.palette.surface.primary},\n transparent\n )\n `,\n },\n }),\n }),\n },\n variants: [\n {\n props: { variant: 'display' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('display', theme),\n ...getTextVariantStyle(),\n width: '600px',\n }),\n },\n {\n props: { variant: 'h1' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('h1', theme),\n ...getTextVariantStyle(),\n width: '540px',\n }),\n },\n {\n props: { variant: 'h2' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('h2', theme),\n ...getTextVariantStyle(),\n width: '510px',\n }),\n },\n {\n props: { variant: 'h3' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('h3', theme),\n ...getTextVariantStyle(),\n width: '480px',\n }),\n },\n {\n props: { variant: 'h4' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('h4', theme),\n ...getTextVariantStyle(),\n width: '450px',\n }),\n },\n {\n props: { variant: 'subheadline' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('subheadline', theme),\n ...getTextVariantStyle(),\n width: '420px',\n }),\n },\n {\n props: { variant: 'body' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('body', theme),\n ...getTextVariantStyle(),\n width: '480px',\n }),\n },\n {\n props: { variant: 'disclaimer' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('disclaimer', theme),\n ...getTextVariantStyle(),\n width: '360px',\n }),\n },\n {\n props: { variant: 'disclaimer1' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('disclaimer1', theme),\n ...getTextVariantStyle(),\n width: '360px',\n }),\n },\n {\n props: { variant: 'disclaimer2' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('disclaimer2', theme),\n ...getTextVariantStyle(),\n width: '360px',\n }),\n },\n {\n props: { variant: 'caption1' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('caption1', theme),\n ...getTextVariantStyle(),\n width: '300px',\n }),\n },\n {\n props: { variant: 'caption2' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('caption2', theme),\n ...getTextVariantStyle(),\n width: '300px',\n }),\n },\n {\n props: { variant: 'list' },\n style: ({ theme }) => ({\n ...getResponsiveLineHeight('list', theme),\n ...getTextVariantStyle(),\n width: '600px',\n }),\n },\n ],\n};\n"],"names":["getTypographyLineHeight","element","size","typo","tokens","find","el","name","height","lineHeight","getResponsiveLineHeight","theme","breakpoints","up","getTextVariantStyle","borderRadius","transform","transformOrigin","flowSkeleton","defaultProps","animation","styleOverrides","text","circular","flexShrink","wave","backgroundColor","palette","onSurface","os100","background","surface","secondary","mode","primary","variants","props","variant","style","width"],"mappings":"2DAKaA,EAA0B,CAACC,EAAiBC,KACvD,MAAMC,EAAOC,EAAO,mBAAmBC,KAAMC,GAAOA,EAAGC,OAAS,GAAGL,KAAQD,KAC3E,OAAIE,EACK,CACLK,OAAQL,EAAY,MAAEM,YAGjB,CAAA,GAIEC,EAA0B,CAACT,EAAiBU,KAChD,IACFX,EAAwBC,EAAS,SACpC,CAACU,EAAMC,YAAYC,GAAG,OAAQ,IACzBb,EAAwBC,EAAS,WAEtC,CAACU,EAAMC,YAAYC,GAAG,OAAQ,IACzBb,EAAwBC,EAAS,YAK7Ba,EAAsB,KAAA,CACjCC,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,UAGNC,EAAiD,CAC5DC,aAAc,CACZC,UAAW,OAEX,eAAiB,GAEnBC,eAAgB,CACdC,KAAM,CAbRP,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,SAafM,SAAU,CACRC,WAAY,KAEdC,KAAM,EAAGd,YAAO,CACde,gBAAiBf,EAAMgB,QAAQC,UAAUC,MACzC,UAAW,CACTC,WAAY,2FAINnB,EAAMgB,QAAQI,QAAQC,iEAKH,SAAvBrB,EAAMgB,QAAQM,MAAmB,CACnCP,gBAAiBf,EAAMgB,QAAQI,QAAQC,UACvC,UAAW,CACTF,WAAY,uGAILnB,EAAMgB,QAAQI,QAAQG,yEAQrCC,SAAU,CACR,CACEC,MAAO,CAAEC,QAAS,WAClBC,MAAO,EAAG3B,YAAO,IACZD,EAAwB,UAAWC,GAlD5CI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,QAiDXsB,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,MAClBC,MAAO,EAAG3B,YAAO,IACZD,EAAwB,KAAMC,GA1DvCI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,QAyDXsB,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,MAClBC,MAAO,EAAG3B,YAAO,IACZD,EAAwB,KAAMC,GAlEvCI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,QAiEXsB,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,MAClBC,MAAO,EAAG3B,YAAO,IACZD,EAAwB,KAAMC,GA1EvCI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,QAyEXsB,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,MAClBC,MAAO,EAAG3B,YAAO,IACZD,EAAwB,KAAMC,GAlFvCI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,QAiFXsB,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,eAClBC,MAAO,EAAG3B,YAAO,IACZD,EAAwB,cAAeC,GA1FhDI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,QAyFXsB,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,QAClBC,MAAO,EAAG3B,YAAO,IACZD,EAAwB,OAAQC,GAlGzCI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,QAiGXsB,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,cAClBC,MAAO,EAAG3B,YAAO,IACZD,EAAwB,aAAcC,GA1G/CI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,QAyGXsB,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,eAClBC,MAAO,EAAG3B,YAAO,IACZD,EAAwB,cAAeC,GAlHhDI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,QAiHXsB,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,eAClBC,MAAO,EAAG3B,YAAO,IACZD,EAAwB,cAAeC,GA1HhDI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,QAyHXsB,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,YAClBC,MAAO,EAAG3B,YAAO,IACZD,EAAwB,WAAYC,GAlI7CI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,QAiIXsB,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,YAClBC,MAAO,EAAG3B,YAAO,IACZD,EAAwB,WAAYC,GA1I7CI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,QAyIXsB,MAAO,WAGX,CACEH,MAAO,CAAEC,QAAS,QAClBC,MAAO,EAAG3B,YAAO,IACZD,EAAwB,OAAQC,GAlJzCI,aAAc,MAEdC,UAAW,iBACXC,gBAAiB,QAiJXsB,MAAO"}

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

@@ -1,2 +1,2 @@
-import{getFocusRingStyle as e}from"../../components/focusring/focusring.js";const o=40,t=20,a={defaultProps:{min:0,max:100,step:1,valueLabelDisplay:"auto",marks:!1},styleOverrides:{root:({theme:e,ownerState:o})=>({display:"block",borderRadius:"0",padding:"13px 0",..."vertical"===o.orientation?{width:"6px",height:"320px"}:{height:"6px"},"&.Mui-disabled":{"& .MuiSlider-rail":{color:e.palette.disabled.primary},"& .MuiSlider-track":{color:e.palette.disabled.tertiary},"& .MuiSlider-mark":{backgroundColor:"dark"===e.palette.mode?e.palette.onSurface.os900:e.palette.onSurface.os0,"&.MuiSlider-markActive":{backgroundColor:"dark"===e.palette.mode?e.palette.onSurface.os900:e.palette.onSurface.os0}},"& .MuiSlider-thumb":{borderColor:e.palette.disabled.tertiary}}}),rail:({theme:e})=>({borderRadius:"6px",opacity:"1",color:e.palette.onSurface.os500,transform:"translate3d(0px, -50%, 0px)"}),track:({theme:e})=>({borderRadius:"6px",border:"none",color:"dark"===e.palette.mode?e.palette.brand.secondary:e.palette.brand.primary,transform:"translate3d(0px, -50%, 0px)"}),mark:({theme:e})=>({height:"4px",width:"4px",borderRadius:"4px",opacity:"1",backgroundColor:"dark"===e.palette.mode?e.palette.onSurface.os900:e.palette.onSurface.os0,"&.MuiSlider-markActive":{backgroundColor:"dark"===e.palette.mode?e.palette.onSurface.os900:e.palette.onSurface.os0}}),thumb:({theme:o,ownerState:t})=>({..."vertical"===t.orientation?{width:"20px",height:"40px"}:{width:"40px",height:"20px"},borderRadius:"20px",backgroundColor:o.palette.onSurface.os0,border:`1px solid ${o.palette.onSurface.os900}`,"&:after":{width:"40px",height:"40px",borderRadius:"1000px"},...e(o,!0,1),transition:"box-shadow 0.3s ease-out","&, &:hover, &.Mui-active":{boxShadow:"none"},"&.Mui-focusVisible":{boxShadow:`0 0 0 2px ${o.palette.background.primary}`,"&.Mui-active":{boxShadow:"none",outline:`0px solid ${o.palette.background.primary}`,"&:before":{boxShadow:"none"}}}}),valueLabel:({theme:e})=>({maxWidth:"none",top:"-12px",backgroundColor:e.palette.text.primary,color:e.palette.background.primary,borderRadius:"2px",padding:"8px 12px",[e.breakpoints.up("xs")]:{fontSize:"12px",lineHeight:"16px",fontWeight:"400"}})}};export{a as flowSlider,t as flowThumbHeight,o as flowThumbWidth};
+import{getFocusRingStyle as e}from"../../components/focusring/focusring.js";const o=40,a=20,t={defaultProps:{min:0,max:100,step:1,valueLabelDisplay:"auto",marks:!1},styleOverrides:{root:({theme:e,ownerState:o})=>({display:"block",borderRadius:"0",padding:"13px 0","@media (pointer: coarse)":{padding:"13px 0"},..."vertical"===o.orientation?{width:"6px",height:"320px"}:{height:"6px"},"&.Mui-disabled":{"& .MuiSlider-rail":{color:e.palette.disabled.primary},"& .MuiSlider-track":{color:e.palette.disabled.tertiary},"& .MuiSlider-mark":{backgroundColor:"dark"===e.palette.mode?e.palette.onSurface.os900:e.palette.onSurface.os0,"&.MuiSlider-markActive":{backgroundColor:"dark"===e.palette.mode?e.palette.onSurface.os900:e.palette.onSurface.os0}},"& .MuiSlider-thumb":{borderColor:e.palette.disabled.tertiary}}}),rail:({theme:e})=>({borderRadius:"6px",opacity:"1",color:e.palette.onSurface.os500,transform:"translate3d(0px, -50%, 0px)"}),track:({theme:e})=>({borderRadius:"6px",border:"none",color:"dark"===e.palette.mode?e.palette.brand.secondary:e.palette.brand.primary,transform:"translate3d(0px, -50%, 0px)"}),mark:({theme:e})=>({height:"4px",width:"4px",borderRadius:"4px",opacity:"1",backgroundColor:"dark"===e.palette.mode?e.palette.onSurface.os900:e.palette.onSurface.os0,"&.MuiSlider-markActive":{backgroundColor:"dark"===e.palette.mode?e.palette.onSurface.os900:e.palette.onSurface.os0}}),thumb:({theme:o,ownerState:a})=>({..."vertical"===a.orientation?{width:"20px",height:"40px"}:{width:"40px",height:"20px"},borderRadius:"20px",backgroundColor:o.palette.onSurface.os0,border:`1px solid ${o.palette.onSurface.os900}`,"&:after":{width:"40px",height:"40px",borderRadius:"1000px"},...e(o,!0,1),transition:"box-shadow 0.3s ease-out","&, &:hover, &.Mui-active":{boxShadow:"none"},"&.Mui-focusVisible":{boxShadow:`0 0 0 2px ${o.palette.background.primary}`,"&.Mui-active":{boxShadow:"none",outline:`0px solid ${o.palette.background.primary}`,"&:before":{boxShadow:"none"}}}}),valueLabel:({theme:e})=>({maxWidth:"none",top:"-12px",backgroundColor:e.palette.text.primary,color:e.palette.background.primary,borderRadius:"2px",padding:"8px 12px",[e.breakpoints.up("xs")]:{fontSize:"12px",lineHeight:"16px",fontWeight:"400"}})}};export{t as flowSlider,a as flowThumbHeight,o as flowThumbWidth};
 //# sourceMappingURL=slider.theme.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"slider.theme.js","sources":["../../../src/materialui/slider/slider.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\n\n// make sure the value can be divided by 2\nexport const flowThumbWidth = 40;\nexport const flowThumbHeight = 20;\n\nexport const flowSlider: Components<Theme>['MuiSlider'] = {\n defaultProps: {\n // value properties\n min: 0,\n max: 100,\n step: 1,\n // display label with hover\n valueLabelDisplay: 'auto',\n // disable auto-generated marks, it is recommended to use ./getSliderMarks.ts function\n marks: false,\n },\n styleOverrides: {\n root: ({ theme, ownerState }) => ({\n display: 'block',\n borderRadius: '0',\n // 32px height\n padding: '13px 0',\n ...(ownerState.orientation === 'vertical'\n ? {\n width: '6px',\n height: '320px',\n }\n : {\n height: '6px',\n }),\n // disabled state\n '&.Mui-disabled': {\n '& .MuiSlider-rail': {\n color: theme.palette.disabled.primary,\n },\n '& .MuiSlider-track': {\n color: theme.palette.disabled.tertiary,\n },\n '& .MuiSlider-mark': {\n backgroundColor: theme.palette.mode === 'dark' ? theme.palette.onSurface.os900 : theme.palette.onSurface.os0,\n '&.MuiSlider-markActive': {\n backgroundColor:\n theme.palette.mode === 'dark' ? theme.palette.onSurface.os900 : theme.palette.onSurface.os0,\n },\n },\n '& .MuiSlider-thumb': {\n borderColor: theme.palette.disabled.tertiary,\n },\n },\n }),\n // whole rail bellow the thumb\n rail: ({ theme }) => ({\n borderRadius: '6px',\n opacity: '1',\n color: theme.palette.onSurface.os500,\n // add translate3d, in addition to translateY(-50%), to prevent overflowing borderRadius\n transform: 'translate3d(0px, -50%, 0px)',\n }),\n // track marking selected segment\n track: ({ theme }) => ({\n borderRadius: '6px',\n border: 'none',\n color: theme.palette.mode === 'dark' ? theme.palette.brand.secondary : theme.palette.brand.primary,\n // add translate3d, in addition to translateY(-50%), to prevent overflowing borderRadius\n transform: 'translate3d(0px, -50%, 0px)',\n }),\n // dot on the rail and track\n mark: ({ theme }) => ({\n height: '4px',\n width: '4px',\n borderRadius: '4px',\n opacity: '1',\n backgroundColor: theme.palette.mode === 'dark' ? theme.palette.onSurface.os900 : theme.palette.onSurface.os0,\n '&.MuiSlider-markActive': {\n backgroundColor: theme.palette.mode === 'dark' ? theme.palette.onSurface.os900 : theme.palette.onSurface.os0,\n },\n }),\n // pointer\n thumb: ({ theme, ownerState }) => ({\n ...(ownerState.orientation === 'vertical'\n ? {\n width: `${flowThumbHeight}px`,\n height: `${flowThumbWidth}px`,\n }\n : {\n width: `${flowThumbWidth}px`,\n height: `${flowThumbHeight}px`,\n }),\n borderRadius: `${flowThumbHeight}px`,\n backgroundColor: theme.palette.onSurface.os0,\n border: `1px solid ${theme.palette.onSurface.os900}`,\n // hitbox target\n '&:after': {\n width: `${flowThumbWidth}px`,\n height: `${flowThumbWidth}px`,\n borderRadius: '1000px',\n },\n // focus style\n ...getFocusRingStyle(theme, true, 1),\n // extra shadow around\n transition: 'box-shadow 0.3s ease-out',\n '&, &:hover, &.Mui-active': {\n boxShadow: `none`,\n },\n '&.Mui-focusVisible': {\n // extra white border\n boxShadow: `0 0 0 2px ${theme.palette.background.primary}`,\n // hide focus during dragging\n '&.Mui-active': {\n boxShadow: 'none',\n outline: `0px solid ${theme.palette.background.primary}`,\n '&:before': {\n boxShadow: 'none',\n },\n },\n },\n }),\n // label above thumb\n valueLabel: ({ theme }) => ({\n maxWidth: 'none',\n // increase space between thumb and tooltip\n top: '-12px',\n // style box\n backgroundColor: theme.palette.text.primary,\n color: theme.palette.background.primary,\n borderRadius: '2px',\n padding: '8px 12px',\n // custom font-size\n [theme.breakpoints.up('xs')]: {\n fontSize: '12px',\n lineHeight: '16px',\n fontWeight: '400',\n },\n }),\n },\n};\n"],"names":["flowThumbWidth","flowThumbHeight","flowSlider","defaultProps","min","max","step","valueLabelDisplay","marks","styleOverrides","root","theme","ownerState","display","borderRadius","padding","orientation","width","height","color","palette","disabled","primary","tertiary","backgroundColor","mode","onSurface","os900","os0","borderColor","rail","opacity","os500","transform","track","border","brand","secondary","mark","thumb","getFocusRingStyle","transition","boxShadow","background","outline","valueLabel","maxWidth","top","text","breakpoints","up","fontSize","lineHeight","fontWeight"],"mappings":"4EAKO,MAAMA,EAAiB,GACjBC,EAAkB,GAElBC,EAA6C,CACxDC,aAAc,CAEZC,IAAK,EACLC,IAAK,IACLC,KAAM,EAENC,kBAAmB,OAEnBC,OAAO,GAETC,eAAgB,CACdC,KAAM,EAAGC,QAAOC,iBAAY,CAC1BC,QAAS,QACTC,aAAc,IAEdC,QAAS,~~YACsB~~,aAA3BH,EAAWI,YACX,CACEC,MAAO,MACPC,OAAQ,SAEV,CACEA,OAAQ,OAGd,iBAAkB,CAChB,oBAAqB,CACnBC,MAAOR,EAAMS,QAAQC,SAASC,SAEhC,qBAAsB,CACpBH,MAAOR,EAAMS,QAAQC,SAASE,UAEhC,oBAAqB,CACnBC,gBAAwC,SAAvBb,EAAMS,QAAQK,KAAkBd,EAAMS,QAAQM,UAAUC,MAAQhB,EAAMS,QAAQM,UAAUE,IACzG,yBAA0B,CACxBJ,gBACyB,SAAvBb,EAAMS,QAAQK,KAAkBd,EAAMS,QAAQM,UAAUC,MAAQhB,EAAMS,QAAQM,UAAUE,MAG9F,qBAAsB,CACpBC,YAAalB,EAAMS,QAAQC,SAASE,aAK1CO,KAAM,EAAGnB,YAAO,CACdG,aAAc,MACdiB,QAAS,IACTZ,MAAOR,EAAMS,QAAQM,UAAUM,MAE/BC,UAAW,gCAGbC,MAAO,EAAGvB,YAAO,CACfG,aAAc,MACdqB,OAAQ,OACRhB,MAA8B,SAAvBR,EAAMS,QAAQK,KAAkBd,EAAMS,QAAQgB,MAAMC,UAAY1B,EAAMS,QAAQgB,MAAMd,QAE3FW,UAAW,gCAGbK,KAAM,EAAG3B,YAAO,CACdO,OAAQ,MACRD,MAAO,MACPH,aAAc,MACdiB,QAAS,IACTP,gBAAwC,SAAvBb,EAAMS,QAAQK,KAAkBd,EAAMS,QAAQM,UAAUC,MAAQhB,EAAMS,QAAQM,UAAUE,IACzG,yBAA0B,CACxBJ,gBAAwC,SAAvBb,EAAMS,QAAQK,KAAkBd,EAAMS,QAAQM,UAAUC,MAAQhB,EAAMS,QAAQM,UAAUE,OAI7GW,MAAO,EAAG5B,QAAOC,iBAAY,IACI,aAA3BA,EAAWI,YACX,CACEC,MAAO,OACPC,OAAQ,QAEV,CACED,MAAO,OACPC,OAAQ,QAEdJ,aAAc,OACdU,gBAAiBb,EAAMS,QAAQM,UAAUE,IACzCO,OAAQ,aAAaxB,EAAMS,QAAQM,UAAUC,QAE7C,UAAW,CACTV,MAAO,OACPC,OAAQ,OACRJ,aAAc,aAGb0B,EAAkB7B,GAAO,EAAM,GAElC8B,WAAY,2BACZ,2BAA4B,CAC1BC,UAAW,QAEb,qBAAsB,CAEpBA,UAAW,aAAa/B,EAAMS,QAAQuB,WAAWrB,UAEjD,eAAgB,CACdoB,UAAW,OACXE,QAAS,aAAajC,EAAMS,QAAQuB,WAAWrB,UAC/C,WAAY,CACVoB,UAAW,YAMnBG,WAAY,EAAGlC,YAAO,CACpBmC,SAAU,OAEVC,IAAK,QAELvB,gBAAiBb,EAAMS,QAAQ4B,KAAK1B,QACpCH,MAAOR,EAAMS,QAAQuB,WAAWrB,QAChCR,aAAc,MACdC,QAAS,WAET,CAACJ,EAAMsC,YAAYC,GAAG,OAAQ,CAC5BC,SAAU,OACVC,WAAY,OACZC,WAAY"}
1	+ {"version":3,"file":"slider.theme.js","sources":["../../../src/materialui/slider/slider.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\n\n// make sure the value can be divided by 2\nexport const flowThumbWidth = 40;\nexport const flowThumbHeight = 20;\n\nexport const flowSlider: Components<Theme>['MuiSlider'] = {\n defaultProps: {\n // value properties\n min: 0,\n max: 100,\n step: 1,\n // display label with hover\n valueLabelDisplay: 'auto',\n // disable auto-generated marks, it is recommended to use ./getSliderMarks.ts function\n marks: false,\n },\n styleOverrides: {\n root: ({ theme, ownerState }) => ({\n display: 'block',\n borderRadius: '0',\n // 32px height\n padding: '13px 0',\n // overwrite MUI touch device styling to keep the same size on mobile\n '@media (pointer: coarse)': {\n padding: '13px 0',\n },\n ...(ownerState.orientation === 'vertical'\n ? {\n width: '6px',\n height: '320px',\n }\n : {\n height: '6px',\n }),\n // disabled state\n '&.Mui-disabled': {\n '& .MuiSlider-rail': {\n color: theme.palette.disabled.primary,\n },\n '& .MuiSlider-track': {\n color: theme.palette.disabled.tertiary,\n },\n '& .MuiSlider-mark': {\n backgroundColor: theme.palette.mode === 'dark' ? theme.palette.onSurface.os900 : theme.palette.onSurface.os0,\n '&.MuiSlider-markActive': {\n backgroundColor:\n theme.palette.mode === 'dark' ? theme.palette.onSurface.os900 : theme.palette.onSurface.os0,\n },\n },\n '& .MuiSlider-thumb': {\n borderColor: theme.palette.disabled.tertiary,\n },\n },\n }),\n // whole rail bellow the thumb\n rail: ({ theme }) => ({\n borderRadius: '6px',\n opacity: '1',\n color: theme.palette.onSurface.os500,\n // add translate3d, in addition to translateY(-50%), to prevent overflowing borderRadius\n transform: 'translate3d(0px, -50%, 0px)',\n }),\n // track marking selected segment\n track: ({ theme }) => ({\n borderRadius: '6px',\n border: 'none',\n color: theme.palette.mode === 'dark' ? theme.palette.brand.secondary : theme.palette.brand.primary,\n // add translate3d, in addition to translateY(-50%), to prevent overflowing borderRadius\n transform: 'translate3d(0px, -50%, 0px)',\n }),\n // dot on the rail and track\n mark: ({ theme }) => ({\n height: '4px',\n width: '4px',\n borderRadius: '4px',\n opacity: '1',\n backgroundColor: theme.palette.mode === 'dark' ? theme.palette.onSurface.os900 : theme.palette.onSurface.os0,\n '&.MuiSlider-markActive': {\n backgroundColor: theme.palette.mode === 'dark' ? theme.palette.onSurface.os900 : theme.palette.onSurface.os0,\n },\n }),\n // pointer\n thumb: ({ theme, ownerState }) => ({\n ...(ownerState.orientation === 'vertical'\n ? {\n width: `${flowThumbHeight}px`,\n height: `${flowThumbWidth}px`,\n }\n : {\n width: `${flowThumbWidth}px`,\n height: `${flowThumbHeight}px`,\n }),\n borderRadius: `${flowThumbHeight}px`,\n backgroundColor: theme.palette.onSurface.os0,\n border: `1px solid ${theme.palette.onSurface.os900}`,\n // hitbox target\n '&:after': {\n width: `${flowThumbWidth}px`,\n height: `${flowThumbWidth}px`,\n borderRadius: '1000px',\n },\n // focus style\n ...getFocusRingStyle(theme, true, 1),\n // extra shadow around\n transition: 'box-shadow 0.3s ease-out',\n '&, &:hover, &.Mui-active': {\n boxShadow: `none`,\n },\n '&.Mui-focusVisible': {\n // extra white border\n boxShadow: `0 0 0 2px ${theme.palette.background.primary}`,\n // hide focus during dragging\n '&.Mui-active': {\n boxShadow: 'none',\n outline: `0px solid ${theme.palette.background.primary}`,\n '&:before': {\n boxShadow: 'none',\n },\n },\n },\n }),\n // label above thumb\n valueLabel: ({ theme }) => ({\n maxWidth: 'none',\n // increase space between thumb and tooltip\n top: '-12px',\n // style box\n backgroundColor: theme.palette.text.primary,\n color: theme.palette.background.primary,\n borderRadius: '2px',\n padding: '8px 12px',\n // custom font-size\n [theme.breakpoints.up('xs')]: {\n fontSize: '12px',\n lineHeight: '16px',\n fontWeight: '400',\n },\n }),\n },\n};\n"],"names":["flowThumbWidth","flowThumbHeight","flowSlider","defaultProps","min","max","step","valueLabelDisplay","marks","styleOverrides","root","theme","ownerState","display","borderRadius","padding","orientation","width","height","color","palette","disabled","primary","tertiary","backgroundColor","mode","onSurface","os900","os0","borderColor","rail","opacity","os500","transform","track","border","brand","secondary","mark","thumb","getFocusRingStyle","transition","boxShadow","background","outline","valueLabel","maxWidth","top","text","breakpoints","up","fontSize","lineHeight","fontWeight"],"mappings":"4EAKO,MAAMA,EAAiB,GACjBC,EAAkB,GAElBC,EAA6C,CACxDC,aAAc,CAEZC,IAAK,EACLC,IAAK,IACLC,KAAM,EAENC,kBAAmB,OAEnBC,OAAO,GAETC,eAAgB,CACdC,KAAM,EAAGC,QAAOC,iBAAY,CAC1BC,QAAS,QACTC,aAAc,IAEdC,QAAS,SAET,2BAA4B,CAC1BA,QAAS,aAEoB,aAA3BH,EAAWI,YACX,CACEC,MAAO,MACPC,OAAQ,SAEV,CACEA,OAAQ,OAGd,iBAAkB,CAChB,oBAAqB,CACnBC,MAAOR,EAAMS,QAAQC,SAASC,SAEhC,qBAAsB,CACpBH,MAAOR,EAAMS,QAAQC,SAASE,UAEhC,oBAAqB,CACnBC,gBAAwC,SAAvBb,EAAMS,QAAQK,KAAkBd,EAAMS,QAAQM,UAAUC,MAAQhB,EAAMS,QAAQM,UAAUE,IACzG,yBAA0B,CACxBJ,gBACyB,SAAvBb,EAAMS,QAAQK,KAAkBd,EAAMS,QAAQM,UAAUC,MAAQhB,EAAMS,QAAQM,UAAUE,MAG9F,qBAAsB,CACpBC,YAAalB,EAAMS,QAAQC,SAASE,aAK1CO,KAAM,EAAGnB,YAAO,CACdG,aAAc,MACdiB,QAAS,IACTZ,MAAOR,EAAMS,QAAQM,UAAUM,MAE/BC,UAAW,gCAGbC,MAAO,EAAGvB,YAAO,CACfG,aAAc,MACdqB,OAAQ,OACRhB,MAA8B,SAAvBR,EAAMS,QAAQK,KAAkBd,EAAMS,QAAQgB,MAAMC,UAAY1B,EAAMS,QAAQgB,MAAMd,QAE3FW,UAAW,gCAGbK,KAAM,EAAG3B,YAAO,CACdO,OAAQ,MACRD,MAAO,MACPH,aAAc,MACdiB,QAAS,IACTP,gBAAwC,SAAvBb,EAAMS,QAAQK,KAAkBd,EAAMS,QAAQM,UAAUC,MAAQhB,EAAMS,QAAQM,UAAUE,IACzG,yBAA0B,CACxBJ,gBAAwC,SAAvBb,EAAMS,QAAQK,KAAkBd,EAAMS,QAAQM,UAAUC,MAAQhB,EAAMS,QAAQM,UAAUE,OAI7GW,MAAO,EAAG5B,QAAOC,iBAAY,IACI,aAA3BA,EAAWI,YACX,CACEC,MAAO,OACPC,OAAQ,QAEV,CACED,MAAO,OACPC,OAAQ,QAEdJ,aAAc,OACdU,gBAAiBb,EAAMS,QAAQM,UAAUE,IACzCO,OAAQ,aAAaxB,EAAMS,QAAQM,UAAUC,QAE7C,UAAW,CACTV,MAAO,OACPC,OAAQ,OACRJ,aAAc,aAGb0B,EAAkB7B,GAAO,EAAM,GAElC8B,WAAY,2BACZ,2BAA4B,CAC1BC,UAAW,QAEb,qBAAsB,CAEpBA,UAAW,aAAa/B,EAAMS,QAAQuB,WAAWrB,UAEjD,eAAgB,CACdoB,UAAW,OACXE,QAAS,aAAajC,EAAMS,QAAQuB,WAAWrB,UAC/C,WAAY,CACVoB,UAAW,YAMnBG,WAAY,EAAGlC,YAAO,CACpBmC,SAAU,OAEVC,IAAK,QAELvB,gBAAiBb,EAAMS,QAAQ4B,KAAK1B,QACpCH,MAAOR,EAAMS,QAAQuB,WAAWrB,QAChCR,aAAc,MACdC,QAAS,WAET,CAACJ,EAAMsC,YAAYC,GAAG,OAAQ,CAC5BC,SAAU,OACVC,WAAY,OACZC,WAAY"}

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 ...(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"}
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/Tab.d.ts CHANGED Viewed

@@ -5,4 +5,5 @@ import { ButtonBaseProps } from '@mui/material';
  */
 export declare const TabComponent: React.FC<ButtonBaseProps & {
     link?: boolean;
+    rovingTabIndex?: boolean;
 }>;

package/materialui/tabs/Tab.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as i}from"react/jsx-runtime";import{forwardRef as a,useMemo as t}from"react";import{ButtonBase as r,Box as l}from"@mui/material";const n=a(({children:a,link:n=!1,...o},s)=>{const c=t(()=>({display:"inherit",alignItems:"inherit",justifyContent:"inherit",flexDirection:"inherit",gap:"inherit"}),[]);return e(r,{ref:s,"aria-label":"navigation",...n&&{component:"a"},...o,tabIndex:o.className?.includes("Mui-disabled")?-1:0,children:i(l,{className:"FlowTab-labelWrapper",sx:{...c,position:"relative"},children:[e(l,{className:"FlowTab-label",sx:{...c,position:"absolute"},children:a}),e(l,{className:"FlowTab-selectedLabel",sx:{...c,fontWeight:"700",opacity:"0",position:"relative"},"aria-hidden":"true",children:a})]})})});export{n as TabComponent};
+import{jsx as e,jsxs as i}from"react/jsx-runtime";import{forwardRef as t,useMemo as a}from"react";import{ButtonBase as r,Box as n}from"@mui/material";const l=t(({children:t,link:l=!1,rovingTabIndex:o=!1,...s},c)=>{const m=a(()=>({display:"inherit",alignItems:"inherit",justifyContent:"inherit",flexDirection:"inherit",gap:"inherit"}),[]);return e(r,{ref:c,...l&&{component:"a"},...s,...!o&&{tabIndex:s.className?.includes("Mui-disabled")?-1:0},children:i(n,{className:"FlowTab-labelWrapper",sx:{...m,position:"relative"},children:[e(n,{className:"FlowTab-label",sx:{...m,position:"absolute"},children:t}),e(n,{className:"FlowTab-selectedLabel",sx:{...m,fontWeight:"700",opacity:"0",position:"relative"},"aria-hidden":"true",children:t})]})})});export{l as TabComponent};
 //# sourceMappingURL=Tab.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Tab.js","sources":["../../../src/materialui/tabs/Tab.tsx"],"sourcesContent":["import React, { useMemo, forwardRef } from 'react';\nimport { Box, ButtonBase, ButtonBaseProps } from '@mui/material';\n\n/*\n Component used to render Tab, contains duplication of label to change font-weight without changing width\n */\nexport const TabComponent: React.FC<ButtonBaseProps & { link?: boolean }> = forwardRef(\n ({ children, link = false, ...rest }, ref) => {\n // shared style between label and selectedLabel\n const sharedLabelSx = useMemo(\n () => ({\n display: 'inherit',\n alignItems: 'inherit',\n justifyContent: 'inherit',\n flexDirection: 'inherit',\n gap: 'inherit',\n }),\n [],\n );\n\n return (\n <ButtonBase\n ref={ref}\n ~~aria-label=\"navigation\"\n~~ {...(link && { component: 'a' })}\n {...rest}\n tabIndex={rest.className?.includes('Mui-disabled') ? -1 : 0}\n >\n <Box className=\"FlowTab-labelWrapper\" sx={{ ...sharedLabelSx, position: 'relative' }}>\n <Box\n className=\"FlowTab-label\"\n sx={{\n ...sharedLabelSx,\n position: 'absolute',\n // expands from center, can be changed to expand from left/right with left: 0;\n }}\n >\n {children}\n </Box>\n <Box\n className=\"FlowTab-selectedLabel\"\n sx={{\n ...sharedLabelSx,\n fontWeight: '700',\n // hidden by default, appears once Tab is selected (tab.theme)\n opacity: '0',\n position: 'relative',\n }}\n aria-hidden=\"true\"\n >\n {children}\n </Box>\n </Box>\n </ButtonBase>\n );\n },\n);\n"],"names":["TabComponent","forwardRef","children","link","rest","ref","sharedLabelSx","useMemo","display","alignItems","justifyContent","flexDirection","gap","_jsx","ButtonBase","component","tabIndex","className","includes","_jsxs","Box","sx","position","fontWeight","opacity"],"mappings":"~~4JAMaA~~,~~EAA+DC~~,~~EAC1E~~,EAAGC,WAAUC,QAAO,KAAUC,GAAQC,~~KAEpC~~,MAAMC,EAAgBC,EACpB,KAAA,CACEC,QAAS,UACTC,WAAY,UACZC,eAAgB,UAChBC,cAAe,UACfC,IAAK,YAEP,IAGF,OACEC,EAACC,EAAU,CACTT,IAAKA,~~EAAG~~,~~aACG,gBACNF,~~GAAQ,~~CAAEY~~,UAAW,QACtBX,~~EACJY~~,SAAUZ,EAAKa,WAAWC,SAAS,iBAAkB,EAAK,~~EAAChB~~,~~SAE3DiB~~,EAACC,EAAG,CAACH,UAAU,uBAAuBI,GAAI,IAAKf,EAAegB,SAAU,~~YAAYpB~~,SAAA,~~CAClFW~~,EAACO,~~EAAG~~,~~CACFH,~~UAAU,gBACVI,GAAI,IACCf,EACHgB,SAAU,~~YAEXpB~~,SAEAA,~~IAEHW~~,EAACO,EAAG,CACFH,UAAU,wBACVI,GAAI,IACCf,EACHiB,WAAY,MAEZC,QAAS,IACTF,SAAU,YACX,cACW,~~OAAMpB~~,SAEjBA"}
1	+ {"version":3,"file":"Tab.js","sources":["../../../src/materialui/tabs/Tab.tsx"],"sourcesContent":["import React, { useMemo, forwardRef } from 'react';\nimport { Box, ButtonBase, ButtonBaseProps } from '@mui/material';\n\n/*\n Component used to render Tab, contains duplication of label to change font-weight without changing width\n */\nexport const TabComponent: React.FC<ButtonBaseProps & { link?: boolean; rovingTabIndex?: boolean }> = forwardRef(\n ({ children, link = false, rovingTabIndex = false, ...rest }, ref) => {\n // shared style between label and selectedLabel\n const sharedLabelSx = useMemo(\n () => ({\n display: 'inherit',\n alignItems: 'inherit',\n justifyContent: 'inherit',\n flexDirection: 'inherit',\n gap: 'inherit',\n }),\n [],\n );\n\n return (\n <ButtonBase\n ref={ref}\n {...(link && { component: 'a' })}\n {...rest}\n // every tab is a tab stop by default, tabs are also used as navigation links\n {...(!rovingTabIndex && { tabIndex: rest.className?.includes('Mui-disabled') ? -1 : 0 })}\n >\n <Box className=\"FlowTab-labelWrapper\" sx={{ ...sharedLabelSx, position: 'relative' }}>\n <Box\n className=\"FlowTab-label\"\n sx={{\n ...sharedLabelSx,\n position: 'absolute',\n // expands from center, can be changed to expand from left/right with left: 0;\n }}\n >\n {children}\n </Box>\n <Box\n className=\"FlowTab-selectedLabel\"\n sx={{\n ...sharedLabelSx,\n fontWeight: '700',\n // hidden by default, appears once Tab is selected (tab.theme)\n opacity: '0',\n position: 'relative',\n }}\n aria-hidden=\"true\"\n >\n {children}\n </Box>\n </Box>\n </ButtonBase>\n );\n },\n);\n"],"names":["TabComponent","forwardRef","children","link","rovingTabIndex","rest","ref","sharedLabelSx","useMemo","display","alignItems","justifyContent","flexDirection","gap","_jsx","ButtonBase","component","tabIndex","className","includes","_jsxs","Box","sx","position","fontWeight","opacity"],"mappings":"sJAMO,MAAMA,EAAyFC,EACpG,EAAGC,WAAUC,QAAO,EAAOC,kBAAiB,KAAUC,GAAQC,KAE5D,MAAMC,EAAgBC,EACpB,KAAA,CACEC,QAAS,UACTC,WAAY,UACZC,eAAgB,UAChBC,cAAe,UACfC,IAAK,YAEP,IAGF,OACEC,EAACC,EAAU,CACTT,IAAKA,KACAH,GAAQ,CAAEa,UAAW,QACtBX,MAEED,GAAkB,CAAEa,SAAUZ,EAAKa,WAAWC,SAAS,iBAAkB,EAAK,GAAIjB,SAExFkB,EAACC,EAAG,CAACH,UAAU,uBAAuBI,GAAI,IAAKf,EAAegB,SAAU,YAAYrB,SAAA,CAClFY,EAACO,GACCH,UAAU,gBACVI,GAAI,IACCf,EACHgB,SAAU,YAEXrB,SAEAA,IAEHY,EAACO,EAAG,CACFH,UAAU,wBACVI,GAAI,IACCf,EACHiB,WAAY,MAEZC,QAAS,IACTF,SAAU,YACX,cACW,OAAMrB,SAEjBA"}

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

@@ -1,10 +1,12 @@
 /**
  * This component renders a scroll button that changes based on the scroll direction
  */
-export declare const TabsScrollButton: ({ direction, slots, slotProps, ownerState, ...rest }: {
+export declare const TabsScrollButton: ({ direction, slots, slotProps, ownerState, scrollLeftTitle, scrollRightTitle, ...rest }: {
     [x: string]: any;
     direction: any;
     slots: any;
     slotProps: any;
     ownerState: any;
+    scrollLeftTitle?: string;
+    scrollRightTitle?: string;
 }) => import("react").JSX.Element;

package/materialui/tabs/TabsScrollButton.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as o}from"react/jsx-runtime";import{IconButton as t}from"@mui/material";import{ChevronLeftIcon as r}from"../../components/icon/stroke/ChevronLeftIcon.js";import{ChevronRightIcon as e}from"../../components/icon/stroke/ChevronRightIcon.js";const i=({direction:i,slots:l,slotProps:s,ownerState:n,...m})=>o(t,{"aria-label":"left"===i?"Scroll left":"Scroll right","data-testid":`TabsScrollButton-${i}`,size:"small",sx:{m:"4px"},...m,children:o("left"===i?r:e,{})});export{i as TabsScrollButton};
+import{jsx as o}from"react/jsx-runtime";import{IconButton as t}from"@mui/material";import{ChevronLeftIcon as r}from"../../components/icon/stroke/ChevronLeftIcon.js";import{ChevronRightIcon as e}from"../../components/icon/stroke/ChevronRightIcon.js";const l=({direction:l,slots:i,slotProps:s,ownerState:n,scrollLeftTitle:c="Scroll left",scrollRightTitle:m="Scroll right",...a})=>o(t,{"aria-label":"left"===l?c:m,"data-testid":`TabsScrollButton-${l}`,size:"small",sx:{m:"4px"},...a,children:o("left"===l?r:e,{})});export{l as TabsScrollButton};
 //# sourceMappingURL=TabsScrollButton.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"TabsScrollButton.js","sources":["../../../src/materialui/tabs/TabsScrollButton.tsx"],"sourcesContent":["import { IconButton } from '@mui/material';\nimport { ChevronLeftIcon } from '@/src/components/icon/stroke/ChevronLeftIcon';\nimport { ChevronRightIcon } from '@/src/components/icon/stroke/ChevronRightIcon';\n\n/*\n This component renders a scroll button that changes based on the scroll direction\n */\nexport const TabsScrollButton = ({ direction, slots, slotProps, ownerState, ...rest }) => {\n return (\n <IconButton\n aria-label={direction === 'left' ? ~~'Scroll~~ ~~left'~~ : ~~'Scroll right'~~}\n data-testid={`TabsScrollButton-${direction}`}\n size=\"small\"\n sx={{ m: '4px' }}\n {...rest}\n >\n {direction === 'left' ? <ChevronLeftIcon /> : <ChevronRightIcon />}\n </IconButton>\n );\n};\n"],"names":["TabsScrollButton","direction","slots","slotProps","ownerState","rest","_jsx","IconButton","size","sx","m","children","ChevronLeftIcon","ChevronRightIcon"],"mappings":"yPAOO,MAAMA,EAAmB,~~EAAGC~~,~~YAAWC~~,~~QAAOC~~,~~YAAWC~~,~~gBAAeC~~,~~KAE3EC~~,EAACC,EAAU,CAAA,aACiB,~~SAAdN~~,~~EAAuB~~,~~cAAgB~~,~~eAAc~~,~~cACpD~~,~~oBAAoBA~~,~~IACjCO~~,KAAK,QACLC,GAAI,CAAEC,EAAG,UACLL,EAAIM,SAEgBL,EAAT,~~SAAdL~~,~~EAAwBW~~,EAAsBC,EAAP,CAAA"}
1	+ {"version":3,"file":"TabsScrollButton.js","sources":["../../../src/materialui/tabs/TabsScrollButton.tsx"],"sourcesContent":["import { IconButton } from '@mui/material';\nimport { ChevronLeftIcon } from '@/src/components/icon/stroke/ChevronLeftIcon';\nimport { ChevronRightIcon } from '@/src/components/icon/stroke/ChevronRightIcon';\n\n/*\n This component renders a scroll button that changes based on the scroll direction\n */\nexport const TabsScrollButton = ({\n direction,\n slots,\n slotProps,\n ownerState,\n scrollLeftTitle = 'Scroll left',\n scrollRightTitle = 'Scroll right',\n ...rest\n}) => {\n return (\n <IconButton\n aria-label={direction === 'left' ? scrollLeftTitle : scrollRightTitle}\n data-testid={`TabsScrollButton-${direction}`}\n size=\"small\"\n sx={{ m: '4px' }}\n {...rest}\n >\n {direction === 'left' ? <ChevronLeftIcon /> : <ChevronRightIcon />}\n </IconButton>\n );\n};\n"],"names":["TabsScrollButton","direction","slots","slotProps","ownerState","scrollLeftTitle","scrollRightTitle","rest","_jsx","IconButton","size","sx","m","children","ChevronLeftIcon","ChevronRightIcon"],"mappings":"yPAOO,MAAMA,EAAmB,EAC9BC,YACAC,QACAC,YACAC,aACAC,kBAAkB,cAClBC,mBAAmB,kBAChBC,KAGDC,EAACC,EAAU,CAAA,aACiB,SAAdR,EAAuBI,EAAkBC,EAAgB,cACxD,oBAAoBL,IACjCS,KAAK,QACLC,GAAI,CAAEC,EAAG,UACLL,EAAIM,SAEgBL,EAAT,SAAdP,EAAwBa,EAAsBC,EAAP,CAAA"}

package/materialui/textfield/FormControl.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import{forwardRef as r,useRef as o,useImperativeHandle as n,useState as t}from"react";import{Box as c}from"@mui/material";const i=r(({onFocus:r,onBlur:i,onPointerDown:u,className:a,...l},s)=>{const m=o(null);n(s,()=>m.current);const w=o(null),[D,P]=t(!1);return e(c,{ref:m,onPointerDown:e=>{w.current="onPointerDown",u?.(e)},onFocus:e=>{["onFocus","onPointerDown"].includes(w.current)||P(!0),w.current="onFocus",r?.(e)},onBlur:e=>{"onPointerDown"===w.current||m?.current?.matches?.(':has(.MuiSelect-select[aria-expanded="true"])')||e?.relatedTarget?.matches?.(".MuiSelect-select")||e?.relatedTarget?.matches?.('[class^="MuiPickers"]')||e?.relatedTarget?.matches?.(".MuiMultiSectionDigitalClockSection-item")?w.current="onPointerDown":(P(!1),w.current="onBlur"),i?.(e)},className:[a,D?"":"Flow-NoFocusRing"].filter(Boolean).join(" "),...l})});export{i as FormControl};
+import{jsx as e}from"react/jsx-runtime";import{forwardRef as o,useRef as r,useState as n}from"react";import{useForkRef as t,Box as c}from"@mui/material";const i=o(({onFocus:o,onBlur:i,onPointerDown:u,className:a,...l},s)=>{const m=r(null),w=t(s,m),D=r(null),[P,d]=n(!1);return e(c,{ref:w,onPointerDown:e=>{D.current="onPointerDown",u?.(e)},onFocus:e=>{["onFocus","onPointerDown"].includes(D.current)||d(!0),D.current="onFocus",o?.(e)},onBlur:e=>{"onPointerDown"===D.current||m?.current?.matches?.(':has(.MuiSelect-select[aria-expanded="true"])')||e?.relatedTarget?.matches?.(".MuiSelect-select")||e?.relatedTarget?.matches?.('[class^="MuiPickers"]')||e?.relatedTarget?.matches?.(".MuiMultiSectionDigitalClockSection-item")?D.current="onPointerDown":(d(!1),D.current="onBlur"),i?.(e)},className:[a,P?"":"Flow-NoFocusRing"].filter(Boolean).join(" "),...l})});export{i as FormControl};
 //# sourceMappingURL=FormControl.js.map

package/materialui/textfield/FormControl.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormControl.js","sources":["../../../src/materialui/textfield/FormControl.tsx"],"sourcesContent":["import React, { FC, useState, forwardRef, useRef, ~~useImperativeHandle~~ } from 'react';\nimport { Box, FormControlProps } from '@mui/material';\n\n/*\n Custom extension of FormControl component to show FocusRing only with Tab focus\n */\nexport const FormControl: FC<FormControlProps> = forwardRef(\n ({ onFocus, onBlur, onPointerDown, className, ...rest }, forwardedRef) => {\n const ref = useRef<HTMLDivElement>(null);\n ~~useImperativeHandle~~(forwardedRef, ~~() =>~~ ref~~.current~~);\n // detect events to skip focus ring\n const previousEvent = useRef<string \| null>(null);\n // append style with focus ring\n const [focusVisible, setFocusVisible] = useState<boolean>(false);\n\n return (\n <Box\n ref={~~ref~~}\n onPointerDown={(e) => {\n previousEvent.current = 'onPointerDown';\n onPointerDown?.(e);\n }}\n onFocus={(e) => {\n if (!['onFocus', 'onPointerDown'].includes(previousEvent.current)) {\n // if not clicked or repeated event, we will show focus ring (force rerender to update class)\n setFocusVisible(true);\n }\n previousEvent.current = 'onFocus';\n onFocus?.(e);\n }}\n onBlur={(e) => {\n // perform cleanup\n if (\n // skip cleanup as onPointerDown might happen after onFocus\n previousEvent.current !== 'onPointerDown' &&\n // focus is not in opened select\n !ref?.current?.matches?.(':has(.MuiSelect-select[aria-expanded=\"true\"])') &&\n // blur does not come from the opened select and now goes into select\n !e?.relatedTarget?.matches?.('.MuiSelect-select') &&\n // blur does not come from datepicker\n !e?.relatedTarget?.matches?.('[class^=\"MuiPickers\"]') &&\n // blur does not come form timepicker\n !e?.relatedTarget?.matches?.('.MuiMultiSectionDigitalClockSection-item')\n ) {\n // cleanup with blur\n setFocusVisible(false);\n previousEvent.current = 'onBlur';\n } else {\n // act with skip that click just happened\n previousEvent.current = 'onPointerDown';\n }\n onBlur?.(e);\n }}\n className={[\n className,\n // we are utilizing class to support <FormControl component='div' /> fallback to always show focus ring\n focusVisible ? '' : 'Flow-NoFocusRing',\n ]\n .filter(Boolean)\n .join(' ')}\n {...rest}\n />\n );\n },\n);\n"],"names":["FormControl","forwardRef","onFocus","onBlur","onPointerDown","className","rest","forwardedRef","ref","useRef","~~useImperativeHandle~~","~~current~~","previousEvent","focusVisible","setFocusVisible","useState","_jsx","Box","e","includes","matches","relatedTarget","filter","Boolean","join"],"mappings":"~~wKAMaA~~,EAAoCC,EAC/C,EAAGC,UAASC,SAAQC,gBAAeC,eAAcC,GAAQC,KACvD,MAAMC,EAAMC,EAAuB,~~MACnCC~~,~~EAAoBH~~,~~EAAc~~,~~IAAMC~~,~~EAAIG~~,~~SAE5C,MAAMC,~~EAAgBH,EAAsB,OAErCI,EAAcC,GAAmBC,GAAkB,GAE1D,OACEC,EAACC,EAAG,CACFT,~~IAAKA~~,~~EACLJ~~,cAAgBc,IACdN,~~EAAcD~~,QAAU,~~gBACxBP~~,IAAgBc,IAElBhB,QAAUgB,IACH,CAAC,UAAW,~~iBAAiBC~~,~~SAASP~~,~~EAAcD~~,~~UAEvDG~~,GAAgB,GAElBF,~~EAAcD~~,QAAU,~~UACxBT~~,IAAUgB,IAEZf,OAASe,IAIqB,kBAA1BN,~~EAAcD~~,~~SAEbH~~,~~GAAKG~~,~~SAASS~~,UAAU,~~kDAExBF~~,~~GAAGG~~,eAAeD,UAAU,~~sBAE5BF~~,~~GAAGG~~,eAAeD,UAAU,~~0BAE5BF~~,~~GAAGG~~,eAAeD,UAAU,~~4CAO7BR~~,~~EAAcD~~,QAAU,~~iBAJxBG~~,GAAgB,GAChBF,~~EAAcD~~,QAAU,~~UAK1BR~~,IAASe,IAEXb,UAAW,CACTA,EAEAQ,EAAe,GAAK,~~oBAEnBS~~,OAAOC,SACPC,KAAK,~~QACJlB~~"}
1	+ {"version":3,"file":"FormControl.js","sources":["../../../src/materialui/textfield/FormControl.tsx"],"sourcesContent":["import React, { FC, useState, forwardRef, useRef } from 'react';\nimport { Box, FormControlProps, useForkRef } from '@mui/material';\n\n/*\n Custom extension of FormControl component to show FocusRing only with Tab focus\n */\nexport const FormControl: FC<FormControlProps> = forwardRef(\n ({ onFocus, onBlur, onPointerDown, className, ...rest }, forwardedRef) => {\n const ref = useRef<HTMLDivElement>(null);\n const handleRef = useForkRef(forwardedRef, ref);\n // detect events to skip focus ring\n const previousEvent = useRef<string \| null>(null);\n // append style with focus ring\n const [focusVisible, setFocusVisible] = useState<boolean>(false);\n\n return (\n <Box\n ref={handleRef}\n onPointerDown={(e) => {\n previousEvent.current = 'onPointerDown';\n onPointerDown?.(e);\n }}\n onFocus={(e) => {\n if (!['onFocus', 'onPointerDown'].includes(previousEvent.current)) {\n // if not clicked or repeated event, we will show focus ring (force rerender to update class)\n setFocusVisible(true);\n }\n previousEvent.current = 'onFocus';\n onFocus?.(e);\n }}\n onBlur={(e) => {\n // perform cleanup\n if (\n // skip cleanup as onPointerDown might happen after onFocus\n previousEvent.current !== 'onPointerDown' &&\n // focus is not in opened select\n !ref?.current?.matches?.(':has(.MuiSelect-select[aria-expanded=\"true\"])') &&\n // blur does not come from the opened select and now goes into select\n !e?.relatedTarget?.matches?.('.MuiSelect-select') &&\n // blur does not come from datepicker\n !e?.relatedTarget?.matches?.('[class^=\"MuiPickers\"]') &&\n // blur does not come form timepicker\n !e?.relatedTarget?.matches?.('.MuiMultiSectionDigitalClockSection-item')\n ) {\n // cleanup with blur\n setFocusVisible(false);\n previousEvent.current = 'onBlur';\n } else {\n // act with skip that click just happened\n previousEvent.current = 'onPointerDown';\n }\n onBlur?.(e);\n }}\n className={[\n className,\n // we are utilizing class to support <FormControl component='div' /> fallback to always show focus ring\n focusVisible ? '' : 'Flow-NoFocusRing',\n ]\n .filter(Boolean)\n .join(' ')}\n {...rest}\n />\n );\n },\n);\n"],"names":["FormControl","forwardRef","onFocus","onBlur","onPointerDown","className","rest","forwardedRef","ref","useRef","handleRef","useForkRef","previousEvent","focusVisible","setFocusVisible","useState","_jsx","Box","e","current","includes","matches","relatedTarget","filter","Boolean","join"],"mappings":"+JAMaA,EAAoCC,EAC/C,EAAGC,UAASC,SAAQC,gBAAeC,eAAcC,GAAQC,KACvD,MAAMC,EAAMC,EAAuB,MAC7BC,EAAYC,EAAWJ,EAAcC,GAErCI,EAAgBH,EAAsB,OAErCI,EAAcC,GAAmBC,GAAkB,GAE1D,OACEC,EAACC,EAAG,CACFT,IAAKE,EACLN,cAAgBc,IACdN,EAAcO,QAAU,gBACxBf,IAAgBc,IAElBhB,QAAUgB,IACH,CAAC,UAAW,iBAAiBE,SAASR,EAAcO,UAEvDL,GAAgB,GAElBF,EAAcO,QAAU,UACxBjB,IAAUgB,IAEZf,OAASe,IAIqB,kBAA1BN,EAAcO,SAEbX,GAAKW,SAASE,UAAU,kDAExBH,GAAGI,eAAeD,UAAU,sBAE5BH,GAAGI,eAAeD,UAAU,0BAE5BH,GAAGI,eAAeD,UAAU,4CAO7BT,EAAcO,QAAU,iBAJxBL,GAAgB,GAChBF,EAAcO,QAAU,UAK1BhB,IAASe,IAEXb,UAAW,CACTA,EAEAQ,EAAe,GAAK,oBAEnBU,OAAOC,SACPC,KAAK,QACJnB"}

package/materialui/textfield/FormHelperText.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import{forwardRef as t,useRef as o,useImperativeHandle as l,useState as n}from"react";import{Tooltip as i,Box as s,ButtonBase as a}from"@mui/material";import{sxOverride as c}from"../../utils/sxOverride/sxOverride.js";import{WarningFilledIcon as m}from"../../components/icon/filled/WarningFilledIcon.js";import{useElementScrollable as p}from"../../utils/useElementScrollable/useElementScrollable.js";import{getFocusRingStyle as x}from"../../components/focusring/focusring.js";const d=t(({children:t,sx:d,className:u,truncate:f,...h},b)=>{const w=o(null);l(b,()=>w.current);const[,g]=n(0),{isScrollable:v,elementRef:j}=p("x",e=>g(e?.offsetWidth||0)),F=u?.includes("Mui-error")&&!1!==f&&(v||!!w?.current?.querySelector(".Flow-scrollable"));return e(i,{title:t,placement:"bottom-start",slotProps:{tooltip:{sx:{maxWidth:w?.current?.getBoundingClientRect()?.width?w.current.getBoundingClientRect().width-24+"px":"398px","& .FlowHelperTextContent-textRight":{display:"none"}}},arrow:{sx:{transform:"none !important",left:"17px !important"}}},...!F&&{open:!1},children:r(s,{component:"p",className:u,sx:d,...u?.includes("Mui-error")&&{role:"alert",sx:c({"&&":{display:"flex",alignItems:"flex-start",justifyContent:"flex-start",...!1!==f&&{overflow:"visible"}}},d)},ref:w,...h,children:[u?.includes("Mui-error")&&e(a,{sx:e=>({cursor:"default",borderRadius:"1px",ml:"2px",mr:"4px",...x(e,!0,"0px")}),"aria-label":"Error",className:"FlowHelperText-error-button-active",...!F&&{tabIndex:-1,className:"FlowHelperText-error-button"},children:e(m,{sx:{fontSize:"17px"}})}),e(s,{sx:{display:"block",overflow:!1!==f?"hidden":"inherit",textOverflow:"inherit",whiteSpace:"inherit",flexGrow:"1"},component:"span","data-testid":"FormHelperText-content",ref:j,children:t})]})},F?"long-error-message":"disabled-tooltip")});export{d as FormHelperText};
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import{forwardRef as t,useRef as o,useState as l}from"react";import{useForkRef as i,Tooltip as n,Box as s,ButtonBase as a}from"@mui/material";import{sxOverride as c}from"../../utils/sxOverride/sxOverride.js";import{WarningFilledIcon as m}from"../../components/icon/filled/WarningFilledIcon.js";import{useElementScrollable as p}from"../../utils/useElementScrollable/useElementScrollable.js";import{getFocusRingStyle as d}from"../../components/focusring/focusring.js";const x=t(({children:t,sx:x,className:u,truncate:f,...h},b)=>{const w=o(null),g=i(b,w),[,v]=l(0),{isScrollable:j,elementRef:F}=p("x",e=>v(e?.offsetWidth||0)),S=u?.includes("Mui-error")&&!1!==f&&(j||!!w?.current?.querySelector(".Flow-scrollable"));return e(n,{title:t,placement:"bottom-start",slotProps:{tooltip:{sx:{maxWidth:w?.current?.getBoundingClientRect()?.width?w.current.getBoundingClientRect().width-24+"px":"398px","& .FlowHelperTextContent-textRight":{display:"none"}}},arrow:{sx:{transform:"none !important",left:"17px !important"}}},...!S&&{open:!1},children:r(s,{component:"p",className:u,sx:x,...u?.includes("Mui-error")&&{role:"alert",sx:c({"&&":{display:"flex",alignItems:"flex-start",justifyContent:"flex-start",...!1!==f&&{overflow:"visible"}}},x)},ref:g,...h,children:[u?.includes("Mui-error")&&e(a,{sx:e=>({cursor:"default",borderRadius:"1px",ml:"2px",mr:"4px",...d(e,!0,"0px")}),"aria-label":"Error",className:"FlowHelperText-error-button-active",...!S&&{tabIndex:-1,"aria-hidden":!0,className:"FlowHelperText-error-button"},children:e(m,{sx:{fontSize:"17px"}})}),e(s,{sx:{display:"block",overflow:!1!==f?"hidden":"inherit",textOverflow:"inherit",whiteSpace:"inherit",flexGrow:"1"},component:"span","data-testid":"FormHelperText-content",ref:F,children:t})]})},S?"long-error-message":"disabled-tooltip")});export{x as FormHelperText};
 //# sourceMappingURL=FormHelperText.js.map

package/materialui/textfield/FormHelperText.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormHelperText.js","sources":["../../../src/materialui/textfield/FormHelperText.tsx"],"sourcesContent":["import React, { FC, forwardRef, ~~useImperativeHandle,~~ useRef, useState } from 'react';\nimport { Box, FormHelperTextProps, Tooltip, ButtonBase } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { WarningFilledIcon } from '@/src/components/icon/filled/WarningFilledIcon';\nimport { useElementScrollable } from '@/src/utils/useElementScrollable';\nimport { getFocusRingStyle } from '@/src/components/focusring';\n\n/*\n Custom extension of FormHelperText component to add interactive error icon\n */\nexport const FormHelperText: FC<FormHelperTextProps> = forwardRef(\n ({ children, sx, className, truncate, ...rest }, forwardedRef) => {\n const ref = useRef<HTMLParagraphElement>(null);\n ~~useImperativeHandle~~(forwardedRef, ~~() =>~~ ref~~.current~~);\n // changing width triggers re-render and updates max-width of tooltip that uses parent\n const [, setWidth] = useState(0);\n const { isScrollable, elementRef } = useElementScrollable('x', (el) => setWidth(el?.offsetWidth \|\| 0));\n const tooltipActive =\n // contains error\n className?.includes('Mui-error') &&\n // we are truncating\n truncate !== false &&\n // HelperText or HelperTextContent scrollable\n (isScrollable \|\| !!ref?.current?.querySelector('.Flow-scrollable'));\n\n return (\n <Tooltip\n title={children}\n placement=\"bottom-start\"\n slotProps={{\n tooltip: {\n sx: {\n // match size of helper text\n maxWidth: ref?.current?.getBoundingClientRect()?.width\n ? `${ref.current.getBoundingClientRect().width - 24}px`\n : '398px',\n // hide right side of HelperTextContent\n '& .FlowHelperTextContent-textRight': {\n display: 'none',\n },\n },\n },\n arrow: {\n sx: {\n // remove default transform\n transform: 'none !important',\n // align with icon\n left: '17px !important',\n },\n },\n }}\n key={tooltipActive ? 'long-error-message' : 'disabled-tooltip'}\n {...(!tooltipActive && {\n open: false,\n })}\n >\n <Box\n component=\"p\"\n className={className}\n sx={sx}\n {...(className?.includes('Mui-error') && {\n role: 'alert',\n sx: sxOverride(\n {\n '&&': {\n display: 'flex',\n alignItems: 'flex-start',\n justifyContent: 'flex-start',\n ...(truncate !== false && {\n // make sure interactive FocusRing from error is visible\n overflow: 'visible',\n }),\n },\n },\n sx,\n ),\n })}\n ref={~~ref~~}\n {...rest}\n >\n {className?.includes('Mui-error') && (\n <ButtonBase\n sx={(theme) => ({\n cursor: 'default',\n borderRadius: '1px',\n ml: '2px',\n mr: '4px',\n ...getFocusRingStyle(theme, true, '0px'),\n })}\n aria-label=\"Error\"\n className=\"FlowHelperText-error-button-active\"\n {...(!tooltipActive && { tabIndex: -1, className: 'FlowHelperText-error-button' })}\n >\n <WarningFilledIcon sx={{ fontSize: '17px' }} />\n </ButtonBase>\n )}\n <Box\n sx={{\n display: 'block',\n overflow: truncate !== false ? 'hidden' : 'inherit',\n textOverflow: 'inherit',\n whiteSpace: 'inherit',\n flexGrow: '1',\n }}\n component=\"span\"\n data-testid=\"FormHelperText-content\"\n ref={elementRef}\n >\n {children}\n </Box>\n </Box>\n </Tooltip>\n );\n },\n);\n"],"names":["FormHelperText","forwardRef","children","sx","className","truncate","rest","forwardedRef","ref","useRef","~~useImperativeHandle~~","~~current~~","setWidth","useState","isScrollable","elementRef","useElementScrollable","el","offsetWidth","tooltipActive","includes","querySelector","_jsx","Tooltip","title","placement","slotProps","tooltip","maxWidth","getBoundingClientRect","width","display","arrow","transform","left","open","_jsxs","Box","component","role","sxOverride","alignItems","justifyContent","overflow","ButtonBase","theme","cursor","borderRadius","ml","mr","getFocusRingStyle","tabIndex","WarningFilledIcon","fontSize","textOverflow","whiteSpace","flexGrow"],"mappings":"~~mhBAUaA~~,EAA0CC,EACrD,EAAGC,WAAUC,KAAIC,YAAWC,cAAaC,GAAQC,KAC/C,MAAMC,EAAMC,EAA6B,~~MACzCC~~,~~EAAoBH~~,~~EAAc~~,~~IAAMC~~,~~EAAIG~~,~~SAE5C,OAASC,~~GAAYC,EAAS,IACxBC,aAAEA,EAAYC,WAAEA,GAAeC,EAAqB,IAAMC,GAAOL,EAASK,GAAIC,aAAe,IAC7FC,EAEJf,GAAWgB,SAAS,eAEP,IAAbf,IAECS,KAAkBN,~~GAAKG~~,~~SAASU~~,cAAc,qBAEjD,OACEC,EAACC,EAAO,CACNC,~~MAAOtB~~,~~EACPuB~~,UAAU,eACVC,UAAW,CACTC,QAAS,~~CACPxB~~,GAAI,~~CAEFyB~~,~~SAAUpB~~,~~GAAKG~~,~~SAASkB~~,yBAAyBC,~~MAC1CtB~~,~~EAAIG~~,~~QAAQkB~~,wBAAwBC,MAAQ,GAA/C,KACA,QAEJ,qCAAsC,CACpCC,QAAS,UAIfC,MAAO,~~CACL7B~~,GAAI,~~CAEF8B~~,UAAW,kBAEXC,KAAM,~~yBAKNf~~,GAAiB,~~CACrBgB~~,MAAM,~~GACNjC~~,~~SAEFkC~~,EAACC,EAAG,CACFC,UAAU,~~IACVlC~~,UAAWA,EACXD,GAAIA,KACCC,GAAWgB,SAAS,cAAgB,~~CACvCmB~~,KAAM,~~QACNpC~~,~~GAAIqC~~,EACF,CACE,KAAM,CACJT,QAAS,OACTU,WAAY,aACZC,eAAgB,iBACC,~~IAAbrC~~,GAAsB,~~CAExBsC~~,SAAU,~~aAIhBxC~~,IAGJK,~~IAAKA~~,~~KACDF~~,EAAIJ,SAAA,CAEPE,GAAWgB,SAAS,~~cACnBE~~,EAACsB,EAAU,~~CACTzC~~,~~GAAK0C~~,IAAK,CACRC,OAAQ,UACRC,aAAc,MACdC,GAAI,MACJC,GAAI,SACDC,EAAkBL,GAAO,EAAM,~~sBAEzB~~,~~QACXzC~~,UAAU,~~yCACJe~~,GAAiB,~~CAAEgC~~,UAAU,EAAI/C,UAAW,~~wCAElDkB~~,EAAC8B,~~GAAkBjD~~,GAAI,~~CAAEkD~~,SAAU,YAGvC/B,EAACe,EAAG,~~CACFlC~~,GAAI,~~CACF4B~~,QAAS,QACTY,UAAuB,~~IAAbtC~~,EAAqB,SAAW,~~UAC1CiD~~,aAAc,UACdC,WAAY,UACZC,SAAU,KAEZlB,UAAU,OAAM,cACJ,~~yBACZ9B~~,IAAKO,EAAUb,SAEdA,~~QAzDAiB~~,EAAgB,qBAAuB"}
1	+ {"version":3,"file":"FormHelperText.js","sources":["../../../src/materialui/textfield/FormHelperText.tsx"],"sourcesContent":["import React, { FC, forwardRef, useRef, useState } from 'react';\nimport { Box, FormHelperTextProps, Tooltip, ButtonBase, useForkRef } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { WarningFilledIcon } from '@/src/components/icon/filled/WarningFilledIcon';\nimport { useElementScrollable } from '@/src/utils/useElementScrollable';\nimport { getFocusRingStyle } from '@/src/components/focusring';\n\n/*\n Custom extension of FormHelperText component to add interactive error icon\n */\nexport const FormHelperText: FC<FormHelperTextProps> = forwardRef(\n ({ children, sx, className, truncate, ...rest }, forwardedRef) => {\n const ref = useRef<HTMLParagraphElement>(null);\n const handleRef = useForkRef(forwardedRef, ref);\n // changing width triggers re-render and updates max-width of tooltip that uses parent\n const [, setWidth] = useState(0);\n const { isScrollable, elementRef } = useElementScrollable('x', (el) => setWidth(el?.offsetWidth \|\| 0));\n const tooltipActive =\n // contains error\n className?.includes('Mui-error') &&\n // we are truncating\n truncate !== false &&\n // HelperText or HelperTextContent scrollable\n (isScrollable \|\| !!ref?.current?.querySelector('.Flow-scrollable'));\n\n return (\n <Tooltip\n title={children}\n placement=\"bottom-start\"\n slotProps={{\n tooltip: {\n sx: {\n // match size of helper text\n maxWidth: ref?.current?.getBoundingClientRect()?.width\n ? `${ref.current.getBoundingClientRect().width - 24}px`\n : '398px',\n // hide right side of HelperTextContent\n '& .FlowHelperTextContent-textRight': {\n display: 'none',\n },\n },\n },\n arrow: {\n sx: {\n // remove default transform\n transform: 'none !important',\n // align with icon\n left: '17px !important',\n },\n },\n }}\n key={tooltipActive ? 'long-error-message' : 'disabled-tooltip'}\n {...(!tooltipActive && {\n open: false,\n })}\n >\n <Box\n component=\"p\"\n className={className}\n sx={sx}\n {...(className?.includes('Mui-error') && {\n role: 'alert',\n sx: sxOverride(\n {\n '&&': {\n display: 'flex',\n alignItems: 'flex-start',\n justifyContent: 'flex-start',\n ...(truncate !== false && {\n // make sure interactive FocusRing from error is visible\n overflow: 'visible',\n }),\n },\n },\n sx,\n ),\n })}\n ref={handleRef}\n {...rest}\n >\n {className?.includes('Mui-error') && (\n <ButtonBase\n sx={(theme) => ({\n cursor: 'default',\n borderRadius: '1px',\n ml: '2px',\n mr: '4px',\n ...getFocusRingStyle(theme, true, '0px'),\n })}\n aria-label=\"Error\"\n className=\"FlowHelperText-error-button-active\"\n // without the tooltip the icon is decorative, the message itself is announced by role=\"alert\"\n {...(!tooltipActive && { tabIndex: -1, 'aria-hidden': true, className: 'FlowHelperText-error-button' })}\n >\n <WarningFilledIcon sx={{ fontSize: '17px' }} />\n </ButtonBase>\n )}\n <Box\n sx={{\n display: 'block',\n overflow: truncate !== false ? 'hidden' : 'inherit',\n textOverflow: 'inherit',\n whiteSpace: 'inherit',\n flexGrow: '1',\n }}\n component=\"span\"\n data-testid=\"FormHelperText-content\"\n ref={elementRef}\n >\n {children}\n </Box>\n </Box>\n </Tooltip>\n );\n },\n);\n"],"names":["FormHelperText","forwardRef","children","sx","className","truncate","rest","forwardedRef","ref","useRef","handleRef","useForkRef","setWidth","useState","isScrollable","elementRef","useElementScrollable","el","offsetWidth","tooltipActive","includes","current","querySelector","_jsx","Tooltip","title","placement","slotProps","tooltip","maxWidth","getBoundingClientRect","width","display","arrow","transform","left","open","_jsxs","Box","component","role","sxOverride","alignItems","justifyContent","overflow","ButtonBase","theme","cursor","borderRadius","ml","mr","getFocusRingStyle","tabIndex","WarningFilledIcon","fontSize","textOverflow","whiteSpace","flexGrow"],"mappings":"0gBAUaA,EAA0CC,EACrD,EAAGC,WAAUC,KAAIC,YAAWC,cAAaC,GAAQC,KAC/C,MAAMC,EAAMC,EAA6B,MACnCC,EAAYC,EAAWJ,EAAcC,KAElCI,GAAYC,EAAS,IACxBC,aAAEA,EAAYC,WAAEA,GAAeC,EAAqB,IAAMC,GAAOL,EAASK,GAAIC,aAAe,IAC7FC,EAEJf,GAAWgB,SAAS,eAEP,IAAbf,IAECS,KAAkBN,GAAKa,SAASC,cAAc,qBAEjD,OACEC,EAACC,EAAO,CACNC,MAAOvB,EACPwB,UAAU,eACVC,UAAW,CACTC,QAAS,CACPzB,GAAI,CAEF0B,SAAUrB,GAAKa,SAASS,yBAAyBC,MAC1CvB,EAAIa,QAAQS,wBAAwBC,MAAQ,GAA/C,KACA,QAEJ,qCAAsC,CACpCC,QAAS,UAIfC,MAAO,CACL9B,GAAI,CAEF+B,UAAW,kBAEXC,KAAM,yBAKNhB,GAAiB,CACrBiB,MAAM,GACNlC,SAEFmC,EAACC,EAAG,CACFC,UAAU,IACVnC,UAAWA,EACXD,GAAIA,KACCC,GAAWgB,SAAS,cAAgB,CACvCoB,KAAM,QACNrC,GAAIsC,EACF,CACE,KAAM,CACJT,QAAS,OACTU,WAAY,aACZC,eAAgB,iBACC,IAAbtC,GAAsB,CAExBuC,SAAU,aAIhBzC,IAGJK,IAAKE,KACDJ,EAAIJ,SAAA,CAEPE,GAAWgB,SAAS,cACnBG,EAACsB,EAAU,CACT1C,GAAK2C,IAAK,CACRC,OAAQ,UACRC,aAAc,MACdC,GAAI,MACJC,GAAI,SACDC,EAAkBL,GAAO,EAAM,SAClC,aACS,QACX1C,UAAU,yCAEJe,GAAiB,CAAEiC,UAAU,EAAI,eAAe,EAAMhD,UAAW,+BAAgCF,SAEvGqB,EAAC8B,EAAiB,CAAClD,GAAI,CAAEmD,SAAU,YAGvC/B,EAACe,EAAG,CACFnC,GAAI,CACF6B,QAAS,QACTY,UAAuB,IAAbvC,EAAqB,SAAW,UAC1CkD,aAAc,UACdC,WAAY,UACZC,SAAU,KAEZlB,UAAU,OAAM,cACJ,yBACZ/B,IAAKO,EAAUb,SAEdA,QA1DAiB,EAAgB,qBAAuB"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"sxConfig.js","sources":["../../../src/materialui/theme/sxConfig.ts"],"sourcesContent":["import { unstable_defaultSxConfig as defaultSxConfig, SxConfig } from '@mui/system';\n\n/*\n When a palette group object (e.g. `palette.transparent`) is resolved instead of a string,\n * fall back to the original user value so CSS keywords like `'transparent'` pass through as-is.\n * Preserves MUI's built-in grey fallback behaviour.\n * https://github.com/mui/material-ui/blob/master/packages/mui-system/src/palette/palette.js\n */\nconst paletteColorTransform = (value: unknown, userValue: unknown): unknown => {\n if (userValue === 'grey') return userValue;\n if (typeof value === 'object' && value !== null) return userValue;\n return value;\n};\n\nexport const flowSxConfig: SxConfig = Object.fromEntries(\n [\n 'color',\n 'bgcolor',\n 'backgroundColor',\n 'borderColor',\n 'borderTopColor',\n 'borderRightColor',\n 'borderBottomColor',\n 'borderLeftColor',\n 'outlineColor',\n ].map(prop => [prop, { ...defaultSxConfig[prop], transform: paletteColorTransform }])\n);\n"],"names":["paletteColorTransform","value","userValue","flowSxConfig","Object","fromEntries","map","prop","defaultSxConfig","transform"],"mappings":"uDAQA,MAAMA,EAAwB,CAACC,EAAgBC,IAC3B,SAAdA,GACiB,iBAAVD,GAAgC,OAAVA,EADAC,EAE1BD,EAGIE,EAAyBC,OAAOC,YAC3C,CACE,QACA,UACA,kBACA,cACA,iBACA,mBACA,oBACA,kBACA,gBACAC,~~IAAIC~~,~~GAAQ~~,CAACA,EAAM,IAAKC,EAAgBD,GAAOE,UAAWT"}
1	+ {"version":3,"file":"sxConfig.js","sources":["../../../src/materialui/theme/sxConfig.ts"],"sourcesContent":["import { unstable_defaultSxConfig as defaultSxConfig, SxConfig } from '@mui/system';\n\n/*\n When a palette group object (e.g. `palette.transparent`) is resolved instead of a string,\n * fall back to the original user value so CSS keywords like `'transparent'` pass through as-is.\n * Preserves MUI's built-in grey fallback behaviour.\n * https://github.com/mui/material-ui/blob/master/packages/mui-system/src/palette/palette.js\n */\nconst paletteColorTransform = (value: unknown, userValue: unknown): unknown => {\n if (userValue === 'grey') return userValue;\n if (typeof value === 'object' && value !== null) return userValue;\n return value;\n};\n\nexport const flowSxConfig: SxConfig = Object.fromEntries(\n [\n 'color',\n 'bgcolor',\n 'backgroundColor',\n 'borderColor',\n 'borderTopColor',\n 'borderRightColor',\n 'borderBottomColor',\n 'borderLeftColor',\n 'outlineColor',\n ].map((prop) => [prop, { ...defaultSxConfig[prop], transform: paletteColorTransform }]),\n);\n"],"names":["paletteColorTransform","value","userValue","flowSxConfig","Object","fromEntries","map","prop","defaultSxConfig","transform"],"mappings":"uDAQA,MAAMA,EAAwB,CAACC,EAAgBC,IAC3B,SAAdA,GACiB,iBAAVD,GAAgC,OAAVA,EADAC,EAE1BD,EAGIE,EAAyBC,OAAOC,YAC3C,CACE,QACA,UACA,kBACA,cACA,iBACA,mBACA,oBACA,kBACA,gBACAC,IAAKC,GAAS,CAACA,EAAM,IAAKC,EAAgBD,GAAOE,UAAWT"}