@ntalmagor/3drize-viewer 0.1.9 → 0.1.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -5,12 +5,6 @@ interface CameraControllerProps {
|
|
|
5
5
|
animationEase?: string;
|
|
6
6
|
settings: CameraState;
|
|
7
7
|
}
|
|
8
|
-
/**
|
|
9
|
-
* CameraController - React Three Fiber component that syncs camera with Redux state
|
|
10
|
-
* This component should be placed inside the Canvas component
|
|
11
|
-
*
|
|
12
|
-
* Simplified: Just applies state to camera. Animation is handled via useAnimationEvents.
|
|
13
|
-
*/
|
|
14
8
|
export declare const CameraController: React.FC<CameraControllerProps>;
|
|
15
9
|
export default CameraController;
|
|
16
10
|
//# sourceMappingURL=CameraController.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CameraController.d.ts","sourceRoot":"","sources":["../../src/components/CameraController.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"CameraController.d.ts","sourceRoot":"","sources":["../../src/components/CameraController.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAiC,MAAM,wBAAwB,CAAC;AAGzF,UAAU,qBAAqB;IAC7B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,WAAW,CAAA;CACtB;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CA2I5D,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
|
|
@@ -1,22 +1,13 @@
|
|
|
1
1
|
import { useEffect, useRef } from 'react';
|
|
2
2
|
import { useFrame, useThree } from '@react-three/fiber';
|
|
3
|
-
import { useDispatch } from 'react-redux';
|
|
4
3
|
import { useCameraAnimation } from '../hooks/useCameraAnimation';
|
|
5
4
|
import { cameraManager } from '../utils/CameraSingleton';
|
|
6
5
|
import { useAnimationEvents } from '../hooks/useAnimationEvents';
|
|
7
6
|
import { usePathAnimation } from '../hooks/usePathAnimation';
|
|
8
|
-
/**
|
|
9
|
-
* CameraController - React Three Fiber component that syncs camera with Redux state
|
|
10
|
-
* This component should be placed inside the Canvas component
|
|
11
|
-
*
|
|
12
|
-
* Simplified: Just applies state to camera. Animation is handled via useAnimationEvents.
|
|
13
|
-
*/
|
|
14
7
|
export const CameraController = ({ enableAutoAnimation = true, animationDuration = 1, animationEase = "power2.out", settings }) => {
|
|
15
8
|
const { camera, set } = useThree();
|
|
16
|
-
const dispatch = useDispatch();
|
|
17
9
|
const cameraRef = useRef(camera);
|
|
18
10
|
const transformAnimationProgress = useRef(0);
|
|
19
|
-
// Redux selectors
|
|
20
11
|
const { position, orientation, fov, near, far } = settings;
|
|
21
12
|
const { startPathAnimation, updatePathAnimation, isAnimating: isPathAnimating, } = usePathAnimation();
|
|
22
13
|
// Use camera animation hook for animated transitions (via events)
|
|
@@ -84,7 +75,6 @@ export const CameraController = ({ enableAutoAnimation = true, animationDuration
|
|
|
84
75
|
const { state, properties, pathId } = transition;
|
|
85
76
|
if (state === 'camera') {
|
|
86
77
|
isInAnimatedTransition.current = true;
|
|
87
|
-
// dispatch(setControls({ enablePan: false, enableRotate: false, enableZoom: false }));
|
|
88
78
|
const targetSettings = {
|
|
89
79
|
fov: properties.to.fov,
|
|
90
80
|
near: properties.to.near,
|
|
@@ -108,7 +98,6 @@ export const CameraController = ({ enableAutoAnimation = true, animationDuration
|
|
|
108
98
|
animateCamera(targetSettings, stepDuration, event.step?.ease, properties.to.target)
|
|
109
99
|
.then(() => {
|
|
110
100
|
isInAnimatedTransition.current = false;
|
|
111
|
-
// dispatch(setControls({ enablePan: true, enableRotate: true, enableZoom: true, target: properties.to.target || undefined }));
|
|
112
101
|
});
|
|
113
102
|
}
|
|
114
103
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CreatedObject.d.ts","sourceRoot":"","sources":["../../src/components/CreatedObject.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4C,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"CreatedObject.d.ts","sourceRoot":"","sources":["../../src/components/CreatedObject.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4C,MAAM,OAAO,CAAC;AAEjE,OAAO,KAAK,EAAe,qBAAqB,EAAkC,MAAM,wBAAwB,CAAC;AAOjH,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAiBjC,UAAU,kBAAkB;IAC1B,aAAa,EAAE,qBAAqB,CAAC;IACrC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,qBAAqB,EAAE,GAAG,EAAE,QAAQ,KAAK,IAAI,CAAC;CAExE;AAED,QAAA,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAmL9C,CAAC;AAIH,eAAe,aAAa,CAAC"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { useRef, useEffect, useState, memo } from "react";
|
|
3
|
-
import { useDispatch } from "react-redux";
|
|
4
3
|
import { DEFAULT_EDGES_SETTINGS } from "@ntalmagor/3drize-core";
|
|
5
4
|
import { useMaterialApplication } from "../hooks/useMaterialApplication";
|
|
6
5
|
import { useTransformControls } from "../hooks/useTransformControls";
|
|
@@ -14,7 +13,6 @@ const CreatedObject = memo(({ createdObject, children, shouldApply3driseMaterial
|
|
|
14
13
|
const isSelected = false;
|
|
15
14
|
// const isSelected = useObjectSelection(createdObject.id);
|
|
16
15
|
// const { handleObjectClick: contextHandleObjectClick } = useSceneClick();
|
|
17
|
-
const dispatch = useDispatch();
|
|
18
16
|
const meshRef = useRef(null);
|
|
19
17
|
const transformRef = useRef(null);
|
|
20
18
|
const baseColorRef = useRef(("color" in createdObject.materialSettings && createdObject.materialSettings.color) || '#ffffff');
|
|
@@ -111,9 +109,6 @@ const CreatedObject = memo(({ createdObject, children, shouldApply3driseMaterial
|
|
|
111
109
|
scale: [meshRef.current.scale.x, meshRef.current.scale.y, meshRef.current.scale.z]
|
|
112
110
|
}
|
|
113
111
|
};
|
|
114
|
-
// Here you could update the Redux store with final position/rotation/scale
|
|
115
|
-
// dispatch(updateObjectSettingsById(updatedSettings))
|
|
116
|
-
// updateObjectSettings && updateObjectSettings();
|
|
117
112
|
}
|
|
118
113
|
};
|
|
119
114
|
const anchorEnabled = createdObject.meshSettings.anchor && createdObject.meshSettings.anchor.enabled;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ntalmagor/3drize-viewer",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.10",
|
|
4
4
|
"private": false,
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -25,19 +25,15 @@
|
|
|
25
25
|
"@react-three/drei": "^10",
|
|
26
26
|
"@react-three/fiber": "^9",
|
|
27
27
|
"@react-three/rapier": "^2",
|
|
28
|
-
"@reduxjs/toolkit": "^2",
|
|
29
28
|
"react": "^18 || ^19",
|
|
30
|
-
"react-redux": "^9",
|
|
31
29
|
"three": "^0.170"
|
|
32
30
|
},
|
|
33
31
|
"devDependencies": {
|
|
34
32
|
"@ntalmagor/3drize-core": "*",
|
|
35
33
|
"@react-three/drei": "^10.0.0",
|
|
36
34
|
"@react-three/fiber": "^9.0.0",
|
|
37
|
-
"@reduxjs/toolkit": "^2.6.1",
|
|
38
35
|
"react": "^19.0.0",
|
|
39
36
|
"@types/react": "^19.0.0",
|
|
40
|
-
"react-redux": "^9.2.0",
|
|
41
37
|
"three": "^0.170.0",
|
|
42
38
|
"typescript": "^5.7.2"
|
|
43
39
|
}
|