@skodaflow/web-library 8.3.2 → 8.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/components/advancedTable/agGrid.js +1 -1
- package/cjs/components/advancedTable/agGrid.js.map +1 -1
- package/cjs/components/advancedTable/agGridSkodaTheme.d.ts +3 -0
- package/cjs/components/advancedTable/agGridSkodaTheme.js +1 -1
- package/cjs/components/advancedTable/agGridSkodaTheme.js.map +1 -1
- package/cjs/components/advancedTable/agGridUniformRowHeight.d.ts +36 -0
- package/cjs/components/advancedTable/agGridUniformRowHeight.js +2 -0
- package/cjs/components/advancedTable/agGridUniformRowHeight.js.map +1 -0
- package/cjs/components/advancedTable/agGridVariables.js +1 -1
- package/cjs/components/advancedTable/agGridVariables.js.map +1 -1
- package/cjs/components/advancedTable/index.d.ts +1 -0
- package/cjs/components/alert/AlertIconButton.d.ts +8 -0
- package/cjs/components/alert/AlertIconButton.js +2 -0
- package/cjs/components/alert/AlertIconButton.js.map +1 -0
- package/cjs/components/alert/index.d.ts +1 -0
- package/cjs/components/carousel/Autoplay.js.map +1 -1
- package/cjs/components/carousel/Carousel.js +1 -1
- package/cjs/components/carousel/Carousel.js.map +1 -1
- package/cjs/components/carousel/Navigation.js +1 -1
- package/cjs/components/carousel/Navigation.js.map +1 -1
- package/cjs/components/carousel/Pagination.js +1 -1
- package/cjs/components/carousel/Pagination.js.map +1 -1
- package/cjs/components/copyButton/CopyButton.d.ts +39 -0
- package/cjs/components/copyButton/CopyButton.js +2 -0
- package/cjs/components/copyButton/CopyButton.js.map +1 -0
- package/cjs/components/copyButton/CopyIconButton.d.ts +8 -0
- package/cjs/components/copyButton/CopyIconButton.js +2 -0
- package/cjs/components/copyButton/CopyIconButton.js.map +1 -0
- package/cjs/components/copyButton/index.d.ts +3 -0
- package/cjs/components/copyButton/useCopyAction.d.ts +31 -0
- package/cjs/components/copyButton/useCopyAction.js +2 -0
- package/cjs/components/copyButton/useCopyAction.js.map +1 -0
- package/cjs/components/footer/FooterMenuCollapse.js +1 -1
- package/cjs/components/footer/FooterMenuCollapse.js.map +1 -1
- package/cjs/components/header/Header.js +1 -1
- package/cjs/components/header/Header.js.map +1 -1
- package/cjs/components/header/HeaderNavigationHero.js +1 -1
- package/cjs/components/header/HeaderNavigationHero.js.map +1 -1
- package/cjs/components/header/HeaderNavigationMenu.js +1 -1
- package/cjs/components/header/HeaderNavigationMenu.js.map +1 -1
- package/cjs/components/hotspotCard/HotspotCard.js +1 -1
- package/cjs/components/hotspotCard/HotspotCard.js.map +1 -1
- package/cjs/components/icon/stroke/EmissionLabelIcon.js.map +1 -1
- package/cjs/components/image/Image.d.ts +38 -14
- package/cjs/components/image/Image.js +1 -1
- package/cjs/components/image/Image.js.map +1 -1
- package/cjs/components/index.d.ts +2 -0
- package/cjs/components/label/Label.js.map +1 -1
- package/cjs/components/overlay/Overlay.js +1 -1
- package/cjs/components/overlay/Overlay.js.map +1 -1
- package/cjs/components/video/Video.d.ts +9 -8
- package/cjs/components/video/Video.js +1 -1
- package/cjs/components/video/Video.js.map +1 -1
- package/cjs/components/video/index.d.ts +5 -1
- package/cjs/components/video/useVideoFullscreen.d.ts +13 -0
- package/cjs/components/video/useVideoFullscreen.js +2 -0
- package/cjs/components/video/useVideoFullscreen.js.map +1 -0
- package/cjs/components/video/useVideoPlayPause.d.ts +13 -0
- package/cjs/components/video/useVideoPlayPause.js +2 -0
- package/cjs/components/video/useVideoPlayPause.js.map +1 -0
- package/cjs/components/video/useVideoReady.d.ts +6 -0
- package/cjs/components/video/useVideoReady.js +2 -0
- package/cjs/components/video/useVideoReady.js.map +1 -0
- package/cjs/components/video/useVideoSoundControls.d.ts +17 -0
- package/cjs/components/video/useVideoSoundControls.js +2 -0
- package/cjs/components/video/useVideoSoundControls.js.map +1 -0
- package/cjs/components/video/useVideoTime.d.ts +22 -0
- package/cjs/components/video/useVideoTime.js +2 -0
- package/cjs/components/video/useVideoTime.js.map +1 -0
- package/cjs/components/videoPlayer/VideoPlayer.d.ts +125 -0
- package/cjs/components/videoPlayer/VideoPlayer.js +2 -0
- package/cjs/components/videoPlayer/VideoPlayer.js.map +1 -0
- package/cjs/components/videoPlayer/VideoPlayerFullscreenButton.d.ts +31 -0
- package/cjs/components/videoPlayer/VideoPlayerFullscreenButton.js +2 -0
- package/cjs/components/videoPlayer/VideoPlayerFullscreenButton.js.map +1 -0
- package/cjs/components/videoPlayer/VideoPlayerIconButton.d.ts +16 -0
- package/cjs/components/videoPlayer/VideoPlayerIconButton.js +2 -0
- package/cjs/components/videoPlayer/VideoPlayerIconButton.js.map +1 -0
- package/cjs/components/videoPlayer/VideoPlayerPlayPauseButton.d.ts +31 -0
- package/cjs/components/videoPlayer/VideoPlayerPlayPauseButton.js +2 -0
- package/cjs/components/videoPlayer/VideoPlayerPlayPauseButton.js.map +1 -0
- package/cjs/components/videoPlayer/VideoPlayerSkipButton.d.ts +23 -0
- package/cjs/components/videoPlayer/VideoPlayerSkipButton.js +2 -0
- package/cjs/components/videoPlayer/VideoPlayerSkipButton.js.map +1 -0
- package/cjs/components/videoPlayer/VideoPlayerSlider.d.ts +12 -0
- package/cjs/components/videoPlayer/VideoPlayerSlider.js +2 -0
- package/cjs/components/videoPlayer/VideoPlayerSlider.js.map +1 -0
- package/cjs/components/videoPlayer/VideoPlayerSoundButton.d.ts +31 -0
- package/cjs/components/videoPlayer/VideoPlayerSoundButton.js +2 -0
- package/cjs/components/videoPlayer/VideoPlayerSoundButton.js.map +1 -0
- package/cjs/components/videoPlayer/VideoPlayerTime.d.ts +17 -0
- package/cjs/components/videoPlayer/VideoPlayerTime.js +2 -0
- package/cjs/components/videoPlayer/VideoPlayerTime.js.map +1 -0
- package/cjs/components/videoPlayer/formatVideoTime.d.ts +5 -0
- package/cjs/components/videoPlayer/formatVideoTime.js +2 -0
- package/cjs/components/videoPlayer/formatVideoTime.js.map +1 -0
- package/cjs/components/videoPlayer/index.d.ts +10 -0
- package/cjs/components/videoPlayer/useVideoPlayerVisibility.d.ts +24 -0
- package/cjs/components/videoPlayer/useVideoPlayerVisibility.js +2 -0
- package/cjs/components/videoPlayer/useVideoPlayerVisibility.js.map +1 -0
- package/cjs/index.js +1 -1
- package/cjs/materialui/accordion/AccordionSummaryExpandWrapper.d.ts +5 -1
- package/cjs/materialui/accordion/AccordionSummaryExpandWrapper.js +1 -1
- package/cjs/materialui/accordion/AccordionSummaryExpandWrapper.js.map +1 -1
- package/cjs/materialui/alert/alert.theme.js +1 -1
- package/cjs/materialui/alert/alert.theme.js.map +1 -1
- package/cjs/materialui/alert/alertTitle.theme.js +1 -1
- package/cjs/materialui/alert/alertTitle.theme.js.map +1 -1
- package/cjs/materialui/card/Card.js.map +1 -1
- package/cjs/materialui/card/card.theme.js +1 -1
- package/cjs/materialui/card/card.theme.js.map +1 -1
- package/cjs/materialui/datepicker/datecalendar.theme.d.ts +102 -102
- package/cjs/materialui/datepicker/digitalclock.theme.d.ts +102 -102
- package/cjs/materialui/divider/divider.theme.js +1 -1
- package/cjs/materialui/divider/divider.theme.js.map +1 -1
- package/cjs/materialui/iconButton/iconButton.theme.js.map +1 -1
- package/cjs/materialui/skeleton/skeleton.theme.js +1 -1
- package/cjs/materialui/skeleton/skeleton.theme.js.map +1 -1
- package/cjs/materialui/slider/slider.theme.js +1 -1
- package/cjs/materialui/slider/slider.theme.js.map +1 -1
- package/cjs/materialui/table/tablePagination.theme.js.map +1 -1
- package/cjs/materialui/tabs/Tab.d.ts +1 -0
- package/cjs/materialui/tabs/Tab.js +1 -1
- package/cjs/materialui/tabs/Tab.js.map +1 -1
- package/cjs/materialui/tabs/TabsScrollButton.d.ts +3 -1
- package/cjs/materialui/tabs/TabsScrollButton.js +1 -1
- package/cjs/materialui/tabs/TabsScrollButton.js.map +1 -1
- package/cjs/materialui/textfield/FormControl.js +1 -1
- package/cjs/materialui/textfield/FormControl.js.map +1 -1
- package/cjs/materialui/textfield/FormHelperText.js +1 -1
- package/cjs/materialui/textfield/FormHelperText.js.map +1 -1
- package/cjs/materialui/theme/sxConfig.js.map +1 -1
- package/cjs/materialui/theme/theme.extensions.d.ts +40 -1
- package/cjs/materialui/typography/typography.theme.js +1 -1
- package/cjs/materialui/typography/typography.theme.js.map +1 -1
- package/cjs/node_modules/swiper/modules/a11y.js +2 -0
- package/cjs/node_modules/swiper/modules/a11y.js.map +1 -0
- package/cjs/node_modules/swiper/modules/autoplay.js +1 -1
- package/cjs/node_modules/swiper/modules/autoplay.js.map +1 -1
- package/cjs/node_modules/swiper/modules/effect-fade.js +1 -1
- package/cjs/node_modules/swiper/modules/effect-fade.js.map +1 -1
- package/cjs/node_modules/swiper/modules/keyboard.js +1 -1
- package/cjs/node_modules/swiper/modules/keyboard.js.map +1 -1
- package/cjs/node_modules/swiper/modules/parallax.js +1 -1
- package/cjs/node_modules/swiper/modules/parallax.js.map +1 -1
- package/cjs/node_modules/swiper/shared/classes-to-selector.js +2 -0
- package/cjs/node_modules/swiper/shared/classes-to-selector.js.map +1 -0
- package/cjs/node_modules/swiper/shared/effect-init.js +1 -1
- package/cjs/node_modules/swiper/shared/effect-init.js.map +1 -1
- package/cjs/node_modules/swiper/shared/effect-target.js +1 -1
- package/cjs/node_modules/swiper/shared/effect-target.js.map +1 -1
- package/cjs/node_modules/swiper/shared/effect-virtual-transition-end.js +1 -1
- package/cjs/node_modules/swiper/shared/effect-virtual-transition-end.js.map +1 -1
- package/cjs/node_modules/swiper/shared/swiper-core.js +1 -1
- package/cjs/node_modules/swiper/shared/swiper-core.js.map +1 -1
- package/cjs/node_modules/swiper/shared/update-on-virtual-data.js +1 -1
- package/cjs/node_modules/swiper/shared/update-on-virtual-data.js.map +1 -1
- package/cjs/node_modules/swiper/shared/update-swiper.js +1 -1
- package/cjs/node_modules/swiper/shared/update-swiper.js.map +1 -1
- package/cjs/node_modules/swiper/shared/utils.js +1 -1
- package/cjs/node_modules/swiper/shared/utils.js.map +1 -1
- package/cjs/node_modules/swiper/swiper-react.js +1 -1
- package/cjs/node_modules/swiper/swiper-react.js.map +1 -1
- package/cjs/package.json +1 -0
- package/components/advancedTable/agGrid.js +1 -1
- package/components/advancedTable/agGrid.js.map +1 -1
- package/components/advancedTable/agGridSkodaTheme.d.ts +3 -0
- package/components/advancedTable/agGridSkodaTheme.js +1 -1
- package/components/advancedTable/agGridSkodaTheme.js.map +1 -1
- package/components/advancedTable/agGridUniformRowHeight.d.ts +36 -0
- package/components/advancedTable/agGridUniformRowHeight.js +2 -0
- package/components/advancedTable/agGridUniformRowHeight.js.map +1 -0
- package/components/advancedTable/agGridVariables.js +1 -1
- package/components/advancedTable/agGridVariables.js.map +1 -1
- package/components/advancedTable/index.d.ts +1 -0
- package/components/alert/AlertIconButton.d.ts +8 -0
- package/components/alert/AlertIconButton.js +2 -0
- package/components/alert/AlertIconButton.js.map +1 -0
- package/components/alert/index.d.ts +1 -0
- package/components/carousel/Autoplay.js.map +1 -1
- package/components/carousel/Carousel.js +1 -1
- package/components/carousel/Carousel.js.map +1 -1
- package/components/carousel/Navigation.js +1 -1
- package/components/carousel/Navigation.js.map +1 -1
- package/components/carousel/Pagination.js +1 -1
- package/components/carousel/Pagination.js.map +1 -1
- package/components/copyButton/CopyButton.d.ts +39 -0
- package/components/copyButton/CopyButton.js +2 -0
- package/components/copyButton/CopyButton.js.map +1 -0
- package/components/copyButton/CopyIconButton.d.ts +8 -0
- package/components/copyButton/CopyIconButton.js +2 -0
- package/components/copyButton/CopyIconButton.js.map +1 -0
- package/components/copyButton/index.d.ts +3 -0
- package/components/copyButton/useCopyAction.d.ts +31 -0
- package/components/copyButton/useCopyAction.js +2 -0
- package/components/copyButton/useCopyAction.js.map +1 -0
- package/components/footer/FooterMenuCollapse.js +1 -1
- package/components/footer/FooterMenuCollapse.js.map +1 -1
- package/components/header/Header.js +1 -1
- package/components/header/Header.js.map +1 -1
- package/components/header/HeaderNavigationHero.js +1 -1
- package/components/header/HeaderNavigationHero.js.map +1 -1
- package/components/header/HeaderNavigationMenu.js +1 -1
- package/components/header/HeaderNavigationMenu.js.map +1 -1
- package/components/hotspotCard/HotspotCard.js +1 -1
- package/components/hotspotCard/HotspotCard.js.map +1 -1
- package/components/icon/stroke/EmissionLabelIcon.js.map +1 -1
- package/components/image/Image.d.ts +38 -14
- package/components/image/Image.js +1 -1
- package/components/image/Image.js.map +1 -1
- package/components/index.d.ts +2 -0
- package/components/label/Label.js.map +1 -1
- package/components/overlay/Overlay.js +1 -1
- package/components/overlay/Overlay.js.map +1 -1
- package/components/video/Video.d.ts +9 -8
- package/components/video/Video.js +1 -1
- package/components/video/Video.js.map +1 -1
- package/components/video/index.d.ts +5 -1
- package/components/video/useVideoFullscreen.d.ts +13 -0
- package/components/video/useVideoFullscreen.js +2 -0
- package/components/video/useVideoFullscreen.js.map +1 -0
- package/components/video/useVideoPlayPause.d.ts +13 -0
- package/components/video/useVideoPlayPause.js +2 -0
- package/components/video/useVideoPlayPause.js.map +1 -0
- package/components/video/useVideoReady.d.ts +6 -0
- package/components/video/useVideoReady.js +2 -0
- package/components/video/useVideoReady.js.map +1 -0
- package/components/video/useVideoSoundControls.d.ts +17 -0
- package/components/video/useVideoSoundControls.js +2 -0
- package/components/video/useVideoSoundControls.js.map +1 -0
- package/components/video/useVideoTime.d.ts +22 -0
- package/components/video/useVideoTime.js +2 -0
- package/components/video/useVideoTime.js.map +1 -0
- package/components/videoPlayer/VideoPlayer.d.ts +125 -0
- package/components/videoPlayer/VideoPlayer.js +2 -0
- package/components/videoPlayer/VideoPlayer.js.map +1 -0
- package/components/videoPlayer/VideoPlayerFullscreenButton.d.ts +31 -0
- package/components/videoPlayer/VideoPlayerFullscreenButton.js +2 -0
- package/components/videoPlayer/VideoPlayerFullscreenButton.js.map +1 -0
- package/components/videoPlayer/VideoPlayerIconButton.d.ts +16 -0
- package/components/videoPlayer/VideoPlayerIconButton.js +2 -0
- package/components/videoPlayer/VideoPlayerIconButton.js.map +1 -0
- package/components/videoPlayer/VideoPlayerPlayPauseButton.d.ts +31 -0
- package/components/videoPlayer/VideoPlayerPlayPauseButton.js +2 -0
- package/components/videoPlayer/VideoPlayerPlayPauseButton.js.map +1 -0
- package/components/videoPlayer/VideoPlayerSkipButton.d.ts +23 -0
- package/components/videoPlayer/VideoPlayerSkipButton.js +2 -0
- package/components/videoPlayer/VideoPlayerSkipButton.js.map +1 -0
- package/components/videoPlayer/VideoPlayerSlider.d.ts +12 -0
- package/components/videoPlayer/VideoPlayerSlider.js +2 -0
- package/components/videoPlayer/VideoPlayerSlider.js.map +1 -0
- package/components/videoPlayer/VideoPlayerSoundButton.d.ts +31 -0
- package/components/videoPlayer/VideoPlayerSoundButton.js +2 -0
- package/components/videoPlayer/VideoPlayerSoundButton.js.map +1 -0
- package/components/videoPlayer/VideoPlayerTime.d.ts +17 -0
- package/components/videoPlayer/VideoPlayerTime.js +2 -0
- package/components/videoPlayer/VideoPlayerTime.js.map +1 -0
- package/components/videoPlayer/formatVideoTime.d.ts +5 -0
- package/components/videoPlayer/formatVideoTime.js +2 -0
- package/components/videoPlayer/formatVideoTime.js.map +1 -0
- package/components/videoPlayer/index.d.ts +10 -0
- package/components/videoPlayer/useVideoPlayerVisibility.d.ts +24 -0
- package/components/videoPlayer/useVideoPlayerVisibility.js +2 -0
- package/components/videoPlayer/useVideoPlayerVisibility.js.map +1 -0
- package/index.js +1 -1
- package/materialui/accordion/AccordionSummaryExpandWrapper.d.ts +5 -1
- package/materialui/accordion/AccordionSummaryExpandWrapper.js +1 -1
- package/materialui/accordion/AccordionSummaryExpandWrapper.js.map +1 -1
- package/materialui/alert/alert.theme.js +1 -1
- package/materialui/alert/alert.theme.js.map +1 -1
- package/materialui/alert/alertTitle.theme.js +1 -1
- package/materialui/alert/alertTitle.theme.js.map +1 -1
- package/materialui/card/Card.js.map +1 -1
- package/materialui/card/card.theme.js +1 -1
- package/materialui/card/card.theme.js.map +1 -1
- package/materialui/datepicker/datecalendar.theme.d.ts +102 -102
- package/materialui/datepicker/digitalclock.theme.d.ts +102 -102
- package/materialui/divider/divider.theme.js +1 -1
- package/materialui/divider/divider.theme.js.map +1 -1
- package/materialui/iconButton/iconButton.theme.js.map +1 -1
- package/materialui/skeleton/skeleton.theme.js +1 -1
- package/materialui/skeleton/skeleton.theme.js.map +1 -1
- package/materialui/slider/slider.theme.js +1 -1
- package/materialui/slider/slider.theme.js.map +1 -1
- package/materialui/table/tablePagination.theme.js.map +1 -1
- package/materialui/tabs/Tab.d.ts +1 -0
- package/materialui/tabs/Tab.js +1 -1
- package/materialui/tabs/Tab.js.map +1 -1
- package/materialui/tabs/TabsScrollButton.d.ts +3 -1
- package/materialui/tabs/TabsScrollButton.js +1 -1
- package/materialui/tabs/TabsScrollButton.js.map +1 -1
- package/materialui/textfield/FormControl.js +1 -1
- package/materialui/textfield/FormControl.js.map +1 -1
- package/materialui/textfield/FormHelperText.js +1 -1
- package/materialui/textfield/FormHelperText.js.map +1 -1
- package/materialui/theme/sxConfig.js.map +1 -1
- package/materialui/theme/theme.extensions.d.ts +40 -1
- package/materialui/typography/typography.theme.js +1 -1
- package/materialui/typography/typography.theme.js.map +1 -1
- package/package.json +1 -1
- package/cjs/components/video/hooks.d.ts +0 -43
- package/cjs/components/video/hooks.js +0 -2
- package/cjs/components/video/hooks.js.map +0 -1
- package/cjs/node_modules/swiper/shared/ssr-window.esm.js +0 -2
- package/cjs/node_modules/swiper/shared/ssr-window.esm.js.map +0 -1
- package/components/video/hooks.d.ts +0 -43
- package/components/video/hooks.js +0 -2
- package/components/video/hooks.js.map +0 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var r=require("react/jsx-runtime"),e=require("react"),a=require("@mui/material"),o=require("../../utils/sxOverride/sxOverride.js");const t=e.forwardRef(({ownerState:e,iconButtonProps:t,children:i,...n},s)=>{const{expanded:d,disabled:c}=e,l=a.useTheme(),{sx:u,className:x,...m}=t??{};return r.jsx(a.Box,{component:"span",sx:{flexShrink:"0",mr:"6px",transform:"rotate(0deg)",transition:l.transitions.create("transform",{duration:l.transitions.duration.shortest}),"&.Mui-expanded":{transform:"rotate(180deg)"}},ref:s,...n,children:r.jsx(a.IconButton,{"aria-label":"Toggle accordion","aria-controls":e["aria-controls"],color:"dark"===l.palette.mode?"white":"secondary",size:"medium",sx:o.sxOverride({},u),...m,"aria-expanded":d,disabled:c,className:["MuiAccordion-IconButton",x].filter(Boolean).join(" "),children:i})})});exports.FlowAccordionSummaryExpandWrapper=t;
|
|
2
2
|
//# sourceMappingURL=AccordionSummaryExpandWrapper.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionSummaryExpandWrapper.js","sources":["../../../../../src/materialui/accordion/AccordionSummaryExpandWrapper.tsx"],"sourcesContent":["import React, { FC, ElementType, forwardRef } from 'react';\nimport { Box, BoxProps, IconButton, useTheme, AccordionSummaryOwnerState } from '@mui/material';\n\n/**\n * AccordionSummary.slots.expandIconWrapper that replaces expand icon\n * Wrapper is used instead of expandIcon to gain access to ownerState\n */\nexport const FlowAccordionSummaryExpandWrapper: FC<\n BoxProps<ElementType> & {\n // @mui extend ownerState with expanded and disabled properties\n // https://github.com/mui/material-ui/blob/master/packages/mui-material/src/AccordionSummary/AccordionSummary.js#L132\n ownerState: AccordionSummaryOwnerState & { expanded: boolean; disabled: boolean; disableGutters: boolean };\n }\n> = forwardRef(({ ownerState, children, ...rest }, ref) => {\n const { expanded, disabled } = ownerState;\n const theme = useTheme();\n\n return (\n <Box\n component=\"span\"\n sx={{\n flexShrink: '0',\n mr: '6px',\n transform: 'rotate(0deg)',\n transition: theme.transitions.create('transform', {\n duration: theme.transitions.duration.shortest,\n }),\n '&.Mui-expanded': {\n transform: 'rotate(180deg)',\n },\n }}\n ref={ref}\n {...rest}\n >\n <IconButton\n aria-label=\"Toggle accordion\"\n aria-
|
|
1
|
+
{"version":3,"file":"AccordionSummaryExpandWrapper.js","sources":["../../../../../src/materialui/accordion/AccordionSummaryExpandWrapper.tsx"],"sourcesContent":["import React, { FC, ElementType, forwardRef } from 'react';\nimport { Box, BoxProps, IconButton, IconButtonProps, useTheme, AccordionSummaryOwnerState } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\n\n/**\n * AccordionSummary.slots.expandIconWrapper that replaces expand icon\n * Wrapper is used instead of expandIcon to gain access to ownerState\n */\nexport const FlowAccordionSummaryExpandWrapper: FC<\n BoxProps<ElementType> & {\n // @mui extend ownerState with expanded and disabled properties\n // https://github.com/mui/material-ui/blob/master/packages/mui-material/src/AccordionSummary/AccordionSummary.js#L132\n ownerState: AccordionSummaryOwnerState & { expanded: boolean; disabled: boolean; disableGutters: boolean };\n /**\n * Properties applied to expand/collapse IconButton, passed via `slotProps.expandIconWrapper`\n */\n iconButtonProps?: IconButtonProps;\n }\n> = forwardRef(({ ownerState, iconButtonProps, children, ...rest }, ref) => {\n const { expanded, disabled } = ownerState;\n const theme = useTheme();\n const { sx: iconButtonSx, className: iconButtonClassName, ...restIconButton } = iconButtonProps ?? {};\n\n return (\n <Box\n component=\"span\"\n sx={{\n flexShrink: '0',\n mr: '6px',\n transform: 'rotate(0deg)',\n transition: theme.transitions.create('transform', {\n duration: theme.transitions.duration.shortest,\n }),\n '&.Mui-expanded': {\n transform: 'rotate(180deg)',\n },\n }}\n ref={ref}\n {...rest}\n >\n <IconButton\n aria-label=\"Toggle accordion\"\n // @mui uses AccordionSummary aria-controls as id of the AccordionDetails region\n aria-controls={ownerState['aria-controls']}\n color={theme.palette.mode === 'dark' ? 'white' : 'secondary'}\n size=\"medium\"\n sx={sxOverride({}, iconButtonSx)}\n {...restIconButton}\n aria-expanded={expanded}\n disabled={disabled}\n className={['MuiAccordion-IconButton', iconButtonClassName].filter(Boolean).join(' ')}\n >\n {children}\n </IconButton>\n </Box>\n );\n});\n"],"names":["FlowAccordionSummaryExpandWrapper","forwardRef","ownerState","iconButtonProps","children","rest","ref","expanded","disabled","theme","useTheme","sx","iconButtonSx","className","iconButtonClassName","restIconButton","_jsx","Box","component","flexShrink","mr","transform","transition","transitions","create","duration","shortest","IconButton","color","palette","mode","size","sxOverride","filter","Boolean","join"],"mappings":"sJAQaA,EAUTC,EAAAA,WAAW,EAAGC,aAAYC,kBAAiBC,cAAaC,GAAQC,KAClE,MAAMC,SAAEA,EAAQC,SAAEA,GAAaN,EACzBO,EAAQC,EAAAA,YACNC,GAAIC,EAAcC,UAAWC,KAAwBC,GAAmBZ,GAAmB,CAAA,EAEnG,OACEa,EAAAA,IAACC,EAAAA,IAAG,CACFC,UAAU,OACVP,GAAI,CACFQ,WAAY,IACZC,GAAI,MACJC,UAAW,eACXC,WAAYb,EAAMc,YAAYC,OAAO,YAAa,CAChDC,SAAUhB,EAAMc,YAAYE,SAASC,WAEvC,iBAAkB,CAChBL,UAAW,mBAGff,IAAKA,KACDD,WAEJW,EAAAA,IAACW,aAAU,CAAA,aACE,mCAEIzB,EAAW,iBAC1B0B,MAA8B,SAAvBnB,EAAMoB,QAAQC,KAAkB,QAAU,YACjDC,KAAK,SACLpB,GAAIqB,aAAW,CAAA,EAAIpB,MACfG,EAAc,gBACHR,EACfC,SAAUA,EACVK,UAAW,CAAC,0BAA2BC,GAAqBmB,OAAOC,SAASC,KAAK,KAAI/B,SAEpFA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e=require("react/jsx-runtime"),i=require("../../components/icon/filled/CircleCheckFilledIcon.js"),o=require("../../components/icon/filled/CircleExclamationFilledIcon.js"),t=require("../../components/icon/filled/WarningFilledIcon.js"),
|
|
1
|
+
"use strict";var e=require("react/jsx-runtime"),i=require("../../components/icon/filled/CircleCheckFilledIcon.js"),o=require("../../components/icon/filled/CircleExclamationFilledIcon.js"),t=require("../../components/icon/filled/WarningFilledIcon.js"),n=require("../../components/icon/stroke/CloseIcon.js"),r=require("../../components/label/Label.js");const a={defaultProps:{severity:"info",variant:"filled",iconMapping:{info:e.jsx(e.Fragment,{}),success:e.jsx(i.CircleCheckFilledIcon,{}),warning:e.jsx(o.CircleExclamationFilledIcon,{}),error:e.jsx(t.WarningFilledIcon,{}),notification:e.jsx(r.Label,{type:"indicator",variant:"neutral"})},slotProps:{closeIcon:{fontSize:"extraSmall"}},slots:{closeIcon:n.CloseIcon}},styleOverrides:{root:({theme:e,ownerState:i})=>({display:"flex",alignItems:"stretch",justifyContent:"flex-start",flexWrap:"nowrap",textAlign:"left",backgroundColor:e.palette.onSurface.os900,color:e.palette.common.white,boxShadow:e.flowShadows.xs,[e.breakpoints.up("md")]:{minWidth:"0",boxShadow:e.flowShadows.m},[e.breakpoints.up("xl")]:{boxShadow:e.flowShadows.xl},borderRadius:"4px",padding:"8px 8px 8px 16px",minWidth:"0",width:"auto",maxWidth:"546px","&:has(.MuiAlert-message .MuiAlertTitle-root), &:has(.MuiAlert-message .MuiTypography-caption1)":{"& .MuiAlert-icon":{alignSelf:"flex-start"}},..."notification"===i.severity&&{backgroundColor:e.palette.background.primary,color:e.palette.text.primary}}),outlined:{border:"none"},icon:({theme:e,ownerState:i})=>({alignSelf:"center",display:"block",flexShrink:"0",position:"relative",opacity:"1",padding:"3px",margin:"0",marginRight:"6px",..."info"===i.severity&&{display:"none"},..."notification"===i.severity&&{lineHeight:"14px"},"& .MuiSvgIcon-root":{display:"block",fontSize:"18px",..."success"===i.severity&&{color:e.palette.brand.secondary},..."warning"===i.severity&&{color:e.palette.warning.main},..."error"===i.severity&&{color:e.palette.error.main}}}),message:({theme:e})=>({alignSelf:"center",flexGrow:"1",...e.typography.disclaimer1,padding:"0",overflow:"hidden",display:"-webkit-box",WebkitBoxOrient:"vertical",WebkitLineClamp:"2","&:has(.MuiAlertTitle-root), &:has(.MuiTypography-caption1)":{WebkitLineClamp:"3"},[e.breakpoints.down("md")]:{WebkitLineClamp:"3","&:has(.MuiAlertTitle-root), &:has(.MuiTypography-caption1)":{WebkitLineClamp:"4"}}}),action:({theme:e})=>({flexShrink:"0",alignItems:"center",padding:"0",margin:"0","&:before":{content:'""',display:"inline-block",width:"1px",height:"32px",marginRight:"8px",marginLeft:"24px",backgroundColor:e.palette.onSurface.os600},"&:has(.MuiButton-root):before":{height:"44px"}})}};exports.flowAlert=a;
|
|
2
2
|
//# sourceMappingURL=alert.theme.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert.theme.js","sources":["../../../../../src/materialui/alert/alert.theme.tsx"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\nimport { CircleCheckFilledIcon } from '@/src/components/icon/filled/CircleCheckFilledIcon';\nimport { CircleExclamationFilledIcon } from '@/src/components/icon/filled/CircleExclamationFilledIcon';\nimport { WarningFilledIcon } from '@/src/components/icon/filled/WarningFilledIcon';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\nimport { Label } from '@/src/components/label';\n\nexport const flowAlert: Components<Theme>['MuiAlert'] = {\n defaultProps: {\n severity: 'info',\n variant: 'filled',\n iconMapping: {\n info: <></>,\n success: <CircleCheckFilledIcon />,\n warning: <CircleExclamationFilledIcon />,\n error: <WarningFilledIcon />,\n notification: <Label type=\"indicator\" variant=\"neutral\" />,\n },\n slotProps: {\n closeIcon: { fontSize: 'extraSmall' },\n },\n slots: {\n closeIcon: CloseIcon,\n },\n },\n styleOverrides: {\n // main wrapper\n root: ({ theme, ownerState }) => ({\n display: 'flex',\n alignItems: 'stretch',\n justifyContent: 'flex-start',\n flexWrap: 'nowrap',\n // specify default text align to prevent overwriting from parent\n textAlign: 'left',\n // style for all variants\n backgroundColor: theme.palette.onSurface.os900,\n color: theme.palette.common.white,\n boxShadow: theme.flowShadows.xs,\n [theme.breakpoints.up('md')]: {\n minWidth: '0',\n boxShadow: theme.flowShadows.m,\n },\n [theme.breakpoints.up('xl')]: {\n boxShadow: theme.flowShadows.xl,\n },\n // proportions\n borderRadius: '4px',\n padding: '8px 16px',\n minWidth: '0',\n width: 'auto',\n maxWidth: '
|
|
1
|
+
{"version":3,"file":"alert.theme.js","sources":["../../../../../src/materialui/alert/alert.theme.tsx"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\nimport { CircleCheckFilledIcon } from '@/src/components/icon/filled/CircleCheckFilledIcon';\nimport { CircleExclamationFilledIcon } from '@/src/components/icon/filled/CircleExclamationFilledIcon';\nimport { WarningFilledIcon } from '@/src/components/icon/filled/WarningFilledIcon';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\nimport { Label } from '@/src/components/label';\n\nexport const flowAlert: Components<Theme>['MuiAlert'] = {\n defaultProps: {\n severity: 'info',\n variant: 'filled',\n iconMapping: {\n info: <></>,\n success: <CircleCheckFilledIcon />,\n warning: <CircleExclamationFilledIcon />,\n error: <WarningFilledIcon />,\n notification: <Label type=\"indicator\" variant=\"neutral\" />,\n },\n slotProps: {\n closeIcon: { fontSize: 'extraSmall' },\n },\n slots: {\n closeIcon: CloseIcon,\n },\n },\n styleOverrides: {\n // main wrapper\n root: ({ theme, ownerState }) => ({\n display: 'flex',\n alignItems: 'stretch',\n justifyContent: 'flex-start',\n flexWrap: 'nowrap',\n // specify default text align to prevent overwriting from parent\n textAlign: 'left',\n // style for all variants\n backgroundColor: theme.palette.onSurface.os900,\n color: theme.palette.common.white,\n boxShadow: theme.flowShadows.xs,\n [theme.breakpoints.up('md')]: {\n minWidth: '0',\n boxShadow: theme.flowShadows.m,\n },\n [theme.breakpoints.up('xl')]: {\n boxShadow: theme.flowShadows.xl,\n },\n // proportions\n borderRadius: '4px',\n padding: '8px 8px 8px 16px',\n minWidth: '0',\n width: 'auto',\n maxWidth: '546px',\n // detect if AlertTitle (or previous title) is present in message\n '&:has(.MuiAlert-message .MuiAlertTitle-root), &:has(.MuiAlert-message .MuiTypography-caption1)': {\n '& .MuiAlert-icon': {\n alignSelf: 'flex-start',\n },\n },\n ...(ownerState.severity === 'notification' && {\n backgroundColor: theme.palette.background.primary,\n color: theme.palette.text.primary,\n }),\n }),\n // unsupported variant\n outlined: {\n border: 'none',\n },\n // holder of icon on left side\n icon: ({ theme, ownerState }) => ({\n alignSelf: 'center',\n display: 'block',\n flexShrink: '0',\n position: 'relative',\n opacity: '1',\n // proportions\n padding: '3px',\n margin: '0',\n // in Figma, it's 8px, but using Pixel Perfect, it comes out to 6px\n marginRight: '6px',\n // style of each variant\n ...(ownerState.severity === 'info' && { display: 'none' }),\n ...(ownerState.severity === 'notification' && { lineHeight: '14px' }),\n // icons inside\n '& .MuiSvgIcon-root': {\n display: 'block',\n fontSize: '18px',\n ...(ownerState.severity === 'success' && { color: theme.palette.brand.secondary }),\n ...(ownerState.severity === 'warning' && { color: theme.palette.warning.main }),\n ...(ownerState.severity === 'error' && { color: theme.palette.error.main }),\n },\n }),\n // holder of AlertTitle and message in the center\n message: ({ theme }) => ({\n alignSelf: 'center',\n // fill remaining space\n flexGrow: '1',\n // proper typography\n ...theme.typography.disclaimer1,\n // proportions\n padding: '0',\n // multi-line ellipsis\n overflow: 'hidden',\n display: '-webkit-box',\n WebkitBoxOrient: 'vertical',\n WebkitLineClamp: '2',\n // detect if AlertTitle (or previous title) is present\n '&:has(.MuiAlertTitle-root), &:has(.MuiTypography-caption1)': {\n WebkitLineClamp: '3',\n },\n [theme.breakpoints.down('md')]: {\n WebkitLineClamp: '3',\n '&:has(.MuiAlertTitle-root), &:has(.MuiTypography-caption1)': {\n WebkitLineClamp: '4',\n },\n },\n }),\n // holder of action button on right side\n action: ({ theme }) => ({\n flexShrink: '0',\n alignItems: 'center',\n // proportions\n padding: '0',\n margin: '0',\n // divider between message and actions\n '&:before': {\n content: '\"\"',\n display: 'inline-block',\n width: '1px',\n height: '32px',\n marginRight: '8px',\n marginLeft: '24px',\n backgroundColor: theme.palette.onSurface.os600,\n },\n // increase height of border with classic button\n '&:has(.MuiButton-root):before': {\n height: '44px',\n },\n }),\n },\n};\n"],"names":["flowAlert","defaultProps","severity","variant","iconMapping","info","_jsx","_Fragment","success","CircleCheckFilledIcon","warning","CircleExclamationFilledIcon","error","WarningFilledIcon","notification","Label","type","slotProps","closeIcon","fontSize","slots","CloseIcon","styleOverrides","root","theme","ownerState","display","alignItems","justifyContent","flexWrap","textAlign","backgroundColor","palette","onSurface","os900","color","common","white","boxShadow","flowShadows","xs","breakpoints","up","minWidth","m","xl","borderRadius","padding","width","maxWidth","alignSelf","background","primary","text","outlined","border","icon","flexShrink","position","opacity","margin","marginRight","lineHeight","brand","secondary","main","message","flexGrow","typography","disclaimer1","overflow","WebkitBoxOrient","WebkitLineClamp","down","action","content","height","marginLeft","os600"],"mappings":"+VAQO,MAAMA,EAA2C,CACtDC,aAAc,CACZC,SAAU,OACVC,QAAS,SACTC,YAAa,CACXC,KAAMC,EAAAA,IAAAC,EAAAA,SAAA,IACNC,QAASF,EAAAA,IAACG,EAAAA,sBAAqB,IAC/BC,QAASJ,EAAAA,IAACK,EAAAA,4BAA2B,IACrCC,MAAON,EAAAA,IAACO,EAAAA,kBAAiB,IACzBC,aAAcR,EAAAA,IAACS,QAAK,CAACC,KAAK,YAAYb,QAAQ,aAEhDc,UAAW,CACTC,UAAW,CAAEC,SAAU,eAEzBC,MAAO,CACLF,UAAWG,EAAAA,YAGfC,eAAgB,CAEdC,KAAM,EAAGC,QAAOC,iBAAY,CAC1BC,QAAS,OACTC,WAAY,UACZC,eAAgB,aAChBC,SAAU,SAEVC,UAAW,OAEXC,gBAAiBP,EAAMQ,QAAQC,UAAUC,MACzCC,MAAOX,EAAMQ,QAAQI,OAAOC,MAC5BC,UAAWd,EAAMe,YAAYC,GAC7B,CAAChB,EAAMiB,YAAYC,GAAG,OAAQ,CAC5BC,SAAU,IACVL,UAAWd,EAAMe,YAAYK,GAE/B,CAACpB,EAAMiB,YAAYC,GAAG,OAAQ,CAC5BJ,UAAWd,EAAMe,YAAYM,IAG/BC,aAAc,MACdC,QAAS,mBACTJ,SAAU,IACVK,MAAO,OACPC,SAAU,QAEV,iGAAkG,CAChG,mBAAoB,CAClBC,UAAW,kBAGa,iBAAxBzB,EAAWvB,UAA+B,CAC5C6B,gBAAiBP,EAAMQ,QAAQmB,WAAWC,QAC1CjB,MAAOX,EAAMQ,QAAQqB,KAAKD,WAI9BE,SAAU,CACRC,OAAQ,QAGVC,KAAM,EAAGhC,QAAOC,iBAAY,CAC1ByB,UAAW,SACXxB,QAAS,QACT+B,WAAY,IACZC,SAAU,WACVC,QAAS,IAETZ,QAAS,MACTa,OAAQ,IAERC,YAAa,SAEe,SAAxBpC,EAAWvB,UAAuB,CAAEwB,QAAS,WACrB,iBAAxBD,EAAWvB,UAA+B,CAAE4D,WAAY,QAE5D,qBAAsB,CACpBpC,QAAS,QACTP,SAAU,UACkB,YAAxBM,EAAWvB,UAA0B,CAAEiC,MAAOX,EAAMQ,QAAQ+B,MAAMC,cAC1C,YAAxBvC,EAAWvB,UAA0B,CAAEiC,MAAOX,EAAMQ,QAAQtB,QAAQuD,SAC5C,UAAxBxC,EAAWvB,UAAwB,CAAEiC,MAAOX,EAAMQ,QAAQpB,MAAMqD,SAIxEC,QAAS,EAAG1C,YAAO,CACjB0B,UAAW,SAEXiB,SAAU,OAEP3C,EAAM4C,WAAWC,YAEpBtB,QAAS,IAETuB,SAAU,SACV5C,QAAS,cACT6C,gBAAiB,WACjBC,gBAAiB,IAEjB,6DAA8D,CAC5DA,gBAAiB,KAEnB,CAAChD,EAAMiB,YAAYgC,KAAK,OAAQ,CAC9BD,gBAAiB,IACjB,6DAA8D,CAC5DA,gBAAiB,QAKvBE,OAAQ,EAAGlD,YAAO,CAChBiC,WAAY,IACZ9B,WAAY,SAEZoB,QAAS,IACTa,OAAQ,IAER,WAAY,CACVe,QAAS,KACTjD,QAAS,eACTsB,MAAO,MACP4B,OAAQ,OACRf,YAAa,MACbgB,WAAY,OACZ9C,gBAAiBP,EAAMQ,QAAQC,UAAU6C,OAG3C,gCAAiC,CAC/BF,OAAQ"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";exports.flowAlertTitle={defaultProps:{variant:"caption2",component:"h4"}};
|
|
1
|
+
"use strict";exports.flowAlertTitle={defaultProps:{variant:"caption2",component:"h4"},styleOverrides:{root:{marginTop:"0"}}};
|
|
2
2
|
//# sourceMappingURL=alertTitle.theme.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alertTitle.theme.js","sources":["../../../../../src/materialui/alert/alertTitle.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\n\nexport const flowAlertTitle: Components<Theme>['MuiAlertTitle'] = {\n defaultProps: {\n variant: 'caption2',\n component: 'h4',\n },\n};\n"],"names":["defaultProps","variant","component"],"mappings":"oCAGkE,CAChEA,aAAc,CACZC,QAAS,WACTC,UAAW"}
|
|
1
|
+
{"version":3,"file":"alertTitle.theme.js","sources":["../../../../../src/materialui/alert/alertTitle.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\n\nexport const flowAlertTitle: Components<Theme>['MuiAlertTitle'] = {\n defaultProps: {\n variant: 'caption2',\n component: 'h4',\n },\n styleOverrides: {\n // override MUI default\n root: {\n marginTop: '0',\n },\n },\n};\n"],"names":["defaultProps","variant","component","styleOverrides","root","marginTop"],"mappings":"oCAGkE,CAChEA,aAAc,CACZC,QAAS,WACTC,UAAW,MAEbC,eAAgB,CAEdC,KAAM,CACJC,UAAW"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Card.js","sources":["../../../../../src/materialui/card/Card.tsx"],"sourcesContent":["import React, { FC, forwardRef } from 'react';\nimport { Paper, Box, CardProps } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { CheckIcon } from '@/src/components/icon/stroke/CheckIcon';\nimport { PlusIcon } from '@/src/components/icon/stroke/PlusIcon';\nimport { MinusIcon } from '@/src/components/icon/stroke/MinusIcon';\nimport { updateFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\nimport { Spinner } from '@/src/components/progress/Spinner';\n\n/**\n * Standard MUI Card extended with custom properties\n */\nexport const FlowCard: FC<CardProps> = forwardRef(\n (\n {\n children,\n isSelected,\n disableIcon = true,\n iconSlots,\n iconPlacement = 'top-end',\n iconProps,\n hoverIconProps,\n iconWrapperProps,\n contentWrapperProps,\n onClick,\n disabled,\n color,\n loading,\n loadingProps,\n ...rest\n },\n ref,\n ) => {\n const { sx: wrapperSx, ...restWrapper } = contentWrapperProps || {};\n const { sx: iconWrapperSx, className: iconWrapperClassName, ...restIconWrapper } = iconWrapperProps || {};\n const { sx: iconSx, ...restIcon } = iconProps || {};\n const { sx: hoverIconSx, ...restHoverIcon } = hoverIconProps || {};\n const { sx: loadingSpinnerSx, ...restLoadingProps } = loadingProps || {};\n const { icon, selectedIcon, hoverIcon, hoverSelectedIcon } = {\n icon: PlusIcon,\n selectedIcon: CheckIcon,\n hoverIcon: PlusIcon,\n hoverSelectedIcon: MinusIcon,\n ...(iconSlots || {}),\n };\n const IconComponent = !disabled && isSelected ? selectedIcon : icon;\n const HoverIconComponent = !disabled && isSelected ? hoverSelectedIcon : hoverIcon;\n const showLoadingSpinner = loading && !disabled;\n\n return (\n <Paper color={color} onClick={disabled ? undefined : onClick} {...rest} ref={ref}>\n <Box\n sx={sxOverride({ borderRadius: 'inherit', overflow: 'hidden', height: '100%' }, wrapperSx)}\n {...restWrapper}\n >\n {!disableIcon && (\n <Box\n sx={sxOverride(\n {\n // circle\n border: 1,\n borderColor: 'onSurface.os100',\n backgroundColor: 'background.primary',\n ...(color === 'secondary' && {\n backgroundColor: 'surface.primary',\n }),\n borderRadius: '1000px',\n p: showLoadingSpinner ? '3px' : '5px',\n // reset IconButton style\n width: 'auto',\n height: 'auto',\n transition: 'none',\n // interactive and selected effect is controlled by card.theme\n // placement\n position: 'absolute',\n ...(iconPlacement.includes('top') ? { top: '16px' } : {}),\n ...(iconPlacement.includes('bottom') ? { bottom: '16px' } : {}),\n ...(iconPlacement.includes('start') ? { left: '16px' } : {}),\n ...(iconPlacement.includes('end') ? { right: '16px' } : {}),\n // Box overwritten to button\n '&.MuiButtonBase-root': {\n ...updateFocusRingStyle(1),\n // remove smooth transition effect to match card behavior\n '&:before': {\n transition: 'none',\n },\n // same style is also applied in card.theme\n ...getInteractiveStyle(\n {\n backgroundColor: 'background.primary',\n ...(color === 'secondary' && {\n backgroundColor: 'surface.primary',\n }),\n ...(isSelected && {\n backgroundColor: 'brand.primary',\n borderColor: 'brand.primary',\n color: 'common.white',\n }),\n ...(showLoadingSpinner && isSelected && {\n backgroundColor: 'brandHover.primary',\n borderColor: 'brandHover.primary',\n }),\n ...(!showLoadingSpinner && {\n '.MuiSvgIcon-root': {\n '&:first-of-type': {\n display: 'block',\n },\n '&:last-of-type': {\n display: 'none',\n },\n },\n }),\n },\n {\n backgroundColor: 'surface.primary',\n ...(color === 'secondary' && {\n backgroundColor: 'surface.secondary',\n }),\n ...(isSelected && {\n backgroundColor: 'brandHover.primary',\n borderColor: 'brandHover.primary',\n color: 'common.white',\n }),\n // flip icon being shown\n ...(!showLoadingSpinner && {\n '.MuiSvgIcon-root': {\n '&:first-of-type': {\n display: 'none',\n },\n '&:last-of-type': {\n display: 'block',\n },\n },\n }),\n },\n ),\n },\n },\n iconWrapperSx,\n )}\n className={['FlowCard-Icon-root', iconWrapperClassName].filter(Boolean).join(' ')}\n {...restIconWrapper}\n >\n {showLoadingSpinner ? (\n <Spinner\n data-testid=\"Card.LoadingSpinner\"\n size={24}\n sx={sxOverride(\n {\n display: 'block',\n width: '24px',\n height: '24px',\n ...(isSelected && {\n '& .FlowSpinner-circle-primary': {\n stroke: (theme) => theme.palette.brand.secondary,\n },\n '& .FlowSpinner-circle-secondary': {\n stroke: (theme) => theme.palette.transparent.secondary,\n },\n }),\n },\n loadingSpinnerSx,\n )}\n {...restLoadingProps}\n />\n ) : (\n <>\n <IconComponent\n data-testid=\"Card.Icon\"\n sx={sxOverride({ display: 'block', fontSize: '20px' }, iconSx)}\n {...restIcon}\n />\n <HoverIconComponent\n data-testid=\"Card.HoverIcon\"\n sx={sxOverride({ display: 'none', fontSize: '20px' }, hoverIconSx)}\n {...restHoverIcon}\n />\n </>\n )}\n </Box>\n )}\n {children}\n </Box>\n </Paper>\n );\n },\n);\n"],"names":["FlowCard","forwardRef","children","isSelected","disableIcon","iconSlots","iconPlacement","iconProps","hoverIconProps","iconWrapperProps","contentWrapperProps","onClick","disabled","color","loading","loadingProps","rest","ref","sx","wrapperSx","restWrapper","iconWrapperSx","className","iconWrapperClassName","restIconWrapper","iconSx","restIcon","hoverIconSx","restHoverIcon","loadingSpinnerSx","restLoadingProps","icon","selectedIcon","hoverIcon","hoverSelectedIcon","PlusIcon","CheckIcon","MinusIcon","IconComponent","HoverIconComponent","showLoadingSpinner","_jsx","Paper","undefined","_jsxs","Box","sxOverride","borderRadius","overflow","height","border","borderColor","backgroundColor","p","width","transition","position","includes","top","bottom","left","right","updateFocusRingStyle","getInteractiveStyle","display","filter","Boolean","join","Spinner","size","stroke","theme","palette","brand","secondary","transparent","_Fragment","fontSize"],"mappings":"ucAaaA,EAA0BC,EAAAA,WACrC,EAEIC,WACAC,aACAC,eAAc,EACdC,YACAC,gBAAgB,UAChBC,YACAC,iBACAC,mBACAC,sBACAC,UACAC,WACAC,QACAC,UACAC,kBACGC,GAELC,KAEA,MAAQC,GAAIC,KAAcC,GAAgBV,GAAuB,CAAA,GACzDQ,GAAIG,EAAeC,UAAWC,KAAyBC,GAAoBf,GAAoB,CAAA,GAC/FS,GAAIO,KAAWC,GAAanB,GAAa,CAAA,GACzCW,GAAIS,KAAgBC,GAAkBpB,GAAkB,CAAA,GACxDU,GAAIW,KAAqBC,GAAqBf,GAAgB,CAAA,GAChEgB,KAAEA,EAAIC,aAAEA,EAAYC,UAAEA,EAASC,kBAAEA,GAAsB,CAC3DH,KAAMI,EAAAA,SACNH,aAAcI,EAAAA,UACdH,UAAWE,EAAAA,SACXD,kBAAmBG,EAAAA,aACfhC,GAAa,CAAA,GAEbiC,GAAiB1B,GAAYT,EAAa6B,EAAeD,EACzDQ,GAAsB3B,GAAYT,EAAa+B,EAAoBD,EACnEO,EAAqB1B,IAAYF,EAEvC,OACE6B,EAAAA,IAACC,EAAAA,MAAK,CAAC7B,MAAOA,EAAOF,QAASC,OAAW+B,EAAYhC,KAAaK,EAAMC,IAAKA,EAAGf,SAC9E0C,OAACC,EAAAA,KACC3B,GAAI4B,EAAAA,WAAW,CAAEC,aAAc,UAAWC,SAAU,SAAUC,OAAQ,QAAU9B,MAC5EC,EAAWlB,SAAA,EAEbE,GACAqC,EAAAA,IAACI,MAAG,CACF3B,GAAI4B,aACF,CAEEI,OAAQ,EACRC,YAAa,kBACbC,gBAAiB,wBACH,cAAVvC,GAAyB,CAC3BuC,gBAAiB,mBAEnBL,aAAc,SACdM,EAAGb,EAAqB,MAAQ,MAEhCc,MAAO,OACPL,OAAQ,OACRM,WAAY,OAGZC,SAAU,cACNlD,EAAcmD,SAAS,OAAS,CAAEC,IAAK,QAAW,MAClDpD,EAAcmD,SAAS,UAAY,CAAEE,OAAQ,QAAW,MACxDrD,EAAcmD,SAAS,SAAW,CAAEG,KAAM,QAAW,MACrDtD,EAAcmD,SAAS,OAAS,CAAEI,MAAO,QAAW,GAExD,uBAAwB,IACnBC,EAAAA,qBAAqB,GAExB,WAAY,CACVP,WAAY,WAGXQ,sBACD,CACEX,gBAAiB,wBACH,cAAVvC,GAAyB,CAC3BuC,gBAAiB,sBAEfjD,GAAc,CAChBiD,gBAAiB,gBACjBD,YAAa,gBACbtC,MAAO,mBAEL2B,GAAsBrC,GAAc,CACtCiD,gBAAiB,qBACjBD,YAAa,0BAEVX,GAAsB,CACzB,mBAAoB,CAClB,kBAAmB,CACjBwB,QAAS,SAEX,iBAAkB,CAChBA,QAAS,WAKjB,CACEZ,gBAAiB,qBACH,cAAVvC,GAAyB,CAC3BuC,gBAAiB,wBAEfjD,GAAc,CAChBiD,gBAAiB,qBACjBD,YAAa,qBACbtC,MAAO,oBAGJ2B,GAAsB,CACzB,mBAAoB,CAClB,kBAAmB,CACjBwB,QAAS,QAEX,iBAAkB,CAChBA,QAAS,eAQvB3C,GAEFC,UAAW,CAAC,qBAAsBC,GAAsB0C,OAAOC,SAASC,KAAK,QACzE3C,WAEHgB,EACCC,EAAAA,IAAC2B,UAAO,CAAA,cACM,sBACZC,KAAM,GACNnD,GAAI4B,EAAAA,WACF,CACEkB,QAAS,QACTV,MAAO,OACPL,OAAQ,UACJ9C,GAAc,CAChB,gCAAiC,CAC/BmE,OAASC,GAAUA,EAAMC,QAAQC,MAAMC,WAEzC,kCAAmC,CACjCJ,OAASC,GAAUA,EAAMC,QAAQG,YAAYD,aAInD7C,MAEEC,IAGNc,OAAAgC,EAAAA,SAAA,CAAA1E,SAAA,CACEuC,EAAAA,IAACH,iBACa,YACZpB,GAAI4B,EAAAA,WAAW,CAAEkB,QAAS,QAASa,SAAU,QAAUpD,MACnDC,IAENe,MAACF,EAAkB,CAAA,cACL,iBACZrB,GAAI4B,EAAAA,WAAW,CAAEkB,QAAS,OAAQa,SAAU,QAAUlD,MAClDC,SAMb1B"}
|
|
1
|
+
{"version":3,"file":"Card.js","sources":["../../../../../src/materialui/card/Card.tsx"],"sourcesContent":["import React, { FC, forwardRef } from 'react';\nimport { Paper, Box, CardProps } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { CheckIcon } from '@/src/components/icon/stroke/CheckIcon';\nimport { PlusIcon } from '@/src/components/icon/stroke/PlusIcon';\nimport { MinusIcon } from '@/src/components/icon/stroke/MinusIcon';\nimport { updateFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\nimport { Spinner } from '@/src/components/progress/Spinner';\n\n/**\n * Standard MUI Card extended with custom properties\n */\nexport const FlowCard: FC<CardProps> = forwardRef(\n (\n {\n children,\n isSelected,\n disableIcon = true,\n iconSlots,\n iconPlacement = 'top-end',\n iconProps,\n hoverIconProps,\n iconWrapperProps,\n contentWrapperProps,\n onClick,\n disabled,\n color,\n loading,\n loadingProps,\n ...rest\n },\n ref,\n ) => {\n const { sx: wrapperSx, ...restWrapper } = contentWrapperProps || {};\n const { sx: iconWrapperSx, className: iconWrapperClassName, ...restIconWrapper } = iconWrapperProps || {};\n const { sx: iconSx, ...restIcon } = iconProps || {};\n const { sx: hoverIconSx, ...restHoverIcon } = hoverIconProps || {};\n const { sx: loadingSpinnerSx, ...restLoadingProps } = loadingProps || {};\n const { icon, selectedIcon, hoverIcon, hoverSelectedIcon } = {\n icon: PlusIcon,\n selectedIcon: CheckIcon,\n hoverIcon: PlusIcon,\n hoverSelectedIcon: MinusIcon,\n ...(iconSlots || {}),\n };\n const IconComponent = !disabled && isSelected ? selectedIcon : icon;\n const HoverIconComponent = !disabled && isSelected ? hoverSelectedIcon : hoverIcon;\n const showLoadingSpinner = loading && !disabled;\n\n return (\n <Paper color={color} onClick={disabled ? undefined : onClick} {...rest} ref={ref}>\n <Box\n sx={sxOverride({ borderRadius: 'inherit', overflow: 'hidden', height: '100%' }, wrapperSx)}\n {...restWrapper}\n >\n {!disableIcon && (\n <Box\n sx={sxOverride(\n {\n // circle\n border: 1,\n borderColor: 'onSurface.os100',\n backgroundColor: 'background.primary',\n ...(color === 'secondary' && {\n backgroundColor: 'surface.primary',\n }),\n borderRadius: '1000px',\n p: showLoadingSpinner ? '3px' : '5px',\n // reset IconButton style\n width: 'auto',\n height: 'auto',\n transition: 'none',\n // interactive and selected effect is controlled by card.theme\n // placement\n position: 'absolute',\n ...(iconPlacement.includes('top') ? { top: '16px' } : {}),\n ...(iconPlacement.includes('bottom') ? { bottom: '16px' } : {}),\n ...(iconPlacement.includes('start') ? { left: '16px' } : {}),\n ...(iconPlacement.includes('end') ? { right: '16px' } : {}),\n // Box overwritten to button\n '&.MuiButtonBase-root': {\n ...updateFocusRingStyle(1),\n // remove smooth transition effect to match card behavior\n '&:before': {\n transition: 'none',\n },\n // same style is also applied in card.theme\n ...getInteractiveStyle(\n {\n backgroundColor: 'background.primary',\n ...(color === 'secondary' && {\n backgroundColor: 'surface.primary',\n }),\n ...(isSelected && {\n backgroundColor: 'brand.primary',\n borderColor: 'brand.primary',\n color: 'common.white',\n }),\n ...(showLoadingSpinner &&\n isSelected && {\n backgroundColor: 'brandHover.primary',\n borderColor: 'brandHover.primary',\n }),\n ...(!showLoadingSpinner && {\n '.MuiSvgIcon-root': {\n '&:first-of-type': {\n display: 'block',\n },\n '&:last-of-type': {\n display: 'none',\n },\n },\n }),\n },\n {\n backgroundColor: 'surface.primary',\n ...(color === 'secondary' && {\n backgroundColor: 'surface.secondary',\n }),\n ...(isSelected && {\n backgroundColor: 'brandHover.primary',\n borderColor: 'brandHover.primary',\n color: 'common.white',\n }),\n // flip icon being shown\n ...(!showLoadingSpinner && {\n '.MuiSvgIcon-root': {\n '&:first-of-type': {\n display: 'none',\n },\n '&:last-of-type': {\n display: 'block',\n },\n },\n }),\n },\n ),\n },\n },\n iconWrapperSx,\n )}\n className={['FlowCard-Icon-root', iconWrapperClassName].filter(Boolean).join(' ')}\n {...restIconWrapper}\n >\n {showLoadingSpinner ? (\n <Spinner\n data-testid=\"Card.LoadingSpinner\"\n size={24}\n sx={sxOverride(\n {\n display: 'block',\n width: '24px',\n height: '24px',\n ...(isSelected && {\n '& .FlowSpinner-circle-primary': {\n stroke: (theme) => theme.palette.brand.secondary,\n },\n '& .FlowSpinner-circle-secondary': {\n stroke: (theme) => theme.palette.transparent.secondary,\n },\n }),\n },\n loadingSpinnerSx,\n )}\n {...restLoadingProps}\n />\n ) : (\n <>\n <IconComponent\n data-testid=\"Card.Icon\"\n sx={sxOverride({ display: 'block', fontSize: '20px' }, iconSx)}\n {...restIcon}\n />\n <HoverIconComponent\n data-testid=\"Card.HoverIcon\"\n sx={sxOverride({ display: 'none', fontSize: '20px' }, hoverIconSx)}\n {...restHoverIcon}\n />\n </>\n )}\n </Box>\n )}\n {children}\n </Box>\n </Paper>\n );\n },\n);\n"],"names":["FlowCard","forwardRef","children","isSelected","disableIcon","iconSlots","iconPlacement","iconProps","hoverIconProps","iconWrapperProps","contentWrapperProps","onClick","disabled","color","loading","loadingProps","rest","ref","sx","wrapperSx","restWrapper","iconWrapperSx","className","iconWrapperClassName","restIconWrapper","iconSx","restIcon","hoverIconSx","restHoverIcon","loadingSpinnerSx","restLoadingProps","icon","selectedIcon","hoverIcon","hoverSelectedIcon","PlusIcon","CheckIcon","MinusIcon","IconComponent","HoverIconComponent","showLoadingSpinner","_jsx","Paper","undefined","_jsxs","Box","sxOverride","borderRadius","overflow","height","border","borderColor","backgroundColor","p","width","transition","position","includes","top","bottom","left","right","updateFocusRingStyle","getInteractiveStyle","display","filter","Boolean","join","Spinner","size","stroke","theme","palette","brand","secondary","transparent","_Fragment","fontSize"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var o=require("./Card.js"),r=require("../../components/focusring/focusring.js"),e=require("../button/interactive.js");const a={defaultProps:{elevation:0,component:o.FlowCard},styleOverrides:{root:({theme:o,color:a,disabled:t,isSelected:l,loading:n})=>({backgroundColor:"secondary"===a?o.palette.surface.primary:o.palette.background.primary,position:"relative",borderRadius:"8px",overflow:"visible",border:"1px solid transparent","&::after":{content:'""',position:"absolute",maxWidth:"none",pointerEvents:"none",zIndex:"1",inset:"0",borderRadius:"inherit",boxShadow:`0 0 0 1px ${o.palette.onSurface.os100}`,...!t&&l&&{boxShadow:`0 0 0 3px ${o.palette.brand.primary}`}},...!t&&l&&{"& .FlowCard-Icon-root":{color:o.palette.common.white,backgroundColor:o.palette.brand.primary,borderColor:o.palette.brand.primary,...n&&{backgroundColor:o.palette.brandHover.primary,borderColor:o.palette.brandHover.primary}},"&:hover":{"&::after":{boxShadow:`0 0 0 3px ${o.palette.brandHover.primary}`}}},...!t&&{"&:has(.MuiCardActionArea-root)":{...e.getInteractiveStyle({"&::after":{boxShadow:`0 0 0 1px ${o.palette.onSurface.os100}`,...l&&{boxShadow:`0 0 0 3px ${o.palette.brand.primary}`}},"& .FlowCard-Icon-root":{backgroundColor:o.palette.background.primary,..."secondary"===a&&{backgroundColor:o.palette.surface.primary},...l&&{backgroundColor:o.palette.brand.primary,borderColor:o.palette.brand.primary},...l&&n&&{backgroundColor:o.palette.brandHover.primary,borderColor:o.palette.brandHover.primary}},...!n&&{"& .FlowCard-Icon-root .MuiSvgIcon-root":{"&:first-of-type":{display:"block"},"&:last-of-type":{display:"none"}}}},{"&::after":{boxShadow:`0 0 0 3px ${o.palette.onSurface.os100}`,...l&&{boxShadow:`0 0 0 3px ${o.palette.brandHover.primary}`}},"& .FlowCard-Icon-root":{backgroundColor:o.palette.surface.primary,..."secondary"===a&&{backgroundColor:o.palette.surface.secondary},...l&&{backgroundColor:o.palette.brandHover.primary,borderColor:o.palette.brandHover.primary}},...!n&&{"& .FlowCard-Icon-root .MuiSvgIcon-root":{"&:first-of-type":{display:"none"},"&:last-of-type":{display:"block"}}}},null,null,"&:has(.MuiCardActionArea-root.Mui-focusVisible)")},...r.getFocusRingStyle(o,!1,3,":has(.MuiCardActionArea-root.Mui-focusVisible, .FlowFlippingCardContent-root.Mui-focusVisible)")},...t&&{backgroundColor:o.palette.surface.primary,borderColor:o.palette.disabled.secondary,cursor:"not-allowed",userSelect:"none",pointerEvents:"none","& .FlowCard-Icon-root":{backgroundColor:o.palette.disabled.secondary,color:o.palette.disabled.tertiary},"&, & .MuiTypography-root":{color:o.palette.disabled.tertiary},"& img":{opacity:"0.6"}}})},variants:[{props:{raised:!0},style:({theme:o})=>({boxShadow:o.flowShadows.xs})}]};exports.flowCard=a;
|
|
2
2
|
//# sourceMappingURL=card.theme.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.theme.js","sources":["../../../../../src/materialui/card/card.theme.tsx"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\nimport { FlowCard } from './Card';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport const flowCard: Components<Theme>['MuiCard'] = {\n defaultProps: {\n elevation: 0,\n // we use custom Card component that extends @mui card greatly\n component: FlowCard,\n },\n styleOverrides: {\n root: ({ theme, color, disabled, isSelected, loading }) => ({\n backgroundColor: color === 'secondary' ? theme.palette.surface.primary : theme.palette.background.primary,\n position: 'relative',\n borderRadius: '8px',\n overflow: 'visible',\n // adding standard border and changing its width on hover creates layout shift\n // therefore we use absolute positioned border\n border: '1px solid transparent',\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n maxWidth: 'none',\n
|
|
1
|
+
{"version":3,"file":"card.theme.js","sources":["../../../../../src/materialui/card/card.theme.tsx"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\nimport { FlowCard } from './Card';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport const flowCard: Components<Theme>['MuiCard'] = {\n defaultProps: {\n elevation: 0,\n // we use custom Card component that extends @mui card greatly\n component: FlowCard,\n },\n styleOverrides: {\n root: ({ theme, color, disabled, isSelected, loading }) => ({\n backgroundColor: color === 'secondary' ? theme.palette.surface.primary : theme.palette.background.primary,\n position: 'relative',\n borderRadius: '8px',\n overflow: 'visible',\n // adding standard border and changing its width on hover creates layout shift\n // therefore we use absolute positioned border\n border: '1px solid transparent',\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n maxWidth: 'none',\n pointerEvents: 'none',\n zIndex: '1',\n inset: '0',\n borderRadius: 'inherit',\n // same style is applied for the interactive effect bellow\n // 1px fills the transparent border\n boxShadow: `0 0 0 1px ${theme.palette.onSurface.os100}`,\n // selected\n ...(!disabled &&\n isSelected && {\n // keep 1px inside\n boxShadow: `0 0 0 3px ${theme.palette.brand.primary}`,\n }),\n },\n // selected\n ...(!disabled &&\n isSelected && {\n // change style of icon\n '& .FlowCard-Icon-root': {\n color: theme.palette.common.white,\n backgroundColor: theme.palette.brand.primary,\n borderColor: theme.palette.brand.primary,\n ...(loading && {\n backgroundColor: theme.palette.brandHover.primary,\n borderColor: theme.palette.brandHover.primary,\n }),\n },\n // hover effect that for non-link selected card\n '&:hover': {\n '&::after': {\n boxShadow: `0 0 0 3px ${theme.palette.brandHover.primary}`,\n },\n },\n }),\n // hover effect is applied only if FlowIconButton exists\n ...(!disabled && {\n '&:has(.MuiCardActionArea-root)': {\n ...getInteractiveStyle(\n {\n '&::after': {\n boxShadow: `0 0 0 1px ${theme.palette.onSurface.os100}`,\n // selected\n ...(isSelected && {\n boxShadow: `0 0 0 3px ${theme.palette.brand.primary}`,\n }),\n },\n // same style is also in Card.tsx\n '& .FlowCard-Icon-root': {\n backgroundColor: theme.palette.background.primary,\n ...(color === 'secondary' && {\n backgroundColor: theme.palette.surface.primary,\n }),\n ...(isSelected && {\n backgroundColor: theme.palette.brand.primary,\n borderColor: theme.palette.brand.primary,\n }),\n ...(isSelected &&\n loading && {\n backgroundColor: theme.palette.brandHover.primary,\n borderColor: theme.palette.brandHover.primary,\n }),\n },\n ...(!loading && {\n '& .FlowCard-Icon-root .MuiSvgIcon-root': {\n '&:first-of-type': {\n display: 'block',\n },\n '&:last-of-type': {\n display: 'none',\n },\n },\n }),\n },\n {\n // adjust style of border\n '&::after': {\n boxShadow: `0 0 0 3px ${theme.palette.onSurface.os100}`,\n ...(isSelected && {\n boxShadow: `0 0 0 3px ${theme.palette.brandHover.primary}`,\n }),\n },\n // change style of icon\n '& .FlowCard-Icon-root': {\n backgroundColor: theme.palette.surface.primary,\n ...(color === 'secondary' && {\n backgroundColor: theme.palette.surface.secondary,\n }),\n ...(isSelected && {\n backgroundColor: theme.palette.brandHover.primary,\n borderColor: theme.palette.brandHover.primary,\n }),\n },\n // flip icon being shown\n ...(!loading && {\n '& .FlowCard-Icon-root .MuiSvgIcon-root': {\n '&:first-of-type': {\n display: 'none',\n },\n '&:last-of-type': {\n display: 'block',\n },\n },\n }),\n },\n null,\n null,\n '&:has(.MuiCardActionArea-root.Mui-focusVisible)',\n ),\n },\n ...getFocusRingStyle(\n theme,\n false,\n 3,\n ':has(.MuiCardActionArea-root.Mui-focusVisible, .FlowFlippingCardContent-root.Mui-focusVisible)',\n ),\n }),\n // disabled style\n ...(disabled && {\n backgroundColor: theme.palette.surface.primary,\n borderColor: theme.palette.disabled.secondary,\n cursor: 'not-allowed',\n userSelect: 'none',\n pointerEvents: 'none',\n // change style of icon\n '& .FlowCard-Icon-root': {\n backgroundColor: theme.palette.disabled.secondary,\n color: theme.palette.disabled.tertiary,\n },\n // important selector to overwrite Typography sx color styling\n '&, & .MuiTypography-root': {\n color: theme.palette.disabled.tertiary,\n },\n // change visibility of images\n '& img': {\n opacity: '0.6',\n },\n }),\n }),\n },\n variants: [\n {\n props: { raised: true },\n style: ({ theme }) => ({\n boxShadow: theme.flowShadows['xs'],\n }),\n },\n ],\n};\n"],"names":["flowCard","defaultProps","elevation","component","FlowCard","styleOverrides","root","theme","color","disabled","isSelected","loading","backgroundColor","palette","surface","primary","background","position","borderRadius","overflow","border","content","maxWidth","pointerEvents","zIndex","inset","boxShadow","onSurface","os100","brand","common","white","borderColor","brandHover","getInteractiveStyle","display","secondary","getFocusRingStyle","cursor","userSelect","tertiary","opacity","variants","props","raised","style","flowShadows"],"mappings":"mIAMO,MAAMA,EAAyC,CACpDC,aAAc,CACZC,UAAW,EAEXC,UAAWC,EAAAA,UAEbC,eAAgB,CACdC,KAAM,EAAGC,QAAOC,QAAOC,WAAUC,aAAYC,cAAS,CACpDC,gBAA2B,cAAVJ,EAAwBD,EAAMM,QAAQC,QAAQC,QAAUR,EAAMM,QAAQG,WAAWD,QAClGE,SAAU,WACVC,aAAc,MACdC,SAAU,UAGVC,OAAQ,wBACR,WAAY,CACVC,QAAS,KACTJ,SAAU,WACVK,SAAU,OACVC,cAAe,OACfC,OAAQ,IACRC,MAAO,IACPP,aAAc,UAGdQ,UAAW,aAAanB,EAAMM,QAAQc,UAAUC,YAE3CnB,GACHC,GAAc,CAEZgB,UAAW,aAAanB,EAAMM,QAAQgB,MAAMd,gBAI7CN,GACHC,GAAc,CAEZ,wBAAyB,CACvBF,MAAOD,EAAMM,QAAQiB,OAAOC,MAC5BnB,gBAAiBL,EAAMM,QAAQgB,MAAMd,QACrCiB,YAAazB,EAAMM,QAAQgB,MAAMd,WAC7BJ,GAAW,CACbC,gBAAiBL,EAAMM,QAAQoB,WAAWlB,QAC1CiB,YAAazB,EAAMM,QAAQoB,WAAWlB,UAI1C,UAAW,CACT,WAAY,CACVW,UAAW,aAAanB,EAAMM,QAAQoB,WAAWlB,iBAKpDN,GAAY,CACf,iCAAkC,IAC7ByB,sBACD,CACE,WAAY,CACVR,UAAW,aAAanB,EAAMM,QAAQc,UAAUC,WAE5ClB,GAAc,CAChBgB,UAAW,aAAanB,EAAMM,QAAQgB,MAAMd,YAIhD,wBAAyB,CACvBH,gBAAiBL,EAAMM,QAAQG,WAAWD,WAC5B,cAAVP,GAAyB,CAC3BI,gBAAiBL,EAAMM,QAAQC,QAAQC,YAErCL,GAAc,CAChBE,gBAAiBL,EAAMM,QAAQgB,MAAMd,QACrCiB,YAAazB,EAAMM,QAAQgB,MAAMd,YAE/BL,GACFC,GAAW,CACTC,gBAAiBL,EAAMM,QAAQoB,WAAWlB,QAC1CiB,YAAazB,EAAMM,QAAQoB,WAAWlB,cAGvCJ,GAAW,CACd,yCAA0C,CACxC,kBAAmB,CACjBwB,QAAS,SAEX,iBAAkB,CAChBA,QAAS,WAKjB,CAEE,WAAY,CACVT,UAAW,aAAanB,EAAMM,QAAQc,UAAUC,WAC5ClB,GAAc,CAChBgB,UAAW,aAAanB,EAAMM,QAAQoB,WAAWlB,YAIrD,wBAAyB,CACvBH,gBAAiBL,EAAMM,QAAQC,QAAQC,WACzB,cAAVP,GAAyB,CAC3BI,gBAAiBL,EAAMM,QAAQC,QAAQsB,cAErC1B,GAAc,CAChBE,gBAAiBL,EAAMM,QAAQoB,WAAWlB,QAC1CiB,YAAazB,EAAMM,QAAQoB,WAAWlB,cAIrCJ,GAAW,CACd,yCAA0C,CACxC,kBAAmB,CACjBwB,QAAS,QAEX,iBAAkB,CAChBA,QAAS,YAKjB,KACA,KACA,uDAGDE,EAAAA,kBACD9B,GACA,EACA,EACA,sGAIAE,GAAY,CACdG,gBAAiBL,EAAMM,QAAQC,QAAQC,QACvCiB,YAAazB,EAAMM,QAAQJ,SAAS2B,UACpCE,OAAQ,cACRC,WAAY,OACZhB,cAAe,OAEf,wBAAyB,CACvBX,gBAAiBL,EAAMM,QAAQJ,SAAS2B,UACxC5B,MAAOD,EAAMM,QAAQJ,SAAS+B,UAGhC,2BAA4B,CAC1BhC,MAAOD,EAAMM,QAAQJ,SAAS+B,UAGhC,QAAS,CACPC,QAAS,WAKjBC,SAAU,CACR,CACEC,MAAO,CAAEC,QAAQ,GACjBC,MAAO,EAAGtC,YAAO,CACfmB,UAAWnB,EAAMuC,YAAgB"}
|