@eventcatalog/core 0.1.9 → 0.1.13

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eventcatalog/core",
-  "version": "0.1.9",
+  "version": "0.1.13",
   "publishConfig": {
     "access": "public"
   },
@@ -28,6 +28,7 @@
     "@tailwindcss/typography": "^0.4.1",
     "compare-versions": "^4.1.2",
     "copy-text-to-clipboard": "^3.0.1",
+    "dagre": "^0.8.5",
     "diff": "^5.0.0",
     "diff2html": "^3.4.13",
     "fs-extra": "^10.0.0",
@@ -38,6 +39,7 @@
     "next-mdx-remote": "^3.0.8",
     "react": "17.0.2",
     "react-dom": "17.0.2",
+    "react-flow-renderer": "^9.7.3",
     "react-force-graph-3d": "^1.21.10",
     "react-syntax-highlighter": "^15.4.5"
   },

package/pages/events/[name].tsx

@@ -19,6 +19,7 @@ import { getAllEvents, getEventByName } from '@/lib/events';
 import { useConfig, useUrl } from '@/hooks/EventCatalog';
 
 import { MarkdownFile } from '@/types/index';
+import NodeGraph from '@/components/Mdx/NodeGraph/NodeGraph';
 
 export interface EventsPageProps {
   event: Event;
@@ -88,6 +89,41 @@ export const getComponents = ({ event, schema, examples }: any) => ({
       <Mermaid source="event" data={event} rootNodeColor={getBackgroundColor(event.name)} charts={charts} />
     </div>
   ),
+  NodeGraph: ({
+    title,
+    maxHeight,
+    maxZoom,
+    fitView,
+    zoomOnScroll,
+    isAnimated,
+    isDraggable,
+  }: // isHorizontal,
+  {
+    title: string;
+    maxHeight?: number;
+    maxZoom?: number;
+    fitView?: boolean;
+    zoomOnScroll?: boolean;
+    isAnimated?: boolean;
+    isDraggable?: boolean;
+    // isHorizontal?: boolean;
+  }) => (
+    <div className="mx-auto w-full">
+      {title && <h2 className="text-lg font-medium text-gray-900 underline">{title}</h2>}
+      <NodeGraph
+        source="event"
+        data={event}
+        rootNodeColor={getBackgroundColor(event.name)}
+        maxHeight={maxHeight}
+        maxZoom={maxZoom}
+        fitView={fitView}
+        zoomOnScroll={zoomOnScroll}
+        isAnimated={isAnimated}
+        isDraggable={isDraggable}
+        // isHorizontal={isHorizontal}
+      />
+    </div>
+  ),
 });
 
 export default function Events(props: EventsPageProps) {

package/pages/services/[name].tsx

@@ -14,6 +14,7 @@ import getBackgroundColor from '@/utils/random-bg';
 import { useConfig, useUrl } from '@/hooks/EventCatalog';
 
 import { MarkdownFile } from '@/types/index';
+import NodeGraph from '@/components/Mdx/NodeGraph/NodeGraph';
 
 interface ServicesPageProps {
   service: Service;
@@ -35,6 +36,41 @@ const getComponents = (service) => ({
   Mermaid: ({ title, charts }: { title: string; charts?: string[] }) => (
     <MermaidComponent service={service} title={title} charts={charts} />
   ),
+  NodeGraph: ({
+    title,
+    maxHeight,
+    maxZoom,
+    fitView,
+    zoomOnScroll,
+    isAnimated,
+    isDraggable,
+  }: // isHorizontal,
+  {
+    title: string;
+    maxHeight?: number;
+    maxZoom?: number;
+    fitView?: boolean;
+    zoomOnScroll?: boolean;
+    isAnimated?: boolean;
+    isDraggable?: boolean;
+    // isHorizontal?: boolean;
+  }) => (
+    <div className="mx-auto w-full">
+      {title && <h2 className="text-lg font-medium text-gray-900 underline">{title}</h2>}
+      <NodeGraph
+        source="service"
+        data={service}
+        rootNodeColor={getBackgroundColor(service.name)}
+        maxHeight={maxHeight}
+        maxZoom={maxZoom}
+        fitView={fitView}
+        zoomOnScroll={zoomOnScroll}
+        isAnimated={isAnimated}
+        isDraggable={isDraggable}
+        // isHorizontal={isHorizontal}
+      />
+    </div>
+  ),
 });
 
 export default function Services(props: ServicesPageProps) {

package/.next/static/_D78gGWWcjFmvj_jqGXW3/_buildManifest.js

@@ -1 +0,0 @@
-self.__BUILD_MANIFEST=function(s,e,c,a,t,n,i,f,b,r,v,d){return{__rewrites:{beforeFiles:[],afterFiles:[],fallback:[]},"/":["static/chunks/pages/index-fe1a9e09c7f51e66.js"],"/_error":["static/chunks/pages/_error-5a714c45c50a8db4.js"],"/events":[s,e,c,t,"static/chunks/pages/events-c9e5a0fa7d23d620.js"],"/events/[name]":[s,n,i,f,e,c,b,r,a,v,d,"static/chunks/pages/events/[name]-73ecab7171745a3f.js"],"/events/[name]/logs":[e,"static/chunks/364-9c039ca46569869e.js","static/css/5eeed9cb243ce668.css","static/chunks/pages/events/[name]/logs-707da36de8222a98.js"],"/events/[name]/v/[version]":[s,n,i,f,e,c,b,r,a,v,d,"static/chunks/pages/events/[name]/v/[version]-f6619ec4056cc70d.js"],"/overview":["static/chunks/pages/overview-2f0bfad06c84e437.js"],"/services":[s,e,c,t,"static/chunks/pages/services-30e4132ef02b1784.js"],"/services/[name]":[s,e,c,a,"static/chunks/pages/services/[name]-d8873d29190a6447.js"],"/users/[id]":[s,c,"static/chunks/pages/users/[id]-a4274bfad4d9a9ec.js"],sortedPages:["/","/_app","/_error","/events","/events/[name]","/events/[name]/logs","/events/[name]/v/[version]","/overview","/services","/services/[name]","/users/[id]"]}}("static/chunks/176cb4e4-8a0f6f010ef8accb.js","static/chunks/519-7c428c1e49c8e614.js","static/chunks/962-d5070461f6d4a478.js","static/chunks/336-b1acb0b6aa306baf.js","static/chunks/274-11c4d093341d7201.js","static/chunks/1df474da-91f6061ee61707c6.js","static/chunks/7f5d3f51-7158fdd5a44cedd5.js","static/chunks/2edb282b-9e1cce5842787609.js","static/chunks/5-f60eecf67567a225.js","static/chunks/650-4004943b2a9623ca.js","static/chunks/178-9b89f5c036d77ab9.js","static/css/7e14b4dede1671ad.css"),self.__BUILD_MANIFEST_CB&&self.__BUILD_MANIFEST_CB();

package/.next/static/chunks/336-b1acb0b6aa306baf.js

@@ -1 +0,0 @@
-"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[336],{52428:function(e,n,t){var r=t(52322),a=(t(2784),t(61519)),s=t(39097);n.Z=function(e){var n=e.pages,t=e.homePath,c=void 0===t?"/events":t;return(0,r.jsx)("nav",{className:"flex","aria-label":"Breadcrumb",children:(0,r.jsxs)("ol",{className:"flex items-center space-x-4",children:[(0,r.jsx)("li",{children:(0,r.jsx)(s.default,{href:c,children:(0,r.jsxs)("a",{className:"text-gray-400 hover:text-gray-500",children:[(0,r.jsx)(a.tvw,{className:"flex-shrink-0 h-5 w-5","aria-hidden":"true"}),(0,r.jsx)("span",{className:"sr-only",children:"Home"})]})})}),n.map((function(e){return(0,r.jsx)("li",{children:(0,r.jsxs)("div",{className:"flex items-center",children:[(0,r.jsx)("svg",{className:"flex-shrink-0 h-5 w-5 text-gray-300",xmlns:"http://www.w3.org/2000/svg",fill:"currentColor",viewBox:"0 0 20 20","aria-hidden":"true",children:(0,r.jsx)("path",{d:"M5.555 17.776l8-16 .894.448-8 16-.894-.448z"})}),(0,r.jsx)(s.default,{href:e.href,children:(0,r.jsx)("a",{className:"ml-4 text-sm font-medium text-gray-500 hover:text-gray-700","aria-current":e.current?"page":void 0,children:e.name})})]})},e.name)}))]})})}},62455:function(e,n,t){t.d(n,{Z:function(){return i}});var r=t(52322),a=t(61519),s=t(39097),c=t(61790);function i(e){var n=e.title,t=e.subtitle,i=e.tags,l=void 0===i?[]:i,o=e.lastModifiedDate,d=e.children,m=e.sidebar,x=e.breadCrumbs,u=e.editUrl,h=e.isOldVersion,f=e.latestVersionUrl,p=e.version,v=e.draft,g=void 0!==v&&v;return(0,r.jsx)("div",{className:"flex relative",children:(0,r.jsx)("div",{className:" flex flex-col w-0 flex-1 ",children:(0,r.jsx)("main",{className:"flex-1 ",children:(0,r.jsx)("div",{className:"py-8 xl:py-10",children:(0,r.jsxs)("div",{className:"max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 xl:max-w-7xl xl:grid xl:grid-cols-4",children:[(0,r.jsxs)("div",{className:"xl:col-span-3 xl:pr-8 xl:border-r xl:border-gray-200 flex-col justify-between flex",children:[(0,r.jsxs)("div",{children:[x&&(0,r.jsx)("div",{className:"mb-5 border-b border-gray-100 pb-4",children:x}),(0,r.jsx)("div",{children:(0,r.jsxs)("div",{children:[(0,r.jsxs)("div",{className:"xl:border-b pb-4 flex justify-between ",children:[(0,r.jsxs)("div",{className:"space-y-2 w-full",children:[(0,r.jsxs)("h1",{className:"text-3xl font-bold text-gray-900 relative",children:[n,(0,r.jsxs)("div",{className:"-top-1 relative inline-block ml-2",children:[l.map((function(e,n){return(0,r.jsx)("span",{className:"ml-2 inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium -top-0.5 relative bg-yellow-100 text-yellow-800",children:e.label},"".concat(e,"-").concat(n))})),g&&(0,r.jsx)("span",{className:"ml-2 inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium -top-0.5 relative bg-gray-500 text-gray-100",children:"Draft"})]})]}),(0,r.jsx)("div",{className:"text-gray-600 mb-10 text py-2",children:t}),h&&p&&(0,r.jsx)(c.Z,{className:"mt-0 pt-0 w-full",type:"warning",children:(0,r.jsxs)(r.Fragment,{children:["You are currently viewing an old version of this event (",p,").",(0,r.jsx)(s.default,{href:f,children:(0,r.jsx)("a",{className:"block text-sm pl-7 mt-2 text-blue-500 underline",children:"Read latest version \u2192"})})]})})]}),(0,r.jsx)("div",{className:"mt-4 flex space-x-3 md:mt-0",children:u&&(0,r.jsxs)("a",{href:u,target:"_blank",type:"button",className:"hidden md:inline-flex h-10 justify-center px-4 py-2 border border-gray-300 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-900",rel:"noreferrer",children:[(0,r.jsx)(a.vdY,{className:"-ml-1 mr-2 h-5 w-5 text-gray-400","aria-hidden":"true"}),(0,r.jsx)("span",{children:"Edit"})]})})]}),(0,r.jsxs)("div",{className:"py-3 xl:pt-6 xl:pb-0",children:[g&&(0,r.jsx)(c.Z,{className:"mt-0 pt-0",type:"warning",children:(0,r.jsxs)(r.Fragment,{children:["This event is currently in ",(0,r.jsx)("span",{className:"underline",children:"draft"})," mode."]})}),(0,r.jsx)("div",{className:"prose max-w-none",children:d})]})]})})]}),(0,r.jsxs)("div",{className:"flex mt-10 ".concat(u?"justify-between":"justify-end"),children:[u&&(0,r.jsxs)("a",{href:u,target:"_blank",className:"flex text-gray-400",rel:"noreferrer",children:[(0,r.jsx)(a.vdY,{className:"top-1 mr-2 relative h-4 w-4 text-gray-400","aria-hidden":"true"}),(0,r.jsx)("span",{children:"Edit this page"})]}),(0,r.jsxs)("span",{className:"italic text-xs mt-2",children:["Last updated on ",o]})]})]}),(0,r.jsx)("div",{className:"md:min-h-screen",children:m})]})})})})})}},61790:function(e,n,t){t.d(n,{Z:function(){return s}});var r=t(52322),a=t(61519);function s(e){var n=e.children,t=e.type,s=e.className,c=void 0===s?"":s,i=function(e){switch(e){case"alert":return{color:"red",icon:a.SI8};case"warning":return{color:"yellow",icon:a.SI8};default:return{color:"indigo",icon:a.AV5}}}(t),l=i.color,o=i.icon;return(0,r.jsx)("div",{className:"bg-".concat(l,"-50 border-l-4 border-").concat(l,"-400 my-4 ").concat(c),children:(0,r.jsx)("div",{className:"flex",children:(0,r.jsxs)("div",{className:"ml-3 py-4",children:[(0,r.jsx)(o,{className:"inline-block mr-2 h-5 w-5 text-".concat(l,"-400"),"aria-hidden":"true"}),n]})})})}},4573:function(e,n,t){t.d(n,{Z:function(){return u}});var r=t(52322),a=t(2784),s=t(14689),c=t(70314),i=(0,c.default)().publicRuntimeConfig,l=(void 0===i?{}:i).basePath,o=void 0===l?"":l,d=function(e){return e.length>"50"?"".concat(e.substring(0,"50"),"..."):e},m=function(e,n){return""!==o?"".concat(o,"/").concat(n,"/").concat(e):"/".concat(n,"/").concat(e)},x=function(e,n,t,r){return"flowchart LR\n\n".concat(n.map((function(n){return"".concat(n.id,"[").concat(n.name,"]:::producer--\x3e").concat(e.id,"[").concat(e.name,"]:::event\n")})).join(""),"\nclassDef event stroke:").concat(r,",stroke-width: 4px;\n\nclassDef producer stroke:#75d7b6,stroke-width: 2px;\n\nclassDef consumer stroke:#818cf8,stroke-width: 2px;\n\n").concat(t.map((function(n){return"".concat(e.id,"[").concat(e.name,"]:::event--\x3e").concat(n.id,"[").concat(n.name,"]:::consumer\n")})).join(""),"\n").concat(n.map((function(e){return"click ".concat(e.id,' href "').concat(e.link,'" "Go to ').concat(e.name,'" _self\n')})).join(""),"\n").concat(t.map((function(e){return"click ".concat(e.id,' href "').concat(e.link,'" "Go to ').concat(e.name,'" _self\n')})).join(""),"\nclick ").concat(e.id,' href "').concat(e.link,'" "Go to ').concat(e.name,'" _self\n\n')};s.Z.initialize({startOnLoad:!0,theme:"forest",securityLevel:"loose",flowchart:{useMaxWidth:!1,width:"1000px"},themeCSS:"\n  .node {\n      filter: drop-shadow( 3px 3px 2px rgba(0, 0, 0, .2))\n  }\n  .mermaid svg {\n      width: 10000px\n  }\n  .node rect {\n      fill: white\n  }\n    ",fontFamily:"Fira Code",width:"100%"});var u=function(e){var n=e.data,t=e.source,c=void 0===t?"event":t,i=e.rootNodeColor,l=e.charts;if((0,a.useEffect)((function(){s.Z.contentLoaded()}),[]),l)return(0,r.jsx)(r.Fragment,{children:l.map((function(e,n){return(0,r.jsx)("div",{className:"mermaid",children:e},"chart-".concat(n))}))});var o="event"===c?function(e,n){var t=e.name,r=e.producers,a=e.consumers,s=void 0===n?"#2563eb":n,c=r.map(d).map((function(e){return{id:e.replace(/ /g,"_"),name:e,link:m(e,"services")}})),i=a.map(d).map((function(e){return{id:e.replace(/ /g,"_"),name:e,link:m(e,"services")}})),l={id:d(t.replace(/ /g,"_")),name:t,link:m(t,"events")};return x(l,c,i,s)}(n,i):function(e,n){var t=e.publishes,r=e.subscribes,a=e.name,s=void 0===n?"#2563eb":n,c=t.map(d).map((function(e){return{id:e.name.replace(/ /g,"_"),name:e.name,link:m(e.name,"events")}})),i=r.map(d).map((function(e){return{id:e.name.replace(/ /g,"_"),name:e.name,link:m(e.name,"events")}})),l={id:d(a.replace(/ /g,"_")),name:a,link:m(a,"services")};return x(l,c,i,s)}(n,i);return(0,r.jsx)("div",{className:"mermaid",children:o})}},4488:function(e,n,t){t.d(n,{Z:function(){return s}});var r=t(52322),a=t(61519);function s(e){var n=e.type,t=e.name,s=e.editUrl;return(0,r.jsx)("main",{className:"min-h-full bg-cover bg-top sm:bg-top h-screen",children:(0,r.jsxs)("div",{className:"max-w-7xl mx-auto px-4 py-16 text-center sm:px-6 sm:py-24 lg:px-8 lg:py-48",children:[(0,r.jsxs)("p",{className:"text-sm font-semibold text-gray-700 text-opacity-50 uppercase tracking-wide blur-xl",children:["Failed to find ",n]}),(0,r.jsx)("h1",{className:"mt-2 text-4xl font-extrabold text-gray-900 tracking-tight sm:text-5xl",children:"Missing Documentation"}),(0,r.jsxs)("p",{className:"mt-2 text-lg font-medium text-gray-700 text-opacity-50 text-center ",children:["Documentation for ",n," is missing!",(0,r.jsx)("span",{className:"block font-bold text-gray-800 underline break-all max-w-2xl mx-auto py-4",children:t})]}),(0,r.jsx)("p",{className:"mt-4 text-xs text-gray-400",children:"Help the eco-system and add the documentation for others \u2764\ufe0f "}),s&&(0,r.jsx)("div",{className:"mt-12",children:(0,r.jsxs)("a",{href:s,target:"_blank",className:"inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-black bg-opacity-75 ",rel:"noreferrer",children:[(0,r.jsx)(a.Qrl,{className:"-ml-1 mr-2 h-5 w-5","aria-hidden":"true"}),"Add missing ",(0,r.jsx)("span",{className:"underline px-1",children:n})," documentation"]})})]})})}},46892:function(e,n,t){function r(e){for(var n=0,t=0;t<e.length;t++)n=e.charCodeAt(t)+((n<<5)-n);for(var r="#",a=0;a<3;a++){r+="00".concat((n>>8*a&255).toString(16)).substr(-2)}return r}t.d(n,{Z:function(){return r}})}}]);