@tanstack/react-form - npm Package Compare versions

Comparing version 0.23.2 to 0.23.3

dist/esm/types.d.ts

 import { DeepKeys, DeepValue, FieldApiOptions, Validator } from '@tanstack/form-core';
 import { FunctionComponent } from 'react';
 
+/**
+ * The field options.
+ */
 export type UseFieldOptions<TParentData, TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>> = FieldApiOptions<TParentData, TName, TFieldValidator, TFormValidator, TData> & {
@@ -5,0 +8,0 @@ mode?: 'value' | 'array';

dist/esm/useField.d.ts

@@ -5,13 +5,41 @@ import { FieldApi, DeepKeys, DeepValue, Validator } from '@tanstack/form-core';
 declare module '@tanstack/form-core' {
+    /**
+     * When using `@tanstack/react-form`, the core field API is extended at type level with additional methods for React-specific functionality:
+     */
     interface FieldApi<TParentData, TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>> {
+        /**
+         * A pre-bound and type-safe sub-field component using this field as a root.
+         */
         Field: FieldComponent<TParentData, TFormValidator>;
     }
 }
+/**
+ * A type representing a hook for using a field in a form with the given form data type.
+ *
+ * A function that takes an optional object with a `name` property and field options, and returns a `FieldApi` instance for the specified field.
+ */
 export type UseField<TParentData, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined> = <TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>>(opts: Omit<UseFieldOptions<TParentData, TName, TFieldValidator, TFormValidator, TData>, 'form'>) => FieldApi<TParentData, TName, TFieldValidator, TFormValidator, TData>;
+/**
+ * A hook for managing a field in a form.
+ * @param opts An object with field options.
+ *
+ * @returns The `FieldApi` instance for the specified field.
+ */
 export declare function useField<TParentData, TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>>(opts: UseFieldOptions<TParentData, TName, TFieldValidator, TFormValidator, TData>): FieldApi<TParentData, TName, TFieldValidator, TFormValidator, TData>;
+/**
+ * @param children A render function that takes a field API instance and returns a React element.
+ */
 type FieldComponentProps<TParentData, TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>> = {
     children: (fieldApi: FieldApi<TParentData, TName, TFieldValidator, TFormValidator, TData>) => NodeType;
 } & UseFieldOptions<TParentData, TName, TFieldValidator, TFormValidator, TData>;
+/**
+ * A type alias representing a field component for a specific form data type.
+ */
 export type FieldComponent<TParentData, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined> = <TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>>({ children, ...fieldOptions }: Omit<FieldComponentProps<TParentData, TName, TFieldValidator, TFormValidator, TData>, 'form'>) => NodeType;
+/**
+ * A function component that takes field options and a render function as children and returns a React component.
+ *
+ * The `Field` component uses the `useField` hook internally to manage the field instance.
+ */
 export declare const Field: <TParentData, TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>>({ children, ...fieldOptions }: FieldComponentProps<TParentData, TName, TFieldValidator, TFormValidator, TData>) => NodeType;
 export {};

dist/esm/useForm.d.ts

@@ -7,6 +7,21 @@ import { FormApi, FormOptions, FormState, Validator } from '@tanstack/form-core';
 declare module '@tanstack/form-core' {
+    /**
+     * When using `@tanstack/react-form`, the core form API is extended at type level with additional methods for React-specific functionality:
+     */
     interface FormApi<TFormData, TFormValidator> {
+        /**
+         * A React component to render form fields. With this, you can render and manage individual form fields.
+         */
         Field: FieldComponent<TFormData, TFormValidator>;
+        /**
+         * A custom React hook that provides functionalities related to individual form fields. It gives you access to field values, errors, and allows you to set or update field values.
+         */
         useField: UseField<TFormData, TFormValidator>;
+        /**
+         * A `useStore` hook that connects to the internal store of the form. It can be used to access the form's current state or any other related state information. You can optionally pass in a selector function to cherry-pick specific parts of the state
+         */
         useStore: <TSelected = NoInfer<FormState<TFormData>>>(selector?: (state: NoInfer<FormState<TFormData>>) => TSelected) => TSelected;
+        /**
+         * A `Subscribe` function that allows you to listen and react to changes in the form's state. It's especially useful when you need to execute side effects or render specific components in response to state updates.
+         */
         Subscribe: <TSelected = NoInfer<FormState<TFormData>>>(props: {
@@ -29,2 +44,7 @@ /**
 }
+/**
+ * A custom React Hook that returns an instance of the `FormApi` class.
+ *
+ * This API encapsulates all the necessary functionalities related to the form. It allows you to manage form state, handle submissions, and interact with form fields
+ */
 export declare function useForm<TFormData, TFormValidator extends Validator<TFormData, unknown> | undefined = undefined>(opts?: FormOptions<TFormData, TFormValidator>): FormApi<TFormData, TFormValidator>;

package.json

 {
   "name": "@tanstack/react-form",
-  "version": "0.23.2",
+  "version": "0.23.3",
   "description": "Powerful, type-safe forms for React.",
@@ -60,3 +60,3 @@ "author": "tannerlinsley",
     "decode-formdata": "^0.7.5",
-    "@tanstack/form-core": "0.23.2"
+    "@tanstack/form-core": "0.23.3"
   },
@@ -63,0 +63,0 @@ "peerDependencies": {

src/types.ts

@@ -9,2 +9,5 @@ import type {
 
+/**
+ * The field options.
+ */
 export type UseFieldOptions<
@@ -11,0 +14,0 @@ TParentData,

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

81096

decreased by-29.8%

Number of package files

55

decreased by-8.33%

Lines of code

849

decreased by-62.13%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Added@tanstack/form-core@0.23.3(transitive)

• - Removed@tanstack/form-core@0.23.2(transitive)

• Updated@tanstack/form-core@0.23.3