fix: vue attrs hyphenation issues

eslint.config.js

@@ -5,7 +5,6 @@ export default tresLintConfig({
 }, {
   rules: {
     'style/max-statements-per-line': 'off',
-    'vue/attribute-hyphenation': 'off',
     'jsdoc/check-alignment': 'off',
   },
 })

package.json

@@ -70,7 +70,7 @@
   "devDependencies": {
     "@release-it/conventional-changelog": "^8.0.1",
     "@tresjs/core": "^3.2.1",
-    "@tresjs/eslint-config": "^1.0.0",
+    "@tresjs/eslint-config": "^1.1.0",
     "@tweakpane/core": "^1.1.9",
     "@types/node": "^20.12.10",
     "@types/three": "^0.164.0",

playground/components.d.ts

@@ -1,10 +1,10 @@
 /* eslint-disable */
-/* prettier-ignore */
 // @ts-nocheck
 // Generated by unplugin-vue-components
 // Read more: https://github.com/vuejs/core/pull/3399
 export {}
 
+/* prettier-ignore */
 declare module 'vue' {
   export interface GlobalComponents {
     AkuAku: typeof import('./src/components/AkuAku.vue')['default']

playground/src/pages/staging/SkyDemo.vue

@@ -12,7 +12,7 @@ const gl = {
   toneMappingExposure: 1,
 }
 
-const [turbidity, rayleigh, mieCoefficient, mieDirectionalG, elevation, azimuth, distance, exposure] = useControls({
+const { turbidity, rayleigh, mieCoefficient, mieDirectionalG, elevation, azimuth, distance, exposure } = useControls({
   turbidity: { value: 3.4, min: 0, max: 20, step: 0.1 },
   rayleigh: { value: 3, min: 0, max: 4, step: 0.1 },
   mieCoefficient: { value: 0.005, min: 0, max: 0.1, step: 0.001 },

src/core/materials/holographicMaterial/index.vue

@@ -54,16 +54,16 @@ onLoop(() => {
 <template>
   <TresHolographicMaterial
     ref="MeshHolographicMaterialClass"
-    :uniforms-fresnel-amount-value="props.fresnelAmount"
-    :uniforms-enable-blinking-value="props.enableBlinking"
-    :uniforms-fresnel-opacity-value="props.fresnelOpacity"
-    :uniforms-hologram-brightness-value="props.hologramBrightness"
-    :uniforms-scanline-size-value="props.scanlineSize"
-    :uniforms-signal-speed-value="props.signalSpeed"
-    :uniforms-hologram-color-value="props.hologramColor"
-    :uniforms-hologram-opacity-value="props.hologramOpacity"
-    :uniforms-blink-fresnel-only-value="props.blinkFresnelOnly"
-    :enable-additive="props.enableAdditive"
+    :uniforms-fresnelAmount-value="props.fresnelAmount"
+    :uniforms-enableBlinking-value="props.enableBlinking"
+    :uniforms-fresnelOpacity-value="props.fresnelOpacity"
+    :uniforms-hologramBrightness-value="props.hologramBrightness"
+    :uniforms-scanlineSize-value="props.scanlineSize"
+    :uniforms-signalSpeed-value="props.signalSpeed"
+    :uniforms-hologramColor-value="props.hologramColor"
+    :uniforms-hologramOpacity-value="props.hologramOpacity"
+    :uniforms-blinkFresnelOnly-value="props.blinkFresnelOnly"
+    :enableAdditive="props.enableAdditive"
     :side="props.side"
   />
 </template>

src/core/staging/Sky.vue

@@ -70,9 +70,9 @@ defineExpose({
     :object="skyImpl"
     :material-uniforms-turbidity-value="props.turbidity"
     :material-uniforms-rayleigh-value="props.rayleigh"
-    :material-uniforms-mie-coefficient-value="props.mieCoefficient"
-    :material-uniforms-mie-directional-g-value="props.mieDirectionalG"
-    :material-uniforms-sun-position-value="sunPosition"
+    :material-uniforms-mieCoefficient-value="props.mieCoefficient"
+    :material-uniforms-mieDirectionalG-value="props.mieDirectionalG"
+    :material-uniforms-sunPosition-value="sunPosition"
     :scale="props.distance"
   />
 </template>