npm - @gen-epix/ui-core-components - Versions diffs - 4.3.1 → 4.4.1 - Mend

@gen-epix/ui-core-components 4.3.1 → 4.4.1

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

Files changed (21) hide show

package/dist/components/NestedMenu/NestedDropdown.d.ts CHANGED Viewed

@@ -2,7 +2,7 @@ import { ButtonProps } from '@mui/material/Button';
 import { MenuProps } from '@mui/material/Menu';
 import { MouseEvent, ReactNode, Ref } from 'react';
 import { BoxProps } from '@mui/material';
-import { MenuItemData } from '../../models/nestedMenu';
+import { MenuItemData } from '../../models/nested-menu.models';
 interface NestedDropdownProps {
     readonly ButtonProps?: Partial<ButtonProps>;
     readonly children?: ReactNode;

package/dist/components/NestedMenu/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/NestedMenu/IconMenuItem.tsx","../../../src/components/NestedMenu/NestedMenuItem.tsx","../../../src/components/NestedMenu/nestedMenuItemsFromObject.tsx","../../../src/components/NestedMenu/NestedDropdown.tsx"],"sourcesContent":["import type { MenuItemProps } from '@mui/material/MenuItem';\nimport MenuItem from '@mui/material/MenuItem';\nimport { styled } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\nimport { Box } from '@mui/material';\nimport type { SxProps } from '@mui/material';\nimport type {\n MouseEvent,\n ReactNode,\n Ref,\n} from 'react';\n\nconst StyledMenuItem = styled(MenuItem)({\n display: 'flex',\n justifyContent: 'space-between',\n paddingLeft: '4px',\n paddingRight: '4px',\n});\n\nconst StyledTypography = styled(Typography)({\n paddingLeft: '8px',\n paddingRight: '8px',\n textAlign: 'left',\n});\n\nconst FlexBox = styled(Box)({\n display: 'flex',\n});\n\ntype IconMenuItemProps = {\n readonly checked?: 'false' \| 'mixed' \| 'true';\n readonly className?: string;\n readonly disabled?: boolean;\n readonly divider?: boolean;\n readonly label?: string;\n readonly leftIcon?: ReactNode;\n // eslint-disable-next-line @typescript-eslint/naming-convention\n readonly MenuItemProps?: MenuItemProps;\n readonly onClick?: (event: MouseEvent<HTMLElement>) => void;\n readonly ref?: Ref<HTMLLIElement>;\n readonly rightIcon?: ReactNode;\n readonly sx?: SxProps;\n};\n\nexport const IconMenuItem = ({ checked, className, label, leftIcon, MenuItemProps, ref, rightIcon, ...props }: IconMenuItemProps) => {\n return (\n <StyledMenuItem\n {...MenuItemProps}\n className={className}\n ref={ref}\n {...props}\n aria-checked={checked}\n role={checked ? 'menuitemcheckbox' : 'menuitem'}\n >\n <FlexBox>\n {leftIcon}\n <StyledTypography>\n {label}\n </StyledTypography>\n </FlexBox>\n {rightIcon}\n </StyledMenuItem>\n );\n};\n","import type { MenuProps } from '@mui/material/Menu';\nimport Menu from '@mui/material/Menu';\nimport type { MenuItemProps } from '@mui/material/MenuItem';\nimport ChevronRightIcon from '@mui/icons-material/ChevronRight';\nimport type {\n ElementType,\n FocusEvent,\n HTMLAttributes,\n KeyboardEvent,\n MouseEvent,\n ReactNode,\n Ref,\n} from 'react';\nimport {\n useCallback,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react';\nimport type { PopoverOrigin } from '@mui/material';\nimport { Box } from '@mui/material';\n\nimport { IconMenuItem } from './IconMenuItem';\n\ntype Origins = {\n anchor: PopoverOrigin;\n transform: PopoverOrigin;\n};\n\nconst rightOrigins: Origins = {\n anchor: {\n horizontal: 'right',\n vertical: 'top',\n },\n transform: {\n horizontal: 'left',\n vertical: 'top',\n },\n};\n\nconst leftOrigins: Origins = {\n anchor: {\n horizontal: 'left',\n vertical: 'top',\n },\n transform: {\n horizontal: 'right',\n vertical: 'top',\n },\n};\n\nexport type NestedMenuItemProps = {\n readonly active?: boolean;\n readonly button?: true;\n readonly callback?: () => void;\n readonly checked?: 'false' \| 'mixed' \| 'true';\n readonly children?: ReactNode;\n readonly className?: string;\n readonly component?: ElementType;\n // eslint-disable-next-line @typescript-eslint/naming-convention\n readonly ContainerProps?: HTMLAttributes<HTMLElement>;\n readonly disabled?: boolean;\n readonly label?: string;\n readonly leftIcon?: ReactNode;\n // eslint-disable-next-line @typescript-eslint/naming-convention\n readonly MenuProps?: Partial<Omit<MenuProps, 'children'>>;\n readonly parentMenuOpen: boolean;\n readonly ref?: Ref<HTMLLIElement>;\n readonly rightIcon?: ReactNode;\n readonly tabIndex?: number;\n} & Omit<MenuItemProps, 'button'>;\n\nexport const NestedMenuItem = ({ ref, ...props }: NestedMenuItemProps) => {\n const menuItemRef = useRef<HTMLLIElement>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n const menuContainerRef = useRef<HTMLDivElement>(null);\n const [anchorEl, setAnchorEl] = useState<HTMLLIElement \| null>(null);\n const [isSubMenuOpen, setIsSubMenuOpen] = useState(false);\n const [origins, setOrigins] = useState<Origins>(rightOrigins);\n\n const {\n callback,\n checked,\n children,\n className,\n ContainerProps = {},\n label,\n leftIcon = null,\n MenuProps,\n parentMenuOpen,\n rightIcon = <ChevronRightIcon />,\n tabIndex: tabIndexProp,\n ...MenuItemProps\n } = props;\n\n useImperativeHandle(ref, () => menuItemRef.current);\n\n const setMenuItemNode = useCallback((node: HTMLLIElement \| null): void => {\n menuItemRef.current = node;\n setAnchorEl(node);\n }, []);\n\n const onIconMenuItemClick = useCallback((): void => {\n if (callback) {\n callback();\n }\n }, [callback]);\n\n const onMouseEnter = useCallback((e: MouseEvent<HTMLElement>): void => {\n setIsSubMenuOpen(true);\n\n if (ContainerProps.onMouseEnter) {\n ContainerProps.onMouseEnter(e);\n }\n }, [ContainerProps]);\n\n const onMouseLeave = useCallback((e: MouseEvent<HTMLElement>): void => {\n setIsSubMenuOpen(false);\n\n if (ContainerProps.onMouseLeave) {\n ContainerProps.onMouseLeave(e);\n }\n }, [ContainerProps]);\n\n const onMenuClose = useCallback((): void => {\n setIsSubMenuOpen(false);\n }, []);\n\n // Check if any immediate children are active\n const isSubmenuFocused = useCallback(() => {\n const isActive = containerRef.current?.ownerDocument.activeElement ?? null;\n\n if (menuContainerRef.current?.children) {\n for (const child of menuContainerRef.current.children) {\n if (child === isActive) {\n return true;\n }\n }\n }\n\n return false;\n }, []);\n\n const onFocus = useCallback((e: FocusEvent<HTMLElement>) => {\n if (e.target === containerRef.current) {\n setIsSubMenuOpen(true);\n }\n\n if (ContainerProps.onFocus) {\n ContainerProps.onFocus(e);\n }\n }, [ContainerProps]);\n\n const onBlur = useCallback(() => {\n setTimeout(() => {\n if (!isSubmenuFocused()) {\n setIsSubMenuOpen(false);\n }\n });\n }, [isSubmenuFocused]);\n\n const onKeyDown = useCallback((e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n return;\n }\n\n if (isSubmenuFocused()) {\n e.stopPropagation();\n }\n\n const isActive = containerRef.current?.ownerDocument.activeElement;\n\n // if pressing enter key, run callback\n if (e.key === 'Enter' && e.target === containerRef.current && callback) {\n callback();\n }\n\n if (e.key === 'ArrowLeft' && isSubmenuFocused()) {\n containerRef.current?.focus();\n }\n\n if (e.key === 'ArrowRight' && e.target === containerRef.current && e.target === isActive) {\n const firstChild = menuContainerRef.current?.children[0] as HTMLDivElement;\n firstChild?.focus();\n }\n }, [callback, isSubmenuFocused]);\n\n const open = isSubMenuOpen && parentMenuOpen;\n\n const menuRef = useCallback((node: HTMLElement \| null) => {\n const menuItem = menuItemRef.current;\n\n if (node === null \|\| menuItem === null) {\n return;\n }\n\n const subMenuWidth = menuContainerRef.current?.clientWidth ?? 0;\n const { width, x } = menuItem.getBoundingClientRect();\n const bodyWidth = document.body.clientWidth;\n\n setOrigins(x + width + subMenuWidth > bodyWidth ? leftOrigins : rightOrigins);\n }, []);\n\n // Root element must have a `tabIndex` attribute for keyboard navigation\n let tabIndex;\n if (!props.disabled) {\n tabIndex = tabIndexProp ?? -1;\n }\n\n return (\n <Box\n {...ContainerProps}\n onBlur={onBlur}\n onFocus={onFocus}\n onKeyDown={onKeyDown}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n ref={containerRef}\n tabIndex={tabIndex}\n >\n\n <IconMenuItem\n checked={checked}\n className={className}\n label={label}\n leftIcon={leftIcon}\n MenuItemProps={MenuItemProps}\n onClick={onIconMenuItemClick}\n ref={setMenuItemNode}\n rightIcon={rightIcon}\n />\n <Menu\n // from capturing events for clicks and hovers\n\n anchorEl={anchorEl}\n anchorOrigin={origins.anchor}\n // eslint-disable-next-line jsx-a11y/no-autofocus\n autoFocus={false}\n disableAutoFocus\n disableEnforceFocus\n onClose={onMenuClose}\n open={open}\n ref={menuRef}\n // Set pointer events to 'none' to prevent the invisible Popover div\n sx={{\n pointerEvents: 'none',\n }}\n transformOrigin={origins.transform}\n {...MenuProps}\n >\n <Box\n ref={menuContainerRef}\n sx={{ pointerEvents: 'auto' }}\n >\n {children}\n </Box>\n </Menu>\n\n </Box>\n );\n};\n","import { Tooltip } from '@mui/material';\n\nimport type { MenuItemData } from '../../models/nestedMenu';\n\nimport { IconMenuItem } from './IconMenuItem';\nimport { NestedMenuItem } from './NestedMenuItem';\n\nexport interface NestedMenuItemsFromObjectProps {\n handleClose: () => void;\n isOpen: boolean;\n menuItemsData: MenuItemData[];\n}\n\n/*\n Create a JSX element with nested elements creating a nested menu.\n * Every menu item should have a uid provided\n /\nexport const nestedMenuItemsFromObject = ({\n handleClose,\n isOpen,\n menuItemsData: items,\n}: NestedMenuItemsFromObjectProps) => {\n return items.map((item) => {\n const { active, autoCloseDisabled, callback, checked, disabled, divider, items: menuItemsData, label, leftIcon, rightIcon, sx, tooltip } = item;\n if (!disabled && menuItemsData && menuItemsData.length > 0) {\n return (\n <Tooltip\n arrow\n key={label}\n placement={'right'}\n title={undefined}\n >\n <NestedMenuItem\n callback={callback}\n checked={checked}\n disabled={disabled}\n key={label}\n label={label}\n leftIcon={leftIcon}\n parentMenuOpen={isOpen}\n rightIcon={rightIcon}\n sx={{\n ...(sx \|\| {}),\n '& p': {\n fontWeight: active ? 700 : undefined,\n },\n }}\n >\n {/ Call this function to nest more items */}\n {nestedMenuItemsFromObject({\n handleClose,\n isOpen,\n menuItemsData,\n })}\n </NestedMenuItem>\n </Tooltip>\n );\n }\n\n const iconMenuItem = (\n <IconMenuItem\n checked={checked}\n disabled={disabled}\n divider={divider}\n key={label}\n label={label}\n leftIcon={leftIcon}\n // eslint-disable-next-line @eslint-react/kit/jsx-no-bind\n onClick={() => {\n if (!autoCloseDisabled) {\n handleClose();\n }\n if (callback) {\n callback();\n }\n }}\n rightIcon={rightIcon}\n sx={{\n ...(sx \|\| {}),\n '& p': {\n fontWeight: active ? 700 : undefined,\n },\n }}\n />\n );\n if (disabled) {\n return iconMenuItem;\n }\n\n // No children elements, return MenuItem\n return (\n <Tooltip\n arrow\n key={label}\n placement={'right'}\n title={tooltip ?? label}\n >\n {iconMenuItem}\n </Tooltip>\n );\n });\n};\n","import type { ButtonProps } from '@mui/material/Button';\nimport Button from '@mui/material/Button';\nimport type { MenuProps } from '@mui/material/Menu';\nimport ExpandMoreIcon from '@mui/icons-material/ExpandMore';\nimport Menu from '@mui/material/Menu';\nimport type {\n MouseEvent,\n ReactNode,\n Ref,\n} from 'react';\nimport {\n useCallback,\n useState,\n} from 'react';\nimport type { BoxProps } from '@mui/material';\nimport {\n Box,\n ClickAwayListener,\n Tooltip,\n useTheme,\n} from '@mui/material';\nimport { useTranslation } from 'react-i18next';\n\nimport type { MenuItemData } from '../../models/nestedMenu';\n\nimport { nestedMenuItemsFromObject } from './nestedMenuItemsFromObject';\n\ninterface NestedDropdownProps {\n // eslint-disable-next-line @typescript-eslint/naming-convention\n readonly ButtonProps?: Partial<ButtonProps>;\n readonly children?: ReactNode;\n // eslint-disable-next-line @typescript-eslint/naming-convention\n readonly ContainerProps?: Partial<BoxProps>;\n readonly menuItemsData?: MenuItemData;\n // eslint-disable-next-line @typescript-eslint/naming-convention\n readonly MenuProps?: Partial<MenuProps>;\n readonly onClick?: (e: MouseEvent<HTMLButtonElement>) => void;\n readonly ref?: Ref<HTMLDivElement>;\n readonly showTopLevelTooltip?: boolean;\n}\n\nexport const NestedDropdown = ({ ref, ...props }: NestedDropdownProps) => {\n const [anchorEl, setAnchorEl] = useState<HTMLButtonElement \| null>(null);\n const open = Boolean(anchorEl);\n const { t } = useTranslation();\n const theme = useTheme();\n\n const { ButtonProps, ContainerProps, menuItemsData: data, MenuProps, onClick, showTopLevelTooltip, ...rest } = props;\n\n const onButtonClick = useCallback((event: MouseEvent<HTMLButtonElement>) => {\n setAnchorEl(event.currentTarget);\n if (onClick) {\n onClick(event);\n }\n }, [onClick]);\n const handleClose = useCallback(() => {\n setAnchorEl(null);\n }, []);\n const onClickAway = useCallback(() => {\n handleClose();\n }, [handleClose]);\n const onMenuClose = useCallback(() => {\n handleClose();\n }, [handleClose]);\n\n const menuItems = nestedMenuItemsFromObject({\n handleClose,\n isOpen: open,\n menuItemsData: data?.items ?? [],\n });\n\n const buttonElement = (\n <Button\n endIcon={<ExpandMoreIcon />}\n onClick={onButtonClick}\n {...ButtonProps}\n aria-expanded={open ? 'true' : 'false'}\n sx={{\n ...(ButtonProps.sx ?? {}),\n '& .MuiButton-endIcon': {\n display: 'inline-block',\n position: 'absolute',\n right: '8px',\n top: '2px',\n },\n display: 'inline-block',\n height: '24px',\n lineHeight: '16px',\n overflow: 'hidden',\n paddingRight: '24px',\n position: 'relative',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n width: '100%',\n }}\n >\n {data?.label ?? t`Menu`}\n </Button>\n );\n\n return (\n <ClickAwayListener onClickAway={onClickAway}>\n <Box\n ref={ref}\n sx={{\n maxWidth: '100%',\n }}\n {...ContainerProps}\n {...rest}\n >\n {(ButtonProps.disabled \|\| !showTopLevelTooltip) && buttonElement}\n {(!ButtonProps.disabled && showTopLevelTooltip) && (\n <Tooltip\n arrow\n placement={'right'}\n slotProps={{\n tooltip: {\n sx: {\n marginLeft: `${theme.spacing(0)} !important`,\n },\n },\n }}\n title={data?.tooltip ?? data?.label ?? t`Menu`}\n >\n {buttonElement}\n </Tooltip>\n )}\n <Menu\n anchorEl={anchorEl}\n hideBackdrop\n onClose={onMenuClose}\n open={open}\n slotProps={{\n paper: { style: { pointerEvents: 'auto' } },\n root: { style: { pointerEvents: 'none' } },\n }}\n {...MenuProps}\n >\n {menuItems}\n </Menu>\n </Box>\n </ClickAwayListener>\n\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"index.js","names":["styled","Typography","Button","MenuItem","styled$1","Typography$1","Button$1","ExpandMoreIcon","Menu","ChevronRightIcon","StyledMenuItem","StyledTypography","FlexBox","Box","IconMenuItem","props","MenuItemProps","checked","leftIcon","label","rightIcon","rightOrigins","leftOrigins","NestedMenuItem","menuItemRef","useRef","containerRef","menuContainerRef","anchorEl","setAnchorEl","useState","isSubMenuOpen","setIsSubMenuOpen","origins","setOrigins","tabIndexProp","ref","setMenuItemNode","useCallback","node","onIconMenuItemClick","callback","onMouseEnter","ContainerProps","onMouseLeave","onMenuClose","isSubmenuFocused","isActive","child","onFocus","onBlur","onKeyDown","open","parentMenuOpen","menuRef","menuItem","subMenuWidth","bodyWidth","x","width","tabIndex","MenuProps","nestedMenuItemsFromObject","items","menuItemsData","item","disabled","Tooltip","isOpen","sx","active","iconMenuItem","autoCloseDisabled","handleClose","tooltip","NestedDropdown","useTranslation","theme","useTheme","data","rest","onButtonClick","event","onClick","onClickAway","menuItems","buttonElement","ButtonProps","ClickAwayListener","showTopLevelTooltip"],"sources":["../../../src/components/NestedMenu/IconMenuItem.tsx","../../../src/components/NestedMenu/NestedMenuItem.tsx","../../../src/components/NestedMenu/nestedMenuItemsFromObject.tsx","../../../src/components/NestedMenu/NestedDropdown.tsx"],"sourcesContent":["import type { MenuItemProps } from '@mui/material/MenuItem';\nimport MenuItem from '@mui/material/MenuItem';\nimport { styled } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\nimport { Box } from '@mui/material';\nimport type { SxProps } from '@mui/material';\nimport type {\n MouseEvent,\n ReactNode,\n Ref,\n} from 'react';\n\nconst StyledMenuItem = styled(MenuItem)({\n display: 'flex',\n justifyContent: 'space-between',\n paddingLeft: '4px',\n paddingRight: '4px',\n});\n\nconst StyledTypography = styled(Typography)({\n paddingLeft: '8px',\n paddingRight: '8px',\n textAlign: 'left',\n});\n\nconst FlexBox = styled(Box)({\n display: 'flex',\n});\n\ntype IconMenuItemProps = {\n readonly checked?: 'false' \| 'mixed' \| 'true';\n readonly className?: string;\n readonly disabled?: boolean;\n readonly divider?: boolean;\n readonly label?: string;\n readonly leftIcon?: ReactNode;\n // eslint-disable-next-line @typescript-eslint/naming-convention\n readonly MenuItemProps?: MenuItemProps;\n readonly onClick?: (event: MouseEvent<HTMLElement>) => void;\n readonly ref?: Ref<HTMLLIElement>;\n readonly rightIcon?: ReactNode;\n readonly sx?: SxProps;\n};\n\nexport const IconMenuItem = ({ checked, className, label, leftIcon, MenuItemProps, ref, rightIcon, ...props }: IconMenuItemProps) => {\n return (\n <StyledMenuItem\n {...MenuItemProps}\n className={className}\n ref={ref}\n {...props}\n aria-checked={checked}\n role={checked ? 'menuitemcheckbox' : 'menuitem'}\n >\n <FlexBox>\n {leftIcon}\n <StyledTypography>\n {label}\n </StyledTypography>\n </FlexBox>\n {rightIcon}\n </StyledMenuItem>\n );\n};\n","import type { MenuProps } from '@mui/material/Menu';\nimport Menu from '@mui/material/Menu';\nimport type { MenuItemProps } from '@mui/material/MenuItem';\nimport ChevronRightIcon from '@mui/icons-material/ChevronRight';\nimport type {\n ElementType,\n FocusEvent,\n HTMLAttributes,\n KeyboardEvent,\n MouseEvent,\n ReactNode,\n Ref,\n} from 'react';\nimport {\n useCallback,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react';\nimport type { PopoverOrigin } from '@mui/material';\nimport { Box } from '@mui/material';\n\nimport { IconMenuItem } from './IconMenuItem';\n\ntype Origins = {\n anchor: PopoverOrigin;\n transform: PopoverOrigin;\n};\n\nconst rightOrigins: Origins = {\n anchor: {\n horizontal: 'right',\n vertical: 'top',\n },\n transform: {\n horizontal: 'left',\n vertical: 'top',\n },\n};\n\nconst leftOrigins: Origins = {\n anchor: {\n horizontal: 'left',\n vertical: 'top',\n },\n transform: {\n horizontal: 'right',\n vertical: 'top',\n },\n};\n\nexport type NestedMenuItemProps = {\n readonly active?: boolean;\n readonly button?: true;\n readonly callback?: () => void;\n readonly checked?: 'false' \| 'mixed' \| 'true';\n readonly children?: ReactNode;\n readonly className?: string;\n readonly component?: ElementType;\n // eslint-disable-next-line @typescript-eslint/naming-convention\n readonly ContainerProps?: HTMLAttributes<HTMLElement>;\n readonly disabled?: boolean;\n readonly label?: string;\n readonly leftIcon?: ReactNode;\n // eslint-disable-next-line @typescript-eslint/naming-convention\n readonly MenuProps?: Partial<Omit<MenuProps, 'children'>>;\n readonly parentMenuOpen: boolean;\n readonly ref?: Ref<HTMLLIElement>;\n readonly rightIcon?: ReactNode;\n readonly tabIndex?: number;\n} & Omit<MenuItemProps, 'button'>;\n\nexport const NestedMenuItem = ({ ref, ...props }: NestedMenuItemProps) => {\n const menuItemRef = useRef<HTMLLIElement>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n const menuContainerRef = useRef<HTMLDivElement>(null);\n const [anchorEl, setAnchorEl] = useState<HTMLLIElement \| null>(null);\n const [isSubMenuOpen, setIsSubMenuOpen] = useState(false);\n const [origins, setOrigins] = useState<Origins>(rightOrigins);\n\n const {\n callback,\n checked,\n children,\n className,\n ContainerProps = {},\n label,\n leftIcon = null,\n MenuProps,\n parentMenuOpen,\n rightIcon = <ChevronRightIcon />,\n tabIndex: tabIndexProp,\n ...MenuItemProps\n } = props;\n\n useImperativeHandle(ref, () => menuItemRef.current);\n\n const setMenuItemNode = useCallback((node: HTMLLIElement \| null): void => {\n menuItemRef.current = node;\n setAnchorEl(node);\n }, []);\n\n const onIconMenuItemClick = useCallback((): void => {\n if (callback) {\n callback();\n }\n }, [callback]);\n\n const onMouseEnter = useCallback((e: MouseEvent<HTMLElement>): void => {\n setIsSubMenuOpen(true);\n\n if (ContainerProps.onMouseEnter) {\n ContainerProps.onMouseEnter(e);\n }\n }, [ContainerProps]);\n\n const onMouseLeave = useCallback((e: MouseEvent<HTMLElement>): void => {\n setIsSubMenuOpen(false);\n\n if (ContainerProps.onMouseLeave) {\n ContainerProps.onMouseLeave(e);\n }\n }, [ContainerProps]);\n\n const onMenuClose = useCallback((): void => {\n setIsSubMenuOpen(false);\n }, []);\n\n // Check if any immediate children are active\n const isSubmenuFocused = useCallback(() => {\n const isActive = containerRef.current?.ownerDocument.activeElement ?? null;\n\n if (menuContainerRef.current?.children) {\n for (const child of menuContainerRef.current.children) {\n if (child === isActive) {\n return true;\n }\n }\n }\n\n return false;\n }, []);\n\n const onFocus = useCallback((e: FocusEvent<HTMLElement>) => {\n if (e.target === containerRef.current) {\n setIsSubMenuOpen(true);\n }\n\n if (ContainerProps.onFocus) {\n ContainerProps.onFocus(e);\n }\n }, [ContainerProps]);\n\n const onBlur = useCallback(() => {\n setTimeout(() => {\n if (!isSubmenuFocused()) {\n setIsSubMenuOpen(false);\n }\n });\n }, [isSubmenuFocused]);\n\n const onKeyDown = useCallback((e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n return;\n }\n\n if (isSubmenuFocused()) {\n e.stopPropagation();\n }\n\n const isActive = containerRef.current?.ownerDocument.activeElement;\n\n // if pressing enter key, run callback\n if (e.key === 'Enter' && e.target === containerRef.current && callback) {\n callback();\n }\n\n if (e.key === 'ArrowLeft' && isSubmenuFocused()) {\n containerRef.current?.focus();\n }\n\n if (e.key === 'ArrowRight' && e.target === containerRef.current && e.target === isActive) {\n const firstChild = menuContainerRef.current?.children[0] as HTMLDivElement;\n firstChild?.focus();\n }\n }, [callback, isSubmenuFocused]);\n\n const open = isSubMenuOpen && parentMenuOpen;\n\n const menuRef = useCallback((node: HTMLElement \| null) => {\n const menuItem = menuItemRef.current;\n\n if (node === null \|\| menuItem === null) {\n return;\n }\n\n const subMenuWidth = menuContainerRef.current?.clientWidth ?? 0;\n const { width, x } = menuItem.getBoundingClientRect();\n const bodyWidth = document.body.clientWidth;\n\n setOrigins(x + width + subMenuWidth > bodyWidth ? leftOrigins : rightOrigins);\n }, []);\n\n // Root element must have a `tabIndex` attribute for keyboard navigation\n let tabIndex;\n if (!props.disabled) {\n tabIndex = tabIndexProp ?? -1;\n }\n\n return (\n <Box\n {...ContainerProps}\n onBlur={onBlur}\n onFocus={onFocus}\n onKeyDown={onKeyDown}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n ref={containerRef}\n tabIndex={tabIndex}\n >\n\n <IconMenuItem\n checked={checked}\n className={className}\n label={label}\n leftIcon={leftIcon}\n MenuItemProps={MenuItemProps}\n onClick={onIconMenuItemClick}\n ref={setMenuItemNode}\n rightIcon={rightIcon}\n />\n <Menu\n // from capturing events for clicks and hovers\n\n anchorEl={anchorEl}\n anchorOrigin={origins.anchor}\n // eslint-disable-next-line jsx-a11y/no-autofocus\n autoFocus={false}\n disableAutoFocus\n disableEnforceFocus\n onClose={onMenuClose}\n open={open}\n ref={menuRef}\n // Set pointer events to 'none' to prevent the invisible Popover div\n sx={{\n pointerEvents: 'none',\n }}\n transformOrigin={origins.transform}\n {...MenuProps}\n >\n <Box\n ref={menuContainerRef}\n sx={{ pointerEvents: 'auto' }}\n >\n {children}\n </Box>\n </Menu>\n\n </Box>\n );\n};\n","import { Tooltip } from '@mui/material';\n\nimport type { MenuItemData } from '../../models/nested-menu.models';\n\nimport { IconMenuItem } from './IconMenuItem';\nimport { NestedMenuItem } from './NestedMenuItem';\n\nexport interface NestedMenuItemsFromObjectProps {\n handleClose: () => void;\n isOpen: boolean;\n menuItemsData: MenuItemData[];\n}\n\n/*\n Create a JSX element with nested elements creating a nested menu.\n * Every menu item should have a uid provided\n /\nexport const nestedMenuItemsFromObject = ({\n handleClose,\n isOpen,\n menuItemsData: items,\n}: NestedMenuItemsFromObjectProps) => {\n return items.map((item) => {\n const { active, autoCloseDisabled, callback, checked, disabled, divider, items: menuItemsData, label, leftIcon, rightIcon, sx, tooltip } = item;\n if (!disabled && menuItemsData && menuItemsData.length > 0) {\n return (\n <Tooltip\n arrow\n key={label}\n placement={'right'}\n title={undefined}\n >\n <NestedMenuItem\n callback={callback}\n checked={checked}\n disabled={disabled}\n key={label}\n label={label}\n leftIcon={leftIcon}\n parentMenuOpen={isOpen}\n rightIcon={rightIcon}\n sx={{\n ...(sx \|\| {}),\n '& p': {\n fontWeight: active ? 700 : undefined,\n },\n }}\n >\n {/ Call this function to nest more items */}\n {nestedMenuItemsFromObject({\n handleClose,\n isOpen,\n menuItemsData,\n })}\n </NestedMenuItem>\n </Tooltip>\n );\n }\n\n const iconMenuItem = (\n <IconMenuItem\n checked={checked}\n disabled={disabled}\n divider={divider}\n key={label}\n label={label}\n leftIcon={leftIcon}\n // eslint-disable-next-line @eslint-react/kit/jsx-no-bind\n onClick={() => {\n if (!autoCloseDisabled) {\n handleClose();\n }\n if (callback) {\n callback();\n }\n }}\n rightIcon={rightIcon}\n sx={{\n ...(sx \|\| {}),\n '& p': {\n fontWeight: active ? 700 : undefined,\n },\n }}\n />\n );\n if (disabled) {\n return iconMenuItem;\n }\n\n // No children elements, return MenuItem\n return (\n <Tooltip\n arrow\n key={label}\n placement={'right'}\n title={tooltip ?? label}\n >\n {iconMenuItem}\n </Tooltip>\n );\n });\n};\n","import type { ButtonProps } from '@mui/material/Button';\nimport Button from '@mui/material/Button';\nimport type { MenuProps } from '@mui/material/Menu';\nimport ExpandMoreIcon from '@mui/icons-material/ExpandMore';\nimport Menu from '@mui/material/Menu';\nimport type {\n MouseEvent,\n ReactNode,\n Ref,\n} from 'react';\nimport {\n useCallback,\n useState,\n} from 'react';\nimport type { BoxProps } from '@mui/material';\nimport {\n Box,\n ClickAwayListener,\n Tooltip,\n useTheme,\n} from '@mui/material';\nimport { useTranslation } from 'react-i18next';\n\nimport type { MenuItemData } from '../../models/nested-menu.models';\n\nimport { nestedMenuItemsFromObject } from './nestedMenuItemsFromObject';\n\ninterface NestedDropdownProps {\n // eslint-disable-next-line @typescript-eslint/naming-convention\n readonly ButtonProps?: Partial<ButtonProps>;\n readonly children?: ReactNode;\n // eslint-disable-next-line @typescript-eslint/naming-convention\n readonly ContainerProps?: Partial<BoxProps>;\n readonly menuItemsData?: MenuItemData;\n // eslint-disable-next-line @typescript-eslint/naming-convention\n readonly MenuProps?: Partial<MenuProps>;\n readonly onClick?: (e: MouseEvent<HTMLButtonElement>) => void;\n readonly ref?: Ref<HTMLDivElement>;\n readonly showTopLevelTooltip?: boolean;\n}\n\nexport const NestedDropdown = ({ ref, ...props }: NestedDropdownProps) => {\n const [anchorEl, setAnchorEl] = useState<HTMLButtonElement \| null>(null);\n const open = Boolean(anchorEl);\n const { t } = useTranslation();\n const theme = useTheme();\n\n const { ButtonProps, ContainerProps, menuItemsData: data, MenuProps, onClick, showTopLevelTooltip, ...rest } = props;\n\n const onButtonClick = useCallback((event: MouseEvent<HTMLButtonElement>) => {\n setAnchorEl(event.currentTarget);\n if (onClick) {\n onClick(event);\n }\n }, [onClick]);\n const handleClose = useCallback(() => {\n setAnchorEl(null);\n }, []);\n const onClickAway = useCallback(() => {\n handleClose();\n }, [handleClose]);\n const onMenuClose = useCallback(() => {\n handleClose();\n }, [handleClose]);\n\n const menuItems = nestedMenuItemsFromObject({\n handleClose,\n isOpen: open,\n menuItemsData: data?.items ?? [],\n });\n\n const buttonElement = (\n <Button\n endIcon={<ExpandMoreIcon />}\n onClick={onButtonClick}\n {...ButtonProps}\n aria-expanded={open ? 'true' : 'false'}\n sx={{\n ...(ButtonProps.sx ?? {}),\n '& .MuiButton-endIcon': {\n display: 'inline-block',\n position: 'absolute',\n right: '8px',\n top: '2px',\n },\n display: 'inline-block',\n height: '24px',\n lineHeight: '16px',\n overflow: 'hidden',\n paddingRight: '24px',\n position: 'relative',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n width: '100%',\n }}\n >\n {data?.label ?? t`Menu`}\n </Button>\n );\n\n return (\n <ClickAwayListener onClickAway={onClickAway}>\n <Box\n ref={ref}\n sx={{\n maxWidth: '100%',\n }}\n {...ContainerProps}\n {...rest}\n >\n {(ButtonProps.disabled \|\| !showTopLevelTooltip) && buttonElement}\n {(!ButtonProps.disabled && showTopLevelTooltip) && (\n <Tooltip\n arrow\n placement={'right'}\n slotProps={{\n tooltip: {\n sx: {\n marginLeft: `${theme.spacing(0)} !important`,\n },\n },\n }}\n title={data?.tooltip ?? data?.label ?? t`Menu`}\n >\n {buttonElement}\n </Tooltip>\n )}\n <Menu\n anchorEl={anchorEl}\n hideBackdrop\n onClose={onMenuClose}\n open={open}\n slotProps={{\n paper: { style: { pointerEvents: 'auto' } },\n root: { style: { pointerEvents: 'none' } },\n }}\n {...MenuProps}\n >\n {menuItems}\n </Menu>\n </Box>\n </ClickAwayListener>\n\n );\n};\n"],"mappings":"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"}

package/dist/components/NestedMenu/nestedMenuItemsFromObject.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import { MenuItemData } from '../../models/nestedMenu';
+import { MenuItemData } from '../../models/nested-menu.models';
 export interface NestedMenuItemsFromObjectProps {
     handleClose: () => void;
     isOpen: boolean;

package/dist/components/Spinner/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","names":[],"sources":["../../../src/components/Spinner/Spinner.tsx"],"sourcesContent":["import type { CircularProgressProps } from '@mui/material';\nimport {\n Box,\n CircularProgress,\n Typography,\n} from '@mui/material';\nimport type { ReactElement } from 'react';\nimport {\n useEffect,\n useState,\n} from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { visuallyHidden } from '@mui/utils';\n\nimport { useUiCoreComponentsConfigContext } from '../../context/uiCoreComponentsConfigContext';\n\n\nconst DEFAULT_TAKING_LONGER_TIMEOUT_MS = 5000;\nconst DEFAULT_CIRCULAR_PROGRESS_SIZE = 40;\n\nexport type SpinnerProps = {\n readonly color?: 'inherit' \| 'primary' \| 'secondary';\n readonly inline?: boolean;\n readonly label?: string;\n readonly size?: CircularProgressProps['size'];\n readonly takingLongerLabel?: string;\n readonly takingLongerTimeoutMs?: number;\n readonly textColor?: string;\n};\n\nexport const Spinner = ({ color = 'primary', inline, label, size, takingLongerLabel, takingLongerTimeoutMs, textColor }: SpinnerProps): ReactElement => {\n const [isTakingLonger, setIsTakingLonger] = useState(false);\n const { t } = useTranslation();\n\n const uiCoreComponentsConfig = useUiCoreComponentsConfigContext();\n\n useEffect(() => {\n const handle = setTimeout(() => {\n setIsTakingLonger(true);\n }, takingLongerTimeoutMs ?? uiCoreComponentsConfig?.spinner?.defaultTakingLongerTimeoutMs ?? DEFAULT_TAKING_LONGER_TIMEOUT_MS);\n return () => {\n clearTimeout(handle);\n };\n }, [takingLongerTimeoutMs, uiCoreComponentsConfig?.spinner?.defaultTakingLongerTimeoutMs]);\n\n return (\n <Box\n aria-busy={'true'}\n role={'status'}\n sx={{\n alignItems: 'center',\n bottom: inline ? 'auto' : 0,\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'center',\n left: inline ? 'auto' : 0,\n position: inline ? 'relative' : 'absolute',\n right: inline ? 'auto' : 0,\n top: inline ? 'auto' : 0,\n width: inline ? '100%' : 'auto',\n }}\n >\n <Box\n sx={{\n margin: 1,\n }}\n >\n <CircularProgress\n color={color}\n size={size ?? uiCoreComponentsConfig?.spinner?.defaultCircularProgressSize ?? DEFAULT_CIRCULAR_PROGRESS_SIZE}\n />\n </Box>\n <Box\n sx={{\n ...(!label ? visuallyHidden : undefined),\n color: textColor ?? 'inherit',\n margin: 1,\n }}\n >\n <Typography\n aria-live={'polite'}\n >\n {label ?? t`Loading`}\n </Typography>\n </Box>\n {isTakingLonger && (\n <Box\n sx={{\n color: textColor ?? 'inherit',\n margin: 1,\n }}\n >\n <Typography\n aria-live={'polite'}\n >\n {takingLongerLabel \|\| t`This is taking longer than expected. We are still trying.`}\n </Typography>\n </Box>\n )}\n </Box>\n );\n};\n"],"mappings":";;;;;;;AAiBA,~~IAAM~~,IAAmC,~~KACnC~~,IAAiC,~~IAY1B~~,KAAW,EAAE,WAAQ,WAAW,WAAQ,UAAO,SAAM,sBAAmB,0BAAuB,mBAA4C;CACtJ,IAAM,~~CAAC~~,~~GAAgB~~,~~KAAqB~~,EAAS,EAAK,GACpD,EAAE,~~SAAM~~,EAAe,~~GAEvB~~,~~IAAyB~~,EAAiC;CAWhE,~~OATA~~,QAAgB;EACd,~~IAAM~~,IAAS,iBAAiB;GAC9B,EAAkB,EAAI;EACxB,~~GAAG~~,~~KAAyB~~,GAAwB,SAAS,~~gCAAgC~~,CAAgC;EAC7H,aAAa;GACX,~~aAAa~~,CAAM;EACrB;CACF,GAAG,~~CAAC~~,~~GAAuB~~,GAAwB,SAAS,4BAA4B,CAAC,GAGvF,~~kBAAC~~,GAAD;EACE,aAAW;EACX,MAAM;EACN,IAAI;GACF,YAAY;GACZ,~~QAAQ~~,IAAS,SAAS;GAC1B,SAAS;GACT,eAAe;GACf,gBAAgB;GAChB,~~MAAM~~,IAAS,SAAS;GACxB,~~UAAU~~,IAAS,aAAa;GAChC,~~OAAO~~,IAAS,SAAS;GACzB,~~KAAK~~,IAAS,SAAS;GACvB,~~OAAO~~,IAAS,SAAS;EAC3B;EAdF,UAAA;GAgBE,~~kBAAC~~,GAAD;IACE,IAAI,EACF,QAAQ,EACV;IAEA,UAAA,~~kBAAC~~,GAAD;KACS;KACP,~~MAAM~~,~~KAAQ~~,GAAwB,SAAS,+BAA+B;IAC/E,CAAA;GACE,CAAA;GACL,~~kBAAC~~,GAAD;IACE,IAAI;KACF,~~GAAK~~,IAAyB,KAAA,~~IAAjB~~;KACb,~~OAAO~~,KAAa;KACpB,QAAQ;IACV;IAEA,UAAA,~~kBAAC~~,GAAD;KACE,aAAW;KAEV,~~UAAA~~,KAAS,CAAC;IACD,CAAA;GACT,CAAA;~~GACJ~~,KACC,~~kBAAC~~,GAAD;IACE,IAAI;KACF,~~OAAO~~,KAAa;KACpB,QAAQ;IACV;IAEA,UAAA,~~kBAAC~~,GAAD;KACE,aAAW;KAEV,~~UAAA~~,KAAqB,CAAC;IACb,CAAA;GACT,CAAA;EAEJ;;AAET"}
1	+ {"version":3,"file":"index.js","names":["DEFAULT_TAKING_LONGER_TIMEOUT_MS","DEFAULT_CIRCULAR_PROGRESS_SIZE","Spinner","isTakingLonger","setIsTakingLonger","useState","useTranslation","uiCoreComponentsConfig","useUiCoreComponentsConfigContext","useEffect","handle","takingLongerTimeoutMs","Box","inline","CircularProgress","size","label","visuallyHidden","textColor","Typography","takingLongerLabel"],"sources":["../../../src/components/Spinner/Spinner.tsx"],"sourcesContent":["import type { CircularProgressProps } from '@mui/material';\nimport {\n Box,\n CircularProgress,\n Typography,\n} from '@mui/material';\nimport type { ReactElement } from 'react';\nimport {\n useEffect,\n useState,\n} from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { visuallyHidden } from '@mui/utils';\n\nimport { useUiCoreComponentsConfigContext } from '../../context/uiCoreComponentsConfigContext';\n\n\nconst DEFAULT_TAKING_LONGER_TIMEOUT_MS = 5000;\nconst DEFAULT_CIRCULAR_PROGRESS_SIZE = 40;\n\nexport type SpinnerProps = {\n readonly color?: 'inherit' \| 'primary' \| 'secondary';\n readonly inline?: boolean;\n readonly label?: string;\n readonly size?: CircularProgressProps['size'];\n readonly takingLongerLabel?: string;\n readonly takingLongerTimeoutMs?: number;\n readonly textColor?: string;\n};\n\nexport const Spinner = ({ color = 'primary', inline, label, size, takingLongerLabel, takingLongerTimeoutMs, textColor }: SpinnerProps): ReactElement => {\n const [isTakingLonger, setIsTakingLonger] = useState(false);\n const { t } = useTranslation();\n\n const uiCoreComponentsConfig = useUiCoreComponentsConfigContext();\n\n useEffect(() => {\n const handle = setTimeout(() => {\n setIsTakingLonger(true);\n }, takingLongerTimeoutMs ?? uiCoreComponentsConfig?.spinner?.defaultTakingLongerTimeoutMs ?? DEFAULT_TAKING_LONGER_TIMEOUT_MS);\n return () => {\n clearTimeout(handle);\n };\n }, [takingLongerTimeoutMs, uiCoreComponentsConfig?.spinner?.defaultTakingLongerTimeoutMs]);\n\n return (\n <Box\n aria-busy={'true'}\n role={'status'}\n sx={{\n alignItems: 'center',\n bottom: inline ? 'auto' : 0,\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'center',\n left: inline ? 'auto' : 0,\n position: inline ? 'relative' : 'absolute',\n right: inline ? 'auto' : 0,\n top: inline ? 'auto' : 0,\n width: inline ? '100%' : 'auto',\n }}\n >\n <Box\n sx={{\n margin: 1,\n }}\n >\n <CircularProgress\n color={color}\n size={size ?? uiCoreComponentsConfig?.spinner?.defaultCircularProgressSize ?? DEFAULT_CIRCULAR_PROGRESS_SIZE}\n />\n </Box>\n <Box\n sx={{\n ...(!label ? visuallyHidden : undefined),\n color: textColor ?? 'inherit',\n margin: 1,\n }}\n >\n <Typography\n aria-live={'polite'}\n >\n {label ?? t`Loading`}\n </Typography>\n </Box>\n {isTakingLonger && (\n <Box\n sx={{\n color: textColor ?? 'inherit',\n margin: 1,\n }}\n >\n <Typography\n aria-live={'polite'}\n >\n {takingLongerLabel \|\| t`This is taking longer than expected. We are still trying.`}\n </Typography>\n </Box>\n )}\n </Box>\n );\n};\n"],"mappings":";;;;;;;AAiBA,IAAMA,IAAmC,KACnCC,IAAiC,IAY1BC,KAAW,EAAE,WAAQ,WAAW,WAAQ,UAAO,SAAM,sBAAmB,0BAAuB,mBAA4C;CACtJ,IAAM,CAACC,GAAgBC,KAAqBC,EAAS,EAAK,GACpD,EAAE,SAAMC,EAAe,GAEvBC,IAAyBC,EAAiC;CAWhE,OATAC,QAAgB;EACd,IAAMC,IAAS,iBAAiB;GAC9B,EAAkB,EAAI;EACxB,GAAGC,KAAyBJ,GAAwB,SAAS,gCAAgCP,CAAgC;EAC7H,aAAa;GACX,aAAaU,CAAM;EACrB;CACF,GAAG,CAACC,GAAuBJ,GAAwB,SAAS,4BAA4B,CAAC,GAGvF,kBAACK,GAAD;EACE,aAAW;EACX,MAAM;EACN,IAAI;GACF,YAAY;GACZ,QAAQC,IAAS,SAAS;GAC1B,SAAS;GACT,eAAe;GACf,gBAAgB;GAChB,MAAMA,IAAS,SAAS;GACxB,UAAUA,IAAS,aAAa;GAChC,OAAOA,IAAS,SAAS;GACzB,KAAKA,IAAS,SAAS;GACvB,OAAOA,IAAS,SAAS;EAC3B;EAdF,UAAA;GAgBE,kBAACD,GAAD;IACE,IAAI,EACF,QAAQ,EACV;IAEA,UAAA,kBAACE,GAAD;KACS;KACP,MAAMC,KAAQR,GAAwB,SAAS,+BAA+BN;IAC/E,CAAA;GACE,CAAA;GACL,kBAACW,GAAD;IACE,IAAI;KACF,GAAKI,IAAyB,KAAA,IAAjBC;KACb,OAAOC,KAAa;KACpB,QAAQ;IACV;IAEA,UAAA,kBAACC,GAAD;KACE,aAAW;KAEV,UAAAH,KAAS,CAAC;IACD,CAAA;GACT,CAAA;GACJb,KACC,kBAACS,GAAD;IACE,IAAI;KACF,OAAOM,KAAa;KACpB,QAAQ;IACV;IAEA,UAAA,kBAACC,GAAD;KACE,aAAW;KAEV,UAAAC,KAAqB,CAAC;IACb,CAAA;GACT,CAAA;EAEJ;;AAET"}