@abgov/react-components 7.2.0-dev.17 → 7.2.0-dev.19

package/index.mjs

@@ -249,6 +249,8 @@ function GoabCheckbox({
   description,
   reveal,
   onChange,
+  onFocus,
+  onBlur,
   name,
   children,
   size = "default",
@@ -265,11 +267,23 @@ function GoabCheckbox({
       const detail = e.detail;
       onChange == null ? void 0 : onChange({ ...detail, event: e });
     };
+    const focusListener = (e) => {
+      const detail = e.detail;
+      onFocus == null ? void 0 : onFocus({ ...detail, event: e });
+    };
+    const blurListener = (e) => {
+      const detail = e.detail;
+      onBlur == null ? void 0 : onBlur({ ...detail, event: e });
+    };
     current.addEventListener("_change", listener);
+    current.addEventListener("_focus", focusListener);
+    current.addEventListener("_blur", blurListener);
     return () => {
       current.removeEventListener("_change", listener);
+      current.removeEventListener("_focus", focusListener);
+      current.removeEventListener("_blur", blurListener);
     };
-  }, [name, onChange]);
+  }, [name, onChange, onFocus, onBlur]);
   return /* @__PURE__ */ jsxs(
     "goa-checkbox",
     {
@@ -301,6 +315,8 @@ function GoabCheckboxList({
   size = "default",
   children,
   onChange,
+  onFocus,
+  onBlur,
   mt,
   mr,
   mb,
@@ -314,11 +330,23 @@ function GoabCheckboxList({
       const detail = e.detail;
       onChange == null ? void 0 : onChange({ ...detail, event: e });
     };
+    const focusListener = (e) => {
+      const detail = e.detail;
+      onFocus == null ? void 0 : onFocus({ ...detail, event: e });
+    };
+    const blurListener = (e) => {
+      const detail = e.detail;
+      onBlur == null ? void 0 : onBlur({ ...detail, event: e });
+    };
     current.addEventListener("_change", listener);
+    current.addEventListener("_focus", focusListener);
+    current.addEventListener("_blur", blurListener);
     return () => {
       current.removeEventListener("_change", listener);
+      current.removeEventListener("_focus", focusListener);
+      current.removeEventListener("_blur", blurListener);
     };
-  }, [onChange]);
+  }, [onChange, onFocus, onBlur]);
   return /* @__PURE__ */ jsx(
     "goa-checkbox-list",
     {
@@ -2617,6 +2645,8 @@ function GoabDatePicker({
   disabled,
   relative,
   onChange,
+  onFocus,
+  onBlur,
   ...rest
 }) {
   const ref = useRef(null);
@@ -2637,15 +2667,27 @@ function GoabDatePicker({
       const detail = e.detail;
       onChange == null ? void 0 : onChange({ ...detail, event: e });
     };
+    const handleFocus = (e) => {
+      const detail = e.detail;
+      onFocus == null ? void 0 : onFocus({ ...detail, event: e });
+    };
+    const handleBlur = (e) => {
+      const detail = e.detail;
+      onBlur == null ? void 0 : onBlur({ ...detail, event: e });
+    };
     if (onChange) {
       current.addEventListener("_change", handleChange);
     }
+    current.addEventListener("_focus", handleFocus);
+    current.addEventListener("_blur", handleBlur);
     return () => {
       if (onChange) {
         current.removeEventListener("_change", handleChange);
       }
+      current.removeEventListener("_focus", handleFocus);
+      current.removeEventListener("_blur", handleBlur);
     };
-  }, [onChange]);
+  }, [onChange, onFocus, onBlur]);
   const formatValue = (val) => {
     if (!val) return "";
     if (val instanceof Date) {
@@ -2741,6 +2783,8 @@ function stringify(value) {
 function GoabDropdown({
   value,
   onChange,
+  onFocus,
+  onBlur,
   disabled,
   error,
   filterable,
@@ -2762,15 +2806,27 @@ function GoabDropdown({
       const detail = e.detail;
       onChange == null ? void 0 : onChange({ ...detail, event: e });
     };
+    const focusListener = (e) => {
+      const detail = e.detail;
+      onFocus == null ? void 0 : onFocus({ ...detail, event: e });
+    };
+    const blurListener = (e) => {
+      const detail = e.detail;
+      onBlur == null ? void 0 : onBlur({ ...detail, event: e });
+    };
     if (onChange) {
       current.addEventListener("_change", handler);
     }
+    current.addEventListener("_focus", focusListener);
+    current.addEventListener("_blur", blurListener);
     return () => {
       if (onChange) {
         current.removeEventListener("_change", handler);
       }
+      current.removeEventListener("_focus", focusListener);
+      current.removeEventListener("_blur", blurListener);
     };
-  }, [el, onChange]);
+  }, [el, onChange, onFocus, onBlur]);
   return /* @__PURE__ */ jsx(
     "goa-dropdown",
     {
@@ -3839,6 +3895,8 @@ function GoabRadioGroup({
   disabled,
   error,
   onChange,
+  onFocus,
+  onBlur,
   name,
   children,
   size = "default",
@@ -3852,16 +3910,28 @@ function GoabRadioGroup({
       const detail = e.detail;
       onChange == null ? void 0 : onChange({ ...detail, event: e });
     };
+    const focusListener = (e) => {
+      const detail = e.detail;
+      onFocus == null ? void 0 : onFocus({ ...detail, event: e });
+    };
+    const blurListener = (e) => {
+      const detail = e.detail;
+      onBlur == null ? void 0 : onBlur({ ...detail, event: e });
+    };
     const currentEl = el.current;
     if (onChange) {
       currentEl.addEventListener("_change", listener);
     }
+    currentEl.addEventListener("_focus", focusListener);
+    currentEl.addEventListener("_blur", blurListener);
     return () => {
       if (onChange) {
         currentEl.removeEventListener("_change", listener);
       }
+      currentEl.removeEventListener("_focus", focusListener);
+      currentEl.removeEventListener("_blur", blurListener);
     };
-  }, [name, onChange]);
+  }, [name, onChange, onFocus, onBlur]);
   return /* @__PURE__ */ jsx(
     "goa-radio-group",
     {
@@ -4125,6 +4195,7 @@ function GoabTextArea({
   error,
   onChange,
   onKeyPress,
+  onFocus,
   onBlur,
   ...rest
 }) {
@@ -4143,19 +4214,25 @@ function GoabTextArea({
       const detail = e.detail;
       onKeyPress == null ? void 0 : onKeyPress({ ...detail, event: e });
     };
+    const focusListener = (e) => {
+      const detail = e.detail;
+      onFocus == null ? void 0 : onFocus({ ...detail, event: e });
+    };
     const blurListener = (e) => {
       const detail = e.detail;
       onBlur == null ? void 0 : onBlur({ ...detail, event: e });
     };
     current.addEventListener("_change", changeListener);
     current.addEventListener("_keyPress", keypressListener);
+    current.addEventListener("_focus", focusListener);
     current.addEventListener("_blur", blurListener);
     return () => {
       current.removeEventListener("_change", changeListener);
       current.removeEventListener("_keyPress", keypressListener);
+      current.removeEventListener("_focus", focusListener);
       current.removeEventListener("_blur", blurListener);
     };
-  }, [el, onChange, onKeyPress, onBlur]);
+  }, [el, onChange, onKeyPress, onFocus, onBlur]);
   return /* @__PURE__ */ jsx(
     "goa-textarea",
     {