@fluid-topics/ft-wc-utils 1.1.50 → 1.1.51

package/build/FtLitElement.d.ts

@@ -4,16 +4,17 @@ declare const constructorPrototype: unique symbol;
 declare const constructorName: unique symbol;
 declare const exportpartsDebouncer: unique symbol;
 export declare class FtLitElement extends ScopedRegistryLitElement {
+    exportpartsPrefix?: string;
+    exportpartsPrefixes?: string[];
+    customStylesheet?: string;
+    private adoptedCustomStyleSheet;
     private readonly [constructorPrototype];
     private readonly [constructorName];
     constructor();
     adoptedCallback(): void;
-    exportpartsPrefix?: string;
-    exportpartsPrefixes?: string[];
-    customStylesheet?: string;
+    connectedCallback(): void;
     protected updated(props: PropertyValues): void;
     protected contentAvailableCallback(props: PropertyValues): void;
-    private insertCustomStylesheet;
     private [exportpartsDebouncer];
     private scheduleExportpartsUpdate;
     private setExportpartsAttribute;

package/build/FtLitElement.js

@@ -15,6 +15,7 @@ const exportpartsDebouncer = Symbol("exportpartsDebouncer");
 export class FtLitElement extends ScopedRegistryLitElement {
     constructor() {
         super();
+        this.adoptedCustomStyleSheet = new CSSStyleSheet();
         this[_a] = new Debouncer(5);
         this[constructorName] = this.constructor.name;
         this[constructorPrototype] = this.constructor.prototype;
@@ -24,26 +25,25 @@ export class FtLitElement extends ScopedRegistryLitElement {
             Object.setPrototypeOf(this, this[constructorPrototype]);
         }
     }
+    connectedCallback() {
+        super.connectedCallback();
+        if (this.shadowRoot && !this.shadowRoot.adoptedStyleSheets.includes(this.adoptedCustomStyleSheet)) {
+            this.shadowRoot.adoptedStyleSheets = [...this.shadowRoot.adoptedStyleSheets, this.adoptedCustomStyleSheet];
+        }
+    }
     updated(props) {
+        var _b;
         super.updated(props);
+        if (props.has("customStylesheet")) {
+            this.adoptedCustomStyleSheet.replace((_b = this.customStylesheet) !== null && _b !== void 0 ? _b : "");
+        }
         this.updateComplete.then(() => {
             this.contentAvailableCallback(props);
-            this.insertCustomStylesheet();
             this.scheduleExportpartsUpdate();
         });
     }
     contentAvailableCallback(props) {
     }
-    insertCustomStylesheet() {
-        var _b, _c;
-        ((_c = (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelectorAll(".ft-lit-element--custom-stylesheet")) !== null && _c !== void 0 ? _c : []).forEach(e => e.remove());
-        if (this.customStylesheet) {
-            const customStyles = document.createElement("style");
-            customStyles.classList.add("ft-lit-element--custom-stylesheet");
-            customStyles.innerHTML = this.customStylesheet;
-            this.shadowRoot.append(customStyles);
-        }
-    }
     scheduleExportpartsUpdate() {
         var _b, _c, _d;
         if (((_b = this.exportpartsPrefix) === null || _b === void 0 ? void 0 : _b.trim()) || ((_d = (_c = this.exportpartsPrefixes) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0 > 0)) {

package/build/index.d.ts

@@ -1,4 +1,5 @@
 import "./silent-define";
+import "construct-style-sheets-polyfill";
 declare global {
     interface Window {
         safari?: {

package/build/index.js

@@ -1,5 +1,6 @@
 var _a, _b, _c, _d;
 import "./silent-define";
+import "construct-style-sheets-polyfill";
 import * as lit from "lit";
 import * as litDecorators from "lit/decorators.js";
 import * as litRepeat from "lit/directives/repeat.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluid-topics/ft-wc-utils",
-  "version": "1.1.50",
+  "version": "1.1.51",
   "description": "Internal web components tools",
   "author": "Fluid Topics <devtopics@antidot.net>",
   "license": "ISC",
@@ -20,8 +20,9 @@
     "@types/mark.js": "8.11.12",
     "@webcomponents/scoped-custom-element-registry": "0.0.9",
     "composed-offset-position": "^0.0.4",
+    "construct-style-sheets-polyfill": "3.1.0",
     "lit": "3.1.0",
     "mark.js": "8.11.1"
   },
-  "gitHead": "d7ba5acbdff08358500d0c3eec6c95bd9d406cb2"
+  "gitHead": "1dcb93d48e681051070e118dfc7c56aa8b8aa3fa"
 }