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

package/index.js

@@ -251,6 +251,8 @@ function GoabCheckbox({
   description,
   reveal,
   onChange,
+  onFocus,
+  onBlur,
   name,
   children,
   size = "default",
@@ -267,11 +269,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__ */ jsxRuntime.jsxs(
     "goa-checkbox",
     {
@@ -303,6 +317,8 @@ function GoabCheckboxList({
   size = "default",
   children,
   onChange,
+  onFocus,
+  onBlur,
   mt,
   mr,
   mb,
@@ -316,11 +332,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__ */ jsxRuntime.jsx(
     "goa-checkbox-list",
     {
@@ -2619,6 +2647,8 @@ function GoabDatePicker({
   disabled,
   relative,
   onChange,
+  onFocus,
+  onBlur,
   ...rest
 }) {
   const ref = react.useRef(null);
@@ -2639,15 +2669,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) {
@@ -2743,6 +2785,8 @@ function stringify(value) {
 function GoabDropdown({
   value,
   onChange,
+  onFocus,
+  onBlur,
   disabled,
   error,
   filterable,
@@ -2764,15 +2808,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__ */ jsxRuntime.jsx(
     "goa-dropdown",
     {
@@ -3841,6 +3897,8 @@ function GoabRadioGroup({
   disabled,
   error,
   onChange,
+  onFocus,
+  onBlur,
   name,
   children,
   size = "default",
@@ -3854,16 +3912,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__ */ jsxRuntime.jsx(
     "goa-radio-group",
     {
@@ -4127,6 +4197,7 @@ function GoabTextArea({
   error,
   onChange,
   onKeyPress,
+  onFocus,
   onBlur,
   ...rest
 }) {
@@ -4145,19 +4216,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__ */ jsxRuntime.jsx(
     "goa-textarea",
     {