aboutsummaryrefslogtreecommitdiff
path: root/src/server-component.mjs
diff options
context:
space:
mode:
Diffstat (limited to 'src/server-component.mjs')
-rw-r--r--src/server-component.mjs23
1 files changed, 22 insertions, 1 deletions
diff --git a/src/server-component.mjs b/src/server-component.mjs
index 0700939..31cd364 100644
--- a/src/server-component.mjs
+++ b/src/server-component.mjs
@@ -18,10 +18,12 @@ export class LustreServerComponent extends HTMLElement {
#observer = null;
#root = null;
#socket = null;
+ #shadow = null;
constructor() {
super();
+ this.#shadow = this.attachShadow({ mode: "closed" });
this.#observer = new MutationObserver((mutations) => {
const changed = [];
@@ -48,7 +50,18 @@ export class LustreServerComponent extends HTMLElement {
connectedCallback() {
this.#root = document.createElement("div");
- this.appendChild(this.#root);
+ this.#shadow.appendChild(this.#root);
+
+ const sheet = new CSSStyleSheet();
+
+ for (const { cssRules } of document.styleSheets) {
+ for (const rule of cssRules) {
+ console.log(rule);
+ sheet.insertRule(rule.cssText);
+ }
+ }
+
+ this.#shadow.adoptedStyleSheets = [sheet];
}
attributeChangedCallback(name, prev, next) {
@@ -159,6 +172,14 @@ export class LustreServerComponent extends HTMLElement {
disconnectedCallback() {
this.#socket?.close();
}
+
+ get adoptedStyleSheets() {
+ return this.#shadow.adoptedStyleSheets;
+ }
+
+ set adoptedStyleSheets(value) {
+ this.#shadow.adoptedStyleSheets = value;
+ }
}
window.customElements.define("lustre-server-component", LustreServerComponent);