78 lines
1.7 KiB
TypeScript
78 lines
1.7 KiB
TypeScript
import * as plugins from '../plugins.js';
|
|
|
|
import {
|
|
customElement,
|
|
DeesElement,
|
|
property,
|
|
html,
|
|
cssManager,
|
|
unsafeCSS,
|
|
css,
|
|
type TemplateResult,
|
|
} from '@design.estate/dees-element';
|
|
|
|
@customElement('idp-viewcontainer')
|
|
export class IdpViewcontainer extends DeesElement {
|
|
constructor() {
|
|
super();
|
|
}
|
|
|
|
public static styles = [
|
|
cssManager.defaultStyles,
|
|
css`
|
|
:host {
|
|
display: block;
|
|
color: #fff;
|
|
font-family: 'Geist Sans';
|
|
}
|
|
:host([hidden]) {
|
|
display: none;
|
|
}
|
|
.viewContainer {
|
|
min-width: 100vh;
|
|
min-height: 100vh;
|
|
}
|
|
|
|
`,
|
|
];
|
|
|
|
public render(): TemplateResult {
|
|
return html`
|
|
<style></style>
|
|
<div class="viewContainer">
|
|
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
public currentElement: plugins.deesElement.DeesElement;
|
|
public async loadElement(viewElement: typeof plugins.deesElement.DeesElement) {
|
|
// Wait until the viewContainer itself is rendered
|
|
await this.updateComplete;
|
|
|
|
// Select the viewContainer
|
|
const viewContainer = this.shadowRoot.querySelector('.viewContainer');
|
|
|
|
// Check if viewContainer is present
|
|
if (!viewContainer) {
|
|
throw new Error('View container not found in the rendered DOM.');
|
|
}
|
|
|
|
// Remove the current element if it exists
|
|
if (this.currentElement) {
|
|
viewContainer.removeChild(this.currentElement);
|
|
}
|
|
|
|
// Create a new instance of the viewElement
|
|
const newElement = new viewElement();
|
|
(newElement as any).viewContainer = this;
|
|
viewContainer.appendChild(newElement);
|
|
|
|
// Wait until the new element is fully rendered
|
|
await newElement.updateComplete;
|
|
|
|
// Set the new element as the current element
|
|
this.currentElement = newElement;
|
|
}
|
|
}
|