@playdrop/playdrop-cli 0.3.5-build.1 → 0.3.8-build.2

package/node_modules/three/{examples/jsm/nodes/materials → src/materials/nodes}/Line2NodeMaterial.js

@@ -1,62 +1,143 @@
-import NodeMaterial, { addNodeMaterial } from './NodeMaterial.js';
-import { temp } from '../core/VarNode.js';
-import { varying } from '../core/VaryingNode.js';
-import { property, varyingProperty } from '../core/PropertyNode.js';
-import { attribute } from '../core/AttributeNode.js';
-import { cameraProjectionMatrix } from '../accessors/CameraNode.js';
-import { materialColor, materialLineScale, materialLineDashSize, materialLineGapSize, materialLineDashOffset, materialLineWidth } from '../accessors/MaterialNode.js';
-import { modelViewMatrix } from '../accessors/ModelNode.js';
-import { positionGeometry } from '../accessors/PositionNode.js';
-import { mix, smoothstep } from '../math/MathNode.js';
-import { tslFn, float, vec2, vec3, vec4, If } from '../shadernode/ShaderNode.js';
-import { uv } from '../accessors/UVNode.js';
-import { viewport } from '../display/ViewportNode.js';
-import { dashSize, gapSize } from '../core/PropertyNode.js';
-
-import { LineDashedMaterial } from 'three';
-
-const defaultValues = new LineDashedMaterial();
-
+import NodeMaterial from './NodeMaterial.js';
+import { dashSize, gapSize, varyingProperty } from '../../nodes/core/PropertyNode.js';
+import { attribute } from '../../nodes/core/AttributeNode.js';
+import { cameraProjectionMatrix } from '../../nodes/accessors/Camera.js';
+import { materialColor, materialLineScale, materialLineDashSize, materialLineGapSize, materialLineDashOffset, materialLineWidth, materialOpacity } from '../../nodes/accessors/MaterialNode.js';
+import { modelViewMatrix } from '../../nodes/accessors/ModelNode.js';
+import { positionGeometry } from '../../nodes/accessors/Position.js';
+import { mix, smoothstep } from '../../nodes/math/MathNode.js';
+import { Fn, float, vec2, vec3, vec4, If } from '../../nodes/tsl/TSLBase.js';
+import { uv } from '../../nodes/accessors/UV.js';
+import { viewport } from '../../nodes/display/ScreenNode.js';
+import { viewportSharedTexture } from '../../nodes/display/ViewportSharedTextureNode.js';
+
+import { LineDashedMaterial } from '../LineDashedMaterial.js';
+import { NoBlending } from '../../constants.js';
+
+const _defaultValues = /*@__PURE__*/ new LineDashedMaterial();
+
+/**
+ * This node material can be used to render lines with a size larger than one
+ * by representing them as instanced meshes.
+ *
+ * @augments NodeMaterial
+ */
 class Line2NodeMaterial extends NodeMaterial {
 
-	constructor( params = {} ) {
+	static get type() {
 
-		super();
+		return 'Line2NodeMaterial';
 
-		this.normals = false;
-		this.lights = false;
+	}
 
-		this.setDefaultValues( defaultValues );
+	/**
+	 * Constructs a new node material for wide line rendering.
+	 *
+	 * @param {Object} [parameters={}] - The configuration parameter.
+	 */
+	constructor( parameters = {} ) {
 
-		this.useAlphaToCoverage = true;
-		this.useColor = params.vertexColors;
-		this.useDash = params.dashed;
-		this.useWorldUnits = false;
+		super();
 
+		/**
+		 * This flag can be used for type testing.
+		 *
+		 * @type {boolean}
+		 * @readonly
+		 * @default true
+		 */
+		this.isLine2NodeMaterial = true;
+
+		this.setDefaultValues( _defaultValues );
+
+		/**
+		 * Whether vertex colors should be used or not.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
+		this.useColor = parameters.vertexColors;
+
+		/**
+		 * The dash offset.
+		 *
+		 * @type {number}
+		 * @default 0
+		 */
 		this.dashOffset = 0;
-		this.lineWidth = 1;
 
+		/**
+		 * Defines the lines color.
+		 *
+		 * @type {?Node<vec3>}
+		 * @default null
+		 */
 		this.lineColorNode = null;
 
+		/**
+		 * Defines the offset.
+		 *
+		 * @type {?Node<float>}
+		 * @default null
+		 */
 		this.offsetNode = null;
+
+		/**
+		 * Defines the dash scale.
+		 *
+		 * @type {?Node<float>}
+		 * @default null
+		 */
 		this.dashScaleNode = null;
+
+		/**
+		 * Defines the dash size.
+		 *
+		 * @type {?Node<float>}
+		 * @default null
+		 */
 		this.dashSizeNode = null;
+
+		/**
+		 * Defines the gap size.
+		 *
+		 * @type {?Node<float>}
+		 * @default null
+		 */
 		this.gapSizeNode = null;
 
-		this.setupShaders();
+		/**
+		 * Blending is set to `NoBlending` since transparency
+		 * is not supported, yet.
+		 *
+		 * @type {number}
+		 * @default 0
+		 */
+		this.blending = NoBlending;
 
-		this.setValues( params );
+		this._useDash = parameters.dashed;
+		this._useAlphaToCoverage = true;
+		this._useWorldUnits = false;
+
+		this.setValues( parameters );
 
 	}
 
-	setupShaders() {
+	/**
+	 * Setups the vertex and fragment stage of this node material.
+	 *
+	 * @param {NodeBuilder} builder - The current node builder.
+	 */
+	setup( builder ) {
+
+		const { renderer } = builder;
 
-		const useAlphaToCoverage = this.alphaToCoverage;
+		const useAlphaToCoverage = this._useAlphaToCoverage;
 		const useColor = this.useColor;
-		const useDash = this.dashed;
-		const useWorldUnits = this.worldUnits;
+		const useDash = this._useDash;
+		const useWorldUnits = this._useWorldUnits;
 
-		const trimSegment = tslFn( ( { start, end } ) => {
+		const trimSegment = Fn( ( { start, end } ) => {
 
 			const a = cameraProjectionMatrix.element( 2 ).element( 2 ); // 3nd entry in 3th column
 			const b = cameraProjectionMatrix.element( 3 ).element( 2 ); // 3nd entry in 4th column
@@ -66,22 +147,39 @@ class Line2NodeMaterial extends NodeMaterial {
 
 			return vec4( mix( start.xyz, end.xyz, alpha ), end.w );
 
+		} ).setLayout( {
+			name: 'trimSegment',
+			type: 'vec4',
+			inputs: [
+				{ name: 'start', type: 'vec4' },
+				{ name: 'end', type: 'vec4' }
+			]
 		} );
 
-		this.vertexNode = tslFn( () => {
-
-			varyingProperty( 'vec2', 'vUv' ).assign( uv() );
+		this.vertexNode = Fn( () => {
 
 			const instanceStart = attribute( 'instanceStart' );
 			const instanceEnd = attribute( 'instanceEnd' );
 
 			// camera space
 
-			const start = property( 'vec4', 'start' );
-			const end = property( 'vec4', 'end' );
+			const start = vec4( modelViewMatrix.mul( vec4( instanceStart, 1.0 ) ) ).toVar( 'start' );
+			const end = vec4( modelViewMatrix.mul( vec4( instanceEnd, 1.0 ) ) ).toVar( 'end' );
+
+			if ( useDash ) {
+
+				const dashScaleNode = this.dashScaleNode ? float( this.dashScaleNode ) : materialLineScale;
+				const offsetNode = this.offsetNode ? float( this.offsetNode ) : materialLineDashOffset;
+
+				const instanceDistanceStart = attribute( 'instanceDistanceStart' );
+				const instanceDistanceEnd = attribute( 'instanceDistanceEnd' );
+
+				let lineDistance = positionGeometry.y.lessThan( 0.5 ).select( dashScaleNode.mul( instanceDistanceStart ), dashScaleNode.mul( instanceDistanceEnd ) );
+				lineDistance = lineDistance.add( offsetNode );
 
-			start.assign( modelViewMatrix.mul( vec4( instanceStart, 1.0 ) ) ); // force assignment into correct place in flow
-			end.assign( modelViewMatrix.mul( vec4( instanceEnd, 1.0 ) ) );
+				varyingProperty( 'float', 'lineDistance' ).assign( lineDistance );
+
+			}
 
 			if ( useWorldUnits ) {
 
@@ -105,7 +203,7 @@ class Line2NodeMaterial extends NodeMaterial {
 
 					end.assign( trimSegment( { start: start, end: end } ) );
 
-				} ).elseif( end.z.lessThan( 0.0 ).and( start.z.greaterThanEqual( 0.0 ) ), () => {
+				} ).ElseIf( end.z.lessThan( 0.0 ).and( start.z.greaterThanEqual( 0.0 ) ), () => {
 
 					start.assign( trimSegment( { start: end, end: start } ) );
 
@@ -122,13 +220,13 @@ class Line2NodeMaterial extends NodeMaterial {
 			const ndcEnd = clipEnd.xyz.div( clipEnd.w );
 
 			// direction
-			const dir = ndcEnd.xy.sub( ndcStart.xy ).temp();
+			const dir = ndcEnd.xy.sub( ndcStart.xy ).toVar();
 
 			// account for clip-space aspect ratio
 			dir.x.assign( dir.x.mul( aspect ) );
 			dir.assign( dir.normalize() );
 
-			const clip = temp( vec4() );
+			const clip = vec4().toVar();
 
 			if ( useWorldUnits ) {
 
@@ -141,18 +239,18 @@ class Line2NodeMaterial extends NodeMaterial {
 
 				const worldPos = varyingProperty( 'vec4', 'worldPos' );
 
-				worldPos.assign( positionGeometry.y.lessThan( 0.5 ).cond( start, end) );
+				worldPos.assign( positionGeometry.y.lessThan( 0.5 ).select( start, end ) );
 
 				// height offset
 				const hw = materialLineWidth.mul( 0.5 );
-				worldPos.addAssign( vec4( positionGeometry.x.lessThan( 0.0 ).cond( worldUp.mul( hw ), worldUp.mul( hw ).negate() ), 0 ) );
+				worldPos.addAssign( vec4( positionGeometry.x.lessThan( 0.0 ).select( worldUp.mul( hw ), worldUp.mul( hw ).negate() ), 0 ) );
 
 				// don't extend the line if we're rendering dashes because we
 				// won't be rendering the endcaps
 				if ( ! useDash ) {
 
 					// cap extension
-					worldPos.addAssign( vec4( positionGeometry.y.lessThan( 0.5 ).cond( worldDir.mul( hw ).negate(), worldDir.mul( hw ) ), 0 ) );
+					worldPos.addAssign( vec4( positionGeometry.y.lessThan( 0.5 ).select( worldDir.mul( hw ).negate(), worldDir.mul( hw ) ), 0 ) );
 
 					// add width to the box
 					worldPos.addAssign( vec4( worldFwd.mul( hw ), 0 ) );
@@ -171,30 +269,28 @@ class Line2NodeMaterial extends NodeMaterial {
 
 				// shift the depth of the projected points so the line
 				// segments overlap neatly
-				const clipPose = temp( vec3() );
+				const clipPose = vec3().toVar();
 
-				clipPose.assign( positionGeometry.y.lessThan( 0.5 ).cond( ndcStart, ndcEnd ) );
+				clipPose.assign( positionGeometry.y.lessThan( 0.5 ).select( ndcStart, ndcEnd ) );
 				clip.z.assign( clipPose.z.mul( clip.w ) );
 
 			} else {
 
-				const offset = property( 'vec2', 'offset' );
-
-				offset.assign( vec2( dir.y, dir.x.negate() ) );
+				const offset = vec2( dir.y, dir.x.negate() ).toVar( 'offset' );
 
 				// undo aspect ratio adjustment
 				dir.x.assign( dir.x.div( aspect ) );
 				offset.x.assign( offset.x.div( aspect ) );
 
 				// sign flip
-				offset.assign( positionGeometry.x.lessThan( 0.0 ).cond( offset.negate(), offset ) );
+				offset.assign( positionGeometry.x.lessThan( 0.0 ).select( offset.negate(), offset ) );
 
 				// endcaps
 				If( positionGeometry.y.lessThan( 0.0 ), () => {
 
 					offset.assign( offset.sub( dir ) );
 
-				} ).elseif( positionGeometry.y.greaterThan( 1.0 ), () => {
+				} ).ElseIf( positionGeometry.y.greaterThan( 1.0 ), () => {
 
 					offset.assign( offset.add( dir ) );
 
@@ -207,7 +303,7 @@ class Line2NodeMaterial extends NodeMaterial {
 				offset.assign( offset.div( viewport.w ) );
 
 				// select end
-				clip.assign( positionGeometry.y.lessThan( 0.5 ).cond( clipStart, clipEnd ) );
+				clip.assign( positionGeometry.y.lessThan( 0.5 ).select( clipStart, clipEnd ) );
 
 				// back to clip space
 				offset.assign( offset.mul( clip.w ) );
@@ -220,7 +316,7 @@ class Line2NodeMaterial extends NodeMaterial {
 
 		} )();
 
-		const closestLineToLine = tslFn( ( { p1, p2, p3, p4 } ) => {
+		const closestLineToLine = Fn( ( { p1, p2, p3, p4 } ) => {
 
 			const p13 = p1.sub( p3 );
 			const p43 = p4.sub( p3 );
@@ -243,36 +339,26 @@ class Line2NodeMaterial extends NodeMaterial {
 
 		} );
 
-		this.fragmentNode = tslFn( () => {
+		this.colorNode = Fn( () => {
 
-			const vUv = varyingProperty( 'vec2', 'vUv' );
+			const vUv = uv();
 
 			if ( useDash ) {
 
-				const offsetNode = this.offsetNode ? float( this.offsetNodeNode ) : materialLineDashOffset;
-				const dashScaleNode = this.dashScaleNode ? float( this.dashScaleNode ) : materialLineScale;
 				const dashSizeNode = this.dashSizeNode ? float( this.dashSizeNode ) : materialLineDashSize;
-				const gapSizeNode = this.dashSizeNode ? float( this.dashGapNode ) : materialLineGapSize;
+				const gapSizeNode = this.gapSizeNode ? float( this.gapSizeNode ) : materialLineGapSize;
 
 				dashSize.assign( dashSizeNode );
 				gapSize.assign( gapSizeNode );
 
-				const instanceDistanceStart = attribute( 'instanceDistanceStart' );
-				const instanceDistanceEnd = attribute( 'instanceDistanceEnd' );
-
-				const lineDistance = positionGeometry.y.lessThan( 0.5 ).cond( dashScaleNode.mul( instanceDistanceStart ), materialLineScale.mul( instanceDistanceEnd ) );
-
-				const vLineDistance = varying( lineDistance.add( materialLineDashOffset ) );
-				const vLineDistanceOffset = offsetNode ? vLineDistance.add( offsetNode ) : vLineDistance;
+				const vLineDistance = varyingProperty( 'float', 'lineDistance' );
 
 				vUv.y.lessThan( - 1.0 ).or( vUv.y.greaterThan( 1.0 ) ).discard(); // discard endcaps
-				vLineDistanceOffset.mod( dashSize.add( gapSize ) ).greaterThan( dashSize ).discard(); // todo - FIX
+				vLineDistance.mod( dashSize.add( gapSize ) ).greaterThan( dashSize ).discard(); // todo - FIX
 
 			}
 
-			 // force assignment into correct place in flow
-			const alpha = property( 'float', 'alpha' );
-			alpha.assign( 1 );
+			const alpha = float( 1 ).toVar( 'alpha' );
 
 			if ( useWorldUnits ) {
 
@@ -292,7 +378,7 @@ class Line2NodeMaterial extends NodeMaterial {
 
 				if ( ! useDash ) {
 
-					if ( useAlphaToCoverage ) {
+					if ( useAlphaToCoverage && renderer.currentSamples > 0 ) {
 
 						const dnorm = norm.fwidth();
 						alpha.assign( smoothstep( dnorm.negate().add( 0.5 ), dnorm.add( 0.5 ), norm ).oneMinus() );
@@ -309,16 +395,14 @@ class Line2NodeMaterial extends NodeMaterial {
 
 				// round endcaps
 
-				if ( useAlphaToCoverage ) {
+				if ( useAlphaToCoverage && renderer.currentSamples > 0 ) {
 
 					const a = vUv.x;
-					const b = vUv.y.greaterThan( 0.0 ).cond( vUv.y.sub( 1.0 ), vUv.y.add( 1.0 ) );
+					const b = vUv.y.greaterThan( 0.0 ).select( vUv.y.sub( 1.0 ), vUv.y.add( 1.0 ) );
 
 					const len2 = a.mul( a ).add( b.mul( b ) );
 
-					// force assignment out of following 'if' statement - to avoid uniform control flow errors
-					const dlen = property( 'float', 'dlen' );
-					dlen.assign( len2.fwidth() );
+					const dlen = float( len2.fwidth() ).toVar( 'dlen' );
 
 					If( vUv.y.abs().greaterThan( 1.0 ), () => {
 
@@ -331,7 +415,7 @@ class Line2NodeMaterial extends NodeMaterial {
 					If( vUv.y.abs().greaterThan( 1.0 ), () => {
 
 						const a = vUv.x;
-						const b = vUv.y.greaterThan( 0.0 ).cond( vUv.y.sub( 1.0 ), vUv.y.add( 1.0 ) );
+						const b = vUv.y.greaterThan( 0.0 ).select( vUv.y.sub( 1.0 ), vUv.y.add( 1.0 ) );
 						const len2 = a.mul( a ).add( b.mul( b ) );
 
 						len2.greaterThan( 1.0 ).discard();
@@ -355,7 +439,7 @@ class Line2NodeMaterial extends NodeMaterial {
 					const instanceColorStart = attribute( 'instanceColorStart' );
 					const instanceColorEnd = attribute( 'instanceColorEnd' );
 
-					const instanceColor = positionGeometry.y.lessThan( 0.5 ).cond( instanceColorStart, instanceColorEnd );
+					const instanceColor = positionGeometry.y.lessThan( 0.5 ).select( instanceColorStart, instanceColorEnd );
 
 					lineColorNode = instanceColor.mul( materialColor );
 
@@ -371,59 +455,83 @@ class Line2NodeMaterial extends NodeMaterial {
 
 		} )();
 
-		this.needsUpdate = true;
+		if ( this.transparent ) {
 
-	}
+			const opacityNode = this.opacityNode ? float( this.opacityNode ) : materialOpacity;
 
+			this.outputNode = vec4( this.colorNode.rgb.mul( opacityNode ).add( viewportSharedTexture().rgb.mul( opacityNode.oneMinus() ) ), this.colorNode.a );
 
+		}
+
+		super.setup( builder );
+
+	}
+
+	/**
+	 * Whether the lines should sized in world units or not.
+	 * When set to `false` the unit is pixel.
+	 *
+	 * @type {boolean}
+	 * @default false
+	 */
 	get worldUnits() {
 
-		return this.useWorldUnits;
+		return this._useWorldUnits;
 
 	}
 
 	set worldUnits( value ) {
 
-		if ( this.useWorldUnits !== value ) {
+		if ( this._useWorldUnits !== value ) {
 
-			this.useWorldUnits = value;
-			this.setupShaders();
+			this._useWorldUnits = value;
+			this.needsUpdate = true;
 
 		}
 
 	}
 
-
+	/**
+	 * Whether the lines should be dashed or not.
+	 *
+	 * @type {boolean}
+	 * @default false
+	 */
 	get dashed() {
 
-		return this.useDash;
+		return this._useDash;
 
 	}
 
 	set dashed( value ) {
 
-		if ( this.useDash !== value ) {
+		if ( this._useDash !== value ) {
 
-			this.useDash = value;
-			this.setupShaders();
+			this._useDash = value;
+			this.needsUpdate = true;
 
 		}
 
 	}
 
-
+	/**
+	 * Whether alpha to coverage should be used or not.
+	 *
+	 * @type {boolean}
+	 * @default true
+	 */
 	get alphaToCoverage() {
 
-		return this.useAlphaToCoverage;
+		return this._useAlphaToCoverage;
 
 	}
 
 	set alphaToCoverage( value ) {
 
-		if ( this.useAlphaToCoverage !== value ) {
+		if ( this._useAlphaToCoverage !== value ) {
 
-			this.useAlphaToCoverage = value;
-			this.setupShaders();
+			this._useAlphaToCoverage = value;
+			this.needsUpdate = true;
 
 		}
 
@@ -432,5 +540,3 @@ class Line2NodeMaterial extends NodeMaterial {
 }
 
 export default Line2NodeMaterial;
-
-addNodeMaterial( 'Line2NodeMaterial', Line2NodeMaterial );

package/node_modules/three/src/materials/nodes/LineBasicNodeMaterial.js

@@ -0,0 +1,46 @@
+import NodeMaterial from './NodeMaterial.js';
+
+import { LineBasicMaterial } from '../LineBasicMaterial.js';
+
+const _defaultValues = /*@__PURE__*/ new LineBasicMaterial();
+
+/**
+ * Node material version of {@link LineBasicMaterial}.
+ *
+ * @augments NodeMaterial
+ */
+class LineBasicNodeMaterial extends NodeMaterial {
+
+	static get type() {
+
+		return 'LineBasicNodeMaterial';
+
+	}
+
+	/**
+	 * Constructs a new line basic node material.
+	 *
+	 * @param {Object} [parameters] - The configuration parameter.
+	 */
+	constructor( parameters ) {
+
+		super();
+
+		/**
+		 * This flag can be used for type testing.
+		 *
+		 * @type {boolean}
+		 * @readonly
+		 * @default true
+		 */
+		this.isLineBasicNodeMaterial = true;
+
+		this.setDefaultValues( _defaultValues );
+
+		this.setValues( parameters );
+
+	}
+
+}
+
+export default LineBasicNodeMaterial;

package/node_modules/three/src/materials/nodes/LineDashedNodeMaterial.js

@@ -0,0 +1,132 @@
+import NodeMaterial from './NodeMaterial.js';
+import { attribute } from '../../nodes/core/AttributeNode.js';
+import { materialLineDashOffset, materialLineDashSize, materialLineGapSize, materialLineScale } from '../../nodes/accessors/MaterialNode.js';
+import { dashSize, gapSize } from '../../nodes/core/PropertyNode.js';
+import { varying, float } from '../../nodes/tsl/TSLBase.js';
+
+import { LineDashedMaterial } from '../LineDashedMaterial.js';
+
+const _defaultValues = /*@__PURE__*/ new LineDashedMaterial();
+
+/**
+ * Node material version of  {@link LineDashedMaterial}.
+ *
+ * @augments NodeMaterial
+ */
+class LineDashedNodeMaterial extends NodeMaterial {
+
+	static get type() {
+
+		return 'LineDashedNodeMaterial';
+
+	}
+
+	/**
+	 * Constructs a new line dashed node material.
+	 *
+	 * @param {Object} [parameters] - The configuration parameter.
+	 */
+	constructor( parameters ) {
+
+		super();
+
+		/**
+		 * This flag can be used for type testing.
+		 *
+		 * @type {boolean}
+		 * @readonly
+		 * @default true
+		 */
+		this.isLineDashedNodeMaterial = true;
+
+		this.setDefaultValues( _defaultValues );
+
+		/**
+		 * The dash offset.
+		 *
+		 * @type {number}
+		 * @default 0
+		 */
+		this.dashOffset = 0;
+
+		/**
+		 * The offset of dash materials is by default inferred from the `dashOffset`
+		 * property. This node property allows to overwrite the default
+		 * and define the offset with a node instead.
+		 *
+		 * If you don't want to overwrite the offset but modify the existing
+		 * value instead, use {@link materialLineDashOffset}.
+		 *
+		 * @type {?Node<float>}
+		 * @default null
+		 */
+		this.offsetNode = null;
+
+		/**
+		 * The scale of dash materials is by default inferred from the `scale`
+		 * property. This node property allows to overwrite the default
+		 * and define the scale with a node instead.
+		 *
+		 * If you don't want to overwrite the scale but modify the existing
+		 * value instead, use {@link materialLineScale}.
+		 *
+		 * @type {?Node<float>}
+		 * @default null
+		 */
+		this.dashScaleNode = null;
+
+		/**
+		 * The dash size of dash materials is by default inferred from the `dashSize`
+		 * property. This node property allows to overwrite the default
+		 * and define the dash size with a node instead.
+		 *
+		 * If you don't want to overwrite the dash size but modify the existing
+		 * value instead, use {@link materialLineDashSize}.
+		 *
+		 * @type {?Node<float>}
+		 * @default null
+		 */
+		this.dashSizeNode = null;
+
+		/**
+		 * The gap size of dash materials is by default inferred from the `gapSize`
+		 * property. This node property allows to overwrite the default
+		 * and define the gap size with a node instead.
+		 *
+		 * If you don't want to overwrite the gap size but modify the existing
+		 * value instead, use {@link materialLineGapSize}.
+		 *
+		 * @type {?Node<float>}
+		 * @default null
+		 */
+		this.gapSizeNode = null;
+
+		this.setValues( parameters );
+
+	}
+
+	/**
+	 * Setups the dash specific node variables.
+	 *
+	 * @param {NodeBuilder} builder - The current node builder.
+	 */
+	setupVariants( /* builder */ ) {
+
+		const offsetNode = this.offsetNode ? float( this.offsetNode ) : materialLineDashOffset;
+		const dashScaleNode = this.dashScaleNode ? float( this.dashScaleNode ) : materialLineScale;
+		const dashSizeNode = this.dashSizeNode ? float( this.dashSizeNode ) : materialLineDashSize;
+		const gapSizeNode = this.gapSizeNode ? float( this.gapSizeNode ) : materialLineGapSize;
+
+		dashSize.assign( dashSizeNode );
+		gapSize.assign( gapSizeNode );
+
+		const vLineDistance = varying( attribute( 'lineDistance' ).mul( dashScaleNode ) );
+		const vLineDistanceOffset = offsetNode ? vLineDistance.add( offsetNode ) : vLineDistance;
+
+		vLineDistanceOffset.mod( dashSize.add( gapSize ) ).greaterThan( dashSize ).discard();
+
+	}
+
+}
+
+export default LineDashedNodeMaterial;