@arcanejs/react-toolkit 0.8.5 → 0.9.0

package/dist/colors.d.mts

@@ -1,4 +1,4 @@
-import React__default, { Ref } from 'react';
+import React__default, { Ref, ReactNode } from 'react';
 import { Props as Props$1, Events as Events$1, Group, GroupHeader } from '@arcanejs/toolkit/components/group';
 import { Props, Events, Button } from '@arcanejs/toolkit/components/button';
 import { Props as Props$2, Label } from '@arcanejs/toolkit/components/label';
@@ -9,8 +9,6 @@ import { TabProps, Tab, TabsProps, Tabs } from '@arcanejs/toolkit/components/tab
 import { Props as Props$6, Events as Events$4, TextInput } from '@arcanejs/toolkit/components/text-input';
 import { Props as Props$7, Timeline } from '@arcanejs/toolkit/components/timeline';
 
-type Child = JSX.Element | string | null | undefined | boolean;
-type Children = Child | Child[];
 interface LightDeskIntrinsicElements {
     button: Props & {
         children?: never;
@@ -18,12 +16,12 @@ interface LightDeskIntrinsicElements {
         ref?: Ref<Button>;
     };
     group: Props$1 & {
-        children?: Children;
+        children?: ReactNode;
         onTitleChanged?: Events$1['title-changed'];
         ref?: Ref<Group>;
     };
     'group-header': {
-        children?: Children;
+        children?: ReactNode;
         ref?: Ref<GroupHeader>;
     };
     label: Props$2 & {
@@ -45,15 +43,15 @@ interface LightDeskIntrinsicElements {
         ref?: Ref<Switch>;
     };
     tab: TabProps & {
-        children?: JSX.Element | string;
+        children?: ReactNode;
         ref?: Ref<Tab>;
     };
     tabs: TabsProps & {
-        children?: JSX.Element | JSX.Element[];
+        children?: ReactNode;
         ref?: Ref<Tabs>;
     };
     'text-input': Props$6 & {
-        children?: JSX.Element | JSX.Element[];
+        children?: ReactNode;
         onChange?: Events$4['change'];
         ref?: Ref<TextInput>;
     };

package/dist/colors.d.ts

@@ -1,4 +1,4 @@
-import React__default, { Ref } from 'react';
+import React__default, { Ref, ReactNode } from 'react';
 import { Props as Props$1, Events as Events$1, Group, GroupHeader } from '@arcanejs/toolkit/components/group';
 import { Props, Events, Button } from '@arcanejs/toolkit/components/button';
 import { Props as Props$2, Label } from '@arcanejs/toolkit/components/label';
@@ -9,8 +9,6 @@ import { TabProps, Tab, TabsProps, Tabs } from '@arcanejs/toolkit/components/tab
 import { Props as Props$6, Events as Events$4, TextInput } from '@arcanejs/toolkit/components/text-input';
 import { Props as Props$7, Timeline } from '@arcanejs/toolkit/components/timeline';
 
-type Child = JSX.Element | string | null | undefined | boolean;
-type Children = Child | Child[];
 interface LightDeskIntrinsicElements {
     button: Props & {
         children?: never;
@@ -18,12 +16,12 @@ interface LightDeskIntrinsicElements {
         ref?: Ref<Button>;
     };
     group: Props$1 & {
-        children?: Children;
+        children?: ReactNode;
         onTitleChanged?: Events$1['title-changed'];
         ref?: Ref<Group>;
     };
     'group-header': {
-        children?: Children;
+        children?: ReactNode;
         ref?: Ref<GroupHeader>;
     };
     label: Props$2 & {
@@ -45,15 +43,15 @@ interface LightDeskIntrinsicElements {
         ref?: Ref<Switch>;
     };
     tab: TabProps & {
-        children?: JSX.Element | string;
+        children?: ReactNode;
         ref?: Ref<Tab>;
     };
     tabs: TabsProps & {
-        children?: JSX.Element | JSX.Element[];
+        children?: ReactNode;
         ref?: Ref<Tabs>;
     };
     'text-input': Props$6 & {
-        children?: JSX.Element | JSX.Element[];
+        children?: ReactNode;
         onChange?: Events$4['change'];
         ref?: Ref<TextInput>;
     };

package/dist/connections.d.mts

@@ -0,0 +1,14 @@
+import { ToolkitConnection, Toolkit } from '@arcanejs/toolkit';
+import React__default, { FC, ReactNode } from 'react';
+
+type ConnectionsContextData = {
+    connections: ToolkitConnection[];
+};
+declare const ConnectionsContext: React__default.Context<ConnectionsContextData>;
+type ConnectionsContextProviderProps = {
+    toolkit: Toolkit;
+    children: ReactNode;
+};
+declare const ConnectionsContextProvider: FC<ConnectionsContextProviderProps>;
+
+export { ConnectionsContext, ConnectionsContextProvider };

package/dist/connections.d.ts

@@ -0,0 +1,14 @@
+import { ToolkitConnection, Toolkit } from '@arcanejs/toolkit';
+import React__default, { FC, ReactNode } from 'react';
+
+type ConnectionsContextData = {
+    connections: ToolkitConnection[];
+};
+declare const ConnectionsContext: React__default.Context<ConnectionsContextData>;
+type ConnectionsContextProviderProps = {
+    toolkit: Toolkit;
+    children: ReactNode;
+};
+declare const ConnectionsContextProvider: FC<ConnectionsContextProviderProps>;
+
+export { ConnectionsContext, ConnectionsContextProvider };

package/dist/connections.js

@@ -0,0 +1,39 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/connections.tsx
+
+
+
+
+var _react = require('react');
+var _jsxruntime = require('react/jsx-runtime');
+var ConnectionsContext = _react.createContext.call(void 0, 
+  new Proxy({}, {
+    get: () => {
+      throw new Error(
+        "Can	 use ConnectionsContext without ConnectionsContextProvider"
+      );
+    }
+  })
+);
+var ConnectionsContextProvider = ({ toolkit, children }) => {
+  const [connections, setConnections] = _react.useState.call(void 0, []);
+  _react.useEffect.call(void 0, () => {
+    const onNewConnection = (connection) => {
+      setConnections((current) => [...current, connection]);
+    };
+    const onClosedConnection = (connection) => {
+      setConnections((current) => current.filter((c) => c !== connection));
+    };
+    toolkit.addListener("new-connection", onNewConnection);
+    toolkit.addListener("closed-connection", onClosedConnection);
+    setConnections(toolkit.getConnections());
+    return () => {
+      toolkit.removeListener("new-connection", onNewConnection);
+      toolkit.removeListener("closed-connection", onClosedConnection);
+    };
+  }, [toolkit]);
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ConnectionsContext.Provider, { value: { connections }, children });
+};
+
+
+
+exports.ConnectionsContext = ConnectionsContext; exports.ConnectionsContextProvider = ConnectionsContextProvider;

package/dist/connections.mjs

@@ -0,0 +1,39 @@
+// src/connections.tsx
+import {
+  createContext,
+  useEffect,
+  useState
+} from "react";
+import { jsx } from "react/jsx-runtime";
+var ConnectionsContext = createContext(
+  new Proxy({}, {
+    get: () => {
+      throw new Error(
+        "Can	 use ConnectionsContext without ConnectionsContextProvider"
+      );
+    }
+  })
+);
+var ConnectionsContextProvider = ({ toolkit, children }) => {
+  const [connections, setConnections] = useState([]);
+  useEffect(() => {
+    const onNewConnection = (connection) => {
+      setConnections((current) => [...current, connection]);
+    };
+    const onClosedConnection = (connection) => {
+      setConnections((current) => current.filter((c) => c !== connection));
+    };
+    toolkit.addListener("new-connection", onNewConnection);
+    toolkit.addListener("closed-connection", onClosedConnection);
+    setConnections(toolkit.getConnections());
+    return () => {
+      toolkit.removeListener("new-connection", onNewConnection);
+      toolkit.removeListener("closed-connection", onClosedConnection);
+    };
+  }, [toolkit]);
+  return /* @__PURE__ */ jsx(ConnectionsContext.Provider, { value: { connections }, children });
+};
+export {
+  ConnectionsContext,
+  ConnectionsContextProvider
+};

package/dist/index.d.mts

@@ -3,7 +3,7 @@ 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 React__default, { ReactNode } from 'react';
 import * as ld from '@arcanejs/toolkit';
 import { Button as Button$1, Group as Group$1, GroupHeader as GroupHeader$1, Label as Label$1, Rect as Rect$1, SliderButton as SliderButton$1, Switch as Switch$1, Tab as Tab$1, Tabs as Tabs$1, TextInput as TextInput$1, Timeline as Timeline$1 } from '@arcanejs/toolkit';
 import { AnyComponent, BaseParent, Base } from '@arcanejs/toolkit/components/base';
@@ -12,12 +12,10 @@ 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;
+    children: ReactNode;
 }> : T extends new (props: infer P) => BaseParent<any, any, any> ? P & {
-    children?: Children;
+    children?: ReactNode;
 } : 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> = {
@@ -59,10 +57,10 @@ declare const 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)[];
+    children: React__default.ReactNode;
 }> & 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)[];
+    children?: React__default.ReactNode;
 } & React__default.RefAttributes<ld.GroupHeader>>;
 declare const Label: React__default.ForwardRefExoticComponent<Partial<_arcanejs_protocol_styles.LabelComponentStyle & {
     text: string | null;
@@ -74,28 +72,28 @@ declare const Rect: React__default.ForwardRefExoticComponent<Partial<Partial<{
 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;
+    onChange?: ((value: number, connection: ld.ToolkitConnection) => 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;
+    onChange?: ((value: number, connection: ld.ToolkitConnection) => 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;
+    onChange?: ((state: "on" | "off", connection: ld.ToolkitConnection) => 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)[];
+    children?: React__default.ReactNode;
 } & 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)[];
+    children: React__default.ReactNode;
 }> & React__default.RefAttributes<ld.Tabs>>;
 declare const TextInput: React__default.ForwardRefExoticComponent<Partial<Partial<{
     value: string | null;
-    onChange?: ((value: string) => void | Promise<void>) | undefined;
+    onChange?: ((value: string, connection: ld.ToolkitConnection) => void | Promise<void>) | undefined;
 }>> & React__default.RefAttributes<ld.TextInput>>;
 declare const Timeline: React__default.ForwardRefExoticComponent<Partial<Partial<{
     state: _arcanejs_protocol_core.TimelineState;

package/dist/index.d.ts

@@ -3,7 +3,7 @@ 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 React__default, { ReactNode } from 'react';
 import * as ld from '@arcanejs/toolkit';
 import { Button as Button$1, Group as Group$1, GroupHeader as GroupHeader$1, Label as Label$1, Rect as Rect$1, SliderButton as SliderButton$1, Switch as Switch$1, Tab as Tab$1, Tabs as Tabs$1, TextInput as TextInput$1, Timeline as Timeline$1 } from '@arcanejs/toolkit';
 import { AnyComponent, BaseParent, Base } from '@arcanejs/toolkit/components/base';
@@ -12,12 +12,10 @@ 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;
+    children: ReactNode;
 }> : T extends new (props: infer P) => BaseParent<any, any, any> ? P & {
-    children?: Children;
+    children?: ReactNode;
 } : 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> = {
@@ -59,10 +57,10 @@ declare const 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)[];
+    children: React__default.ReactNode;
 }> & 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)[];
+    children?: React__default.ReactNode;
 } & React__default.RefAttributes<ld.GroupHeader>>;
 declare const Label: React__default.ForwardRefExoticComponent<Partial<_arcanejs_protocol_styles.LabelComponentStyle & {
     text: string | null;
@@ -74,28 +72,28 @@ declare const Rect: React__default.ForwardRefExoticComponent<Partial<Partial<{
 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;
+    onChange?: ((value: number, connection: ld.ToolkitConnection) => 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;
+    onChange?: ((value: number, connection: ld.ToolkitConnection) => 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;
+    onChange?: ((state: "on" | "off", connection: ld.ToolkitConnection) => 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)[];
+    children?: React__default.ReactNode;
 } & 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)[];
+    children: React__default.ReactNode;
 }> & React__default.RefAttributes<ld.Tabs>>;
 declare const TextInput: React__default.ForwardRefExoticComponent<Partial<Partial<{
     value: string | null;
-    onChange?: ((value: string) => void | Promise<void>) | undefined;
+    onChange?: ((value: string, connection: ld.ToolkitConnection) => void | Promise<void>) | undefined;
 }>> & React__default.RefAttributes<ld.TextInput>>;
 declare const Timeline: React__default.ForwardRefExoticComponent<Partial<Partial<{
     state: _arcanejs_protocol_core.TimelineState;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arcanejs/react-toolkit",
-  "version": "0.8.5",
+  "version": "0.9.0",
   "private": false,
   "description": "Build web-accessible control interfaces for your long-running Node.js processes",
   "keywords": [
@@ -31,6 +31,12 @@
       "import": "./dist/colors.mjs",
       "require": "./dist/colors.js"
     },
+    "./connections": {
+      "@arcanejs/source": "./src/connections.tsx",
+      "types": "./dist/connections.d.ts",
+      "import": "./dist/connections.mjs",
+      "require": "./dist/connections.js"
+    },
     "./data": {
       "@arcanejs/source": "./src/data.tsx",
       "types": "./dist/data.d.ts",
@@ -63,8 +69,8 @@
     "lodash": "^4.17.21",
     "react": "^18",
     "react-reconciler": "0.28.0",
-    "@arcanejs/protocol": "^0.4.1",
-    "@arcanejs/toolkit": "^1.1.1"
+    "@arcanejs/protocol": "^0.5.0",
+    "@arcanejs/toolkit": "^2.0.0"
   },
   "peerDependencies": {
     "zod": "^3.23.8"