diff --git a/packages/playground/src/shared/theatric/index.tsx b/packages/playground/src/shared/theatric/index.tsx index 27865ab..d9d33ce 100644 --- a/packages/playground/src/shared/theatric/index.tsx +++ b/packages/playground/src/shared/theatric/index.tsx @@ -3,7 +3,7 @@ import {render} from 'react-dom' import React, {useState} from 'react' import state from './state.json' -initialize(state) +initialize({state}) function SomeComponent({id}: {id: string}) { const {foo, $get, $set} = useControls( diff --git a/packages/theatric/src/index.ts b/packages/theatric/src/index.ts index 54b3766..5f2b61f 100644 --- a/packages/theatric/src/index.ts +++ b/packages/theatric/src/index.ts @@ -31,16 +31,16 @@ const maybeTransaction = ? studio.transaction.bind(studio) : () => {} -let _state: IProjectConfig['state'] | undefined = undefined +let _projectConfig: IProjectConfig['state'] | undefined = undefined -export function initialize(state: IProjectConfig['state']) { - if (_state !== undefined) { +export function initialize(config: IProjectConfig) { + if (_projectConfig !== undefined) { console.warn( 'Theatric has already been initialized, either through another initialize call, or by calling useControls() before calling initialize().', ) return } - _state = state + _projectConfig = config } const allProps: Record = {} @@ -81,8 +81,8 @@ export function useControls( $get: Getter> } { // initialize state to null, if it hasn't been initialized yet - if (_state === undefined) { - _state = null + if (_projectConfig === undefined) { + _projectConfig = null } /* @@ -150,7 +150,7 @@ export function useControls( ) const sheet = useMemo( - () => getProject('Theatric', {state: _state}).sheet('Panels'), + () => getProject('Theatric', _projectConfig ?? undefined).sheet('Panels'), [], ) const panel = options.panel ?? 'Default panel'