@tomorrowevening/hermes 0.0.19 → 0.0.21

package/src/editor/multiView/CameraWindow.tsx

@@ -27,11 +27,11 @@ export const Dropdown = (props: DropdownProps) => {
 
   return (
     <div className={`dropdown ${props.up === true ? 'up' : ''}`}>
-      <div className="dropdown-toggle" onClick={handleToggle}>
+      <div className='dropdown-toggle' onClick={handleToggle}>
         {selectedOption}
       </div>
       {props.open && (
-        <ul className="dropdown-menu">
+        <ul className='dropdown-menu'>
           {props.options.map((option) => (
             <li key={option} onClick={() => handleSelect(option)}>
               {option}

package/src/editor/multiView/UVMaterial.ts

@@ -1,4 +1,4 @@
-import { ShaderMaterial } from "three";
+import { ShaderMaterial } from 'three';
 
 const vertex = `#include <common>
 #include <batching_pars_vertex>

package/src/editor/sidePanel/Accordion.tsx

@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useState } from 'react';
 
 type AccordionProps = {
   label: string
@@ -15,7 +15,7 @@ export default function Accordion(props: AccordionProps) {
   return (
     <div className={`accordion ${hide ? 'hide' : ''}`}>
       <button
-        className="toggle"
+        className='toggle'
         onClick={() => {
           const value = !open;
           if (props.onToggle !== undefined) props.onToggle(value);
@@ -27,7 +27,7 @@ export default function Accordion(props: AccordionProps) {
         >
           Toggle
         </p>
-        <p className="label">{props.label}</p>
+        <p className='label'>{props.label}</p>
       </button>
       {props.button}
       <div className={open ? 'open' : ''}>

package/src/editor/sidePanel/ChildObject.tsx

@@ -18,11 +18,11 @@ export default function ChildObject(props: ChildObjectProps) {
   }
 
   return (
-    <div className="childObject" key={Math.random()}>
-      <div className="child">
+    <div className='childObject' key={Math.random()}>
+      <div className='child'>
         {hasChildren ? (
           <button
-            className="status"
+            className='status'
             style={{
               backgroundPositionX: open ? '-14px' : '2px',
             }}
@@ -32,7 +32,7 @@ export default function ChildObject(props: ChildObjectProps) {
           ></button>
         ) : null}
         <button
-          className="name"
+          className='name'
           style={{
             left: hasChildren ? '20px' : '5px',
           }}
@@ -47,7 +47,7 @@ export default function ChildObject(props: ChildObjectProps) {
         <div className={`icon ${determineIcon(props.child)}`}></div>
       </div>
       <div className={open ? 'open' : ''}>
-        <div className="container">
+        <div className='container'>
           {children}
         </div>
       </div>

package/src/editor/sidePanel/SidePanel.tsx

@@ -30,7 +30,7 @@ export default class SidePanel extends Component<SidePanelState> {
     const hasScene = this.componentState.scene !== null;
     const HierarchyName = 'Hierarchy - ' + (hasScene ? `${this.componentState.scene?.name}` : 'No Scene');
     return (
-      <div id="SidePanel" key="SidePanel">
+      <div id='SidePanel' key='SidePanel'>
         {(
           <>
             <Accordion label={HierarchyName} open={true}>

package/src/editor/sidePanel/ToggleBtn.tsx

@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useState } from 'react';
 
 type ToggleBtnProps = {
   expanded: boolean

package/src/editor/sidePanel/inspector/Inspector.tsx

@@ -1,17 +1,17 @@
-import { useEffect, useState } from "react";
-import { CoreComponentProps, RemoteObject } from "../types";
-import { ToolEvents, debugDispatcher } from "../../global";
+import { useEffect, useState } from 'react';
+import { CoreComponentProps, RemoteObject } from '../types';
+import { ToolEvents, debugDispatcher } from '../../global';
 // Components
 import './inspector.scss';
-import Accordion from "../Accordion";
+import Accordion from '../Accordion';
 import InspectorField from './InspectorField';
 // Utils
-import { InspectCamera } from "./utils/InspectCamera";
-import { InspectMaterial } from "./utils/InspectMaterial";
-import { InspectTransform } from "./utils/InspectTransform";
-import { InspectLight } from "./utils/InspectLight";
-import { setItemProps } from "../utils";
-import InspectAnimation from "./utils/InspectAnimation";
+import { InspectCamera } from './utils/InspectCamera';
+import { InspectMaterial } from './utils/InspectMaterial';
+import { InspectTransform } from './utils/InspectTransform';
+import { InspectLight } from './utils/InspectLight';
+import { setItemProps } from '../utils';
+import InspectAnimation from './utils/InspectAnimation';
 
 const defaultObject: RemoteObject = {
   name: '',
@@ -54,36 +54,36 @@ export default function Inspector(props: CoreComponentProps) {
 
   return (
     <Accordion label='Inspector' key='Inspector'>
-      <div id="Inspector" className={props.class} key={lastUpdated}>
+      <div id='Inspector' className={props.class} key={lastUpdated}>
         {currentObject.uuid.length > 0 && (
           <>
             {/* Core */}
             <>
               <InspectorField
-                type="string"
-                title="Name"
-                prop="name"
+                type='string'
+                title='Name'
+                prop='name'
                 value={currentObject.name}
                 disabled={true}
               />
               <InspectorField
-                type="string"
-                title="Type"
-                prop="type"
+                type='string'
+                title='Type'
+                prop='type'
                 value={currentObject.type}
                 disabled={true}
               />
               <InspectorField
-                type="string"
-                title="UUID"
-                prop="uuid"
+                type='string'
+                title='UUID'
+                prop='uuid'
                 value={currentObject.uuid}
                 disabled={true}
               />
               <InspectorField
-                type="boolean"
-                title="Visible"
-                prop="visible"
+                type='boolean'
+                title='Visible'
+                prop='visible'
                 value={currentObject.visible}
                 onChange={(key: string, value: any) => {
                   props.three.updateObject(currentObject.uuid, key, value);

package/src/editor/sidePanel/inspector/InspectorField.tsx

@@ -1,7 +1,7 @@
-import { colorToHex } from "@/editor/utils";
-import { useEffect, useRef, useState } from "react";
-import { noImage } from "@/editor/components/content";
-import { uploadLocalImage } from "./utils/InspectMaterial";
+import { colorToHex } from '@/editor/utils';
+import { useEffect, useRef, useState } from 'react';
+import { noImage } from '@/editor/components/content';
+import { uploadLocalImage } from './utils/InspectMaterial';
 
 export type InspectorFieldType = 'string' | 'number' | 'boolean' | 'range' | 'color' | 'button' | 'image'
 
@@ -89,12 +89,12 @@ export default function InspectorField(props: InspectorFieldProps) {
   return (
     <div className={`field ${block ? 'block' : ''}`}>
       {props.type !== 'button' && (
-        <label key="fieldLabel" ref={labelRef}>{props.title}</label>
+        <label key='fieldLabel' ref={labelRef}>{props.title}</label>
       )}
 
       {props.type === 'string' && !textfield && (
         <input
-          type="text"
+          type='text'
           disabled={props.disabled}
           onChange={onChange}
           value={fieldValue}
@@ -113,7 +113,7 @@ export default function InspectorField(props: InspectorFieldProps) {
 
       {props.type === 'boolean' && (
         <input
-          type="checkbox"
+          type='checkbox'
           disabled={props.disabled}
           onChange={onChange}
           checked={fieldValue}
@@ -123,7 +123,7 @@ export default function InspectorField(props: InspectorFieldProps) {
       {props.type === 'number' && (
         <input
           ref={inputRef}
-          type="number"
+          type='number'
           value={fieldValue}
           min={props.min}
           max={props.max}
@@ -134,10 +134,10 @@ export default function InspectorField(props: InspectorFieldProps) {
       
       {props.type === 'range' && (
         <>
-          <input type="text" value={fieldValue.toString()} onChange={onChange} className="min" />
+          <input type='text' value={fieldValue.toString()} onChange={onChange} className='min' />
           <input
             disabled={props.disabled}
-            type="range"
+            type='range'
             value={fieldValue}
             min={props.min}
             max={props.max}
@@ -149,8 +149,8 @@ export default function InspectorField(props: InspectorFieldProps) {
 
       {props.type === 'color' && (
         <>
-          <input type="text" value={fieldValue.toString()} onChange={onChange} className="color" />
-          <input type="color" value={fieldValue} onChange={onChange} />
+          <input type='text' value={fieldValue.toString()} onChange={onChange} className='color' />
+          <input type='color' value={fieldValue} onChange={onChange} />
         </>
       )}
 

package/src/editor/sidePanel/inspector/SceneInspector.tsx

@@ -1,8 +1,8 @@
-import RemoteThree from "@/core/remote/RemoteThree";
-import { ToolEvents, debugDispatcher } from "@/editor/global";
-import { useEffect } from "react";
-import { Texture } from "three";
-import { setItemProps, textureFromSrc } from "../utils";
+import RemoteThree from '@/core/remote/RemoteThree';
+import { ToolEvents, debugDispatcher } from '@/editor/global';
+import { useEffect } from 'react';
+import { Texture } from 'three';
+import { setItemProps, textureFromSrc } from '../utils';
 
 export interface SceneInspectorProps {
   three: RemoteThree

package/src/editor/sidePanel/inspector/inspector.scss

@@ -39,11 +39,11 @@ $icon_folder: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACcAAAB1CAYAAAD
       }
     }
 
-    input[type="checkbox"] {
+    input[type='checkbox'] {
       flex: none;
     }
 
-    input[type="color"] {
+    input[type='color'] {
       block-size: revert;
       height: 21px;
       padding-block: revert;
@@ -51,16 +51,16 @@ $icon_folder: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACcAAAB1CAYAAAD
       margin: 0;
     }
 
-    input[type="number"], input[type="range"] {
+    input[type='number'], input[type='range'] {
       appearance: none;
       height: 11px;
     }
 
-    input[type="range"]::-webkit-slider-runnable-track {
+    input[type='range']::-webkit-slider-runnable-track {
       border: none;
     }
 
-    input[type="range"]::-webkit-slider-thumb {
+    input[type='range']::-webkit-slider-thumb {
       appearance: none;
       background-color: #666;
       height: 17px;

package/src/editor/sidePanel/inspector/utils/InspectAnimation.tsx

@@ -1,8 +1,8 @@
-import RemoteThree from "@/core/remote/RemoteThree";
-import InspectorGroup from "../InspectorGroup";
+import RemoteThree from '@/core/remote/RemoteThree';
+import InspectorGroup from '../InspectorGroup';
 import { InspectorFieldProps } from '../InspectorField';
 import { AnimationClipInfo, RemoteObject } from '../../types';
-import { setItemProps } from "../../utils";
+import { setItemProps } from '../../utils';
 
 export default function InspectAnimation(obj: RemoteObject, three: RemoteThree) {
   const items: InspectorFieldProps[] = [];
@@ -46,6 +46,6 @@ export default function InspectAnimation(obj: RemoteObject, three: RemoteThree)
     });
   });
   return (
-    <InspectorGroup title="Animations" items={items} />
+    <InspectorGroup title='Animations' items={items} />
   );
 }

package/src/editor/sidePanel/inspector/utils/InspectCamera.tsx

@@ -68,7 +68,7 @@ export function InspectCamera(object: RemoteObject, three: RemoteThree): any {
 
   return (
     <InspectorGroup
-      title="Camera"
+      title='Camera'
       items={items}
     />
   );

package/src/editor/sidePanel/inspector/utils/InspectLight.tsx

@@ -55,7 +55,7 @@ export function InspectLight(obj: RemoteObject, three: RemoteThree) {
   }
   return (
     <InspectorGroup
-      title="Light"
+      title='Light'
       items={items}
     />
   );

package/src/editor/sidePanel/inspector/utils/InspectMaterial.tsx

@@ -1,6 +1,6 @@
 import { Color, Texture } from 'three';
 import InspectorGroup from '../InspectorGroup';
-import { RemoteMaterial, RemoteObject } from "../../types";
+import { RemoteMaterial, RemoteObject } from '../../types';
 import RemoteThree from '@/core/remote/RemoteThree';
 import { setItemProps, textureFromSrc } from '../../utils';
 
@@ -348,7 +348,7 @@ export function InspectMaterial(object: RemoteObject, three: RemoteThree): any {
   } else {
     return (
       <InspectorGroup
-        title="Material"
+        title='Material'
         items={inspectMaterialItems(material, object, three)}
       />
     );

package/src/editor/sidePanel/inspector/utils/InspectTransform.tsx

@@ -1,7 +1,7 @@
 import { Euler, Matrix4, Vector3 } from 'three';
 import { degToRad, radToDeg } from 'three/src/math/MathUtils';
 import InspectorGroup from '../InspectorGroup';
-import { RemoteObject } from "../../types";
+import { RemoteObject } from '../../types';
 import RemoteThree from '@/core/remote/RemoteThree';
 import { setItemProps } from '../../utils';
 import { round } from '@/editor/utils';
@@ -30,7 +30,7 @@ export function InspectTransform(obj: RemoteObject, three: RemoteThree) {
 
   return (
     <InspectorGroup
-      title="Transform"
+      title='Transform'
       items={[
         {
           title: 'Position X',

package/src/editor/utils.ts

@@ -1,4 +1,4 @@
-import { Material, Mesh, Object3D, PositionalAudio, Texture } from "three";
+import { Material, Mesh, Object3D, PositionalAudio, Texture } from 'three';
 
 export function clamp(min: number, max: number, value: number) {
   return Math.min(max, Math.max(min, value));

package/types/core/remote/RemoteTheatre.d.ts

@@ -1,4 +1,4 @@
-import type { IProject, IProjectConfig, ISheet, ISheetObject } from '@theatre/core';
+import type { IProject, IProjectConfig, IRafDriver, ISheet, ISheetObject } from '@theatre/core';
 import Application from '../Application';
 import BaseRemote from './BaseRemote';
 import { BroadcastData } from '../types';
@@ -9,12 +9,14 @@ export default class RemoteTheatre extends BaseRemote {
     sheetObjects: Map<string, ISheetObject>;
     sheetObjectCBs: Map<string, DataUpdateCallback>;
     sheetObjectUnsubscribe: Map<string, VoidCallback>;
-    init(projectName: string, projectConfig?: IProjectConfig | undefined): void;
+    private static rafDriver;
+    init(projectName: string, projectConfig?: IProjectConfig | undefined): Promise<void>;
     dispose(): void;
     sheet(name: string): ISheet | undefined;
     clearSheetObjects(sheetName: string): void;
     sheetObject(sheetName: string, key: string, props: any, onUpdate?: DataUpdateCallback): ISheetObject | undefined;
     unsubscribe(sheetObject: ISheetObject): undefined;
+    static getRafDriver(): IRafDriver;
 }
 export declare function HandleAppRemoteTheatre(app: Application, msg: BroadcastData): void;
 export declare function HandleEditorRemoteTheatre(app: Application): void;

package/types/editor/multiView/UVMaterial.d.ts

@@ -1,4 +1,4 @@
-import { ShaderMaterial } from "three";
+import { ShaderMaterial } from 'three';
 export default class UVMaterial extends ShaderMaterial {
     constructor();
 }

package/types/editor/sidePanel/inspector/Inspector.d.ts

@@ -1,3 +1,3 @@
-import { CoreComponentProps } from "../types";
+import { CoreComponentProps } from '../types';
 import './inspector.scss';
 export default function Inspector(props: CoreComponentProps): import("react/jsx-runtime").JSX.Element;

package/types/editor/sidePanel/inspector/SceneInspector.d.ts

@@ -1,4 +1,4 @@
-import RemoteThree from "@/core/remote/RemoteThree";
+import RemoteThree from '@/core/remote/RemoteThree';
 export interface SceneInspectorProps {
     three: RemoteThree;
 }

package/types/editor/sidePanel/inspector/utils/InspectAnimation.d.ts

@@ -1,3 +1,3 @@
-import RemoteThree from "@/core/remote/RemoteThree";
+import RemoteThree from '@/core/remote/RemoteThree';
 import { RemoteObject } from '../../types';
 export default function InspectAnimation(obj: RemoteObject, three: RemoteThree): import("react/jsx-runtime").JSX.Element;

package/types/editor/sidePanel/inspector/utils/InspectMaterial.d.ts

@@ -1,4 +1,4 @@
-import { RemoteMaterial, RemoteObject } from "../../types";
+import { RemoteMaterial, RemoteObject } from '../../types';
 import RemoteThree from '@/core/remote/RemoteThree';
 export declare function acceptedMaterialNames(name: string): boolean;
 export declare function prettyName(name: string): string;

package/types/editor/sidePanel/inspector/utils/InspectTransform.d.ts

@@ -1,3 +1,3 @@
-import { RemoteObject } from "../../types";
+import { RemoteObject } from '../../types';
 import RemoteThree from '@/core/remote/RemoteThree';
 export declare function InspectTransform(obj: RemoteObject, three: RemoteThree): import("react/jsx-runtime").JSX.Element;

package/types/editor/utils.d.ts

@@ -1,4 +1,4 @@
-import { Material, Object3D, Texture } from "three";
+import { Material, Object3D, Texture } from 'three';
 export declare function clamp(min: number, max: number, value: number): number;
 export declare function distance(x: number, y: number): number;
 export declare function randomID(): string;