# \

Initialize this component in your React app at the location where you want a Feathery form to appear. It renders your form as an HTML `` element.

Prop	Type	Description
`formId`	`string`	ID of your Feathery form to display. It can be found on your dashboard, under the form's settings page.
Event Handlers	`optional functions`	Pass in callback functions to run custom code when different events occur in your form (submit, load, error, etc.)
contextRef	React Ref	Pass in a ref that receives the form context, which contains helper functions allowing you to modify the form state directly.
`initialValues`	`optional object`	Initial form field values of the shape `{<fieldId>: <fieldValue>}`. If not passed in, Feathery will generate default initial values as necessary.
`initialStepId`	`optional string`	If specified, this will be the first step your user sees.
`initialLoader`	`optional object`	Options for the loader as the form initializes. By default no loader will be shown while loading the form, unless the user is waiting on authentication. Full reference
`popupOptions`	`optional PopupOptions`	If popup options are set, your Feathery form will show up as a popup on top of your page rather than inline with the rest of the content.
`language`	`optional string`	This is a comma-separated list of ISO 639-1 language code(s) to show the form in if a translation file in one of those languages has been uploaded for the form in its settings. The languages will be prioritized according to their order in the specified string. If no translation for any of the specified languages is found, the form language will by default show up as written in the visual editor.
`readOnly`	`optional boolean`	Disables form validation and submissions and prevents user from editing field values.
`hashNavigation`	`optional boolean`	Overrides the "Track Step with URL Hash" setting on the form. When set, allows the browser to 'remember' step transitions so users can use the browser back and forward buttons.
`hideTestUI`	`optional boolean`	If showing the test or draft form, hide the test nav bar. If not specified, the test nav bar will be shown.
`formProps`	`optional object`	Override specific props of the underlying HTML`<form>` element by passing in an object mapping your desired prop keys to values.
`elementProps`	`optional object`	Override specific form element props by passing in a map from element ID to an object of custom props to be applied to that element. E.g., you can hide a field by passing in `{<fieldID> : {style: {visibility: 'hidden'}}}`.
`customComponents`	`{<containerId>: <JSX element>}`	Custom components you'd like to position per-step, in the flow of elements. Full reference
`children`	`optional JSX elements`	Custom, absolute-positioned components that you want to render across all steps. Full reference
`className`	`optional string`	Your custom CSS class(es) to associate with your form element.
`style`	`optional object`	Your custom inline CSS styling to associate with your form element.