@arcanejs/react-toolkit 0.6.1 → 0.8.0

package/dist/colors.js

@@ -2,7 +2,8 @@
 
 
 
-var _chunkRKOUSLUWjs = require('./chunk-RKOUSLUW.js');
+var _chunkHM5MCE4Yjs = require('./chunk-HM5MCE4Y.js');
+require('./chunk-RT2VSMJL.js');
 
 // src/colors.tsx
 var _react = require('react');
@@ -55,10 +56,10 @@ var HslColorPicker = ({
     },
     [onChange]
   );
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkRKOUSLUWjs.Group, { ...DEFAULT_GROUP_PROPS, ...groupProps, children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkRKOUSLUWjs.Rect, { color: `hsl(${hue}deg ${saturation}% ${lightness}% / ${alpha})` }),
+  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunkHM5MCE4Yjs.Group, { ...DEFAULT_GROUP_PROPS, ...groupProps, children: [
+    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkHM5MCE4Yjs.Rect, { color: `hsl(${hue}deg ${saturation}% ${lightness}% / ${alpha})` }),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkRKOUSLUWjs.SliderButton,
+      _chunkHM5MCE4Yjs.SliderButton,
       {
         value: hue,
         onChange: setHue,
@@ -70,7 +71,7 @@ var HslColorPicker = ({
       }
     ),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkRKOUSLUWjs.SliderButton,
+      _chunkHM5MCE4Yjs.SliderButton,
       {
         value: saturation,
         onChange: setSat,
@@ -86,7 +87,7 @@ var HslColorPicker = ({
       }
     ),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkRKOUSLUWjs.SliderButton,
+      _chunkHM5MCE4Yjs.SliderButton,
       {
         value: lightness,
         onChange: setLightness,
@@ -102,7 +103,7 @@ var HslColorPicker = ({
       }
     ),
     showAlpha && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunkRKOUSLUWjs.SliderButton,
+      _chunkHM5MCE4Yjs.SliderButton,
       {
         value: alpha,
         onChange: setAlpha,

package/dist/colors.mjs

@@ -2,7 +2,8 @@ import {
   Group,
   Rect,
   SliderButton
-} from "./chunk-HVMRFXJ2.mjs";
+} from "./chunk-4MWL22HM.mjs";
+import "./chunk-TOGR56FN.mjs";
 
 // src/colors.tsx
 import { useCallback } from "react";

package/dist/data.d.mts

@@ -24,6 +24,20 @@ type ProviderProps = DataFileUsage & {
 type DataFileUpdater<T> = (update: (current: T) => T) => void;
 type DataFileContext<T> = {
     data: T;
+    /**
+     * Last timestamp where {@link DataFileContext.data data} was updated
+     * in-memory.
+     *
+     * **Note: This is not the last time the data was saved to disk.**
+     * More specifically:
+     * - If the data has been loaded from disk and not changed,
+     *   then this will be the timestamp that it was loaded from disk.
+     * - If the data has been updated since first loaded into memory,
+     *   then this will be the timestamp of the last update.
+     *
+     * Uses the local timestamp in milliseconds, i.e. `Date.now()`.
+     */
+    lastUpdatedMillis: number;
     updateData: DataFileUpdater<T>;
     /**
      * Can be called to force an attempt to re-save the data to disk
@@ -54,6 +68,8 @@ declare function useDataFileContext<T>(dataFile: DataFileDefinition<T>): DataFil
  */
 declare function useDataFile<T>(dataFile: DataFileDefinition<T>, usage: DataFileUsage): DataFileCore<T>;
 type DataState<T> = {
+    lastUpdatedMillis: number;
+} & ({
     status: 'loading';
     /**
      * The data is not yet loaded, so this will be undefined,
@@ -72,7 +88,7 @@ type DataState<T> = {
 } | {
     status: 'ready';
     data: T;
-};
+});
 type UseDataFileCoreProps<T> = WithPathChange & {
     schema: ZodType<T>;
     defaultValue: T;

package/dist/data.d.ts

@@ -24,6 +24,20 @@ type ProviderProps = DataFileUsage & {
 type DataFileUpdater<T> = (update: (current: T) => T) => void;
 type DataFileContext<T> = {
     data: T;
+    /**
+     * Last timestamp where {@link DataFileContext.data data} was updated
+     * in-memory.
+     *
+     * **Note: This is not the last time the data was saved to disk.**
+     * More specifically:
+     * - If the data has been loaded from disk and not changed,
+     *   then this will be the timestamp that it was loaded from disk.
+     * - If the data has been updated since first loaded into memory,
+     *   then this will be the timestamp of the last update.
+     *
+     * Uses the local timestamp in milliseconds, i.e. `Date.now()`.
+     */
+    lastUpdatedMillis: number;
     updateData: DataFileUpdater<T>;
     /**
      * Can be called to force an attempt to re-save the data to disk
@@ -54,6 +68,8 @@ declare function useDataFileContext<T>(dataFile: DataFileDefinition<T>): DataFil
  */
 declare function useDataFile<T>(dataFile: DataFileDefinition<T>, usage: DataFileUsage): DataFileCore<T>;
 type DataState<T> = {
+    lastUpdatedMillis: number;
+} & ({
     status: 'loading';
     /**
      * The data is not yet loaded, so this will be undefined,
@@ -72,7 +88,7 @@ type DataState<T> = {
 } | {
     status: 'ready';
     data: T;
-};
+});
 type UseDataFileCoreProps<T> = WithPathChange & {
     schema: ZodType<T>;
     defaultValue: T;

package/dist/data.js

@@ -39,6 +39,7 @@ function useDataFileCore({
     path: null,
     data: void 0,
     previousData: void 0,
+    lastUpdatedMillis: Date.now(),
     state: {
       state: "saved"
     }
@@ -53,6 +54,7 @@ function useDataFileCore({
     }
   }, [schema, defaultValue]);
   const [data, setData] = _react.useState.call(void 0, {
+    lastUpdatedMillis: state.current.lastUpdatedMillis,
     status: "loading",
     data: void 0
   });
@@ -61,6 +63,7 @@ function useDataFileCore({
       const data2 = state.current.data;
       if (state.current.state.state === "error") {
         setData({
+          lastUpdatedMillis: state.current.lastUpdatedMillis,
           status: "error",
           error: state.current.state.error,
           data: data2
@@ -69,12 +72,14 @@ function useDataFileCore({
       }
       if (data2 === void 0) {
         setData({
+          lastUpdatedMillis: state.current.lastUpdatedMillis,
           status: "loading",
           data: void 0
         });
         return;
       }
       setData({
+        lastUpdatedMillis: state.current.lastUpdatedMillis,
         status: "ready",
         data: data2
       });
@@ -131,6 +136,7 @@ function useDataFileCore({
       const parsedData = schema.parse(JSON.parse(data2));
       if (state.current.path === path) {
         state.current.data = parsedData;
+        state.current.lastUpdatedMillis = Date.now();
         state.current.state = { state: "saved" };
         updateDataFromState();
       }
@@ -141,6 +147,7 @@ function useDataFileCore({
       if (error.code === "ENOENT") {
         const initialData = onPathChange === "transfer" && state.current.previousData !== void 0 ? state.current.previousData : defaultValue;
         state.current.data = initialData;
+        state.current.lastUpdatedMillis = Date.now();
         state.current.state = { state: "dirty" };
         _optionalChain([log, 'optionalAccess', _ => _.info, 'call', _2 => _2(
           "Creating a new file at %s with initial data %o",
@@ -164,6 +171,7 @@ function useDataFileCore({
         throw new Error("Attempt to update data before it has been loaded");
       }
       state.current.data = update(state.current.data);
+      state.current.lastUpdatedMillis = Date.now();
       state.current.state = { state: "dirty" };
       saveData();
       updateDataFromState();
@@ -182,6 +190,7 @@ function createDataFileDefinition({
 }) {
   const context = _react.createContext.call(void 0, {
     data: defaultValue,
+    lastUpdatedMillis: Date.now(),
     updateData: () => {
       throw new Error("Data file provider not used");
     },
@@ -207,6 +216,7 @@ function createDataFileDefinition({
     const providedContext = _react.useMemo.call(void 0, 
       () => ({
         data: data.status !== "loading" && data.data !== void 0 ? data.data : defaultValue,
+        lastUpdatedMillis: data.lastUpdatedMillis,
         updateData,
         saveData,
         error: data.status === "error" ? data.error : void 0

package/dist/data.mjs

@@ -39,6 +39,7 @@ function useDataFileCore({
     path: null,
     data: void 0,
     previousData: void 0,
+    lastUpdatedMillis: Date.now(),
     state: {
       state: "saved"
     }
@@ -53,6 +54,7 @@ function useDataFileCore({
     }
   }, [schema, defaultValue]);
   const [data, setData] = useState({
+    lastUpdatedMillis: state.current.lastUpdatedMillis,
     status: "loading",
     data: void 0
   });
@@ -61,6 +63,7 @@ function useDataFileCore({
       const data2 = state.current.data;
       if (state.current.state.state === "error") {
         setData({
+          lastUpdatedMillis: state.current.lastUpdatedMillis,
           status: "error",
           error: state.current.state.error,
           data: data2
@@ -69,12 +72,14 @@ function useDataFileCore({
       }
       if (data2 === void 0) {
         setData({
+          lastUpdatedMillis: state.current.lastUpdatedMillis,
           status: "loading",
           data: void 0
         });
         return;
       }
       setData({
+        lastUpdatedMillis: state.current.lastUpdatedMillis,
         status: "ready",
         data: data2
       });
@@ -131,6 +136,7 @@ function useDataFileCore({
       const parsedData = schema.parse(JSON.parse(data2));
       if (state.current.path === path) {
         state.current.data = parsedData;
+        state.current.lastUpdatedMillis = Date.now();
         state.current.state = { state: "saved" };
         updateDataFromState();
       }
@@ -141,6 +147,7 @@ function useDataFileCore({
       if (error.code === "ENOENT") {
         const initialData = onPathChange === "transfer" && state.current.previousData !== void 0 ? state.current.previousData : defaultValue;
         state.current.data = initialData;
+        state.current.lastUpdatedMillis = Date.now();
         state.current.state = { state: "dirty" };
         log?.info(
           "Creating a new file at %s with initial data %o",
@@ -164,6 +171,7 @@ function useDataFileCore({
         throw new Error("Attempt to update data before it has been loaded");
       }
       state.current.data = update(state.current.data);
+      state.current.lastUpdatedMillis = Date.now();
       state.current.state = { state: "dirty" };
       saveData();
       updateDataFromState();
@@ -182,6 +190,7 @@ function createDataFileDefinition({
 }) {
   const context = createContext({
     data: defaultValue,
+    lastUpdatedMillis: Date.now(),
     updateData: () => {
       throw new Error("Data file provider not used");
     },
@@ -207,6 +216,7 @@ function createDataFileDefinition({
     const providedContext = useMemo(
       () => ({
         data: data.status !== "loading" && data.data !== void 0 ? data.data : defaultValue,
+        lastUpdatedMillis: data.lastUpdatedMillis,
         updateData,
         saveData,
         error: data.status === "error" ? data.error : void 0

package/dist/index.d.mts

@@ -1,32 +1,94 @@
+import * as _arcanejs_protocol_core from '@arcanejs/protocol/core';
+import * as _arcanejs_protocol_styles from '@arcanejs/protocol/styles';
+import * as _arcanejs_toolkit_components_group from '@arcanejs/toolkit/components/group';
+import { Props } from '@arcanejs/toolkit/components/group';
+import * as _arcanejs_toolkit_components_button from '@arcanejs/toolkit/components/button';
+import React__default from 'react';
 import * as ld from '@arcanejs/toolkit';
-import { Group as Group$1, GroupHeader as GroupHeader$1, Props } from '@arcanejs/toolkit/components/group';
-import { L as LightDeskIntrinsicElements } from './types-D0Wa4a4d.mjs';
-import * as React from 'react';
-import { Button as Button$1 } from '@arcanejs/toolkit/components/button';
-import { Label as Label$1 } from '@arcanejs/toolkit/components/label';
-import { Rect as Rect$1 } from '@arcanejs/toolkit/components/rect';
-import { SliderButton as SliderButton$1 } from '@arcanejs/toolkit/components/slider-button';
-import { Switch as Switch$1 } from '@arcanejs/toolkit/components/switch';
-import { Tab as Tab$1, Tabs as Tabs$1 } from '@arcanejs/toolkit/components/tabs';
-import { Timeline as Timeline$1 } from '@arcanejs/toolkit/components/timeline';
-import { TextInput as TextInput$1 } from '@arcanejs/toolkit/components/text-input';
+import { AnyComponent, BaseParent, Base } from '@arcanejs/toolkit/components/base';
 
-type ComponentWithRef<T, P> = React.ForwardRefExoticComponent<React.PropsWithoutRef<P> & React.RefAttributes<T>>;
-declare const Button: ComponentWithRef<Button$1, LightDeskIntrinsicElements['button']>;
-declare const Group: ComponentWithRef<Group$1, LightDeskIntrinsicElements['group']>;
-declare const GroupHeader: ComponentWithRef<GroupHeader$1, LightDeskIntrinsicElements['group-header']>;
-declare const Label: ComponentWithRef<Label$1, LightDeskIntrinsicElements['label']>;
-declare const Rect: ComponentWithRef<Rect$1, LightDeskIntrinsicElements['rect']>;
-declare const SliderButton: ComponentWithRef<SliderButton$1, LightDeskIntrinsicElements['slider-button']>;
-declare const Switch: ComponentWithRef<Switch$1, LightDeskIntrinsicElements['switch']>;
-declare const Tab: ComponentWithRef<Tab$1, LightDeskIntrinsicElements['tab']>;
-declare const Tabs: ComponentWithRef<Tabs$1, LightDeskIntrinsicElements['tabs']>;
-declare const TextInput: ComponentWithRef<TextInput$1, LightDeskIntrinsicElements['text-input']>;
-declare const Timeline: ComponentWithRef<Timeline$1, LightDeskIntrinsicElements['timeline']>;
+type ComponentClass = new (...args: any[]) => AnyComponent;
+type ComponentsDefinition = {
+    [key: string]: ComponentClass;
+};
+type Child = JSX.Element | null | undefined | false | string;
+type Children = Child | Child[];
+type PropsOfComponent<T extends ComponentClass> = T extends new (props?: infer P) => BaseParent<any, any, any> ? Partial<P & {
+    children: Children;
+}> : T extends new (props: infer P) => BaseParent<any, any, any> ? P & {
+    children?: Children;
+} : T extends new (props?: infer P) => Base<any, any, any> ? Partial<P> : T extends new (props: infer P) => Base<any, any, any> ? P : never;
+type InstanceType<T extends ComponentClass> = T extends new (...args: any[]) => infer R ? R : never;
+type Creators<D extends ComponentsDefinition> = {
+    [K in keyof D]: (props: {
+        [key: string]: any;
+    }) => AnyComponent;
+};
+type ComponentFunctionForComponent<T extends ComponentClass> = React__default.ForwardRefExoticComponent<React__default.PropsWithoutRef<PropsOfComponent<T>> & React__default.RefAttributes<InstanceType<T>>>;
+type ComponentFunctions<D extends ComponentsDefinition> = {
+    [K in keyof D]: ComponentFunctionForComponent<D[K]>;
+};
+type PreparedComponents<D extends ComponentsDefinition> = {
+    _namespace: string;
+    _creators: Creators<D>;
+} & ComponentFunctions<D>;
+declare const prepareComponents: <D extends ComponentsDefinition>(namespace: string, defn: D) => PreparedComponents<D>;
 
+type ReactToolkitConfig = {
+    componentNamespaces: Array<PreparedComponents<any>>;
+};
 declare const ToolkitRenderer: {
-    renderGroup: (component: JSX.Element, container: ld.Group) => void;
-    render: (component: JSX.Element, container: ld.Toolkit, rootGroupProps?: Props) => void;
+    renderGroup: (component: JSX.Element, container: ld.Group, config?: ReactToolkitConfig) => void;
+    render: (component: JSX.Element, container: ld.Toolkit, rootGroupProps?: Props, config?: ReactToolkitConfig) => void;
 };
 
-export { Button, Group, GroupHeader, Label, LightDeskIntrinsicElements, Rect, SliderButton, Switch, Tab, Tabs, TextInput, Timeline, ToolkitRenderer };
+declare const Button: React__default.ForwardRefExoticComponent<Partial<Partial<_arcanejs_toolkit_components_button.InternalProps>> & React__default.RefAttributes<ld.Button>>;
+declare const Group: React__default.ForwardRefExoticComponent<Partial<Partial<_arcanejs_toolkit_components_group.InternalProps> & {
+    children: (string | false | JSX.Element | null | undefined) | (string | false | JSX.Element | null | undefined)[];
+}> & React__default.RefAttributes<ld.Group>>;
+declare const GroupHeader: React__default.ForwardRefExoticComponent<Record<never, never> & {
+    children?: (string | false | JSX.Element | null | undefined) | (string | false | JSX.Element | null | undefined)[];
+} & React__default.RefAttributes<ld.GroupHeader>>;
+declare const Label: React__default.ForwardRefExoticComponent<Partial<_arcanejs_protocol_styles.LabelComponentStyle & {
+    text: string | null;
+}> & React__default.RefAttributes<ld.Label>>;
+declare const Rect: React__default.ForwardRefExoticComponent<Partial<Partial<{
+    color: string;
+    grow?: boolean | undefined;
+}>> & React__default.RefAttributes<ld.Rect>>;
+declare const SliderButton: React__default.ForwardRefExoticComponent<Partial<Pick<Pick<_arcanejs_protocol_core.SliderButtonComponent, "grow" | "min" | "max" | "step" | "gradient"> & {
+    value?: number | undefined;
+    defaultValue?: number | undefined;
+    onChange?: ((value: number) => void | Promise<void>) | undefined;
+}, "value"> & Partial<Omit<Pick<_arcanejs_protocol_core.SliderButtonComponent, "grow" | "min" | "max" | "step" | "gradient"> & {
+    value?: number | undefined;
+    defaultValue?: number | undefined;
+    onChange?: ((value: number) => void | Promise<void>) | undefined;
+}, "value">>> & React__default.RefAttributes<ld.SliderButton>>;
+declare const Switch: React__default.ForwardRefExoticComponent<Partial<Partial<{
+    value?: "on" | "off" | undefined;
+    defaultValue?: "on" | "off" | undefined;
+    onChange?: ((state: "on" | "off") => void | Promise<void>) | undefined;
+}>> & React__default.RefAttributes<ld.Switch>>;
+declare const Tab: React__default.ForwardRefExoticComponent<{
+    name: string;
+} & {
+    children?: (string | false | JSX.Element | null | undefined) | (string | false | JSX.Element | null | undefined)[];
+} & React__default.RefAttributes<ld.Tab>>;
+declare const Tabs: React__default.ForwardRefExoticComponent<Partial<{} & {
+    children: (string | false | JSX.Element | null | undefined) | (string | false | JSX.Element | null | undefined)[];
+}> & React__default.RefAttributes<ld.Tabs>>;
+declare const TextInput: React__default.ForwardRefExoticComponent<Partial<Partial<{
+    value: string | null;
+    onChange?: ((value: string) => void | Promise<void>) | undefined;
+}>> & React__default.RefAttributes<ld.TextInput>>;
+declare const Timeline: React__default.ForwardRefExoticComponent<Partial<Partial<{
+    state: _arcanejs_protocol_core.TimelineState;
+    title: string | null;
+    subtitles: string[] | null;
+    source: {
+        name: string;
+    } | null | undefined;
+}>> & React__default.RefAttributes<ld.Timeline>>;
+
+export { Button, Group, GroupHeader, Label, Rect, SliderButton, Switch, Tab, Tabs, TextInput, Timeline, ToolkitRenderer, prepareComponents };

package/dist/index.d.ts

@@ -1,32 +1,94 @@
+import * as _arcanejs_protocol_core from '@arcanejs/protocol/core';
+import * as _arcanejs_protocol_styles from '@arcanejs/protocol/styles';
+import * as _arcanejs_toolkit_components_group from '@arcanejs/toolkit/components/group';
+import { Props } from '@arcanejs/toolkit/components/group';
+import * as _arcanejs_toolkit_components_button from '@arcanejs/toolkit/components/button';
+import React__default from 'react';
 import * as ld from '@arcanejs/toolkit';
-import { Group as Group$1, GroupHeader as GroupHeader$1, Props } from '@arcanejs/toolkit/components/group';
-import { L as LightDeskIntrinsicElements } from './types-D0Wa4a4d.js';
-import * as React from 'react';
-import { Button as Button$1 } from '@arcanejs/toolkit/components/button';
-import { Label as Label$1 } from '@arcanejs/toolkit/components/label';
-import { Rect as Rect$1 } from '@arcanejs/toolkit/components/rect';
-import { SliderButton as SliderButton$1 } from '@arcanejs/toolkit/components/slider-button';
-import { Switch as Switch$1 } from '@arcanejs/toolkit/components/switch';
-import { Tab as Tab$1, Tabs as Tabs$1 } from '@arcanejs/toolkit/components/tabs';
-import { Timeline as Timeline$1 } from '@arcanejs/toolkit/components/timeline';
-import { TextInput as TextInput$1 } from '@arcanejs/toolkit/components/text-input';
+import { AnyComponent, BaseParent, Base } from '@arcanejs/toolkit/components/base';
 
-type ComponentWithRef<T, P> = React.ForwardRefExoticComponent<React.PropsWithoutRef<P> & React.RefAttributes<T>>;
-declare const Button: ComponentWithRef<Button$1, LightDeskIntrinsicElements['button']>;
-declare const Group: ComponentWithRef<Group$1, LightDeskIntrinsicElements['group']>;
-declare const GroupHeader: ComponentWithRef<GroupHeader$1, LightDeskIntrinsicElements['group-header']>;
-declare const Label: ComponentWithRef<Label$1, LightDeskIntrinsicElements['label']>;
-declare const Rect: ComponentWithRef<Rect$1, LightDeskIntrinsicElements['rect']>;
-declare const SliderButton: ComponentWithRef<SliderButton$1, LightDeskIntrinsicElements['slider-button']>;
-declare const Switch: ComponentWithRef<Switch$1, LightDeskIntrinsicElements['switch']>;
-declare const Tab: ComponentWithRef<Tab$1, LightDeskIntrinsicElements['tab']>;
-declare const Tabs: ComponentWithRef<Tabs$1, LightDeskIntrinsicElements['tabs']>;
-declare const TextInput: ComponentWithRef<TextInput$1, LightDeskIntrinsicElements['text-input']>;
-declare const Timeline: ComponentWithRef<Timeline$1, LightDeskIntrinsicElements['timeline']>;
+type ComponentClass = new (...args: any[]) => AnyComponent;
+type ComponentsDefinition = {
+    [key: string]: ComponentClass;
+};
+type Child = JSX.Element | null | undefined | false | string;
+type Children = Child | Child[];
+type PropsOfComponent<T extends ComponentClass> = T extends new (props?: infer P) => BaseParent<any, any, any> ? Partial<P & {
+    children: Children;
+}> : T extends new (props: infer P) => BaseParent<any, any, any> ? P & {
+    children?: Children;
+} : T extends new (props?: infer P) => Base<any, any, any> ? Partial<P> : T extends new (props: infer P) => Base<any, any, any> ? P : never;
+type InstanceType<T extends ComponentClass> = T extends new (...args: any[]) => infer R ? R : never;
+type Creators<D extends ComponentsDefinition> = {
+    [K in keyof D]: (props: {
+        [key: string]: any;
+    }) => AnyComponent;
+};
+type ComponentFunctionForComponent<T extends ComponentClass> = React__default.ForwardRefExoticComponent<React__default.PropsWithoutRef<PropsOfComponent<T>> & React__default.RefAttributes<InstanceType<T>>>;
+type ComponentFunctions<D extends ComponentsDefinition> = {
+    [K in keyof D]: ComponentFunctionForComponent<D[K]>;
+};
+type PreparedComponents<D extends ComponentsDefinition> = {
+    _namespace: string;
+    _creators: Creators<D>;
+} & ComponentFunctions<D>;
+declare const prepareComponents: <D extends ComponentsDefinition>(namespace: string, defn: D) => PreparedComponents<D>;
 
+type ReactToolkitConfig = {
+    componentNamespaces: Array<PreparedComponents<any>>;
+};
 declare const ToolkitRenderer: {
-    renderGroup: (component: JSX.Element, container: ld.Group) => void;
-    render: (component: JSX.Element, container: ld.Toolkit, rootGroupProps?: Props) => void;
+    renderGroup: (component: JSX.Element, container: ld.Group, config?: ReactToolkitConfig) => void;
+    render: (component: JSX.Element, container: ld.Toolkit, rootGroupProps?: Props, config?: ReactToolkitConfig) => void;
 };
 
-export { Button, Group, GroupHeader, Label, LightDeskIntrinsicElements, Rect, SliderButton, Switch, Tab, Tabs, TextInput, Timeline, ToolkitRenderer };
+declare const Button: React__default.ForwardRefExoticComponent<Partial<Partial<_arcanejs_toolkit_components_button.InternalProps>> & React__default.RefAttributes<ld.Button>>;
+declare const Group: React__default.ForwardRefExoticComponent<Partial<Partial<_arcanejs_toolkit_components_group.InternalProps> & {
+    children: (string | false | JSX.Element | null | undefined) | (string | false | JSX.Element | null | undefined)[];
+}> & React__default.RefAttributes<ld.Group>>;
+declare const GroupHeader: React__default.ForwardRefExoticComponent<Record<never, never> & {
+    children?: (string | false | JSX.Element | null | undefined) | (string | false | JSX.Element | null | undefined)[];
+} & React__default.RefAttributes<ld.GroupHeader>>;
+declare const Label: React__default.ForwardRefExoticComponent<Partial<_arcanejs_protocol_styles.LabelComponentStyle & {
+    text: string | null;
+}> & React__default.RefAttributes<ld.Label>>;
+declare const Rect: React__default.ForwardRefExoticComponent<Partial<Partial<{
+    color: string;
+    grow?: boolean | undefined;
+}>> & React__default.RefAttributes<ld.Rect>>;
+declare const SliderButton: React__default.ForwardRefExoticComponent<Partial<Pick<Pick<_arcanejs_protocol_core.SliderButtonComponent, "grow" | "min" | "max" | "step" | "gradient"> & {
+    value?: number | undefined;
+    defaultValue?: number | undefined;
+    onChange?: ((value: number) => void | Promise<void>) | undefined;
+}, "value"> & Partial<Omit<Pick<_arcanejs_protocol_core.SliderButtonComponent, "grow" | "min" | "max" | "step" | "gradient"> & {
+    value?: number | undefined;
+    defaultValue?: number | undefined;
+    onChange?: ((value: number) => void | Promise<void>) | undefined;
+}, "value">>> & React__default.RefAttributes<ld.SliderButton>>;
+declare const Switch: React__default.ForwardRefExoticComponent<Partial<Partial<{
+    value?: "on" | "off" | undefined;
+    defaultValue?: "on" | "off" | undefined;
+    onChange?: ((state: "on" | "off") => void | Promise<void>) | undefined;
+}>> & React__default.RefAttributes<ld.Switch>>;
+declare const Tab: React__default.ForwardRefExoticComponent<{
+    name: string;
+} & {
+    children?: (string | false | JSX.Element | null | undefined) | (string | false | JSX.Element | null | undefined)[];
+} & React__default.RefAttributes<ld.Tab>>;
+declare const Tabs: React__default.ForwardRefExoticComponent<Partial<{} & {
+    children: (string | false | JSX.Element | null | undefined) | (string | false | JSX.Element | null | undefined)[];
+}> & React__default.RefAttributes<ld.Tabs>>;
+declare const TextInput: React__default.ForwardRefExoticComponent<Partial<Partial<{
+    value: string | null;
+    onChange?: ((value: string) => void | Promise<void>) | undefined;
+}>> & React__default.RefAttributes<ld.TextInput>>;
+declare const Timeline: React__default.ForwardRefExoticComponent<Partial<Partial<{
+    state: _arcanejs_protocol_core.TimelineState;
+    title: string | null;
+    subtitles: string[] | null;
+    source: {
+        name: string;
+    } | null | undefined;
+}>> & React__default.RefAttributes<ld.Timeline>>;
+
+export { Button, Group, GroupHeader, Label, Rect, SliderButton, Switch, Tab, Tabs, TextInput, Timeline, ToolkitRenderer, prepareComponents };