More progress on shorthand types

packages/playground/src/dom/Scene.tsx

@@ -3,15 +3,14 @@ import type {UseDragOpts} from './useDrag'
 import useDrag from './useDrag'
 import React, {useLayoutEffect, useMemo, useState} from 'react'
 import type {IProject, ISheet} from '@theatre/core'
-import {types as t} from '@theatre/core'
 import type {IScrub, IStudio} from '@theatre/studio'
 
 studio.initialize()
 
-const boxObjectConfig = t.compound({
-  x: t.number(0),
-  y: t.number(0),
-})
+const boxObjectConfig = {
+  x: 0,
+  y: 0,
+}
 
 const Box: React.FC<{
   id: string

packages/playground/src/redesign/Scene.tsx

@@ -3,28 +3,27 @@ import useDrag from '@theatre/studio/uiComponents/useDrag'
 import React, {useLayoutEffect, useMemo, useState} from 'react'
 import studio from '@theatre/studio'
 import type {IProject, ISheet} from '@theatre/core'
-import {types as t} from '@theatre/core'
 import type {IScrub, IStudio} from '@theatre/studio'
 
 studio.initialize()
 
-const boxObjectConfig = t.compound({
-  position: t.compound({
-    x: t.number(0),
-    y: t.number(0),
-    z: t.number(0),
-  }),
-  scale: t.compound({
-    x: t.number(0),
-    y: t.number(0),
-    z: t.number(0),
-    origin: t.compound({
-      x: t.number(0),
-      y: t.number(0),
-    }),
-    w: t.number(0),
-  }),
-})
+const boxObjectConfig = {
+  position: {
+    x: 0,
+    y: 0,
+    z: 0,
+  },
+  scale: {
+    x: 0,
+    y: 0,
+    z: 0,
+    origin: {
+      x: 0,
+      y: 0,
+    },
+    w: 0,
+  },
+}
 
 const Box: React.FC<{
   id: string

packages/playground/src/turtle/TurtleRenderer.tsx

@@ -15,13 +15,13 @@ import {drawTurtlePlan, makeTurtlePlan} from './turtle'
 
 studio.initialize()
 
-const objConfig = types.compound({
-  startingPoint: types.compound({
+const objConfig = {
+  startingPoint: {
     x: types.number(0.5, {range: [0, 1]}),
     y: types.number(0.5, {range: [0, 1]}),
-  }),
+  },
   scale: types.number(1, {range: [0.1, 1000]}),
-})
+}
 
 const TurtleRenderer: React.FC<{
   sheet: ISheet

packages/r3f/src/components/editorStuff.ts

@@ -6,7 +6,7 @@ let sheet: ISheet | undefined = undefined
 let sheetObject: ISheetObject<typeof editorSheetObjectConfig> | undefined =
   undefined
 
-const editorSheetObjectConfig = types.compound({
+const editorSheetObjectConfig = {
   viewport: types.compound(
     {
       showAxes: types.boolean(true, {label: 'Axes'}),
@@ -47,7 +47,7 @@ const editorSheetObjectConfig = types.compound({
     },
     {label: 'Transform Controls'},
   ),
-})
+}
 
 export function getEditorSheet(): ISheet {
   if (!sheet) {

packages/r3f/src/components/useSelected.tsx

@@ -2,6 +2,7 @@ import {useLayoutEffect, useRef, useState} from 'react'
 import {allRegisteredObjects} from '../store'
 import studio from '@theatre/studio'
 import type {ISheetObject} from '@theatre/core'
+import type {$IntentionalAny} from '../types'
 
 export function useSelected(): undefined | string {
   const [state, set] = useState<string | undefined>(undefined)
@@ -13,7 +14,7 @@ export function useSelected(): undefined | string {
       const item = selection.find(
         (s): s is ISheetObject =>
           s.type === 'Theatre_SheetObject_PublicAPI' &&
-          allRegisteredObjects.has(s),
+          allRegisteredObjects.has(s as $IntentionalAny),
       )
       if (!item) {
         set(undefined)
@@ -31,7 +32,8 @@ export function useSelected(): undefined | string {
 export function getSelected(): undefined | string {
   const item = studio.selection.find(
     (s): s is ISheetObject =>
-      s.type === 'Theatre_SheetObject_PublicAPI' && allRegisteredObjects.has(s),
+      s.type === 'Theatre_SheetObject_PublicAPI' &&
+      allRegisteredObjects.has(s as $IntentionalAny),
   )
   if (!item) {
     return undefined

packages/r3f/src/components/useSnapshotEditorCamera.tsx

@@ -11,20 +11,20 @@ import {types} from '@theatre/core'
 import type {ISheetObject} from '@theatre/core'
 import {useThree} from '@react-three/fiber'
 
-const camConf = types.compound({
-  transform: types.compound({
-    position: types.compound({
+const camConf = {
+  transform: {
+    position: {
       x: types.number(10),
       y: types.number(10),
       z: types.number(0),
-    }),
-    target: types.compound({
+    },
+    target: {
       x: types.number(0),
       y: types.number(0),
       z: types.number(0),
-    }),
-  }),
-  lens: types.compound({
+    },
+  },
+  lens: {
     zoom: types.number(1, {range: [0.0001, 10]}),
     fov: types.number(50, {range: [1, 1000]}),
     near: types.number(0.1, {range: [0, Infinity]}),
@@ -32,8 +32,8 @@ const camConf = types.compound({
     focus: types.number(10, {range: [0, Infinity]}),
     filmGauge: types.number(35, {range: [0, Infinity]}),
     filmOffset: types.number(0, {range: [0, Infinity]}),
-  }),
-})
+  },
+}
 
 export default function useSnapshotEditorCamera(
   snapshotEditorSheet: ISheet,
@@ -144,7 +144,9 @@ function usePassValuesFromTheatreToCamera(
     if (!cam || orbitControls === null) return
 
     const obj = objRef.current!
-    const setFromTheatre = (props: typeof camConf['valueType']): void => {
+    const setFromTheatre = (
+      props: ISheetObject<typeof camConf>['value'],
+    ): void => {
       const {position, target} = props.transform
       cam.zoom = props.lens.zoom
       cam.fov = props.lens.fov

packages/r3f/src/store.ts

@@ -22,23 +22,23 @@ const positionComp = types.number(1, {nudgeMultiplier: 0.1})
 const rotationComp = types.number(1, {nudgeMultiplier: 0.02})
 const scaleComp = types.number(1, {nudgeMultiplier: 0.1})
 
-export const baseSheetObjectType = types.compound({
-  position: types.compound({
+export const baseSheetObjectType = {
+  position: {
     x: positionComp,
     y: positionComp,
     z: positionComp,
-  }),
-  rotation: types.compound({
+  },
+  rotation: {
     x: rotationComp,
     y: rotationComp,
     z: rotationComp,
-  }),
-  scale: types.compound({
+  },
+  scale: {
     x: scaleComp,
     y: scaleComp,
     z: scaleComp,
-  }),
-})
+  },
+}
 
 export type BaseSheetObjectType = ISheetObject<typeof baseSheetObjectType>