reactive-bulma 2.17.0 → 3.0.0

package/dist/cjs/index.js

@@ -3729,6 +3729,12 @@ const Media = ({ testId = null, cssClasses = null, style = null, leftContent = n
         renderMediaSection(rightContent, 'right', mediaTestId)));
 };
 
+const Section = ({ testId = null, cssClasses = null, style = null, content, size = null }) => {
+    const sectionClasses = parseClasses(['section', size, cssClasses]);
+    const sectionTestId = testId !== null && testId !== void 0 ? testId : parseTestId({ tag: 'section', parsedClasses: sectionClasses });
+    return (React.createElement("section", { "data-testid": sectionTestId, className: sectionClasses, style: style !== null && style !== void 0 ? style : undefined }, content));
+};
+
 const renderFieldLabel = (labelText) => labelText ? (React.createElement("label", { "data-testid": 'test-form-field-label', className: 'label' }, labelText)) : null;
 const renderFieldBody = (inputControlConfig, isGrouped) => {
     if (isGrouped) {
@@ -3796,13 +3802,14 @@ const Level = ({ testId = null, cssClasses = null, style = null, leftSide = null
         rightSide ? (React.createElement("section", { className: 'level-right' }, renderLevelSection(rightSide))) : null));
 };
 
+const renderHeroSection = (content, type, testId, size) => type === 'body' || size === 'is-fullheight' ? (React.createElement("section", { "data-testid": `${testId}-${type}`, className: `hero-${type}` }, content)) : null;
 const Hero = ({ testId = null, cssClasses = null, style = null, header = null, body, footer = null, color = null, size = null }) => {
     const heroClasses = parseClasses(['hero', color, size, cssClasses]);
     const heroTestId = testId !== null && testId !== void 0 ? testId : parseTestId({ tag: 'hero', parsedClasses: heroClasses });
     return (React.createElement("section", { "data-testid": heroTestId, className: heroClasses, style: style !== null && style !== void 0 ? style : undefined },
-        size === 'is-fullheight' ? (React.createElement("section", { "data-testid": `${heroTestId}-head`, className: 'hero-head' }, header)) : null,
-        React.createElement("section", { "data-testid": `${heroTestId}-body`, className: 'hero-body' }, body),
-        size === 'is-fullheight' ? (React.createElement("section", { "data-testid": `${heroTestId}-foot`, className: 'hero-foot' }, footer)) : null));
+        renderHeroSection(header, 'head', heroTestId, size),
+        renderHeroSection(body, 'body', heroTestId, size),
+        renderHeroSection(footer, 'foot', heroTestId, size)));
 };
 
 const TileGroup = ({ testId = null, cssClasses = null, style = null, context = 'is-ancestor', size = null, isVertical = false, groupConfig }) => {
@@ -3868,6 +3875,7 @@ exports.PanelBlock = PanelBlock;
 exports.PanelTabs = PanelTabs;
 exports.ProgressBar = ProgressBar;
 exports.RadioButton = RadioButton;
+exports.Section = Section;
 exports.Select = Select;
 exports.TabItem = TabItem;
 exports.Tabs = Tabs;