diff --git a/src/trait_manager/model/Trait.ts b/src/trait_manager/model/Trait.ts index 5b89337a4..aad54a1c2 100644 --- a/src/trait_manager/model/Trait.ts +++ b/src/trait_manager/model/Trait.ts @@ -4,7 +4,7 @@ import { LocaleOptions, Model, SetOptions } from '../../common'; import Component from '../../dom_components/model/Component'; import EditorModel from '../../editor/model/Editor'; import { isDef } from '../../utils/mixins'; -import TraitsEvents, { TraitOption, TraitProperties, TraitSetValueOptions } from '../types'; +import TraitsEvents, { TraitGetValueOptions, TraitOption, TraitProperties, TraitSetValueOptions } from '../types'; import TraitView from '../view/TraitView'; import Traits from './Traits'; @@ -122,10 +122,12 @@ export default class Trait extends Model { /** * Get the trait value. * The value is taken from component attributes by default or from properties if the trait has the `changeProp` enabled. + * @param {Object} [opts={}] Options. + * @param {Boolean} [opts.useType=false] Get the value based on type (eg. the checkbox will always return a boolean). * @returns {any} */ - getValue() { - return this.getTargetValue(); + getValue(opts?: TraitGetValueOptions) { + return this.getTargetValue(opts); } /** @@ -251,7 +253,7 @@ export default class Trait extends Model { targetUpdated() { const { component, em } = this; - const value = this.getTargetValue(); + const value = this.getTargetValue({ useType: true }); this.set({ value }, { fromTarget: 1 }); const props = { trait: this, component, value }; component.trigger(TraitsEvents.value, props); @@ -260,7 +262,7 @@ export default class Trait extends Model { em?.trigger('trait:update', props); } - getTargetValue() { + getTargetValue(opts: TraitGetValueOptions = {}) { const { component, em } = this; const name = this.getName(); const getValue = this.get('getValue'); @@ -278,6 +280,19 @@ export default class Trait extends Model { value = component.getAttributes()[name]; } + if (opts.useType) { + const type = this.getType(); + if (type === 'checkbox') { + const { valueTrue, valueFalse } = this.attributes; + + if (!isUndefined(valueTrue) && valueTrue === value) { + value = true; + } else if (!isUndefined(valueFalse) && valueFalse === value) { + value = false; + } + } + } + return !isUndefined(value) ? value : ''; } diff --git a/src/trait_manager/types.ts b/src/trait_manager/types.ts index 7261f2c1f..1dd33d2dd 100644 --- a/src/trait_manager/types.ts +++ b/src/trait_manager/types.ts @@ -153,6 +153,16 @@ export interface TraitSetValueOptions { [key: string]: unknown; } +export interface TraitGetValueOptions { + /** + * Get the value based on type. + * With this option enabled, the returned value is normalized based on the + * trait type (eg. the checkbox will always return a boolean). + * @default false + */ + useType?: boolean; +} + export type TraitOption = { id: string; label?: string;