Document extension manifests

src/content/docs/ext-dev/api.md

@@ -2,7 +2,7 @@
 title: Extension APIs
 description: moonlight-provided APIs and libraries
 sidebar:
-  order: 6
+  order: 7
 ---
 
 ## moonlight globals

src/content/docs/ext-dev/devtools.md

@@ -2,7 +2,7 @@
 title: Using DevTools
 description: The Chrome DevTools is a panel/window that offers several utilities for web development. Normally, it is intended for the creators of the target application, but it also serves as an excellent tool for client modders.
 sidebar:
-  order: 9
+  order: 10
 ---
 
 The Chrome DevTools is a panel/window that offers several utilities for web development. Normally, it is intended for the creators of the target application, but it also serves as an excellent tool for client modders.

src/content/docs/ext-dev/helpful-exts.md

@@ -2,7 +2,7 @@
 title: Helpful extensions
 description: This is a list of helpful extensions that can be used to aid extension development.
 sidebar:
-  order: 4
+  order: 5
 ---
 
 ## Config options

src/content/docs/ext-dev/manifest.md

@@ -0,0 +1,107 @@
+---
+title: Extension manifests
+description: The file that defines your extension
+sidebar:
+  order: 4
+---
+
+The extension manifest contains metadata about your extension. It is used to display information to the user in Moonbase, checking required dependencies, and the [API level](/ext-dev/migrating-api-levels).
+
+If your editor supports [JSON Schema](https://json-schema.org/), a schema for the manifest is available [here](https://moonlight-mod.github.io/manifest.schema.json). You can also reference [the type in the moonlight source code](https://github.com/moonlight-mod/moonlight/blob/main/packages/types/src/extension.ts).
+
+This is an example manifest, with every value filled in:
+
+```json title="manifest.json"
+{
+  "$schema": "https://moonlight-mod.github.io/manifest.schema.json",
+  "id": "example",
+  "version": "1.0.0",
+  "apiLevel": 2,
+  "environment": "both", // restricts loading to a certain platform
+  "meta": {
+    "name": "Example",
+    "tagline": "A short tagline that appears below the name",
+    "description": "A longer description that can **use Markdown**",
+    "authors": [
+      "You!",
+      {
+        "id": "42069", // currently unused
+        "name": "Also you!"
+      }
+    ],
+    "deprecated": true,
+    "tags": ["qol", "chat"],
+    "source": "https://github.com/moonlight-mod/moonlight"
+  },
+
+  // these are extension IDs
+  "dependencies": ["foo"],
+  "suggested": ["bar"],
+  "incompatible": ["baz"],
+
+  // see below for the various settings types
+  "settings": {
+    "exampleSetting": {
+      "displayName": "Example setting",
+      "type": "boolean",
+      "default": true
+    }
+  },
+
+  // extra URLs to allow/block
+  "cors": ["https://example.com"],
+  "blocked": ["https://example.com"]
+}
+```
+
+## Settings
+
+There are many settings types that you can use to configure your extension in Moonbase. The types for these are available [here](https://github.com/moonlight-mod/moonlight/blob/main/packages/types/src/config.ts).
+
+All settings types take optional `displayName` and `description` arguments, as well as a `default`. If a default is not provided, and the user hasn't configured the extension, the value returned from `moonlight.getConfigOption` will be undefined.
+
+Note that the type defined is purely for what component to use in Moonbase - it is up to you to ensure that you save the right type to the config file.
+
+### `boolean`
+
+Displays as a simple switch.
+
+### `number`
+
+Displays as a simple slider.
+
+- `min?: number` - The minimum value for the slider.
+- `max?: number` - The maximum value for the slider.
+
+### `string`
+
+Displays as a single line string input.
+
+### `multilinestring`
+
+Displays as a multiple line string input.
+
+### `select`
+
+A dropdown to pick between one of many values.
+
+- `options: SelectOption[]` - The options to choose.
+  - Either a `string` or `{ value: string; label: string; }`.
+
+### `multiselect`
+
+Same as `select`, but can pick multiple values.
+
+- `options: string[]` - The options to choose.
+
+### `list`
+
+A list of strings that the user can add or remove from.
+
+### `dictionary`
+
+A dictionary (key-value pair) that the user can add or remove from.
+
+### `custom`
+
+A custom component. You can use the `registerConfigComponent` function in [the Moonbase API](https://github.com/moonlight-mod/moonlight/blob/main/packages/core-extensions/src/moonbase/webpackModules/moonbase.ts) to register a React component to render here.

src/content/docs/ext-dev/mappings.md

@@ -2,7 +2,7 @@
 title: Mappings
 description: moonlight uses mappings that automatically rename Webpack modules for you.
 sidebar:
-  order: 7
+  order: 8
 ---
 
 moonlight uses [mappings](https://github.com/moonlight-mod/mappings) that automatically rename Webpack modules for you.

src/content/docs/ext-dev/migrating-api-levels.md

@@ -2,7 +2,7 @@
 title: Migrating API levels
 description: When a moonlight API level increases, all extensions with a different API level will refuse to load.
 sidebar:
-  order: 10
+  order: 11
 ---
 
 When a moonlight API level increases, all extensions with a different API level will refuse to load. The current API level is 2.

src/content/docs/ext-dev/pitfalls.md

@@ -2,7 +2,7 @@
 title: Pitfalls
 description: There are some important pitfalls you may encounter when writing moonlight extensions.
 sidebar:
-  order: 8
+  order: 9
 ---
 
 ## Web vs Node.js

src/content/docs/ext-dev/webpack.md

@@ -2,7 +2,7 @@
 title: Webpack modules & patching
 description: Information about the core of moonlight's mod system
 sidebar:
-  order: 5
+  order: 6
 ---
 
 [Webpack](https://webpack.js.org) is a library used by Discord to turn their codebase into a bundled JavaScript file. Code gets converted into Webpack "modules", which are individual functions that can require and load each other. You can think of them as individual files, each with their own code and exports, but converted into single functions inside of the client.