@plastic-software/three 0.181.3 → 0.182.0

package/examples/jsm/inspector/ui/Tab.js

@@ -1,6 +1,31 @@
+/**
+ * Tab class
+ * @param {string} title - The title of the tab
+ * @param {Object} options - Options for the tab
+ * @param {boolean} [options.allowDetach=true] - Whether the tab can be detached into a separate window
+ * @param {boolean} [options.builtin=false] - Whether the tab should appear in the profiler-toggle button
+ * @param {string} [options.icon] - SVG icon HTML for the builtin button
+ *
+ * @example
+ * // Create a tab that can be detached (default behavior)
+ * const tab1 = new Tab('My Tab');
+ *
+ * // Create a tab that cannot be detached
+ * const tab2 = new Tab('Fixed Tab', { allowDetach: false });
+ *
+ * // Create a builtin tab that appears in the profiler-toggle
+ * const tab3 = new Tab('Builtin Tab', { builtin: true });
+ *
+ * // Create a builtin tab with custom icon
+ * const tab4 = new Tab('Settings', { builtin: true, icon: '<svg>...</svg>' });
+ *
+ * // Control builtin tab visibility
+ * tab3.showBuiltin(); // Show the builtin button and mini-content
+ * tab3.hideBuiltin(); // Hide the builtin button and mini-content
+ */
 export class Tab {
 
-	constructor( title ) {
+	constructor( title, options = {} ) {
 
 		this.id = title.toLowerCase();
 		this.button = document.createElement( 'button' );
@@ -13,6 +38,15 @@ export class Tab {
 
 		this.isActive = false;
 		this.isVisible = true;
+		this.isDetached = false;
+		this.detachedWindow = null;
+		this.allowDetach = options.allowDetach !== undefined ? options.allowDetach : true;
+		this.builtin = options.builtin !== undefined ? options.builtin : false;
+		this.icon = options.icon || null;
+		this.builtinButton = null; // Reference to the builtin button in profiler-toggle
+		this.miniContent = null; // Reference to the mini-panel content container
+		this.profiler = null; // Reference to the profiler instance
+		this.onVisibilityChange = null; // Callback for visibility changes
 
 	}
 
@@ -32,6 +66,22 @@ export class Tab {
 
 		this.isVisible = true;
 
+		// Show detached window if tab is detached
+		if ( this.isDetached && this.detachedWindow ) {
+
+			this.detachedWindow.panel.style.display = '';
+
+		}
+
+		// Notify profiler of visibility change
+		if ( this.onVisibilityChange ) {
+
+			this.onVisibilityChange();
+
+		}
+
+		this.showBuiltin();
+
 	}
 
 	hide() {
@@ -41,6 +91,143 @@ export class Tab {
 
 		this.isVisible = false;
 
+		// Hide detached window if tab is detached
+		if ( this.isDetached && this.detachedWindow ) {
+
+			this.detachedWindow.panel.style.display = 'none';
+
+		}
+
+		// Notify profiler of visibility change
+		if ( this.onVisibilityChange ) {
+
+			this.onVisibilityChange();
+
+		}
+
+		this.hideBuiltin();
+
+	}
+
+	showBuiltin() {
+
+		if ( ! this.builtin ) return;
+
+		// Show the builtin-tabs-container
+		if ( this.profiler && this.profiler.builtinTabsContainer ) {
+
+			this.profiler.builtinTabsContainer.style.display = '';
+
+		}
+
+		// Show the button
+		if ( this.builtinButton ) {
+
+			this.builtinButton.style.display = '';
+
+		}
+
+		// Show and activate the mini-panel with content
+		if ( this.miniContent && this.profiler ) {
+
+			// Hide all other mini-panel contents
+			this.profiler.miniPanel.querySelectorAll( '.mini-panel-content' ).forEach( content => {
+
+				content.style.display = 'none';
+
+			} );
+
+			// Remove active state from all builtin buttons
+			this.profiler.builtinTabsContainer.querySelectorAll( '.builtin-tab-btn' ).forEach( btn => {
+
+				btn.classList.remove( 'active' );
+
+			} );
+
+			// Activate this tab's button
+			if ( this.builtinButton ) {
+
+				this.builtinButton.classList.add( 'active' );
+
+			}
+
+			// Move content to mini-panel if not already there
+			if ( ! this.miniContent.firstChild ) {
+
+				const actualContent = this.content.querySelector( '.list-scroll-wrapper' ) || this.content.firstElementChild;
+
+				if ( actualContent ) {
+
+					this.miniContent.appendChild( actualContent );
+
+				}
+
+			}
+
+			// Show the mini-panel and content
+			this.miniContent.style.display = 'block';
+			this.profiler.miniPanel.classList.add( 'visible' );
+
+		}
+
+	}
+
+	hideBuiltin() {
+
+		if ( ! this.builtin ) return;
+
+		// Hide the button
+		if ( this.builtinButton ) {
+
+			this.builtinButton.style.display = 'none';
+
+		}
+
+		// Hide the mini-panel content
+		if ( this.miniContent ) {
+
+			this.miniContent.style.display = 'none';
+
+			// Move content back to main panel
+			if ( this.miniContent.firstChild ) {
+
+				this.content.appendChild( this.miniContent.firstChild );
+
+			}
+
+		}
+
+		// Deactivate button
+		if ( this.builtinButton ) {
+
+			this.builtinButton.classList.remove( 'active' );
+
+		}
+
+		// Hide mini-panel if no content is visible
+		if ( this.profiler ) {
+
+			const hasVisibleContent = Array.from( this.profiler.miniPanel.querySelectorAll( '.mini-panel-content' ) )
+				.some( content => content.style.display !== 'none' );
+
+			if ( ! hasVisibleContent ) {
+
+				this.profiler.miniPanel.classList.remove( 'visible' );
+
+			}
+
+			// Hide the builtin-tabs-container if all builtin buttons are hidden
+			const hasVisibleBuiltinButtons = Array.from( this.profiler.builtinTabsContainer.querySelectorAll( '.builtin-tab-btn' ) )
+				.some( btn => btn.style.display !== 'none' );
+
+			if ( ! hasVisibleBuiltinButtons ) {
+
+				this.profiler.builtinTabsContainer.style.display = 'none';
+
+			}
+
+		}
+
 	}
 
 }

package/examples/jsm/inspector/ui/Values.js

@@ -157,6 +157,14 @@ class ValueNumber extends Value {
 
 	}
 
+	setValue( val ) {
+
+		this.input.value = val;
+
+		return super.setValue( val );
+
+	}
+
 	getValue() {
 
 		return parseFloat( this.input.value );
@@ -194,6 +202,14 @@ class ValueCheckbox extends Value {
 
 	}
 
+	setValue( val ) {
+
+		this.checkbox.value = val;
+
+		return super.setValue( val );
+
+	}
+
 	getValue() {
 
 		return this.checkbox.checked;
@@ -216,7 +232,7 @@ class ValueSlider extends Value {
 
 		const numberValue = new ValueNumber( { value, min, max, step } );
 		this.numberInput = numberValue.input;
-		this.numberInput.style.width = '60px';
+		this.numberInput.style.flexBasis = '80px';
 		this.numberInput.style.flexShrink = '0';
 
 		this.slider.value = value;

package/examples/jsm/loaders/3DMLoader.js

@@ -23,7 +23,8 @@ import {
 	SpotLight,
 	Sprite,
 	SpriteMaterial,
-	TextureLoader
+	TextureLoader,
+	EquirectangularReflectionMapping
 } from 'three';
 
 import { EXRLoader } from '../loaders/EXRLoader.js';
@@ -507,7 +508,7 @@ class Rhino3dmLoader extends Loader {
 
 			new EXRLoader().load( renderEnvironment.image, function ( texture ) {
 
-				texture.mapping = THREE.EquirectangularReflectionMapping;
+				texture.mapping = EquirectangularReflectionMapping;
 				mat.envMap = texture;
 
 			} );
@@ -697,7 +698,7 @@ class Rhino3dmLoader extends Loader {
 
 				geometry = loader.parse( obj.geometry );
 
-				if ( geometry.attributes.hasOwnProperty( 'color' ) ) {
+				if ( geometry.hasAttribute( 'color' ) ) {
 
 					material = new PointsMaterial( { vertexColors: true, sizeAttenuation: false, size: 2 } );
 
@@ -740,7 +741,7 @@ class Rhino3dmLoader extends Loader {
 				}
 
 
-				if ( geometry.attributes.hasOwnProperty( 'color' ) ) {
+				if ( geometry.hasAttribute( 'color' ) ) {
 
 					mat.vertexColors = true;
 

package/examples/jsm/loaders/DRACOLoader.js

@@ -667,7 +667,7 @@ function DRACOWorker() {
 		const srcByteStride = itemSize * TypedArray.BYTES_PER_ELEMENT;
 		const dstByteStride = Math.ceil( srcByteStride / 4 ) * 4;
 
-		const dstStride = dstByteStride / TypedArray.BYTES_PER_ELEMENT
+		const dstStride = dstByteStride / TypedArray.BYTES_PER_ELEMENT;
 
 		const srcByteLength = count * srcByteStride;
 		const dstByteLength = count * dstByteStride;
@@ -690,13 +690,13 @@ function DRACOWorker() {
 
 			dstArray = new TypedArray( dstByteLength / TypedArray.BYTES_PER_ELEMENT );
 
-			let dstOffset = 0
+			let dstOffset = 0;
 
-			for ( let i = 0, il = srcArray.length; i < il; i++ ) {
+			for ( let i = 0, il = srcArray.length; i < il; i ++ ) {
 
-				for ( let j = 0; j < itemSize; j++ ) {
+				for ( let j = 0; j < itemSize; j ++ ) {
 
-					dstArray[ dstOffset + j ] = srcArray[ i * itemSize + j ]
+					dstArray[ dstOffset + j ] = srcArray[ i * itemSize + j ];
 
 				}
 

package/examples/jsm/loaders/FBXLoader.js

@@ -1615,11 +1615,9 @@ class GeometryParser {
 
 			case 'Mesh':
 				return this.parseMeshGeometry( relationships, geoNode, deformers );
-				break;
 
 			case 'NurbsCurve':
 				return this.parseNurbsGeometry( geoNode );
-				break;
 
 		}
 

package/examples/jsm/loaders/HDRLoader.js

@@ -424,7 +424,6 @@ class HDRLoader extends DataTextureLoader {
 			default:
 
 				throw new Error( 'THREE.HDRLoader: Unsupported type: ' + this.type );
-				break;
 
 		}
 

package/examples/jsm/loaders/KTX2Loader.js

@@ -20,6 +20,10 @@ import {
 	RGBA_BPTC_Format,
 	RGBA_S3TC_DXT3_Format,
 	RGBA_ETC2_EAC_Format,
+	R11_EAC_Format,
+	SIGNED_R11_EAC_Format,
+	RG11_EAC_Format,
+	SIGNED_RG11_EAC_Format,
 	RGBA_PVRTC_4BPPV1_Format,
 	RGBA_PVRTC_2BPPV1_Format,
 	RGBA_S3TC_DXT1_Format,
@@ -71,6 +75,10 @@ import {
 	VK_FORMAT_BC7_UNORM_BLOCK,
 	VK_FORMAT_ETC2_R8G8B8_SRGB_BLOCK,
 	VK_FORMAT_ETC2_R8G8B8A8_SRGB_BLOCK,
+	VK_FORMAT_EAC_R11_UNORM_BLOCK,
+	VK_FORMAT_EAC_R11_SNORM_BLOCK,
+	VK_FORMAT_EAC_R11G11_UNORM_BLOCK,
+	VK_FORMAT_EAC_R11G11_SNORM_BLOCK,
 	VK_FORMAT_PVRTC1_4BPP_SRGB_BLOCK_IMG,
 	VK_FORMAT_PVRTC1_4BPP_UNORM_BLOCK_IMG,
 	VK_FORMAT_PVRTC1_2BPP_SRGB_BLOCK_IMG,
@@ -968,6 +976,10 @@ const FORMAT_MAP = {
 
 	[ VK_FORMAT_ETC2_R8G8B8A8_SRGB_BLOCK ]: RGBA_ETC2_EAC_Format,
 	[ VK_FORMAT_ETC2_R8G8B8_SRGB_BLOCK ]: RGB_ETC2_Format,
+	[ VK_FORMAT_EAC_R11_UNORM_BLOCK ]: R11_EAC_Format,
+	[ VK_FORMAT_EAC_R11_SNORM_BLOCK ]: SIGNED_R11_EAC_Format,
+	[ VK_FORMAT_EAC_R11G11_UNORM_BLOCK ]: RG11_EAC_Format,
+	[ VK_FORMAT_EAC_R11G11_SNORM_BLOCK ]: SIGNED_RG11_EAC_Format,
 
 	[ VK_FORMAT_ASTC_4x4_SFLOAT_BLOCK_EXT ]: RGBA_ASTC_4x4_Format,
 	[ VK_FORMAT_ASTC_4x4_SRGB_BLOCK ]: RGBA_ASTC_4x4_Format,
@@ -1022,6 +1034,10 @@ const TYPE_MAP = {
 
 	[ VK_FORMAT_ETC2_R8G8B8A8_SRGB_BLOCK ]: UnsignedByteType,
 	[ VK_FORMAT_ETC2_R8G8B8_SRGB_BLOCK ]: UnsignedByteType,
+	[ VK_FORMAT_EAC_R11_UNORM_BLOCK ]: UnsignedByteType,
+	[ VK_FORMAT_EAC_R11_UNORM_BLOCK ]: UnsignedByteType,
+	[ VK_FORMAT_EAC_R11G11_UNORM_BLOCK ]: UnsignedByteType,
+	[ VK_FORMAT_EAC_R11G11_UNORM_BLOCK ]: UnsignedByteType,
 
 	[ VK_FORMAT_ASTC_4x4_SFLOAT_BLOCK_EXT ]: HalfFloatType,
 	[ VK_FORMAT_ASTC_4x4_SRGB_BLOCK ]: UnsignedByteType,

package/examples/jsm/loaders/LDrawLoader.js

@@ -1664,7 +1664,7 @@ function createObject( loader, elements, elementSize, isConditionalSegments = fa
 
 	if ( numGroupVerts > 0 ) {
 
-		bufferGeometry.addGroup( index0, Infinity, materials.length - 1 );
+		bufferGeometry.addGroup( index0, numGroupVerts, materials.length - 1 );
 
 	}
 
@@ -1749,7 +1749,7 @@ function createObject( loader, elements, elementSize, isConditionalSegments = fa
 /**
  * A loader for the LDraw format.
  *
- * [LDraw](https://ldraw.org/} (LEGO Draw) is an [open format specification]{@link https://ldraw.org/article/218.html)
+ * [LDraw](https://ldraw.org/} (LEGO Draw) is an [open format specification](https://ldraw.org/article/218.html)
  * for describing LEGO and other construction set 3D models.
  *
  * An LDraw asset (a text file usually with extension .ldr, .dat or .txt) can describe just a single construction
@@ -2400,7 +2400,6 @@ class LDrawLoader extends Loader {
 
 		material.color.setStyle( fillColor, COLOR_SPACE_LDRAW );
 		material.transparent = isTransparent;
-		material.premultipliedAlpha = true;
 		material.opacity = alpha;
 		material.depthWrite = ! isTransparent;
 

package/examples/jsm/loaders/PCDLoader.js

@@ -100,6 +100,7 @@ class PCDLoader extends Loader {
 	/**
 	 * Get dataview value by field type and size.
 	 *
+	 * @private
 	 * @param {DataView} dataview - The DataView to read from.
 	 * @param {number} offset - The offset to start reading from.
 	 * @param {'F' | 'U' | 'I'} type - Field type.

package/examples/jsm/loaders/SVGLoader.js

@@ -1082,7 +1082,7 @@ class SVGLoader extends Loader {
 				};
 
 				if ( node.hasAttribute( svgName ) ) style[ jsName ] = adjustFunction( node.getAttribute( svgName ) );
-				if ( stylesheetStyles[ svgName ] ) style[ jsName ] = adjustFunction( stylesheetStyles[ svgName ] );
+				if ( stylesheetStyles[ jsName ] ) style[ jsName ] = adjustFunction( stylesheetStyles[ jsName ] );
 				if ( node.style && node.style[ svgName ] !== '' ) style[ jsName ] = adjustFunction( node.style[ svgName ] );
 
 			}

package/examples/jsm/loaders/TDSLoader.js

@@ -684,11 +684,9 @@ class TDSLoader extends Loader {
 
 			case INT_PERCENTAGE:
 				return ( subChunk.readShort( ) / 100 );
-				break;
 
 			case FLOAT_PERCENTAGE:
 				return subChunk.readFloat( );
-				break;
 
 			default:
 				this.debugMessage( '      Unknown percentage chunk: ' + subChunk.hexId );

package/examples/jsm/loaders/TGALoader.js

@@ -389,7 +389,6 @@ class TGALoader extends DataTextureLoader {
 
 					default:
 						throw new Error( 'THREE.TGALoader: Format not supported.' );
-						break;
 
 				}
 
@@ -415,7 +414,6 @@ class TGALoader extends DataTextureLoader {
 
 					default:
 						throw new Error( 'THREE.TGALoader: Format not supported.' );
-						break;
 
 				}