@skodaflow/web-library 7.13.1 → 7.14.0

package/materialui/card/FlippingCardContent.js

@@ -1,2 +1,2 @@
-import{__rest as e}from"tslib";import{jsx as i}from"react/jsx-runtime";import{useRef as r,useState as s,useEffect as n}from"react";import{Box as o,Slide as t,CardContent as a}from"@mui/material";const c=c=>{var{children:l,disabled:d,isFlipped:p=!1,flipOnHover:u=!0,sx:b,containerProps:m,slideProps:f}=c,x=e(c,["children","disabled","isFlipped","flipOnHover","sx","containerProps","slideProps"]);const h=m||{},{sx:O}=h,g=e(h,["sx"]),j=r(null),[v,P]=s(p);n((()=>{P(p)}),[p]);return i(o,Object.assign({sx:Object.assign(Object.assign({position:"absolute",inset:"0px",overflow:"hidden",borderRadius:"inherit"},u||p?{}:{pointerEvents:"none"}),O),ref:j,onMouseEnter:()=>!d&&u&&P(!0),onMouseLeave:()=>!d&&u&&P(!1),"aria-hidden":!v},g,{children:i(t,Object.assign({in:v,direction:"up",container:j.current},f,{children:i(a,Object.assign({sx:Object.assign({position:"absolute",inset:"0",backgroundColor:"surface.primary",overflow:"auto"},b)},x,{children:l}))}))}))};export{c as FlippingCardContent};
+import{__rest as e}from"tslib";import{jsx as i}from"react/jsx-runtime";import{useRef as o,useState as n,useEffect as s}from"react";import{ButtonBase as r,Slide as t,CardContent as a}from"@mui/material";const l=l=>{var{children:c,disabled:p,isFlipped:d=!1,flipOnHover:m=!0,sx:u,className:b,containerProps:f,slideProps:x}=l,g=e(l,["children","disabled","isFlipped","flipOnHover","sx","className","containerProps","slideProps"]);const h=f||{},{sx:j}=h,v=e(h,["sx"]),O=o(null),[F,P]=n(d);s((()=>{P(d)}),[d]);const w=()=>!p&&m&&P(!0),C=()=>!p&&m&&P(!1);return i(r,Object.assign({sx:Object.assign(Object.assign({display:"block",textAlign:"left",position:"absolute",inset:"0px",overflow:"hidden",borderRadius:"inherit"},m||d?{}:{pointerEvents:"none"}),j),component:"div",ref:O,onFocus:w,onBlur:C,onMouseEnter:w,onMouseLeave:C,"aria-hidden":!F,className:["FlowFlippingCardContent-root",b].filter(Boolean).join(", ")},v,{children:i(t,Object.assign({in:F,direction:"up",container:O.current},x,{children:i(a,Object.assign({sx:Object.assign({position:"absolute",inset:"0",backgroundColor:"surface.primary",overflow:"auto"},u)},g,{children:c}))}))}))};export{l as FlippingCardContent};
 //# sourceMappingURL=FlippingCardContent.js.map

package/materialui/card/FlippingCardContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"FlippingCardContent.js","sources":["../../../src/materialui/card/FlippingCardContent.tsx"],"sourcesContent":["import { FC, useEffect, useRef, useState } from 'react';\nimport { BoxProps, Slide, SlideProps, CardContent, CardContentProps, Box } from '@mui/material';\n\nexport interface FlippingCardContentProps extends CardContentProps {\n  disabled?: boolean;\n  /**\n   * Specifies if detail should be flipped on card hover\n   * @default true\n   */\n  flipOnHover?: boolean;\n  /**\n   * Specifies if detail should be flipped\n   * @default false\n   */\n  isFlipped?: boolean;\n  /**\n   * Properties applied to wrapper component\n   */\n  containerProps?: BoxProps;\n  /**\n   * Properties applied to <Slide /> component\n   */\n  slideProps?: SlideProps;\n}\n\n/**\n * Sub-element for Card component for flipping content\n */\nexport const FlippingCardContent: FC<FlippingCardContentProps> = ({\n  children,\n  disabled,\n  isFlipped = false,\n  flipOnHover = true,\n  sx,\n  containerProps,\n  slideProps,\n  ...rest\n}) => {\n  const { sx: containerSx, ...restContainer } = containerProps || {};\n  const containerRef = useRef(null);\n\n  const [flipped, setFlipped] = useState(isFlipped);\n  /**\n   * Detect controlled state\n   */\n  useEffect(() => {\n    setFlipped(isFlipped);\n  }, [isFlipped]);\n\n  const handleMouseEnter = () => !disabled && flipOnHover && setFlipped(true);\n  const handleMouseLeave = () => !disabled && flipOnHover && setFlipped(false);\n\n  return (\n    <Box\n      sx={{\n        position: 'absolute',\n        inset: '0px',\n        overflow: 'hidden',\n        borderRadius: 'inherit',\n        ...(!flipOnHover && !isFlipped\n          ? {\n              pointerEvents: 'none',\n            }\n          : {}),\n        ...containerSx,\n      }}\n      ref={containerRef}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      aria-hidden={!flipped}\n      {...restContainer}\n    >\n      <Slide in={flipped} direction=\"up\" container={containerRef.current} {...slideProps}>\n        <CardContent\n          sx={{\n            position: 'absolute',\n            inset: '0',\n            backgroundColor: 'surface.primary',\n            overflow: 'auto',\n            ...sx,\n          }}\n          {...rest}\n        >\n          {children}\n        </CardContent>\n      </Slide>\n    </Box>\n  );\n};\n"],"names":["FlippingCardContent","_a","children","disabled","isFlipped","flipOnHover","sx","containerProps","slideProps","rest","__rest","_b","containerSx","restContainer","containerRef","useRef","flipped","setFlipped","useState","useEffect","_jsx","Box","Object","assign","position","inset","overflow","borderRadius","pointerEvents","ref","onMouseEnter","onMouseLeave","Slide","in","direction","container","current","CardContent","backgroundColor"],"mappings":"mMA4Ba,MAAAA,EAAqDC,QAAAC,SAChEA,EAAQC,SACRA,EAAQC,UACRA,GAAY,EAAKC,YACjBA,GAAc,EAAIC,GAClBA,EAAEC,eACFA,EAAcC,WACdA,KACGC,EAR6DC,EAAAT,EAAA,CAAA,WAAA,WAAA,YAAA,cAAA,KAAA,iBAAA,eAUhE,MAAMU,EAAwCJ,GAAkB,IAAxDD,GAAIM,KAAgBC,EAAtBH,EAAAC,EAAA,CAAA,OACAG,EAAeC,EAAO,OAErBC,EAASC,GAAcC,EAASd,GAIvCe,GAAU,KACRF,EAAWb,EAAU,GACpB,CAACA,IAKJ,OACEgB,EAACC,EACCC,OAAAC,OAAA,CAAAjB,GACEgB,OAAAC,OAAAD,OAAAC,OAAA,CAAAC,SAAU,WACVC,MAAO,MACPC,SAAU,SACVC,aAAc,WACTtB,GAAgBD,EAIjB,CAAA,EAHA,CACEwB,cAAe,SAGlBhB,GAELiB,IAAKf,EACLgB,aAlBqB,KAAO3B,GAAYE,GAAeY,GAAW,GAmBlEc,aAlBqB,KAAO5B,GAAYE,GAAeY,GAAW,GAmBrD,eAACD,GACVH,EAAa,CAAAX,SAEjBkB,EAACY,EAAKV,OAAAC,OAAA,CAACU,GAAIjB,EAASkB,UAAU,KAAKC,UAAWrB,EAAasB,SAAa5B,EAAU,CAAAN,SAChFkB,EAACiB,EAAWf,OAAAC,OAAA,CACVjB,GAAEgB,OAAAC,OAAA,CACAC,SAAU,WACVC,MAAO,IACPa,gBAAiB,kBACjBZ,SAAU,QACPpB,IAEDG,YAEHP,UAGD"}
+{"version":3,"file":"FlippingCardContent.js","sources":["../../../src/materialui/card/FlippingCardContent.tsx"],"sourcesContent":["import { FC, useEffect, useRef, useState } from 'react';\nimport { Slide, SlideProps, CardContent, CardContentProps, ButtonBase, ButtonBaseProps } from '@mui/material';\n\nexport interface FlippingCardContentProps extends CardContentProps {\n  disabled?: boolean;\n  /**\n   * Specifies if detail should be flipped on card hover\n   * @default true\n   */\n  flipOnHover?: boolean;\n  /**\n   * Specifies if detail should be flipped\n   * @default false\n   */\n  isFlipped?: boolean;\n  /**\n   * Properties applied to wrapper component\n   */\n  containerProps?: ButtonBaseProps;\n  /**\n   * Properties applied to <Slide /> component\n   */\n  slideProps?: SlideProps;\n}\n\n/**\n * Sub-element for Card component for flipping content\n */\nexport const FlippingCardContent: FC<FlippingCardContentProps> = ({\n  children,\n  disabled,\n  isFlipped = false,\n  flipOnHover = true,\n  sx,\n  className,\n  containerProps,\n  slideProps,\n  ...rest\n}) => {\n  const { sx: containerSx, ...restContainer } = containerProps || {};\n  const containerRef = useRef(null);\n\n  const [flipped, setFlipped] = useState(isFlipped);\n  /**\n   * Detect controlled state\n   */\n  useEffect(() => {\n    setFlipped(isFlipped);\n  }, [isFlipped]);\n\n  const handleMouseEnter = () => !disabled && flipOnHover && setFlipped(true);\n  const handleMouseLeave = () => !disabled && flipOnHover && setFlipped(false);\n\n  return (\n    <ButtonBase\n      sx={{\n        display: 'block',\n        textAlign: 'left',\n        position: 'absolute',\n        inset: '0px',\n        overflow: 'hidden',\n        borderRadius: 'inherit',\n        ...(!flipOnHover && !isFlipped\n          ? {\n              pointerEvents: 'none',\n            }\n          : {}),\n        ...containerSx,\n      }}\n      component=\"div\"\n      ref={containerRef}\n      onFocus={handleMouseEnter}\n      onBlur={handleMouseLeave}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      aria-hidden={!flipped}\n      className={['FlowFlippingCardContent-root', className].filter(Boolean).join(', ')}\n      {...restContainer}\n    >\n      <Slide in={flipped} direction=\"up\" container={containerRef.current} {...slideProps}>\n        <CardContent\n          sx={{\n            position: 'absolute',\n            inset: '0',\n            backgroundColor: 'surface.primary',\n            overflow: 'auto',\n            ...sx,\n          }}\n          {...rest}\n        >\n          {children}\n        </CardContent>\n      </Slide>\n    </ButtonBase>\n  );\n};\n"],"names":["FlippingCardContent","_a","children","disabled","isFlipped","flipOnHover","sx","className","containerProps","slideProps","rest","__rest","_b","containerSx","restContainer","containerRef","useRef","flipped","setFlipped","useState","useEffect","handleMouseEnter","handleMouseLeave","_jsx","ButtonBase","Object","assign","display","textAlign","position","inset","overflow","borderRadius","pointerEvents","component","ref","onFocus","onBlur","onMouseEnter","onMouseLeave","filter","Boolean","join","Slide","in","direction","container","current","CardContent","backgroundColor"],"mappings":"0MA4Ba,MAAAA,EAAqDC,QAAAC,SAChEA,EAAQC,SACRA,EAAQC,UACRA,GAAY,EAAKC,YACjBA,GAAc,EAAIC,GAClBA,EAAEC,UACFA,EAASC,eACTA,EAAcC,WACdA,KACGC,EAT6DC,EAAAV,EAAA,CAAA,WAAA,WAAA,YAAA,cAAA,KAAA,YAAA,iBAAA,eAWhE,MAAMW,EAAwCJ,GAAkB,IAAxDF,GAAIO,KAAgBC,EAAtBH,EAAAC,EAAA,CAAA,OACAG,EAAeC,EAAO,OAErBC,EAASC,GAAcC,EAASf,GAIvCgB,GAAU,KACRF,EAAWd,EAAU,GACpB,CAACA,IAEJ,MAAMiB,EAAmB,KAAOlB,GAAYE,GAAea,GAAW,GAChEI,EAAmB,KAAOnB,GAAYE,GAAea,GAAW,GAEtE,OACEK,EAACC,EAAUC,OAAAC,OAAA,CACTpB,GACEmB,OAAAC,OAAAD,OAAAC,OAAA,CAAAC,QAAS,QACTC,UAAW,OACXC,SAAU,WACVC,MAAO,MACPC,SAAU,SACVC,aAAc,WACT3B,GAAgBD,EAIjB,CAAE,EAHF,CACE6B,cAAe,SAGlBpB,GAELqB,UAAU,MACVC,IAAKpB,EACLqB,QAASf,EACTgB,OAAQf,EACRgB,aAAcjB,EACdkB,aAAcjB,EAAgB,eAChBL,EACdV,UAAW,CAAC,+BAAgCA,GAAWiC,OAAOC,SAASC,KAAK,OACxE5B,EAEJ,CAAAZ,SAAAqB,EAACoB,EAAMlB,OAAAC,OAAA,CAAAkB,GAAI3B,EAAS4B,UAAU,KAAKC,UAAW/B,EAAagC,SAAatC,EACtE,CAAAP,SAAAqB,EAACyB,EAAWvB,OAAAC,OAAA,CACVpB,GAAEmB,OAAAC,OAAA,CACAG,SAAU,WACVC,MAAO,IACPmB,gBAAiB,kBACjBlB,SAAU,QACPzB,IAEDI,EAAI,CAAAR,SAEPA,UAGM"}

package/materialui/card/card.theme.js

@@ -1,2 +1,2 @@
-import{Card as r}from"./Card.js";import{getFocusRingStyle as o}from"../../components/focusring/focusring.js";const e={defaultProps:{elevation:0,component:r},styleOverrides:{root:({theme:r,color:e,disabled:a,isSelected:t})=>Object.assign(Object.assign(Object.assign({backgroundColor:["grey","secondary"].includes(e)?r.palette.surface.primary:r.palette.background.primary,position:"relative",borderRadius:"8px",overflow:"visible",border:"1px solid transparent","&::after":Object.assign({content:'""',position:"absolute",maxWidth:"none",borderStyle:"solid",borderRadius:"inherit",pointerEvents:"none",zIndex:"1",inset:"-1px",borderWidth:"1px",borderColor:r.palette.onSurface.os100},!a&&t&&{inset:"-3px",borderWidth:"3px",borderColor:r.palette.brand.primary})},!a&&t&&{"& .FlowCard-Icon-root":{borderColor:r.palette.brand.primary,backgroundColor:r.palette.brand.primary,color:r.palette.common.white},"&:hover":{"&::after":{borderColor:r.palette.brandHover.primary}}}),!a&&Object.assign({"&:has(.MuiCardActionArea-root):hover":{"&::after":Object.assign({inset:"-3px",borderWidth:"3px"},t&&{borderColor:r.palette.brandHover.primary}),"& .FlowCard-Icon-root":Object.assign(Object.assign({backgroundColor:r.palette.surface.primary},"secondary"===e&&{backgroundColor:r.palette.surface.secondary,borderColor:r.palette.onSurface.os200}),t&&{backgroundColor:r.palette.brandHover.primary,borderColor:r.palette.brandHover.primary})},"&:has(.MuiCardActionArea-root):hover, &:has(.MuiCardActionArea-root.Mui-focusVisible)":{"& .FlowCard-Icon-root .MuiSvgIcon-root":{"&:first-of-type":{display:"none"},"&:last-of-type":{display:"block"}}}},o(r,!1,3,":has(.MuiCardActionArea-root.Mui-focusVisible)"))),a&&{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{e as flowCard};
+import{Card as r}from"./Card.js";import{getFocusRingStyle as o}from"../../components/focusring/focusring.js";import{getInteractiveStyle as e}from"../button/interactive.js";const t={defaultProps:{elevation:0,component:r},styleOverrides:{root:({theme:r,color:t,disabled:a,isSelected:i})=>Object.assign(Object.assign(Object.assign({backgroundColor:["grey","secondary"].includes(t)?r.palette.surface.primary:r.palette.background.primary,position:"relative",borderRadius:"8px",overflow:"visible",border:"1px solid transparent","&::after":Object.assign({content:'""',position:"absolute",maxWidth:"none",borderStyle:"solid",borderRadius:"inherit",pointerEvents:"none",zIndex:"1",inset:"-1px",borderWidth:"1px",borderColor:r.palette.onSurface.os100},!a&&i&&{inset:"-3px",borderWidth:"3px",borderColor:r.palette.brand.primary})},!a&&i&&{"& .FlowCard-Icon-root":{color:r.palette.common.white,backgroundColor:r.palette.brand.primary,borderColor:r.palette.brand.primary},"&:hover":{"&::after":{borderColor:r.palette.brandHover.primary}}}),!a&&Object.assign({"&:has(.MuiCardActionArea-root)":Object.assign({},e({"&::after":Object.assign({inset:"-1px",borderWidth:"1px",borderColor:r.palette.onSurface.os100},i&&{inset:"-3px",borderWidth:"3px",borderColor:r.palette.brand.primary}),"& .FlowCard-Icon-root":Object.assign(Object.assign({backgroundColor:r.palette.background.primary},"secondary"===t&&{backgroundColor:r.palette.surface.primary}),i&&{backgroundColor:r.palette.brand.primary,borderColor:r.palette.brand.primary}),"& .FlowCard-Icon-root .MuiSvgIcon-root":{"&:first-of-type":{display:"block"},"&:last-of-type":{display:"none"}}},{"&::after":Object.assign({inset:"-3px",borderWidth:"3px"},i&&{borderColor:r.palette.brandHover.primary}),"& .FlowCard-Icon-root":Object.assign(Object.assign({backgroundColor:r.palette.surface.primary},"secondary"===t&&{backgroundColor:r.palette.surface.secondary}),i&&{backgroundColor:r.palette.brandHover.primary,borderColor:r.palette.brandHover.primary}),"& .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)"))),a&&{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{t as flowCard};
 //# sourceMappingURL=card.theme.js.map

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

@@ -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 { Card } from './Card';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\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: Card,\n  },\n  styleOverrides: {\n    root: ({ theme, color, disabled, isSelected }) => ({\n      backgroundColor: ['grey', 'secondary'].includes(color)\n        ? theme.palette.surface.primary\n        : 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        // 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            borderColor: theme.palette.brand.primary,\n            backgroundColor: theme.palette.brand.primary,\n            color: theme.palette.common.white,\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 CardActionArea exists\n      ...(!disabled && {\n        '&:has(.MuiCardActionArea-root):hover': {\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              borderColor: theme.palette.onSurface.os200,\n            }),\n            ...(isSelected && {\n              backgroundColor: theme.palette.brandHover.primary,\n              borderColor: theme.palette.brandHover.primary,\n            }),\n          },\n        },\n        '&:has(.MuiCardActionArea-root):hover, &:has(.MuiCardActionArea-root.Mui-focusVisible)': {\n          // flip icon being shown\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        ...getFocusRingStyle(theme, false, 3, ':has(.MuiCardActionArea-root.Mui-focusVisible)'),\n      }),\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","Card","styleOverrides","root","theme","color","disabled","isSelected","Object","assign","backgroundColor","includes","palette","surface","primary","background","position","borderRadius","overflow","border","content","maxWidth","borderStyle","pointerEvents","zIndex","inset","borderWidth","borderColor","onSurface","os100","brand","common","white","brandHover","secondary","os200","display","getFocusRingStyle","cursor","userSelect","tertiary","opacity","variants","props","raised","style","boxShadow","flowShadows"],"mappings":"6GAKa,MAAAA,EAAyC,CACpDC,aAAc,CACZC,UAAW,EAEXC,UAAWC,GAEbC,eAAgB,CACdC,KAAM,EAAGC,QAAOC,QAAOC,WAAUC,gBAC/BC,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,CAAAC,gBAAiB,CAAC,OAAQ,aAAaC,SAASN,GAC5CD,EAAMQ,QAAQC,QAAQC,QACtBV,EAAMQ,QAAQG,WAAWD,QAC7BE,SAAU,WACVC,aAAc,MACdC,SAAU,UAGVC,OAAQ,wBACR,WACEX,OAAAC,OAAA,CAAAW,QAAS,KACTJ,SAAU,WACVK,SAAU,OACVC,YAAa,QACbL,aAAc,UACdM,cAAe,OACfC,OAAQ,IAERC,MAAO,OACPC,YAAa,MACbC,YAAavB,EAAMQ,QAAQgB,UAAUC,QAEhCvB,GACHC,GAAc,CAEZkB,MAAO,OACPC,YAAa,MACbC,YAAavB,EAAMQ,QAAQkB,MAAMhB,YAIlCR,GACHC,GAAc,CAEZ,wBAAyB,CACvBoB,YAAavB,EAAMQ,QAAQkB,MAAMhB,QACjCJ,gBAAiBN,EAAMQ,QAAQkB,MAAMhB,QACrCT,MAAOD,EAAMQ,QAAQmB,OAAOC,OAG9B,UAAW,CACT,WAAY,CACVL,YAAavB,EAAMQ,QAAQqB,WAAWnB,aAKzCR,GAAQE,OAAAC,OAAA,CACX,uCAAwC,CAEtC,WAAUD,OAAAC,OAAA,CACRgB,MAAO,OACPC,YAAa,OACTnB,GAAc,CAChBoB,YAAavB,EAAMQ,QAAQqB,WAAWnB,UAI1C,wBACEN,OAAAC,OAAAD,OAAAC,OAAA,CAAAC,gBAAiBN,EAAMQ,QAAQC,QAAQC,SACzB,cAAVT,GAAyB,CAC3BK,gBAAiBN,EAAMQ,QAAQC,QAAQqB,UACvCP,YAAavB,EAAMQ,QAAQgB,UAAUO,QAEnC5B,GAAc,CAChBG,gBAAiBN,EAAMQ,QAAQqB,WAAWnB,QAC1Ca,YAAavB,EAAMQ,QAAQqB,WAAWnB,WAI5C,wFAAyF,CAEvF,yCAA0C,CACxC,kBAAmB,CACjBsB,QAAS,QAEX,iBAAkB,CAChBA,QAAS,YAIZC,EAAkBjC,GAAO,EAAO,EAAG,oDAEpCE,GAAY,CACdI,gBAAiBN,EAAMQ,QAAQC,QAAQC,QACvCa,YAAavB,EAAMQ,QAAQN,SAAS4B,UACpCI,OAAQ,cACRC,WAAY,OACZhB,cAAe,OAEf,wBAAyB,CACvBb,gBAAiBN,EAAMQ,QAAQN,SAAS4B,UACxC7B,MAAOD,EAAMQ,QAAQN,SAASkC,UAGhC,2BAA4B,CAC1BnC,MAAOD,EAAMQ,QAAQN,SAASkC,UAGhC,QAAS,CACPC,QAAS,UAKjBC,SAAU,CACR,CACEC,MAAO,CAAEC,QAAQ,GACjBC,MAAO,EAAGzC,YAAa,CACrB0C,UAAW1C,EAAM2C,YAAgB"}
+{"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 { Card } 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: Card,\n  },\n  styleOverrides: {\n    root: ({ theme, color, disabled, isSelected }) => ({\n      backgroundColor: ['grey', 'secondary'].includes(color)\n        ? theme.palette.surface.primary\n        : 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          },\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              },\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              // 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              '& .FlowCard-Icon-root .MuiSvgIcon-root': {\n                '&:first-of-type': {\n                  display: 'none',\n                },\n                '&:last-of-type': {\n                  display: 'block',\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","Card","styleOverrides","root","theme","color","disabled","isSelected","Object","assign","backgroundColor","includes","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":"4KAMa,MAAAA,EAAyC,CACpDC,aAAc,CACZC,UAAW,EAEXC,UAAWC,GAEbC,eAAgB,CACdC,KAAM,EAAGC,QAAOC,QAAOC,WAAUC,gBAC/BC,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,CAAAC,gBAAiB,CAAC,OAAQ,aAAaC,SAASN,GAC5CD,EAAMQ,QAAQC,QAAQC,QACtBV,EAAMQ,QAAQG,WAAWD,QAC7BE,SAAU,WACVC,aAAc,MACdC,SAAU,UAGVC,OAAQ,wBACR,WACEX,OAAAC,OAAA,CAAAW,QAAS,KACTJ,SAAU,WACVK,SAAU,OACVC,YAAa,QACbL,aAAc,UACdM,cAAe,OACfC,OAAQ,IAGRC,MAAO,OACPC,YAAa,MACbC,YAAavB,EAAMQ,QAAQgB,UAAUC,QAEhCvB,GACHC,GAAc,CAEZkB,MAAO,OACPC,YAAa,MACbC,YAAavB,EAAMQ,QAAQkB,MAAMhB,YAIlCR,GACHC,GAAc,CAEZ,wBAAyB,CACvBF,MAAOD,EAAMQ,QAAQmB,OAAOC,MAC5BtB,gBAAiBN,EAAMQ,QAAQkB,MAAMhB,QACrCa,YAAavB,EAAMQ,QAAQkB,MAAMhB,SAGnC,UAAW,CACT,WAAY,CACVa,YAAavB,EAAMQ,QAAQqB,WAAWnB,aAKzCR,kBACH,iCAAgCE,OAAAC,OAAA,CAAA,EAC3ByB,EACD,CACE,WAAU1B,OAAAC,OAAA,CACRgB,MAAO,OACPC,YAAa,MACbC,YAAavB,EAAMQ,QAAQgB,UAAUC,OAEjCtB,GAAc,CAChBkB,MAAO,OACPC,YAAa,MACbC,YAAavB,EAAMQ,QAAQkB,MAAMhB,UAIrC,wBACEN,OAAAC,OAAAD,OAAAC,OAAA,CAAAC,gBAAiBN,EAAMQ,QAAQG,WAAWD,SAC5B,cAAVT,GAAyB,CAC3BK,gBAAiBN,EAAMQ,QAAQC,QAAQC,UAErCP,GAAc,CAChBG,gBAAiBN,EAAMQ,QAAQkB,MAAMhB,QACrCa,YAAavB,EAAMQ,QAAQkB,MAAMhB,UAGrC,yCAA0C,CACxC,kBAAmB,CACjBqB,QAAS,SAEX,iBAAkB,CAChBA,QAAS,UAIf,CAEE,WAAU3B,OAAAC,OAAA,CACRgB,MAAO,OACPC,YAAa,OACTnB,GAAc,CAChBoB,YAAavB,EAAMQ,QAAQqB,WAAWnB,UAI1C,wBACEN,OAAAC,OAAAD,OAAAC,OAAA,CAAAC,gBAAiBN,EAAMQ,QAAQC,QAAQC,SACzB,cAAVT,GAAyB,CAC3BK,gBAAiBN,EAAMQ,QAAQC,QAAQuB,YAErC7B,GAAc,CAChBG,gBAAiBN,EAAMQ,QAAQqB,WAAWnB,QAC1Ca,YAAavB,EAAMQ,QAAQqB,WAAWnB,UAI1C,yCAA0C,CACxC,kBAAmB,CACjBqB,QAAS,QAEX,iBAAkB,CAChBA,QAAS,WAIf,KACA,KACA,qDAGDE,EACDjC,GACA,EACA,EACA,oGAIAE,GAAY,CACdI,gBAAiBN,EAAMQ,QAAQC,QAAQC,QACvCa,YAAavB,EAAMQ,QAAQN,SAAS8B,UACpCE,OAAQ,cACRC,WAAY,OACZhB,cAAe,OAEf,wBAAyB,CACvBb,gBAAiBN,EAAMQ,QAAQN,SAAS8B,UACxC/B,MAAOD,EAAMQ,QAAQN,SAASkC,UAGhC,2BAA4B,CAC1BnC,MAAOD,EAAMQ,QAAQN,SAASkC,UAGhC,QAAS,CACPC,QAAS,UAKjBC,SAAU,CACR,CACEC,MAAO,CAAEC,QAAQ,GACjBC,MAAO,EAAGzC,YAAa,CACrB0C,UAAW1C,EAAM2C,YAAgB"}

package/materialui/chip/chip.theme.js

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import{CloseIcon as r}from"../../components/icon/stroke/CloseIcon.js";import{getFocusRingStyle as o,updateFocusRingStyle as t}from"../../components/focusring/focusring.js";import{getInteractiveStyle as a}from"../button/interactive.js";function n(e,r){return Object.assign(Object.assign({},e),{"&.MuiButtonBase-root":Object.assign({},a(e,r))})}function i(e,r,o,t){return"outlined"===r?{backgroundColor:t?e.palette.surface.primary:e.palette.onSurface.os0,color:o,borderColor:o}:{backgroundColor:o,color:e.palette.onSurface.os0,borderColor:o}}const s={defaultProps:{deleteIcon:e(r,{})},styleOverrides:{root:({theme:e,ownerState:r})=>{var a,s,c;return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({position:"relative",height:"auto",minWidth:"0",padding:"5px 16px"},"small"===r.size&&{padding:"2px 12px"}),{textRendering:"geometricPrecision",textTransform:"none",fontSize:"16px",lineHeight:"20px",fontWeight:"400",letterSpacing:"0px",outline:"none",borderRadius:"1000px",textAlign:"center",transition:"transform 0.3s ease-out, color 0.3s ease-out, background-color 0.3s ease-out, border-color 0.3s ease-out, box-shadow 0.3s ease-out, opacity 0.3s ease-out","&&.MuiButtonBase-root":{cursor:"pointer"},"&, &:active":Object.assign({boxShadow:"none"},(r.raised||(null===(a=r.className)||void 0===a?void 0:a.includes(".MuiChip-shadow")))&&{boxShadow:e.flowShadows.xs}),border:`1px solid ${e.palette.onSurface.os900}`}),n(Object.assign({backgroundColor:e.palette.surface.primary,color:e.palette.text.primary,borderColor:e.palette.text.primary},(r.raised||(null===(s=r.className)||void 0===s?void 0:s.includes(".MuiChip-shadow")))&&{backgroundColor:e.palette.background.primary}),Object.assign({backgroundColor:e.palette.surface.secondary,color:e.palette.text.primary,borderColor:e.palette.text.primary},(r.raised||(null===(c=r.className)||void 0===c?void 0:c.includes(".MuiChip-shadow")))&&{backgroundColor:e.palette.surface.primary}))),"transparent"===r.variant&&Object.assign({},n({backgroundColor:e.palette.transparent.primary},{backgroundColor:e.palette.transparent.secondary}))),"secondary"===r.color&&"outlined"!==r.variant&&Object.assign({},n({backgroundColor:e.palette.secondary.main,color:e.palette.common.white,borderColor:e.palette.secondary.main},{backgroundColor:e.palette.secondary.dark,color:e.palette.common.white,borderColor:e.palette.secondary.dark}))),"error"===r.color&&Object.assign({},n(Object.assign({},i(e,r.variant,e.palette.error.main)),Object.assign({},i(e,r.variant,e.palette.error.dark,!0))))),"warning"===r.color&&Object.assign({},n(Object.assign({},i(e,r.variant,e.palette.warning.main)),Object.assign({},i(e,r.variant,e.palette.warning.dark,!0))))),"info"===r.color&&Object.assign({},n(Object.assign({},i(e,r.variant,e.palette.info.main)),Object.assign({},i(e,r.variant,e.palette.info.dark,!0))))),(r.isSelected||["success","primary"].includes(r.color))&&Object.assign(Object.assign({borderWidth:"2px",padding:"4px 15px"},"small"===r.size&&{padding:"1px 11px"}),n("dark"===e.palette.mode?{backgroundColor:e.palette.onSurface.os800,color:e.palette.brand.secondary,borderColor:e.palette.brand.secondary}:{backgroundColor:e.palette.brand.quarternary,color:e.palette.brand.primary,borderColor:e.palette.brand.primary},"dark"===e.palette.mode?{backgroundColor:e.palette.onSurface.os800,color:e.palette.brandHover.secondary,borderColor:e.palette.brandHover.secondary}:{backgroundColor:e.palette.brand.quarternary,color:e.palette.brandHover.primary,borderColor:e.palette.brandHover.primary}))),{"&.Mui-disabled":Object.assign({opacity:"1",userSelect:"none",color:e.palette.disabled.primary,backgroundColor:e.palette.surface.primary,borderColor:e.palette.disabled.primary},"transparent"===r.variant&&{backgroundColor:e.palette.transparent.primary})}),o(e,!0,1)),(r.isSelected||["success","primary"].includes(r.color))&&Object.assign({},t(2))),{"& .count":Object.assign(Object.assign({},"dark"===e.palette.mode?{backgroundColor:e.palette.brand.secondary,color:e.palette.onSurface.os900}:{backgroundColor:e.palette.brand.primary,color:e.palette.common.white}),{minWidth:"20px",height:"20px",borderRadius:"20px",paddingLeft:"4px",paddingRight:"4px",textAlign:"center",marginLeft:"10px",fontSize:"14px",lineHeight:"20px",fontWeight:"700","& + .MuiChip-deleteIcon":{marginLeft:"5px"}}),"& .chevron-down, & .chevron-up, & .MuiSvgIcon-root:last-child":{fontSize:"17px",marginRight:"0",marginLeft:"10px"},"&.chevron-down.isOpen, & .MuiSvgIcon-root:last-child.isOpen":{transform:"rotate(180deg)"}})},icon:{"&, &:hover":{color:"currentColor"},fontSize:"17px",marginRight:"10px",marginLeft:"0"},deleteIcon:{"&, &:hover":{color:"currentColor"},fontSize:"17px",marginRight:"0",marginLeft:"10px"},label:{display:"inline-flex",alignItems:"center",justifyContent:"flex-start",padding:"0"}}};export{s as flowChip};
+import{jsx as e}from"react/jsx-runtime";import{CloseIcon as r}from"../../components/icon/stroke/CloseIcon.js";import{getFocusRingStyle as o,updateFocusRingStyle as a}from"../../components/focusring/focusring.js";import{getInteractiveStyle as t}from"../button/interactive.js";function n(e,r){return Object.assign(Object.assign({},e),{"&.MuiButtonBase-root":Object.assign({},t(e,r))})}function i(e,r,o,a){return"outlined"===r?{backgroundColor:a?e.palette.transparent.secondary:"transparent",color:o,borderColor:o}:{backgroundColor:o,color:e.palette.onSurface.os0,borderColor:o}}const s={defaultProps:{deleteIcon:e(r,{})},styleOverrides:{root:({theme:e,ownerState:r})=>{var t,s,c;return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({position:"relative",height:"auto",minWidth:"0",padding:"5px 16px"},"small"===r.size&&{padding:"2px 12px"}),{textRendering:"geometricPrecision",textTransform:"none",fontSize:"16px",lineHeight:"20px",fontWeight:"400",letterSpacing:"0px",outline:"none",borderRadius:"1000px",textAlign:"center",transition:"transform 0.3s ease-out, color 0.3s ease-out, background-color 0.3s ease-out, border-color 0.3s ease-out, box-shadow 0.3s ease-out, opacity 0.3s ease-out","&&.MuiButtonBase-root":{cursor:"pointer"},"&, &:active":Object.assign({boxShadow:"none"},(r.raised||(null===(t=r.className)||void 0===t?void 0:t.includes(".MuiChip-shadow")))&&{boxShadow:e.flowShadows.xs}),border:`1px solid ${e.palette.onSurface.os900}`}),n(Object.assign({backgroundColor:e.palette.surface.primary,color:e.palette.text.primary,borderColor:e.palette.onSurface.os500},(r.raised||(null===(s=r.className)||void 0===s?void 0:s.includes(".MuiChip-shadow")))&&{backgroundColor:e.palette.background.primary}),Object.assign({backgroundColor:e.palette.surface.secondary,color:e.palette.text.primary,borderColor:e.palette.onSurface.os500},(r.raised||(null===(c=r.className)||void 0===c?void 0:c.includes(".MuiChip-shadow")))&&{backgroundColor:e.palette.surface.primary}))),"transparent"===r.variant&&Object.assign({},n({backgroundColor:e.palette.transparent.primary},{backgroundColor:e.palette.transparent.secondary}))),"secondary"===r.color&&"outlined"!==r.variant&&Object.assign({},n({backgroundColor:e.palette.secondary.main,color:e.palette.common.white,borderColor:e.palette.secondary.main},{backgroundColor:e.palette.secondary.dark,color:e.palette.common.white,borderColor:e.palette.secondary.dark}))),"error"===r.color&&Object.assign({},n(Object.assign({},i(e,r.variant,e.palette.error.main)),Object.assign({},i(e,r.variant,e.palette.error.dark,!0))))),"warning"===r.color&&Object.assign({},n(Object.assign({},i(e,r.variant,e.palette.warning.main)),Object.assign({},i(e,r.variant,e.palette.warning.dark,!0))))),"info"===r.color&&Object.assign({},n(Object.assign({},i(e,r.variant,e.palette.info.main)),Object.assign({},i(e,r.variant,e.palette.info.dark,!0))))),(r.isSelected||["success","primary"].includes(r.color))&&Object.assign(Object.assign({borderWidth:"2px",padding:"4px 15px"},"small"===r.size&&{padding:"1px 11px"}),n("dark"===e.palette.mode?{backgroundColor:e.palette.onSurface.os800,color:e.palette.brand.secondary,borderColor:e.palette.brand.secondary}:{backgroundColor:e.palette.brand.quarternary,color:e.palette.brand.primary,borderColor:e.palette.brand.primary},"dark"===e.palette.mode?{backgroundColor:e.palette.onSurface.os800,color:e.palette.brandHover.secondary,borderColor:e.palette.brandHover.secondary}:{backgroundColor:e.palette.brand.quarternary,color:e.palette.brandHover.primary,borderColor:e.palette.brandHover.primary}))),{"&.Mui-disabled":Object.assign({opacity:"1",userSelect:"none",color:e.palette.disabled.primary,backgroundColor:e.palette.surface.primary,borderColor:e.palette.disabled.primary},"transparent"===r.variant&&{backgroundColor:e.palette.transparent.primary})}),o(e,!0,1)),(r.isSelected||["success","primary"].includes(r.color))&&Object.assign({},a(2))),{"& .count":Object.assign(Object.assign({},"dark"===e.palette.mode?{backgroundColor:e.palette.brand.secondary,color:e.palette.onSurface.os900}:{backgroundColor:e.palette.brand.primary,color:e.palette.common.white}),{minWidth:"20px",height:"20px",borderRadius:"20px",paddingLeft:"4px",paddingRight:"4px",textAlign:"center",marginLeft:"10px",fontSize:"14px",lineHeight:"20px",fontWeight:"700","& + .MuiChip-deleteIcon":{marginLeft:"5px"}}),"& .chevron-down, & .chevron-up, & .MuiSvgIcon-root:last-child":{fontSize:"17px",marginRight:"0",marginLeft:"10px"},"&.chevron-down.isOpen, & .MuiSvgIcon-root:last-child.isOpen":{transform:"rotate(180deg)"}})},icon:{"&, &:hover":{color:"currentColor"},fontSize:"17px",marginRight:"10px",marginLeft:"0"},deleteIcon:{"&, &:hover":{color:"currentColor"},fontSize:"17px",marginRight:"0",marginLeft:"10px"},label:{display:"inline-flex",alignItems:"center",justifyContent:"flex-start",padding:"0"}}};export{s as flowChip};
 //# sourceMappingURL=chip.theme.js.map

package/materialui/chip/chip.theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.theme.js","sources":["../../../src/materialui/chip/chip.theme.tsx"],"sourcesContent":["import { Components } from '@mui/material/styles/components';\nimport { CSSObject, Theme } from '@mui/material';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\nimport { getFocusRingStyle, updateFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\n/**\n * Wrapper around getInteractiveStyle() function to provide interactive style\n *  only for chip that is actually a button\n */\nfunction getChipInteractiveStyle(defaultStyle: CSSObject, hoverStyle: CSSObject): CSSObject {\n  return {\n    ...defaultStyle,\n    '&.MuiButtonBase-root': {\n      ...getInteractiveStyle(defaultStyle, hoverStyle),\n    },\n  };\n}\n\n/**\n * Return style for either outlined or filled variant. Used by deprecated semantic colors\n */\nfunction getVariantStyle(theme: Theme, variant: string, primaryColor: string, hover?: boolean): CSSObject {\n  if (variant === 'outlined') {\n    return {\n      backgroundColor: hover ? theme.palette.surface.primary : theme.palette.onSurface.os0,\n      color: primaryColor,\n      borderColor: primaryColor,\n    };\n  } else {\n    return {\n      backgroundColor: primaryColor,\n      color: theme.palette.onSurface.os0,\n      borderColor: primaryColor,\n    };\n  }\n}\n\nexport const flowChip: Components<Theme>['MuiChip'] = {\n  defaultProps: {\n    deleteIcon: <CloseIcon />,\n  },\n  styleOverrides: {\n    root: ({ theme, ownerState }) => ({\n      position: 'relative',\n      // proportions\n      height: 'auto',\n      minWidth: '0',\n      padding: '5px 16px',\n      // not recommended small variant\n      ...(ownerState.size === 'small' && {\n        padding: '2px 12px',\n      }),\n      // custom font size\n      textRendering: 'geometricPrecision',\n      textTransform: 'none',\n      fontSize: '16px',\n      lineHeight: '20px',\n      fontWeight: '400',\n      letterSpacing: '0px',\n      outline: 'none',\n      // 50% border radius without skewing ratio\n      borderRadius: '1000px',\n      textAlign: 'center',\n      transition:\n        'transform 0.3s ease-out, color 0.3s ease-out, background-color 0.3s ease-out, border-color 0.3s ease-out, box-shadow 0.3s ease-out, opacity 0.3s ease-out',\n      // correct cursor if the chip is clickable button\n      '&&.MuiButtonBase-root': {\n        cursor: 'pointer',\n      },\n      // more important selector to overwrite default @mui styling\n      '&, &:active': {\n        boxShadow: 'none',\n        // drop shadow variant (+ old API support)\n        ...((ownerState.raised || ownerState.className?.includes('.MuiChip-shadow')) && {\n          boxShadow: theme.flowShadows.xs,\n        }),\n      },\n      // style (default 'filled' (solid) variant)\n      border: `1px solid ${theme.palette.onSurface.os900}`,\n      ...getChipInteractiveStyle(\n        {\n          backgroundColor: theme.palette.surface.primary,\n          color: theme.palette.text.primary,\n          borderColor: theme.palette.text.primary,\n          // drop shadow variant (+ old API support)\n          ...((ownerState.raised || ownerState.className?.includes('.MuiChip-shadow')) && {\n            backgroundColor: theme.palette.background.primary,\n          }),\n        },\n        {\n          backgroundColor: theme.palette.surface.secondary,\n          color: theme.palette.text.primary,\n          borderColor: theme.palette.text.primary,\n          // drop shadow variant (+ old API support)\n          ...((ownerState.raised || ownerState.className?.includes('.MuiChip-shadow')) && {\n            backgroundColor: theme.palette.surface.primary,\n          }),\n        },\n      ),\n      // transparent variant\n      ...(ownerState.variant === 'transparent' && {\n        ...getChipInteractiveStyle(\n          {\n            backgroundColor: theme.palette.transparent.primary,\n          },\n          {\n            backgroundColor: theme.palette.transparent.secondary,\n          },\n        ),\n      }),\n      // deprecated secondary color\n      ...(ownerState.color === 'secondary' &&\n        ownerState.variant !== 'outlined' && {\n          ...getChipInteractiveStyle(\n            {\n              backgroundColor: theme.palette.secondary.main,\n              color: theme.palette.common.white,\n              borderColor: theme.palette.secondary.main,\n            },\n            {\n              backgroundColor: theme.palette.secondary.dark,\n              color: theme.palette.common.white,\n              borderColor: theme.palette.secondary.dark,\n            },\n          ),\n        }),\n      // deprecated semantic colors\n      ...(ownerState.color === 'error' && {\n        ...getChipInteractiveStyle(\n          {\n            ...getVariantStyle(theme, ownerState.variant, theme.palette.error.main),\n          },\n          {\n            ...getVariantStyle(theme, ownerState.variant, theme.palette.error.dark, true),\n          },\n        ),\n      }),\n      ...(ownerState.color === 'warning' && {\n        ...getChipInteractiveStyle(\n          {\n            ...getVariantStyle(theme, ownerState.variant, theme.palette.warning.main),\n          },\n          {\n            ...getVariantStyle(theme, ownerState.variant, theme.palette.warning.dark, true),\n          },\n        ),\n      }),\n      ...(ownerState.color === 'info' && {\n        ...getChipInteractiveStyle(\n          {\n            ...getVariantStyle(theme, ownerState.variant, theme.palette.info.main),\n          },\n          {\n            ...getVariantStyle(theme, ownerState.variant, theme.palette.info.dark, true),\n          },\n        ),\n      }),\n      // selected chip\n      ...((ownerState.isSelected || ['success', 'primary'].includes(ownerState.color)) && {\n        borderWidth: '2px',\n        // remove 1px border for each side\n        padding: '4px 15px',\n        ...(ownerState.size === 'small' && {\n          padding: '1px 11px',\n        }),\n        ...getChipInteractiveStyle(\n          theme.palette.mode === 'dark'\n            ? {\n                backgroundColor: theme.palette.onSurface.os800,\n                color: theme.palette.brand.secondary,\n                borderColor: theme.palette.brand.secondary,\n              }\n            : {\n                backgroundColor: theme.palette.brand.quarternary,\n                color: theme.palette.brand.primary,\n                borderColor: theme.palette.brand.primary,\n              },\n          theme.palette.mode === 'dark'\n            ? {\n                backgroundColor: theme.palette.onSurface.os800,\n                color: theme.palette.brandHover.secondary,\n                borderColor: theme.palette.brandHover.secondary,\n              }\n            : {\n                backgroundColor: theme.palette.brand.quarternary,\n                color: theme.palette.brandHover.primary,\n                borderColor: theme.palette.brandHover.primary,\n              },\n        ),\n      }),\n      // disabled\n      '&.Mui-disabled': {\n        opacity: '1',\n        userSelect: 'none',\n        color: theme.palette.disabled.primary,\n        backgroundColor: theme.palette.surface.primary,\n        borderColor: theme.palette.disabled.primary,\n        // transparent variant\n        ...(ownerState.variant === 'transparent' && {\n          backgroundColor: theme.palette.transparent.primary,\n        }),\n      },\n      // focused style\n      ...getFocusRingStyle(theme, true, 1),\n      ...((ownerState.isSelected || ['success', 'primary'].includes(ownerState.color)) && {\n        ...updateFocusRingStyle(2),\n      }),\n      // old api, counting dot\n      '& .count': {\n        ...(theme.palette.mode === 'dark'\n          ? {\n              backgroundColor: theme.palette.brand.secondary,\n              color: theme.palette.onSurface.os900,\n            }\n          : {\n              backgroundColor: theme.palette.brand.primary,\n              color: theme.palette.common.white,\n            }),\n        minWidth: '20px',\n        height: '20px',\n        borderRadius: '20px',\n        paddingLeft: '4px',\n        paddingRight: '4px',\n        textAlign: 'center',\n        marginLeft: '10px',\n        fontSize: '14px',\n        lineHeight: '20px',\n        fontWeight: '700',\n        '& + .MuiChip-deleteIcon': {\n          marginLeft: '5px',\n        },\n      },\n      '& .chevron-down, & .chevron-up, & .MuiSvgIcon-root:last-child': {\n        fontSize: '17px',\n        // space between text and icon\n        marginRight: '0',\n        marginLeft: '10px',\n      },\n      '&.chevron-down.isOpen, & .MuiSvgIcon-root:last-child.isOpen': {\n        transform: 'rotate(180deg)',\n      },\n    }),\n    icon: {\n      '&, &:hover': {\n        color: 'currentColor',\n      },\n      fontSize: '17px',\n      // space between text and icon\n      marginRight: '10px',\n      marginLeft: '0',\n    },\n    deleteIcon: {\n      '&, &:hover': {\n        color: 'currentColor',\n      },\n      fontSize: '17px',\n      // space between text and icon\n      marginRight: '0',\n      marginLeft: '10px',\n    },\n    label: {\n      display: 'inline-flex',\n      alignItems: 'center',\n      justifyContent: 'flex-start',\n      padding: '0',\n    },\n  },\n};\n"],"names":["getChipInteractiveStyle","defaultStyle","hoverStyle","Object","assign","getInteractiveStyle","getVariantStyle","theme","variant","primaryColor","hover","backgroundColor","palette","surface","primary","onSurface","os0","color","borderColor","flowChip","defaultProps","deleteIcon","_jsx","CloseIcon","styleOverrides","root","ownerState","position","height","minWidth","padding","size","textRendering","textTransform","fontSize","lineHeight","fontWeight","letterSpacing","outline","borderRadius","textAlign","transition","cursor","boxShadow","raised","className","_a","includes","flowShadows","xs","border","os900","text","_b","background","secondary","_c","transparent","main","common","white","dark","error","warning","info","isSelected","borderWidth","mode","os800","brand","quarternary","brandHover","opacity","userSelect","disabled","getFocusRingStyle","updateFocusRingStyle","paddingLeft","paddingRight","marginLeft","marginRight","transform","icon","label","display","alignItems","justifyContent"],"mappings":"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"}
+{"version":3,"file":"chip.theme.js","sources":["../../../src/materialui/chip/chip.theme.tsx"],"sourcesContent":["import { Components } from '@mui/material/styles/components';\nimport { CSSObject, Theme } from '@mui/material';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\nimport { getFocusRingStyle, updateFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\n/**\n * Wrapper around getInteractiveStyle() function to provide interactive style\n *  only for chip that is actually a button\n */\nfunction getChipInteractiveStyle(defaultStyle: CSSObject, hoverStyle: CSSObject): CSSObject {\n  return {\n    ...defaultStyle,\n    '&.MuiButtonBase-root': {\n      ...getInteractiveStyle(defaultStyle, hoverStyle),\n    },\n  };\n}\n\n/**\n * Return style for either outlined or filled variant. Used by deprecated semantic colors\n */\nfunction getVariantStyle(theme: Theme, variant: string, primaryColor: string, hover?: boolean): CSSObject {\n  if (variant === 'outlined') {\n    return {\n      backgroundColor: hover ? theme.palette.transparent.secondary : 'transparent',\n      color: primaryColor,\n      borderColor: primaryColor,\n    };\n  } else {\n    return {\n      backgroundColor: primaryColor,\n      color: theme.palette.onSurface.os0,\n      borderColor: primaryColor,\n    };\n  }\n}\n\nexport const flowChip: Components<Theme>['MuiChip'] = {\n  defaultProps: {\n    deleteIcon: <CloseIcon />,\n  },\n  styleOverrides: {\n    root: ({ theme, ownerState }) => ({\n      position: 'relative',\n      // proportions\n      height: 'auto',\n      minWidth: '0',\n      padding: '5px 16px',\n      // not recommended small variant\n      ...(ownerState.size === 'small' && {\n        padding: '2px 12px',\n      }),\n      // custom font size\n      textRendering: 'geometricPrecision',\n      textTransform: 'none',\n      fontSize: '16px',\n      lineHeight: '20px',\n      fontWeight: '400',\n      letterSpacing: '0px',\n      outline: 'none',\n      // 50% border radius without skewing ratio\n      borderRadius: '1000px',\n      textAlign: 'center',\n      transition:\n        'transform 0.3s ease-out, color 0.3s ease-out, background-color 0.3s ease-out, border-color 0.3s ease-out, box-shadow 0.3s ease-out, opacity 0.3s ease-out',\n      // correct cursor if the chip is clickable button\n      '&&.MuiButtonBase-root': {\n        cursor: 'pointer',\n      },\n      // more important selector to overwrite default @mui styling\n      '&, &:active': {\n        boxShadow: 'none',\n        // drop shadow variant (+ old API support)\n        ...((ownerState.raised || ownerState.className?.includes('.MuiChip-shadow')) && {\n          boxShadow: theme.flowShadows.xs,\n        }),\n      },\n      // style (default 'filled' (solid) variant)\n      border: `1px solid ${theme.palette.onSurface.os900}`,\n      ...getChipInteractiveStyle(\n        {\n          backgroundColor: theme.palette.surface.primary,\n          color: theme.palette.text.primary,\n          borderColor: theme.palette.onSurface.os500,\n          // drop shadow variant (+ old API support)\n          ...((ownerState.raised || ownerState.className?.includes('.MuiChip-shadow')) && {\n            backgroundColor: theme.palette.background.primary,\n          }),\n        },\n        {\n          backgroundColor: theme.palette.surface.secondary,\n          color: theme.palette.text.primary,\n          borderColor: theme.palette.onSurface.os500,\n          // drop shadow variant (+ old API support)\n          ...((ownerState.raised || ownerState.className?.includes('.MuiChip-shadow')) && {\n            backgroundColor: theme.palette.surface.primary,\n          }),\n        },\n      ),\n      // transparent variant\n      ...(ownerState.variant === 'transparent' && {\n        ...getChipInteractiveStyle(\n          {\n            backgroundColor: theme.palette.transparent.primary,\n          },\n          {\n            backgroundColor: theme.palette.transparent.secondary,\n          },\n        ),\n      }),\n      // deprecated secondary color\n      ...(ownerState.color === 'secondary' &&\n        ownerState.variant !== 'outlined' && {\n          ...getChipInteractiveStyle(\n            {\n              backgroundColor: theme.palette.secondary.main,\n              color: theme.palette.common.white,\n              borderColor: theme.palette.secondary.main,\n            },\n            {\n              backgroundColor: theme.palette.secondary.dark,\n              color: theme.palette.common.white,\n              borderColor: theme.palette.secondary.dark,\n            },\n          ),\n        }),\n      // deprecated semantic colors\n      ...(ownerState.color === 'error' && {\n        ...getChipInteractiveStyle(\n          {\n            ...getVariantStyle(theme, ownerState.variant, theme.palette.error.main),\n          },\n          {\n            ...getVariantStyle(theme, ownerState.variant, theme.palette.error.dark, true),\n          },\n        ),\n      }),\n      ...(ownerState.color === 'warning' && {\n        ...getChipInteractiveStyle(\n          {\n            ...getVariantStyle(theme, ownerState.variant, theme.palette.warning.main),\n          },\n          {\n            ...getVariantStyle(theme, ownerState.variant, theme.palette.warning.dark, true),\n          },\n        ),\n      }),\n      ...(ownerState.color === 'info' && {\n        ...getChipInteractiveStyle(\n          {\n            ...getVariantStyle(theme, ownerState.variant, theme.palette.info.main),\n          },\n          {\n            ...getVariantStyle(theme, ownerState.variant, theme.palette.info.dark, true),\n          },\n        ),\n      }),\n      // selected chip\n      ...((ownerState.isSelected || ['success', 'primary'].includes(ownerState.color)) && {\n        borderWidth: '2px',\n        // remove 1px border for each side\n        padding: '4px 15px',\n        ...(ownerState.size === 'small' && {\n          padding: '1px 11px',\n        }),\n        ...getChipInteractiveStyle(\n          theme.palette.mode === 'dark'\n            ? {\n                backgroundColor: theme.palette.onSurface.os800,\n                color: theme.palette.brand.secondary,\n                borderColor: theme.palette.brand.secondary,\n              }\n            : {\n                backgroundColor: theme.palette.brand.quarternary,\n                color: theme.palette.brand.primary,\n                borderColor: theme.palette.brand.primary,\n              },\n          theme.palette.mode === 'dark'\n            ? {\n                backgroundColor: theme.palette.onSurface.os800,\n                color: theme.palette.brandHover.secondary,\n                borderColor: theme.palette.brandHover.secondary,\n              }\n            : {\n                backgroundColor: theme.palette.brand.quarternary,\n                color: theme.palette.brandHover.primary,\n                borderColor: theme.palette.brandHover.primary,\n              },\n        ),\n      }),\n      // disabled\n      '&.Mui-disabled': {\n        opacity: '1',\n        userSelect: 'none',\n        color: theme.palette.disabled.primary,\n        backgroundColor: theme.palette.surface.primary,\n        borderColor: theme.palette.disabled.primary,\n        // transparent variant\n        ...(ownerState.variant === 'transparent' && {\n          backgroundColor: theme.palette.transparent.primary,\n        }),\n      },\n      // focused style\n      ...getFocusRingStyle(theme, true, 1),\n      ...((ownerState.isSelected || ['success', 'primary'].includes(ownerState.color)) && {\n        ...updateFocusRingStyle(2),\n      }),\n      // old api, counting dot\n      '& .count': {\n        ...(theme.palette.mode === 'dark'\n          ? {\n              backgroundColor: theme.palette.brand.secondary,\n              color: theme.palette.onSurface.os900,\n            }\n          : {\n              backgroundColor: theme.palette.brand.primary,\n              color: theme.palette.common.white,\n            }),\n        minWidth: '20px',\n        height: '20px',\n        borderRadius: '20px',\n        paddingLeft: '4px',\n        paddingRight: '4px',\n        textAlign: 'center',\n        marginLeft: '10px',\n        fontSize: '14px',\n        lineHeight: '20px',\n        fontWeight: '700',\n        '& + .MuiChip-deleteIcon': {\n          marginLeft: '5px',\n        },\n      },\n      '& .chevron-down, & .chevron-up, & .MuiSvgIcon-root:last-child': {\n        fontSize: '17px',\n        // space between text and icon\n        marginRight: '0',\n        marginLeft: '10px',\n      },\n      '&.chevron-down.isOpen, & .MuiSvgIcon-root:last-child.isOpen': {\n        transform: 'rotate(180deg)',\n      },\n    }),\n    icon: {\n      '&, &:hover': {\n        color: 'currentColor',\n      },\n      fontSize: '17px',\n      // space between text and icon\n      marginRight: '10px',\n      marginLeft: '0',\n    },\n    deleteIcon: {\n      '&, &:hover': {\n        color: 'currentColor',\n      },\n      fontSize: '17px',\n      // space between text and icon\n      marginRight: '0',\n      marginLeft: '10px',\n    },\n    label: {\n      display: 'inline-flex',\n      alignItems: 'center',\n      justifyContent: 'flex-start',\n      padding: '0',\n    },\n  },\n};\n"],"names":["getChipInteractiveStyle","defaultStyle","hoverStyle","Object","assign","getInteractiveStyle","getVariantStyle","theme","variant","primaryColor","hover","backgroundColor","palette","transparent","secondary","color","borderColor","onSurface","os0","flowChip","defaultProps","deleteIcon","_jsx","CloseIcon","styleOverrides","root","ownerState","position","height","minWidth","padding","size","textRendering","textTransform","fontSize","lineHeight","fontWeight","letterSpacing","outline","borderRadius","textAlign","transition","cursor","boxShadow","raised","className","_a","includes","flowShadows","xs","border","os900","surface","primary","text","os500","_b","background","_c","main","common","white","dark","error","warning","info","isSelected","borderWidth","mode","os800","brand","quarternary","brandHover","opacity","userSelect","disabled","getFocusRingStyle","updateFocusRingStyle","paddingLeft","paddingRight","marginLeft","marginRight","transform","icon","label","display","alignItems","justifyContent"],"mappings":"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"}

package/materialui/fab/fab.theme.js

@@ -1,2 +1,2 @@
-import{updateFocusRingStyle as e,getFocusRingStyle as o}from"../../components/focusring/focusring.js";import{getInteractiveStyle as a}from"../button/interactive.js";const t={defaultProps:{color:"primary"},styleOverrides:{root:({theme:e,ownerState:t})=>Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({transition:"transform 0.3s ease-out, color 0.3s ease-out, background-color 0.3s ease-out, border-color 0.3s ease-out, box-shadow 0.3s ease-out, opacity 0.3s ease-out","&, &:active, &.Mui-disabled, &.Mui-focusVisible":{boxShadow:!1===t.raised?"none":e.flowShadows.xs},outline:"none",flexShrink:"0",borderRadius:"1000px",padding:"11px",height:"auto",width:"auto",minWidth:"0",minHeight:"0",gap:"10px",textRendering:"geometricPrecision"},e.typography.button),{"& .MuiSvgIcon-root":{fontSize:"20px"}}),o(e,!0,1)),{border:`1px solid ${e.palette.onSurface.os100}`}),a({backgroundColor:e.palette.onSurface.os0,color:e.palette.onSurface.os900},{backgroundColor:e.palette.surface.secondary,color:e.palette.onSurface.os900})),{"&.Mui-disabled":{backgroundColor:e.palette.disabled.secondary,color:e.palette.disabled.tertiary}}),extended:{paddingLeft:"21px",paddingRight:"19px"},primary:({theme:o,ownerState:t})=>Object.assign(Object.assign(Object.assign({border:"none",padding:"12px"},"extended"===t.variant&&{paddingLeft:"22px",paddingRight:"20px"}),e(0)),a({backgroundColor:o.palette.brand.secondary,color:o.palette.onSurface.os900},{backgroundColor:o.palette.brandHover.secondary,color:o.palette.onSurface.os900}))},variants:[{props:{expandable:!0},style:{paddingLeft:"11px",paddingRight:"11px","& > span":{display:"none"},"&:hover, &.Mui-focusVisible":{paddingLeft:"21px",paddingRight:"19px","& > span":{display:"inline"}}}},{props:{expandable:!0,color:"primary"},style:{paddingLeft:"12px",paddingRight:"12px","&:hover, &.Mui-focusVisible":{paddingLeft:"22px",paddingRight:"20px"}}}]};export{t as flowFab};
+import{updateFocusRingStyle as e,getFocusRingStyle as o}from"../../components/focusring/focusring.js";import{getInteractiveStyle as a}from"../button/interactive.js";const t={defaultProps:{color:"primary"},styleOverrides:{root:({theme:e,ownerState:t})=>Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({transition:"transform 0.3s ease-out, color 0.3s ease-out, background-color 0.3s ease-out, border-color 0.3s ease-out, box-shadow 0.3s ease-out, opacity 0.3s ease-out","&, &:active, &.Mui-disabled, &.Mui-focusVisible":{boxShadow:!1===t.raised?"none":e.flowShadows.xs},outline:"none",flexShrink:"0",borderRadius:"1000px",padding:"11px",height:"auto",width:"auto",minWidth:"0",minHeight:"0",gap:"10px",textRendering:"geometricPrecision"},e.typography.button),{"& .MuiSvgIcon-root":{fontSize:"20px"}}),o(e,!0,1)),{border:`1px solid ${e.palette.onSurface.os500}`}),a({backgroundColor:e.palette.onSurface.os0,color:e.palette.onSurface.os900},{backgroundColor:e.palette.surface.secondary,color:e.palette.onSurface.os900})),{"&.Mui-disabled":{backgroundColor:e.palette.surface.secondary,borderColor:e.palette.surface.secondary,color:e.palette.disabled.primary}}),extended:{paddingLeft:"21px",paddingRight:"19px"},primary:({theme:o,ownerState:t})=>Object.assign(Object.assign(Object.assign(Object.assign({border:"none",padding:"12px"},"extended"===t.variant&&{paddingLeft:"22px",paddingRight:"20px"}),e(0)),a({backgroundColor:o.palette.brand.secondary,color:o.palette.onSurface.os900},{backgroundColor:o.palette.brandHover.secondary,color:o.palette.onSurface.os900})),{"&.Mui-disabled":{backgroundColor:o.palette.disabled.secondary,color:o.palette.disabled.tertiary}})},variants:[{props:{expandable:!0},style:{paddingLeft:"11px",paddingRight:"11px","& > span":{display:"none"},"&:hover, &.Mui-focusVisible":{paddingLeft:"21px",paddingRight:"19px","& > span":{display:"inline"}}}},{props:{expandable:!0,color:"primary"},style:{paddingLeft:"12px",paddingRight:"12px","&:hover, &.Mui-focusVisible":{paddingLeft:"22px",paddingRight:"20px"}}}]};export{t as flowFab};
 //# sourceMappingURL=fab.theme.js.map

package/materialui/fab/fab.theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"fab.theme.js","sources":["../../../src/materialui/fab/fab.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles/components';\nimport { Theme } from '@mui/material';\nimport { getFocusRingStyle, updateFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport const flowFab: Components<Theme>['MuiFab'] = {\n  defaultProps: {\n    color: 'primary',\n  },\n  styleOverrides: {\n    root: ({ theme, ownerState }) => ({\n      transition:\n        'transform 0.3s ease-out, color 0.3s ease-out, background-color 0.3s ease-out, border-color 0.3s ease-out, box-shadow 0.3s ease-out, opacity 0.3s ease-out',\n      // by default, fab contains shadow\n      '&, &:active, &.Mui-disabled, &.Mui-focusVisible': {\n        boxShadow: ownerState.raised === false ? 'none' : theme.flowShadows.xs,\n      },\n      outline: 'none',\n      flexShrink: '0',\n      // 50% border radius without skewing ratio\n      borderRadius: '1000px',\n      // 44px\n      padding: '11px',\n      height: 'auto',\n      width: 'auto',\n      minWidth: '0',\n      minHeight: '0',\n      // space between icon and text\n      gap: '10px',\n      // label\n      textRendering: 'geometricPrecision',\n      ...theme.typography.button,\n      // icon itself\n      '& .MuiSvgIcon-root': {\n        fontSize: '20px',\n      },\n      // focused style\n      ...getFocusRingStyle(theme, true, 1),\n      // default (secondary variant)\n      border: `1px solid ${theme.palette.onSurface.os100}`,\n      ...getInteractiveStyle(\n        {\n          backgroundColor: theme.palette.onSurface.os0,\n          color: theme.palette.onSurface.os900,\n        },\n        {\n          backgroundColor: theme.palette.surface.secondary,\n          color: theme.palette.onSurface.os900,\n        },\n      ),\n      // disabled style\n      '&.Mui-disabled': {\n        backgroundColor: theme.palette.disabled.secondary,\n        color: theme.palette.disabled.tertiary,\n      },\n    }),\n    // fab with label\n    extended: {\n      // adjust proportions\n      paddingLeft: '21px',\n      paddingRight: '19px',\n    },\n    primary: ({ theme, ownerState }) => ({\n      // remove border\n      border: 'none',\n      // update padding without changing proportions\n      padding: '12px',\n      ...(ownerState.variant === 'extended' && {\n        paddingLeft: '22px',\n        paddingRight: '20px',\n      }),\n      // and focus ring\n      ...updateFocusRingStyle(0),\n      // style\n      ...getInteractiveStyle(\n        {\n          backgroundColor: theme.palette.brand.secondary,\n          color: theme.palette.onSurface.os900,\n        },\n        {\n          backgroundColor: theme.palette.brandHover.secondary,\n          color: theme.palette.onSurface.os900,\n        },\n      ),\n    }),\n  },\n  variants: [\n    {\n      props: { expandable: true },\n      style: {\n        paddingLeft: '11px',\n        paddingRight: '11px',\n        // hide label wrapped in span\n        '& > span': {\n          display: 'none',\n        },\n        // on hover/focus\n        '&:hover, &.Mui-focusVisible': {\n          paddingLeft: '21px',\n          paddingRight: '19px',\n          // show label\n          '& > span': {\n            display: 'inline',\n          },\n        },\n      },\n    },\n    {\n      props: { expandable: true, color: 'primary' },\n      style: {\n        paddingLeft: '12px',\n        paddingRight: '12px',\n        // on hover/focus\n        '&:hover, &.Mui-focusVisible': {\n          // change to extended variant\n          paddingLeft: '22px',\n          paddingRight: '20px',\n        },\n      },\n    },\n  ],\n};\n"],"names":["flowFab","defaultProps","color","styleOverrides","root","theme","ownerState","Object","assign","transition","boxShadow","raised","flowShadows","xs","outline","flexShrink","borderRadius","padding","height","width","minWidth","minHeight","gap","textRendering","typography","button","fontSize","getFocusRingStyle","border","palette","onSurface","os100","getInteractiveStyle","backgroundColor","os0","os900","surface","secondary","disabled","tertiary","extended","paddingLeft","paddingRight","primary","variant","updateFocusRingStyle","brand","brandHover","variants","props","expandable","style","display"],"mappings":"qKAKa,MAAAA,EAAuC,CAClDC,aAAc,CACZC,MAAO,WAETC,eAAgB,CACdC,KAAM,EAAGC,QAAOC,gBACdC,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,CAAAC,WACE,4JAEF,kDAAmD,CACjDC,WAAiC,IAAtBJ,EAAWK,OAAmB,OAASN,EAAMO,YAAYC,IAEtEC,QAAS,OACTC,WAAY,IAEZC,aAAc,SAEdC,QAAS,OACTC,OAAQ,OACRC,MAAO,OACPC,SAAU,IACVC,UAAW,IAEXC,IAAK,OAELC,cAAe,sBACZlB,EAAMmB,WAAWC,QAAM,CAE1B,qBAAsB,CACpBC,SAAU,UAGTC,EAAkBtB,GAAO,EAAM,IAAE,CAEpCuB,OAAQ,aAAavB,EAAMwB,QAAQC,UAAUC,UAC1CC,EACD,CACEC,gBAAiB5B,EAAMwB,QAAQC,UAAUI,IACzChC,MAAOG,EAAMwB,QAAQC,UAAUK,OAEjC,CACEF,gBAAiB5B,EAAMwB,QAAQO,QAAQC,UACvCnC,MAAOG,EAAMwB,QAAQC,UAAUK,SAElC,CAED,iBAAkB,CAChBF,gBAAiB5B,EAAMwB,QAAQS,SAASD,UACxCnC,MAAOG,EAAMwB,QAAQS,SAASC,YAIlCC,SAAU,CAERC,YAAa,OACbC,aAAc,QAEhBC,QAAS,EAAGtC,QAAOC,gBAAiBC,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,CAElCoB,OAAQ,OAERX,QAAS,QACkB,aAAvBX,EAAWsC,SAA0B,CACvCH,YAAa,OACbC,aAAc,SAGbG,EAAqB,IAErBb,EACD,CACEC,gBAAiB5B,EAAMwB,QAAQiB,MAAMT,UACrCnC,MAAOG,EAAMwB,QAAQC,UAAUK,OAEjC,CACEF,gBAAiB5B,EAAMwB,QAAQkB,WAAWV,UAC1CnC,MAAOG,EAAMwB,QAAQC,UAAUK,UAKvCa,SAAU,CACR,CACEC,MAAO,CAAEC,YAAY,GACrBC,MAAO,CACLV,YAAa,OACbC,aAAc,OAEd,WAAY,CACVU,QAAS,QAGX,8BAA+B,CAC7BX,YAAa,OACbC,aAAc,OAEd,WAAY,CACVU,QAAS,aAKjB,CACEH,MAAO,CAAEC,YAAY,EAAMhD,MAAO,WAClCiD,MAAO,CACLV,YAAa,OACbC,aAAc,OAEd,8BAA+B,CAE7BD,YAAa,OACbC,aAAc"}
+{"version":3,"file":"fab.theme.js","sources":["../../../src/materialui/fab/fab.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles/components';\nimport { Theme } from '@mui/material';\nimport { getFocusRingStyle, updateFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport const flowFab: Components<Theme>['MuiFab'] = {\n  defaultProps: {\n    color: 'primary',\n  },\n  styleOverrides: {\n    root: ({ theme, ownerState }) => ({\n      transition:\n        'transform 0.3s ease-out, color 0.3s ease-out, background-color 0.3s ease-out, border-color 0.3s ease-out, box-shadow 0.3s ease-out, opacity 0.3s ease-out',\n      // by default, fab contains shadow\n      '&, &:active, &.Mui-disabled, &.Mui-focusVisible': {\n        boxShadow: ownerState.raised === false ? 'none' : theme.flowShadows.xs,\n      },\n      outline: 'none',\n      flexShrink: '0',\n      // 50% border radius without skewing ratio\n      borderRadius: '1000px',\n      // 44px\n      padding: '11px',\n      height: 'auto',\n      width: 'auto',\n      minWidth: '0',\n      minHeight: '0',\n      // space between icon and text\n      gap: '10px',\n      // label\n      textRendering: 'geometricPrecision',\n      ...theme.typography.button,\n      // icon itself\n      '& .MuiSvgIcon-root': {\n        fontSize: '20px',\n      },\n      // focused style\n      ...getFocusRingStyle(theme, true, 1),\n      // default (secondary variant)\n      border: `1px solid ${theme.palette.onSurface.os500}`,\n      ...getInteractiveStyle(\n        {\n          backgroundColor: theme.palette.onSurface.os0,\n          color: theme.palette.onSurface.os900,\n        },\n        {\n          backgroundColor: theme.palette.surface.secondary,\n          color: theme.palette.onSurface.os900,\n        },\n      ),\n      // disabled style\n      '&.Mui-disabled': {\n        backgroundColor: theme.palette.surface.secondary,\n        borderColor: theme.palette.surface.secondary,\n        color: theme.palette.disabled.primary,\n      },\n    }),\n    // fab with label\n    extended: {\n      // adjust proportions\n      paddingLeft: '21px',\n      paddingRight: '19px',\n    },\n    primary: ({ theme, ownerState }) => ({\n      // remove border\n      border: 'none',\n      // update padding without changing proportions\n      padding: '12px',\n      ...(ownerState.variant === 'extended' && {\n        paddingLeft: '22px',\n        paddingRight: '20px',\n      }),\n      // and focus ring\n      ...updateFocusRingStyle(0),\n      // style\n      ...getInteractiveStyle(\n        {\n          backgroundColor: theme.palette.brand.secondary,\n          color: theme.palette.onSurface.os900,\n        },\n        {\n          backgroundColor: theme.palette.brandHover.secondary,\n          color: theme.palette.onSurface.os900,\n        },\n      ),\n      // disabled style\n      '&.Mui-disabled': {\n        backgroundColor: theme.palette.disabled.secondary,\n        color: theme.palette.disabled.tertiary,\n      },\n    }),\n  },\n  variants: [\n    {\n      props: { expandable: true },\n      style: {\n        paddingLeft: '11px',\n        paddingRight: '11px',\n        // hide label wrapped in span\n        '& > span': {\n          display: 'none',\n        },\n        // on hover/focus\n        '&:hover, &.Mui-focusVisible': {\n          paddingLeft: '21px',\n          paddingRight: '19px',\n          // show label\n          '& > span': {\n            display: 'inline',\n          },\n        },\n      },\n    },\n    {\n      props: { expandable: true, color: 'primary' },\n      style: {\n        paddingLeft: '12px',\n        paddingRight: '12px',\n        // on hover/focus\n        '&:hover, &.Mui-focusVisible': {\n          // change to extended variant\n          paddingLeft: '22px',\n          paddingRight: '20px',\n        },\n      },\n    },\n  ],\n};\n"],"names":["flowFab","defaultProps","color","styleOverrides","root","theme","ownerState","Object","assign","transition","boxShadow","raised","flowShadows","xs","outline","flexShrink","borderRadius","padding","height","width","minWidth","minHeight","gap","textRendering","typography","button","fontSize","getFocusRingStyle","border","palette","onSurface","os500","getInteractiveStyle","backgroundColor","os0","os900","surface","secondary","borderColor","disabled","primary","extended","paddingLeft","paddingRight","variant","updateFocusRingStyle","brand","brandHover","tertiary","variants","props","expandable","style","display"],"mappings":"qKAKa,MAAAA,EAAuC,CAClDC,aAAc,CACZC,MAAO,WAETC,eAAgB,CACdC,KAAM,EAAGC,QAAOC,gBACdC,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,CAAAC,WACE,4JAEF,kDAAmD,CACjDC,WAAiC,IAAtBJ,EAAWK,OAAmB,OAASN,EAAMO,YAAYC,IAEtEC,QAAS,OACTC,WAAY,IAEZC,aAAc,SAEdC,QAAS,OACTC,OAAQ,OACRC,MAAO,OACPC,SAAU,IACVC,UAAW,IAEXC,IAAK,OAELC,cAAe,sBACZlB,EAAMmB,WAAWC,QAAM,CAE1B,qBAAsB,CACpBC,SAAU,UAGTC,EAAkBtB,GAAO,EAAM,IAAE,CAEpCuB,OAAQ,aAAavB,EAAMwB,QAAQC,UAAUC,UAC1CC,EACD,CACEC,gBAAiB5B,EAAMwB,QAAQC,UAAUI,IACzChC,MAAOG,EAAMwB,QAAQC,UAAUK,OAEjC,CACEF,gBAAiB5B,EAAMwB,QAAQO,QAAQC,UACvCnC,MAAOG,EAAMwB,QAAQC,UAAUK,SAElC,CAED,iBAAkB,CAChBF,gBAAiB5B,EAAMwB,QAAQO,QAAQC,UACvCC,YAAajC,EAAMwB,QAAQO,QAAQC,UACnCnC,MAAOG,EAAMwB,QAAQU,SAASC,WAIlCC,SAAU,CAERC,YAAa,OACbC,aAAc,QAEhBH,QAAS,EAAGnC,QAAOC,gBAAiBC,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,CAElCoB,OAAQ,OAERX,QAAS,QACkB,aAAvBX,EAAWsC,SAA0B,CACvCF,YAAa,OACbC,aAAc,SAGbE,EAAqB,IAErBb,EACD,CACEC,gBAAiB5B,EAAMwB,QAAQiB,MAAMT,UACrCnC,MAAOG,EAAMwB,QAAQC,UAAUK,OAEjC,CACEF,gBAAiB5B,EAAMwB,QAAQkB,WAAWV,UAC1CnC,MAAOG,EAAMwB,QAAQC,UAAUK,SAElC,CAED,iBAAkB,CAChBF,gBAAiB5B,EAAMwB,QAAQU,SAASF,UACxCnC,MAAOG,EAAMwB,QAAQU,SAASS,aAIpCC,SAAU,CACR,CACEC,MAAO,CAAEC,YAAY,GACrBC,MAAO,CACLV,YAAa,OACbC,aAAc,OAEd,WAAY,CACVU,QAAS,QAGX,8BAA+B,CAC7BX,YAAa,OACbC,aAAc,OAEd,WAAY,CACVU,QAAS,aAKjB,CACEH,MAAO,CAAEC,YAAY,EAAMjD,MAAO,WAClCkD,MAAO,CACLV,YAAa,OACbC,aAAc,OAEd,8BAA+B,CAE7BD,YAAa,OACbC,aAAc"}

package/materialui/iconButton/iconButton.theme.js

@@ -1,2 +1,2 @@
-import{updateFocusRingStyle as e,getFocusRingStyle as r}from"../../components/focusring/focusring.js";import{getInteractiveStyle as o}from"../button/interactive.js";const t={defaultProps:{disableRipple:!0,variant:"standard",color:"secondary",size:"standard"},styleOverrides:{root:({theme:e})=>Object.assign(Object.assign(Object.assign({position:"relative",boxShadow:"none",outline:"none",width:"44px",height:"44px",borderRadius:"1000px",maxWidth:"none",transition:"all 0.3s ease-out",flexShrink:"0","&:hover":{boxShadow:"none"},"&&:active":{boxShadow:"none"}},o({backgroundColor:"transparent"},{backgroundColor:e.palette.surface.primary})),r(e)),{"&.Mui-disabled":{opacity:"1",color:e.palette.disabled.primary}}),sizeSmall:{height:"32px",width:"32px","& .MuiSvgIcon-root":{fontSize:"17px"}},sizeMedium:{"& .MuiSvgIcon-root":{fontSize:"20px"}},sizeLarge:{height:"50px",width:"50px","& .MuiSvgIcon-root":{fontSize:"22px"}}},variants:[{props:{color:"secondary"},style:({theme:e})=>Object.assign({},o({color:e.palette.text.primary},{color:e.palette.text.primary}))},{props:{variant:"filled"},style:({theme:e})=>({"&.Mui-disabled":{opacity:"1",backgroundColor:e.palette.disabled.secondary,color:e.palette.disabled.tertiary}})},{props:{variant:"filled",color:"primary"},style:({theme:e})=>Object.assign({},o({backgroundColor:e.palette.brand.secondary,color:e.palette.onSurface.os900},{backgroundColor:e.palette.brandHover.secondary,color:e.palette.onSurface.os900}))},{props:{variant:"filled",color:"secondary"},style:({theme:e})=>Object.assign({},o({backgroundColor:e.palette.secondary.main,color:e.palette.secondary.contrastText},{backgroundColor:e.palette.secondary.light,color:e.palette.secondary.contrastText}))},{props:{variant:"filled",color:"error"},style:({theme:e})=>Object.assign({},o({color:e.palette.error.contrastText,backgroundColor:e.palette.error.main},{color:e.palette.error.contrastText,backgroundColor:e.palette.error.dark}))},{props:{variant:"filled",color:"inherit"},style:({theme:e})=>Object.assign({},o({backgroundColor:e.palette.transparent.secondary},{backgroundColor:e.palette.surface.primary}))},{props:{variant:"outlined"},style:Object.assign({border:"2px solid currentColor"},e(2))},{props:{variant:"outlined",size:"small"},style:Object.assign({borderWidth:"1px"},e(1))},{props:{color:"surface"},style:({theme:r})=>Object.assign(Object.assign(Object.assign({border:`1px solid ${"dark"===r.palette.mode?r.palette.transparent.quarternary:r.palette.onSurface.os100}`},e(1)),o({backgroundColor:r.palette.surface.primary,color:r.palette.text.primary},{backgroundColor:r.palette.surface.secondary,color:r.palette.text.primary})),{"&.Mui-disabled":{borderColor:r.palette.surface.secondary,color:r.palette.disabled.primary}})},{props:{color:"surface",variant:"outlined"},style:Object.assign({borderWidth:"2px"},e(2))},{props:{color:"white"},style:({theme:e})=>Object.assign(Object.assign({},o({backgroundColor:"transparent",color:e.palette.onSurface.os0},{color:e.palette.onSurface.os0,backgroundColor:e.palette.transparent.tertiary})),{"&.Mui-disabled":{borderColor:e.palette.disabled.primary,color:e.palette.disabled.primary}})}]};export{t as flowIconButton};
+import{updateFocusRingStyle as e,getFocusRingStyle as r}from"../../components/focusring/focusring.js";import{getInteractiveStyle as o}from"../button/interactive.js";const t={defaultProps:{disableRipple:!0,variant:"standard",color:"secondary",size:"standard"},styleOverrides:{root:({theme:e})=>Object.assign(Object.assign(Object.assign({position:"relative",boxShadow:"none",outline:"none",width:"44px",height:"44px",borderRadius:"1000px",maxWidth:"none",transition:"all 0.3s ease-out",flexShrink:"0","&:hover":{boxShadow:"none"},"&&:active":{boxShadow:"none"}},o({backgroundColor:"transparent"},{backgroundColor:e.palette.transparent.secondary})),r(e)),{"&.Mui-disabled":{opacity:"1",color:e.palette.disabled.primary}}),sizeSmall:{height:"32px",width:"32px","& .MuiSvgIcon-root":{fontSize:"17px"}},sizeMedium:{"& .MuiSvgIcon-root":{fontSize:"20px"}},sizeLarge:{height:"50px",width:"50px","& .MuiSvgIcon-root":{fontSize:"22px"}}},variants:[{props:{color:"secondary"},style:({theme:e})=>Object.assign({},o({color:e.palette.text.primary},{color:e.palette.text.primary}))},{props:{variant:"filled"},style:({theme:e})=>({"&.Mui-disabled":{opacity:"1",backgroundColor:e.palette.disabled.secondary,color:e.palette.disabled.tertiary}})},{props:{variant:"filled",color:"primary"},style:({theme:e})=>Object.assign({},o({backgroundColor:e.palette.brand.secondary,color:e.palette.onSurface.os900},{backgroundColor:e.palette.brandHover.secondary,color:e.palette.onSurface.os900}))},{props:{variant:"filled",color:"secondary"},style:({theme:e})=>Object.assign({},o({backgroundColor:e.palette.secondary.main,color:e.palette.secondary.contrastText},{backgroundColor:e.palette.secondary.light,color:e.palette.secondary.contrastText}))},{props:{variant:"filled",color:"error"},style:({theme:e})=>Object.assign({},o({color:e.palette.error.contrastText,backgroundColor:e.palette.error.main},{color:e.palette.error.contrastText,backgroundColor:e.palette.error.dark}))},{props:{variant:"filled",color:"inherit"},style:({theme:e})=>Object.assign({},o({backgroundColor:e.palette.transparent.secondary},{backgroundColor:e.palette.surface.primary}))},{props:{variant:"outlined"},style:Object.assign({border:"2px solid currentColor"},e(2))},{props:{variant:"outlined",size:"small"},style:Object.assign({borderWidth:"1px"},e(1))},{props:{color:"surface"},style:({theme:r})=>Object.assign(Object.assign(Object.assign({border:`1px solid ${"dark"===r.palette.mode?r.palette.transparent.quarternary:r.palette.onSurface.os100}`},e(1)),o({backgroundColor:r.palette.surface.primary,color:r.palette.text.primary},{backgroundColor:r.palette.surface.secondary,color:r.palette.text.primary})),{"&.Mui-disabled":{borderColor:r.palette.surface.secondary,color:r.palette.disabled.primary}})},{props:{color:"surface",variant:"outlined"},style:Object.assign({borderWidth:"2px"},e(2))},{props:{color:"white"},style:({theme:e})=>Object.assign(Object.assign({},o({backgroundColor:"transparent",color:e.palette.onSurface.os0},{color:e.palette.onSurface.os0,backgroundColor:e.palette.transparent.tertiary})),{"&.Mui-disabled":{borderColor:e.palette.disabled.primary,color:e.palette.disabled.primary}})}]};export{t as flowIconButton};
 //# sourceMappingURL=iconButton.theme.js.map

package/materialui/iconButton/iconButton.theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"iconButton.theme.js","sources":["../../../src/materialui/iconButton/iconButton.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles/components';\nimport { Theme } from '@mui/material';\nimport { getFocusRingStyle, updateFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport const flowIconButton: Components<Theme>['MuiIconButton'] = {\n  defaultProps: {\n    disableRipple: true,\n    variant: 'standard',\n    color: 'secondary',\n    // 'medium' is according to a Flow system, 'standard' is new introduced property that matches\n    //  previous implementation to avoid heavy visual breaking change\n    size: 'standard',\n  },\n  styleOverrides: {\n    root: ({ theme }) => ({\n      position: 'relative',\n      boxShadow: 'none',\n      outline: 'none',\n      width: '44px',\n      height: '44px',\n      borderRadius: '1000px',\n      maxWidth: 'none',\n      transition: 'all 0.3s ease-out',\n      flexShrink: '0',\n      '&:hover': {\n        boxShadow: 'none',\n      },\n      '&&:active': {\n        boxShadow: 'none',\n      },\n      ...getInteractiveStyle(\n        {\n          backgroundColor: 'transparent',\n        },\n        {\n          backgroundColor: theme.palette.surface.primary,\n        },\n      ),\n      // focused style\n      ...getFocusRingStyle(theme),\n      // disabled style\n      '&.Mui-disabled': {\n        opacity: '1',\n        color: theme.palette.disabled.primary,\n      },\n    }),\n    sizeSmall: {\n      height: '32px',\n      width: '32px',\n      // icon itself\n      '& .MuiSvgIcon-root': {\n        fontSize: '17px',\n      },\n    },\n    sizeMedium: {\n      // width & height & borderRadius is default in root\n      // icon itself\n      '& .MuiSvgIcon-root': {\n        fontSize: '20px',\n      },\n    },\n    sizeLarge: {\n      height: '50px',\n      width: '50px',\n      // icon itself\n      '& .MuiSvgIcon-root': {\n        fontSize: '22px',\n      },\n    },\n  },\n  variants: [\n    {\n      props: { color: 'secondary' },\n      style: ({ theme }) => ({\n        ...getInteractiveStyle(\n          {\n            color: theme.palette.text.primary,\n          },\n          {\n            color: theme.palette.text.primary,\n          },\n        ),\n      }),\n    },\n    {\n      props: { variant: 'filled' },\n      style: ({ theme }) => ({\n        // disabled style\n        '&.Mui-disabled': {\n          opacity: '1',\n          backgroundColor: theme.palette.disabled.secondary,\n          color: theme.palette.disabled.tertiary,\n        },\n      }),\n    },\n    {\n      props: { variant: 'filled', color: 'primary' },\n      style: ({ theme }) => ({\n        ...getInteractiveStyle(\n          {\n            backgroundColor: theme.palette.brand.secondary,\n            color: theme.palette.onSurface.os900,\n          },\n          {\n            backgroundColor: theme.palette.brandHover.secondary,\n            color: theme.palette.onSurface.os900,\n          },\n        ),\n      }),\n    },\n    {\n      props: { variant: 'filled', color: 'secondary' },\n      style: ({ theme }) => ({\n        ...getInteractiveStyle(\n          {\n            backgroundColor: theme.palette.secondary.main,\n            color: theme.palette.secondary.contrastText,\n          },\n          {\n            backgroundColor: theme.palette.secondary.light,\n            color: theme.palette.secondary.contrastText,\n          },\n        ),\n      }),\n    },\n    {\n      props: { variant: 'filled', color: 'error' },\n      style: ({ theme }) => ({\n        ...getInteractiveStyle(\n          {\n            color: theme.palette.error.contrastText,\n            backgroundColor: theme.palette.error.main,\n          },\n          {\n            color: theme.palette.error.contrastText,\n            backgroundColor: theme.palette.error.dark,\n          },\n        ),\n      }),\n    },\n    {\n      props: { variant: 'filled', color: 'inherit' },\n      style: ({ theme }) => ({\n        ...getInteractiveStyle(\n          {\n            backgroundColor: theme.palette.transparent.secondary,\n          },\n          {\n            backgroundColor: theme.palette.surface.primary,\n          },\n        ),\n      }),\n    },\n    {\n      props: { variant: 'outlined' },\n      style: {\n        border: '2px solid currentColor',\n        ...updateFocusRingStyle(2),\n      },\n    },\n    {\n      props: { variant: 'outlined', size: 'small' },\n      style: {\n        borderWidth: '1px',\n        ...updateFocusRingStyle(1),\n      },\n    },\n    {\n      props: { color: 'surface' },\n      style: ({ theme }) => ({\n        border: `1px solid ${theme.palette.mode === 'dark' ? theme.palette.transparent.quarternary : theme.palette.onSurface.os100}`,\n        ...updateFocusRingStyle(1),\n        ...getInteractiveStyle(\n          {\n            backgroundColor: theme.palette.surface.primary,\n            color: theme.palette.text.primary,\n          },\n          {\n            backgroundColor: theme.palette.surface.secondary,\n            color: theme.palette.text.primary,\n          },\n        ),\n        // disabled style\n        '&.Mui-disabled': {\n          borderColor: theme.palette.surface.secondary,\n          color: theme.palette.disabled.primary,\n        },\n      }),\n    },\n    {\n      props: { color: 'surface', variant: 'outlined' },\n      style: {\n        borderWidth: '2px',\n        ...updateFocusRingStyle(2),\n      },\n    },\n    {\n      props: { color: 'white' },\n      style: ({ theme }) => ({\n        ...getInteractiveStyle(\n          {\n            backgroundColor: 'transparent',\n            color: theme.palette.onSurface.os0,\n          },\n          {\n            color: theme.palette.onSurface.os0,\n            backgroundColor: theme.palette.transparent.tertiary,\n          },\n        ),\n        // disabled style\n        '&.Mui-disabled': {\n          borderColor: theme.palette.disabled.primary,\n          color: theme.palette.disabled.primary,\n        },\n      }),\n    },\n  ],\n};\n"],"names":["flowIconButton","defaultProps","disableRipple","variant","color","size","styleOverrides","root","theme","Object","assign","position","boxShadow","outline","width","height","borderRadius","maxWidth","transition","flexShrink","getInteractiveStyle","backgroundColor","palette","surface","primary","getFocusRingStyle","opacity","disabled","sizeSmall","fontSize","sizeMedium","sizeLarge","variants","props","style","text","secondary","tertiary","brand","onSurface","os900","brandHover","main","contrastText","light","error","dark","transparent","border","updateFocusRingStyle","borderWidth","mode","quarternary","os100","borderColor","os0"],"mappings":"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"}
+{"version":3,"file":"iconButton.theme.js","sources":["../../../src/materialui/iconButton/iconButton.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles/components';\nimport { Theme } from '@mui/material';\nimport { getFocusRingStyle, updateFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport const flowIconButton: Components<Theme>['MuiIconButton'] = {\n  defaultProps: {\n    disableRipple: true,\n    variant: 'standard',\n    color: 'secondary',\n    // 'medium' is according to a Flow system, 'standard' is new introduced property that matches\n    //  previous implementation to avoid heavy visual breaking change\n    size: 'standard',\n  },\n  styleOverrides: {\n    root: ({ theme }) => ({\n      position: 'relative',\n      boxShadow: 'none',\n      outline: 'none',\n      width: '44px',\n      height: '44px',\n      borderRadius: '1000px',\n      maxWidth: 'none',\n      transition: 'all 0.3s ease-out',\n      flexShrink: '0',\n      '&:hover': {\n        boxShadow: 'none',\n      },\n      '&&:active': {\n        boxShadow: 'none',\n      },\n      ...getInteractiveStyle(\n        {\n          backgroundColor: 'transparent',\n        },\n        {\n          // hover effect also in accordionSummary.theme.tsx\n          backgroundColor: theme.palette.transparent.secondary,\n        },\n      ),\n      // focused style\n      ...getFocusRingStyle(theme),\n      // disabled style\n      '&.Mui-disabled': {\n        opacity: '1',\n        color: theme.palette.disabled.primary,\n      },\n    }),\n    sizeSmall: {\n      height: '32px',\n      width: '32px',\n      // icon itself\n      '& .MuiSvgIcon-root': {\n        fontSize: '17px',\n      },\n    },\n    sizeMedium: {\n      // width & height & borderRadius is default in root\n      // icon itself\n      '& .MuiSvgIcon-root': {\n        fontSize: '20px',\n      },\n    },\n    sizeLarge: {\n      height: '50px',\n      width: '50px',\n      // icon itself\n      '& .MuiSvgIcon-root': {\n        fontSize: '22px',\n      },\n    },\n  },\n  variants: [\n    {\n      props: { color: 'secondary' },\n      style: ({ theme }) => ({\n        ...getInteractiveStyle(\n          {\n            color: theme.palette.text.primary,\n          },\n          {\n            color: theme.palette.text.primary,\n          },\n        ),\n      }),\n    },\n    {\n      props: { variant: 'filled' },\n      style: ({ theme }) => ({\n        // disabled style\n        '&.Mui-disabled': {\n          opacity: '1',\n          backgroundColor: theme.palette.disabled.secondary,\n          color: theme.palette.disabled.tertiary,\n        },\n      }),\n    },\n    {\n      props: { variant: 'filled', color: 'primary' },\n      style: ({ theme }) => ({\n        ...getInteractiveStyle(\n          {\n            backgroundColor: theme.palette.brand.secondary,\n            color: theme.palette.onSurface.os900,\n          },\n          {\n            backgroundColor: theme.palette.brandHover.secondary,\n            color: theme.palette.onSurface.os900,\n          },\n        ),\n      }),\n    },\n    {\n      props: { variant: 'filled', color: 'secondary' },\n      style: ({ theme }) => ({\n        ...getInteractiveStyle(\n          {\n            backgroundColor: theme.palette.secondary.main,\n            color: theme.palette.secondary.contrastText,\n          },\n          {\n            backgroundColor: theme.palette.secondary.light,\n            color: theme.palette.secondary.contrastText,\n          },\n        ),\n      }),\n    },\n    {\n      props: { variant: 'filled', color: 'error' },\n      style: ({ theme }) => ({\n        ...getInteractiveStyle(\n          {\n            color: theme.palette.error.contrastText,\n            backgroundColor: theme.palette.error.main,\n          },\n          {\n            color: theme.palette.error.contrastText,\n            backgroundColor: theme.palette.error.dark,\n          },\n        ),\n      }),\n    },\n    {\n      props: { variant: 'filled', color: 'inherit' },\n      style: ({ theme }) => ({\n        ...getInteractiveStyle(\n          {\n            backgroundColor: theme.palette.transparent.secondary,\n          },\n          {\n            backgroundColor: theme.palette.surface.primary,\n          },\n        ),\n      }),\n    },\n    {\n      props: { variant: 'outlined' },\n      style: {\n        border: '2px solid currentColor',\n        ...updateFocusRingStyle(2),\n      },\n    },\n    {\n      props: { variant: 'outlined', size: 'small' },\n      style: {\n        borderWidth: '1px',\n        ...updateFocusRingStyle(1),\n      },\n    },\n    {\n      props: { color: 'surface' },\n      style: ({ theme }) => ({\n        border: `1px solid ${theme.palette.mode === 'dark' ? theme.palette.transparent.quarternary : theme.palette.onSurface.os100}`,\n        ...updateFocusRingStyle(1),\n        ...getInteractiveStyle(\n          {\n            backgroundColor: theme.palette.surface.primary,\n            color: theme.palette.text.primary,\n          },\n          {\n            backgroundColor: theme.palette.surface.secondary,\n            color: theme.palette.text.primary,\n          },\n        ),\n        // disabled style\n        '&.Mui-disabled': {\n          borderColor: theme.palette.surface.secondary,\n          color: theme.palette.disabled.primary,\n        },\n      }),\n    },\n    {\n      props: { color: 'surface', variant: 'outlined' },\n      style: {\n        borderWidth: '2px',\n        ...updateFocusRingStyle(2),\n      },\n    },\n    {\n      props: { color: 'white' },\n      style: ({ theme }) => ({\n        ...getInteractiveStyle(\n          {\n            backgroundColor: 'transparent',\n            color: theme.palette.onSurface.os0,\n          },\n          {\n            color: theme.palette.onSurface.os0,\n            backgroundColor: theme.palette.transparent.tertiary,\n          },\n        ),\n        // disabled style\n        '&.Mui-disabled': {\n          borderColor: theme.palette.disabled.primary,\n          color: theme.palette.disabled.primary,\n        },\n      }),\n    },\n  ],\n};\n"],"names":["flowIconButton","defaultProps","disableRipple","variant","color","size","styleOverrides","root","theme","Object","assign","position","boxShadow","outline","width","height","borderRadius","maxWidth","transition","flexShrink","getInteractiveStyle","backgroundColor","palette","transparent","secondary","getFocusRingStyle","opacity","disabled","primary","sizeSmall","fontSize","sizeMedium","sizeLarge","variants","props","style","text","tertiary","brand","onSurface","os900","brandHover","main","contrastText","light","error","dark","surface","border","updateFocusRingStyle","borderWidth","mode","quarternary","os100","borderColor","os0"],"mappings":"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"}

package/materialui/skeleton/skeleton.theme.js

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

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

@@ -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 '../theme/theme.typography';\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  },\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","Object","assign","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":"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"}
+{"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 '../theme/theme.typography';\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","Object","assign","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":"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"}

package/materialui/slider/sliderValues.js

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

package/materialui/slider/sliderValues.js.map

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

package/materialui/stepper/StepLabelIcon.js

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