From bfeb59883b047813355e41e2c2886a414c210db4 Mon Sep 17 00:00:00 2001 From: vidhya-metacell Date: Fri, 22 Jul 2022 19:24:04 +0200 Subject: [PATCH] #16 Build files --- dist/components/assets/styles/variables.d.ts | 6 ++ dist/meta-diagram.cjs.development.js | 102 +++++++++++-------- 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 | 102 +++++++++++-------- dist/meta-diagram.esm.js.map | 2 +- 7 files changed, 134 insertions(+), 84 deletions(-) diff --git a/dist/components/assets/styles/variables.d.ts b/dist/components/assets/styles/variables.d.ts index abf9e97..be39e56 100644 --- a/dist/components/assets/styles/variables.d.ts +++ b/dist/components/assets/styles/variables.d.ts @@ -25,5 +25,11 @@ declare const vars: { switchShadow: string; sidebarBg: string; sidebarShadow: string; + canvasBg: string; + showPropertiesButtonBg: string; + nodeBorderColor: string; + nodePointerBg: string; + nodeButtonTextColor: string; + nodeButtonLineColor: string; }; export default vars; diff --git a/dist/meta-diagram.cjs.development.js b/dist/meta-diagram.cjs.development.js index f8be34f..66efaff 100644 --- a/dist/meta-diagram.cjs.development.js +++ b/dist/meta-diagram.cjs.development.js @@ -219,42 +219,37 @@ const vars = { switchShadow: '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)', sidebarBg: '#ffffff', sidebarShadow: `0 0 3.75rem rgba(0, 0, 0, 0.1), - 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)` + 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)`, + canvasBg: '#fff', + showPropertiesButtonBg: '#161A1E', + nodeBorderColor: '#18A0FB', + nodePointerBg: '#fff', + nodeButtonTextColor: 'rgba(255, 255, 255, 0.8)', + nodeButtonLineColor: 'rgba(255, 255, 255, 0.2)' }; var Move = "\n\n"; -var Icon = "\n\n"; +var MoveActive = "\n\n"; -var Node = "\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n"; +var Icon = "\n\n"; -var Cursor = "\n\n"; +var IconActive = "\n\n"; -var Fullscreen = "\n\n"; +var Node = "\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n"; + +var Cursor = "\n\n"; + +var CursorActive = "\n\n"; + +var Fullscreen = "\n\n"; + +var FullscreenActive = "\n\n"; const { - textWhite, dividerColor } = vars; const useStyles = /*#__PURE__*/styles.makeStyles(() => ({ - root: { - zIndex: '5', - width: '4rem', - background: textWhite, - 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': { @@ -273,17 +268,28 @@ const useStyles = /*#__PURE__*/styles.makeStyles(() => ({ const Sidebar = () => { const classes = useStyles(); + const [selected, setSelected] = React__default.useState("1"); return React__default.createElement(system.Box, { - className: `${classes.root} left` + className: "sidebar" }, React__default.createElement(material.List, { disablePadding: true, component: "nav" }, React__default.createElement(material.ListItemButton, { - selected: true - }, React__default.createElement(material.ListItemIcon, null, React__default.createElement("img", { + selected: selected === "1", + onClick: () => setSelected("1") + }, React__default.createElement(material.ListItemIcon, null, selected === "1" ? React__default.createElement("img", { + src: `data:image/svg+xml;base64,${new Buffer(CursorActive).toString('base64')}`, + alt: "icon" + }) : React__default.createElement("img", { src: `data:image/svg+xml;base64,${new Buffer(Cursor).toString('base64')}`, alt: "icon" - }))), React__default.createElement(material.ListItemButton, null, React__default.createElement(material.ListItemIcon, null, React__default.createElement("img", { + }))), React__default.createElement(material.ListItemButton, { + selected: selected === "2", + onClick: () => setSelected("2") + }, React__default.createElement(material.ListItemIcon, null, selected === "2" ? React__default.createElement("img", { + src: `data:image/svg+xml;base64,${new Buffer(MoveActive).toString('base64')}`, + alt: "move" + }) : React__default.createElement("img", { src: `data:image/svg+xml;base64,${new Buffer(Move).toString('base64')}`, alt: "move" })))), React__default.createElement(system.Box, { @@ -295,11 +301,21 @@ const Sidebar = () => { disablePadding: true, component: "nav" }, React__default.createElement(material.ListItemButton, { - disabled: true - }, React__default.createElement(material.ListItemIcon, null, React__default.createElement("img", { + selected: selected === "3", + onClick: () => setSelected("3") + }, React__default.createElement(material.ListItemIcon, null, selected === "3" ? React__default.createElement("img", { + src: `data:image/svg+xml;base64,${new Buffer(IconActive).toString('base64')}`, + alt: "icon" + }) : React__default.createElement("img", { src: `data:image/svg+xml;base64,${new Buffer(Icon).toString('base64')}`, alt: "icon" - }))), React__default.createElement(material.ListItemButton, null, React__default.createElement(material.ListItemIcon, null, React__default.createElement("img", { + }))), React__default.createElement(material.ListItemButton, { + selected: selected === "4", + onClick: () => setSelected("4") + }, React__default.createElement(material.ListItemIcon, null, selected === "4" ? React__default.createElement("img", { + src: `data:image/svg+xml;base64,${new Buffer(FullscreenActive).toString('base64')}`, + alt: "fullscreen" + }) : React__default.createElement("img", { src: `data:image/svg+xml;base64,${new Buffer(Fullscreen).toString('base64')}`, alt: "fullscreen" }))))); @@ -317,7 +333,13 @@ const applicationTheme = params => { listBoxShadow, listBorderColor, sidebarBg, - sidebarShadow + sidebarShadow, + canvasBg, + showPropertiesButtonBg, + nodeBorderColor, + nodePointerBg, + nodeButtonTextColor, + nodeButtonLineColor } = params; return { components: { @@ -356,7 +378,7 @@ const applicationTheme = params => { .canvas-widget { height: 100%; width: 100%; - background-color: #fff; + background-color: ${canvasBg}; } .node { @@ -384,14 +406,14 @@ const applicationTheme = params => { } .node-button.MuiButton-root { - background-color: #161A1E; + background-color: ${showPropertiesButtonBg}; border-radius: 1.125rem; font-weight: 600; font-size: 0.8125rem; display: flex; line-height: 1rem; letter-spacing: -0.025625rem; - color: rgba(255, 255, 255, 0.8); + color: ${nodeButtonTextColor}; margin: 0 !important; width: 9.625rem; padding: 0; @@ -405,7 +427,7 @@ const applicationTheme = params => { } .node-button.MuiButton-root:hover { - background-color: #161A1E; + background-color: ${showPropertiesButtonBg}; } .node-button .icon { @@ -426,13 +448,13 @@ const applicationTheme = params => { right: -0.625rem; top: 50%; transform: translateY(-50%); - background-color: rgba(255, 255, 255, 0.2); + background-color: ${nodeButtonLineColor}; } .nodes { width: 10rem; height: 10rem; - border: 0.09375rem solid #18A0FB; + border: 0.09375rem solid ${nodeBorderColor}; z-index: 99999; position: absolute; } @@ -440,8 +462,8 @@ const applicationTheme = params => { .node .pointer { width: 0.625rem; height: 0.625rem; - background: #FFFFFF; - border: 0.09375rem solid #18A0FB; + background: ${nodePointerBg}; + border: 0.09375rem solid ${nodeBorderColor}; border-radius: 0.125rem; position: absolute; } diff --git a/dist/meta-diagram.cjs.development.js.map b/dist/meta-diagram.cjs.development.js.map index b22f930..82703e0 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/theme.ts","../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 sidebarBg: '#ffffff',\n sidebarShadow: `0 0 3.75rem rgba(0, 0, 0, 0.1),\n 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)`,\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","import vars from './components/assets/styles/variables';\n\ntype ThemeVars = {\n [key: string]: any;\n};\n\nconst applicationTheme = (params: ThemeVars) => {\n const {\n primaryBg,\n fontFamily,\n chipTextColor,\n chipBgColor,\n textWhite,\n listItemActiveBg,\n listSelectedTextColor,\n listBoxShadow,\n listBorderColor,\n sidebarBg,\n sidebarShadow,\n } = params;\n return {\n components: {\n MuiCssBaseline: {\n styleOverrides: `\n html {\n background: ${primaryBg};\n font-family: ${fontFamily};\n }\n body {\n background-color:${primaryBg};\n font-family: ${fontFamily};\n font-size: 1rem;\n }\n .sidebar {\n z-index: 5;\n width: 4rem;\n background: ${sidebarBg};\n box-shadow: ${sidebarShadow};\n border-radius: 2rem;\n position: fixed;\n left: 1rem;\n top: 50%;\n transform: translateY(-50%);\n }\n\n .sidebar.right {\n left: auto;\n right: 1rem;\n }\n\n .sidebar .MuiList-root {\n padding: 0.75rem\n }\n\n .canvas-widget {\n height: 100%;\n width: 100%;\n background-color: #fff;\n }\n\n .node {\n border: solid 0.0625rem;\n border-radius: 50%;\n width: 10rem;\n height: 10rem;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n position: relative;\n }\n\n .node img {\n margin-bottom: 0.25rem\n }\n\n .node p {\n font-weight: 500;\n font-size: 0.8125rem;\n line-height: 1.25rem;\n letter-spacing: -0.005rem;\n margin: 0;\n }\n\n .node-button.MuiButton-root {\n background-color: #161A1E;\n border-radius: 1.125rem;\n font-weight: 600;\n font-size: 0.8125rem;\n display: flex;\n line-height: 1rem;\n letter-spacing: -0.025625rem;\n color: rgba(255, 255, 255, 0.8);\n margin: 0 !important;\n width: 9.625rem;\n padding: 0;\n height: 2.25rem;\n position: absolute;\n top: -2.625rem;\n font-family: ${fontFamily};\n text-transform: none;\n left: 50%;\n transform: translateX(-50%);\n }\n\n .node-button.MuiButton-root:hover {\n background-color: #161A1E;\n }\n\n .node-button .icon {\n width: 1rem;\n border: solid 0.0625rem;\n height: 1rem;\n border-radius: 50%;\n margin-right: 1.25rem;\n position: relative;\n }\n\n .node-button .icon:after {\n content: \"\";\n height: 1.75rem;\n width: 0.0625rem;\n display: block;\n position: absolute;\n right: -0.625rem;\n top: 50%;\n transform: translateY(-50%);\n background-color: rgba(255, 255, 255, 0.2);\n }\n\n .nodes {\n width: 10rem;\n height: 10rem;\n border: 0.09375rem solid #18A0FB;\n z-index: 99999;\n position: absolute;\n }\n\n .node .pointer {\n width: 0.625rem;\n height: 0.625rem;\n background: #FFFFFF;\n border: 0.09375rem solid #18A0FB;\n border-radius: 0.125rem;\n position: absolute;\n }\n `,\n },\n MuiList: {\n styleOverrides: {\n root: {\n '&.customSwitch': {\n padding: '0.125rem',\n background: chipTextColor,\n borderRadius: '0.5rem',\n display: 'flex',\n '& .MuiListItemButton-root': {\n padding: '0.25rem 0.75rem',\n borderRadius: '0.4375rem',\n width: '10.59375rem',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n '&:not(:last-child)': {\n marginBottom: '0',\n },\n '&.Mui-disabled': {\n opacity: 1,\n },\n '&.Mui-selected': {\n background: textWhite,\n boxShadow: listBoxShadow,\n border: `0.03125rem solid ${listBorderColor}`,\n '& .MuiTypography-root': {\n color: listSelectedTextColor,\n },\n },\n },\n '& .MuiChip-root': {\n marginLeft: '0.25rem',\n },\n '& .MuiTypography-root': {\n fontWeight: 500,\n fontSize: '0.8125rem',\n lineHeight: '1.25rem',\n letterSpacing: '-0.005rem',\n color: chipBgColor,\n margin: 0,\n },\n },\n },\n },\n },\n MuiListItemIcon: {\n styleOverrides: {\n root: {\n minWidth: 'inherit',\n },\n },\n },\n MuiListItemButton: {\n styleOverrides: {\n root: {\n padding: 0,\n width: '2.5rem',\n height: '2.5rem',\n borderRadius: '50%',\n justifyContent: 'center',\n backgroundColor: chipTextColor,\n '&:hover': {\n backgroundColor: chipTextColor,\n },\n '&:not(:last-child)': {\n marginBottom: '0.75rem',\n },\n '&.Mui-selected': {\n backgroundColor: listItemActiveBg,\n '&:hover': {\n backgroundColor: listItemActiveBg,\n },\n },\n '&.Mui-disabled': {\n opacity: 0.8,\n },\n },\n },\n },\n },\n };\n};\n\nexport default (customVariables: ThemeVars) =>\n applicationTheme({\n ...vars,\n ...customVariables,\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 * 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 '@mui/styles';\nimport Sidebar from './components/Sidebar';\nimport { ThemeProvider, createTheme } from '@mui/material/styles';\nimport CssBaseline from '@mui/material/CssBaseline';\nimport theme from './theme';\nimport { Box } from '@mui/material';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#fffff',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n metaTheme: {\n customThemeVariables: {};\n canvasClassName: string;\n };\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n metaTheme,\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\n return (\n \n \n \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","sidebarBg","sidebarShadow","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","applicationTheme","params","components","MuiCssBaseline","styleOverrides","MuiList","alignItems","justifyContent","marginBottom","opacity","color","marginLeft","fontWeight","fontSize","lineHeight","letterSpacing","MuiListItemIcon","minWidth","MuiListItemButton","height","backgroundColor","customVariables","Position","x","y","_","container","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","metaTheme","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","ThemeProvider","theme","createTheme","customThemeVariables","CssBaseline","CanvasWidget","canvasClassName"],"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/theme.ts","../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 sidebarBg: '#ffffff',\n sidebarShadow: `0 0 3.75rem rgba(0, 0, 0, 0.1),\n 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)`,\n canvasBg: '#fff',\n showPropertiesButtonBg: '#161A1E',\n nodeBorderColor: '#18A0FB',\n nodePointerBg: '#fff',\n nodeButtonTextColor: 'rgba(255, 255, 255, 0.8)',\n nodeButtonLineColor: 'rgba(255, 255, 255, 0.2)'\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 MoveActive from './assets/svg/move-active.svg';\nimport Icon from './assets/svg/icon.svg';\nimport IconActive from './assets/svg/icon-active.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport CursorActive from './assets/svg/cursor-active.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\nimport FullscreenActive from './assets/svg/fullscreen-active.svg';\n\nconst { dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\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 const [selected, setSelected] = React.useState(\"1\");\n\n return (\n \n \n setSelected(\"1\")}>\n \n {selected === \"1\" ? : }\n \n \n\n setSelected(\"2\")}>\n \n {selected === \"2\" ? : }\n\n \n \n \n\n \n \n \n \n \n\n \n setSelected(\"3\")}>\n \n {selected === \"3\" ? : }\n \n \n\n setSelected(\"4\")}>\n \n {selected === \"4\" ? : }\n \n \n \n \n );\n};\n\nexport default Sidebar;\n","import vars from './components/assets/styles/variables';\n\ntype ThemeVars = {\n [key: string]: any;\n};\n\nconst applicationTheme = (params: ThemeVars) => {\n const {\n primaryBg,\n fontFamily,\n chipTextColor,\n chipBgColor,\n textWhite,\n listItemActiveBg,\n listSelectedTextColor,\n listBoxShadow,\n listBorderColor,\n sidebarBg,\n sidebarShadow,\n canvasBg,\n showPropertiesButtonBg,\n nodeBorderColor,\n nodePointerBg,\n nodeButtonTextColor,\n nodeButtonLineColor,\n } = params;\n return {\n components: {\n MuiCssBaseline: {\n styleOverrides: `\n html {\n background: ${primaryBg};\n font-family: ${fontFamily};\n }\n body {\n background-color:${primaryBg};\n font-family: ${fontFamily};\n font-size: 1rem;\n }\n .sidebar {\n z-index: 5;\n width: 4rem;\n background: ${sidebarBg};\n box-shadow: ${sidebarShadow};\n border-radius: 2rem;\n position: fixed;\n left: 1rem;\n top: 50%;\n transform: translateY(-50%);\n }\n\n .sidebar.right {\n left: auto;\n right: 1rem;\n }\n\n .sidebar .MuiList-root {\n padding: 0.75rem\n }\n\n .canvas-widget {\n height: 100%;\n width: 100%;\n background-color: ${canvasBg};\n }\n\n .node {\n border: solid 0.0625rem;\n border-radius: 50%;\n width: 10rem;\n height: 10rem;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n position: relative;\n }\n\n .node img {\n margin-bottom: 0.25rem\n }\n\n .node p {\n font-weight: 500;\n font-size: 0.8125rem;\n line-height: 1.25rem;\n letter-spacing: -0.005rem;\n margin: 0;\n }\n\n .node-button.MuiButton-root {\n background-color: ${showPropertiesButtonBg};\n border-radius: 1.125rem;\n font-weight: 600;\n font-size: 0.8125rem;\n display: flex;\n line-height: 1rem;\n letter-spacing: -0.025625rem;\n color: ${nodeButtonTextColor};\n margin: 0 !important;\n width: 9.625rem;\n padding: 0;\n height: 2.25rem;\n position: absolute;\n top: -2.625rem;\n font-family: ${fontFamily};\n text-transform: none;\n left: 50%;\n transform: translateX(-50%);\n }\n\n .node-button.MuiButton-root:hover {\n background-color: ${showPropertiesButtonBg};\n }\n\n .node-button .icon {\n width: 1rem;\n border: solid 0.0625rem;\n height: 1rem;\n border-radius: 50%;\n margin-right: 1.25rem;\n position: relative;\n }\n\n .node-button .icon:after {\n content: \"\";\n height: 1.75rem;\n width: 0.0625rem;\n display: block;\n position: absolute;\n right: -0.625rem;\n top: 50%;\n transform: translateY(-50%);\n background-color: ${nodeButtonLineColor};\n }\n\n .nodes {\n width: 10rem;\n height: 10rem;\n border: 0.09375rem solid ${nodeBorderColor};\n z-index: 99999;\n position: absolute;\n }\n\n .node .pointer {\n width: 0.625rem;\n height: 0.625rem;\n background: ${nodePointerBg};\n border: 0.09375rem solid ${nodeBorderColor};\n border-radius: 0.125rem;\n position: absolute;\n }\n `,\n },\n MuiList: {\n styleOverrides: {\n root: {\n '&.customSwitch': {\n padding: '0.125rem',\n background: chipTextColor,\n borderRadius: '0.5rem',\n display: 'flex',\n '& .MuiListItemButton-root': {\n padding: '0.25rem 0.75rem',\n borderRadius: '0.4375rem',\n width: '10.59375rem',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n '&:not(:last-child)': {\n marginBottom: '0',\n },\n '&.Mui-disabled': {\n opacity: 1,\n },\n '&.Mui-selected': {\n background: textWhite,\n boxShadow: listBoxShadow,\n border: `0.03125rem solid ${listBorderColor}`,\n '& .MuiTypography-root': {\n color: listSelectedTextColor,\n },\n },\n },\n '& .MuiChip-root': {\n marginLeft: '0.25rem',\n },\n '& .MuiTypography-root': {\n fontWeight: 500,\n fontSize: '0.8125rem',\n lineHeight: '1.25rem',\n letterSpacing: '-0.005rem',\n color: chipBgColor,\n margin: 0,\n },\n },\n },\n },\n },\n MuiListItemIcon: {\n styleOverrides: {\n root: {\n minWidth: 'inherit',\n },\n },\n },\n MuiListItemButton: {\n styleOverrides: {\n root: {\n padding: 0,\n width: '2.5rem',\n height: '2.5rem',\n borderRadius: '50%',\n justifyContent: 'center',\n backgroundColor: chipTextColor,\n '&:hover': {\n backgroundColor: chipTextColor,\n },\n '&:not(:last-child)': {\n marginBottom: '0.75rem',\n },\n '&.Mui-selected': {\n backgroundColor: listItemActiveBg,\n '&:hover': {\n backgroundColor: listItemActiveBg,\n },\n },\n '&.Mui-disabled': {\n opacity: 0.8,\n },\n },\n },\n },\n },\n };\n};\n\nexport default (customVariables: ThemeVars) =>\n applicationTheme({\n ...vars,\n ...customVariables,\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 * 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 '@mui/styles';\nimport Sidebar from './components/Sidebar';\nimport { ThemeProvider, createTheme } from '@mui/material/styles';\nimport CssBaseline from '@mui/material/CssBaseline';\nimport theme from './theme';\nimport { Box } from '@mui/material';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#fffff',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n metaTheme: {\n customThemeVariables: {};\n canvasClassName: string;\n };\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n metaTheme,\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\n return (\n \n \n \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","sidebarBg","sidebarShadow","canvasBg","showPropertiesButtonBg","nodeBorderColor","nodePointerBg","nodeButtonTextColor","nodeButtonLineColor","useStyles","makeStyles","node","margin","borderColor","width","border","borderTop","display","Sidebar","classes","setSelected","useState","Box","className","List","disablePadding","component","ListItemButton","onClick","ListItemIcon","src","Buffer","CursorActive","toString","alt","Cursor","MoveActive","Move","Divider","Node","IconActive","Icon","FullscreenActive","Fullscreen","applicationTheme","params","components","MuiCssBaseline","styleOverrides","MuiList","root","padding","background","borderRadius","alignItems","justifyContent","marginBottom","opacity","boxShadow","color","marginLeft","fontWeight","fontSize","lineHeight","letterSpacing","MuiListItemIcon","minWidth","MuiListItemButton","height","backgroundColor","customVariables","Position","x","y","_","container","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","metaTheme","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","ThemeProvider","theme","createTheme","customThemeVariables","CssBaseline","CanvasWidget","canvasClassName"],"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 90d5858..9d3599c 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"),n=e(r),o=require("@projectstorm/react-diagrams"),i=e(o),a=require("@projectstorm/react-canvas-core"),s=require("@mui/styles"),l=require("@mui/system"),d=require("@mui/material"),m=require("@mui/material/styles"),c=e(require("@mui/material/CssBaseline"));class g{constructor(e,t,r,n){this.options=n,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 u extends o.NodeModel{constructor(e={}){super({...e,type:t.META_NODE}),this.addPort(new o.DefaultPortModel({in:!0,name:"in"})),this.addPort(new o.DefaultPortModel({in:!1,name:"out"}))}}const h=()=>n.createElement("div",null,"Unknown Type");class C extends a.AbstractReactFactory{constructor(e){super(t.META_NODE),this.componentsMap=e}generateModel(){return new u}generateReactWidget(e){if(this.componentsMap.has(e.model.options.shape)){const t=this.componentsMap.get(e.model.options.shape);return n.createElement(t,{engine:this.engine,model:e.model})}return n.createElement(h,null)}}class p extends o.DefaultLinkModel{constructor(e={}){super({...e,type:t.META_LINK})}}class f extends o.DefaultLinkFactory{constructor(e){super(t.META_LINK),this.componentsMap=e}generateModel(){return new p}generateLinkSegment(e,t,r){var o;if(this.componentsMap.has(null==(o=e.getOptions())?void 0:o.shape)){const o=this.componentsMap.get(e.getOptions().shape);return n.createElement(o,{engine:this.engine,model:e,path:r,selected:t})}return n.createElement(h,null)}}function b(e,t){return t.find(t=>t.getOptions().id===e)}const w={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)",sidebarBg:"#ffffff",sidebarShadow:"0 0 3.75rem rgba(0, 0, 0, 0.1),\n 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)"},{textWhite:x,dividerColor:v}=w,M=s.makeStyles(()=>({root:{zIndex:"5",width:"4rem",background:x,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"}}})),y=()=>{const e=M();return n.createElement(l.Box,{className:e.root+" left"},n.createElement(d.List,{disablePadding:!0,component:"nav"},n.createElement(d.ListItemButton,{selected:!0},n.createElement(d.ListItemIcon,null,n.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),n.createElement(d.ListItemButton,null,n.createElement(d.ListItemIcon,null,n.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"move"})))),n.createElement(l.Box,{className:e.node},n.createElement(d.Divider,null),n.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"}),n.createElement(d.Divider,null)),n.createElement(d.List,{disablePadding:!0,component:"nav"},n.createElement(d.ListItemButton,{disabled:!0},n.createElement(d.ListItemIcon,null,n.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),n.createElement(d.ListItemButton,null,n.createElement(d.ListItemIcon,null,n.createElement("img",{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"fullscreen"})))))},B=s.makeStyles(e=>({container:{height:"100%",width:"100%"},canvasContainer:{height:"100%",width:"100%",background:"#fffff"}}));exports.ComponentsMap=class{constructor(e,t){this.nodes=e,this.links=t}},exports.MetaLink=class{constructor(e,t,r,n,o,i,a,s){this.sourceId=n,this.sourcePortId=o,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=p,exports.MetaNode=class{constructor(e,t,r,n,o){this.children=[],o.set("position",n),this.options=new g(e,t,r,o)}},exports.MetaNodeModel=u,exports.Position=class{constructor(e,t){this.x=e,this.y=t}},exports.default=({metaNodes:e,metaLinks:t,componentsMap:n,wrapperClassName:s,metaTheme:l})=>{const g=B(),h=i();h.getNodeFactories().registerFactory(new C(n.nodes)),h.getLinkFactories().registerFactory(new f(n.links));const x=new o.DiagramModel,v=e.map(e=>new u(Object.fromEntries(e.options.options))),M=t.map(e=>function(e,t){const r=new p(Object.fromEntries(e.options.options)),n=b(e.getSourceId(),t),o=b(e.getTargetId(),t);if(n&&o)return r.setSourcePort(n.getPort(e.getSourcePortId())),r.setTargetPort(o.getPort(e.getTargetPortId())),r}(e,v)).filter(e=>void 0!==e);x.addAll(...v,...M),h.setModel(x);const E=s||g.container;return r.createElement(m.ThemeProvider,{theme:m.createTheme((L=null==l?void 0:l.customThemeVariables,(e=>{const{primaryBg:t,fontFamily:r,chipTextColor:n,chipBgColor:o,textWhite:i,listItemActiveBg:a,listSelectedTextColor:s,listBoxShadow:l,listBorderColor:d,sidebarBg:m,sidebarShadow:c}=e;return{components:{MuiCssBaseline:{styleOverrides:`\n html {\n background: ${t};\n font-family: ${r};\n }\n body {\n background-color:${t};\n font-family: ${r};\n font-size: 1rem;\n }\n .sidebar {\n z-index: 5;\n width: 4rem;\n background: ${m};\n box-shadow: ${c};\n border-radius: 2rem;\n position: fixed;\n left: 1rem;\n top: 50%;\n transform: translateY(-50%);\n }\n\n .sidebar.right {\n left: auto;\n right: 1rem;\n }\n\n .sidebar .MuiList-root {\n padding: 0.75rem\n }\n\n .canvas-widget {\n height: 100%;\n width: 100%;\n background-color: #fff;\n }\n\n .node {\n border: solid 0.0625rem;\n border-radius: 50%;\n width: 10rem;\n height: 10rem;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n position: relative;\n }\n\n .node img {\n margin-bottom: 0.25rem\n }\n\n .node p {\n font-weight: 500;\n font-size: 0.8125rem;\n line-height: 1.25rem;\n letter-spacing: -0.005rem;\n margin: 0;\n }\n\n .node-button.MuiButton-root {\n background-color: #161A1E;\n border-radius: 1.125rem;\n font-weight: 600;\n font-size: 0.8125rem;\n display: flex;\n line-height: 1rem;\n letter-spacing: -0.025625rem;\n color: rgba(255, 255, 255, 0.8);\n margin: 0 !important;\n width: 9.625rem;\n padding: 0;\n height: 2.25rem;\n position: absolute;\n top: -2.625rem;\n font-family: ${r};\n text-transform: none;\n left: 50%;\n transform: translateX(-50%);\n }\n\n .node-button.MuiButton-root:hover {\n background-color: #161A1E;\n }\n\n .node-button .icon {\n width: 1rem;\n border: solid 0.0625rem;\n height: 1rem;\n border-radius: 50%;\n margin-right: 1.25rem;\n position: relative;\n }\n\n .node-button .icon:after {\n content: "";\n height: 1.75rem;\n width: 0.0625rem;\n display: block;\n position: absolute;\n right: -0.625rem;\n top: 50%;\n transform: translateY(-50%);\n background-color: rgba(255, 255, 255, 0.2);\n }\n\n .nodes {\n width: 10rem;\n height: 10rem;\n border: 0.09375rem solid #18A0FB;\n z-index: 99999;\n position: absolute;\n }\n\n .node .pointer {\n width: 0.625rem;\n height: 0.625rem;\n background: #FFFFFF;\n border: 0.09375rem solid #18A0FB;\n border-radius: 0.125rem;\n position: absolute;\n }\n `},MuiList:{styleOverrides:{root:{"&.customSwitch":{padding:"0.125rem",background:n,borderRadius:"0.5rem",display:"flex","& .MuiListItemButton-root":{padding:"0.25rem 0.75rem",borderRadius:"0.4375rem",width:"10.59375rem",display:"flex",alignItems:"center",justifyContent:"center","&:not(:last-child)":{marginBottom:"0"},"&.Mui-disabled":{opacity:1},"&.Mui-selected":{background:i,boxShadow:l,border:"0.03125rem solid "+d,"& .MuiTypography-root":{color:s}}},"& .MuiChip-root":{marginLeft:"0.25rem"},"& .MuiTypography-root":{fontWeight:500,fontSize:"0.8125rem",lineHeight:"1.25rem",letterSpacing:"-0.005rem",color:o,margin:0}}}}},MuiListItemIcon:{styleOverrides:{root:{minWidth:"inherit"}}},MuiListItemButton:{styleOverrides:{root:{padding:0,width:"2.5rem",height:"2.5rem",borderRadius:"50%",justifyContent:"center",backgroundColor:n,"&:hover":{backgroundColor:n},"&:not(:last-child)":{marginBottom:"0.75rem"},"&.Mui-selected":{backgroundColor:a,"&:hover":{backgroundColor:a}},"&.Mui-disabled":{opacity:.8}}}}}}})({...w,...L})))},r.createElement(c,null),r.createElement(d.Box,{className:E},r.createElement(y,null),r.createElement(a.CanvasWidget,{className:"canvas-widget "+(null==l?void 0:l.canvasClassName),engine:h})));var L}; +"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t,n=require("react"),r=e(n),o=require("@projectstorm/react-diagrams"),i=e(o),s=require("@projectstorm/react-canvas-core"),a=require("@mui/styles"),l=require("@mui/system"),d=require("@mui/material"),C=require("@mui/material/styles"),m=e(require("@mui/material/CssBaseline"));class g{constructor(e,t,n,r){this.options=r,this.options.set("id",e),this.options.set("name",t),this.options.set("shape",n)}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 o.NodeModel{constructor(e={}){super({...e,type:t.META_NODE}),this.addPort(new o.DefaultPortModel({in:!0,name:"in"})),this.addPort(new o.DefaultPortModel({in:!1,name:"out"}))}}const h=()=>r.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 r.createElement(t,{engine:this.engine,model:e.model})}return r.createElement(h,null)}}class p extends o.DefaultLinkModel{constructor(e={}){super({...e,type:t.META_LINK})}}class f extends o.DefaultLinkFactory{constructor(e){super(t.META_LINK),this.componentsMap=e}generateModel(){return new p}generateLinkSegment(e,t,n){var o;if(this.componentsMap.has(null==(o=e.getOptions())?void 0:o.shape)){const o=this.componentsMap.get(e.getOptions().shape);return r.createElement(o,{engine:this.engine,model:e,path:n,selected:t})}return r.createElement(h,null)}}function w(e,t){return t.find(t=>t.getOptions().id===e)}const 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)",sidebarBg:"#ffffff",sidebarShadow:"0 0 3.75rem rgba(0, 0, 0, 0.1),\n 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)",canvasBg:"#fff",showPropertiesButtonBg:"#161A1E",nodeBorderColor:"#18A0FB",nodePointerBg:"#fff",nodeButtonTextColor:"rgba(255, 255, 255, 0.8)",nodeButtonLineColor:"rgba(255, 255, 255, 0.2)"},{dividerColor:v}=b,M=a.makeStyles(()=>({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"}}})),x=()=>{const e=M(),[t,n]=r.useState("1");return r.createElement(l.Box,{className:"sidebar"},r.createElement(d.List,{disablePadding:!0,component:"nav"},r.createElement(d.ListItemButton,{selected:"1"===t,onClick:()=>n("1")},r.createElement(d.ListItemIcon,null,r.createElement("img","1"===t?{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}:{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),r.createElement(d.ListItemButton,{selected:"2"===t,onClick:()=>n("2")},r.createElement(d.ListItemIcon,null,r.createElement("img","2"===t?{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"move"}:{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"move"})))),r.createElement(l.Box,{className:e.node},r.createElement(d.Divider,null),r.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\n').toString("base64"),alt:"node"}),r.createElement(d.Divider,null)),r.createElement(d.List,{disablePadding:!0,component:"nav"},r.createElement(d.ListItemButton,{selected:"3"===t,onClick:()=>n("3")},r.createElement(d.ListItemIcon,null,r.createElement("img","3"===t?{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}:{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"icon"}))),r.createElement(d.ListItemButton,{selected:"4"===t,onClick:()=>n("4")},r.createElement(d.ListItemIcon,null,r.createElement("img","4"===t?{src:"data:image/svg+xml;base64,"+new Buffer('\n\n').toString("base64"),alt:"fullscreen"}:{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:"#fffff"}}));exports.ComponentsMap=class{constructor(e,t){this.nodes=e,this.links=t}},exports.MetaLink=class{constructor(e,t,n,r,o,i,s,a){this.sourceId=r,this.sourcePortId=o,this.targetId=i,this.targetPortId=s,this.options=new g(e,t,n,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,n,r,o){this.children=[],o.set("position",r),this.options=new g(e,t,n,o)}},exports.MetaNodeModel=c,exports.Position=class{constructor(e,t){this.x=e,this.y=t}},exports.default=({metaNodes:e,metaLinks:t,componentsMap:r,wrapperClassName:a,metaTheme:l})=>{const g=B(),h=i();h.getNodeFactories().registerFactory(new u(r.nodes)),h.getLinkFactories().registerFactory(new f(r.links));const v=new o.DiagramModel,M=e.map(e=>new c(Object.fromEntries(e.options.options))),L=t.map(e=>function(e,t){const n=new p(Object.fromEntries(e.options.options)),r=w(e.getSourceId(),t),o=w(e.getTargetId(),t);if(r&&o)return n.setSourcePort(r.getPort(e.getSourcePortId())),n.setTargetPort(o.getPort(e.getTargetPortId())),n}(e,M)).filter(e=>void 0!==e);v.addAll(...M,...L),h.setModel(v);const V=a||g.container;return n.createElement(C.ThemeProvider,{theme:C.createTheme((y=null==l?void 0:l.customThemeVariables,(e=>{const{primaryBg:t,fontFamily:n,chipTextColor:r,chipBgColor:o,textWhite:i,listItemActiveBg:s,listSelectedTextColor:a,listBoxShadow:l,listBorderColor:d,sidebarBg:C,sidebarShadow:m,canvasBg:g,showPropertiesButtonBg:c,nodeBorderColor:h,nodePointerBg:u,nodeButtonTextColor:p,nodeButtonLineColor:f}=e;return{components:{MuiCssBaseline:{styleOverrides:`\n html {\n background: ${t};\n font-family: ${n};\n }\n body {\n background-color:${t};\n font-family: ${n};\n font-size: 1rem;\n }\n .sidebar {\n z-index: 5;\n width: 4rem;\n background: ${C};\n box-shadow: ${m};\n border-radius: 2rem;\n position: fixed;\n left: 1rem;\n top: 50%;\n transform: translateY(-50%);\n }\n\n .sidebar.right {\n left: auto;\n right: 1rem;\n }\n\n .sidebar .MuiList-root {\n padding: 0.75rem\n }\n\n .canvas-widget {\n height: 100%;\n width: 100%;\n background-color: ${g};\n }\n\n .node {\n border: solid 0.0625rem;\n border-radius: 50%;\n width: 10rem;\n height: 10rem;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n position: relative;\n }\n\n .node img {\n margin-bottom: 0.25rem\n }\n\n .node p {\n font-weight: 500;\n font-size: 0.8125rem;\n line-height: 1.25rem;\n letter-spacing: -0.005rem;\n margin: 0;\n }\n\n .node-button.MuiButton-root {\n background-color: ${c};\n border-radius: 1.125rem;\n font-weight: 600;\n font-size: 0.8125rem;\n display: flex;\n line-height: 1rem;\n letter-spacing: -0.025625rem;\n color: ${p};\n margin: 0 !important;\n width: 9.625rem;\n padding: 0;\n height: 2.25rem;\n position: absolute;\n top: -2.625rem;\n font-family: ${n};\n text-transform: none;\n left: 50%;\n transform: translateX(-50%);\n }\n\n .node-button.MuiButton-root:hover {\n background-color: ${c};\n }\n\n .node-button .icon {\n width: 1rem;\n border: solid 0.0625rem;\n height: 1rem;\n border-radius: 50%;\n margin-right: 1.25rem;\n position: relative;\n }\n\n .node-button .icon:after {\n content: "";\n height: 1.75rem;\n width: 0.0625rem;\n display: block;\n position: absolute;\n right: -0.625rem;\n top: 50%;\n transform: translateY(-50%);\n background-color: ${f};\n }\n\n .nodes {\n width: 10rem;\n height: 10rem;\n border: 0.09375rem solid ${h};\n z-index: 99999;\n position: absolute;\n }\n\n .node .pointer {\n width: 0.625rem;\n height: 0.625rem;\n background: ${u};\n border: 0.09375rem solid ${h};\n border-radius: 0.125rem;\n position: absolute;\n }\n `},MuiList:{styleOverrides:{root:{"&.customSwitch":{padding:"0.125rem",background:r,borderRadius:"0.5rem",display:"flex","& .MuiListItemButton-root":{padding:"0.25rem 0.75rem",borderRadius:"0.4375rem",width:"10.59375rem",display:"flex",alignItems:"center",justifyContent:"center","&:not(:last-child)":{marginBottom:"0"},"&.Mui-disabled":{opacity:1},"&.Mui-selected":{background:i,boxShadow:l,border:"0.03125rem solid "+d,"& .MuiTypography-root":{color:a}}},"& .MuiChip-root":{marginLeft:"0.25rem"},"& .MuiTypography-root":{fontWeight:500,fontSize:"0.8125rem",lineHeight:"1.25rem",letterSpacing:"-0.005rem",color:o,margin:0}}}}},MuiListItemIcon:{styleOverrides:{root:{minWidth:"inherit"}}},MuiListItemButton:{styleOverrides:{root:{padding:0,width:"2.5rem",height:"2.5rem",borderRadius:"50%",justifyContent:"center",backgroundColor:r,"&:hover":{backgroundColor:r},"&:not(:last-child)":{marginBottom:"0.75rem"},"&.Mui-selected":{backgroundColor:s,"&:hover":{backgroundColor:s}},"&.Mui-disabled":{opacity:.8}}}}}}})({...b,...y})))},n.createElement(m,null),n.createElement(d.Box,{className:V},n.createElement(x,null),n.createElement(s.CanvasWidget,{className:"canvas-widget "+(null==l?void 0:l.canvasClassName),engine:h})));var y}; //# 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 aa47725..9a9fac4 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/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/index.tsx","../src/models/ComponentsMap.ts","../src/models/MetaLink.ts","../src/models/MetaNode.ts","../src/models/Position.ts","../src/helpers/linksHelper.ts","../src/theme.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","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 sidebarBg: '#ffffff',\n sidebarShadow: `0 0 3.75rem rgba(0, 0, 0, 0.1),\n 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)`,\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","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 '@mui/styles';\nimport Sidebar from './components/Sidebar';\nimport { ThemeProvider, createTheme } from '@mui/material/styles';\nimport CssBaseline from '@mui/material/CssBaseline';\nimport theme from './theme';\nimport { Box } from '@mui/material';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#fffff',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n metaTheme: {\n customThemeVariables: {};\n canvasClassName: string;\n };\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n metaTheme,\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\n return (\n \n \n \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","import vars from './components/assets/styles/variables';\n\ntype ThemeVars = {\n [key: string]: any;\n};\n\nconst applicationTheme = (params: ThemeVars) => {\n const {\n primaryBg,\n fontFamily,\n chipTextColor,\n chipBgColor,\n textWhite,\n listItemActiveBg,\n listSelectedTextColor,\n listBoxShadow,\n listBorderColor,\n sidebarBg,\n sidebarShadow,\n } = params;\n return {\n components: {\n MuiCssBaseline: {\n styleOverrides: `\n html {\n background: ${primaryBg};\n font-family: ${fontFamily};\n }\n body {\n background-color:${primaryBg};\n font-family: ${fontFamily};\n font-size: 1rem;\n }\n .sidebar {\n z-index: 5;\n width: 4rem;\n background: ${sidebarBg};\n box-shadow: ${sidebarShadow};\n border-radius: 2rem;\n position: fixed;\n left: 1rem;\n top: 50%;\n transform: translateY(-50%);\n }\n\n .sidebar.right {\n left: auto;\n right: 1rem;\n }\n\n .sidebar .MuiList-root {\n padding: 0.75rem\n }\n\n .canvas-widget {\n height: 100%;\n width: 100%;\n background-color: #fff;\n }\n\n .node {\n border: solid 0.0625rem;\n border-radius: 50%;\n width: 10rem;\n height: 10rem;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n position: relative;\n }\n\n .node img {\n margin-bottom: 0.25rem\n }\n\n .node p {\n font-weight: 500;\n font-size: 0.8125rem;\n line-height: 1.25rem;\n letter-spacing: -0.005rem;\n margin: 0;\n }\n\n .node-button.MuiButton-root {\n background-color: #161A1E;\n border-radius: 1.125rem;\n font-weight: 600;\n font-size: 0.8125rem;\n display: flex;\n line-height: 1rem;\n letter-spacing: -0.025625rem;\n color: rgba(255, 255, 255, 0.8);\n margin: 0 !important;\n width: 9.625rem;\n padding: 0;\n height: 2.25rem;\n position: absolute;\n top: -2.625rem;\n font-family: ${fontFamily};\n text-transform: none;\n left: 50%;\n transform: translateX(-50%);\n }\n\n .node-button.MuiButton-root:hover {\n background-color: #161A1E;\n }\n\n .node-button .icon {\n width: 1rem;\n border: solid 0.0625rem;\n height: 1rem;\n border-radius: 50%;\n margin-right: 1.25rem;\n position: relative;\n }\n\n .node-button .icon:after {\n content: \"\";\n height: 1.75rem;\n width: 0.0625rem;\n display: block;\n position: absolute;\n right: -0.625rem;\n top: 50%;\n transform: translateY(-50%);\n background-color: rgba(255, 255, 255, 0.2);\n }\n\n .nodes {\n width: 10rem;\n height: 10rem;\n border: 0.09375rem solid #18A0FB;\n z-index: 99999;\n position: absolute;\n }\n\n .node .pointer {\n width: 0.625rem;\n height: 0.625rem;\n background: #FFFFFF;\n border: 0.09375rem solid #18A0FB;\n border-radius: 0.125rem;\n position: absolute;\n }\n `,\n },\n MuiList: {\n styleOverrides: {\n root: {\n '&.customSwitch': {\n padding: '0.125rem',\n background: chipTextColor,\n borderRadius: '0.5rem',\n display: 'flex',\n '& .MuiListItemButton-root': {\n padding: '0.25rem 0.75rem',\n borderRadius: '0.4375rem',\n width: '10.59375rem',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n '&:not(:last-child)': {\n marginBottom: '0',\n },\n '&.Mui-disabled': {\n opacity: 1,\n },\n '&.Mui-selected': {\n background: textWhite,\n boxShadow: listBoxShadow,\n border: `0.03125rem solid ${listBorderColor}`,\n '& .MuiTypography-root': {\n color: listSelectedTextColor,\n },\n },\n },\n '& .MuiChip-root': {\n marginLeft: '0.25rem',\n },\n '& .MuiTypography-root': {\n fontWeight: 500,\n fontSize: '0.8125rem',\n lineHeight: '1.25rem',\n letterSpacing: '-0.005rem',\n color: chipBgColor,\n margin: 0,\n },\n },\n },\n },\n },\n MuiListItemIcon: {\n styleOverrides: {\n root: {\n minWidth: 'inherit',\n },\n },\n },\n MuiListItemButton: {\n styleOverrides: {\n root: {\n padding: 0,\n width: '2.5rem',\n height: '2.5rem',\n borderRadius: '50%',\n justifyContent: 'center',\n backgroundColor: chipTextColor,\n '&:hover': {\n backgroundColor: chipTextColor,\n },\n '&:not(:last-child)': {\n marginBottom: '0.75rem',\n },\n '&.Mui-selected': {\n backgroundColor: listItemActiveBg,\n '&:hover': {\n backgroundColor: listItemActiveBg,\n },\n },\n '&.Mui-disabled': {\n opacity: 0.8,\n },\n },\n },\n },\n },\n };\n};\n\nexport default (customVariables: ThemeVars) =>\n applicationTheme({\n ...vars,\n ...customVariables,\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","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","sidebarBg","sidebarShadow","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","metaTheme","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","Object","fromEntries","ml","metaLink","link","source","target","setSourcePort","getPort","setTargetPort","getLinkModel","filter","mlm","undefined","addAll","setModel","containerClassName","ThemeProvider","theme","createTheme","customVariables","customThemeVariables","params","components","MuiCssBaseline","styleOverrides","MuiList","&.customSwitch","& .MuiListItemButton-root","alignItems","justifyContent","&:not(:last-child)","marginBottom","&.Mui-disabled","opacity","&.Mui-selected","& .MuiTypography-root","color","& .MuiChip-root","marginLeft","fontWeight","fontSize","lineHeight","letterSpacing","MuiListItemIcon","minWidth","MuiListItemButton","backgroundColor","&:hover","applicationTheme","CssBaseline","CanvasWidget","canvasClassName"],"mappings":"8IAAYA,yRCGCC,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,OAGtB,OAAOgB,gBAACS,GAAmBC,OAAQxB,KAAKwB,OAAQF,MAAOF,EAAME,QAG/D,OAAOR,gBAACD,eCxBCY,UAAsBC,mBACjC/B,YAAYI,EAAU,IACpBQ,MAAM,IACDR,EACHS,KAAMf,EAAsBkC,mBCDrBC,UAAwBC,qBAGnClC,YAAYsB,GACVV,MAAMd,EAAsBkC,WAC5B3B,KAAKiB,cAAgBA,EAGvBC,gBACE,OAAO,IAAIO,EAGbK,oBACER,EACAS,EACAC,SAGA,GAAIhC,KAAKiB,cAAcI,aAAIC,EAAMW,qBAANC,EAAoBpC,OAAQ,CACrD,MAAMyB,EAAqBvB,KAAKiB,cAAcd,IAE5CmB,EAAMW,aAAanC,OAGrB,OAEEgB,gBAACS,GACCC,OAAQxB,KAAKwB,OACbF,MAAOA,EACPU,KAAMA,EACND,SAAUA,IAKhB,OAAOjB,gBAACD,kBCvCIsB,EACdvC,EACAwC,GAEA,OAAOA,EAAMC,KAAKC,GAAKA,EAAEL,aAAarC,KAAOA,GCN/C,MAAM2C,EAAO,CACXC,WAAY,oBACZC,UAAW,UACXC,UAAW,UACXC,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,sBAEjBC,aAAc,4BAEdC,WAAY,2BACZC,kBAAmB,wBAEnBC,aAAc,qBAEdC,WAAY,UACZC,YAAa,UACbC,eAAgB,8BAEhBC,aACE,oFAEFC,UAAW,UACXC,kGC3BIvB,UAAEA,EAAFc,aAAaA,GAAiBjB,EAE9B2B,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,YAAa7B,EACbc,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,kBAAelE,aACdjB,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,oBC7FZpC,EAAYC,aAAWsC,KAC3BC,UAAW,CACTC,OAAQ,OACRrC,MAAO,QAETsC,gBAAiB,CACfD,OAAQ,OACRrC,MAAO,OACPC,WAAY,yCCnBd5E,YACEkH,EACAC,GAEA9G,KAAKoC,MAAQyE,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,oBJmCO,EAClBC,UAAAA,EACAC,UAAAA,EACA3G,cAAAA,EACA4G,iBAAAA,EACAC,UAAAA,MAEA,MAAMnC,EAAUzB,IAGV1C,EAASuG,IAEfvG,EACGwG,mBAEAC,gBAAgB,IAAIlH,EAAgBE,EAAcmB,QAErDZ,EACG0G,mBAEAD,gBAAgB,IAAIrG,EAAgBX,EAAc8F,QAIrD,MAAMzF,EAAQ,IAAI6G,eACZ/F,EAAQuF,EAAUS,IACtBC,GAAM,IAAIhI,EAAciI,OAAOC,YAAYF,EAAGtI,QAAQA,WAElDgH,EAAQa,EACXQ,IAAII,YKhEPC,EACArG,GAEA,MAAMsG,EAAO,IAAIjH,EAAc6G,OAAOC,YAAYE,EAAS1I,QAAQA,UAC7D4I,EAASxG,EAAQsG,EAASrB,cAAehF,GACzCwG,EAASzG,EAAQsG,EAASnB,cAAelF,GAC/C,GAAIuG,GAAUC,EAGZ,OAFAF,EAAKG,cAAcF,EAAOG,QAAQL,EAASpB,oBAC3CqB,EAAKK,cAAcH,EAAOE,QAAQL,EAASlB,oBACpCmB,ELuDIM,CAAaR,EAAIpG,IAC3B6G,OAAOC,QAAeC,IAARD,GAEjB5H,EAAM8H,UAAUhH,KAAU2E,GAG1BvF,EAAO6H,SAAS/H,GAEhB,MAAMgI,EAAqBzB,GAEvBlC,EAAQe,UAEZ,OACE5F,gBAACyI,iBAAcC,MAAOC,eMoJVC,QNpJ4B5B,SAAAA,EAAW6B,qBM7E7BC,CAAAA,IACxB,MAAMnH,UACJA,EADID,WAEJA,EAFIG,cAGJA,EAHIC,YAIJA,EAJIF,UAKJA,EALIU,iBAMJA,EANIC,sBAOJA,EAPIC,cAQJA,EARIC,gBASJA,EATIS,UAUJA,EAVIC,cAWJA,GACE2F,EACJ,MAAO,CACLC,WAAY,CACVC,eAAgB,CACdC,8DAEkBtH,gCACCD,mEAGIC,gCACJD,mJAMDwB,+BACAC,8lDA8DCzB,kwCAiDrBwH,QAAS,CACPD,eAAgB,CACd3F,KAAM,CACJ6F,iBAAkB,CAChBhF,QAAS,WACTV,WAAY5B,EACZ8B,aAAc,SACdgB,QAAS,OACTyE,4BAA6B,CAC3BjF,QAAS,kBACTR,aAAc,YACdH,MAAO,cACPmB,QAAS,OACT0E,WAAY,SACZC,eAAgB,SAChBC,qBAAsB,CACpBC,aAAc,KAEhBC,iBAAkB,CAChBC,QAAS,GAEXC,iBAAkB,CAChBlG,WAAY7B,EACZ8B,UAAWlB,EACXgC,2BAA4B/B,EAC5BmH,wBAAyB,CACvBC,MAAOtH,KAIbuH,kBAAmB,CACjBC,WAAY,WAEdH,wBAAyB,CACvBI,WAAY,IACZC,SAAU,YACVC,WAAY,UACZC,cAAe,YACfN,MAAO/H,EACPuC,OAAQ,OAMlB+F,gBAAiB,CACfnB,eAAgB,CACd3F,KAAM,CACJ+G,SAAU,aAIhBC,kBAAmB,CACjBrB,eAAgB,CACd3F,KAAM,CACJa,QAAS,EACTX,MAAO,SACPqC,OAAQ,SACRlC,aAAc,MACd2F,eAAgB,SAChBiB,gBAAiB1I,EACjB2I,UAAW,CACTD,gBAAiB1I,GAEnB0H,qBAAsB,CACpBC,aAAc,WAEhBG,iBAAkB,CAChBY,gBAAiBjI,EACjBkI,UAAW,CACTD,gBAAiBjI,IAGrBmH,iBAAkB,CAChBC,QAAS,UAUrBe,CAAiB,IACZhJ,KACAmH,ONtJD5I,gBAAC0K,QACD1K,gBAAC8E,OAAIC,UAAWyD,GACdxI,gBAAC4E,QACD5E,gBAAC2K,gBACC5F,kCAA4BiC,SAAAA,EAAW4D,iBACvClK,OAAQA,UM8IFkI"} \ 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/assets/styles/variables.ts","../src/components/Sidebar.tsx","../src/index.tsx","../src/models/ComponentsMap.ts","../src/models/MetaLink.ts","../src/models/MetaNode.ts","../src/models/Position.ts","../src/helpers/linksHelper.ts","../src/theme.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","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 sidebarBg: '#ffffff',\n sidebarShadow: `0 0 3.75rem rgba(0, 0, 0, 0.1),\n 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)`,\n canvasBg: '#fff',\n showPropertiesButtonBg: '#161A1E',\n nodeBorderColor: '#18A0FB',\n nodePointerBg: '#fff',\n nodeButtonTextColor: 'rgba(255, 255, 255, 0.8)',\n nodeButtonLineColor: 'rgba(255, 255, 255, 0.2)'\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 MoveActive from './assets/svg/move-active.svg';\nimport Icon from './assets/svg/icon.svg';\nimport IconActive from './assets/svg/icon-active.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport CursorActive from './assets/svg/cursor-active.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\nimport FullscreenActive from './assets/svg/fullscreen-active.svg';\n\nconst { dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\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 const [selected, setSelected] = React.useState(\"1\");\n\n return (\n \n \n setSelected(\"1\")}>\n \n {selected === \"1\" ? : }\n \n \n\n setSelected(\"2\")}>\n \n {selected === \"2\" ? : }\n\n \n \n \n\n \n \n \n \n \n\n \n setSelected(\"3\")}>\n \n {selected === \"3\" ? : }\n \n \n\n setSelected(\"4\")}>\n \n {selected === \"4\" ? : }\n \n \n \n \n );\n};\n\nexport default Sidebar;\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 '@mui/styles';\nimport Sidebar from './components/Sidebar';\nimport { ThemeProvider, createTheme } from '@mui/material/styles';\nimport CssBaseline from '@mui/material/CssBaseline';\nimport theme from './theme';\nimport { Box } from '@mui/material';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#fffff',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n metaTheme: {\n customThemeVariables: {};\n canvasClassName: string;\n };\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n metaTheme,\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\n return (\n \n \n \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","import vars from './components/assets/styles/variables';\n\ntype ThemeVars = {\n [key: string]: any;\n};\n\nconst applicationTheme = (params: ThemeVars) => {\n const {\n primaryBg,\n fontFamily,\n chipTextColor,\n chipBgColor,\n textWhite,\n listItemActiveBg,\n listSelectedTextColor,\n listBoxShadow,\n listBorderColor,\n sidebarBg,\n sidebarShadow,\n canvasBg,\n showPropertiesButtonBg,\n nodeBorderColor,\n nodePointerBg,\n nodeButtonTextColor,\n nodeButtonLineColor,\n } = params;\n return {\n components: {\n MuiCssBaseline: {\n styleOverrides: `\n html {\n background: ${primaryBg};\n font-family: ${fontFamily};\n }\n body {\n background-color:${primaryBg};\n font-family: ${fontFamily};\n font-size: 1rem;\n }\n .sidebar {\n z-index: 5;\n width: 4rem;\n background: ${sidebarBg};\n box-shadow: ${sidebarShadow};\n border-radius: 2rem;\n position: fixed;\n left: 1rem;\n top: 50%;\n transform: translateY(-50%);\n }\n\n .sidebar.right {\n left: auto;\n right: 1rem;\n }\n\n .sidebar .MuiList-root {\n padding: 0.75rem\n }\n\n .canvas-widget {\n height: 100%;\n width: 100%;\n background-color: ${canvasBg};\n }\n\n .node {\n border: solid 0.0625rem;\n border-radius: 50%;\n width: 10rem;\n height: 10rem;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n position: relative;\n }\n\n .node img {\n margin-bottom: 0.25rem\n }\n\n .node p {\n font-weight: 500;\n font-size: 0.8125rem;\n line-height: 1.25rem;\n letter-spacing: -0.005rem;\n margin: 0;\n }\n\n .node-button.MuiButton-root {\n background-color: ${showPropertiesButtonBg};\n border-radius: 1.125rem;\n font-weight: 600;\n font-size: 0.8125rem;\n display: flex;\n line-height: 1rem;\n letter-spacing: -0.025625rem;\n color: ${nodeButtonTextColor};\n margin: 0 !important;\n width: 9.625rem;\n padding: 0;\n height: 2.25rem;\n position: absolute;\n top: -2.625rem;\n font-family: ${fontFamily};\n text-transform: none;\n left: 50%;\n transform: translateX(-50%);\n }\n\n .node-button.MuiButton-root:hover {\n background-color: ${showPropertiesButtonBg};\n }\n\n .node-button .icon {\n width: 1rem;\n border: solid 0.0625rem;\n height: 1rem;\n border-radius: 50%;\n margin-right: 1.25rem;\n position: relative;\n }\n\n .node-button .icon:after {\n content: \"\";\n height: 1.75rem;\n width: 0.0625rem;\n display: block;\n position: absolute;\n right: -0.625rem;\n top: 50%;\n transform: translateY(-50%);\n background-color: ${nodeButtonLineColor};\n }\n\n .nodes {\n width: 10rem;\n height: 10rem;\n border: 0.09375rem solid ${nodeBorderColor};\n z-index: 99999;\n position: absolute;\n }\n\n .node .pointer {\n width: 0.625rem;\n height: 0.625rem;\n background: ${nodePointerBg};\n border: 0.09375rem solid ${nodeBorderColor};\n border-radius: 0.125rem;\n position: absolute;\n }\n `,\n },\n MuiList: {\n styleOverrides: {\n root: {\n '&.customSwitch': {\n padding: '0.125rem',\n background: chipTextColor,\n borderRadius: '0.5rem',\n display: 'flex',\n '& .MuiListItemButton-root': {\n padding: '0.25rem 0.75rem',\n borderRadius: '0.4375rem',\n width: '10.59375rem',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n '&:not(:last-child)': {\n marginBottom: '0',\n },\n '&.Mui-disabled': {\n opacity: 1,\n },\n '&.Mui-selected': {\n background: textWhite,\n boxShadow: listBoxShadow,\n border: `0.03125rem solid ${listBorderColor}`,\n '& .MuiTypography-root': {\n color: listSelectedTextColor,\n },\n },\n },\n '& .MuiChip-root': {\n marginLeft: '0.25rem',\n },\n '& .MuiTypography-root': {\n fontWeight: 500,\n fontSize: '0.8125rem',\n lineHeight: '1.25rem',\n letterSpacing: '-0.005rem',\n color: chipBgColor,\n margin: 0,\n },\n },\n },\n },\n },\n MuiListItemIcon: {\n styleOverrides: {\n root: {\n minWidth: 'inherit',\n },\n },\n },\n MuiListItemButton: {\n styleOverrides: {\n root: {\n padding: 0,\n width: '2.5rem',\n height: '2.5rem',\n borderRadius: '50%',\n justifyContent: 'center',\n backgroundColor: chipTextColor,\n '&:hover': {\n backgroundColor: chipTextColor,\n },\n '&:not(:last-child)': {\n marginBottom: '0.75rem',\n },\n '&.Mui-selected': {\n backgroundColor: listItemActiveBg,\n '&:hover': {\n backgroundColor: listItemActiveBg,\n },\n },\n '&.Mui-disabled': {\n opacity: 0.8,\n },\n },\n },\n },\n },\n };\n};\n\nexport default (customVariables: ThemeVars) =>\n applicationTheme({\n ...vars,\n ...customVariables,\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","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","sidebarBg","sidebarShadow","canvasBg","showPropertiesButtonBg","nodeBorderColor","nodePointerBg","nodeButtonTextColor","nodeButtonLineColor","useStyles","makeStyles","node","margin","& .MuiDivider-root","borderColor","width","border","borderTop","& img","display","Sidebar","classes","setSelected","useState","Box","className","List","disablePadding","component","ListItemButton","onClick","ListItemIcon","src","Buffer","toString","alt","Divider","_","container","height","canvasContainer","background","nodesMap","linksMap","links","sourceId","sourcePortId","targetId","targetPortId","getSourceId","getSourcePortId","getTargetId","getTargetPortId","position","children","x","y","metaNodes","metaLinks","wrapperClassName","metaTheme","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","Object","fromEntries","ml","metaLink","link","source","target","setSourcePort","getPort","setTargetPort","getLinkModel","filter","mlm","undefined","addAll","setModel","containerClassName","ThemeProvider","theme","createTheme","customVariables","customThemeVariables","params","components","MuiCssBaseline","styleOverrides","MuiList","root","&.customSwitch","padding","borderRadius","& .MuiListItemButton-root","alignItems","justifyContent","&:not(:last-child)","marginBottom","&.Mui-disabled","opacity","&.Mui-selected","boxShadow","& .MuiTypography-root","color","& .MuiChip-root","marginLeft","fontWeight","fontSize","lineHeight","letterSpacing","MuiListItemIcon","minWidth","MuiListItemButton","backgroundColor","&:hover","applicationTheme","CssBaseline","CanvasWidget","canvasClassName"],"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 6959ae2..b6eb2e7 100644 --- a/dist/meta-diagram.esm.js +++ b/dist/meta-diagram.esm.js @@ -211,42 +211,37 @@ const vars = { switchShadow: '0 0.1875rem 0.5rem rgba(0, 0, 0, 0.15), 0 0.1875rem 0.0625rem rgba(0, 0, 0, 0.06)', sidebarBg: '#ffffff', sidebarShadow: `0 0 3.75rem rgba(0, 0, 0, 0.1), - 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)` + 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)`, + canvasBg: '#fff', + showPropertiesButtonBg: '#161A1E', + nodeBorderColor: '#18A0FB', + nodePointerBg: '#fff', + nodeButtonTextColor: 'rgba(255, 255, 255, 0.8)', + nodeButtonLineColor: 'rgba(255, 255, 255, 0.2)' }; var Move = "\n\n"; -var Icon = "\n\n"; +var MoveActive = "\n\n"; -var Node = "\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n"; +var Icon = "\n\n"; -var Cursor = "\n\n"; +var IconActive = "\n\n"; -var Fullscreen = "\n\n"; +var Node = "\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n"; + +var Cursor = "\n\n"; + +var CursorActive = "\n\n"; + +var Fullscreen = "\n\n"; + +var FullscreenActive = "\n\n"; const { - textWhite, dividerColor } = vars; const useStyles = /*#__PURE__*/makeStyles(() => ({ - root: { - zIndex: '5', - width: '4rem', - background: textWhite, - 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': { @@ -265,17 +260,28 @@ const useStyles = /*#__PURE__*/makeStyles(() => ({ const Sidebar = () => { const classes = useStyles(); + const [selected, setSelected] = React__default.useState("1"); return React__default.createElement(Box, { - className: `${classes.root} left` + className: "sidebar" }, React__default.createElement(List, { disablePadding: true, component: "nav" }, React__default.createElement(ListItemButton, { - selected: true - }, React__default.createElement(ListItemIcon, null, React__default.createElement("img", { + selected: selected === "1", + onClick: () => setSelected("1") + }, React__default.createElement(ListItemIcon, null, selected === "1" ? React__default.createElement("img", { + src: `data:image/svg+xml;base64,${new Buffer(CursorActive).toString('base64')}`, + alt: "icon" + }) : React__default.createElement("img", { src: `data:image/svg+xml;base64,${new Buffer(Cursor).toString('base64')}`, alt: "icon" - }))), React__default.createElement(ListItemButton, null, React__default.createElement(ListItemIcon, null, React__default.createElement("img", { + }))), React__default.createElement(ListItemButton, { + selected: selected === "2", + onClick: () => setSelected("2") + }, React__default.createElement(ListItemIcon, null, selected === "2" ? React__default.createElement("img", { + src: `data:image/svg+xml;base64,${new Buffer(MoveActive).toString('base64')}`, + alt: "move" + }) : React__default.createElement("img", { src: `data:image/svg+xml;base64,${new Buffer(Move).toString('base64')}`, alt: "move" })))), React__default.createElement(Box, { @@ -287,11 +293,21 @@ const Sidebar = () => { disablePadding: true, component: "nav" }, React__default.createElement(ListItemButton, { - disabled: true - }, React__default.createElement(ListItemIcon, null, React__default.createElement("img", { + selected: selected === "3", + onClick: () => setSelected("3") + }, React__default.createElement(ListItemIcon, null, selected === "3" ? React__default.createElement("img", { + src: `data:image/svg+xml;base64,${new Buffer(IconActive).toString('base64')}`, + alt: "icon" + }) : React__default.createElement("img", { src: `data:image/svg+xml;base64,${new Buffer(Icon).toString('base64')}`, alt: "icon" - }))), React__default.createElement(ListItemButton, null, React__default.createElement(ListItemIcon, null, React__default.createElement("img", { + }))), React__default.createElement(ListItemButton, { + selected: selected === "4", + onClick: () => setSelected("4") + }, React__default.createElement(ListItemIcon, null, selected === "4" ? React__default.createElement("img", { + src: `data:image/svg+xml;base64,${new Buffer(FullscreenActive).toString('base64')}`, + alt: "fullscreen" + }) : React__default.createElement("img", { src: `data:image/svg+xml;base64,${new Buffer(Fullscreen).toString('base64')}`, alt: "fullscreen" }))))); @@ -309,7 +325,13 @@ const applicationTheme = params => { listBoxShadow, listBorderColor, sidebarBg, - sidebarShadow + sidebarShadow, + canvasBg, + showPropertiesButtonBg, + nodeBorderColor, + nodePointerBg, + nodeButtonTextColor, + nodeButtonLineColor } = params; return { components: { @@ -348,7 +370,7 @@ const applicationTheme = params => { .canvas-widget { height: 100%; width: 100%; - background-color: #fff; + background-color: ${canvasBg}; } .node { @@ -376,14 +398,14 @@ const applicationTheme = params => { } .node-button.MuiButton-root { - background-color: #161A1E; + background-color: ${showPropertiesButtonBg}; border-radius: 1.125rem; font-weight: 600; font-size: 0.8125rem; display: flex; line-height: 1rem; letter-spacing: -0.025625rem; - color: rgba(255, 255, 255, 0.8); + color: ${nodeButtonTextColor}; margin: 0 !important; width: 9.625rem; padding: 0; @@ -397,7 +419,7 @@ const applicationTheme = params => { } .node-button.MuiButton-root:hover { - background-color: #161A1E; + background-color: ${showPropertiesButtonBg}; } .node-button .icon { @@ -418,13 +440,13 @@ const applicationTheme = params => { right: -0.625rem; top: 50%; transform: translateY(-50%); - background-color: rgba(255, 255, 255, 0.2); + background-color: ${nodeButtonLineColor}; } .nodes { width: 10rem; height: 10rem; - border: 0.09375rem solid #18A0FB; + border: 0.09375rem solid ${nodeBorderColor}; z-index: 99999; position: absolute; } @@ -432,8 +454,8 @@ const applicationTheme = params => { .node .pointer { width: 0.625rem; height: 0.625rem; - background: #FFFFFF; - border: 0.09375rem solid #18A0FB; + background: ${nodePointerBg}; + border: 0.09375rem solid ${nodeBorderColor}; border-radius: 0.125rem; position: absolute; } diff --git a/dist/meta-diagram.esm.js.map b/dist/meta-diagram.esm.js.map index a7d9841..3cb94c9 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/theme.ts","../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 sidebarBg: '#ffffff',\n sidebarShadow: `0 0 3.75rem rgba(0, 0, 0, 0.1),\n 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)`,\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","import vars from './components/assets/styles/variables';\n\ntype ThemeVars = {\n [key: string]: any;\n};\n\nconst applicationTheme = (params: ThemeVars) => {\n const {\n primaryBg,\n fontFamily,\n chipTextColor,\n chipBgColor,\n textWhite,\n listItemActiveBg,\n listSelectedTextColor,\n listBoxShadow,\n listBorderColor,\n sidebarBg,\n sidebarShadow,\n } = params;\n return {\n components: {\n MuiCssBaseline: {\n styleOverrides: `\n html {\n background: ${primaryBg};\n font-family: ${fontFamily};\n }\n body {\n background-color:${primaryBg};\n font-family: ${fontFamily};\n font-size: 1rem;\n }\n .sidebar {\n z-index: 5;\n width: 4rem;\n background: ${sidebarBg};\n box-shadow: ${sidebarShadow};\n border-radius: 2rem;\n position: fixed;\n left: 1rem;\n top: 50%;\n transform: translateY(-50%);\n }\n\n .sidebar.right {\n left: auto;\n right: 1rem;\n }\n\n .sidebar .MuiList-root {\n padding: 0.75rem\n }\n\n .canvas-widget {\n height: 100%;\n width: 100%;\n background-color: #fff;\n }\n\n .node {\n border: solid 0.0625rem;\n border-radius: 50%;\n width: 10rem;\n height: 10rem;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n position: relative;\n }\n\n .node img {\n margin-bottom: 0.25rem\n }\n\n .node p {\n font-weight: 500;\n font-size: 0.8125rem;\n line-height: 1.25rem;\n letter-spacing: -0.005rem;\n margin: 0;\n }\n\n .node-button.MuiButton-root {\n background-color: #161A1E;\n border-radius: 1.125rem;\n font-weight: 600;\n font-size: 0.8125rem;\n display: flex;\n line-height: 1rem;\n letter-spacing: -0.025625rem;\n color: rgba(255, 255, 255, 0.8);\n margin: 0 !important;\n width: 9.625rem;\n padding: 0;\n height: 2.25rem;\n position: absolute;\n top: -2.625rem;\n font-family: ${fontFamily};\n text-transform: none;\n left: 50%;\n transform: translateX(-50%);\n }\n\n .node-button.MuiButton-root:hover {\n background-color: #161A1E;\n }\n\n .node-button .icon {\n width: 1rem;\n border: solid 0.0625rem;\n height: 1rem;\n border-radius: 50%;\n margin-right: 1.25rem;\n position: relative;\n }\n\n .node-button .icon:after {\n content: \"\";\n height: 1.75rem;\n width: 0.0625rem;\n display: block;\n position: absolute;\n right: -0.625rem;\n top: 50%;\n transform: translateY(-50%);\n background-color: rgba(255, 255, 255, 0.2);\n }\n\n .nodes {\n width: 10rem;\n height: 10rem;\n border: 0.09375rem solid #18A0FB;\n z-index: 99999;\n position: absolute;\n }\n\n .node .pointer {\n width: 0.625rem;\n height: 0.625rem;\n background: #FFFFFF;\n border: 0.09375rem solid #18A0FB;\n border-radius: 0.125rem;\n position: absolute;\n }\n `,\n },\n MuiList: {\n styleOverrides: {\n root: {\n '&.customSwitch': {\n padding: '0.125rem',\n background: chipTextColor,\n borderRadius: '0.5rem',\n display: 'flex',\n '& .MuiListItemButton-root': {\n padding: '0.25rem 0.75rem',\n borderRadius: '0.4375rem',\n width: '10.59375rem',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n '&:not(:last-child)': {\n marginBottom: '0',\n },\n '&.Mui-disabled': {\n opacity: 1,\n },\n '&.Mui-selected': {\n background: textWhite,\n boxShadow: listBoxShadow,\n border: `0.03125rem solid ${listBorderColor}`,\n '& .MuiTypography-root': {\n color: listSelectedTextColor,\n },\n },\n },\n '& .MuiChip-root': {\n marginLeft: '0.25rem',\n },\n '& .MuiTypography-root': {\n fontWeight: 500,\n fontSize: '0.8125rem',\n lineHeight: '1.25rem',\n letterSpacing: '-0.005rem',\n color: chipBgColor,\n margin: 0,\n },\n },\n },\n },\n },\n MuiListItemIcon: {\n styleOverrides: {\n root: {\n minWidth: 'inherit',\n },\n },\n },\n MuiListItemButton: {\n styleOverrides: {\n root: {\n padding: 0,\n width: '2.5rem',\n height: '2.5rem',\n borderRadius: '50%',\n justifyContent: 'center',\n backgroundColor: chipTextColor,\n '&:hover': {\n backgroundColor: chipTextColor,\n },\n '&:not(:last-child)': {\n marginBottom: '0.75rem',\n },\n '&.Mui-selected': {\n backgroundColor: listItemActiveBg,\n '&:hover': {\n backgroundColor: listItemActiveBg,\n },\n },\n '&.Mui-disabled': {\n opacity: 0.8,\n },\n },\n },\n },\n },\n };\n};\n\nexport default (customVariables: ThemeVars) =>\n applicationTheme({\n ...vars,\n ...customVariables,\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 * 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 '@mui/styles';\nimport Sidebar from './components/Sidebar';\nimport { ThemeProvider, createTheme } from '@mui/material/styles';\nimport CssBaseline from '@mui/material/CssBaseline';\nimport theme from './theme';\nimport { Box } from '@mui/material';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#fffff',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n metaTheme: {\n customThemeVariables: {};\n canvasClassName: string;\n };\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n metaTheme,\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\n return (\n \n \n \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","sidebarBg","sidebarShadow","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","applicationTheme","params","components","MuiCssBaseline","styleOverrides","MuiList","alignItems","justifyContent","marginBottom","opacity","color","marginLeft","fontWeight","fontSize","lineHeight","letterSpacing","MuiListItemIcon","minWidth","MuiListItemButton","height","backgroundColor","customVariables","Position","x","y","_","container","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","metaTheme","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","ThemeProvider","theme","createTheme","customThemeVariables","CssBaseline","CanvasWidget","canvasClassName"],"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/theme.ts","../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 sidebarBg: '#ffffff',\n sidebarShadow: `0 0 3.75rem rgba(0, 0, 0, 0.1),\n 0 0.5rem 2.5rem -0.625rem rgba(0, 0, 0, 0.1)`,\n canvasBg: '#fff',\n showPropertiesButtonBg: '#161A1E',\n nodeBorderColor: '#18A0FB',\n nodePointerBg: '#fff',\n nodeButtonTextColor: 'rgba(255, 255, 255, 0.8)',\n nodeButtonLineColor: 'rgba(255, 255, 255, 0.2)'\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 MoveActive from './assets/svg/move-active.svg';\nimport Icon from './assets/svg/icon.svg';\nimport IconActive from './assets/svg/icon-active.svg';\nimport Node from './assets/svg/node.svg';\nimport Cursor from './assets/svg/cursor.svg';\nimport CursorActive from './assets/svg/cursor-active.svg';\nimport Fullscreen from './assets/svg/fullscreen.svg';\nimport FullscreenActive from './assets/svg/fullscreen-active.svg';\n\nconst { dividerColor } = vars;\n\nconst useStyles = makeStyles(() => ({\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 const [selected, setSelected] = React.useState(\"1\");\n\n return (\n \n \n setSelected(\"1\")}>\n \n {selected === \"1\" ? : }\n \n \n\n setSelected(\"2\")}>\n \n {selected === \"2\" ? : }\n\n \n \n \n\n \n \n \n \n \n\n \n setSelected(\"3\")}>\n \n {selected === \"3\" ? : }\n \n \n\n setSelected(\"4\")}>\n \n {selected === \"4\" ? : }\n \n \n \n \n );\n};\n\nexport default Sidebar;\n","import vars from './components/assets/styles/variables';\n\ntype ThemeVars = {\n [key: string]: any;\n};\n\nconst applicationTheme = (params: ThemeVars) => {\n const {\n primaryBg,\n fontFamily,\n chipTextColor,\n chipBgColor,\n textWhite,\n listItemActiveBg,\n listSelectedTextColor,\n listBoxShadow,\n listBorderColor,\n sidebarBg,\n sidebarShadow,\n canvasBg,\n showPropertiesButtonBg,\n nodeBorderColor,\n nodePointerBg,\n nodeButtonTextColor,\n nodeButtonLineColor,\n } = params;\n return {\n components: {\n MuiCssBaseline: {\n styleOverrides: `\n html {\n background: ${primaryBg};\n font-family: ${fontFamily};\n }\n body {\n background-color:${primaryBg};\n font-family: ${fontFamily};\n font-size: 1rem;\n }\n .sidebar {\n z-index: 5;\n width: 4rem;\n background: ${sidebarBg};\n box-shadow: ${sidebarShadow};\n border-radius: 2rem;\n position: fixed;\n left: 1rem;\n top: 50%;\n transform: translateY(-50%);\n }\n\n .sidebar.right {\n left: auto;\n right: 1rem;\n }\n\n .sidebar .MuiList-root {\n padding: 0.75rem\n }\n\n .canvas-widget {\n height: 100%;\n width: 100%;\n background-color: ${canvasBg};\n }\n\n .node {\n border: solid 0.0625rem;\n border-radius: 50%;\n width: 10rem;\n height: 10rem;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n position: relative;\n }\n\n .node img {\n margin-bottom: 0.25rem\n }\n\n .node p {\n font-weight: 500;\n font-size: 0.8125rem;\n line-height: 1.25rem;\n letter-spacing: -0.005rem;\n margin: 0;\n }\n\n .node-button.MuiButton-root {\n background-color: ${showPropertiesButtonBg};\n border-radius: 1.125rem;\n font-weight: 600;\n font-size: 0.8125rem;\n display: flex;\n line-height: 1rem;\n letter-spacing: -0.025625rem;\n color: ${nodeButtonTextColor};\n margin: 0 !important;\n width: 9.625rem;\n padding: 0;\n height: 2.25rem;\n position: absolute;\n top: -2.625rem;\n font-family: ${fontFamily};\n text-transform: none;\n left: 50%;\n transform: translateX(-50%);\n }\n\n .node-button.MuiButton-root:hover {\n background-color: ${showPropertiesButtonBg};\n }\n\n .node-button .icon {\n width: 1rem;\n border: solid 0.0625rem;\n height: 1rem;\n border-radius: 50%;\n margin-right: 1.25rem;\n position: relative;\n }\n\n .node-button .icon:after {\n content: \"\";\n height: 1.75rem;\n width: 0.0625rem;\n display: block;\n position: absolute;\n right: -0.625rem;\n top: 50%;\n transform: translateY(-50%);\n background-color: ${nodeButtonLineColor};\n }\n\n .nodes {\n width: 10rem;\n height: 10rem;\n border: 0.09375rem solid ${nodeBorderColor};\n z-index: 99999;\n position: absolute;\n }\n\n .node .pointer {\n width: 0.625rem;\n height: 0.625rem;\n background: ${nodePointerBg};\n border: 0.09375rem solid ${nodeBorderColor};\n border-radius: 0.125rem;\n position: absolute;\n }\n `,\n },\n MuiList: {\n styleOverrides: {\n root: {\n '&.customSwitch': {\n padding: '0.125rem',\n background: chipTextColor,\n borderRadius: '0.5rem',\n display: 'flex',\n '& .MuiListItemButton-root': {\n padding: '0.25rem 0.75rem',\n borderRadius: '0.4375rem',\n width: '10.59375rem',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n '&:not(:last-child)': {\n marginBottom: '0',\n },\n '&.Mui-disabled': {\n opacity: 1,\n },\n '&.Mui-selected': {\n background: textWhite,\n boxShadow: listBoxShadow,\n border: `0.03125rem solid ${listBorderColor}`,\n '& .MuiTypography-root': {\n color: listSelectedTextColor,\n },\n },\n },\n '& .MuiChip-root': {\n marginLeft: '0.25rem',\n },\n '& .MuiTypography-root': {\n fontWeight: 500,\n fontSize: '0.8125rem',\n lineHeight: '1.25rem',\n letterSpacing: '-0.005rem',\n color: chipBgColor,\n margin: 0,\n },\n },\n },\n },\n },\n MuiListItemIcon: {\n styleOverrides: {\n root: {\n minWidth: 'inherit',\n },\n },\n },\n MuiListItemButton: {\n styleOverrides: {\n root: {\n padding: 0,\n width: '2.5rem',\n height: '2.5rem',\n borderRadius: '50%',\n justifyContent: 'center',\n backgroundColor: chipTextColor,\n '&:hover': {\n backgroundColor: chipTextColor,\n },\n '&:not(:last-child)': {\n marginBottom: '0.75rem',\n },\n '&.Mui-selected': {\n backgroundColor: listItemActiveBg,\n '&:hover': {\n backgroundColor: listItemActiveBg,\n },\n },\n '&.Mui-disabled': {\n opacity: 0.8,\n },\n },\n },\n },\n },\n };\n};\n\nexport default (customVariables: ThemeVars) =>\n applicationTheme({\n ...vars,\n ...customVariables,\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 * 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 '@mui/styles';\nimport Sidebar from './components/Sidebar';\nimport { ThemeProvider, createTheme } from '@mui/material/styles';\nimport CssBaseline from '@mui/material/CssBaseline';\nimport theme from './theme';\nimport { Box } from '@mui/material';\n\nconst useStyles = makeStyles(_ => ({\n container: {\n height: '100%',\n width: '100%',\n },\n canvasContainer: {\n height: '100%',\n width: '100%',\n background: '#fffff',\n },\n}));\n\ninterface MetaDiagramProps {\n metaNodes: MetaNode[];\n metaLinks: MetaLink[];\n componentsMap: ComponentsMap;\n wrapperClassName?: string;\n canvasClassName?: string;\n metaTheme: {\n customThemeVariables: {};\n canvasClassName: string;\n };\n}\n\nconst MetaDiagram = ({\n metaNodes,\n metaLinks,\n componentsMap,\n wrapperClassName,\n metaTheme,\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\n return (\n \n \n \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","sidebarBg","sidebarShadow","canvasBg","showPropertiesButtonBg","nodeBorderColor","nodePointerBg","nodeButtonTextColor","nodeButtonLineColor","useStyles","makeStyles","node","margin","borderColor","width","border","borderTop","display","Sidebar","classes","setSelected","useState","Box","className","List","disablePadding","component","ListItemButton","onClick","ListItemIcon","src","Buffer","CursorActive","toString","alt","Cursor","MoveActive","Move","Divider","Node","IconActive","Icon","FullscreenActive","Fullscreen","applicationTheme","params","components","MuiCssBaseline","styleOverrides","MuiList","root","padding","background","borderRadius","alignItems","justifyContent","marginBottom","opacity","boxShadow","color","marginLeft","fontWeight","fontSize","lineHeight","letterSpacing","MuiListItemIcon","minWidth","MuiListItemButton","height","backgroundColor","customVariables","Position","x","y","_","container","canvasContainer","MetaDiagram","metaNodes","metaLinks","wrapperClassName","metaTheme","createEngine","getNodeFactories","registerFactory","getLinkFactories","DiagramModel","map","mn","ml","filter","mlm","addAll","setModel","containerClassName","ThemeProvider","theme","createTheme","customThemeVariables","CssBaseline","CanvasWidget","canvasClassName"],"mappings":"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"} \ No newline at end of file