@abgov/react-components 5.0.0-alpha.5 → 5.0.0-alpha.7

package/index.js

@@ -24,7 +24,7 @@ function GoAAccordion({
       heading,
       secondaryText,
       maxwidth: maxWidth,
-      "data-testid": testid,
+      testid,
       mt,
       mr,
       mb,
@@ -51,7 +51,7 @@ function GoAAppHeader({
       url,
       fullmenubreakpoint: fullMenuBreakpoint,
       maxcontentwidth: maxContentWidth,
-      "data-testid": testId,
+      testid: testId,
       children
     }
   );
@@ -62,7 +62,7 @@ function GoAAppHeaderMenu(props) {
     {
       heading: props.heading,
       leadingicon: props.leadingIcon,
-      "data-testid": props.testId,
+      testid: props.testId,
       children: props.children
     }
   );
@@ -84,7 +84,7 @@ function GoABadge({
       type,
       content,
       icon,
-      "data-testid": testId,
+      testid: testId,
       arialabel: ariaLabel,
       mt,
       mr,
@@ -204,7 +204,7 @@ function GoABlock(props) {
       mr: props.mr,
       mb: props.mb,
       ml: props.ml,
-      "data-testid": props.testId,
+      testid: props.testId,
       children: props.children
     }
   );
@@ -251,7 +251,7 @@ function GoAButton({
       disabled,
       leadingicon: leadingIcon,
       trailingicon: trailingIcon,
-      "data-testid": testId,
+      testid: testId,
       mt,
       mr,
       mb,
@@ -279,7 +279,7 @@ function GoAButtonGroup({
       mr,
       mb,
       ml,
-      "data-testid": testId,
+      testid: testId,
       children
     }
   );
@@ -314,7 +314,7 @@ function GoACalendar({
       value: value == null ? void 0 : value.toISOString(),
       min: min == null ? void 0 : min.toISOString(),
       max: max == null ? void 0 : max.toISOString(),
-      "data-testid": testId,
+      testid: testId,
       mt,
       mr,
       mb,
@@ -347,7 +347,7 @@ const GoACallout = ({
       mr,
       mb,
       ml,
-      "data-testid": testId,
+      testid: testId,
       children
     }
   );
@@ -389,7 +389,7 @@ function GoACheckbox({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "goa-checkbox",
     {
-      "data-testid": testId,
+      testid: testId,
       ref: el,
       id,
       name,
@@ -453,7 +453,7 @@ const GoAChip = ({
       mr,
       mb,
       ml,
-      "data-testid": testId
+      testid: testId
     }
   );
 };
@@ -473,7 +473,7 @@ const GoACircularProgress = ({
       progress,
       variant,
       size,
-      "data-testid": testId
+      testid: testId
     }
   );
 };
@@ -506,7 +506,7 @@ function GoAContainer({
       mr,
       mb,
       ml,
-      "data-testid": testId,
+      testid: testId,
       children: [
         headingContent && /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "title", children: headingContent }),
         children,
@@ -555,7 +555,7 @@ function GoADatePicker({
       disabled,
       min: min == null ? void 0 : min.toISOString(),
       max: max == null ? void 0 : max.toISOString(),
-      "data-testid": testId,
+      testid: testId,
       mt,
       mr,
       mb,
@@ -571,7 +571,7 @@ function GoADetails(props) {
       heading: props.heading,
       open: props.open,
       maxwidth: props.maxWidth,
-      "data-testid": props.testId,
+      testid: props.testId,
       mt: props.mt,
       mr: props.mr,
       mb: props.mb,
@@ -588,7 +588,7 @@ function GoADivider(props) {
       mr: props.mr,
       mb: props.mb,
       ml: props.ml,
-      "data-testid": props.testId
+      testid: props.testId
     }
   );
 }
@@ -637,7 +637,7 @@ function GoADropdown(props) {
       multiselect: props.multiselect,
       native: props.native,
       placeholder: props.placeholder,
-      "data-testid": props.testId,
+      testid: props.testId,
       width: props.width,
       relative: props.relative,
       id: props.id,
@@ -696,7 +696,7 @@ function GoAFileUploadCard({
       type,
       progress,
       error,
-      "data-testid": testId
+      testid: testId
     }
   );
 }
@@ -726,7 +726,7 @@ function GoAFileUploadInput({
       variant,
       accept,
       maxfilesize: maxFileSize,
-      "data-testid": testId
+      testid: testId
     }
   );
 }
@@ -735,13 +735,13 @@ function GoAAppFooter({
   children,
   testId
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("goa-app-footer", { maxcontentwidth: maxContentWidth, "data-testid": testId, children });
+  return /* @__PURE__ */ jsxRuntime.jsx("goa-app-footer", { maxcontentwidth: maxContentWidth, testid: testId, children });
 }
 function GoAAppFooterMetaSection({ testId, children }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "goa-app-footer-meta-section",
     {
-      "data-testid": testId,
+      testid: testId,
       slot: "meta",
       children
     }
@@ -759,7 +759,7 @@ function GoAAppFooterNavSection({
       slot: "nav",
       heading,
       maxcolumncount: maxColumnCount,
-      "data-testid": testId,
+      testid: testId,
       children
     }
   );
@@ -792,7 +792,7 @@ function GoAFormItem({
       mr,
       mb,
       ml,
-      "data-testid": testId,
+      testid: testId,
       id,
       children: [
         error && typeof error !== "string" && /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "error", children: error }),
@@ -834,7 +834,7 @@ function GoAFormStepper({
     "goa-form-stepper",
     {
       ref,
-      "data-testid": testId,
+      testid: testId,
       step,
       mt,
       mr,
@@ -863,7 +863,7 @@ function GoAGrid({
       mr,
       mb,
       ml,
-      "data-testid": testId,
+      testid: testId,
       children
     }
   );
@@ -887,7 +887,7 @@ function GoAHeroBanner({
       maxcontentwidth: maxContentWidth,
       backgroundcolor: backgroundColor,
       textcolor: textColor,
-      "data-testid": testId,
+      testid: testId,
       children
     }
   );
@@ -943,7 +943,7 @@ function GoAIconButton({
       mr,
       mb,
       ml,
-      "data-testid": testId,
+      testid: testId,
       children
     }
   );
@@ -978,7 +978,7 @@ function GoAIcon({
       mr,
       mb,
       ml,
-      "data-testid": testId
+      testid: testId
     }
   );
 }
@@ -2677,7 +2677,7 @@ function GoAInput({
       readonly,
       placeholder,
       error,
-      "data-testid": testId,
+      testid: testId,
       value,
       width,
       min,
@@ -2860,18 +2860,38 @@ function GoAMicrositeHeader({
   maxContentWidth,
   feedbackUrlTarget,
   headerUrlTarget,
-  testId
+  testId,
+  onFeedbackClick
 }) {
+  const el = react.useRef(null);
+  react.useEffect(() => {
+    if (!el.current) {
+      return;
+    }
+    if (!onFeedbackClick) {
+      return;
+    }
+    const current = el.current;
+    const listener = () => {
+      onFeedbackClick();
+    };
+    current.addEventListener("_feedbackClick", listener);
+    return () => {
+      current.removeEventListener("_feedbackClick", listener);
+    };
+  }, [el, onFeedbackClick]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     "goa-microsite-header",
     {
+      ref: el,
       type,
       version: typeof version === "string" ? version : void 0,
       feedbackurl: feedbackUrl,
-      "data-testid": testId,
+      testid: testId,
       maxcontentwidth: maxContentWidth,
       feedbackurltarget: feedbackUrlTarget,
       headerurltarget: headerUrlTarget,
+      hasfeedbackhandler: !!onFeedbackClick,
       children: version && typeof version !== "string" && /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "version", children: version })
     }
   );
@@ -2921,7 +2941,7 @@ function GoAModal({
       maxwidth: maxWidth,
       transition,
       calloutvariant: calloutVariant,
-      "data-testid": testId,
+      testid: testId,
       role,
       children: [
         heading && /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "heading", children: heading }),
@@ -2958,7 +2978,7 @@ const GoANotification = ({
     {
       ref: el,
       type,
-      "data-testid": testId,
+      testid: testId,
       maxcontentwidth: maxContentWidth,
       arialive: ariaLive,
       children
@@ -2969,7 +2989,7 @@ function GoAOneColumnLayout(props) {
   return /* @__PURE__ */ jsxRuntime.jsx("goa-one-column-layout", { children: props.children });
 }
 function GoAPageBlock(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx("goa-page-block", { width: props.width, "data-testid": props.testId, children: props.children });
+  return /* @__PURE__ */ jsxRuntime.jsx("goa-page-block", { width: props.width, testid: props.testId, children: props.children });
 }
 function GoAPages(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -3012,7 +3032,7 @@ function GoAPagination({ onChange, ...props }) {
       mb: props.mb,
       ml: props.ml,
       mr: props.mr,
-      "data-testid": props.testId
+      testid: props.testId
     }
   );
 }
@@ -3033,7 +3053,7 @@ function GoAPopover({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "goa-popover",
     {
-      "data-testid": testId,
+      testid: testId,
       maxwidth: maxWidth,
       minwidth: minWidth,
       padded,
@@ -3127,7 +3147,7 @@ function GoARadioGroup({
   return /* @__PURE__ */ jsxRuntime.jsx(
     "goa-radio-group",
     {
-      "data-testid": testId,
+      testid: testId,
       ref: el,
       name,
       value,
@@ -3148,7 +3168,7 @@ function GoASideMenuGroup(props) {
     "goa-side-menu-group",
     {
       heading: props.heading,
-      "data-testid": props.testId,
+      testid: props.testId,
       children: props.children
     }
   );
@@ -3158,7 +3178,7 @@ function GoASideMenuHeading(props) {
     "goa-side-menu-heading",
     {
       icon: props.icon,
-      "data-testid": props.testId,
+      testid: props.testId,
       children: [
         props.children,
         props.meta && /* @__PURE__ */ jsxRuntime.jsx("span", { slot: "meta", children: props.meta })
@@ -3167,7 +3187,7 @@ function GoASideMenuHeading(props) {
   );
 }
 function GoASideMenu(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx("goa-side-menu", { "data-testid": props.testId, children: props.children });
+  return /* @__PURE__ */ jsxRuntime.jsx("goa-side-menu", { testid: props.testId, children: props.children });
 }
 const GoASkeleton = ({
   maxWidth,
@@ -3191,7 +3211,7 @@ const GoASkeleton = ({
       mr,
       mb,
       ml,
-      "data-testid": testId
+      testid: testId
     }
   );
 };
@@ -3201,7 +3221,7 @@ function GoASpacer(props) {
     {
       hspacing: props.hSpacing,
       vspacing: props.vSpacing,
-      "data-testid": props.testId
+      testid: props.testId
     }
   );
 }
@@ -3219,7 +3239,7 @@ function GoASpinner({
       size,
       progress,
       invert,
-      "data-testid": testId
+      testid: testId
     }
   );
 }
@@ -3246,7 +3266,7 @@ function GoATable({ onSort, ...props }) {
       width: props.width,
       stickyheader: false,
       variant: props.variant,
-      "data-testid": props.testId,
+      testid: props.testId,
       mt: props.mt,
       mb: props.mb,
       ml: props.ml,
@@ -3282,7 +3302,7 @@ function GoATabs({
       };
     }
   }, [onChange]);
-  return /* @__PURE__ */ jsxRuntime.jsx("goa-tabs", { ref, initialtab: initialTab, "data-testid": testId, children });
+  return /* @__PURE__ */ jsxRuntime.jsx("goa-tabs", { ref, initialtab: initialTab, testid: testId, children });
 }
 function GoATab({ heading, children }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("goa-tab", { children: [
@@ -3353,7 +3373,7 @@ function GoATextarea({
       width,
       maxwidth: maxWidth,
       error,
-      "data-testid": testId,
+      testid: testId,
       arialabel: ariaLabel,
       mt,
       mr,
@@ -3387,7 +3407,7 @@ function GoATooltip(props) {
       position: props.position,
       content: props.content,
       halign: props.hAlign,
-      "data-testid": props.testId,
+      testid: props.testId,
       mt: props.mt,
       mr: props.mr,
       mb: props.mb,