Ghost/ghost/admin/app/components/modal-base.js
Peter Zimon c51bce7358 🎨 Updated admin area design and usability (#1232)
refs. https://github.com/TryGhost/Team/issues/205

Major update to Ghost Admin UI including:
- improved general consistency (typography, colors and contrast, UI components, icons)
- new design for post and pages lists, improved discoverability of filters 
- search moved to modal
- account menu is decoupled from ghost logo
- further usability fixes
2019-06-18 11:47:20 +01:00

58 lines
1.2 KiB
JavaScript

/* global key */
import Component from '@ember/component';
import {run} from '@ember/runloop';
export default Component.extend({
tagName: 'section',
classNames: 'modal-content',
_previousKeymasterScope: null,
// Allowed Actions
closeModal: () => {},
didInsertElement() {
this._super(...arguments);
this._setupShortcuts();
},
willDestroyElement() {
this._super(...arguments);
this._removeShortcuts();
},
actions: {
confirm() {
throw new Error('You must override the "confirm" action in your modal component');
},
closeModal() {
this.closeModal();
}
},
_setupShortcuts() {
run(function () {
document.activeElement.blur();
});
this._previousKeymasterScope = key.getScope();
key('enter', 'modal', () => {
this.send('confirm');
});
key('escape', 'modal', () => {
this.send('closeModal');
});
key.setScope('modal');
},
_removeShortcuts() {
key.unbind('enter', 'modal');
key.unbind('escape', 'modal');
key.setScope(this._previousKeymasterScope);
}
});