@hexure/ui 1.8.4 → 1.8.6

package/dist/cjs/index.js

@@ -2061,6 +2061,13 @@ const button_type_mapping = {
         badge_bg_color: '#fff',
         badge_content_color: Colors.RED.Hex,
     },
+    green: {
+        background_color: Colors.GREEN.Hex,
+        border_color: Colors.GREEN.Hex,
+        content_color: '#fff',
+        badge_bg_color: '#fff',
+        badge_content_color: Colors.GREEN.Hex,
+    },
 };
 const StyledButton = styled.button `
   height: ${props => (props.$small ? '30px' : '40px')};
@@ -2446,13 +2453,14 @@ const StyledMoreMenu = styled(MoreMenu) `
   right: ${props => (props.$position === 'right' ? '0px' : 'auto')};
   left: ${props => (props.$position === 'left' ? '0px' : 'auto')};
   top: ${props => (props.$small ? '30px' : '40px')};
+  width: ${props => props.$menuWidth};
   z-index: 10;
 `;
-const ButtonMenu = ({ disabled, label, maxHeight, menuItems, small, position = 'right', format = 'primary', }) => {
+const ButtonMenu = ({ disabled, label, maxHeight, menuItems, small, position = 'right', format = 'primary', menuWidth = '200px', }) => {
     const [show_menu, toggleMenu] = React.useState(false);
     return (React.createElement(Wrapper$d, { onMouseEnter: disabled ? undefined : toggleMenu.bind(null, true), onMouseLeave: disabled ? undefined : toggleMenu.bind(null, false) },
         React.createElement(Button, { disabled: disabled, format: format, icon: js.mdiDotsHorizontal, small: small }, label),
-        show_menu ? (React.createElement(StyledMoreMenu, { "$position": position, "$small": small, maxHeight: maxHeight, menuItems: menuItems })) : null));
+        show_menu ? (React.createElement(StyledMoreMenu, { "$menuWidth": menuWidth, "$position": position, "$small": small, maxHeight: maxHeight, menuItems: menuItems })) : null));
 };
 
 const Wrapper$c = styled.label `
@@ -3808,14 +3816,14 @@ const PageHeader = ({ title = '', breadcrumbs, actions, buttonMenu }) => {
         React.createElement(Info, null,
             React.createElement(Heading, { type: 'secondary' }, title),
             breadcrumbs ? (React.createElement(Breadcrumbs, null, breadcrumbs.map((crumb, i) => {
-                return (React.createElement(React.Fragment, null,
+                return (React.createElement(React.Fragment, { key: i },
                     crumb.onClick ? (React.createElement(Link, { onClick: crumb.onClick, small: true }, crumb.label)) : (React.createElement(Copy, { type: 'small' }, crumb.label)),
                     i + 1 < breadcrumbs.length ? React.createElement(Icon.Icon, { path: js.mdiChevronRight, size: '14px' }) : null));
             }))) : null),
         actions ? (React.createElement(Actions, null,
-            actions.map(action => {
+            actions.map((action, i) => {
                 const { label } = action, buttonProps = __rest(action, ["label"]);
-                return (React.createElement(Button, Object.assign({}, buttonProps, { small: true }), label));
+                return (React.createElement(Button, Object.assign({}, buttonProps, { key: i, small: true }), label));
             }),
             menuItems.length ? (React.createElement(ButtonMenu, { label: label, menuItems: menuItems, small: true })) : null)) : null));
 };