Skip to main content

Default Inputs

A checkbox input. The default input component for boolean fields.

Signature

id

readonly

propertyboolean

formControl

propertyUntypedFormControl

config

propertyDefaultFormComponentConfig<'boolean-form-input'>

A JSON editor input with syntax highlighting and error detection. Works well with text type fields.

Signature
  • Extends: BaseCodeEditorFormInputComponent

  • Implements: FormInputComponent, AfterViewInit, OnInit

id

constructor

method(changeDetector: ChangeDetectorRef) => HtmlEditorFormInputComponent

ngOnInit

method() =>

A JSON editor input with syntax highlighting and error detection. Works well with text type fields.

Signature
  • Extends: BaseCodeEditorFormInputComponent

  • Implements: FormInputComponent, AfterViewInit, OnInit

id

constructor

method(changeDetector: ChangeDetectorRef) => JsonEditorFormInputComponent

ngOnInit

method() =>

A special input used to display the "Combination mode" AND/OR toggle.

Signature

id

readonly

propertyboolean

formControl

propertyUntypedFormControl

config

propertyDefaultFormComponentConfig<'combination-mode-form-input'>

selectable$

propertyObservable<boolean>

constructor

method(configurableInputComponent: ConfigurableInputComponent) => CombinationModeFormInputComponent

ngOnInit

method() =>

setCombinationModeAnd

method() =>

setCombinationModeOr

method() =>

An input for monetary values. Should be used with int type fields.

Signature

id

readonly

propertyboolean

formControl

propertyUntypedFormControl

currencyCode$

propertyObservable<CurrencyCode>

config

propertyDefaultFormComponentConfig<'currency-form-input'>

constructor

method(dataService: DataService) => CurrencyFormInputComponent

Allows the selection of a Customer via an autocomplete select input. Should be used with ID type fields which represent Customer IDs.

Signature

id

readonly

propertyboolean

formControl

propertyFormControl<string | { id: string }>

customerGroups$

propertyObservable<GetCustomerGroupsQuery['customerGroups']['items']>

config

propertyDefaultFormComponentConfig<'customer-group-form-input'>

constructor

method(dataService: DataService) => CustomerGroupFormInputComponent

ngOnInit

method() =>

selectGroup

method(group: ItemOf<GetCustomerGroupsQuery, 'customerGroups'>) =>

compareWith

method(o1: T, o2: T) =>

Allows selection of a datetime. Default input for datetime type fields.

Signature

id

readonly

propertyboolean

formControl

propertyUntypedFormControl

config

propertyDefaultFormComponentConfig<'date-form-input'>

min

property

max

property

yearRange

property

Allows the selection of multiple FacetValues via an autocomplete select input. Should be used with ID type list fields which represent FacetValue IDs.

Signature

id

isListInput

property

readonly

propertyboolean

formControl

propertyUntypedFormControl

config

propertyInputComponentConfig

valueTransformFn

property

Displays a number input. Default input for int and float type fields.

Signature

id

readonly

propertyboolean

formControl

propertyUntypedFormControl

config

propertyDefaultFormComponentConfig<'number-form-input'>

prefix

property

suffix

property

min

property

max

property

step

property

Displays a password text input. Should be used with string type fields.

Signature

id

readonly

propertyboolean

formControl

propertyUntypedFormControl

config

propertyInputComponentConfig

Allows the selection of multiple ProductVariants via an autocomplete select input. Should be used with ID type list fields which represent ProductVariant IDs.

Signature

id

isListInput

property

readonly

propertyboolean

formControl

propertyFormControl<Array<string | { id: string }>>

config

propertyDefaultFormComponentUiConfig<'product-selector-form-input'>

selection$

propertyObservable<Array<GetProductVariantQuery['productVariant']>>

constructor

method(dataService: DataService) => ProductSelectorFormInputComponent

ngOnInit

method() =>

addProductVariant

method(product: ProductSelectorSearchQuery['search']['items'][number]) =>

removeProductVariant

method(id: string) =>

The default input component for relation type custom fields. Allows the selection of a ProductVariant, Product, Customer or Asset. For other entity types, a custom implementation will need to be defined. See registerFormInputComponent.

Signature

id

readonly

propertyboolean

formControl

propertyUntypedFormControl

config

propertyRelationCustomFieldConfig

Uses the RichTextEditorComponent as in input for text type fields.

Signature

id

readonly

propertyboolean

formControl

propertyUntypedFormControl

config

propertyDefaultFormComponentConfig<'rich-text-form-input'>

Uses a select input to allow the selection of a string value. Should be used with string type fields with options.

Signature

id

readonly

propertyboolean

formControl

propertyUntypedFormControl

config

propertyDefaultFormComponentConfig<'select-form-input'> &#38; CustomFieldConfigFragment

uiLanguage$

propertyObservable<LanguageCode>

options

property

constructor

method(dataService: DataService) => SelectFormInputComponent

ngOnInit

method() =>

trackByFn

method(index: number, item: any) =>

A checkbox input. The default input component for boolean fields.

Signature

id

readonly

propertyboolean

formControl

propertyUntypedFormControl

config

propertyDefaultFormComponentConfig<'struct-form-input'>

uiLanguage$

propertyObservable<LanguageCode>

structFormGroup

property

fields

propertyArray<{ def: StructCustomFieldFragment['fields'][number]; formControl: FormControl; }>

constructor

method(dataService: DataService) => StructFormInputComponent

ngOnInit

method() =>

ngOnDestroy

method() =>

Uses a regular text form input. This is the default input for string and localeString type fields.

Signature

id

readonly

propertyboolean

formControl

propertyUntypedFormControl

config

propertyDefaultFormComponentConfig<'text-form-input'>

prefix

property

suffix

property

Uses textarea form input. This is the default input for text type fields.

Signature

id

readonly

propertyboolean

formControl

propertyUntypedFormControl

config

propertyDefaultFormComponentConfig<'textarea-form-input'>

spellcheck

propertyboolean
Was this chapter helpful?
Report Issue
Edited Feb 23, 2026·Edit this page