@wandelbots/wandelbots-js-react-components 2.26.0-pr.feature-update-to-react-19.361.e3316bb → 2.26.0-pr.feature-update-to-react-19.361.0d1640d
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.
- package/dist/components/robots/RobotAnimator.d.ts.map +1 -1
- package/dist/components/utils/interpolation.d.ts +106 -0
- package/dist/components/utils/interpolation.d.ts.map +1 -0
- package/dist/components/utils/interpolation.test.d.ts +2 -0
- package/dist/components/utils/interpolation.test.d.ts.map +1 -0
- package/dist/index.cjs +33 -33
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2792 -2667
- package/dist/index.js.map +1 -1
- package/package.json +1 -2
- package/src/components/robots/RobotAnimator.test.tsx +40 -60
- package/src/components/robots/RobotAnimator.tsx +44 -40
- package/src/components/utils/interpolation.test.ts +189 -0
- package/src/components/utils/interpolation.ts +268 -0
- package/src/index.ts +1 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RobotAnimator.d.ts","sourceRoot":"","sources":["../../../src/components/robots/RobotAnimator.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"RobotAnimator.d.ts","sourceRoot":"","sources":["../../../src/components/robots/RobotAnimator.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,WAAW,EACX,wBAAwB,EACzB,MAAM,yBAAyB,CAAA;AAChC,OAAO,KAA4B,MAAM,OAAO,CAAA;AAChD,OAAO,KAAK,EAAS,QAAQ,EAAE,MAAM,OAAO,CAAA;AAK5C,KAAK,kBAAkB,GAAG;IACxB,0BAA0B,EAAE,wBAAwB,CAAA;IACpD,YAAY,EAAE,WAAW,EAAE,CAAA;IAC3B,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,EAAE,WAAW,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IACvE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CAAA;AAED,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EACpC,0BAA0B,EAC1B,YAAY,EACZ,iBAAiB,EACjB,QAAQ,GACT,EAAE,kBAAkB,2CAyEpB"}
|
|
@@ -0,0 +1,106 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Smooth value interpolation utility for animating between values
|
|
3
|
+
* even with rapid updates. Uses THREE.MathUtils.lerp for optimized interpolation.
|
|
4
|
+
*
|
|
5
|
+
* @example
|
|
6
|
+
* ```tsx
|
|
7
|
+
* // Basic usage with spring-like animation (similar to react-spring)
|
|
8
|
+
* const interpolator = new ValueInterpolator([0, 0, 0], {
|
|
9
|
+
* speed: 0.1, // Interpolation speed (0-1)
|
|
10
|
+
* easing: 'spring', // Spring-like animation with slight overshoot
|
|
11
|
+
* onChange: (values) => {
|
|
12
|
+
* // Update your objects with interpolated values
|
|
13
|
+
* robot.joints.forEach((joint, i) => {
|
|
14
|
+
* joint.rotation.y = values[i]
|
|
15
|
+
* })
|
|
16
|
+
* }
|
|
17
|
+
* })
|
|
18
|
+
*
|
|
19
|
+
* // Different easing options:
|
|
20
|
+
* // 'linear' - smooth linear interpolation
|
|
21
|
+
* // 'spring' - spring-like with overshoot (similar to react-spring)
|
|
22
|
+
* // 'easeOut' - smooth deceleration
|
|
23
|
+
* // 'easeInOut' - smooth acceleration and deceleration
|
|
24
|
+
*
|
|
25
|
+
* // Set new target values
|
|
26
|
+
* interpolator.setTarget([1.5, -0.8, 2.1])
|
|
27
|
+
*
|
|
28
|
+
* // React hook usage
|
|
29
|
+
* function MyComponent() {
|
|
30
|
+
* const [interpolator, currentValues] = useInterpolation([0, 0, 0], {
|
|
31
|
+
* speed: 0.15,
|
|
32
|
+
* easing: 'spring',
|
|
33
|
+
* onChange: (values) => console.log('Values updated:', values)
|
|
34
|
+
* })
|
|
35
|
+
*
|
|
36
|
+
* useEffect(() => {
|
|
37
|
+
* interpolator.setTarget([1, 2, 3])
|
|
38
|
+
* }, [])
|
|
39
|
+
*
|
|
40
|
+
* return <div>Current values: {currentValues.join(', ')}</div>
|
|
41
|
+
* }
|
|
42
|
+
* ```
|
|
43
|
+
*/
|
|
44
|
+
export type EasingFunction = "linear" | "spring" | "easeOut" | "easeInOut";
|
|
45
|
+
export interface InterpolationOptions {
|
|
46
|
+
/** Interpolation speed factor (0-1, where 1 is instant) */
|
|
47
|
+
speed?: number;
|
|
48
|
+
/** Minimum threshold to consider interpolation complete */
|
|
49
|
+
threshold?: number;
|
|
50
|
+
/** Easing function to use for interpolation */
|
|
51
|
+
easing?: EasingFunction;
|
|
52
|
+
/** Callback when values change during interpolation */
|
|
53
|
+
onChange?: (values: number[]) => void;
|
|
54
|
+
/** Callback when interpolation reaches target values */
|
|
55
|
+
onComplete?: (values: number[]) => void;
|
|
56
|
+
}
|
|
57
|
+
export declare class ValueInterpolator {
|
|
58
|
+
private currentValues;
|
|
59
|
+
private targetValues;
|
|
60
|
+
private animationId;
|
|
61
|
+
private options;
|
|
62
|
+
constructor(initialValues?: number[], options?: InterpolationOptions);
|
|
63
|
+
/**
|
|
64
|
+
* Set new target values to interpolate towards
|
|
65
|
+
*/
|
|
66
|
+
setTarget(newValues: number[]): void;
|
|
67
|
+
/**
|
|
68
|
+
* Get the current interpolated values
|
|
69
|
+
*/
|
|
70
|
+
getCurrentValues(): number[];
|
|
71
|
+
/**
|
|
72
|
+
* Get a specific interpolated value by index
|
|
73
|
+
*/
|
|
74
|
+
getValue(index: number): number;
|
|
75
|
+
/**
|
|
76
|
+
* Check if interpolation is currently active
|
|
77
|
+
*/
|
|
78
|
+
isInterpolating(): boolean;
|
|
79
|
+
/**
|
|
80
|
+
* Stop the current interpolation
|
|
81
|
+
*/
|
|
82
|
+
stop(): void;
|
|
83
|
+
/**
|
|
84
|
+
* Instantly set values without interpolation
|
|
85
|
+
*/
|
|
86
|
+
setImmediate(values: number[]): void;
|
|
87
|
+
/**
|
|
88
|
+
* Update interpolation options
|
|
89
|
+
*/
|
|
90
|
+
updateOptions(newOptions: Partial<InterpolationOptions>): void;
|
|
91
|
+
/**
|
|
92
|
+
* Destroy the interpolator and clean up resources
|
|
93
|
+
*/
|
|
94
|
+
destroy(): void;
|
|
95
|
+
/**
|
|
96
|
+
* Apply easing function to the interpolation
|
|
97
|
+
*/
|
|
98
|
+
private applyEasing;
|
|
99
|
+
private startInterpolation;
|
|
100
|
+
private animate;
|
|
101
|
+
}
|
|
102
|
+
/**
|
|
103
|
+
* React hook for using the ValueInterpolator
|
|
104
|
+
*/
|
|
105
|
+
export declare function useInterpolation(initialValues?: number[], options?: InterpolationOptions): [ValueInterpolator, number[]];
|
|
106
|
+
//# sourceMappingURL=interpolation.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"interpolation.d.ts","sourceRoot":"","sources":["../../../src/components/utils/interpolation.ts"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AAEH,MAAM,MAAM,cAAc,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,GAAG,WAAW,CAAA;AAE1E,MAAM,WAAW,oBAAoB;IACnC,2DAA2D;IAC3D,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,2DAA2D;IAC3D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,+CAA+C;IAC/C,MAAM,CAAC,EAAE,cAAc,CAAA;IACvB,uDAAuD;IACvD,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IACrC,wDAAwD;IACxD,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;CACxC;AAED,qBAAa,iBAAiB;IAC5B,OAAO,CAAC,aAAa,CAAe;IACpC,OAAO,CAAC,YAAY,CAAe;IACnC,OAAO,CAAC,WAAW,CAAsB;IACzC,OAAO,CAAC,OAAO,CAAgC;gBAG7C,aAAa,GAAE,MAAM,EAAO,EAC5B,OAAO,GAAE,oBAAyB;IAepC;;OAEG;IACH,SAAS,CAAC,SAAS,EAAE,MAAM,EAAE,GAAG,IAAI;IAcpC;;OAEG;IACH,gBAAgB,IAAI,MAAM,EAAE;IAI5B;;OAEG;IACH,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM;IAI/B;;OAEG;IACH,eAAe,IAAI,OAAO;IAI1B;;OAEG;IACH,IAAI,IAAI,IAAI;IAOZ;;OAEG;IACH,YAAY,CAAC,MAAM,EAAE,MAAM,EAAE,GAAG,IAAI;IAOpC;;OAEG;IACH,aAAa,CAAC,UAAU,EAAE,OAAO,CAAC,oBAAoB,CAAC,GAAG,IAAI;IAI9D;;OAEG;IACH,OAAO,IAAI,IAAI;IAIf;;OAEG;IACH,OAAO,CAAC,WAAW;IA8BnB,OAAO,CAAC,kBAAkB;IAQ1B,OAAO,CAAC,OAAO,CA+Bd;CACF;AAED;;GAEG;AACH,wBAAgB,gBAAgB,CAC9B,aAAa,GAAE,MAAM,EAAO,EAC5B,OAAO,GAAE,oBAAyB,GACjC,CAAC,iBAAiB,EAAE,MAAM,EAAE,CAAC,CA6B/B"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"interpolation.test.d.ts","sourceRoot":"","sources":["../../../src/components/utils/interpolation.test.ts"],"names":[],"mappings":""}
|