feat: Docs vNext (Docusaurus Migration) (#2793)

* boilerplate docusaurus in site/ dir

* wip typedoc plugin (doesn't work)

* patch for docusaurus-plugin-typedoc-api (issue 101)

* fixmaybe: cf pages buildroot/repo path

* fixmaybe: no ci change to typedoc path

* chore: use patch milesj/docusaurus-plugin-typedoc-api@86212cf

* feat: link symbols from docs

* fix: load typedoc json during plugin init

* migrate MDX components

* wip: copy/paste old docs with fixed image paths

* wip organize into sub-folder sections

* wip getting started

* temp: only warn on broken links during migration

* fix: function scope

* chore: upgrade to storybook@7.5.2

* fix: storybook css-loader

* wip docusaurus v3

* chore: use docusaurus 3.0.0 stable release

* fix: turn Notes into admonitions

* POC: live code editor + excalibur

* feat: support snippets, typechecked examples

* chore(deps): update typedoc plugin

* fix: ts errors in IFrameEmbed

* fix: only require excalibur on client build

* chore: migrate to docusaurus config es module

* fix(config): type errors

* poc: storybook build

* poc: storybook devServer + build

* poc: storybook build

* chore: remove storybook plugin poc

* poc: stackblitzkrieg

* undo: storybook example

* inverse the playground example/index.ts

* docs: Update collision groups

* feat: sync stackblitz theme with colorMode

* feat: Stackblitz support for asset pngs

* add shiki-twoslash preset

* feat: Shiki Twoslash for static code

* chore: update Actors and Engine Fundamentals page with twoslash

* fix lockfile

* fix: Animation includes

* fix: Actors include cuts

* docs: migrate blog!

* docs: Update logos + add dono page + add sample page

* Add premium support links

* docs: Update dono page

* docs: tweak dono size

* docs: fix build

* docs: upload pdn file

* docs: Add new social card prototype

* poc: build local excalibur in MultiCompiler step (dev no worky)

* fix: stackblitz works locally but only when forking

* fix: postcss for ex build

* styles: excaliblue

* refactor: move samples data to _data

* feat: algolia

* feat: support private tags

* plugin-redirect, add back path frontmatter

* chore: maintain all existing docs slugs

* Fix description, and broken link

* docs: Update trigger docs

* update base url to beta

* remove facebook link

* Fix search key

* New Tiled docs

* Update infinite tilemaps

* small tweaks to prose and examples

---------

Co-authored-by: Erik Onarheim <erik.onarheim@gmail.com>

.babelrc.json

@@ -0,0 +1,17 @@
+{
+  "sourceType": "unambiguous",
+  "presets": [
+    [
+      "@babel/preset-env",
+      {
+        "targets": {
+          "chrome": 100,
+          "safari": 15,
+          "firefox": 91
+        }
+      }
+    ],
+    "@babel/preset-typescript"
+  ],
+  "plugins": []
+}

.eslintignore

@@ -1,6 +1,7 @@
+site/
 scripts/apidocs.js
 scripts/release.js
 karma.conf.js
 webpack.config.js
 webpack.config.prod.js
-version.js
+version.js

.eslintrc.json

@@ -5,52 +5,88 @@
   },
   "parser": "@typescript-eslint/parser",
   "parserOptions": {
-    "project": ["./src/**/tsconfig.json"],
+    "project": [
+      "./src/**/tsconfig.json"
+    ],
     "sourceType": "module"
   },
-  "plugins": ["@typescript-eslint", "jsdoc"],
-  "extends": ["plugin:jsdoc/recommended", "prettier"],
+  "plugins": [
+    "@typescript-eslint",
+    "jsdoc"
+  ],
+  "extends": [
+    "plugin:jsdoc/recommended",
+    "prettier",
+    "plugin:storybook/recommended"
+  ],
   "rules": {
-    "@typescript-eslint/naming-convention": ["error",
+    "@typescript-eslint/naming-convention": [
+      "error",
       {
         "selector": "class",
-        "format": ["PascalCase"]
+        "format": [
+          "PascalCase"
+        ]
       },
       {
-
         "selector": "memberLike",
-        "modifiers": ["private", "static"],
-        "format": ["UPPER_CASE"],
+        "modifiers": [
+          "private",
+          "static"
+        ],
+        "format": [
+          "UPPER_CASE"
+        ],
         "leadingUnderscore": "require"
       },
       {
-
         "selector": "memberLike",
-        "modifiers": ["private"],
-        "format": ["camelCase"],
+        "modifiers": [
+          "private"
+        ],
+        "format": [
+          "camelCase"
+        ],
         "leadingUnderscore": "require"
       },
       {
         "selector": "interface",
-        "format": ["PascalCase"],
+        "format": [
+          "PascalCase"
+        ],
         "custom": {
           "regex": "^I[A-Z]",
           "match": false
         }
       }
     ],
-    "@typescript-eslint/indent": ["error", 2],
+    "@typescript-eslint/indent": [
+      "error",
+      2
+    ],
     "@typescript-eslint/no-empty-function": "error",
     "curly": "error",
     "dot-notation": "error",
     "no-caller": "error",
     "no-console": [
       "error",
       {
-        "allow": ["debug", "info", "time", "timeEnd", "trace"]
+        "allow": [
+          "debug",
+          "info",
+          "time",
+          "timeEnd",
+          "trace"
+        ]
+      }
+    ],
+    "quotes": [
+      "error",
+      "single",
+      {
+        "allowTemplateLiterals": true
       }
     ],
-    "quotes": ["error", "single", { "allowTemplateLiterals": true }],
     "no-debugger": "error",
     "no-empty": "error",
     "no-eval": "error",
@@ -61,14 +97,36 @@
     "prefer-const": "error",
     "require-await": "warn",
     "radix": "error",
-    "max-len": ["error", { "code": 140 }],
-    "semi": ["error", "always"],
-    "comma-dangle": ["error", "never"],
+    "max-len": [
+      "error",
+      {
+        "code": 140
+      }
+    ],
+    "semi": [
+      "error",
+      "always"
+    ],
+    "comma-dangle": [
+      "error",
+      "never"
+    ],
     "no-trailing-spaces": "error",
-    "eqeqeq": ["error", "smart"],
+    "eqeqeq": [
+      "error",
+      "smart"
+    ],
     "no-irregular-whitespace": "error",
-    "brace-style": ["error", "1tbs"],
-    "no-unused-expressions": ["error", { "allowTernary": true }],
+    "brace-style": [
+      "error",
+      "1tbs"
+    ],
+    "no-unused-expressions": [
+      "error",
+      {
+        "allowTernary": true
+      }
+    ],
     "keyword-spacing": "error",
     "jsdoc/require-param": 0,
     "jsdoc/require-param-description": 0,
@@ -77,7 +135,20 @@
     "jsdoc/require-returns-type": 0,
     "jsdoc/newline-after-description": 0,
     "jsdoc/no-multi-asterisks": 0,
-    "jsdoc/check-tag-names": ["error", { "definedTags": ["hidden", "internal", "source", "obsolete", "warning", "notimplemented", "credit", "typedoc"]}]
+    "jsdoc/check-tag-names": [
+      "error",
+      {
+        "definedTags": [
+          "hidden",
+          "internal",
+          "source",
+          "obsolete",
+          "warning",
+          "notimplemented",
+          "credit",
+          "typedoc"
+        ]
+      }
+    ]
   }
 }
-

.storybook/main.js

@@ -3,15 +3,25 @@ const path = require('path');
 module.exports = {
   stories: ['../src/stories/*.stories.ts'],
   addons: ['@storybook/addon-links', '@storybook/addon-essentials'],
-  core: {
-    builder: 'webpack5'
-  },
+
   webpackFinal: async (config, { configType }) => {
+    const cssLoader = config.module.rules.findIndex((r) => r.test && r.test.toString().includes('.css'));
+
+    if (cssLoader > -1) {
+      // TODO: Investigate why css-loader messes with toString() expressions
+      config.module.rules.splice(cssLoader, 1);
+    }
+
     config.module.rules.push({
       test: /\.glsl$/,
       use: ['raw-loader']
     });
 
+    config.module.rules.push({
+      test: /\.css$/,
+      use: ['css-loader']
+    });
+
     config.module.rules.push({
       test: /\.(tsx?)$/,
       use: [
@@ -36,5 +46,14 @@ module.exports = {
     }
 
     return config;
+  },
+
+  framework: {
+    name: '@storybook/html-webpack5',
+    options: {}
+  },
+
+  docs: {
+    autodocs: false
   }
 };