Group editor's props into compound props (r3f)
This commit is contained in:
parent
47ca0a10f3
commit
230225ed2c
5 changed files with 49 additions and 37 deletions
|
@ -43,7 +43,8 @@ const EditableProxy: VFC<EditableProxyProps> = ({
|
|||
)
|
||||
|
||||
const selected = useSelected()
|
||||
const showOverlayIcons = useVal(editorObject?.props.showOverlayIcons) ?? false
|
||||
const showOverlayIcons =
|
||||
useVal(editorObject?.props.viewport.showOverlayIcons) ?? false
|
||||
|
||||
useEffect(() => {
|
||||
setSnapshotProxyObject(object, uniqueName)
|
||||
|
|
|
@ -43,8 +43,8 @@ const EditorScene = () => {
|
|||
shallow,
|
||||
)
|
||||
|
||||
const showGrid = useVal(editorObject?.props.showGrid) ?? true
|
||||
const showAxes = useVal(editorObject?.props.showAxes) ?? true
|
||||
const showGrid = useVal(editorObject?.props.viewport.showGrid) ?? true
|
||||
const showAxes = useVal(editorObject?.props.viewport.showAxes) ?? true
|
||||
|
||||
useEffect(() => {
|
||||
setOrbitControlsRef(orbitControlsRef)
|
||||
|
|
|
@ -37,13 +37,13 @@ const ProxyManager: VFC<ProxyManagerProps> = ({orbitControlsRef}) => {
|
|||
shallow,
|
||||
)
|
||||
const transformControlsMode =
|
||||
useVal(editorObject?.props.transformControlsMode) ?? 'translate'
|
||||
useVal(editorObject?.props.transformControls.mode) ?? 'translate'
|
||||
|
||||
const transformControlsSpace =
|
||||
useVal(editorObject?.props.transformControlsSpace) ?? 'world'
|
||||
useVal(editorObject?.props.transformControls.space) ?? 'world'
|
||||
|
||||
const viewportShading =
|
||||
useVal(editorObject?.props.viewportShading) ?? 'rendered'
|
||||
useVal(editorObject?.props.viewport.shading) ?? 'rendered'
|
||||
|
||||
const sceneProxy = useMemo(() => sceneSnapshot?.clone(), [sceneSnapshot])
|
||||
const [editableProxies, setEditableProxies] = useState<{
|
||||
|
|
|
@ -53,11 +53,11 @@ const UI: VFC = () => {
|
|||
)
|
||||
|
||||
const transformControlsMode =
|
||||
useVal(editorObject?.props.transformControlsMode) ?? 'translate'
|
||||
useVal(editorObject?.props.transformControls.mode) ?? 'translate'
|
||||
const transformControlsSpace =
|
||||
useVal(editorObject?.props.transformControlsSpace) ?? 'world'
|
||||
useVal(editorObject?.props.transformControls.space) ?? 'world'
|
||||
const viewportShading =
|
||||
useVal(editorObject?.props.viewportShading) ?? 'rendered'
|
||||
useVal(editorObject?.props.viewport.shading) ?? 'rendered'
|
||||
|
||||
const [wrapper, setWrapper] = useState<null | HTMLDivElement>(null)
|
||||
|
||||
|
@ -73,7 +73,7 @@ const UI: VFC = () => {
|
|||
value={transformControlsMode}
|
||||
onChange={(value) =>
|
||||
studio.transaction(({set}) =>
|
||||
set(editorObject!.props.transformControlsMode, value),
|
||||
set(editorObject!.props.transformControls.mode, value),
|
||||
)
|
||||
}
|
||||
/>
|
||||
|
@ -83,7 +83,7 @@ const UI: VFC = () => {
|
|||
value={transformControlsSpace}
|
||||
onChange={(space) => {
|
||||
studio.transaction(({set}) => {
|
||||
set(editorObject.props.transformControlsSpace, space)
|
||||
set(editorObject.props.transformControls.space, space)
|
||||
})
|
||||
}}
|
||||
/>
|
||||
|
@ -93,7 +93,7 @@ const UI: VFC = () => {
|
|||
value={viewportShading}
|
||||
onChange={(shading) => {
|
||||
studio.transaction(({set}) => {
|
||||
set(editorObject.props.viewportShading, shading)
|
||||
set(editorObject.props.viewport.shading, shading)
|
||||
})
|
||||
}}
|
||||
/>
|
||||
|
|
|
@ -289,28 +289,14 @@ export type BindFunction = (options: {
|
|||
}) => (options: {gl: WebGLRenderer; scene: Scene}) => void
|
||||
|
||||
const editorSheetObjectConfig = types.compound({
|
||||
isOpen: types.boolean(false),
|
||||
showAxes: types.boolean(true),
|
||||
showGrid: types.boolean(true),
|
||||
showOverlayIcons: types.boolean(false),
|
||||
transformControlsMode: types.stringLiteral(
|
||||
'translate',
|
||||
isOpen: types.boolean(false, {label: 'Editor Open'}),
|
||||
viewport: types.compound(
|
||||
{
|
||||
translate: 'Translate',
|
||||
rotate: 'Rotate',
|
||||
scale: 'Scale',
|
||||
},
|
||||
{as: 'switch'},
|
||||
),
|
||||
transformControlsSpace: types.stringLiteral(
|
||||
'world',
|
||||
{
|
||||
local: 'Local',
|
||||
world: 'World',
|
||||
},
|
||||
{as: 'switch'},
|
||||
),
|
||||
viewportShading: types.stringLiteral(
|
||||
showAxes: types.boolean(true, {label: 'Axes'}),
|
||||
showGrid: types.boolean(true, {label: 'Grid'}),
|
||||
showOverlayIcons: types.boolean(false, {label: 'Overlay Icons'}),
|
||||
resolution: types.number(1440, {label: 'Resolution'}),
|
||||
shading: types.stringLiteral(
|
||||
'rendered',
|
||||
{
|
||||
flat: 'Flat',
|
||||
|
@ -318,7 +304,32 @@ const editorSheetObjectConfig = types.compound({
|
|||
solid: 'Solid',
|
||||
wireframe: 'Wireframe',
|
||||
},
|
||||
{as: 'menu'},
|
||||
{as: 'menu', label: 'Shading'},
|
||||
),
|
||||
},
|
||||
{label: 'Viewport Config'},
|
||||
),
|
||||
transformControls: types.compound(
|
||||
{
|
||||
mode: types.stringLiteral(
|
||||
'translate',
|
||||
{
|
||||
translate: 'Translate',
|
||||
rotate: 'Rotate',
|
||||
scale: 'Scale',
|
||||
},
|
||||
{as: 'switch', label: 'Mode'},
|
||||
),
|
||||
space: types.stringLiteral(
|
||||
'world',
|
||||
{
|
||||
local: 'Local',
|
||||
world: 'World',
|
||||
},
|
||||
{as: 'switch', label: 'Space'},
|
||||
),
|
||||
},
|
||||
{label: 'Transform Controls'},
|
||||
),
|
||||
})
|
||||
|
||||
|
|
Loading…
Reference in a new issue