38 lines
1 KiB
JavaScript
38 lines
1 KiB
JavaScript
import { UpdatingElement } from '@lion/core';
|
|
import { overlays, LocalOverlayController } from '@lion/overlays';
|
|
|
|
export class LionPopup extends UpdatingElement {
|
|
static get properties() {
|
|
return {
|
|
position: {
|
|
type: String,
|
|
},
|
|
};
|
|
}
|
|
|
|
connectedCallback() {
|
|
super.connectedCallback();
|
|
this.contenNode = this.querySelector('[slot="content"]');
|
|
this.invokerNode = this.querySelector('[slot="invoker"]');
|
|
|
|
this._popup = overlays.add(
|
|
new LocalOverlayController({
|
|
hidesOnEsc: true,
|
|
hidesOnOutsideClick: true,
|
|
placement: this.position,
|
|
contentNode: this.contenNode,
|
|
invokerNode: this.invokerNode,
|
|
}),
|
|
);
|
|
this._show = () => this._popup.show();
|
|
this._hide = () => this._popup.hide();
|
|
this._toggle = () => this._popup.toggle();
|
|
|
|
this.invokerNode.addEventListener('click', this._toggle);
|
|
}
|
|
|
|
disconnectedCallback() {
|
|
super.disconnectedCallback();
|
|
this.invokerNode.removeEventListener('click', this._toggle);
|
|
}
|
|
}
|