@skodaflow/web-library 8.3.0 → 8.3.2
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.d.ts +15 -0
- package/cjs/components/advancedTable/agGrid.js +1 -1
- package/cjs/components/advancedTable/agGrid.js.map +1 -1
- package/cjs/components/advancedTable/agGridIcons.d.ts +8 -2
- package/cjs/components/advancedTable/agGridIcons.js +1 -1
- package/cjs/components/advancedTable/agGridIcons.js.map +1 -1
- package/cjs/components/bottomSheet/BottomSheet.d.ts +3 -0
- package/cjs/components/bottomSheet/BottomSheet.js.map +1 -1
- package/cjs/components/carousel/Autoplay.d.ts +4 -4
- package/cjs/components/carousel/Navigation.d.ts +2 -2
- package/cjs/components/carousel/Navigation.js +1 -1
- package/cjs/components/carousel/Navigation.js.map +1 -1
- package/cjs/components/code/Code.d.ts +8 -0
- package/cjs/components/code/Code.js +2 -0
- package/cjs/components/code/Code.js.map +1 -0
- package/cjs/components/code/index.d.ts +1 -0
- package/cjs/components/errorContent/ErrorContent.js +1 -1
- package/cjs/components/errorContent/ErrorContent.js.map +1 -1
- package/cjs/components/footer/FooterIconButton.d.ts +1 -1
- package/cjs/components/footer/FooterIconButton.js.map +1 -1
- package/cjs/components/footer/FooterMenu.js +1 -1
- package/cjs/components/footer/FooterMenu.js.map +1 -1
- package/cjs/components/footer/FooterMenuCollapse.d.ts +25 -0
- package/cjs/components/footer/FooterMenuCollapse.js +2 -0
- package/cjs/components/footer/FooterMenuCollapse.js.map +1 -0
- package/cjs/components/header/Header.d.ts +16 -2
- package/cjs/components/header/Header.js +1 -1
- package/cjs/components/header/Header.js.map +1 -1
- package/cjs/components/header/HeaderButton.d.ts +1 -0
- package/cjs/components/header/HeaderButton.js +1 -1
- package/cjs/components/header/HeaderButton.js.map +1 -1
- package/cjs/components/header/HeaderContext.d.ts +22 -0
- package/cjs/components/header/HeaderContext.js +2 -0
- package/cjs/components/header/HeaderContext.js.map +1 -0
- package/cjs/components/header/HeaderLanguageSelect.js.map +1 -1
- package/cjs/components/header/HeaderLogo.d.ts +1 -1
- package/cjs/components/header/HeaderLogo.js +1 -1
- package/cjs/components/header/HeaderLogo.js.map +1 -1
- package/cjs/components/header/HeaderNavigationHero.d.ts +1 -1
- package/cjs/components/header/HeaderNavigationHero.js +1 -1
- package/cjs/components/header/HeaderNavigationHero.js.map +1 -1
- package/cjs/components/header/HeaderNavigationLink.d.ts +1 -0
- package/cjs/components/header/HeaderNavigationLink.js +1 -1
- package/cjs/components/header/HeaderNavigationLink.js.map +1 -1
- package/cjs/components/header/HeaderNavigationMenu.js +1 -1
- package/cjs/components/header/HeaderNavigationMenu.js.map +1 -1
- package/cjs/components/header/index.d.ts +1 -0
- package/cjs/components/index.d.ts +1 -0
- package/cjs/components/label/Label.js +1 -1
- package/cjs/components/label/Label.js.map +1 -1
- package/cjs/components/notification/NotificationCenterHeaderButton.d.ts +1 -1
- package/cjs/components/playPauseButton/PlayPauseButton.d.ts +1 -1
- package/cjs/components/promptBar/PromptAttachments.js +1 -1
- package/cjs/components/promptBar/PromptAttachments.js.map +1 -1
- package/cjs/components/promptBar/PromptSubmitIconButton.d.ts +1 -1
- package/cjs/components/promptBar/PromptSubmitIconButton.js +1 -1
- package/cjs/components/promptBar/PromptSubmitIconButton.js.map +1 -1
- package/cjs/components/quickLink/QuickLink.js +1 -1
- package/cjs/components/quickLink/QuickLink.js.map +1 -1
- package/cjs/components/search/Search.js +1 -1
- package/cjs/components/search/Search.js.map +1 -1
- package/cjs/components/secondaryNavigation/SecondaryNavigationCta.js +1 -1
- package/cjs/components/secondaryNavigation/SecondaryNavigationCta.js.map +1 -1
- package/cjs/components/skodaThemeProvider/SkodaThemeProvider.js +1 -1
- package/cjs/components/skodaThemeProvider/SkodaThemeProvider.js.map +1 -1
- package/cjs/components/skodaThemeProvider/plugins/stylisContainerPlugin.d.ts +1 -2
- package/cjs/components/skodaThemeProvider/plugins/stylisContainerPlugin.js +1 -1
- package/cjs/components/skodaThemeProvider/plugins/stylisContainerPlugin.js.map +1 -1
- package/cjs/components/textAndCta/AppStoreButton.js +1 -1
- package/cjs/components/textAndCta/AppStoreButton.js.map +1 -1
- package/cjs/components/textAndCta/TextAndCta.d.ts +1 -1
- package/cjs/components/tooltipHeader/TooltipHeader.d.ts +2 -1
- package/cjs/components/upload/Upload.d.ts +1 -1
- package/cjs/components/upload/components/uploadList/UploadListItem.d.ts +1 -1
- package/cjs/components/upload/components/uploadPreview/UploadPreviewImage.d.ts +1 -1
- package/cjs/components/upload/components/uploadWrapper/UploadContent.d.ts +2 -2
- package/cjs/components/upload/components/uploadWrapper/UploadWrapper.d.ts +1 -1
- package/cjs/index.js +1 -1
- package/cjs/materialui/autocomplete/autocomplete.theme.js +1 -1
- package/cjs/materialui/autocomplete/autocomplete.theme.js.map +1 -1
- package/cjs/materialui/badge/badge.theme.js +1 -1
- package/cjs/materialui/badge/badge.theme.js.map +1 -1
- package/cjs/materialui/button/button.theme.js.map +1 -1
- package/cjs/materialui/button/buttonBase.theme.js +1 -1
- package/cjs/materialui/button/buttonBase.theme.js.map +1 -1
- package/cjs/materialui/dialog/DialogTitle.js +1 -1
- package/cjs/materialui/dialog/DialogTitle.js.map +1 -1
- package/cjs/materialui/slider/SliderValues.d.ts +5 -0
- package/cjs/materialui/slider/SliderValues.js +1 -1
- package/cjs/materialui/slider/SliderValues.js.map +1 -1
- package/cjs/materialui/stepper/StepLabelIcon.d.ts +1 -1
- package/cjs/materialui/stepper/StepLabelIcon.js +1 -1
- package/cjs/materialui/stepper/StepLabelIcon.js.map +1 -1
- package/cjs/materialui/table/stories/actions.d.ts +1 -1
- package/cjs/materialui/table/stories/basic.d.ts +1 -1
- package/cjs/materialui/table/stories/interactive.d.ts +1 -1
- package/cjs/materialui/table/stories/pagination.d.ts +3 -3
- package/cjs/materialui/table/stories/scrollbar.d.ts +1 -1
- package/cjs/materialui/table/stories/selectSort.d.ts +1 -1
- package/cjs/materialui/table/stories/small.d.ts +1 -1
- package/cjs/materialui/table/tablePagination.theme.js +1 -1
- package/cjs/materialui/table/tablePagination.theme.js.map +1 -1
- package/cjs/materialui/tabs/TabPanel.d.ts +2 -2
- package/cjs/materialui/tabs/TabsScrollButton.d.ts +1 -1
- package/cjs/materialui/tabs/tabs.theme.js +1 -1
- package/cjs/materialui/tabs/tabs.theme.js.map +1 -1
- package/cjs/materialui/textfield/inputBase.theme.js +1 -1
- package/cjs/materialui/textfield/inputBase.theme.js.map +1 -1
- package/cjs/materialui/textfield/inputLabel.theme.js +1 -1
- package/cjs/materialui/textfield/inputLabel.theme.js.map +1 -1
- package/cjs/materialui/theme/theme.extensions.d.ts +1 -1
- package/cjs/materialui/themeProvider/baseline.theme.js +1 -1
- package/cjs/materialui/themeProvider/baseline.theme.js.map +1 -1
- package/components/advancedTable/agGrid.d.ts +15 -0
- package/components/advancedTable/agGrid.js +1 -1
- package/components/advancedTable/agGrid.js.map +1 -1
- package/components/advancedTable/agGridIcons.d.ts +8 -2
- package/components/advancedTable/agGridIcons.js +1 -1
- package/components/advancedTable/agGridIcons.js.map +1 -1
- package/components/bottomSheet/BottomSheet.d.ts +3 -0
- package/components/bottomSheet/BottomSheet.js.map +1 -1
- package/components/carousel/Autoplay.d.ts +4 -4
- package/components/carousel/Navigation.d.ts +2 -2
- package/components/carousel/Navigation.js +1 -1
- package/components/carousel/Navigation.js.map +1 -1
- package/components/code/Code.d.ts +8 -0
- package/components/code/Code.js +2 -0
- package/components/code/Code.js.map +1 -0
- package/components/code/index.d.ts +1 -0
- package/components/errorContent/ErrorContent.js +1 -1
- package/components/errorContent/ErrorContent.js.map +1 -1
- package/components/footer/FooterIconButton.d.ts +1 -1
- package/components/footer/FooterIconButton.js.map +1 -1
- package/components/footer/FooterMenu.js +1 -1
- package/components/footer/FooterMenu.js.map +1 -1
- package/components/footer/FooterMenuCollapse.d.ts +25 -0
- package/components/footer/FooterMenuCollapse.js +2 -0
- package/components/footer/FooterMenuCollapse.js.map +1 -0
- package/components/header/Header.d.ts +16 -2
- package/components/header/Header.js +1 -1
- package/components/header/Header.js.map +1 -1
- package/components/header/HeaderButton.d.ts +1 -0
- package/components/header/HeaderButton.js +1 -1
- package/components/header/HeaderButton.js.map +1 -1
- package/components/header/HeaderContext.d.ts +22 -0
- package/components/header/HeaderContext.js +2 -0
- package/components/header/HeaderContext.js.map +1 -0
- package/components/header/HeaderLanguageSelect.js.map +1 -1
- package/components/header/HeaderLogo.d.ts +1 -1
- package/components/header/HeaderLogo.js +1 -1
- package/components/header/HeaderLogo.js.map +1 -1
- package/components/header/HeaderNavigationHero.d.ts +1 -1
- package/components/header/HeaderNavigationHero.js +1 -1
- package/components/header/HeaderNavigationHero.js.map +1 -1
- package/components/header/HeaderNavigationLink.d.ts +1 -0
- package/components/header/HeaderNavigationLink.js +1 -1
- package/components/header/HeaderNavigationLink.js.map +1 -1
- package/components/header/HeaderNavigationMenu.js +1 -1
- package/components/header/HeaderNavigationMenu.js.map +1 -1
- package/components/header/index.d.ts +1 -0
- package/components/index.d.ts +1 -0
- package/components/label/Label.js +1 -1
- package/components/label/Label.js.map +1 -1
- package/components/notification/NotificationCenterHeaderButton.d.ts +1 -1
- package/components/playPauseButton/PlayPauseButton.d.ts +1 -1
- package/components/promptBar/PromptAttachments.js +1 -1
- package/components/promptBar/PromptAttachments.js.map +1 -1
- package/components/promptBar/PromptSubmitIconButton.d.ts +1 -1
- package/components/promptBar/PromptSubmitIconButton.js +1 -1
- package/components/promptBar/PromptSubmitIconButton.js.map +1 -1
- package/components/quickLink/QuickLink.js +1 -1
- package/components/quickLink/QuickLink.js.map +1 -1
- package/components/search/Search.js +1 -1
- package/components/search/Search.js.map +1 -1
- package/components/secondaryNavigation/SecondaryNavigationCta.js +1 -1
- package/components/secondaryNavigation/SecondaryNavigationCta.js.map +1 -1
- package/components/skodaThemeProvider/SkodaThemeProvider.js +1 -1
- package/components/skodaThemeProvider/SkodaThemeProvider.js.map +1 -1
- package/components/skodaThemeProvider/plugins/stylisContainerPlugin.d.ts +1 -2
- package/components/skodaThemeProvider/plugins/stylisContainerPlugin.js +1 -1
- package/components/skodaThemeProvider/plugins/stylisContainerPlugin.js.map +1 -1
- package/components/textAndCta/AppStoreButton.js +1 -1
- package/components/textAndCta/AppStoreButton.js.map +1 -1
- package/components/textAndCta/TextAndCta.d.ts +1 -1
- package/components/tooltipHeader/TooltipHeader.d.ts +2 -1
- package/components/upload/Upload.d.ts +1 -1
- package/components/upload/components/uploadList/UploadListItem.d.ts +1 -1
- package/components/upload/components/uploadPreview/UploadPreviewImage.d.ts +1 -1
- package/components/upload/components/uploadWrapper/UploadContent.d.ts +2 -2
- package/components/upload/components/uploadWrapper/UploadWrapper.d.ts +1 -1
- package/index.js +1 -1
- package/materialui/autocomplete/autocomplete.theme.js +1 -1
- package/materialui/autocomplete/autocomplete.theme.js.map +1 -1
- package/materialui/badge/badge.theme.js +1 -1
- package/materialui/badge/badge.theme.js.map +1 -1
- package/materialui/button/button.theme.js.map +1 -1
- package/materialui/button/buttonBase.theme.js +1 -1
- package/materialui/button/buttonBase.theme.js.map +1 -1
- package/materialui/dialog/DialogTitle.js +1 -1
- package/materialui/dialog/DialogTitle.js.map +1 -1
- package/materialui/slider/SliderValues.d.ts +5 -0
- package/materialui/slider/SliderValues.js +1 -1
- package/materialui/slider/SliderValues.js.map +1 -1
- package/materialui/stepper/StepLabelIcon.d.ts +1 -1
- package/materialui/stepper/StepLabelIcon.js +1 -1
- package/materialui/stepper/StepLabelIcon.js.map +1 -1
- package/materialui/table/stories/actions.d.ts +1 -1
- package/materialui/table/stories/basic.d.ts +1 -1
- package/materialui/table/stories/interactive.d.ts +1 -1
- package/materialui/table/stories/pagination.d.ts +3 -3
- package/materialui/table/stories/scrollbar.d.ts +1 -1
- package/materialui/table/stories/selectSort.d.ts +1 -1
- package/materialui/table/stories/small.d.ts +1 -1
- package/materialui/table/tablePagination.theme.js +1 -1
- package/materialui/table/tablePagination.theme.js.map +1 -1
- package/materialui/tabs/TabPanel.d.ts +2 -2
- package/materialui/tabs/TabsScrollButton.d.ts +1 -1
- package/materialui/tabs/tabs.theme.js +1 -1
- package/materialui/tabs/tabs.theme.js.map +1 -1
- package/materialui/textfield/inputBase.theme.js +1 -1
- package/materialui/textfield/inputBase.theme.js.map +1 -1
- package/materialui/textfield/inputLabel.theme.js +1 -1
- package/materialui/textfield/inputLabel.theme.js.map +1 -1
- package/materialui/theme/theme.extensions.d.ts +1 -1
- package/materialui/themeProvider/baseline.theme.js +1 -1
- package/materialui/themeProvider/baseline.theme.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as e,jsxs as
|
|
1
|
+
import{jsx as e,jsxs as t}from"react/jsx-runtime";import{MenuList as n,MenuItem as o,Checkbox as i,ListItemText as p}from"@mui/material";import{ChevronDownIcon as r}from"../../components/icon/stroke/ChevronDownIcon.js";import{CloseIcon as a}from"../../components/icon/stroke/CloseIcon.js";import{flowMenu as u}from"../menu/menu.theme.js";import{flowMenuItem as l}from"../menu/menuItem.theme.js";import{getInteractiveStyle as s}from"../button/interactive.js";const d={defaultProps:{onPointerDown:e=>{const t=e.currentTarget.querySelector(".MuiFormControl-root");t&&!t.contains(e.target)&&t.dispatchEvent(new PointerEvent("pointerdown",{bubbles:!0,cancelable:!0,pointerType:e.pointerType}))},popupIcon:e(r,{}),clearIcon:e(a,{}),noOptionsText:"No matching results",slots:{listbox:n},slotProps:{chip:{onClick:e=>{e.currentTarget.querySelector(".MuiChip-deleteIcon")?.dispatchEvent(new MouseEvent("click",{bubbles:!0}))}}},renderOption:({key:n,...r},a,u,l)=>t(o,{...r,children:[l?.multiple&&e(i,{checked:u.selected,tabIndex:-1}),e(p,{children:l.getOptionLabel(a)})]},n)},styleOverrides:{root:({theme:e})=>({"& .MuiAutocomplete-tag + .MuiAutocomplete-input":{"&::-webkit-input-placeholder":{color:"transparent"}},"& .MuiFilledInput-root":{gap:e.spacing(.5),padding:"24px 12px 8px","&.MuiInputBase-hiddenLabel":{padding:"18px 12px 14px"},"&.MuiInputBase-sizeSmall":{padding:"22px 12px 4px","&.MuiInputBase-hiddenLabel":{padding:"14px 12px 12px"}},"&, &.MuiInputBase-sizeSmall, &.MuiInputBase-hiddenLabel, &.MuiInputBase-sizeSmall.MuiInputBase-hiddenLabel":{"& .MuiFilledInput-input":{padding:"0"}}},"& .MuiOutlinedInput-root":{gap:e.spacing(.5),padding:"16.5px 14px","&.MuiInputBase-sizeSmall":{padding:"8.5px 14px"},"&, &.MuiInputBase-sizeSmall":{"& .MuiOutlinedInput-input":{padding:"0"}}},"& .MuiInput-root":{gap:e.spacing(.5),padding:"4px 0 5px","&.MuiInputBase-sizeSmall":{padding:"1px 0 5px"},"&, &.MuiInputBase-sizeSmall":{"& .MuiInput-input":{padding:"0"}}}}),popupIndicator:{transition:"none",...s({color:"inherit",backgroundColor:"transparent"},{color:"inherit",backgroundColor:"transparent"}),"& .MuiSvgIcon-root":{fontSize:"17px",flexShrink:"0"}},clearIndicator:{visibility:"visible",transition:"none",...s({color:"inherit",backgroundColor:"transparent"},{color:"inherit",backgroundColor:"transparent"}),"& .MuiSvgIcon-root":{fontSize:"17px",flexShrink:"0"},"& + .MuiAutocomplete-popupIndicator":{display:"none"}},tag:{margin:"0","&.MuiChip-root":{border:"none",color:"inherit",padding:"0","&, &:hover, &.Mui-focusVisible, &:active":{backgroundColor:"transparent"},fontSize:"inherit",lineHeight:"inherit","& .MuiChip-label":{padding:"0"},"& .MuiChip-deleteIcon":{display:"none"},"&:has(~ .MuiAutocomplete-tag):after":{content:'","'},"&:not(:has(.MuiChip-deleteIcon))":{cursor:"auto"}}},popper:{"& .MuiAutocomplete-listbox":{padding:"0",maxHeight:"240px",overflow:"auto"}},paper:u.styleOverrides.paper,option:l.styleOverrides.root,noOptions:[l.styleOverrides.root,{pointerEvents:"none",cursor:"auto"}]}};export{d as flowAutocomplete};
|
|
2
2
|
//# sourceMappingURL=autocomplete.theme.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"autocomplete.theme.js","sources":["../../../src/materialui/autocomplete/autocomplete.theme.tsx"],"sourcesContent":["import { Components, Theme, ComponentsOverrides } from '@mui/material/styles';\nimport {
|
|
1
|
+
{"version":3,"file":"autocomplete.theme.js","sources":["../../../src/materialui/autocomplete/autocomplete.theme.tsx"],"sourcesContent":["import { Components, Theme, ComponentsOverrides } from '@mui/material/styles';\nimport { MenuList, MenuItem, ListItemText, Checkbox } from '@mui/material';\nimport { ChevronDownIcon } from '@/src/components/icon/stroke/ChevronDownIcon';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\nimport { flowMenu } from '../menu/menu.theme';\nimport { flowMenuItem } from '../menu/menuItem.theme';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport const flowAutocomplete: Components<Theme>['MuiAutocomplete'] = {\n defaultProps: {\n // ensure clicking on AutoComplete sent event to FormControl to correctly handle FocusRing\n onPointerDown: (e) => {\n const formControlEl = e.currentTarget.querySelector('.MuiFormControl-root');\n // we have formControl, and click is outside it (clicking on margin from helperText)\n if (formControlEl && !formControlEl.contains(e.target as Node)) {\n // sent pointerDown event to it\n formControlEl.dispatchEvent(\n new PointerEvent('pointerdown', {\n bubbles: true,\n cancelable: true,\n pointerType: e.pointerType,\n }),\n );\n }\n },\n popupIcon: <ChevronDownIcon />,\n clearIcon: <CloseIcon />,\n noOptionsText: 'No matching results',\n slots: {\n // we are replacing listbox to remove Autocomplete styling and match with Menu design\n listbox: MenuList,\n },\n slotProps: {\n chip: {\n // whole value removes itself with click, as its delete icon is hidden by the tag styling\n onClick: (e) => {\n // delete icon is an svg element without click(), dispatch the event manually\n e.currentTarget\n .querySelector('.MuiChip-deleteIcon')\n ?.dispatchEvent(new MouseEvent('click', { bubbles: true }));\n },\n },\n },\n // option matched with design of menu with Checkbox for multiple choices\n renderOption: ({ key, ...rest }, option, state, ownerState) => {\n return (\n <MenuItem key={key} {...rest}>\n {ownerState?.multiple && <Checkbox checked={state.selected} tabIndex={-1} />}\n <ListItemText>{ownerState.getOptionLabel(option)}</ListItemText>\n </MenuItem>\n );\n },\n },\n styleOverrides: {\n root: ({ theme }) => ({\n // when value is present\n '& .MuiAutocomplete-tag + .MuiAutocomplete-input': {\n // hide placeholder\n '&::-webkit-input-placeholder': {\n color: 'transparent',\n },\n },\n // overwrite autoComplete default styling and match with TextField\n '& .MuiFilledInput-root': {\n // gap between tags and input\n gap: theme.spacing(0.5),\n // field proportions matched with textfield\n padding: '24px 12px 8px',\n // hidden label for variant with placeholder\n '&.MuiInputBase-hiddenLabel': {\n padding: '18px 12px 14px',\n },\n // small\n '&.MuiInputBase-sizeSmall': {\n padding: '22px 12px 4px',\n '&.MuiInputBase-hiddenLabel': {\n padding: '14px 12px 12px',\n },\n },\n // moved padding from input to allow wrap with too many tags\n '&, &.MuiInputBase-sizeSmall, &.MuiInputBase-hiddenLabel, &.MuiInputBase-sizeSmall.MuiInputBase-hiddenLabel': {\n '& .MuiFilledInput-input': {\n padding: '0',\n },\n },\n },\n '& .MuiOutlinedInput-root': {\n // gap between tags and input\n gap: theme.spacing(0.5),\n // field proportions matched with textfield\n padding: '16.5px 14px',\n // small\n '&.MuiInputBase-sizeSmall': {\n padding: '8.5px 14px',\n },\n // moved padding from input to allow wrap with too many tags\n '&, &.MuiInputBase-sizeSmall': {\n '& .MuiOutlinedInput-input': {\n padding: '0',\n },\n },\n },\n '& .MuiInput-root': {\n // gap between tags and input\n gap: theme.spacing(0.5),\n // field proportions matched with textfield\n padding: '4px 0 5px',\n // small\n '&.MuiInputBase-sizeSmall': {\n padding: '1px 0 5px',\n },\n // moved padding from input to allow wrap with too many tags\n '&, &.MuiInputBase-sizeSmall': {\n '& .MuiInput-input': {\n padding: '0',\n },\n },\n },\n }),\n // select arrow\n popupIndicator: {\n // remove default style\n transition: 'none',\n ...getInteractiveStyle(\n { color: 'inherit', backgroundColor: 'transparent' },\n { color: 'inherit', backgroundColor: 'transparent' },\n ),\n // style icon\n '& .MuiSvgIcon-root': {\n fontSize: '17px',\n flexShrink: '0',\n },\n },\n // 'x' clear button\n clearIndicator: {\n // keep always visible once the value is selected\n visibility: 'visible',\n // remove default style\n transition: 'none',\n ...getInteractiveStyle(\n { color: 'inherit', backgroundColor: 'transparent' },\n { color: 'inherit', backgroundColor: 'transparent' },\n ),\n // style icon\n '& .MuiSvgIcon-root': {\n fontSize: '17px',\n flexShrink: '0',\n },\n // select arrow next to it\n '& + .MuiAutocomplete-popupIndicator': {\n // hide it\n display: 'none',\n },\n },\n // chip tags styled as plain comma-separated text to match Flow design,\n tag: {\n margin: '0',\n // higher specificity\n '&.MuiChip-root': {\n // remove chip style\n border: 'none',\n color: 'inherit',\n padding: '0',\n '&, &:hover, &.Mui-focusVisible, &:active': {\n backgroundColor: 'transparent',\n },\n // match input typography\n fontSize: 'inherit',\n lineHeight: 'inherit',\n '& .MuiChip-label': {\n padding: '0',\n },\n // hide delete icon as we use whole click\n '& .MuiChip-deleteIcon': {\n display: 'none',\n },\n // comma separator between values\n '&:has(~ .MuiAutocomplete-tag):after': {\n content: '\",\"',\n },\n // read-only values cannot be removed with click\n '&:not(:has(.MuiChip-deleteIcon))': {\n cursor: 'auto',\n },\n },\n },\n // select popover\n popper: {\n // direct style of listBox is not used, as it is overwritten via slots property to remove default styling\n '& .MuiAutocomplete-listbox': {\n padding: '0',\n maxHeight: '240px',\n // necessary to make scroll with keyboard navigation work\n overflow: 'auto',\n },\n },\n // holder of list\n paper: flowMenu.styleOverrides.paper as ComponentsOverrides<Theme>['MuiAutocomplete'],\n // list options\n option: flowMenuItem.styleOverrides.root as ComponentsOverrides<Theme>['MuiAutocomplete'],\n // no matching result\n noOptions: [\n flowMenuItem.styleOverrides.root as ComponentsOverrides<Theme>['MuiAutocomplete'],\n {\n pointerEvents: 'none',\n cursor: 'auto',\n },\n ],\n },\n};\n"],"names":["flowAutocomplete","defaultProps","onPointerDown","e","formControlEl","currentTarget","querySelector","contains","target","dispatchEvent","PointerEvent","bubbles","cancelable","pointerType","popupIcon","_jsx","ChevronDownIcon","clearIcon","CloseIcon","noOptionsText","slots","listbox","MenuList","slotProps","chip","onClick","MouseEvent","renderOption","key","rest","option","state","ownerState","_jsxs","MenuItem","multiple","Checkbox","checked","selected","tabIndex","ListItemText","getOptionLabel","styleOverrides","root","theme","color","gap","spacing","padding","popupIndicator","transition","getInteractiveStyle","backgroundColor","fontSize","flexShrink","clearIndicator","visibility","display","tag","margin","border","lineHeight","content","cursor","popper","maxHeight","overflow","paper","flowMenu","flowMenuItem","noOptions","pointerEvents"],"mappings":"0cAQO,MAAMA,EAAyD,CACpEC,aAAc,CAEZC,cAAgBC,IACd,MAAMC,EAAgBD,EAAEE,cAAcC,cAAc,wBAEhDF,IAAkBA,EAAcG,SAASJ,EAAEK,SAE7CJ,EAAcK,cACZ,IAAIC,aAAa,cAAe,CAC9BC,SAAS,EACTC,YAAY,EACZC,YAAaV,EAAEU,gBAKvBC,UAAWC,EAACC,EAAe,IAC3BC,UAAWF,EAACG,EAAS,IACrBC,cAAe,sBACfC,MAAO,CAELC,QAASC,GAEXC,UAAW,CACTC,KAAM,CAEJC,QAAUtB,IAERA,EAAEE,cACCC,cAAc,wBACbG,cAAc,IAAIiB,WAAW,QAAS,CAAEf,SAAS,QAK3DgB,aAAc,EAAGC,SAAQC,GAAQC,EAAQC,EAAOC,IAE5CC,EAACC,EAAQ,IAAeL,YACrBG,GAAYG,UAAYpB,EAACqB,EAAQ,CAACC,QAASN,EAAMO,SAAUC,UAAU,IACtExB,EAACyB,YAAcR,EAAWS,eAAeX,OAF5BF,IAOrBc,eAAgB,CACdC,KAAM,EAAGC,YAAO,CAEd,kDAAmD,CAEjD,+BAAgC,CAC9BC,MAAO,gBAIX,yBAA0B,CAExBC,IAAKF,EAAMG,QAAQ,IAEnBC,QAAS,gBAET,6BAA8B,CAC5BA,QAAS,kBAGX,2BAA4B,CAC1BA,QAAS,gBACT,6BAA8B,CAC5BA,QAAS,mBAIb,6GAA8G,CAC5G,0BAA2B,CACzBA,QAAS,OAIf,2BAA4B,CAE1BF,IAAKF,EAAMG,QAAQ,IAEnBC,QAAS,cAET,2BAA4B,CAC1BA,QAAS,cAGX,8BAA+B,CAC7B,4BAA6B,CAC3BA,QAAS,OAIf,mBAAoB,CAElBF,IAAKF,EAAMG,QAAQ,IAEnBC,QAAS,YAET,2BAA4B,CAC1BA,QAAS,aAGX,8BAA+B,CAC7B,oBAAqB,CACnBA,QAAS,SAMjBC,eAAgB,CAEdC,WAAY,UACTC,EACD,CAAEN,MAAO,UAAWO,gBAAiB,eACrC,CAAEP,MAAO,UAAWO,gBAAiB,gBAGvC,qBAAsB,CACpBC,SAAU,OACVC,WAAY,MAIhBC,eAAgB,CAEdC,WAAY,UAEZN,WAAY,UACTC,EACD,CAAEN,MAAO,UAAWO,gBAAiB,eACrC,CAAEP,MAAO,UAAWO,gBAAiB,gBAGvC,qBAAsB,CACpBC,SAAU,OACVC,WAAY,KAGd,sCAAuC,CAErCG,QAAS,SAIbC,IAAK,CACHC,OAAQ,IAER,iBAAkB,CAEhBC,OAAQ,OACRf,MAAO,UACPG,QAAS,IACT,2CAA4C,CAC1CI,gBAAiB,eAGnBC,SAAU,UACVQ,WAAY,UACZ,mBAAoB,CAClBb,QAAS,KAGX,wBAAyB,CACvBS,QAAS,QAGX,sCAAuC,CACrCK,QAAS,OAGX,mCAAoC,CAClCC,OAAQ,UAKdC,OAAQ,CAEN,6BAA8B,CAC5BhB,QAAS,IACTiB,UAAW,QAEXC,SAAU,SAIdC,MAAOC,EAAS1B,eAAeyB,MAE/BrC,OAAQuC,EAAa3B,eAAeC,KAEpC2B,UAAW,CACTD,EAAa3B,eAAeC,KAC5B,CACE4B,cAAe,OACfR,OAAQ"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const t="-2px",
|
|
1
|
+
const t="-2px",i={defaultProps:{color:"error",slotProps:{root:{"aria-label":null},badge:({invisible:t,...i})=>({...t?{"aria-hidden":!0}:{"aria-live":"polite","aria-atomic":!0},...i["aria-label"]&&{"aria-label":i["aria-label"]}})}},styleOverrides:{standard:{height:"16px",minWidth:"16px",fontSize:"10px",lineHeight:"10px",letterSpacing:"0.02em",fontWeight:"700",borderRadius:"20px",padding:"0 4px"},dot:{height:"12px",width:"12px",borderRadius:"50%"},anchorOriginTopRightRectangular:{top:t,right:t},anchorOriginTopLeftRectangular:{top:t,left:t},anchorOriginBottomRightRectangular:{bottom:t,right:t},anchorOriginBottomLeftRectangular:{bottom:t,left:t}}};export{i as flowBadge};
|
|
2
2
|
//# sourceMappingURL=badge.theme.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"badge.theme.js","sources":["../../../src/materialui/badge/badge.theme.ts"],"sourcesContent":["import { Components, Theme } from '@mui/material/styles';\n\n// 0px is default from @mui\nconst distance = '-2px';\n\nexport const flowBadge: Components<Theme>['MuiBadge'] = {\n defaultProps: {\n color: 'error',\n slotProps: {\n root: {\n // disable aria-label, we place it on the badge instead\n ['aria-label']: null,\n },\n badge: ({ invisible, ...rest }) => ({\n ...(invisible\n ? {\n ['aria-hidden']: true,\n }\n : {\n ['aria-live']: 'polite',\n ['aria-atomic']: true,\n }),\n // pass aria-label to badge from parent\n ...(rest['aria-label'] && {\n ['aria-label']: rest['aria-label'],\n }),\n }),\n },\n },\n styleOverrides: {\n standard: {\n height: '16px',\n minWidth: '16px',\n fontSize: '10px',\n fontWeight: '
|
|
1
|
+
{"version":3,"file":"badge.theme.js","sources":["../../../src/materialui/badge/badge.theme.ts"],"sourcesContent":["import { Components, Theme } from '@mui/material/styles';\n\n// 0px is default from @mui\nconst distance = '-2px';\n\nexport const flowBadge: Components<Theme>['MuiBadge'] = {\n defaultProps: {\n color: 'error',\n slotProps: {\n root: {\n // disable aria-label, we place it on the badge instead\n ['aria-label']: null,\n },\n badge: ({ invisible, ...rest }) => ({\n ...(invisible\n ? {\n ['aria-hidden']: true,\n }\n : {\n ['aria-live']: 'polite',\n ['aria-atomic']: true,\n }),\n // pass aria-label to badge from parent\n ...(rest['aria-label'] && {\n ['aria-label']: rest['aria-label'],\n }),\n }),\n },\n },\n styleOverrides: {\n standard: {\n height: '16px',\n minWidth: '16px',\n fontSize: '10px',\n lineHeight: '10px',\n letterSpacing: '0.02em',\n fontWeight: '700',\n borderRadius: '20px',\n padding: '0 4px',\n },\n dot: {\n height: '12px',\n width: '12px',\n borderRadius: '50%',\n },\n anchorOriginTopRightRectangular: {\n top: distance,\n right: distance,\n },\n anchorOriginTopLeftRectangular: {\n top: distance,\n left: distance,\n },\n anchorOriginBottomRightRectangular: {\n bottom: distance,\n right: distance,\n },\n anchorOriginBottomLeftRectangular: {\n bottom: distance,\n left: distance,\n },\n },\n};\n"],"names":["distance","flowBadge","defaultProps","color","slotProps","root","badge","invisible","rest","styleOverrides","standard","height","minWidth","fontSize","lineHeight","letterSpacing","fontWeight","borderRadius","padding","dot","width","anchorOriginTopRightRectangular","top","right","anchorOriginTopLeftRectangular","left","anchorOriginBottomRightRectangular","bottom","anchorOriginBottomLeftRectangular"],"mappings":"AAGA,MAAMA,EAAW,OAEJC,EAA2C,CACtDC,aAAc,CACZC,MAAO,QACPC,UAAW,CACTC,KAAM,CAEJ,aAAgB,MAElBC,MAAO,EAAGC,eAAcC,MAAM,IACxBD,EACA,CACE,eAAiB,GAEnB,CACE,YAAe,SACf,eAAiB,MAGnBC,EAAK,eAAiB,CACxB,aAAgBA,EAAK,mBAK7BC,eAAgB,CACdC,SAAU,CACRC,OAAQ,OACRC,SAAU,OACVC,SAAU,OACVC,WAAY,OACZC,cAAe,SACfC,WAAY,MACZC,aAAc,OACdC,QAAS,SAEXC,IAAK,CACHR,OAAQ,OACRS,MAAO,OACPH,aAAc,OAEhBI,gCAAiC,CAC/BC,IAAKtB,EACLuB,MAAOvB,GAETwB,+BAAgC,CAC9BF,IAAKtB,EACLyB,KAAMzB,GAER0B,mCAAoC,CAClCC,OAAQ3B,EACRuB,MAAOvB,GAET4B,kCAAmC,CACjCD,OAAQ3B,EACRyB,KAAMzB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.theme.js","sources":["../../../src/materialui/button/button.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\nimport { getFocusRingStyle, updateFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport const flowButton: Components<Theme>['MuiButton'] = {\n defaultProps: {\n disableRipple: true,\n disableElevation: true,\n variant: 'contained',\n },\n styleOverrides: {\n root: ({ theme, ownerState }) => ({\n position: 'relative',\n boxShadow: 'none',\n textRendering: 'geometricPrecision',\n outline: 'none',\n minWidth: '44px',\n padding: '14px 24px',\n flexShrink: '0',\n // font\n ...theme.typography.button,\n // startIcon / endIcon\n '& .MuiButton-icon': {\n // make sure not to increase size of the Button due to padding\n marginTop: '-2px',\n marginBottom: '-2px',\n // icon itself\n '& .MuiSvgIcon-root': {\n fontSize: '20px',\n },\n // spinner inside\n '& .FlowSpinner-root': {\n marginTop: '-2px',\n marginBottom: '-2px',\n },\n },\n ...(ownerState.size === 'small' && {\n padding: '8px 14px',\n fontSize: '14px',\n lineHeight: '16px',\n // startIcon / endIcon\n '& .MuiButton-icon': {\n // make sure not to increase size of the Button due to padding\n marginTop: '-2px',\n marginBottom: '-2px',\n // icon itself\n '& .MuiSvgIcon-root': {\n fontSize: '17px',\n },\n },\n }),\n ...(ownerState.size === 'large' && {\n padding: '15px 25px',\n fontSize: '18px',\n lineHeight: '20px',\n // startIcon / endIcon\n '& .MuiButton-icon': {\n // make sure not to increase size of the Button due to padding\n marginTop: '-2px',\n marginBottom: '-2px',\n // icon itself\n '& .MuiSvgIcon-root': {\n fontSize: '22px',\n },\n },\n }),\n backgroundClip: 'padding-box',\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 // 50% border radius without skewing ratio\n borderRadius: '1000px',\n '&:hover': {\n boxShadow: 'none',\n },\n '&&:active': {\n boxShadow: 'none',\n },\n // focused style\n ...getFocusRingStyle(theme),\n // disabled style\n '&.Mui-disabled': {\n opacity: '1',\n },\n }),\n startIcon: ({ ownerState }) => ({\n flexShrink: '0',\n // space between text and icon\n marginRight: '10px',\n marginLeft: '0',\n ...(ownerState.size === 'small' && {\n marginRight: '5px',\n }),\n ...(ownerState.size === 'large' && {\n marginRight: '15px',\n }),\n }),\n endIcon: ({ ownerState }) => ({\n flexShrink: '0',\n // space between text and icon\n marginRight: '0',\n marginLeft: '10px',\n ...(ownerState.size === 'small' && {\n marginLeft: '5px',\n }),\n ...(ownerState.size === 'large' && {\n marginLeft: '15px',\n }),\n }),\n contained: ({ theme, ownerState }) => ({\n ...((ownerState.color === 'primary' || ownerState.color === 'success') && {\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 ...(ownerState.color === 'secondary' && {\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.secondary.main,\n color: theme.palette.onSurface.os0,\n },\n {\n backgroundColor: theme.palette.onSurface.os600,\n color: theme.palette.onSurface.os0,\n },\n ),\n }),\n ...(ownerState.color === 'white' && {\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.onSurface.os0,\n },\n {\n backgroundColor: theme.palette.transparent.tertiary,\n color: theme.palette.onSurface.os0,\n },\n ),\n }),\n ...(ownerState.color === 'error' && {\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.error.main,\n color: theme.palette.onSurface.os0,\n },\n {\n backgroundColor: theme.palette.error.dark,\n color: theme.palette.onSurface.os0,\n },\n ),\n }),\n // deprecated semantic colors, used by Production team\n ...(ownerState.color === 'warning' && {\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.warning.main,\n color: theme.palette.onSurface.os0,\n },\n {\n backgroundColor: theme.palette.warning.dark,\n color: theme.palette.onSurface.os0,\n },\n ),\n }),\n ...(ownerState.color === 'info' && {\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.info.main,\n color: theme.palette.onSurface.os0,\n },\n {\n backgroundColor: theme.palette.info.dark,\n color: theme.palette.onSurface.os0,\n },\n ),\n }),\n ...(ownerState.color === 'inherit' && {\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.transparent.secondary,\n color: 'currentColor',\n },\n {\n backgroundColor: theme.palette.surface.primary,\n },\n ),\n }),\n // disabled style\n '&.Mui-disabled': {\n color: theme.palette.disabled.tertiary,\n backgroundColor: theme.palette.disabled.secondary,\n ...(theme.palette.mode === 'dark' && {\n backgroundColor: theme.palette.onSurface.os800,\n }),\n },\n }),\n text: ({ theme, ownerState }) => ({\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n },\n {\n backgroundColor: ['white', 'inherit'].includes(ownerState.color)\n ? theme.palette.transparent.tertiary\n : theme.palette.transparent.secondary,\n },\n ),\n ...((ownerState.color === 'primary' || ownerState.color === 'success') && {\n color: theme.palette.brand.secondary,\n }),\n ...(ownerState.color === 'secondary' && {\n color: theme.palette.text.primary,\n }),\n ...(ownerState.color === 'white' && {\n color: theme.palette.onSurface.os0,\n }),\n // disabled style\n '&.Mui-disabled': {\n color: theme.palette.disabled.primary,\n },\n }),\n outlined: ({ theme, ownerState }) => ({\n '&, &:hover, &.Mui-disabled': {\n borderWidth: '2px',\n },\n ...updateFocusRingStyle(2),\n borderStyle: 'solid',\n // remove 2px border from each side and move focusRing\n padding: '12px 22px',\n ...(ownerState.size === 'small' && {\n '&, &:hover, &.Mui-disabled': {\n borderWidth: '1px',\n },\n ...updateFocusRingStyle(1),\n padding: '7px 13px',\n }),\n ...(ownerState.size === 'large' && {\n padding: '13px 23px',\n }),\n // electric green variant\n ...((ownerState.color === 'primary' || ownerState.color === 'success') && {\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.brand.secondary,\n borderColor: theme.palette.brand.secondary,\n },\n {\n backgroundColor: theme.palette.transparent.secondary,\n color: theme.palette.brand.secondary,\n },\n ),\n }),\n // secondary used as text color\n ...(ownerState.color === 'secondary' && {\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.text.primary,\n borderColor: theme.palette.text.primary,\n },\n {\n backgroundColor: theme.palette.transparent.secondary,\n color: theme.palette.text.primary,\n },\n ),\n }),\n ...(ownerState.color === 'white' && {\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.onSurface.os0,\n borderColor: theme.palette.onSurface.os0,\n },\n {\n backgroundColor: theme.palette.transparent.tertiary,\n color: theme.palette.onSurface.os0,\n },\n ),\n }),\n ...(ownerState.color === 'error' && {\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.error.main,\n borderColor: theme.palette.error.main,\n },\n {\n backgroundColor: theme.palette.transparent.secondary,\n color: theme.palette.error.main,\n },\n ),\n }),\n // deprecated semantic colors\n ...(ownerState.color === 'warning' && {\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.warning.main,\n borderColor: theme.palette.warning.main,\n },\n {\n backgroundColor: theme.palette.transparent.secondary,\n color: theme.palette.warning.main,\n },\n ),\n }),\n ...(ownerState.color === 'info' && {\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.info.main,\n borderColor: theme.palette.info.main,\n },\n {\n backgroundColor: theme.palette.transparent.secondary,\n color: theme.palette.info.main,\n },\n ),\n }),\n ...(ownerState.color === 'inherit' && {\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: 'currentColor',\n borderColor: 'currentColor',\n },\n {\n backgroundColor: theme.palette.transparent.secondary,\n },\n ),\n }),\n // disabled style\n '&.Mui-disabled': {\n borderColor: theme.palette.disabled.primary,\n color: theme.palette.disabled.primary,\n },\n }),\n },\n variants: [\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 backgroundColor: theme.palette.surface.secondary,\n borderColor: theme.palette.surface.secondary,\n color: theme.palette.disabled.primary,\n },\n }),\n },\n {\n props: { variant: 'contained', color: 'surface' },\n style: () => ({\n // remove 1px border from each side\n padding: '13px 23px',\n }),\n },\n {\n props: { variant: 'contained', color: 'surface', size: 'small' },\n style: () => ({\n // remove 1px border from each side\n padding: '7px 13px',\n }),\n },\n {\n props: { variant: 'contained', color: 'surface', size: 'large' },\n style: () => ({\n // remove 1px border from each side\n padding: '14px 24px',\n }),\n },\n {\n props: { variant: 'outlined', color: 'surface' },\n style: () => ({\n borderWidth: 2,\n ...updateFocusRingStyle(2),\n }),\n },\n {\n props: { variant: 'text', color: 'surface' },\n style: () => ({\n borderWidth: 0,\n backgroundColor: 'transparent',\n ...updateFocusRingStyle(),\n }),\n },\n {\n props: { variant: 'navigation' },\n style: ({ theme }) => ({\n padding: '0',\n fontSize: '14px',\n borderRadius: '2px',\n letterSpacing: '0.02em',\n fontWeight: '400',\n lineHeight: '20px',\n '& .MuiButton-icon': {\n transition: 'transform 0.3s ease-out',\n // icon itself\n '& .MuiSvgIcon-root': {\n fontSize: '17px',\n },\n },\n '& .MuiButton-startIcon': {\n marginRight: '6px',\n },\n '& .MuiButton-endIcon': {\n marginLeft: '6px',\n },\n // prepare pseudo-element for focus effect\n '&::before': {\n inset: '-4px -8px',\n },\n // same style is used in the quickLink interactive effect\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.mode === 'dark' ? theme.palette.onSurface.os0 : theme.palette.onSurface.os900,\n '& .MuiButton-startIcon': {\n transform: 'translateX(0px)',\n },\n '& .MuiButton-endIcon': {\n transform: 'translateX(0px)',\n },\n },\n {\n backgroundColor: 'transparent',\n color: theme.palette.mode === 'dark' ? theme.palette.onSurface.os300 : theme.palette.onSurface.os700,\n '& .MuiButton-startIcon': {\n transform: 'translateX(-8px)',\n },\n '& .MuiButton-endIcon': {\n transform: 'translateX(8px)',\n },\n },\n ),\n // disabled style\n '&.Mui-disabled': {\n color: theme.palette.disabled.tertiary,\n },\n }),\n },\n {\n props: { variant: 'navigation', color: 'primary' },\n style: ({ theme }) => ({\n ...getInteractiveStyle(\n {\n color: theme.palette.primary.main,\n },\n {\n color: theme.palette.brandHover.primary,\n },\n ),\n }),\n },\n {\n props: { variant: 'navigation', color: 'surface' },\n style: {\n border: 'none',\n '&&::before': {\n inset: '-4px -8px',\n },\n },\n },\n {\n props: { variant: 'navigation', color: 'white' },\n style: ({ theme }) => ({\n ...getInteractiveStyle(\n {\n color: theme.palette.onSurface.os0,\n },\n {\n color: theme.palette.onSurface.os300,\n },\n ),\n }),\n },\n {\n props: { variant: 'navigation', color: 'error' },\n style: ({ theme }) => ({\n ...getInteractiveStyle(\n {\n color: theme.palette.error.main,\n },\n {\n color: theme.palette.error.dark,\n },\n ),\n }),\n },\n {\n props: { variant: 'shortcut' },\n style: ({ theme }) => ({\n // adjust proportions\n borderRadius: '3px',\n padding: '2px 8px',\n // font\n textAlign: 'left',\n fontWeight: '300',\n fontSize: '16px',\n lineHeight: '24px',\n letterSpacing: '0.02em',\n '&&': {\n textDecoration: 'underline',\n textDecorationColor: 'currentColor',\n textDecorationThickness: '1px',\n textUnderlineOffset: '2px',\n },\n // startIcon / endIcon\n '&& .MuiButton-icon': {\n transition: 'transform 0.3s ease-out',\n },\n // style\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.text.primary,\n '& .MuiButton-icon': {\n transform: 'scale(1.0)',\n },\n },\n {\n backgroundColor: 'transparent',\n color: theme.palette.mode === 'dark' ? theme.palette.onSurface.os300 : theme.palette.onSurface.os700,\n '& .MuiButton-icon': {\n transform: 'scale(1.1)',\n },\n },\n ),\n // responsive scale\n [theme.breakpoints.down('md')]: {\n fontSize: '14px',\n // startIcon / endIcon\n '& .MuiButton-icon': {\n // icon itself\n '& .MuiSvgIcon-root': {\n fontSize: '18px',\n },\n },\n },\n // disabled style\n '&.Mui-disabled': {\n color: theme.palette.disabled.tertiary,\n },\n }),\n },\n {\n props: { variant: 'shortcut', fullWidth: true },\n style: {\n // move content to left side from the center\n justifyContent: 'flex-start',\n textAlign: 'left',\n },\n },\n {\n props: { variant: 'shortcut', color: 'inherit' },\n style: {\n ...getInteractiveStyle(\n {\n color: 'currentColor',\n },\n {\n color: 'currentColor',\n },\n ),\n },\n },\n ],\n};\n"],"names":["flowButton","defaultProps","disableRipple","disableElevation","variant","styleOverrides","root","theme","ownerState","position","boxShadow","textRendering","outline","minWidth","padding","flexShrink","typography","button","marginTop","marginBottom","fontSize","size","lineHeight","backgroundClip","transition","borderRadius","getFocusRingStyle","opacity","startIcon","marginRight","marginLeft","endIcon","contained","color","getInteractiveStyle","backgroundColor","palette","brand","secondary","onSurface","os900","brandHover","main","os0","os600","transparent","tertiary","error","dark","warning","info","surface","primary","disabled","mode","os800","text","includes","outlined","borderWidth","updateFocusRingStyle","borderStyle","borderColor","variants","props","style","border","quarternary","os100","letterSpacing","fontWeight","inset","transform","os300","os700","textAlign","textDecoration","textDecorationColor","textDecorationThickness","textUnderlineOffset","breakpoints","down","fullWidth","justifyContent"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"button.theme.js","sources":["../../../src/materialui/button/button.theme.ts"],"sourcesContent":["import { Components } from '@mui/material/styles';\nimport { Theme } from '@mui/material';\nimport { getFocusRingStyle, updateFocusRingStyle } from '@/src/components/focusring/focusring';\nimport { getInteractiveStyle } from '@/src/materialui/button/interactive';\n\nexport const flowButton: Components<Theme>['MuiButton'] = {\n defaultProps: {\n disableRipple: true,\n disableElevation: true,\n variant: 'contained',\n },\n styleOverrides: {\n root: ({ theme, ownerState }) => ({\n position: 'relative',\n boxShadow: 'none',\n textRendering: 'geometricPrecision',\n outline: 'none',\n minWidth: '44px',\n padding: '14px 24px',\n flexShrink: '0',\n // font\n ...theme.typography.button,\n // startIcon / endIcon\n '& .MuiButton-icon': {\n // make sure not to increase size of the Button due to padding\n marginTop: '-2px',\n marginBottom: '-2px',\n // icon itself\n '& .MuiSvgIcon-root': {\n fontSize: '20px',\n },\n // spinner inside\n '& .FlowSpinner-root': {\n marginTop: '-2px',\n marginBottom: '-2px',\n },\n },\n // small size values are also copied in SecondaryNavigationCta.tsx, keep them in sync\n ...(ownerState.size === 'small' && {\n padding: '8px 14px',\n fontSize: '14px',\n lineHeight: '16px',\n // startIcon / endIcon\n '& .MuiButton-icon': {\n // make sure not to increase size of the Button due to padding\n marginTop: '-2px',\n marginBottom: '-2px',\n // icon itself\n '& .MuiSvgIcon-root': {\n fontSize: '17px',\n },\n },\n }),\n ...(ownerState.size === 'large' && {\n padding: '15px 25px',\n fontSize: '18px',\n lineHeight: '20px',\n // startIcon / endIcon\n '& .MuiButton-icon': {\n // make sure not to increase size of the Button due to padding\n marginTop: '-2px',\n marginBottom: '-2px',\n // icon itself\n '& .MuiSvgIcon-root': {\n fontSize: '22px',\n },\n },\n }),\n backgroundClip: 'padding-box',\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 // 50% border radius without skewing ratio\n borderRadius: '1000px',\n '&:hover': {\n boxShadow: 'none',\n },\n '&&:active': {\n boxShadow: 'none',\n },\n // focused style\n ...getFocusRingStyle(theme),\n // disabled style\n '&.Mui-disabled': {\n opacity: '1',\n },\n }),\n startIcon: ({ ownerState }) => ({\n flexShrink: '0',\n // space between text and icon\n marginRight: '10px',\n marginLeft: '0',\n // small size value is also copied in SecondaryNavigationCta.tsx\n ...(ownerState.size === 'small' && {\n marginRight: '5px',\n }),\n ...(ownerState.size === 'large' && {\n marginRight: '15px',\n }),\n }),\n endIcon: ({ ownerState }) => ({\n flexShrink: '0',\n // space between text and icon\n marginRight: '0',\n marginLeft: '10px',\n // small size value is also copied in SecondaryNavigationCta.tsx\n ...(ownerState.size === 'small' && {\n marginLeft: '5px',\n }),\n ...(ownerState.size === 'large' && {\n marginLeft: '15px',\n }),\n }),\n contained: ({ theme, ownerState }) => ({\n ...((ownerState.color === 'primary' || ownerState.color === 'success') && {\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 ...(ownerState.color === 'secondary' && {\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.secondary.main,\n color: theme.palette.onSurface.os0,\n },\n {\n backgroundColor: theme.palette.onSurface.os600,\n color: theme.palette.onSurface.os0,\n },\n ),\n }),\n ...(ownerState.color === 'white' && {\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.onSurface.os0,\n },\n {\n backgroundColor: theme.palette.transparent.tertiary,\n color: theme.palette.onSurface.os0,\n },\n ),\n }),\n ...(ownerState.color === 'error' && {\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.error.main,\n color: theme.palette.onSurface.os0,\n },\n {\n backgroundColor: theme.palette.error.dark,\n color: theme.palette.onSurface.os0,\n },\n ),\n }),\n // deprecated semantic colors, used by Production team\n ...(ownerState.color === 'warning' && {\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.warning.main,\n color: theme.palette.onSurface.os0,\n },\n {\n backgroundColor: theme.palette.warning.dark,\n color: theme.palette.onSurface.os0,\n },\n ),\n }),\n ...(ownerState.color === 'info' && {\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.info.main,\n color: theme.palette.onSurface.os0,\n },\n {\n backgroundColor: theme.palette.info.dark,\n color: theme.palette.onSurface.os0,\n },\n ),\n }),\n ...(ownerState.color === 'inherit' && {\n ...getInteractiveStyle(\n {\n backgroundColor: theme.palette.transparent.secondary,\n color: 'currentColor',\n },\n {\n backgroundColor: theme.palette.surface.primary,\n },\n ),\n }),\n // disabled style\n '&.Mui-disabled': {\n color: theme.palette.disabled.tertiary,\n backgroundColor: theme.palette.disabled.secondary,\n ...(theme.palette.mode === 'dark' && {\n backgroundColor: theme.palette.onSurface.os800,\n }),\n },\n }),\n text: ({ theme, ownerState }) => ({\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n },\n {\n backgroundColor: ['white', 'inherit'].includes(ownerState.color)\n ? theme.palette.transparent.tertiary\n : theme.palette.transparent.secondary,\n },\n ),\n ...((ownerState.color === 'primary' || ownerState.color === 'success') && {\n color: theme.palette.brand.secondary,\n }),\n ...(ownerState.color === 'secondary' && {\n color: theme.palette.text.primary,\n }),\n ...(ownerState.color === 'white' && {\n color: theme.palette.onSurface.os0,\n }),\n // disabled style\n '&.Mui-disabled': {\n color: theme.palette.disabled.primary,\n },\n }),\n outlined: ({ theme, ownerState }) => ({\n '&, &:hover, &.Mui-disabled': {\n borderWidth: '2px',\n },\n ...updateFocusRingStyle(2),\n borderStyle: 'solid',\n // remove 2px border from each side and move focusRing\n padding: '12px 22px',\n ...(ownerState.size === 'small' && {\n '&, &:hover, &.Mui-disabled': {\n borderWidth: '1px',\n },\n ...updateFocusRingStyle(1),\n padding: '7px 13px',\n }),\n ...(ownerState.size === 'large' && {\n padding: '13px 23px',\n }),\n // electric green variant\n ...((ownerState.color === 'primary' || ownerState.color === 'success') && {\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.brand.secondary,\n borderColor: theme.palette.brand.secondary,\n },\n {\n backgroundColor: theme.palette.transparent.secondary,\n color: theme.palette.brand.secondary,\n },\n ),\n }),\n // secondary used as text color\n ...(ownerState.color === 'secondary' && {\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.text.primary,\n borderColor: theme.palette.text.primary,\n },\n {\n backgroundColor: theme.palette.transparent.secondary,\n color: theme.palette.text.primary,\n },\n ),\n }),\n ...(ownerState.color === 'white' && {\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.onSurface.os0,\n borderColor: theme.palette.onSurface.os0,\n },\n {\n backgroundColor: theme.palette.transparent.tertiary,\n color: theme.palette.onSurface.os0,\n },\n ),\n }),\n ...(ownerState.color === 'error' && {\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.error.main,\n borderColor: theme.palette.error.main,\n },\n {\n backgroundColor: theme.palette.transparent.secondary,\n color: theme.palette.error.main,\n },\n ),\n }),\n // deprecated semantic colors\n ...(ownerState.color === 'warning' && {\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.warning.main,\n borderColor: theme.palette.warning.main,\n },\n {\n backgroundColor: theme.palette.transparent.secondary,\n color: theme.palette.warning.main,\n },\n ),\n }),\n ...(ownerState.color === 'info' && {\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.info.main,\n borderColor: theme.palette.info.main,\n },\n {\n backgroundColor: theme.palette.transparent.secondary,\n color: theme.palette.info.main,\n },\n ),\n }),\n ...(ownerState.color === 'inherit' && {\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: 'currentColor',\n borderColor: 'currentColor',\n },\n {\n backgroundColor: theme.palette.transparent.secondary,\n },\n ),\n }),\n // disabled style\n '&.Mui-disabled': {\n borderColor: theme.palette.disabled.primary,\n color: theme.palette.disabled.primary,\n },\n }),\n },\n variants: [\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 backgroundColor: theme.palette.surface.secondary,\n borderColor: theme.palette.surface.secondary,\n color: theme.palette.disabled.primary,\n },\n }),\n },\n {\n props: { variant: 'contained', color: 'surface' },\n style: () => ({\n // remove 1px border from each side\n padding: '13px 23px',\n }),\n },\n {\n props: { variant: 'contained', color: 'surface', size: 'small' },\n style: () => ({\n // remove 1px border from each side\n padding: '7px 13px',\n }),\n },\n {\n props: { variant: 'contained', color: 'surface', size: 'large' },\n style: () => ({\n // remove 1px border from each side\n padding: '14px 24px',\n }),\n },\n {\n props: { variant: 'outlined', color: 'surface' },\n style: () => ({\n borderWidth: 2,\n ...updateFocusRingStyle(2),\n }),\n },\n {\n props: { variant: 'text', color: 'surface' },\n style: () => ({\n borderWidth: 0,\n backgroundColor: 'transparent',\n ...updateFocusRingStyle(),\n }),\n },\n {\n props: { variant: 'navigation' },\n style: ({ theme }) => ({\n padding: '0',\n fontSize: '14px',\n borderRadius: '2px',\n letterSpacing: '0.02em',\n fontWeight: '400',\n lineHeight: '20px',\n '& .MuiButton-icon': {\n transition: 'transform 0.3s ease-out',\n // icon itself\n '& .MuiSvgIcon-root': {\n fontSize: '17px',\n },\n },\n '& .MuiButton-startIcon': {\n marginRight: '6px',\n },\n '& .MuiButton-endIcon': {\n marginLeft: '6px',\n },\n // prepare pseudo-element for focus effect\n '&::before': {\n inset: '-4px -8px',\n },\n // same style is used in the quickLink interactive effect\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.mode === 'dark' ? theme.palette.onSurface.os0 : theme.palette.onSurface.os900,\n '& .MuiButton-startIcon': {\n transform: 'translateX(0px)',\n },\n '& .MuiButton-endIcon': {\n transform: 'translateX(0px)',\n },\n },\n {\n backgroundColor: 'transparent',\n color: theme.palette.mode === 'dark' ? theme.palette.onSurface.os300 : theme.palette.onSurface.os700,\n '& .MuiButton-startIcon': {\n transform: 'translateX(-8px)',\n },\n '& .MuiButton-endIcon': {\n transform: 'translateX(8px)',\n },\n },\n ),\n // disabled style\n '&.Mui-disabled': {\n color: theme.palette.disabled.tertiary,\n },\n }),\n },\n {\n props: { variant: 'navigation', color: 'primary' },\n style: ({ theme }) => ({\n ...getInteractiveStyle(\n {\n color: theme.palette.primary.main,\n },\n {\n color: theme.palette.brandHover.primary,\n },\n ),\n }),\n },\n {\n props: { variant: 'navigation', color: 'surface' },\n style: {\n border: 'none',\n '&&::before': {\n inset: '-4px -8px',\n },\n },\n },\n {\n props: { variant: 'navigation', color: 'white' },\n style: ({ theme }) => ({\n ...getInteractiveStyle(\n {\n color: theme.palette.onSurface.os0,\n },\n {\n color: theme.palette.onSurface.os300,\n },\n ),\n }),\n },\n {\n props: { variant: 'navigation', color: 'error' },\n style: ({ theme }) => ({\n ...getInteractiveStyle(\n {\n color: theme.palette.error.main,\n },\n {\n color: theme.palette.error.dark,\n },\n ),\n }),\n },\n {\n props: { variant: 'shortcut' },\n style: ({ theme }) => ({\n // adjust proportions\n borderRadius: '3px',\n padding: '2px 8px',\n // font\n textAlign: 'left',\n fontWeight: '300',\n fontSize: '16px',\n lineHeight: '24px',\n letterSpacing: '0.02em',\n '&&': {\n textDecoration: 'underline',\n textDecorationColor: 'currentColor',\n textDecorationThickness: '1px',\n textUnderlineOffset: '2px',\n },\n // startIcon / endIcon\n '&& .MuiButton-icon': {\n transition: 'transform 0.3s ease-out',\n },\n // style\n ...getInteractiveStyle(\n {\n backgroundColor: 'transparent',\n color: theme.palette.text.primary,\n '& .MuiButton-icon': {\n transform: 'scale(1.0)',\n },\n },\n {\n backgroundColor: 'transparent',\n color: theme.palette.mode === 'dark' ? theme.palette.onSurface.os300 : theme.palette.onSurface.os700,\n '& .MuiButton-icon': {\n transform: 'scale(1.1)',\n },\n },\n ),\n // responsive scale\n [theme.breakpoints.down('md')]: {\n fontSize: '14px',\n // startIcon / endIcon\n '& .MuiButton-icon': {\n // icon itself\n '& .MuiSvgIcon-root': {\n fontSize: '18px',\n },\n },\n },\n // disabled style\n '&.Mui-disabled': {\n color: theme.palette.disabled.tertiary,\n },\n }),\n },\n {\n props: { variant: 'shortcut', fullWidth: true },\n style: {\n // move content to left side from the center\n justifyContent: 'flex-start',\n textAlign: 'left',\n },\n },\n {\n props: { variant: 'shortcut', color: 'inherit' },\n style: {\n ...getInteractiveStyle(\n {\n color: 'currentColor',\n },\n {\n color: 'currentColor',\n },\n ),\n },\n },\n ],\n};\n"],"names":["flowButton","defaultProps","disableRipple","disableElevation","variant","styleOverrides","root","theme","ownerState","position","boxShadow","textRendering","outline","minWidth","padding","flexShrink","typography","button","marginTop","marginBottom","fontSize","size","lineHeight","backgroundClip","transition","borderRadius","getFocusRingStyle","opacity","startIcon","marginRight","marginLeft","endIcon","contained","color","getInteractiveStyle","backgroundColor","palette","brand","secondary","onSurface","os900","brandHover","main","os0","os600","transparent","tertiary","error","dark","warning","info","surface","primary","disabled","mode","os800","text","includes","outlined","borderWidth","updateFocusRingStyle","borderStyle","borderColor","variants","props","style","border","quarternary","os100","letterSpacing","fontWeight","inset","transform","os300","os700","textAlign","textDecoration","textDecorationColor","textDecorationThickness","textUnderlineOffset","breakpoints","down","fullWidth","justifyContent"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const
|
|
1
|
+
const i={defaultProps:{disableRipple:!0},styleOverrides:{root:{letterSpacing:"inherit",fontFamily:"inherit",fontStyle:"inherit",textTransform:"inherit",textDecoration:"inherit",fontSize:"inherit",fontWeight:"inherit",lineHeight:"inherit","& .MuiTouchRipple-root, & .MuiTouchRipple-root > span":{maxWidth:"none"}}}};export{i as flowButtonBase};
|
|
2
2
|
//# sourceMappingURL=buttonBase.theme.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"buttonBase.theme.js","sources":["../../../src/materialui/button/buttonBase.theme.ts"],"sourcesContent":["import { Components, Theme } from '@mui/material/styles';\n\nexport const flowButtonBase: Components<Theme>['MuiButtonBase'] = {\n defaultProps: {\n disableRipple: true,\n },\n styleOverrides: {\n root: {\n '& .MuiTouchRipple-root, & .MuiTouchRipple-root > span': {\n // remove generic maxWidth limitation\n maxWidth: 'none',\n },\n },\n },\n};\n"],"names":["flowButtonBase","defaultProps","disableRipple","styleOverrides","root","maxWidth"],"mappings":"AAEO,MAAMA,EAAqD,CAChEC,aAAc,CACZC,eAAe,GAEjBC,eAAgB,CACdC,KAAM,
|
|
1
|
+
{"version":3,"file":"buttonBase.theme.js","sources":["../../../src/materialui/button/buttonBase.theme.ts"],"sourcesContent":["import { Components, Theme } from '@mui/material/styles';\n\nexport const flowButtonBase: Components<Theme>['MuiButtonBase'] = {\n defaultProps: {\n disableRipple: true,\n },\n styleOverrides: {\n root: {\n letterSpacing: 'inherit',\n fontFamily: 'inherit',\n fontStyle: 'inherit',\n textTransform: 'inherit',\n textDecoration: 'inherit',\n fontSize: 'inherit',\n fontWeight: 'inherit',\n lineHeight: 'inherit',\n '& .MuiTouchRipple-root, & .MuiTouchRipple-root > span': {\n // remove generic maxWidth limitation\n maxWidth: 'none',\n },\n },\n },\n};\n"],"names":["flowButtonBase","defaultProps","disableRipple","styleOverrides","root","letterSpacing","fontFamily","fontStyle","textTransform","textDecoration","fontSize","fontWeight","lineHeight","maxWidth"],"mappings":"AAEO,MAAMA,EAAqD,CAChEC,aAAc,CACZC,eAAe,GAEjBC,eAAgB,CACdC,KAAM,CACJC,cAAe,UACfC,WAAY,UACZC,UAAW,UACXC,cAAe,UACfC,eAAgB,UAChBC,SAAU,UACVC,WAAY,UACZC,WAAY,UACZ,wDAAyD,CAEvDC,SAAU"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as e,jsx as
|
|
1
|
+
import{jsxs as e,jsx as o}from"react/jsx-runtime";import{forwardRef as r}from"react";import{Box as t,Typography as i,IconButton as s}from"@mui/material";import{sxOverride as l}from"../../utils/sxOverride/sxOverride.js";import{CloseIcon as n}from"../../components/icon/stroke/CloseIcon.js";const m=r(({onClose:r,closeIconButtonProps:m,children:c,...a},p)=>{const{sx:f,...x}=m??{};return e(t,{sx:{display:"flex",justifyContent:c?"space-between":"flex-end",alignItems:"flex-start",gap:1,flexShrink:"0"},className:"FlowDialogTitle-root",children:[c&&o(i,{component:"h2",ref:p,...a,children:c}),r&&o(s,{size:"medium",onClick:e=>r(e,"backdropClick"),"aria-label":"Close",sx:l({mr:2,mt:2},f),...x,children:o(n,{})})]})});export{m as FlowDialogTitle};
|
|
2
2
|
//# sourceMappingURL=DialogTitle.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DialogTitle.js","sources":["../../../src/materialui/dialog/DialogTitle.tsx"],"sourcesContent":["import React, { FC, forwardRef } from 'react';\nimport { DialogTitleProps, Typography, IconButton, Box } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\n\n/**\n * This component serves as an extended title section for a dialog,\n * including an optional close button displayed when `onClose` prop is provided.\n */\nexport const FlowDialogTitle: FC<DialogTitleProps> = forwardRef(\n ({ onClose, closeIconButtonProps, children, ...rest }, ref) => {\n const { sx: closeIconButtonSx, ...restCloseIconButton } = closeIconButtonProps ?? {};\n\n return (\n <Box\n sx={{\n display: 'flex',\n justifyContent: children ? 'space-between' : 'flex-end',\n alignItems: 'flex-start',\n gap: 1,\n }}\n >\n {children && (\n <Typography component=\"h2\" ref={ref} {...rest}>\n {children}\n </Typography>\n )}\n {onClose && (\n <IconButton\n size=\"medium\"\n onClick={(e) => onClose(e, 'backdropClick')}\n aria-label=\"Close\"\n sx={sxOverride(\n {\n mr: 2,\n mt: 2,\n },\n closeIconButtonSx,\n )}\n {...restCloseIconButton}\n >\n <CloseIcon />\n </IconButton>\n )}\n </Box>\n );\n },\n);\n"],"names":["FlowDialogTitle","forwardRef","onClose","closeIconButtonProps","children","rest","ref","sx","closeIconButtonSx","restCloseIconButton","_jsxs","Box","display","justifyContent","alignItems","gap","_jsx","Typography","component","IconButton","size","onClick","e","sxOverride","mr","mt","CloseIcon"],"mappings":"uSASaA,EAAwCC,EACnD,EAAGC,UAASC,uBAAsBC,cAAaC,GAAQC,KACrD,MAAQC,GAAIC,KAAsBC,GAAwBN,GAAwB,CAAA,EAElF,OACEO,EAACC,EAAG,CACFJ,GAAI,CACFK,QAAS,OACTC,eAAgBT,EAAW,gBAAkB,WAC7CU,WAAY,aACZC,IAAK,
|
|
1
|
+
{"version":3,"file":"DialogTitle.js","sources":["../../../src/materialui/dialog/DialogTitle.tsx"],"sourcesContent":["import React, { FC, forwardRef } from 'react';\nimport { DialogTitleProps, Typography, IconButton, Box } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\n\n/**\n * This component serves as an extended title section for a dialog,\n * including an optional close button displayed when `onClose` prop is provided.\n */\nexport const FlowDialogTitle: FC<DialogTitleProps> = forwardRef(\n ({ onClose, closeIconButtonProps, children, ...rest }, ref) => {\n const { sx: closeIconButtonSx, ...restCloseIconButton } = closeIconButtonProps ?? {};\n\n return (\n <Box\n sx={{\n display: 'flex',\n justifyContent: children ? 'space-between' : 'flex-end',\n alignItems: 'flex-start',\n gap: 1,\n flexShrink: '0',\n }}\n className=\"FlowDialogTitle-root\"\n >\n {children && (\n <Typography component=\"h2\" ref={ref} {...rest}>\n {children}\n </Typography>\n )}\n {onClose && (\n <IconButton\n size=\"medium\"\n onClick={(e) => onClose(e, 'backdropClick')}\n aria-label=\"Close\"\n sx={sxOverride(\n {\n mr: 2,\n mt: 2,\n },\n closeIconButtonSx,\n )}\n {...restCloseIconButton}\n >\n <CloseIcon />\n </IconButton>\n )}\n </Box>\n );\n },\n);\n"],"names":["FlowDialogTitle","forwardRef","onClose","closeIconButtonProps","children","rest","ref","sx","closeIconButtonSx","restCloseIconButton","_jsxs","Box","display","justifyContent","alignItems","gap","flexShrink","className","_jsx","Typography","component","IconButton","size","onClick","e","sxOverride","mr","mt","CloseIcon"],"mappings":"uSASaA,EAAwCC,EACnD,EAAGC,UAASC,uBAAsBC,cAAaC,GAAQC,KACrD,MAAQC,GAAIC,KAAsBC,GAAwBN,GAAwB,CAAA,EAElF,OACEO,EAACC,EAAG,CACFJ,GAAI,CACFK,QAAS,OACTC,eAAgBT,EAAW,gBAAkB,WAC7CU,WAAY,aACZC,IAAK,EACLC,WAAY,KAEdC,UAAU,uBAAsBb,SAAA,CAE/BA,GACCc,EAACC,EAAU,CAACC,UAAU,KAAKd,IAAKA,KAASD,WACtCD,IAGJF,GACCgB,EAACG,EAAU,CACTC,KAAK,SACLC,QAAUC,GAAMtB,EAAQsB,EAAG,iBAAgB,aAChC,QACXjB,GAAIkB,EACF,CACEC,GAAI,EACJC,GAAI,GAENnB,MAEEC,EAAmBL,SAEvBc,EAACU,EAAS"}
|
|
@@ -79,6 +79,11 @@ export interface SliderValueProps extends Omit<SliderValuesProps, 'value' | 'min
|
|
|
79
79
|
* The single setValue for the slider value
|
|
80
80
|
*/
|
|
81
81
|
setValue?: (newValue: number) => void;
|
|
82
|
+
/**
|
|
83
|
+
* Index of the thumb this value represents, forwarded as the second argument to `valueLabelFormat`
|
|
84
|
+
* @default 0
|
|
85
|
+
*/
|
|
86
|
+
index?: number;
|
|
82
87
|
}
|
|
83
88
|
/**
|
|
84
89
|
* Display single value of slider, allows editing with input
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as e,Fragment as r,jsx as a}from"react/jsx-runtime";import{forwardRef as o,useState as l,useCallback as s}from"react";import{Box as i,Typography as
|
|
1
|
+
import{jsxs as e,Fragment as r,jsx as a}from"react/jsx-runtime";import{forwardRef as o,useState as l,useCallback as s}from"react";import{Box as i,Typography as n,FilledInput as t}from"@mui/material";import{sxOverride as p}from"../../utils/sxOverride/sxOverride.js";import{flowSlider as u}from"./slider.theme.js";import{getFocusRingStyle as d}from"../../components/focusring/focusring.js";const m=o(({sx:o,children:l,value:s,valueProps:n,label:t,labelProps:d,valueLabelFormat:m,setValue:c,disabled:b,min:f=u.defaultProps.min,minLabel:v,minLabelProps:P,max:h=u.defaultProps.max,maxLabel:g,maxLabelProps:y,step:S=u.defaultProps.step,sliderValueProps:k,inputProps:L,...C},V)=>{const j={disabled:b,min:f,max:h,step:S,valueLabelFormat:m,valueProps:n,inputProps:L,...k};return e(i,{ref:V,sx:p({display:"flex",alignItems:"flex-end",justifyContent:"space-between",gap:1},o),...C,children:[Array.isArray(s)||!1===s&&(v||t)&&g?e(r,{children:[a(x,{value:!1!==s&&s[0],setValue:c?e=>c([e,s[1]]):void 0,label:v||t,labelProps:P||d,...j,max:s[1],index:0}),a(x,{value:!1!==s&&s[1],setValue:c?e=>c([s[0],e]):void 0,label:g,labelProps:y,...j,min:s[0],index:1,sx:p({textAlign:"right"},j?.sx)})]}):a(x,{value:s,setValue:c,label:t,labelProps:d,...j}),l]})}),x=o(({value:r,valueProps:o,label:u,labelProps:m,valueLabelFormat:x,setValue:c,min:b,max:f,step:v,index:P=0,inputProps:h,disabled:g,sx:y,...S},k)=>{const{sx:L,...C}=m??{},{sx:V,...j}=o??{},{sx:F,...w}=h??{},[A,I]=l(!1),z=s(e=>{const r=+(e||0);c(r<b?b:r>f?f:r)},[b,f,c]),B=x?x(r,P):r;return e(i,{ref:k,sx:p({minWidth:"82px",...(!u||!1===r)&&{pt:.5}},y),onClick:c&&!g?()=>I(!0):void 0,...S,children:[u&&a(n,{...!1===r&&{variant:"disclaimer1"},sx:p({display:"block",...!1===r?{color:e=>"dark"===e.palette.mode?"onSurface.os200":"onSurface.os700"}:{color:e=>"dark"===e.palette.mode?"onSurface.os300":"onSurface.os600",fontSize:{xs:"12px"},lineHeight:{xs:"12px"},fontWeight:{xs:"400"},py:.5,px:1}},L),...C,children:u}),A&&!g?a(t,{autoFocus:!0,onBlur:()=>I(!1),value:r,onChange:e=>z(e.target.value),onKeyUp:()=>{},inputProps:{type:"number",step:v,min:b,"aria-valuemin":b,max:f,"aria-valuemax":f,"aria-valuenow":B},disableUnderline:!0,sx:p(e=>({display:"block",borderRadius:"4px",py:"1px",px:1,border:1,borderColor:"onSurface.os500","&&, &:hover":{backgroundColor:"background.primary"},"& .MuiInputBase-input":{fieldSizing:"content",textAlign:"inherit",p:0,...e.typography[j?.variant??"disclaimer1"]},...d(e,!1,1,"&.Mui-focused"),"&&:before":{border:"none"}}),F),...w}):!1!==r&&a(n,{variant:"disclaimer1",sx:p({display:"block",px:1,whiteSpace:"nowrap",color:e=>"dark"===e.palette.mode?"onSurface.os200":"onSurface.os700",...c&&{px:1,py:"1px",border:1,borderColor:"onSurface.os500",borderRadius:"4px"}},V),...c&&{tabIndex:0,onFocus:()=>I(!0)},...j,children:B})]})});export{x as SliderValue,m as SliderValues};
|
|
2
2
|
//# sourceMappingURL=SliderValues.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SliderValues.js","sources":["../../../src/materialui/slider/SliderValues.tsx"],"sourcesContent":["import React, { forwardRef, ElementType, ReactNode, useState, useCallback } from 'react';\nimport { Box, BoxProps, SliderProps, Typography, TypographyProps, FilledInput, FilledInputProps } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { flowSlider } from '@/src/materialui/slider/slider.theme';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\n\nexport interface SliderValuesProps extends BoxProps<ElementType> {\n /**\n * The value of the slider\n */\n value: SliderProps['value'] | false;\n /**\n * Properties applied to value wrapper\n */\n valueProps?: TypographyProps<ElementType>;\n /**\n * Label show above value\n */\n label?: ReactNode;\n /**\n * Properties applied to label wrapper\n */\n labelProps?: TypographyProps<ElementType>;\n /**\n * The format function the value label's value\n */\n valueLabelFormat?: SliderProps['valueLabelFormat'];\n /**\n * Provide this function to allow changing the slider value with inputs\n */\n setValue?: (newValue: unknown) => void;\n /**\n * Disable editing\n */\n disabled?: boolean;\n /**\n * The minimum allowed value of the slider\n */\n min?: SliderProps['min'];\n /**\n * Text shown above min selected value\n */\n minLabel?: ReactNode;\n /**\n * Properties applied to label wrapper\n */\n minLabelProps?: TypographyProps<ElementType>;\n /**\n * The maximum allowed value of the slider\n */\n max?: SliderProps['max'];\n /**\n * Text shown above max selected value\n */\n maxLabel?: ReactNode;\n /**\n * Properties applied to label wrapper\n */\n maxLabelProps?: TypographyProps<ElementType>;\n /**\n * The granularity with which the slider can step through values\n */\n step?: SliderProps['step'];\n /**\n * Properties applied to the root wrapper of each SliderValue\n */\n sliderValueProps?: BoxProps<ElementType>;\n /**\n * Properties applied to SliderValue input field\n */\n inputProps?: FilledInputProps;\n}\n\n/**\n * Wrapper that render one or two SliderValue components based on the Slider type\n */\nexport const SliderValues: React.FC<SliderValuesProps> = forwardRef(\n (\n {\n sx,\n children,\n value,\n valueProps,\n label,\n labelProps,\n valueLabelFormat,\n setValue,\n disabled,\n min = flowSlider.defaultProps.min,\n minLabel,\n minLabelProps,\n max = flowSlider.defaultProps.max,\n maxLabel,\n maxLabelProps,\n step = flowSlider.defaultProps.step,\n sliderValueProps: rawSliderValueProps,\n inputProps,\n ...rest\n },\n ref,\n ) => {\n const sliderValueProps = {\n disabled,\n min,\n max,\n step,\n valueLabelFormat,\n valueProps,\n inputProps,\n ...rawSliderValueProps,\n };\n\n return (\n <Box\n ref={ref}\n sx={sxOverride({ display: 'flex', alignItems: 'flex-end', justifyContent: 'space-between', gap: 1 }, sx)}\n {...rest}\n >\n {Array.isArray(value) || (value === false && (minLabel || label) && maxLabel) ? (\n <>\n <SliderValue\n value={value !== false && value[0]}\n setValue={setValue ? (newValue) => setValue([newValue, value[1]]) : undefined}\n label={minLabel || label}\n labelProps={minLabelProps || labelProps}\n {...sliderValueProps}\n max={value[1]}\n />\n <SliderValue\n value={value !== false && value[1]}\n setValue={setValue ? (newValue) => setValue([value[0], newValue]) : undefined}\n label={maxLabel}\n labelProps={maxLabelProps}\n {...sliderValueProps}\n min={value[0]}\n sx={sxOverride({ textAlign: 'right' }, sliderValueProps?.sx)}\n />\n </>\n ) : (\n <SliderValue value={value} setValue={setValue} label={label} labelProps={labelProps} {...sliderValueProps} />\n )}\n {children}\n </Box>\n );\n },\n);\n\nexport interface SliderValueProps extends Omit<\n SliderValuesProps,\n 'value' | 'minLabel' | 'minLabelProps' | 'maxLabel' | 'maxLabelProps'\n> {\n /**\n * The single value of the slider\n */\n value: number | false;\n /**\n * The single setValue for the slider value\n */\n setValue?: (newValue: number) => void;\n}\n\n/**\n * Display single value of slider, allows editing with input\n */\nexport const SliderValue: React.FC<SliderValueProps> = forwardRef(\n (\n {\n value,\n valueProps,\n label,\n labelProps,\n valueLabelFormat,\n setValue,\n min,\n max,\n step,\n inputProps,\n disabled,\n sx,\n ...rest\n },\n ref,\n ) => {\n const { sx: labelSx, ...restLabel } = labelProps ?? {};\n const { sx: valueSx, ...restValue } = valueProps ?? {};\n const { sx: inputSx, ...restInput } = inputProps ?? {};\n const [editing, setEditing] = useState(false);\n const editValue = useCallback(\n (inputValue: string) => {\n const newValue = +(inputValue || 0);\n if (newValue < min) {\n setValue(min);\n } else if (newValue > max) {\n setValue(max);\n } else {\n setValue(newValue);\n }\n },\n [min, max, setValue],\n );\n const formattedValue = valueLabelFormat ? valueLabelFormat(value) : value;\n\n return (\n <Box\n ref={ref}\n sx={sxOverride({ minWidth: '82px', ...((!label || value === false) && { pt: 0.5 }) }, sx)}\n onClick={setValue && !disabled ? () => setEditing(true) : undefined}\n {...rest}\n >\n {label && (\n <Typography\n {...(value === false && {\n variant: 'disclaimer1',\n })}\n sx={sxOverride(\n {\n display: 'block',\n ...(value === false\n ? {\n color: (theme) => (theme.palette.mode === 'dark' ? 'onSurface.os200' : 'onSurface.os700'),\n }\n : {\n // os600 instead of Figma's os500 to pass A11y contrast\n color: (theme) => (theme.palette.mode === 'dark' ? 'onSurface.os300' : 'onSurface.os600'),\n fontSize: { xs: '12px' },\n lineHeight: { xs: '12px' },\n fontWeight: { xs: '400' },\n py: 0.5,\n px: 1,\n }),\n },\n labelSx,\n )}\n {...restLabel}\n >\n {label}\n </Typography>\n )}\n {editing && !disabled ? (\n <FilledInput\n autoFocus\n onBlur={() => setEditing(false)}\n value={value}\n onChange={(e) => editValue(e.target.value)}\n onKeyUp={() => {}}\n inputProps={{\n type: 'number',\n step: step,\n min: min,\n ['aria-valuemin']: min,\n max: max,\n ['aria-valuemax']: max,\n ['aria-valuenow']: formattedValue,\n }}\n disableUnderline\n sx={sxOverride(\n (theme) => ({\n display: 'block',\n borderRadius: '4px',\n py: '1px', // pixel perfect matching design\n px: 1,\n border: 1,\n borderColor: 'onSurface.os500',\n '&&, &:hover': {\n backgroundColor: 'background.primary',\n },\n // input itself\n '& .MuiInputBase-input': {\n fieldSizing: 'content',\n textAlign: 'inherit',\n p: 0,\n // matching typography style with value\n ...theme.typography[restValue?.variant ?? 'disclaimer1'],\n },\n ...getFocusRingStyle(theme, false, 1, '&.Mui-focused'),\n '&&:before': {\n border: 'none',\n },\n }),\n inputSx,\n )}\n {...restInput}\n />\n ) : (\n value !== false && (\n <Typography\n variant=\"disclaimer1\"\n sx={sxOverride(\n {\n display: 'block',\n px: 1,\n whiteSpace: 'nowrap',\n color: (theme) => (theme.palette.mode === 'dark' ? 'onSurface.os200' : 'onSurface.os700'),\n // editable\n ...(setValue && {\n px: 1,\n py: '1px',\n border: 1,\n borderColor: 'onSurface.os500',\n borderRadius: '4px',\n }),\n },\n valueSx,\n )}\n {...(setValue && {\n // allow focus with keyboard navigation\n tabIndex: 0,\n onFocus: () => setEditing(true),\n })}\n {...restValue}\n >\n {formattedValue}\n </Typography>\n )\n )}\n </Box>\n );\n },\n);\n"],"names":["SliderValues","forwardRef","sx","children","value","valueProps","label","labelProps","valueLabelFormat","setValue","disabled","min","flowSlider","defaultProps","minLabel","minLabelProps","max","maxLabel","maxLabelProps","step","sliderValueProps","rawSliderValueProps","inputProps","rest","ref","_jsxs","Box","sxOverride","display","alignItems","justifyContent","gap","Array","isArray","_Fragment","_jsx","SliderValue","newValue","undefined","textAlign","labelSx","restLabel","valueSx","restValue","inputSx","restInput","editing","setEditing","useState","editValue","useCallback","inputValue","formattedValue","minWidth","pt","onClick","Typography","variant","color","theme","palette","mode","fontSize","xs","lineHeight","fontWeight","py","px","FilledInput","autoFocus","onBlur","onChange","e","target","onKeyUp","type","disableUnderline","borderRadius","border","borderColor","backgroundColor","fieldSizing","p","typography","getFocusRingStyle","whiteSpace","tabIndex","onFocus"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SliderValues.js","sources":["../../../src/materialui/slider/SliderValues.tsx"],"sourcesContent":["import React, { forwardRef, ElementType, ReactNode, useState, useCallback } from 'react';\nimport { Box, BoxProps, SliderProps, Typography, TypographyProps, FilledInput, FilledInputProps } from '@mui/material';\nimport { sxOverride } from '@/src/utils/sxOverride';\nimport { flowSlider } from '@/src/materialui/slider/slider.theme';\nimport { getFocusRingStyle } from '@/src/components/focusring/focusring';\n\nexport interface SliderValuesProps extends BoxProps<ElementType> {\n /**\n * The value of the slider\n */\n value: SliderProps['value'] | false;\n /**\n * Properties applied to value wrapper\n */\n valueProps?: TypographyProps<ElementType>;\n /**\n * Label show above value\n */\n label?: ReactNode;\n /**\n * Properties applied to label wrapper\n */\n labelProps?: TypographyProps<ElementType>;\n /**\n * The format function the value label's value\n */\n valueLabelFormat?: SliderProps['valueLabelFormat'];\n /**\n * Provide this function to allow changing the slider value with inputs\n */\n setValue?: (newValue: unknown) => void;\n /**\n * Disable editing\n */\n disabled?: boolean;\n /**\n * The minimum allowed value of the slider\n */\n min?: SliderProps['min'];\n /**\n * Text shown above min selected value\n */\n minLabel?: ReactNode;\n /**\n * Properties applied to label wrapper\n */\n minLabelProps?: TypographyProps<ElementType>;\n /**\n * The maximum allowed value of the slider\n */\n max?: SliderProps['max'];\n /**\n * Text shown above max selected value\n */\n maxLabel?: ReactNode;\n /**\n * Properties applied to label wrapper\n */\n maxLabelProps?: TypographyProps<ElementType>;\n /**\n * The granularity with which the slider can step through values\n */\n step?: SliderProps['step'];\n /**\n * Properties applied to the root wrapper of each SliderValue\n */\n sliderValueProps?: BoxProps<ElementType>;\n /**\n * Properties applied to SliderValue input field\n */\n inputProps?: FilledInputProps;\n}\n\n/**\n * Wrapper that render one or two SliderValue components based on the Slider type\n */\nexport const SliderValues: React.FC<SliderValuesProps> = forwardRef(\n (\n {\n sx,\n children,\n value,\n valueProps,\n label,\n labelProps,\n valueLabelFormat,\n setValue,\n disabled,\n min = flowSlider.defaultProps.min,\n minLabel,\n minLabelProps,\n max = flowSlider.defaultProps.max,\n maxLabel,\n maxLabelProps,\n step = flowSlider.defaultProps.step,\n sliderValueProps: rawSliderValueProps,\n inputProps,\n ...rest\n },\n ref,\n ) => {\n const sliderValueProps = {\n disabled,\n min,\n max,\n step,\n valueLabelFormat,\n valueProps,\n inputProps,\n ...rawSliderValueProps,\n };\n\n return (\n <Box\n ref={ref}\n sx={sxOverride({ display: 'flex', alignItems: 'flex-end', justifyContent: 'space-between', gap: 1 }, sx)}\n {...rest}\n >\n {Array.isArray(value) || (value === false && (minLabel || label) && maxLabel) ? (\n <>\n <SliderValue\n value={value !== false && value[0]}\n setValue={setValue ? (newValue) => setValue([newValue, value[1]]) : undefined}\n label={minLabel || label}\n labelProps={minLabelProps || labelProps}\n {...sliderValueProps}\n max={value[1]}\n index={0}\n />\n <SliderValue\n value={value !== false && value[1]}\n setValue={setValue ? (newValue) => setValue([value[0], newValue]) : undefined}\n label={maxLabel}\n labelProps={maxLabelProps}\n {...sliderValueProps}\n min={value[0]}\n index={1}\n sx={sxOverride({ textAlign: 'right' }, sliderValueProps?.sx)}\n />\n </>\n ) : (\n <SliderValue value={value} setValue={setValue} label={label} labelProps={labelProps} {...sliderValueProps} />\n )}\n {children}\n </Box>\n );\n },\n);\n\nexport interface SliderValueProps extends Omit<\n SliderValuesProps,\n 'value' | 'minLabel' | 'minLabelProps' | 'maxLabel' | 'maxLabelProps'\n> {\n /**\n * The single value of the slider\n */\n value: number | false;\n /**\n * The single setValue for the slider value\n */\n setValue?: (newValue: number) => void;\n /**\n * Index of the thumb this value represents, forwarded as the second argument to `valueLabelFormat`\n * @default 0\n */\n index?: number;\n}\n\n/**\n * Display single value of slider, allows editing with input\n */\nexport const SliderValue: React.FC<SliderValueProps> = forwardRef(\n (\n {\n value,\n valueProps,\n label,\n labelProps,\n valueLabelFormat,\n setValue,\n min,\n max,\n step,\n index = 0,\n inputProps,\n disabled,\n sx,\n ...rest\n },\n ref,\n ) => {\n const { sx: labelSx, ...restLabel } = labelProps ?? {};\n const { sx: valueSx, ...restValue } = valueProps ?? {};\n const { sx: inputSx, ...restInput } = inputProps ?? {};\n const [editing, setEditing] = useState(false);\n const editValue = useCallback(\n (inputValue: string) => {\n const newValue = +(inputValue || 0);\n if (newValue < min) {\n setValue(min);\n } else if (newValue > max) {\n setValue(max);\n } else {\n setValue(newValue);\n }\n },\n [min, max, setValue],\n );\n const formattedValue = valueLabelFormat ? valueLabelFormat(value, index) : value;\n\n return (\n <Box\n ref={ref}\n sx={sxOverride({ minWidth: '82px', ...((!label || value === false) && { pt: 0.5 }) }, sx)}\n onClick={setValue && !disabled ? () => setEditing(true) : undefined}\n {...rest}\n >\n {label && (\n <Typography\n {...(value === false && {\n variant: 'disclaimer1',\n })}\n sx={sxOverride(\n {\n display: 'block',\n ...(value === false\n ? {\n color: (theme) => (theme.palette.mode === 'dark' ? 'onSurface.os200' : 'onSurface.os700'),\n }\n : {\n // os600 instead of Figma's os500 to pass A11y contrast\n color: (theme) => (theme.palette.mode === 'dark' ? 'onSurface.os300' : 'onSurface.os600'),\n fontSize: { xs: '12px' },\n lineHeight: { xs: '12px' },\n fontWeight: { xs: '400' },\n py: 0.5,\n px: 1,\n }),\n },\n labelSx,\n )}\n {...restLabel}\n >\n {label}\n </Typography>\n )}\n {editing && !disabled ? (\n <FilledInput\n autoFocus\n onBlur={() => setEditing(false)}\n value={value}\n onChange={(e) => editValue(e.target.value)}\n onKeyUp={() => {}}\n inputProps={{\n type: 'number',\n step: step,\n min: min,\n ['aria-valuemin']: min,\n max: max,\n ['aria-valuemax']: max,\n ['aria-valuenow']: formattedValue,\n }}\n disableUnderline\n sx={sxOverride(\n (theme) => ({\n display: 'block',\n borderRadius: '4px',\n py: '1px', // pixel perfect matching design\n px: 1,\n border: 1,\n borderColor: 'onSurface.os500',\n '&&, &:hover': {\n backgroundColor: 'background.primary',\n },\n // input itself\n '& .MuiInputBase-input': {\n fieldSizing: 'content',\n textAlign: 'inherit',\n p: 0,\n // matching typography style with value\n ...theme.typography[restValue?.variant ?? 'disclaimer1'],\n },\n ...getFocusRingStyle(theme, false, 1, '&.Mui-focused'),\n '&&:before': {\n border: 'none',\n },\n }),\n inputSx,\n )}\n {...restInput}\n />\n ) : (\n value !== false && (\n <Typography\n variant=\"disclaimer1\"\n sx={sxOverride(\n {\n display: 'block',\n px: 1,\n whiteSpace: 'nowrap',\n color: (theme) => (theme.palette.mode === 'dark' ? 'onSurface.os200' : 'onSurface.os700'),\n // editable\n ...(setValue && {\n px: 1,\n py: '1px',\n border: 1,\n borderColor: 'onSurface.os500',\n borderRadius: '4px',\n }),\n },\n valueSx,\n )}\n {...(setValue && {\n // allow focus with keyboard navigation\n tabIndex: 0,\n onFocus: () => setEditing(true),\n })}\n {...restValue}\n >\n {formattedValue}\n </Typography>\n )\n )}\n </Box>\n );\n },\n);\n"],"names":["SliderValues","forwardRef","sx","children","value","valueProps","label","labelProps","valueLabelFormat","setValue","disabled","min","flowSlider","defaultProps","minLabel","minLabelProps","max","maxLabel","maxLabelProps","step","sliderValueProps","rawSliderValueProps","inputProps","rest","ref","_jsxs","Box","sxOverride","display","alignItems","justifyContent","gap","Array","isArray","_Fragment","_jsx","SliderValue","newValue","undefined","index","textAlign","labelSx","restLabel","valueSx","restValue","inputSx","restInput","editing","setEditing","useState","editValue","useCallback","inputValue","formattedValue","minWidth","pt","onClick","Typography","variant","color","theme","palette","mode","fontSize","xs","lineHeight","fontWeight","py","px","FilledInput","autoFocus","onBlur","onChange","e","target","onKeyUp","type","disableUnderline","borderRadius","border","borderColor","backgroundColor","fieldSizing","p","typography","getFocusRingStyle","whiteSpace","tabIndex","onFocus"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as r,jsxs as o}from"react/jsx-runtime";import{useMemo as e,useRef as t}from"react";import{Box as n}from"@mui/material";import{CheckIcon as a}from"../../components/icon/stroke/CheckIcon.js";import{CloseIcon as i}from"../../components/icon/stroke/CloseIcon.js";const c={root:"FlowStepIcon-root",active:"FlowStepIcon-active",completed:"FlowStepIcon-completed",error:"FlowStepIcon-error",disabled:"FlowStepIcon-disabled"},d=({active:o,completed:t,error:n,ownerState:d})=>{const{disabled:p}=d??{},s=e(()=>n?i:t&&!o?a:null,[n,t,o]);return r(l,{className:[c.root,o&&c.active,t&&c.completed,n&&c.error,p&&c.disabled].filter(Boolean).join(" "),children:s&&r(s,{sx:{position:"absolute",fontSize:"inherit",color:"background.primary"}})})},l=({children:e,className:a,sx:i,...d})=>{const l=t(!1),p=t(a);return l.current||p.current===a||(l.current=!0),o(n,{sx:{display:"flex",height:"28px",width:"28px",alignItems:"center",justifyContent:"center",position:"relative",boxSizing:"border-box",fontSize:"16px","& .MuiSvgIcon-root":{zIndex:"5"},"@keyframes flowStepperActive":{"0%":{transform:"scale(1.5)",opacity:"0.8"},"100%":{transform:"scale(1)",opacity:"1"}},"@keyframes flowStepperCompleted":{"0%":{transform:"scale(.8)",opacity:"0.8"},"100%":{transform:"scale(1)",opacity:"1"}},[`& .${c.root}`]:{height:"100%",width:"100%",borderRadius:"40px",borderColor:"onSurface.os500",backgroundColor:"transparent",borderWidth:"2px",borderStyle:"solid",color:"transparent",minHeight:"20px",[`&.${c.completed}:not(.${c.active})`]:{color:"onSurface.os700",backgroundColor:r=>"dark"===r.palette.mode?"brand.secondary":"brand.primary",border:"none",height:"100%",width:"100%",animation:l.current?"flowStepperCompleted 0.4s":"none"},[`&.${c.error}, &.${c.error}.${c.completed}`]:{borderColor:"error.main",backgroundColor:"error.main"},[`&.${c.active}`]:{color:"onSurface.os700",height:"100%",width:"100%",marginRight:"0px",marginLeft:"0px",borderColor:r=>"dark"===r.palette.mode?"brand.secondary":"brand.primary","&::before":{content:'""',position:"absolute",borderRadius:"40px",backgroundColor:r=>"dark"===r.palette.mode?"brand.secondary":"brand.primary",inset:"5px",animation:l.current?"flowStepperActive 0.4s":"none",zIndex:"1"},[`&.${c.error}`]:{borderColor:"error.main","&::before":{backgroundColor:"transparent
|
|
1
|
+
import{jsx as r,jsxs as o}from"react/jsx-runtime";import{useMemo as e,useRef as t}from"react";import{Box as n}from"@mui/material";import{CheckIcon as a}from"../../components/icon/stroke/CheckIcon.js";import{CloseIcon as i}from"../../components/icon/stroke/CloseIcon.js";const c={root:"FlowStepIcon-root",active:"FlowStepIcon-active",completed:"FlowStepIcon-completed",error:"FlowStepIcon-error",disabled:"FlowStepIcon-disabled"},d=({active:o,completed:t,error:n,ownerState:d})=>{const{disabled:p}=d??{},s=e(()=>n?i:t&&!o?a:null,[n,t,o]);return r(l,{className:[c.root,o&&c.active,t&&c.completed,n&&c.error,p&&c.disabled].filter(Boolean).join(" "),children:s&&r(s,{sx:{position:"absolute",fontSize:"inherit",color:"background.primary"}})})},l=({children:e,className:a,sx:i,...d})=>{const l=t(!1),p=t(a);return l.current||p.current===a||(l.current=!0),o(n,{sx:{display:"flex",height:"28px",width:"28px",alignItems:"center",justifyContent:"center",position:"relative",boxSizing:"border-box",fontSize:"16px","& .MuiSvgIcon-root":{zIndex:"5"},"@keyframes flowStepperActive":{"0%":{transform:"scale(1.5)",opacity:"0.8"},"100%":{transform:"scale(1)",opacity:"1"}},"@keyframes flowStepperCompleted":{"0%":{transform:"scale(.8)",opacity:"0.8"},"100%":{transform:"scale(1)",opacity:"1"}},[`& .${c.root}`]:{height:"100%",width:"100%",borderRadius:"40px",borderColor:"onSurface.os500",backgroundColor:"transparent",borderWidth:"2px",borderStyle:"solid",color:"transparent",minHeight:"20px",[`&.${c.completed}:not(.${c.active})`]:{color:"onSurface.os700",backgroundColor:r=>"dark"===r.palette.mode?"brand.secondary":"brand.primary",border:"none",height:"100%",width:"100%",animation:l.current?"flowStepperCompleted 0.4s":"none"},[`&.${c.error}, &.${c.error}.${c.completed}`]:{borderColor:"error.main",backgroundColor:"error.main"},[`&.${c.active}`]:{color:"onSurface.os700",height:"100%",width:"100%",marginRight:"0px",marginLeft:"0px",borderColor:r=>"dark"===r.palette.mode?"brand.secondary":"brand.primary","&::before":{content:'""',position:"absolute",borderRadius:"40px",backgroundColor:r=>"dark"===r.palette.mode?"brand.secondary":"brand.primary",inset:"5px",animation:l.current?"flowStepperActive 0.4s":"none",zIndex:"1"},[`&.${c.error}`]:{borderColor:"error.main","&::before":{backgroundColor:"transparent",border:3,inset:"2px",borderColor:"background.primary"}}}},...i},...d,children:[e,r(n,{className:a})]})};export{d as FlowStepLabelIcon,c as flowStepIconClasses};
|
|
2
2
|
//# sourceMappingURL=StepLabelIcon.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StepLabelIcon.js","sources":["../../../src/materialui/stepper/StepLabelIcon.tsx"],"sourcesContent":["import { useMemo, useRef } from 'react';\nimport { Box, BoxProps } from '@mui/material';\nimport { CheckIcon } from '@/src/components/icon/stroke/CheckIcon';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\n\nexport const flowStepIconClasses = {\n root: 'FlowStepIcon-root',\n active: 'FlowStepIcon-active',\n completed: 'FlowStepIcon-completed',\n error: 'FlowStepIcon-error',\n disabled: 'FlowStepIcon-disabled',\n};\n\nexport const FlowStepLabelIcon = ({ active, completed, error, ownerState }) => {\n const { disabled } = ownerState ?? {};\n // obtain icon based on the state\n const IconComponent = useMemo(() => {\n if (error) {\n return CloseIcon;\n } else if (completed && !active) {\n return CheckIcon;\n } else {\n return null;\n }\n }, [error, completed, active]);\n\n return (\n <FlowStepIconRoot\n className={[\n flowStepIconClasses.root,\n active && flowStepIconClasses.active,\n completed && flowStepIconClasses.completed,\n error && flowStepIconClasses.error,\n disabled && flowStepIconClasses.disabled,\n ]\n .filter(Boolean)\n .join(' ')}\n >\n {IconComponent && (\n <IconComponent\n sx={{\n position: 'absolute',\n fontSize: 'inherit',\n color: 'background.primary',\n }}\n />\n )}\n </FlowStepIconRoot>\n );\n};\n\nconst FlowStepIconRoot = ({ children, className, sx, ...restProps }: BoxProps) => {\n // during first render (and first state) do not play animation\n const animation = useRef(false);\n const initialClassName = useRef(className);\n if (!animation.current && initialClassName.current !== className) {\n animation.current = true;\n }\n\n return (\n <Box\n sx={{\n display: 'flex',\n height: '28px',\n width: '28px',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n boxSizing: 'border-box',\n fontSize: '16px',\n '& .MuiSvgIcon-root': {\n zIndex: '5',\n },\n [`@keyframes flowStepperActive`]: {\n '0%': {\n transform: 'scale(1.5)',\n opacity: '0.8',\n },\n '100%': {\n transform: 'scale(1)',\n opacity: '1',\n },\n },\n [`@keyframes flowStepperCompleted`]: {\n '0%': {\n transform: 'scale(.8)',\n opacity: '0.8',\n },\n '100%': {\n transform: 'scale(1)',\n opacity: '1',\n },\n },\n // style is also applied in stepButton.theme.ts\n [`& .${flowStepIconClasses.root}`]: {\n height: '100%',\n width: '100%',\n borderRadius: '40px',\n borderColor: 'onSurface.os500',\n backgroundColor: 'transparent',\n borderWidth: '2px',\n borderStyle: 'solid',\n color: 'transparent',\n minHeight: '20px',\n // completed\n [`&.${flowStepIconClasses.completed}:not(.${flowStepIconClasses.active})`]: {\n color: 'onSurface.os700',\n backgroundColor: (theme) => (theme.palette.mode === 'dark' ? 'brand.secondary' : 'brand.primary'),\n border: 'none',\n height: '100%',\n width: '100%',\n animation: animation.current ? 'flowStepperCompleted 0.4s' : 'none',\n },\n // error\n [`&.${flowStepIconClasses.error}, &.${flowStepIconClasses.error}.${flowStepIconClasses.completed}`]: {\n borderColor: 'error.main',\n backgroundColor: 'error.main',\n },\n // disabled style is applied from stepper.theme.ts as it has to be applied only for the non-linear variant\n // active\n [`&.${flowStepIconClasses.active}`]: {\n color: 'onSurface.os700',\n height: '100%',\n width: '100%',\n marginRight: '0px',\n marginLeft: '0px',\n borderColor: (theme) => (theme.palette.mode === 'dark' ? 'brand.secondary' : 'brand.primary'),\n '&::before': {\n content: '\"\"',\n position: 'absolute',\n borderRadius: '40px',\n backgroundColor: (theme) => (theme.palette.mode === 'dark' ? 'brand.secondary' : 'brand.primary'),\n inset: '5px',\n animation: animation.current ? 'flowStepperActive 0.4s' : 'none',\n zIndex: '1',\n },\n [`&.${flowStepIconClasses.error}`]: {\n borderColor: 'error.main',\n '&::before': {\n backgroundColor: 'transparent
|
|
1
|
+
{"version":3,"file":"StepLabelIcon.js","sources":["../../../src/materialui/stepper/StepLabelIcon.tsx"],"sourcesContent":["import { useMemo, useRef } from 'react';\nimport { Box, BoxProps } from '@mui/material';\nimport { CheckIcon } from '@/src/components/icon/stroke/CheckIcon';\nimport { CloseIcon } from '@/src/components/icon/stroke/CloseIcon';\n\nexport const flowStepIconClasses = {\n root: 'FlowStepIcon-root',\n active: 'FlowStepIcon-active',\n completed: 'FlowStepIcon-completed',\n error: 'FlowStepIcon-error',\n disabled: 'FlowStepIcon-disabled',\n};\n\nexport const FlowStepLabelIcon = ({ active, completed, error, ownerState }) => {\n const { disabled } = ownerState ?? {};\n // obtain icon based on the state\n const IconComponent = useMemo(() => {\n if (error) {\n return CloseIcon;\n } else if (completed && !active) {\n return CheckIcon;\n } else {\n return null;\n }\n }, [error, completed, active]);\n\n return (\n <FlowStepIconRoot\n className={[\n flowStepIconClasses.root,\n active && flowStepIconClasses.active,\n completed && flowStepIconClasses.completed,\n error && flowStepIconClasses.error,\n disabled && flowStepIconClasses.disabled,\n ]\n .filter(Boolean)\n .join(' ')}\n >\n {IconComponent && (\n <IconComponent\n sx={{\n position: 'absolute',\n fontSize: 'inherit',\n color: 'background.primary',\n }}\n />\n )}\n </FlowStepIconRoot>\n );\n};\n\nconst FlowStepIconRoot = ({ children, className, sx, ...restProps }: BoxProps) => {\n // during first render (and first state) do not play animation\n const animation = useRef(false);\n const initialClassName = useRef(className);\n if (!animation.current && initialClassName.current !== className) {\n animation.current = true;\n }\n\n return (\n <Box\n sx={{\n display: 'flex',\n height: '28px',\n width: '28px',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n boxSizing: 'border-box',\n fontSize: '16px',\n '& .MuiSvgIcon-root': {\n zIndex: '5',\n },\n [`@keyframes flowStepperActive`]: {\n '0%': {\n transform: 'scale(1.5)',\n opacity: '0.8',\n },\n '100%': {\n transform: 'scale(1)',\n opacity: '1',\n },\n },\n [`@keyframes flowStepperCompleted`]: {\n '0%': {\n transform: 'scale(.8)',\n opacity: '0.8',\n },\n '100%': {\n transform: 'scale(1)',\n opacity: '1',\n },\n },\n // style is also applied in stepButton.theme.ts\n [`& .${flowStepIconClasses.root}`]: {\n height: '100%',\n width: '100%',\n borderRadius: '40px',\n borderColor: 'onSurface.os500',\n backgroundColor: 'transparent',\n borderWidth: '2px',\n borderStyle: 'solid',\n color: 'transparent',\n minHeight: '20px',\n // completed\n [`&.${flowStepIconClasses.completed}:not(.${flowStepIconClasses.active})`]: {\n color: 'onSurface.os700',\n backgroundColor: (theme) => (theme.palette.mode === 'dark' ? 'brand.secondary' : 'brand.primary'),\n border: 'none',\n height: '100%',\n width: '100%',\n animation: animation.current ? 'flowStepperCompleted 0.4s' : 'none',\n },\n // error\n [`&.${flowStepIconClasses.error}, &.${flowStepIconClasses.error}.${flowStepIconClasses.completed}`]: {\n borderColor: 'error.main',\n backgroundColor: 'error.main',\n },\n // disabled style is applied from stepper.theme.ts as it has to be applied only for the non-linear variant\n // active\n [`&.${flowStepIconClasses.active}`]: {\n color: 'onSurface.os700',\n height: '100%',\n width: '100%',\n marginRight: '0px',\n marginLeft: '0px',\n borderColor: (theme) => (theme.palette.mode === 'dark' ? 'brand.secondary' : 'brand.primary'),\n '&::before': {\n content: '\"\"',\n position: 'absolute',\n borderRadius: '40px',\n backgroundColor: (theme) => (theme.palette.mode === 'dark' ? 'brand.secondary' : 'brand.primary'),\n inset: '5px',\n animation: animation.current ? 'flowStepperActive 0.4s' : 'none',\n zIndex: '1',\n },\n [`&.${flowStepIconClasses.error}`]: {\n borderColor: 'error.main',\n '&::before': {\n backgroundColor: 'transparent',\n border: 3,\n inset: '2px',\n borderColor: 'background.primary',\n },\n },\n },\n },\n ...sx,\n }}\n {...restProps}\n >\n {children}\n <Box className={className} />\n </Box>\n );\n};\n"],"names":["flowStepIconClasses","root","active","completed","error","disabled","FlowStepLabelIcon","ownerState","IconComponent","useMemo","CloseIcon","CheckIcon","_jsx","FlowStepIconRoot","className","filter","Boolean","join","children","sx","position","fontSize","color","restProps","animation","useRef","initialClassName","current","_jsxs","Box","display","height","width","alignItems","justifyContent","boxSizing","zIndex","transform","opacity","borderRadius","borderColor","backgroundColor","borderWidth","borderStyle","minHeight","theme","palette","mode","border","marginRight","marginLeft","content","inset"],"mappings":"8QAKO,MAAMA,EAAsB,CACjCC,KAAM,oBACNC,OAAQ,sBACRC,UAAW,yBACXC,MAAO,qBACPC,SAAU,yBAGCC,EAAoB,EAAGJ,SAAQC,YAAWC,QAAOG,iBAC5D,MAAMF,SAAEA,GAAaE,GAAc,CAAA,EAE7BC,EAAgBC,EAAQ,IACxBL,EACKM,EACEP,IAAcD,EAChBS,EAEA,KAER,CAACP,EAAOD,EAAWD,IAEtB,OACEU,EAACC,EAAgB,CACfC,UAAW,CACTd,EAAoBC,KACpBC,GAAUF,EAAoBE,OAC9BC,GAAaH,EAAoBG,UACjCC,GAASJ,EAAoBI,MAC7BC,GAAYL,EAAoBK,UAE/BU,OAAOC,SACPC,KAAK,KAAIC,SAEXV,GACCI,EAACJ,EAAa,CACZW,GAAI,CACFC,SAAU,WACVC,SAAU,UACVC,MAAO,2BAQbT,EAAmB,EAAGK,WAAUJ,YAAWK,QAAOI,MAEtD,MAAMC,EAAYC,GAAO,GACnBC,EAAmBD,EAAOX,GAKhC,OAJKU,EAAUG,SAAWD,EAAiBC,UAAYb,IACrDU,EAAUG,SAAU,GAIpBC,EAACC,EAAG,CACFV,GAAI,CACFW,QAAS,OACTC,OAAQ,OACRC,MAAO,OACPC,WAAY,SACZC,eAAgB,SAChBd,SAAU,WACVe,UAAW,aACXd,SAAU,OACV,qBAAsB,CACpBe,OAAQ,KAEV,+BAAkC,CAChC,KAAM,CACJC,UAAW,aACXC,QAAS,OAEX,OAAQ,CACND,UAAW,WACXC,QAAS,MAGb,kCAAqC,CACnC,KAAM,CACJD,UAAW,YACXC,QAAS,OAEX,OAAQ,CACND,UAAW,WACXC,QAAS,MAIb,CAAC,MAAMtC,EAAoBC,QAAS,CAClC8B,OAAQ,OACRC,MAAO,OACPO,aAAc,OACdC,YAAa,kBACbC,gBAAiB,cACjBC,YAAa,MACbC,YAAa,QACbrB,MAAO,cACPsB,UAAW,OAEX,CAAC,KAAK5C,EAAoBG,kBAAkBH,EAAoBE,WAAY,CAC1EoB,MAAO,kBACPmB,gBAAkBI,GAAkC,SAAvBA,EAAMC,QAAQC,KAAkB,kBAAoB,gBACjFC,OAAQ,OACRjB,OAAQ,OACRC,MAAO,OACPR,UAAWA,EAAUG,QAAU,4BAA8B,QAG/D,CAAC,KAAK3B,EAAoBI,YAAYJ,EAAoBI,SAASJ,EAAoBG,aAAc,CACnGqC,YAAa,aACbC,gBAAiB,cAInB,CAAC,KAAKzC,EAAoBE,UAAW,CACnCoB,MAAO,kBACPS,OAAQ,OACRC,MAAO,OACPiB,YAAa,MACbC,WAAY,MACZV,YAAcK,GAAkC,SAAvBA,EAAMC,QAAQC,KAAkB,kBAAoB,gBAC7E,YAAa,CACXI,QAAS,KACT/B,SAAU,WACVmB,aAAc,OACdE,gBAAkBI,GAAkC,SAAvBA,EAAMC,QAAQC,KAAkB,kBAAoB,gBACjFK,MAAO,MACP5B,UAAWA,EAAUG,QAAU,yBAA2B,OAC1DS,OAAQ,KAEV,CAAC,KAAKpC,EAAoBI,SAAU,CAClCoC,YAAa,aACb,YAAa,CACXC,gBAAiB,cACjBO,OAAQ,EACRI,MAAO,MACPZ,YAAa,4BAKlBrB,MAEDI,EAASL,SAAA,CAEZA,EACDN,EAACiB,EAAG,CAACf,UAAWA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const ActionsTable: () => import("react
|
|
1
|
+
export declare const ActionsTable: () => import("react").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const BasicTable: () => import("react
|
|
1
|
+
export declare const BasicTable: () => import("react").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const InteractiveTable: () => import("react
|
|
1
|
+
export declare const InteractiveTable: () => import("react").JSX.Element;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export declare const PaginationTable: () => import("react
|
|
2
|
-
export declare const SimplePaginationDemo: () => import("react
|
|
3
|
-
export declare const ChevronsPaginationDemo: () => import("react
|
|
1
|
+
export declare const PaginationTable: () => import("react").JSX.Element;
|
|
2
|
+
export declare const SimplePaginationDemo: () => import("react").JSX.Element;
|
|
3
|
+
export declare const ChevronsPaginationDemo: () => import("react").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const ScrollbarTable: () => import("react
|
|
1
|
+
export declare const ScrollbarTable: () => import("react").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const SelectSortTable: () => import("react
|
|
1
|
+
export declare const SelectSortTable: () => import("react").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const SmallTable: () => import("react
|
|
1
|
+
export declare const SmallTable: () => import("react").JSX.Element;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as t,Fragment as e,jsx as o}from"react/jsx-runtime";import{Box as n}from"@mui/material";import{ArrowLeftIcon as i}from"../../components/icon/stroke/ArrowLeftIcon.js";import{ArrowRightIcon as r}from"../../components/icon/stroke/ArrowRightIcon.js";import{ChevronPreviousIcon as s}from"../../components/icon/stroke/ChevronPreviousIcon.js";import{ChevronNextIcon as a}from"../../components/icon/stroke/ChevronNextIcon.js";import{getFocusRingStyle as p}from"../../components/focusring/focusring.js";const m={defaultProps:{showFirstButton:!1,showLastButton:!1,labelDisplayedRows:({from:i,to:r,count:s,page:a})=>t(e,{children:[o(n,{component:"strong",children:a+1}),o(n,{component:"span",className:"divider",children:" / "}),o(n,{component:"span",children:Math.ceil(s/(a>=1?(i-1)/a:r-i+1))||1})]}),slots:{actions:{previousButtonIcon:i,nextButtonIcon:r,firstButtonIcon:s,lastButtonIcon:a}},slotProps:{actions:{previousButton:{size:"medium",className:"MuiTablePagination-actions-previous"},nextButton:{size:"medium",className:"MuiTablePagination-actions-next"},firstButton:{size:"medium"},lastButton:{size:"medium"}}}},styleOverrides:{root:({theme:t})=>({border:`1px solid ${t.palette.surface.secondary}`,borderRadius:"8px","&td":{border:"none",borderRadius:"0"}}),toolbar:({theme:t})=>({position:"relative",justifyContent:"center",[t.breakpoints.up("md")]:{minHeight:"80px",padding:"4px 24px"},[t.breakpoints.down("md")]:{flexWrap:"wrap",minHeight:"0",padding:"8px 16px"}}),spacer:({theme:t})=>({flexGrow:"1",flexBasis:"auto",...t.typography.body,[t.breakpoints.down("sm")]:{flexBasis:"100%",textAlign:"center"}}),selectLabel:{margin:"0"},input:({theme:t})=>({margin:"0",padding:"0",borderRadius:"4px",...t.typography.body,...p(t,!1,"0px","&.Mui-focused"),[t.breakpoints.up("xs")]:{fontWeight:"700"},"&& .MuiSelect-select":{padding:"4px 26px 4px 4px"}}),displayedRows:({theme:t,ownerState:e})=>({position:"absolute",right:24+(e.showLastButton?88:44)+"px",width:"90px",textAlign:"center",whiteSpace:"nowrap",height:"44px",display:"flex",alignItems:"center",justifyContent:"center",margin:"0",color:"dark"===t.palette.mode?t.palette.onSurface.os300:t.palette.onSurface.os700,strong:{color:t.palette.text.primary},".divider":{fontWeight:"400",margin:"0 4px"},[t.breakpoints.down("md")]:{bottom:"8px",right:"0",left:"0",margin:"0 auto"}}),actions:({theme:t})=>({margin:"0",display:"flex",alignItems:"center",justifyContent:"flex-end",flexGrow:"1","& .MuiTablePagination-actions-next":{marginLeft:"90px"},[t.breakpoints.down("md")]:{flexBasis:"100%",justifyContent:"center"}})}};export{m as flowTablePagination};
|
|
1
|
+
import{jsxs as t,Fragment as e,jsx as o}from"react/jsx-runtime";import{Box as n}from"@mui/material";import{ArrowLeftIcon as i}from"../../components/icon/stroke/ArrowLeftIcon.js";import{ArrowRightIcon as r}from"../../components/icon/stroke/ArrowRightIcon.js";import{ChevronPreviousIcon as s}from"../../components/icon/stroke/ChevronPreviousIcon.js";import{ChevronNextIcon as a}from"../../components/icon/stroke/ChevronNextIcon.js";import{getFocusRingStyle as p}from"../../components/focusring/focusring.js";const m={defaultProps:{showFirstButton:!1,showLastButton:!1,labelDisplayedRows:({from:i,to:r,count:s,page:a})=>t(e,{children:[o(n,{component:"strong",children:a+1}),o(n,{component:"span",className:"divider",children:" / "}),o(n,{component:"span",children:Math.ceil(s/(a>=1?(i-1)/a:r-i+1))||1})]}),slots:{actions:{previousButtonIcon:i,nextButtonIcon:r,firstButtonIcon:s,lastButtonIcon:a}},slotProps:{actions:{previousButton:{size:"medium",className:"MuiTablePagination-actions-previous"},nextButton:{size:"medium",className:"MuiTablePagination-actions-next"},firstButton:{size:"medium"},lastButton:{size:"medium"}}}},styleOverrides:{root:({theme:t})=>({border:`1px solid ${t.palette.surface.secondary}`,borderRadius:"8px","&td":{border:"none",borderRadius:"0"}}),toolbar:({theme:t})=>({position:"relative",justifyContent:"center",[t.breakpoints.up("md")]:{minHeight:"80px",padding:"4px 24px"},[t.breakpoints.down("md")]:{flexWrap:"wrap",minHeight:"0",padding:"8px 16px"}}),spacer:({theme:t})=>({flexGrow:"1",flexBasis:"auto",...t.typography.body,[t.breakpoints.down("sm")]:{flexBasis:"100%",textAlign:"center"}}),selectLabel:{margin:"0"},input:({theme:t})=>({margin:"0",padding:"0",borderRadius:"4px",...t.typography.body,...p(t,!1,"0px","&.Mui-focused"),[t.breakpoints.up("xs")]:{fontWeight:"700"},"&& .MuiSelect-select":{padding:"4px 26px 4px 4px"}}),displayedRows:({theme:t,ownerState:e})=>({position:"absolute",right:24+(e.showLastButton?88:44)+"px",width:"90px",textAlign:"center",whiteSpace:"nowrap",height:"44px",display:"flex",alignItems:"center",justifyContent:"center",margin:"0",color:"dark"===t.palette.mode?t.palette.onSurface.os300:t.palette.onSurface.os700,strong:{color:t.palette.text.primary},".divider":{fontWeight:"400",margin:"0 4px"},[t.breakpoints.down("md")]:{bottom:"8px",right:"0",left:"0",margin:"0 auto"}}),actions:({theme:t})=>({margin:"0",display:"flex",alignItems:"center",justifyContent:"flex-end",flexGrow:"1","& .MuiTablePagination-actions-next":{..."rtl"===t.direction?{marginRight:"90px"}:{marginLeft:"90px"}},[t.breakpoints.down("md")]:{flexBasis:"100%",justifyContent:"center"}})}};export{m as flowTablePagination};
|
|
2
2
|
//# sourceMappingURL=tablePagination.theme.js.map
|