@eventcatalog/core 0.1.12 → 0.1.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (230) hide show
  1. package/.next/BUILD_ID +1 -1
  2. package/.next/build-manifest.json +58 -38
  3. package/.next/cache/.tsbuildinfo +1 -1
  4. package/.next/cache/config.json +3 -3
  5. package/.next/cache/eslint/.cache_1bay4w0 +1 -1
  6. package/.next/cache/next-server.js.nft.json +1 -1
  7. package/.next/cache/webpack/client-production/0.pack +0 -0
  8. package/.next/cache/webpack/client-production/index.pack +0 -0
  9. package/.next/cache/webpack/server-production/0.pack +0 -0
  10. package/.next/cache/webpack/server-production/index.pack +0 -0
  11. package/.next/next-server.js.nft.json +1 -1
  12. package/.next/prerender-manifest.json +1 -1
  13. package/.next/routes-manifest.json +1 -1
  14. package/.next/server/chunks/484.js +572 -0
  15. package/.next/server/chunks/944.js +89 -53
  16. package/.next/server/pages/404.html +1 -1
  17. package/.next/server/pages/500.html +1 -1
  18. package/.next/server/pages/_app.js +16 -5
  19. package/.next/server/pages/events/AddedItemToCart/logs.html +1 -1
  20. package/.next/server/pages/events/AddedItemToCart/v/0.0.1.html +3 -3
  21. package/.next/server/pages/events/AddedItemToCart/v/0.0.1.json +1 -1
  22. package/.next/server/pages/events/AddedItemToCart/v/0.0.2.html +3 -3
  23. package/.next/server/pages/events/AddedItemToCart/v/0.0.2.json +1 -1
  24. package/.next/server/pages/events/AddedItemToCart.html +4 -22
  25. package/.next/server/pages/events/AddedItemToCart.json +1 -1
  26. package/.next/server/pages/events/OrderComplete/logs.html +1 -1
  27. package/.next/server/pages/events/OrderComplete.html +3 -21
  28. package/.next/server/pages/events/OrderComplete.json +1 -1
  29. package/.next/server/pages/events/OrderConfirmed/logs.html +1 -1
  30. package/.next/server/pages/events/OrderConfirmed.html +3 -21
  31. package/.next/server/pages/events/OrderConfirmed.json +1 -1
  32. package/.next/server/pages/events/OrderRequested/logs.html +1 -1
  33. package/.next/server/pages/events/OrderRequested.html +3 -21
  34. package/.next/server/pages/events/OrderRequested.json +1 -1
  35. package/.next/server/pages/events/PaymentProcessed/logs.html +1 -1
  36. package/.next/server/pages/events/PaymentProcessed.html +3 -21
  37. package/.next/server/pages/events/PaymentProcessed.json +1 -1
  38. package/.next/server/pages/events/RemovedItemFromCart/logs.html +1 -1
  39. package/.next/server/pages/events/RemovedItemFromCart.html +3 -21
  40. package/.next/server/pages/events/RemovedItemFromCart.json +1 -1
  41. package/.next/server/pages/events/ShipmentDelivered/logs.html +1 -1
  42. package/.next/server/pages/events/ShipmentDelivered.html +3 -23
  43. package/.next/server/pages/events/ShipmentDelivered.json +1 -1
  44. package/.next/server/pages/events/ShipmentDispatched/logs.html +1 -1
  45. package/.next/server/pages/events/ShipmentDispatched.html +3 -21
  46. package/.next/server/pages/events/ShipmentDispatched.json +1 -1
  47. package/.next/server/pages/events/ShipmentPrepared/logs.html +1 -1
  48. package/.next/server/pages/events/ShipmentPrepared.html +2 -20
  49. package/.next/server/pages/events/ShipmentPrepared.json +1 -1
  50. package/.next/server/pages/events/[name]/v/[version].js +29 -1
  51. package/.next/server/pages/events/[name]/v/[version].js.nft.json +1 -1
  52. package/.next/server/pages/events/[name].js +29 -1
  53. package/.next/server/pages/events/[name].js.nft.json +1 -1
  54. package/.next/server/pages/events.html +3 -3
  55. package/.next/server/pages/events.js.nft.json +1 -1
  56. package/.next/server/pages/events.json +1 -1
  57. package/.next/server/pages/index.html +1 -1
  58. package/.next/server/pages/overview.html +1 -1
  59. package/.next/server/pages/overview.json +1 -1
  60. package/.next/server/pages/services/Basket Service.html +2 -22
  61. package/.next/server/pages/services/Basket Service.json +1 -1
  62. package/.next/server/pages/services/Data Lake.html +2 -24
  63. package/.next/server/pages/services/Data Lake.json +1 -1
  64. package/.next/server/pages/services/Payment Service.html +2 -20
  65. package/.next/server/pages/services/Payment Service.json +1 -1
  66. package/.next/server/pages/services/Shipping Service.html +2 -28
  67. package/.next/server/pages/services/Shipping Service.json +1 -1
  68. package/.next/server/pages/services/[name].js +64 -4
  69. package/.next/server/pages/services/[name].js.nft.json +1 -1
  70. package/.next/server/pages/services.html +2 -2
  71. package/.next/server/pages/services.js.nft.json +1 -1
  72. package/.next/server/pages/services.json +1 -1
  73. package/.next/server/pages/users/[id].js.nft.json +1 -1
  74. package/.next/server/pages/users/dboyne.html +3 -3
  75. package/.next/server/pages/users/dboyne.json +1 -1
  76. package/.next/server/pages/users/mSmith.html +3 -3
  77. package/.next/server/pages/users/mSmith.json +1 -1
  78. package/.next/server/pages/visualiser.html +14 -0
  79. package/.next/server/pages/visualiser.js +583 -0
  80. package/.next/server/pages/visualiser.js.nft.json +1 -0
  81. package/.next/server/pages/visualiser.json +1 -0
  82. package/.next/server/pages-manifest.json +1 -0
  83. package/.next/static/7llqY64OLAlXQNo-YhXyr/_buildManifest.js +1 -0
  84. package/.next/static/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/_middlewareManifest.js +0 -0
  85. package/.next/static/7llqY64OLAlXQNo-YhXyr/_ssgManifest.js +1 -0
  86. package/.next/static/chunks/109-a08539311d3d6672.js +1 -0
  87. package/.next/static/chunks/178-87f01d17ab32dd4f.js +1 -0
  88. package/.next/static/chunks/252-08ab418f9b6821dd.js +1 -0
  89. package/.next/static/chunks/506-12764fcf4b5d93b0.js +1 -0
  90. package/.next/static/chunks/519-2ec6fc3cdbaa4dc2.js +1 -0
  91. package/.next/static/chunks/650-343888e13f994a09.js +1 -0
  92. package/.next/static/chunks/962-20c87db3880df896.js +1 -0
  93. package/.next/static/chunks/b744740b-229c238b25b9eeac.js +1 -0
  94. package/.next/static/chunks/pages/_app-6eba1099469a6889.js +1 -0
  95. package/.next/static/chunks/pages/events/[name]/v/{[version]-f6619ec4056cc70d.js → [version]-33051dbc32f5fe4e.js} +1 -1
  96. package/.next/static/chunks/pages/events/{[name]-73ecab7171745a3f.js → [name]-813780e7042af288.js} +1 -1
  97. package/.next/static/chunks/pages/services/[name]-142d7fa515cfc532.js +1 -0
  98. package/.next/static/chunks/pages/visualiser-0fbd55ba5b1f83ed.js +1 -0
  99. package/.next/static/chunks/{webpack-2ebfdb1666dac4ad.js → webpack-de66347fdf9ac788.js} +1 -1
  100. package/.next/static/css/f56eba33afeb64fa.css +3 -0
  101. package/.next/trace +56 -54
  102. package/CHANGELOG.md +26 -0
  103. package/components/Header.tsx +1 -0
  104. package/components/Mdx/Examples.tsx +27 -27
  105. package/components/Mdx/NodeGraph/GraphElements.tsx +238 -0
  106. package/components/Mdx/NodeGraph/GraphLayout.ts +57 -0
  107. package/components/Mdx/NodeGraph/Node.tsx +15 -0
  108. package/components/Mdx/NodeGraph/NodeGraph.tsx +180 -0
  109. package/components/Mdx/NodeGraph/__tests__/GraphElements.spec.ts +98 -0
  110. package/components/Mdx/NodeGraph/__tests__/GraphLayout.spec.ts +104 -0
  111. package/components/Mdx/NodeGraph/__tests__/__snapshots__/GraphElements.spec.ts.snap +995 -0
  112. package/components/Mdx/NodeGraph/__tests__/__snapshots__/GraphLayout.spec.ts.snap +81 -0
  113. package/components/Sidebars/EventSidebar.tsx +7 -0
  114. package/components/Sidebars/ServiceSidebar.tsx +8 -1
  115. package/components/SyntaxHighlighter.tsx +18 -10
  116. package/out/404/index.html +1 -1
  117. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/events/AddedItemToCart/logs.json +0 -0
  118. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/events/AddedItemToCart/v/0.0.1.json +1 -1
  119. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/events/AddedItemToCart/v/0.0.2.json +1 -1
  120. package/out/_next/data/7llqY64OLAlXQNo-YhXyr/events/AddedItemToCart.json +1 -0
  121. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/events/OrderComplete/logs.json +0 -0
  122. package/out/_next/data/7llqY64OLAlXQNo-YhXyr/events/OrderComplete.json +1 -0
  123. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/events/OrderConfirmed/logs.json +0 -0
  124. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/events/OrderConfirmed.json +1 -1
  125. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/events/OrderRequested/logs.json +0 -0
  126. package/out/_next/data/7llqY64OLAlXQNo-YhXyr/events/OrderRequested.json +1 -0
  127. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/events/PaymentProcessed/logs.json +0 -0
  128. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/events/PaymentProcessed.json +1 -1
  129. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/events/RemovedItemFromCart/logs.json +0 -0
  130. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/events/RemovedItemFromCart.json +1 -1
  131. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/events/ShipmentDelivered/logs.json +0 -0
  132. package/out/_next/data/7llqY64OLAlXQNo-YhXyr/events/ShipmentDelivered.json +1 -0
  133. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/events/ShipmentDispatched/logs.json +0 -0
  134. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/events/ShipmentDispatched.json +1 -1
  135. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/events/ShipmentPrepared/logs.json +0 -0
  136. package/out/_next/data/7llqY64OLAlXQNo-YhXyr/events/ShipmentPrepared.json +1 -0
  137. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/events.json +1 -1
  138. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/overview.json +1 -1
  139. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/services/Basket Service.json +1 -1
  140. package/out/_next/data/7llqY64OLAlXQNo-YhXyr/services/Data Lake.json +1 -0
  141. package/out/_next/data/7llqY64OLAlXQNo-YhXyr/services/Payment Service.json +1 -0
  142. package/out/_next/data/7llqY64OLAlXQNo-YhXyr/services/Shipping Service.json +1 -0
  143. package/out/_next/data/7llqY64OLAlXQNo-YhXyr/services.json +1 -0
  144. package/out/_next/data/7llqY64OLAlXQNo-YhXyr/users/dboyne.json +1 -0
  145. package/out/_next/data/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/users/mSmith.json +1 -1
  146. package/out/_next/data/7llqY64OLAlXQNo-YhXyr/visualiser.json +1 -0
  147. package/out/_next/static/7llqY64OLAlXQNo-YhXyr/_buildManifest.js +1 -0
  148. package/out/_next/static/{bMdE5uGdmIhIs9cgTPp_Z → 7llqY64OLAlXQNo-YhXyr}/_middlewareManifest.js +0 -0
  149. package/out/_next/static/7llqY64OLAlXQNo-YhXyr/_ssgManifest.js +1 -0
  150. package/out/_next/static/chunks/109-a08539311d3d6672.js +1 -0
  151. package/out/_next/static/chunks/178-87f01d17ab32dd4f.js +1 -0
  152. package/out/_next/static/chunks/252-08ab418f9b6821dd.js +1 -0
  153. package/out/_next/static/chunks/506-12764fcf4b5d93b0.js +1 -0
  154. package/out/_next/static/chunks/519-2ec6fc3cdbaa4dc2.js +1 -0
  155. package/out/_next/static/chunks/650-343888e13f994a09.js +1 -0
  156. package/out/_next/static/chunks/962-20c87db3880df896.js +1 -0
  157. package/out/_next/static/chunks/b744740b-229c238b25b9eeac.js +1 -0
  158. package/out/_next/static/chunks/pages/_app-6eba1099469a6889.js +1 -0
  159. package/out/_next/static/chunks/pages/events/[name]/v/{[version]-f6619ec4056cc70d.js → [version]-33051dbc32f5fe4e.js} +1 -1
  160. package/out/_next/static/chunks/pages/events/{[name]-73ecab7171745a3f.js → [name]-813780e7042af288.js} +1 -1
  161. package/out/_next/static/chunks/pages/services/[name]-142d7fa515cfc532.js +1 -0
  162. package/out/_next/static/chunks/pages/visualiser-0fbd55ba5b1f83ed.js +1 -0
  163. package/out/_next/static/chunks/{webpack-2ebfdb1666dac4ad.js → webpack-de66347fdf9ac788.js} +1 -1
  164. package/out/_next/static/css/f56eba33afeb64fa.css +3 -0
  165. package/out/events/AddedItemToCart/index.html +4 -22
  166. package/out/events/AddedItemToCart/logs/index.html +1 -1
  167. package/out/events/AddedItemToCart/v/0.0.1/index.html +3 -3
  168. package/out/events/AddedItemToCart/v/0.0.2/index.html +3 -3
  169. package/out/events/OrderComplete/index.html +3 -21
  170. package/out/events/OrderComplete/logs/index.html +1 -1
  171. package/out/events/OrderConfirmed/index.html +3 -21
  172. package/out/events/OrderConfirmed/logs/index.html +1 -1
  173. package/out/events/OrderRequested/index.html +3 -21
  174. package/out/events/OrderRequested/logs/index.html +1 -1
  175. package/out/events/PaymentProcessed/index.html +3 -21
  176. package/out/events/PaymentProcessed/logs/index.html +1 -1
  177. package/out/events/RemovedItemFromCart/index.html +3 -21
  178. package/out/events/RemovedItemFromCart/logs/index.html +1 -1
  179. package/out/events/ShipmentDelivered/index.html +3 -23
  180. package/out/events/ShipmentDelivered/logs/index.html +1 -1
  181. package/out/events/ShipmentDispatched/index.html +3 -21
  182. package/out/events/ShipmentDispatched/logs/index.html +1 -1
  183. package/out/events/ShipmentPrepared/index.html +2 -20
  184. package/out/events/ShipmentPrepared/logs/index.html +1 -1
  185. package/out/events/index.html +3 -3
  186. package/out/index.html +1 -1
  187. package/out/overview/index.html +1 -1
  188. package/out/services/Basket Service/index.html +2 -22
  189. package/out/services/Data Lake/index.html +2 -24
  190. package/out/services/Payment Service/index.html +2 -20
  191. package/out/services/Shipping Service/index.html +2 -28
  192. package/out/services/index.html +2 -2
  193. package/out/users/dboyne/index.html +3 -3
  194. package/out/users/mSmith/index.html +3 -3
  195. package/out/visualiser/index.html +14 -0
  196. package/package.json +3 -1
  197. package/pages/events/[name].tsx +46 -8
  198. package/pages/services/[name].tsx +37 -1
  199. package/pages/visualiser.tsx +226 -0
  200. package/styles/globals.css +4 -0
  201. package/.next/static/bMdE5uGdmIhIs9cgTPp_Z/_buildManifest.js +0 -1
  202. package/.next/static/bMdE5uGdmIhIs9cgTPp_Z/_ssgManifest.js +0 -1
  203. package/.next/static/chunks/178-9b89f5c036d77ab9.js +0 -1
  204. package/.next/static/chunks/336-7c4681dab353ec23.js +0 -1
  205. package/.next/static/chunks/519-7c428c1e49c8e614.js +0 -1
  206. package/.next/static/chunks/650-4004943b2a9623ca.js +0 -1
  207. package/.next/static/chunks/962-d5070461f6d4a478.js +0 -1
  208. package/.next/static/chunks/pages/_app-46c2e0f1ff3b4efb.js +0 -1
  209. package/.next/static/chunks/pages/services/[name]-d8873d29190a6447.js +0 -1
  210. package/.next/static/css/0b54ec6503b91283.css +0 -3
  211. package/out/_next/data/bMdE5uGdmIhIs9cgTPp_Z/events/AddedItemToCart.json +0 -1
  212. package/out/_next/data/bMdE5uGdmIhIs9cgTPp_Z/events/OrderComplete.json +0 -1
  213. package/out/_next/data/bMdE5uGdmIhIs9cgTPp_Z/events/OrderRequested.json +0 -1
  214. package/out/_next/data/bMdE5uGdmIhIs9cgTPp_Z/events/ShipmentDelivered.json +0 -1
  215. package/out/_next/data/bMdE5uGdmIhIs9cgTPp_Z/events/ShipmentPrepared.json +0 -1
  216. package/out/_next/data/bMdE5uGdmIhIs9cgTPp_Z/services/Data Lake.json +0 -1
  217. package/out/_next/data/bMdE5uGdmIhIs9cgTPp_Z/services/Payment Service.json +0 -1
  218. package/out/_next/data/bMdE5uGdmIhIs9cgTPp_Z/services/Shipping Service.json +0 -1
  219. package/out/_next/data/bMdE5uGdmIhIs9cgTPp_Z/services.json +0 -1
  220. package/out/_next/data/bMdE5uGdmIhIs9cgTPp_Z/users/dboyne.json +0 -1
  221. package/out/_next/static/bMdE5uGdmIhIs9cgTPp_Z/_buildManifest.js +0 -1
  222. package/out/_next/static/bMdE5uGdmIhIs9cgTPp_Z/_ssgManifest.js +0 -1
  223. package/out/_next/static/chunks/178-9b89f5c036d77ab9.js +0 -1
  224. package/out/_next/static/chunks/336-7c4681dab353ec23.js +0 -1
  225. package/out/_next/static/chunks/519-7c428c1e49c8e614.js +0 -1
  226. package/out/_next/static/chunks/650-4004943b2a9623ca.js +0 -1
  227. package/out/_next/static/chunks/962-d5070461f6d4a478.js +0 -1
  228. package/out/_next/static/chunks/pages/_app-46c2e0f1ff3b4efb.js +0 -1
  229. package/out/_next/static/chunks/pages/services/[name]-d8873d29190a6447.js +0 -1
  230. package/out/_next/static/css/0b54ec6503b91283.css +0 -3
@@ -0,0 +1,14 @@
1
+ <!DOCTYPE html><html><head><meta name="viewport" content="width=device-width"/><meta charSet="utf-8"/><script src="//unpkg.com/three"></script><script src="//unpkg.com/three/examples/js/renderers/CSS2DRenderer.js"></script><link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css"/><meta name="description" content="An open source project to Discover, Explore and Document your Event Driven Architectures."/><meta property="og:url" content="https://eventcatalog.dev/"/><meta property="og:type" content="website"/><meta property="og:title" content="EventCatalog | Discover, Explore and Document your Event Driven Architectures."/><meta property="og:description" content="An open source tool powered by markdown to document your Event Driven Architecture."/><meta property="og:image" content="https://eventcatalog.dev/img/opengraph.png"/><meta property="og:image:alt" content="EventCatalog | Discover, Explore and Document your Event Driven Architectures."/><meta property="og:image:width" content="1200"/><meta property="og:image:height" content="600"/><meta property="og:locale" content="en-GB"/><meta name="author" content="David Boyne"/><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.13.1/styles/atom-one-light.min.css"/><title>EventCatalog - Visualiser</title><meta name="next-head-count" content="18"/><link rel="preload" href="/_next/static/css/f56eba33afeb64fa.css" as="style"/><link rel="stylesheet" href="/_next/static/css/f56eba33afeb64fa.css" data-n-g=""/><noscript data-n-css=""></noscript><script defer="" nomodule="" src="/_next/static/chunks/polyfills-5cd94c89d3acac5f.js"></script><script src="/_next/static/chunks/webpack-de66347fdf9ac788.js" defer=""></script><script src="/_next/static/chunks/framework-576ec6a1c1386453.js" defer=""></script><script src="/_next/static/chunks/main-0015f560a7edeb35.js" defer=""></script><script src="/_next/static/chunks/pages/_app-6eba1099469a6889.js" defer=""></script><script src="/_next/static/chunks/b744740b-229c238b25b9eeac.js" defer=""></script><script src="/_next/static/chunks/519-2ec6fc3cdbaa4dc2.js" defer=""></script><script src="/_next/static/chunks/962-20c87db3880df896.js" defer=""></script><script src="/_next/static/chunks/506-12764fcf4b5d93b0.js" defer=""></script><script src="/_next/static/chunks/109-a08539311d3d6672.js" defer=""></script><script src="/_next/static/chunks/pages/visualiser-0fbd55ba5b1f83ed.js" defer=""></script><script src="/_next/static/7llqY64OLAlXQNo-YhXyr/_buildManifest.js" defer=""></script><script src="/_next/static/7llqY64OLAlXQNo-YhXyr/_ssgManifest.js" defer=""></script><script src="/_next/static/7llqY64OLAlXQNo-YhXyr/_middlewareManifest.js" defer=""></script></head><body><div id="__next" data-reactroot=""><div class="bg-gray-800"><div class="max-w-7xl mx-auto "><div class="relative flex items-center justify-between h-16"><div class="flex-1 flex items-center justify-center sm:items-stretch sm:justify-start"><div class="flex-shrink-0 flex items-center text-white font-bold"><a class="flex items-center" href="/"><img alt="logo" class="text-white w-8 inline-block mr-3" src="/logo.svg"/><span class="text-xl">EventCatalog</span></a></div></div><div class="hidden sm:block sm:ml-6"><div class="flex space-x-4"><a class="text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium" href="/events/">Events</a><a class="text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium" href="/services/">Services</a><a class="bg-gray-900 text-white px-3 py-2 rounded-md text-sm font-medium" aria-current="page" href="/visualiser/">Visualiser</a><a class="text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium" href="/overview/">3D Node Graph</a></div></div></div></div></div><div class="h-screen overflow-hidden"><div class="grid grid-cols-6"><div class="col-span-1 bg-white px-4 h-screen overflow-auto border-r-2 shadow-md border-gray-200 py-3"><div class="border-b border-gray-200 pb-6"><div class="mt-1 relative rounded-md shadow-sm"><div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none"><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true" class="h-5 w-5 text-gray-400"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path></svg></div><input type="text" name="event" id="event" placeholder="Find Event or Service" class="focus:ring-gray-500 focus:border-gray-500 block w-full pl-10 sm:text-sm border-gray-300 rounded-md"/></div></div><div class="space-y-6"><div><span class="font-bold block py-2">Events <!-- --> <!-- -->(<!-- -->9<!-- -->)</span><ul class="space-y-4 overflow-auto"><li class="flex"><button type="button" class="flex shadow-sm rounded-md w-full text-left border "><div style="background:#2e0a58" class="bg-red-500 flex-shrink-0 flex h-full items-center justify-center w-4 text-white text-sm font-medium rounded-l-md"></div><div class="w-full rounded-r-md border-t border-r border-b bg-white"><div class="p-4 text-sm space-y-2 flex flex-col justify-between h-full"><div class="text-gray-900 font-bold hover:text-gray-600 break-all">AddedItemToCart</div><div class="text-gray-500 text-xs font-normal mt-2 ">Holds information about what the user added to their shopping cart.
2
+ </div></div></div></button></li><li class="flex"><button type="button" class="flex shadow-sm rounded-md w-full text-left border "><div style="background:#871e73" class="bg-red-500 flex-shrink-0 flex h-full items-center justify-center w-4 text-white text-sm font-medium rounded-l-md"></div><div class="w-full rounded-r-md border-t border-r border-b bg-white"><div class="p-4 text-sm space-y-2 flex flex-col justify-between h-full"><div class="text-gray-900 font-bold hover:text-gray-600 break-all">OrderComplete</div><div class="text-gray-500 text-xs font-normal mt-2 ">Event represents when an order has been complete. (Delivered and finished)
3
+ </div></div></div></button></li><li class="flex"><button type="button" class="flex shadow-sm rounded-md w-full text-left border "><div style="background:#d1ffa1" class="bg-red-500 flex-shrink-0 flex h-full items-center justify-center w-4 text-white text-sm font-medium rounded-l-md"></div><div class="w-full rounded-r-md border-t border-r border-b bg-white"><div class="p-4 text-sm space-y-2 flex flex-col justify-between h-full"><div class="text-gray-900 font-bold hover:text-gray-600 break-all">OrderConfirmed</div><div class="text-gray-500 text-xs font-normal mt-2 ">Event represents when an order has been confirmed and ready to be processed (shipped for example)
4
+ </div></div></div></button></li><li class="flex"><button type="button" class="flex shadow-sm rounded-md w-full text-left border "><div style="background:#e053ec" class="bg-red-500 flex-shrink-0 flex h-full items-center justify-center w-4 text-white text-sm font-medium rounded-l-md"></div><div class="w-full rounded-r-md border-t border-r border-b bg-white"><div class="p-4 text-sm space-y-2 flex flex-col justify-between h-full"><div class="text-gray-900 font-bold hover:text-gray-600 break-all">OrderRequested</div><div class="text-gray-500 text-xs font-normal mt-2 ">Holds information about the customers order.
5
+ </div></div></div></button></li><li class="flex"><button type="button" class="flex shadow-sm rounded-md w-full text-left border "><div style="background:#08642a" class="bg-red-500 flex-shrink-0 flex h-full items-center justify-center w-4 text-white text-sm font-medium rounded-l-md"></div><div class="w-full rounded-r-md border-t border-r border-b bg-white"><div class="p-4 text-sm space-y-2 flex flex-col justify-between h-full"><div class="text-gray-900 font-bold hover:text-gray-600 break-all">PaymentProcessed</div><div class="text-gray-500 text-xs font-normal mt-2 ">Holds information about the payment that has been processed.
6
+ </div></div></div></button></li><li class="flex"><button type="button" class="flex shadow-sm rounded-md w-full text-left border "><div style="background:#7de28e" class="bg-red-500 flex-shrink-0 flex h-full items-center justify-center w-4 text-white text-sm font-medium rounded-l-md"></div><div class="w-full rounded-r-md border-t border-r border-b bg-white"><div class="p-4 text-sm space-y-2 flex flex-col justify-between h-full"><div class="text-gray-900 font-bold hover:text-gray-600 break-all">RemovedItemFromCart</div><div class="text-gray-500 text-xs font-normal mt-2 ">Holds information about what the user removed from their cart.
7
+ </div></div></div></button></li><li class="flex"><button type="button" class="flex shadow-sm rounded-md w-full text-left border "><div style="background:#ea7bc8" class="bg-red-500 flex-shrink-0 flex h-full items-center justify-center w-4 text-white text-sm font-medium rounded-l-md"></div><div class="w-full rounded-r-md border-t border-r border-b bg-white"><div class="p-4 text-sm space-y-2 flex flex-col justify-between h-full"><div class="text-gray-900 font-bold hover:text-gray-600 break-all">ShipmentDelivered</div><div class="text-gray-500 text-xs font-normal mt-2 ">Event represents when a shipment has been delivered and received.
8
+ </div></div></div></button></li><li class="flex"><button type="button" class="flex shadow-sm rounded-md w-full text-left border "><div style="background:#f36bc3" class="bg-red-500 flex-shrink-0 flex h-full items-center justify-center w-4 text-white text-sm font-medium rounded-l-md"></div><div class="w-full rounded-r-md border-t border-r border-b bg-white"><div class="p-4 text-sm space-y-2 flex flex-col justify-between h-full"><div class="text-gray-900 font-bold hover:text-gray-600 break-all">ShipmentDispatched</div><div class="text-gray-500 text-xs font-normal mt-2 ">Event represents when a shipment has been dispatched.
9
+ </div></div></div></button></li><li class="flex"><button type="button" class="flex shadow-sm rounded-md w-full text-left border "><div style="background:#1774bd" class="bg-red-500 flex-shrink-0 flex h-full items-center justify-center w-4 text-white text-sm font-medium rounded-l-md"></div><div class="w-full rounded-r-md border-t border-r border-b bg-white"><div class="p-4 text-sm space-y-2 flex flex-col justify-between h-full"><div class="text-gray-900 font-bold hover:text-gray-600 break-all">ShipmentPrepared</div><div class="text-gray-500 text-xs font-normal mt-2 ">Event represents when a shipment has finished being prepared and is ready to be dispatched.
10
+ </div></div></div></button></li></ul></div><div><span class="font-bold block py-2">Services <!-- --> <!-- -->(<!-- -->4<!-- -->)</span><ul class="space-y-4 overflow-auto"><li class="flex"><button type="button" class="flex shadow-sm rounded-md w-full text-left border "><div style="background:#5b5ad5" class="bg-red-500 flex-shrink-0 flex h-full items-center justify-center w-4 text-white text-sm font-medium rounded-l-md"></div><div class="w-full rounded-r-md border-t border-r border-b bg-white"><div class="p-4 text-sm space-y-2 flex flex-col justify-between h-full"><div class="text-gray-900 font-bold hover:text-gray-600 break-all">Basket Service</div><div class="text-gray-500 text-xs font-normal mt-2 ">CRUD based API to handle Basket interactions for users of the shopping website.
11
+ </div></div></div></button></li><li class="flex"><button type="button" class="flex shadow-sm rounded-md w-full text-left border "><div style="background:#45603f" class="bg-red-500 flex-shrink-0 flex h-full items-center justify-center w-4 text-white text-sm font-medium rounded-l-md"></div><div class="w-full rounded-r-md border-t border-r border-b bg-white"><div class="p-4 text-sm space-y-2 flex flex-col justify-between h-full"><div class="text-gray-900 font-bold hover:text-gray-600 break-all">Data Lake</div><div class="text-gray-500 text-xs font-normal mt-2 ">Our internal datalake used by the data team and business analytics.
12
+ </div></div></div></button></li><li class="flex"><button type="button" class="flex shadow-sm rounded-md w-full text-left border "><div style="background:#5b7e99" class="bg-red-500 flex-shrink-0 flex h-full items-center justify-center w-4 text-white text-sm font-medium rounded-l-md"></div><div class="w-full rounded-r-md border-t border-r border-b bg-white"><div class="p-4 text-sm space-y-2 flex flex-col justify-between h-full"><div class="text-gray-900 font-bold hover:text-gray-600 break-all">Payment Service</div><div class="text-gray-500 text-xs font-normal mt-2 ">Event based application that integrates with Stripe.
13
+ </div></div></div></button></li><li class="flex"><button type="button" class="flex shadow-sm rounded-md w-full text-left border "><div style="background:#438ef7" class="bg-red-500 flex-shrink-0 flex h-full items-center justify-center w-4 text-white text-sm font-medium rounded-l-md"></div><div class="w-full rounded-r-md border-t border-r border-b bg-white"><div class="p-4 text-sm space-y-2 flex flex-col justify-between h-full"><div class="text-gray-900 font-bold hover:text-gray-600 break-all">Shipping Service</div><div class="text-gray-500 text-xs font-normal mt-2 ">Event based application that handles processing of shipments, preparing them and dispatching them.
14
+ </div></div></div></button></li></ul></div></div></div><div class="bg-gray-200 h-screen col-span-5"></div></div></div><footer class="bg-gray-800"><div class="max-w-7xl mx-auto py-12 px-4 overflow-hidden sm:px-6 lg:px-8"><nav class="-mx-5 -my-2 flex flex-wrap justify-center" aria-label="Footer"><div class="px-5 py-2"><a href="/events" class="text-base text-gray-500 hover:text-gray-900">Events</a></div><div class="px-5 py-2"><a href="/services" class="text-base text-gray-500 hover:text-gray-900">Services</a></div><div class="px-5 py-2"><a href="/overview" class="text-base text-gray-500 hover:text-gray-900">3D Node Graph</a></div><div class="px-5 py-2"><a href="https://github.com/boyney123/eventcatalog-demo/edit/master" class="text-base text-gray-500 hover:text-gray-900">GitHub</a></div></nav><p class="mt-8 text-center text-base text-gray-400">Copyright © <!-- -->2022<!-- --> <!-- -->Your Company<!-- -->. Built with<!-- --> <a class="underline" href="https://eventcatalog.dev" target="_blank" rel="noreferrer">EventCatalog.</a></p></div></footer></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{"events":[{"name":"AddedItemToCart","version":"0.0.3","summary":"Holds information about what the user added to their shopping cart.\n","producers":["Basket Service"],"consumers":["Data Lake"],"owners":["dboyne","mSmith"],"externalLinks":[{"label":"AsyncAPI Specification","url":"https://studio.asyncapi.com/#schema-lightMeasuredPayload"}],"historicVersions":["0.0.2","0.0.1"]},{"name":"OrderComplete","version":"0.0.1","summary":"Event represents when an order has been complete. (Delivered and finished)\n","producers":["Orders Service"],"consumers":["Data Lake"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]},{"name":"OrderConfirmed","version":"0.0.1","summary":"Event represents when an order has been confirmed and ready to be processed (shipped for example)\n","producers":["Orders Service"],"consumers":["Shipping Service"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]},{"name":"OrderRequested","version":"0.0.1","summary":"Holds information about the customers order.\n","producers":["Basket Service"],"consumers":["Payment Service"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]},{"name":"PaymentProcessed","version":"0.0.1","summary":"Holds information about the payment that has been processed.\n","producers":["Payment Service"],"consumers":["Orders Service"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]},{"name":"RemovedItemFromCart","version":"0.0.1","summary":"Holds information about what the user removed from their cart.\n","producers":["Basket Service"],"consumers":["Data Lake"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]},{"name":"ShipmentDelivered","version":"0.0.1","summary":"Event represents when a shipment has been delivered and received.\n","producers":["Shipping Service"],"consumers":["Order Service","Data Lake"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]},{"name":"ShipmentDispatched","version":"0.0.1","summary":"Event represents when a shipment has been dispatched.\n","producers":["Shipping Service"],"consumers":["Shipping Service"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]},{"name":"ShipmentPrepared","version":"0.0.1","summary":"Event represents when a shipment has finished being prepared and is ready to be dispatched.\n","producers":["Shipping Service"],"consumers":["Shipping Service"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]}],"services":[{"name":"Basket Service","summary":"CRUD based API to handle Basket interactions for users of the shopping website.\n","owners":["dboyne"],"repository":{"language":"JavaScript","url":"https://github.com/boyney123/pretend-basket-service"},"tags":[],"externalLinks":[{"label":"AsyncAPI Specification","url":"https://studio.asyncapi.com/#schema-lightMeasuredPayload"}],"publishes":[{"name":"AddedItemToCart","version":"0.0.3","summary":"Holds information about what the user added to their shopping cart.\n","producers":["Basket Service"],"consumers":["Data Lake"],"owners":["dboyne","mSmith"],"externalLinks":[{"label":"AsyncAPI Specification","url":"https://studio.asyncapi.com/#schema-lightMeasuredPayload"}],"historicVersions":["0.0.2","0.0.1"]},{"name":"OrderRequested","version":"0.0.1","summary":"Holds information about the customers order.\n","producers":["Basket Service"],"consumers":["Payment Service"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]},{"name":"RemovedItemFromCart","version":"0.0.1","summary":"Holds information about what the user removed from their cart.\n","producers":["Basket Service"],"consumers":["Data Lake"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]}],"subscribes":[]},{"name":"Data Lake","summary":"Our internal datalake used by the data team and business analytics.\n","owners":["dboyne"],"repository":{},"tags":[],"externalLinks":[],"publishes":[],"subscribes":[{"name":"AddedItemToCart","version":"0.0.3","summary":"Holds information about what the user added to their shopping cart.\n","producers":["Basket Service"],"consumers":["Data Lake"],"owners":["dboyne","mSmith"],"externalLinks":[{"label":"AsyncAPI Specification","url":"https://studio.asyncapi.com/#schema-lightMeasuredPayload"}],"historicVersions":["0.0.2","0.0.1"]},{"name":"OrderComplete","version":"0.0.1","summary":"Event represents when an order has been complete. (Delivered and finished)\n","producers":["Orders Service"],"consumers":["Data Lake"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]},{"name":"RemovedItemFromCart","version":"0.0.1","summary":"Holds information about what the user removed from their cart.\n","producers":["Basket Service"],"consumers":["Data Lake"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]},{"name":"ShipmentDelivered","version":"0.0.1","summary":"Event represents when a shipment has been delivered and received.\n","producers":["Shipping Service"],"consumers":["Order Service","Data Lake"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]}]},{"name":"Payment Service","summary":"Event based application that integrates with Stripe.\n","owners":["dboyne"],"repository":{},"tags":[],"externalLinks":[],"publishes":[{"name":"PaymentProcessed","version":"0.0.1","summary":"Holds information about the payment that has been processed.\n","producers":["Payment Service"],"consumers":["Orders Service"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]}],"subscribes":[{"name":"OrderRequested","version":"0.0.1","summary":"Holds information about the customers order.\n","producers":["Basket Service"],"consumers":["Payment Service"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]}]},{"name":"Shipping Service","summary":"Event based application that handles processing of shipments, preparing them and dispatching them.\n","owners":["dboyne"],"repository":{"language":"JavaScript","url":"https://github.com/boyney123/pretend-shipping-service"},"tags":[],"externalLinks":[],"publishes":[{"name":"ShipmentDelivered","version":"0.0.1","summary":"Event represents when a shipment has been delivered and received.\n","producers":["Shipping Service"],"consumers":["Order Service","Data Lake"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]},{"name":"ShipmentDispatched","version":"0.0.1","summary":"Event represents when a shipment has been dispatched.\n","producers":["Shipping Service"],"consumers":["Shipping Service"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]},{"name":"ShipmentPrepared","version":"0.0.1","summary":"Event represents when a shipment has finished being prepared and is ready to be dispatched.\n","producers":["Shipping Service"],"consumers":["Shipping Service"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]}],"subscribes":[{"name":"OrderConfirmed","version":"0.0.1","summary":"Event represents when an order has been confirmed and ready to be processed (shipped for example)\n","producers":["Orders Service"],"consumers":["Shipping Service"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]},{"name":"ShipmentDispatched","version":"0.0.1","summary":"Event represents when a shipment has been dispatched.\n","producers":["Shipping Service"],"consumers":["Shipping Service"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]},{"name":"ShipmentPrepared","version":"0.0.1","summary":"Event represents when a shipment has finished being prepared and is ready to be dispatched.\n","producers":["Shipping Service"],"consumers":["Shipping Service"],"owners":["dboyne","mSmith"],"externalLinks":[],"historicVersions":[]}]}]},"__N_SSG":true},"page":"/visualiser","query":{},"buildId":"7llqY64OLAlXQNo-YhXyr","isFallback":false,"gsp":true,"scriptLoader":[]}</script></body></html>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@eventcatalog/core",
3
- "version": "0.1.12",
3
+ "version": "0.1.16",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -28,6 +28,7 @@
28
28
  "@tailwindcss/typography": "^0.4.1",
29
29
  "compare-versions": "^4.1.2",
30
30
  "copy-text-to-clipboard": "^3.0.1",
31
+ "dagre": "^0.8.5",
31
32
  "diff": "^5.0.0",
32
33
  "diff2html": "^3.4.13",
33
34
  "fs-extra": "^10.0.0",
@@ -38,6 +39,7 @@
38
39
  "next-mdx-remote": "^3.0.8",
39
40
  "react": "17.0.2",
40
41
  "react-dom": "17.0.2",
42
+ "react-flow-renderer": "^9.7.3",
41
43
  "react-force-graph-3d": "^1.21.10",
42
44
  "react-syntax-highlighter": "^15.4.5"
43
45
  },
@@ -19,6 +19,7 @@ import { getAllEvents, getEventByName } from '@/lib/events';
19
19
  import { useConfig, useUrl } from '@/hooks/EventCatalog';
20
20
 
21
21
  import { MarkdownFile } from '@/types/index';
22
+ import NodeGraph from '@/components/Mdx/NodeGraph/NodeGraph';
22
23
 
23
24
  export interface EventsPageProps {
24
25
  event: Event;
@@ -33,14 +34,16 @@ export const getComponents = ({ event, schema, examples }: any) => ({
33
34
 
34
35
  return match ? <SyntaxHighlighter language={match[1]} {...props} /> : <code className={className} {...props} />;
35
36
  },
36
- Schema: ({ title = 'Event Schema' }: { title: string }) => {
37
+ Schema: ({ title }: { title: string }) => {
37
38
  if (!schema) return null;
38
39
 
39
40
  return (
40
41
  <section className="mt-8 xl:mt-10">
41
- <h2 id="activity-title" className="text-lg font-medium text-gray-900 underline">
42
- {title}
43
- </h2>
42
+ {title && (
43
+ <h2 id="activity-title" className="text-lg font-medium text-gray-900 underline">
44
+ {title}
45
+ </h2>
46
+ )}
44
47
  <SyntaxHighlighter language={schema.language} showLineNumbers={false} name={`${event.name} Schema (${schema.language})`}>
45
48
  {schema.snippet}
46
49
  </SyntaxHighlighter>
@@ -48,12 +51,12 @@ export const getComponents = ({ event, schema, examples }: any) => ({
48
51
  );
49
52
  },
50
53
  SchemaViewer: ({
51
- title = 'Event Schema',
54
+ title,
52
55
  renderRootTreeLines = false,
53
56
  defaultExpandedDepth = 1,
54
57
  maxHeight,
55
58
  }: {
56
- title: string;
59
+ title?: string;
57
60
  renderRootTreeLines?: boolean;
58
61
  defaultExpandedDepth?: number;
59
62
  maxHeight?: string;
@@ -62,7 +65,7 @@ export const getComponents = ({ event, schema, examples }: any) => ({
62
65
 
63
66
  return (
64
67
  <section className="mt-8 xl:mt-10">
65
- <h2 className="text-lg font-medium text-gray-900 underline">{title}</h2>
68
+ {title && <h2 className="text-lg font-medium text-gray-900 underline">{title}</h2>}
66
69
  <SchemaViewer
67
70
  schema={schema.snippet}
68
71
  maxHeight={parseInt(maxHeight, 10)}
@@ -82,12 +85,47 @@ export const getComponents = ({ event, schema, examples }: any) => ({
82
85
  );
83
86
  return null;
84
87
  },
85
- Mermaid: ({ title, charts }: { title: string; charts?: string[] }) => (
88
+ Mermaid: ({ title, charts }: { title?: string; charts?: string[] }) => (
86
89
  <div className="mx-auto w-full py-10">
87
90
  {title && <h2 className="text-lg font-medium text-gray-900 underline">{title}</h2>}
88
91
  <Mermaid source="event" data={event} rootNodeColor={getBackgroundColor(event.name)} charts={charts} />
89
92
  </div>
90
93
  ),
94
+ NodeGraph: ({
95
+ title,
96
+ maxHeight,
97
+ maxZoom,
98
+ fitView,
99
+ zoomOnScroll,
100
+ isAnimated,
101
+ isDraggable,
102
+ }: // isHorizontal,
103
+ {
104
+ title?: string;
105
+ maxHeight?: number;
106
+ maxZoom?: number;
107
+ fitView?: boolean;
108
+ zoomOnScroll?: boolean;
109
+ isAnimated?: boolean;
110
+ isDraggable?: boolean;
111
+ // isHorizontal?: boolean;
112
+ }) => (
113
+ <div className="mx-auto w-full">
114
+ {title && <h2 className="text-lg font-medium text-gray-900 underline">{title}</h2>}
115
+ <NodeGraph
116
+ source="event"
117
+ data={event}
118
+ rootNodeColor={getBackgroundColor(event.name)}
119
+ maxHeight={maxHeight}
120
+ maxZoom={maxZoom}
121
+ fitView={fitView}
122
+ zoomOnScroll={zoomOnScroll}
123
+ isAnimated={isAnimated}
124
+ isDraggable={isDraggable}
125
+ // isHorizontal={isHorizontal}
126
+ />
127
+ </div>
128
+ ),
91
129
  });
92
130
 
93
131
  export default function Events(props: EventsPageProps) {
@@ -14,6 +14,7 @@ import getBackgroundColor from '@/utils/random-bg';
14
14
  import { useConfig, useUrl } from '@/hooks/EventCatalog';
15
15
 
16
16
  import { MarkdownFile } from '@/types/index';
17
+ import NodeGraph from '@/components/Mdx/NodeGraph/NodeGraph';
17
18
 
18
19
  interface ServicesPageProps {
19
20
  service: Service;
@@ -21,7 +22,7 @@ interface ServicesPageProps {
21
22
  notFound?: boolean;
22
23
  }
23
24
 
24
- function MermaidComponent({ title, service, charts }: { title: string; service: Service; charts?: string[] }) {
25
+ function MermaidComponent({ title, service, charts }: { title?: string; service: Service; charts?: string[] }) {
25
26
  return (
26
27
  <div className="mx-auto w-full py-10">
27
28
  {title && <h2 className="text-lg font-medium text-gray-900 underline">{title}</h2>}
@@ -35,6 +36,41 @@ const getComponents = (service) => ({
35
36
  Mermaid: ({ title, charts }: { title: string; charts?: string[] }) => (
36
37
  <MermaidComponent service={service} title={title} charts={charts} />
37
38
  ),
39
+ NodeGraph: ({
40
+ title,
41
+ maxHeight,
42
+ maxZoom,
43
+ fitView,
44
+ zoomOnScroll,
45
+ isAnimated,
46
+ isDraggable,
47
+ }: // isHorizontal,
48
+ {
49
+ title?: string;
50
+ maxHeight?: number;
51
+ maxZoom?: number;
52
+ fitView?: boolean;
53
+ zoomOnScroll?: boolean;
54
+ isAnimated?: boolean;
55
+ isDraggable?: boolean;
56
+ // isHorizontal?: boolean;
57
+ }) => (
58
+ <div className="mx-auto w-full">
59
+ {title && <h2 className="text-lg font-medium text-gray-900 underline">{title}</h2>}
60
+ <NodeGraph
61
+ source="service"
62
+ data={service}
63
+ rootNodeColor={getBackgroundColor(service.name)}
64
+ maxHeight={maxHeight}
65
+ maxZoom={maxZoom}
66
+ fitView={fitView}
67
+ zoomOnScroll={zoomOnScroll}
68
+ isAnimated={isAnimated}
69
+ isDraggable={isDraggable}
70
+ // isHorizontal={isHorizontal}
71
+ />
72
+ </div>
73
+ ),
38
74
  });
39
75
 
40
76
  export default function Services(props: ServicesPageProps) {
@@ -0,0 +1,226 @@
1
+ import React, { useEffect, useState, useCallback } from 'react';
2
+ import Head from 'next/head';
3
+ import { useRouter } from 'next/router';
4
+ import debounce from 'lodash.debounce';
5
+ import type { Event, Service } from '@eventcatalog/types';
6
+
7
+ import { SearchIcon } from '@heroicons/react/outline';
8
+
9
+ import { getAllEvents } from '@/lib/events';
10
+ import { getAllServices } from '@/lib/services';
11
+ import { useConfig } from '@/hooks/EventCatalog';
12
+ import NodeGraph from '@/components/Mdx/NodeGraph/NodeGraph';
13
+ import getBackgroundColor from '@/utils/random-bg';
14
+
15
+ function classNames(...classes) {
16
+ return classes.filter(Boolean).join(' ');
17
+ }
18
+
19
+ export interface PageProps {
20
+ events: Event[];
21
+ services: Service[];
22
+ }
23
+
24
+ function Graph({ events, services }: PageProps) {
25
+ const { title } = useConfig();
26
+ const [searchFilter, setSearchFilter] = useState('');
27
+ const [selectedRootNode, setSelectedRootNode] = useState<any>();
28
+ const [listItemsToRender, setListItemsToRender] = useState({ events, services });
29
+
30
+ const { query, isReady: isRouterReady } = useRouter();
31
+ const { name, type } = query;
32
+
33
+ const handleListItemSelection = (data: Event | Service, dataType: 'event' | 'service') => {
34
+ setSelectedRootNode({ label: data.name, data, type: dataType });
35
+ };
36
+
37
+ const searchOnChange = useCallback(
38
+ debounce((e) => {
39
+ setSearchFilter(e.target.value);
40
+ }, 500),
41
+ [listItemsToRender]
42
+ );
43
+
44
+ const getListItemsToRender = useCallback(() => {
45
+ if (!searchFilter) return { events, services };
46
+ const filteredEvents = events.filter((event) => event.name.indexOf(searchFilter) > -1);
47
+ const filteredServices = services.filter((service) => service.name.indexOf(searchFilter) > -1);
48
+ return { events: filteredEvents, services: filteredServices };
49
+ }, [events, services, searchFilter]);
50
+
51
+ useEffect(() => {
52
+ const filteredListItems = getListItemsToRender();
53
+ setListItemsToRender(filteredListItems);
54
+ }, [searchFilter, getListItemsToRender]);
55
+
56
+ useEffect(() => {
57
+ if (!isRouterReady) return;
58
+
59
+ const initialDataToLoad = events[0];
60
+ const initialSelectedRootNode = { label: initialDataToLoad.name, type: 'event', data: initialDataToLoad };
61
+
62
+ if (name && type) {
63
+ const dataToSearch = type === 'service' ? services : (events as []);
64
+ const match = dataToSearch.find((item) => item.name === name);
65
+ if (match) {
66
+ setSelectedRootNode({ label: match.name, type, data: match });
67
+ } else {
68
+ setSelectedRootNode(initialSelectedRootNode);
69
+ }
70
+ } else {
71
+ setSelectedRootNode(initialSelectedRootNode);
72
+ }
73
+ }, [name, type, events, services, isRouterReady]);
74
+
75
+ return (
76
+ <div className="h-screen overflow-hidden">
77
+ <Head>
78
+ <title>{title} - Visualiser</title>
79
+ </Head>
80
+ <div className="grid grid-cols-6">
81
+ <div className="col-span-1 bg-white px-4 h-screen overflow-auto border-r-2 shadow-md border-gray-200 py-3">
82
+ <div className="border-b border-gray-200 pb-6">
83
+ <div className="mt-1 relative rounded-md shadow-sm">
84
+ <div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
85
+ <SearchIcon className="h-5 w-5 text-gray-400" aria-hidden="true" />
86
+ </div>
87
+ <input
88
+ type="text"
89
+ name="event"
90
+ id="event"
91
+ onChange={searchOnChange}
92
+ placeholder="Find Event or Service"
93
+ className="focus:ring-gray-500 focus:border-gray-500 block w-full pl-10 sm:text-sm border-gray-300 rounded-md"
94
+ />
95
+ </div>
96
+ </div>
97
+
98
+ <div className="space-y-6">
99
+ <div>
100
+ <span className="font-bold block py-2">
101
+ Events {` `}
102
+ {searchFilter && (
103
+ <>
104
+ ({listItemsToRender.events.length}/{events.length})
105
+ </>
106
+ )}
107
+ {!searchFilter && <>({events.length})</>}
108
+ </span>
109
+ {listItemsToRender.events.length === 0 && <span className="text-sm text-gray-300">No Events Found</span>}
110
+ <ul className="space-y-4 overflow-auto">
111
+ {listItemsToRender.events.map((event) => {
112
+ const isSelected = selectedRootNode ? selectedRootNode.label === event.name : false;
113
+ return (
114
+ <ListItem
115
+ type="event"
116
+ key={event.name}
117
+ data={event}
118
+ onClick={(e) => handleListItemSelection(e.data, 'event')}
119
+ isSelected={isSelected}
120
+ />
121
+ );
122
+ })}
123
+ </ul>
124
+ </div>
125
+ <div>
126
+ <span className="font-bold block py-2">
127
+ Services {` `}
128
+ {searchFilter && (
129
+ <>
130
+ ({listItemsToRender.services.length}/{services.length})
131
+ </>
132
+ )}
133
+ {!searchFilter && <>({services.length})</>}
134
+ </span>
135
+ {listItemsToRender.services.length === 0 && <span className="text-sm text-gray-300">No Services Found</span>}
136
+ <ul className="space-y-4 overflow-auto">
137
+ {listItemsToRender.services.map((service) => {
138
+ const isSelected = selectedRootNode ? selectedRootNode.label === service.name : false;
139
+ return (
140
+ <ListItem
141
+ type="event"
142
+ key={service.name}
143
+ data={service}
144
+ onClick={(e) => handleListItemSelection(e.data, 'service')}
145
+ isSelected={isSelected}
146
+ />
147
+ );
148
+ })}
149
+ </ul>
150
+ </div>
151
+ </div>
152
+ </div>
153
+ <div className="bg-gray-200 h-screen col-span-5">
154
+ {selectedRootNode && (
155
+ <NodeGraph
156
+ source={selectedRootNode.type}
157
+ data={selectedRootNode.data}
158
+ title="Visualiser"
159
+ subtitle={selectedRootNode.data.name}
160
+ rootNodeColor={getBackgroundColor(selectedRootNode.label)}
161
+ fitView
162
+ isAnimated
163
+ isDraggable
164
+ includeBackground
165
+ renderWithBorder={false}
166
+ maxHeight="100%"
167
+ includeEdgeLabels
168
+ includeNodeIcons
169
+ />
170
+ )}
171
+ </div>
172
+ </div>
173
+ </div>
174
+ );
175
+ }
176
+
177
+ interface ListItemProps {
178
+ data: Service | Event;
179
+ // eslint-disable-next-line no-unused-vars
180
+ onClick(data: { data: Event | Service; type: string }): void;
181
+ type: 'event' | 'service';
182
+ isSelected: boolean;
183
+ }
184
+
185
+ function ListItem({ data, onClick, type, isSelected }: ListItemProps) {
186
+ const border = isSelected ? 'border-green-500 bg-green-50 shadow-md ' : '';
187
+ return (
188
+ <li className="flex">
189
+ <button
190
+ type="button"
191
+ onClick={() => onClick({ data, type })}
192
+ className={`flex shadow-sm rounded-md w-full text-left border ${border}`}
193
+ >
194
+ <div
195
+ style={{
196
+ background: getBackgroundColor(data.name),
197
+ }}
198
+ className={classNames(
199
+ 'bg-red-500',
200
+ 'flex-shrink-0 flex h-full items-center justify-center w-4 text-white text-sm font-medium rounded-l-md'
201
+ )}
202
+ />
203
+ <div className={`w-full rounded-r-md border-t border-r border-b ${isSelected ? 'bg-green-50' : 'bg-white'}`}>
204
+ <div className="p-4 text-sm space-y-2 flex flex-col justify-between h-full">
205
+ <div className="text-gray-900 font-bold hover:text-gray-600 break-all">{data.name}</div>
206
+ <div className="text-gray-500 text-xs font-normal mt-2 ">{data.summary}</div>
207
+ </div>
208
+ </div>
209
+ </button>
210
+ </li>
211
+ );
212
+ }
213
+
214
+ export default Graph;
215
+
216
+ export const getStaticProps = () => {
217
+ const events = getAllEvents();
218
+ const services = getAllServices();
219
+
220
+ return {
221
+ props: {
222
+ events,
223
+ services,
224
+ },
225
+ };
226
+ };
@@ -46,3 +46,7 @@ event-table thead th {
46
46
  background-color: rgba(0, 0, 0, 0.5);
47
47
  user-select: none;
48
48
  }
49
+
50
+ .react-flow__controls-no-shadow{
51
+ box-shadow: none !important;
52
+ }
@@ -1 +0,0 @@
1
- self.__BUILD_MANIFEST=function(s,e,c,a,t,n,i,f,r,v,b,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-1f39499146c9c75f.js"],"/events/[name]":[s,n,i,f,e,c,r,v,a,b,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,r,v,a,b,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-f52121c6dc1211aa.js"],"/services/[name]":[s,e,c,a,"static/chunks/pages/services/[name]-d8873d29190a6447.js"],"/users/[id]":[s,c,"static/chunks/pages/users/[id]-d3140bb155f8fb45.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-7c4681dab353ec23.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();
@@ -1 +0,0 @@
1
- self.__SSG_MANIFEST=new Set(["\u002Foverview","\u002Fevents","\u002Fservices","\u002Fevents\u002F[name]\u002Flogs","\u002Fservices\u002F[name]","\u002Fusers\u002F[id]","\u002Fevents\u002F[name]","\u002Fevents\u002F[name]\u002Fv\u002F[version]"]);self.__SSG_MANIFEST_CB&&self.__SSG_MANIFEST_CB()
@@ -1 +0,0 @@
1
- (self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[178],{81178:function(e,n,t){"use strict";t.r(n),t.d(n,{__N_SSG:function(){return R},default:function(){return U},getComponents:function(){return T}});var r=t(52322),a=t(97729),s=t(23816),l=t(61790),i=t(2784),c=t(63548),o=t(86562),d=t(85411);function m(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function u(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{},r=Object.keys(t);"function"===typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),r.forEach((function(n){m(e,n,t[n])}))}return e}function x(e,n){if(null==e)return{};var t,r,a=function(e,n){if(null==e)return{};var t,r,a={},s=Object.keys(e);for(r=0;r<s.length;r++)t=s[r],n.indexOf(t)>=0||(a[t]=e[t]);return a}(e,n);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(e);for(r=0;r<s.length;r++)t=s[r],n.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(a[t]=e[t])}return a}var h=function(e){var n=e.language,t=e.name,a=void 0===t?"":t,s=x(e,["language","name"]),l=(0,i.useState)(!1),m=l[0],h=l[1];return(0,r.jsxs)("div",{className:"relative group",children:[(0,r.jsx)("button",{type:"button",onClick:function(){(0,d.Z)(s.children),h(!0),setTimeout((function(){return h(!1)}),2e3)},className:"absolute top-2 right-5 text-sm bg-gray-700 text-white rounded-md py-1 px-4 transform transition opacity-0 group-hover:opacity-100",children:m?"Copied":"Copy"}),(0,r.jsx)(o.Z,u({style:c.Z,language:n},s,{wrapLines:!0,className:"max-h-96 overflow-auto",children:s.children.replace(/\\n/g,"\n")})),a&&(0,r.jsx)("span",{className:"-mb-2 block text-xs text-right font-bold",children:a})]})};function f(){for(var e=arguments.length,n=new Array(e),t=0;t<e;t++)n[t]=arguments[t];return n.filter(Boolean).join(" ")}var g=function(e){var n=e.title,t=void 0===n?"Examples":n,a=e.description,s=e.examples,l=void 0===s?[]:s,c=e.showLineNumbers,o=l.map((function(e,n){return{name:e.name||"Example ".concat(n+1),content:e.snippet,description:e.description,langugage:e.langugage}})),d=(0,i.useState)(o[0]),m=d[0],u=d[1];return(0,r.jsx)("div",{className:"my-5 examples",children:(0,r.jsxs)("div",{className:"",children:[(0,r.jsx)("h2",{className:"text-lg font-medium text-gray-700 underline",children:t}),a&&(0,r.jsx)("p",{className:"text-md font-medium text-gray-700",children:a}),(0,r.jsxs)("div",{children:[(0,r.jsx)("nav",{className:"-mb-px flex","aria-label":"Tabs",children:o.map((function(e){var n=e.name===m.name;return(0,r.jsxs)("button",{type:"button",onClick:function(){return function(e){u(e)}(e)},className:f(n?"border-green-500 text-green-600 selected":"border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300","whitespace-nowrap py-4 border-b-2 font-medium text-sm important:no-underline px-8 hover:bg-gray-50 transition"),"aria-current":n?"page":void 0,children:[e.name,(0,r.jsxs)("span",{className:"block text-xs mt-",children:["(",e.langugage,")"]})]},e.name)}))}),(0,r.jsxs)("div",{className:"my-4",children:[(0,r.jsx)(h,{language:m.langugage,showLineNumbers:c,children:m.content}),m.langugage&&(0,r.jsx)("span",{className:"-mb-2 block text-xs text-right font-bold",children:m.name})]})]})]})})},p=t(46892),j=t(62455),v=t(4573),b=t(39097),y=t(70314),N=t(17962),w=t(55008);var O=function(e){var n=e.event,t=e.loadedVersion,a=e.isOldVersion,s=(0,w.aF)().getUserById,l=n.name,i=n.owners,c=n.producers,o=n.consumers,d=n.historicVersions,m=n.externalLinks,u=n.schema,x=(0,y.default)().publicRuntimeConfig,h=(void 0===x?{}:x).basePath,f=void 0===h?"":h;return(0,r.jsxs)("aside",{className:"hidden xl:block xl:pl-8",children:[(0,r.jsx)("h2",{className:"sr-only",children:"Details"}),(0,r.jsx)("div",{className:"pt-6 py-6 space-y-8",children:(0,r.jsxs)("div",{children:[(0,r.jsxs)("h2",{className:"text-sm font-medium text-gray-500",children:[(0,r.jsx)(N.FMB,{className:"h-5 w-5 text-green-400 inline-block mr-2","aria-hidden":"true"}),"Producers"]}),(0,r.jsx)("ul",{className:"mt-2 leading-8",children:c.map((function(e){return(0,r.jsx)("li",{className:"inline mr-1",children:(0,r.jsx)(b.default,{href:"/services/".concat(e),children:(0,r.jsxs)("a",{className:"relative inline-flex items-center rounded-full border border-gray-300 px-3 py-0.5",children:[(0,r.jsx)("div",{className:"absolute flex-shrink-0 flex items-center justify-center",children:(0,r.jsx)("span",{className:"h-1.5 w-1.5 rounded-full bg-green-500 animate animate-pulse","aria-hidden":"true"})}),(0,r.jsx)("div",{className:"ml-3.5 text-sm font-medium text-gray-900",children:e})]})})},e)}))})]})}),(0,r.jsx)("div",{className:"border-t border-gray-200 py-6 space-y-8",children:(0,r.jsxs)("div",{children:[(0,r.jsxs)("h2",{className:"text-sm font-medium text-gray-500",children:[(0,r.jsx)(N.FMB,{className:"h-5 w-5 text-indigo-400 inline-block mr-2","aria-hidden":"true"}),"Consumers"]}),(0,r.jsx)("ul",{className:"mt-2 leading-8",children:o.map((function(e){return(0,r.jsx)("li",{className:"inline",children:(0,r.jsx)(b.default,{href:"/services/".concat(e),children:(0,r.jsxs)("a",{href:"#",className:"relative inline-flex items-center rounded-full border border-gray-300 px-3 py-0.5",children:[(0,r.jsx)("div",{className:"absolute flex-shrink-0 flex items-center justify-center",children:(0,r.jsx)("span",{className:"h-1.5 w-1.5 rounded-full bg-indigo-500 animate animate-pulse","aria-hidden":"true"})}),(0,r.jsx)("div",{className:"ml-3.5 text-sm font-medium text-gray-900",children:e})]})})},e)}))})]})}),d.length>0&&(0,r.jsx)("div",{className:"border-t border-gray-200 py-6",children:(0,r.jsxs)("div",{children:[(0,r.jsx)("h2",{className:"text-sm font-medium text-gray-500",children:"Event Versions"}),(0,r.jsxs)("ul",{className:"mt-2 leading-8 text-left text-blue-500",children:[(0,r.jsx)("li",{className:"text-sm inline ",children:(0,r.jsx)(b.default,{href:"/events/".concat(l),children:(0,r.jsx)("a",{children:(0,r.jsx)("span",{className:"inline-flex mr-2 items-center px-2.5 py-0.5 rounded-full text-xs font-medium -top-0.5 relative ".concat("latest"===t?"bg-blue-400 text-white shadow-md font-bold underline":"bg-blue-100 text-blue-800"),children:"Latest"})})})}),d.map((function(e){var n=t===e?"bg-blue-400 text-white shadow-md font-bold underline":"bg-blue-100 text-blue-800";return(0,r.jsx)("li",{className:"text-sm inline",children:(0,r.jsx)(b.default,{href:"/events/".concat(l,"/v/").concat(e),children:(0,r.jsx)("a",{children:(0,r.jsxs)("span",{className:"inline-flex mr-2 items-center px-2.5 py-0.5 rounded-full text-xs font-medium -top-0.5 relative ".concat(n),children:["v",e]})})})},e)}))]})]})}),i&&i.length>0&&(0,r.jsx)("div",{className:"border-t border-gray-200 py-6 space-y-8",children:(0,r.jsxs)("div",{children:[(0,r.jsx)("h2",{className:"text-sm font-medium text-gray-500",children:"Event Owners"}),(0,r.jsx)("ul",{className:"mt-4 leading-8 space-y-2",children:i.map((function(e){var n=s(e);return n?(0,r.jsx)("li",{className:"flex justify-start",children:(0,r.jsx)(b.default,{href:"/users/".concat(e),children:(0,r.jsxs)("a",{className:"flex items-center space-x-3",children:[(0,r.jsx)("div",{className:"flex-shrink-0",children:(0,r.jsx)("img",{className:"h-5 w-5 rounded-full",src:n.avatarUrl,alt:""})}),(0,r.jsx)("div",{className:"text-sm font-medium text-gray-900",children:n.name})]})})},e):null}))})]})}),(0,r.jsxs)("div",{className:"border-t border-gray-200 py-6 space-y-1",children:[u&&(0,r.jsxs)("a",{href:u?a?"".concat(f,"/schemas/").concat(l,"/").concat(t,"/schema.").concat(u.extension):"".concat(f,"/schemas/").concat(l,"/schema.").concat(u.extension):null,download:"".concat(l,"(").concat(n.version,").").concat(u.extension),className:"hidden w-full 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-200 bg-gray-800 hover:bg-gray-600 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-900",children:[(0,r.jsx)(N._8t,{className:"-ml-1 mr-2 h-5 w-5 text-gray-200","aria-hidden":"true"}),(0,r.jsx)("span",{children:"Download Schema"})]}),d.length>0&&(0,r.jsx)(b.default,{href:"/events/".concat(l,"/logs"),children:(0,r.jsx)("a",{className:"hidden w-full 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-800 hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-200",children:(0,r.jsx)("span",{children:"View Changes"})})}),m.length>0&&m.map((function(e){return(0,r.jsxs)("a",{href:e.url,target:"_blank",type:"button",className:"hidden w-full md:inline-flex h-10 justify-center px-4 py-2 border border-teal-300 shadow-sm text-sm font-medium rounded-md text-teal-800 hover:bg-teal-100 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-teal-200",rel:"noreferrer",children:[(0,r.jsx)(N.h0n,{className:"-ml-1 mr-2 h-5 w-5 text-teal-200","aria-hidden":"true"}),(0,r.jsx)("span",{children:"".concat(e.label)})]},e.url)}))]})]})},E=t(4488),k=t(52428),S=t(57840),V=t(69931),P=t(81669),C=t.n(P);(0,V.fH)();var _=function(e){var n=e.schema,t=e.maxHeight,a=e.renderRootTreeLines,s=void 0!==a&&a,l=e.hideExamples,c=void 0!==l&&l,o=e.defaultExpandedDepth,d=void 0===o?1:o,m=(0,i.useMemo)((function(){return JSON.parse(n)}),[n]);return(0,r.jsx)(S.K,{schema:m,emptyText:"No schema defined",maxHeight:t,defaultExpandedDepth:d,renderRootTreeLines:s,hideExamples:c,className:C().schemaViewer})};function L(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function D(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{},r=Object.keys(t);"function"===typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(t).filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})))),r.forEach((function(n){L(e,n,t[n])}))}return e}function Z(e,n){if(null==e)return{};var t,r,a=function(e,n){if(null==e)return{};var t,r,a={},s=Object.keys(e);for(r=0;r<s.length;r++)t=s[r],n.indexOf(t)>=0||(a[t]=e[t]);return a}(e,n);if(Object.getOwnPropertySymbols){var s=Object.getOwnPropertySymbols(e);for(r=0;r<s.length;r++)t=s[r],n.indexOf(t)>=0||Object.prototype.propertyIsEnumerable.call(e,t)&&(a[t]=e[t])}return a}var R=!0,T=function(e){var n=e.event,t=e.schema,a=e.examples;return{code:function(e){var n=e.className,t=Z(e,["className"]),a=/language-(\w+)/.exec(n||"");return a?(0,r.jsx)(h,D({language:a[1]},t)):(0,r.jsx)("code",D({className:n},t))},Schema:function(e){var a=e.title,s=void 0===a?"Event Schema":a;return t?(0,r.jsxs)("section",{className:"mt-8 xl:mt-10",children:[(0,r.jsx)("h2",{id:"activity-title",className:"text-lg font-medium text-gray-900 underline",children:s}),(0,r.jsx)(h,{language:t.language,showLineNumbers:!1,name:"".concat(n.name," Schema (").concat(t.language,")"),children:t.snippet})]}):null},SchemaViewer:function(e){var n=e.title,a=void 0===n?"Event Schema":n,s=e.renderRootTreeLines,l=void 0!==s&&s,i=e.defaultExpandedDepth,c=void 0===i?1:i,o=e.maxHeight;return t?(0,r.jsxs)("section",{className:"mt-8 xl:mt-10",children:[(0,r.jsx)("h2",{className:"text-lg font-medium text-gray-900 underline",children:a}),(0,r.jsx)(_,{schema:t.snippet,maxHeight:parseInt(o,10),renderRootTreeLines:l,defaultExpandedDepth:c})]}):null},Admonition:l.Z,EventExamples:function(e){return a.length>0?(0,r.jsx)(g,D({},e,{examples:a,showLineNumbers:!0})):(console.log("You are using the <EventExamples /> component without any examples, please read https://eventcatalog.dev/docs/events/adding-examples for more information"),null)},Mermaid:function(e){var t=e.title,a=e.charts;return(0,r.jsxs)("div",{className:"mx-auto w-full py-10",children:[t&&(0,r.jsx)("h2",{className:"text-lg font-medium text-gray-900 underline",children:t}),(0,r.jsx)(v.Z,{source:"event",data:n,rootNodeColor:(0,p.Z)(n.name),charts:a})]})}}};function U(e){var n=e.event,t=e.markdown,l=e.loadedVersion,i=e.notFound,c=(0,w.ZR)().title,o=(0,w.wG)(),d=o.getEditUrl,m=o.hasEditUrl,u=n.name,x=n.summary,h=n.draft,f=n.schema,g=n.examples,p=n.version;if(i)return(0,r.jsx)(E.Z,{type:"event",name:n.name,editUrl:m?d("/events/".concat(u,"/index.md")):""});var v=t.lastModifiedDate,b=[{name:"Events",href:"/events",current:!1},{name:u,href:"/services/".concat(u),current:!0}],y=T({event:n,schema:f,examples:g});return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(a.default,{children:(0,r.jsxs)("title",{children:[c," - ",u," v",p]})}),(0,r.jsx)(j.Z,{title:u,editUrl:m?d("/events/".concat(u,"/index.md")):"",subtitle:x,draft:h,lastModifiedDate:v,tags:[{label:"v".concat(p)}],breadCrumbs:(0,r.jsx)(k.Z,{pages:b}),isOldVersion:"latest"!==l,latestVersionUrl:"/events/".concat(u),version:l,sidebar:(0,r.jsx)(O,{event:n,loadedVersion:l,isOldVersion:"latest"!==l}),children:(0,r.jsx)(s.R,D({},t.source,{components:y}))})]})}},81669:function(e){e.exports={schemaViewer:"SchemaViewer_schemaViewer__un45l"}}}]);
@@ -1 +0,0 @@
1
- "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"l-".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--\x3er-").concat(n.id,"[").concat(n.name,"]:::consumer\n")})).join(""),"\n").concat(n.map((function(e){return"click l-".concat(e.id,' href "').concat(e.link,'" "Go to ').concat(e.name,'" _self\n')})).join(""),"\n").concat(t.map((function(e){return"click r-".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=r.map(d).map((function(e){return{id:e.name.replace(/ /g,"_"),name:e.name,link:m(e.name,"events")}})),i=t.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}})}}]);
@@ -1 +0,0 @@
1
- "use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[519],{61519:function(e,t,n){n.d(t,{v4q:function(){return a},dNJ:function(){return l},Qrl:function(){return i},SI8:function(){return u},tvw:function(){return c},AV5:function(){return o},vdY:function(){return v},W1M:function(){return d}});var r=n(2784);var a=function(e){return r.createElement("svg",Object.assign({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",fill:"currentColor","aria-hidden":"true"},e),r.createElement("path",{fillRule:"evenodd",d:"M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z",clipRule:"evenodd"}))};var l=function(e){return r.createElement("svg",Object.assign({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",fill:"currentColor","aria-hidden":"true"},e),r.createElement("path",{fillRule:"evenodd",d:"M12.316 3.051a1 1 0 01.633 1.265l-4 12a1 1 0 11-1.898-.632l4-12a1 1 0 011.265-.633zM5.707 6.293a1 1 0 010 1.414L3.414 10l2.293 2.293a1 1 0 11-1.414 1.414l-3-3a1 1 0 010-1.414l3-3a1 1 0 011.414 0zm8.586 0a1 1 0 011.414 0l3 3a1 1 0 010 1.414l-3 3a1 1 0 11-1.414-1.414L16.586 10l-2.293-2.293a1 1 0 010-1.414z",clipRule:"evenodd"}))};var i=function(e){return r.createElement("svg",Object.assign({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",fill:"currentColor","aria-hidden":"true"},e),r.createElement("path",{fillRule:"evenodd",d:"M6 2a2 2 0 00-2 2v12a2 2 0 002 2h8a2 2 0 002-2V7.414A2 2 0 0015.414 6L12 2.586A2 2 0 0010.586 2H6zm5 6a1 1 0 10-2 0v2H7a1 1 0 100 2h2v2a1 1 0 102 0v-2h2a1 1 0 100-2h-2V8z",clipRule:"evenodd"}))};var u=function(e){return r.createElement("svg",Object.assign({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",fill:"currentColor","aria-hidden":"true"},e),r.createElement("path",{fillRule:"evenodd",d:"M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z",clipRule:"evenodd"}))};var c=function(e){return r.createElement("svg",Object.assign({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",fill:"currentColor","aria-hidden":"true"},e),r.createElement("path",{d:"M10.707 2.293a1 1 0 00-1.414 0l-7 7a1 1 0 001.414 1.414L4 10.414V17a1 1 0 001 1h2a1 1 0 001-1v-2a1 1 0 011-1h2a1 1 0 011 1v2a1 1 0 001 1h2a1 1 0 001-1v-6.586l.293.293a1 1 0 001.414-1.414l-7-7z"}))};var o=function(e){return r.createElement("svg",Object.assign({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",fill:"currentColor","aria-hidden":"true"},e),r.createElement("path",{fillRule:"evenodd",d:"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z",clipRule:"evenodd"}))};var v=function(e){return r.createElement("svg",Object.assign({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",fill:"currentColor","aria-hidden":"true"},e),r.createElement("path",{d:"M13.586 3.586a2 2 0 112.828 2.828l-.793.793-2.828-2.828.793-.793zM11.379 5.793L3 14.172V17h2.828l8.38-8.379-2.83-2.828z"}))};var d=function(e){return r.createElement("svg",Object.assign({xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",fill:"currentColor","aria-hidden":"true"},e),r.createElement("path",{fillRule:"evenodd",d:"M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z",clipRule:"evenodd"}))}}}]);