diff --git a/src/lib/js/components/autocomplete.mjs b/src/lib/js/components/autocomplete.mjs index 6a613894..4ef1be0d 100644 --- a/src/lib/js/components/autocomplete.mjs +++ b/src/lib/js/components/autocomplete.mjs @@ -8,9 +8,6 @@ import { toTitleCase } from '../common/utils/string.mjs' const BASE_NAME = 'f-autocomplete' const HIGHLIGHT_CLASS_NAME = 'highlight-component' -let lastCache = Date.now() -let optionsCache - /** * Counts the number of occurences of a string in an array of strings * @param {Array} arr labels @@ -93,6 +90,8 @@ export const componentOptions = selectedId => { * Output an autocomplete form element */ export default class Autocomplete { + lastCache = Date.now() + optionsCache = null /** * Create an Autocomplete instance * @param {String} key - The key for the autocomplete instance @@ -201,6 +200,8 @@ export default class Autocomplete { this.hiddenField.value = value this.value = value + + this.setValue({ dataset: { label: value, value } }) }, } @@ -244,13 +245,13 @@ export default class Autocomplete { } updateOptions() { - let options = optionsCache + let options = this.optionsCache const now = Date.now() - if (!options || now - lastCache > ANIMATION_SPEED_SLOW * 10) { + if (!options || now - this.lastCache > ANIMATION_SPEED_SLOW * 10) { dom.empty(this.list) options = this.generateOptions() - lastCache = now + this.lastCache = now } if (!this.list.children.length) { @@ -268,7 +269,7 @@ export default class Autocomplete { return target } - optionsCache = options.map(optionData => { + this.optionsCache = options.map(optionData => { const { value, textLabel, htmlLabel } = optionData const optionConfig = { tag: 'li', @@ -295,7 +296,7 @@ export default class Autocomplete { return dom.create(optionConfig) }) - return optionsCache + return this.optionsCache } setListPosition() { diff --git a/src/lib/js/components/fields/edit-panel-item.mjs b/src/lib/js/components/fields/edit-panel-item.mjs index 11a28541..99410a7c 100644 --- a/src/lib/js/components/fields/edit-panel-item.mjs +++ b/src/lib/js/components/fields/edit-panel-item.mjs @@ -328,10 +328,10 @@ export default class EditPanelItem { } const conditionChangeAction = ({ target }) => { - const row = target.closest('.f-condition-row') + const conditionRow = target.closest('.f-condition-row') const regex = new RegExp(`${target.className}(?:\\S?)+`, 'gm') - row.className = row.className.replace(regex, '') - row.classList.add([target.className, target.value].filter(Boolean).join('-')) + conditionRow.className = conditionRow.className.replace(regex, '') + const evtData = { dataPath, value: target.value, @@ -341,7 +341,6 @@ export default class EditPanelItem { events.formeoUpdated(evtData) Components.setAddress(dataPath, target.value) - const conditionRow = target.closest('.f-condition-row') const rowIndex = indexOfNode(conditionRow) this.processConditionUIState(this.itemFieldGroups[rowIndex]) }