@homebound/beam 2.96.1 → 2.96.2

package/dist/forms/BoundCheckboxField.d.ts

@@ -1,6 +1,6 @@
 import { FieldState } from "@homebound/form-state";
 import { CheckboxProps } from "../inputs";
-export declare type BoundCheckboxFieldProps = Omit<CheckboxProps, "values" | "onChange" | "label" | "onBlur" | "onFocus"> & {
+export declare type BoundCheckboxFieldProps = Omit<CheckboxProps, "values" | "onChange" | "label"> & {
     field: FieldState<any, boolean | null | undefined>;
     /** Make optional so that callers can override if they want to. */
     onChange?: (values: boolean) => void;

package/dist/forms/BoundCheckboxField.js

@@ -8,7 +8,7 @@ const utils_1 = require("../utils");
 const defaultLabel_1 = require("../utils/defaultLabel");
 /** Wraps `Checkbox` and binds it to a form field. */
 function BoundCheckboxField(props) {
-    const { field, onChange = (value) => field.set(value), label = (0, defaultLabel_1.defaultLabel)(field.key), ...others } = props;
+    const { field, onChange = (value) => field.set(value), label = (0, defaultLabel_1.defaultLabel)(field.key), onFocus, onBlur, ...others } = props;
     const testId = (0, utils_1.useTestIds)(props, field.key);
     return ((0, jsx_runtime_1.jsx)(mobx_react_1.Observer, { children: () => {
             var _a;
@@ -16,7 +16,13 @@ function BoundCheckboxField(props) {
                     // We are triggering blur manually for checkbox fields due to its transactional nature
                     onChange(selected);
                     field.blur();
-                }, errorMsg: field.touched ? field.errors.join(" ") : undefined }, testId, others), void 0));
+                }, errorMsg: field.touched ? field.errors.join(" ") : undefined, onFocus: () => {
+                    field.focus();
+                    (0, utils_1.maybeCall)(onFocus);
+                }, onBlur: () => {
+                    field.blur();
+                    (0, utils_1.maybeCall)(onBlur);
+                } }, testId, others), void 0));
         } }, void 0));
 }
 exports.BoundCheckboxField = BoundCheckboxField;

package/dist/inputs/Checkbox.d.ts

@@ -14,5 +14,9 @@ export interface CheckboxProps {
     selected?: boolean;
     errorMsg?: string;
     helperText?: string | ReactNode;
+    /** Callback fired when focus removes from the component */
+    onBlur?: () => void;
+    /** Callback fired when focus is set to the component */
+    onFocus?: () => void;
 }
 export declare function Checkbox(props: CheckboxProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/inputs/CheckboxBase.js

@@ -23,7 +23,7 @@ function CheckboxBase(props) {
             .maxw((0, Css_1.px)(320))
             .if(description !== undefined)
             .maxw((0, Css_1.px)(344))
-            .if(isDisabled).cursorNotAllowed.$ }, { children: [(0, jsx_runtime_1.jsx)(react_aria_1.VisuallyHidden, { children: (0, jsx_runtime_1.jsx)("input", Object.assign({ ref: ref }, inputProps, focusProps, tid), void 0) }, void 0), (0, jsx_runtime_1.jsx)("span", Object.assign({}, hoverProps, { css: {
+            .if(isDisabled).cursorNotAllowed.$ }, { children: [(0, jsx_runtime_1.jsx)(react_aria_1.VisuallyHidden, { children: (0, jsx_runtime_1.jsx)("input", Object.assign({ ref: ref }, (0, react_aria_1.mergeProps)(inputProps, focusProps), tid), void 0) }, void 0), (0, jsx_runtime_1.jsx)("span", Object.assign({}, hoverProps, { css: {
                     ...baseStyles,
                     ...((isSelected || isIndeterminate) && filledBoxStyles),
                     ...((isSelected || isIndeterminate) && isHovered && filledBoxHoverStyles),

package/dist/inputs/SelectField.mock.js

@@ -24,7 +24,7 @@ function SelectField(props) {
         }, 
         // Read Only does not apply to `select` fields, instead we'll add in disabled for tests to verify.
         disabled: !!(disabled || readOnly), "data-error": !!errorMsg, "data-errormsg": errorMsg, "data-readonly": readOnly }, { children: [(0, jsx_runtime_1.jsx)("option", { disabled: true, value: "" }, void 0), options.map((option, i) => {
-                return ((0, jsx_runtime_1.jsx)("option", Object.assign({ value: `${getOptionValue(option)}`, disabled: disabledOptions.includes(getOptionValue(option).toString()) }, { children: getOptionLabel(option) }), i));
+                return ((0, jsx_runtime_1.jsx)("option", Object.assign({ value: `${getOptionValue(option)}`, disabled: disabledOptions.includes(getOptionValue(option)) }, { children: getOptionLabel(option) }), i));
             })] }), void 0));
 }
 exports.SelectField = SelectField;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homebound/beam",
-  "version": "2.96.1",
+  "version": "2.96.2",
   "author": "Homebound",
   "license": "MIT",
   "main": "dist/index.js",