API Reference

@formkit/core

Introduction

The official FormKit core library. This package is responsible for most of FormKit's internal functionality. You can read documentation specifically on how it works at formkit.com.

You can add this package by using npm install @formkit/core or yarn add @formkit/core.

FormKitNode

FormKit's Node object produced by createNode(). Every <FormKit /> input has 1 FormKitNode ("core node") associated with it. All inputs, forms, and groups are instances of nodes. Read more about core nodes in the architecture documentation.

add()

Function

Add a child to a node. The node must be a group or list.

Signature

add: (node: FormKitNode, index?: number) => FormKitNode

Parameters

  • node — A FormKitNode.
  • index optional — A index to where it will added to.

Returns

The added FormKitNode.

address

Property

The address of the current node from the root of the tree.

Signature

address: FormKitAddress

Returns

A FormKitAddress.

addProps()

Function

Adds props to the given node by removing them from node.props.attrs and moving them to the top-level node.props object.

Signature

addProps: (props: string[]) => FormKitNode

Parameters

  • props — An array of strings to be added as keys for props.

Returns

The FormKitNode.

at()

Function

Gets a node at another address. Addresses are dot-syntax paths (or arrays) of node names. For example: form.users.0.first_name. There are a few "special" traversal tokens as well:

  • $root — Selects the root node.
  • $parent — Selects the parent node.
  • $self — Selects the current node.

Signature

at: (address: FormKitAddress | string) => FormKitNode | undefined

Parameters

Returns

The found FormKitNode or undefined.

children

Property

An array of child nodes (groups and lists).

Signature

children: Array<FormKitNode>

Returns

An array of FormKitNode.

clearErrors()

Function

Clears the errors of the node, and optionally all the children.

Signature

clearErrors: (clearChildren?: boolean, sourceKey?: string) => FormKitNode

Parameters

  • clearChildren optional — If it should clear the children.
  • sourceKey optional — A source key to use for reset.

Returns

The FormKitNode.

config

Property

An object of FormKitConfig that is shared tree-wide with various configuration options that should be applied to the entire tree.

Signature

config: FormKitConfig

Returns

A FormKitConfig.

define()

Function

Defines the current input's library type definition including node type, schema, and props.

Signature

define: (definition: FormKitTypeDefinition) => void

Parameters

destroy()

Function

Removes the node from the global registry, its parent, and emits the 'destroying' event.

Signature

destroy: () => void

each()

Function

Perform given callback on each of the given node's children.

Signature

each: (callback: FormKitChildCallback) => void

Parameters

emit()

Function

Emit an event from the node so it can be listened by on.

Signature

emit: (event: string, payload?: any, bubble?: boolean, meta: Record<string, unknown>) => FormKitNode

Parameters

  • event — The event name to be emitted.
  • payload optional — A value to be passed together with the event.
  • bubble optional — If the event should bubble to the parent.

Returns

The FormKitNode.

extend()

Function

Extend a FormKitNode by adding arbitrary properties that are accessible via node.{property}().

Signature

extend: (property: string, trap: FormKitTrap) => FormKitNode

Parameters

  • property — The property to add the core node (node.{property}).
  • trap — An object with a get and set property.

Returns

The FormKitNode.

find()

Function

Within a given tree, find a node matching a given selector. Selectors can be simple strings or a function.

Signature

find: (
 selector: string,
 searcher?: keyof FormKitNode | FormKitSearchFunction
) => FormKitNode | undefined

Parameters

Returns

The found FormKitNode or undefined.

hook

Property

Set of hooks.

Signature

hook: FormKitHooks

Returns

The FormKitHooks.

index

Property

The index of a node compared to its siblings. This is only applicable in cases where a node is a child of a list.

Signature

index: number

Returns

A number.

input()

Function

The function used to set the value of a node. All changes to a node's value should use this function as it ensures the tree's state is always fully tracked.

Signature

input: (value: unknown, async?: boolean) => Promise<unknown>

Parameters

  • value — Any value to used for the node.
  • async optional — If the input should happen asynchronously.

Returns

A Promise<unknown>.

isCreated

Property

Begins as false, set to true when the node is finished being created.

Signature

isCreated: boolean

Returns

A boolean.

isSettled

Property

Boolean reflecting the settlement state of the node and its subtree.

Signature

isSettled: boolean

Returns

A boolean.

ledger

Property

A counting ledger for arbitrary message counters.

Signature

ledger: FormKitLedger

Returns

A