@homefile/components-v2 2.40.4 → 2.40.5
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.
|
@@ -27,7 +27,7 @@ export const HomeMonitorButton = ({ alertCount = 0, currentStep, onStepClick, st
|
|
|
27
27
|
setIsHovered(false);
|
|
28
28
|
onStepClick(currentStep);
|
|
29
29
|
};
|
|
30
|
-
return (_jsx(Box, Object.assign({ position: "relative", id: buttonId, boxShadow: "lg", bottom: `${bottomOffset}px`, minH: "106px", onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), onPointerEnter: () => setIsHovered(true), onPointerLeave: () => setIsHovered(false) }, getContainerStyles(status), { children: _jsxs(Box, { position: "relative", bg: "neutral.white", borderRadius: "lg", children: [_jsx(Box, { bg: alert ? 'error.2' : 'green.1', boxSize: "10px", borderRadius: "full", position: "absolute", top: "10px", left: "8px" }), _jsx(Box, { position: "absolute", top: "2px", right: "6px", zIndex: "1400", children: _jsx(IconMenu, { icon: _jsx(MoreHorizontal, { size: 26 }), itemForm: index + 1, menuItems: menuItems, disabled: isDisabled, onClick: () => setSelectedId(`homeMonitorButton-${index + 1}`) }) }), !isCollapsed && (_jsxs(Stack, { position: "relative", as: "button", spacing: "7px", border: "1px solid transparent", align: "center", justify: "center", w: "100%", p: "base", pt: "20px", onClick: handleStepClick, children: [!alert && (_jsx(Box, { boxSize: "36px", children: _jsx(Image, { src: step.icon, alt: iconAltText, w: "100%", h: "100%", fit: "contain" }) })), alert && (_jsx(Center, { boxSize: "36px", bg: "error.2", borderRadius: "full", color: "neutral.white", lineHeight: "1", fontWeight: "bold", children: alertCount })), _jsx(Center, { h: "28px", children: _jsx(Text, { fontSize: "14px", textTransform: "uppercase", textAlign: "center", lineHeight: "14px", fontFamily: "secondary", children: step.title }) })] }))] }) })));
|
|
30
|
+
return (_jsx(Box, Object.assign({ position: "relative", id: buttonId, boxShadow: "lg", bottom: `${bottomOffset}px`, minH: "106px", onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), onPointerEnter: () => setIsHovered(true), onPointerLeave: () => setIsHovered(false) }, getContainerStyles(status), { children: _jsxs(Box, { position: "relative", bg: "neutral.white", borderRadius: "lg", children: [_jsx(Box, { bg: alert ? 'error.2' : 'green.1', boxSize: "10px", borderRadius: "full", position: "absolute", top: "10px", left: "8px" }), _jsx(Box, { position: "absolute", top: "2px", right: "6px", zIndex: "1400", children: _jsx(IconMenu, { icon: _jsx(MoreHorizontal, { size: 26 }), itemForm: index + 1, menuItems: menuItems, disabled: isDisabled, onClick: () => setSelectedId(`homeMonitorButton-${index + 1}`), placement: "top" }) }), !isCollapsed && (_jsxs(Stack, { position: "relative", as: "button", spacing: "7px", border: "1px solid transparent", align: "center", justify: "center", w: "100%", p: "base", pt: "20px", onClick: handleStepClick, children: [!alert && (_jsx(Box, { boxSize: "36px", children: _jsx(Image, { src: step.icon, alt: iconAltText, w: "100%", h: "100%", fit: "contain" }) })), alert && (_jsx(Center, { boxSize: "36px", bg: "error.2", borderRadius: "full", color: "neutral.white", lineHeight: "1", fontWeight: "bold", children: alertCount })), _jsx(Center, { h: "28px", children: _jsx(Text, { fontSize: "14px", textTransform: "uppercase", textAlign: "center", lineHeight: "14px", fontFamily: "secondary", children: step.title }) })] }))] }) })));
|
|
31
31
|
};
|
|
32
32
|
const alertGradient = keyframes `
|
|
33
33
|
0% { background-position: 0% 50%; }
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { IconMenuI } from '../../interfaces';
|
|
2
|
-
export declare const IconMenu: ({ disabled, icon, itemForm, menuItems, onClick, variant, width, zIndex, }: IconMenuI) => import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
export declare const IconMenu: ({ disabled, icon, itemForm, menuItems, onClick, variant, width, zIndex, placement, }: IconMenuI) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { MenuButton, IconButton, Menu, MenuItem, MenuList, Box, } from '@chakra-ui/react';
|
|
3
3
|
import { ChevronDown, Overlay } from '../../components';
|
|
4
|
-
export const IconMenu = ({ disabled = false, icon = _jsx(ChevronDown, {}), itemForm, menuItems, onClick, variant = 'menuIcon', width = 'fit-content', zIndex = '999', }) => {
|
|
5
|
-
return (_jsx(Box, { zIndex: zIndex, children: _jsx(Menu, { isLazy: true, children: ({ isOpen }) => (_jsxs(_Fragment, { children: [_jsx(Overlay, { bg: "overlay", showOverlay: isOpen, position: "fixed" }), _jsx(MenuButton, { as: IconButton, "aria-label": "Options", icon: _jsx(Box, { children: icon }), variant: variant, w: width, disabled: disabled, marginTop: "0 !important", onClick: onClick, "data-testid": "icon-menu" }), _jsx(MenuList, { zIndex: "5", children: menuItems === null || menuItems === void 0 ? void 0 : menuItems.map(({ handleClick, label }) => (_jsx(MenuItem, { "data-testid": label, onClick: (e) => {
|
|
4
|
+
export const IconMenu = ({ disabled = false, icon = _jsx(ChevronDown, {}), itemForm, menuItems, onClick, variant = 'menuIcon', width = 'fit-content', zIndex = '999', placement = 'bottom', }) => {
|
|
5
|
+
return (_jsx(Box, { zIndex: zIndex, children: _jsx(Menu, { isLazy: true, placement: placement, children: ({ isOpen }) => (_jsxs(_Fragment, { children: [_jsx(Overlay, { bg: "overlay", showOverlay: isOpen, position: "fixed" }), _jsx(MenuButton, { as: IconButton, "aria-label": "Options", icon: _jsx(Box, { children: icon }), variant: variant, w: width, disabled: disabled, marginTop: "0 !important", onClick: onClick, "data-testid": "icon-menu" }), _jsx(MenuList, { zIndex: "5", children: menuItems === null || menuItems === void 0 ? void 0 : menuItems.map(({ handleClick, label }) => (_jsx(MenuItem, { "data-testid": label, onClick: (e) => {
|
|
6
6
|
e.stopPropagation();
|
|
7
7
|
handleClick(itemForm);
|
|
8
8
|
}, _hover: {
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { MenuProps } from '@chakra-ui/react';
|
|
1
2
|
import { ReactNode } from 'react';
|
|
2
3
|
export interface MenuItemI {
|
|
3
4
|
handleClick: (form: any) => void;
|
|
@@ -12,4 +13,5 @@ export interface IconMenuI<T = unknown> {
|
|
|
12
13
|
variant?: string;
|
|
13
14
|
width?: string;
|
|
14
15
|
zIndex?: string;
|
|
16
|
+
placement?: MenuProps['placement'];
|
|
15
17
|
}
|