variablelab/theatre
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Chore: Moved r3f's transformControls* to Theatre

Browse source
This commit is contained in:
Aria Minaei 2021-07-03 15:04:06 +02:00
parent 4038ad34a4
commit 89913ac51f
3 changed files with 40 additions and 43 deletions
Download patch file Download diff file Expand all files Collapse all files

33
packages/plugin-r3f/src/components/ProxyManager.tsx
View file

@ -18,6 +18,7 @@ import studio from '@theatre/studio'
import type {ISheetObject} from '@theatre/core'
import type {$FixMe} from '../types'
import {useSelected} from './useSelected'
import {useVal} from '@theatre/dataverse-react'
export interface ProxyManagerProps {
orbitControlsRef: React.MutableRefObject<typeof OrbitControls | undefined>
@ -31,22 +32,22 @@ type IEditableProxy = {
const ProxyManager: VFC<ProxyManagerProps> = ({orbitControlsRef}) => {
const isBeingEdited = useRef(false)
const [
sceneSnapshot,
transformControlsMode,
transformControlsSpace,
viewportShading,
sheetObjects,
] = useEditorStore(
(state) => [
state.sceneSnapshot,
state.transformControlsMode,
state.transformControlsSpace,
state.viewportShading,
state.sheetObjects,
],
shallow,
)
const [editorObject, sceneSnapshot, viewportShading, sheetObjects] =
useEditorStore(
(state) => [
state.editorObject,
state.sceneSnapshot,
state.viewportShading,
state.sheetObjects,
],
shallow,
)
const transformControlsMode =
useVal(editorObject?.props.transformControlsMode) ?? 'translate'
const transformControlsSpace =
useVal(editorObject?.props.transformControlsSpace) ?? 'world'
const sceneProxy = useMemo(() => sceneSnapshot?.clone(), [sceneSnapshot])
const [editableProxies, setEditableProxies] = useState<{
[name: string]: IEditableProxy

30
packages/plugin-r3f/src/components/UI.tsx
View file

@ -16,22 +16,10 @@ import {getSelected} from './useSelected'
import {useVal} from '@theatre/dataverse-react'
const UI: VFC = () => {
const [
editorObject,
transformControlsMode,
transformControlsSpace,
viewportShading,
setTransformControlsMode,
setTransformControlsSpace,
setViewportShading,
] = useEditorStore(
const [editorObject, viewportShading, setViewportShading] = useEditorStore(
(state) => [
state.editorObject,
state.transformControlsMode,
state.transformControlsSpace,
state.viewportShading,
state.setTransformControlsMode,
state.setTransformControlsSpace,
state.setViewportShading,
],
shallow,
@ -39,6 +27,10 @@ const UI: VFC = () => {
const referenceWindowSize =
useVal(editorObject?.props.referenceWindowSize) ?? 120
const transformControlsMode =
useVal(editorObject?.props.transformControlsMode) ?? 'translate'
const transformControlsSpace =
useVal(editorObject?.props.transformControlsSpace) ?? 'world'
if (!editorObject) return <></>
@ -51,13 +43,21 @@ const UI: VFC = () => {
<div className="pointer-events-auto">
<TransformControlsModeSelect
value={transformControlsMode}
onChange={(value) => setTransformControlsMode(value)}
onChange={(value) =>
studio.transaction(({set}) =>
set(editorObject!.props.transformControlsMode, value),
)
}
/>
</div>
<div className="pointer-events-auto">
<TransformControlsSpaceSelect
value={transformControlsSpace}
onChange={setTransformControlsSpace}
onChange={(space) => {
studio.transaction(({set}) => {
set(editorObject.props.transformControlsSpace, space)
})
}}
/>
</div>
<div className="pointer-events-auto">