@tresjs/cientos 5.2.3 → 5.2.5

package/dist/trescientos.js

@@ -1,6 +1,6 @@
 /**
   * name: @tresjs/cientos
-  * version: v5.2.3
+  * version: v5.2.5
   * (c) 2026
   * description: Collection of useful helpers and fully functional, ready-made abstractions for Tres
   * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
@@ -1079,14 +1079,17 @@ var component_vue_vue_type_script_setup_true_lang_default$16 = /* @__PURE__ */ d
 		const props = __props;
 		const imageRef = shallowRef();
 		const texture$1 = shallowRef(props.texture ?? null);
-		const size = useTres().sizes;
+		const { sizes: size, renderer } = useTres();
 		const planeBounds = computed(() => Array.isArray(props.scale) ? [props.scale[0], props.scale[1]] : [props.scale, props.scale]);
 		const imageBounds = computed(() => [texture$1.value?.image?.width ?? 0, texture$1.value?.image?.height ?? 0]);
 		const resolution = computed(() => Math.max(size.width.value, size.height.value));
 		const { state, isLoading } = useTexture(props.url);
 		watchEffect(() => {
 			if (props.texture) texture$1.value = props.texture;
-			if (!isLoading.value) texture$1.value = state.value;
+			if (!isLoading.value) {
+				texture$1.value = state.value;
+				texture$1.value.colorSpace = renderer.outputColorSpace;
+			}
 		});
 		const scale = computed(() => Array.isArray(props.scale) ? [...props.scale, 1] : props.scale);
 		__expose({ instance: imageRef });
@@ -10692,9 +10695,9 @@ var Sky_default = Sky_vue_vue_type_script_setup_true_lang_default;
 
 //#endregion
 //#region src/core/staging/Smoke.vue?vue&type=script&setup=true&lang.ts
-const _hoisted_1$4 = ["position"];
+const _hoisted_1$4 = ["scale"];
 const _hoisted_2$3 = ["position"];
-const _hoisted_3$2 = ["scale"];
+const _hoisted_3$2 = ["position", "scale"];
 const _hoisted_4$2 = [
 	"map",
 	"depth-test",
@@ -10708,7 +10711,7 @@ var Smoke_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCo
 		color: {
 			type: null,
 			required: false,
-			default: "#ffffff"
+			default: "#f7f7f7"
 		},
 		opacity: {
 			type: Number,
@@ -10720,20 +10723,15 @@ var Smoke_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCo
 			required: false,
 			default: .4
 		},
-		width: {
-			type: Number,
-			required: false,
-			default: 10
-		},
 		depth: {
 			type: Number,
 			required: false,
-			default: 1.5
+			default: .3
 		},
 		segments: {
 			type: Number,
 			required: false,
-			default: 20
+			default: 10
 		},
 		texture: {
 			type: String,
@@ -10743,30 +10741,42 @@ var Smoke_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCo
 		depthTest: {
 			type: Boolean,
 			required: false,
-			default: true
+			default: false
+		},
+		spreadY: {
+			type: Number,
+			required: false,
+			default: .1
+		},
+		spreadX: {
+			type: Number,
+			required: false,
+			default: .5
+		},
+		scale: {
+			type: Number,
+			required: false,
+			default: 1
 		}
 	},
 	setup(__props, { expose: __expose }) {
-		const { width, depth, segments, texture: texture$1, color, depthTest, opacity, speed } = toRefs(__props);
+		const { depth, segments, texture: texture$1, color, depthTest, opacity, speed, spreadY, spreadX, scale } = toRefs(__props);
 		const smokeRef = shallowRef();
 		const groupRef = shallowRef();
 		__expose({ instance: smokeRef });
-		const smoke = [...[segments]].map((_, index) => ({
-			x: width.value / 2 - Math.random() * width.value,
-			y: width.value / 2 - Math.random() * width.value,
-			scale: .4 + Math.sin((index + 1) / segments.value * Math.PI) * ((.2 + Math.random()) * 10),
-			density: Math.max(.2, Math.random()),
-			rotation: Math.max(.002, .005 * Math.random()) * speed.value
-		}));
-		const calculateOpacity = (scale, density) => scale / 6 * density * opacity.value;
+		const smoke = computed(() => Array.from({ length: segments.value }, (_, index) => ({
+			x: (Math.random() - .5) * spreadX.value,
+			y: (Math.random() - .5) * spreadY.value,
+			scale: Math.sin((index + 1) / segments.value) * scale.value
+		})));
 		const { state: map } = useTexture(texture$1.value);
 		const { renderer, camera } = useTresContext();
 		const colorSpace = computed(() => renderer.instance?.outputColorSpace);
 		const { onBeforeRender } = useLoop();
 		onBeforeRender(() => {
 			if (smokeRef.value && camera.activeCamera.value && groupRef.value) {
-				groupRef.value?.children.forEach((child, index) => {
-					child.rotation.z += smoke[index].rotation;
+				groupRef.value?.children.forEach((child) => {
+					child.rotation.z += Math.max(.002, .005 * Math.random()) * speed.value;
 				});
 				smokeRef.value.lookAt(camera.activeCamera.value?.position);
 			}
@@ -10774,7 +10784,8 @@ var Smoke_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCo
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("TresGroup", {
 				ref_key: "smokeRef",
-				ref: smokeRef
+				ref: smokeRef,
+				scale: unref(scale)
 			}, [createElementVNode("TresGroup", {
 				ref_key: "groupRef",
 				ref: groupRef,
@@ -10783,35 +10794,25 @@ var Smoke_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCo
 					0,
 					unref(segments) / 2 * unref(depth)
 				]
-			}, [(openBlock(true), createElementBlock(Fragment, null, renderList(unref(smoke), ({ scale, x, y, density }, index) => {
+			}, [(openBlock(true), createElementBlock(Fragment, null, renderList(smoke.value, ({ x, y, scale: smokeScale }, index) => {
 				return openBlock(), createElementBlock("TresMesh", {
 					key: `${index}`,
 					position: [
 						x,
 						y,
 						-index * unref(depth)
-					]
-				}, [createElementVNode("TresPlaneGeometry", {
-					scale: [
-						scale,
-						scale,
-						scale
 					],
-					rotation: [
-						0,
-						0,
-						0
-					]
-				}, null, 8, _hoisted_3$2), createElementVNode("TresMeshStandardMaterial", {
+					scale: smokeScale
+				}, [_cache[0] || (_cache[0] = createElementVNode("TresPlaneGeometry", null, null, -1)), createElementVNode("TresMeshStandardMaterial", {
 					map: unref(map),
 					"depth-test": unref(depthTest),
 					"color-space": colorSpace.value,
 					color: unref(color),
 					"depth-write": false,
 					transparent: "",
-					opacity: calculateOpacity(scale, density)
-				}, null, 8, _hoisted_4$2)], 8, _hoisted_2$3);
-			}), 128))], 8, _hoisted_1$4)], 512);
+					opacity: unref(opacity)
+				}, null, 8, _hoisted_4$2)], 8, _hoisted_3$2);
+			}), 128))], 8, _hoisted_2$3)], 8, _hoisted_1$4);
 		};
 	}
 });

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tresjs/cientos",
   "type": "module",
-  "version": "5.2.3",
+  "version": "5.2.5",
   "description": "Collection of useful helpers and fully functional, ready-made abstractions for Tres",
   "author": "Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)",
   "license": "MIT",
@@ -38,7 +38,7 @@
     "access": "public"
   },
   "peerDependencies": {
-    "@tresjs/core": "5.3.1",
+    "@tresjs/core": "5.3.3",
     "three": ">=0.133",
     "vue": ">=3.5.17"
   },
@@ -48,11 +48,11 @@
     "stats-gl": "^2.0.1",
     "stats.js": "^0.17.0",
     "three-custom-shader-material": "^5.4.0",
-    "three-stdlib": "^2.36.0"
+    "three-stdlib": "^2.36.1"
   },
   "devDependencies": {
     "@types/node": "^24.3.0",
-    "@types/three": "^0.180.0",
+    "@types/three": "^0.182.0",
     "@typescript-eslint/eslint-plugin": "^8.42.0",
     "@typescript-eslint/parser": "^8.42.0",
     "@vitejs/plugin-vue": "^6.0.1",
@@ -62,7 +62,7 @@
     "pathe": "^2.0.3",
     "rollup-plugin-analyzer": "^4.0.0",
     "rollup-plugin-visualizer": "^6.0.3",
-    "three": "^0.180.0",
+    "three": "^0.182.0",
     "tsdown": "0.18.3",
     "typescript": "^5.8.3",
     "vite": "^7.1.9",
@@ -71,7 +71,7 @@
     "vite-plugin-glsl": "^1.5.1",
     "vite-svg-loader": "^5.1.0",
     "vue-tsc": "^3.2.1",
-    "@tresjs/core": "5.3.1",
+    "@tresjs/core": "5.3.3",
     "@tresjs/eslint-config": "1.5.1"
   },
   "nx": {