reactive-bulma 2.16.0 → 2.17.0

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

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

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

@@ -15,3 +15,4 @@ export { default as PanelTabs } from './PanelTabs';
 export { default as LevelItem } from '../molecules/LevelItem';
 export { default as TileBox } from './TileBox';
 export { default as Footer } from './Footer';
+export { default as Media } from './Media';

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

@@ -181,4 +181,12 @@ export interface FooterProps extends ComposedElementProps {
     /** `Styling` Centers footer¿s content horizontally */
     isContentCentered?: boolean;
 }
+export interface MediaProps extends ElementProps {
+    /** `Attribute` Reffers to the component or string content that will be shown inside the component's left side */
+    leftContent?: SingleChildType;
+    /** `Attribute` Reffers to the component or string content that will be shown inside the component's center */
+    centerContent?: SingleChildType;
+    /** `Attribute` Reffers to the component or string content that will be shown inside the component's right side */
+    rightContent?: SingleChildType;
+}
 export {};

package/dist/cjs/types/types/domTypes.d.ts

@@ -11,3 +11,4 @@ export declare enum IconSizeEnum {
     'is-large' = 48
 }
 export type TileContextType = 'is-child' | 'is-parent' | 'is-ancestor';
+export type MediaSectionType = 'left' | 'content' | 'right';

package/dist/esm/index.js

@@ -3717,6 +3717,16 @@ const Footer = ({ testId = null, containerTestId = null, cssClasses = null, cont
         React.createElement("section", { "data-testid": footerContentTestId, className: footerContentClasses, style: style !== null && style !== void 0 ? style : undefined }, content)));
 };
 
+const renderMediaSection = (content, position, testId) => content ? (React.createElement("section", { "data-testid": `${testId}-${position}`, className: `media-${position}` }, content)) : null;
+const Media = ({ testId = null, cssClasses = null, style = null, leftContent = null, centerContent = null, rightContent = null }) => {
+    const mediaClasses = parseClasses(['media', cssClasses]);
+    const mediaTestId = testId !== null && testId !== void 0 ? testId : parseTestId({ tag: 'media', parsedClasses: mediaClasses });
+    return (React.createElement("article", { "data-testid": mediaTestId, className: mediaClasses, style: style !== null && style !== void 0 ? style : undefined },
+        renderMediaSection(leftContent, 'left', mediaTestId),
+        renderMediaSection(centerContent, 'content', mediaTestId),
+        renderMediaSection(rightContent, 'right', mediaTestId)));
+};
+
 const renderFieldLabel = (labelText) => labelText ? (React.createElement("label", { "data-testid": 'test-form-field-label', className: 'label' }, labelText)) : null;
 const renderFieldBody = (inputControlConfig, isGrouped) => {
     if (isGrouped) {
@@ -3818,5 +3828,5 @@ const TileGroup = ({ testId = null, cssClasses = null, style = null, context = '
     return (React.createElement(Tile, { testId: tileBoxTestId, cssClasses: cssClasses !== null && cssClasses !== void 0 ? cssClasses : undefined, style: style !== null && style !== void 0 ? style : undefined, context: context, size: size !== null && size !== void 0 ? size : undefined, isVertical: isVertical }, groupConfig.map(tileConfig => (React.createElement(Tile, Object.assign({ key: `tile-item-${generateKey()}` }, tileConfig))))));
 };
 
-export { Block, Box, BreadcrumbItem, Breadcrumbs, Button, ButtonGroup, CheckBox as Checkbox, Column, ColumnGroup, Delete, Dropdown, DropdownItem, DropdownTrigger, File, Footer, FormField, Hero, Icon, Image, Input, InputControl, Level, LevelHeader, LevelItem, Menu, MenuItem, MenuList, Message, Modal, Notification, Pagination, PaginationItem, Panel, PanelBlock, PanelTabs, ProgressBar, RadioButton, Select, TabItem, Tabs, Tag, TextArea, Tile, TileBox, TileGroup, Title };
+export { Block, Box, BreadcrumbItem, Breadcrumbs, Button, ButtonGroup, CheckBox as Checkbox, Column, ColumnGroup, Delete, Dropdown, DropdownItem, DropdownTrigger, File, Footer, FormField, Hero, Icon, Image, Input, InputControl, Level, LevelHeader, LevelItem, Media, Menu, MenuItem, MenuList, Message, Modal, Notification, Pagination, PaginationItem, Panel, PanelBlock, PanelTabs, ProgressBar, RadioButton, Select, TabItem, Tabs, Tag, TextArea, Tile, TileBox, TileGroup, Title };
 //# sourceMappingURL=index.js.map