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

package/index.mjs

@@ -22,7 +22,7 @@ function GoAAccordion({
       heading,
       secondaryText,
       maxwidth: maxWidth,
-      "data-testid": testid,
+      testid,
       mt,
       mr,
       mb,
@@ -49,7 +49,7 @@ function GoAAppHeader({
       url,
       fullmenubreakpoint: fullMenuBreakpoint,
       maxcontentwidth: maxContentWidth,
-      "data-testid": testId,
+      testid: testId,
       children
     }
   );
@@ -60,7 +60,7 @@ function GoAAppHeaderMenu(props) {
     {
       heading: props.heading,
       leadingicon: props.leadingIcon,
-      "data-testid": props.testId,
+      testid: props.testId,
       children: props.children
     }
   );
@@ -82,7 +82,7 @@ function GoABadge({
       type,
       content,
       icon,
-      "data-testid": testId,
+      testid: testId,
       arialabel: ariaLabel,
       mt,
       mr,
@@ -202,7 +202,7 @@ function GoABlock(props) {
       mr: props.mr,
       mb: props.mb,
       ml: props.ml,
-      "data-testid": props.testId,
+      testid: props.testId,
       children: props.children
     }
   );
@@ -249,7 +249,7 @@ function GoAButton({
       disabled,
       leadingicon: leadingIcon,
       trailingicon: trailingIcon,
-      "data-testid": testId,
+      testid: testId,
       mt,
       mr,
       mb,
@@ -277,7 +277,7 @@ function GoAButtonGroup({
       mr,
       mb,
       ml,
-      "data-testid": testId,
+      testid: testId,
       children
     }
   );
@@ -312,7 +312,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,
@@ -345,7 +345,7 @@ const GoACallout = ({
       mr,
       mb,
       ml,
-      "data-testid": testId,
+      testid: testId,
       children
     }
   );
@@ -387,7 +387,7 @@ function GoACheckbox({
   return /* @__PURE__ */ jsxs(
     "goa-checkbox",
     {
-      "data-testid": testId,
+      testid: testId,
       ref: el,
       id,
       name,
@@ -451,7 +451,7 @@ const GoAChip = ({
       mr,
       mb,
       ml,
-      "data-testid": testId
+      testid: testId
     }
   );
 };
@@ -471,7 +471,7 @@ const GoACircularProgress = ({
       progress,
       variant,
       size,
-      "data-testid": testId
+      testid: testId
     }
   );
 };
@@ -504,7 +504,7 @@ function GoAContainer({
       mr,
       mb,
       ml,
-      "data-testid": testId,
+      testid: testId,
       children: [
         headingContent && /* @__PURE__ */ jsx("div", { slot: "title", children: headingContent }),
         children,
@@ -553,7 +553,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,
@@ -569,7 +569,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,
@@ -586,7 +586,7 @@ function GoADivider(props) {
       mr: props.mr,
       mb: props.mb,
       ml: props.ml,
-      "data-testid": props.testId
+      testid: props.testId
     }
   );
 }
@@ -635,7 +635,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,
@@ -694,7 +694,7 @@ function GoAFileUploadCard({
       type,
       progress,
       error,
-      "data-testid": testId
+      testid: testId
     }
   );
 }
@@ -724,7 +724,7 @@ function GoAFileUploadInput({
       variant,
       accept,
       maxfilesize: maxFileSize,
-      "data-testid": testId
+      testid: testId
     }
   );
 }
@@ -733,13 +733,13 @@ function GoAAppFooter({
   children,
   testId
 }) {
-  return /* @__PURE__ */ jsx("goa-app-footer", { maxcontentwidth: maxContentWidth, "data-testid": testId, children });
+  return /* @__PURE__ */ jsx("goa-app-footer", { maxcontentwidth: maxContentWidth, testid: testId, children });
 }
 function GoAAppFooterMetaSection({ testId, children }) {
   return /* @__PURE__ */ jsx(
     "goa-app-footer-meta-section",
     {
-      "data-testid": testId,
+      testid: testId,
       slot: "meta",
       children
     }
@@ -757,7 +757,7 @@ function GoAAppFooterNavSection({
       slot: "nav",
       heading,
       maxcolumncount: maxColumnCount,
-      "data-testid": testId,
+      testid: testId,
       children
     }
   );
@@ -790,7 +790,7 @@ function GoAFormItem({
       mr,
       mb,
       ml,
-      "data-testid": testId,
+      testid: testId,
       id,
       children: [
         error && typeof error !== "string" && /* @__PURE__ */ jsx("div", { slot: "error", children: error }),
@@ -832,7 +832,7 @@ function GoAFormStepper({
     "goa-form-stepper",
     {
       ref,
-      "data-testid": testId,
+      testid: testId,
       step,
       mt,
       mr,
@@ -861,7 +861,7 @@ function GoAGrid({
       mr,
       mb,
       ml,
-      "data-testid": testId,
+      testid: testId,
       children
     }
   );
@@ -885,7 +885,7 @@ function GoAHeroBanner({
       maxcontentwidth: maxContentWidth,
       backgroundcolor: backgroundColor,
       textcolor: textColor,
-      "data-testid": testId,
+      testid: testId,
       children
     }
   );
@@ -941,7 +941,7 @@ function GoAIconButton({
       mr,
       mb,
       ml,
-      "data-testid": testId,
+      testid: testId,
       children
     }
   );
@@ -976,7 +976,7 @@ function GoAIcon({
       mr,
       mb,
       ml,
-      "data-testid": testId
+      testid: testId
     }
   );
 }
@@ -2675,7 +2675,7 @@ function GoAInput({
       readonly,
       placeholder,
       error,
-      "data-testid": testId,
+      testid: testId,
       value,
       width,
       min,
@@ -2858,18 +2858,38 @@ function GoAMicrositeHeader({
   maxContentWidth,
   feedbackUrlTarget,
   headerUrlTarget,
-  testId
+  testId,
+  onFeedbackClick
 }) {
+  const el = useRef(null);
+  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__ */ 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__ */ jsx("div", { slot: "version", children: version })
     }
   );
@@ -2919,7 +2939,7 @@ function GoAModal({
       maxwidth: maxWidth,
       transition,
       calloutvariant: calloutVariant,
-      "data-testid": testId,
+      testid: testId,
       role,
       children: [
         heading && /* @__PURE__ */ jsx("div", { slot: "heading", children: heading }),
@@ -2956,7 +2976,7 @@ const GoANotification = ({
     {
       ref: el,
       type,
-      "data-testid": testId,
+      testid: testId,
       maxcontentwidth: maxContentWidth,
       arialive: ariaLive,
       children
@@ -2967,7 +2987,7 @@ function GoAOneColumnLayout(props) {
   return /* @__PURE__ */ jsx("goa-one-column-layout", { children: props.children });
 }
 function GoAPageBlock(props) {
-  return /* @__PURE__ */ jsx("goa-page-block", { width: props.width, "data-testid": props.testId, children: props.children });
+  return /* @__PURE__ */ jsx("goa-page-block", { width: props.width, testid: props.testId, children: props.children });
 }
 function GoAPages(props) {
   return /* @__PURE__ */ jsx(
@@ -3010,7 +3030,7 @@ function GoAPagination({ onChange, ...props }) {
       mb: props.mb,
       ml: props.ml,
       mr: props.mr,
-      "data-testid": props.testId
+      testid: props.testId
     }
   );
 }
@@ -3031,7 +3051,7 @@ function GoAPopover({
   return /* @__PURE__ */ jsxs(
     "goa-popover",
     {
-      "data-testid": testId,
+      testid: testId,
       maxwidth: maxWidth,
       minwidth: minWidth,
       padded,
@@ -3125,7 +3145,7 @@ function GoARadioGroup({
   return /* @__PURE__ */ jsx(
     "goa-radio-group",
     {
-      "data-testid": testId,
+      testid: testId,
       ref: el,
       name,
       value,
@@ -3146,7 +3166,7 @@ function GoASideMenuGroup(props) {
     "goa-side-menu-group",
     {
       heading: props.heading,
-      "data-testid": props.testId,
+      testid: props.testId,
       children: props.children
     }
   );
@@ -3156,7 +3176,7 @@ function GoASideMenuHeading(props) {
     "goa-side-menu-heading",
     {
       icon: props.icon,
-      "data-testid": props.testId,
+      testid: props.testId,
       children: [
         props.children,
         props.meta && /* @__PURE__ */ jsx("span", { slot: "meta", children: props.meta })
@@ -3165,7 +3185,7 @@ function GoASideMenuHeading(props) {
   );
 }
 function GoASideMenu(props) {
-  return /* @__PURE__ */ jsx("goa-side-menu", { "data-testid": props.testId, children: props.children });
+  return /* @__PURE__ */ jsx("goa-side-menu", { testid: props.testId, children: props.children });
 }
 const GoASkeleton = ({
   maxWidth,
@@ -3189,7 +3209,7 @@ const GoASkeleton = ({
       mr,
       mb,
       ml,
-      "data-testid": testId
+      testid: testId
     }
   );
 };
@@ -3199,7 +3219,7 @@ function GoASpacer(props) {
     {
       hspacing: props.hSpacing,
       vspacing: props.vSpacing,
-      "data-testid": props.testId
+      testid: props.testId
     }
   );
 }
@@ -3217,7 +3237,7 @@ function GoASpinner({
       size,
       progress,
       invert,
-      "data-testid": testId
+      testid: testId
     }
   );
 }
@@ -3244,7 +3264,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,
@@ -3280,7 +3300,7 @@ function GoATabs({
       };
     }
   }, [onChange]);
-  return /* @__PURE__ */ jsx("goa-tabs", { ref, initialtab: initialTab, "data-testid": testId, children });
+  return /* @__PURE__ */ jsx("goa-tabs", { ref, initialtab: initialTab, testid: testId, children });
 }
 function GoATab({ heading, children }) {
   return /* @__PURE__ */ jsxs("goa-tab", { children: [
@@ -3351,7 +3371,7 @@ function GoATextarea({
       width,
       maxwidth: maxWidth,
       error,
-      "data-testid": testId,
+      testid: testId,
       arialabel: ariaLabel,
       mt,
       mr,
@@ -3385,7 +3405,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,