luxolus
/
open-consul
2
0
Fork 0
Code Issues 1 Pull Requests Packages Releases Wiki Activity

ui: Install ref modifier and use it instead of dom selecting (#7383)

This commit is contained in:
John Cowen 2020-03-04 18:11:23 +00:00 committed by John Cowen
parent b2f84299ca
commit 80a362554a
6 changed files with 11 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
ui-v2/app/components/phrase-editor.js
View File

@ -6,11 +6,6 @@ export default Component.extend({
dom: service('dom'),
classNames: ['phrase-editor'],
item: '',
didInsertElement: function() {
this._super(...arguments);
// TODO: use {{ref}}
this.input = this.dom.element('input', this.element);
},
onchange: function(e) {},
search: function(e) {
// TODO: Temporarily continue supporting `searchable`

7
ui-v2/app/components/toggle-button.js
View File

@ -1,6 +1,5 @@
import Component from '@ember/component';
import { inject as service } from '@ember/service';
import { set } from '@ember/object';
export default Component.extend({
dom: service('dom'),
@ -19,12 +18,6 @@ export default Component.extend({
this.guid = this.dom.guid(this);
this._listeners = this.dom.listeners();
},
didInsertElement: function() {
this._super(...arguments);
// TODO(octane): move to ref
set(this, 'input', this.dom.element(`#toggle-button-${this.guid}`));
set(this, 'label', this.input.nextElementSibling);
},
willDestroyElement: function() {
this._super(...arguments);
this._listeners.remove();

2
ui-v2/app/templates/components/phrase-editor.hbs
View File

@ -7,5 +7,5 @@
</ul>
<label class="type-search">
<span>Search</span>
<input onchange={{action 'add'}} onsearch={{action 'add'}} oninput={{action 'input'}} onkeydown={{action 'keydown'}} placeholder={{if (eq value.length 0) placeholder}} value={{item}} type="search" name="s" autofocus="autofocus" />
<input {{ref this "input"}} onchange={{action 'add'}} onsearch={{action 'add'}} oninput={{action 'input'}} onkeydown={{action 'keydown'}} placeholder={{if (eq value.length 0) placeholder}} value={{item}} type="search" name="s" autofocus="autofocus" />
</label>

4
ui-v2/app/templates/components/toggle-button.hbs
View File

@ -1,4 +1,4 @@
<input type="checkbox" checked={{if checked 'checked' undefined}} id={{concat 'toggle-button-' guid}} onchange={{action 'change'}} />
<label for={{concat 'toggle-button-' guid}}>
<input {{ref this "input"}} type="checkbox" checked={{if checked 'checked' undefined}} id={{concat 'toggle-button-' guid}} onchange={{action 'change'}} />
<label {{ref this "label"}} for={{concat 'toggle-button-' guid}}>
{{yield (action 'click')}}
</label>

1
ui-v2/package.json
View File

@ -100,6 +100,7 @@
"ember-power-select": "^3.0.6",
"ember-power-select-with-create": "^0.7.0",
"ember-qunit": "^4.6.0",
"ember-ref-modifier": "^1.0.0",
"ember-resolver": "^7.0.0",
"ember-sinon-qunit": "4.0.1",
"ember-source": "~3.16.0",

7
ui-v2/yarn.lock
View File

@ -5780,6 +5780,13 @@ ember-qunit@^4.6.0:
ember-cli-test-loader "^2.2.0"
qunit "^2.9.3"
ember-ref-modifier@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/ember-ref-modifier/-/ember-ref-modifier-1.0.0.tgz#3e98d8c26eda7cf4da4b2d82d6a0c80c5058efed"
integrity sha512-JPCwlKerzZCbc5GO01xcgRJv5JcK1O61FF5PE6UxMNRwgDxT33mjTPO2JFhn4HGoG0NvpnkpLLxw+qf1KuX8kw==
dependencies:
ember-cli-babel "^7.13.2"
ember-require-module@^0.3.0:
version "0.3.0"
resolved "https://registry.yarnpkg.com/ember-require-module/-/ember-require-module-0.3.0.tgz#65aff7908b5b846467e4526594d33cfe0c23456b"