From d67a51bbc71dab204e741c44abea49ecfa123fab Mon Sep 17 00:00:00 2001 From: afonso Date: Mon, 18 Jul 2022 18:41:43 +0100 Subject: [PATCH 1/9] Update props --- src/react-diagrams/MetaLinkFactory.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/react-diagrams/MetaLinkFactory.tsx b/src/react-diagrams/MetaLinkFactory.tsx index ae75732..b32f513 100644 --- a/src/react-diagrams/MetaLinkFactory.tsx +++ b/src/react-diagrams/MetaLinkFactory.tsx @@ -30,7 +30,7 @@ export class MetaLinkFactory extends DefaultLinkFactory { return ( // @ts-ignore - + ); } // TODO: Generate default link instead From ed9dc87b6c4537567660c5048edadb9841c4f645 Mon Sep 17 00:00:00 2001 From: afonso Date: Mon, 18 Jul 2022 19:01:26 +0100 Subject: [PATCH 2/9] Add compiled dist --- dist/meta-diagram.cjs.development.js | 4 ++-- dist/meta-diagram.cjs.development.js.map | 2 +- dist/meta-diagram.cjs.production.min.js | 2 +- dist/meta-diagram.cjs.production.min.js.map | 2 +- dist/meta-diagram.esm.js | 4 ++-- dist/meta-diagram.esm.js.map | 2 +- 6 files changed, 8 insertions(+), 8 deletions(-) diff --git a/dist/meta-diagram.cjs.development.js b/dist/meta-diagram.cjs.development.js index 4788961..4fd3cd4 100644 --- a/dist/meta-diagram.cjs.development.js +++ b/dist/meta-diagram.cjs.development.js @@ -159,8 +159,8 @@ class MetaLinkFactory extends createEngine.DefaultLinkFactory { model.getOptions().shape); return (// @ts-ignore React__default.createElement(ReactComponentType, { - engine: this.engine, - model: model, + diagramEngine: this.engine, + link: model, path: path, selected: selected }) diff --git a/dist/meta-diagram.cjs.development.js.map b/dist/meta-diagram.cjs.development.js.map index 4bc9d55..4b99af1 100644 --- a/dist/meta-diagram.cjs.development.js.map +++ b/dist/meta-diagram.cjs.development.js.map @@ -1 +1 @@ -{"version":3,"file":"meta-diagram.cjs.development.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport { MetaNode } from './models/MetaNode';\nimport { MetaLink } from './models/MetaLink';\nimport { ComponentsMap } from './models/ComponentsMap';\nimport createEngine, { DiagramModel } from '@projectstorm/react-diagrams';\nimport { MetaNodeFactory } from './react-diagrams/MetaNodeFactory';\nimport { MetaLinkFactory } from './react-diagrams/MetaLinkFactory';\nimport { CanvasWidget } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './react-diagrams/MetaNodeModel';\nimport { getLinkModel } from './helpers/linksHelper';\nimport { makeStyles } from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n}: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport { MetaNode, MetaLink, MetaNodeModel, ComponentsMap };\nexport { MetaLinkModel } from './react-diagrams/MetaLinkModel';\nexport { Position } from './models/Position';\n"],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","getNode","find","n","getLinkModel","metaLink","link","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"meta-diagram.cjs.development.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport { MetaNode } from './models/MetaNode';\nimport { MetaLink } from './models/MetaLink';\nimport { ComponentsMap } from './models/ComponentsMap';\nimport createEngine, { DiagramModel } from '@projectstorm/react-diagrams';\nimport { MetaNodeFactory } from './react-diagrams/MetaNodeFactory';\nimport { MetaLinkFactory } from './react-diagrams/MetaLinkFactory';\nimport { CanvasWidget } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './react-diagrams/MetaNodeModel';\nimport { getLinkModel } from './helpers/linksHelper';\nimport { makeStyles } from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n}: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport { MetaNode, MetaLink, MetaNodeModel, ComponentsMap };\nexport { MetaLinkModel } from './react-diagrams/MetaLinkModel';\nexport { Position } from './models/Position';\n"],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","diagramEngine","link","getNode","find","n","getLinkModel","metaLink","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file diff --git a/dist/meta-diagram.cjs.production.min.js b/dist/meta-diagram.cjs.production.min.js index 60f9863..2c2ec7e 100644 --- a/dist/meta-diagram.cjs.production.min.js +++ b/dist/meta-diagram.cjs.production.min.js @@ -1,2 +1,2 @@ -"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t,r=require("react"),o=e(r),n=require("@projectstorm/react-diagrams"),i=e(n),s=require("@projectstorm/react-canvas-core"),a=require("@material-ui/core"),l=require("@mui/system"),c=require("@mui/styles"),d=require("@mui/material");class m{constructor(e,t,r,o){this.options=o,this.options.set("id",e),this.options.set("name",t),this.options.set("shape",r)}getId(){return this.options.get("id")}getShape(){return this.options.get("shape")}}!function(e){e.META_NODE="meta-node-type",e.META_LINK="meta-link-type"}(t||(t={}));class C extends n.NodeModel{constructor(e={}){super({...e,type:t.META_NODE}),this.addPort(new n.DefaultPortModel({in:!0,name:"in"})),this.addPort(new n.DefaultPortModel({in:!1,name:"out"}))}}const g=()=>o.createElement("div",null,"Unknown Type");class u extends s.AbstractReactFactory{constructor(e){super(t.META_NODE),this.componentsMap=e}generateModel(){return new C}generateReactWidget(e){if(this.componentsMap.has(e.model.options.shape)){const t=this.componentsMap.get(e.model.options.shape);return o.createElement(t,{engine:this.engine,model:e.model})}return o.createElement(g,null)}}class p extends n.DefaultLinkModel{constructor(e={}){super({...e,type:t.META_LINK})}}class h extends n.DefaultLinkFactory{constructor(e){super(t.META_LINK),this.componentsMap=e}generateModel(){return new p}generateLinkSegment(e,t,r){var n;if(this.componentsMap.has(null==(n=e.getOptions())?void 0:n.shape)){const n=this.componentsMap.get(e.getOptions().shape);return o.createElement(n,{engine:this.engine,model:e,path:r,selected:t})}return o.createElement(g,null)}}function f(e,t){return t.find(t=>t.getOptions().id===e)}const{textWhite:w,dividerColor:v}={fontFamily:"Inter, sans-serif",primaryBg:"#f1f1f1",textWhite:"#FFFFFF",chipTextColor:"#F2F2F7",chipBgColor:"rgba(60, 60, 67, 0.4)",chipPrimaryTextColor:"rgba(255, 255, 255, 0.8)",chipPrimaryBgColor:"rgba(0, 122, 255, 0.6)",breadcrumbLinkColor:"#A2A2A2",breadcrumbTextColor:"#292929",buttonPrimaryBgColor:"4353FF",buttonPrimaryBgHoverColor:"#3443E1",buttonPrimaryDisabledBgColor:"rgba(0, 122, 255, 0.4)",listItemActiveBg:"#007AFF",listSelectedTextColor:"#3C3C43",listBoxShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)",listBorderColor:"rgba(0, 0, 0, 0.04)",dividerColor:"rgba(118, 120, 125, 0.12)",dropdownBg:"rgba(246, 246, 248, 0.8)",dropdownTextColor:"rgba(60, 60, 67, 0.6)",overlayColor:"rgba(0, 0, 0, 0.4)",progressBg:"#E5E5E5",progressBar:"#017AFF",progressShadow:"inset 0 0 0.0625rem #E3E3E3",switchShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)"},x=c.makeStyles(()=>({root:{zIndex:"5",width:"4rem",background:w,boxShadow:"0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)",borderRadius:"2rem",position:"fixed",left:"1rem",top:"50%",transform:"translateY(-50%)","&.right":{left:"auto",right:"1rem"},"& .MuiList-root":{padding:"0.75rem"}},node:{margin:"0.25rem 0","& .MuiDivider-root":{borderColor:v,width:"calc(100% - 1.5rem)",margin:"0 auto",border:"none",borderTop:"0.0625rem solid"},"& img":{display:"block",margin:"1rem 0"}}})),M=()=>{const e=x();return o.createElement(l.Box,{className:e.root+" left"},o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{selected:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"move"})))),o.createElement(l.Box,{className:e.node},o.createElement(d.Divider,null),o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n').toString("base64"),alt:"node"}),o.createElement(d.Divider,null)),o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{disabled:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"fullscreen"})))))},b=a.makeStyles(e=>({container:{height:"100%",width:"100%"},canvasContainer:{height:"100%",width:"100%",background:"#333333"}}));exports.ComponentsMap=class{constructor(e,t){this.nodes=e,this.links=t}},exports.MetaLink=class{constructor(e,t,r,o,n,i,s,a){this.sourceId=o,this.sourcePortId=n,this.targetId=i,this.targetPortId=s,this.options=new m(e,t,r,a)}getSourceId(){return this.sourceId}getSourcePortId(){return this.sourcePortId}getTargetId(){return this.targetId}getTargetPortId(){return this.targetPortId}},exports.MetaLinkModel=p,exports.MetaNode=class{constructor(e,t,r,o,n){this.children=[],n.set("position",o),this.options=new m(e,t,r,n)}},exports.MetaNodeModel=C,exports.Position=class{constructor(e,t){this.x=e,this.y=t}},exports.default=({metaNodes:e,metaLinks:t,componentsMap:o,wrapperClassName:a,canvasClassName:l})=>{const c=b(),d=i();d.getNodeFactories().registerFactory(new u(o.nodes)),d.getLinkFactories().registerFactory(new h(o.links));const m=new n.DiagramModel,g=e.map(e=>new C(Object.fromEntries(e.options.options))),w=t.map(e=>function(e,t){const r=new p(Object.fromEntries(e.options.options)),o=f(e.getSourceId(),t),n=f(e.getTargetId(),t);if(o&&n)return r.setSourcePort(o.getPort(e.getSourcePortId())),r.setTargetPort(n.getPort(e.getTargetPortId())),r}(e,g)).filter(e=>void 0!==e);m.addAll(...g,...w),d.setModel(m);const v=l||c.canvasContainer;return r.createElement("div",{className:a||c.container},r.createElement(M,null),r.createElement(s.CanvasWidget,{className:v,engine:d}))}; +"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t,r=require("react"),o=e(r),n=require("@projectstorm/react-diagrams"),i=e(n),s=require("@projectstorm/react-canvas-core"),a=require("@material-ui/core"),l=require("@mui/system"),c=require("@mui/styles"),d=require("@mui/material");class m{constructor(e,t,r,o){this.options=o,this.options.set("id",e),this.options.set("name",t),this.options.set("shape",r)}getId(){return this.options.get("id")}getShape(){return this.options.get("shape")}}!function(e){e.META_NODE="meta-node-type",e.META_LINK="meta-link-type"}(t||(t={}));class C extends n.NodeModel{constructor(e={}){super({...e,type:t.META_NODE}),this.addPort(new n.DefaultPortModel({in:!0,name:"in"})),this.addPort(new n.DefaultPortModel({in:!1,name:"out"}))}}const g=()=>o.createElement("div",null,"Unknown Type");class u extends s.AbstractReactFactory{constructor(e){super(t.META_NODE),this.componentsMap=e}generateModel(){return new C}generateReactWidget(e){if(this.componentsMap.has(e.model.options.shape)){const t=this.componentsMap.get(e.model.options.shape);return o.createElement(t,{engine:this.engine,model:e.model})}return o.createElement(g,null)}}class p extends n.DefaultLinkModel{constructor(e={}){super({...e,type:t.META_LINK})}}class h extends n.DefaultLinkFactory{constructor(e){super(t.META_LINK),this.componentsMap=e}generateModel(){return new p}generateLinkSegment(e,t,r){var n;if(this.componentsMap.has(null==(n=e.getOptions())?void 0:n.shape)){const n=this.componentsMap.get(e.getOptions().shape);return o.createElement(n,{diagramEngine:this.engine,link:e,path:r,selected:t})}return o.createElement(g,null)}}function f(e,t){return t.find(t=>t.getOptions().id===e)}const{textWhite:w,dividerColor:v}={fontFamily:"Inter, sans-serif",primaryBg:"#f1f1f1",textWhite:"#FFFFFF",chipTextColor:"#F2F2F7",chipBgColor:"rgba(60, 60, 67, 0.4)",chipPrimaryTextColor:"rgba(255, 255, 255, 0.8)",chipPrimaryBgColor:"rgba(0, 122, 255, 0.6)",breadcrumbLinkColor:"#A2A2A2",breadcrumbTextColor:"#292929",buttonPrimaryBgColor:"4353FF",buttonPrimaryBgHoverColor:"#3443E1",buttonPrimaryDisabledBgColor:"rgba(0, 122, 255, 0.4)",listItemActiveBg:"#007AFF",listSelectedTextColor:"#3C3C43",listBoxShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)",listBorderColor:"rgba(0, 0, 0, 0.04)",dividerColor:"rgba(118, 120, 125, 0.12)",dropdownBg:"rgba(246, 246, 248, 0.8)",dropdownTextColor:"rgba(60, 60, 67, 0.6)",overlayColor:"rgba(0, 0, 0, 0.4)",progressBg:"#E5E5E5",progressBar:"#017AFF",progressShadow:"inset 0 0 0.0625rem #E3E3E3",switchShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)"},x=c.makeStyles(()=>({root:{zIndex:"5",width:"4rem",background:w,boxShadow:"0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)",borderRadius:"2rem",position:"fixed",left:"1rem",top:"50%",transform:"translateY(-50%)","&.right":{left:"auto",right:"1rem"},"& .MuiList-root":{padding:"0.75rem"}},node:{margin:"0.25rem 0","& .MuiDivider-root":{borderColor:v,width:"calc(100% - 1.5rem)",margin:"0 auto",border:"none",borderTop:"0.0625rem solid"},"& img":{display:"block",margin:"1rem 0"}}})),M=()=>{const e=x();return o.createElement(l.Box,{className:e.root+" left"},o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{selected:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"move"})))),o.createElement(l.Box,{className:e.node},o.createElement(d.Divider,null),o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n').toString("base64"),alt:"node"}),o.createElement(d.Divider,null)),o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{disabled:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"fullscreen"})))))},b=a.makeStyles(e=>({container:{height:"100%",width:"100%"},canvasContainer:{height:"100%",width:"100%",background:"#333333"}}));exports.ComponentsMap=class{constructor(e,t){this.nodes=e,this.links=t}},exports.MetaLink=class{constructor(e,t,r,o,n,i,s,a){this.sourceId=o,this.sourcePortId=n,this.targetId=i,this.targetPortId=s,this.options=new m(e,t,r,a)}getSourceId(){return this.sourceId}getSourcePortId(){return this.sourcePortId}getTargetId(){return this.targetId}getTargetPortId(){return this.targetPortId}},exports.MetaLinkModel=p,exports.MetaNode=class{constructor(e,t,r,o,n){this.children=[],n.set("position",o),this.options=new m(e,t,r,n)}},exports.MetaNodeModel=C,exports.Position=class{constructor(e,t){this.x=e,this.y=t}},exports.default=({metaNodes:e,metaLinks:t,componentsMap:o,wrapperClassName:a,canvasClassName:l})=>{const c=b(),d=i();d.getNodeFactories().registerFactory(new u(o.nodes)),d.getLinkFactories().registerFactory(new h(o.links));const m=new n.DiagramModel,g=e.map(e=>new C(Object.fromEntries(e.options.options))),w=t.map(e=>function(e,t){const r=new p(Object.fromEntries(e.options.options)),o=f(e.getSourceId(),t),n=f(e.getTargetId(),t);if(o&&n)return r.setSourcePort(o.getPort(e.getSourcePortId())),r.setTargetPort(n.getPort(e.getTargetPortId())),r}(e,g)).filter(e=>void 0!==e);m.addAll(...g,...w),d.setModel(m);const v=l||c.canvasContainer;return r.createElement("div",{className:a||c.container},r.createElement(M,null),r.createElement(s.CanvasWidget,{className:v,engine:d}))}; //# sourceMappingURL=meta-diagram.cjs.production.min.js.map diff --git a/dist/meta-diagram.cjs.production.min.js.map b/dist/meta-diagram.cjs.production.min.js.map index 0433122..b64eaa0 100644 --- a/dist/meta-diagram.cjs.production.min.js.map +++ b/dist/meta-diagram.cjs.production.min.js.map @@ -1 +1 @@ -{"version":3,"file":"meta-diagram.cjs.production.min.js","sources":["../src/constants.ts","../src/models/MetaOptions.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/components/Sidebar.tsx","../src/components/assets/styles/variables.ts","../src/index.tsx","../src/models/ComponentsMap.ts","../src/models/MetaLink.ts","../src/models/MetaNode.ts","../src/models/Position.ts","../src/helpers/linksHelper.ts"],"sourcesContent":["export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import * as React from 'react';\nimport { MetaNode } from './models/MetaNode';\nimport { MetaLink } from './models/MetaLink';\nimport { ComponentsMap } from './models/ComponentsMap';\nimport createEngine, { DiagramModel } from '@projectstorm/react-diagrams';\nimport { MetaNodeFactory } from './react-diagrams/MetaNodeFactory';\nimport { MetaLinkFactory } from './react-diagrams/MetaLinkFactory';\nimport { CanvasWidget } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './react-diagrams/MetaNodeModel';\nimport { getLinkModel } from './helpers/linksHelper';\nimport { makeStyles } from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n}: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport { MetaNode, MetaLink, MetaNodeModel, ComponentsMap };\nexport { MetaLinkModel } from './react-diagrams/MetaLinkModel';\nexport { Position } from './models/Position';\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n"],"names":["ReactDiagramMetaTypes","MetaOptions","constructor","id","name","shape","options","this","set","getId","get","getShape","MetaNodeModel","NodeModel","super","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","_model$getOptions","getNode","nodes","find","n","textWhite","dividerColor","fontFamily","primaryBg","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","position","left","top","transform","&.right","right","& .MuiList-root","padding","node","margin","& .MuiDivider-root","borderColor","border","borderTop","& img","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","toString","alt","Divider","disabled","_","container","height","canvasContainer","nodesMap","linksMap","links","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","children","x","y","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","Object","fromEntries","ml","metaLink","link","source","target","setSourcePort","getPort","setTargetPort","getLinkModel","filter","mlm","undefined","addAll","setModel","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"meta-diagram.cjs.production.min.js","sources":["../src/constants.ts","../src/models/MetaOptions.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/components/Sidebar.tsx","../src/components/assets/styles/variables.ts","../src/index.tsx","../src/models/ComponentsMap.ts","../src/models/MetaLink.ts","../src/models/MetaNode.ts","../src/models/Position.ts","../src/helpers/linksHelper.ts"],"sourcesContent":["export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import * as React from 'react';\nimport { MetaNode } from './models/MetaNode';\nimport { MetaLink } from './models/MetaLink';\nimport { ComponentsMap } from './models/ComponentsMap';\nimport createEngine, { DiagramModel } from '@projectstorm/react-diagrams';\nimport { MetaNodeFactory } from './react-diagrams/MetaNodeFactory';\nimport { MetaLinkFactory } from './react-diagrams/MetaLinkFactory';\nimport { CanvasWidget } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './react-diagrams/MetaNodeModel';\nimport { getLinkModel } from './helpers/linksHelper';\nimport { makeStyles } from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n}: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport { MetaNode, MetaLink, MetaNodeModel, ComponentsMap };\nexport { MetaLinkModel } from './react-diagrams/MetaLinkModel';\nexport { Position } from './models/Position';\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n"],"names":["ReactDiagramMetaTypes","MetaOptions","constructor","id","name","shape","options","this","set","getId","get","getShape","MetaNodeModel","NodeModel","super","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","_model$getOptions","diagramEngine","link","getNode","nodes","find","n","textWhite","dividerColor","fontFamily","primaryBg","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","position","left","top","transform","&.right","right","& .MuiList-root","padding","node","margin","& .MuiDivider-root","borderColor","border","borderTop","& img","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","toString","alt","Divider","disabled","_","container","height","canvasContainer","nodesMap","linksMap","links","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","children","x","y","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","Object","fromEntries","ml","metaLink","source","target","setSourcePort","getPort","setTargetPort","getLinkModel","filter","mlm","undefined","addAll","setModel","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file diff --git a/dist/meta-diagram.esm.js b/dist/meta-diagram.esm.js index b2fe587..d328282 100644 --- a/dist/meta-diagram.esm.js +++ b/dist/meta-diagram.esm.js @@ -151,8 +151,8 @@ class MetaLinkFactory extends DefaultLinkFactory { model.getOptions().shape); return (// @ts-ignore React__default.createElement(ReactComponentType, { - engine: this.engine, - model: model, + diagramEngine: this.engine, + link: model, path: path, selected: selected }) diff --git a/dist/meta-diagram.esm.js.map b/dist/meta-diagram.esm.js.map index 7515d7a..a409e10 100644 --- a/dist/meta-diagram.esm.js.map +++ b/dist/meta-diagram.esm.js.map @@ -1 +1 @@ -{"version":3,"file":"meta-diagram.esm.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport { MetaNode } from './models/MetaNode';\nimport { MetaLink } from './models/MetaLink';\nimport { ComponentsMap } from './models/ComponentsMap';\nimport createEngine, { DiagramModel } from '@projectstorm/react-diagrams';\nimport { MetaNodeFactory } from './react-diagrams/MetaNodeFactory';\nimport { MetaLinkFactory } from './react-diagrams/MetaLinkFactory';\nimport { CanvasWidget } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './react-diagrams/MetaNodeModel';\nimport { getLinkModel } from './helpers/linksHelper';\nimport { makeStyles } from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n}: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport { MetaNode, MetaLink, MetaNodeModel, ComponentsMap };\nexport { MetaLinkModel } from './react-diagrams/MetaLinkModel';\nexport { Position } from './models/Position';\n"],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","getNode","find","n","getLinkModel","metaLink","link","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"meta-diagram.esm.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport { MetaNode } from './models/MetaNode';\nimport { MetaLink } from './models/MetaLink';\nimport { ComponentsMap } from './models/ComponentsMap';\nimport createEngine, { DiagramModel } from '@projectstorm/react-diagrams';\nimport { MetaNodeFactory } from './react-diagrams/MetaNodeFactory';\nimport { MetaLinkFactory } from './react-diagrams/MetaLinkFactory';\nimport { CanvasWidget } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './react-diagrams/MetaNodeModel';\nimport { getLinkModel } from './helpers/linksHelper';\nimport { makeStyles } from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n}: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport { MetaNode, MetaLink, MetaNodeModel, ComponentsMap };\nexport { MetaLinkModel } from './react-diagrams/MetaLinkModel';\nexport { Position } from './models/Position';\n"],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","diagramEngine","link","getNode","find","n","getLinkModel","metaLink","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file From ecd9b3a4bfac9f0f1da57ec266c32a5ae729694f Mon Sep 17 00:00:00 2001 From: afonso Date: Tue, 19 Jul 2022 12:45:58 +0100 Subject: [PATCH 3/9] Update version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index c3469c1..395a918 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "version": "0.1.1", + "version": "0.1.2", "license": "MIT", "main": "dist/index.js", "typings": "dist/index.d.ts", From 3e78863e06c749cae311482ad3a57685ca062263 Mon Sep 17 00:00:00 2001 From: afonso Date: Tue, 19 Jul 2022 17:02:15 +0100 Subject: [PATCH 4/9] Expose react-diagrams link widget --- dist/index.d.ts | 1 + dist/meta-diagram.cjs.development.js | 6 + dist/meta-diagram.cjs.development.js.map | 2 +- dist/meta-diagram.cjs.production.min.js | 2 +- dist/meta-diagram.cjs.production.min.js.map | 2 +- dist/meta-diagram.esm.js | 1 + dist/meta-diagram.esm.js.map | 2 +- src/index.tsx | 137 ++++++++++---------- 8 files changed, 81 insertions(+), 72 deletions(-) diff --git a/dist/index.d.ts b/dist/index.d.ts index cf4e557..901cebd 100644 --- a/dist/index.d.ts +++ b/dist/index.d.ts @@ -14,3 +14,4 @@ export default MetaDiagram; export { MetaNode, MetaLink, MetaNodeModel, ComponentsMap }; export { MetaLinkModel } from './react-diagrams/MetaLinkModel'; export { Position } from './models/Position'; +export { DefaultLinkWidget } from "@projectstorm/react-diagrams"; diff --git a/dist/meta-diagram.cjs.development.js b/dist/meta-diagram.cjs.development.js index 4fd3cd4..ca93f4d 100644 --- a/dist/meta-diagram.cjs.development.js +++ b/dist/meta-diagram.cjs.development.js @@ -353,6 +353,12 @@ const MetaDiagram = ({ })); }; +Object.defineProperty(exports, 'DefaultLinkWidget', { + enumerable: true, + get: function () { + return createEngine.DefaultLinkWidget; + } +}); exports.ComponentsMap = ComponentsMap; exports.MetaLink = MetaLink; exports.MetaLinkModel = MetaLinkModel; diff --git a/dist/meta-diagram.cjs.development.js.map b/dist/meta-diagram.cjs.development.js.map index 4b99af1..f927aac 100644 --- a/dist/meta-diagram.cjs.development.js.map +++ b/dist/meta-diagram.cjs.development.js.map @@ -1 +1 @@ -{"version":3,"file":"meta-diagram.cjs.development.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport { MetaNode } from './models/MetaNode';\nimport { MetaLink } from './models/MetaLink';\nimport { ComponentsMap } from './models/ComponentsMap';\nimport createEngine, { DiagramModel } from '@projectstorm/react-diagrams';\nimport { MetaNodeFactory } from './react-diagrams/MetaNodeFactory';\nimport { MetaLinkFactory } from './react-diagrams/MetaLinkFactory';\nimport { CanvasWidget } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './react-diagrams/MetaNodeModel';\nimport { getLinkModel } from './helpers/linksHelper';\nimport { makeStyles } from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n}: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport { MetaNode, MetaLink, MetaNodeModel, ComponentsMap };\nexport { MetaLinkModel } from './react-diagrams/MetaLinkModel';\nexport { Position } from './models/Position';\n"],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","diagramEngine","link","getNode","find","n","getLinkModel","metaLink","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"meta-diagram.cjs.development.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\""],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","diagramEngine","link","getNode","find","n","getLinkModel","metaLink","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file diff --git a/dist/meta-diagram.cjs.production.min.js b/dist/meta-diagram.cjs.production.min.js index 2c2ec7e..b1c4460 100644 --- a/dist/meta-diagram.cjs.production.min.js +++ b/dist/meta-diagram.cjs.production.min.js @@ -1,2 +1,2 @@ -"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t,r=require("react"),o=e(r),n=require("@projectstorm/react-diagrams"),i=e(n),s=require("@projectstorm/react-canvas-core"),a=require("@material-ui/core"),l=require("@mui/system"),c=require("@mui/styles"),d=require("@mui/material");class m{constructor(e,t,r,o){this.options=o,this.options.set("id",e),this.options.set("name",t),this.options.set("shape",r)}getId(){return this.options.get("id")}getShape(){return this.options.get("shape")}}!function(e){e.META_NODE="meta-node-type",e.META_LINK="meta-link-type"}(t||(t={}));class C extends n.NodeModel{constructor(e={}){super({...e,type:t.META_NODE}),this.addPort(new n.DefaultPortModel({in:!0,name:"in"})),this.addPort(new n.DefaultPortModel({in:!1,name:"out"}))}}const g=()=>o.createElement("div",null,"Unknown Type");class u extends s.AbstractReactFactory{constructor(e){super(t.META_NODE),this.componentsMap=e}generateModel(){return new C}generateReactWidget(e){if(this.componentsMap.has(e.model.options.shape)){const t=this.componentsMap.get(e.model.options.shape);return o.createElement(t,{engine:this.engine,model:e.model})}return o.createElement(g,null)}}class p extends n.DefaultLinkModel{constructor(e={}){super({...e,type:t.META_LINK})}}class h extends n.DefaultLinkFactory{constructor(e){super(t.META_LINK),this.componentsMap=e}generateModel(){return new p}generateLinkSegment(e,t,r){var n;if(this.componentsMap.has(null==(n=e.getOptions())?void 0:n.shape)){const n=this.componentsMap.get(e.getOptions().shape);return o.createElement(n,{diagramEngine:this.engine,link:e,path:r,selected:t})}return o.createElement(g,null)}}function f(e,t){return t.find(t=>t.getOptions().id===e)}const{textWhite:w,dividerColor:v}={fontFamily:"Inter, sans-serif",primaryBg:"#f1f1f1",textWhite:"#FFFFFF",chipTextColor:"#F2F2F7",chipBgColor:"rgba(60, 60, 67, 0.4)",chipPrimaryTextColor:"rgba(255, 255, 255, 0.8)",chipPrimaryBgColor:"rgba(0, 122, 255, 0.6)",breadcrumbLinkColor:"#A2A2A2",breadcrumbTextColor:"#292929",buttonPrimaryBgColor:"4353FF",buttonPrimaryBgHoverColor:"#3443E1",buttonPrimaryDisabledBgColor:"rgba(0, 122, 255, 0.4)",listItemActiveBg:"#007AFF",listSelectedTextColor:"#3C3C43",listBoxShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)",listBorderColor:"rgba(0, 0, 0, 0.04)",dividerColor:"rgba(118, 120, 125, 0.12)",dropdownBg:"rgba(246, 246, 248, 0.8)",dropdownTextColor:"rgba(60, 60, 67, 0.6)",overlayColor:"rgba(0, 0, 0, 0.4)",progressBg:"#E5E5E5",progressBar:"#017AFF",progressShadow:"inset 0 0 0.0625rem #E3E3E3",switchShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)"},x=c.makeStyles(()=>({root:{zIndex:"5",width:"4rem",background:w,boxShadow:"0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)",borderRadius:"2rem",position:"fixed",left:"1rem",top:"50%",transform:"translateY(-50%)","&.right":{left:"auto",right:"1rem"},"& .MuiList-root":{padding:"0.75rem"}},node:{margin:"0.25rem 0","& .MuiDivider-root":{borderColor:v,width:"calc(100% - 1.5rem)",margin:"0 auto",border:"none",borderTop:"0.0625rem solid"},"& img":{display:"block",margin:"1rem 0"}}})),M=()=>{const e=x();return o.createElement(l.Box,{className:e.root+" left"},o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{selected:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"move"})))),o.createElement(l.Box,{className:e.node},o.createElement(d.Divider,null),o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n').toString("base64"),alt:"node"}),o.createElement(d.Divider,null)),o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{disabled:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"fullscreen"})))))},b=a.makeStyles(e=>({container:{height:"100%",width:"100%"},canvasContainer:{height:"100%",width:"100%",background:"#333333"}}));exports.ComponentsMap=class{constructor(e,t){this.nodes=e,this.links=t}},exports.MetaLink=class{constructor(e,t,r,o,n,i,s,a){this.sourceId=o,this.sourcePortId=n,this.targetId=i,this.targetPortId=s,this.options=new m(e,t,r,a)}getSourceId(){return this.sourceId}getSourcePortId(){return this.sourcePortId}getTargetId(){return this.targetId}getTargetPortId(){return this.targetPortId}},exports.MetaLinkModel=p,exports.MetaNode=class{constructor(e,t,r,o,n){this.children=[],n.set("position",o),this.options=new m(e,t,r,n)}},exports.MetaNodeModel=C,exports.Position=class{constructor(e,t){this.x=e,this.y=t}},exports.default=({metaNodes:e,metaLinks:t,componentsMap:o,wrapperClassName:a,canvasClassName:l})=>{const c=b(),d=i();d.getNodeFactories().registerFactory(new u(o.nodes)),d.getLinkFactories().registerFactory(new h(o.links));const m=new n.DiagramModel,g=e.map(e=>new C(Object.fromEntries(e.options.options))),w=t.map(e=>function(e,t){const r=new p(Object.fromEntries(e.options.options)),o=f(e.getSourceId(),t),n=f(e.getTargetId(),t);if(o&&n)return r.setSourcePort(o.getPort(e.getSourcePortId())),r.setTargetPort(n.getPort(e.getTargetPortId())),r}(e,g)).filter(e=>void 0!==e);m.addAll(...g,...w),d.setModel(m);const v=l||c.canvasContainer;return r.createElement("div",{className:a||c.container},r.createElement(M,null),r.createElement(s.CanvasWidget,{className:v,engine:d}))}; +"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t,r=require("react"),o=e(r),n=require("@projectstorm/react-diagrams"),i=e(n),a=require("@projectstorm/react-canvas-core"),s=require("@material-ui/core"),l=require("@mui/system"),c=require("@mui/styles"),d=require("@mui/material");class m{constructor(e,t,r,o){this.options=o,this.options.set("id",e),this.options.set("name",t),this.options.set("shape",r)}getId(){return this.options.get("id")}getShape(){return this.options.get("shape")}}!function(e){e.META_NODE="meta-node-type",e.META_LINK="meta-link-type"}(t||(t={}));class C extends n.NodeModel{constructor(e={}){super({...e,type:t.META_NODE}),this.addPort(new n.DefaultPortModel({in:!0,name:"in"})),this.addPort(new n.DefaultPortModel({in:!1,name:"out"}))}}const g=()=>o.createElement("div",null,"Unknown Type");class u extends a.AbstractReactFactory{constructor(e){super(t.META_NODE),this.componentsMap=e}generateModel(){return new C}generateReactWidget(e){if(this.componentsMap.has(e.model.options.shape)){const t=this.componentsMap.get(e.model.options.shape);return o.createElement(t,{engine:this.engine,model:e.model})}return o.createElement(g,null)}}class p extends n.DefaultLinkModel{constructor(e={}){super({...e,type:t.META_LINK})}}class h extends n.DefaultLinkFactory{constructor(e){super(t.META_LINK),this.componentsMap=e}generateModel(){return new p}generateLinkSegment(e,t,r){var n;if(this.componentsMap.has(null==(n=e.getOptions())?void 0:n.shape)){const n=this.componentsMap.get(e.getOptions().shape);return o.createElement(n,{diagramEngine:this.engine,link:e,path:r,selected:t})}return o.createElement(g,null)}}function f(e,t){return t.find(t=>t.getOptions().id===e)}const{textWhite:w,dividerColor:b}={fontFamily:"Inter, sans-serif",primaryBg:"#f1f1f1",textWhite:"#FFFFFF",chipTextColor:"#F2F2F7",chipBgColor:"rgba(60, 60, 67, 0.4)",chipPrimaryTextColor:"rgba(255, 255, 255, 0.8)",chipPrimaryBgColor:"rgba(0, 122, 255, 0.6)",breadcrumbLinkColor:"#A2A2A2",breadcrumbTextColor:"#292929",buttonPrimaryBgColor:"4353FF",buttonPrimaryBgHoverColor:"#3443E1",buttonPrimaryDisabledBgColor:"rgba(0, 122, 255, 0.4)",listItemActiveBg:"#007AFF",listSelectedTextColor:"#3C3C43",listBoxShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)",listBorderColor:"rgba(0, 0, 0, 0.04)",dividerColor:"rgba(118, 120, 125, 0.12)",dropdownBg:"rgba(246, 246, 248, 0.8)",dropdownTextColor:"rgba(60, 60, 67, 0.6)",overlayColor:"rgba(0, 0, 0, 0.4)",progressBg:"#E5E5E5",progressBar:"#017AFF",progressShadow:"inset 0 0 0.0625rem #E3E3E3",switchShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)"},v=c.makeStyles(()=>({root:{zIndex:"5",width:"4rem",background:w,boxShadow:"0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)",borderRadius:"2rem",position:"fixed",left:"1rem",top:"50%",transform:"translateY(-50%)","&.right":{left:"auto",right:"1rem"},"& .MuiList-root":{padding:"0.75rem"}},node:{margin:"0.25rem 0","& .MuiDivider-root":{borderColor:b,width:"calc(100% - 1.5rem)",margin:"0 auto",border:"none",borderTop:"0.0625rem solid"},"& img":{display:"block",margin:"1rem 0"}}})),x=()=>{const e=v();return o.createElement(l.Box,{className:e.root+" left"},o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{selected:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"move"})))),o.createElement(l.Box,{className:e.node},o.createElement(d.Divider,null),o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n').toString("base64"),alt:"node"}),o.createElement(d.Divider,null)),o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{disabled:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"fullscreen"})))))},M=s.makeStyles(e=>({container:{height:"100%",width:"100%"},canvasContainer:{height:"100%",width:"100%",background:"#333333"}}));Object.defineProperty(exports,"DefaultLinkWidget",{enumerable:!0,get:function(){return n.DefaultLinkWidget}}),exports.ComponentsMap=class{constructor(e,t){this.nodes=e,this.links=t}},exports.MetaLink=class{constructor(e,t,r,o,n,i,a,s){this.sourceId=o,this.sourcePortId=n,this.targetId=i,this.targetPortId=a,this.options=new m(e,t,r,s)}getSourceId(){return this.sourceId}getSourcePortId(){return this.sourcePortId}getTargetId(){return this.targetId}getTargetPortId(){return this.targetPortId}},exports.MetaLinkModel=p,exports.MetaNode=class{constructor(e,t,r,o,n){this.children=[],n.set("position",o),this.options=new m(e,t,r,n)}},exports.MetaNodeModel=C,exports.Position=class{constructor(e,t){this.x=e,this.y=t}},exports.default=({metaNodes:e,metaLinks:t,componentsMap:o,wrapperClassName:s,canvasClassName:l})=>{const c=M(),d=i();d.getNodeFactories().registerFactory(new u(o.nodes)),d.getLinkFactories().registerFactory(new h(o.links));const m=new n.DiagramModel,g=e.map(e=>new C(Object.fromEntries(e.options.options))),w=t.map(e=>function(e,t){const r=new p(Object.fromEntries(e.options.options)),o=f(e.getSourceId(),t),n=f(e.getTargetId(),t);if(o&&n)return r.setSourcePort(o.getPort(e.getSourcePortId())),r.setTargetPort(n.getPort(e.getTargetPortId())),r}(e,g)).filter(e=>void 0!==e);m.addAll(...g,...w),d.setModel(m);const b=l||c.canvasContainer;return r.createElement("div",{className:s||c.container},r.createElement(x,null),r.createElement(a.CanvasWidget,{className:b,engine:d}))}; //# sourceMappingURL=meta-diagram.cjs.production.min.js.map diff --git a/dist/meta-diagram.cjs.production.min.js.map b/dist/meta-diagram.cjs.production.min.js.map index b64eaa0..f8825d3 100644 --- a/dist/meta-diagram.cjs.production.min.js.map +++ b/dist/meta-diagram.cjs.production.min.js.map @@ -1 +1 @@ -{"version":3,"file":"meta-diagram.cjs.production.min.js","sources":["../src/constants.ts","../src/models/MetaOptions.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/components/Sidebar.tsx","../src/components/assets/styles/variables.ts","../src/index.tsx","../src/models/ComponentsMap.ts","../src/models/MetaLink.ts","../src/models/MetaNode.ts","../src/models/Position.ts","../src/helpers/linksHelper.ts"],"sourcesContent":["export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import * as React from 'react';\nimport { MetaNode } from './models/MetaNode';\nimport { MetaLink } from './models/MetaLink';\nimport { ComponentsMap } from './models/ComponentsMap';\nimport createEngine, { DiagramModel } from '@projectstorm/react-diagrams';\nimport { MetaNodeFactory } from './react-diagrams/MetaNodeFactory';\nimport { MetaLinkFactory } from './react-diagrams/MetaLinkFactory';\nimport { CanvasWidget } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './react-diagrams/MetaNodeModel';\nimport { getLinkModel } from './helpers/linksHelper';\nimport { makeStyles } from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n}: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport { MetaNode, MetaLink, MetaNodeModel, ComponentsMap };\nexport { MetaLinkModel } from './react-diagrams/MetaLinkModel';\nexport { Position } from './models/Position';\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n"],"names":["ReactDiagramMetaTypes","MetaOptions","constructor","id","name","shape","options","this","set","getId","get","getShape","MetaNodeModel","NodeModel","super","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","_model$getOptions","diagramEngine","link","getNode","nodes","find","n","textWhite","dividerColor","fontFamily","primaryBg","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","position","left","top","transform","&.right","right","& .MuiList-root","padding","node","margin","& .MuiDivider-root","borderColor","border","borderTop","& img","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","toString","alt","Divider","disabled","_","container","height","canvasContainer","nodesMap","linksMap","links","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","children","x","y","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","Object","fromEntries","ml","metaLink","source","target","setSourcePort","getPort","setTargetPort","getLinkModel","filter","mlm","undefined","addAll","setModel","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"meta-diagram.cjs.production.min.js","sources":["../src/constants.ts","../src/models/MetaOptions.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/components/Sidebar.tsx","../src/components/assets/styles/variables.ts","../src/index.tsx","../src/models/ComponentsMap.ts","../src/models/MetaLink.ts","../src/models/MetaNode.ts","../src/models/Position.ts","../src/helpers/linksHelper.ts"],"sourcesContent":["export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\"","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n"],"names":["ReactDiagramMetaTypes","MetaOptions","constructor","id","name","shape","options","this","set","getId","get","getShape","MetaNodeModel","NodeModel","super","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","_model$getOptions","diagramEngine","link","getNode","nodes","find","n","textWhite","dividerColor","fontFamily","primaryBg","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","position","left","top","transform","&.right","right","& .MuiList-root","padding","node","margin","& .MuiDivider-root","borderColor","border","borderTop","& img","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","toString","alt","Divider","disabled","_","container","height","canvasContainer","nodesMap","linksMap","links","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","children","x","y","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","Object","fromEntries","ml","metaLink","source","target","setSourcePort","getPort","setTargetPort","getLinkModel","filter","mlm","undefined","addAll","setModel","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file diff --git a/dist/meta-diagram.esm.js b/dist/meta-diagram.esm.js index d328282..3c71db9 100644 --- a/dist/meta-diagram.esm.js +++ b/dist/meta-diagram.esm.js @@ -1,5 +1,6 @@ import React__default, { createElement } from 'react'; import createEngine, { NodeModel, DefaultPortModel, DefaultLinkModel, DefaultLinkFactory, DiagramModel } from '@projectstorm/react-diagrams'; +export { DefaultLinkWidget } from '@projectstorm/react-diagrams'; import { AbstractReactFactory, CanvasWidget } from '@projectstorm/react-canvas-core'; import { makeStyles as makeStyles$1 } from '@material-ui/core'; import { Box } from '@mui/system'; diff --git a/dist/meta-diagram.esm.js.map b/dist/meta-diagram.esm.js.map index a409e10..702c11d 100644 --- a/dist/meta-diagram.esm.js.map +++ b/dist/meta-diagram.esm.js.map @@ -1 +1 @@ -{"version":3,"file":"meta-diagram.esm.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport { MetaNode } from './models/MetaNode';\nimport { MetaLink } from './models/MetaLink';\nimport { ComponentsMap } from './models/ComponentsMap';\nimport createEngine, { DiagramModel } from '@projectstorm/react-diagrams';\nimport { MetaNodeFactory } from './react-diagrams/MetaNodeFactory';\nimport { MetaLinkFactory } from './react-diagrams/MetaLinkFactory';\nimport { CanvasWidget } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './react-diagrams/MetaNodeModel';\nimport { getLinkModel } from './helpers/linksHelper';\nimport { makeStyles } from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n}: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport { MetaNode, MetaLink, MetaNodeModel, ComponentsMap };\nexport { MetaLinkModel } from './react-diagrams/MetaLinkModel';\nexport { Position } from './models/Position';\n"],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","diagramEngine","link","getNode","find","n","getLinkModel","metaLink","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"meta-diagram.esm.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\""],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","diagramEngine","link","getNode","find","n","getLinkModel","metaLink","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file diff --git a/src/index.tsx b/src/index.tsx index a3ba33c..9ce4093 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,88 +1,89 @@ import * as React from 'react'; -import { MetaNode } from './models/MetaNode'; -import { MetaLink } from './models/MetaLink'; -import { ComponentsMap } from './models/ComponentsMap'; -import createEngine, { DiagramModel } from '@projectstorm/react-diagrams'; -import { MetaNodeFactory } from './react-diagrams/MetaNodeFactory'; -import { MetaLinkFactory } from './react-diagrams/MetaLinkFactory'; -import { CanvasWidget } from '@projectstorm/react-canvas-core'; -import { MetaNodeModel } from './react-diagrams/MetaNodeModel'; -import { getLinkModel } from './helpers/linksHelper'; -import { makeStyles } from '@material-ui/core'; +import {MetaNode} from './models/MetaNode'; +import {MetaLink} from './models/MetaLink'; +import {ComponentsMap} from './models/ComponentsMap'; +import createEngine, {DiagramModel} from '@projectstorm/react-diagrams'; +import {MetaNodeFactory} from './react-diagrams/MetaNodeFactory'; +import {MetaLinkFactory} from './react-diagrams/MetaLinkFactory'; +import {CanvasWidget} from '@projectstorm/react-canvas-core'; +import {MetaNodeModel} from './react-diagrams/MetaNodeModel'; +import {getLinkModel} from './helpers/linksHelper'; +import {makeStyles} from '@material-ui/core'; import Sidebar from './components/Sidebar'; const useStyles = makeStyles(_ => ({ - container: { - height: '100%', - width: '100%', - }, - canvasContainer: { - height: '100%', - width: '100%', - background: '#333333', - }, + container: { + height: '100%', + width: '100%', + }, + canvasContainer: { + height: '100%', + width: '100%', + background: '#333333', + }, })); interface MetaDiagramProps { - metaNodes: MetaNode[]; - metaLinks: MetaLink[]; - componentsMap: ComponentsMap; - wrapperClassName?: string; - canvasClassName?: string; + metaNodes: MetaNode[]; + metaLinks: MetaLink[]; + componentsMap: ComponentsMap; + wrapperClassName?: string; + canvasClassName?: string; } const MetaDiagram = ({ - metaNodes, - metaLinks, - componentsMap, - wrapperClassName, - canvasClassName, -}: MetaDiagramProps) => { - const classes = useStyles(); + metaNodes, + metaLinks, + componentsMap, + wrapperClassName, + canvasClassName, + }: MetaDiagramProps) => { + const classes = useStyles(); - // set up the diagram engine - const engine = createEngine(); + // set up the diagram engine + const engine = createEngine(); - engine - .getNodeFactories() - // @ts-ignore - .registerFactory(new MetaNodeFactory(componentsMap.nodes)); + engine + .getNodeFactories() + // @ts-ignore + .registerFactory(new MetaNodeFactory(componentsMap.nodes)); - engine - .getLinkFactories() - // @ts-ignore - .registerFactory(new MetaLinkFactory(componentsMap.links)); + engine + .getLinkFactories() + // @ts-ignore + .registerFactory(new MetaLinkFactory(componentsMap.links)); - // set up the diagram model + // set up the diagram model - const model = new DiagramModel(); - const nodes = metaNodes.map( - mn => new MetaNodeModel(Object.fromEntries(mn.options.options)) - ); - const links = metaLinks - .map(ml => getLinkModel(ml, nodes)) - .filter(mlm => mlm !== undefined); - // @ts-ignore - model.addAll(...nodes, ...links); + const model = new DiagramModel(); + const nodes = metaNodes.map( + mn => new MetaNodeModel(Object.fromEntries(mn.options.options)) + ); + const links = metaLinks + .map(ml => getLinkModel(ml, nodes)) + .filter(mlm => mlm !== undefined); + // @ts-ignore + model.addAll(...nodes, ...links); - // load model into engine - engine.setModel(model); + // load model into engine + engine.setModel(model); - const containerClassName = wrapperClassName - ? wrapperClassName - : classes.container; - const diagramClassName = canvasClassName - ? canvasClassName - : classes.canvasContainer; - return ( -
- - -
- ); + const containerClassName = wrapperClassName + ? wrapperClassName + : classes.container; + const diagramClassName = canvasClassName + ? canvasClassName + : classes.canvasContainer; + return ( +
+ + +
+ ); }; export default MetaDiagram; -export { MetaNode, MetaLink, MetaNodeModel, ComponentsMap }; -export { MetaLinkModel } from './react-diagrams/MetaLinkModel'; -export { Position } from './models/Position'; +export {MetaNode, MetaLink, MetaNodeModel, ComponentsMap}; +export {MetaLinkModel} from './react-diagrams/MetaLinkModel'; +export {Position} from './models/Position'; +export {DefaultLinkWidget} from "@projectstorm/react-diagrams" \ No newline at end of file From 41ac7ff2f7cebad880482d0e4ddb79dffc7cea49 Mon Sep 17 00:00:00 2001 From: afonso Date: Tue, 19 Jul 2022 17:16:02 +0100 Subject: [PATCH 5/9] Expose react-diagrams link widget --- dist/index.d.ts | 1 + dist/meta-diagram.cjs.development.js | 7 +++++++ dist/meta-diagram.cjs.development.js.map | 2 +- dist/meta-diagram.cjs.production.min.js | 2 +- dist/meta-diagram.cjs.production.min.js.map | 2 +- dist/meta-diagram.esm.js | 1 + dist/meta-diagram.esm.js.map | 2 +- src/index.tsx | 3 ++- 8 files changed, 15 insertions(+), 5 deletions(-) diff --git a/dist/index.d.ts b/dist/index.d.ts index 901cebd..ccff014 100644 --- a/dist/index.d.ts +++ b/dist/index.d.ts @@ -15,3 +15,4 @@ export { MetaNode, MetaLink, MetaNodeModel, ComponentsMap }; export { MetaLinkModel } from './react-diagrams/MetaLinkModel'; export { Position } from './models/Position'; export { DefaultLinkWidget } from "@projectstorm/react-diagrams"; +export { LinkWidget } from '@projectstorm/react-diagrams-core'; diff --git a/dist/meta-diagram.cjs.development.js b/dist/meta-diagram.cjs.development.js index ca93f4d..71a4583 100644 --- a/dist/meta-diagram.cjs.development.js +++ b/dist/meta-diagram.cjs.development.js @@ -13,6 +13,7 @@ var core = require('@material-ui/core'); var system = require('@mui/system'); var styles = require('@mui/styles'); var material = require('@mui/material'); +var reactDiagramsCore = require('@projectstorm/react-diagrams-core'); class MetaOptions { constructor(id, name, shape, options) { @@ -359,6 +360,12 @@ Object.defineProperty(exports, 'DefaultLinkWidget', { return createEngine.DefaultLinkWidget; } }); +Object.defineProperty(exports, 'LinkWidget', { + enumerable: true, + get: function () { + return reactDiagramsCore.LinkWidget; + } +}); exports.ComponentsMap = ComponentsMap; exports.MetaLink = MetaLink; exports.MetaLinkModel = MetaLinkModel; diff --git a/dist/meta-diagram.cjs.development.js.map b/dist/meta-diagram.cjs.development.js.map index f927aac..511725a 100644 --- a/dist/meta-diagram.cjs.development.js.map +++ b/dist/meta-diagram.cjs.development.js.map @@ -1 +1 @@ -{"version":3,"file":"meta-diagram.cjs.development.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\""],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","diagramEngine","link","getNode","find","n","getLinkModel","metaLink","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"meta-diagram.cjs.development.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\"\nexport {LinkWidget} from '@projectstorm/react-diagrams-core'"],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","diagramEngine","link","getNode","find","n","getLinkModel","metaLink","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file diff --git a/dist/meta-diagram.cjs.production.min.js b/dist/meta-diagram.cjs.production.min.js index b1c4460..3bc0797 100644 --- a/dist/meta-diagram.cjs.production.min.js +++ b/dist/meta-diagram.cjs.production.min.js @@ -1,2 +1,2 @@ -"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t,r=require("react"),o=e(r),n=require("@projectstorm/react-diagrams"),i=e(n),a=require("@projectstorm/react-canvas-core"),s=require("@material-ui/core"),l=require("@mui/system"),c=require("@mui/styles"),d=require("@mui/material");class m{constructor(e,t,r,o){this.options=o,this.options.set("id",e),this.options.set("name",t),this.options.set("shape",r)}getId(){return this.options.get("id")}getShape(){return this.options.get("shape")}}!function(e){e.META_NODE="meta-node-type",e.META_LINK="meta-link-type"}(t||(t={}));class C extends n.NodeModel{constructor(e={}){super({...e,type:t.META_NODE}),this.addPort(new n.DefaultPortModel({in:!0,name:"in"})),this.addPort(new n.DefaultPortModel({in:!1,name:"out"}))}}const g=()=>o.createElement("div",null,"Unknown Type");class u extends a.AbstractReactFactory{constructor(e){super(t.META_NODE),this.componentsMap=e}generateModel(){return new C}generateReactWidget(e){if(this.componentsMap.has(e.model.options.shape)){const t=this.componentsMap.get(e.model.options.shape);return o.createElement(t,{engine:this.engine,model:e.model})}return o.createElement(g,null)}}class p extends n.DefaultLinkModel{constructor(e={}){super({...e,type:t.META_LINK})}}class h extends n.DefaultLinkFactory{constructor(e){super(t.META_LINK),this.componentsMap=e}generateModel(){return new p}generateLinkSegment(e,t,r){var n;if(this.componentsMap.has(null==(n=e.getOptions())?void 0:n.shape)){const n=this.componentsMap.get(e.getOptions().shape);return o.createElement(n,{diagramEngine:this.engine,link:e,path:r,selected:t})}return o.createElement(g,null)}}function f(e,t){return t.find(t=>t.getOptions().id===e)}const{textWhite:w,dividerColor:b}={fontFamily:"Inter, sans-serif",primaryBg:"#f1f1f1",textWhite:"#FFFFFF",chipTextColor:"#F2F2F7",chipBgColor:"rgba(60, 60, 67, 0.4)",chipPrimaryTextColor:"rgba(255, 255, 255, 0.8)",chipPrimaryBgColor:"rgba(0, 122, 255, 0.6)",breadcrumbLinkColor:"#A2A2A2",breadcrumbTextColor:"#292929",buttonPrimaryBgColor:"4353FF",buttonPrimaryBgHoverColor:"#3443E1",buttonPrimaryDisabledBgColor:"rgba(0, 122, 255, 0.4)",listItemActiveBg:"#007AFF",listSelectedTextColor:"#3C3C43",listBoxShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)",listBorderColor:"rgba(0, 0, 0, 0.04)",dividerColor:"rgba(118, 120, 125, 0.12)",dropdownBg:"rgba(246, 246, 248, 0.8)",dropdownTextColor:"rgba(60, 60, 67, 0.6)",overlayColor:"rgba(0, 0, 0, 0.4)",progressBg:"#E5E5E5",progressBar:"#017AFF",progressShadow:"inset 0 0 0.0625rem #E3E3E3",switchShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)"},v=c.makeStyles(()=>({root:{zIndex:"5",width:"4rem",background:w,boxShadow:"0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)",borderRadius:"2rem",position:"fixed",left:"1rem",top:"50%",transform:"translateY(-50%)","&.right":{left:"auto",right:"1rem"},"& .MuiList-root":{padding:"0.75rem"}},node:{margin:"0.25rem 0","& .MuiDivider-root":{borderColor:b,width:"calc(100% - 1.5rem)",margin:"0 auto",border:"none",borderTop:"0.0625rem solid"},"& img":{display:"block",margin:"1rem 0"}}})),x=()=>{const e=v();return o.createElement(l.Box,{className:e.root+" left"},o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{selected:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"move"})))),o.createElement(l.Box,{className:e.node},o.createElement(d.Divider,null),o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n').toString("base64"),alt:"node"}),o.createElement(d.Divider,null)),o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{disabled:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"fullscreen"})))))},M=s.makeStyles(e=>({container:{height:"100%",width:"100%"},canvasContainer:{height:"100%",width:"100%",background:"#333333"}}));Object.defineProperty(exports,"DefaultLinkWidget",{enumerable:!0,get:function(){return n.DefaultLinkWidget}}),exports.ComponentsMap=class{constructor(e,t){this.nodes=e,this.links=t}},exports.MetaLink=class{constructor(e,t,r,o,n,i,a,s){this.sourceId=o,this.sourcePortId=n,this.targetId=i,this.targetPortId=a,this.options=new m(e,t,r,s)}getSourceId(){return this.sourceId}getSourcePortId(){return this.sourcePortId}getTargetId(){return this.targetId}getTargetPortId(){return this.targetPortId}},exports.MetaLinkModel=p,exports.MetaNode=class{constructor(e,t,r,o,n){this.children=[],n.set("position",o),this.options=new m(e,t,r,n)}},exports.MetaNodeModel=C,exports.Position=class{constructor(e,t){this.x=e,this.y=t}},exports.default=({metaNodes:e,metaLinks:t,componentsMap:o,wrapperClassName:s,canvasClassName:l})=>{const c=M(),d=i();d.getNodeFactories().registerFactory(new u(o.nodes)),d.getLinkFactories().registerFactory(new h(o.links));const m=new n.DiagramModel,g=e.map(e=>new C(Object.fromEntries(e.options.options))),w=t.map(e=>function(e,t){const r=new p(Object.fromEntries(e.options.options)),o=f(e.getSourceId(),t),n=f(e.getTargetId(),t);if(o&&n)return r.setSourcePort(o.getPort(e.getSourcePortId())),r.setTargetPort(n.getPort(e.getTargetPortId())),r}(e,g)).filter(e=>void 0!==e);m.addAll(...g,...w),d.setModel(m);const b=l||c.canvasContainer;return r.createElement("div",{className:s||c.container},r.createElement(x,null),r.createElement(a.CanvasWidget,{className:b,engine:d}))}; +"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t,r=require("react"),o=e(r),n=require("@projectstorm/react-diagrams"),i=e(n),a=require("@projectstorm/react-canvas-core"),s=require("@material-ui/core"),l=require("@mui/system"),c=require("@mui/styles"),d=require("@mui/material"),m=require("@projectstorm/react-diagrams-core");class g{constructor(e,t,r,o){this.options=o,this.options.set("id",e),this.options.set("name",t),this.options.set("shape",r)}getId(){return this.options.get("id")}getShape(){return this.options.get("shape")}}!function(e){e.META_NODE="meta-node-type",e.META_LINK="meta-link-type"}(t||(t={}));class C extends n.NodeModel{constructor(e={}){super({...e,type:t.META_NODE}),this.addPort(new n.DefaultPortModel({in:!0,name:"in"})),this.addPort(new n.DefaultPortModel({in:!1,name:"out"}))}}const u=()=>o.createElement("div",null,"Unknown Type");class p extends a.AbstractReactFactory{constructor(e){super(t.META_NODE),this.componentsMap=e}generateModel(){return new C}generateReactWidget(e){if(this.componentsMap.has(e.model.options.shape)){const t=this.componentsMap.get(e.model.options.shape);return o.createElement(t,{engine:this.engine,model:e.model})}return o.createElement(u,null)}}class h extends n.DefaultLinkModel{constructor(e={}){super({...e,type:t.META_LINK})}}class f extends n.DefaultLinkFactory{constructor(e){super(t.META_LINK),this.componentsMap=e}generateModel(){return new h}generateLinkSegment(e,t,r){var n;if(this.componentsMap.has(null==(n=e.getOptions())?void 0:n.shape)){const n=this.componentsMap.get(e.getOptions().shape);return o.createElement(n,{diagramEngine:this.engine,link:e,path:r,selected:t})}return o.createElement(u,null)}}function w(e,t){return t.find(t=>t.getOptions().id===e)}const{textWhite:b,dividerColor:x}={fontFamily:"Inter, sans-serif",primaryBg:"#f1f1f1",textWhite:"#FFFFFF",chipTextColor:"#F2F2F7",chipBgColor:"rgba(60, 60, 67, 0.4)",chipPrimaryTextColor:"rgba(255, 255, 255, 0.8)",chipPrimaryBgColor:"rgba(0, 122, 255, 0.6)",breadcrumbLinkColor:"#A2A2A2",breadcrumbTextColor:"#292929",buttonPrimaryBgColor:"4353FF",buttonPrimaryBgHoverColor:"#3443E1",buttonPrimaryDisabledBgColor:"rgba(0, 122, 255, 0.4)",listItemActiveBg:"#007AFF",listSelectedTextColor:"#3C3C43",listBoxShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)",listBorderColor:"rgba(0, 0, 0, 0.04)",dividerColor:"rgba(118, 120, 125, 0.12)",dropdownBg:"rgba(246, 246, 248, 0.8)",dropdownTextColor:"rgba(60, 60, 67, 0.6)",overlayColor:"rgba(0, 0, 0, 0.4)",progressBg:"#E5E5E5",progressBar:"#017AFF",progressShadow:"inset 0 0 0.0625rem #E3E3E3",switchShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)"},v=c.makeStyles(()=>({root:{zIndex:"5",width:"4rem",background:b,boxShadow:"0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)",borderRadius:"2rem",position:"fixed",left:"1rem",top:"50%",transform:"translateY(-50%)","&.right":{left:"auto",right:"1rem"},"& .MuiList-root":{padding:"0.75rem"}},node:{margin:"0.25rem 0","& .MuiDivider-root":{borderColor:x,width:"calc(100% - 1.5rem)",margin:"0 auto",border:"none",borderTop:"0.0625rem solid"},"& img":{display:"block",margin:"1rem 0"}}})),M=()=>{const e=v();return o.createElement(l.Box,{className:e.root+" left"},o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{selected:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"move"})))),o.createElement(l.Box,{className:e.node},o.createElement(d.Divider,null),o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n').toString("base64"),alt:"node"}),o.createElement(d.Divider,null)),o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{disabled:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"fullscreen"})))))},E=s.makeStyles(e=>({container:{height:"100%",width:"100%"},canvasContainer:{height:"100%",width:"100%",background:"#333333"}}));Object.defineProperty(exports,"DefaultLinkWidget",{enumerable:!0,get:function(){return n.DefaultLinkWidget}}),Object.defineProperty(exports,"LinkWidget",{enumerable:!0,get:function(){return m.LinkWidget}}),exports.ComponentsMap=class{constructor(e,t){this.nodes=e,this.links=t}},exports.MetaLink=class{constructor(e,t,r,o,n,i,a,s){this.sourceId=o,this.sourcePortId=n,this.targetId=i,this.targetPortId=a,this.options=new g(e,t,r,s)}getSourceId(){return this.sourceId}getSourcePortId(){return this.sourcePortId}getTargetId(){return this.targetId}getTargetPortId(){return this.targetPortId}},exports.MetaLinkModel=h,exports.MetaNode=class{constructor(e,t,r,o,n){this.children=[],n.set("position",o),this.options=new g(e,t,r,n)}},exports.MetaNodeModel=C,exports.Position=class{constructor(e,t){this.x=e,this.y=t}},exports.default=({metaNodes:e,metaLinks:t,componentsMap:o,wrapperClassName:s,canvasClassName:l})=>{const c=E(),d=i();d.getNodeFactories().registerFactory(new p(o.nodes)),d.getLinkFactories().registerFactory(new f(o.links));const m=new n.DiagramModel,g=e.map(e=>new C(Object.fromEntries(e.options.options))),u=t.map(e=>function(e,t){const r=new h(Object.fromEntries(e.options.options)),o=w(e.getSourceId(),t),n=w(e.getTargetId(),t);if(o&&n)return r.setSourcePort(o.getPort(e.getSourcePortId())),r.setTargetPort(n.getPort(e.getTargetPortId())),r}(e,g)).filter(e=>void 0!==e);m.addAll(...g,...u),d.setModel(m);const b=l||c.canvasContainer;return r.createElement("div",{className:s||c.container},r.createElement(M,null),r.createElement(a.CanvasWidget,{className:b,engine:d}))}; //# sourceMappingURL=meta-diagram.cjs.production.min.js.map diff --git a/dist/meta-diagram.cjs.production.min.js.map b/dist/meta-diagram.cjs.production.min.js.map index f8825d3..6b02cc9 100644 --- a/dist/meta-diagram.cjs.production.min.js.map +++ b/dist/meta-diagram.cjs.production.min.js.map @@ -1 +1 @@ -{"version":3,"file":"meta-diagram.cjs.production.min.js","sources":["../src/constants.ts","../src/models/MetaOptions.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/components/Sidebar.tsx","../src/components/assets/styles/variables.ts","../src/index.tsx","../src/models/ComponentsMap.ts","../src/models/MetaLink.ts","../src/models/MetaNode.ts","../src/models/Position.ts","../src/helpers/linksHelper.ts"],"sourcesContent":["export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\"","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n"],"names":["ReactDiagramMetaTypes","MetaOptions","constructor","id","name","shape","options","this","set","getId","get","getShape","MetaNodeModel","NodeModel","super","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","_model$getOptions","diagramEngine","link","getNode","nodes","find","n","textWhite","dividerColor","fontFamily","primaryBg","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","position","left","top","transform","&.right","right","& .MuiList-root","padding","node","margin","& .MuiDivider-root","borderColor","border","borderTop","& img","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","toString","alt","Divider","disabled","_","container","height","canvasContainer","nodesMap","linksMap","links","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","children","x","y","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","Object","fromEntries","ml","metaLink","source","target","setSourcePort","getPort","setTargetPort","getLinkModel","filter","mlm","undefined","addAll","setModel","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"meta-diagram.cjs.production.min.js","sources":["../src/constants.ts","../src/models/MetaOptions.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/components/Sidebar.tsx","../src/components/assets/styles/variables.ts","../src/index.tsx","../src/models/ComponentsMap.ts","../src/models/MetaLink.ts","../src/models/MetaNode.ts","../src/models/Position.ts","../src/helpers/linksHelper.ts"],"sourcesContent":["export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\"\nexport {LinkWidget} from '@projectstorm/react-diagrams-core'","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n"],"names":["ReactDiagramMetaTypes","MetaOptions","constructor","id","name","shape","options","this","set","getId","get","getShape","MetaNodeModel","NodeModel","super","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","_model$getOptions","diagramEngine","link","getNode","nodes","find","n","textWhite","dividerColor","fontFamily","primaryBg","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","position","left","top","transform","&.right","right","& .MuiList-root","padding","node","margin","& .MuiDivider-root","borderColor","border","borderTop","& img","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","toString","alt","Divider","disabled","_","container","height","canvasContainer","nodesMap","linksMap","links","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","children","x","y","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","Object","fromEntries","ml","metaLink","source","target","setSourcePort","getPort","setTargetPort","getLinkModel","filter","mlm","undefined","addAll","setModel","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file diff --git a/dist/meta-diagram.esm.js b/dist/meta-diagram.esm.js index 3c71db9..05f183f 100644 --- a/dist/meta-diagram.esm.js +++ b/dist/meta-diagram.esm.js @@ -6,6 +6,7 @@ import { makeStyles as makeStyles$1 } from '@material-ui/core'; import { Box } from '@mui/system'; import { makeStyles } from '@mui/styles'; import { List, ListItemButton, ListItemIcon, Divider } from '@mui/material'; +export { LinkWidget } from '@projectstorm/react-diagrams-core'; class MetaOptions { constructor(id, name, shape, options) { diff --git a/dist/meta-diagram.esm.js.map b/dist/meta-diagram.esm.js.map index 702c11d..51a900a 100644 --- a/dist/meta-diagram.esm.js.map +++ b/dist/meta-diagram.esm.js.map @@ -1 +1 @@ -{"version":3,"file":"meta-diagram.esm.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\""],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","diagramEngine","link","getNode","find","n","getLinkModel","metaLink","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"meta-diagram.esm.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\"\nexport {LinkWidget} from '@projectstorm/react-diagrams-core'"],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","diagramEngine","link","getNode","find","n","getLinkModel","metaLink","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file diff --git a/src/index.tsx b/src/index.tsx index 9ce4093..e2030ac 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -86,4 +86,5 @@ export default MetaDiagram; export {MetaNode, MetaLink, MetaNodeModel, ComponentsMap}; export {MetaLinkModel} from './react-diagrams/MetaLinkModel'; export {Position} from './models/Position'; -export {DefaultLinkWidget} from "@projectstorm/react-diagrams" \ No newline at end of file +export {DefaultLinkWidget} from "@projectstorm/react-diagrams" +export {LinkWidget} from '@projectstorm/react-diagrams-core' \ No newline at end of file From 2adfc828583543577f877cf09cbd88347628d5d9 Mon Sep 17 00:00:00 2001 From: Dario Del Piano Date: Thu, 28 Jul 2022 15:33:12 +0100 Subject: [PATCH 6/9] #18 adding key to factories, bumped version and recompiled --- dist/meta-diagram.cjs.development.js | 15 +++++++++------ dist/meta-diagram.cjs.development.js.map | 2 +- dist/meta-diagram.cjs.production.min.js | 2 +- dist/meta-diagram.cjs.production.min.js.map | 2 +- dist/meta-diagram.esm.js | 15 +++++++++------ dist/meta-diagram.esm.js.map | 2 +- package.json | 2 +- src/react-diagrams/MetaLinkFactory.tsx | 8 +++++++- src/react-diagrams/MetaNodeFactory.tsx | 10 ++++++++-- 9 files changed, 38 insertions(+), 20 deletions(-) diff --git a/dist/meta-diagram.cjs.development.js b/dist/meta-diagram.cjs.development.js index 71a4583..95632f8 100644 --- a/dist/meta-diagram.cjs.development.js +++ b/dist/meta-diagram.cjs.development.js @@ -118,12 +118,14 @@ class MetaNodeFactory extends reactCanvasCore.AbstractReactFactory { generateReactWidget(event) { if (this.componentsMap.has(event.model.options.shape)) { - const ReactComponentType = this.componentsMap.get(event.model.options.shape); // @ts-ignore - - return React__default.createElement(ReactComponentType, { - engine: this.engine, - model: event.model - }); + const ReactComponentType = this.componentsMap.get(event.model.options.shape); + return (// @ts-ignore + React__default.createElement(ReactComponentType, { + key: `node-factory-${event.model.getOptions().id}`, + engine: this.engine, + model: event.model + }) + ); } // TODO: Generate default node instead @@ -160,6 +162,7 @@ class MetaLinkFactory extends createEngine.DefaultLinkFactory { model.getOptions().shape); return (// @ts-ignore React__default.createElement(ReactComponentType, { + key: `link-factory-${model.getOptions().id}`, diagramEngine: this.engine, link: model, path: path, diff --git a/dist/meta-diagram.cjs.development.js.map b/dist/meta-diagram.cjs.development.js.map index 511725a..0950a43 100644 --- a/dist/meta-diagram.cjs.development.js.map +++ b/dist/meta-diagram.cjs.development.js.map @@ -1 +1 @@ -{"version":3,"file":"meta-diagram.cjs.development.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\"\nexport {LinkWidget} from '@projectstorm/react-diagrams-core'"],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","diagramEngine","link","getNode","find","n","getLinkModel","metaLink","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"meta-diagram.cjs.development.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\"\nexport {LinkWidget} from '@projectstorm/react-diagrams-core'"],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","key","getOptions","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","diagramEngine","link","getNode","find","n","getLinkModel","metaLink","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file diff --git a/dist/meta-diagram.cjs.production.min.js b/dist/meta-diagram.cjs.production.min.js index 3bc0797..eabff92 100644 --- a/dist/meta-diagram.cjs.production.min.js +++ b/dist/meta-diagram.cjs.production.min.js @@ -1,2 +1,2 @@ -"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t,r=require("react"),o=e(r),n=require("@projectstorm/react-diagrams"),i=e(n),a=require("@projectstorm/react-canvas-core"),s=require("@material-ui/core"),l=require("@mui/system"),c=require("@mui/styles"),d=require("@mui/material"),m=require("@projectstorm/react-diagrams-core");class g{constructor(e,t,r,o){this.options=o,this.options.set("id",e),this.options.set("name",t),this.options.set("shape",r)}getId(){return this.options.get("id")}getShape(){return this.options.get("shape")}}!function(e){e.META_NODE="meta-node-type",e.META_LINK="meta-link-type"}(t||(t={}));class C extends n.NodeModel{constructor(e={}){super({...e,type:t.META_NODE}),this.addPort(new n.DefaultPortModel({in:!0,name:"in"})),this.addPort(new n.DefaultPortModel({in:!1,name:"out"}))}}const u=()=>o.createElement("div",null,"Unknown Type");class p extends a.AbstractReactFactory{constructor(e){super(t.META_NODE),this.componentsMap=e}generateModel(){return new C}generateReactWidget(e){if(this.componentsMap.has(e.model.options.shape)){const t=this.componentsMap.get(e.model.options.shape);return o.createElement(t,{engine:this.engine,model:e.model})}return o.createElement(u,null)}}class h extends n.DefaultLinkModel{constructor(e={}){super({...e,type:t.META_LINK})}}class f extends n.DefaultLinkFactory{constructor(e){super(t.META_LINK),this.componentsMap=e}generateModel(){return new h}generateLinkSegment(e,t,r){var n;if(this.componentsMap.has(null==(n=e.getOptions())?void 0:n.shape)){const n=this.componentsMap.get(e.getOptions().shape);return o.createElement(n,{diagramEngine:this.engine,link:e,path:r,selected:t})}return o.createElement(u,null)}}function w(e,t){return t.find(t=>t.getOptions().id===e)}const{textWhite:b,dividerColor:x}={fontFamily:"Inter, sans-serif",primaryBg:"#f1f1f1",textWhite:"#FFFFFF",chipTextColor:"#F2F2F7",chipBgColor:"rgba(60, 60, 67, 0.4)",chipPrimaryTextColor:"rgba(255, 255, 255, 0.8)",chipPrimaryBgColor:"rgba(0, 122, 255, 0.6)",breadcrumbLinkColor:"#A2A2A2",breadcrumbTextColor:"#292929",buttonPrimaryBgColor:"4353FF",buttonPrimaryBgHoverColor:"#3443E1",buttonPrimaryDisabledBgColor:"rgba(0, 122, 255, 0.4)",listItemActiveBg:"#007AFF",listSelectedTextColor:"#3C3C43",listBoxShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)",listBorderColor:"rgba(0, 0, 0, 0.04)",dividerColor:"rgba(118, 120, 125, 0.12)",dropdownBg:"rgba(246, 246, 248, 0.8)",dropdownTextColor:"rgba(60, 60, 67, 0.6)",overlayColor:"rgba(0, 0, 0, 0.4)",progressBg:"#E5E5E5",progressBar:"#017AFF",progressShadow:"inset 0 0 0.0625rem #E3E3E3",switchShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)"},v=c.makeStyles(()=>({root:{zIndex:"5",width:"4rem",background:b,boxShadow:"0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)",borderRadius:"2rem",position:"fixed",left:"1rem",top:"50%",transform:"translateY(-50%)","&.right":{left:"auto",right:"1rem"},"& .MuiList-root":{padding:"0.75rem"}},node:{margin:"0.25rem 0","& .MuiDivider-root":{borderColor:x,width:"calc(100% - 1.5rem)",margin:"0 auto",border:"none",borderTop:"0.0625rem solid"},"& img":{display:"block",margin:"1rem 0"}}})),M=()=>{const e=v();return o.createElement(l.Box,{className:e.root+" left"},o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{selected:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"move"})))),o.createElement(l.Box,{className:e.node},o.createElement(d.Divider,null),o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n').toString("base64"),alt:"node"}),o.createElement(d.Divider,null)),o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{disabled:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"fullscreen"})))))},E=s.makeStyles(e=>({container:{height:"100%",width:"100%"},canvasContainer:{height:"100%",width:"100%",background:"#333333"}}));Object.defineProperty(exports,"DefaultLinkWidget",{enumerable:!0,get:function(){return n.DefaultLinkWidget}}),Object.defineProperty(exports,"LinkWidget",{enumerable:!0,get:function(){return m.LinkWidget}}),exports.ComponentsMap=class{constructor(e,t){this.nodes=e,this.links=t}},exports.MetaLink=class{constructor(e,t,r,o,n,i,a,s){this.sourceId=o,this.sourcePortId=n,this.targetId=i,this.targetPortId=a,this.options=new g(e,t,r,s)}getSourceId(){return this.sourceId}getSourcePortId(){return this.sourcePortId}getTargetId(){return this.targetId}getTargetPortId(){return this.targetPortId}},exports.MetaLinkModel=h,exports.MetaNode=class{constructor(e,t,r,o,n){this.children=[],n.set("position",o),this.options=new g(e,t,r,n)}},exports.MetaNodeModel=C,exports.Position=class{constructor(e,t){this.x=e,this.y=t}},exports.default=({metaNodes:e,metaLinks:t,componentsMap:o,wrapperClassName:s,canvasClassName:l})=>{const c=E(),d=i();d.getNodeFactories().registerFactory(new p(o.nodes)),d.getLinkFactories().registerFactory(new f(o.links));const m=new n.DiagramModel,g=e.map(e=>new C(Object.fromEntries(e.options.options))),u=t.map(e=>function(e,t){const r=new h(Object.fromEntries(e.options.options)),o=w(e.getSourceId(),t),n=w(e.getTargetId(),t);if(o&&n)return r.setSourcePort(o.getPort(e.getSourcePortId())),r.setTargetPort(n.getPort(e.getTargetPortId())),r}(e,g)).filter(e=>void 0!==e);m.addAll(...g,...u),d.setModel(m);const b=l||c.canvasContainer;return r.createElement("div",{className:s||c.container},r.createElement(M,null),r.createElement(a.CanvasWidget,{className:b,engine:d}))}; +"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t,r=require("react"),o=e(r),n=require("@projectstorm/react-diagrams"),i=e(n),a=require("@projectstorm/react-canvas-core"),s=require("@material-ui/core"),l=require("@mui/system"),c=require("@mui/styles"),d=require("@mui/material"),m=require("@projectstorm/react-diagrams-core");class g{constructor(e,t,r,o){this.options=o,this.options.set("id",e),this.options.set("name",t),this.options.set("shape",r)}getId(){return this.options.get("id")}getShape(){return this.options.get("shape")}}!function(e){e.META_NODE="meta-node-type",e.META_LINK="meta-link-type"}(t||(t={}));class C extends n.NodeModel{constructor(e={}){super({...e,type:t.META_NODE}),this.addPort(new n.DefaultPortModel({in:!0,name:"in"})),this.addPort(new n.DefaultPortModel({in:!1,name:"out"}))}}const u=()=>o.createElement("div",null,"Unknown Type");class p extends a.AbstractReactFactory{constructor(e){super(t.META_NODE),this.componentsMap=e}generateModel(){return new C}generateReactWidget(e){if(this.componentsMap.has(e.model.options.shape)){const t=this.componentsMap.get(e.model.options.shape);return o.createElement(t,{key:"node-factory-"+e.model.getOptions().id,engine:this.engine,model:e.model})}return o.createElement(u,null)}}class h extends n.DefaultLinkModel{constructor(e={}){super({...e,type:t.META_LINK})}}class f extends n.DefaultLinkFactory{constructor(e){super(t.META_LINK),this.componentsMap=e}generateModel(){return new h}generateLinkSegment(e,t,r){var n;if(this.componentsMap.has(null==(n=e.getOptions())?void 0:n.shape)){const n=this.componentsMap.get(e.getOptions().shape);return o.createElement(n,{key:"link-factory-"+e.getOptions().id,diagramEngine:this.engine,link:e,path:r,selected:t})}return o.createElement(u,null)}}function w(e,t){return t.find(t=>t.getOptions().id===e)}const{textWhite:b,dividerColor:x}={fontFamily:"Inter, sans-serif",primaryBg:"#f1f1f1",textWhite:"#FFFFFF",chipTextColor:"#F2F2F7",chipBgColor:"rgba(60, 60, 67, 0.4)",chipPrimaryTextColor:"rgba(255, 255, 255, 0.8)",chipPrimaryBgColor:"rgba(0, 122, 255, 0.6)",breadcrumbLinkColor:"#A2A2A2",breadcrumbTextColor:"#292929",buttonPrimaryBgColor:"4353FF",buttonPrimaryBgHoverColor:"#3443E1",buttonPrimaryDisabledBgColor:"rgba(0, 122, 255, 0.4)",listItemActiveBg:"#007AFF",listSelectedTextColor:"#3C3C43",listBoxShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)",listBorderColor:"rgba(0, 0, 0, 0.04)",dividerColor:"rgba(118, 120, 125, 0.12)",dropdownBg:"rgba(246, 246, 248, 0.8)",dropdownTextColor:"rgba(60, 60, 67, 0.6)",overlayColor:"rgba(0, 0, 0, 0.4)",progressBg:"#E5E5E5",progressBar:"#017AFF",progressShadow:"inset 0 0 0.0625rem #E3E3E3",switchShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)"},v=c.makeStyles(()=>({root:{zIndex:"5",width:"4rem",background:b,boxShadow:"0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)",borderRadius:"2rem",position:"fixed",left:"1rem",top:"50%",transform:"translateY(-50%)","&.right":{left:"auto",right:"1rem"},"& .MuiList-root":{padding:"0.75rem"}},node:{margin:"0.25rem 0","& .MuiDivider-root":{borderColor:x,width:"calc(100% - 1.5rem)",margin:"0 auto",border:"none",borderTop:"0.0625rem solid"},"& img":{display:"block",margin:"1rem 0"}}})),M=()=>{const e=v();return o.createElement(l.Box,{className:e.root+" left"},o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{selected:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"move"})))),o.createElement(l.Box,{className:e.node},o.createElement(d.Divider,null),o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n').toString("base64"),alt:"node"}),o.createElement(d.Divider,null)),o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{disabled:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"fullscreen"})))))},E=s.makeStyles(e=>({container:{height:"100%",width:"100%"},canvasContainer:{height:"100%",width:"100%",background:"#333333"}}));Object.defineProperty(exports,"DefaultLinkWidget",{enumerable:!0,get:function(){return n.DefaultLinkWidget}}),Object.defineProperty(exports,"LinkWidget",{enumerable:!0,get:function(){return m.LinkWidget}}),exports.ComponentsMap=class{constructor(e,t){this.nodes=e,this.links=t}},exports.MetaLink=class{constructor(e,t,r,o,n,i,a,s){this.sourceId=o,this.sourcePortId=n,this.targetId=i,this.targetPortId=a,this.options=new g(e,t,r,s)}getSourceId(){return this.sourceId}getSourcePortId(){return this.sourcePortId}getTargetId(){return this.targetId}getTargetPortId(){return this.targetPortId}},exports.MetaLinkModel=h,exports.MetaNode=class{constructor(e,t,r,o,n){this.children=[],n.set("position",o),this.options=new g(e,t,r,n)}},exports.MetaNodeModel=C,exports.Position=class{constructor(e,t){this.x=e,this.y=t}},exports.default=({metaNodes:e,metaLinks:t,componentsMap:o,wrapperClassName:s,canvasClassName:l})=>{const c=E(),d=i();d.getNodeFactories().registerFactory(new p(o.nodes)),d.getLinkFactories().registerFactory(new f(o.links));const m=new n.DiagramModel,g=e.map(e=>new C(Object.fromEntries(e.options.options))),u=t.map(e=>function(e,t){const r=new h(Object.fromEntries(e.options.options)),o=w(e.getSourceId(),t),n=w(e.getTargetId(),t);if(o&&n)return r.setSourcePort(o.getPort(e.getSourcePortId())),r.setTargetPort(n.getPort(e.getTargetPortId())),r}(e,g)).filter(e=>void 0!==e);m.addAll(...g,...u),d.setModel(m);const b=l||c.canvasContainer;return r.createElement("div",{className:s||c.container},r.createElement(M,null),r.createElement(a.CanvasWidget,{className:b,engine:d}))}; //# sourceMappingURL=meta-diagram.cjs.production.min.js.map diff --git a/dist/meta-diagram.cjs.production.min.js.map b/dist/meta-diagram.cjs.production.min.js.map index 6b02cc9..d6739d0 100644 --- a/dist/meta-diagram.cjs.production.min.js.map +++ b/dist/meta-diagram.cjs.production.min.js.map @@ -1 +1 @@ -{"version":3,"file":"meta-diagram.cjs.production.min.js","sources":["../src/constants.ts","../src/models/MetaOptions.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/components/Sidebar.tsx","../src/components/assets/styles/variables.ts","../src/index.tsx","../src/models/ComponentsMap.ts","../src/models/MetaLink.ts","../src/models/MetaNode.ts","../src/models/Position.ts","../src/helpers/linksHelper.ts"],"sourcesContent":["export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\"\nexport {LinkWidget} from '@projectstorm/react-diagrams-core'","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n"],"names":["ReactDiagramMetaTypes","MetaOptions","constructor","id","name","shape","options","this","set","getId","get","getShape","MetaNodeModel","NodeModel","super","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","_model$getOptions","diagramEngine","link","getNode","nodes","find","n","textWhite","dividerColor","fontFamily","primaryBg","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","position","left","top","transform","&.right","right","& .MuiList-root","padding","node","margin","& .MuiDivider-root","borderColor","border","borderTop","& img","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","toString","alt","Divider","disabled","_","container","height","canvasContainer","nodesMap","linksMap","links","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","children","x","y","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","Object","fromEntries","ml","metaLink","source","target","setSourcePort","getPort","setTargetPort","getLinkModel","filter","mlm","undefined","addAll","setModel","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"meta-diagram.cjs.production.min.js","sources":["../src/constants.ts","../src/models/MetaOptions.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/components/Sidebar.tsx","../src/components/assets/styles/variables.ts","../src/index.tsx","../src/models/ComponentsMap.ts","../src/models/MetaLink.ts","../src/models/MetaNode.ts","../src/models/Position.ts","../src/helpers/linksHelper.ts"],"sourcesContent":["export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\"\nexport {LinkWidget} from '@projectstorm/react-diagrams-core'","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n"],"names":["ReactDiagramMetaTypes","MetaOptions","constructor","id","name","shape","options","this","set","getId","get","getShape","MetaNodeModel","NodeModel","super","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","key","getOptions","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","_model$getOptions","diagramEngine","link","getNode","nodes","find","n","textWhite","dividerColor","fontFamily","primaryBg","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","position","left","top","transform","&.right","right","& .MuiList-root","padding","node","margin","& .MuiDivider-root","borderColor","border","borderTop","& img","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","toString","alt","Divider","disabled","_","container","height","canvasContainer","nodesMap","linksMap","links","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","children","x","y","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","Object","fromEntries","ml","metaLink","source","target","setSourcePort","getPort","setTargetPort","getLinkModel","filter","mlm","undefined","addAll","setModel","diagramClassName","CanvasWidget"],"mappings":"8IAAYA,2RCGCC,EAGXC,YACEC,EACAC,EACAC,EACAC,GAEAC,KAAKD,QAAUA,EACfC,KAAKD,QAAQE,IAAI,KAAML,GACvBI,KAAKD,QAAQE,IAAI,OAAQJ,GACzBG,KAAKD,QAAQE,IAAI,QAASH,GAG5BI,QACE,OAAOF,KAAKD,QAAQI,IAAI,MAG1BC,WACE,OAAOJ,KAAKD,QAAQI,IAAI,WDvB5B,SAAYV,GACVA,6BACAA,6BAFF,CAAYA,IAAAA,aEGCY,UAAsBC,YACjCX,YAAYI,EAAU,IACpBQ,MAAM,IACDR,EACHS,KAAMf,EAAsBgB,YAK9BT,KAAKU,QACH,IAAIC,mBAAiB,CACnBC,IAAI,EACJf,KAAM,QAGVG,KAAKU,QACH,IAAIC,mBAAiB,CACnBC,IAAI,EACJf,KAAM,gBCnBDgB,EAAoB,IACxBC,iDCGIC,UAAwBC,uBAGnCrB,YAAYsB,GACVV,MAAMd,EAAsBgB,WAC5BT,KAAKiB,cAAgBA,EAGvBC,gBACE,OAAO,IAAIb,EAGbc,oBAAoBC,GAClB,GAAIpB,KAAKiB,cAAcI,IAAID,EAAME,MAAMvB,QAAQD,OAAQ,CACrD,MAAMyB,EAAqBvB,KAAKiB,cAAcd,IAC5CiB,EAAME,MAAMvB,QAAQD,OAEtB,OAEEgB,gBAACS,GACCC,oBAAqBJ,EAAME,MAAMG,aAAa7B,GAC9C8B,OAAQ1B,KAAK0B,OACbJ,MAAOF,EAAME,QAKnB,OAAOR,gBAACD,eC9BCc,UAAsBC,mBACjCjC,YAAYI,EAAU,IACpBQ,MAAM,IACDR,EACHS,KAAMf,EAAsBoC,mBCDrBC,UAAwBC,qBAGnCpC,YAAYsB,GACVV,MAAMd,EAAsBoC,WAC5B7B,KAAKiB,cAAgBA,EAGvBC,gBACE,OAAO,IAAIS,EAGbK,oBACEV,EACAW,EACAC,SAGA,GAAIlC,KAAKiB,cAAcI,aAAIC,EAAMG,qBAANU,EAAoBrC,OAAQ,CACrD,MAAMyB,EAAqBvB,KAAKiB,cAAcd,IAE5CmB,EAAMG,aAAa3B,OAGrB,OAEEgB,gBAACS,GACCC,oBAAqBF,EAAMG,aAAa7B,GACxCwC,cAAepC,KAAK0B,OACpBW,KAAMf,EACNY,KAAMA,EACND,SAAUA,IAKhB,OAAOnB,gBAACD,kBCxCIyB,EACd1C,EACA2C,GAEA,OAAOA,EAAMC,KAAKC,GAAKA,EAAEhB,aAAa7B,KAAOA,GCK/C,MAAM8C,UAAEA,EAAFC,aAAaA,GCXN,CACXC,WAAY,oBACZC,UAAW,UACXH,UAAW,UACXI,cAAe,UACfC,YAAa,wBAEbC,qBAAsB,2BACtBC,mBAAoB,yBAEpBC,oBAAqB,UACrBC,oBAAqB,UAErBC,qBAAsB,SACtBC,0BAA2B,UAC3BC,6BAA8B,yBAE9BC,iBAAkB,UAClBC,sBAAuB,UACvBC,cACE,oFACFC,gBAAiB,sBAEjBf,aAAc,4BAEdgB,WAAY,2BACZC,kBAAmB,wBAEnBC,aAAc,qBAEdC,WAAY,UACZC,YAAa,UACbC,eAAgB,8BAEhBC,aACE,qFDtBEC,EAAYC,aAAW,MAC3BC,KAAM,CACJC,OAAQ,IACRC,MAAO,OACPC,WAAY7B,EACZ8B,UACE,+EACFC,aAAc,OACdC,SAAU,QACVC,KAAM,OACNC,IAAK,MACLC,UAAW,mBAEXC,UAAW,CACTH,KAAM,OACNI,MAAO,QAGTC,kBAAmB,CACjBC,QAAS,YAIbC,KAAM,CACJC,OAAQ,YACRC,qBAAsB,CACpBC,YAAa1C,EACb2B,MAAO,sBACPa,OAAQ,SACRG,OAAQ,OACRC,UAAW,mBAGbC,QAAS,CACPC,QAAS,QACTN,OAAQ,cAKRO,EAAU,KACd,MAAMC,EAAUzB,IAChB,OACEpD,gBAAC8E,OAAIC,UAAcF,EAAQvB,cACzBtD,gBAACgF,QAAKC,kBAAeC,UAAU,OAC7BlF,gBAACmF,kBAAehE,aACdnB,gBAACoF,oBACCpF,uBACEqF,iCAAkC,IAAIC,k6BAAeC,SACnD,UAEFC,IAAI,WAKVxF,gBAACmF,sBACCnF,gBAACoF,oBACCpF,uBACEqF,iCAAkC,IAAIC,44DAAaC,SACjD,UAEFC,IAAI,YAMZxF,gBAAC8E,OAAIC,UAAWF,EAAQT,MACtBpE,gBAACyF,gBACDzF,uBACEqF,iCAAkC,IAAIC,4uCAAaC,SACjD,UAEFC,IAAI,SAENxF,gBAACyF,iBAGHzF,gBAACgF,QAAKC,kBAAeC,UAAU,OAC7BlF,gBAACmF,kBAAeO,aACd1F,gBAACoF,oBACCpF,uBACEqF,iCAAkC,IAAIC,i8EAAaC,SACjD,UAEFC,IAAI,WAKVxF,gBAACmF,sBACCnF,gBAACoF,oBACCpF,uBACEqF,iCAAkC,IAAIC,q2CAAmBC,SACvD,UAEFC,IAAI,oBEjGZpC,EAAYC,aAAWsC,KACzBC,UAAW,CACPC,OAAQ,OACRrC,MAAO,QAEXsC,gBAAiB,CACbD,OAAQ,OACRrC,MAAO,OACPC,WAAY,wPCflB5E,YACEkH,EACAC,GAEA9G,KAAKuC,MAAQsE,EACb7G,KAAK+G,MAAQD,2BCDfnH,YACEC,EACAC,EACAC,EACAkH,EACAC,EACAC,EACAC,EACApH,GAEAC,KAAKgH,SAAWA,EAChBhH,KAAKiH,aAAeA,EACpBjH,KAAKkH,SAAWA,EAChBlH,KAAKmH,aAAeA,EACpBnH,KAAKD,QAAU,IAAIL,EAAYE,EAAIC,EAAMC,EAAOC,GAGlDqH,cACE,OAAOpH,KAAKgH,SAGdK,kBACE,OAAOrH,KAAKiH,aAGdK,cACE,OAAOtH,KAAKkH,SAGdK,kBACE,OAAOvH,KAAKmH,8DCjCdxH,YACEC,EACAC,EACAC,EACA4E,EACA3E,GAEAC,KAAKwH,SAAW,GAChBzH,EAAQE,IAAI,WAAYyE,GACxB1E,KAAKD,QAAU,IAAIL,EAAYE,EAAIC,EAAMC,EAAOC,oDCZlDJ,YAAY8H,EAAWC,GACrB1H,KAAKyH,EAAIA,EACTzH,KAAK0H,EAAIA,oBJ2BO,EACKC,UAAAA,EACAC,UAAAA,EACA3G,cAAAA,EACA4G,iBAAAA,EACAC,gBAAAA,MAErB,MAAMnC,EAAUzB,IAGVxC,EAASqG,IAEfrG,EACKsG,mBAEAC,gBAAgB,IAAIlH,EAAgBE,EAAcsB,QAEvDb,EACKwG,mBAEAD,gBAAgB,IAAInG,EAAgBb,EAAc8F,QAIvD,MAAMzF,EAAQ,IAAI6G,eACZ5F,EAAQoF,EAAUS,IACpBC,GAAM,IAAIhI,EAAciI,OAAOC,YAAYF,EAAGtI,QAAQA,WAEpDgH,EAAQa,EACTQ,IAAII,YKxDXC,EACAlG,GAEA,MAAMF,EAAO,IAAIV,EAAc2G,OAAOC,YAAYE,EAAS1I,QAAQA,UAC7D2I,EAASpG,EAAQmG,EAASrB,cAAe7E,GACzCoG,EAASrG,EAAQmG,EAASnB,cAAe/E,GAC/C,GAAImG,GAAUC,EAGZ,OAFAtG,EAAKuG,cAAcF,EAAOG,QAAQJ,EAASpB,oBAC3ChF,EAAKyG,cAAcH,EAAOE,QAAQJ,EAASlB,oBACpClF,EL+CQ0G,CAAaP,EAAIjG,IAC3ByG,OAAOC,QAAeC,IAARD,GAEnB3H,EAAM6H,UAAU5G,KAAUwE,GAG1BrF,EAAO0H,SAAS9H,GAEhB,MAGM+H,EAAmBvB,GAEnBnC,EAAQiB,gBACd,OACI9F,uBAAK+E,UAPkBgC,GAErBlC,EAAQe,WAMN5F,gBAAC4E,QACD5E,gBAACwI,gBAAazD,UAAWwD,EAAkB3H,OAAQA"} \ No newline at end of file diff --git a/dist/meta-diagram.esm.js b/dist/meta-diagram.esm.js index 05f183f..058ba7a 100644 --- a/dist/meta-diagram.esm.js +++ b/dist/meta-diagram.esm.js @@ -111,12 +111,14 @@ class MetaNodeFactory extends AbstractReactFactory { generateReactWidget(event) { if (this.componentsMap.has(event.model.options.shape)) { - const ReactComponentType = this.componentsMap.get(event.model.options.shape); // @ts-ignore - - return React__default.createElement(ReactComponentType, { - engine: this.engine, - model: event.model - }); + const ReactComponentType = this.componentsMap.get(event.model.options.shape); + return (// @ts-ignore + React__default.createElement(ReactComponentType, { + key: `node-factory-${event.model.getOptions().id}`, + engine: this.engine, + model: event.model + }) + ); } // TODO: Generate default node instead @@ -153,6 +155,7 @@ class MetaLinkFactory extends DefaultLinkFactory { model.getOptions().shape); return (// @ts-ignore React__default.createElement(ReactComponentType, { + key: `link-factory-${model.getOptions().id}`, diagramEngine: this.engine, link: model, path: path, diff --git a/dist/meta-diagram.esm.js.map b/dist/meta-diagram.esm.js.map index 51a900a..139f1c8 100644 --- a/dist/meta-diagram.esm.js.map +++ b/dist/meta-diagram.esm.js.map @@ -1 +1 @@ -{"version":3,"file":"meta-diagram.esm.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n // @ts-ignore\n return ;\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\"\nexport {LinkWidget} from '@projectstorm/react-diagrams-core'"],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getOptions","diagramEngine","link","getNode","find","n","getLinkModel","metaLink","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"meta-diagram.esm.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\"\nexport {LinkWidget} from '@projectstorm/react-diagrams-core'"],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","key","getOptions","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","diagramEngine","link","getNode","find","n","getLinkModel","metaLink","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file diff --git a/package.json b/package.json index 395a918..7955c6e 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "version": "0.1.2", + "version": "0.1.3", "license": "MIT", "main": "dist/index.js", "typings": "dist/index.d.ts", diff --git a/src/react-diagrams/MetaLinkFactory.tsx b/src/react-diagrams/MetaLinkFactory.tsx index b32f513..20a8adb 100644 --- a/src/react-diagrams/MetaLinkFactory.tsx +++ b/src/react-diagrams/MetaLinkFactory.tsx @@ -30,7 +30,13 @@ export class MetaLinkFactory extends DefaultLinkFactory { return ( // @ts-ignore - + ); } // TODO: Generate default link instead diff --git a/src/react-diagrams/MetaNodeFactory.tsx b/src/react-diagrams/MetaNodeFactory.tsx index 8e33433..e885a05 100644 --- a/src/react-diagrams/MetaNodeFactory.tsx +++ b/src/react-diagrams/MetaNodeFactory.tsx @@ -21,8 +21,14 @@ export class MetaNodeFactory extends AbstractReactFactory { const ReactComponentType = this.componentsMap.get( event.model.options.shape ); - // @ts-ignore - return ; + return ( + // @ts-ignore + + ); } // TODO: Generate default node instead return ; From 3c1a9226e9cdf21ad1ef8505376732801ee575f9 Mon Sep 17 00:00:00 2001 From: afonso Date: Mon, 1 Aug 2022 10:38:00 +0100 Subject: [PATCH 7/9] #18 chore: Redo prop name changes; --- src/react-diagrams/MetaLinkFactory.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/react-diagrams/MetaLinkFactory.tsx b/src/react-diagrams/MetaLinkFactory.tsx index 20a8adb..2b941fa 100644 --- a/src/react-diagrams/MetaLinkFactory.tsx +++ b/src/react-diagrams/MetaLinkFactory.tsx @@ -32,8 +32,8 @@ export class MetaLinkFactory extends DefaultLinkFactory { // @ts-ignore From 10cda9df994dd79deb74234bc50419fdb22aaf02 Mon Sep 17 00:00:00 2001 From: afonso Date: Mon, 1 Aug 2022 10:38:36 +0100 Subject: [PATCH 8/9] #18 chore: Remove react-diagrams pass through --- src/index.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/index.tsx b/src/index.tsx index e2030ac..cdd796e 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -86,5 +86,3 @@ export default MetaDiagram; export {MetaNode, MetaLink, MetaNodeModel, ComponentsMap}; export {MetaLinkModel} from './react-diagrams/MetaLinkModel'; export {Position} from './models/Position'; -export {DefaultLinkWidget} from "@projectstorm/react-diagrams" -export {LinkWidget} from '@projectstorm/react-diagrams-core' \ No newline at end of file From 8704435656f563fed934e6765001cff51641e036 Mon Sep 17 00:00:00 2001 From: afonso Date: Mon, 1 Aug 2022 10:38:56 +0100 Subject: [PATCH 9/9] #18 chore: Update dist --- dist/index.d.ts | 2 -- dist/meta-diagram.cjs.development.js | 17 ++--------------- dist/meta-diagram.cjs.development.js.map | 2 +- dist/meta-diagram.cjs.production.min.js | 2 +- dist/meta-diagram.cjs.production.min.js.map | 2 +- dist/meta-diagram.esm.js | 6 ++---- dist/meta-diagram.esm.js.map | 2 +- 7 files changed, 8 insertions(+), 25 deletions(-) diff --git a/dist/index.d.ts b/dist/index.d.ts index ccff014..cf4e557 100644 --- a/dist/index.d.ts +++ b/dist/index.d.ts @@ -14,5 +14,3 @@ export default MetaDiagram; export { MetaNode, MetaLink, MetaNodeModel, ComponentsMap }; export { MetaLinkModel } from './react-diagrams/MetaLinkModel'; export { Position } from './models/Position'; -export { DefaultLinkWidget } from "@projectstorm/react-diagrams"; -export { LinkWidget } from '@projectstorm/react-diagrams-core'; diff --git a/dist/meta-diagram.cjs.development.js b/dist/meta-diagram.cjs.development.js index 95632f8..408002b 100644 --- a/dist/meta-diagram.cjs.development.js +++ b/dist/meta-diagram.cjs.development.js @@ -13,7 +13,6 @@ var core = require('@material-ui/core'); var system = require('@mui/system'); var styles = require('@mui/styles'); var material = require('@mui/material'); -var reactDiagramsCore = require('@projectstorm/react-diagrams-core'); class MetaOptions { constructor(id, name, shape, options) { @@ -163,8 +162,8 @@ class MetaLinkFactory extends createEngine.DefaultLinkFactory { return (// @ts-ignore React__default.createElement(ReactComponentType, { key: `link-factory-${model.getOptions().id}`, - diagramEngine: this.engine, - link: model, + engine: this.engine, + model: model, path: path, selected: selected }) @@ -357,18 +356,6 @@ const MetaDiagram = ({ })); }; -Object.defineProperty(exports, 'DefaultLinkWidget', { - enumerable: true, - get: function () { - return createEngine.DefaultLinkWidget; - } -}); -Object.defineProperty(exports, 'LinkWidget', { - enumerable: true, - get: function () { - return reactDiagramsCore.LinkWidget; - } -}); exports.ComponentsMap = ComponentsMap; exports.MetaLink = MetaLink; exports.MetaLinkModel = MetaLinkModel; diff --git a/dist/meta-diagram.cjs.development.js.map b/dist/meta-diagram.cjs.development.js.map index 0950a43..4c57b91 100644 --- a/dist/meta-diagram.cjs.development.js.map +++ b/dist/meta-diagram.cjs.development.js.map @@ -1 +1 @@ -{"version":3,"file":"meta-diagram.cjs.development.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\"\nexport {LinkWidget} from '@projectstorm/react-diagrams-core'"],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","key","getOptions","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","diagramEngine","link","getNode","find","n","getLinkModel","metaLink","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"meta-diagram.cjs.development.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\n"],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","key","getOptions","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getNode","find","n","getLinkModel","metaLink","link","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file diff --git a/dist/meta-diagram.cjs.production.min.js b/dist/meta-diagram.cjs.production.min.js index eabff92..453950b 100644 --- a/dist/meta-diagram.cjs.production.min.js +++ b/dist/meta-diagram.cjs.production.min.js @@ -1,2 +1,2 @@ -"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t,r=require("react"),o=e(r),n=require("@projectstorm/react-diagrams"),i=e(n),a=require("@projectstorm/react-canvas-core"),s=require("@material-ui/core"),l=require("@mui/system"),c=require("@mui/styles"),d=require("@mui/material"),m=require("@projectstorm/react-diagrams-core");class g{constructor(e,t,r,o){this.options=o,this.options.set("id",e),this.options.set("name",t),this.options.set("shape",r)}getId(){return this.options.get("id")}getShape(){return this.options.get("shape")}}!function(e){e.META_NODE="meta-node-type",e.META_LINK="meta-link-type"}(t||(t={}));class C extends n.NodeModel{constructor(e={}){super({...e,type:t.META_NODE}),this.addPort(new n.DefaultPortModel({in:!0,name:"in"})),this.addPort(new n.DefaultPortModel({in:!1,name:"out"}))}}const u=()=>o.createElement("div",null,"Unknown Type");class p extends a.AbstractReactFactory{constructor(e){super(t.META_NODE),this.componentsMap=e}generateModel(){return new C}generateReactWidget(e){if(this.componentsMap.has(e.model.options.shape)){const t=this.componentsMap.get(e.model.options.shape);return o.createElement(t,{key:"node-factory-"+e.model.getOptions().id,engine:this.engine,model:e.model})}return o.createElement(u,null)}}class h extends n.DefaultLinkModel{constructor(e={}){super({...e,type:t.META_LINK})}}class f extends n.DefaultLinkFactory{constructor(e){super(t.META_LINK),this.componentsMap=e}generateModel(){return new h}generateLinkSegment(e,t,r){var n;if(this.componentsMap.has(null==(n=e.getOptions())?void 0:n.shape)){const n=this.componentsMap.get(e.getOptions().shape);return o.createElement(n,{key:"link-factory-"+e.getOptions().id,diagramEngine:this.engine,link:e,path:r,selected:t})}return o.createElement(u,null)}}function w(e,t){return t.find(t=>t.getOptions().id===e)}const{textWhite:b,dividerColor:x}={fontFamily:"Inter, sans-serif",primaryBg:"#f1f1f1",textWhite:"#FFFFFF",chipTextColor:"#F2F2F7",chipBgColor:"rgba(60, 60, 67, 0.4)",chipPrimaryTextColor:"rgba(255, 255, 255, 0.8)",chipPrimaryBgColor:"rgba(0, 122, 255, 0.6)",breadcrumbLinkColor:"#A2A2A2",breadcrumbTextColor:"#292929",buttonPrimaryBgColor:"4353FF",buttonPrimaryBgHoverColor:"#3443E1",buttonPrimaryDisabledBgColor:"rgba(0, 122, 255, 0.4)",listItemActiveBg:"#007AFF",listSelectedTextColor:"#3C3C43",listBoxShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)",listBorderColor:"rgba(0, 0, 0, 0.04)",dividerColor:"rgba(118, 120, 125, 0.12)",dropdownBg:"rgba(246, 246, 248, 0.8)",dropdownTextColor:"rgba(60, 60, 67, 0.6)",overlayColor:"rgba(0, 0, 0, 0.4)",progressBg:"#E5E5E5",progressBar:"#017AFF",progressShadow:"inset 0 0 0.0625rem #E3E3E3",switchShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)"},v=c.makeStyles(()=>({root:{zIndex:"5",width:"4rem",background:b,boxShadow:"0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)",borderRadius:"2rem",position:"fixed",left:"1rem",top:"50%",transform:"translateY(-50%)","&.right":{left:"auto",right:"1rem"},"& .MuiList-root":{padding:"0.75rem"}},node:{margin:"0.25rem 0","& .MuiDivider-root":{borderColor:x,width:"calc(100% - 1.5rem)",margin:"0 auto",border:"none",borderTop:"0.0625rem solid"},"& img":{display:"block",margin:"1rem 0"}}})),M=()=>{const e=v();return o.createElement(l.Box,{className:e.root+" left"},o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{selected:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"move"})))),o.createElement(l.Box,{className:e.node},o.createElement(d.Divider,null),o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n').toString("base64"),alt:"node"}),o.createElement(d.Divider,null)),o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{disabled:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"fullscreen"})))))},E=s.makeStyles(e=>({container:{height:"100%",width:"100%"},canvasContainer:{height:"100%",width:"100%",background:"#333333"}}));Object.defineProperty(exports,"DefaultLinkWidget",{enumerable:!0,get:function(){return n.DefaultLinkWidget}}),Object.defineProperty(exports,"LinkWidget",{enumerable:!0,get:function(){return m.LinkWidget}}),exports.ComponentsMap=class{constructor(e,t){this.nodes=e,this.links=t}},exports.MetaLink=class{constructor(e,t,r,o,n,i,a,s){this.sourceId=o,this.sourcePortId=n,this.targetId=i,this.targetPortId=a,this.options=new g(e,t,r,s)}getSourceId(){return this.sourceId}getSourcePortId(){return this.sourcePortId}getTargetId(){return this.targetId}getTargetPortId(){return this.targetPortId}},exports.MetaLinkModel=h,exports.MetaNode=class{constructor(e,t,r,o,n){this.children=[],n.set("position",o),this.options=new g(e,t,r,n)}},exports.MetaNodeModel=C,exports.Position=class{constructor(e,t){this.x=e,this.y=t}},exports.default=({metaNodes:e,metaLinks:t,componentsMap:o,wrapperClassName:s,canvasClassName:l})=>{const c=E(),d=i();d.getNodeFactories().registerFactory(new p(o.nodes)),d.getLinkFactories().registerFactory(new f(o.links));const m=new n.DiagramModel,g=e.map(e=>new C(Object.fromEntries(e.options.options))),u=t.map(e=>function(e,t){const r=new h(Object.fromEntries(e.options.options)),o=w(e.getSourceId(),t),n=w(e.getTargetId(),t);if(o&&n)return r.setSourcePort(o.getPort(e.getSourcePortId())),r.setTargetPort(n.getPort(e.getTargetPortId())),r}(e,g)).filter(e=>void 0!==e);m.addAll(...g,...u),d.setModel(m);const b=l||c.canvasContainer;return r.createElement("div",{className:s||c.container},r.createElement(M,null),r.createElement(a.CanvasWidget,{className:b,engine:d}))}; +"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t,r=require("react"),o=e(r),n=require("@projectstorm/react-diagrams"),i=e(n),s=require("@projectstorm/react-canvas-core"),a=require("@material-ui/core"),l=require("@mui/system"),c=require("@mui/styles"),d=require("@mui/material");class m{constructor(e,t,r,o){this.options=o,this.options.set("id",e),this.options.set("name",t),this.options.set("shape",r)}getId(){return this.options.get("id")}getShape(){return this.options.get("shape")}}!function(e){e.META_NODE="meta-node-type",e.META_LINK="meta-link-type"}(t||(t={}));class C extends n.NodeModel{constructor(e={}){super({...e,type:t.META_NODE}),this.addPort(new n.DefaultPortModel({in:!0,name:"in"})),this.addPort(new n.DefaultPortModel({in:!1,name:"out"}))}}const g=()=>o.createElement("div",null,"Unknown Type");class p extends s.AbstractReactFactory{constructor(e){super(t.META_NODE),this.componentsMap=e}generateModel(){return new C}generateReactWidget(e){if(this.componentsMap.has(e.model.options.shape)){const t=this.componentsMap.get(e.model.options.shape);return o.createElement(t,{key:"node-factory-"+e.model.getOptions().id,engine:this.engine,model:e.model})}return o.createElement(g,null)}}class u extends n.DefaultLinkModel{constructor(e={}){super({...e,type:t.META_LINK})}}class h extends n.DefaultLinkFactory{constructor(e){super(t.META_LINK),this.componentsMap=e}generateModel(){return new u}generateLinkSegment(e,t,r){var n;if(this.componentsMap.has(null==(n=e.getOptions())?void 0:n.shape)){const n=this.componentsMap.get(e.getOptions().shape);return o.createElement(n,{key:"link-factory-"+e.getOptions().id,engine:this.engine,model:e,path:r,selected:t})}return o.createElement(g,null)}}function f(e,t){return t.find(t=>t.getOptions().id===e)}const{textWhite:w,dividerColor:v}={fontFamily:"Inter, sans-serif",primaryBg:"#f1f1f1",textWhite:"#FFFFFF",chipTextColor:"#F2F2F7",chipBgColor:"rgba(60, 60, 67, 0.4)",chipPrimaryTextColor:"rgba(255, 255, 255, 0.8)",chipPrimaryBgColor:"rgba(0, 122, 255, 0.6)",breadcrumbLinkColor:"#A2A2A2",breadcrumbTextColor:"#292929",buttonPrimaryBgColor:"4353FF",buttonPrimaryBgHoverColor:"#3443E1",buttonPrimaryDisabledBgColor:"rgba(0, 122, 255, 0.4)",listItemActiveBg:"#007AFF",listSelectedTextColor:"#3C3C43",listBoxShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)",listBorderColor:"rgba(0, 0, 0, 0.04)",dividerColor:"rgba(118, 120, 125, 0.12)",dropdownBg:"rgba(246, 246, 248, 0.8)",dropdownTextColor:"rgba(60, 60, 67, 0.6)",overlayColor:"rgba(0, 0, 0, 0.4)",progressBg:"#E5E5E5",progressBar:"#017AFF",progressShadow:"inset 0 0 0.0625rem #E3E3E3",switchShadow:"0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)"},x=c.makeStyles(()=>({root:{zIndex:"5",width:"4rem",background:w,boxShadow:"0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)",borderRadius:"2rem",position:"fixed",left:"1rem",top:"50%",transform:"translateY(-50%)","&.right":{left:"auto",right:"1rem"},"& .MuiList-root":{padding:"0.75rem"}},node:{margin:"0.25rem 0","& .MuiDivider-root":{borderColor:v,width:"calc(100% - 1.5rem)",margin:"0 auto",border:"none",borderTop:"0.0625rem solid"},"& img":{display:"block",margin:"1rem 0"}}})),M=()=>{const e=x();return o.createElement(l.Box,{className:e.root+" left"},o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{selected:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"move"})))),o.createElement(l.Box,{className:e.node},o.createElement(d.Divider,null),o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n').toString("base64"),alt:"node"}),o.createElement(d.Divider,null)),o.createElement(d.List,{disablePadding:!0,component:"nav"},o.createElement(d.ListItemButton,{disabled:!0},o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),o.createElement(d.ListItemButton,null,o.createElement(d.ListItemIcon,null,o.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"fullscreen"})))))},b=a.makeStyles(e=>({container:{height:"100%",width:"100%"},canvasContainer:{height:"100%",width:"100%",background:"#333333"}}));exports.ComponentsMap=class{constructor(e,t){this.nodes=e,this.links=t}},exports.MetaLink=class{constructor(e,t,r,o,n,i,s,a){this.sourceId=o,this.sourcePortId=n,this.targetId=i,this.targetPortId=s,this.options=new m(e,t,r,a)}getSourceId(){return this.sourceId}getSourcePortId(){return this.sourcePortId}getTargetId(){return this.targetId}getTargetPortId(){return this.targetPortId}},exports.MetaLinkModel=u,exports.MetaNode=class{constructor(e,t,r,o,n){this.children=[],n.set("position",o),this.options=new m(e,t,r,n)}},exports.MetaNodeModel=C,exports.Position=class{constructor(e,t){this.x=e,this.y=t}},exports.default=({metaNodes:e,metaLinks:t,componentsMap:o,wrapperClassName:a,canvasClassName:l})=>{const c=b(),d=i();d.getNodeFactories().registerFactory(new p(o.nodes)),d.getLinkFactories().registerFactory(new h(o.links));const m=new n.DiagramModel,g=e.map(e=>new C(Object.fromEntries(e.options.options))),w=t.map(e=>function(e,t){const r=new u(Object.fromEntries(e.options.options)),o=f(e.getSourceId(),t),n=f(e.getTargetId(),t);if(o&&n)return r.setSourcePort(o.getPort(e.getSourcePortId())),r.setTargetPort(n.getPort(e.getTargetPortId())),r}(e,g)).filter(e=>void 0!==e);m.addAll(...g,...w),d.setModel(m);const v=l||c.canvasContainer;return r.createElement("div",{className:a||c.container},r.createElement(M,null),r.createElement(s.CanvasWidget,{className:v,engine:d}))}; //# sourceMappingURL=meta-diagram.cjs.production.min.js.map diff --git a/dist/meta-diagram.cjs.production.min.js.map b/dist/meta-diagram.cjs.production.min.js.map index d6739d0..30055b0 100644 --- a/dist/meta-diagram.cjs.production.min.js.map +++ b/dist/meta-diagram.cjs.production.min.js.map @@ -1 +1 @@ -{"version":3,"file":"meta-diagram.cjs.production.min.js","sources":["../src/constants.ts","../src/models/MetaOptions.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/components/Sidebar.tsx","../src/components/assets/styles/variables.ts","../src/index.tsx","../src/models/ComponentsMap.ts","../src/models/MetaLink.ts","../src/models/MetaNode.ts","../src/models/Position.ts","../src/helpers/linksHelper.ts"],"sourcesContent":["export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\"\nexport {LinkWidget} from '@projectstorm/react-diagrams-core'","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n"],"names":["ReactDiagramMetaTypes","MetaOptions","constructor","id","name","shape","options","this","set","getId","get","getShape","MetaNodeModel","NodeModel","super","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","key","getOptions","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","_model$getOptions","diagramEngine","link","getNode","nodes","find","n","textWhite","dividerColor","fontFamily","primaryBg","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","position","left","top","transform","&.right","right","& .MuiList-root","padding","node","margin","& .MuiDivider-root","borderColor","border","borderTop","& img","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","toString","alt","Divider","disabled","_","container","height","canvasContainer","nodesMap","linksMap","links","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","children","x","y","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","Object","fromEntries","ml","metaLink","source","target","setSourcePort","getPort","setTargetPort","getLinkModel","filter","mlm","undefined","addAll","setModel","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"meta-diagram.cjs.production.min.js","sources":["../src/constants.ts","../src/models/MetaOptions.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/components/Sidebar.tsx","../src/components/assets/styles/variables.ts","../src/index.tsx","../src/models/ComponentsMap.ts","../src/models/MetaLink.ts","../src/models/MetaNode.ts","../src/models/Position.ts","../src/helpers/linksHelper.ts"],"sourcesContent":["export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n"],"names":["ReactDiagramMetaTypes","MetaOptions","constructor","id","name","shape","options","this","set","getId","get","getShape","MetaNodeModel","NodeModel","super","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","key","getOptions","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","_model$getOptions","getNode","nodes","find","n","textWhite","dividerColor","fontFamily","primaryBg","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","position","left","top","transform","&.right","right","& .MuiList-root","padding","node","margin","& .MuiDivider-root","borderColor","border","borderTop","& img","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","toString","alt","Divider","disabled","_","container","height","canvasContainer","nodesMap","linksMap","links","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","children","x","y","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","Object","fromEntries","ml","metaLink","link","source","target","setSourcePort","getPort","setTargetPort","getLinkModel","filter","mlm","undefined","addAll","setModel","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file diff --git a/dist/meta-diagram.esm.js b/dist/meta-diagram.esm.js index 058ba7a..d7658be 100644 --- a/dist/meta-diagram.esm.js +++ b/dist/meta-diagram.esm.js @@ -1,12 +1,10 @@ import React__default, { createElement } from 'react'; import createEngine, { NodeModel, DefaultPortModel, DefaultLinkModel, DefaultLinkFactory, DiagramModel } from '@projectstorm/react-diagrams'; -export { DefaultLinkWidget } from '@projectstorm/react-diagrams'; import { AbstractReactFactory, CanvasWidget } from '@projectstorm/react-canvas-core'; import { makeStyles as makeStyles$1 } from '@material-ui/core'; import { Box } from '@mui/system'; import { makeStyles } from '@mui/styles'; import { List, ListItemButton, ListItemIcon, Divider } from '@mui/material'; -export { LinkWidget } from '@projectstorm/react-diagrams-core'; class MetaOptions { constructor(id, name, shape, options) { @@ -156,8 +154,8 @@ class MetaLinkFactory extends DefaultLinkFactory { return (// @ts-ignore React__default.createElement(ReactComponentType, { key: `link-factory-${model.getOptions().id}`, - diagramEngine: this.engine, - link: model, + engine: this.engine, + model: model, path: path, selected: selected }) diff --git a/dist/meta-diagram.esm.js.map b/dist/meta-diagram.esm.js.map index 139f1c8..a241999 100644 --- a/dist/meta-diagram.esm.js.map +++ b/dist/meta-diagram.esm.js.map @@ -1 +1 @@ -{"version":3,"file":"meta-diagram.esm.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\nexport {DefaultLinkWidget} from \"@projectstorm/react-diagrams\"\nexport {LinkWidget} from '@projectstorm/react-diagrams-core'"],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","key","getOptions","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","diagramEngine","link","getNode","find","n","getLinkModel","metaLink","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"meta-diagram.esm.js","sources":["../src/models/MetaOptions.ts","../src/models/MetaNode.ts","../src/models/MetaLink.ts","../src/models/ComponentsMap.ts","../src/constants.ts","../src/react-diagrams/MetaNodeModel.ts","../src/components/UnknownTypeWidget.tsx","../src/react-diagrams/MetaNodeFactory.tsx","../src/react-diagrams/MetaLinkModel.ts","../src/react-diagrams/MetaLinkFactory.tsx","../src/helpers/nodesHelper.ts","../src/helpers/linksHelper.ts","../src/components/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/models/Position.ts","../src/index.tsx"],"sourcesContent":["import { IShape } from './IShape';\nimport { IId } from './IId';\n\nexport class MetaOptions implements IShape, IId {\n options: Map;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n options: Map\n ) {\n this.options = options;\n this.options.set('id', id);\n this.options.set('name', name);\n this.options.set('shape', shape);\n }\n\n getId(): string {\n return this.options.get('id');\n }\n\n getShape(): string {\n return this.options.get('shape');\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { Position } from './Position';\n\nexport class MetaNode {\n children: MetaNode[];\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n position: Position,\n options: Map\n ) {\n this.children = [];\n options.set('position', position);\n this.options = new MetaOptions(id, name, shape, options);\n }\n}\n","import { MetaOptions } from './MetaOptions';\nimport { ILink } from './ILink';\n\nexport class MetaLink implements ILink {\n sourceId: string;\n sourcePortId: string;\n targetId: string;\n targetPortId: string;\n options: MetaOptions;\n\n constructor(\n id: string,\n name: string,\n shape: string,\n sourceId: string,\n sourcePortId: string,\n targetId: string,\n targetPortId: string,\n options: Map\n ) {\n this.sourceId = sourceId;\n this.sourcePortId = sourcePortId;\n this.targetId = targetId;\n this.targetPortId = targetPortId;\n this.options = new MetaOptions(id, name, shape, options);\n }\n\n getSourceId(): string {\n return this.sourceId;\n }\n\n getSourcePortId(): string {\n return this.sourcePortId;\n }\n\n getTargetId(): string {\n return this.targetId;\n }\n\n getTargetPortId(): string {\n return this.targetPortId;\n }\n}\n","import React from 'react';\n\nexport class ComponentsMap {\n nodes: Map;\n links: Map;\n\n constructor(\n nodesMap: Map,\n linksMap: Map\n ) {\n this.nodes = nodesMap;\n this.links = linksMap;\n }\n}\n","export enum ReactDiagramMetaTypes {\n META_NODE = 'meta-node-type',\n META_LINK = 'meta-link-type',\n}\n","import { DefaultPortModel, NodeModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeModel extends NodeModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_NODE,\n });\n\n // set up an in and out port\n\n this.addPort(\n new DefaultPortModel({\n in: true,\n name: 'in',\n })\n );\n this.addPort(\n new DefaultPortModel({\n in: false,\n name: 'out',\n })\n );\n }\n}\n","import React from 'react';\n\nexport const UnknownTypeWidget = () => {\n return
Unknown Type
;\n};\n","import { AbstractReactFactory } from '@projectstorm/react-canvas-core';\nimport { MetaNodeModel } from './MetaNodeModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport React from 'react';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaNodeFactory extends AbstractReactFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_NODE);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaNodeModel();\n }\n\n generateReactWidget(event: any): JSX.Element {\n if (this.componentsMap.has(event.model.options.shape)) {\n const ReactComponentType = this.componentsMap.get(\n event.model.options.shape\n );\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default node instead\n return ;\n }\n}\n","import { DefaultLinkModel } from '@projectstorm/react-diagrams';\nimport { ReactDiagramMetaTypes } from '../constants';\n\nexport class MetaLinkModel extends DefaultLinkModel {\n constructor(options = {}) {\n super({\n ...options,\n type: ReactDiagramMetaTypes.META_LINK,\n });\n }\n}\n","import { MetaLinkModel } from './MetaLinkModel';\nimport { UnknownTypeWidget } from '../components/UnknownTypeWidget';\nimport { ReactDiagramMetaTypes } from '../constants';\nimport React from 'react';\nimport { DefaultLinkFactory } from '@projectstorm/react-diagrams';\n\nexport class MetaLinkFactory extends DefaultLinkFactory {\n componentsMap: Map;\n\n constructor(componentsMap: Map) {\n super(ReactDiagramMetaTypes.META_LINK);\n this.componentsMap = componentsMap;\n }\n\n generateModel() {\n return new MetaLinkModel();\n }\n\n generateLinkSegment(\n model: MetaLinkModel,\n selected: boolean,\n path: string\n ): JSX.Element {\n // @ts-ignore\n if (this.componentsMap.has(model.getOptions()?.shape)) {\n const ReactComponentType = this.componentsMap.get(\n // @ts-ignore\n model.getOptions().shape\n );\n\n return (\n // @ts-ignore\n \n );\n }\n // TODO: Generate default link instead\n return ;\n }\n}\n","import { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\n\nexport function getNode(\n id: string,\n nodes: MetaNodeModel[]\n): MetaNodeModel | undefined {\n return nodes.find(n => n.getOptions().id === id);\n}\n","import { MetaLink } from '../models/MetaLink';\nimport { MetaLinkModel } from '../react-diagrams/MetaLinkModel';\nimport { MetaNodeModel } from '../react-diagrams/MetaNodeModel';\nimport { getNode } from './nodesHelper';\n\nexport function getLinkModel(\n metaLink: MetaLink,\n nodes: MetaNodeModel[]\n): MetaLinkModel | undefined {\n const link = new MetaLinkModel(Object.fromEntries(metaLink.options.options));\n const source = getNode(metaLink.getSourceId(), nodes);\n const target = getNode(metaLink.getTargetId(), nodes);\n if (source && target) {\n link.setSourcePort(source.getPort(metaLink.getSourcePortId()));\n link.setTargetPort(target.getPort(metaLink.getTargetPortId()));\n return link;\n }\n return undefined;\n}\n","const vars = {\n fontFamily: 'Inter, sans-serif',\n primaryBg: '#f1f1f1',\n textWhite: '#FFFFFF',\n chipTextColor: '#F2F2F7',\n chipBgColor: 'rgba(60, 60, 67, 0.4)',\n\n chipPrimaryTextColor: 'rgba(255, 255, 255, 0.8)',\n chipPrimaryBgColor: 'rgba(0, 122, 255, 0.6)',\n\n breadcrumbLinkColor: '#A2A2A2',\n breadcrumbTextColor: '#292929',\n\n buttonPrimaryBgColor: '4353FF',\n buttonPrimaryBgHoverColor: '#3443E1',\n buttonPrimaryDisabledBgColor: 'rgba(0, 122, 255, 0.4)',\n\n listItemActiveBg: '#007AFF',\n listSelectedTextColor: '#3C3C43',\n listBoxShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.12), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.04)',\n listBorderColor: 'rgba(0, 0, 0, 0.04)',\n\n dividerColor: 'rgba(118, 120, 125, 0.12)',\n\n dropdownBg: 'rgba(246, 246, 248, 0.8)',\n dropdownTextColor: 'rgba(60, 60, 67, 0.6)',\n\n overlayColor: 'rgba(0, 0, 0, 0.4)',\n\n progressBg: '#E5E5E5',\n progressBar: '#017AFF',\n progressShadow: 'inset 0 0 0.0625rem #E3E3E3',\n\n switchShadow:\n '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)',\n};\n\nexport default vars;\n","import React from 'react';\nimport { Box } from '@mui/system';\nimport { makeStyles } from '@mui/styles';\nimport vars from './assets/styles/variables';\nimport { Divider, List, ListItemButton, ListItemIcon } from '@mui/material';\nimport Move from './assets/svg/move.svg';\nimport Icon from './assets/svg/icon.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\n\nconst { textWhite, dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\n root: {\n zIndex: '5',\n width: '4rem',\n background: textWhite,\n boxShadow:\n '0 0 3.75rem rgba(0, 0, 0, 0.1), 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)',\n borderRadius: '2rem',\n position: 'fixed',\n left: '1rem',\n top: '50%',\n transform: 'translateY(-50%)',\n\n '&.right': {\n left: 'auto',\n right: '1rem',\n },\n\n '& .MuiList-root': {\n padding: '0.75rem',\n },\n },\n\n node: {\n margin: '0.25rem 0',\n '& .MuiDivider-root': {\n borderColor: dividerColor,\n width: 'calc(100% - 1.5rem)',\n margin: '0 auto',\n border: 'none',\n borderTop: '0.0625rem solid',\n },\n\n '& img': {\n display: 'block',\n margin: '1rem 0',\n },\n },\n}));\n\nconst Sidebar = () => {\n const classes = useStyles();\n return (\n \n \n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n\n \n \n \n \n \n \n\n \n \n \n \n \n \n \n );\n};\n\nexport default Sidebar;\n","export class Position {\n x: number;\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n}\n","import * as React from 'react';\nimport {MetaNode} from './models/MetaNode';\nimport {MetaLink} from './models/MetaLink';\nimport {ComponentsMap} from './models/ComponentsMap';\nimport createEngine, {DiagramModel} from '@projectstorm/react-diagrams';\nimport {MetaNodeFactory} from './react-diagrams/MetaNodeFactory';\nimport {MetaLinkFactory} from './react-diagrams/MetaLinkFactory';\nimport {CanvasWidget} from '@projectstorm/react-canvas-core';\nimport {MetaNodeModel} from './react-diagrams/MetaNodeModel';\nimport {getLinkModel} from './helpers/linksHelper';\nimport {makeStyles} from '@material-ui/core';\nimport Sidebar from './components/Sidebar';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#333333',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n canvasClassName,\n }: MetaDiagramProps) => {\n const classes = useStyles();\n\n // set up the diagram engine\n const engine = createEngine();\n\n engine\n .getNodeFactories()\n // @ts-ignore\n .registerFactory(new MetaNodeFactory(componentsMap.nodes));\n\n engine\n .getLinkFactories()\n // @ts-ignore\n .registerFactory(new MetaLinkFactory(componentsMap.links));\n\n // set up the diagram model\n\n const model = new DiagramModel();\n const nodes = metaNodes.map(\n mn => new MetaNodeModel(Object.fromEntries(mn.options.options))\n );\n const links = metaLinks\n .map(ml => getLinkModel(ml, nodes))\n .filter(mlm => mlm !== undefined);\n // @ts-ignore\n model.addAll(...nodes, ...links);\n\n // load model into engine\n engine.setModel(model);\n\n const containerClassName = wrapperClassName\n ? wrapperClassName\n : classes.container;\n const diagramClassName = canvasClassName\n ? canvasClassName\n : classes.canvasContainer;\n return (\n
\n \n \n
\n );\n};\n\nexport default MetaDiagram;\nexport {MetaNode, MetaLink, MetaNodeModel, ComponentsMap};\nexport {MetaLinkModel} from './react-diagrams/MetaLinkModel';\nexport {Position} from './models/Position';\n"],"names":["MetaOptions","constructor","id","name","shape","options","set","getId","get","getShape","MetaNode","position","children","MetaLink","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","ComponentsMap","nodesMap","linksMap","nodes","links","ReactDiagramMetaTypes","MetaNodeModel","NodeModel","type","META_NODE","addPort","DefaultPortModel","in","UnknownTypeWidget","React","MetaNodeFactory","AbstractReactFactory","componentsMap","generateModel","generateReactWidget","event","has","model","ReactComponentType","key","getOptions","engine","MetaLinkModel","DefaultLinkModel","META_LINK","MetaLinkFactory","DefaultLinkFactory","generateLinkSegment","selected","path","getNode","find","n","getLinkModel","metaLink","link","Object","fromEntries","source","target","setSourcePort","getPort","setTargetPort","undefined","vars","fontFamily","primaryBg","textWhite","chipTextColor","chipBgColor","chipPrimaryTextColor","chipPrimaryBgColor","breadcrumbLinkColor","breadcrumbTextColor","buttonPrimaryBgColor","buttonPrimaryBgHoverColor","buttonPrimaryDisabledBgColor","listItemActiveBg","listSelectedTextColor","listBoxShadow","listBorderColor","dividerColor","dropdownBg","dropdownTextColor","overlayColor","progressBg","progressBar","progressShadow","switchShadow","useStyles","makeStyles","root","zIndex","width","background","boxShadow","borderRadius","left","top","transform","right","padding","node","margin","borderColor","border","borderTop","display","Sidebar","classes","Box","className","List","disablePadding","component","ListItemButton","ListItemIcon","src","Buffer","Cursor","toString","alt","Move","Divider","Node","disabled","Icon","Fullscreen","Position","x","y","_","container","height","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","canvasClassName","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","diagramClassName","CanvasWidget"],"mappings":"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"} \ No newline at end of file