RegisterFormInputComponent - Vendure

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

import { registerFormInputComponent } from '@vendure/admin-ui/core';

export default [
    registerFormInputComponent('my-custom-input', MyCustomFieldControl), // [!code highlight]
];

This input component can then be used in a custom field:

Example

import { VendureConfig } from '@vendure/core';

const config: VendureConfig = {
  // ...
  customFields: {
    ProductVariant: [
      {
        name: 'rrp',
        type: 'int',
        ui: { component: 'my-custom-input' }, // [!code highlight]
      },
    ]
  }
}

or with an argument of a ConfigurableOperationDef:

Example

args: {
  rrp: { type: 'int', ui: { component: 'my-custom-input' } },
}

function registerFormInputComponent(id: string, component: Type<FormInputComponent>): void

Parameters

id

component

<MemberInfo kind="parameter" type={Type<<a href='/reference/admin-ui-api/custom-input-components/form-input-component#forminputcomponent'>FormInputComponent</a>>} />