@formkit/inputs

Introduction

The official FormKit Inputs plugin. This package contains the source code for all native HTML input types. Read the inputs documentation for usage instructions.

Helpers

$attrs()

Applies attributes to a given schema section by applying a higher order function that merges a given set of attributes into the node.

Signature

Parameters

Returns

FormKitSchemaExtendableSection

$extend()

Extends a schema node with a given set of extensions.

Signature

Parameters

  • section — A section to apply an extension to.
  • extendWith — A partial schema snippet to apply to the section.

Returns

FormKitSchemaExtendableSection

$for()

Applies a condition to a given schema section.

Signature

Parameters

  • varName — The name of the variable that holds the current instance.
  • inName — The variable we are iterating over.
  • section — A section to repeat.

Returns

FormKitSchemaExtendableSection

$if()

Applies a condition to a given schema section.

Signature

Parameters

  • condition — A schema condition to apply to a section.
  • then — The section that applies if the condition is true.
  • otherwise — (else) The section that applies if the condition is false.

Returns

FormKitSchemaExtendableSection

$root()

Creates a root schema section.

Signature

Parameters

  • section — A section to make a root from.

Returns

FormKitSchemaExtendableSection

Features

checkboxes()

A feature that adds checkbox selection support.

Signature

Parameters

defaultIcon()

Adds icon props definition.

Signature

Parameters

  • sectionKey — the location the icon should be loaded.
  • defaultIcon — the icon that should be loaded if a match is found in the user's CSS.

Returns

A FormKitPlugin.

files()

A feature to add file handling support to an input.

Signature

Parameters

initialValue()

A feature that ensures the input has an initialValue prop.

Signature

Parameters

localize()

Creates a new feature that generates a localization message of type ui for use on a given component.

Signature

Parameters

  • key — The key of the message.
  • value — The value of the message.

Returns

A FormKitPlugin.

normalizeBoxes()

A feature that normalizes box types (checkboxes, radios).

Signature

Parameters

Returns

A FormKitMiddleware.

options()

A feature that converts the options prop to usable values, to be used by a feature or a plugin.

Signature

Parameters

radios()

A feature to check if the value being checked is the current value.

Signature

Parameters

Functions

composable()

Signature

Parameters

  • key — A new section key name.
  • schema — The default schema in this composable slot.

Returns

FormKitSchemaComposable

createLibraryPlugin()

Creates a plugin based on a list of FormKitLibrary.

Signature

Parameters

Returns

FormKitPlugin

createSection()

Creates a new reusable section.

Signature

Parameters

  • section — A single section of schema
  • el — The element or a function that returns a schema node.
  • root — When true, returns a FormKitExtendableSchemaRoot. When false, returns a FormKitSchemaExtendableSection.

Returns

Returns a FormKitExtendableSchemaRoot or a FormKitSchemaExtendableSection.

disables()

A feature that allows disabling children of this node.

Signature

Parameters

extendSchema()

Extends a single schema node with an extension. The extension can be any partial node including strings.

Signature

Parameters

  • schema — The base schema node.
  • extension — The values to extend on the base schema node.

Returns

FormKitSchemaNode

form()

A feature to add a submit handler and actions section.

Signature

Parameters

ignore()

A feature that applies ignore="true" by default.

Signature

Parameters

isSchemaObject()

Type guard for schema objects.

Signature

Parameters

  • schema — returns true if the node is a schema node but not a string or conditional.

Returns

boolean

isSlotCondition()

Checks if the current schema node is a slot condition.

Signature

Parameters

Returns

boolean

Examples

normalizeOptions()

A function to normalize an array of objects, array of strings, or object of key-values to use an array of objects with value and label properties.

Signature

Parameters

  • options — An un

-normalized FormKitOptionsProp.

Returns

A list of FormKitOptionsList.

select()

Converts the options prop to usable values.

Signature

Parameters

  • node — A formkit node.

useSchema()

Creates an input schema with all of the wrapping base schema.

Signature

Parameters

  • inputSection — Content to store in the input section key location.

Returns

FormKitExtendableSchemaRoot

TypeScript

FormKitFile

A single file object in FormKit’s synthetic "FileList".

FormKitOptionsItem

Options should always be formatted as an array of objects with label and value properties.

FormKitOptionsPropExtensions

Allows for prop extensions to be defined by using an interface whose keys are ignored, but values are applied to a union type. This allows for any third party code to extend the options prop by using module augmentation to add new values to the union type.

FormKitSchemaExtendableSection

A function that is called with an extensions argument and returns a valid schema node.

FormKitSection

A function that when called, returns a function that can in turn be called with an extension parameter.

FormKitSyntheticPropsExtensions

Synthetic props are props that are not explicitly declared as props, but should be treated as props to the outside world.

FormKitFileValue

A synthetic array-based "FileList".

FormKitInputSchema

Either a schema node, or a function that returns a schema node.

FormKitOptionsList

An array of option items.

FormKitOptionsProp

The types of options that can be passed to the options prop.

FormKitSyntheticProps

The synthetic prop types.