@ts-graphviz/react 0.9.1 → 0.10.0

package/lib/index.d.ts

@@ -1,368 +0,0 @@
-/// <reference types="react" />
-import { ReactElement, FC, VFC } from 'react';
-import {
-  EdgeAttributes,
-  NodeAttributes,
-  ClusterSubgraphAttributes,
-  RootClusterAttributes,
-  attribute,
-  IHasComment,
-  EdgeTargetLikeTuple,
-  AttributesValue,
-  ICluster,
-  IRootCluster,
-  ISubgraph,
-  IEdge,
-  INode,
-} from 'ts-graphviz';
-
-/** Common attribute values of objects under cluster */
-interface ClusterCommonAttributesProps {
-  /** Attribute value for Edges */
-  edge?: EdgeAttributes;
-  /** Attribute value for Nodes */
-  node?: NodeAttributes;
-  /** Attribute value for Graphs */
-  graph?: ClusterSubgraphAttributes;
-}
-/** Options for RootCluster */
-interface RootClusterOptions
-  extends Omit<RootClusterAttributes, typeof attribute.comment>,
-    ClusterCommonAttributesProps,
-    IHasComment {
-  /** Cluster id */
-  id?: string;
-}
-/** Options for Subgraph */
-interface SubgraphOptions
-  extends Omit<ClusterSubgraphAttributes, typeof attribute.comment>,
-    ClusterCommonAttributesProps,
-    IHasComment {
-  /** Cluster id */
-  id?: string;
-}
-/** Options for Edge */
-interface EdgeOptions extends Omit<EdgeAttributes, typeof attribute.comment>, IHasComment {}
-/** Options for Node */
-interface NodeOptions extends Omit<NodeAttributes, typeof attribute.comment>, IHasComment {}
-/** Props for RootCluster component */
-interface RootClusterProps extends Omit<RootClusterOptions, typeof attribute.label> {
-  label?: ReactElement | string;
-}
-/** Props for Edge component */
-interface EdgeProps extends Omit<EdgeOptions, typeof attribute.label> {
-  /** Edge targets */
-  targets: EdgeTargetLikeTuple;
-  /** Edge label */
-  label?: ReactElement | string;
-}
-/** Props for Node component */
-interface NodeProps extends Omit<NodeOptions, typeof attribute.label | typeof attribute.xlabel> {
-  /** Node id */
-  id: string;
-  /** Node label */
-  label?: ReactElement | string;
-  /** Node xlabel */
-  xlabel?: ReactElement | string;
-}
-/** Props for Subgraph component */
-interface SubgraphProps extends Omit<SubgraphOptions, typeof attribute.label> {
-  /** Subgraph label */
-  label?: ReactElement | string;
-}
-/** Props for ClusterPortal component */
-interface ClusterPortalProps {
-  /**
-   * 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;
-}
-
-declare type ValueOf<T> = T[keyof T];
-declare namespace labels {
-  export type TableProps = {
-    ALIGN?: 'CENTER' | 'LEFT' | 'RIGHT';
-    BGCOLOR?: AttributesValue;
-    BORDER?: AttributesValue;
-    CELLBORDER?: AttributesValue;
-    CELLPADDING?: AttributesValue;
-    CELLSPACING?: AttributesValue;
-    COLOR?: AttributesValue;
-    COLUMNS?: AttributesValue;
-    FIXEDSIZE?: true;
-    GRADIENTANGLE?: AttributesValue;
-    HEIGHT?: AttributesValue;
-    HREF?: AttributesValue;
-    ID?: AttributesValue;
-    PORT?: AttributesValue;
-    ROWS?: AttributesValue;
-    SIDES?: AttributesValue;
-    STYLE?: AttributesValue;
-    TARGET?: AttributesValue;
-    TITLE?: AttributesValue;
-    TOOLTIP?: AttributesValue;
-    VALIGN?: 'MIDDLE' | 'BOTTOM' | 'TOP';
-    WIDTH?: AttributesValue;
-  };
-  type NoAttributes = Record<string, unknown>;
-  export type TrProps = NoAttributes;
-  export type TdProps = {
-    ALIGN?: 'CENTER' | 'LEFT' | 'RIGHT' | 'TEXT';
-    BALIGN?: 'CENTER' | 'LEFT' | 'RIGHT';
-    BGCOLOR?: AttributesValue;
-    BORDER?: AttributesValue;
-    CELLPADDING?: AttributesValue;
-    CELLSPACING?: AttributesValue;
-    COLOR?: AttributesValue;
-    COLSPAN?: AttributesValue;
-    FIXEDSIZE?: boolean;
-    GRADIENTANGLE?: AttributesValue;
-    HEIGHT?: AttributesValue;
-    HREF?: AttributesValue;
-    ID?: AttributesValue;
-    PORT?: AttributesValue;
-    ROWSPAN?: AttributesValue;
-    SIDES?: AttributesValue;
-    STYLE?: AttributesValue;
-    TARGET?: AttributesValue;
-    TITLE?: AttributesValue;
-    TOOLTIP?: AttributesValue;
-    VALIGN?: 'MIDDLE' | 'BOTTOM' | 'TOP';
-    WIDTH?: AttributesValue;
-  };
-  export type FontProps = {
-    COLOR?: AttributesValue;
-    FACE?: AttributesValue;
-    'POINT-SIZE'?: AttributesValue;
-  };
-  export type BrProps = {
-    ALIGN?: 'CENTER' | 'LEFT' | 'RIGHT';
-  };
-  export type ImgProps = {
-    SCALE?: boolean | 'WIDTH' | 'HEIGHT' | 'BOTH';
-    SRC?: AttributesValue;
-  };
-  export type IProps = NoAttributes;
-  export type BProps = NoAttributes;
-  export type UProps = NoAttributes;
-  export type OProps = NoAttributes;
-  export type SubProps = NoAttributes;
-  export type SupProps = NoAttributes;
-  export type SProps = NoAttributes;
-  export type HrProps = NoAttributes;
-  export type VrProps = NoAttributes;
-  export {};
-}
-declare const DOT: Readonly<{
-  readonly PORT: 'dot-port';
-  readonly TABLE: 'dot-table';
-  readonly TR: 'dot-tr';
-  readonly TD: 'dot-td';
-  readonly FONT: 'dot-font';
-  readonly BR: 'dot-br';
-  readonly IMG: 'dot-img';
-  readonly I: 'dot-i';
-  readonly B: 'dot-b';
-  readonly U: 'dot-u';
-  readonly O: 'dot-o';
-  readonly SUB: 'dot-sub';
-  readonly SUP: 'dot-sup';
-  readonly S: 'dot-s';
-  readonly HR: 'dot-hr';
-  readonly VR: 'dot-vr';
-}>;
-declare type DOT = ValueOf<typeof DOT>;
-declare global {
-  namespace JSX {
-    interface IntrinsicElements {
-      [DOT.PORT]: {
-        children: string;
-      };
-      [DOT.TABLE]: React.PropsWithChildren<labels.TableProps>;
-      [DOT.TR]: React.PropsWithChildren<labels.TrProps>;
-      [DOT.TD]: React.PropsWithChildren<labels.TdProps>;
-      [DOT.FONT]: React.PropsWithChildren<labels.FontProps>;
-      [DOT.BR]: labels.BrProps;
-      [DOT.IMG]: labels.ImgProps;
-      [DOT.I]: React.PropsWithChildren<labels.IProps>;
-      [DOT.B]: React.PropsWithChildren<labels.BProps>;
-      [DOT.U]: React.PropsWithChildren<labels.UProps>;
-      [DOT.O]: React.PropsWithChildren<labels.OProps>;
-      [DOT.SUB]: React.PropsWithChildren<labels.SubProps>;
-      [DOT.SUP]: React.PropsWithChildren<labels.SupProps>;
-      [DOT.S]: React.PropsWithChildren<labels.SProps>;
-      [DOT.HR]: labels.HrProps;
-      [DOT.VR]: labels.VrProps;
-    }
-  }
-}
-
-/**
- * Return the cluster of container.
- */
-declare function useContainerCluster(): ICluster | null;
-
-/**
- * Hook to get the current cluster(Digraph, Graph or Subgraph).
- *
- * @throws If it is out of the context of Cluster, it throws an exception.
- */
-declare function useCurrentCluster(): ICluster;
-
-/**
- * `useDigraph` is a hook that creates an instance of Digraph
- * according to the object given by props.
- */
-declare function useDigraph(options?: RootClusterOptions): IRootCluster;
-
-/**
- * `useGraph` is a hook that creates an instance of Graph
- * according to the object given by props.
- */
-declare function useGraph(options?: RootClusterOptions): IRootCluster;
-
-/**
- * `useSubgraph` is a hook that creates an instance of Subgraph
- * according to the object given by props.
- */
-declare function useSubgraph(props?: SubgraphOptions): ISubgraph;
-
-/**
- * `useEdge` is a hook that creates an instance of Edge
- * according to the object given by props.
- */
-declare function useEdge(targets: EdgeTargetLikeTuple, props?: EdgeOptions): IEdge;
-
-/**
- * `useNode` is a hook that creates an instance of Node
- * according to the object given by props.
- */
-declare function useNode(id: string, options?: NodeOptions): INode;
-
-/**
- * `Graph` component.
- */
-declare const Graph: FC<RootClusterProps>;
-
-/**
- * `Digraph` component.
- */
-declare const Digraph: FC<RootClusterProps>;
-
-/**
- * `Subgraph` component.
- */
-declare const Subgraph: FC<SubgraphProps>;
-
-/**
- * `Node` component.
- */
-declare const Node: VFC<NodeProps>;
-
-/**
- * `Edge` component.
- */
-declare const Edge: VFC<EdgeProps>;
-
-/**
- * ClusterPortal component.
- */
-declare const ClusterPortal: FC<ClusterPortalProps>;
-
-/**
- * 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";
- * // }
- * ```
- */
-declare function render(element: ReactElement, container?: ICluster): ICluster;
-/**
- * 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
- */
-declare function renderToDot(element: ReactElement, container?: ICluster): string;
-
-export {
-  ClusterCommonAttributesProps,
-  ClusterPortal,
-  ClusterPortalProps,
-  DOT,
-  Digraph,
-  Edge,
-  EdgeOptions,
-  EdgeProps,
-  Graph,
-  Node,
-  NodeOptions,
-  NodeProps,
-  RootClusterOptions,
-  RootClusterProps,
-  Subgraph,
-  SubgraphOptions,
-  SubgraphProps,
-  labels,
-  render,
-  renderToDot,
-  useContainerCluster,
-  useCurrentCluster,
-  useDigraph,
-  useEdge,
-  useGraph,
-  useNode,
-  useSubgraph,
-};

package/lib/index.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("ts-graphviz"),r=require("prop-types"),n=require("react-dom/server.js"),o=require("react-reconciler");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=a(e),i=a(r),l=a(o),p=Object.freeze({PORT:"dot-port",TABLE:"dot-table",TR:"dot-tr",TD:"dot-td",FONT:"dot-font",BR:"dot-br",IMG:"dot-img",I:"dot-i",B:"dot-b",U:"dot-u",O:"dot-o",SUB:"dot-sub",SUP:"dot-sup",S:"dot-s",HR:"dot-hr",VR:"dot-vr"}),d=u.default.createContext(null);function c(){return e.useContext(d)}d.displayName="ContainerCluster";var s=u.default.createContext(null);s.displayName="CurrentCluster";function f(){var t=e.useContext(s);if(null===t)throw Error("useCluster must be called within a cluster such as Digraph, Graph, Subgraph.");return t}function m(e,t){var r={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(r[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(n=Object.getOwnPropertySymbols(e);o<n.length;o++)t.indexOf(n[o])<0&&Object.prototype.propertyIsEnumerable.call(e,n[o])&&(r[n[o]]=e[n[o]])}return r}var v=u.default.createContext(null);function g(){var t=e.useContext(v);if(null===t)throw Error("Cannot call useGraphvizContext outside GraphvizContext.\nBasically, you need to use the render function provided by @ts-graphviz/react.");return t}function h(t,r,n){var o=n.edge,a=n.node,u=n.graph;e.useEffect((function(){t.clear(),t.apply(r)}),[t,r]),e.useEffect((function(){t.attributes.node.clear(),t.attributes.node.apply(null!=a?a:{})}),[t,a]),e.useEffect((function(){t.attributes.edge.clear(),t.attributes.edge.apply(null!=o?o:{})}),[t,o]),e.useEffect((function(){t.attributes.graph.clear(),t.attributes.graph.apply(null!=u?u:{})}),[t,u])}function y(t,r){e.useEffect((function(){t.comment=r}),[t,r])}function b(r){void 0===r&&(r={});var n=r.id,o=r.comment,a=r.edge,u=r.node,i=r.graph,l=m(r,["id","comment","edge","node","graph"]),p=g(),d=e.useMemo((function(){var e=new t.Digraph(n);return p.container=e,e.comment=o,e.apply(l),e.attributes.node.apply(null!=u?u:{}),e.attributes.edge.apply(null!=a?a:{}),e.attributes.graph.apply(null!=i?i:{}),e}),[p,n,o,a,u,i,l]);return y(d,o),h(d,l,{edge:a,node:u,graph:i}),e.useEffect((function(){return function(){p.container=void 0}}),[p]),d}function C(r){void 0===r&&(r={});var n=r.id,o=r.comment,a=r.edge,u=r.node,i=r.graph,l=m(r,["id","comment","edge","node","graph"]),p=g(),d=e.useMemo((function(){var e=new t.Graph(n);return p.container=e,e.comment=o,e.apply(l),e.attributes.node.apply(null!=u?u:{}),e.attributes.edge.apply(null!=a?a:{}),e.attributes.graph.apply(null!=i?i:{}),e}),[p,n,o,a,u,i,l]);return y(d,o),h(d,l,{edge:a,node:u,graph:i}),e.useEffect((function(){return function(){p.container=void 0}}),[p]),d}function x(r){void 0===r&&(r={});var n=r.id,o=r.comment,a=r.edge,u=r.node,i=r.graph,l=m(r,["id","comment","edge","node","graph"]),p=g(),d=f(),c=e.useMemo((function(){var e=new t.Subgraph(n);return null!==d?d.addSubgraph(e):p.container||(p.container=e),e.comment=o,e.apply(l),e.attributes.node.apply(null!=u?u:{}),e.attributes.edge.apply(null!=a?a:{}),e.attributes.graph.apply(null!=i?i:{}),e}),[p,d,n,o,a,u,i,l]);return y(c,o),h(c,l,{edge:a,node:u,graph:i}),e.useEffect((function(){return function(){d.removeSubgraph(c)}}),[d,c]),c}function E(t,r){e.useEffect((function(){t.attributes.clear(),t.attributes.apply(r)}),[t,r])}function T(t,r){void 0===r&&(r={});var n=r.comment,o=m(r,["comment"]),a=f();if(t.length<2)throw Error("Edges must have at least 2 targets.");var u=e.useMemo((function(){var e=a.createEdge(t);return e.comment=n,e.attributes.apply(o),e}),[a,t,n,o]);return y(u,n),E(u,o),e.useEffect((function(){return function(){a.removeEdge(u)}}),[a,u]),u}function P(t,r){void 0===r&&(r={});var n=r.comment,o=m(r,["comment"]),a=f(),u=e.useMemo((function(){var e=a.createNode(t);return e.attributes.apply(o),e.comment=n,e}),[a,t,o,n]);return y(u,n),E(u,o),e.useEffect((function(){return function(){a.removeNode(u)}}),[a,u]),u}function O(t){return e.useMemo((function(){return function(t){return e.isValidElement(t)?"<"+n.renderToStaticMarkup(t).replace(/<dot-port>(.+?)<\/dot-port>/gi,"<$1>").replace(/<(\/?)dot-([a-z-]+)/gi,(function(e,t,r){return"<"+t+r.toUpperCase()}))+">":t}(t)}),[t])}v.displayName="GraphvizContext";var w=u.default.createContext(new Map);function M(){return e.useContext(w)}w.displayName="ClusterMap";var D=function(t){var r=t.children,n=t.label,o=m(t,["children","label"]);if(null!==c())throw Error("RootCluster is duplicated.\nUse only one of Digraph and Graph.");var a=O(n);void 0!==a&&Object.assign(o,{label:a});var i=C(o),l=M();return e.useEffect((function(){void 0!==i.id&&l.set(i.id,i)}),[l,i]),u.default.createElement(d.Provider,{value:i},u.default.createElement(s.Provider,{value:i},r))};D.displayName="Graph",D.defaultProps={id:void 0,comment:void 0,label:void 0},D.propTypes={id:i.default.string,comment:i.default.string,label:i.default.oneOfType([i.default.element,i.default.string])};var N=function(t){var r=t.children,n=t.label,o=m(t,["children","label"]);if(null!==c())throw Error("RootCluster is duplicated.\nUse only one of Digraph and Graph.");var a=O(n);void 0!==a&&Object.assign(o,{label:a});var i=b(o),l=M();return e.useEffect((function(){void 0!==i.id&&l.set(i.id,i)}),[l,i]),u.default.createElement(d.Provider,{value:i},u.default.createElement(s.Provider,{value:i},r))};N.displayName="Digraph",N.defaultProps={id:void 0,comment:void 0,label:void 0},N.propTypes={id:i.default.string,comment:i.default.string,label:i.default.oneOfType([i.default.element,i.default.string])};var S=function(t){var r=t.children,n=t.label,o=m(t,["children","label"]),a=O(n);void 0!==a&&Object.assign(o,{label:a});var i=x(o),l=M();return e.useEffect((function(){void 0!==i.id&&l.set(i.id,i)}),[i,l]),u.default.createElement(s.Provider,{value:i},r)};S.displayName="Subgraph",S.propTypes={id:i.default.string,comment:i.default.string,label:i.default.oneOfType([i.default.element,i.default.string])},S.defaultProps={id:void 0,comment:void 0,label:void 0};var j=function(e){var t=e.id,r=e.label,n=e.xlabel,o=m(e,["id","label","xlabel"]),a=O(r),u=O(n);return void 0!==a&&Object.assign(o,{label:a}),void 0!==u&&Object.assign(o,{xlabel:u}),P(t,o),null};j.displayName="Node",j.propTypes={id:i.default.string.isRequired,comment:i.default.string,label:i.default.oneOfType([i.default.element,i.default.string]),xlabel:i.default.oneOfType([i.default.element,i.default.string])},j.defaultProps={comment:void 0,label:void 0,xlabel:void 0};var G=function(e){var t=e.targets,r=e.label,n=m(e,["targets","label"]),o=O(r);return void 0!==o&&Object.assign(n,{label:o}),T(t,n),null};G.displayName="Edge",G.propTypes={targets:i.default.array.isRequired,comment:i.default.string,label:i.default.oneOfType([i.default.element,i.default.string])},G.defaultProps={comment:void 0,label:void 0};var R=function(t){var r=t.children,n=t.id,o=c(),a=e.useContext(w),i=e.useMemo((function(){var e;return n&&null!==(e=a.get(n))&&void 0!==e?e:o}),[o,a,n]);return u.default.createElement(s.Provider,{value:i},r)};R.displayName="ClusterPortal",R.defaultProps={id:void 0},R.propTypes={id:i.default.string};var z=function(){function e(){this.now=Date.now,this.setTimeout=setTimeout,this.clearTimeout=clearTimeout,this.noTimeout=-1,this.isPrimaryRenderer=!1,this.supportsMutation=!1,this.supportsPersistence=!1,this.supportsHydration=!1}return e.prototype.preparePortalMount=function(e){},e.prototype.scheduleTimeout=function(e,t){},e.prototype.cancelTimeout=function(e){},e.prototype.queueMicrotask=function(e){},e.prototype.getPublicInstance=function(e){return e},e.prototype.getRootHostContext=function(e){return{}},e.prototype.getChildHostContext=function(e,t,r){return e},e.prototype.prepareForCommit=function(e){return null},e.prototype.resetAfterCommit=function(e){},e.prototype.createInstance=function(e,t,r,n,o){return e(t)},e.prototype.appendInitialChild=function(e,t){e.appendChild(t)},e.prototype.finalizeInitialChildren=function(e,t,r,n,o){return!1},e.prototype.prepareUpdate=function(e,t,r,n,o,a){return{}},e.prototype.shouldSetTextContent=function(e,t){return!1},e.prototype.shouldDeprioritizeSubtree=function(e,t){return!1},e.prototype.createTextInstance=function(e,t,r,n){return e},e.prototype.scheduleDeferredCallback=function(e,t){},e.prototype.cancelDeferredCallback=function(e){},e.prototype.appendChild=function(e,t){e.appendChild&&e.appendChild(t)},e.prototype.appendChildToContainer=function(e,t){},e.prototype.commitTextUpdate=function(e,t,r){},e.prototype.commitMount=function(e,t,r,n){},e.prototype.commitUpdate=function(e,t,r,n,o,a){},e.prototype.insertBefore=function(e,t,r){},e.prototype.insertInContainerBefore=function(e,t,r){},e.prototype.removeChild=function(e,t){},e.prototype.removeChildFromContainer=function(e,t){},e.prototype.resetTextContent=function(e){},e}(),I=l.default(new z),U=function(){};function q(e,t){return void 0===t&&(t=new Map),e&&(e.id&&t.set(e.id,e),e.subgraphs.forEach((function(e){return q(e,t)}))),t}function B(t,r){var n={container:r};if(I.updateContainer(e.createElement(v.Provider,{value:n},e.createElement(w.Provider,{value:q(r)},e.createElement(d.Provider,{value:null!=r?r:null},r?e.createElement(s.Provider,{value:r},t):t))),I.createContainer({},0,!1,null),null,U),!n.container)throw Error("There are no clusters of container(Subgraph, Digraph, Graph).");return n.container}exports.ClusterPortal=R,exports.DOT=p,exports.Digraph=N,exports.Edge=G,exports.Graph=D,exports.Node=j,exports.Subgraph=S,exports.render=B,exports.renderToDot=function(e,r){return t.toDot(B(e,r))},exports.useContainerCluster=c,exports.useCurrentCluster=f,exports.useDigraph=b,exports.useEdge=T,exports.useGraph=C,exports.useNode=P,exports.useSubgraph=x;

package/lib/index.mjs

@@ -1 +0,0 @@
-import e,{useContext as t,useEffect as r,useMemo as n,isValidElement as o,createElement as i}from"react";import{Digraph as a,Graph as u,Subgraph as l,toDot as p}from"ts-graphviz";import c from"prop-types";import{renderToStaticMarkup as d}from"react-dom/server.js";import s from"react-reconciler";var f=Object.freeze({PORT:"dot-port",TABLE:"dot-table",TR:"dot-tr",TD:"dot-td",FONT:"dot-font",BR:"dot-br",IMG:"dot-img",I:"dot-i",B:"dot-b",U:"dot-u",O:"dot-o",SUB:"dot-sub",SUP:"dot-sup",S:"dot-s",HR:"dot-hr",VR:"dot-vr"}),m=e.createContext(null);function v(){return t(m)}m.displayName="ContainerCluster";var y=e.createContext(null);y.displayName="CurrentCluster";function g(){var e=t(y);if(null===e)throw Error("useCluster must be called within a cluster such as Digraph, Graph, Subgraph.");return e}function h(e,t){var r={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(r[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(n=Object.getOwnPropertySymbols(e);o<n.length;o++)t.indexOf(n[o])<0&&Object.prototype.propertyIsEnumerable.call(e,n[o])&&(r[n[o]]=e[n[o]])}return r}var b=e.createContext(null);function C(){var e=t(b);if(null===e)throw Error("Cannot call useGraphvizContext outside GraphvizContext.\nBasically, you need to use the render function provided by @ts-graphviz/react.");return e}function T(e,t,n){var o=n.edge,i=n.node,a=n.graph;r((function(){e.clear(),e.apply(t)}),[e,t]),r((function(){e.attributes.node.clear(),e.attributes.node.apply(null!=i?i:{})}),[e,i]),r((function(){e.attributes.edge.clear(),e.attributes.edge.apply(null!=o?o:{})}),[e,o]),r((function(){e.attributes.graph.clear(),e.attributes.graph.apply(null!=a?a:{})}),[e,a])}function P(e,t){r((function(){e.comment=t}),[e,t])}function O(e){void 0===e&&(e={});var t=e.id,o=e.comment,i=e.edge,u=e.node,l=e.graph,p=h(e,["id","comment","edge","node","graph"]),c=C(),d=n((function(){var e=new a(t);return c.container=e,e.comment=o,e.apply(p),e.attributes.node.apply(null!=u?u:{}),e.attributes.edge.apply(null!=i?i:{}),e.attributes.graph.apply(null!=l?l:{}),e}),[c,t,o,i,u,l,p]);return P(d,o),T(d,p,{edge:i,node:u,graph:l}),r((function(){return function(){c.container=void 0}}),[c]),d}function x(e){void 0===e&&(e={});var t=e.id,o=e.comment,i=e.edge,a=e.node,l=e.graph,p=h(e,["id","comment","edge","node","graph"]),c=C(),d=n((function(){var e=new u(t);return c.container=e,e.comment=o,e.apply(p),e.attributes.node.apply(null!=a?a:{}),e.attributes.edge.apply(null!=i?i:{}),e.attributes.graph.apply(null!=l?l:{}),e}),[c,t,o,i,a,l,p]);return P(d,o),T(d,p,{edge:i,node:a,graph:l}),r((function(){return function(){c.container=void 0}}),[c]),d}function E(e){void 0===e&&(e={});var t=e.id,o=e.comment,i=e.edge,a=e.node,u=e.graph,p=h(e,["id","comment","edge","node","graph"]),c=C(),d=g(),s=n((function(){var e=new l(t);return null!==d?d.addSubgraph(e):c.container||(c.container=e),e.comment=o,e.apply(p),e.attributes.node.apply(null!=a?a:{}),e.attributes.edge.apply(null!=i?i:{}),e.attributes.graph.apply(null!=u?u:{}),e}),[c,d,t,o,i,a,u,p]);return P(s,o),T(s,p,{edge:i,node:a,graph:u}),r((function(){return function(){d.removeSubgraph(s)}}),[d,s]),s}function w(e,t){r((function(){e.attributes.clear(),e.attributes.apply(t)}),[e,t])}function N(e,t){void 0===t&&(t={});var o=t.comment,i=h(t,["comment"]),a=g();if(e.length<2)throw Error("Edges must have at least 2 targets.");var u=n((function(){var t=a.createEdge(e);return t.comment=o,t.attributes.apply(i),t}),[a,e,o,i]);return P(u,o),w(u,i),r((function(){return function(){a.removeEdge(u)}}),[a,u]),u}function S(e,t){void 0===t&&(t={});var o=t.comment,i=h(t,["comment"]),a=g(),u=n((function(){var t=a.createNode(e);return t.attributes.apply(i),t.comment=o,t}),[a,e,i,o]);return P(u,o),w(u,i),r((function(){return function(){a.removeNode(u)}}),[a,u]),u}function j(e){return n((function(){return function(e){return o(e)?"<"+d(e).replace(/<dot-port>(.+?)<\/dot-port>/gi,"<$1>").replace(/<(\/?)dot-([a-z-]+)/gi,(function(e,t,r){return"<"+t+r.toUpperCase()}))+">":e}(e)}),[e])}b.displayName="GraphvizContext";var D=e.createContext(new Map);function R(){return t(D)}D.displayName="ClusterMap";var G=function(t){var n=t.children,o=t.label,i=h(t,["children","label"]);if(null!==v())throw Error("RootCluster is duplicated.\nUse only one of Digraph and Graph.");var a=j(o);void 0!==a&&Object.assign(i,{label:a});var u=x(i),l=R();return r((function(){void 0!==u.id&&l.set(u.id,u)}),[l,u]),e.createElement(m.Provider,{value:u},e.createElement(y.Provider,{value:u},n))};G.displayName="Graph",G.defaultProps={id:void 0,comment:void 0,label:void 0},G.propTypes={id:c.string,comment:c.string,label:c.oneOfType([c.element,c.string])};var z=function(t){var n=t.children,o=t.label,i=h(t,["children","label"]);if(null!==v())throw Error("RootCluster is duplicated.\nUse only one of Digraph and Graph.");var a=j(o);void 0!==a&&Object.assign(i,{label:a});var u=O(i),l=R();return r((function(){void 0!==u.id&&l.set(u.id,u)}),[l,u]),e.createElement(m.Provider,{value:u},e.createElement(y.Provider,{value:u},n))};z.displayName="Digraph",z.defaultProps={id:void 0,comment:void 0,label:void 0},z.propTypes={id:c.string,comment:c.string,label:c.oneOfType([c.element,c.string])};var I=function(t){var n=t.children,o=t.label,i=h(t,["children","label"]),a=j(o);void 0!==a&&Object.assign(i,{label:a});var u=E(i),l=R();return r((function(){void 0!==u.id&&l.set(u.id,u)}),[u,l]),e.createElement(y.Provider,{value:u},n)};I.displayName="Subgraph",I.propTypes={id:c.string,comment:c.string,label:c.oneOfType([c.element,c.string])},I.defaultProps={id:void 0,comment:void 0,label:void 0};var U=function(e){var t=e.id,r=e.label,n=e.xlabel,o=h(e,["id","label","xlabel"]),i=j(r),a=j(n);return void 0!==i&&Object.assign(o,{label:i}),void 0!==a&&Object.assign(o,{xlabel:a}),S(t,o),null};U.displayName="Node",U.propTypes={id:c.string.isRequired,comment:c.string,label:c.oneOfType([c.element,c.string]),xlabel:c.oneOfType([c.element,c.string])},U.defaultProps={comment:void 0,label:void 0,xlabel:void 0};var M=function(e){var t=e.targets,r=e.label,n=h(e,["targets","label"]),o=j(r);return void 0!==o&&Object.assign(n,{label:o}),N(t,n),null};M.displayName="Edge",M.propTypes={targets:c.array.isRequired,comment:c.string,label:c.oneOfType([c.element,c.string])},M.defaultProps={comment:void 0,label:void 0};var B=function(r){var o=r.children,i=r.id,a=v(),u=t(D),l=n((function(){var e;return i&&null!==(e=u.get(i))&&void 0!==e?e:a}),[a,u,i]);return e.createElement(y.Provider,{value:l},o)};B.displayName="ClusterPortal",B.defaultProps={id:void 0},B.propTypes={id:c.string};var H=s(new(function(){function e(){this.now=Date.now,this.setTimeout=setTimeout,this.clearTimeout=clearTimeout,this.noTimeout=-1,this.isPrimaryRenderer=!1,this.supportsMutation=!1,this.supportsPersistence=!1,this.supportsHydration=!1}return e.prototype.preparePortalMount=function(e){},e.prototype.scheduleTimeout=function(e,t){},e.prototype.cancelTimeout=function(e){},e.prototype.queueMicrotask=function(e){},e.prototype.getPublicInstance=function(e){return e},e.prototype.getRootHostContext=function(e){return{}},e.prototype.getChildHostContext=function(e,t,r){return e},e.prototype.prepareForCommit=function(e){return null},e.prototype.resetAfterCommit=function(e){},e.prototype.createInstance=function(e,t,r,n,o){return e(t)},e.prototype.appendInitialChild=function(e,t){e.appendChild(t)},e.prototype.finalizeInitialChildren=function(e,t,r,n,o){return!1},e.prototype.prepareUpdate=function(e,t,r,n,o,i){return{}},e.prototype.shouldSetTextContent=function(e,t){return!1},e.prototype.shouldDeprioritizeSubtree=function(e,t){return!1},e.prototype.createTextInstance=function(e,t,r,n){return e},e.prototype.scheduleDeferredCallback=function(e,t){},e.prototype.cancelDeferredCallback=function(e){},e.prototype.appendChild=function(e,t){e.appendChild&&e.appendChild(t)},e.prototype.appendChildToContainer=function(e,t){},e.prototype.commitTextUpdate=function(e,t,r){},e.prototype.commitMount=function(e,t,r,n){},e.prototype.commitUpdate=function(e,t,r,n,o,i){},e.prototype.insertBefore=function(e,t,r){},e.prototype.insertInContainerBefore=function(e,t,r){},e.prototype.removeChild=function(e,t){},e.prototype.removeChildFromContainer=function(e,t){},e.prototype.resetTextContent=function(e){},e}())),k=function(){};function q(e,t){return void 0===t&&(t=new Map),e&&(e.id&&t.set(e.id,e),e.subgraphs.forEach((function(e){return q(e,t)}))),t}function F(e,t){var r={container:t};if(H.updateContainer(i(b.Provider,{value:r},i(D.Provider,{value:q(t)},i(m.Provider,{value:null!=t?t:null},t?i(y.Provider,{value:t},e):e))),H.createContainer({},0,!1,null),null,k),!r.container)throw Error("There are no clusters of container(Subgraph, Digraph, Graph).");return r.container}function A(e,t){return p(F(e,t))}export{B as ClusterPortal,f as DOT,z as Digraph,M as Edge,G as Graph,U as Node,I as Subgraph,F as render,A as renderToDot,v as useContainerCluster,g as useCurrentCluster,O as useDigraph,N as useEdge,x as useGraph,S as useNode,E as useSubgraph};

package/rollup.config.js

@@ -1,55 +0,0 @@
-import typescript from 'rollup-plugin-typescript2';
-import del from 'rollup-plugin-delete';
-import dts from 'rollup-plugin-dts';
-import { terser } from 'rollup-plugin-terser';
-
-/** @type {import('rollup').RollupOptions[]} */
-const options = [
-  {
-    input: './src/index.ts',
-    plugins: [
-      typescript({
-        tsconfigOverride: {
-          compilerOptions: {
-            module: 'ESNext',
-            declaration: true,
-          },
-        },
-      }),
-      terser({
-        format: {
-          comments: false,
-        },
-      }),
-    ],
-    external: ['react', 'react-dom/server.js', 'ts-graphviz', 'prop-types', 'react-reconciler'],
-    output: [
-      {
-        format: 'cjs',
-        file: './lib/index.js',
-      },
-      {
-        format: 'esm',
-        file: './lib/index.mjs',
-      },
-    ],
-  },
-  {
-    input: './lib/index.d.ts',
-    plugins: [
-      del({
-        targets: ['lib/**/*.d.ts', '!lib/index.d.ts'],
-        hook: 'buildEnd',
-      }),
-      dts(),
-    ],
-    output: [
-      {
-        format: 'esm',
-        file: './lib/index.d.ts',
-      },
-    ],
-  },
-];
-
-export default options;