@abgov/react-components 5.4.0 → 6.0.0-alpha.1

package/index.js

@@ -2,8 +2,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
-const icon = require("./icon-1IRcN4Uf.js");
-function GoAAccordion({
+const icon = require("./icon-DmXlIizF.js");
+function GoabAccordion({
   open,
   heading,
   headingSize,
@@ -38,9 +38,9 @@ function GoAAccordion({
     {
       ref,
       open,
-      headingSize,
+      headingsize: headingSize,
       heading,
-      secondaryText,
+      secondarytext: secondaryText,
       iconposition: iconPosition,
       maxwidth: maxWidth,
       testid,
@@ -55,7 +55,7 @@ function GoAAccordion({
     }
   );
 }
-function GoAAppHeader({
+function GoabAppHeader({
   heading,
   url,
   maxContentWidth,
@@ -95,7 +95,7 @@ function GoAAppHeader({
     }
   );
 }
-function GoAAppHeaderMenu(props) {
+function GoabAppHeaderMenu(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "goa-app-header-menu",
     {
@@ -106,7 +106,7 @@ function GoAAppHeaderMenu(props) {
     }
   );
 }
-function GoABadge({
+function GoabBadge({
   type,
   content,
   icon: icon2,
@@ -132,7 +132,7 @@ function GoABadge({
     }
   );
 }
-function GoAInfoBadge({
+function GoabInfoBadge({
   content,
   testId,
   icon: icon2,
@@ -143,7 +143,7 @@ function GoAInfoBadge({
   ariaLabel
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
-    GoABadge,
+    GoabBadge,
     {
       type: "information",
       icon: icon2,
@@ -157,7 +157,7 @@ function GoAInfoBadge({
     }
   );
 }
-function GoASuccessBadge({
+function GoabSuccessBadge({
   content,
   testId,
   icon: icon2,
@@ -168,7 +168,7 @@ function GoASuccessBadge({
   ariaLabel
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
-    GoABadge,
+    GoabBadge,
     {
       type: "success",
       icon: icon2,
@@ -182,7 +182,7 @@ function GoASuccessBadge({
     }
   );
 }
-function GoAImportantBadge({
+function GoabImportantBadge({
   content,
   testId,
   icon: icon2,
@@ -193,7 +193,7 @@ function GoAImportantBadge({
   ariaLabel
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
-    GoABadge,
+    GoabBadge,
     {
       type: "important",
       icon: icon2,
@@ -207,7 +207,7 @@ function GoAImportantBadge({
     }
   );
 }
-function GoAEmergencyBadge({
+function GoabEmergencyBadge({
   content,
   testId,
   icon: icon2,
@@ -218,7 +218,7 @@ function GoAEmergencyBadge({
   ariaLabel
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
-    GoABadge,
+    GoabBadge,
     {
       type: "emergency",
       icon: icon2,
@@ -232,7 +232,7 @@ function GoAEmergencyBadge({
     }
   );
 }
-function GoABlock(props) {
+function GoabBlock(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "goa-block",
     {
@@ -248,7 +248,7 @@ function GoABlock(props) {
     }
   );
 }
-function GoAButton({
+function GoabButton({
   disabled = false,
   type = "primary",
   size,
@@ -301,7 +301,7 @@ function GoAButton({
     }
   );
 }
-function GoAButtonGroup({
+function GoabButtonGroup({
   alignment,
   gap,
   testId,
@@ -325,7 +325,7 @@ function GoAButtonGroup({
     }
   );
 }
-function GoACalendar({
+function GoabCalendar({
   name,
   value,
   min,
@@ -344,7 +344,10 @@ function GoACalendar({
     }
     const current = ref.current;
     current.addEventListener("_change", (e) => {
-      onChange(name || "", e.detail.value);
+      onChange({
+        name: name || "",
+        value: e.detail.value
+      });
     });
   });
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -363,7 +366,7 @@ function GoACalendar({
     }
   );
 }
-const GoACallout = ({
+const GoabCallout = ({
   heading,
   type = "information",
   iconTheme = "outline",
@@ -395,7 +398,7 @@ const GoACallout = ({
     }
   );
 };
-function GoACheckbox({
+function GoabCheckbox({
   id,
   name,
   testId,
@@ -421,8 +424,8 @@ function GoACheckbox({
     }
     const current = el.current;
     const listener = (e) => {
-      const ce = e;
-      onChange == null ? void 0 : onChange(name, ce.detail.checked, ce.detail.value);
+      const detail = e.detail;
+      onChange == null ? void 0 : onChange(detail);
     };
     current.addEventListener("_change", listener);
     return () => {
@@ -455,7 +458,7 @@ function GoACheckbox({
     }
   );
 }
-const GoAChip = ({
+const GoabChip = ({
   leadingIcon = "",
   iconTheme = "outline",
   deletable = false,
@@ -500,7 +503,7 @@ const GoAChip = ({
     }
   );
 };
-const GoACircularProgress = ({
+const GoabCircularProgress = ({
   visible,
   message: message2,
   progress,
@@ -520,7 +523,7 @@ const GoACircularProgress = ({
     }
   );
 };
-function GoAContainer({
+function GoabContainer({
   accent,
   heading,
   title,
@@ -558,7 +561,7 @@ function GoAContainer({
     }
   );
 }
-function GoADatePicker({
+function GoabDatePicker({
   name,
   value,
   error,
@@ -580,8 +583,8 @@ function GoADatePicker({
     }
     const current = ref.current;
     const handleChange = (e) => {
-      const newValue = e.detail.value;
-      onChange == null ? void 0 : onChange(name || "", newValue ? new Date(newValue) : void 0);
+      const detail = e.detail;
+      onChange(detail);
     };
     current.addEventListener("_change", handleChange);
     return () => {
@@ -607,7 +610,7 @@ function GoADatePicker({
     }
   );
 }
-function GoADetails(props) {
+function GoabDetails(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "goa-details",
     {
@@ -623,7 +626,7 @@ function GoADetails(props) {
     }
   );
 }
-function GoADivider(props) {
+function GoabDivider(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "goa-divider",
     {
@@ -644,7 +647,7 @@ function stringify(value) {
   }
   return JSON.stringify(value);
 }
-function GoADropdown(props) {
+function GoabDropdown(props) {
   const el = react.useRef(null);
   react.useEffect(() => {
     if (!el.current) {
@@ -652,9 +655,8 @@ function GoADropdown(props) {
     }
     const current = el.current;
     const handler = (e) => {
-      var _a;
-      const { name, value, values } = e.detail;
-      (_a = props.onChange) == null ? void 0 : _a.call(props, name, props.multiselect ? values : value);
+      const detail = e.detail;
+      props.onChange(detail);
     };
     current.addEventListener("_change", handler);
     return () => {
@@ -689,17 +691,16 @@ function GoADropdown(props) {
     }
   );
 }
-function GoADropdownOption(props) {
+function GoabDropdownOption(props) {
   react.useEffect(() => {
-    console.warn("GoADropdownOption is deprecated. Please use GoADropdownItem");
+    console.warn("GoabDropdownOption is deprecated. Please use GoabDropdownItem");
   }, []);
-  return /* @__PURE__ */ jsxRuntime.jsx(GoADropdownItem, { ...props });
+  return /* @__PURE__ */ jsxRuntime.jsx(GoabDropdownItem, { ...props });
 }
-function GoADropdownItem({ value, label, filter, name, testId, mountType = "reset" }) {
+function GoabDropdownItem({ value, label, filter, name, mountType = "append" }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "goa-dropdown-item",
     {
-      "data-testid": testId,
       value,
       label,
       filter,
@@ -708,7 +709,7 @@ function GoADropdownItem({ value, label, filter, name, testId, mountType = "rese
     }
   );
 }
-function GoAFieldset({
+function GoabFieldset({
   heading,
   buttonText,
   id,
@@ -725,8 +726,8 @@ function GoAFieldset({
   react.useEffect(() => {
     var _a;
     const _continue = (e) => {
-      const { el, state } = e.detail;
-      return onContinue == null ? void 0 : onContinue(el, state);
+      const event = e.detail;
+      return onContinue == null ? void 0 : onContinue(event);
     };
     if (onContinue) {
       (_a = ref.current) == null ? void 0 : _a.addEventListener("_continue", _continue);
@@ -755,7 +756,7 @@ function GoAFieldset({
     }
   );
 }
-function GoAFileUploadCard({
+function GoabFileUploadCard({
   filename,
   size,
   type,
@@ -769,8 +770,8 @@ function GoAFileUploadCard({
   react.useEffect(() => {
     if (!el.current) return;
     const current = el.current;
-    const deleteHandler = () => onDelete == null ? void 0 : onDelete();
-    const cancelHandler = () => onCancel == null ? void 0 : onCancel();
+    const deleteHandler = () => onDelete == null ? void 0 : onDelete({ filename });
+    const cancelHandler = () => onCancel == null ? void 0 : onCancel({ filename });
     current.addEventListener("_delete", deleteHandler);
     current.addEventListener("_cancel", cancelHandler);
     return () => {
@@ -791,7 +792,7 @@ function GoAFileUploadCard({
     }
   );
 }
-function GoAFileUploadInput({
+function GoabFileUploadInput({
   variant,
   accept,
   maxFileSize,
@@ -803,7 +804,8 @@ function GoAFileUploadInput({
     if (!el.current) return;
     const current = el.current;
     const handler = (e) => {
-      onSelectFile(e.detail.file);
+      const detail = e.detail;
+      onSelectFile(detail);
     };
     current.addEventListener("_selectFile", handler);
     return () => {
@@ -821,14 +823,17 @@ function GoAFileUploadInput({
     }
   );
 }
-function GoAAppFooter({
+function GoabAppFooter({
   maxContentWidth,
   children,
   testId
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx("goa-app-footer", { maxcontentwidth: maxContentWidth, testid: testId, children });
 }
-function GoAAppFooterMetaSection({ testId, children }) {
+function GoabAppFooterMetaSection({
+  testId,
+  children
+}) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "goa-app-footer-meta-section",
     {
@@ -838,7 +843,7 @@ function GoAAppFooterMetaSection({ testId, children }) {
     }
   );
 }
-function GoAAppFooterNavSection({
+function GoabAppFooterNavSection({
   heading,
   maxColumnCount = 1,
   testId,
@@ -855,7 +860,7 @@ function GoAAppFooterNavSection({
     }
   );
 }
-function GoAFormItem({
+function GoabFormItem({
   children,
   helpText,
   error,
@@ -893,10 +898,10 @@ function GoAFormItem({
     }
   );
 }
-function GoAFormStep(props) {
+function GoabFormStep(props) {
   return /* @__PURE__ */ jsxRuntime.jsx("goa-form-step", { text: props.text, status: props.status });
 }
-function GoAFormStepper({
+function GoabFormStepper({
   testId,
   step,
   mt,
@@ -913,8 +918,8 @@ function GoAFormStepper({
     }
     const current = ref.current;
     const changeListener = (e) => {
-      const { step: step2 } = e.detail;
-      onChange == null ? void 0 : onChange(+step2);
+      const detail = e.detail;
+      onChange == null ? void 0 : onChange(detail);
     };
     current.addEventListener("_change", changeListener);
     return () => {
@@ -935,7 +940,7 @@ function GoAFormStepper({
     }
   );
 }
-function GoAGrid({
+function GoabGrid({
   gap,
   minChildWidth,
   mt,
@@ -949,8 +954,8 @@ function GoAGrid({
     "goa-grid",
     {
       gap,
-      mt,
       minchildwidth: minChildWidth,
+      mt,
       mr,
       mb,
       ml,
@@ -959,7 +964,7 @@ function GoAGrid({
     }
   );
 }
-function GoAHeroBanner({
+function GoabHeroBanner({
   heading,
   backgroundUrl,
   minHeight,
@@ -983,12 +988,12 @@ function GoAHeroBanner({
     }
   );
 }
-function GoAHeroBannerActions({
+function GoabHeroBannerActions({
   children
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx("div", { slot: "actions", children });
 }
-function GoAIconButton({
+function GoabIconButton({
   icon: icon2,
   disabled,
   variant = "color",
@@ -2643,7 +2648,7 @@ function validateTime(hours, minutes, seconds) {
 function validateTimezone(_hours, minutes) {
   return minutes >= 0 && minutes <= 59;
 }
-function GoAInput({
+function GoabInput({
   id,
   debounce,
   name,
@@ -2686,23 +2691,23 @@ function GoAInput({
     }
     const current = ref.current;
     const changeListener = (e) => {
-      const { name: name2, value: value2 } = e.detail;
-      onChange == null ? void 0 : onChange(name2, value2);
+      const detail = e.detail;
+      onChange(detail);
     };
     const clickListener = () => {
       onTrailingIconClick == null ? void 0 : onTrailingIconClick();
     };
     const focusListener = (e) => {
-      const { name: name2, value: value2 } = e.detail;
-      onFocus == null ? void 0 : onFocus(name2, value2);
+      const detail = e.detail;
+      onFocus == null ? void 0 : onFocus(detail);
     };
     const blurListener = (e) => {
-      const { name: name2, value: value2 } = e.detail;
-      onBlur == null ? void 0 : onBlur(name2, value2);
+      const detail = e.detail;
+      onBlur == null ? void 0 : onBlur(detail);
     };
     const keypressListener = (e) => {
-      const { name: name2, value: value2, key } = e.detail;
-      onKeyPress == null ? void 0 : onKeyPress(name2, value2, key);
+      const detail = e.detail;
+      onKeyPress == null ? void 0 : onKeyPress(detail);
     };
     current.addEventListener("_change", changeListener);
     current.addEventListener("_trailingIconClick", clickListener);
@@ -2757,25 +2762,28 @@ function GoAInput({
   );
 }
 const onDateChangeHandler = (onChange) => {
-  return (name, value) => {
-    if (!onChange) return;
+  return ({ name, value }) => {
     if (!value) {
-      onChange(name, "");
+      onChange({ name, value: "" });
+      return;
+    }
+    if (typeof value === "string" && isValid(new Date(value))) {
+      onChange({ name, value: parseISO(value) });
       return;
     }
-    if (isValid(new Date(value))) {
-      onChange(name, parseISO(value));
+    if (isValid(value)) {
+      onChange({ name, value });
+      return;
     }
   };
 };
 const onTimeChangeHandler = (onChange) => {
-  return (name, value) => {
-    if (!onChange) return;
+  return ({ name, value }) => {
     if (!value) {
-      onChange(name, "");
+      onChange({ name, value: "" });
       return;
     }
-    onChange(name, value);
+    onChange({ name, value });
   };
 };
 function toString(value, tmpl = "yyyy-MM-dd") {
@@ -2790,20 +2798,20 @@ function toString(value, tmpl = "yyyy-MM-dd") {
   }
   return format(value, tmpl);
 }
-function GoAInputText(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx(GoAInput, { ...props, type: "text" });
+function GoabInputText(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(GoabInput, { ...props, type: "text" });
 }
-function GoAInputPassword(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx(GoAInput, { ...props, type: "password" });
+function GoabInputPassword(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(GoabInput, { ...props, type: "password" });
 }
-function GoAInputDate({
+function GoabInputDate({
   value,
   min = "",
   max = "",
   ...props
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
-    GoAInput,
+    GoabInput,
     {
       ...props,
       type: "date",
@@ -2814,14 +2822,14 @@ function GoAInputDate({
     }
   );
 }
-function GoAInputTime({
+function GoabInputTime({
   value,
   min = "",
   max = "",
   ...props
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
-    GoAInput,
+    GoabInput,
     {
       ...props,
       onChange: onTimeChangeHandler(props.onChange),
@@ -2830,14 +2838,14 @@ function GoAInputTime({
     }
   );
 }
-function GoAInputDateTime({
+function GoabInputDateTime({
   value,
   min = "",
   max = "",
   ...props
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
-    GoAInput,
+    GoabInput,
     {
       ...props,
       onChange: onDateChangeHandler(props.onChange),
@@ -2846,60 +2854,56 @@ function GoAInputDateTime({
     }
   );
 }
-function GoAInputEmail(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx(GoAInput, { ...props, type: "email" });
+function GoabInputEmail(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(GoabInput, { ...props, type: "email" });
 }
-function GoAInputSearch(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx(GoAInput, { ...props, type: "search", trailingIcon: "search" });
+function GoabInputSearch(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(GoabInput, { ...props, type: "search", trailingIcon: "search" });
 }
-function GoAInputUrl(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx(GoAInput, { ...props, type: "url" });
+function GoabInputUrl(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(GoabInput, { ...props, type: "url" });
 }
-function GoAInputTel(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx(GoAInput, { ...props, type: "tel" });
+function GoabInputTel(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(GoabInput, { ...props, type: "tel" });
 }
-function GoAInputFile(props) {
+function GoabInputFile(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "input",
     {
       id: props.id,
       name: props.name,
       type: "file",
-      onChange: (e) => {
-        var _a;
-        return (_a = props.onChange) == null ? void 0 : _a.call(props, e.target.name, e.target.value);
-      },
+      onChange: (e) => props.onChange({ name: e.target.name, value: e.target.value }),
       style: { backgroundColor: "revert" }
     }
   );
 }
-function GoAInputMonth(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx(GoAInput, { ...props, type: "month" });
+function GoabInputMonth(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(GoabInput, { ...props, type: "month" });
 }
-function GoAInputNumber({
+function GoabInputNumber({
   min = Number.MIN_VALUE,
   max = Number.MAX_VALUE,
   value,
   ...props
 }) {
-  const onNumberChange = (name, value2) => {
-    var _a;
-    (_a = props.onChange) == null ? void 0 : _a.call(props, name, parseFloat(value2));
+  const onNumberChange = ({ name, value: value2 }) => {
+    props.onChange({ name, value: parseFloat(value2) });
   };
-  const onFocus = (name, value2) => {
+  const onFocus = ({ name, value: value2 }) => {
     var _a;
-    (_a = props.onFocus) == null ? void 0 : _a.call(props, name, parseFloat(value2));
+    (_a = props.onFocus) == null ? void 0 : _a.call(props, { name, value: parseFloat(value2) });
   };
-  const onBlur = (name, value2) => {
+  const onBlur = ({ name, value: value2 }) => {
     var _a;
-    (_a = props.onBlur) == null ? void 0 : _a.call(props, name, parseFloat(value2));
+    (_a = props.onBlur) == null ? void 0 : _a.call(props, { name, value: parseFloat(value2) });
   };
-  const onKeyPress = (name, value2, key) => {
+  const onKeyPress = ({ name, value: value2, key }) => {
     var _a;
-    (_a = props.onKeyPress) == null ? void 0 : _a.call(props, name, parseFloat(value2), key);
+    (_a = props.onKeyPress) == null ? void 0 : _a.call(props, { name, value: parseFloat(value2), key: parseInt(key) });
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
-    GoAInput,
+    GoabInput,
     {
       ...props,
       onChange: onNumberChange,
@@ -2913,8 +2917,8 @@ function GoAInputNumber({
     }
   );
 }
-function GoAInputRange(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx(GoAInput, { ...props, type: "range" });
+function GoabInputRange(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(GoabInput, { ...props, type: "range" });
 }
 function GoALink(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -2945,7 +2949,7 @@ function GoALinkButton({ type = "primary", ...props }) {
     }
   );
 }
-function GoAMicrositeHeader({
+function GoabMicrositeHeader({
   type,
   version,
   feedbackUrl,
@@ -2988,29 +2992,19 @@ function GoAMicrositeHeader({
     }
   );
 }
-function GoAModal({
+function GoabModal({
   heading,
   children,
   maxWidth,
   open,
   actions,
   transition,
-  type,
   calloutVariant,
   onClose,
   testId,
-  role,
-  width
+  role
 }) {
   const el = react.useRef(null);
-  react.useEffect(() => {
-    if (type) {
-      console.warn("GoAModal [type] is deprecated.");
-    }
-  }, [type]);
-  react.useEffect(() => {
-    maxWidth = width;
-  }, [width]);
   react.useEffect(() => {
     if (!el.current) {
       return;
@@ -3043,7 +3037,7 @@ function GoAModal({
     }
   );
 }
-const GoANotification = ({
+const GoabNotification = ({
   type = "information",
   ariaLive,
   maxContentWidth,
@@ -3077,13 +3071,13 @@ const GoANotification = ({
     }
   );
 };
-function GoAOneColumnLayout(props) {
+function GoabOneColumnLayout(props) {
   return /* @__PURE__ */ jsxRuntime.jsx("goa-one-column-layout", { children: props.children });
 }
-function GoAPageBlock(props) {
+function GoabPageBlock(props) {
   return /* @__PURE__ */ jsxRuntime.jsx("goa-page-block", { width: props.width, testid: props.testId, children: props.children });
 }
-function GoAPages(props) {
+function GoabPages(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "goa-pages",
     {
@@ -3096,7 +3090,7 @@ function GoAPages(props) {
     }
   );
 }
-function GoAPagination({ onChange, ...props }) {
+function GoabPagination({ onChange, ...props }) {
   const ref = react.useRef();
   react.useEffect(() => {
     if (!ref.current) {
@@ -3104,8 +3098,8 @@ function GoAPagination({ onChange, ...props }) {
     }
     const current = ref.current;
     const changeListener = (e) => {
-      const { page } = e.detail;
-      onChange(page);
+      const detail = e.detail;
+      onChange(detail);
     };
     current.addEventListener("_change", changeListener);
     return () => {
@@ -3128,7 +3122,7 @@ function GoAPagination({ onChange, ...props }) {
     }
   );
 }
-function GoAPopover({
+function GoabPopover({
   target,
   testId,
   maxWidth,
@@ -3162,7 +3156,7 @@ function GoAPopover({
     }
   );
 }
-function GoARadioItem({
+function GoabRadioItem({
   name,
   label,
   value,
@@ -3190,7 +3184,6 @@ function GoARadioItem({
       error,
       disabled,
       checked,
-      "data-testid": testId,
       arialabel: ariaLabel,
       mt,
       mr,
@@ -3203,7 +3196,7 @@ function GoARadioItem({
     }
   );
 }
-function GoARadioGroup({
+function GoabRadioGroup({
   name,
   value,
   children,
@@ -3220,15 +3213,14 @@ function GoARadioGroup({
 }) {
   const el = react.useRef(null);
   react.useEffect(() => {
-    if (!el.current) {
-      return;
-    }
+    if (!el.current) return;
     const listener = (e) => {
       if (!onChange) {
         console.warn("Missing onChange function");
         return;
       }
-      onChange(name, e.detail.value);
+      const detail = e.detail;
+      onChange(detail);
     };
     const currentEl = el.current;
     currentEl.addEventListener("_change", listener);
@@ -3255,7 +3247,7 @@ function GoARadioGroup({
     }
   );
 }
-function GoASideMenuGroup(props) {
+function GoabSideMenuGroup(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "goa-side-menu-group",
     {
@@ -3270,23 +3262,16 @@ function GoASideMenuGroup(props) {
     }
   );
 }
-function GoASideMenuHeading(props) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "goa-side-menu-heading",
-    {
-      icon: props.icon,
-      testid: props.testId,
-      children: [
-        props.children,
-        props.meta && /* @__PURE__ */ jsxRuntime.jsx("span", { slot: "meta", children: props.meta })
-      ]
-    }
-  );
+function GoabSideMenuHeading(props) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("goa-side-menu-heading", { icon: props.icon, testid: props.testId, children: [
+    props.children,
+    props.meta && /* @__PURE__ */ jsxRuntime.jsx("span", { slot: "meta", children: props.meta })
+  ] });
 }
-function GoASideMenu(props) {
+function GoabSideMenu(props) {
   return /* @__PURE__ */ jsxRuntime.jsx("goa-side-menu", { testid: props.testId, children: props.children });
 }
-const GoASkeleton = ({
+const GoabSkeleton = ({
   maxWidth,
   size,
   lineCount,
@@ -3312,7 +3297,7 @@ const GoASkeleton = ({
     }
   );
 };
-function GoASpacer(props) {
+function GoabSpacer(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "goa-spacer",
     {
@@ -3322,7 +3307,7 @@ function GoASpacer(props) {
     }
   );
 }
-function GoASpinner({
+function GoabSpinner({
   type,
   size,
   progress,
@@ -3340,7 +3325,7 @@ function GoASpinner({
     }
   );
 }
-function GoATable({ onSort, ...props }) {
+function GoabTable({ onSort, ...props }) {
   const ref = react.useRef(null);
   react.useEffect(() => {
     if (!ref.current) {
@@ -3348,8 +3333,8 @@ function GoATable({ onSort, ...props }) {
     }
     const current = ref.current;
     const sortListener = (e) => {
-      const { sortBy, sortDir } = e.detail;
-      onSort == null ? void 0 : onSort(sortBy, sortDir);
+      const detail = e.detail;
+      onSort == null ? void 0 : onSort(detail);
     };
     current.addEventListener("_sort", sortListener);
     return () => {
@@ -3372,14 +3357,14 @@ function GoATable({ onSort, ...props }) {
     }
   );
 }
-function GoATableSortHeader({
+function GoabTableSortHeader({
   name,
   direction = "none",
   children
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx("goa-table-sort-header", { name, direction, children });
 }
-function GoATabs({
+function GoabTabs({
   initialTab,
   children,
   testId,
@@ -3390,8 +3375,8 @@ function GoATabs({
     const element = ref.current;
     if (element && onChange) {
       const handler = (event) => {
-        const customEvent = event;
-        onChange(customEvent.detail.tab);
+        const detail = event.detail;
+        onChange(detail);
       };
       element.addEventListener("_change", handler);
       return () => {
@@ -3401,13 +3386,13 @@ function GoATabs({
   }, [onChange]);
   return /* @__PURE__ */ jsxRuntime.jsx("goa-tabs", { ref, initialtab: initialTab, testid: testId, children });
 }
-function GoATab({ heading, children }) {
+function GoabTab({ heading, children }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("goa-tab", { children: [
     heading && /* @__PURE__ */ jsxRuntime.jsx("span", { slot: "heading", children: heading }),
     children
   ] });
 }
-function GoAText(props) {
+function GoabText(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "goa-text",
     {
@@ -3422,7 +3407,7 @@ function GoAText(props) {
     }
   );
 }
-function GoATextarea({
+function GoabTextarea({
   name,
   value,
   placeholder,
@@ -3450,8 +3435,8 @@ function GoATextarea({
     }
     const current = el.current;
     const listener = (e) => {
-      const { name: name2, value: value2 } = e.detail;
-      onChange == null ? void 0 : onChange(name2, value2);
+      const detail = e.detail;
+      onChange(detail);
     };
     current.addEventListener("_change", listener);
     return () => {
@@ -3464,8 +3449,8 @@ function GoATextarea({
     }
     const current = el.current;
     const keypressListener = (e) => {
-      const { name: name2, value: value2, key } = e.detail;
-      onKeyPress == null ? void 0 : onKeyPress(name2, value2, key);
+      const detail = e.detail;
+      onKeyPress == null ? void 0 : onKeyPress(detail);
     };
     current.addEventListener("_keyPress", keypressListener);
     return () => {
@@ -3496,7 +3481,7 @@ function GoATextarea({
     }
   );
 }
-function GoAThreeColumnLayout(props) {
+function GoabThreeColumnLayout(props) {
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "goa-three-column-layout",
     {
@@ -3514,7 +3499,7 @@ function GoAThreeColumnLayout(props) {
     }
   );
 }
-function GoATooltip(props) {
+function GoabTooltip(props) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "goa-tooltip",
     {
@@ -3530,7 +3515,7 @@ function GoATooltip(props) {
     }
   );
 }
-function GoATwoColumnLayout(props) {
+function GoabTwoColumnLayout(props) {
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "goa-two-column-layout",
     {
@@ -3581,84 +3566,83 @@ const GoAFilterChip = ({
     }
   );
 };
-exports.GoAIcon = icon.GoAIcon;
-exports.GoAAccordion = GoAAccordion;
-exports.GoAAppFooter = GoAAppFooter;
-exports.GoAAppFooterMetaSection = GoAAppFooterMetaSection;
-exports.GoAAppFooterNavSection = GoAAppFooterNavSection;
-exports.GoAAppHeader = GoAAppHeader;
-exports.GoAAppHeaderMenu = GoAAppHeaderMenu;
-exports.GoABadge = GoABadge;
-exports.GoABlock = GoABlock;
-exports.GoAButton = GoAButton;
-exports.GoAButtonGroup = GoAButtonGroup;
-exports.GoACalendar = GoACalendar;
-exports.GoACallout = GoACallout;
-exports.GoACheckbox = GoACheckbox;
-exports.GoAChip = GoAChip;
-exports.GoACircularProgress = GoACircularProgress;
-exports.GoAContainer = GoAContainer;
-exports.GoADatePicker = GoADatePicker;
-exports.GoADetails = GoADetails;
-exports.GoADivider = GoADivider;
-exports.GoADropdown = GoADropdown;
-exports.GoADropdownItem = GoADropdownItem;
-exports.GoADropdownOption = GoADropdownOption;
-exports.GoAEmergencyBadge = GoAEmergencyBadge;
-exports.GoAFieldset = GoAFieldset;
-exports.GoAFileUploadCard = GoAFileUploadCard;
-exports.GoAFileUploadInput = GoAFileUploadInput;
+exports.GoabIcon = icon.GoabIcon;
 exports.GoAFilterChip = GoAFilterChip;
-exports.GoAFormItem = GoAFormItem;
-exports.GoAFormStep = GoAFormStep;
-exports.GoAFormStepper = GoAFormStepper;
-exports.GoAGrid = GoAGrid;
-exports.GoAHeroBanner = GoAHeroBanner;
-exports.GoAHeroBannerActions = GoAHeroBannerActions;
-exports.GoAIconButton = GoAIconButton;
-exports.GoAImportantBadge = GoAImportantBadge;
-exports.GoAInfoBadge = GoAInfoBadge;
-exports.GoAInput = GoAInput;
-exports.GoAInputDate = GoAInputDate;
-exports.GoAInputDateTime = GoAInputDateTime;
-exports.GoAInputEmail = GoAInputEmail;
-exports.GoAInputFile = GoAInputFile;
-exports.GoAInputMonth = GoAInputMonth;
-exports.GoAInputNumber = GoAInputNumber;
-exports.GoAInputPassword = GoAInputPassword;
-exports.GoAInputRange = GoAInputRange;
-exports.GoAInputSearch = GoAInputSearch;
-exports.GoAInputTel = GoAInputTel;
-exports.GoAInputText = GoAInputText;
-exports.GoAInputTime = GoAInputTime;
-exports.GoAInputUrl = GoAInputUrl;
 exports.GoALink = GoALink;
 exports.GoALinkButton = GoALinkButton;
-exports.GoAMicrositeHeader = GoAMicrositeHeader;
-exports.GoAModal = GoAModal;
-exports.GoANotification = GoANotification;
-exports.GoAOneColumnLayout = GoAOneColumnLayout;
-exports.GoAPageBlock = GoAPageBlock;
-exports.GoAPages = GoAPages;
-exports.GoAPagination = GoAPagination;
-exports.GoAPopover = GoAPopover;
-exports.GoARadioGroup = GoARadioGroup;
-exports.GoARadioItem = GoARadioItem;
-exports.GoASideMenu = GoASideMenu;
-exports.GoASideMenuGroup = GoASideMenuGroup;
-exports.GoASideMenuHeading = GoASideMenuHeading;
-exports.GoASkeleton = GoASkeleton;
-exports.GoASpacer = GoASpacer;
-exports.GoASpinner = GoASpinner;
-exports.GoASuccessBadge = GoASuccessBadge;
-exports.GoATab = GoATab;
-exports.GoATable = GoATable;
-exports.GoATableSortHeader = GoATableSortHeader;
-exports.GoATabs = GoATabs;
-exports.GoAText = GoAText;
-exports.GoATextArea = GoATextarea;
-exports.GoATextarea = GoATextarea;
-exports.GoAThreeColumnLayout = GoAThreeColumnLayout;
-exports.GoATooltip = GoATooltip;
-exports.GoATwoColumnLayout = GoATwoColumnLayout;
+exports.GoabAccordion = GoabAccordion;
+exports.GoabAppFooter = GoabAppFooter;
+exports.GoabAppFooterMetaSection = GoabAppFooterMetaSection;
+exports.GoabAppFooterNavSection = GoabAppFooterNavSection;
+exports.GoabAppHeader = GoabAppHeader;
+exports.GoabAppHeaderMenu = GoabAppHeaderMenu;
+exports.GoabBadge = GoabBadge;
+exports.GoabBlock = GoabBlock;
+exports.GoabButton = GoabButton;
+exports.GoabButtonGroup = GoabButtonGroup;
+exports.GoabCalendar = GoabCalendar;
+exports.GoabCallout = GoabCallout;
+exports.GoabCheckbox = GoabCheckbox;
+exports.GoabChip = GoabChip;
+exports.GoabCircularProgress = GoabCircularProgress;
+exports.GoabContainer = GoabContainer;
+exports.GoabDatePicker = GoabDatePicker;
+exports.GoabDetails = GoabDetails;
+exports.GoabDivider = GoabDivider;
+exports.GoabDropdown = GoabDropdown;
+exports.GoabDropdownItem = GoabDropdownItem;
+exports.GoabDropdownOption = GoabDropdownOption;
+exports.GoabEmergencyBadge = GoabEmergencyBadge;
+exports.GoabFieldset = GoabFieldset;
+exports.GoabFileUploadCard = GoabFileUploadCard;
+exports.GoabFileUploadInput = GoabFileUploadInput;
+exports.GoabFormItem = GoabFormItem;
+exports.GoabFormStep = GoabFormStep;
+exports.GoabFormStepper = GoabFormStepper;
+exports.GoabGrid = GoabGrid;
+exports.GoabHeroBanner = GoabHeroBanner;
+exports.GoabHeroBannerActions = GoabHeroBannerActions;
+exports.GoabIconButton = GoabIconButton;
+exports.GoabImportantBadge = GoabImportantBadge;
+exports.GoabInfoBadge = GoabInfoBadge;
+exports.GoabInput = GoabInput;
+exports.GoabInputDate = GoabInputDate;
+exports.GoabInputDateTime = GoabInputDateTime;
+exports.GoabInputEmail = GoabInputEmail;
+exports.GoabInputFile = GoabInputFile;
+exports.GoabInputMonth = GoabInputMonth;
+exports.GoabInputNumber = GoabInputNumber;
+exports.GoabInputPassword = GoabInputPassword;
+exports.GoabInputRange = GoabInputRange;
+exports.GoabInputSearch = GoabInputSearch;
+exports.GoabInputTel = GoabInputTel;
+exports.GoabInputText = GoabInputText;
+exports.GoabInputTime = GoabInputTime;
+exports.GoabInputUrl = GoabInputUrl;
+exports.GoabMicrositeHeader = GoabMicrositeHeader;
+exports.GoabModal = GoabModal;
+exports.GoabNotification = GoabNotification;
+exports.GoabOneColumnLayout = GoabOneColumnLayout;
+exports.GoabPageBlock = GoabPageBlock;
+exports.GoabPages = GoabPages;
+exports.GoabPagination = GoabPagination;
+exports.GoabPopover = GoabPopover;
+exports.GoabRadioGroup = GoabRadioGroup;
+exports.GoabRadioItem = GoabRadioItem;
+exports.GoabSideMenu = GoabSideMenu;
+exports.GoabSideMenuGroup = GoabSideMenuGroup;
+exports.GoabSideMenuHeading = GoabSideMenuHeading;
+exports.GoabSkeleton = GoabSkeleton;
+exports.GoabSpacer = GoabSpacer;
+exports.GoabSpinner = GoabSpinner;
+exports.GoabSuccessBadge = GoabSuccessBadge;
+exports.GoabTab = GoabTab;
+exports.GoabTable = GoabTable;
+exports.GoabTableSortHeader = GoabTableSortHeader;
+exports.GoabTabs = GoabTabs;
+exports.GoabText = GoabText;
+exports.GoabTextarea = GoabTextarea;
+exports.GoabThreeColumnLayout = GoabThreeColumnLayout;
+exports.GoabTooltip = GoabTooltip;
+exports.GoabTwoColumnLayout = GoabTwoColumnLayout;
 //# sourceMappingURL=index.js.map