The "contract" that all validators must implement.
If the value is valid, a validator should return something falsy
(undefined, null, or ''). If the value is invalid, the validator should
return validation feedback which will be displayed to the user. The
validation feedback can be a string or a ReactNode (e.g. a JSX element).
There are two special values of ValidatorOutput:
ASYNC_VALIDATION_PENDING: The value should be considered invalid
because async validation is in progress.ASYNC_VALIDATION_DEBOUNCE_PENDING: The value should be considered invalid
because async validation has not started yet.INVALID_NO_FEEDBACK: The value is invalid but no feedback should be
displayed because the reason why the input is invalid is being displayed
somewhere else.A context that provides configuration values used by code within iti-react-core.
You must wrap your application in with <ItiReactCoreContext.Provider>.
Validators for string values. Each property on this object is a function that returns
a Validator<string>.
const validators = [Validators.required(), Validators.integer(), Validators.greaterThan(0)]
Regex-based email validator that uses the regex from the HTML5 spec.
For a required numeric/integer input, you must also pass the required() validator
Defaults for parts of ItiReactCoreContextData. Does not include defaults
for properties where there is no reasonable default value.
Takes in multiple ValidatorOutput's and returns the first invalid one, or
undefined if all are valid.
Formats the "city state zip" part of an address.
A configurable function for formatting a moment.
any moment object
onlyShowDateIfNotToday: when true, does not display the day if mo is todayconvertToLocal: if mo should be converted to local timedateTimeFormat: format used if date & time are displayedtimeFormat: format used if only time is displayedFormats a dollar amount. Supports negative values.
Formats a number as a percent. An input value of 1 means 100%.
Supports negative values.
'display' if this percentage will be displayed, 'userInput' if
percent will be used as the default value for a text input.
Format a phone number for display. Uses normalizePhoneNumber.
Normalizes and converts a postal code to a string. Handles 5 & 9 digit US postal codes and Canadian postal codes.
Applies multiple validators to a value and returns the combined result. Thin wrapper
around combineValidatorOutput.
Returns a page of items, given the page number (which starts at 1) and the page size.
Returns a boolean indicating if a form's submit button should be enabled.
Returns true if formIsValid === true or showValidation === false.
This has the effect of disabling the submit button while async validation is in progress if validation is being shown.
Returns the total numbers of pages based on the number of items and the page size.
true if the postal code is Canadian e.g. A1A 1A1
Used to run different code if running in a Jest test.
Takes in a phone number in any format and converts it to an 11-digit string that starts with the US/Canada country code of 1.
Returns a postal code with the space or hyphen removed.
Converts T | null | undefined to T | undefined.
Use this whenever doing server-side paging to account for items being deleted while the user has the list open. Without this function, the user could see an empty page because the number of items, and thus the total number of pages, has decreased.
Part of usePaginationHelpers. Usually not used directly.
Compares the filters between the current query params and the new query params and resets to the first page if any of the filters have changed.
Part of usePaginationHelpers. Usually not used directly.
determines which properties of the query params object are
considered filters. By default, everything other than page and pageSize is
considered a filter.
Converts hours & minutes to a decimal number of hours.
toDecimalHours(5, 30) // -> 5.5
should be an integer
Converts a decimal number of hours to integer hours & minutes.
toHoursAndMinutes(5.5) // -> { hours: 5, minutes: 30 }
Converts T | null | undefined to T | null.
Returns a capture function which "captures" CancellablePromise's and cancels
them when the component unmounts. This prevents "set state after unmount"
warnings.
const capture = useCancellablePromiseCleanup()
// Later, in an async function:
const result = await capture(api.get('xyz'))
Allows an input to work as either a controlled or uncontrolled component depending on which props are provided.
Keep tracks of a FieldValidity and returns a function to update the
the FieldValidty.
You don't need to use this if there is only one validated input. In that case,
a simple const [valid, setValid] = useState(false) is sufficient.
Top-level usage (e.g. when using EasyFormDialog):
const { onChildValidChange, allFieldsValid } = useFieldValidity()
Usage with onValidChange from props:
const { onChildValidChange } = useFieldValidity({ onValidChange })
Like useFieldValidity, but lets you pass in whatever
fieldValidityIsValid function you want.
Usually you'll want to use useFieldValidity.
Stores and returns the previous value of something. Useful in niche situations.
Internally, it uses useRef.
const previousLocation = usePrevious(location)
the parameters of the query
the type returned by the query
the type returned by the query
the type returned by the query
the parameters of the query
the type returned by the query
an object containing doQuery and doQueryAsync functions. doQueryAsync
must be called within a try-catch.
A hook that allows implementing validation in any input component.
Internally, useValidation calls useMemo on validators and asyncValidator
since those props won't have stable identities if defined during the render
as is typical. If useValidation did not do this, every component that rendered
a validated component would have to call useMemo on validators and
asyncValidator (or move the definitions outside of the component) to prevent
infinite useEffect loops.
If and when your validators or asyncValidator do change, you must pass a
different validationKey for useValidation to pick up the changes.
the type of the input's value
To be used with Jest fake timers. Lets timers and React component async updates run.
import { act as reactAct } from '@testing-library/react'
import { act as hooksAct } from '@testing-library/react-hooks'
import { waitForReactUpdatesFactory } from '@interface-technologies/iti-react/src/TestHelpers'
export const waitForReactUpdates = waitForReactUpdatesFactory(reactAct)
export const waitForHookUpdates = waitForReactUpdatesFactory(hooksAct)
Generated using TypeDoc
The "contract" that all async validators must implement.