Default Inputs
A checkbox input. The default input component for boolean fields.
- Implements:
FormInputComponent
id
DefaultFormComponentIdreadonly
booleanformControl
UntypedFormControlconfig
DefaultFormComponentConfig<'boolean-form-input'>A JSON editor input with syntax highlighting and error detection. Works well
with text type fields.
-
Extends: BaseCodeEditorFormInputComponent
-
Implements:
FormInputComponent, AfterViewInit, OnInit
id
DefaultFormComponentIdconstructor
(changeDetector: ChangeDetectorRef) => HtmlEditorFormInputComponentngOnInit
() => A JSON editor input with syntax highlighting and error detection. Works well
with text type fields.
-
Extends: BaseCodeEditorFormInputComponent
-
Implements:
FormInputComponent, AfterViewInit, OnInit
id
DefaultFormComponentIdconstructor
(changeDetector: ChangeDetectorRef) => JsonEditorFormInputComponentngOnInit
() => A special input used to display the "Combination mode" AND/OR toggle.
- Implements:
FormInputComponent, OnInit
id
DefaultFormComponentIdreadonly
booleanformControl
UntypedFormControlconfig
DefaultFormComponentConfig<'combination-mode-form-input'>selectable$
Observable<boolean>constructor
(configurableInputComponent: ConfigurableInputComponent) => CombinationModeFormInputComponentngOnInit
() => setCombinationModeAnd
() => setCombinationModeOr
() => An input for monetary values. Should be used with int type fields.
- Implements:
FormInputComponent
id
DefaultFormComponentIdreadonly
booleanformControl
UntypedFormControlcurrencyCode$
Observable<CurrencyCode>config
DefaultFormComponentConfig<'currency-form-input'>constructor
(dataService: DataService) => CurrencyFormInputComponentAllows the selection of a Customer via an autocomplete select input.
Should be used with ID type fields which represent Customer IDs.
- Implements:
FormInputComponent, OnInit
id
DefaultFormComponentIdreadonly
booleanformControl
FormControl<string | { id: string }>customerGroups$
Observable<GetCustomerGroupsQuery['customerGroups']['items']>config
DefaultFormComponentConfig<'customer-group-form-input'>constructor
(dataService: DataService) => CustomerGroupFormInputComponentngOnInit
() => selectGroup
(group: ItemOf<GetCustomerGroupsQuery, 'customerGroups'>) => compareWith
(o1: T, o2: T) => Allows selection of a datetime. Default input for datetime type fields.
- Implements:
FormInputComponent
id
DefaultFormComponentIdreadonly
booleanformControl
UntypedFormControlconfig
DefaultFormComponentConfig<'date-form-input'>min
max
yearRange
Allows the selection of multiple FacetValues via an autocomplete select input.
Should be used with ID type list fields which represent FacetValue IDs.
- Implements:
FormInputComponent
id
DefaultFormComponentIdisListInput
readonly
booleanformControl
UntypedFormControlconfig
InputComponentConfigvalueTransformFn
Displays a number input. Default input for int and float type fields.
- Implements:
FormInputComponent
id
DefaultFormComponentIdreadonly
booleanformControl
UntypedFormControlconfig
DefaultFormComponentConfig<'number-form-input'>prefix
suffix
min
max
step
Displays a password text input. Should be used with string type fields.
- Implements:
FormInputComponent
id
DefaultFormComponentIdreadonly
booleanformControl
UntypedFormControlconfig
InputComponentConfigAllows the selection of multiple ProductVariants via an autocomplete select input.
Should be used with ID type list fields which represent ProductVariant IDs.
- Implements:
FormInputComponent, OnInit
id
DefaultFormComponentIdisListInput
readonly
booleanformControl
FormControl<Array<string | { id: string }>>config
DefaultFormComponentUiConfig<'product-selector-form-input'>selection$
Observable<Array<GetProductVariantQuery['productVariant']>>constructor
(dataService: DataService) => ProductSelectorFormInputComponentngOnInit
() => addProductVariant
(product: ProductSelectorSearchQuery['search']['items'][number]) => removeProductVariant
(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.
- Implements:
FormInputComponent
id
DefaultFormComponentIdreadonly
booleanformControl
UntypedFormControlconfig
RelationCustomFieldConfigUses the RichTextEditorComponent as in input for text type fields.
- Implements:
FormInputComponent
id
DefaultFormComponentIdreadonly
booleanformControl
UntypedFormControlconfig
DefaultFormComponentConfig<'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.
- Implements:
FormInputComponent, OnInit
id
DefaultFormComponentIdreadonly
booleanformControl
UntypedFormControlconfig
DefaultFormComponentConfig<'select-form-input'> & CustomFieldConfigFragmentuiLanguage$
Observable<LanguageCode>options
constructor
(dataService: DataService) => SelectFormInputComponentngOnInit
() => trackByFn
(index: number, item: any) => A checkbox input. The default input component for boolean fields.
- Implements:
FormInputComponent, OnInit, OnDestroy
id
DefaultFormComponentIdreadonly
booleanformControl
UntypedFormControlconfig
DefaultFormComponentConfig<'struct-form-input'>uiLanguage$
Observable<LanguageCode>structFormGroup
fields
Array<{ def: StructCustomFieldFragment['fields'][number]; formControl: FormControl; }>constructor
(dataService: DataService) => StructFormInputComponentngOnInit
() => ngOnDestroy
() => Uses a regular text form input. This is the default input for string and localeString type fields.
- Implements:
FormInputComponent
id
DefaultFormComponentIdreadonly
booleanformControl
UntypedFormControlconfig
DefaultFormComponentConfig<'text-form-input'>prefix
suffix
Uses textarea form input. This is the default input for text type fields.
- Implements:
FormInputComponent
id
DefaultFormComponentIdreadonly
booleanformControl
UntypedFormControlconfig
DefaultFormComponentConfig<'textarea-form-input'>spellcheck
boolean