@abgov/react-components 5.0.0-alpha.10 → 5.0.0-alpha.12

package/index.mjs

@@ -7,21 +7,39 @@ function GoAAccordion({
   headingSize,
   secondaryText,
   headingContent,
+  iconPosition,
   maxWidth,
   testid,
+  onChange,
   children,
   mt,
   mr,
   mb,
   ml
 }) {
+  const ref = useRef(null);
+  useEffect(() => {
+    const element = ref.current;
+    if (element && onChange) {
+      const handler = (event) => {
+        const customEvent = event;
+        onChange(customEvent.detail.open);
+      };
+      element.addEventListener("_change", handler);
+      return () => {
+        element.removeEventListener("_change", handler);
+      };
+    }
+  }, [onChange]);
   return /* @__PURE__ */ jsxs(
     "goa-accordion",
     {
+      ref,
       open,
       headingSize,
       heading,
       secondaryText,
+      iconposition: iconPosition,
       maxwidth: maxWidth,
       testid,
       mt,
@@ -41,16 +59,36 @@ function GoAAppHeader({
   maxContentWidth,
   fullMenuBreakpoint,
   testId,
-  children
+  children,
+  onMenuClick
 }) {
+  const el = useRef(null);
+  useEffect(() => {
+    if (!el.current) {
+      return;
+    }
+    if (!onMenuClick) {
+      return;
+    }
+    const current = el.current;
+    const listener = () => {
+      onMenuClick();
+    };
+    current.addEventListener("_menuClick", listener);
+    return () => {
+      current.removeEventListener("_menuClick", listener);
+    };
+  }, [el, onMenuClick]);
   return /* @__PURE__ */ jsx(
     "goa-app-header",
     {
+      ref: el,
       heading,
       url,
       fullmenubreakpoint: fullMenuBreakpoint,
       maxcontentwidth: maxContentWidth,
       testid: testId,
+      hasmenuclickhandler: !!onMenuClick,
       children
     }
   );
@@ -324,6 +362,7 @@ function GoACalendar({
 const GoACallout = ({
   heading,
   type = "information",
+  iconTheme = "outline",
   size = "large",
   maxWidth,
   testId,
@@ -342,6 +381,7 @@ const GoACallout = ({
       size,
       maxwidth: maxWidth,
       arialive: ariaLive,
+      icontheme: iconTheme,
       mt,
       mr,
       mb,
@@ -3216,7 +3256,12 @@ function GoASideMenuGroup(props) {
     "goa-side-menu-group",
     {
       heading: props.heading,
+      icon: props.icon,
       testid: props.testId,
+      mt: props.mt,
+      mr: props.mr,
+      mb: props.mb,
+      ml: props.ml,
       children: props.children
     }
   );
@@ -3494,6 +3539,42 @@ function GoATwoColumnLayout(props) {
     }
   );
 }
+const GoAFilterChip = ({
+  iconTheme = "outline",
+  error = false,
+  content,
+  onClick,
+  mt,
+  mr,
+  mb,
+  ml,
+  testId
+}) => {
+  const el = useRef(null);
+  useEffect(() => {
+    if (!el.current) return;
+    if (!onClick) return;
+    const current = el.current;
+    current.addEventListener("_click", onClick);
+    return () => {
+      current.removeEventListener("_click", onClick);
+    };
+  }, [el, onClick]);
+  return /* @__PURE__ */ jsx(
+    "goa-filter-chip",
+    {
+      ref: el,
+      icontheme: iconTheme,
+      error,
+      content,
+      mt,
+      mr,
+      mb,
+      ml,
+      "data-testid": testId
+    }
+  );
+};
 export {
   GoAAccordion,
   GoAAppFooter,
@@ -3521,6 +3602,7 @@ export {
   GoAFieldset,
   GoAFileUploadCard,
   GoAFileUploadInput,
+  GoAFilterChip,
   GoAFormItem,
   GoAFormStep,
   GoAFormStepper,