3dviewer-sdk 1.1.4 → 1.1.6

package/dist/index.d.mts

@@ -23,6 +23,7 @@ declare enum ViewerMessageType {
     WALK_THROUGH = "viewer-walk-through",
     ZOOM_WINDOW = "viewer-zoom-window",
     ZOOM_FIT = "viewer-zoom-fit",
+    DISPLAY_SET_BACKGROUND = "viewer-display-set-background",
     TOOLBAR_CONFIG = "viewer-toolbar-config",
     TOOLBAR_USE = "viewer-toolbar-use",
     PANEL_OPEN = "viewer-panel-open",
@@ -59,6 +60,19 @@ type NodeSelectionChangePayload = {
     nodeIds: string[];
     timestamp: number;
 };
+type ViewerRgbColor = {
+    r: number;
+    g: number;
+    b: number;
+};
+type ViewerRgbaColor = ViewerRgbColor & {
+    a: number;
+};
+type ViewerBackgroundColorInput = ViewerRgbColor | ViewerRgbaColor | string;
+type ViewerBackgroundPayload = {
+    top: ViewerRgbColor;
+    bottom?: ViewerRgbColor;
+};
 type CameraZoomPayload = {
     requestId?: string;
     percent: number;
@@ -289,6 +303,22 @@ declare class CameraModule {
     private postCameraGetZoom;
 }
 
+type BackgroundOptionsInput = {
+    top: ViewerBackgroundColorInput;
+    bottom?: ViewerBackgroundColorInput;
+};
+type InitialBackground = ViewerBackgroundColorInput | BackgroundOptionsInput;
+
+type SetBackgroundOptions = BackgroundOptionsInput;
+declare class DisplayModule {
+    private viewer;
+    constructor(viewer: Viewer3D);
+    setBackgroundColor(color: ViewerBackgroundColorInput): void;
+    setBackgroundGradient(top: ViewerBackgroundColorInput, bottom: ViewerBackgroundColorInput): void;
+    setBackground(options: SetBackgroundOptions): void;
+    private postBackground;
+}
+
 declare class InteractionModule {
     private viewer;
     on: {
@@ -647,6 +677,7 @@ type Viewer3DOptions = {
     uploadPath?: string;
     file?: File;
     initialToolbar?: InitialToolbarUse;
+    initialBackground?: InitialBackground;
     ui?: {
         loadingIndicator?: boolean;
     };
@@ -666,6 +697,7 @@ declare class Viewer3D {
     private loadingState;
     private emitter;
     camera: CameraModule;
+    display: DisplayModule;
     interaction: InteractionModule;
     node: NodeModule;
     files: FilesModule;
@@ -691,6 +723,7 @@ declare class Viewer3D {
     private ensureInit;
     private withInitialOptions;
     private normalizeInitialToolbar;
+    private normalizeInitialBackground;
     _on<K extends SdkEventKey>(event: K, cb: (payload: SdkEventPayload<K>) => void): () => void;
     _off<K extends SdkEventKey>(event: K, cb: (payload: SdkEventPayload<K>) => void): void;
     _emit<K extends SdkEventKey>(event: K, payload: SdkEventPayload<K>): void;
@@ -702,4 +735,4 @@ declare class Viewer3D {
     private handleMessage;
 }
 
-export { type CameraZoomPayload, type ConvertOptions, type ConvertV2Options, type FileInfoCheckInput, type FileInfoCheckPayloadItem, type FilesConfig, type InitialToolbarUse, type LanguageCode, type LoadStage, type LoadStatePayload, type MarkupAction, type MarkupListItem, type MarkupOperationResultPayload, type ObjectPropertiesGetOptions, type ObjectPropertiesResult, type PreparedViewerData, Viewer3D, type Viewer3DOptions, type ViewerLoadingChangePayload, type ViewerLoadingPhase, type ViewerReadyPayload };
+export { type CameraZoomPayload, type ConvertOptions, type ConvertV2Options, type CreatePipelineOptions, type FileInfoCheckInput, type FileInfoCheckPayloadItem, type FilesConfig, type InitialBackground, type InitialToolbarUse, type LanguageCode, type LoadStage, type LoadStatePayload, type MarkupAction, type MarkupListItem, type MarkupOperationResultPayload, type ObjectPropertiesGetOptions, type ObjectPropertiesResult, type PreparedViewerData, type SetBackgroundOptions, Viewer3D, type Viewer3DOptions, type ViewerBackgroundColorInput, type ViewerBackgroundPayload, type ViewerLoadingChangePayload, type ViewerLoadingPhase, type ViewerReadyPayload, type ViewerRgbColor, type ViewerRgbaColor };

package/dist/index.d.ts

@@ -23,6 +23,7 @@ declare enum ViewerMessageType {
     WALK_THROUGH = "viewer-walk-through",
     ZOOM_WINDOW = "viewer-zoom-window",
     ZOOM_FIT = "viewer-zoom-fit",
+    DISPLAY_SET_BACKGROUND = "viewer-display-set-background",
     TOOLBAR_CONFIG = "viewer-toolbar-config",
     TOOLBAR_USE = "viewer-toolbar-use",
     PANEL_OPEN = "viewer-panel-open",
@@ -59,6 +60,19 @@ type NodeSelectionChangePayload = {
     nodeIds: string[];
     timestamp: number;
 };
+type ViewerRgbColor = {
+    r: number;
+    g: number;
+    b: number;
+};
+type ViewerRgbaColor = ViewerRgbColor & {
+    a: number;
+};
+type ViewerBackgroundColorInput = ViewerRgbColor | ViewerRgbaColor | string;
+type ViewerBackgroundPayload = {
+    top: ViewerRgbColor;
+    bottom?: ViewerRgbColor;
+};
 type CameraZoomPayload = {
     requestId?: string;
     percent: number;
@@ -289,6 +303,22 @@ declare class CameraModule {
     private postCameraGetZoom;
 }
 
+type BackgroundOptionsInput = {
+    top: ViewerBackgroundColorInput;
+    bottom?: ViewerBackgroundColorInput;
+};
+type InitialBackground = ViewerBackgroundColorInput | BackgroundOptionsInput;
+
+type SetBackgroundOptions = BackgroundOptionsInput;
+declare class DisplayModule {
+    private viewer;
+    constructor(viewer: Viewer3D);
+    setBackgroundColor(color: ViewerBackgroundColorInput): void;
+    setBackgroundGradient(top: ViewerBackgroundColorInput, bottom: ViewerBackgroundColorInput): void;
+    setBackground(options: SetBackgroundOptions): void;
+    private postBackground;
+}
+
 declare class InteractionModule {
     private viewer;
     on: {
@@ -647,6 +677,7 @@ type Viewer3DOptions = {
     uploadPath?: string;
     file?: File;
     initialToolbar?: InitialToolbarUse;
+    initialBackground?: InitialBackground;
     ui?: {
         loadingIndicator?: boolean;
     };
@@ -666,6 +697,7 @@ declare class Viewer3D {
     private loadingState;
     private emitter;
     camera: CameraModule;
+    display: DisplayModule;
     interaction: InteractionModule;
     node: NodeModule;
     files: FilesModule;
@@ -691,6 +723,7 @@ declare class Viewer3D {
     private ensureInit;
     private withInitialOptions;
     private normalizeInitialToolbar;
+    private normalizeInitialBackground;
     _on<K extends SdkEventKey>(event: K, cb: (payload: SdkEventPayload<K>) => void): () => void;
     _off<K extends SdkEventKey>(event: K, cb: (payload: SdkEventPayload<K>) => void): void;
     _emit<K extends SdkEventKey>(event: K, payload: SdkEventPayload<K>): void;
@@ -702,4 +735,4 @@ declare class Viewer3D {
     private handleMessage;
 }
 
-export { type CameraZoomPayload, type ConvertOptions, type ConvertV2Options, type FileInfoCheckInput, type FileInfoCheckPayloadItem, type FilesConfig, type InitialToolbarUse, type LanguageCode, type LoadStage, type LoadStatePayload, type MarkupAction, type MarkupListItem, type MarkupOperationResultPayload, type ObjectPropertiesGetOptions, type ObjectPropertiesResult, type PreparedViewerData, Viewer3D, type Viewer3DOptions, type ViewerLoadingChangePayload, type ViewerLoadingPhase, type ViewerReadyPayload };
+export { type CameraZoomPayload, type ConvertOptions, type ConvertV2Options, type CreatePipelineOptions, type FileInfoCheckInput, type FileInfoCheckPayloadItem, type FilesConfig, type InitialBackground, type InitialToolbarUse, type LanguageCode, type LoadStage, type LoadStatePayload, type MarkupAction, type MarkupListItem, type MarkupOperationResultPayload, type ObjectPropertiesGetOptions, type ObjectPropertiesResult, type PreparedViewerData, type SetBackgroundOptions, Viewer3D, type Viewer3DOptions, type ViewerBackgroundColorInput, type ViewerBackgroundPayload, type ViewerLoadingChangePayload, type ViewerLoadingPhase, type ViewerReadyPayload, type ViewerRgbColor, type ViewerRgbaColor };

package/dist/index.js

@@ -99,6 +99,105 @@ var CameraModule = class {
   }
 };
 
+// src/modules/display.shared.ts
+function isBackgroundOptionsInput(value) {
+  return typeof value === "object" && value !== null && "top" in value;
+}
+function clampColorChannel(value) {
+  if (!Number.isFinite(value)) return 0;
+  return Math.min(255, Math.max(0, Math.round(value)));
+}
+function normalizeHexColor(color) {
+  const normalized = color.trim();
+  const match = normalized.match(/^#?([a-f\d]{3}|[a-f\d]{6})$/i);
+  if (!match) {
+    throw new Error(
+      `Invalid background color "${color}". Use #RGB, #RRGGBB, rgb(...), rgba(...), or { r, g, b }.`
+    );
+  }
+  const hex = match[1].length === 3 ? match[1].split("").map((char) => `${char}${char}`).join("") : match[1];
+  return {
+    r: Number.parseInt(hex.slice(0, 2), 16),
+    g: Number.parseInt(hex.slice(2, 4), 16),
+    b: Number.parseInt(hex.slice(4, 6), 16)
+  };
+}
+function normalizeFunctionalRgbColor(color) {
+  const normalized = color.trim();
+  const match = normalized.match(/^rgba?\(\s*([^)]+)\s*\)$/i);
+  if (!match) return null;
+  const values = match[1].split(",").map((value) => value.trim()).filter((value) => value !== "");
+  if (values.length !== 3 && values.length !== 4) {
+    throw new Error(
+      `Invalid background color "${color}". rgb()/rgba() requires 3 RGB channels and optional alpha.`
+    );
+  }
+  const [r, g, b] = values;
+  return {
+    r: clampColorChannel(Number(r)),
+    g: clampColorChannel(Number(g)),
+    b: clampColorChannel(Number(b))
+  };
+}
+function normalizeBackgroundColor(color) {
+  var _a;
+  if (typeof color === "string") {
+    return (_a = normalizeFunctionalRgbColor(color)) != null ? _a : normalizeHexColor(color);
+  }
+  return {
+    r: clampColorChannel(color.r),
+    g: clampColorChannel(color.g),
+    b: clampColorChannel(color.b)
+  };
+}
+function normalizeBackgroundOptions(options) {
+  return {
+    top: normalizeBackgroundColor(options.top),
+    bottom: options.bottom === void 0 ? void 0 : normalizeBackgroundColor(options.bottom)
+  };
+}
+function normalizeInitialBackground(background) {
+  if (isBackgroundOptionsInput(background)) {
+    return normalizeBackgroundOptions(background);
+  }
+  const solidColor = normalizeBackgroundColor(
+    background
+  );
+  return {
+    top: solidColor,
+    bottom: solidColor
+  };
+}
+
+// src/modules/display.module.ts
+var DisplayModule = class {
+  constructor(viewer) {
+    this.viewer = viewer;
+  }
+  setBackgroundColor(color) {
+    const normalizedColor = normalizeBackgroundColor(color);
+    this.postBackground({
+      top: normalizedColor,
+      bottom: normalizedColor
+    });
+  }
+  setBackgroundGradient(top, bottom) {
+    this.postBackground({
+      top: normalizeBackgroundColor(top),
+      bottom: normalizeBackgroundColor(bottom)
+    });
+  }
+  setBackground(options) {
+    this.postBackground(normalizeBackgroundOptions(options));
+  }
+  postBackground(payload) {
+    this.viewer.postToViewer(
+      "viewer-display-set-background" /* DISPLAY_SET_BACKGROUND */,
+      payload
+    );
+  }
+};
+
 // src/modules/interaction.module.ts
 var InteractionModule = class {
   constructor(viewer) {
@@ -1662,6 +1761,7 @@ var Viewer3D = class {
       }
     };
     this.camera = new CameraModule(this);
+    this.display = new DisplayModule(this);
     this.interaction = new InteractionModule(this);
     this.node = new NodeModule(this);
     this.files = new FilesModule(this);
@@ -1789,6 +1889,13 @@ var Viewer3D = class {
       if (((_a = this.options.ui) == null ? void 0 : _a.loadingIndicator) === false) {
         parsedUrl.searchParams.set("loadingIndicator", "false");
       }
+      const initialBackground = this.normalizeInitialBackground();
+      if (initialBackground) {
+        parsedUrl.searchParams.set(
+          "initialBackground",
+          JSON.stringify(initialBackground)
+        );
+      }
       return parsedUrl.toString();
     } catch {
       return url;
@@ -1821,6 +1928,11 @@ var Viewer3D = class {
       {}
     );
   }
+  normalizeInitialBackground() {
+    const initialBackground = this.options.initialBackground;
+    if (!initialBackground) return null;
+    return normalizeInitialBackground(initialBackground);
+  }
   // ===== typed internal events used by modules =====
   _on(event, cb) {
     return this.emitter.on(event, cb);

package/dist/index.mjs

@@ -73,6 +73,105 @@ var CameraModule = class {
   }
 };
 
+// src/modules/display.shared.ts
+function isBackgroundOptionsInput(value) {
+  return typeof value === "object" && value !== null && "top" in value;
+}
+function clampColorChannel(value) {
+  if (!Number.isFinite(value)) return 0;
+  return Math.min(255, Math.max(0, Math.round(value)));
+}
+function normalizeHexColor(color) {
+  const normalized = color.trim();
+  const match = normalized.match(/^#?([a-f\d]{3}|[a-f\d]{6})$/i);
+  if (!match) {
+    throw new Error(
+      `Invalid background color "${color}". Use #RGB, #RRGGBB, rgb(...), rgba(...), or { r, g, b }.`
+    );
+  }
+  const hex = match[1].length === 3 ? match[1].split("").map((char) => `${char}${char}`).join("") : match[1];
+  return {
+    r: Number.parseInt(hex.slice(0, 2), 16),
+    g: Number.parseInt(hex.slice(2, 4), 16),
+    b: Number.parseInt(hex.slice(4, 6), 16)
+  };
+}
+function normalizeFunctionalRgbColor(color) {
+  const normalized = color.trim();
+  const match = normalized.match(/^rgba?\(\s*([^)]+)\s*\)$/i);
+  if (!match) return null;
+  const values = match[1].split(",").map((value) => value.trim()).filter((value) => value !== "");
+  if (values.length !== 3 && values.length !== 4) {
+    throw new Error(
+      `Invalid background color "${color}". rgb()/rgba() requires 3 RGB channels and optional alpha.`
+    );
+  }
+  const [r, g, b] = values;
+  return {
+    r: clampColorChannel(Number(r)),
+    g: clampColorChannel(Number(g)),
+    b: clampColorChannel(Number(b))
+  };
+}
+function normalizeBackgroundColor(color) {
+  var _a;
+  if (typeof color === "string") {
+    return (_a = normalizeFunctionalRgbColor(color)) != null ? _a : normalizeHexColor(color);
+  }
+  return {
+    r: clampColorChannel(color.r),
+    g: clampColorChannel(color.g),
+    b: clampColorChannel(color.b)
+  };
+}
+function normalizeBackgroundOptions(options) {
+  return {
+    top: normalizeBackgroundColor(options.top),
+    bottom: options.bottom === void 0 ? void 0 : normalizeBackgroundColor(options.bottom)
+  };
+}
+function normalizeInitialBackground(background) {
+  if (isBackgroundOptionsInput(background)) {
+    return normalizeBackgroundOptions(background);
+  }
+  const solidColor = normalizeBackgroundColor(
+    background
+  );
+  return {
+    top: solidColor,
+    bottom: solidColor
+  };
+}
+
+// src/modules/display.module.ts
+var DisplayModule = class {
+  constructor(viewer) {
+    this.viewer = viewer;
+  }
+  setBackgroundColor(color) {
+    const normalizedColor = normalizeBackgroundColor(color);
+    this.postBackground({
+      top: normalizedColor,
+      bottom: normalizedColor
+    });
+  }
+  setBackgroundGradient(top, bottom) {
+    this.postBackground({
+      top: normalizeBackgroundColor(top),
+      bottom: normalizeBackgroundColor(bottom)
+    });
+  }
+  setBackground(options) {
+    this.postBackground(normalizeBackgroundOptions(options));
+  }
+  postBackground(payload) {
+    this.viewer.postToViewer(
+      "viewer-display-set-background" /* DISPLAY_SET_BACKGROUND */,
+      payload
+    );
+  }
+};
+
 // src/modules/interaction.module.ts
 var InteractionModule = class {
   constructor(viewer) {
@@ -1636,6 +1735,7 @@ var Viewer3D = class {
       }
     };
     this.camera = new CameraModule(this);
+    this.display = new DisplayModule(this);
     this.interaction = new InteractionModule(this);
     this.node = new NodeModule(this);
     this.files = new FilesModule(this);
@@ -1763,6 +1863,13 @@ var Viewer3D = class {
       if (((_a = this.options.ui) == null ? void 0 : _a.loadingIndicator) === false) {
         parsedUrl.searchParams.set("loadingIndicator", "false");
       }
+      const initialBackground = this.normalizeInitialBackground();
+      if (initialBackground) {
+        parsedUrl.searchParams.set(
+          "initialBackground",
+          JSON.stringify(initialBackground)
+        );
+      }
       return parsedUrl.toString();
     } catch {
       return url;
@@ -1795,6 +1902,11 @@ var Viewer3D = class {
       {}
     );
   }
+  normalizeInitialBackground() {
+    const initialBackground = this.options.initialBackground;
+    if (!initialBackground) return null;
+    return normalizeInitialBackground(initialBackground);
+  }
   // ===== typed internal events used by modules =====
   _on(event, cb) {
     return this.emitter.on(event, cb);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "3dviewer-sdk",
-  "version": "1.1.4",
+  "version": "1.1.6",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [