@limetech/lime-elements
Version:
49 lines (48 loc) • 1.65 kB
JavaScript
/**
* Container to keep track of all snackbar elements that gets added to the page.
* When an element gets added or removed, the container will emit a
* `changeOffset` event on all elements in the container, letting them know
* the new offset to where they should position themselves.
*/
export class SnackbarContainer {
constructor() {
this.snackbarElements = [];
}
/**
* Add a new element to the container
*
* @param snackbar - element to add
*/
add(snackbar) {
const popover = this.getPopover(snackbar);
// @ts-expect-error Stencil does not seem to recognise the existance of showPopover
popover === null || popover === void 0 ? void 0 : popover.showPopover();
this.snackbarElements = [snackbar, ...this.snackbarElements];
this.emitOffsets();
}
/**
* Remove an element from the container
*
* @param snackbar - element to remove
*/
remove(snackbar) {
const popover = this.getPopover(snackbar);
// @ts-expect-error Stencil does not seem to recognise the existance of hidePopover
popover === null || popover === void 0 ? void 0 : popover.hidePopover();
this.snackbarElements = this.snackbarElements.filter((item) => item !== snackbar);
this.emitOffsets();
}
emitOffsets() {
let offset = 0;
for (const snackbar of this.snackbarElements) {
snackbar.dispatchEvent(new CustomEvent('changeOffset', {
detail: offset,
}));
offset += this.getPopover(snackbar).getBoundingClientRect().height;
}
}
getPopover(snackbar) {
return snackbar.shadowRoot.querySelector('[popover]');
}
}
//# sourceMappingURL=container.js.map