[website] adds TypeDoc documentation

Details:
- Upgrades various @type dependencies
- Adds docusaurus-plugin-typedoc and plugs it to docusaurus

package.json

@@ -57,12 +57,13 @@
   },
   "devDependencies": {
     "@babel/core": "^7.16.5",
-    "@types/chai": "^4.3.0",
-    "@types/mocha": "^9.0.0",
+    "@types/chai": "^4.3.6",
+    "@types/mocha": "^10.0.1",
+    "@types/node": "^20.6.5",
     "@types/pixelmatch": "^5.2.4",
-    "@types/pngjs": "^6.0.1",
-    "@types/tapable": "^2.2.2",
-    "@types/webpack-dev-server": "^4.5.0",
+    "@types/pngjs": "^6.0.2",
+    "@types/tapable": "^2.2.5",
+    "@types/webpack-dev-server": "^4.7.2",
     "@typescript-eslint/eslint-plugin": "^5.7.0",
     "@typescript-eslint/parser": "^5.7.0",
     "babel-eslint": "^10.1.0",
@@ -85,10 +86,9 @@
     "reload": "^3.2.0",
     "replace": "^1.2.1",
     "rimraf": "^3.0.2",
-    "ts-loader": "^9.2.6",
-    "ts-node": "^10.4.0",
-    "typedoc": "^0.22.10",
-    "typescript": "^4.5.4",
+    "ts-loader": "^9.4.4",
+    "ts-node": "^10.9.1",
+    "typescript": "^5.2.2",
     "webpack": "^5.65.0",
     "webpack-cli": "^4.9.1",
     "webpack-dev-server": "^4.6.0"

src/rendering/webgl/programs/common/program.ts

@@ -10,7 +10,7 @@ import type { RenderParams } from "../../../../types";
 import { canUse32BitsIndices } from "../../../../utils";
 import { loadVertexShader, loadFragmentShader, loadProgram } from "../../shaders/utils";
 
-const SIZE_FACTOR_PER_ATTRIBUTE_TYPE = {
+const SIZE_FACTOR_PER_ATTRIBUTE_TYPE: Record<number, number> = {
   [WebGL2RenderingContext.BOOL]: 1,
   [WebGL2RenderingContext.BYTE]: 1,
   [WebGL2RenderingContext.UNSIGNED_BYTE]: 1,

website/docs/advanced/events.md

@@ -7,18 +7,18 @@ sidebar_position: 5
 
 Sigma.js utilizes events as a mechanism to execute specific code in response to various actions or changes within a sigma instance. This event-driven approach allows for interactive and dynamic behaviors in graph visualizations.
 
-## Event Handling API
+## Event handling API
 
 Sigma.js's event handling API is modeled after the **[events](https://www.npmjs.com/package/events)** package in Node. However, a distinction is that events in sigma.js, along with their payloads, are typed. This design choice benefits the development experience, especially for TypeScript users, by offering clarity about the event data.
 
-## Interaction Events
+## Interaction events
 
 All interactive events in sigma.js come with a payload that contains an `event` object. This object includes:
 
 - `x` and `y`: Coordinates within the container where the event occurred.
 - `originalEvent`: The original MouseEvent or TouchEvent.
 
-### Node Events
+### Node events
 
 Node-specific events are triggered by interactions with graph nodes. The primary node events in sigma.js are:
 
@@ -32,7 +32,7 @@ Node-specific events are triggered by interactions with graph nodes. The primary
 
 The payload for these events, in addition to the `event` object, contains a `node` string, which is the ID of the associated node.
 
-### Edge Events
+### Edge events
 
 Edge-specific events are initiated by interactions with graph edges. The primary edge events in sigma.js are:
 
@@ -46,7 +46,7 @@ Edge-specific events are initiated by interactions with graph edges. The primary
 
 For these events, the payload, in addition to the `event` object, contains an `edge` string, which is the ID of the related edge. To ensure these events function correctly, the settings `enableEdgeClickEvents`, `enableEdgeWheelEvents`, and `enableEdgeHoverEvents` must be enabled. By default, these settings are set to `false`.
 
-### Stage Events
+### Stage events
 
 Stage events are triggered by interactions that occur on the stage, which is the overall container of the graph. The primary stage events in sigma.js are:
 
@@ -56,7 +56,7 @@ Stage events are triggered by interactions that occur on the stage, which is the
 - **doubleClickStage**
 - **wheelStage**
 
-## Lifecycle Events
+## Lifecycle events
 
 Sigma.js also emits events at specific lifecycle stages of the sigma instance. These events offer hooks for developers to run code at key moments in the graph's lifecycle. These events are:
 
@@ -67,7 +67,7 @@ Sigma.js also emits events at specific lifecycle stages of the sigma instance. T
 
 These lifecycle events do not come with any payload.
 
-## Custom Events
+## Custom events
 
 Leveraging the `EventEmitter` nature of the sigma instance, developers can emit and listen to custom events. This capability allows for tailored interactions and behaviors beyond the built-in events.
 

website/docs/advanced/renderers.md

@@ -38,15 +38,15 @@ Additionally, sigma.js offers helpers to compose programs, making it easier to c
 
 Sigma.js comes with a set of predefined programs:
 
-### For edges:
+### For edges
 
 - **`edge.line`**: This is the most efficient method, rendering edges using the `gl.LINES` method. However, it always draws edges as 1px thick lines, regardless of zoom levels.
 
 - **`edge.rectangle`**: This is the default edge renderer. It portrays edges as thick rectangles connecting node pairs, with each rectangle being represented by two triangles.
 
 - **`edge.arrow`**: This is a composite renderer that uses `edge.clamped` (for drawing the arrow body) and `edge.arrowHead` (for drawing the arrow head).
 
-### For nodes:
+### For nodes
 
 - **`node.point`**: This method displays nodes as squares using the `gl.POINTS` method. A circle is then "carved" into this square in the fragment shader. It's highly efficient in terms of both RAM and execution speed. However, due to the limitations of the `gl.POINTS` method, nodes can't be drawn with a radius exceeding 100px.
 

website/docusaurus.config.js

@@ -32,6 +32,32 @@ const config = {
     locales: ["en"],
   },
 
+  plugins: [
+    [
+      "docusaurus-plugin-typedoc",
+
+      // Plugin / TypeDoc options
+      {
+        entryPoints: [
+          "../src/sigma.ts",
+          "../src/core/camera.ts",
+          "../src/core/quadtree.ts",
+          "../src/core/captors/mouse.ts",
+          "../src/core/captors/touch.ts",
+        ],
+        watch: true,
+        tsconfig: "../tsconfig.json",
+        out: "typedoc",
+        readme: "none",
+        sidebar: {
+          categoryLabel: "TypeScript documentation",
+          position: 999,
+          fullNames: true,
+        },
+      },
+    ],
+  ],
+
   presets: [
     [
       "classic",