- issue where decimal was getting added when formatter explicitly was told not to add
utils.createIntlNumberFormatter('en-US', {
style: 'decimal',
signDisplay: 'never',
minimumFractionDigits: 0,
maximumFractionDigits: 0
});
- issue with missing types Debug and Schema Fields
- issue with isChild
- hidden field back to default exported components
- issue where Relevance inside of Relevance might prevent cleanup on form state
- issue where nested array fields removal would break
- issue where custom error messages did not work in allOf
- issue where required:[] on allOf was not working
-issue where zero ( 0 ) would not work for minimum and maximum due to bad falsey check lol classic
- onNativeChange handler to useField
- onValid and onInvalid to useForm
- issue where we would not pass all options to intl formatter
- issue where after a gather data the field-value event would not get triggered so evaluate would never get called
- issue where FormComponents was not rendering from components option
- issue where modified would NOT be correct when allowEmptyString was passed
formState.modified
fieldState.modified
- Issue where errors would get kept when going to previous multistep step
- useConditional hook and ability to pass
evaluate
andevaluateWhen
- ability to pass gatherOnMount to a field
- misnamed
gatherData
prop
gatherData
prop to allow user to get asnyc information for a field
- Missing types for default exported fields
- Missing type for
required
- issue where allowEmptyString and allowEmptyStrings where broken
- issue where
step
was missing from multistep type
- issue with propertyOrder in nested schemas
- issue with more than double nested schemas
- issue with Multistep.Step types
- issue with changing options on schema fields ( undefined would clobber defined values in option merge )
- issue where changing validation params would not rebuild validation function
- issue where multistep steps would not deregister
- issue where multistep steps would not clean up after themselves
- issue with touchAllFields not touching fields within an array
- Another Issue with debugger in react native that caused crash
- Issue with debugger in react native
- onValueModified prop to useForm
- ability to pass reset options to reset field
- onValueChange prop to useForm
- Ability to add n items to array field by passing add(3) a number to add
- Missing form level option for keepState and keepStateIfRelevant
- Stupid issue with safari throwing a type error when trying to check for selectionStart on event.target
- Ability to use state across multiple forms
- missing types for multistep and formApi
- issue with INTL formatter when used with
EUR
anden-DE
- issue with formatter function not allowing full value
- issue with FormField not allowing conditional fields
Fixes teslamotors#381
- autoFocus on Input throws error
- propertyOrder back to schema
- asyncValidate to formApi
- issue with cursor offsets when suffix is added
- issue with negative cursor offsets
- issue with off by one cursor locations on formatter
- createIntlNumberFormatter not working with negative numbers
- clearValue() function to form and field apis
- Issue where validateOnMount would NOT trigger validation when a field was re-rendered
- issue with array field items being memoized
- issue with createIntlNumber mask adding random "[]" sometimes
- issue where returning "" from validation function would not show error state
- issue where removing item from array field would not make the form dirty
- useRelevance hook and added type for it in types
- issue where values would get cleared on un-mount
- issue where I forgot to deregister fields when they became irrelevant
- issue where I forgot to allow relevanceDeps to be passed to multistep step
- The repo to tesla or go needed to re publish to get updated README to npm
- forgot to add getCurrentStep to multistepApi
- forgot to add nextStep and previousStep to multistepState
- issue where set touched did not default meta when field is not there
- issue where
FormField
could not take field props
- missing type for Relevant
- issue where FormProvider was not exported
- issue where passing showErrorIfTouched={false} would not work
- Empty dependencies object from package.json
- Issue with relevance subscription when no relevance function
- Missing functions setValues and setTheseValues
- Missing types for validate and validateField on FormApi
- Issue where we forgot to expose form validate
- Missing utils types
- useScope and useScoper to exports
- Issue with forms valid and invalid when relevance changes
- Issue with schema path util
inverter[12].air_filter_ok
would not work
- Issue with initializing when becoming relevant
Old
const onSubmit = values => console.log( values );
New
const onSubmit = formState => console.log( formState.values );
Old
<Text field="name" />
New
<Input name="name" />
Old
<Form apiRef={apiRef} />
// OR
<Form getApi={getApi} />
New
<Form formApiRef={formApiRef} />
informed:props is now ui:props when using schema based forms
Instead of doing this
const CustomField = asField({ fieldState, fieldApi }) => {}
Do this
const CustomField = props => {
const { fieldState, fieldApi } = useField(props);
};
The when function for relevance now has this signature
when={({formState, formApi, scope}) => {...} }
validationSchema ---> is now yupSchema
<ArrayField.Items>
{({ remove, field }) => (
<>
<Input name={field} />
<button type="button" onClick={remove}>
Remove
</button>
</>
)}
</ArrayField.Items>
Is Now
<ArrayField.Items>
{({ remove, name }) => (
<>
<Input name={name} />
<button type="button" onClick={remove}>
Remove
</button>
</>
)}
</ArrayField.Items>
Old:
<ArrayField.Items>
{({ remove, field }) => (
<>
<Input name={`${field}.name`} />
<Input name={`${field}.age`} />
<button type="button" onClick={remove}>
Remove
</button>
</>
)}
</ArrayField.Items>
New:
<ArrayField.Items>
{({ remove }) => (
<>
<Input name="name" />
<Input name="age" />
<button type="button" onClick={remove}>
Remove
</button>
</>
)}
</ArrayField.Items>
Old:
// Some component you need to use state of array field item
const FieldState = ({ values }) => {
return (
<pre>
<code>{JSON.stringify(values, null, 2)}</code>
</pre>
);
};
<ArrayField.Items>
{({ remove, values }) => (
<>
<Input name="name" />
<Input name="age" />
<FieldState values={values} />
<button type="button" onClick={remove}>
Remove
</button>
</>
)}
</ArrayField.Items>;
New:
// Some component you need to use state of array field item
const FieldState = () => {
const { values } = useArrayFieldItemState();
return (
<pre>
<code>{JSON.stringify(values, null, 2)}</code>
</pre>
);
};
<ArrayField.Items>
{({ remove }) => (
<>
<Input name="name" />
<Input name="age" />
<FieldState />
<button type="button" onClick={remove}>
Remove
</button>
</>
)}
</ArrayField.Items>;
Old:
<FormState values errors />
New:
<Debug values errors />
Minor changes to custom inputs
New:
const CustomInput = props => {
const { fieldState, fieldApi, render, ref, userProps } = useField(props);
// The field state
const { value, error, showError } = fieldState;
// The field control
const { setValue, setTouched } = fieldApi;
// Everything else
const { label, id, ...rest } = userProps;
return render(
<>
{label ? <label htmlFor={id}>{label}</label> : null}
<input
{...rest}
id={id}
ref={ref}
value={!value && value !== 0 ? '' : value}
onChange={e => {
setValue(e.target.value, e);
}}
onBlur={e => {
setTouched(true, e);
}}
style={showError ? { border: 'solid 1px red' } : null}
/>
{showError ? <small style={{ color: 'red' }}>{error}</small> : null}
</>
);
};
Validation is now controlled via validateOn="validationString"
By default fields will only validate on blur. To get
more granular validation, simply pass in validateOn
props.
See table below for mapping:
validateOn | derived | change | blur | submit | default |
---|---|---|---|---|---|
change | change-change | sync + async | sync + async | sync + async | |
blur | blur-blur | x | sync + async | sync + async | x |
change-blur | change-blur | sync | sync + async | sync + async | |
change-submit | change-submit | sync | sync | sync + async | |
blur-submit | submit-submit | x | sync | sync + async | |
submit | submit-submit | x | x | sync + async |
Validation is controlled via the validateOn
prop, but in order to control when it shows,
use the showErrorIfError
and showErrorIfDirty
props. This is because sometimes you may want the form to be invalid but not show the error to the user yet ( default is showErrorIfTouched
)
prop | description | default |
---|---|---|
showErrorIfError | will set showError for that field to true whenever there is an error (typically used with validateOnMount) |
|
showErrorIfTouched | will set showError for that field to true whenever there is an error and the field is touched |
x |
showErrorIfDirty | will set showError for that field to true whenever there is an error and the field is dirty |
Finally we have a use case for validating right away ( on mount )
prop | description | default |
---|---|---|
validateOnMount | will trigger validation onMount | false |
- ability to control when async validation occurs with props
- createIntlNumberFormatter
- Issue with useFieldState, now returns empty object by default
- Issue with mounting useFieldStates
- Issue with layoutEffect in SSR
- Ability to walk down a multistep with step selection.
- formatter functions
formatter = [()=>{}, ()=>{}]
- memoized render back because I never should have removed it
- To no longer use event emitter.
- Issue where keep state in scope was not working.
- Pristine and Dirty to formFieldState
- Peer deps to support react v 17
- Issue where ObjectMap
has
would reference wrong get funciton fixes #327
- Issue where carrot pos would be in the wrong place when formatting
useField
hook to use theuseCarrotPosition
hook ( removed duplicate code )
- Ability to call
setValue
function for custom formattedObject Inputs
- Ability to pass
initialize
function for custom initialization of the initial value
- Utils functions that can be used by end users
- bug with update function in form controller where it would pull instead of delete on swap
swap
to array fields
- Internal state management
onReset
to form props
- README and needed to get it to npm ... again again
- README and needed to get it to npm ... again
- README and needed to get it to npm
- Type issue ( missing allow empty string from props def )
- Issue where Id was not getting passed to default select field
- LODASH!!!!! SEE YA LATER NEVER
- Ability to pass relevant to array fields!!!
- Bug with field level relevant
- Form to always evaluate relevance, and not force the user to pass notify.
- Isssue where state would not update after submit
- Ability to add async validation functions to inputs
- Ability to not pass keep state to multistep fields, and also added docs for conditional relevant nested array fields
- Ability to hide or show fields based on relevant, and notify relevant fields
- bug with resetting array field items
- bug with duplicate fields
- bug with keep state registering phantom fields
- ability to create custom schema fields
- useField was not adding id to label by default
- Required attribute to input and automatic type generation for useField hook
- Issue where informed props were not passed down to array fields in schema
- Ability to have conditional schemas!!!!
- Ability to add array fields in schema!!!!
- Formatter and Parser !!!!!
- Issue with strict mode double registering
- Bug where inforemd would crash if schema was missing field that was in JSX ( returns null )
- Ability to render schema fields in specific paces within JSX!!
- Added AJV Schema shit!!!
- Schema shit
- Array fields because I stupidly broke them
- Tests for multistep fields
- Better multistep form syntax
- Better multistep docs
- internals to modify state direct to improve performance!
- useArray field to expose a reset that resets to initial values
- Issue with back and next types for multistep fields
- Array field Api control for ArrayFieldItems
- To use field ids instead of names
<Relevant>
component
- Type file to include preventEnter on form props
- Ability to pass formController to useField hook
- Issue where new version of react would throw warnings due to bad code
- Issue where dynamic nested array fields with keep state kept too much state :)
- New multistep abilities via setCurrent in
formApi
andCurrent
informState
. See compex multistep form in docs
- Ability to spread
informed
object on inputs via theuseField
hook
- Readme to show useForm example
- FormState component to assist when debugging!
- Types for multisetp forms
- Ability to use cursor position in mask function
- Intro examples to inculde on submit example
- Field level Yup support
- Typo in yup docs and readme
- Yup support
- docs and readme to link to dicord channel
- apiRef so you can just pass a ref to the form
- Step functionality to support multistep forms
- README ( I wish there was a way on npm to update readme without publishing version )
- Issue with array field validation https://github.com/joepuzzo/informed/issues/259
- Issue where informed would throw errors when fields were hidden but referenced
- Ability to ( in the near future ) add validations to scopes ( Enabled because of code refacotor... will add soon :)
- The internals to no longer keep track of giant state object but instead generate it on demand
- A bunch of useless code :)
- Large portion of the code .. Mostly the formController!
- useField to trigger validation when validation related props change
- issue with array field where validation would fail
- issue with array field where removing multiple fields did not remove the data from state
- removable prop to inputs because it was a bad idea... now it supports removal nativley
- removable prop to inputs ( adds support for pairing keep state and array fields such that remove button actually removes field )
- issue with keep state on array fields
- comp name to useField hook
- missing setFormError prop to FormApi interface
- keepState to types
- allowEmptyStrings form level prop to types
- issue 227 where allowEmptyStrings form level prop did not work
- issue 219 where array fields would not work with scope
- issue 225 where validation will occur on mount when there are initial values
- issue 215 where selects dont work in Edge becase .. you know.. Microsoft
- warning with useLayoutEffect when using SSR
- README file to include minzipped badge
- Issue where initial values changing on multiselects caused looping .. oops
- useForm to return user props and a render method
- Form provider to no longer render a
<form></form>
IT NEVER SHOULD HAVE.
- Issue where initial values did not change when form was reset
- Issue where array level validation would not trigger for complex nested fields within array field
- length as a second parameter to arrayFields validate function
- ability to pass validation function to an array field
- arrayFields are now treaded as "shadow" fields
- useArrayField hook
- ability to change out form options such as validateFields
- issue with addWithInitialValue when using add and then addWithInitialValue
- addWithInitialValue to the
ArrayField
- issue where initial values were not being formatted
- issue where initial values were not being masked
- Types file to support validate on formApi
- Types file to support any type on form errors
- documentation for creating custom inputs
- the ability to pass your own ref to inputs
- issue with validation triggering when keep state and validate on blur
- made
maskWithCursorOffset
optional in types
maskWithCursorOffset
to the type defs
maskWithCursorOffset
prop to inputs
- maintainCursor to types
- render and userProps to field context types
- maskedValue to types
- getters to useFields field api
- useField hook to the docs
- the interface for useField hook
- issue where initialization code in useform was in the effect and not in constructor
- attempting to fix issue that I think is caused by useEffect in useForm hook
- issues cause by using
useMemo
instead ofuseState
for initial render stuff
- exists function to the field api types
- exists function to the field api so you can check to see if that field exists
- issue where inital render of useFieldApi would fail when field was not registered yet
- useForm hook so that the event handlers can change
- debug as a dependency and added my own :)
- issue with default register context missin getField function
- issue with
useFieldApi
hook andwithFieldApi
HOC where reset and validate were not there
- a few more tests to increase test coverage!!!! wooo
useForm
hook!!! andFormProvider
component!!!
- useField hook to useEffect instead of useLayoutEffect
- preventEnter prop to the form so users can prevent enter key form submission
- Issue with dynamic arrays and initial values
- Babel build
allowEmtyStrings
prop to the formallowEmtyString
prop to inputs
- issue where setValues would not allow empty strings
setFormError
function to the form apivalidate
function to the form api
- Issue with setValues missing from the default context
- Issue where reset would call validation
- Allowing for optional generic on FormValue
- ref to be any type in typings
- issue in typings for ref field on FieldContext
- issue when using a field NOT in the context of a form
- another issue where initial values did not work when keep state was passed
- issue where initial values did not work when keep state was passed
- issue where initial values did not work for
ArrayFields
- typing files for type script users
- Issue with text area input not setting typed value
maskOnBlur
prop to inputs
fieldExists
api function to check if field exists
- Issue where form that is submitted through enter key would try to prevent default
- Issue where form values would not get passed to validation function when touched
- Format and parse to set maskedValue instead of value
- Issue where you could NOT set 0 null or false as initial values because they are falsey
- validateFields function to the form!!!
- Issue where reset would not work for scoped fields
- Set Values to the form api!!!
- Issue where ArrayField was prefixing all fields with 'field'
- Issue where when input fields changed input did not rerender.
- Issue where render and component props were getting passed to the dom form
- useFieldApi
- useFieldState
- useFormApi
- useFormState
- useField
- format
- parse
- maintianCursor ( fixes issue where cursor jumps to end on mask )
- ArrayField ( Check out the docs! this is sick! )
- Form Level validation ( function that can invalidate the form as a whole )
- debug prop that allows you to visually view the rendering!
- the field
"siblings.1"
now resolves tovalues.siblings[1]
, it used to resolve tovalues.siblings.1
- the field
"siblings['2']"
now resolves tovalues.siblings[2]
, it used to resolve tovalues.siblings.2
- withFormApi will no longer trigger a rerender if the fomrs state changes. This is a great optimization for those who want to modify but dont care about the form state!
- the
validate
prop now expects the validation function to returnundefined
if there is no error. Any other returned value (including falseynull
,0
, etc will be treated as an error for the field.
- The Field Component
fieldExists
not neededsetState
will maybe add later but its complex and out of scope ATMsetValues
will maybe add later but its complex and out of scope ATM ( as of V 2.0.3 its back! )preSubmit
was never needed.. developers can do this themselves- Async Validation. Async validation led to many issues that overcomplicated
informed
. We determined this is something that the developer could achive on there own for now but we may look into adding this in the future.
- typescript definition file
- Select forward ref
- files in package json to include typeigs
- type file for typescript
- Name of withFormSate
- Skipped test for select!!!
- Select to use new ref interface
- License
- Issue with @babel/runtime was the dep when it should have ben @babel/runtime-corejs2
- Issue with @babel/runtime for real this time
- Issue with @babel/runtime
- mistakenly added dev deps that were deps... oops
- submits to the form state
- Added prettier so all the files have been changed... so i rebuilt to have source maps match code
- Attempting to simply rebuild lib due to possible build issue
- initialValue to get exposed as prop to custom fields
- Source maps
- Issue where Basic radio group was not getting exported
- issue where bind to field did not pass down the field prop.
- Issue where element wont get removed from array when deregistering field... this is used when dynamically removing value
- Field prop is now exposed to field elements and default inputs pass field as name to html inputs
- fieldExists method to the formApi
- onValueChange prop to inputs so you can tie into when values change!!
- Issue where prop changes to fields would not get recognized
- issue where i forgott to add @babel/runtime as dependency
- asyncValidation prop to inputs
- asyncValidateOnBlur prop to inputs
- Basic input fields so users can more easily create custom inputs
- Docs for creating custom inputs
- issue where you could not nest scope
- issue where you could not pass initialValue=false to checkbox
- issue where mutable values were getting passed to onSubmit and getState
- issue where path array was being build every get and set
- issue where onChange was getting passed to internal form element
- globalObject: 'this' to the webpack dist config to support SSR
- Issue with event emitter limit ( need to look into alternative solution )
- Removed depricated sandbox sinon usage that was causing errors during tests
- Webpack dist configuration to keep class names
- Issue were initialValue was getting passed all the way down to html input
- Issue where form would not rerender when field was registered
- Issue were validateOnMount was getting passed all the way down to html input
- mask so you can mask values at field level. example
value => value + '!!!'
- hook so you can add a button with type=reset and it will reset the form
- validateOnMount to input props
- React and React-Dom to dev dependencies
- Bug where i did not do null check on event within on submit
- Notify prop to inputs that allows you to notify other fields when your error state changes ( see docs )
- Text
- TextArea
- Radio Group
- Radio
- Select
- Select as Multiselect !!!
- Checkbox
- withRadioGroup
- withFieldApi
- withFieldState
- withFormApi
- withFormState
- asField
- Form
- Field
**
Note: this was the first release but i wanted to include changes from
react-form
so here they are:
**
formApi
was split into two partsformApi
( contains just functions )formState
( contains just form state )- Form level validation is gone. You do all validation via field validation.
defaultValues
Form prop is now calledinitialValues
onChange
Form prop only recieves theformState
. It used to retrieve the form Api as well.preventDefault
Form prop is nowdontPreventDefault
getApi
Form prop just returns the formApi, not the state and the api.Form
component now renders theform
element internally. So you dont have to "hook it up" anymore!!
**
Note: this was the first release but i wanted to include things that were removed from
react-form
so here they are:
**
NestedField
you can useScope
instead but all it does is scope internal fields toscope="your-scope"
- validateOnSubmit was removed. Now the form always validates on submit by default and you can opt into sooner validation at field level.
defaultValues
form prop is now calledinitialValues
pure
Form prop. Its not needed anymore due to the use ofReact.PureComponent
internally.- add, remove, and swap values. The developer can achive this on there own without the use of internal functionality.
- Array Syntax. In order to keep things simple we now only support the string syntax for field names.
- Async Validation. Async validation led to many issues that overcomplicated
react-form
. We determined this is something that the developer could achive on there own for now but we may look into adding this in the future. - Warning and Success have been removed for now to keep lib lean but we may add additional functions in the future.