mirror of
https://github.com/status-im/consul.git
synced 2025-01-09 05:23:04 +00:00
4c9efd54e0
1. Ensure dropdown menus function correctly in Safari 2. Ensure default grey color for buttons is not used 3. Ensure IntersectionObservers are cleaned up properly in Safari
68 lines
2.0 KiB
JavaScript
68 lines
2.0 KiB
JavaScript
import Component from '@ember/component';
|
|
import { inject as service } from '@ember/service';
|
|
|
|
export default Component.extend({
|
|
dom: service('dom'),
|
|
tagName: '',
|
|
checked: false,
|
|
onchange: function() {},
|
|
// TODO: reserved for the moment but we don't need it yet
|
|
onblur: function() {},
|
|
init: function() {
|
|
this._super(...arguments);
|
|
this.guid = this.dom.guid(this);
|
|
this._listeners = this.dom.listeners();
|
|
},
|
|
willDestroyElement: function() {
|
|
this._super(...arguments);
|
|
this._listeners.remove();
|
|
},
|
|
didReceiveAttrs: function() {
|
|
this._super(...arguments);
|
|
if (this.checked) {
|
|
this.addClickOutsideListener();
|
|
} else {
|
|
this._listeners.remove();
|
|
}
|
|
},
|
|
addClickOutsideListener: function() {
|
|
// default onblur event
|
|
this._listeners.remove();
|
|
this._listeners.add(this.dom.document(), 'click', e => {
|
|
if (this.dom.isOutside(this.label, e.target)) {
|
|
if (this.dom.isOutside(this.label.nextElementSibling, e.target)) {
|
|
if (this.input.checked) {
|
|
this.input.checked = false;
|
|
// TODO: This should be an event
|
|
this.onchange({ target: this.input });
|
|
}
|
|
this._listeners.remove();
|
|
}
|
|
}
|
|
});
|
|
},
|
|
actions: {
|
|
click: function(e) {
|
|
// only preventDefault if the target isn't an external link
|
|
// TODO: this should be changed for an explicit close
|
|
if ((e.target.rel || '').indexOf('noopener') === -1) {
|
|
e.preventDefault();
|
|
}
|
|
this.input.checked = !this.input.checked;
|
|
// manually dispatched mouse events have a detail = 0
|
|
// real mouse events have the number of click counts
|
|
if (e.detail !== 0) {
|
|
e.target.blur();
|
|
}
|
|
this.actions.change.apply(this, [e]);
|
|
},
|
|
change: function(e) {
|
|
if (this.input.checked) {
|
|
this.addClickOutsideListener();
|
|
}
|
|
// TODO: This should be an event
|
|
this.onchange({ target: this.input });
|
|
},
|
|
},
|
|
});
|