diff --git a/src/selector_manager/index.js b/src/selector_manager/index.js index de425b451..d9ec66ddd 100644 --- a/src/selector_manager/index.js +++ b/src/selector_manager/index.js @@ -39,7 +39,9 @@ * * [add](#add) * * [addClass](#addclass) * * [get](#get) - * * [getAll](#getAll) + * * [getAll](#getall) + * * [setState](#setstate) + * * [getState](#getstate) * * @module SelectorManager */ @@ -90,6 +92,7 @@ export default config => { }; const em = c.em; const ppfx = c.pStylePrefix; + this.em = em; if (ppfx) { c.stylePrefix = ppfx + c.stylePrefix; @@ -126,6 +129,26 @@ export default config => { } }, + /** + * Change the selector state + * @param {String} value State value + * @returns {this} + * @example + * selectorManager.setState('hover'); + */ + setState(value) { + this.em.set('state', value); + return this; + }, + + /** + * Get the current selector state + * @returns {String} + */ + getState() { + return this.em.get('state'); + }, + addSelector(name, opt = {}) { let opts = { ...opt }; diff --git a/src/selector_manager/view/ClassTagsView.js b/src/selector_manager/view/ClassTagsView.js index 94baca98a..1e367f01c 100644 --- a/src/selector_manager/view/ClassTagsView.js +++ b/src/selector_manager/view/ClassTagsView.js @@ -195,6 +195,12 @@ export default Backbone.View.extend({ else if (e.keyCode === 27) this.endNewTag(); }, + checkStates() { + const state = this.em.get('state'); + const statesEl = this.getStates(); + statesEl && statesEl.val(state); + }, + /** * Triggered when component is changed * @param {Object} e @@ -203,12 +209,10 @@ export default Backbone.View.extend({ componentChanged: debounce(function() { const { em } = this; const target = this.getTarget(); - const state = em.get('state'); let validSelectors = []; if (target) { - const statesEl = this.getStates(); - statesEl && statesEl.val(state); + this.checkStates(); validSelectors = this.getCommonSelectors(); this.checkSync({ validSelectors }); } @@ -286,6 +290,7 @@ export default Backbone.View.extend({ : this.__getName(selected); const elSel = this.el.querySelector('[data-selected]'); elSel && (elSel.innerHTML = result); + this.checkStates(); }, __getName(target) {