@hexure/ui 1.8.5 → 1.8.7

package/dist/cjs/types/components/Button/Button.d.ts

@@ -20,7 +20,7 @@ export interface ButtonProps extends AccessibleProps {
     /** If enabled, the small button format will be used. */
     small?: boolean;
     /** Define which button format to display. By default the Primary button will be used.  */
-    format?: 'primary' | 'secondary' | 'red';
+    format?: 'primary' | 'secondary' | 'red' | 'green';
 }
 declare const Button: FC<ButtonProps>;
 export default Button;

package/dist/cjs/types/components/PageHeader/PageHeader.d.ts

@@ -8,13 +8,14 @@ export interface PageHeaderProps {
     }>;
     actions?: Array<{
         disabled?: boolean;
-        format?: 'primary' | 'secondary' | 'red';
+        format?: 'primary' | 'secondary' | 'red' | 'green';
         icon?: string;
         label: string;
         onClick?: (e: any) => void;
     }>;
     buttonMenu?: {
         disabled?: boolean;
+        format?: 'primary' | 'secondary';
         icon?: string;
         label: string;
         menuItems: Array<MenuItemProps>;

package/dist/esm/index.js

@@ -2059,6 +2059,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')};
@@ -3802,21 +3809,21 @@ const Actions = styled.div `
   gap: 8px;
 `;
 const PageHeader = ({ title = '', breadcrumbs, actions, buttonMenu }) => {
-    const { menuItems = [], label = '', } = buttonMenu || {};
+    const { format = 'primary', menuItems = [], label = '', } = buttonMenu || {};
     return (React.createElement(Wrapper$5, null,
         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$1, { path: 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));
+            menuItems.length ? (React.createElement(ButtonMenu, { format: format, label: label, menuItems: menuItems, small: true })) : null)) : null));
 };
 
 const Wrapper$4 = styled.nav `