From 5ac1d4c2f048a6b444f7ff0b4d72bb59575209ae Mon Sep 17 00:00:00 2001
From: Florian PAUL <florian.paul@amadeus.com>
Date: Wed, 6 Nov 2024 15:18:22 +0100
Subject: [PATCH] feat(training): use markdown for step instructions

---
 apps/showcase/package.json                    |    5 +
 apps/showcase/project.json                    |   15 +-
 apps/showcase/src/app/app.component.html      |    4 +-
 apps/showcase/src/app/app.component.scss      |    1 +
 .../src/assets/trainings/sdk/program.json     |   14 +-
 .../steps/angular-integration/instructions.md |   59 +
 .../steps/date-sdk-generation/instructions.md |   44 +
 .../sdk/steps/introduction/instructions.md    |   32 +
 .../sdk/steps/plugins/instructions.md         |   41 +
 .../sdk/steps/sdk-generation/instructions.md  |   23 +
 .../sdk/steps/typescript-sdk/instructions.md  |   31 +
 .../sdk/steps/welcome/instructions.md         |   58 +
 .../training-step/marked-alert-extension.ts   |   89 ++
 .../training-step-pres.component.html         |    5 +-
 .../training-step-pres.component.ts           |   64 +-
 .../training/training.component.html          |   44 +-
 apps/showcase/src/index.html                  |    1 -
 apps/showcase/src/styles.scss                 |    4 +
 package.json                                  |    5 +
 yarn.lock                                     | 1304 ++++++++++++++++-
 20 files changed, 1778 insertions(+), 65 deletions(-)
 create mode 100644 apps/showcase/src/assets/trainings/sdk/steps/angular-integration/instructions.md
 create mode 100644 apps/showcase/src/assets/trainings/sdk/steps/date-sdk-generation/instructions.md
 create mode 100644 apps/showcase/src/assets/trainings/sdk/steps/introduction/instructions.md
 create mode 100644 apps/showcase/src/assets/trainings/sdk/steps/plugins/instructions.md
 create mode 100644 apps/showcase/src/assets/trainings/sdk/steps/sdk-generation/instructions.md
 create mode 100644 apps/showcase/src/assets/trainings/sdk/steps/typescript-sdk/instructions.md
 create mode 100644 apps/showcase/src/assets/trainings/sdk/steps/welcome/instructions.md
 create mode 100644 apps/showcase/src/components/training/training-step/marked-alert-extension.ts

diff --git a/apps/showcase/package.json b/apps/showcase/package.json
index abd1aa4e0b..c72358a348 100644
--- a/apps/showcase/package.json
+++ b/apps/showcase/package.json
@@ -75,14 +75,19 @@
     "ag-grid-angular": "~32.1.0",
     "ag-grid-community": "~32.1.0",
     "bootstrap": "5.3.3",
+    "clipboard": "^2.0.11",
     "highlight.js": "^11.8.0",
     "intl-messageformat": "~10.5.1",
+    "marked": "^12.0.0",
     "monaco-editor": "~0.50.0",
     "ngx-highlightjs": "^12.0.0",
+    "ngx-markdown": "^18.1.0",
     "ngx-monaco-editor-v2": "^18.0.0",
     "ngx-monaco-tree": "^18.1.0",
     "pixelmatch": "^5.2.1",
     "pngjs": "^7.0.0",
+    "prism-themes": "^1.9.0",
+    "prismjs": "^1.28.0",
     "rxjs": "^7.8.1",
     "sass-loader": "^14.0.0",
     "tslib": "^2.6.2",
diff --git a/apps/showcase/project.json b/apps/showcase/project.json
index fec52085e5..6a01c2dd01 100644
--- a/apps/showcase/project.json
+++ b/apps/showcase/project.json
@@ -102,6 +102,7 @@
           "apps/showcase/src/styles.scss",
           "apps/showcase/training-assets/@vscode/codicons/dist/codicon.css",
           "apps/showcase/training-assets/@xterm/xterm/css/xterm.css",
+          "prism-themes/themes/prism-vsc-dark-plus.css",
           {
             "inject": false,
             "input": "apps/showcase/src/style/dark-theme/dark-theme.scss",
@@ -113,7 +114,19 @@
             "bundleName": "horizon-theme"
           }
         ],
-        "scripts": ["apps/showcase/src/test-sw.js"]
+        "scripts": [
+          "clipboard",
+          "prismjs",
+          "prismjs/components/prism-bash",
+          "prismjs/components/prism-css",
+          "prismjs/components/prism-json",
+          "prismjs/components/prism-markdown",
+          "prismjs/components/prism-markup",
+          "prismjs/components/prism-regex",
+          "prismjs/components/prism-typescript",
+          "prismjs/components/prism-yaml",
+          "apps/showcase/src/test-sw.js"
+        ]
       },
       "configurations": {
         "production": {
diff --git a/apps/showcase/src/app/app.component.html b/apps/showcase/src/app/app.component.html
index d7fa0b1dd5..38999ce0e3 100644
--- a/apps/showcase/src/app/app.component.html
+++ b/apps/showcase/src/app/app.component.html
@@ -10,7 +10,7 @@
       <div class="d-none d-sm-block">Otter Showcase</div>
     </div>
   </header>
-  <div class="flex-fill container">
+  <div class="flex-fill container-fluid">
     <div class="row">
       <div class="left-nav pt-5 col-2 d-none d-xl-block">
         <o3r-sidenav-pres
@@ -18,7 +18,7 @@
         [activeUrl]="activeUrl$ | async"
         ></o3r-sidenav-pres>
       </div>
-      <div class="page-content col-12 col-xl-10">
+      <div class="page-content col-12 col-xl-10 px-3 px-md-6 px-lg-9">
         <router-outlet></router-outlet>
       </div>
     </div>
diff --git a/apps/showcase/src/app/app.component.scss b/apps/showcase/src/app/app.component.scss
index 56157c533e..db9d9a21b9 100644
--- a/apps/showcase/src/app/app.component.scss
+++ b/apps/showcase/src/app/app.component.scss
@@ -34,6 +34,7 @@ header {
   max-height: calc(100vh - 4rem);
   overflow-y: auto;
   flex-grow: 1;
+  border-inline-end: 1px solid var(--df-gray-300);
 }
 
 .page-content {
diff --git a/apps/showcase/src/assets/trainings/sdk/program.json b/apps/showcase/src/assets/trainings/sdk/program.json
index b4fbbc5df8..0e9dd75a9c 100644
--- a/apps/showcase/src/assets/trainings/sdk/program.json
+++ b/apps/showcase/src/assets/trainings/sdk/program.json
@@ -1,23 +1,23 @@
 [
   {
     "title": "Welcome to the Otter SDK tutorial",
-    "htmlContentUrl": "./steps/welcome/instructions.html"
+    "htmlContentUrl": "./steps/welcome/instructions.md"
   },
   {
     "title": "Introduction",
-    "htmlContentUrl": "./steps/introduction/instructions.html"
+    "htmlContentUrl": "./steps/introduction/instructions.md"
   },
   {
     "title": "How to use the Otter SDK?",
-    "htmlContentUrl": "./steps/typescript-sdk/instructions.html"
+    "htmlContentUrl": "./steps/typescript-sdk/instructions.md"
   },
   {
     "title": "Customize your fetch client with plugins",
-    "htmlContentUrl": "./steps/plugins/instructions.html"
+    "htmlContentUrl": "./steps/plugins/instructions.md"
   },
   {
     "title": "Integrate your SDK in Angular",
-    "htmlContentUrl": "./steps/angular-integration/instructions.html",
+    "htmlContentUrl": "./steps/angular-integration/instructions.md",
     "filesConfiguration": {
       "name": "angular-integration",
       "startingFile": "apps/tutorial-app/src/app/app.component.ts",
@@ -44,7 +44,7 @@
   },
   {
     "title": "Generate your first SDK - Command",
-    "htmlContentUrl": "./steps/sdk-generation/instructions.html",
+    "htmlContentUrl": "./steps/sdk-generation/instructions.md",
     "filesConfiguration": {
       "name": "generate-sdk",
       "startingFile": "src/api/dummy/dummy-api.ts",
@@ -58,7 +58,7 @@
   },
   {
     "title": "SDK with Dates - Generation",
-    "htmlContentUrl": "./steps/date-sdk-generation/instructions.html",
+    "htmlContentUrl": "./steps/date-sdk-generation/instructions.md",
     "filesConfiguration": {
       "name": "generate-date-sdk",
       "startingFile": "open-api.yaml",
diff --git a/apps/showcase/src/assets/trainings/sdk/steps/angular-integration/instructions.md b/apps/showcase/src/assets/trainings/sdk/steps/angular-integration/instructions.md
new file mode 100644
index 0000000000..92dd8b9126
--- /dev/null
+++ b/apps/showcase/src/assets/trainings/sdk/steps/angular-integration/instructions.md
@@ -0,0 +1,59 @@
+### Introduction
+
+When dealing with an Angular project, you will need to ensure that your `ApiClient` will be shared accross
+your application.\
+The Otter framework provides the `ApiManager` service to manage your API collection.
+
+#### Prerequisite
+
+- Install the `@o3r/apis-manager` in the project with `npm install @o3r/apis-manager`.
+
+#### Objectives
+
+Leverage the `ApiManager` service to access two different clients to retrieve the list of available
+pets and submit an order for the first pet returned.
+
+
+Add a plugin to the `OrderApi` to log each time a call is sent.
+
+# Exercise
+
+Integrate the `ApiManager` in your application module and configure it to use the `RequestLogPlugin` in the `OrderApi`.\
+You can inspire yourself with the following lines:
+
+```typescript
+// Default configuration for all the APIs defined in the ApiManager
+const apiConfig: ApiClient = new ApiFetchClient(
+  {
+    basePath: 'https://petstore3.swagger.io/api/v3',
+    requestPlugins: [],
+    fetchPlugins: [],
+    logger
+  }
+);
+const apiManager = new ApiManager(apiConfig, {
+  // Configuration override for a specific API
+  OrderApi: new ApiFetchClient({
+    basePath: 'https://petstore3.swagger.io/api/v3',
+    requestPlugins: [new RequestLogPlugin()],
+    fetchPlugins: [],
+    logger
+  })
+});
+
+export const appConfig: ApplicationConfig = {
+  providers: [],
+  imports: [ApiManagerModule.forRoot(apiManager)]
+};
+```
+
+Now, check out the [app.component.ts](training://exercise/apps/tutorial-app/src/app/app.component.ts) file and inject the ApiManager to use your unique instance of the `OrderApi` and
+`PetApi`.\
+In your constructor, update the `availablePets` list with the result of a call to `findPetsByStatus`.
+
+Your application should be updated with the list of available pets.\
+You only need to update the submit method to order the first available item.
+
+Don't forget to refresh the list of available pets once this is done.
+
+Check out your terminal, the request to the `OrderApi` have been logged just as configured in the `ApiManager`.
diff --git a/apps/showcase/src/assets/trainings/sdk/steps/date-sdk-generation/instructions.md b/apps/showcase/src/assets/trainings/sdk/steps/date-sdk-generation/instructions.md
new file mode 100644
index 0000000000..78e10b1476
--- /dev/null
+++ b/apps/showcase/src/assets/trainings/sdk/steps/date-sdk-generation/instructions.md
@@ -0,0 +1,44 @@
+If your specification file includes dates, there are multiple options for the generation of your SDK.
+
+For this exercise, let's consider a specific use case.\
+Imagine your SDK is used on a flight booking site, including international travel.\
+A user who is currently in France is planning a round trip from Paris to New York City.\
+These cities are in different timezones, which needs to be taken into account when the user books their flights.\
+The outbound and return flights must be relative to the timezones of the airports.
+
+To do so, the dates of the flights must be of type `utils.DateTime`.
+
+Also, for this flight booking site, each flight has an expiration date-time for the payment, which is relative to the user's timezone.
+
+### Exercise
+
+This exercise should be done in your local environment.\
+We have provided the template and the solution on the right.\
+(Due to a Java constraint, you won't be able to generate your own SDK in the code editor provided on the right.)
+
+Let's create a specification file for our flight booking site.\
+This SDK should contain a definition with the properties to book a flight:
+- Origin location code
+- Destination location code
+- Departure date-time
+- Payment expiration date
+
+As mentioned above, the type of the departure date-time should be `utils.DateTime` after generation, which can be defined by setting the
+type of the property to `string` and adding the `x-local-timezone` vendor.\
+Once your specification file is created, you can generate your SDK.
+```bash
+yarn schematics @ama-sdk/schematics:typescript-core --spec-path ./path/to/openapi.yaml
+```
+
+As you may notice, your date object is generated as a `string` instead of `Date`.\
+This is normal since the default configuration of the SDK generator has an option `stringifyDate` that is set to `true`.\
+To ensure that the date object is generated correctly, this option needs to be set to false either through the command line or in `openapitools.json`.\
+For example:
+```bash
+yarn schematics @ama-sdk/schematics:typescript-core --spec-path ./path/to/openapi.yaml --global-property stringifyDate=false
+```
+
+> [!NOTE]
+> The `stringifyDate` option does not impact the generation of a `utils.Date` object.
+
+To make sure you have generated the correct SDK locally, check out the solution in the file [src/models/base/flight/flight.ts](training://solution/src/models/base/flight/flight.ts).
diff --git a/apps/showcase/src/assets/trainings/sdk/steps/introduction/instructions.md b/apps/showcase/src/assets/trainings/sdk/steps/introduction/instructions.md
new file mode 100644
index 0000000000..152a81eea7
--- /dev/null
+++ b/apps/showcase/src/assets/trainings/sdk/steps/introduction/instructions.md
@@ -0,0 +1,32 @@
+### Why an SDK?
+
+If an application contains an API, there are several developer tasks that are required including a lot of redundant code.\
+These tasks include:
+- Choosing the needed techniques to perform API calls
+- Determining which HTTP method to use for each request
+- Managing the Authorization (maybe adding request headers) and do it for each request
+- Preparing the URL with any path or query parameters expected by the API endpoint
+
+Let's see how we use the OpenAPI tools to handle our APIs and generate a typescript SDK codebase.
+
+Check out the diagram on the right to visualize the description below.
+
+The specifications of the SDK are written in an OpenAPI document, which defines or describes an API and its elements.\
+The API SDK is then generated using the OpenAPI Generator and the Otter SDK templates.\
+These template files include the API interfaces and operations, models with their corresponding revivers, and mocked APIs that can be used for testing in
+spec files.\
+All these files together form the Typescript SDK.
+
+This generated code is agnostic of any frontend framework.\
+Therefore, it can be used both in the backend in a NodeJS server
+application or in a frontend application displayed by browsers, mobiles, smartwatches etc.
+
+### More information
+
+You can find more information on the resources used through these links:
+
+- [Specification](https://spec.openapis.org/oas/latest.html">OpenAPI)
+- [OpenAPI Generator](https://github.com/OpenAPITools/openapi-generator)
+- [Otter SDK models hierarchy](https://github.com/AmadeusITGroup/otter/blob/main/docs/api-sdk/SDK_MODELS_HIERARCHY.md)
+  - [Model composition and inheritance](https://github.com/AmadeusITGroup/otter/blob/main/docs/api-sdk/COMPOSITION_INHERITANCE.md)
+- [Otter SDK generator](https://github.com/AmadeusITGroup/otter/blob/main/packages/%40ama-sdk/schematics/README.md)
diff --git a/apps/showcase/src/assets/trainings/sdk/steps/plugins/instructions.md b/apps/showcase/src/assets/trainings/sdk/steps/plugins/instructions.md
new file mode 100644
index 0000000000..534d7cdb89
--- /dev/null
+++ b/apps/showcase/src/assets/trainings/sdk/steps/plugins/instructions.md
@@ -0,0 +1,41 @@
+### Introduction
+
+Thanks to the `@ama-sdk/core` plugins, you can intercept the API requests and responses to transform their data or
+perform actions such as the authentication, logging etc.
+
+These plugins will be applied before sending all the API requests and after the reception of the responses.
+
+#### Pre-requisite
+
+- Install `@ama-sdk/core`
+
+#### Objectives
+
+In this tutorial, you will configure the `PetApi` to send an id that will be shared all over the session and log for all your response
+with a timestamp.
+
+### Exercise
+
+Create your own plugin that implements the `ReplyPlugin` interface to log the response from the server and a timestamp
+
+You can inspire yourselves with the following code:
+```typescript
+class LogTimestampResponsePlugin implements ReplyPlugin {
+  public load<K>(context: ReplyPluginContext<K>): PluginRunner<K | undefined, V> {
+    return {
+      transform: (data?: V) => {
+        console.log(data, new Date());
+        // You could modify the response here to add new fields etc.
+        return ret;
+      }
+    };
+  }
+}
+```
+
+Add the `SessionIdRequest` to the list of the API `requestPlugins` of your ApiFetchClient and
+your custom logging plugin to the `replyPlugins` list.
+
+Note that the Otter framework provides many other plugins to help you manage your authentication, your exceptions, revive your model etc.\
+You can have a look into the [project plugins](https://github.com/AmadeusITGroup/otter/tree/main/packages/%40ama-sdk/core/src/plugins)
+for more information.
diff --git a/apps/showcase/src/assets/trainings/sdk/steps/sdk-generation/instructions.md b/apps/showcase/src/assets/trainings/sdk/steps/sdk-generation/instructions.md
new file mode 100644
index 0000000000..7336fb1958
--- /dev/null
+++ b/apps/showcase/src/assets/trainings/sdk/steps/sdk-generation/instructions.md
@@ -0,0 +1,23 @@
+### Part 2: Generation command
+
+There are several command lines available to generate an SDK depending on the use cases.\
+These cases are covered in the [documentation](https://github.com/AmadeusITGroup/otter/tree/main/packages/%40ama-sdk/schematics) of the package `@ama-sdk/schematics`.
+
+#### Objective
+
+Generate a new SDK repository using the previous specification file and the provided command line.
+
+#### Exercise
+
+To generate a new SDK repository, you can run the following command line:
+
+```bash
+yarn create @ama-sdk typescript training-sdk
+```
+
+You will receive a prompt asking you to specify the project name.\
+For example, you can set the project name to `training-project`.
+
+```bash
+? Project name (NPM package scope, package.json name will be @{projectName}/{packageName})? training-project
+```
diff --git a/apps/showcase/src/assets/trainings/sdk/steps/typescript-sdk/instructions.md b/apps/showcase/src/assets/trainings/sdk/steps/typescript-sdk/instructions.md
new file mode 100644
index 0000000000..ae4b6bcfcd
--- /dev/null
+++ b/apps/showcase/src/assets/trainings/sdk/steps/typescript-sdk/instructions.md
@@ -0,0 +1,31 @@
+### Objectives
+
+For this example, you will use the public PetStore project API.\
+You will perform a simple call and retrieve a list of pets from an SDK programmatically generated from their public specification.\
+As this step requires a JAVA setup, it has already been done for you.\
+You will just need to integrate the Otter SDK client and perform your call.
+
+### Exercise
+
+Let's create a fetch client in your application and use it to access your API.\
+You can get inspiration from the following code:
+```typescript
+const apiConfig: ApiClient = new ApiFetchClient(
+  {
+    basePath: 'https://petstore3.swagger.io/api/v3',
+    requestPlugins: [],
+    fetchPlugins: [],
+    logger
+  }
+);
+const api = new PetApi(apiConfig);
+```
+
+Now, you can call the api object to perform the HTTP request you look for.\
+Have a look at the `sdk/api/pet.api.ts` folder and look for the `findPetsByStatus`.
+
+For this exercise, you will look for the available items and you will only show the name of the ten first pet in the allocated
+space (look for the div with the `result` id).
+
+See how you can benefit from the typecheck thanks to the SDK generated interfaces.
+
diff --git a/apps/showcase/src/assets/trainings/sdk/steps/welcome/instructions.md b/apps/showcase/src/assets/trainings/sdk/steps/welcome/instructions.md
new file mode 100644
index 0000000000..6061ffb95a
--- /dev/null
+++ b/apps/showcase/src/assets/trainings/sdk/steps/welcome/instructions.md
@@ -0,0 +1,58 @@
+This interactive tutorial will teach you how to generate and use an SDK using the Otter framework.
+
+### How to use this tutorial
+This tutorial is composed of two parts:
+
+1. How to use an SDK
+2. How to generate an SDK
+
+We will cover explanations on these topics along with examples and exercises for better understanding.
+
+\[Instructions for exercises]
+
+### Prerequisites
+#### Environment
+To get started, your environment requires:
+
+- [Node](https://nodejs.org/en/learn/getting-started/how-to-install-nodejs)
+  - Version 18.0.0 or above - minimum required version according to the [@ama-sdk/schematics package](https://github.com/AmadeusITGroup/otter/blob/main/packages/%40ama-sdk/schematics/package.json)
+- [Java](https://adoptium.net/)
+  - Version 11 or above - minimum required version according to [OpenAPI Generator](https://github.com/OpenAPITools/openapi-generator)
+
+### Resources
+
+> [!NOTE]
+> We would like to specify that this is not an OpenAPI training.
+> We invite you to familiarize yourself with OpenAPI and how to configure the generation SDK prior to starting this tutorial.
+> We will refer to some OpenAPI concepts throughout this training when explaining our configuration options built on top of OpenAPI.
+
+- [What is OpenAPI?](https://swagger.io/docs/specification/about/)
+- [OpenAPI Specification](https://swagger.io/specification/)
+
+### How to create your own SDK repository
+
+There are two possibilities to generate an SDK:
+
+#### Create a new single SDK repository
+
+You can use the following command line:
+```bash
+yarn create @ama-sdk typescript <project-name> -- [--spec-path=./path/to/spec.yaml]
+```
+
+Note, you can replace `yarn` by `npm` if wanted.
+
+#### Create a new Otter workspace package in an existing monorepo
+
+This requires the schematics packages:
+```bash
+yarn ng add @ama-sdk/schematics
+yarn ng add @ama-sdk/core
+```
+You can then generate the "shell" of the SDK package with the following command:
+```bash
+# Monorepo with Otter
+yarn ng g sdk sdkName
+# Monorepo without Otter
+yarn schematics @o3r/workspace:sdk sdkName
+```
diff --git a/apps/showcase/src/components/training/training-step/marked-alert-extension.ts b/apps/showcase/src/components/training/training-step/marked-alert-extension.ts
new file mode 100644
index 0000000000..5f8068858c
--- /dev/null
+++ b/apps/showcase/src/components/training/training-step/marked-alert-extension.ts
@@ -0,0 +1,89 @@
+import {type MarkedExtension, type Tokens} from 'marked';
+
+const variants = ['note', 'tip', 'important', 'warning', 'caution'];
+const cssVariantMapping: Record<string, string> = {
+  note: 'info',
+  tip: 'tip',
+  important: 'info',
+  warning: 'warning',
+  caution: 'danger'
+};
+const iconVariantMapping: Record<string, string> = {
+  note: '<span class="df-insert-icon fa-info-circle"></span>',
+  tip: '<span class="df-insert-icon fa-lightbulb"></span>',
+  important: '<span class="df-insert-icon fa-info-circle"></span>',
+  warning: '<span class="df-insert-icon fa-exclamation-triangle"></span>',
+  caution: '<span class="df-insert-icon fa-minus-circle"></span>'
+};
+function createSyntaxPattern(type: string) {
+  return `^(?:\\[!${type.toUpperCase()}])\\s*?\n*`;
+}
+function ucfirst(str: string) {
+  return str.slice(0, 1).toUpperCase() + str.slice(1).toLowerCase();
+}
+
+/**
+ * Marked extension to support GitHUb like alerts
+ * Forked from https://github.com/bent10/marked-extensions/tree/main/packages/alert to match Design Factory
+ */
+export function markedAlert(): MarkedExtension {
+  return {
+    walkTokens: (token) => {
+      if (token.type !== 'blockquote') {
+        return;
+      }
+
+      const matchedVariant = variants.find((type) =>
+        new RegExp(createSyntaxPattern(type)).test(token.text)
+      );
+
+      if (matchedVariant) {
+        const typeRegexp = new RegExp(createSyntaxPattern(matchedVariant));
+
+        Object.assign(token, {
+          type: 'alert',
+          meta: {
+            className: `alert alert-${cssVariantMapping[matchedVariant]}`,
+            variant: matchedVariant,
+            icon: iconVariantMapping[matchedVariant]
+          }
+        });
+
+        const firstLine = token.tokens?.[0] as Tokens.Paragraph;
+        const firstLineText = firstLine.raw?.replace(typeRegexp, '').trim();
+
+        if (firstLineText) {
+          const patternToken = firstLine.tokens[0] as Tokens.Text;
+
+          Object.assign(patternToken, {
+            raw: patternToken.raw.replace(typeRegexp, ''),
+            text: patternToken.text.replace(typeRegexp, '')
+          });
+
+          if (firstLine.tokens[1]?.type === 'br') {
+            firstLine.tokens.splice(1, 1);
+          }
+        } else {
+          token.tokens?.shift();
+        }
+      }
+    },
+    extensions: [
+      {
+        name: 'alert',
+        level: 'block',
+        renderer({ meta, tokens = [] }) {
+          let tmpl = `<div dfInsertAlertIcon class="${meta.className} ${meta.className}-${meta.variant}">\n`;
+          tmpl += `<p class="${meta.titleClassName}">`;
+          tmpl += meta.icon;
+          tmpl += `<strong>${ucfirst(meta.variant)}</strong>`;
+          tmpl += '</p>\n';
+          tmpl += this.parser.parse(tokens);
+          tmpl += '</div>\n';
+
+          return tmpl;
+        }
+      }
+    ]
+  };
+}
diff --git a/apps/showcase/src/components/training/training-step/training-step-pres.component.html b/apps/showcase/src/components/training/training-step/training-step-pres.component.html
index c6f1358bca..4283f40956 100644
--- a/apps/showcase/src/components/training/training-step/training-step-pres.component.html
+++ b/apps/showcase/src/components/training/training-step/training-step-pres.component.html
@@ -2,7 +2,10 @@
   @if (instructions) {
     <div class="instructions h-100 col overflow-auto">
       <h2>{{title}}</h2>
-      <div [innerHTML]="instructions"></div>
+      <ng-template #buttonTemplate>
+        <button class="btn btn-secondary ms-auto df-btn-icononly fa-copy" (click)="onCopyToClipboard()" title="Click to copy"></button>
+      </ng-template>
+      <markdown clipboard [data]="instructions" [clipboardButtonTemplate]="buttonTemplate" (click)="markdownClick($event)"></markdown>
     </div>
   }
   @if (project) {
diff --git a/apps/showcase/src/components/training/training-step/training-step-pres.component.ts b/apps/showcase/src/components/training/training-step/training-step-pres.component.ts
index f538f264d3..132ee7bee5 100644
--- a/apps/showcase/src/components/training/training-step/training-step-pres.component.ts
+++ b/apps/showcase/src/components/training/training-step/training-step-pres.component.ts
@@ -1,11 +1,28 @@
-import {ChangeDetectionStrategy, Component, Input} from '@angular/core';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  inject,
+  Input,
+  output,
+  SecurityContext,
+  viewChild
+} from '@angular/core';
+import {MarkdownModule, MarkdownService, provideMarkdown} from 'ngx-markdown';
 import {CodeEditorViewComponent, EditorMode, TrainingProject} from '../code-editor-view';
+import {markedAlert} from './marked-alert-extension';
 
 @Component({
   selector: 'o3r-training-step-pres',
   standalone: true,
   changeDetection: ChangeDetectionStrategy.OnPush,
-  imports: [CodeEditorViewComponent],
+  imports: [CodeEditorViewComponent, MarkdownModule],
+  providers: [
+    provideMarkdown({
+      markedExtensions: [markedAlert()],
+      /* Templates are only internal, no need to sanitize */
+      sanitize: SecurityContext.NONE
+    })
+  ],
   templateUrl: './training-step-pres.component.html',
   styleUrl: './training-step-pres.component.scss'
 })
@@ -26,4 +43,47 @@ export class TrainingStepPresComponent {
    * Training instructions to do the exercise
    */
   @Input() public instructions?: string;
+
+  private readonly codeEditor = viewChild(CodeEditorViewComponent);
+
+  public readonly focusExercise = output<string>();
+
+  private readonly markdownService = inject(MarkdownService);
+
+  constructor() {
+    const originalLinkRendered = this.markdownService.renderer.link.bind(this.markdownService.renderer);
+    this.markdownService.renderer.link = (href: string, title: string | null | undefined, text: string) => {
+      if (/^training:\/\//.test(href)) {
+        // TODO if needed to override HTML
+        return originalLinkRendered(href, title, text);
+      } else {
+        return originalLinkRendered(href, title, text);
+      }
+    };
+  }
+
+  onCopyToClipboard() {
+    // TODO snackbar
+  }
+
+  markdownClick(event: any) {
+    const target = event.target;
+    console.log(target);
+    const internalLinkMatcher = /training:\/\/(exercise|solution)\/(.*)/;
+    if (target.tagName === 'A' && internalLinkMatcher.test(target.href)) {
+      console.log(`Caught event: `, event);
+      event.preventDefault();
+      event.stopPropagation();
+      const [,type,path] = target.href.match(internalLinkMatcher);
+      if (type === 'exercise') {
+        // TODO switch to exercise panel
+        this.codeEditor()!.onClickFile(path);
+      } else if (type === 'solution') {
+        // TODO switch to solution panel
+        this.codeEditor()!.onClickFile(path);
+      }
+    } else {
+      console.log('all clean');
+    }
+  }
 }
diff --git a/apps/showcase/src/components/training/training.component.html b/apps/showcase/src/components/training/training.component.html
index b2c1441167..585ad4a5b8 100644
--- a/apps/showcase/src/components/training/training.component.html
+++ b/apps/showcase/src/components/training/training.component.html
@@ -1,8 +1,21 @@
 @if (steps()[currentStepIndex()]; as currentStep){
-  <div class="mt-7 mb-3 d-flex justify-content-between">
-    <div class="align-self-center">
-      <h1 class="m-0">{{title()}}</h1>
-      <div ngbDropdown class="mt-2">
+  <div class="mt-5 mb-3 d-flex justify-content-between align-items-center gap-3 flex-wrap">
+    <h1 class="m-0 flex-grow-1">{{title()}}</h1>
+    <div class="d-flex gap-3">
+      @if (currentStep.dynamicContent.project() || currentStep.dynamicContent.solutionProject()) {
+        <button type="button" class="btn btn-outline-primary" (click)="toggleDisplayInstructions()">
+          {{showInstructions() ? 'Hide instructions' : 'Show instructions'}}
+        </button>
+        <button type="button" class="btn btn-outline-danger"
+                (click)="toggleDisplaySolution()"
+                [disabled]="!showSolution() && !currentStep.dynamicContent.solutionProject() || showSolution() && !currentStep.dynamicContent.project()"
+        >
+          {{showSolution() ? 'Show exercise' : 'Show solution'}}
+        </button>
+      }
+    </div>
+    <div class="d-flex gap-3">
+      <div ngbDropdown>
         <button type="button" class="btn btn-outline-primary" id="training-exercise-selection" ngbDropdownToggle>
           {{currentStep.description.title}}
         </button>
@@ -14,25 +27,10 @@ <h1 class="m-0">{{title()}}</h1>
           }
         </div>
       </div>
-    </div>
-    <div class="align-self-center d-flex flex-wrap">
-      @if (currentStep.dynamicContent.project() || currentStep.dynamicContent.solutionProject()) {
-        <button type="button" class="btn btn-outline-primary mb-2 mb-md-0 me-5" (click)="toggleDisplayInstructions()">
-          {{showInstructions() ? 'Hide instructions' : 'Show instructions'}}
-        </button>
-        <button type="button" class="btn btn-outline-danger mb-2 mb-md-0 me-5"
-                (click)="toggleDisplaySolution()"
-                [disabled]="!showSolution() && !currentStep.dynamicContent.solutionProject() || showSolution() && !currentStep.dynamicContent.project()"
-        >
-          {{showSolution() ? 'Show exercise' : 'Show solution'}}
-        </button>
-      }
-      <div>
-        <button type="button" class="btn btn-outline-secondary df-btn-icononly fa-chevron-left me-2" [disabled]="currentStepIndex() <= 0"
-                aria-label="Previous step" (click)="setCurrentStep(currentStepIndex() - 1)"></button>
-        <button type="button" class="btn btn-outline-secondary df-btn-icononly fa-chevron-right ms-2" [disabled]="currentStepIndex() >= steps().length - 1"
-                aria-label="Next step" (click)="setCurrentStep(currentStepIndex() + 1)"></button>
-      </div>
+      <button type="button" class="btn btn-outline-secondary df-btn-icononly fa-chevron-left" [disabled]="currentStepIndex() <= 0"
+              aria-label="Previous step" (click)="setCurrentStep(currentStepIndex() - 1)"></button>
+      <button type="button" class="btn btn-outline-secondary df-btn-icononly fa-chevron-right" [disabled]="currentStepIndex() >= steps().length - 1"
+              aria-label="Next step" (click)="setCurrentStep(currentStepIndex() + 1)"></button>
     </div>
   </div>
   <o3r-training-step-pres
diff --git a/apps/showcase/src/index.html b/apps/showcase/src/index.html
index d2da8925c8..e38da6a27d 100644
--- a/apps/showcase/src/index.html
+++ b/apps/showcase/src/index.html
@@ -9,6 +9,5 @@
 </head>
 <body>
   <app-root></app-root>
-  <script src="test-sw.js"></script>
 </body>
 </html>
diff --git a/apps/showcase/src/styles.scss b/apps/showcase/src/styles.scss
index 74ac9f9a38..8af0489c6b 100644
--- a/apps/showcase/src/styles.scss
+++ b/apps/showcase/src/styles.scss
@@ -37,6 +37,10 @@ h1, h2 {
   color: #1f7e36;
 }
 
+.markdown-clipboard-toolbar button {
+  --df-btn-icononly-size: 1.85em;
+}
+
 // Start overrides of design factory
 .navbar {
   box-shadow: none;
diff --git a/package.json b/package.json
index 594a960bf6..af498d43c8 100644
--- a/package.json
+++ b/package.json
@@ -223,6 +223,7 @@
     "bootstrap": "5.3.3",
     "bootstrap-icons": "^1.11.3",
     "browserslist": "^4.21.4",
+    "clipboard": "^2.0.11",
     "commit-and-tag-version": "^12.0.0",
     "concurrently": "^8.0.0",
     "cpy-cli": "^5.0.0",
@@ -245,9 +246,11 @@
     "jsonpath-plus": "^9.0.0",
     "lighthouse": "~12.2.0",
     "lint-staged": "^15.0.0",
+    "marked": "^12.0.0",
     "minimist": "^1.2.6",
     "ng-packagr": "~18.2.0",
     "ngx-highlightjs": "^12.0.0",
+    "ngx-markdown": "^18.1.0",
     "ngx-monaco-editor-v2": "^18.0.0",
     "ngx-monaco-tree": "^18.1.0",
     "npm-run-all2": "^6.0.0",
@@ -255,6 +258,8 @@
     "playwright-lighthouse": "~4.0.0",
     "postcss": "~8.4.31",
     "postcss-scss": "~4.0.9",
+    "prism-themes": "^1.9.0",
+    "prismjs": "^1.28.0",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
     "replace-in-files-cli": "^2.2.0",
diff --git a/yarn.lock b/yarn.lock
index 2da5304053..22218c7501 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1466,6 +1466,23 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@antfu/install-pkg@npm:^0.4.0":
+  version: 0.4.1
+  resolution: "@antfu/install-pkg@npm:0.4.1"
+  dependencies:
+    package-manager-detector: "npm:^0.2.0"
+    tinyexec: "npm:^0.3.0"
+  checksum: 10/3ffd59fa5a21dcb4951a037f5c91dfbfc152adfef9e7ba231a968f108aa28c1cd22213c437a8d34f2bfea8c2b9a6df20447eb04be15b534a8e9e21a9dcf203c0
+  languageName: node
+  linkType: hard
+
+"@antfu/utils@npm:^0.7.10":
+  version: 0.7.10
+  resolution: "@antfu/utils@npm:0.7.10"
+  checksum: 10/c8c2797aeab3e88f0095dea5736d2f16137a7213195e568246792b2cceecb184234f018346dc07c252c62e4d9085c09ce6bd180da833266cafa65133fb03e075
+  languageName: node
+  linkType: hard
+
 "@apidevtools/json-schema-ref-parser@npm:9.0.6":
   version: 9.0.6
   resolution: "@apidevtools/json-schema-ref-parser@npm:9.0.6"
@@ -3255,6 +3272,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@braintree/sanitize-url@npm:^7.0.1":
+  version: 7.1.0
+  resolution: "@braintree/sanitize-url@npm:7.1.0"
+  checksum: 10/b25cc5358bedfd97d8378d23ab43493e56a805bd82fdb092088bdd9db6aa3f6c32859d36526f570fb2c67a5a4f9ce579aacd52c3872db4285e4c34fb9947dfc0
+  languageName: node
+  linkType: hard
+
 "@capacitor/browser@npm:^6.0.0":
   version: 6.0.2
   resolution: "@capacitor/browser@npm:6.0.2"
@@ -3291,6 +3315,48 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@chevrotain/cst-dts-gen@npm:11.0.3":
+  version: 11.0.3
+  resolution: "@chevrotain/cst-dts-gen@npm:11.0.3"
+  dependencies:
+    "@chevrotain/gast": "npm:11.0.3"
+    "@chevrotain/types": "npm:11.0.3"
+    lodash-es: "npm:4.17.21"
+  checksum: 10/601d23fa3312bd0e32816bd3f9ca2dcba775a52192a082fd6c5e4a2e8ee068523401191babbe2c346d6d2551900a67b549f2f74d7ebb7d5b2ee1b6fa3c8857a0
+  languageName: node
+  linkType: hard
+
+"@chevrotain/gast@npm:11.0.3":
+  version: 11.0.3
+  resolution: "@chevrotain/gast@npm:11.0.3"
+  dependencies:
+    "@chevrotain/types": "npm:11.0.3"
+    lodash-es: "npm:4.17.21"
+  checksum: 10/7169453a8fbfa994e91995523dea09eab87ab23062ad93f6e51f4a3b03f5e2958e0a8b99d5ca6fa067fccfbbbb8bcf1a4573ace2e1b5a455f6956af9eaccb35a
+  languageName: node
+  linkType: hard
+
+"@chevrotain/regexp-to-ast@npm:11.0.3":
+  version: 11.0.3
+  resolution: "@chevrotain/regexp-to-ast@npm:11.0.3"
+  checksum: 10/7387a1c61c5a052de41e1172b33eaaedea166fcdb1ffe4c381b86d00051a8014855a031d28fb658768a62c833ef5f5b0689d0c40de3d7bed556f8fea24396e69
+  languageName: node
+  linkType: hard
+
+"@chevrotain/types@npm:11.0.3":
+  version: 11.0.3
+  resolution: "@chevrotain/types@npm:11.0.3"
+  checksum: 10/49a82b71d2de8ceb2383ff2709fa61d245f2ab2e42790b70c57102c80846edaa318d0b3645aedc904d23ea7bd9be8a58f2397b1341760a15eb5aa95a1336e2a9
+  languageName: node
+  linkType: hard
+
+"@chevrotain/utils@npm:11.0.3":
+  version: 11.0.3
+  resolution: "@chevrotain/utils@npm:11.0.3"
+  checksum: 10/29b5d84373a7761ad055c53e2f540a67b5b56550d5be1c473149f6b8923eef87ff391ce021c06ac7653843b0149f6ff0cf30b5e48c3f825d295eb06a6c517bd3
+  languageName: node
+  linkType: hard
+
 "@colors/colors@npm:1.5.0":
   version: 1.5.0
   resolution: "@colors/colors@npm:1.5.0"
@@ -4640,6 +4706,28 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@iconify/types@npm:^2.0.0":
+  version: 2.0.0
+  resolution: "@iconify/types@npm:2.0.0"
+  checksum: 10/1b3425ecbc0eef44f23d3f27355ae7ef306d5119c566f013ef1849995b016e1fdcc5af6b74c3bc0554485d70cf5179cb9c1095b14d662a55abcae1148e1a13c9
+  languageName: node
+  linkType: hard
+
+"@iconify/utils@npm:^2.1.32":
+  version: 2.1.33
+  resolution: "@iconify/utils@npm:2.1.33"
+  dependencies:
+    "@antfu/install-pkg": "npm:^0.4.0"
+    "@antfu/utils": "npm:^0.7.10"
+    "@iconify/types": "npm:^2.0.0"
+    debug: "npm:^4.3.6"
+    kolorist: "npm:^1.8.0"
+    local-pkg: "npm:^0.5.0"
+    mlly: "npm:^1.7.1"
+  checksum: 10/22b8bb836af3ccb6393c3bd5283d954628b6b2e00acab4e18dc7e170bd6252cc63f8370aa8e197351a11d56262cb8c572397cadc0a5ebeafc89427454c8bb936
+  languageName: node
+  linkType: hard
+
 "@inquirer/checkbox@npm:^2.4.7":
   version: 2.5.0
   resolution: "@inquirer/checkbox@npm:2.5.0"
@@ -5398,6 +5486,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@mermaid-js/parser@npm:^0.3.0":
+  version: 0.3.0
+  resolution: "@mermaid-js/parser@npm:0.3.0"
+  dependencies:
+    langium: "npm:3.0.0"
+  checksum: 10/39abb7a369f023edcc691505cac07dcbc786217d739fdab2e37537438ccf2786de71c64f3a62a34e72ee6ed2bd4b70bf80417185b68e50b747b0af112e5f3ef3
+  languageName: node
+  linkType: hard
+
 "@microsoft/tsdoc@npm:~0.15.0":
   version: 0.15.0
   resolution: "@microsoft/tsdoc@npm:0.15.0"
@@ -8076,6 +8173,7 @@ __metadata:
     bootstrap: "npm:5.3.3"
     bootstrap-icons: "npm:^1.11.3"
     browserslist: "npm:^4.21.4"
+    clipboard: "npm:^2.0.11"
     commit-and-tag-version: "npm:^12.0.0"
     concurrently: "npm:^8.0.0"
     cpy-cli: "npm:^5.0.0"
@@ -8098,9 +8196,11 @@ __metadata:
     jsonpath-plus: "npm:^9.0.0"
     lighthouse: "npm:~12.2.0"
     lint-staged: "npm:^15.0.0"
+    marked: "npm:^12.0.0"
     minimist: "npm:^1.2.6"
     ng-packagr: "npm:~18.2.0"
     ngx-highlightjs: "npm:^12.0.0"
+    ngx-markdown: "npm:^18.1.0"
     ngx-monaco-editor-v2: "npm:^18.0.0"
     ngx-monaco-tree: "npm:^18.1.0"
     npm-run-all2: "npm:^6.0.0"
@@ -8110,6 +8210,8 @@ __metadata:
     pngjs: "npm:^7.0.0"
     postcss: "npm:~8.4.31"
     postcss-scss: "npm:~4.0.9"
+    prism-themes: "npm:^1.9.0"
+    prismjs: "npm:^1.28.0"
     react: "npm:^18.0.0"
     react-dom: "npm:^18.0.0"
     replace-in-files-cli: "npm:^2.2.0"
@@ -8931,6 +9033,7 @@ __metadata:
     ag-grid-angular: "npm:~32.1.0"
     ag-grid-community: "npm:~32.1.0"
     bootstrap: "npm:5.3.3"
+    clipboard: "npm:^2.0.11"
     concurrently: "npm:^8.0.0"
     eslint: "npm:^8.57.0"
     eslint-import-resolver-node: "npm:^0.3.9"
@@ -8947,14 +9050,18 @@ __metadata:
     jest-preset-angular: "npm:~14.2.0"
     jsonc-eslint-parser: "npm:~2.4.0"
     lighthouse: "npm:~12.2.0"
+    marked: "npm:^12.0.0"
     minimist: "npm:^1.2.6"
     monaco-editor: "npm:~0.50.0"
     ngx-highlightjs: "npm:^12.0.0"
+    ngx-markdown: "npm:^18.1.0"
     ngx-monaco-editor-v2: "npm:^18.0.0"
     ngx-monaco-tree: "npm:^18.1.0"
     pixelmatch: "npm:^5.2.1"
     playwright-lighthouse: "npm:~4.0.0"
     pngjs: "npm:^7.0.0"
+    prism-themes: "npm:^1.9.0"
+    prismjs: "npm:^1.28.0"
     rimraf: "npm:^5.0.1"
     rxjs: "npm:^7.8.1"
     sass-loader: "npm:^14.0.0"
@@ -12228,6 +12335,278 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/d3-array@npm:*":
+  version: 3.2.1
+  resolution: "@types/d3-array@npm:3.2.1"
+  checksum: 10/4a9ecacaa859cff79e10dcec0c79053f027a4749ce0a4badeaff7400d69a9c44eb8210b147916b6ff5309be049030e7d68a0e333294ff3fa11c44aa1af4ba458
+  languageName: node
+  linkType: hard
+
+"@types/d3-axis@npm:*":
+  version: 3.0.6
+  resolution: "@types/d3-axis@npm:3.0.6"
+  dependencies:
+    "@types/d3-selection": "npm:*"
+  checksum: 10/8af56b629a0597ac8ef5051b6ad5390818462d8e588e1b52fb181808b1c0525d12a658730fad757e1ae256d0db170a0e29076acdef21acc98b954608d1c37b84
+  languageName: node
+  linkType: hard
+
+"@types/d3-brush@npm:*":
+  version: 3.0.6
+  resolution: "@types/d3-brush@npm:3.0.6"
+  dependencies:
+    "@types/d3-selection": "npm:*"
+  checksum: 10/4095cee2512d965732147493c471a8dd97dfb5967479d9aef43397f8b0e074b03296302423b8379c4274f9249b52bd1d74cc021f98d4f64b5a8a4a7e6fe48335
+  languageName: node
+  linkType: hard
+
+"@types/d3-chord@npm:*":
+  version: 3.0.6
+  resolution: "@types/d3-chord@npm:3.0.6"
+  checksum: 10/ca9ba8b00debd24a2b51527b9c3db63eafa5541c08dc721d1c52ca19960c5cec93a7b1acfc0ec072dbca31d134924299755e20a4d1d4ee04b961fc0de841b418
+  languageName: node
+  linkType: hard
+
+"@types/d3-color@npm:*":
+  version: 3.1.3
+  resolution: "@types/d3-color@npm:3.1.3"
+  checksum: 10/1cf0f512c09357b25d644ab01b54200be7c9b15c808333b0ccacf767fff36f17520b2fcde9dad45e1bd7ce84befad39b43da42b4fded57680fa2127006ca3ece
+  languageName: node
+  linkType: hard
+
+"@types/d3-contour@npm:*":
+  version: 3.0.6
+  resolution: "@types/d3-contour@npm:3.0.6"
+  dependencies:
+    "@types/d3-array": "npm:*"
+    "@types/geojson": "npm:*"
+  checksum: 10/e7b7e3972aa71003c21f2c864116ffb95a9175a62ec56ec656a855e5198a66a0830b2ad7fc26811214cfa8c98cdf4190d7d351913ca0913f799fbcf2a4c99b2d
+  languageName: node
+  linkType: hard
+
+"@types/d3-delaunay@npm:*":
+  version: 6.0.4
+  resolution: "@types/d3-delaunay@npm:6.0.4"
+  checksum: 10/cb8d2c9ed0b39ade3107b9792544a745b2de3811a6bd054813e9dc708b1132fbacd796e54c0602c11b3a14458d14487c5276c1affb7c2b9f25fe55fff88d6d25
+  languageName: node
+  linkType: hard
+
+"@types/d3-dispatch@npm:*":
+  version: 3.0.6
+  resolution: "@types/d3-dispatch@npm:3.0.6"
+  checksum: 10/f82076c7d205885480d363c92c19b8e0d6b9e529a3a78ce772f96a7cc4cce01f7941141f148828337035fac9676b13e7440565530491d560fdf12e562cb56573
+  languageName: node
+  linkType: hard
+
+"@types/d3-drag@npm:*":
+  version: 3.0.7
+  resolution: "@types/d3-drag@npm:3.0.7"
+  dependencies:
+    "@types/d3-selection": "npm:*"
+  checksum: 10/93aba299c3a8d41ee326c5304ab694ceea135ed115c3b2ccab727a5d9bfc935f7f36d3fc416c013010eb755ac536c52adfcb15c195f241dc61f62650cc95088e
+  languageName: node
+  linkType: hard
+
+"@types/d3-dsv@npm:*":
+  version: 3.0.7
+  resolution: "@types/d3-dsv@npm:3.0.7"
+  checksum: 10/8507f542135cae472781dff1c3b391eceedad0f2032d24ac4a0814e72e2f6877e4ddcb66f44627069977ee61029dc0a729edf659ed73cbf1040f55a7451f05ef
+  languageName: node
+  linkType: hard
+
+"@types/d3-ease@npm:*":
+  version: 3.0.2
+  resolution: "@types/d3-ease@npm:3.0.2"
+  checksum: 10/d8f92a8a7a008da71f847a16227fdcb53a8938200ecdf8d831ab6b49aba91e8921769761d3bfa7e7191b28f62783bfd8b0937e66bae39d4dd7fb0b63b50d4a94
+  languageName: node
+  linkType: hard
+
+"@types/d3-fetch@npm:*":
+  version: 3.0.7
+  resolution: "@types/d3-fetch@npm:3.0.7"
+  dependencies:
+    "@types/d3-dsv": "npm:*"
+  checksum: 10/d496475cec7750f75740936e750a0150ca45e924a4f4697ad2c564f3a8f6c4ebc1b1edf8e081936e896532516731dbbaf2efd4890d53274a8eae13f51f821557
+  languageName: node
+  linkType: hard
+
+"@types/d3-force@npm:*":
+  version: 3.0.10
+  resolution: "@types/d3-force@npm:3.0.10"
+  checksum: 10/9c35abed2af91b94fc72d6b477188626e628ed89a01016437502c1deaf558da934b5d0cc808c2f2979ac853b6302b3d6ef763eddaff3a55552a55c0be710d5ca
+  languageName: node
+  linkType: hard
+
+"@types/d3-format@npm:*":
+  version: 3.0.4
+  resolution: "@types/d3-format@npm:3.0.4"
+  checksum: 10/b937ecd2712d4aa38d5b4f5daab9cc8a576383868be1809e046aec99eeb1f1798c139f2e862dc400a82494c763be46087d154891773417f8eb53c73762ba3eb8
+  languageName: node
+  linkType: hard
+
+"@types/d3-geo@npm:*":
+  version: 3.1.0
+  resolution: "@types/d3-geo@npm:3.1.0"
+  dependencies:
+    "@types/geojson": "npm:*"
+  checksum: 10/e759d98470fe605ff0088247af81c3197cefce72b16eafe8acae606216c3e0a9f908df4e7cd5005ecfe13b8ac8396a51aaa0d282f3ca7d1c3850313a13fac905
+  languageName: node
+  linkType: hard
+
+"@types/d3-hierarchy@npm:*":
+  version: 3.1.7
+  resolution: "@types/d3-hierarchy@npm:3.1.7"
+  checksum: 10/9ff6cdedf5557ef9e1e7a65ca3c6846c895c84c1184e11ec6fa48565e96ebf5482d8be5cc791a8bc7f7debbd0e62604ee3da3ddca4f9d58bf6c8b4030567c6c6
+  languageName: node
+  linkType: hard
+
+"@types/d3-interpolate@npm:*":
+  version: 3.0.4
+  resolution: "@types/d3-interpolate@npm:3.0.4"
+  dependencies:
+    "@types/d3-color": "npm:*"
+  checksum: 10/72a883afd52c91132598b02a8cdfced9e783c54ca7e4459f9e29d5f45d11fb33f2cabc844e42fd65ba6e28f2a931dcce1add8607d2f02ef6fb8ea5b83ae84127
+  languageName: node
+  linkType: hard
+
+"@types/d3-path@npm:*":
+  version: 3.1.0
+  resolution: "@types/d3-path@npm:3.1.0"
+  checksum: 10/7348d65c9b37c7023590d4e5ef11e37f9eee62df9fa23e0758da1fbd66a1cbff40e37cbe0b85e9388ab900451e9c18a5a973469e9fd725c8c85c4a3f84647b9d
+  languageName: node
+  linkType: hard
+
+"@types/d3-polygon@npm:*":
+  version: 3.0.2
+  resolution: "@types/d3-polygon@npm:3.0.2"
+  checksum: 10/7cf1eadb54f02dd3617512b558f4c0f3811f8a6a8c887d9886981c3cc251db28b68329b2b0707d9f517231a72060adbb08855227f89bef6ef30caedc0a67cab2
+  languageName: node
+  linkType: hard
+
+"@types/d3-quadtree@npm:*":
+  version: 3.0.6
+  resolution: "@types/d3-quadtree@npm:3.0.6"
+  checksum: 10/4c260c9857d496b7f112cf57680c411c1912cc72538a5846c401429e3ed89a097c66410cfd38b394bfb4733ec2cb47d345b4eb5e202cbfb8e78ab044b535be02
+  languageName: node
+  linkType: hard
+
+"@types/d3-random@npm:*":
+  version: 3.0.3
+  resolution: "@types/d3-random@npm:3.0.3"
+  checksum: 10/2c126dda6846f6c7e02c9123a30b4cdf27f3655d19b78456bbb330fbac27acceeeb987318055d3964dba8e6450377ff737db91d81f27c81ca6f4522c9b994ef2
+  languageName: node
+  linkType: hard
+
+"@types/d3-scale-chromatic@npm:*":
+  version: 3.0.3
+  resolution: "@types/d3-scale-chromatic@npm:3.0.3"
+  checksum: 10/cc5488af1136c3f9e28aa3c3ee2dc3e5e843c666f64360fb3870f0b8679cd2ee844edaa5a93504a9665deb98cb3c2ae2257d610c338fa8caa4a31ab6fdeb2f15
+  languageName: node
+  linkType: hard
+
+"@types/d3-scale@npm:*":
+  version: 4.0.8
+  resolution: "@types/d3-scale@npm:4.0.8"
+  dependencies:
+    "@types/d3-time": "npm:*"
+  checksum: 10/376e4f2199ee6db70906651587a4521976920fa5eaa847a976c434e7a8171cbfeeab515cc510c5130b1f64fcf95b9750a7fd21dfc0a40fc3398641aa7dd4e7e2
+  languageName: node
+  linkType: hard
+
+"@types/d3-selection@npm:*":
+  version: 3.0.11
+  resolution: "@types/d3-selection@npm:3.0.11"
+  checksum: 10/2d2d993b9e9553d066566cb22916c632e5911090db99e247bd8c32855a344e6b7c25b674f3c27956c367a6b3b1214b09931ce854788c3be2072003e01f2c75d7
+  languageName: node
+  linkType: hard
+
+"@types/d3-shape@npm:*":
+  version: 3.1.6
+  resolution: "@types/d3-shape@npm:3.1.6"
+  dependencies:
+    "@types/d3-path": "npm:*"
+  checksum: 10/75abf403ec5b8c11e761256aa6b3546533d61e2e12f15c82bed6b606e963dcdfb9868a2038c46099173c8830423b35ddaf14d1162f96ad9da18a2e90b0fa7d25
+  languageName: node
+  linkType: hard
+
+"@types/d3-time-format@npm:*":
+  version: 4.0.3
+  resolution: "@types/d3-time-format@npm:4.0.3"
+  checksum: 10/9dfc1516502ac1c657d6024bdb88b6dc7e21dd7bff88f6187616cf9a0108250f63507a2004901ece4f97cc46602005a2ca2d05c6dbe53e8a0f6899bd60d4ff7a
+  languageName: node
+  linkType: hard
+
+"@types/d3-time@npm:*":
+  version: 3.0.3
+  resolution: "@types/d3-time@npm:3.0.3"
+  checksum: 10/4e6bf24ec422f0893747e5020592e107bb3d96764a43d5f0bff666202bd71f052c73f735b50ec66296a6efd5766ca40b6a4e8ce3bbc61217dbe9467340608c12
+  languageName: node
+  linkType: hard
+
+"@types/d3-timer@npm:*":
+  version: 3.0.2
+  resolution: "@types/d3-timer@npm:3.0.2"
+  checksum: 10/1643eebfa5f4ae3eb00b556bbc509444d88078208ec2589ddd8e4a24f230dd4cf2301e9365947e70b1bee33f63aaefab84cd907822aae812b9bc4871b98ab0e1
+  languageName: node
+  linkType: hard
+
+"@types/d3-transition@npm:*":
+  version: 3.0.9
+  resolution: "@types/d3-transition@npm:3.0.9"
+  dependencies:
+    "@types/d3-selection": "npm:*"
+  checksum: 10/dad647c485440f176117e8a45f31aee9427d8d4dfa174eaa2f01e702641db53ad0f752a144b20987c7189723c4f0afe0bf0f16d95b2a91aa28937eee4339c161
+  languageName: node
+  linkType: hard
+
+"@types/d3-zoom@npm:*":
+  version: 3.0.8
+  resolution: "@types/d3-zoom@npm:3.0.8"
+  dependencies:
+    "@types/d3-interpolate": "npm:*"
+    "@types/d3-selection": "npm:*"
+  checksum: 10/cc6ba975cf4f55f94933413954d81b87feb1ee8b8cee8f2202cf526f218dcb3ba240cbeb04ed80522416201c4a7394b37de3eb695d840a36d190dfb2d3e62cb5
+  languageName: node
+  linkType: hard
+
+"@types/d3@npm:^7.4.3":
+  version: 7.4.3
+  resolution: "@types/d3@npm:7.4.3"
+  dependencies:
+    "@types/d3-array": "npm:*"
+    "@types/d3-axis": "npm:*"
+    "@types/d3-brush": "npm:*"
+    "@types/d3-chord": "npm:*"
+    "@types/d3-color": "npm:*"
+    "@types/d3-contour": "npm:*"
+    "@types/d3-delaunay": "npm:*"
+    "@types/d3-dispatch": "npm:*"
+    "@types/d3-drag": "npm:*"
+    "@types/d3-dsv": "npm:*"
+    "@types/d3-ease": "npm:*"
+    "@types/d3-fetch": "npm:*"
+    "@types/d3-force": "npm:*"
+    "@types/d3-format": "npm:*"
+    "@types/d3-geo": "npm:*"
+    "@types/d3-hierarchy": "npm:*"
+    "@types/d3-interpolate": "npm:*"
+    "@types/d3-path": "npm:*"
+    "@types/d3-polygon": "npm:*"
+    "@types/d3-quadtree": "npm:*"
+    "@types/d3-random": "npm:*"
+    "@types/d3-scale": "npm:*"
+    "@types/d3-scale-chromatic": "npm:*"
+    "@types/d3-selection": "npm:*"
+    "@types/d3-shape": "npm:*"
+    "@types/d3-time": "npm:*"
+    "@types/d3-time-format": "npm:*"
+    "@types/d3-timer": "npm:*"
+    "@types/d3-transition": "npm:*"
+    "@types/d3-zoom": "npm:*"
+  checksum: 10/12234aa093c8661546168becdd8956e892b276f525d96f65a7b32fed886fc6a569fe5a1171bff26fef2a5663960635f460c9504a6f2d242ba281a2b6c8c6465c
+  languageName: node
+  linkType: hard
+
 "@types/detect-port@npm:^1.3.0":
   version: 1.3.5
   resolution: "@types/detect-port@npm:1.3.5"
@@ -12249,6 +12628,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/dompurify@npm:^3.0.5":
+  version: 3.0.5
+  resolution: "@types/dompurify@npm:3.0.5"
+  dependencies:
+    "@types/trusted-types": "npm:*"
+  checksum: 10/e544b3ce53c41215cabff3d89256ff707c7ee8e0c9a1b5034b22014725d288b16e6942cdcdeeb4221c578c3421a6a4721aa0676431f55d7abd18c07368855c5e
+  languageName: node
+  linkType: hard
+
 "@types/ejs@npm:^3.1.1, @types/ejs@npm:^3.1.2":
   version: 3.1.5
   resolution: "@types/ejs@npm:3.1.5"
@@ -12337,6 +12725,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/geojson@npm:*":
+  version: 7946.0.14
+  resolution: "@types/geojson@npm:7946.0.14"
+  checksum: 10/ae511bee6488ae3bd5a3a3347aedb0371e997b14225b8983679284e22fa4ebd88627c6e3ff8b08bf4cc35068cb29310c89427311ffc9322c255615821a922e71
+  languageName: node
+  linkType: hard
+
 "@types/glob@npm:^8.0.0":
   version: 8.1.0
   resolution: "@types/glob@npm:8.1.0"
@@ -12848,6 +13243,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/trusted-types@npm:*":
+  version: 2.0.7
+  resolution: "@types/trusted-types@npm:2.0.7"
+  checksum: 10/8e4202766a65877efcf5d5a41b7dd458480b36195e580a3b1085ad21e948bc417d55d6f8af1fd2a7ad008015d4117d5fdfe432731157da3c68678487174e4ba3
+  languageName: node
+  linkType: hard
+
 "@types/unist@npm:*":
   version: 3.0.3
   resolution: "@types/unist@npm:3.0.3"
@@ -15950,6 +16352,31 @@ __metadata:
   languageName: node
   linkType: hard
 
+"chevrotain-allstar@npm:~0.3.0":
+  version: 0.3.1
+  resolution: "chevrotain-allstar@npm:0.3.1"
+  dependencies:
+    lodash-es: "npm:^4.17.21"
+  peerDependencies:
+    chevrotain: ^11.0.0
+  checksum: 10/a12c0e408c17920b5f8fc095b7981d15609a63b3795946005fdfc77a5bbc692bbdb196ea29ad4655f55bfa7c93bbcbe7fe2e5782475bf65761b33f13a4aa1a77
+  languageName: node
+  linkType: hard
+
+"chevrotain@npm:~11.0.3":
+  version: 11.0.3
+  resolution: "chevrotain@npm:11.0.3"
+  dependencies:
+    "@chevrotain/cst-dts-gen": "npm:11.0.3"
+    "@chevrotain/gast": "npm:11.0.3"
+    "@chevrotain/regexp-to-ast": "npm:11.0.3"
+    "@chevrotain/types": "npm:11.0.3"
+    "@chevrotain/utils": "npm:11.0.3"
+    lodash-es: "npm:4.17.21"
+  checksum: 10/8fa6253e51320dd4c3d386315b925734943e509d7954a2cd917746c0604461191bea57b0fb8fbab1903e0508fd94bfd35ebd0f8eace77cd0f3f42a9ee4f8f676
+  languageName: node
+  linkType: hard
+
 "chokidar@npm:>=3.0.0 <4.0.0, chokidar@npm:^3.0.0, chokidar@npm:^3.5.2, chokidar@npm:^3.5.3, chokidar@npm:^3.6.0":
   version: 3.6.0
   resolution: "chokidar@npm:3.6.0"
@@ -16190,6 +16617,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"clipboard@npm:^2.0.11":
+  version: 2.0.11
+  resolution: "clipboard@npm:2.0.11"
+  dependencies:
+    good-listener: "npm:^1.2.2"
+    select: "npm:^1.1.2"
+    tiny-emitter: "npm:^2.0.0"
+  checksum: 10/929e92c5667d53cb3beb9482d2e6fe7612588fb3c08982a6001a65ea306b38cd462412a902a7ced75dac3c2eac2e075f5d4be1297e0bf1a9e891e10bb7150b47
+  languageName: node
+  linkType: hard
+
 "cliui@npm:^6.0.0":
   version: 6.0.0
   resolution: "cliui@npm:6.0.0"
@@ -16443,7 +16881,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"commander@npm:7.2.0, commander@npm:^7.2.0":
+"commander@npm:7, commander@npm:7.2.0, commander@npm:^7.2.0":
   version: 7.2.0
   resolution: "commander@npm:7.2.0"
   checksum: 10/9973af10727ad4b44f26703bf3e9fdc323528660a7590efe3aa9ad5042b4584c0deed84ba443f61c9d6f02dade54a5a5d3c95e306a1e1630f8374ae6db16c06d
@@ -16655,6 +17093,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"confbox@npm:^0.1.8":
+  version: 0.1.8
+  resolution: "confbox@npm:0.1.8"
+  checksum: 10/4ebcfb1c6a3b25276734ec5722e88768eb61fc02f98e11960b845c5c62bc27fd05f493d2a8244d9675b24ef95afe4c0d511cdcad02c72f5eeea463cc26687999
+  languageName: node
+  linkType: hard
+
 "configstore@npm:^5.0.1":
   version: 5.0.1
   resolution: "configstore@npm:5.0.1"
@@ -17096,6 +17541,24 @@ __metadata:
   languageName: node
   linkType: hard
 
+"cose-base@npm:^1.0.0":
+  version: 1.0.3
+  resolution: "cose-base@npm:1.0.3"
+  dependencies:
+    layout-base: "npm:^1.0.0"
+  checksum: 10/52e1f4ae173738aebe14395e3f865dc10ce430156554bab52f4b8ef0c583375644348c2a226b83d97eebc7d35340919e7bc10d23a3e2fe51b853bf56f27b5da7
+  languageName: node
+  linkType: hard
+
+"cose-base@npm:^2.2.0":
+  version: 2.2.0
+  resolution: "cose-base@npm:2.2.0"
+  dependencies:
+    layout-base: "npm:^2.0.0"
+  checksum: 10/4d4b16a84188b8f9419d9dbaffca62561f0e0ee125569339782141111aaf2bec1d180270bbaf5a13ac956f6a8c6b74ab2431e456da239982046b9ddb612bde6a
+  languageName: node
+  linkType: hard
+
 "cosmiconfig-typescript-loader@npm:^5.0.0":
   version: 5.0.0
   resolution: "cosmiconfig-typescript-loader@npm:5.0.0"
@@ -17574,46 +18037,438 @@ __metadata:
   languageName: node
   linkType: hard
 
-"dargs@npm:^7.0.0":
-  version: 7.0.0
-  resolution: "dargs@npm:7.0.0"
-  checksum: 10/b8f1e3cba59c42e1f13a114ad4848c3fc1cf7470f633ee9e9f1043762429bc97d91ae31b826fb135eefde203a3fdb20deb0c0a0222ac29d937b8046085d668d1
+"cytoscape-cose-bilkent@npm:^4.1.0":
+  version: 4.1.0
+  resolution: "cytoscape-cose-bilkent@npm:4.1.0"
+  dependencies:
+    cose-base: "npm:^1.0.0"
+  peerDependencies:
+    cytoscape: ^3.2.0
+  checksum: 10/9ec2999159af62f1a251bf1e146a9a779085c4fdb1b8146596208f0097c0512fc4bffda53d3b00c87a1e8ae5024db3ebfb97162115216f5b4d024e314f4a03bb
   languageName: node
   linkType: hard
 
-"dargs@npm:^8.0.0":
-  version: 8.1.0
-  resolution: "dargs@npm:8.1.0"
-  checksum: 10/33f1b8f5f08e72c8a28355a87c0e1a9b6a0fec99252ecd9cf4735e65dd5f2e19747c860251ed5747b38e7204c7915fd7a7146aee5aaef5882c69169aae8b1d09
+"cytoscape-fcose@npm:^2.2.0":
+  version: 2.2.0
+  resolution: "cytoscape-fcose@npm:2.2.0"
+  dependencies:
+    cose-base: "npm:^2.2.0"
+  peerDependencies:
+    cytoscape: ^3.2.0
+  checksum: 10/927aa3b29c1d514c6513c5a785d7af7a8d0499eb166de1f42b958ef20d264ef9cbe238da0b65ae01860424972dce1c73017cf2afdae4f02f9a247f7031b00de3
   languageName: node
   linkType: hard
 
-"dashdash@npm:^1.12.0":
-  version: 1.14.1
-  resolution: "dashdash@npm:1.14.1"
+"cytoscape@npm:^3.29.2":
+  version: 3.30.3
+  resolution: "cytoscape@npm:3.30.3"
+  checksum: 10/41d9c5fd276a130bb7fbf27d0072ff2362b2ada8ef23fa63704fec57a31b65500c374a7a25d037bfb38d63fcf74a0f1723504497be8786b98fd548a5c41db355
+  languageName: node
+  linkType: hard
+
+"d3-array@npm:1 - 2":
+  version: 2.12.1
+  resolution: "d3-array@npm:2.12.1"
   dependencies:
-    assert-plus: "npm:^1.0.0"
-  checksum: 10/137b287fa021201ce100cef772c8eeeaaafdd2aa7282864022acf3b873021e54cb809e9c060fa164840bf54ff72d00d6e2d8da1ee5a86d7200eeefa1123a8f7f
+    internmap: "npm:^1.0.0"
+  checksum: 10/9fdfb91f428915006e126090fe9aa9d5fcbecc78e925eceb32de9dfb989135f6ad940a8f1b086d0b569523679f85453c5335772aa9e6d5d41b480c2610857c7f
   languageName: node
   linkType: hard
 
-"data-uri-to-buffer@npm:^4.0.0":
-  version: 4.0.1
-  resolution: "data-uri-to-buffer@npm:4.0.1"
-  checksum: 10/0d0790b67ffec5302f204c2ccca4494f70b4e2d940fea3d36b09f0bb2b8539c2e86690429eb1f1dc4bcc9e4df0644193073e63d9ee48ac9fce79ec1506e4aa4c
+"d3-array@npm:2 - 3, d3-array@npm:2.10.0 - 3, d3-array@npm:2.5.0 - 3, d3-array@npm:3, d3-array@npm:^3.2.0":
+  version: 3.2.4
+  resolution: "d3-array@npm:3.2.4"
+  dependencies:
+    internmap: "npm:1 - 2"
+  checksum: 10/5800c467f89634776a5977f6dae3f4e127d91be80f1d07e3e6e35303f9de93e6636d014b234838eea620f7469688d191b3f41207a30040aab750a63c97ec1d7c
   languageName: node
   linkType: hard
 
-"data-uri-to-buffer@npm:^6.0.2":
-  version: 6.0.2
-  resolution: "data-uri-to-buffer@npm:6.0.2"
-  checksum: 10/8b6927c33f9b54037f442856be0aa20e5fd49fa6c9c8ceece408dc306445d593ad72d207d57037c529ce65f413b421da800c6827b1dbefb607b8056f17123a61
+"d3-axis@npm:3":
+  version: 3.0.0
+  resolution: "d3-axis@npm:3.0.0"
+  checksum: 10/15ec43ecbd4e7b606fcda60f67a522e45576dfd6aa83dff47f3e91ef6c8448841a09cd91f630b492250dcec67c6ea64463510ead5e632ff6b827aeefae1d42ad
   languageName: node
   linkType: hard
 
-"data-urls@npm:^3.0.2":
-  version: 3.0.2
-  resolution: "data-urls@npm:3.0.2"
+"d3-brush@npm:3":
+  version: 3.0.0
+  resolution: "d3-brush@npm:3.0.0"
+  dependencies:
+    d3-dispatch: "npm:1 - 3"
+    d3-drag: "npm:2 - 3"
+    d3-interpolate: "npm:1 - 3"
+    d3-selection: "npm:3"
+    d3-transition: "npm:3"
+  checksum: 10/fa3a461b62f0f0ee6fe41f5babf45535a0a8f6d4999f675fb1dce932ee02eff72dec14c7296af31ca15998dc0141ccf5d02aa6499363f8bf2941d90688a1d644
+  languageName: node
+  linkType: hard
+
+"d3-chord@npm:3":
+  version: 3.0.1
+  resolution: "d3-chord@npm:3.0.1"
+  dependencies:
+    d3-path: "npm:1 - 3"
+  checksum: 10/4febcdca4fdc8ba91fc4f7545f4b6321c440150dff80c1ebef887db07bb4200395dfebede63b257393259de07f914da10842da5ab3135e1e281e33ad153e0849
+  languageName: node
+  linkType: hard
+
+"d3-color@npm:1 - 3, d3-color@npm:3":
+  version: 3.1.0
+  resolution: "d3-color@npm:3.1.0"
+  checksum: 10/536ba05bfd9f4fcd6fa289b5974f5c846b21d186875684637e22bf6855e6aba93e24a2eb3712985c6af3f502fbbfa03708edb72f58142f626241a8a17258e545
+  languageName: node
+  linkType: hard
+
+"d3-contour@npm:4":
+  version: 4.0.2
+  resolution: "d3-contour@npm:4.0.2"
+  dependencies:
+    d3-array: "npm:^3.2.0"
+  checksum: 10/0b252267e0c3c5e97d7e0c720bd35654de99f981199f7240d7dd1acfd4e2d5bf1638829f6db486452eff9c38608efa4a6ab5a0d1525131735c011ee7be3cb4ba
+  languageName: node
+  linkType: hard
+
+"d3-delaunay@npm:6":
+  version: 6.0.4
+  resolution: "d3-delaunay@npm:6.0.4"
+  dependencies:
+    delaunator: "npm:5"
+  checksum: 10/4588e2872d4154daaf2c3f34fefe74e43b909cc460238a7b02823907ca6dd109f2c488c57c8551f1a2607fe4b44fdf24e3a190cea29bca70ef5606678dd9e2de
+  languageName: node
+  linkType: hard
+
+"d3-dispatch@npm:1 - 3, d3-dispatch@npm:3":
+  version: 3.0.1
+  resolution: "d3-dispatch@npm:3.0.1"
+  checksum: 10/2b82f41bf4ef88c2f9033dfe32815b67e2ef1c5754a74137a74c7d44d6f0d6ecfa934ac56ed8afe358f6c1f06462e8aa42ca0a388397b5b77a42721570e80487
+  languageName: node
+  linkType: hard
+
+"d3-drag@npm:2 - 3, d3-drag@npm:3":
+  version: 3.0.0
+  resolution: "d3-drag@npm:3.0.0"
+  dependencies:
+    d3-dispatch: "npm:1 - 3"
+    d3-selection: "npm:3"
+  checksum: 10/80bc689935e5a46ee92b2d7f71e1c792279382affed9fbcf46034bff3ff7d3f50cf61a874da4bdf331037292b9e7dca5c6401a605d4bb699fdcb4e0c87e176ec
+  languageName: node
+  linkType: hard
+
+"d3-dsv@npm:1 - 3, d3-dsv@npm:3":
+  version: 3.0.1
+  resolution: "d3-dsv@npm:3.0.1"
+  dependencies:
+    commander: "npm:7"
+    iconv-lite: "npm:0.6"
+    rw: "npm:1"
+  bin:
+    csv2json: bin/dsv2json.js
+    csv2tsv: bin/dsv2dsv.js
+    dsv2dsv: bin/dsv2dsv.js
+    dsv2json: bin/dsv2json.js
+    json2csv: bin/json2dsv.js
+    json2dsv: bin/json2dsv.js
+    json2tsv: bin/json2dsv.js
+    tsv2csv: bin/dsv2dsv.js
+    tsv2json: bin/dsv2json.js
+  checksum: 10/a628ac42a272466940f713f310db2e5246690b22035121dc1230077070c9135fb7c9b4d260f093fcadf63b0528202a1953107448a4be3a860c4f42f50d09504d
+  languageName: node
+  linkType: hard
+
+"d3-ease@npm:1 - 3, d3-ease@npm:3":
+  version: 3.0.1
+  resolution: "d3-ease@npm:3.0.1"
+  checksum: 10/985d46e868494e9e6806fedd20bad712a50dcf98f357bf604a843a9f6bc17714a657c83dd762f183173dcde983a3570fa679b2bc40017d40b24163cdc4167796
+  languageName: node
+  linkType: hard
+
+"d3-fetch@npm:3":
+  version: 3.0.1
+  resolution: "d3-fetch@npm:3.0.1"
+  dependencies:
+    d3-dsv: "npm:1 - 3"
+  checksum: 10/cd35d55f8fbb1ea1e37be362a575bb0161449957133aa5b45b9891889b2aca1dc0769c240a236736e33cd823e820a0e73fb3744582307a5d26d1df7bed0ccecb
+  languageName: node
+  linkType: hard
+
+"d3-force@npm:3":
+  version: 3.0.0
+  resolution: "d3-force@npm:3.0.0"
+  dependencies:
+    d3-dispatch: "npm:1 - 3"
+    d3-quadtree: "npm:1 - 3"
+    d3-timer: "npm:1 - 3"
+  checksum: 10/85945f8d444d78567009518f0ab54c0f0c8873eb8eb9a2ff0ab667b0f81b419e101a411415d4a2c752547ec7143f89675e8c33b8f111e55e5579a04cb7f4591c
+  languageName: node
+  linkType: hard
+
+"d3-format@npm:1 - 3, d3-format@npm:3":
+  version: 3.1.0
+  resolution: "d3-format@npm:3.1.0"
+  checksum: 10/a0fe23d2575f738027a3db0ce57160e5a473ccf24808c1ed46d45ef4f3211076b34a18b585547d34e365e78dcc26dd4ab15c069731fc4b1c07a26bfced09ea31
+  languageName: node
+  linkType: hard
+
+"d3-geo@npm:3":
+  version: 3.1.1
+  resolution: "d3-geo@npm:3.1.1"
+  dependencies:
+    d3-array: "npm:2.5.0 - 3"
+  checksum: 10/dc5e980330d891dabf92869b98871b05ca2021c64d7ef253bcfd4f2348839ad33576fba474baecc2def86ebd3d943a11d93c0af26be0a2694f5bd59824838133
+  languageName: node
+  linkType: hard
+
+"d3-hierarchy@npm:3":
+  version: 3.1.2
+  resolution: "d3-hierarchy@npm:3.1.2"
+  checksum: 10/497b79dc6c35e28b21e8a7b94db92876abd1d4ec082d9803a07ea8964e55b0e71c511a21489363a36f1456f069adb8ff7d33c633678730d6ae961ed350b27733
+  languageName: node
+  linkType: hard
+
+"d3-interpolate@npm:1 - 3, d3-interpolate@npm:1.2.0 - 3, d3-interpolate@npm:3":
+  version: 3.0.1
+  resolution: "d3-interpolate@npm:3.0.1"
+  dependencies:
+    d3-color: "npm:1 - 3"
+  checksum: 10/988d66497ef5c190cf64f8c80cd66e1e9a58c4d1f8932d776a8e3ae59330291795d5a342f5a97602782ccbef21a5df73bc7faf1f0dc46a5145ba6243a82a0f0e
+  languageName: node
+  linkType: hard
+
+"d3-path@npm:1":
+  version: 1.0.9
+  resolution: "d3-path@npm:1.0.9"
+  checksum: 10/6ce1747837ea2a449d9ea32e169a382978ab09a4805eb408feb6bbc12cb5f5f6ce29aefc252dd9a815d420f4813d672f75578b78b3bbaf7811f54d8c7f93fd11
+  languageName: node
+  linkType: hard
+
+"d3-path@npm:1 - 3, d3-path@npm:3, d3-path@npm:^3.1.0":
+  version: 3.1.0
+  resolution: "d3-path@npm:3.1.0"
+  checksum: 10/8e97a9ab4930a05b18adda64cf4929219bac913a5506cf8585631020253b39309549632a5cbeac778c0077994442ddaaee8316ee3f380e7baf7566321b84e76a
+  languageName: node
+  linkType: hard
+
+"d3-polygon@npm:3":
+  version: 3.0.1
+  resolution: "d3-polygon@npm:3.0.1"
+  checksum: 10/c4fa2ed19dcba13fd341815361d27e64597aa0d38d377e401e1353c4acbe8bd73c0afb3e49a1cf4119fadc3651ec8073d06aa6d0e34e664c868d071e58912cd1
+  languageName: node
+  linkType: hard
+
+"d3-quadtree@npm:1 - 3, d3-quadtree@npm:3":
+  version: 3.0.1
+  resolution: "d3-quadtree@npm:3.0.1"
+  checksum: 10/1915b6a7b031fc312f9af61947072db9468c5a2b03837f6a90b38fdaebcd0ea17a883bffd94d16b8a6848e81711a06222f7d39f129386ef1850297219b8d32ba
+  languageName: node
+  linkType: hard
+
+"d3-random@npm:3":
+  version: 3.0.1
+  resolution: "d3-random@npm:3.0.1"
+  checksum: 10/9f41d6ca3a1826cea8d88392917b5039504337d442a4d1357c870fa3031701e60209a2689a6ddae7df8fca824383d038c957eb545bc49a7428c71aaf3b11f56f
+  languageName: node
+  linkType: hard
+
+"d3-sankey@npm:^0.12.3":
+  version: 0.12.3
+  resolution: "d3-sankey@npm:0.12.3"
+  dependencies:
+    d3-array: "npm:1 - 2"
+    d3-shape: "npm:^1.2.0"
+  checksum: 10/d5c679135a26d435e9970de3fc0778c6ef5c911f0c878b246939517b57a8daa2e2db6ef99318a0dad16e6079e4b89ef9166f1f661d8d247637875b764628094d
+  languageName: node
+  linkType: hard
+
+"d3-scale-chromatic@npm:3":
+  version: 3.1.0
+  resolution: "d3-scale-chromatic@npm:3.1.0"
+  dependencies:
+    d3-color: "npm:1 - 3"
+    d3-interpolate: "npm:1 - 3"
+  checksum: 10/25df6a7c621b9171df8b2225e98e41c0a6bcac4de02deb4807280b31116e8f495c5ac93301796098ee5b698cb690154e8138d90d72fd1fe36744c60e02a3d8c4
+  languageName: node
+  linkType: hard
+
+"d3-scale@npm:4":
+  version: 4.0.2
+  resolution: "d3-scale@npm:4.0.2"
+  dependencies:
+    d3-array: "npm:2.10.0 - 3"
+    d3-format: "npm:1 - 3"
+    d3-interpolate: "npm:1.2.0 - 3"
+    d3-time: "npm:2.1.1 - 3"
+    d3-time-format: "npm:2 - 4"
+  checksum: 10/e2dc4243586eae2a0fdf91de1df1a90d51dfacb295933f0ca7e9184c31203b01436bef69906ad40f1100173a5e6197ae753cb7b8a1a8fcfda43194ea9cad6493
+  languageName: node
+  linkType: hard
+
+"d3-selection@npm:2 - 3, d3-selection@npm:3":
+  version: 3.0.0
+  resolution: "d3-selection@npm:3.0.0"
+  checksum: 10/0e5acfd305b31628b7be5009ba7303d84bb34817a88ed4dde9c8bd9c23528573fc5272f89fc04e5be03d2cbf5441a248d7274aaf55a8ef3dad46e16333d72298
+  languageName: node
+  linkType: hard
+
+"d3-shape@npm:3":
+  version: 3.2.0
+  resolution: "d3-shape@npm:3.2.0"
+  dependencies:
+    d3-path: "npm:^3.1.0"
+  checksum: 10/2e861f4d4781ee8abd85d2b435f848d667479dcf01a4e0db3a06600a5bdeddedb240f88229ec7b3bf7fa300c2b3526faeaf7e75f9a24dbf4396d3cc5358ff39d
+  languageName: node
+  linkType: hard
+
+"d3-shape@npm:^1.2.0":
+  version: 1.3.7
+  resolution: "d3-shape@npm:1.3.7"
+  dependencies:
+    d3-path: "npm:1"
+  checksum: 10/1e40fdcfdc8edc9c53a77a6aaea2dbf31bf06df12ebd66cc8d91f76bbde753049ad21dfee0577f7dc5d0a4468554ede4783f6df7d809e291745334dba977c09e
+  languageName: node
+  linkType: hard
+
+"d3-time-format@npm:2 - 4, d3-time-format@npm:4":
+  version: 4.1.0
+  resolution: "d3-time-format@npm:4.1.0"
+  dependencies:
+    d3-time: "npm:1 - 3"
+  checksum: 10/ffc0959258fbb90e3890bfb31b43b764f51502b575e87d0af2c85b85ac379120d246914d07fca9f533d1bcedc27b2841d308a00fd64848c3e2cad9eff5c9a0aa
+  languageName: node
+  linkType: hard
+
+"d3-time@npm:1 - 3, d3-time@npm:2.1.1 - 3, d3-time@npm:3":
+  version: 3.1.0
+  resolution: "d3-time@npm:3.1.0"
+  dependencies:
+    d3-array: "npm:2 - 3"
+  checksum: 10/c110bed295ce63e8180e45b82a9b0ba114d5f33ff315871878f209c1a6d821caa505739a2b07f38d1396637155b8e7372632dacc018e11fbe8ceef58f6af806d
+  languageName: node
+  linkType: hard
+
+"d3-timer@npm:1 - 3, d3-timer@npm:3":
+  version: 3.0.1
+  resolution: "d3-timer@npm:3.0.1"
+  checksum: 10/004128602bb187948d72c7dc153f0f063f38ac7a584171de0b45e3a841ad2e17f1e40ad396a4af9cce5551b6ab4a838d5246d23492553843d9da4a4050a911e2
+  languageName: node
+  linkType: hard
+
+"d3-transition@npm:2 - 3, d3-transition@npm:3":
+  version: 3.0.1
+  resolution: "d3-transition@npm:3.0.1"
+  dependencies:
+    d3-color: "npm:1 - 3"
+    d3-dispatch: "npm:1 - 3"
+    d3-ease: "npm:1 - 3"
+    d3-interpolate: "npm:1 - 3"
+    d3-timer: "npm:1 - 3"
+  peerDependencies:
+    d3-selection: 2 - 3
+  checksum: 10/02571636acb82f5532117928a87fe25de68f088c38ab4a8b16e495f0f2d08a3fd2937eaebdefdfcf7f1461545524927d2632d795839b88d2e4c71e387aaaffac
+  languageName: node
+  linkType: hard
+
+"d3-zoom@npm:3":
+  version: 3.0.0
+  resolution: "d3-zoom@npm:3.0.0"
+  dependencies:
+    d3-dispatch: "npm:1 - 3"
+    d3-drag: "npm:2 - 3"
+    d3-interpolate: "npm:1 - 3"
+    d3-selection: "npm:2 - 3"
+    d3-transition: "npm:2 - 3"
+  checksum: 10/0e6e5c14e33c4ecdff311a900dd037dea407734f2dd2818988ed6eae342c1799e8605824523678bd404f81e37824cc588f62dbde46912444c89acc7888036c6b
+  languageName: node
+  linkType: hard
+
+"d3@npm:^7.9.0":
+  version: 7.9.0
+  resolution: "d3@npm:7.9.0"
+  dependencies:
+    d3-array: "npm:3"
+    d3-axis: "npm:3"
+    d3-brush: "npm:3"
+    d3-chord: "npm:3"
+    d3-color: "npm:3"
+    d3-contour: "npm:4"
+    d3-delaunay: "npm:6"
+    d3-dispatch: "npm:3"
+    d3-drag: "npm:3"
+    d3-dsv: "npm:3"
+    d3-ease: "npm:3"
+    d3-fetch: "npm:3"
+    d3-force: "npm:3"
+    d3-format: "npm:3"
+    d3-geo: "npm:3"
+    d3-hierarchy: "npm:3"
+    d3-interpolate: "npm:3"
+    d3-path: "npm:3"
+    d3-polygon: "npm:3"
+    d3-quadtree: "npm:3"
+    d3-random: "npm:3"
+    d3-scale: "npm:4"
+    d3-scale-chromatic: "npm:3"
+    d3-selection: "npm:3"
+    d3-shape: "npm:3"
+    d3-time: "npm:3"
+    d3-time-format: "npm:4"
+    d3-timer: "npm:3"
+    d3-transition: "npm:3"
+    d3-zoom: "npm:3"
+  checksum: 10/b0b418996bdf279b01f5c7a0117927f9ad3e833c9ce4657550ce6f6ace70b70cf829c4144b01df0be5a0f716d4e5f15ab0cadc5ff1ce1561d7be29ac86493d83
+  languageName: node
+  linkType: hard
+
+"dagre-d3-es@npm:7.0.11":
+  version: 7.0.11
+  resolution: "dagre-d3-es@npm:7.0.11"
+  dependencies:
+    d3: "npm:^7.9.0"
+    lodash-es: "npm:^4.17.21"
+  checksum: 10/5ea2faab020019a51e60791237239fc528bc20215503a846ad725c2e32dde6a270a16caf2ed6ec712b11e1c6616595b2b26e2c58f4f0e012218135629833e09b
+  languageName: node
+  linkType: hard
+
+"dargs@npm:^7.0.0":
+  version: 7.0.0
+  resolution: "dargs@npm:7.0.0"
+  checksum: 10/b8f1e3cba59c42e1f13a114ad4848c3fc1cf7470f633ee9e9f1043762429bc97d91ae31b826fb135eefde203a3fdb20deb0c0a0222ac29d937b8046085d668d1
+  languageName: node
+  linkType: hard
+
+"dargs@npm:^8.0.0":
+  version: 8.1.0
+  resolution: "dargs@npm:8.1.0"
+  checksum: 10/33f1b8f5f08e72c8a28355a87c0e1a9b6a0fec99252ecd9cf4735e65dd5f2e19747c860251ed5747b38e7204c7915fd7a7146aee5aaef5882c69169aae8b1d09
+  languageName: node
+  linkType: hard
+
+"dashdash@npm:^1.12.0":
+  version: 1.14.1
+  resolution: "dashdash@npm:1.14.1"
+  dependencies:
+    assert-plus: "npm:^1.0.0"
+  checksum: 10/137b287fa021201ce100cef772c8eeeaaafdd2aa7282864022acf3b873021e54cb809e9c060fa164840bf54ff72d00d6e2d8da1ee5a86d7200eeefa1123a8f7f
+  languageName: node
+  linkType: hard
+
+"data-uri-to-buffer@npm:^4.0.0":
+  version: 4.0.1
+  resolution: "data-uri-to-buffer@npm:4.0.1"
+  checksum: 10/0d0790b67ffec5302f204c2ccca4494f70b4e2d940fea3d36b09f0bb2b8539c2e86690429eb1f1dc4bcc9e4df0644193073e63d9ee48ac9fce79ec1506e4aa4c
+  languageName: node
+  linkType: hard
+
+"data-uri-to-buffer@npm:^6.0.2":
+  version: 6.0.2
+  resolution: "data-uri-to-buffer@npm:6.0.2"
+  checksum: 10/8b6927c33f9b54037f442856be0aa20e5fd49fa6c9c8ceece408dc306445d593ad72d207d57037c529ce65f413b421da800c6827b1dbefb607b8056f17123a61
+  languageName: node
+  linkType: hard
+
+"data-urls@npm:^3.0.2":
+  version: 3.0.2
+  resolution: "data-urls@npm:3.0.2"
   dependencies:
     abab: "npm:^2.0.6"
     whatwg-mimetype: "npm:^3.0.0"
@@ -17695,6 +18550,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"dayjs@npm:^1.11.10":
+  version: 1.11.13
+  resolution: "dayjs@npm:1.11.13"
+  checksum: 10/7374d63ab179b8d909a95e74790def25c8986e329ae989840bacb8b1888be116d20e1c4eee75a69ea0dfbae13172efc50ef85619d304ee7ca3c01d5878b704f5
+  languageName: node
+  linkType: hard
+
 "debug@npm:2.6.9, debug@npm:^2.6.9":
   version: 2.6.9
   resolution: "debug@npm:2.6.9"
@@ -17951,6 +18813,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"delaunator@npm:5":
+  version: 5.0.1
+  resolution: "delaunator@npm:5.0.1"
+  dependencies:
+    robust-predicates: "npm:^3.0.2"
+  checksum: 10/c378a55138d81d471a7214635b1a2c5e74f8ee06582f558df72f0c7c82c25868599ce9a18fb25a245c6c03cab886d17fb574681c78371b539dd069818703f53a
+  languageName: node
+  linkType: hard
+
 "delayed-stream@npm:~1.0.0":
   version: 1.0.0
   resolution: "delayed-stream@npm:1.0.0"
@@ -17958,6 +18829,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"delegate@npm:^3.1.2":
+  version: 3.2.0
+  resolution: "delegate@npm:3.2.0"
+  checksum: 10/d943058fe05897228b158cbd1bab05164df28c8f54127873231d6b03b0a5acc1b3ee1f98ac70ccc9b79cd84aa47118a7de111fee2923753491583905069da27d
+  languageName: node
+  linkType: hard
+
 "delegates@npm:^1.0.0":
   version: 1.0.0
   resolution: "delegates@npm:1.0.0"
@@ -18205,6 +19083,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"dompurify@npm:^3.0.11 <3.1.7":
+  version: 3.1.6
+  resolution: "dompurify@npm:3.1.6"
+  checksum: 10/036844bc9b717b172ba27f5863b56f950289a05d8eebfb702d6953bbf80bd021e480ce4217bd084567186f2d0ada13358ce5556963492cfe402d774e8667f120
+  languageName: node
+  linkType: hard
+
 "domutils@npm:^2.5.2, domutils@npm:^2.8.0":
   version: 2.8.0
   resolution: "domutils@npm:2.8.0"
@@ -18401,6 +19286,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"emoji-toolkit@npm:>= 8.0.0 < 10.0.0":
+  version: 9.0.1
+  resolution: "emoji-toolkit@npm:9.0.1"
+  checksum: 10/e2dd3edda04f3b6c0850512438cca8952a2750f04d884b9939850e08a77c296c36b824a298eca42cdce6cd6027df52684e4753cf3d1856a0e5a24560f084d5ee
+  languageName: node
+  linkType: hard
+
 "emojis-list@npm:^3.0.0":
   version: 3.0.0
   resolution: "emojis-list@npm:3.0.0"
@@ -20912,6 +21804,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"good-listener@npm:^1.2.2":
+  version: 1.2.2
+  resolution: "good-listener@npm:1.2.2"
+  dependencies:
+    delegate: "npm:^3.1.2"
+  checksum: 10/14a755ad2eeb5ca65b98359438a0bd0ed0ae27304913b1f0866e1424fdff957133644d455d03178fbcb0f83d2cdaae414cc9cbdfebf4bd04a690854cd4a657ee
+  languageName: node
+  linkType: hard
+
 "gopd@npm:^1.0.1":
   version: 1.0.1
   resolution: "gopd@npm:1.0.1"
@@ -20961,6 +21862,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"hachure-fill@npm:^0.5.2":
+  version: 0.5.2
+  resolution: "hachure-fill@npm:0.5.2"
+  checksum: 10/d78f1b992d1c8951a4fc893bf32045748132a8b481c15d6d31c77c05557f5fa86913a2b66b3c3a3c8ce46ca8e0a46b0b2aa11f979bc804d8edba77b8c30eb1ca
+  languageName: node
+  linkType: hard
+
 "hammerjs@npm:^2.0.8":
   version: 2.0.8
   resolution: "hammerjs@npm:2.0.8"
@@ -21599,7 +22507,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"iconv-lite@npm:0.6.3, iconv-lite@npm:^0.6.2, iconv-lite@npm:^0.6.3":
+"iconv-lite@npm:0.6, iconv-lite@npm:0.6.3, iconv-lite@npm:^0.6.2, iconv-lite@npm:^0.6.3":
   version: 0.6.3
   resolution: "iconv-lite@npm:0.6.3"
   dependencies:
@@ -21867,6 +22775,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"internmap@npm:1 - 2":
+  version: 2.0.3
+  resolution: "internmap@npm:2.0.3"
+  checksum: 10/873e0e7fcfe32f999aa0997a0b648b1244508e56e3ea6b8259b5245b50b5eeb3853fba221f96692bd6d1def501da76c32d64a5cb22a0b26cdd9b445664f805e0
+  languageName: node
+  linkType: hard
+
+"internmap@npm:^1.0.0":
+  version: 1.0.1
+  resolution: "internmap@npm:1.0.1"
+  checksum: 10/429cb9e28f393f10c73a826d71ba9e359711b7e42345bd684aba708f43b8139ce90f09b15abbf977a981474ac61615294854e5b9520d3f65187d0f6a2ff27665
+  languageName: node
+  linkType: hard
+
 "interpret@npm:^3.1.1":
   version: 3.1.1
   resolution: "interpret@npm:3.1.1"
@@ -23624,6 +24546,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"katex@npm:^0.16.0, katex@npm:^0.16.9":
+  version: 0.16.11
+  resolution: "katex@npm:0.16.11"
+  dependencies:
+    commander: "npm:^8.3.0"
+  bin:
+    katex: cli.js
+  checksum: 10/adfb95a70168f732c26f44a443d27df393ca641a3533aa9321f37b1b69134cf4b15142d533c187ec9a0b02c0bbfebab5ab26f15bd0cc08a57114e1f767f0d7ae
+  languageName: node
+  linkType: hard
+
 "keycharm@npm:^0.2.0":
   version: 0.2.0
   resolution: "keycharm@npm:0.2.0"
@@ -23660,6 +24593,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"khroma@npm:^2.1.0":
+  version: 2.1.0
+  resolution: "khroma@npm:2.1.0"
+  checksum: 10/a195e317bf6f3a1cba98df2677bf9bf6d14195ee0b1c3e5bc20a542cd99652682f290c196a8963956d87aed4ad65ac0bc8a15d75cddf00801fdafd148e01a5d2
+  languageName: node
+  linkType: hard
+
 "kind-of@npm:^6.0.2, kind-of@npm:^6.0.3":
   version: 6.0.3
   resolution: "kind-of@npm:6.0.3"
@@ -23746,6 +24686,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"kolorist@npm:^1.8.0":
+  version: 1.8.0
+  resolution: "kolorist@npm:1.8.0"
+  checksum: 10/71d5d122951cc65f2f14c3e1d7f8fd91694b374647d4f6deec3816d018cd04a44edd9578d93e00c82c2053b925e5d30a0565746c4171f4ca9fce1a13bd5f3315
+  languageName: node
+  linkType: hard
+
 "kuler@npm:^2.0.0":
   version: 2.0.0
   resolution: "kuler@npm:2.0.0"
@@ -23753,6 +24700,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"langium@npm:3.0.0":
+  version: 3.0.0
+  resolution: "langium@npm:3.0.0"
+  dependencies:
+    chevrotain: "npm:~11.0.3"
+    chevrotain-allstar: "npm:~0.3.0"
+    vscode-languageserver: "npm:~9.0.1"
+    vscode-languageserver-textdocument: "npm:~1.0.11"
+    vscode-uri: "npm:~3.0.8"
+  checksum: 10/2b0924373c09acb42ab88ddfe387bdafd33ce7f3cc36fcda4b9a9f864941c699b7e0a48c1afe81a9d9a15e15980d09d7889c8d89d046b92e7f813b9ea5514b12
+  languageName: node
+  linkType: hard
+
 "launch-editor@npm:^2.6.0, launch-editor@npm:^2.6.1":
   version: 2.9.1
   resolution: "launch-editor@npm:2.9.1"
@@ -23763,6 +24723,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"layout-base@npm:^1.0.0":
+  version: 1.0.2
+  resolution: "layout-base@npm:1.0.2"
+  checksum: 10/34504e61e4770e563cf49d4a56c8c10f1da0fb452cff89a652118783189c642ebc86a300d97cbc247e59a9c1eb06a2d419982f7dd10e8eedcab2414bc46d32f8
+  languageName: node
+  linkType: hard
+
+"layout-base@npm:^2.0.0":
+  version: 2.0.1
+  resolution: "layout-base@npm:2.0.1"
+  checksum: 10/b5cca04a2e327ea16374a0058f73544291aeb0026972677a128594aca3b627d26949140ab7d275798c7d39193a33b41c5a856d4509c1518f49c9a5f1dad39a20
+  languageName: node
+  linkType: hard
+
 "lazy-universal-dotenv@npm:^4.0.0":
   version: 4.0.0
   resolution: "lazy-universal-dotenv@npm:4.0.0"
@@ -24143,6 +25117,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"local-pkg@npm:^0.5.0":
+  version: 0.5.0
+  resolution: "local-pkg@npm:0.5.0"
+  dependencies:
+    mlly: "npm:^1.4.2"
+    pkg-types: "npm:^1.0.3"
+  checksum: 10/20f4caba50dc6fb00ffcc1a78bc94b5acb33995e0aadf4d4edcdeab257e891aa08f50afddf02f3240b2c3d02432bc2078f2a916a280ed716b64753a3d250db70
+  languageName: node
+  linkType: hard
+
 "locate-path@npm:^2.0.0":
   version: 2.0.0
   resolution: "locate-path@npm:2.0.0"
@@ -24190,6 +25174,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"lodash-es@npm:4.17.21, lodash-es@npm:^4.17.21":
+  version: 4.17.21
+  resolution: "lodash-es@npm:4.17.21"
+  checksum: 10/03f39878ea1e42b3199bd3f478150ab723f93cc8730ad86fec1f2804f4a07c6e30deaac73cad53a88e9c3db33348bb8ceeb274552390e7a75d7849021c02df43
+  languageName: node
+  linkType: hard
+
 "lodash.camelcase@npm:^4.3.0":
   version: 4.3.0
   resolution: "lodash.camelcase@npm:4.3.0"
@@ -24717,6 +25708,24 @@ __metadata:
   languageName: node
   linkType: hard
 
+"marked@npm:^12.0.0":
+  version: 12.0.2
+  resolution: "marked@npm:12.0.2"
+  bin:
+    marked: bin/marked.js
+  checksum: 10/24d4fc58d37c1779197fa7f93c504d8c71d4df54eb69cbbc14a55ba2a8e2ad83d723801fc25452c21ce74b38a483c5863c53449f130253a597be9e9c1d3e7e2b
+  languageName: node
+  linkType: hard
+
+"marked@npm:^13.0.2":
+  version: 13.0.3
+  resolution: "marked@npm:13.0.3"
+  bin:
+    marked: bin/marked.js
+  checksum: 10/95daf69e316879a3be112793f203093b2646aeeaa1b7eedc6ea7902bff6af44da045cd35c723711645bc7d92dbe872101e5a36976b48164e1efc1356b12a4a57
+  languageName: node
+  linkType: hard
+
 "marky@npm:^1.2.2":
   version: 1.2.5
   resolution: "marky@npm:1.2.5"
@@ -24889,6 +25898,35 @@ __metadata:
   languageName: node
   linkType: hard
 
+"mermaid@npm:>= 10.6.0 < 12.0.0":
+  version: 11.4.0
+  resolution: "mermaid@npm:11.4.0"
+  dependencies:
+    "@braintree/sanitize-url": "npm:^7.0.1"
+    "@iconify/utils": "npm:^2.1.32"
+    "@mermaid-js/parser": "npm:^0.3.0"
+    "@types/d3": "npm:^7.4.3"
+    "@types/dompurify": "npm:^3.0.5"
+    cytoscape: "npm:^3.29.2"
+    cytoscape-cose-bilkent: "npm:^4.1.0"
+    cytoscape-fcose: "npm:^2.2.0"
+    d3: "npm:^7.9.0"
+    d3-sankey: "npm:^0.12.3"
+    dagre-d3-es: "npm:7.0.11"
+    dayjs: "npm:^1.11.10"
+    dompurify: "npm:^3.0.11 <3.1.7"
+    katex: "npm:^0.16.9"
+    khroma: "npm:^2.1.0"
+    lodash-es: "npm:^4.17.21"
+    marked: "npm:^13.0.2"
+    roughjs: "npm:^4.6.6"
+    stylis: "npm:^4.3.1"
+    ts-dedent: "npm:^2.2.0"
+    uuid: "npm:^9.0.1"
+  checksum: 10/083197c6263b44ca5aec4bdce03aea181ad98f5cf4da62d751be1896c368d58ab427305ae185ca3b2b60af3ce16db7f975fee51023a414c2733cbd61803cc8b1
+  languageName: node
+  linkType: hard
+
 "metaviewport-parser@npm:0.3.0":
   version: 0.3.0
   resolution: "metaviewport-parser@npm:0.3.0"
@@ -25215,6 +26253,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"mlly@npm:^1.4.2, mlly@npm:^1.7.1, mlly@npm:^1.7.2":
+  version: 1.7.2
+  resolution: "mlly@npm:1.7.2"
+  dependencies:
+    acorn: "npm:^8.12.1"
+    pathe: "npm:^1.1.2"
+    pkg-types: "npm:^1.2.0"
+    ufo: "npm:^1.5.4"
+  checksum: 10/c28e9f32cfc7b204e4d089a9af01b6af30547f39dd97244486fe208523c1453828b694430ebfa2d06297116861d464f150d3273040bf5e11ef5a357958f142d5
+  languageName: node
+  linkType: hard
+
 "modify-values@npm:^1.0.1":
   version: 1.0.1
   resolution: "modify-values@npm:1.0.1"
@@ -25511,6 +26561,38 @@ __metadata:
   languageName: node
   linkType: hard
 
+"ngx-markdown@npm:^18.1.0":
+  version: 18.1.0
+  resolution: "ngx-markdown@npm:18.1.0"
+  dependencies:
+    clipboard: "npm:^2.0.11"
+    emoji-toolkit: "npm:>= 8.0.0 < 10.0.0"
+    katex: "npm:^0.16.0"
+    mermaid: "npm:>= 10.6.0 < 12.0.0"
+    prismjs: "npm:^1.28.0"
+    tslib: "npm:^2.3.0"
+  peerDependencies:
+    "@angular/common": ^18.0.0
+    "@angular/core": ^18.0.0
+    "@angular/platform-browser": ^18.0.0
+    marked: ">= 9.0.0 < 13.0.0"
+    rxjs: ^6.5.3 || ^7.4.0
+    zone.js: ~0.14.0
+  dependenciesMeta:
+    clipboard:
+      optional: true
+    emoji-toolkit:
+      optional: true
+    katex:
+      optional: true
+    mermaid:
+      optional: true
+    prismjs:
+      optional: true
+  checksum: 10/e0c418e489066c079b17b2c86e0e8f9d0899e2d8f1582d303d5ce75028488b6cd76a693e2ea328f223dbc8c42dc63e29cd61460507ae2c7d82af078e6581e58f
+  languageName: node
+  linkType: hard
+
 "ngx-monaco-editor-v2@npm:^18.0.0":
   version: 18.1.0
   resolution: "ngx-monaco-editor-v2@npm:18.1.0"
@@ -26679,6 +27761,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"package-manager-detector@npm:^0.2.0":
+  version: 0.2.2
+  resolution: "package-manager-detector@npm:0.2.2"
+  checksum: 10/2dc2914aeff0729c37c1cf9762f65c0a6f09d6c64f666cc187e34de95bca54f16b4ca2e3c1e9ced87ea0637cfdb3c98261a838de04d9f1b1b26b6ae72bd55b80
+  languageName: node
+  linkType: hard
+
 "pacote@npm:18.0.6":
   version: 18.0.6
   resolution: "pacote@npm:18.0.6"
@@ -26905,6 +27994,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"path-data-parser@npm:0.1.0, path-data-parser@npm:^0.1.0":
+  version: 0.1.0
+  resolution: "path-data-parser@npm:0.1.0"
+  checksum: 10/a23a214adb38074576a8873d25e8dea7e090b8396d86f58f83f3f6c6298ff56b06adc694147b67f0ed22f14dc478efa1d525710d3ec7b2d7b1efbac57e3fafe6
+  languageName: node
+  linkType: hard
+
 "path-equal@npm:^1.2.5":
   version: 1.2.5
   resolution: "path-equal@npm:1.2.5"
@@ -27022,6 +28118,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"pathe@npm:^1.1.2":
+  version: 1.1.2
+  resolution: "pathe@npm:1.1.2"
+  checksum: 10/f201d796351bf7433d147b92c20eb154a4e0ea83512017bf4ec4e492a5d6e738fb45798be4259a61aa81270179fce11026f6ff0d3fa04173041de044defe9d80
+  languageName: node
+  linkType: hard
+
 "pause-stream@npm:0.0.11, pause-stream@npm:^0.0.11":
   version: 0.0.11
   resolution: "pause-stream@npm:0.0.11"
@@ -27279,6 +28382,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"pkg-types@npm:^1.0.3, pkg-types@npm:^1.2.0":
+  version: 1.2.1
+  resolution: "pkg-types@npm:1.2.1"
+  dependencies:
+    confbox: "npm:^0.1.8"
+    mlly: "npm:^1.7.2"
+    pathe: "npm:^1.1.2"
+  checksum: 10/d61f4b7a2351b55b22f1d08f5f9b4236928d5660886131cc0e11576362e2b3bfcb54084bb4a0ba79147b707a27dcae87444a86e731113e152ffd3b6155ce5a5a
+  languageName: node
+  linkType: hard
+
 "playwright-core@npm:1.47.0":
   version: 1.47.0
   resolution: "playwright-core@npm:1.47.0"
@@ -27347,6 +28461,23 @@ __metadata:
   languageName: node
   linkType: hard
 
+"points-on-curve@npm:0.2.0, points-on-curve@npm:^0.2.0":
+  version: 0.2.0
+  resolution: "points-on-curve@npm:0.2.0"
+  checksum: 10/3f9a4a9f5a624bb307a72f5cdf1f7c29bedc546716664a2cfd7228085308575e63b461a3e64a88d3b451031655714eb49469d2ced392ee014b709132cd59be93
+  languageName: node
+  linkType: hard
+
+"points-on-path@npm:^0.2.1":
+  version: 0.2.1
+  resolution: "points-on-path@npm:0.2.1"
+  dependencies:
+    path-data-parser: "npm:0.1.0"
+    points-on-curve: "npm:0.2.0"
+  checksum: 10/8b3f42feb24433b4a3e0b1c1f951340f06f523b26ed4d87446829f500f1468ad1484a6bf7fedf076ff4b492ae6b1daa7ffc07c7a8f7c00f4d072f17f79fe9ed0
+  languageName: node
+  linkType: hard
+
 "portfinder@npm:^1.0.28":
   version: 1.0.32
   resolution: "portfinder@npm:1.0.32"
@@ -27897,7 +29028,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"prismjs@npm:^1.29.0":
+"prism-themes@npm:^1.9.0":
+  version: 1.9.0
+  resolution: "prism-themes@npm:1.9.0"
+  checksum: 10/401186c30be85d13d7db793576e1f494f207aa0c079832692d18e0c6ff0582a6aba8f7728abc01e47b55c3126e437584537490c31c7f3f5e119f16ba6bb91a9b
+  languageName: node
+  linkType: hard
+
+"prismjs@npm:^1.28.0, prismjs@npm:^1.29.0":
   version: 1.29.0
   resolution: "prismjs@npm:1.29.0"
   checksum: 10/2080db382c2dde0cfc7693769e89b501ef1bfc8ff4f8d25c07fd4c37ca31bc443f6133d5b7c145a73309dc396e829ddb7cc18560026d862a887ae08864ef6b07
@@ -29152,6 +30290,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"robust-predicates@npm:^3.0.2":
+  version: 3.0.2
+  resolution: "robust-predicates@npm:3.0.2"
+  checksum: 10/88bd7d45a6b89e88da2631d4c111aaaf0443de4d7078e9ab7f732245790a3645cf79bf91882a9740dbc959cf56ba75d5dced5bf2259410f8b6de19fd240cd08c
+  languageName: node
+  linkType: hard
+
 "rollup@npm:4.20.0":
   version: 4.20.0
   resolution: "rollup@npm:4.20.0"
@@ -29278,6 +30423,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"roughjs@npm:^4.6.6":
+  version: 4.6.6
+  resolution: "roughjs@npm:4.6.6"
+  dependencies:
+    hachure-fill: "npm:^0.5.2"
+    path-data-parser: "npm:^0.1.0"
+    points-on-curve: "npm:^0.2.0"
+    points-on-path: "npm:^0.2.1"
+  checksum: 10/76bd1e892d79b002dbc0591a28442462e027a77edfcdcd3dbbd2e404fa6d248891ade84ca656b24b1d40a29e3a9df5831633b7a7bb5c8551adcdac480a3dce79
+  languageName: node
+  linkType: hard
+
 "rrweb-cssom@npm:^0.7.1":
   version: 0.7.1
   resolution: "rrweb-cssom@npm:0.7.1"
@@ -29308,6 +30465,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"rw@npm:1":
+  version: 1.3.3
+  resolution: "rw@npm:1.3.3"
+  checksum: 10/e90985d64777a00f4ab5f8c0bfea2fb5645c6bda5238840afa339c8a4f86f776e8ce83731155643a7425a0b27ce89077dab27b2f57519996ba4d2fe54cac1941
+  languageName: node
+  linkType: hard
+
 "rxjs@npm:7.8.1, rxjs@npm:^7.2.0, rxjs@npm:^7.5.5, rxjs@npm:^7.8.0, rxjs@npm:^7.8.1":
   version: 7.8.1
   resolution: "rxjs@npm:7.8.1"
@@ -29568,6 +30732,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"select@npm:^1.1.2":
+  version: 1.1.2
+  resolution: "select@npm:1.1.2"
+  checksum: 10/4346151e94f226ea6131e44e68e6d837f3fdee64831b756dd657cc0b02f4cb5107f867cb34a1d1216ab7737d0bf0645d44546afb030bbd8d64e891f5e4c4814e
+  languageName: node
+  linkType: hard
+
 "selenium-webdriver@npm:3.6.0, selenium-webdriver@npm:^3.0.1":
   version: 3.6.0
   resolution: "selenium-webdriver@npm:3.6.0"
@@ -30765,6 +31936,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"stylis@npm:^4.3.1":
+  version: 4.3.4
+  resolution: "stylis@npm:4.3.4"
+  checksum: 10/69b902a3c9fc3329c8ddb18d422f8130068356dd4d4a20ae245953679cc88ae08d49c55e32b0b57c8fe8a76f2ed7f32697240b8db4d368a25fc2db045ebaeba8
+  languageName: node
+  linkType: hard
+
 "stylus-loader@npm:^7.1.0":
   version: 7.1.3
   resolution: "stylus-loader@npm:7.1.3"
@@ -31238,6 +32416,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"tiny-emitter@npm:^2.0.0":
+  version: 2.1.0
+  resolution: "tiny-emitter@npm:2.1.0"
+  checksum: 10/75633f4de4f47f43af56aff6162f25b87be7efc6f669fda256658f3c3f4a216f23dc0d13200c6fafaaf1b0c7142f0201352fb06aec0b77f68aea96be898f4516
+  languageName: node
+  linkType: hard
+
 "tiny-glob@npm:0.2.9":
   version: 0.2.9
   resolution: "tiny-glob@npm:0.2.9"
@@ -31269,6 +32454,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"tinyexec@npm:^0.3.0":
+  version: 0.3.1
+  resolution: "tinyexec@npm:0.3.1"
+  checksum: 10/0537c70590d52d354f40c0255ff0f654a3d18ddb3812b440ddf9d436edf516c8057838ad5a38744c0c59670ec03e3cf23fbe04ae3d49f031d948274e99002569
+  languageName: node
+  linkType: hard
+
 "tinylogic@npm:^2.0.0":
   version: 2.0.0
   resolution: "tinylogic@npm:2.0.0"
@@ -31479,7 +32671,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"ts-dedent@npm:^2.0.0":
+"ts-dedent@npm:^2.0.0, ts-dedent@npm:^2.2.0":
   version: 2.2.0
   resolution: "ts-dedent@npm:2.2.0"
   checksum: 10/93ed8f7878b6d5ed3c08d99b740010eede6bccfe64bce61c5a4da06a2c17d6ddbb80a8c49c2d15251de7594a4f93ffa21dd10e7be75ef66a4dc9951b4a94e2af
@@ -32056,6 +33248,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"ufo@npm:^1.5.4":
+  version: 1.5.4
+  resolution: "ufo@npm:1.5.4"
+  checksum: 10/a885ed421e656aea6ca64e9727b8118a9488715460b6f1a0f0427118adfe2f2830fe7c1d5bd9c5c754a332e6807516551cd663ea67ce9ed6a4e3edc739916335
+  languageName: node
+  linkType: hard
+
 "uglify-js@npm:^3.1.4":
   version: 3.19.3
   resolution: "uglify-js@npm:3.19.3"
@@ -32612,6 +33811,55 @@ __metadata:
   languageName: node
   linkType: hard
 
+"vscode-jsonrpc@npm:8.2.0":
+  version: 8.2.0
+  resolution: "vscode-jsonrpc@npm:8.2.0"
+  checksum: 10/6d57c3aed591d0bc89d1c226061d265b04de528582bef183f5998cac5de78a736887e5238fe48b9f6a14ec32f05d8fda71599f92862ac5dacc7f26bf7399b532
+  languageName: node
+  linkType: hard
+
+"vscode-languageserver-protocol@npm:3.17.5":
+  version: 3.17.5
+  resolution: "vscode-languageserver-protocol@npm:3.17.5"
+  dependencies:
+    vscode-jsonrpc: "npm:8.2.0"
+    vscode-languageserver-types: "npm:3.17.5"
+  checksum: 10/aeb9c190184c365fa6b835e5aa7574c86cb3ecb2789386bcff76a09b22bc8b8e0d5da47c28193a9c73cfb32c10a12a91191779280324a38efb401e3ef7bad294
+  languageName: node
+  linkType: hard
+
+"vscode-languageserver-textdocument@npm:~1.0.11":
+  version: 1.0.12
+  resolution: "vscode-languageserver-textdocument@npm:1.0.12"
+  checksum: 10/2bc0fde952d40f35a31179623d1491b0fafdee156aaf58557f40f5d394a25fc84826763cdde55fa6ce2ed9cd35a931355ad6dd7fe5db82e7f21e5d865f0af8c6
+  languageName: node
+  linkType: hard
+
+"vscode-languageserver-types@npm:3.17.5":
+  version: 3.17.5
+  resolution: "vscode-languageserver-types@npm:3.17.5"
+  checksum: 10/900d0b81df5bef8d90933e75be089142f6989cc70fdb2d5a3a5f11fa20feb396aaea23ccffc8fbcc83a2f0e1b13c6ee48ff8151f236cbd6e61a4f856efac1a58
+  languageName: node
+  linkType: hard
+
+"vscode-languageserver@npm:~9.0.1":
+  version: 9.0.1
+  resolution: "vscode-languageserver@npm:9.0.1"
+  dependencies:
+    vscode-languageserver-protocol: "npm:3.17.5"
+  bin:
+    installServerIntoExtension: bin/installServerIntoExtension
+  checksum: 10/1cb643b1b1f41a620aaf4a62e152acad694c22b4d98de73fa614a0bddf3b4b4832460465bdbc43f27ba23dad7e61aba533e77b8bfac74cc8de310c39623a7ba1
+  languageName: node
+  linkType: hard
+
+"vscode-uri@npm:~3.0.8":
+  version: 3.0.8
+  resolution: "vscode-uri@npm:3.0.8"
+  checksum: 10/e882d6b679e0d053cbc042893c0951a135d899a192b62cd07f0a8924f11ae722067a8d6b1b5b147034becf57faf9fff9fb543b17b749fd0f17db1f54f783f07c
+  languageName: node
+  linkType: hard
+
 "w3c-xmlserializer@npm:^4.0.0":
   version: 4.0.0
   resolution: "w3c-xmlserializer@npm:4.0.0"