@abgov/react-components 3.4.0-beta.64 → 3.4.0-beta.65

package/lib/hero-banner/hero-banner.component.d.ts

@@ -1,7 +1,7 @@
 import { FC } from 'react';
 import './hero-banner.component.scss';
 interface Props {
-    title: string;
+    title?: string;
     backgroundUrl: string;
     content?: string;
     linkText?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abgov/react-components",
-  "version": "3.4.0-beta.64",
+  "version": "3.4.0-beta.65",
   "description": "Government of Alberta - UI components for React",
   "bugs": {
     "url": "https://github.com/GovAlta/ui-components/issues"

package/react-components.esm.js

@@ -1,5 +1,5 @@
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import React, { useState, Fragment as Fragment$1, useEffect, Children, createElement } from 'react';
+import { jsx, jsxs, Fragment as Fragment$1 } from 'react/jsx-runtime';
+import React, { useState, Fragment, useEffect, Children, createElement } from 'react';
 import classnames from 'classnames';
 
 function styleInject(css, ref) {
@@ -1324,8 +1324,8 @@ const GoAHeader = props => {
     return props.serviceLevel.toLowerCase();
   }
 
-  return jsxs(Fragment, {
-    children: [jsxs("header", Object.assign({
+  return jsxs("header", {
+    children: [jsxs("div", Object.assign({
       className: "goa-header goa-official-site-header"
     }, {
       children: [jsx("div", {
@@ -1396,7 +1396,7 @@ const GoAHeroBannerLink = ({
     }, {
       children: linkText
     }), void 0)
-  }, void 0) : jsx(Fragment$1, {}, void 0);
+  }, void 0) : jsx(Fragment, {}, void 0);
 };
 
 var css_248z$k = "/* Palette */\n/* Semantic usages */\n.goa-hero {\n  box-sizing: border-box;\n  display: flex;\n  justify-content: flex-end;\n  align-items: stretch;\n  flex-direction: column;\n  height: 600px;\n  border-bottom: 8px solid #0081a2;\n  color: #fff;\n  background-position: center center;\n  width: 100%;\n  padding: 56px 28px;\n}\n.goa-hero h1 {\n  margin: 0 0 28px;\n  padding: 0;\n  font-size: 48px;\n  line-height: 56px;\n  font-weight: 700;\n  color: #fff;\n}";
@@ -1416,12 +1416,12 @@ const GoAHeroBanner = ({
       backgroundImage: `linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.40) 40%, rgba(0, 0, 0, 0.6) 100%), url('${backgroundUrl}')`
     }
   }, {
-    children: [jsx("h1", Object.assign({
+    children: [title && jsx("h1", Object.assign({
       role: "heading",
       "aria-level": 1
     }, {
       children: title
-    }), void 0), children || jsxs(Fragment$1, {
+    }), void 0), children || jsxs(Fragment, {
       children: [content && jsx(GoAHeroBannerContent, {
         content: content
       }, void 0), linkText && linkUrl && jsx(GoAHeroBannerLink, {
@@ -1778,7 +1778,7 @@ const GoADropdown = _a => {
           placeholder: props.placeholder,
           value: getSelectedLabel()
         }, void 0)
-      }), void 0), isMenuVisible && jsxs(Fragment, {
+      }), void 0), isMenuVisible && jsxs(Fragment$1, {
         children: [props.autoComplete && jsx(GoAInput, {
           type: "text",
           placeholder: "Filter",

package/react-components.umd.js

@@ -1356,8 +1356,8 @@
       return props.serviceLevel.toLowerCase();
     }
 
-    return jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [jsxRuntime.jsxs("header", __assign({
+    return jsxRuntime.jsxs("header", {
+      children: [jsxRuntime.jsxs("div", __assign({
         className: "goa-header goa-official-site-header"
       }, {
         children: [jsxRuntime.jsx("div", {
@@ -1445,7 +1445,7 @@
         backgroundImage: "linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.40) 40%, rgba(0, 0, 0, 0.6) 100%), url('" + backgroundUrl + "')"
       }
     }, {
-      children: [jsxRuntime.jsx("h1", __assign({
+      children: [title && jsxRuntime.jsx("h1", __assign({
         role: "heading",
         "aria-level": 1
       }, {