@react-three/drei 8.6.1 → 9.0.0-beta.1
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/README.md +35 -35
- package/core/ArcballControls.js +2 -5
- package/core/Billboard.d.ts +2 -2
- package/core/Center.d.ts +1 -1
- package/core/ContactShadows.d.ts +1 -1
- package/core/CubeCamera.cjs.js +1 -1
- package/core/CubeCamera.js +1 -1
- package/core/Detailed.d.ts +1 -1
- package/core/DeviceOrientationControls.d.ts +1 -1
- package/core/Effects.cjs.js +1 -1
- package/core/Effects.d.ts +1 -1
- package/core/Effects.js +2 -2
- package/core/FirstPersonControls.d.ts +1 -1
- package/core/FlyControls.d.ts +1 -1
- package/core/GizmoViewcube.cjs.js +1 -1
- package/core/GizmoViewcube.d.ts +2 -2
- package/core/GizmoViewcube.js +1 -1
- package/core/GizmoViewport.d.ts +2 -2
- package/core/Image.d.ts +1 -1
- package/core/Instances.d.ts +2 -2
- package/core/Line.d.ts +1 -1
- package/core/MapControls.d.ts +1 -1
- package/core/MeshDistortMaterial.d.ts +1 -1
- package/core/MeshReflectorMaterial.d.ts +1 -1
- package/core/MeshWobbleMaterial.d.ts +1 -1
- package/core/OrbitControls.d.ts +1 -1
- package/core/OrbitControls.js +2 -5
- package/core/OrthographicCamera.d.ts +1 -1
- package/core/PerspectiveCamera.d.ts +1 -1
- package/core/PointerLockControls.d.ts +1 -1
- package/core/Points.cjs.js +1 -1
- package/core/Points.d.ts +2 -2
- package/core/Points.js +6 -6
- package/core/PositionalAudio.d.ts +1 -1
- package/core/Reflector.d.ts +1 -1
- package/core/RoundedBox.d.ts +1 -1
- package/core/ScreenQuad.d.ts +1 -1
- package/core/Segments.d.ts +1 -1
- package/core/Shadow.d.ts +1 -1
- package/core/SpotLight.d.ts +1 -1
- package/core/Stars.cjs.js +1 -1
- package/core/Stars.js +3 -3
- package/core/Text.d.ts +1 -1
- package/core/TrackballControls.d.ts +1 -1
- package/core/TrackballControls.js +2 -5
- package/core/TransformControls.d.ts +1 -1
- package/core/shapes.d.ts +17 -17
- package/core/useFBX.d.ts +1 -1
- package/core/useFBX.js +1 -2
- package/core/useGLTF.d.ts +1 -1
- package/core/useGLTF.js +1 -2
- package/core/useKTX2.d.ts +1 -1
- package/core/useKTX2.js +1 -2
- package/core/useTexture.d.ts +1 -1
- package/core/useTexture.js +1 -2
- package/index.cjs.js +1 -1
- package/package.json +4 -4
- package/web/Html.cjs.js +1 -1
- package/web/Html.js +6 -4
- package/web/Select.js +0 -1
package/web/Html.js
CHANGED
|
@@ -126,7 +126,9 @@ const Html = /*#__PURE__*/React.forwardRef(({
|
|
|
126
126
|
const raycaster = useThree(({
|
|
127
127
|
raycaster
|
|
128
128
|
}) => raycaster);
|
|
129
|
-
const [el] = React.useState(() => document.createElement(as));
|
|
129
|
+
const [el] = React.useState(() => document.createElement(as)); // @ts-expect-error React 18 types aren't available yet
|
|
130
|
+
|
|
131
|
+
const root = React.useMemo(() => ReactDOM.createRoot(el), [el]);
|
|
130
132
|
const group = React.useRef(null);
|
|
131
133
|
const oldZoom = React.useRef(0);
|
|
132
134
|
const oldPosition = React.useRef([0, 0]);
|
|
@@ -150,7 +152,7 @@ const Html = /*#__PURE__*/React.forwardRef(({
|
|
|
150
152
|
|
|
151
153
|
return () => {
|
|
152
154
|
if (target) target.removeChild(el);
|
|
153
|
-
|
|
155
|
+
root.unmount();
|
|
154
156
|
};
|
|
155
157
|
}
|
|
156
158
|
}, [target, transform]);
|
|
@@ -188,7 +190,7 @@ const Html = /*#__PURE__*/React.forwardRef(({
|
|
|
188
190
|
}), [pointerEvents]);
|
|
189
191
|
React.useLayoutEffect(() => {
|
|
190
192
|
if (transform) {
|
|
191
|
-
|
|
193
|
+
root.render( /*#__PURE__*/React.createElement("div", {
|
|
192
194
|
ref: transformOuterRef,
|
|
193
195
|
style: styles
|
|
194
196
|
}, /*#__PURE__*/React.createElement("div", {
|
|
@@ -201,7 +203,7 @@ const Html = /*#__PURE__*/React.forwardRef(({
|
|
|
201
203
|
children: children
|
|
202
204
|
}))), el);
|
|
203
205
|
} else {
|
|
204
|
-
|
|
206
|
+
root.render( /*#__PURE__*/React.createElement("div", {
|
|
205
207
|
ref: ref,
|
|
206
208
|
style: styles,
|
|
207
209
|
className: className,
|