Loaders

Set loader on the schema and it renders on the submit button while an async onSubmit is pending. The button also disables itself and sets aria-busy for the duration.

<FormSwitch
  schema={{ fields: [/* ... */], loader: 'dots' }}
  onSubmit={async (p) => { await api.post(p) }}
/>

Built-ins

Five CSS-only loaders, all inheriting currentColor and a 1em size so they match the button text:

spinner · ring · pulse · dots · bars

Use one anywhere

The <Loader> component renders any registered loader by name (it falls back to spinner):

import { Loader } from 'reactformswitch'

<Loader name="dots" />

Register your own

registerLoader(name, Component) adds a loader you can then reference by name from the schema or <Loader>:

import { registerLoader } from 'reactformswitch'

registerLoader('throbber', () => <span className="my-throbber" role="status" />)

See Extending for the other registries — fields and serializers.