kmcom-nuxt-layers 2.2.0 → 2.2.2

package/layers/shader/app/shaders/common/noise.ts

@@ -1,6 +1,3 @@
-/* eslint-disable @typescript-eslint/consistent-type-assertions */
-/* eslint-disable @typescript-eslint/ban-ts-comment */
-// @ts-nocheck - TSL types are complex and not fully exported from three/tsl
 /**
  * Modular TSL Noise Utilities
  * Provides composable noise functions for shader effects
@@ -92,7 +89,7 @@ export function valueNoise2D(st: TSLNode): TSLNode {
   const d = hash21(i.add(vec2(1, 1)))
 
   // Smooth interpolation
-  const u = f.mul(f).mul(float(3).sub(f.mul(2)))
+  const u: TSLNode = f.mul(f).mul(float(3).sub(f.mul(2)))
 
   return mix(mix(a, b, u.x), mix(c, d, u.x), u.y)
 }
@@ -103,7 +100,7 @@ export function valueNoise2D(st: TSLNode): TSLNode {
 export function simplexNoise2D(v: TSLNode): TSLNode {
   const C = vec4(0.211324865405187, 0.366025403784439, -0.577350269189626, 0.024390243902439)
 
-  const i = floor(v.add(dot(v, C.yy)))
+  const i: TSLNode = floor(v.add(dot(v, C.yy)))
   const x0 = v.sub(i).add(dot(i, C.xx))
 
   const i1x = step(x0.y, x0.x)
@@ -113,7 +110,7 @@ export function simplexNoise2D(v: TSLNode): TSLNode {
   const x12 = x0.xyxy.add(C.xxzz)
   const x12_mod = vec4(x12.x.sub(i1.x), x12.y.sub(i1.y), x12.z, x12.w)
 
-  const iMod = mod(i, 289)
+  const iMod: TSLNode = mod(i, 289)
   const p1 = mod(
     iMod.y
       .add(vec3(0, i1.y, 1))
@@ -151,11 +148,11 @@ export function simplexNoise2D(v: TSLNode): TSLNode {
   const ox = floor(x.add(0.5))
   const a0 = x.sub(ox)
 
-  const mMod = m4.mul(float(1.79284291400159).sub(a0.mul(a0).add(h.mul(h)).mul(0.85373472095314)))
+  const mMod: TSLNode = m4.mul(float(1.79284291400159).sub(a0.mul(a0).add(h.mul(h)).mul(0.85373472095314)))
 
-  const gx = a0.x.mul(x0.x).add(h.x.mul(x0.y))
-  const gy = a0.y.mul(x12_mod.x).add(h.y.mul(x12_mod.y))
-  const gz = a0.z.mul(x12_mod.z).add(h.z.mul(x12_mod.w))
+  const gx: TSLNode = a0.x.mul(x0.x).add(h.x.mul(x0.y))
+  const gy: TSLNode = a0.y.mul(x12_mod.x).add(h.y.mul(x12_mod.y))
+  const gz: TSLNode = a0.z.mul(x12_mod.z).add(h.z.mul(x12_mod.w))
 
   return dot(mMod, vec3(gx, gy, gz)).mul(130)
 }
@@ -170,7 +167,7 @@ export function simplexNoise2D(v: TSLNode): TSLNode {
 export function gradientNoise3D(p: TSLNode): TSLNode {
   const i = floor(p)
   const f = fract(p)
-  const u = f.mul(f).mul(float(3).sub(f.mul(2)))
+  const u: TSLNode = f.mul(f).mul(float(3).sub(f.mul(2)))
 
   return mix(
     mix(
@@ -221,9 +218,9 @@ export type FBMOptions = {
 export function fbm2D(p: TSLNode, options: FBMOptions = {}): TSLNode {
   const { octaves = 5, lacunarity = 2.0, gain = 0.5, amplitude = 0.5, frequency = 1.0 } = options
 
-  let value = float(0)
-  let amp = float(amplitude)
-  let freq = float(frequency)
+  let value: TSLNode = float(0)
+  let amp: TSLNode = float(amplitude)
+  let freq: TSLNode = float(frequency)
   const currentP = p
 
   for (let i = 0; i < octaves; i++) {
@@ -241,9 +238,9 @@ export function fbm2D(p: TSLNode, options: FBMOptions = {}): TSLNode {
 export function fbm3D(p: TSLNode, options: FBMOptions = {}): TSLNode {
   const { octaves = 5, lacunarity = 2.0, gain = 0.5, amplitude = 0.5, frequency = 1.0 } = options
 
-  let value = float(0)
-  let amp = float(amplitude)
-  let freq = float(frequency)
+  let value: TSLNode = float(0)
+  let amp: TSLNode = float(amplitude)
+  let freq: TSLNode = float(frequency)
 
   for (let i = 0; i < octaves; i++) {
     value = value.add(amp.mul(gradientNoise3D(p.mul(freq))))
@@ -271,8 +268,8 @@ export function voronoi2D(uv: TSLNode, scale: TSLNode | number = 1): VoronoiResu
   const i = floor(scaledUV)
   const f = fract(scaledUV)
 
-  let minDist = float(1)
-  let cellId = vec2(0, 0)
+  let minDist: TSLNode = float(1)
+  let cellId: TSLNode = vec2(0, 0)
 
   // Check 3x3 neighborhood
   for (let y = -1; y <= 1; y++) {
@@ -284,7 +281,7 @@ export function voronoi2D(uv: TSLNode, scale: TSLNode | number = 1): VoronoiResu
 
       const isCloser = step(dist, minDist)
       minDist = mix(minDist, dist, isCloser)
-      cellId = mix(cellId, i.add(neighbor), isCloser) as TSLNode
+      cellId = mix(cellId, i.add(neighbor), isCloser)
     }
   }
 
@@ -329,9 +326,9 @@ export function domainWarp2D(
 export function turbulence2D(p: TSLNode, options: FBMOptions = {}): TSLNode {
   const { octaves = 5, lacunarity = 2.0, gain = 0.5, amplitude = 0.5, frequency = 1.0 } = options
 
-  let value = float(0)
-  let amp = float(amplitude)
-  let freq = float(frequency)
+  let value: TSLNode = float(0)
+  let amp: TSLNode = float(amplitude)
+  let freq: TSLNode = float(frequency)
 
   for (let i = 0; i < octaves; i++) {
     value = value.add(amp.mul(abs(simplexNoise2D(p.mul(freq)))))
@@ -355,7 +352,7 @@ export function simplexNoise3d(v: TSLNode): TSLNode {
   const D = vec4(0.0, 0.5, 1.0, 2.0)
 
   const i = vec3(floor(v.add(dot(v, C.yyy)))).toVar()
-  const x0 = vec3(v.sub(i).add(dot(i, C.xxx))).toVar()
+  const x0: TSLNode = vec3(v.sub(i).add(dot(i, C.xxx))).toVar()
 
   const g = vec3(step(x0.yzx, x0.xyz)).toVar()
   const l = vec3(sub(1.0, g)).toVar()
@@ -384,14 +381,15 @@ export function simplexNoise3d(v: TSLNode): TSLNode {
   const y_ = vec4(floor(j.sub(mul(7.0, x_)))).toVar()
   const x = vec4(x_.mul(ns.x).add(ns.yyyy)).toVar()
   const y = vec4(y_.mul(ns.x).add(ns.yyyy)).toVar()
-  const h = vec4(sub(1.0, abs(x).sub(abs(y)))).toVar()
+  const h: TSLNode = vec4(sub(1.0, abs(x).sub(abs(y)))).toVar()
 
   const b0 = vec4(x.xy, y.xy).toVar()
   const b1 = vec4(x.zw, y.zw).toVar()
 
   const s0 = vec4(floor(b0).mul(2.0).add(1.0)).toVar()
   const s1 = vec4(floor(b1).mul(2.0).add(1.0)).toVar()
-  const sh = vec4(step(h, vec4(0.0)).negate()).toVar()
+  const zeroVec4: TSLNode = vec4(0.0)
+  const sh = vec4(step(h, zeroVec4).negate()).toVar()
 
   const a0 = vec4(b0.xzyw.add(s0.xzyw.mul(sh.xxyy))).toVar()
   const a1 = vec4(b1.xzyw.add(s1.xzyw.mul(sh.zzww))).toVar()
@@ -429,7 +427,7 @@ export function simplexNoise4d(v: TSLNode): TSLNode {
   const C = vec2(0.138196601125010504, 0.309016994374947451)
 
   const i = vec4(floor(v.add(dot(v, C.yyyy)))).toVar()
-  const x0 = vec4(v.sub(i).add(dot(i, C.xxxx))).toVar()
+  const x0: TSLNode = vec4(v.sub(i).add(dot(i, C.xxxx))).toVar()
 
   const i0 = vec4().toVar()
   const isX = vec3(step(x0.yzw, x0.xxx)).toVar()
@@ -529,19 +527,21 @@ export function perlinNoise3d(P: TSLNode): TSLNode {
   const ixy0 = vec4(permuteVec4(ixy.add(iz0))).toVar()
   const ixy1 = vec4(permuteVec4(ixy.add(iz1))).toVar()
 
-  const gx0 = vec4(ixy0.mul(1.0 / 7.0)).toVar()
-  const gy0 = vec4(fract(floor(gx0).mul(1.0 / 7.0)).sub(0.5)).toVar()
+  const gx0: TSLNode = vec4(ixy0.mul(1.0 / 7.0)).toVar()
+  const gy0: TSLNode = vec4(fract(floor(gx0).mul(1.0 / 7.0)).sub(0.5)).toVar()
   gx0.assign(fract(gx0))
-  const gz0 = vec4(vec4(0.5).sub(abs(gx0)).sub(abs(gy0))).toVar()
-  const sz0 = vec4(step(gz0, vec4(0.0))).toVar()
+  const gz0: TSLNode = vec4(vec4(0.5).sub(abs(gx0)).sub(abs(gy0))).toVar()
+  const zero0: TSLNode = vec4(0.0)
+  const sz0: TSLNode = vec4(step(gz0, zero0)).toVar()
   gx0.subAssign(sz0.mul(step(0.0, gx0).sub(0.5)))
   gy0.subAssign(sz0.mul(step(0.0, gy0).sub(0.5)))
 
-  const gx1 = vec4(ixy1.mul(1.0 / 7.0)).toVar()
-  const gy1 = vec4(fract(floor(gx1).mul(1.0 / 7.0)).sub(0.5)).toVar()
+  const gx1: TSLNode = vec4(ixy1.mul(1.0 / 7.0)).toVar()
+  const gy1: TSLNode = vec4(fract(floor(gx1).mul(1.0 / 7.0)).sub(0.5)).toVar()
   gx1.assign(fract(gx1))
-  const gz1 = vec4(vec4(0.5).sub(abs(gx1)).sub(abs(gy1))).toVar()
-  const sz1 = vec4(step(gz1, vec4(0.0))).toVar()
+  const gz1: TSLNode = vec4(vec4(0.5).sub(abs(gx1)).sub(abs(gy1))).toVar()
+  const zero1: TSLNode = vec4(0.0)
+  const sz1: TSLNode = vec4(step(gz1, zero1)).toVar()
   gx1.subAssign(sz1.mul(step(0.0, gx1).sub(0.5)))
   gy1.subAssign(sz1.mul(step(0.0, gy1).sub(0.5)))
 
@@ -649,10 +649,10 @@ export function curlNoise3d(inputA: TSLNode): TSLNode {
 export function ridgedFbm2d(p: TSLNode, options: FBMOptions = {}): TSLNode {
   const { octaves = 5, lacunarity = 2.0, gain = 0.5, amplitude = 0.5, frequency = 1.0 } = options
 
-  let value = float(0)
-  let amp = float(amplitude)
-  let freq = float(frequency)
-  let maxValue = float(0)
+  let value: TSLNode = float(0)
+  let amp: TSLNode = float(amplitude)
+  let freq: TSLNode = float(frequency)
+  let maxValue: TSLNode = float(0)
 
   for (let i = 0; i < octaves; i++) {
     // Sample noise and create ridges by taking absolute value and inverting
@@ -678,10 +678,10 @@ export function ridgedFbm2d(p: TSLNode, options: FBMOptions = {}): TSLNode {
 export function ridgedFbm3d(p: TSLNode, options: FBMOptions = {}): TSLNode {
   const { octaves = 5, lacunarity = 2.0, gain = 0.5, amplitude = 0.5, frequency = 1.0 } = options
 
-  let value = float(0)
-  let amp = float(amplitude)
-  let freq = float(frequency)
-  let maxValue = float(0)
+  let value: TSLNode = float(0)
+  let amp: TSLNode = float(amplitude)
+  let freq: TSLNode = float(frequency)
+  let maxValue: TSLNode = float(0)
 
   for (let i = 0; i < octaves; i++) {
     const noiseValue = simplexNoise3d(p.mul(freq))
@@ -779,7 +779,7 @@ export function turbulenceRotational(
   const amp = float(amplitude).toVar()
 
   // Turbulence rotation matrix
-  const rot = mat2(0.6, -0.8, 0.8, 0.6).toVar()
+  const rot: TSLNode = mat2(0.6, -0.8, 0.8, 0.6).toVar()
 
   // Loop through turbulence octaves
   Loop({ start: 0.0, end: octaves, type: 'float' }, ({ i }) => {
@@ -810,10 +810,10 @@ export function turbulenceRotational(
 export function fbm3dSimplex(p: TSLNode, options: FBMOptions = {}): TSLNode {
   const { octaves = 4, lacunarity = 2.0, gain = 0.5, amplitude = 1.0, frequency = 1.0 } = options
 
-  let value = float(0)
-  let amp = float(amplitude)
-  let freq = float(frequency)
-  let maxValue = float(0)
+  let value: TSLNode = float(0)
+  let amp: TSLNode = float(amplitude)
+  let freq: TSLNode = float(frequency)
+  let maxValue: TSLNode = float(0)
 
   for (let i = 0; i < octaves; i++) {
     value = value.add(simplexNoise3d(p.mul(freq)).mul(amp))

package/layers/shader/app/shaders/common/noiseHelpers.ts

@@ -1,5 +1,3 @@
-/* eslint-disable @typescript-eslint/ban-ts-comment */
-// @ts-nocheck - TSL types are complex and not fully exported from three/tsl
 /**
  * Modular TSL Noise Helper Functions
  * Provides primitive functions required by 3D/4D noise algorithms
@@ -100,16 +98,18 @@ export function taylorInvSqrtFloat(r: TSLNode): TSLNode {
  */
 export function grad4(j: TSLNode, ip: TSLNode): TSLNode {
   const ones = vec4(1.0, 1.0, 1.0, -1.0)
-  const p = vec4().toVar()
-  const s = vec4().toVar()
+  const p: TSLNode = vec4().toVar()
+  const s: TSLNode = vec4().toVar()
 
   p.xyz.assign(
     floor(fract(vec3(j).mul(ip.xyz)).mul(7.0))
       .mul(ip.z)
       .sub(1.0)
   )
-  p.w.assign(sub(1.5, dot(abs(p.xyz), ones.xyz)))
-  s.assign(vec4(lessThan(p, vec4(0.0))))
+  const pAbs: TSLNode = abs(p.xyz)
+  p.w.assign(sub(1.5, dot(pAbs, ones.xyz)))
+  const zero4: TSLNode = vec4(0.0)
+  s.assign(vec4(lessThan(p, zero4)))
   p.xyz.assign(p.xyz.add(s.xyz.mul(2.0).sub(1.0).mul(s.www)))
 
   return p

package/layers/shader/app/shaders/common/palette.ts

@@ -1,8 +1,3 @@
-/* eslint-disable max-params */
-/* eslint-disable @typescript-eslint/consistent-type-assertions */
-/* eslint-disable @typescript-eslint/no-unused-vars */
-/* eslint-disable @typescript-eslint/ban-ts-comment */
-// @ts-nocheck - TSL types are complex and not fully exported from three/tsl
 /**
  * Modular TSL Palette & Color Utilities
  * Provides composable color palette functions for shader effects
@@ -105,19 +100,23 @@ export function gradientMulti(t: TSLNode, stops: ColorStop[]): TSLNode {
 
   // Sort stops by position
   const sortedStops = [...stops].sort((a, b) => a.position - b.position)
+  const [firstStop] = sortedStops
+  if (!firstStop) {
+    throw new Error('Gradient requires at least 2 color stops')
+  }
 
-  let result = hexToVec3(sortedStops[0].color)
+  let result: TSLNode = hexToVec3(firstStop.color)
 
   for (let i = 1; i < sortedStops.length; i++) {
     const prevStop = sortedStops[i - 1]
     const currStop = sortedStops[i]
+    if (!prevStop || !currStop) continue
 
-    const prevColor = hexToVec3(prevStop.color)
     const currColor = hexToVec3(currStop.color)
 
     const localT = clamp(t.sub(prevStop.position).div(currStop.position - prevStop.position), 0, 1)
 
-    result = mix(result, currColor, step(prevStop.position, t).mul(localT)) as TSLNode
+    result = mix(result, currColor, step(prevStop.position, t).mul(localT))
   }
 
   return result
@@ -309,9 +308,9 @@ export function hslToRgb(hsl: TSLNode): TSLNode {
   const hue = fract(h).mul(6)
 
   // Choose color based on hue sector
-  const r = mix(mix(c, x, step(1, hue)), mix(float(0), x, step(4, hue)), step(2, hue))
-  const g = mix(mix(x, c, step(1, hue)), mix(x, float(0), step(4, hue)), step(2, hue))
-  const b = mix(float(0), mix(c, x, step(4, hue)), step(3, hue))
+  const r: TSLNode = mix(mix(c, x, step(1, hue)), mix(float(0), x, step(4, hue)), step(2, hue))
+  const g: TSLNode = mix(mix(x, c, step(1, hue)), mix(x, float(0), step(4, hue)), step(2, hue))
+  const b: TSLNode = mix(float(0), mix(c, x, step(4, hue)), step(3, hue))
 
   return vec3(r, g, b).add(m)
 }

package/layers/shader/app/shaders/common/patterns.ts

@@ -1,6 +1,3 @@
-/* eslint-disable complexity */
-/* eslint-disable @typescript-eslint/ban-ts-comment */
-// @ts-nocheck - TSL types are complex and not fully exported from three/tsl
 /**
  * Modular TSL Pattern Utilities
  * Provides procedural texture patterns
@@ -37,7 +34,7 @@ export function canvasWeavePattern(uv: TSLNode): TSLNode {
 
   // Add noise to warp the grid itself
   const noiseOffset = fbm3dSimplex(vec3(uv.mul(30.0), 0.0), { octaves: 3 }).mul(0.1)
-  const warpedGrid = grid.add(noiseOffset)
+  const warpedGrid: TSLNode = grid.add(noiseOffset)
 
   // Create irregular weave pattern
   const weaveX = sin(

package/layers/shader/app/shaders/common/sdf.ts

@@ -1,5 +1,3 @@
-/* eslint-disable @typescript-eslint/ban-ts-comment */
-// @ts-nocheck - TSL types are complex and not fully exported from three/tsl
 /**
  * Modular TSL SDF (Signed Distance Field) Utilities
  * Provides 2D/3D SDF shapes and operations for procedural geometry
@@ -8,6 +6,9 @@ import {
   abs,
   add,
   clamp,
+  dot,
+  float,
+  If,
   length,
   max,
   min,
@@ -93,9 +94,10 @@ export function sdHexagon(p: TSLNode, r: TSLNode | number = 0.5): TSLNode {
   const radius = typeof r === 'number' ? float(r) : r
   const k = vec3(-0.866025404, 0.5, 0.577350269)
 
-  const _p = abs(p).toVar()
+  const _p: TSLNode = abs(p).toVar()
   _p.subAssign(float(2.0).mul(min(dot(k.xy, _p), 0.0).mul(k.xy)))
-  _p.subAssign(vec2(clamp(_p.x, k.z.negate().mul(radius), k.z.mul(radius)), radius))
+  const clampedX: TSLNode = clamp(_p.x, k.z.negate().mul(radius), k.z.mul(radius))
+  _p.subAssign(vec2(clampedX, radius))
 
   return length(_p).mul(sign(_p.y))
 }
@@ -108,13 +110,15 @@ export function sdHexagon(p: TSLNode, r: TSLNode | number = 0.5): TSLNode {
 export function sdEquilateralTriangle(p: TSLNode, r: TSLNode | number = 0.1): TSLNode {
   const radius = typeof r === 'number' ? float(r) : r
   const k = sqrt(3.0)
-  const _p = (p ?? vec2(0)).toVar()
+  const _p: TSLNode = (p ?? vec2(0)).toVar()
 
   _p.x = abs(_p.x).sub(radius).toVar()
   _p.y = _p.y.add(radius.div(k)).toVar()
 
   If(_p.x.add(k.mul(_p.y)).greaterThan(0), () => {
-    _p.assign(vec2(_p.x.sub(k.mul(_p.y)), k.negate().mul(_p.x).sub(_p.y)).div(2))
+    const foldedX: TSLNode = _p.x.sub(k.mul(_p.y))
+    const foldedY: TSLNode = k.negate().mul(_p.x).sub(_p.y)
+    _p.assign(vec2(foldedX, foldedY).div(2))
   })
 
   _p.x.subAssign(clamp(_p.x, radius.mul(-2), 0.0))
@@ -221,6 +225,6 @@ export function sdTriangle(p: TSLNode, size: TSLNode | number = 0.4): TSLNode {
  */
 export function sdBox3d(p: TSLNode, b: TSLNode | [number, number, number] = [0, 0, 0]): TSLNode {
   const size = Array.isArray(b) ? vec3(b[0], b[1], b[2]) : b
-  const q = abs(p).sub(size)
+  const q: TSLNode = abs(p).sub(size)
   return length(max(q, 0.0)).add(min(max(q.x, max(q.y, q.z)), 0.0))
 }

package/layers/shader/app/shaders/common/shapes.ts

@@ -1,6 +1,3 @@
-/* eslint-disable max-params */
-/* eslint-disable @typescript-eslint/ban-ts-comment */
-// @ts-nocheck - TSL types are complex and not fully exported from three/tsl
 /**
  * Modular TSL Shape Utilities
  * Provides composable shape functions for shader effects
@@ -18,6 +15,7 @@ import {
   mix,
   sin,
   smoothstep,
+  step,
   vec2,
 } from 'three/tsl'
 
@@ -110,7 +108,7 @@ export function roundedRect(
   const r = typeof cornerRadius === 'number' ? float(cornerRadius) : cornerRadius
   const s = typeof softness === 'number' ? float(softness) : softness
 
-  const p = abs(uv.sub(c)).sub(sz.div(2)).add(r)
+  const p: TSLNode = abs(uv.sub(c)).sub(sz.div(2)).add(r)
   const d = length(max(p, 0))
     .add(min(max(p.x, p.y), 0))
     .sub(r)
@@ -129,7 +127,7 @@ export function rect(
   const c = Array.isArray(center) ? vec2(center[0], center[1]) : center
   const sz = Array.isArray(size) ? vec2(size[0], size[1]) : size
 
-  const p = abs(uv.sub(c))
+  const p: TSLNode = abs(uv.sub(c))
   const halfSize = sz.div(2)
 
   return step(p.x, halfSize.x).mul(step(p.y, halfSize.y))
@@ -230,7 +228,7 @@ export function grid(
   const size = typeof cellSize === 'number' ? float(cellSize) : cellSize
   const width = typeof lineWidth === 'number' ? float(lineWidth) : lineWidth
 
-  const gridUV = fract(uv.div(size))
+  const gridUV: TSLNode = fract(uv.div(size))
   const halfWidth = width.div(size).div(2)
 
   const xLine = step(gridUV.x, halfWidth).add(step(float(1).sub(halfWidth), gridUV.x))
@@ -245,15 +243,19 @@ export function grid(
 export function dots(
   uv: TSLNode,
   cellSize: TSLNode | number = 0.1,
-  dotRadius: TSLNode | number = 0.03
+  dotRadius: TSLNode | number = 0.03,
+  softness?: TSLNode | number
 ): TSLNode {
   const size = typeof cellSize === 'number' ? float(cellSize) : cellSize
   const radius = typeof dotRadius === 'number' ? float(dotRadius) : dotRadius
 
-  const gridUV = fract(uv.div(size)).sub(0.5)
+  const gridUV: TSLNode = fract(uv.div(size)).sub(0.5)
   const d = length(gridUV.mul(size))
 
-  return step(d, radius)
+  if (softness === undefined) return step(d, radius)
+
+  const soft = typeof softness === 'number' ? float(softness) : softness
+  return float(1).sub(smoothstep(radius.sub(soft), radius.add(soft), d))
 }
 
 /**
@@ -261,7 +263,7 @@ export function dots(
  */
 export function checker(uv: TSLNode, scale: TSLNode | number = 10): TSLNode {
   const s = typeof scale === 'number' ? float(scale) : scale
-  const scaledUV = floor(uv.mul(s))
+  const scaledUV: TSLNode = floor(uv.mul(s))
   return fract(scaledUV.x.add(scaledUV.y).mul(0.5)).mul(2)
 }
 
@@ -277,7 +279,8 @@ export function star(
   center: TSLNode | [number, number] = [0.5, 0.5],
   points: number = 5,
   innerRadius: TSLNode | number = 0.1,
-  outerRadius: TSLNode | number = 0.3
+  outerRadius: TSLNode | number = 0.3,
+  softness?: TSLNode | number
 ): TSLNode {
   const c = Array.isArray(center) ? vec2(center[0], center[1]) : center
   const inner = typeof innerRadius === 'number' ? float(innerRadius) : innerRadius
@@ -297,7 +300,10 @@ export function star(
   const t = foldedAngle.div(halfSegment)
   const targetRadius = mix(outer, inner, t)
 
-  return step(dist, targetRadius)
+  if (softness === undefined) return step(dist, targetRadius)
+
+  const soft = typeof softness === 'number' ? float(softness) : softness
+  return float(1).sub(smoothstep(targetRadius.sub(soft), targetRadius.add(soft), dist))
 }
 
 /**
@@ -333,7 +339,7 @@ export function concentricCircles(
   const freq = typeof frequency === 'number' ? float(frequency) : frequency
   const t = typeof thickness === 'number' ? float(thickness) : thickness
 
-  const d = length(uv.sub(c))
+  const d: TSLNode = length(uv.sub(c))
   return step(fract(d.mul(freq)), t)
 }
 
@@ -349,7 +355,8 @@ export function polygon(
   center: TSLNode | [number, number] = [0.5, 0.5],
   sides: number = 6,
   radius: TSLNode | number = 0.3,
-  rotation: TSLNode | number = 0
+  rotation: TSLNode | number = 0,
+  softness?: TSLNode | number
 ): TSLNode {
   const c = Array.isArray(center) ? vec2(center[0], center[1]) : center
   const r = typeof radius === 'number' ? float(radius) : radius
@@ -365,5 +372,8 @@ export function polygon(
   const foldedAngle = abs(fract(angle.div(segmentAngle).add(0.5)).sub(0.5)).mul(segmentAngle)
   const edgeDist = r.mul(cos(segmentAngle.div(2))).div(cos(foldedAngle))
 
-  return step(dist, edgeDist)
+  if (softness === undefined) return step(dist, edgeDist)
+
+  const soft = typeof softness === 'number' ? float(softness) : softness
+  return float(1).sub(smoothstep(edgeDist.sub(soft), edgeDist.add(soft), dist))
 }

package/layers/shader/app/shaders/common/tonemapping.ts

@@ -1,5 +1,3 @@
-/* eslint-disable @typescript-eslint/ban-ts-comment */
-// @ts-nocheck - TSL types are complex and not fully exported from three/tsl
 /**
  * Modular TSL Tonemapping Utilities
  * Provides various tonemapping operators for HDR to LDR conversion

package/layers/shader/app/shaders/common/uv.ts

@@ -1,18 +1,17 @@
-/* eslint-disable @typescript-eslint/consistent-type-assertions */
-/* eslint-disable complexity */
-/* eslint-disable max-params */
-/* eslint-disable no-restricted-syntax */
-/* eslint-disable no-nested-ternary */
-/* eslint-disable @typescript-eslint/ban-ts-comment */
-// @ts-nocheck - TSL types are complex and not fully exported from three/tsl
 /**
  * Modular TSL UV Manipulation Utilities
  * Provides composable UV transformation functions
  */
-import { abs, atan, cos, float, floor, fract, length, pow, sin, smoothstep, vec2 } from 'three/tsl'
+import { abs, atan, cos, float, floor, fract, length, mix, pow, sin, smoothstep, vec2 } from 'three/tsl'
 
 import type { TSLNode } from '../types'
 
+function toVec2Node(val: TSLNode | number | [number, number]): TSLNode {
+  if (typeof val === 'number') return vec2(val, val)
+  if (Array.isArray(val)) return vec2(val[0], val[1])
+  return val
+}
+
 // ============================================
 // Basic Transformations
 // ============================================
@@ -26,12 +25,7 @@ export function scaleUV(
   center: TSLNode | [number, number] = [0.5, 0.5]
 ): TSLNode {
   const c = Array.isArray(center) ? vec2(center[0], center[1]) : center
-  const s =
-    typeof scale === 'number'
-      ? vec2(scale, scale)
-      : Array.isArray(scale)
-        ? vec2(scale[0], scale[1])
-        : scale
+  const s = toVec2Node(scale)
 
   return uv.sub(c).div(s).add(c)
 }
@@ -71,12 +65,7 @@ export function translateUV(uv: TSLNode, offset: TSLNode | [number, number]): TS
  * Tile UV (repeat)
  */
 export function tileUV(uv: TSLNode, tiles: TSLNode | number | [number, number]): TSLNode {
-  const t =
-    typeof tiles === 'number'
-      ? vec2(tiles, tiles)
-      : Array.isArray(tiles)
-        ? vec2(tiles[0], tiles[1])
-        : tiles
+  const t = toVec2Node(tiles)
 
   return fract(uv.mul(t))
 }
@@ -118,10 +107,12 @@ export function fromPolar(
   center: TSLNode | [number, number] = [0.5, 0.5]
 ): TSLNode {
   const c = Array.isArray(center) ? vec2(center[0], center[1]) : center
-  const radius = polar.x
-  const angle = polar.y.mul(Math.PI * 2).sub(Math.PI)
+  const radius: TSLNode = polar.x
+  const angle: TSLNode = polar.y.mul(Math.PI * 2).sub(Math.PI)
 
-  return vec2(cos(angle).mul(radius), sin(angle).mul(radius)).add(c)
+  const x: TSLNode = cos(angle).mul(radius)
+  const y: TSLNode = sin(angle).mul(radius)
+  return vec2(x, y).add(c)
 }
 
 // ============================================
@@ -145,14 +136,14 @@ export function waveUV(
   if (direction === 'x') {
     const offset = sin(uv.y.mul(freq).add(t)).mul(amp)
     return vec2(uv.x.add(offset), uv.y)
-  } else if (direction === 'y') {
+  }
+  if (direction === 'y') {
     const offset = sin(uv.x.mul(freq).add(t)).mul(amp)
     return vec2(uv.x, uv.y.add(offset))
-  } else {
-    const offsetX = sin(uv.y.mul(freq).add(t)).mul(amp)
-    const offsetY = sin(uv.x.mul(freq).add(t.mul(1.3))).mul(amp)
-    return vec2(uv.x.add(offsetX), uv.y.add(offsetY))
   }
+  const offsetX = sin(uv.y.mul(freq).add(t)).mul(amp)
+  const offsetY = sin(uv.x.mul(freq).add(t.mul(1.3))).mul(amp)
+  return vec2(uv.x.add(offsetX), uv.y.add(offsetY))
 }
 
 /**
@@ -173,7 +164,7 @@ export function rippleUV(
   const fall = typeof falloff === 'number' ? float(falloff) : falloff
 
   const diff = uv.sub(c)
-  const dist = length(diff)
+  const dist: TSLNode = length(diff)
 
   const ripple = sin(dist.mul(freq).sub(t)).mul(amp)
   const falloffValue = pow(float(1).sub(dist.mul(fall)), 2).max(0)

package/layers/shader/app/shaders/createMaterial.ts

@@ -1,7 +1,3 @@
-/* eslint-disable @typescript-eslint/consistent-type-assertions */
-/* eslint-disable complexity */
-/* eslint-disable @typescript-eslint/ban-ts-comment */
-// @ts-nocheck - TSL types are complex and not fully exported from three/tsl
 /**
  * Material Factory
  * Creates Three.js TSL materials from shader layer functions
@@ -10,6 +6,8 @@ import { BackSide, DoubleSide, FrontSide, type Side } from 'three'
 import { vec4 } from 'three/tsl'
 import { MeshBasicNodeMaterial } from 'three/webgpu'
 
+import type { TSLNode } from './types'
+
 import {
   aurora,
   createAuroraUniforms,
@@ -47,7 +45,6 @@ import {
   type StripeGradientUniforms,
 } from './layers/stripe'
 
-type TSLNode = ShaderNodeObject<Node>
 
 // ============================================
 // Types