kmcom-nuxt-layers 2.2.0 → 2.2.1

package/layers/shader/app/components/Pipeline/Wood.client.vue

@@ -1,82 +1,76 @@
-<!-- eslint-disable vue/define-props-destructuring -->
-<!-- eslint-disable @typescript-eslint/ban-ts-comment -->
 <script setup lang="ts">
-  // @ts-nocheck
   import { Color, Vector3 } from 'three'
   import { float, mix, sin, time, uniform, vec4 } from 'three/tsl'
 
   import { fbm2D } from '../../shaders/common/noise'
 
-  const props = withDefaults(
-    defineProps<{
-      colorA?: string
-      colorB?: string
-      /** Number of rings across the UV space */
-      ringFrequency?: number
-      /** Noise distortion scale */
-      noiseScale?: number
-      /** Noise displacement strength */
-      noiseStrength?: number
-      /** Very slow rotation speed for living wood effect */
-      speed?: number
-      order?: number
-    }>(),
-    {
-      colorA: '#8b5e3c',
-      colorB: '#4a2e1a',
-      ringFrequency: 12,
-      noiseScale: 3,
-      noiseStrength: 0.4,
-      speed: 0,
-      order: 0,
-    }
-  )
+  const {
+    colorA = '#8b5e3c',
+    colorB = '#4a2e1a',
+    ringFrequency = 12,
+    noiseScale = 3,
+    noiseStrength = 0.4,
+    speed = 0,
+    order = 0,
+  } = defineProps<{
+    colorA?: string
+    colorB?: string
+    /** Number of rings across the UV space */
+    ringFrequency?: number
+    /** Noise distortion scale */
+    noiseScale?: number
+    /** Noise displacement strength */
+    noiseStrength?: number
+    /** Very slow rotation speed for living wood effect */
+    speed?: number
+    order?: number
+  }>()
 
   function toVec3Node(hex: string) {
     const c = new Color(hex)
     return uniform(new Vector3(c.r, c.g, c.b))
   }
 
-  const colorANode = toVec3Node(props.colorA)
-  const colorBNode = toVec3Node(props.colorB)
-  const ringFreqNode = uniform(props.ringFrequency)
-  const noiseScaleNode = uniform(props.noiseScale)
-  const noiseStrNode = uniform(props.noiseStrength)
-  const speedNode = uniform(props.speed)
+  const colorANode = toVec3Node(colorA)
+  const colorBNode = toVec3Node(colorB)
+  const ringFreqNode = uniform(ringFrequency)
+  const noiseScaleNode = uniform(noiseScale)
+  const noiseStrNode = uniform(noiseStrength)
+  const speedNode = uniform(speed)
   watch(
-    () => props.colorA,
+    () => colorA,
     (v) => {
       const c = new Color(v)
       colorANode.value.set(c.r, c.g, c.b)
     }
   )
   watch(
-    () => props.colorB,
+    () => colorB,
     (v) => {
       const c = new Color(v)
       colorBNode.value.set(c.r, c.g, c.b)
     }
   )
   watch(
-    () => props.ringFrequency,
+    () => ringFrequency,
     (v) => {
       ringFreqNode.value = v
     }
   )
   watch(
-    () => props.noiseScale,
+    () => noiseScale,
     (v) => {
       noiseScaleNode.value = v
     }
   )
   watch(
-    () => props.noiseStrength,
+    () => noiseStrength,
     (v) => {
       noiseStrNode.value = v
     }
   )
   watch(
-    () => props.speed,
+    () => speed,
     (v) => {
       speedNode.value = v
     }
@@ -94,5 +88,5 @@
       .mul(0.5)
       .add(0.5)
     return vec4(mix(colorANode, colorBNode, ring), float(1))
-  }, props.order)
+  }, order)
 </script>

package/layers/shader/app/components/Preset/Aurora.client.vue

@@ -1,15 +1,8 @@
-<!-- eslint-disable @typescript-eslint/no-explicit-any -->
-<!-- eslint-disable vue/no-boolean-default -->
-<!-- eslint-disable vue/define-props-destructuring -->
-<!-- eslint-disable @typescript-eslint/no-unused-vars -->
-<!-- eslint-disable @typescript-eslint/ban-ts-comment -->
 <script setup lang="ts">
-  // @ts-nocheck - TSL types
   import {
     createAmbientUniforms,
     createAuroraColorNode,
   } from '#layers/shader/app/composables/useAmbientMaterials'
-  import { uniform } from 'three/tsl'
 
   const props = withDefaults(
     defineProps<{

package/layers/shader/app/components/Preset/Flow.client.vue

@@ -1,35 +1,27 @@
-<!-- eslint-disable @typescript-eslint/no-explicit-any -->
-<!-- eslint-disable vue/no-boolean-default -->
-<!-- eslint-disable vue/define-props-destructuring -->
-<!-- eslint-disable @typescript-eslint/ban-ts-comment -->
 <script setup lang="ts">
-  // @ts-nocheck - TSL types
   import {
     createAmbientUniforms,
     createFlowColorNode,
   } from '#layers/shader/app/composables/useAmbientMaterials'
 
-  const props = withDefaults(
-    defineProps<{
-      speed?: number
-      intensity?: number
-      mouseInteraction?: boolean
-    }>(),
-    {
-      speed: 1.0,
-      intensity: 1.0,
-      mouseInteraction: true,
-    }
-  )
+  const {
+    speed = 1.0,
+    intensity = 1.0,
+    mouseInteraction = true,
+  } = defineProps<{
+    speed?: number
+    intensity?: number
+    mouseInteraction?: boolean
+  }>()
 
   const emit = defineEmits<{
     node: [colorNode: any]
   }>()
 
   const uniforms = createAmbientUniforms({
-    speed: props.speed,
-    intensity: props.intensity,
-    mouseInteraction: props.mouseInteraction,
+    speed: speed,
+    intensity: intensity,
+    mouseInteraction: mouseInteraction,
   })
 
   const colorNode = createFlowColorNode(uniforms)
@@ -49,19 +41,19 @@
   }
 
   watch(
-    () => props.speed,
+    () => speed,
     (v) => {
       uniforms.speed.value = v
     }
   )
   watch(
-    () => props.intensity,
+    () => intensity,
     (v) => {
       uniforms.intensity.value = v
     }
   )
   watch(
-    () => props.mouseInteraction,
+    () => mouseInteraction,
     (v) => {
       uniforms.mouseStrength.value = v ? 0.5 : 0
     }

package/layers/shader/app/components/Preset/GradientMesh.client.vue

@@ -1,35 +1,27 @@
-<!-- eslint-disable @typescript-eslint/no-explicit-any -->
-<!-- eslint-disable vue/no-boolean-default -->
-<!-- eslint-disable vue/define-props-destructuring -->
-<!-- eslint-disable @typescript-eslint/ban-ts-comment -->
 <script setup lang="ts">
-  // @ts-nocheck - TSL types
   import {
     createAmbientUniforms,
     createGradientMeshColorNode,
   } from '#layers/shader/app/composables/useAmbientMaterials'
 
-  const props = withDefaults(
-    defineProps<{
-      speed?: number
-      intensity?: number
-      mouseInteraction?: boolean
-    }>(),
-    {
-      speed: 1.0,
-      intensity: 1.0,
-      mouseInteraction: true,
-    }
-  )
+  const {
+    speed = 1.0,
+    intensity = 1.0,
+    mouseInteraction = true,
+  } = defineProps<{
+    speed?: number
+    intensity?: number
+    mouseInteraction?: boolean
+  }>()
 
   const emit = defineEmits<{
     node: [colorNode: any]
   }>()
 
   const uniforms = createAmbientUniforms({
-    speed: props.speed,
-    intensity: props.intensity,
-    mouseInteraction: props.mouseInteraction,
+    speed: speed,
+    intensity: intensity,
+    mouseInteraction: mouseInteraction,
   })
 
   const colorNode = createGradientMeshColorNode(uniforms)
@@ -49,19 +41,19 @@
   }
 
   watch(
-    () => props.speed,
+    () => speed,
     (v) => {
       uniforms.speed.value = v
     }
   )
   watch(
-    () => props.intensity,
+    () => intensity,
     (v) => {
       uniforms.intensity.value = v
     }
   )
   watch(
-    () => props.mouseInteraction,
+    () => mouseInteraction,
     (v) => {
       uniforms.mouseStrength.value = v ? 0.3 : 0
     }

package/layers/shader/app/components/Preset/Nebula.client.vue

@@ -1,37 +1,27 @@
-<!-- eslint-disable @typescript-eslint/no-explicit-any -->
-<!-- eslint-disable vue/no-boolean-default -->
-<!-- eslint-disable @typescript-eslint/no-unused-vars -->
-<!-- eslint-disable vue/define-props-destructuring -->
-<!-- eslint-disable @typescript-eslint/ban-ts-comment -->
-
 <script setup lang="ts">
-  // @ts-nocheck - TSL types
   import {
     createAmbientUniforms,
     createNebulaColorNode,
   } from '#layers/shader/app/composables/useAmbientMaterials'
 
-  const props = withDefaults(
-    defineProps<{
-      speed?: number
-      intensity?: number
-      mouseInteraction?: boolean
-    }>(),
-    {
-      speed: 1.0,
-      intensity: 1.0,
-      mouseInteraction: true,
-    }
-  )
+  const {
+    speed = 1.0,
+    intensity = 1.0,
+    mouseInteraction = true,
+  } = defineProps<{
+    speed?: number
+    intensity?: number
+    mouseInteraction?: boolean
+  }>()
 
   const emit = defineEmits<{
     node: [colorNode: any]
   }>()
 
   const uniforms = createAmbientUniforms({
-    speed: props.speed,
-    intensity: props.intensity,
-    mouseInteraction: props.mouseInteraction,
+    speed: speed,
+    intensity: intensity,
+    mouseInteraction: mouseInteraction,
   })
 
   const colorNode = createNebulaColorNode(uniforms)
@@ -51,19 +41,19 @@
   }
 
   watch(
-    () => props.speed,
+    () => speed,
     (v) => {
       uniforms.speed.value = v
     }
   )
   watch(
-    () => props.intensity,
+    () => intensity,
     (v) => {
       uniforms.intensity.value = v
     }
   )
   watch(
-    () => props.mouseInteraction,
+    () => mouseInteraction,
     (v) => {
       uniforms.mouseStrength.value = v ? 0.3 : 0
     }

package/layers/shader/app/components/Preset/Ocean.client.vue

@@ -1,36 +1,27 @@
-<!-- eslint-disable @typescript-eslint/no-explicit-any -->
-<!-- eslint-disable vue/no-boolean-default -->
-<!-- eslint-disable @typescript-eslint/no-unused-vars -->
-<!-- eslint-disable vue/define-props-destructuring -->
-<!-- eslint-disable @typescript-eslint/ban-ts-comment -->
 <script setup lang="ts">
-  // @ts-nocheck - TSL types
   import {
     createAmbientUniforms,
     createOceanColorNode,
   } from '#layers/shader/app/composables/useAmbientMaterials'
 
-  const props = withDefaults(
-    defineProps<{
-      speed?: number
-      intensity?: number
-      mouseInteraction?: boolean
-    }>(),
-    {
-      speed: 1.0,
-      intensity: 1.0,
-      mouseInteraction: true,
-    }
-  )
+  const {
+    speed = 1.0,
+    intensity = 1.0,
+    mouseInteraction = true,
+  } = defineProps<{
+    speed?: number
+    intensity?: number
+    mouseInteraction?: boolean
+  }>()
 
   const emit = defineEmits<{
     node: [colorNode: any]
   }>()
 
   const uniforms = createAmbientUniforms({
-    speed: props.speed,
-    intensity: props.intensity,
-    mouseInteraction: props.mouseInteraction,
+    speed: speed,
+    intensity: intensity,
+    mouseInteraction: mouseInteraction,
   })
 
   const colorNode = createOceanColorNode(uniforms)
@@ -50,19 +41,19 @@
   }
 
   watch(
-    () => props.speed,
+    () => speed,
     (v) => {
       uniforms.speed.value = v
     }
   )
   watch(
-    () => props.intensity,
+    () => intensity,
     (v) => {
       uniforms.intensity.value = v
     }
   )
   watch(
-    () => props.mouseInteraction,
+    () => mouseInteraction,
     (v) => {
       uniforms.mouseStrength.value = v ? 0.5 : 0
     }

package/layers/shader/app/components/Preset/ThemeAurora.client.vue

@@ -1,55 +1,46 @@
-<!-- eslint-disable @typescript-eslint/no-explicit-any -->
-<!-- eslint-disable vue/no-boolean-default -->
-<!-- eslint-disable @typescript-eslint/no-unused-vars -->
-<!-- eslint-disable vue/define-props-destructuring -->
-<!-- eslint-disable @typescript-eslint/ban-ts-comment -->
 <script setup lang="ts">
-  // @ts-nocheck - TSL types
   import {
     createAmbientUniforms,
     createThemeAuroraColorNode,
   } from '#layers/shader/app/composables/useAmbientMaterials'
 
-  const props = withDefaults(
-    defineProps<{
-      speed?: number
-      intensity?: number
-      mouseInteraction?: boolean
-      mouseStrength?: number
-      color1?: string
-      color2?: string
-      color3?: string
-      color4?: string
-    }>(),
-    {
-      speed: 1.0,
-      intensity: 1.0,
-      mouseInteraction: true,
-      mouseStrength: 0.3,
-      color1: '#8b5cf6',
-      color2: '#6366f1',
-      color3: '#a78bfa',
-      color4: '#38bdf8',
-    }
-  )
+  const {
+    speed = 1.0,
+    intensity = 1.0,
+    mouseInteraction = true,
+    mouseStrength = 0.3,
+    color1 = '#8b5cf6',
+    color2 = '#6366f1',
+    color3 = '#a78bfa',
+    color4 = '#38bdf8',
+  } = defineProps<{
+    speed?: number
+    intensity?: number
+    mouseInteraction?: boolean
+    mouseStrength?: number
+    color1?: string
+    color2?: string
+    color3?: string
+    color4?: string
+  }>()
 
   const emit = defineEmits<{
     node: [colorNode: any]
   }>()
 
   const uniforms = createAmbientUniforms({
-    speed: props.speed,
-    intensity: props.intensity,
-    mouseInteraction: props.mouseInteraction,
+    speed: speed,
+    intensity: intensity,
+    mouseInteraction: mouseInteraction,
   })
-  if (props.mouseInteraction) {
-    uniforms.mouseStrength.value = props.mouseStrength
+  if (mouseInteraction) {
+    uniforms.mouseStrength.value = mouseStrength
   }
 
-  const c1 = useShaderColor(props.color1)
-  const c2 = useShaderColor(props.color2)
-  const c3 = useShaderColor(props.color3)
-  const c4 = useShaderColor(props.color4)
+  const c1 = useShaderColor(color1)
+  const c2 = useShaderColor(color2)
+  const c3 = useShaderColor(color3)
+  const c4 = useShaderColor(color4)
 
   const colorNode = createThemeAuroraColorNode(uniforms, {
     color1: c1.node,
@@ -59,19 +50,19 @@
   })
 
   watch(
-    () => props.color1,
+    () => color1,
     (hex) => c1.tweenTo(hex, 0.8)
   )
   watch(
-    () => props.color2,
+    () => color2,
     (hex) => c2.tweenTo(hex, 0.8)
   )
   watch(
-    () => props.color3,
+    () => color3,
     (hex) => c3.tweenTo(hex, 0.8)
   )
   watch(
-    () => props.color4,
+    () => color4,
     (hex) => c4.tweenTo(hex, 0.8)
   )
 
@@ -90,27 +81,27 @@
   }
 
   watch(
-    () => props.speed,
+    () => speed,
     (v) => {
       uniforms.speed.value = v
     }
   )
   watch(
-    () => props.intensity,
+    () => intensity,
     (v) => {
       uniforms.intensity.value = v
     }
   )
   watch(
-    () => props.mouseInteraction,
+    () => mouseInteraction,
     (v) => {
-      uniforms.mouseStrength.value = v ? props.mouseStrength : 0
+      uniforms.mouseStrength.value = v ? mouseStrength : 0
     }
   )
   watch(
-    () => props.mouseStrength,
+    () => mouseStrength,
     (v) => {
-      if (props.mouseInteraction) uniforms.mouseStrength.value = v
+      if (mouseInteraction) uniforms.mouseStrength.value = v
     }
   )