@ts-graphviz/react 0.10.2 → 0.10.3-next-a1de944c70af32f17428537ec0b096de2d68388d

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @ts-graphviz/react
 
+## 0.10.3-next-a1de944c70af32f17428537ec0b096de2d68388d
+
+### Patch Changes
+
+- [#1087](https://github.com/ts-graphviz/ts-graphviz/pull/1087) [`f808a2e`](https://github.com/ts-graphviz/ts-graphviz/commit/f808a2e93f52a97e3466afc37d5353b2d7d8c54c) Thanks [@kamiazya](https://github.com/kamiazya)! - Fix global JSX type
+
+- [#1088](https://github.com/ts-graphviz/ts-graphviz/pull/1088) [`7d7352b`](https://github.com/ts-graphviz/ts-graphviz/commit/7d7352bb3819522ba16763503aa6bc923f550408) Thanks [@kamiazya](https://github.com/kamiazya)! - Update Snapshot release configuration
+
+- Updated dependencies [[`883f7b3`](https://github.com/ts-graphviz/ts-graphviz/commit/883f7b3c65794b3ab2b01c422b6231079bb6c28d), [`7705b1d`](https://github.com/ts-graphviz/ts-graphviz/commit/7705b1d08612aef83e1c35bc3ee4ffc922247a27), [`7d7352b`](https://github.com/ts-graphviz/ts-graphviz/commit/7d7352bb3819522ba16763503aa6bc923f550408)]:
+  - @ts-graphviz/common@2.1.3-next-a1de944c70af32f17428537ec0b096de2d68388d
+  - ts-graphviz@2.1.3-next-a1de944c70af32f17428537ec0b096de2d68388d
+
 ## 0.10.2
 
 ### Patch Changes

package/lib/components/Digraph.d.ts

@@ -0,0 +1,6 @@
+import { type FC } from 'react';
+import type { RootGraphProps } from '../types.js';
+/**
+ * `Digraph` component.
+ */
+export declare const Digraph: FC<RootGraphProps>;

package/lib/components/Digraph.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/components/Edge.d.ts

@@ -0,0 +1,6 @@
+import type { FC } from 'react';
+import type { EdgeProps } from '../types.js';
+/**
+ * `Edge` component.
+ */
+export declare const Edge: FC<EdgeProps>;

package/lib/components/Graph.d.ts

@@ -0,0 +1,6 @@
+import { type FC } from 'react';
+import type { RootGraphProps } from '../types.js';
+/**
+ * `Graph` component.
+ */
+export declare const Graph: FC<RootGraphProps>;

package/lib/components/Graph.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/components/GraphPortal.d.ts

@@ -0,0 +1,6 @@
+import { type FC } from 'react';
+import type { GraphPortalProps } from '../types.js';
+/**
+ * GraphPortal component.
+ */
+export declare const GraphPortal: FC<GraphPortalProps>;

package/lib/components/Node.d.ts

@@ -0,0 +1,6 @@
+import type { FC } from 'react';
+import type { NodeProps } from '../types.js';
+/**
+ * `Node` component.
+ */
+export declare const Node: FC<NodeProps>;

package/lib/components/Node.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/components/Subgraph.d.ts

@@ -0,0 +1,6 @@
+import { type FC } from 'react';
+import type { SubgraphProps } from '../types.js';
+/**
+ * `Subgraph` component.
+ */
+export declare const Subgraph: FC<SubgraphProps>;

package/lib/contexts/CurrentGraph.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import type { GraphBaseModel } from 'ts-graphviz';
+export declare const CurrentGraph: import("react").Context<GraphBaseModel<import("ts-graphviz").AttributeKey> | null>;

package/lib/contexts/GraphContainer.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import type { GraphBaseModel } from 'ts-graphviz';
+export declare const GraphContainer: import("react").Context<GraphBaseModel<import("ts-graphviz").AttributeKey> | null>;

package/lib/contexts/GraphMap.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import type { GraphBaseModel } from 'ts-graphviz';
+export declare const GraphMap: import("react").Context<Map<string, GraphBaseModel<import("ts-graphviz").AttributeKey>>>;

package/lib/contexts/GraphvizContext.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import type { GraphBaseModel } from 'ts-graphviz';
+export interface Context<T extends GraphBaseModel = GraphBaseModel> {
+    container?: T;
+}
+export declare const GraphvizContext: import("react").Context<Context<GraphBaseModel<import("ts-graphviz").AttributeKey>>>;

package/lib/hooks/__tests__/wrapper.d.ts

@@ -0,0 +1,19 @@
+import type { ComponentProps, FC, ReactNode } from 'react';
+import { Digraph } from '../../components/Digraph.js';
+import { Graph } from '../../components/Graph.js';
+import { Subgraph } from '../../components/Subgraph.js';
+export declare const context: () => FC<{
+    children: ReactNode;
+}>;
+export declare const digraph: (props?: ComponentProps<typeof Digraph>) => FC<{
+    children: ReactNode;
+}>;
+export declare const digraphInSubgraph: (props?: ComponentProps<typeof Subgraph>) => FC<{
+    children: ReactNode;
+}>;
+export declare const graph: (props?: ComponentProps<typeof Graph>) => FC<{
+    children: ReactNode;
+}>;
+export declare const graphInSubgraph: (props?: ComponentProps<typeof Subgraph>) => FC<{
+    children: ReactNode;
+}>;

package/lib/hooks/useCurrentGraph.d.ts

@@ -0,0 +1,7 @@
+import type { GraphBaseModel } from 'ts-graphviz';
+/**
+ * Hook to get the current cluster(Digraph, Graph or Subgraph).
+ *
+ * @throws If it is out of the context of Cluster, it throws an exception.
+ */
+export declare function useCurrentGraph(): GraphBaseModel;

package/lib/hooks/useCurrentGraph.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/hooks/useDigraph.d.ts

@@ -0,0 +1,7 @@
+import { type RootGraphModel } from 'ts-graphviz';
+import type { RootGraphOptions } from '../types.js';
+/**
+ * `useDigraph` is a hook that creates an instance of Digraph
+ * according to the object given by props.
+ */
+export declare function useDigraph(options?: RootGraphOptions): RootGraphModel;

package/lib/hooks/useDigraph.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/hooks/useEdge.d.ts

@@ -0,0 +1,7 @@
+import type { EdgeModel, EdgeTargetLikeTuple } from 'ts-graphviz';
+import type { EdgeOptions } from '../types.js';
+/**
+ * `useEdge` is a hook that creates an instance of Edge
+ * according to the object given by props.
+ */
+export declare function useEdge(targets: EdgeTargetLikeTuple, props?: EdgeOptions): EdgeModel;

package/lib/hooks/useEdge.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/hooks/useGraph.d.ts

@@ -0,0 +1,7 @@
+import { type RootGraphModel } from 'ts-graphviz';
+import type { RootGraphOptions } from '../types.js';
+/**
+ * `useGraph` is a hook that creates an instance of Graph
+ * according to the object given by props.
+ */
+export declare function useGraph(options?: RootGraphOptions): RootGraphModel;

package/lib/hooks/useGraph.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/hooks/useGraphAttributes.d.ts

@@ -0,0 +1,3 @@
+import type { AttributeKey, AttributesObject, GraphBaseModel } from 'ts-graphviz';
+import type { GraphBaseAttributesProps } from '../types.js';
+export declare function useGraphAttributes<T extends AttributeKey>(cluster: GraphBaseModel<T>, attributes: AttributesObject<T>, { edge, node, graph }: GraphBaseAttributesProps): void;

package/lib/hooks/useGraphContainer.d.ts

@@ -0,0 +1,5 @@
+import type { GraphBaseModel } from 'ts-graphviz';
+/**
+ * Return the cluster of container.
+ */
+export declare function useGraphContainer(): GraphBaseModel | null;

package/lib/hooks/useGraphContainer.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/hooks/useGraphMap.d.ts

@@ -0,0 +1,2 @@
+import type { GraphBaseModel } from 'ts-graphviz';
+export declare function useGraphMap(): Map<string, GraphBaseModel>;

package/lib/hooks/useGraphvizContext.d.ts

@@ -0,0 +1,3 @@
+import type { GraphBaseModel } from 'ts-graphviz';
+import { type Context } from '../contexts/GraphvizContext.js';
+export declare function useGraphvizContext<T extends GraphBaseModel>(): Context<T>;

package/lib/hooks/useGraphvizContext.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/hooks/useHasAttributes.d.ts

@@ -0,0 +1,2 @@
+import type { AttributeKey, AttributesObject, HasAttributes } from 'ts-graphviz';
+export declare function useHasAttributes<T extends AttributeKey>(target: HasAttributes<T>, attributes: AttributesObject<T>): void;

package/lib/hooks/useHasComment.d.ts

@@ -0,0 +1,2 @@
+import type { HasComment } from 'ts-graphviz';
+export declare function useHasComment(target: HasComment, comment?: string): void;

package/lib/hooks/useNode.d.ts

@@ -0,0 +1,7 @@
+import type { NodeModel } from 'ts-graphviz';
+import type { NodeOptions } from '../types.js';
+/**
+ * `useNode` is a hook that creates an instance of Node
+ * according to the object given by props.
+ */
+export declare function useNode(id: string, options?: NodeOptions): NodeModel;

package/lib/hooks/useNode.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/hooks/useRenderedID.d.ts

@@ -0,0 +1,2 @@
+import { type ReactElement } from 'react';
+export declare function useRenderedID(id?: ReactElement | string): string | undefined;

package/lib/hooks/useRenderedID.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/hooks/useSubgraph.d.ts

@@ -0,0 +1,7 @@
+import { type SubgraphModel } from 'ts-graphviz';
+import type { SubgraphOptions } from '../types.js';
+/**
+ * `useSubgraph` is a hook that creates an instance of Subgraph
+ * according to the object given by props.
+ */
+export declare function useSubgraph(props?: SubgraphOptions): SubgraphModel;

package/lib/hooks/useSubgraph.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/react.d.ts

@@ -1,230 +1,16 @@
-import type { EdgeAttributesObject } from '@ts-graphviz/common';
-import type { EdgeModel } from 'ts-graphviz';
-import type { EdgeTargetLikeTuple } from '@ts-graphviz/common';
-import type { EdgeTargetLikeTuple as EdgeTargetLikeTuple_2 } from 'ts-graphviz';
-import { FC } from 'react';
-import type { GraphAttributesObject } from '@ts-graphviz/common';
-import { GraphBaseModel } from 'ts-graphviz';
-import type { HasComment } from '@ts-graphviz/common';
-import type { NodeAttributesObject } from '@ts-graphviz/common';
-import type { NodeModel } from 'ts-graphviz';
-import { ReactElement } from 'react';
-import type { ReactNode } from 'react';
-import { RootGraphModel } from 'ts-graphviz';
-import type { SubgraphAttributesObject } from '@ts-graphviz/common';
-import { SubgraphModel } from 'ts-graphviz';
-
-/**
- * `Digraph` component.
- */
-export declare const Digraph: FC<RootGraphProps>;
-
-/**
- * `Edge` component.
- */
-export declare const Edge: FC<EdgeProps>;
-
-/** Options for Edge */
-export declare interface EdgeOptions extends EdgeAttributesObject {
-}
-
-/** Props for Edge component */
-export declare interface EdgeProps extends Omit<EdgeOptions, 'label'> {
-    /** Edge targets */
-    targets: EdgeTargetLikeTuple;
-    /** Edge label */
-    label?: ReactElement | string;
-}
-
-/**
- * `Graph` component.
- */
-export declare const Graph: FC<RootGraphProps>;
-
-/** Common attribute values of objects under cluster */
-export declare interface GraphBaseAttributesProps {
-    /** Attribute value for Edges */
-    edge?: EdgeAttributesObject;
-    /** Attribute value for Nodes */
-    node?: NodeAttributesObject;
-    /** Attribute value for Graphs */
-    graph?: SubgraphAttributesObject;
-}
-
-/**
- * GraphPortal component.
- */
-export declare const GraphPortal: FC<GraphPortalProps>;
-
-/** Props for GraphPortal component */
-export declare interface GraphPortalProps {
-    /**
-     * id of the cluster you want to target for the portal.
-     * If not specified, target the cluster that is the container to the portal.
-     */
-    id?: string;
-    children?: ReactNode;
-}
-
-/**
- * `Node` component.
- */
-export declare const Node: FC<NodeProps>;
-
-/** Options for Node */
-export declare interface NodeOptions extends NodeAttributesObject {
-}
-
-/** Props for Node component */
-export declare interface NodeProps extends Omit<NodeOptions, 'label' | 'xlabel'> {
-    /** Node id */
-    id: string;
-    /** Node label */
-    label?: ReactElement | string;
-    /** Node xlabel */
-    xlabel?: ReactElement | string;
-}
-
-/**
- * Convert the given element to Graphviz model.
- *
- * @example Example of giving a cluster as a container with the second argument.
- *
- * ```tsx
- * import React, { FC } from 'react';
- * import { digraph, toDot } from 'ts-graphviz';
- * import { Node, Subgraph, render, Edge } from '@ts-graphviz/react';
- *
- * const Example: FC = () => (
- *   <>
- *     <Node id="a" />
- *
- *     <Subgraph id="my_cluster">
- *       <Node id="b" />
- *     </Subgraph>
- *     <Edge targets={['b', 'a']} />
- *   </>
- * );
- *
- * const G = digraph((g) => render(<Example />, g));
- * console.log(toDot(G));
- * // digraph {
- * //   "a";
- * //   subgraph "my_cluster" {
- * //     "b";
- * //   }
- * //   "b" -> "a";
- * // }
- * ```
- */
-export declare function render<T extends GraphBaseModel>(element: ReactElement, container?: T): T;
-
-export declare function renderHTMLLike(label?: ReactElement): string;
-
-/**
- * Converts the given element to DOT language and returns it.
- *
- * @example
- *
- * ```tsx
- * import React, { FC } from 'react';
- * import { Digraph, Node, Subgraph, renderToDot, Edge } from '@ts-graphviz/react';
- *
- * const Example: FC = () => (
- *   <Digraph>
- *     <Node id="a" />
- *     <Subgraph id="my_cluster">
- *       <Node id="b" />
- *     </Subgraph>
- *     <Edge targets={['b', 'a']} />
- *   </Digraph>
- * );
- *
- * const dot = renderToDot(<Example />);
- * console.log(dot);
- * // digraph {
- * //   "a";
- * //   subgraph "my_cluster" {
- * //     "b";
- * //   }
- * //   "b" -> "a";
- * // }
- * ```
- *
- * @returns Rendered dot string
- */
-export declare function renderToDot(element: ReactElement, container?: RootGraphModel): string;
-
-/** Options for RootGraph */
-export declare interface RootGraphOptions extends GraphAttributesObject, GraphBaseAttributesProps {
-    /** Cluster id */
-    id?: string;
-}
-
-/** Props for RootGraph component */
-export declare interface RootGraphProps extends Omit<RootGraphOptions, 'label'> {
-    label?: ReactElement | string;
-    children?: ReactNode;
-}
-
-/**
- * `Subgraph` component.
- */
-export declare const Subgraph: FC<SubgraphProps>;
-
-/** Options for Subgraph */
-export declare interface SubgraphOptions extends SubgraphAttributesObject, GraphBaseAttributesProps, HasComment {
-    /** Cluster id */
-    id?: string;
-}
-
-/** Props for Subgraph component */
-export declare interface SubgraphProps extends Omit<SubgraphOptions, 'label'> {
-    /** Subgraph label */
-    label?: ReactElement | string;
-    children?: ReactNode;
-}
-
-/**
- * Hook to get the current cluster(Digraph, Graph or Subgraph).
- *
- * @throws If it is out of the context of Cluster, it throws an exception.
- */
-export declare function useCurrentGraph(): GraphBaseModel;
-
-/**
- * `useDigraph` is a hook that creates an instance of Digraph
- * according to the object given by props.
- */
-export declare function useDigraph(options?: RootGraphOptions): RootGraphModel;
-
-/**
- * `useEdge` is a hook that creates an instance of Edge
- * according to the object given by props.
- */
-export declare function useEdge(targets: EdgeTargetLikeTuple_2, props?: EdgeOptions): EdgeModel;
-
-/**
- * `useGraph` is a hook that creates an instance of Graph
- * according to the object given by props.
- */
-export declare function useGraph(options?: RootGraphOptions): RootGraphModel;
-
-/**
- * Return the cluster of container.
- */
-export declare function useGraphContainer(): GraphBaseModel | null;
-
-/**
- * `useNode` is a hook that creates an instance of Node
- * according to the object given by props.
- */
-export declare function useNode(id: string, options?: NodeOptions): NodeModel;
-
-/**
- * `useSubgraph` is a hook that creates an instance of Subgraph
- * according to the object given by props.
- */
-export declare function useSubgraph(props?: SubgraphOptions): SubgraphModel;
-
-export { }
+export * from './types.js';
+export * from './hooks/useGraphContainer.js';
+export * from './hooks/useCurrentGraph.js';
+export * from './hooks/useDigraph.js';
+export * from './hooks/useGraph.js';
+export * from './hooks/useSubgraph.js';
+export * from './hooks/useEdge.js';
+export * from './hooks/useNode.js';
+export * from './components/Graph.js';
+export * from './components/Digraph.js';
+export * from './components/Subgraph.js';
+export * from './components/Node.js';
+export * from './components/Edge.js';
+export * from './components/GraphPortal.js';
+export * from './renderHTMLLike.js';
+export * from './render.js';

package/lib/reconciler.d.ts

@@ -0,0 +1,71 @@
+/// <reference types="node" resolution-mode="require"/>
+import type { FC } from 'react';
+import ReactReconciler from 'react-reconciler';
+type Type = FC;
+type Props = any;
+type Container = Record<string, never>;
+type Instance = any;
+type TextInstance = any;
+type SuspenseInstance = any;
+type HydratableInstance = any;
+type PublicInstance = any;
+type HostContext = any;
+type UpdatePayload = any;
+type ChildSet = any;
+type TimeoutHandle = any;
+type NoTimeout = any;
+type OpaqueHandle = ReactReconciler.Fiber;
+export declare class HostConfig implements ReactReconciler.HostConfig<Type, Props, Container, Instance, TextInstance, SuspenseInstance, HydratableInstance, PublicInstance, HostContext, UpdatePayload, ChildSet, // TODO Placeholder for undocumented API
+TimeoutHandle, NoTimeout> {
+    preparePortalMount(containerInfo: Container): void;
+    scheduleTimeout(fn: (...args: unknown[]) => unknown, delay?: number): void;
+    cancelTimeout(id: any): void;
+    queueMicrotask(fn: () => void): void;
+    cloneInstance?: any;
+    cloneFundamentalInstance?: any;
+    createContainerChildSet?: any;
+    appendChildToContainerChildSet?: any;
+    finalizeContainerChildren?: any;
+    replaceContainerChildren?: any;
+    cloneHiddenInstance?: any;
+    cloneHiddenTextInstance?: any;
+    now: () => number;
+    setTimeout: typeof setTimeout;
+    clearTimeout: typeof clearTimeout;
+    noTimeout: NoTimeout;
+    isPrimaryRenderer: boolean;
+    supportsMutation: boolean;
+    supportsPersistence: boolean;
+    supportsHydration: boolean;
+    getPublicInstance(instance: Instance | TextInstance): PublicInstance;
+    getRootHostContext(rootContainerInstance: Container): HostContext;
+    getChildHostContext(parentHostContext: HostContext, type: Type, rootContainerInstance: Container): HostContext;
+    prepareForCommit(containerInfo: Container): Record<string, any> | null;
+    resetAfterCommit(containerInfo: Container): void;
+    /**
+     * Create component instance
+     */
+    createInstance(type: Type, props: Props, rootContainerInstance: Container, hostContext: HostContext, internalInstanceHandle: OpaqueHandle): Instance;
+    appendInitialChild(parentInstance: Instance, child: Instance | TextInstance): void;
+    finalizeInitialChildren(parentInstance: Instance, type: Type, props: Props, rootContainerInstance: Container, hostContext: HostContext): boolean;
+    prepareUpdate(instance: Instance, type: Type, oldProps: Props, newProps: Props, rootContainerInstance: Container, hostContext: HostContext): null | UpdatePayload;
+    shouldSetTextContent(type: Type, props: Props): boolean;
+    shouldDeprioritizeSubtree(type: Type, props: Props): boolean;
+    createTextInstance(text: string, rootContainerInstance: Container, hostContext: HostContext, internalInstanceHandle: OpaqueHandle): TextInstance;
+    scheduleDeferredCallback(callback: () => any, options?: {
+        timeout: number;
+    }): any;
+    cancelDeferredCallback(callbackID: any): void;
+    appendChild(parentInstance: Instance, child: Instance | TextInstance): void;
+    appendChildToContainer(container: Container, child: Instance | TextInstance): void;
+    commitTextUpdate(textInstance: TextInstance, oldText: string, newText: string): void;
+    commitMount(instance: Instance, type: Type, newProps: Props, internalInstanceHandle: OpaqueHandle): void;
+    commitUpdate(instance: Instance, updatePayload: UpdatePayload, type: Type, oldProps: Props, newProps: Props, internalInstanceHandle: OpaqueHandle): void;
+    insertBefore(parentInstance: Instance, child: Instance | TextInstance, beforeChild: Instance | TextInstance): void;
+    insertInContainerBefore(container: Container, child: Instance | TextInstance, beforeChild: Instance | TextInstance): void;
+    removeChild(parentInstance: Instance, child: Instance | TextInstance): void;
+    removeChildFromContainer(container: Container, child: Instance | TextInstance): void;
+    resetTextContent(instance: Instance): void;
+}
+export declare const reconciler: ReactReconciler.Reconciler<Container, any, any, any, any>;
+export {};

package/lib/render.d.ts

@@ -0,0 +1,68 @@
+import { type ReactElement } from 'react';
+import { type GraphBaseModel, type RootGraphModel } from 'ts-graphviz';
+/**
+ * Convert the given element to Graphviz model.
+ *
+ * @example Example of giving a cluster as a container with the second argument.
+ *
+ * ```tsx
+ * import React, { FC } from 'react';
+ * import { digraph, toDot } from 'ts-graphviz';
+ * import { Node, Subgraph, render, Edge } from '@ts-graphviz/react';
+ *
+ * const Example: FC = () => (
+ *   <>
+ *     <Node id="a" />
+ *
+ *     <Subgraph id="my_cluster">
+ *       <Node id="b" />
+ *     </Subgraph>
+ *     <Edge targets={['b', 'a']} />
+ *   </>
+ * );
+ *
+ * const G = digraph((g) => render(<Example />, g));
+ * console.log(toDot(G));
+ * // digraph {
+ * //   "a";
+ * //   subgraph "my_cluster" {
+ * //     "b";
+ * //   }
+ * //   "b" -> "a";
+ * // }
+ * ```
+ */
+export declare function render<T extends GraphBaseModel>(element: ReactElement, container?: T): T;
+/**
+ * Converts the given element to DOT language and returns it.
+ *
+ * @example
+ *
+ * ```tsx
+ * import React, { FC } from 'react';
+ * import { Digraph, Node, Subgraph, renderToDot, Edge } from '@ts-graphviz/react';
+ *
+ * const Example: FC = () => (
+ *   <Digraph>
+ *     <Node id="a" />
+ *     <Subgraph id="my_cluster">
+ *       <Node id="b" />
+ *     </Subgraph>
+ *     <Edge targets={['b', 'a']} />
+ *   </Digraph>
+ * );
+ *
+ * const dot = renderToDot(<Example />);
+ * console.log(dot);
+ * // digraph {
+ * //   "a";
+ * //   subgraph "my_cluster" {
+ * //     "b";
+ * //   }
+ * //   "b" -> "a";
+ * // }
+ * ```
+ *
+ * @returns Rendered dot string
+ */
+export declare function renderToDot(element: ReactElement, container?: RootGraphModel): string;

package/lib/render.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/renderHTMLLike.d.ts

@@ -0,0 +1,2 @@
+import type { ReactElement } from 'react';
+export declare function renderHTMLLike(label?: ReactElement): string;

package/lib/renderId.d.ts

@@ -0,0 +1,2 @@
+import { type ReactElement } from 'react';
+export declare function renderId<T>(id?: ReactElement<T> | string): string | undefined;

package/lib/types.d.ts

@@ -0,0 +1,109 @@
+import type { EdgeAttributesObject, EdgeTargetLikeTuple, GraphAttributesObject, HTMLLikeLabel, HasComment, NodeAttributesObject, SubgraphAttributesObject } from '@ts-graphviz/common';
+import type { ReactElement, ReactNode } from 'react';
+/** Common attribute values of objects under cluster */
+export interface GraphBaseAttributesProps {
+    /** Attribute value for Edges */
+    edge?: EdgeAttributesObject;
+    /** Attribute value for Nodes */
+    node?: NodeAttributesObject;
+    /** Attribute value for Graphs */
+    graph?: SubgraphAttributesObject;
+}
+/** Options for RootGraph */
+export interface RootGraphOptions extends GraphAttributesObject, GraphBaseAttributesProps {
+    /** Cluster id */
+    id?: string;
+}
+/** Options for Subgraph */
+export interface SubgraphOptions extends SubgraphAttributesObject, GraphBaseAttributesProps, HasComment {
+    /** Cluster id */
+    id?: string;
+}
+/** Options for Edge */
+export interface EdgeOptions extends EdgeAttributesObject {
+}
+/** Options for Node */
+export interface NodeOptions extends NodeAttributesObject {
+}
+/** Props for RootGraph component */
+export interface RootGraphProps extends Omit<RootGraphOptions, 'label'> {
+    label?: ReactElement | string;
+    children?: ReactNode;
+}
+/** Props for Edge component */
+export interface EdgeProps extends Omit<EdgeOptions, 'label'> {
+    /** Edge targets */
+    targets: EdgeTargetLikeTuple;
+    /** Edge label */
+    label?: ReactElement | string;
+}
+/** Props for Node component */
+export interface NodeProps extends Omit<NodeOptions, 'label' | 'xlabel'> {
+    /** Node id */
+    id: string;
+    /** Node label */
+    label?: ReactElement | string;
+    /** Node xlabel */
+    xlabel?: ReactElement | string;
+}
+/** Props for Subgraph component */
+export interface SubgraphProps extends Omit<SubgraphOptions, 'label'> {
+    /** Subgraph label */
+    label?: ReactElement | string;
+    children?: ReactNode;
+}
+/** Props for GraphPortal component */
+export interface GraphPortalProps {
+    /**
+     * id of the cluster you want to target for the portal.
+     * If not specified, target the cluster that is the container to the portal.
+     */
+    id?: string;
+    children?: ReactNode;
+}
+declare global {
+    namespace JSX {
+        interface IntrinsicElements {
+            'dot:port': {
+                children: string;
+            };
+            'dot:table': HTMLLikeLabel.TableAttributes & {
+                children?: ReactNode;
+            };
+            'dot:tr': HTMLLikeLabel.TrAttributes & {
+                children?: ReactNode;
+            };
+            'dot:td': HTMLLikeLabel.TdAttributes & {
+                children?: ReactNode;
+            };
+            'dot:font': HTMLLikeLabel.FontAttributes & {
+                children?: ReactNode;
+            };
+            'dot:br': HTMLLikeLabel.BrAttributes;
+            'dot:img': HTMLLikeLabel.ImgAttributes;
+            'dot:i': HTMLLikeLabel.IAttributes & {
+                children?: ReactNode;
+            };
+            'dot:b': HTMLLikeLabel.BAttributes & {
+                children?: ReactNode;
+            };
+            'dot:u': HTMLLikeLabel.UAttributes & {
+                children?: ReactNode;
+            };
+            'dot:o': HTMLLikeLabel.OAttributes & {
+                children?: ReactNode;
+            };
+            'dot:sub': HTMLLikeLabel.SubAttributes & {
+                children?: ReactNode;
+            };
+            'dot:sup': HTMLLikeLabel.SupAttributes & {
+                children?: ReactNode;
+            };
+            'dot:s': HTMLLikeLabel.SAttributes & {
+                children?: ReactNode;
+            };
+            'dot:hr': HTMLLikeLabel.HrAttributes;
+            'dot:vr': HTMLLikeLabel.VrAttributes;
+        }
+    }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ts-graphviz/react",
-  "version": "0.10.2",
+  "version": "0.10.3-next-a1de944c70af32f17428537ec0b096de2d68388d",
   "description": "Graphviz-dot Renderer for React.",
   "keywords": [
     "graphviz",
@@ -41,8 +41,8 @@
   "types": "./lib/react.d.ts",
   "dependencies": {
     "react-reconciler": "^0.29.0",
-    "@ts-graphviz/common": "^2.1.2",
-    "ts-graphviz": "^2.1.2"
+    "@ts-graphviz/common": "^2.1.3-next-a1de944c70af32f17428537ec0b096de2d68388d",
+    "ts-graphviz": "^2.1.3-next-a1de944c70af32f17428537ec0b096de2d68388d"
   },
   "devDependencies": {
     "@testing-library/react": "^14.2.1",
@@ -51,7 +51,7 @@
     "@types/react-reconciler": "^0.26.7",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-test-renderer": "^18.2.0",
+    "react-test-renderer": "^18.3.1",
     "typescript": "^5.4.5",
     "vite": "^5.2.8",
     "vite-plugin-dts": "^3.7.3"

package/vite.config.ts

@@ -26,7 +26,8 @@ export default defineConfig({
   plugins: [
     // @ts-ignore
     dts({
-      rollupTypes: true,
+      // NOTE: This is a workaround for global types exports.
+      rollupTypes: false,
     }),
   ],
 });