reactive-bulma 2.5.0 → 2.6.0

package/dist/cjs/types/components/molecules/Message/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { MessageProps } from '../../../interfaces/moleculeProps';
+declare const Message: React.FC<MessageProps>;
+export default Message;

package/dist/cjs/types/components/molecules/index.d.ts

@@ -3,3 +3,4 @@ export { default as ColumnGroup } from './ColumnGroup';
 export { default as Notification } from './Notification';
 export { default as Breadcrumbs } from './Breadcrumbs';
 export { default as Dropdown } from './Dropdown';
+export { default as Message } from './Message';

package/dist/cjs/types/interfaces/moleculeProps.d.ts

@@ -52,3 +52,15 @@ export interface DropdownProps extends ElementProps {
     /** `Atribute` `Required` Array of `DropdownItem` objects that will be shown on its menu */
     listOfItems: DropdownItemProps[];
 }
+export interface MessageProps extends ElementProps {
+    /** `Atribute` Sets the header's text that will be shown on message's darker zone */
+    headerText?: string;
+    /** `Atribute` `Required` Sets the body's text that will be shown on message's lighter zone */
+    bodyText: string;
+    /** `Atribute` Includes a `Delete` config object that will be shown */
+    deleteButton?: DeleteProps;
+    /** `Styling` Color based on bulma's color tokens */
+    color?: basicColorType;
+    /** `Styling` Set button's size on bulma's size tokens */
+    size?: Exclude<basicSizeType, 'is-normal'>;
+}

package/dist/esm/index.js

@@ -3335,7 +3335,7 @@ const Breadcrumbs = ({ testId = 'breadcrumbs', containerTestId = null, cssClasse
 
 const renderDropdownMenu = (items) => (React.createElement("section", { className: 'dropdown-content' }, items.map((dropdownItemConfig, i) => {
     const isFirstItemInMenu = items.length > 1 && i === 0;
-    return isFirstItemInMenu ? (React.createElement(DropdownItem, Object.assign({ key: `dropdown-item-${i}` }, dropdownItemConfig))) : (React.createElement(React.Fragment, null,
+    return isFirstItemInMenu ? (React.createElement(DropdownItem, Object.assign({ key: `dropdown-item-${i}` }, dropdownItemConfig))) : (React.createElement("section", { key: `dropdown-item-${i}-section` },
         React.createElement(DropdownItem, { key: `dropdown-item-${i}-divider`, type: 'divider', itemText: 'divider' }),
         React.createElement(DropdownItem, Object.assign({ key: `dropdown-item-${i}` }, dropdownItemConfig))));
 })));
@@ -3354,5 +3354,15 @@ const Dropdown = ({ testId = null, cssClasses = null, style = null, inputText, d
         React.createElement("section", { className: 'dropdown-menu', id: dropdownPointer, role: 'menu' }, renderDropdownMenu(listOfItems))));
 };
 
-export { Block, Box, BreadcrumbItem, Breadcrumbs, Button, ButtonGroup, CheckBox as Checkbox, Column, ColumnGroup, Delete, Dropdown, DropdownItem, DropdownTrigger, File, Icon, Input, Notification, ProgressBar, RadioButton, Select, Tag, TextArea, Title };
+const Message = ({ testId = null, cssClasses = null, style = null, headerText = null, bodyText, deleteButton = null, color = null, size = null }) => {
+    const messageClasses = parseClasses(['message', color, size, cssClasses]);
+    const messageTestId = testId !== null && testId !== void 0 ? testId : parseTestId({ tag: 'message', parsedClasses: messageClasses });
+    return (React.createElement("article", { "data-testid": messageTestId, className: messageClasses, style: style !== null && style !== void 0 ? style : undefined },
+        headerText && (React.createElement("section", { "data-testid": `${messageTestId}-header`, className: 'message-header' },
+            React.createElement("p", null, headerText),
+            deleteButton ? React.createElement(Delete, Object.assign({}, deleteButton)) : null)),
+        React.createElement("section", { "data-testid": `${messageTestId}-body`, className: 'message-body' }, bodyText)));
+};
+
+export { Block, Box, BreadcrumbItem, Breadcrumbs, Button, ButtonGroup, CheckBox as Checkbox, Column, ColumnGroup, Delete, Dropdown, DropdownItem, DropdownTrigger, File, Icon, Input, Message, Notification, ProgressBar, RadioButton, Select, Tag, TextArea, Title };
 //# sourceMappingURL=index.js.map