@session-services/web-elements 0.1.19 → 0.1.21

package/dist/collection/components/session-services-formatted-text/session-services-formatted-text.js

@@ -1,7 +1,7 @@
-import { 
-// biome-ignore lint/correctness/noUnusedImports: h is required by Stencil JSX transform
-h, Host, } from "@stencil/core";
 import { getDisplayUrl, isSoundCloudUrl, parseFormattedText, } from "@session-services/utils/formatting";
+import { Host, 
+// biome-ignore lint/correctness/noUnusedImports: h is required by Stencil JSX transform
+h, } from "@stencil/core";
 export class SessionServicesFormattedText {
     text = "";
     theme = "system";
@@ -19,28 +19,27 @@ export class SessionServicesFormattedText {
         this.setupTheme();
     }
     disconnectedCallback() {
-        if (this.mediaQueryList) {
-            this.mediaQueryList.removeEventListener("change", this.handleSystemThemeChange);
-        }
+        this.removeThemeListener();
     }
     setupTheme() {
-        if (this.mediaQueryList) {
-            this.mediaQueryList.removeEventListener("change", this.handleSystemThemeChange);
-        }
-        if (this.theme === "system") {
-            // Guard for testing environments (JSDOM) where matchMedia may not exist
-            if (typeof globalThis.matchMedia === "function") {
-                this.mediaQueryList = globalThis.matchMedia("(prefers-color-scheme: dark)");
-                this.currentTheme = this.mediaQueryList.matches ? "dark" : "light";
-                this.mediaQueryList.addEventListener("change", this.handleSystemThemeChange);
-            }
-            else {
-                this.currentTheme = "light";
-            }
-        }
-        else {
+        this.removeThemeListener();
+        if (this.theme !== "system") {
             this.currentTheme = this.theme;
+            return;
+        }
+        this.setupSystemTheme();
+    }
+    removeThemeListener() {
+        this.mediaQueryList?.removeEventListener("change", this.handleSystemThemeChange);
+    }
+    setupSystemTheme() {
+        if (typeof globalThis.matchMedia !== "function") {
+            this.currentTheme = "light";
+            return;
         }
+        this.mediaQueryList = globalThis.matchMedia("(prefers-color-scheme: dark)");
+        this.currentTheme = this.mediaQueryList.matches ? "dark" : "light";
+        this.mediaQueryList.addEventListener("change", this.handleSystemThemeChange);
     }
     handleSystemThemeChange = (e) => {
         if (this.theme === "system") {
@@ -72,21 +71,21 @@ export class SessionServicesFormattedText {
         return (h("div", { key: key, class: "soundcloud-embed" }, h("iframe", { width: "100%", height: "166", scrolling: "no", allow: "autoplay", sandbox: "allow-scripts allow-same-origin allow-popups", src: embedUrl, title: iframeTitle, loading: "lazy" })));
     }
     renderSegment(segment, index) {
-        switch (segment.type) {
-            case "text":
-                return h("span", { key: index }, segment.content);
-            case "link":
-                return this.renderLink(segment, index);
-            case "divider":
-                return h("hr", { key: index, class: "formatted-divider" });
-            case "soundcloud":
-                return this.renderSoundCloudEmbed(segment.href || "", index, segment.content);
-            default:
-                return null;
-        }
+        if (segment.type === "text")
+            return h("span", { key: index }, segment.content);
+        if (segment.type === "link")
+            return this.renderLink(segment, index);
+        if (segment.type === "divider")
+            return h("hr", { key: index, class: "formatted-divider" });
+        return this.renderMediaSegment(segment, index);
+    }
+    renderMediaSegment(segment, index) {
+        if (segment.type !== "soundcloud")
+            return null;
+        return this.renderSoundCloudEmbed(segment.href || "", index, segment.content);
     }
     render() {
-        return (h(Host, { key: '1a7f36efb8cdbd1efdaa97c36b60593a13c99c4e', "data-theme": this.currentTheme }, h("div", { key: 'fce1176ff0ef2ea5c3f1b282ab9a52554491f9bf', class: "formatted-text" }, this.segments.map((segment, index) => this.renderSegment(segment, index)))));
+        return (h(Host, { key: '3b477ff5db918a1b3b6872f48d330305d320ae3b', "data-theme": this.currentTheme }, h("div", { key: 'efe7fc93f9f1c2b38271a30e4a8fdf7306793d6e', class: "formatted-text" }, this.segments.map((segment, index) => this.renderSegment(segment, index)))));
     }
     static get is() { return "session-services-formatted-text"; }
     static get encapsulation() { return "shadow"; }