parent
2232fe5662
commit
0ea4cc2b57
3 changed files with 20 additions and 4 deletions
|
@ -11,7 +11,7 @@ const boxObjectConfig = {
|
||||||
|
|
||||||
const Box = ({id, sheet, selectedObject}) => {
|
const Box = ({id, sheet, selectedObject}) => {
|
||||||
// This is cheap to call and always returns the same value, so no need for useMemo()
|
// This is cheap to call and always returns the same value, so no need for useMemo()
|
||||||
const obj = sheet.object(id, null, boxObjectConfig)
|
const obj = sheet.object(id, boxObjectConfig)
|
||||||
|
|
||||||
const isSelected = selectedObject === obj
|
const isSelected = selectedObject === obj
|
||||||
|
|
||||||
|
@ -38,7 +38,7 @@ const Box = ({id, sheet, selectedObject}) => {
|
||||||
},
|
},
|
||||||
onDrag(x, y) {
|
onDrag(x, y) {
|
||||||
if (!firstOnDragCalled) {
|
if (!firstOnDragCalled) {
|
||||||
studio.__experimental_setSelection([obj])
|
studio.setSelection([obj])
|
||||||
firstOnDragCalled = true
|
firstOnDragCalled = true
|
||||||
}
|
}
|
||||||
scrub.capture(({set}) => {
|
scrub.capture(({set}) => {
|
||||||
|
@ -61,7 +61,7 @@ const Box = ({id, sheet, selectedObject}) => {
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
studio.__experimental_setSelection([obj])
|
studio.setSelection([obj])
|
||||||
}}
|
}}
|
||||||
ref={setDivRef}
|
ref={setDivRef}
|
||||||
style={{
|
style={{
|
||||||
|
@ -88,7 +88,7 @@ const App = ({project}) => {
|
||||||
const [selection, _setSelection] = useState([])
|
const [selection, _setSelection] = useState([])
|
||||||
|
|
||||||
useLayoutEffect(() => {
|
useLayoutEffect(() => {
|
||||||
return studio.__experimental_onSelectionChange((newSelection) => {
|
return studio.onSelectionChange((newSelection) => {
|
||||||
_setSelection(newSelection)
|
_setSelection(newSelection)
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
|
@ -3,6 +3,8 @@ import './index.css'
|
||||||
import reportWebVitals from './reportWebVitals'
|
import reportWebVitals from './reportWebVitals'
|
||||||
import studio from '@theatre/studio'
|
import studio from '@theatre/studio'
|
||||||
import {getProject} from '@theatre/core'
|
import {getProject} from '@theatre/core'
|
||||||
|
import React from 'react'
|
||||||
|
import App from './App'
|
||||||
|
|
||||||
studio.initialize()
|
studio.initialize()
|
||||||
|
|
||||||
|
|
14
examples/dom-cra/tsconfig.json
Normal file
14
examples/dom-cra/tsconfig.json
Normal file
|
@ -0,0 +1,14 @@
|
||||||
|
{
|
||||||
|
"extends": "../../tsconfig.base.json",
|
||||||
|
"compilerOptions": {
|
||||||
|
"outDir": "dist",
|
||||||
|
"lib": ["ESNext", "DOM"],
|
||||||
|
"rootDir": "src",
|
||||||
|
"types": ["jest", "node"],
|
||||||
|
"emitDeclarationOnly": true,
|
||||||
|
"composite": true,
|
||||||
|
"checkJs": true
|
||||||
|
},
|
||||||
|
"references": [{"path": "../../theatre"}],
|
||||||
|
"include": ["./src/**/*"]
|
||||||
|
}
|
Loading…
Reference in a new issue