fix(checkboxFieldProps): make checkboxField initializable via options

src/fields/checkbox-field/CheckboxInput.mock.tsx

@@ -1,21 +1,17 @@
-import { ReactNode } from "react";
-
-import { CheckboxField } from "./checkboxField";
-import { FieldLabel } from "../../components";
-import { FieldErrors } from "../../components/field-errors";
-import { useCheckboxFieldProps, useRequiredProps } from "../../hooks";
-import { BooleanField } from "../boolean-field";
+import { FieldErrors, FieldLabel } from "../../components";
+import {
+  type CheckboxFieldProps,
+  useCheckboxFieldProps,
+  useRequiredProps,
+} from "../../hooks";
 
 export const CheckboxInput = ({
   field,
   label,
   required,
-}: {
-  field: BooleanField | CheckboxField;
-  label: ReactNode;
-  required?: boolean;
-}) => {
-  const props = useCheckboxFieldProps(field);
+  initialValue,
+}: CheckboxFieldProps) => {
+  const props = useCheckboxFieldProps(field, { initialValue });
   const requiredProps = useRequiredProps({ field, required });
 
   return (

src/fields/checkbox-field/checkboxField.stories.tsx

@@ -51,3 +51,26 @@ export const Optional = formStory({
     },
   },
 });
+
+export const Initialized = formStory({
+  args: {
+    fields: {
+      visible: checkboxField({ name: "visible" }).optional(),
+    },
+    children: ({ fields }) => (
+      <CheckboxInput
+        field={fields.visible}
+        label="Product is visible"
+        initialValue={true}
+      />
+    ),
+  },
+  parameters: {
+    docs: {
+      description: {
+        story:
+          "This example uses the `initialValue` option passed to the `useCheckboxFieldProps(field, options)`",
+      },
+    },
+  },
+});

src/hooks/use-checkbox-field-props/useCheckboxFieldProps.test.tsx

@@ -35,4 +35,14 @@ describe("useCheckboxFieldProps()", () => {
 
     expect(checkboxProps.result.current.checked).toBe(true);
   });
+
+  test("can be initialized", async () => {
+    const field = checkboxField();
+
+    const checkboxProps = renderHook(() =>
+      useCheckboxFieldProps(field, { initialValue: true }),
+    );
+
+    expect(checkboxProps.result.current.checked).toBe(true);
+  });
 });

src/hooks/use-checkbox-field-props/useCheckboxFieldProps.ts

@@ -1,18 +1,26 @@
+import { UseFieldOptions } from "form-atoms";
 import { ChangeEvent, useMemo } from "react";
 
 import { FieldProps, useFieldProps } from "../";
-import { BooleanField, type CheckboxField } from "../../fields";
+import type {
+  BooleanField,
+  BooleanFieldValue,
+  CheckboxField,
+} from "../../fields";
 
 export type CheckboxFieldProps = FieldProps<CheckboxField | BooleanField>;
 
 const getChecked = (event: ChangeEvent<HTMLInputElement>) =>
   event.currentTarget.checked;
 
-export function useCheckboxFieldProps(field: CheckboxField | BooleanField) {
+export function useCheckboxFieldProps(
+  field: CheckboxField | BooleanField,
+  options?: UseFieldOptions<BooleanFieldValue>,
+) {
   // undefined (empty checkbox) is rendered as unchecked input
   const { value: checked = false, ...props } = useFieldProps<
     CheckboxField | BooleanField
-  >(field, getChecked);
+  >(field, getChecked, options);
 
   return useMemo(
     () => ({