@preference-sl/pref-viewer 2.11.0-beta.11 → 2.11.0-beta.13

package/src/pref-viewer-2d.js

@@ -1,5 +1,6 @@
 import SVGResolver from "./svg-resolver.js";
 import PanzoomController from "./panzoom-controller.js";
+import { PrefViewer2DStyles } from "./styles.js";
 
 /**
  * PrefViewer2D - Custom element for rendering and interacting with 2D SVG content.
@@ -46,7 +47,7 @@ import PanzoomController from "./panzoom-controller.js";
  * Notes on extensibility
  *  - Modeled for easy addition of other input sources or interaction modes (e.g., selection callbacks).
  */
-export class PrefViewer2D extends HTMLElement {
+export default class PrefViewer2D extends HTMLElement {
     // State flags
     #isInitialized = false;
     #isLoaded = false;
@@ -143,9 +144,9 @@ export class PrefViewer2D extends HTMLElement {
     #createDOMElements() {
         this.#wrapper = document.createElement("div");
         this.append(this.#wrapper);
+        
         const style = document.createElement("style");
-        const cssUrl = new URL("./css/pref-viewer-2d.css", import.meta.url);
-        style.textContent = `@import "${cssUrl}";`;
+        style.textContent = PrefViewer2DStyles;
         this.append(style);
     }
 

package/src/pref-viewer-3d.js

@@ -1,5 +1,6 @@
 import { CameraData, ContainerData, MaterialData } from "./pref-viewer-3d-data.js";
 import BabylonJSController from "./babylonjs-controller.js";
+import { PrefViewer3DStyles } from "./styles.js";
 
 /**
  * PrefViewer3D - Custom Web Component for interactive 3D visualization and configuration.
@@ -56,7 +57,7 @@ import BabylonJSController from "./babylonjs-controller.js";
  *  - Designed for extensibility and integration in product configurators and visualization tools.
  *  - All resource management and rendering operations are performed asynchronously for performance.
  */
-export class PrefViewer3D extends HTMLElement {
+export default class PrefViewer3D extends HTMLElement {
     // State flags
     #isInitialized = false;
     #isLoaded = false;
@@ -157,11 +158,12 @@ export class PrefViewer3D extends HTMLElement {
     #createDOMElements() {
         this.#wrapper = document.createElement("div");
         this.append(this.#wrapper);
+
         this.#canvas = document.createElement("canvas");
         this.#wrapper.appendChild(this.#canvas);
+        
         const style = document.createElement("style");
-        const cssUrl = new URL("./css/pref-viewer-3d.css", import.meta.url);
-        style.textContent = `@import "${cssUrl}";`;
+        style.textContent = PrefViewer3DStyles;
         this.append(style);
     }
 
@@ -461,6 +463,7 @@ export class PrefViewer3D extends HTMLElement {
     show() {
         this.#isVisible = true;
         this.setAttribute("visible", "true");
+        this.#canvas.focus();
     }
 
     /**

package/src/pref-viewer-dialog.js

@@ -1,3 +1,5 @@
+import { PrefViewerDialogStyles } from "./styles.js";
+
 /**
  * PrefViewerDialog - Custom Web Component for displaying modal dialogs in PrefViewer.
  *
@@ -20,7 +22,7 @@
  *  - close(): Hides and removes the dialog, refocuses the canvas if available.
  *  - #createDOMElements(): Creates the dialog structure and applies styles.
  */
-export class PrefViewerDialog extends HTMLElement {
+export default class PrefViewerDialog extends HTMLElement {
     #wrapper = null;
     #header = null;
     #content = null;
@@ -68,8 +70,7 @@ export class PrefViewerDialog extends HTMLElement {
         this.append(this.#wrapper);
 
         const style = document.createElement("style");
-        const cssUrl = new URL("./css/pref-viewer-dialog.css", import.meta.url);
-        style.textContent = `@import "${cssUrl}";`;
+        style.textContent = PrefViewerDialogStyles;
         this.append(style);
 
         this.addEventListener("click", this.#closeOnBackdropClick.bind(this));
@@ -132,7 +133,6 @@ export class PrefViewerDialog extends HTMLElement {
                     component2D.focus();
                 }
             }
-
         }
         this.#wrapper = this.#header = this.#content = this.#footer = null;
         this.remove();

package/src/pref-viewer-task.js

@@ -18,7 +18,7 @@
  *  - Validates the type (case-insensitive) and throws a TypeError if invalid.
  *  - Freezes the instance to prevent further modification.
  */
-export class PrefViewerTask {
+export default class PrefViewerTask {
     static Types = Object.freeze({
         Config: "config",
         Drawing: "drawing",