register-form-input-component.md 1.9 KB
title: "RegisterFormInputComponent" weight: 10 date: 2023-06-07T09:42:26.001Z showtoc: true
generated: true
registerFormInputComponent
# registerFormInputComponent
{{< generation-info sourceFile="packages/admin-ui/src/lib/core/src/shared/dynamic-form-inputs/register-dynamic-input-components.ts" sourceLine="96" packageName="@vendure/admin-ui">}}
Registers a custom FormInputComponent which can be used to control the argument inputs
of a ConfigurableOperationDef (e.g. CollectionFilter, ShippingMethod etc) or for
a custom field.
*Example*
```TypeScript
@NgModule({
imports: [SharedModule],
declarations: [MyCustomFieldControl],
providers: [
registerFormInputComponent('my-custom-input', MyCustomFieldControl),
],
})
export class MyUiExtensionModule {}
```
This input component can then be used in a custom field:
*Example*
```TypeScript
const config = {
// ...
customFields: {
ProductVariant: [
{
name: 'rrp',
type: 'int',
ui: { component: 'my-custom-input' },
},
]
}
}
```
or with an argument of a ConfigurableOperationDef:
*Example*
```TypeScript
args: {
rrp: { type: 'int', ui: { component: 'my-custom-input' } },
}
```
## Signature
```TypeScript
function registerFormInputComponent(id: string, component: Type): FactoryProvider
```
## Parameters
### id
{{< member-info kind="parameter" type="string" >}}
### component
{{< member-info kind="parameter" type="Type<FormInputComponent>" >}}