react-better-html 1.1.24 → 1.1.25

package/dist/components/ToggleInput.d.ts

@@ -9,7 +9,7 @@ type InternalToggleInputProps<Value> = {
     value?: Value;
     onChange?: (checked: boolean, value?: Value) => void;
 } & OmitProps<React.ComponentProps<"input">, "style" | "value" | "ref" | "onChange" | "name"> & ComponentStyle & ComponentHoverStyle;
-type ToggleInputProps<Value> = ComponentPropWithRef<ToggleInputRef, OmitProps<InternalToggleInputProps<Value>, "type">>;
+export type ToggleInputProps<Value> = ComponentPropWithRef<ToggleInputRef, OmitProps<InternalToggleInputProps<Value>, "type">>;
 type ToggleInputComponentType = <Value>(props: ToggleInputProps<Value>) => React.ReactElement;
 declare const _default: {
     checkbox: ToggleInputComponentType;

package/dist/utils/hooks.d.ts

@@ -3,6 +3,7 @@ import { Theme } from "../types/theme";
 import { OmitProps, PartialRecord } from "../types/app";
 import { InputFieldProps } from "../components/InputField";
 import { DropdownProps } from "../components/Dropdown";
+import { ToggleInputProps, ToggleInputRef } from "../components/ToggleInput";
 export declare function useStyledComponentStyles(props: ComponentStyle & ComponentHoverStyle, theme?: Theme, 
 /** @default false */
 excludeProps?: boolean): {
@@ -53,6 +54,7 @@ export declare function useForm<FormFields extends Record<string, string | numbe
     setFieldValue: <FieldName extends keyof FormFields>(field: FieldName, value: FormFields[FieldName] | undefined) => void;
     getInputFieldProps: <FieldName extends keyof FormFields>(field: FieldName) => ComponentPropWithRef<HTMLInputElement, InputFieldProps>;
     getDropdownFieldProps: <FieldName extends keyof FormFields>(field: FieldName) => OmitProps<ComponentPropWithRef<HTMLDivElement, DropdownProps<FormFields[FieldName], unknown>>, "options">;
+    getCheckboxProps: <FieldName extends keyof FormFields>(field: FieldName) => ComponentPropWithRef<ToggleInputRef, ToggleInputProps<FormFields[FieldName]>>;
     focusField: (field: keyof FormFields) => void;
     onSubmit: (event: React.FormEvent<HTMLFormElement>) => Promise<void>;
     reset: () => void;

package/dist/utils/hooks.js

@@ -190,8 +190,9 @@ function useForm({ defaultValues, onSubmit, validate, }) {
                         [field]: element.getAttribute("type"),
                     }));
             },
+            errorText: errors[field],
         };
-    }, [values, setFieldValue, inputTypes]);
+    }, [values, setFieldValue, inputTypes, errors]);
     const getDropdownFieldProps = (0, react_1.useCallback)((field) => {
         return {
             value: values[field],
@@ -201,6 +202,15 @@ function useForm({ defaultValues, onSubmit, validate, }) {
             errorText: errors[field],
         };
     }, [values, errors, setFieldValue]);
+    const getCheckboxProps = (0, react_1.useCallback)((field) => {
+        return {
+            value: values[field],
+            onChange: (checked) => {
+                setFieldValue(field, checked);
+            },
+            errorText: errors[field],
+        };
+    }, [values, errors, setFieldValue]);
     const focusField = (0, react_1.useCallback)((field) => {
         inputFieldRefs.current[field]?.focus();
     }, []);
@@ -233,6 +243,7 @@ function useForm({ defaultValues, onSubmit, validate, }) {
         setFieldValue,
         getInputFieldProps,
         getDropdownFieldProps,
+        getCheckboxProps,
         focusField,
         onSubmit: onSubmitFunction,
         reset,

package/package.json

@@ -1,6 +1,6 @@
 {
    "name": "react-better-html",
-   "version": "1.1.24",
+   "version": "1.1.25",
    "description": "A component library for react that is as close to plane html as possible",
    "main": "dist/index.js",
    "files": [