title | description |
---|---|
Changelog |
What's new in the latest version of FormKit?. |
Beta 16 is the first version of FormKit that does not have a pre-release identifier. Beta 16 and all remaining beta versions will be released under the 0.x.x
semantic version. The first stable release will be 1.0.0
and is targeted for later this year. This change in versioning should help with package manager dependency resolution as we complete our beta release cycles.
::
- Pro: New Transfer List input! A great option for helping your users select information from a large set of data.
- Pro: The floating labels plugin now supports FormKit Pro Inputs.
- Pro: The mask input now supports multiple colors by providing an
overlay
option. - Adds a new
dirty-behavior
prop allows users to opt into acompare
behavior which compares the current value of the input to the original value of the input. If the input is changed back to its original state thecontext.state.dirty
flag will revert back to false. - Adds i18n translations for some new ui and validation rules.
- The
options
prop (used in select, radio, checkboxes and some pro inputs) can now differentiate betweennull
andundefined
values. - Fixes issues with the
@formkit/nuxt
module and syntax highlighting. - Fixes a bug that caused the
dirty
state of an unrelated input to get incorrectly settrue
when an object (like a group) was updated (#520). - The floating labels plugin now hides placeholders until focused (#574).
- Fixes a bug that caused forms to not receive the
submitted
state like the form’s children on an unsuccessful form submission (#503). - The multi-step input now preserves step order when conditionally rendering steps (#613).
- Fixes a tailwind styling bug for checkboxes and radios (#584).
This release adds new 1st-party plugins to the @formkit/addons
package, ships bug fixes and styling updates for both CSS and Tailwind CSS users.
- Easily create multi-step forms or include multi-step sections inside your forms with the new multi-step plugin in
@formkit/addons
. Ships with standalone CSS styling you can import that works well with ourgenesis
theme. Check out the full documentation here. - Enable floating labels for all
text
family (text
,email
,url
, etc) andtextarea
inputs with the new floating labels plugin in@formkit/addons
. Check out the full documentation here. - Adds new
Next
andPrevious
strings to UI localization object for use in plugins and custom inputs.
- Fixes missing Tailwind CSS genesis theme export path in
@formkit/themes
. - Adds
:focus-visible
styling to buttons to show focus state when using keyboard navigation. - Adds missing
loading
styles forsubmit
buttons in the Tailwind CSS Genesis theme.
- New Article: Create a Multi-Step form in Vue in 5 Minutes
This release addresses some issues for Tailwind users that were introduced in beta.13
.
- Reverts
@formkit/themes/tailwindcss
to only include adefault
export of theFormKitVariants
plugin. - Moves the provided Tailwind Genesis theme to a new export path of
@formkit/themes/dist/tailwindcss/genesis
. - Changes remove class operator from
!
to$remove:
in order to not conflict with Tailwind's built-in!
operator that adds!important
to a style rule. - Fixes issue where default icons would not load when using the provided FormKit Tailwind Genesis theme.
- Adds new
<FormKitMessages>
component which allows relocation of a form’s validation and error messages and the ability forgroup
andlist
inputs to display their own error and validation messages. - When removing classes on a section of a FormKit input you can use the
!
prefix operator to selectively remove an existing class without needing to use the long-form object syntax. egouter-class="my-class !formkit-outer"
addsmy-class
and removes the defaultformkit-outer
class. - Adds
Catalan (thanks @petergithubmgw).
- The
checkbox
andradio
inputs now have adata-checked
attribute around their respective wrapper making it easy to add custom styling for checked vs non-checked states. - Improves validation messages in a handful of languages (
en
,pt
,zh
). - Pro: New Mask Pro input.
- Pro: Adds
empty-message
prop allows for message to be rendered in listbox when no options are passed (dropdown
,autocomplete
, andtaglist
). #502 - Pro: Adds checked attribute to formkit-option (
dropdown
,autocomplete
,taglist
). #350 - Pro: Adds
max
prop fortaglist
andautocomplete
withmultiple
inputs. #501 - Pro: Adds
closeOnSelect
prop will keep thelistbox
expanded as selections are made (autocomplete
multiple andtaglist
). - Pro: Adds
forceExpanded
prop forces thelistbox
to remain open for dev purposes (dropdown
,autocomplete
, andtaglist
). - Pro: All Pro inputs can now be disabled via
disabled
attribute.
- Fixed a bug where
date_after
rule showed a incorrect validation message because of timezones. #488 - Fixed a bug where self-generated ids did not have an attribute-safe value because of special characters. #517
v-model
values can now be initialized asundefined
. #235- Fixed a bug that caused inline
validation-rules
props to recurse unexpectedly. #514 - Fixed a bug that caused the label of checkboxes with multiple options to not be overridden with
sections-schema
. #541 - Fixed a bug that caused labels to not change dynamically in already-rendered validation messages. #297
- Fixed a bug that caused the
disabled
prop to neednull
instead offalse
to render thedata-disabled
attribute on the outer wrapper. #511 - Fixed a bug that prevented slots from being conditional (ie using
v-if
on the<template v-slot>
block). #489 - Fixed Nuxt and Nuxt playground compatibility issues.
- Fixed a bug that caused sections using to not properly respect
sections-schema
prop. - Fixed an issue with Tailwind prefix and suffix icon variants. #530
- Pro: Fixed a
taglist
bug where duplicate options were loaded from API. #497 - Pro: Fixed a bug where the
taglist
would render duplicate props whenmultiple
prop set tofalse
. #494 - Pro: Fixed a bug where
autocomplete
options
were duplicating when being used fast, repeatedly, or with pasted content. #431 - Pro: Fixed issue where default value for
autocomplete
andtaglist
could not be removed when the provided value was an object literal. #505 - Pro: Fixed an issue where the
listbox
was still visible when nooptions
were passed. #504
- New API Reference — TypeScript users rejoice! The API Reference exposes previously undocumented functionality.
- New Tailwind implementation of our Genesis theme.
- When choosing Tailwind CSS in the FormKit Playground the new FormKit Tailwind Genesis theme is loaded automatically for you if your Playground does not already have a
formkit.config.js
file.
- Pro: New Taglist Pro Input now available!
- Adds
npx formkit create-app
command to easily bootstrap new FormKit projects. - Improves
length
rule validation messages across all languages. - Adds 🇬🇷 Greek (uk) language #460.
- Adds 🇳🇴 Norwegian Bokmål (nb) language #418.
- Adds 🇸🇰 Slovak (sk) language #401.
- Pro: All Pro Inputs can now be disabled.
- Pro: Improvements to Genesis Pro theme.
- Pro: Autocompletes with multiple options selected can now be re-ordered via drag & drop.
- Pro: Added missing attrs to the message schema.
- Fixed a bug where the label slot didn't work without the label prop #456.
- Fixed a bug where you couldn't dynamically change available validation rules #449.
- Fixed a bug where swapping keys would not clear an input's value when inside a group. #446.
- Fixed a bug where Date object methods were inaccessible from Schema #406.
- Fixed a pathing issue that made it difficult for third-parties from accessing files #404.
- Fixed a bug that prevented the
stopIfFalse
argument on thewalkTree
function. - Fixed a bug where a select input initialized with a
null
value doesn't have a good value #415. - Pro: Fixed a bug
count:blocking
event was not emitting properly in Repeaters. - Pro: Updated Repeater indexes to be numbers instead of strings. #422.
- Pro: Fixed an autocomplete bug where the next page of options was overriding the current page. #447.
- Pro: Fixed a bug where Pro inputs were not showing validation messages on blur #403.
- Lays foundation for FormKit Pro Inputs!
- Fixed a bug where the "help" slot appeared twice for checkbox and radio elements #353.
- Fixed a bug that caused the FormKit AutoAnimate plugin to fail with Nuxt #361.
- Fixed a schema bug where a dot-notation reference to a non-existing sub property causes
[Object object]
to output after the reference does exists #368. - FormKit now works with Nuxt
3.0.0-rc.8
and3.0.0-rc.9
#371 and #383. - Fixed a bug where users were unable to use hooks via plugin to update v-modeled values #391.
- Fixed a bug where users were unable to import
@formkit/themes/tailwindcss
with TypeScript #376. - Fixed a bug that caused default icons to never load when included directly in the configuration.
- Fixed a bug where a checkbox validation with "required" worked only the first time #169.
- Input definitions now have an optional
family
property, which adds adata-family
attribute, and sets the value onnode.props.family
. This is useful for applying plugins and styles to entire "families" of inputs like the text family of inputs, which would apply totext
,email
,password
,number
, etc. - Input definitions now include an optional
forceTypeProp
property which ensures thenode.props.type
is initialized as a given value even if the input is registered under a different name. For examplemyModifiedCheckbox
could still havenode.props.type
report "checkbox". - Adds
data-multiple
attribute to checkboxes and radios when they have multiple options. - Adds new
@submit-invalid
event totype="form"
inputs. The event is triggered when a user attempts to submit a form but it has invalid inputs. - Adds new
getValidationMessages
helper function to@formkit/validation
that extracts a Map of nodes and their validation messages. - Adds new
decorator-icon
section to checkboxes and radios, making it easy to use custom SVGs in your checkboxes and radios. - Adds new "check" and "circle" icons to the built in icon pack.
- Adds 🇦🇿 Azerbaijani (az) language.
- Adds 🇺🇦 Ukrainian (uk) language.
- Fixed a regression where a single checkbox was no longer displaying the help text (#310).
- Fixed a bug that caused the AutoAnimate plugin to fail on Nuxt SSR (#330).
- Fixed a bug that caused all input’s
context.state.dirty
to turn true when a v-modeled form was edited (#311). - Fixed a bug that caused a race condition between the @change event of a select list and the v-model value propagation (#335).
- Fixed a bug that caused conditional props/attrs that returned arrays to return objects instead of arrays (#317).
- Fixed a bug that caused empty file inputs to be set to undefined instead of an empty array when
node.reset()
is called (#319). - Fixed a bug that caused the disabled prop to improperly disable checkboxes and radio inputs when set to a falsy (not nullish) value (#307).
- The file input’s
removeFiles
section has been renamed tofileRemove
. - The
fileRemove
(previouslyremoveFiles
) section used to rendered an<a>
tag, this has been changed to abutton
. - Composables from
@formkit/inputs
have been replaced with "sections". This should only affect users who were creating their own inputs from pre-existing composables.
- Icons! FormKit now ships with first class support for icons, including a first-party MIT licensed icon pack with automatic CDN delivery. Read more about it on the new icons documentation page.
- AutoAnimate! FormKit now includes an AutoAnimate plugin, bringing AutoAnimate support to FormKit with a single line of code.
- Exports! You can now export any of the existing inputs and restructure them at will using the new
@formkit/cli
command line tool. Alter existing inputs by adding, removing, updating, or re-ordering sections — or add your own exported and altered input variations to your input library. - All inputs have been refactored to use a much improved schema composition API that allows easy composition and modification of schema based inputs.
- Adds new
meta
property to schema specification (#248). - FormKit CSS themes can be installed via CDN using the new
theme
option indefaultConfig()
- Adds new
submit
andsetErrors
hooks. - Adds 🇧🇬 Bulgarian language.
- Adds 🇭🇺 Hungarian language.
- Adds 🇰🇿 Kazakh language.
- Adds 🇷🇸 Serbian language.
- Adds 🇹🇯 Tajik language.
- Fixed a bug that caused the
key
property to not work when using the$formkit
shorthand in schema (#232). - Fixed a bug that did not call event handlers on
@blur
(#239). - Fixed a bug that caused 1 too many
for
iterations on old Safari browsers (#299). - Added automatic keys to FormKit inputs which fixed a smattering reactivity bugs when explicit keys were not used with conditional inputs.
- The
input-errors
prop will now reset any errors it previously set when set to an empty object{}
(#277). - Adds support for Czech/Slovak diacritics in
alpha
andalpha_spaces
rules (#281).
- New docs page for FormKit Icons 🎉.
- New guide for exporting and restructuring icons!
- New docs using the AutoAnimate plugin.
- Input diagrams include new icon sections.
- The
tailwindcss
,unocss
, andwindicss
plugins must now be imported from their own subpath of the@formkit/themes
package. For example:
import formKitTailwindPlugin from '@formkit/themes/tailwindcss'
- Removes improper imports from
windicss
,tailwindcss
andunocss
.
- The
update:model-value
event will now only be emitted when using thev-model
directive. - The
input
event is now debounced to reduce the amount of noise being emitted. You can use the newinput-raw
to listen to every input event. - Errors set via
setErrors
are now automatically cleared on input by default. To revert to the previous behavior, setpreserveErrors: true
in your global config object. - The
@formkit/tailwindcss
package is now deprecated — both theformKitTailwind
plugin and thegenerateClasses
function have been moved to the@formkit/themes
package.
checkbox
,radio
, andselect
inputs (inputs that use:options
) can now use any data type as their value like numbers, objects, or evennull
(#85).- Adds new
node.clearErrors
andclearErrors
utilities to assist in clearing backend errors from an input or form. - Now inputs automatically clear any errors set with
node.setErrors()
on user input. You can override this default behavior (to keep the error on the input) withpreserve-errors="true"
. - Adds a new
node.addProps
function for adding new props in custom plugins. - Adds new
message
hook for modifying messages as they are being set. - Adds a new core event
reset
— emitted after a form is reset. - Adds a new
index
prop that allows inputs to be injected at a given index on a parentlist
type. - The
<FormKit>
component’sinput
event is now debounced, meaning it emits much less noise. - Exports all input feature functions
import { features } from '@formkit/inputs'
. - Adds a new
input-raw
event to the<FormKit>
component which is emitted for every single input event in an input, list, group, or form (very noisy). - The core node is now the second argument of the
input
,input-raw
,submit
andsubmit-raw
events. - Adds new core node event
dom-input-event
which has the native HTMLEvent
object as the payload. @formkit/themes
now includes named exports for plugin functions for Tailwind CSS (formKitTailwind
), Windi CSS (formKitWindi
), and Uno CSS (formKitUno
). By adding the correct plugin to your CSS framework's configuration file you will have access to a variety of formkit variants such asformkit-invalid:
andformkit-disabled:
.@formkit/themes
now includes thegenerateClasses
helper function will allows you to easily supply different class lists to${sectionKey}
s based on input type.- Adds 🇸🇪 Swedish language.
- Adds 🇸🇮 Slovenian language.
- Adds 🇷🇴 Romanian language.
- Adds 🇯🇵 Japanese language.
- Adds 🇹🇭 Thai language.
- Improves 🇵🇱 Polish language.
- 🔥 Dramatically improves
v-model
performance and reliability for deeply nested structures like forms with list and groups. - Fixes an issue that caused
null
values to throw errors (#151) - Fixed a bug that caused
validation-visibility
to not change when updated reactively (#159) - Fixes a bug that caused the
preserve
keyword to block some form submissions (#145) - Fixes TypeScript typing for the
@formkit/tailwind
configuration (#143) - Fixes a bug that caused single checkboxes with an object as the
on-value
to not be set their initial value when using the:value
prop. - Fixes a bug that caused validation rules to not be updated when the label prop changed (#170)
- Fixes a bug that caused incorrect default selection on select lists with an explicit
multiple="false"
attribute and a placeholder (#148). - Fixes a bug that caused the
classes
prop to not react to Vue’s reactivity when using nested refs (#155). - Fixes a bug that prevented submit buttons from being disabled when applied using using the
disabled
attribute on the form without specifyingdisabled="true"
(#215) - Fixes a schema compiler bug that caused the white space of a quoted string in a parenthesis to be incorrectly removed (#150).
- Adds new
alpha_spaces
validation rule (#83) - Adds 🇨🇿 Czech (thanks @dfridrich)
- Adds
Frisian (thanks @arjendejong12)
- New configuration documentation that explains the relationship of node options, config, and props.
- Fixes a bug that caused radio inputs to loose reactivity when set via
node.input()
(#139) - Improves TypeScript annotation for
@submit
event (#130) - Fixed an issue that caused selects not to render if set to an empty array (#129)
- Fixed an error that caused server side rendering errors on Nuxt 3 when running a built project (#113)
- Fixed a bug that caused schema variable scoping to be lost when referencing iteration data inside the slot of a component (#91)
- The
data-loading
attribute has been moved from the submit button of a form to the<form>
tag itself.
- Adds new
@formkit/tailwindcss
plugin to easily create Tailwind themes for your FormKit forms. Check out the Create a Tailwind CSS theme guide for more details. - Adds a new programmatic
reset
function. This can be done on any input, group, form, or list and it will restore the value back to its initial state. It also resets thecontext.state
object (likeblurred
anddirty
). - Improves accessibility by adding
aria-describedby
andaria-live
to all provided input types.aria-describedby
now targets help text, validation messages, and error messages (labeling provided by<label>
tags that use thefor
attribute). - Groups, lists and forms can now apply
undefined
values to their children. In other words, if a form is v-modeled and its value is set to an empty object{}
, it will clear the entire form out. - Adds new
context.state.settled
property that signals when the input’s internal debounce cycle has ended and a value is finished being committed to the form. - Adds
data-submitted
attribute to inputs that have been submitted. - Adds new section key
fileName
(thanks @santi). - Adds new
parent
prop that accepts a core node for advanced use cases where inputs are decoupled from their form or data structure is desired. - Adds 🇱🇾 Arabic (thanks @Ahmedelforjani)
- Adds 🇩🇰 Danish (thanks @bjerggaard)
- Adds 🇮🇩 Indonesian (thanks @rama-adi)
- Adds 🇮🇹 Italian (thanks @punga78, @Archetipo95)
- Adds 🇵🇱 Polish (thanks @xxSkyy)
- Adds 🇰🇷 Korean (thanks @bwp618)
- Adds 🇻🇳 Vietnamese (thanks @oanhnn)
- Improved 🇫🇷 French (thanks @pop123123123)
- Fixes a bug that could cause validation errors to flash for 20ms before resolving when using browser autocomplete (#99).
- Fixes a bug that caused class props (like
input-class
) inside schemas to not properly respect the$reset
command because it was treated like a variable (#61). - Fixes a bug that didn't allow classes to be modified via section-key class props when the section-key has multiple words, such as
file-list-class
orfile-item-class
(#120).
- The genesis theme should now be imported from
import '@formkit/themes/genesis
.
- Adds programmatic form submission:
- Can be submitted by node
node.submit()
(including any child node of the form). - Can be submitted via function
this.$formkit.submit('form-id')
(for composition api it'ssubmitForm('form-id')
).
- Can be submitted by node
- Improved
setErrors
DX:- Can now be called directly on a node
node.setErrors(nodeErrors, childErrors)
. setErrors
now supports pure stringnode.setErrors('My error')
- Can now be called directly on a node
- Submit handler is now passed the form’s node for easy error setting.
- A
<FormKit>
component’s core node is now available via template ref. - Adds
data-invalid
attribute to theouter
section when an input has failing validation messages that are currently displayed (playground example). - Adds
data-errors
attribute to theouter
section when the input has explicitly placed errors (via prop orsetErrors
). - Adds
data-complete
attribute to theouter
section when an input (playground example):- Either:
- The input has validation rules.
- The validation rules are all passing.
- There are no errors on the input.
- Or:
- The input has no validation rules.
- The input has no errors.
- The input is dirty and has a value.
- Either:
- New
context.state
properties:state.rules
- true when the input has validation rules.state.errors
- true when the input has explicit errors placed on it.state.complete
- same as logic asdata-complete
.state.validationVisible
- true when thevalidation-visibility
condition is met (it is showing validation errors if there are any).
- Refactors the Nuxt 3 module for faster build time and better file resolution.
- Adds 🇮🇷 Persian language support (thanks @shahabbasian)
- Adds 🇧🇷 Portuguese language support (thanks @r-martins)
- Adds 🇹🇷 Turkish language support (thanks @ragokan)
- Adds 🇫🇮 Finish language support (thanks @mihqusta)
- Adds 🇦🇷 Spanish language support (thanks @inibg)
- Added
node.setErrors
documentation. - Added programmatic form submission documentation.
- Improved
context.state
documentation with new properties and better descriptions.
- Fixes an issue that caused server side rendering and server side generation on Nuxt and vite-ssg/vitesse to throw exceptions during build process (#81).
- Fixes a bug that prevented
file
inputs from triggering customonChange
events (#90). - Fixes a bug that prevented forms from outputting their
id
to the DOM. - Fixes a styling issue in the Genesis theme that caused select list items to be grey before an option was selected when using a placeholder (#59)
- Fixes a bug that caused the
:value
prop on forms to be mutated on input (#72). - Fixes inconsistency between
prop:{propName}
events emitted by default props and custom input defined props (#73)
beta.3
was going to be such a great release we decided to skip it and go straight tobeta.4
👀 ! Only kidding. We had issues with npm and had to bump 🤦.
- New
@formkit/nuxt
package is a full featured Nuxt 3 module that makes using FormKit with Nuxt 3 as simple as possible! defaultConfig
now includes a new package@formkit/dev
which decodes FormKit’s error codes to helpful console messages (no action required) (#56).- FormKit is officially open-source under the MIT license!
- The
preserve
key now applies to all descendants (#53). - Exports all the text formatter functions in the
@formkit/i18n
package (#54). - Adds 🇳🇱 Dutch language support (thanks @arjendejong12).
- Adds 🇭🇷 Croatian language support (thanks @antemarkic).
- Improves 🇩🇪 German language support (thanks @tosling).
- New installation documentation. You no longer need an auth token to install from the
@formkit
organization! - Nuxt installation documentation
- Improved internationalization documentation for selective message overrides.
- Fixes a bug that caused multi-select checkboxes to not display the current value when set from parent node and when using
options
prop that is stored in an external variable (#55) - Fixed a bug that caused the
placeholder
on select inputs to be removed if something caused the input to re-render (#52). - Fixed the select placeholder color (#51)
- Forms are automatically disabled when an async submit handler is pending (#44).
- Added a new prop
submit-behavior
to opt-out of the new automatically disabled forms. - Exports the Vue to FormKit bindings plugin as
bindings
in the@formkit/vue
package. - The type
button
andsubmit
are automatically ignored. - Introduces a new
messages
key to thedefaultConfig
to allow partial overrides to locales. This allows selective message overrides for already registered locales (#42). - The schema compiler now supports "undefined" as a valid output (in other words
$: undefined
would output the valueundefined
instead of the string "undefined"). - Adds 🇮🇱 Hebrew locale (thanks @Hepi420)
- Adds 🇨🇳 Chinese locale (thanks @myleslee)
- Fixed an issue that caused checkboxes with
options
to not properly hydrate when re-populated from agroup
,list
, orform
(#45). - Fixed an issue that caused checkboxes with
options
to not display incorrectly when missing a the label prop (#41). - Significantly improved TypeScript support for “synthetic” props (#43).
- Changes the
validation-behavior
prop on the<FormKit>
component tovalidation-visibility
. - Changes the
schema
prop on the<FormKit>
component tosections-schema
.
- Adds the native
file
input type with support for some value-added features:- Display only re-population.
- Drag and drop.
- Input clearing.
- Adds the
createInput
helper function to make custom inputs easy to write. - New
incomplete-message
prop allows inline customization (or disabling) of the message displayed by a form when it attempts to submit and all its inputs are not valid. - Updates the
defaultConfig
to accept custom inputs. - Adds a prefix section key which allows content to be injected immediately before an input element.
- Adds a suffix section key which allows content to be injected immediately after an input element.
- 🇷🇺 Russian locale (thank you @andreimakushkin!)
- Refactors Genesis theme to use much more robust CSS variable structure.
- Adds a new feature to schemas that allows users to prefix
props
andattrs
properties with__raw__
to pass the raw value instead of its parsed result (#36).
- New create a custom input guide.
- New advanced custom input documentation page.
- "Composition keys" will now be referred to as "Section keys".
- Adds documentation on
plugin.library
— the mechanism plugins use to define new input types. - Interactive code editor for examples now supports multiple files.
- In the FormKit Playground you can add new files and import them into each other. The FormKit Playground supports
.vue
,.js
,formkit.config.js
andtailwind.config.js
files. - The FormKit Playground is now located at https://formkit.com/playground and old https://formkit.com/playground/vue playgrounds are deprecated.
- Fixes a bug that prevented the incomplete message from displaying on forms (#29).
- Fixes TypeScript typings for
@submit
and@submit-raw
events. - Fixes the order of numbers in the
length
andbetween
validation messages to always place the lower number first (#35). - Fixes an issue (#32)with select lists where the
:options
prop would not accept number values.
- New validation rule “hints” — modifiers that change a validation rule’s behavior. Supported hints allow you to:
- Run a rule when the field is empty.
- Force a rule to run even when previous rules are failing.
- Debounce a validation rule.
- Make a validation rule optional.
- When an input is inside a form and unmounted (such as a
v-if
), it now removes it’s value from the form data and de-registers its core node. - New
preserve
prop allows inputs to not remove their data from groups, lists, and forms when they are removed.
- Fixed an issue that caused numeric value radio and checkbox options to render incorrectly.
- Fixed a bug that caused the
placeholder
to not render when the prop came after theoptions
prop. - Fixed a bug that caused the delay value to not be respected when set using ancestor config.
- Form error handling is here. You can now set input errors on an entire form, group or list with the
input-errors
prop or the$formkit.setErrors()
methods. Read more about it on the form docs. - New
$formkit.setLocale()
reactively changes the language of all displayed messages. - Adds 🇫🇷 French and 🇩🇪 German locales (thank you @HoreKk and @digitalkaoz)
- Adds new
rootConfig
proxy object that is used to store global base config and prop values (significant refactor of configuration system). - Added ledger dependency tracking to instances of
FormKitObservedNode
. - The submit button on forms now use the locale for the default “Submit” label.
- New
child
node event emitted when a parent has a child added to it. - The
length
rule can now take max/min arguments in either orderlength:15,5
orlength:5,15
evaluate the same. - Adds a new
getNode
function to directly access a FormKit node using the composition API. - Improves the
@formkit/theme
css import location.
- Fixed a bug that caused children of
list
inputs to sometimes throw an exception when display validation errors. - Improved several of the validation error messages.
- Fixed an issue with select inputs prevented raw
node.input()
calls to not trigger reactivity in Vue.
- A new
$formkit
schema shorthand for using FormKit inputs in a schema (Issue #15). - New
disabled
prop on form, list, and group inputs automatically disables all child inputs (Issue #16). - New
submitAttrs
prop on forms allows you to pass attributes to the form’s submit button. - Added a new universal
ignore
prop that prevents an input’s data from being used in a form.
- Fixed an issue that prevented schemas from rendering expressions when used inside the
children
property of a FormKit component. (Issue #21). - Added a check in case a
rootClasses
function incorrectly returnsundefined
(Issue #17). - Fixed a bug that caused a form's submit button to pollute the form’s data object with a
submit_x
property (Issue #22). - Fixed a bug that caused
$cmp
schema nodes to fail to remount if the schema’s root object was reset causing a full re-parse (Issue #14).