This component of the Design System is deprecated, which means it'll be replaced or removed soon. Until that, the Design System team will support existing implementations, but please avoid implementing this component in new projects.
Table of Contents
Properties
Name
Description
Type
Required
Default value
labelDefines the component header
string
-
-
condition-typesDefines an array contains all conditions. Every condition is described by a key, a label and a template key.
[{ key: 'condition key', label: 'condition label name', templateKey: 'template key' }]
-
valueDefines the values of a condition
{ relation: 'and|or', conditions: [{ conditionTypeKey: 'condition key', values: [{ name: 'name', value: value }] }] }
-
-
conditionValueLabelFormatterDefines a formatter that will be used to display values of a condition. It takes { conditionTypeKey, values } as argument and should return the formatted string or an array of formatted strings
function
-
-
Events
Event
Description
Returns
changeFires on condition create, edit and delete.
{
detail: {
type: 'create'/'edit'/'delete'
id: conditionId
conditionTypeKey: 'condition key'
template: conditionTemplate
}
}
templateOpenFires if a template has been opened to edit or create a condition.
{
detail: {
values: [conditionValues]
template: conditionTemplate
}
}
templateCloseFires if a template has been closed after edit.
Method
Name
Description
updateConditionValues(id, values)It updates the condition values. Condition values are the array of { name: 'name', value: value } objects.
Properties
Name
Description
Type
Required
Default value
key
This is the unique identifier of a template. One template can be used by more than one condition.
In Vue.js key is a reserved attribute. Use :key.prop="'somekey'" to set this attribute.
string
true