TSL: Deprecated `modInt()` and minor fixes (#30790)

* deprecated `modInt()`

* improve warnings

* updates

* revision

* fix declarations

* revision

* Update ComputeNode.js

examples/jsm/tsl/math/Bayer.js

@@ -26,6 +26,6 @@ export const bayer16 = Fn( ( [ uv ] ) => {
 
 	}
 
-	return textureLoad( bayer16Texture, ivec2( uv ).modInt( int( 16 ) ) );
+	return textureLoad( bayer16Texture, ivec2( uv ).mod( int( 16 ) ) );
 
 } );

src/nodes/accessors/BatchNode.js

@@ -74,8 +74,8 @@ class BatchNode extends Node {
 
 		const getIndirectIndex = Fn( ( [ id ] ) => {
 
-			const size = int( textureSize( textureLoad( this.batchMesh._indirectTexture ), 0 ) );
-			const x = int( id ).modInt( size );
+			const size = int( textureSize( textureLoad( this.batchMesh._indirectTexture ), 0 ).x );
+			const x = int( id ).mod( size );
 			const y = int( id ).div( size );
 			return textureLoad( this.batchMesh._indirectTexture, ivec2( x, y ) ).x;
 
@@ -91,11 +91,11 @@ class BatchNode extends Node {
 
 		const matricesTexture = this.batchMesh._matricesTexture;
 
-		const size = textureSize( textureLoad( matricesTexture ), 0 );
+		const size = int( textureSize( textureLoad( matricesTexture ), 0 ).x );
 		const j = float( indirectId ).mul( 4 ).toInt().toVar();
 
-		const x = j.modInt( size );
-		const y = j.div( int( size ) );
+		const x = j.mod( size );
+		const y = j.div( size );
 		const batchingMatrix = mat4(
 			textureLoad( matricesTexture, ivec2( x, y ) ),
 			textureLoad( matricesTexture, ivec2( x.add( 1 ), y ) ),
@@ -110,9 +110,9 @@ class BatchNode extends Node {
 
 			const getBatchingColor = Fn( ( [ id ] ) => {
 
-				const size = textureSize( textureLoad( colorsTexture ), 0 ).x;
+				const size = int( textureSize( textureLoad( colorsTexture ), 0 ).x );
 				const j = id;
-				const x = j.modInt( size );
+				const x = j.mod( size );
 				const y = j.div( size );
 				return textureLoad( colorsTexture, ivec2( x, y ) ).rgb;
 

src/nodes/accessors/Normal.js

@@ -23,7 +23,7 @@ export const normalLocal = /*@__PURE__*/ ( Fn( ( builder ) => {
 
 	if ( builder.geometry.hasAttribute( 'normal' ) === false ) {
 
-		console.warn( 'TSL.NormalNode: Vertex attribute "normal" not found on geometry.' );
+		console.warn( 'THREE.TSL: Vertex attribute "normal" not found on geometry.' );
 
 		return vec3( 0, 1, 0 );
 

src/nodes/accessors/StorageTextureNode.js

@@ -11,7 +11,7 @@ import { NodeAccess } from '../core/constants.js';
  *
  * const computeTexture = Fn( ( { storageTexture } ) => {
  *
- * 	const posX = instanceIndex.modInt( width );
+ * 	const posX = instanceIndex.mod( width );
  * 	const posY = instanceIndex.div( width );
  * 	const indexUV = uvec2( posX, posY );
  *

src/nodes/accessors/UniformArrayNode.js

@@ -358,7 +358,7 @@ export const uniformArray = ( values, nodeType ) => nodeObject( new UniformArray
  */
 export const uniforms = ( values, nodeType ) => { // @deprecated, r168
 
-	console.warn( 'TSL.UniformArrayNode: uniforms() has been renamed to uniformArray().' );
+	console.warn( 'THREE.TSL: uniforms() has been renamed to uniformArray().' );
 	return nodeObject( new UniformArrayNode( values, nodeType ) );
 
 };

src/nodes/core/NodeBuilder.js

@@ -266,14 +266,6 @@ class NodeBuilder {
 		 */
 		this.bindings = { vertex: {}, fragment: {}, compute: {} };
 
-
-		/**
-		 * This dictionary holds the declarations for each shader stage.
-		 *
-		 * @type {Object}
-		 */
-		this.declarations = { vertex: {}, fragment: {}, compute: {} };
-
 		/**
 		 * This dictionary maintains the binding indices per bind group.
 		 *
@@ -329,6 +321,13 @@ class NodeBuilder {
 		 */
 		this.vars = {};
 
+		/**
+		 * This dictionary holds the declarations for each shader stage.
+		 *
+		 * @type {Object}
+		 */
+		this.declarations = {};
+
 		/**
 		 * Current code flow.
 		 * All code generated in this stack will be stored in `.flow`.
@@ -1417,6 +1416,18 @@ class NodeBuilder {
 
 	}
 
+	/**
+	 * Returns the type is an integer type.
+	 *
+	 * @param {string} type - The type.
+	 * @return {boolean} Whether the type is an integer type or not.
+	 */
+	isInteger( type ) {
+
+		return /int|uint|(i|u)vec/.test( type );
+
+	}
+
 	/**
 	 * Returns the type for a given buffer attribute.
 	 *
@@ -1857,7 +1868,7 @@ class NodeBuilder {
 	registerDeclaration( node ) {
 
 		const shaderStage = this.shaderStage;
-		const declarations = this.declarations[ shaderStage ];
+		const declarations = this.declarations[ shaderStage ] || ( this.declarations[ shaderStage ] = {} );
 
 		const property = this.getPropertyName( node );
 
@@ -2171,6 +2182,7 @@ class NodeBuilder {
 
 		const previousFlow = this.flow;
 		const previousVars = this.vars;
+		const previousDeclarations = this.declarations;
 		const previousCache = this.cache;
 		const previousBuildStage = this.buildStage;
 		const previousStack = this.stack;
@@ -2181,6 +2193,7 @@ class NodeBuilder {
 
 		this.flow = flow;
 		this.vars = {};
+		this.declarations = {};
 		this.cache = new NodeCache();
 		this.stack = stack();
 
@@ -2196,6 +2209,7 @@ class NodeBuilder {
 
 		this.flow = previousFlow;
 		this.vars = previousVars;
+		this.declarations = previousDeclarations;
 		this.cache = previousCache;
 		this.stack = previousStack;
 

src/nodes/core/StackNode.js

@@ -172,7 +172,7 @@ class StackNode extends Node {
 	 */
 	else( ...params ) { // @deprecated, r168
 
-		console.warn( 'TSL.StackNode: .else() has been renamed to .Else().' );
+		console.warn( 'THREE.TSL: .else() has been renamed to .Else().' );
 		return this.Else( ...params );
 
 	}
@@ -185,7 +185,7 @@ class StackNode extends Node {
 	 */
 	elseif( ...params ) { // @deprecated, r168
 
-		console.warn( 'TSL.StackNode: .elseif() has been renamed to .ElseIf().' );
+		console.warn( 'THREE.TSL: .elseif() has been renamed to .ElseIf().' );
 		return this.ElseIf( ...params );
 
 	}

src/nodes/core/VaryingNode.js

@@ -192,14 +192,14 @@ addMethodChaining( 'toVertexStage', vertexStage );
 
 addMethodChaining( 'varying', ( ...params ) => { // @deprecated, r173
 
-	console.warn( 'TSL.VaryingNode: .varying() has been renamed to .toVarying().' );
+	console.warn( 'THREE.TSL: .varying() has been renamed to .toVarying().' );
 	return varying( ...params );
 
 } );
 
 addMethodChaining( 'vertexStage', ( ...params ) => { // @deprecated, r173
 
-	console.warn( 'TSL.VaryingNode: .vertexStage() has been renamed to .toVertexStage().' );
+	console.warn( 'THREE.TSL: .vertexStage() has been renamed to .toVertexStage().' );
 	return varying( ...params );
 
 } );

src/nodes/display/ScreenNode.js

@@ -253,7 +253,7 @@ export const viewportUV = /*@__PURE__*/ viewportCoordinate.div( viewportSize );
  */
 export const viewportResolution = /*@__PURE__*/ ( Fn( () => { // @deprecated, r169
 
-	console.warn( 'TSL.ViewportNode: "viewportResolution" is deprecated. Use "screenSize" instead.' );
+	console.warn( 'THREE.TSL: "viewportResolution" is deprecated. Use "screenSize" instead.' );
 
 	return screenSize;
 
@@ -266,7 +266,7 @@ export const viewportResolution = /*@__PURE__*/ ( Fn( () => { // @deprecated, r1
  */
 export const viewportTopLeft = /*@__PURE__*/ ( Fn( () => { // @deprecated, r168
 
-	console.warn( 'TSL.ViewportNode: "viewportTopLeft" is deprecated. Use "screenUV" instead.' );
+	console.warn( 'THREE.TSL: "viewportTopLeft" is deprecated. Use "screenUV" instead.' );
 
 	return screenUV;
 
@@ -279,7 +279,7 @@ export const viewportTopLeft = /*@__PURE__*/ ( Fn( () => { // @deprecated, r168
  */
 export const viewportBottomLeft = /*@__PURE__*/ ( Fn( () => { // @deprecated, r168
 
-	console.warn( 'TSL.ViewportNode: "viewportBottomLeft" is deprecated. Use "screenUV.flipY()" instead.' );
+	console.warn( 'THREE.TSL: "viewportBottomLeft" is deprecated. Use "screenUV.flipY()" instead.' );
 
 	return screenUV.flipY();
 

src/nodes/gpgpu/ComputeBuiltinNode.js

@@ -181,7 +181,7 @@ export const numWorkgroups = /*@__PURE__*/ computeBuiltin( 'numWorkgroups', 'uve
  * // Execute 12 compute threads with a workgroup size of 3.
  * const computeFn = Fn( () => {
  *
- * 	If( workgroupId.x.modInt( 2 ).equal( 0 ), () => {
+ * 	If( workgroupId.x.mod( 2 ).equal( 0 ), () => {
  *
  * 		storageBuffer.element( instanceIndex ).assign( instanceIndex );
  *

src/nodes/gpgpu/ComputeNode.js

@@ -167,10 +167,14 @@ class ComputeNode extends Node {
 
 		const result = this.computeNode.setup( builder );
 
-		const properties = builder.getNodeProperties( this );
-		properties.outputComputeNode = result.outputNode;
+		if ( result ) {
 
-		result.outputNode = null;
+			const properties = builder.getNodeProperties( this );
+			properties.outputComputeNode = result.outputNode;
+
+			result.outputNode = null;
+
+		}
 
 		return result;
 
@@ -182,7 +186,13 @@ class ComputeNode extends Node {
 
 		if ( shaderStage === 'compute' ) {
 
-			this.computeNode.build( builder, 'void' );
+			const snippet = this.computeNode.build( builder, 'void' );
+
+			if ( snippet !== '' ) {
+
+				builder.addLineFlowCode( snippet, this );
+
+			}
 
 		} else {
 

src/nodes/math/ConditionalNode.js

@@ -222,7 +222,7 @@ addMethodChaining( 'select', select );
  */
 export const cond = ( ...params ) => { // @deprecated, r168
 
-	console.warn( 'TSL.ConditionalNode: cond() has been renamed to select().' );
+	console.warn( 'THREE.TSL: cond() has been renamed to select().' );
 	return select( ...params );
 
 };

src/nodes/math/MathNode.js

@@ -1,5 +1,5 @@
 import TempNode from '../core/TempNode.js';
-import { sub, mul, div, equal } from './OperatorNode.js';
+import { sub, mul, div, mod, equal } from './OperatorNode.js';
 import { addMethodChaining, nodeObject, nodeProxy, float, vec2, vec3, vec4, Fn } from '../tsl/TSLCore.js';
 import { WebGLCoordinateSystem, WebGPUCoordinateSystem } from '../../constants.js';
 
@@ -152,10 +152,6 @@ class MathNode extends TempNode {
 
 			return builder.changeComponentType( this.aNode.getNodeType( builder ), 'bool' );
 
-		} else if ( method === MathNode.MOD ) {
-
-			return this.aNode.getNodeType( builder );
-
 		} else {
 
 			return this.getInputType( builder );
@@ -219,7 +215,7 @@ class MathNode extends TempNode {
 
 			const params = [];
 
-			if ( method === MathNode.CROSS || method === MathNode.MOD ) {
+			if ( method === MathNode.CROSS ) {
 
 				params.push(
 					a.build( builder, type ),
@@ -233,7 +229,7 @@ class MathNode extends TempNode {
 					b.build( builder, inputType )
 				);
 
-			} else if ( ( coordinateSystem === WebGLCoordinateSystem && ( method === MathNode.MIN || method === MathNode.MAX ) ) || method === MathNode.MOD ) {
+			} else if ( coordinateSystem === WebGLCoordinateSystem && ( method === MathNode.MIN || method === MathNode.MAX ) ) {
 
 				params.push(
 					a.build( builder, inputType ),
@@ -336,7 +332,6 @@ MathNode.BITCAST = 'bitcast';
 MathNode.EQUALS = 'equals';
 MathNode.MIN = 'min';
 MathNode.MAX = 'max';
-MathNode.MOD = 'mod';
 MathNode.STEP = 'step';
 MathNode.REFLECT = 'reflect';
 MathNode.DISTANCE = 'distance';
@@ -762,17 +757,6 @@ export const min = /*@__PURE__*/ nodeProxy( MathNode, MathNode.MIN ).setParamete
  */
 export const max = /*@__PURE__*/ nodeProxy( MathNode, MathNode.MAX ).setParameterLength( 2, Infinity );
 
-/**
- * Computes the remainder of dividing the first node by the second one.
- *
- * @tsl
- * @function
- * @param {Node | number} x - The y parameter.
- * @param {Node | number} y - The x parameter.
- * @returns {Node}
- */
-export const mod = /*@__PURE__*/ nodeProxy( MathNode, MathNode.MOD ).setParameterLength( 2 );
-
 /**
  * Generate a step function by comparing two values.
  *
@@ -1084,7 +1068,6 @@ addMethodChaining( 'fwidth', fwidth );
 addMethodChaining( 'atan2', atan2 );
 addMethodChaining( 'min', min );
 addMethodChaining( 'max', max );
-addMethodChaining( 'mod', mod );
 addMethodChaining( 'step', step );
 addMethodChaining( 'reflect', reflect );
 addMethodChaining( 'distance', distance );

src/nodes/math/OperatorNode.js

@@ -1,6 +1,6 @@
 import { WebGLCoordinateSystem } from '../../constants.js';
 import TempNode from '../core/TempNode.js';
-import { addMethodChaining, nodeProxy } from '../tsl/TSLCore.js';
+import { addMethodChaining, int, nodeProxy } from '../tsl/TSLCore.js';
 
 /**
  * This node represents basic mathematical and logical operations like addition,
@@ -199,6 +199,11 @@ class OperatorNode extends TempNode {
 				typeA = type;
 				typeB = builder.changeComponentType( typeB, 'uint' );
 
+			} else if ( op === '%' ) {
+
+				typeA = type;
+				typeB = builder.isInteger( typeA ) && builder.isInteger( typeB ) ? typeB : typeA;
+
 			} else if ( builder.isMatrix( typeA ) ) {
 
 				if ( typeB === 'float' ) {
@@ -352,6 +357,20 @@ class OperatorNode extends TempNode {
 
 				}
 
+			} else if ( op === '%' ) {
+
+				if ( isGLSL && builder.isInteger( typeB ) === false ) {
+
+					return builder.format( `${ builder.getMethod( 'mod', output ) }( ${ a }, ${ b } )`, type, output );
+
+				} else {
+
+					// WGSL
+
+					return builder.format( `( ${ a } % ${ b } )`, type, output );
+
+				}
+
 			} else if ( op === '!' || op === '~' ) {
 
 				return builder.format( `(${op}${a})`, typeA, output );
@@ -429,8 +448,8 @@ export default OperatorNode;
  *
  * @tsl
  * @function
- * @param {Node} aNode - The first input.
- * @param {Node} bNode - The second input.
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
  * @param {...Node} params - Additional input parameters.
  * @returns {OperatorNode}
  */
@@ -441,8 +460,8 @@ export const add = /*@__PURE__*/ nodeProxy( OperatorNode, '+' ).setParameterLeng
  *
  * @tsl
  * @function
- * @param {Node} aNode - The first input.
- * @param {Node} bNode - The second input.
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
  * @param {...Node} params - Additional input parameters.
  * @returns {OperatorNode}
  */
@@ -453,8 +472,8 @@ export const sub = /*@__PURE__*/ nodeProxy( OperatorNode, '-' ).setParameterLeng
  *
  * @tsl
  * @function
- * @param {Node} aNode - The first input.
- * @param {Node} bNode - The second input.
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
  * @param {...Node} params - Additional input parameters.
  * @returns {OperatorNode}
  */
@@ -465,31 +484,31 @@ export const mul = /*@__PURE__*/ nodeProxy( OperatorNode, '*' ).setParameterLeng
  *
  * @tsl
  * @function
- * @param {Node} aNode - The first input.
- * @param {Node} bNode - The second input.
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
  * @param {...Node} params - Additional input parameters.
  * @returns {OperatorNode}
  */
 export const div = /*@__PURE__*/ nodeProxy( OperatorNode, '/' ).setParameterLength( 2, Infinity ).setName( 'div' );
 
 /**
- * Computes the remainder of dividing the first node by the second, for integer values.
+ * Computes the remainder of dividing the first node by the second one.
  *
  * @tsl
  * @function
- * @param {Node} aNode - The first input.
- * @param {Node} bNode - The second input.
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
  * @returns {OperatorNode}
  */
-export const modInt = /*@__PURE__*/ nodeProxy( OperatorNode, '%' ).setParameterLength( 2 ).setName( 'modInt' );
+export const mod = /*@__PURE__*/ nodeProxy( OperatorNode, '%' ).setParameterLength( 2 ).setName( 'mod' );
 
 /**
  * Checks if two nodes are equal.
  *
  * @tsl
  * @function
- * @param {Node} aNode - The first input.
- * @param {Node} bNode - The second input.
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
  * @returns {OperatorNode}
  */
 export const equal = /*@__PURE__*/ nodeProxy( OperatorNode, '==' ).setParameterLength( 2 ).setName( 'equal' );
@@ -499,8 +518,8 @@ export const equal = /*@__PURE__*/ nodeProxy( OperatorNode, '==' ).setParameterL
  *
  * @tsl
  * @function
- * @param {Node} aNode - The first input.
- * @param {Node} bNode - The second input.
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
  * @returns {OperatorNode}
  */
 export const notEqual = /*@__PURE__*/ nodeProxy( OperatorNode, '!=' ).setParameterLength( 2 ).setName( 'notEqual' );
@@ -510,8 +529,8 @@ export const notEqual = /*@__PURE__*/ nodeProxy( OperatorNode, '!=' ).setParamet
  *
  * @tsl
  * @function
- * @param {Node} aNode - The first input.
- * @param {Node} bNode - The second input.
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
  * @returns {OperatorNode}
  */
 export const lessThan = /*@__PURE__*/ nodeProxy( OperatorNode, '<' ).setParameterLength( 2 ).setName( 'lessThan' );
@@ -521,8 +540,8 @@ export const lessThan = /*@__PURE__*/ nodeProxy( OperatorNode, '<' ).setParamete
  *
  * @tsl
  * @function
- * @param {Node} aNode - The first input.
- * @param {Node} bNode - The second input.
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
  * @returns {OperatorNode}
  */
 export const greaterThan = /*@__PURE__*/ nodeProxy( OperatorNode, '>' ).setParameterLength( 2 ).setName( 'greaterThan' );
@@ -532,8 +551,8 @@ export const greaterThan = /*@__PURE__*/ nodeProxy( OperatorNode, '>' ).setParam
  *
  * @tsl
  * @function
- * @param {Node} aNode - The first input.
- * @param {Node} bNode - The second input.
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
  * @returns {OperatorNode}
  */
 export const lessThanEqual = /*@__PURE__*/ nodeProxy( OperatorNode, '<=' ).setParameterLength( 2 ).setName( 'lessThanEqual' );
@@ -543,8 +562,8 @@ export const lessThanEqual = /*@__PURE__*/ nodeProxy( OperatorNode, '<=' ).setPa
  *
  * @tsl
  * @function
- * @param {Node} aNode - The first input.
- * @param {Node} bNode - The second input.
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
  * @returns {OperatorNode}
  */
 export const greaterThanEqual = /*@__PURE__*/ nodeProxy( OperatorNode, '>=' ).setParameterLength( 2 ).setName( 'greaterThanEqual' );
@@ -584,8 +603,8 @@ export const not = /*@__PURE__*/ nodeProxy( OperatorNode, '!' ).setParameterLeng
  *
  * @tsl
  * @function
- * @param {Node} aNode - The first input.
- * @param {Node} bNode - The second input.
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
  * @returns {OperatorNode}
  */
 export const xor = /*@__PURE__*/ nodeProxy( OperatorNode, '^^' ).setParameterLength( 2 ).setName( 'xor' );
@@ -595,8 +614,8 @@ export const xor = /*@__PURE__*/ nodeProxy( OperatorNode, '^^' ).setParameterLen
  *
  * @tsl
  * @function
- * @param {Node} aNode - The first input.
- * @param {Node} bNode - The second input.
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
  * @returns {OperatorNode}
  */
 export const bitAnd = /*@__PURE__*/ nodeProxy( OperatorNode, '&' ).setParameterLength( 2 ).setName( 'bitAnd' );
@@ -606,8 +625,8 @@ export const bitAnd = /*@__PURE__*/ nodeProxy( OperatorNode, '&' ).setParameterL
  *
  * @tsl
  * @function
- * @param {Node} aNode - The first input.
- * @param {Node} bNode - The second input.
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
  * @returns {OperatorNode}
  */
 export const bitNot = /*@__PURE__*/ nodeProxy( OperatorNode, '~' ).setParameterLength( 2 ).setName( 'bitNot' );
@@ -617,8 +636,8 @@ export const bitNot = /*@__PURE__*/ nodeProxy( OperatorNode, '~' ).setParameterL
  *
  * @tsl
  * @function
- * @param {Node} aNode - The first input.
- * @param {Node} bNode - The second input.
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
  * @returns {OperatorNode}
  */
 export const bitOr = /*@__PURE__*/ nodeProxy( OperatorNode, '|' ).setParameterLength( 2 ).setName( 'bitOr' );
@@ -628,8 +647,8 @@ export const bitOr = /*@__PURE__*/ nodeProxy( OperatorNode, '|' ).setParameterLe
  *
  * @tsl
  * @function
- * @param {Node} aNode - The first input.
- * @param {Node} bNode - The second input.
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
  * @returns {OperatorNode}
  */
 export const bitXor = /*@__PURE__*/ nodeProxy( OperatorNode, '^' ).setParameterLength( 2 ).setName( 'bitXor' );
@@ -639,8 +658,8 @@ export const bitXor = /*@__PURE__*/ nodeProxy( OperatorNode, '^' ).setParameterL
  *
  * @tsl
  * @function
- * @param {Node} aNode - The node to shift.
- * @param {Node} bNode - The value to shift.
+ * @param {Node} a - The node to shift.
+ * @param {Node} b - The value to shift.
  * @returns {OperatorNode}
  */
 export const shiftLeft = /*@__PURE__*/ nodeProxy( OperatorNode, '<<' ).setParameterLength( 2 ).setName( 'shiftLeft' );
@@ -650,8 +669,8 @@ export const shiftLeft = /*@__PURE__*/ nodeProxy( OperatorNode, '<<' ).setParame
  *
  * @tsl
  * @function
- * @param {Node} aNode - The node to shift.
- * @param {Node} bNode - The value to shift.
+ * @param {Node} a - The node to shift.
+ * @param {Node} b - The value to shift.
  * @returns {OperatorNode}
  */
 export const shiftRight = /*@__PURE__*/ nodeProxy( OperatorNode, '>>' ).setParameterLength( 2 ).setName( 'shiftRight' );
@@ -660,7 +679,7 @@ addMethodChaining( 'add', add );
 addMethodChaining( 'sub', sub );
 addMethodChaining( 'mul', mul );
 addMethodChaining( 'div', div );
-addMethodChaining( 'modInt', modInt );
+addMethodChaining( 'mod', mod );
 addMethodChaining( 'equal', equal );
 addMethodChaining( 'notEqual', notEqual );
 addMethodChaining( 'lessThan', lessThan );
@@ -681,16 +700,34 @@ addMethodChaining( 'shiftRight', shiftRight );
 /**
  * @tsl
  * @function
- * @deprecated since r168. Use {@link modInt} instead.
+ * @deprecated since r168. Use {@link mod} instead.
  *
- * @param {...any} params
- * @returns {Function}
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
+ * @returns {OperatorNode}
  */
-export const remainder = ( ...params ) => { // @deprecated, r168
+export const remainder = ( a, b ) => { // @deprecated, r168
 
-	console.warn( 'TSL.OperatorNode: .remainder() has been renamed to .modInt().' );
-	return modInt( ...params );
+	console.warn( 'THREE.TSL: "remainder()" is deprecated. Use "mod( int( ... ) )" instead.' );
+	return mod( a, b );
+
+};
+
+/**
+ * @tsl
+ * @function
+ * @deprecated since r175. Use {@link mod} instead.
+ *
+ * @param {Node} a - The first input.
+ * @param {Node} b - The second input.
+ * @returns {OperatorNode}
+ */
+export const modInt = ( a, b ) => { // @deprecated, r175
+
+	console.warn( 'THREE.TSL: "modInt()" is deprecated. Use "mod( int( ... ) )" instead.' );
+	return mod( a, int( b ) );
 
 };
 
 addMethodChaining( 'remainder', remainder );
+addMethodChaining( 'modInt', modInt );

src/nodes/tsl/TSLCore.js

@@ -616,7 +616,7 @@ export const Fn = ( jsFunc, nodeType ) => {
  */
 export const tslFn = ( ...params ) => { // @deprecated, r168
 
-	console.warn( 'TSL.ShaderNode: tslFn() has been renamed to Fn().' );
+	console.warn( 'THREE.TSL: tslFn() has been renamed to Fn().' );
 	return Fn( ...params );
 
 };

src/nodes/utils/ArrayElementNode.js

@@ -66,7 +66,7 @@ class ArrayElementNode extends Node { // @TODO: If extending from TempNode it br
 		const indexType = this.indexNode.getNodeType( builder );
 
 		const nodeSnippet = this.node.build( builder );
-		const indexSnippet = this.indexNode.build( builder, indexType === 'int' ? indexType : 'uint' );
+		const indexSnippet = this.indexNode.build( builder, ! builder.isVector( indexType ) && builder.isInteger( indexType ) ? indexType : 'uint' );
 
 		return `${ nodeSnippet }[ ${ indexSnippet } ]`;
 

src/nodes/utils/LoopNode.js

@@ -287,7 +287,7 @@ export const Break = () => expression( 'break' ).append();
  */
 export const loop = ( ...params ) => { // @deprecated, r168
 
-	console.warn( 'TSL.LoopNode: loop() has been renamed to Loop().' );
+	console.warn( 'THREE.TSL: loop() has been renamed to Loop().' );
 	return Loop( ...params );
 
 };