vim-web 0.6.0-dev.9 → 1.0.0-alpha.1

package/dist/style.css

@@ -810,6 +810,9 @@ video:where(.vim-component,.vim-component *) {
 .vc-ml-1 {
   margin-left: 0.25rem;
 }
+.vc-ml-2 {
+  margin-left: 0.5rem;
+}
 .vc-ml-5 {
   margin-left: 1.25rem;
 }

package/dist/vim-web.d.ts

@@ -89,21 +89,15 @@ type RecursivePartial<T> = {
  @module viw-webgl-viewer
 */
 
+/**
+ * How selected elements are filled (beyond the outline).
+ * - 'none': Outline only, no fill.
+ * - 'default': Tint selected meshes in the main render pass (zero cost).
+ * - 'xray': Tint + render selected on top of everything (1 extra pass).
+ * - 'seethrough': Tint + render a semi-transparent ghost where behind geometry (1 extra pass).
+ */
+type SelectionFillMode = 'none' | 'default' | 'xray' | 'seethrough';
 type MaterialSettings = {
-    /**
-     * Use fast simple materials instead of standard Lambert materials
-     * - Enables: Significantly faster rendering (no Lambert lighting calculations)
-     * - Trade-off: Simpler pseudo-lighting using screen-space derivatives
-     * - Useful for: Performance-critical scenarios, large models, lower-end hardware
-     * Default: false
-     */
-    useFastMaterials: boolean;
-    /**
-    * Default color of standard material
-    */
-    standard: {
-        color: THREE.Color;
-    };
     /**
     * Ghost material options
     */
@@ -120,45 +114,58 @@ type MaterialSettings = {
         opacity: number;
     };
     /**
-    * Section box intersection highlight options
+    * Selection outline options
     */
-    section: {
+    outline: {
+        /**
+        * Selection outline opacity (0 = invisible, 1 = fully opaque).
+        * Default: 1
+        */
+        opacity: number;
         /**
-        * Intersection highlight stroke width.
-        * Default: 0.01
+        * Selection outline color.
+        * Default: rgb(0, 255, 255)
         */
-        strokeWidth: number;
+        color: THREE.Color;
         /**
-        * Intersection highlight stroke falloff.
+        * Scale factor for outline render target resolution (0-1).
+        * Lower = faster, higher = sharper outlines.
         * Default: 0.75
         */
-        strokeFalloff: number;
+        scale: number;
         /**
-        * Intersection highlight stroke color.
-        * Default: rgb(246, 246, 246)
+        * Outline thickness in pixels (of the outline render target).
+        * Higher values sample more pixels per fragment (4 fetches per level).
+        * Range: 1-5. Default: 2
         */
-        strokeColor: THREE.Color;
+        thickness: number;
     };
     /**
-    * Selection outline options
+    * Selection fill options (beyond outlines).
     */
-    outline: {
+    selection: {
         /**
-        * Selection outline intensity (brightness multiplier).
-        * Default: 2
+        * How selected elements are filled.
+        * Default: 'none'
         */
-        intensity: number;
+        fillMode: SelectionFillMode;
         /**
-        * Selection outline color.
-        * Default: rgb(0, 255, 255)
+        * Tint color applied to selected elements.
+        * Default: rgb(0, 100, 255) — blue
         */
         color: THREE.Color;
         /**
-        * Scale factor for outline render target resolution (0-1).
-        * Lower = faster, higher = sharper outlines.
-        * Default: 0.75
+        * Tint blend strength (0 = no tint, 1 = solid color).
+        * Default: 0.3
         */
-        scale: number;
+        opacity: number;
+        /**
+        * Opacity of the overlay pass in 'xray' and 'seethrough' modes.
+        * In xray: applies to all selected geometry rendered on top.
+        * In seethrough: applies to selected geometry rendered behind other objects.
+        * Default: 0.25
+        */
+        overlayOpacity: number;
     };
 };
 /**
@@ -169,7 +176,6 @@ type MaterialSettings = {
  * @example
  * const viewer = Core.Webgl.createViewer({
  *   camera: { orthographic: true, fov: 50 },
- *   materials: { useFastMaterials: true }
  * })
  */
 type ViewerSettings = {
@@ -310,27 +316,6 @@ type ViewerSettings = {
          */
         color: THREE.Color;
     };
-    /**
-     * Skybox options
-     */
-    skybox: {
-        /**
-         * Enables/Disables skybox.
-         */
-        enable: boolean;
-        /**
-         * Color for the lower part of the skybox.
-         */
-        groundColor: THREE.Color;
-        /**
-         * Color for the upper part of the skybox.
-         */
-        skyColor: THREE.Color;
-        /**
-         * Controls the gradient transition between the sky and the ground.
-         */
-        sharpness: number;
-    };
     /**
     * Material options
     */
@@ -339,39 +324,6 @@ type ViewerSettings = {
      * Axes gizmo options
      */
     axes: Partial<AxesSettings>;
-    /**
-     * Skylight (hemisphere light) options
-     */
-    skylight: {
-        /**
-        * Skylight sky Color.
-        * Default: THREE.Color(153, 204, 255)
-        */
-        skyColor: THREE.Color;
-        /**
-        * Skylight ground color.
-        * Default: THREE.Color(242, 213, 181)
-        */
-        groundColor: THREE.Color;
-        /**
-        * Skylight intensity.
-        * Default: 0.8
-        */
-        intensity: number;
-    };
-    /**
-     * Sunlight (directional light) options
-     * Two Blue-Green lights at odd angles. See defaultViewerSettings.
-     */
-    sunlights: {
-        followCamera: boolean;
-        /** Light position. */
-        position: THREE.Vector3;
-        /** Light color. */
-        color: THREE.Color;
-        /** Light intensity. */
-        intensity: number;
-    }[];
     rendering: {
         /**
          * When true, only renders when changes are detected. When false, renders every frame.
@@ -446,24 +398,26 @@ interface IMaterials {
     readonly modelTransparentMaterial: THREE.Material;
     /** The ghost material used to render hidden/ghosted elements. */
     readonly ghostMaterial: THREE.Material;
-    /** Base color tint applied to opaque and transparent model materials. */
-    modelColor: THREE.Color;
     /** Opacity of the ghost material (0 = invisible, 1 = fully opaque). */
     ghostOpacity: number;
     /** Color of the ghost material. */
     ghostColor: THREE.Color;
-    /** Intensity of the selection outline post-process effect. */
-    outlineIntensity: number;
+    /** Opacity of the selection outline (0 = invisible, 1 = fully opaque). */
+    outlineOpacity: number;
+    /** Thickness of the selection outline in pixels (of the outline render target). Range: 1-5. */
+    outlineThickness: number;
     /** Color of the selection outline post-process effect. */
     outlineColor: THREE.Color;
-    /** Width of the stroke rendered where the section box intersects the model. */
-    sectionStrokeWidth: number;
-    /** Gradient falloff of the section box intersection stroke. */
-    sectionStrokeFalloff: number;
-    /** Color of the section box intersection stroke. */
-    sectionStrokeColor: THREE.Color;
     /** Clipping planes applied to all materials. Set to undefined to disable clipping. */
     clippingPlanes: THREE.Plane[] | undefined;
+    /** Selection fill mode: 'none' | 'default' | 'xray' | 'seethrough'. */
+    selectionFillMode: SelectionFillMode;
+    /** Color used to tint selected elements. */
+    selectionColor: THREE.Color;
+    /** Blend strength for selection tint (0 = off, 1 = solid). */
+    selectionOpacity: number;
+    /** Opacity of the overlay pass in 'xray' and 'seethrough' modes. */
+    selectionOverlayOpacity: number;
     /** Applies a full set of material settings from the viewer configuration. */
     applySettings(settings: MaterialSettings): void;
 }
@@ -1020,19 +974,22 @@ interface IWebglCamera {
      * The default forward direction in Z-up space (X = right, Y = forward, Z = up).
      */
     defaultForward: THREE.Vector3;
+    /**
+     * When true, lockMovement and lockRotation are bypassed.
+     * Set temporarily to position the camera while ignoring user-configured constraints.
+     */
+    ignoreConstraints: boolean;
     /**
      * Interface for instantaneously moving the camera.
-     * @param {boolean} [force=false] - Set to true to ignore locked axis and rotation.
      * @returns {ICameraMovement} The camera movement api.
      */
-    snap(force?: boolean): ICameraMovement;
+    snap(): ICameraMovement;
     /**
      * Interface for smoothly moving the camera over time.
      * @param {number} [duration=1] - The duration of the camera movement animation.
-     * @param {boolean} [force=false] - Set to true to ignore locked axis and rotation.
      * @returns {ICameraMovement} The camera movement api.
      */
-    lerp(duration: number, force?: boolean): ICameraMovement;
+    lerp(duration: number): ICameraMovement;
     /**
      * Calculates the frustum size at a given point in the scene.
      * @param {THREE.Vector3} point - The point in the scene to calculate the frustum size at.
@@ -1623,6 +1580,10 @@ interface IWebglRenderer {
     getBoundingBox(target?: THREE.Box3): THREE.Box3 | undefined;
     /** When true (default), only renders when dirty (`requestRender()` was called). When false, renders every frame. */
     autoRender: boolean;
+    /** Whether selection outlines are enabled. */
+    outlineEnabled: boolean;
+    /** Selection fill mode for the rendering pipeline. */
+    selectionFillMode: SelectionFillMode;
 }
 
 /**
@@ -1651,7 +1612,6 @@ interface IWebglRenderer {
  */
 interface IWebglViewer {
     readonly type: 'webgl';
-    readonly settings: ViewerSettings;
     readonly renderer: IWebglRenderer;
     readonly viewport: IWebglViewport;
     readonly selection: IWebglSelection;
@@ -1690,7 +1650,7 @@ declare function createCoreWebglViewer(settings?: PartialViewerSettings): IWebgl
 
 declare namespace Core_Webgl {
   export { MaterialSet, createCoreWebglViewer as createViewer, isElement3D };
-  export type { AxesSettings, ICameraMovement, IElement3D, IGizmoAxes, IGizmoMarkers, IGizmoOrbit, IGizmos, IMarker, IMaterials, IMeasure, IRenderingSection, IScene, ISelectable, ISubset, IWebglCamera, IWebglLoadRequest, IWebglRaycastResult, IWebglRaycaster, IWebglRenderer, IWebglSectionBox, IWebglSelection, IWebglViewport, IWebglVim, MaterialSettings, MeasureStage, PartialViewerSettings, RequestSource, SubsetFilter, TransparencyMode, IWebglViewer as Viewer, ViewerSettings, VimPartialSettings, VimSettings };
+  export type { AxesSettings, ICameraMovement, IElement3D, IGizmoAxes, IGizmoMarkers, IGizmoOrbit, IGizmos, IMarker, IMaterials, IMeasure, IRenderingSection, IScene, ISelectable, ISubset, IWebglCamera, IWebglLoadRequest, IWebglRaycastResult, IWebglRaycaster, IWebglRenderer, IWebglSectionBox, IWebglSelection, IWebglViewport, IWebglVim, MaterialSettings, MeasureStage, PartialViewerSettings, RequestSource, SelectionFillMode, SubsetFilter, TransparencyMode, IWebglViewer as Viewer, ViewerSettings, VimPartialSettings, VimSettings };
 }
 
 /**
@@ -2385,6 +2345,16 @@ interface IsolationApi {
     ghostOpacity: StateRef<number>;
     /** Whether transparent materials are rendered (observable). */
     transparency: StateRef<boolean>;
+    /** Whether selection outlines are enabled (observable). */
+    outlineEnabled: StateRef<boolean>;
+    /** Outline quality: 'low' (0.5x) | 'medium' (1x) | 'high' (2x) render target scale. */
+    outlineQuality: StateRef<string>;
+    /** Outline thickness in screen pixels (1-5). */
+    outlineThickness: StateRef<number>;
+    /** Selection fill mode: 'none' | 'default' | 'xray' | 'seethrough' (observable). */
+    selectionFillMode: StateRef<string>;
+    /** Opacity of the overlay pass in 'xray' and 'seethrough' modes (0-1). */
+    selectionOverlayOpacity: StateRef<number>;
     /** Whether room elements are shown (observable). */
     showRooms: StateRef<boolean>;
     /** Hook called when auto-isolate triggers. Use `update()` to add middleware. */
@@ -2914,7 +2884,19 @@ interface GenericBoolEntry {
     visible?: () => boolean;
     state: StateRef<boolean>;
 }
-type GenericEntryType = GenericTextEntry | GenericBoolEntry | GenericNumberEntry;
+interface GenericSelectEntry {
+    type: "select";
+    id: string;
+    label: string;
+    enabled?: () => boolean;
+    visible?: () => boolean;
+    options: {
+        label: string;
+        value: string;
+    }[];
+    state: StateRef<string>;
+}
+type GenericEntryType = GenericTextEntry | GenericBoolEntry | GenericNumberEntry | GenericSelectEntry;
 
 type GenericPanelApi = {
     customize(fn: (entries: GenericEntryType[]) => GenericEntryType[]): void;
@@ -2928,7 +2910,7 @@ type GenericPanelApi = {
 type AnySettings = WebglSettings | UltraSettings;
 
 type SettingsCustomization<T extends AnySettings> = (items: SettingsItem<T>[]) => SettingsItem<T>[];
-type SettingsItem<T extends AnySettings> = SettingsSubtitle | SettingsToggle<T> | SettingsBox<T> | SettingsElement;
+type SettingsItem<T extends AnySettings> = SettingsSubtitle | SettingsToggle<T> | SettingsBox<T> | SettingsSelect<T> | SettingsElement;
 type SettingsSubtitle = {
     type: 'subtitle';
     key: string;
@@ -2950,6 +2932,17 @@ type SettingsBox<T extends AnySettings> = {
     getter: (settings: T) => number;
     setter: (settings: T, b: number) => void;
 };
+type SettingsSelect<T extends AnySettings> = {
+    type: 'select';
+    key: string;
+    label: string;
+    options: {
+        label: string;
+        value: string;
+    }[];
+    getter: (settings: T) => string;
+    setter: (settings: T, value: string) => void;
+};
 type SettingsElement = {
     type: 'element';
     key: string;
@@ -3342,6 +3335,11 @@ declare const IsolationPanel: {
         showGhost: string;
         ghostOpacity: string;
         transparency: string;
+        outlineEnabled: string;
+        outlineQuality: string;
+        outlineThickness: string;
+        selectionFillMode: string;
+        selectionOverlayOpacity: string;
     };
 };