Ghost/ghost/admin/app/components/gh-search-input-trigger.js
renovate[bot] 654d373655 Update dependency ember-power-select to v4 (#1528)
* Update dependency ember-power-select to v4
* Fixed trigger component override collision when building

- move the "override" into our own namespace
- update all `<PowerSelect>` usage to explicitly reference our customised trigger component

* Bumped ember-power-datepicker

- bumps `ember-basic-dropdown` sub-dependency
- resolves "Error: Could not find module `ember-compatibility-helpers` imported from `@glimmer/component/index`"
- https://github.com/cibernox/ember-basic-dropdown/issues/551

* Updated trigger to use class syntax

- it's not possible to use `.extend()` on an imported class

* Updated <GhBasicDropdown>

- match updated ember-basic-dropdown code

* Added `autofocus` modifier

- added `ember-modifier` dependency so that we can create our own render modifiers

* Updated <GhSearchInputTrigger> to a glimmer component

* Updated gh-token-input components

* Fixed tests

- wrap `<PowerSelect>` with `<div>` to maintain test selectors
- fixed `<GhBasicDropdown>` not rendering anything due to not having a local template

Co-authored-by: Renovate Bot <bot@renovateapp.com>
Co-authored-by: Kevin Ansfield <kevin@lookingsideways.co.uk>
2020-05-17 22:35:53 +01:00

60 lines
1.5 KiB
JavaScript

/* global key */
import Component from '@glimmer/component';
import {action} from '@ember/object';
import {isBlank} from '@ember/utils';
export default class GhSearchInputTrigger extends Component {
@action
registerInput(elem) {
this.inputElem = elem;
}
@action
captureMousedown(e) {
e.stopPropagation();
}
@action
search(event) {
let term = event.target.value;
// open dropdown if not open and term is present
// close dropdown if open and term is blank
if (isBlank(term) === this.args.select.isOpen) {
isBlank(term) ? this.close() : this.open();
// ensure focus isn't lost when dropdown is closed
if (isBlank(term) && this.inputElem) {
this.inputElem.focus();
}
}
this.args.select.actions.search(term);
}
// hacky workaround to let Escape clear the input if there's text,
// but still allow it to close the search modal if there's no text
@action
handleKeydown(e) {
if ((e.key === 'Escape' && e.target.value) || e.key === 'Enter') {
this._previousKeyScope = key.getScope();
key.setScope('ignore');
}
}
@action
handleKeyup() {
if (key.getScope() === 'ignore') {
key.setScope(this._previousKeyScope);
}
}
open() {
this.args.select.actions.open();
}
close() {
this.args.select.actions.close();
}
}