chore: release all packages (#9230)

Co-authored-by: Vlad Frangu <kingdgrizzle@gmail.com>

.commitlintrc.json

@@ -0,0 +1,11 @@
+{
+	"extends": ["@commitlint/config-angular"],
+	"rules": {
+		"type-enum": [
+			2,
+			"always",
+			["chore", "build", "ci", "docs", "feat", "fix", "perf", "refactor", "revert", "style", "test", "types", "typings"]
+		],
+		"scope-case": [0]
+	}
+}

.dockerignore

@@ -0,0 +1,56 @@
+# Packages
+node_modules/
+
+# Log files
+logs/
+*.log
+npm-debug.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+
+# Env
+.env
+
+# Dist
+dist/
+
+# Miscellaneous
+.tmp/
+.vscode/*
+.idea/
+.DS_Store
+.turbo
+tsconfig.tsbuildinfo
+coverage/
+__tests__/
+
+# yarn
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions
+
+# Cache
+.prettiercache
+.eslintcache
+
+# Docker specific
+.cliff-jumperrc.json
+api-extractor.json
+.eslintrc.json
+.lintstagedrc.cjs
+.lintstagedrc.cjs
+.prettierignore
+.prettierrc.js
+.prettierrc.cjs
+cliff.toml
+CHANGELOG.md
+README.md
+tsconfig.eslint.json
+docs/

.eslintrc.json

@@ -1,177 +1,14 @@
 {
-  "extends": ["eslint:recommended", "plugin:prettier/recommended"],
-  "plugins": ["import"],
-  "parserOptions": {
-    "ecmaVersion": 2020
-  },
-  "env": {
-    "es2020": true,
-    "node": true
-  },
-  "overrides": [{ "files": ["*.browser.js"], "env": { "browser": true } }],
-  "rules": {
-    "import/order": [
-      "error",
-      {
-        "groups": ["builtin", "external", "internal", "index", "sibling", "parent"],
-        "alphabetize": {
-          "order": "asc"
-        }
-      }
-    ],
-    "prettier/prettier": [
-      2,
-      {
-        "printWidth": 120,
-        "singleQuote": true,
-        "quoteProps": "as-needed",
-        "trailingComma": "all",
-        "endOfLine": "lf",
-        "arrowParens": "avoid"
-      }
-    ],
-    "strict": ["error", "global"],
-    "no-await-in-loop": "warn",
-    "no-compare-neg-zero": "error",
-    "no-template-curly-in-string": "error",
-    "no-unsafe-negation": "error",
-    "valid-jsdoc": [
-      "error",
-      {
-        "requireReturn": false,
-        "requireReturnDescription": false,
-        "prefer": {
-          "return": "returns",
-          "arg": "param"
-        },
-        "preferType": {
-          "String": "string",
-          "Number": "number",
-          "Boolean": "boolean",
-          "Symbol": "symbol",
-          "object": "Object",
-          "function": "Function",
-          "array": "Array",
-          "date": "Date",
-          "error": "Error",
-          "null": "void"
-        }
-      }
-    ],
-
-    "accessor-pairs": "warn",
-    "array-callback-return": "error",
-    "consistent-return": "error",
-    "curly": ["error", "multi-line", "consistent"],
-    "dot-location": ["error", "property"],
-    "dot-notation": "error",
-    "eqeqeq": "error",
-    "no-empty-function": "error",
-    "no-floating-decimal": "error",
-    "no-implied-eval": "error",
-    "no-invalid-this": "error",
-    "no-lone-blocks": "error",
-    "no-multi-spaces": "error",
-    "no-new-func": "error",
-    "no-new-wrappers": "error",
-    "no-new": "error",
-    "no-octal-escape": "error",
-    "no-return-assign": "error",
-    "no-return-await": "error",
-    "no-self-compare": "error",
-    "no-sequences": "error",
-    "no-throw-literal": "error",
-    "no-unmodified-loop-condition": "error",
-    "no-unused-expressions": "error",
-    "no-useless-call": "error",
-    "no-useless-concat": "error",
-    "no-useless-escape": "error",
-    "no-useless-return": "error",
-    "no-void": "error",
-    "no-warning-comments": "warn",
-    "prefer-promise-reject-errors": "error",
-    "require-await": "warn",
-    "wrap-iife": "error",
-    "yoda": "error",
-
-    "no-label-var": "error",
-    "no-shadow": "error",
-    "no-undef-init": "error",
-
-    "callback-return": "error",
-    "getter-return": "off",
-    "handle-callback-err": "error",
-    "no-mixed-requires": "error",
-    "no-new-require": "error",
-    "no-path-concat": "error",
-
-    "array-bracket-spacing": "error",
-    "block-spacing": "error",
-    "brace-style": ["error", "1tbs", { "allowSingleLine": true }],
-    "capitalized-comments": ["error", "always", { "ignoreConsecutiveComments": true }],
-    "comma-dangle": ["error", "always-multiline"],
-    "comma-spacing": "error",
-    "comma-style": "error",
-    "computed-property-spacing": "error",
-    "consistent-this": ["error", "$this"],
-    "eol-last": "error",
-    "func-names": "error",
-    "func-name-matching": "error",
-    "func-style": ["error", "declaration", { "allowArrowFunctions": true }],
-    "key-spacing": "error",
-    "keyword-spacing": "error",
-    "max-depth": "error",
-    "max-len": ["error", 120, 2],
-    "max-nested-callbacks": ["error", { "max": 4 }],
-    "max-statements-per-line": ["error", { "max": 2 }],
-    "new-cap": "off",
-    "newline-per-chained-call": ["error", { "ignoreChainWithDepth": 3 }],
-    "no-array-constructor": "error",
-    "no-inline-comments": "error",
-    "no-lonely-if": "error",
-    "no-multiple-empty-lines": ["error", { "max": 2, "maxEOF": 1, "maxBOF": 0 }],
-    "no-new-object": "error",
-    "no-spaced-func": "error",
-    "no-trailing-spaces": "error",
-    "no-unneeded-ternary": "error",
-    "no-whitespace-before-property": "error",
-    "nonblock-statement-body-position": "error",
-    "object-curly-spacing": ["error", "always"],
-    "operator-assignment": "error",
-    "padded-blocks": ["error", "never"],
-    "quote-props": ["error", "as-needed"],
-    "quotes": ["error", "single", { "avoidEscape": true, "allowTemplateLiterals": true }],
-    "semi-spacing": "error",
-    "semi": "error",
-    "space-before-blocks": "error",
-    "space-before-function-paren": [
-      "error",
-      {
-        "anonymous": "never",
-        "named": "never",
-        "asyncArrow": "always"
-      }
-    ],
-    "space-in-parens": "error",
-    "space-infix-ops": "error",
-    "space-unary-ops": "error",
-    "spaced-comment": "error",
-    "template-tag-spacing": "error",
-    "unicode-bom": "error",
-
-    "arrow-body-style": "error",
-    "arrow-parens": ["error", "as-needed"],
-    "arrow-spacing": "error",
-    "no-duplicate-imports": "error",
-    "no-useless-computed-key": "error",
-    "no-useless-constructor": "error",
-    "prefer-arrow-callback": "error",
-    "prefer-numeric-literals": "error",
-    "prefer-rest-params": "error",
-    "prefer-spread": "error",
-    "prefer-template": "error",
-    "rest-spread-spacing": "error",
-    "template-curly-spacing": "error",
-    "yield-star-spacing": "error"
-  }
+	"root": true,
+	"extends": ["neon/common", "neon/node", "neon/typescript", "neon/prettier"],
+	"parserOptions": {
+		"project": "./tsconfig.eslint.json"
+	},
+	"rules": {
+		"@typescript-eslint/consistent-type-definitions": ["error", "interface"]
+	},
+	"ignorePatterns": ["**/dist/*"],
+	"env": {
+		"jest": true
+	}
 }

.github/.kodiak.toml

@@ -0,0 +1,11 @@
+version = 1
+
+[merge]
+require_automerge_label = false
+blocking_labels = ['blocked']
+method = 'squash'
+
+[merge.message]
+title = 'pull_request_title'
+strip_html_comments = true
+include_coauthors = true

.github/CODE_OF_CONDUCT.md

@@ -0,0 +1,76 @@
+# Contributor Covenant Code of Conduct
+
+## Our Pledge
+
+In the interest of fostering an open and welcoming environment, we as
+contributors and maintainers pledge to make participation in our project and
+our community a harassment-free experience for everyone, regardless of age, body
+size, disability, ethnicity, sex characteristics, gender identity and expression,
+level of experience, education, socio-economic status, nationality, personal
+appearance, race, religion, or sexual identity and orientation.
+
+## Our Standards
+
+Examples of behavior that contributes to creating a positive environment
+include:
+
+- Using welcoming and inclusive language
+- Being respectful of differing viewpoints and experiences
+- Gracefully accepting constructive criticism
+- Focusing on what is best for the community
+- Showing empathy towards other community members
+
+Examples of unacceptable behavior by participants include:
+
+- The use of sexualized language or imagery and unwelcome sexual attention or
+  advances
+- Trolling, insulting/derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information, such as a physical or electronic
+  address, without explicit permission
+- Other conduct which could reasonably be considered inappropriate in a
+  professional setting
+
+## Our Responsibilities
+
+Project maintainers are responsible for clarifying the standards of acceptable
+behavior and are expected to take appropriate and fair corrective action in
+response to any instances of unacceptable behavior.
+
+Project maintainers have the right and responsibility to remove, edit, or
+reject comments, commits, code, wiki edits, issues, and other contributions
+that are not aligned to this Code of Conduct, or to ban temporarily or
+permanently any contributor for other behaviors that they deem inappropriate,
+threatening, offensive, or harmful.
+
+## Scope
+
+This Code of Conduct applies within all project spaces, and it also applies when
+an individual is representing the project or its community in public spaces.
+Examples of representing a project or community include using an official
+project e-mail address, posting via an official social media account, or acting
+as an appointed representative at an online or offline event. Representation of
+a project may be further defined and clarified by project maintainers.
+
+## Enforcement
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be
+reported by contacting the project team at https://discord.gg/djs. All
+complaints will be reviewed and investigated and will result in a response that
+is deemed necessary and appropriate to the circumstances. The project team is
+obligated to maintain confidentiality with regard to the reporter of an incident.
+Further details of specific enforcement policies may be posted separately.
+
+Project maintainers who do not follow or enforce the Code of Conduct in good
+faith may face temporary or permanent repercussions as determined by other
+members of the project's leadership.
+
+## Attribution
+
+This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
+available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html
+
+[homepage]: https://www.contributor-covenant.org
+
+For answers to common questions about this code of conduct, see
+https://www.contributor-covenant.org/faq

.github/COMMIT_CONVENTION.md

@@ -0,0 +1,91 @@
+## Git Commit Message Convention
+
+> This is adapted from [Angular's commit convention](https://github.com/conventional-changelog/conventional-changelog/tree/master/packages/conventional-changelog-angular).
+
+#### TL;DR:
+
+Messages must be matched by the following regex:
+
+```js
+/^(revert: )?(feat|fix|docs|style|refactor|perf|test|workflow|build|ci|chore|types|wip)(\(.+\))?: .{1,72}/;
+```
+
+#### Examples
+
+Appears under "Features" header, `GuildMember` subheader:
+
+```
+feat(GuildMember): add 'tag' method
+```
+
+Appears under "Bug Fixes" header, `Guild` subheader, with a link to issue #28:
+
+```
+fix(Guild): handle events correctly
+
+close #28
+```
+
+Appears under "Performance Improvements" header, and under "Breaking Changes" with the breaking change explanation:
+
+```
+perf(core): improve patching by removing 'bar' option
+
+BREAKING CHANGE: The 'bar' option has been removed.
+```
+
+The following commit and commit `667ecc1` do not appear in the changelog if they are under the same release. If not, the revert commit appears under the "Reverts" header.
+
+```
+revert: feat(Managers): add Managers
+
+This reverts commit 667ecc1654a317a13331b17617d973392f415f02.
+```
+
+### Full Message Format
+
+A commit message consists of a **header**, **body** and **footer**. The header has a **type**, **scope** and **subject**:
+
+```
+<type>(<scope>): <subject>
+<BLANK LINE>
+<body>
+<BLANK LINE>
+<footer>
+```
+
+The **header** is mandatory and the **scope** of the header is optional.
+
+### Revert
+
+If the commit reverts a previous commit, it should begin with `revert:`, followed by the header of the reverted commit. In the body, it should say: `This reverts commit <hash>.`, where the hash is the SHA of the commit being reverted.
+
+### Type
+
+If the prefix is `feat`, `fix` or `perf`, it will appear in the changelog. However, if there is any [BREAKING CHANGE](#footer), the commit will always appear in the changelog.
+
+Other prefixes are up to your discretion. Suggested prefixes are `docs`, `chore`, `style`, `refactor`, and `test` for non-changelog related tasks.
+
+### Scope
+
+The scope could be anything specifying the place of the commit change. For example `GuildMember`, `Guild`, `Message`, `TextChannel` etc...
+
+### Subject
+
+The subject contains a succinct description of the change:
+
+- use the imperative, present tense: "change" not "changed" nor "changes"
+- don't capitalize the first letter
+- no dot (.) at the end
+
+### Body
+
+Just as in the **subject**, use the imperative, present tense: "change" not "changed" nor "changes".
+The body should include the motivation for the change and contrast this with previous behavior.
+
+### Footer
+
+The footer should contain any information about **Breaking Changes** and is also the place to
+reference GitHub issues that this commit **Closes**.
+
+**Breaking Changes** should start with the word `BREAKING CHANGE:` with a space or two newlines. The rest of the commit message is then used for this.

.github/CONTRIBUTING.md

@@ -1,6 +1,6 @@
 # Contributing
 
-**The issue tracker is only for bug reports and enhancement suggestions. If you have a question, please ask it in the [Discord server](https://discord.gg/bRCvFy9) instead of opening an issue – you will get redirected there anyway.**
+**The issue tracker is only for bug reports and enhancement suggestions. If you have a question, please ask it in the [Discord server](https://discord.gg/djs) instead of opening an issue – you will get redirected there anyway.**
 
 If you wish to contribute to the discord.js codebase or documentation, feel free to fork the repository and submit a
 pull request. We use ESLint to enforce a consistent coding style, so having that set up in your editor of choice
@@ -10,9 +10,39 @@ is a great boon to your development process.
 
 To get ready to work on the codebase, please do the following:
 
-1. Fork & clone the repository, and make sure you're on the **master** branch
-2. Run `npm ci`
-3. If you're working on voice, also run `npm install @discordjs/opus` or `npm install opusscript`
+1. Fork & clone the repository, and make sure you're on the **main** branch
+2. Run `yarn --immutable` ([install](https://yarnpkg.com/getting-started/install))
+3. Run `yarn build` to build local packages
 4. Code your heart out!
-5. Run `npm test` to run ESLint and ensure any JSDoc changes are valid
-6. [Submit a pull request](https://github.com/discordjs/discord.js/compare) (Make sure you follow the [conventional commit format](https://github.com/discordjs/discord.js-next/blob/master/.github/COMMIT_CONVENTION.md))
+5. Run `yarn test` to run ESLint and ensure any JSDoc changes are valid
+6. [Submit a pull request](https://github.com/discordjs/discord.js/compare) (Make sure you follow the [conventional commit format](https://github.com/discordjs/discord.js/blob/main/.github/COMMIT_CONVENTION.md))
+
+## Testing changes locally
+
+If you want to test changes you've made locally, you can do so by using `yarn link`. This will create a symlink to your local copy of the discord.js libraries.
+
+1. Create a new directory `mkdir discordjs-test` and move into it `cd discordjs-test`
+2. Initialize a new yarn 3 project `yarn init -2`
+3. Disable pnp `yarn config set nodeLinker node-modules`
+4. Now link the local discord.js project you cloned earlier `yarn link -A {PATH_TO_DISCORDJS_REPO}`
+5. Install packages you'd like to test locally `yarn add discord.js@latest`, `yarn add @discordjs/rest@latest`, etc. **Note: Make sure you use `latest` tag or else yarn will try to install the remote package from npm**
+6. Import the package in your source code and test them out!
+
+### Working with TypeScript packages
+
+When testing local changes, you may notice you need to manually recompile TypeScript projects on every change in order to get the latest code changes to test locally.
+
+To avoid this you can use the `--watch` parameter in the package build script to automatically recompile the project when changes are detected.
+
+For example, to automatically recompile the `@discordjs/rest` project when changes are detected, run `yarn turbo run build --filter=@discordjs/rest -- --watch` in the root folder of where you cloned the discord.js repo.
+
+## Adding new packages
+
+If you'd like to create another package under the `@discordjs` organization run the following command:
+
+```bash
+yarn create-package <package-name> [package-description]
+```
+
+This will create new package directory under `packages/` with the required configuration files. You can
+begin to make changes within the `src/` directory.

.github/FUNDING.yml

@@ -1,11 +1,2 @@
-# These are supported funding model platforms
-
-# github: # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [user1, user2]
-# patreon: # Replace with a single Patreon username
-# open_collective: # Replace with a single Open Collective username
-# ko_fi: # Replace with a single Ko-fi username
-# tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel
-# custom: # Replace with a single custom sponsorship URL
-
-github: amishshah
-patreon: discordjs
+github: [iCrawl, amishshah, vladfrangu, kyranet]
+open_collective: discordjs

.github/ISSUE_TEMPLATE/bug_report.md

@@ -1,45 +0,0 @@
----
-
-name: Bug report
-about: Report incorrect or unexpected behaviour of discord.js
-title: ''
-labels: 's: unverified, type: bug'
-assignees: ''
----
-<!--
-If you need help with discord.js installation or usage, please go to the discord.js Discord server instead:
-  https://discord.gg/bRCvFy9
-This issue tracker is only for bug reports and enhancement suggestions.
-You won't receive any basic help here.
--->
-
-**Please describe the problem you are having in as much detail as possible:**
-
-**Include a reproducible code sample here, if possible:**
-
-```js
-// Place your code here
-```
-
-**Further details:**
-
-- discord.js version:
-- Node.js version:
-- Operating system:
-- Priority this issue should have – please be realistic and elaborate if possible:
-
-**Relevant client options:**
-
-- partials: none
-- gateway intents: none
-- other: none
-
-<!--
-If this applies to you, please check the respective checkbox: [ ] becomes [x].
-You don't have to modify the text to suit your particular situation – if you want to
-elaborate, please do so in the description.
-While it's not a requirement to test your issue on the master branch, it would make fixing
-the problem a lot easier for us, so please do so if possible.
--->
-
-- [ ] I have also tested the issue on latest master, commit hash:

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -0,0 +1,151 @@
+name: Bug report
+description: Report incorrect or unexpected behavior of a package
+labels: [bug, need repro]
+body:
+  - type: markdown
+    attributes:
+      value: |
+        Use Discord for questions: https://discord.gg/djs
+  - type: dropdown
+    id: package
+    attributes:
+      label: Which package is this bug report for?
+      options:
+        - discord.js
+        - brokers
+        - builders
+        - collection
+        - core
+        - formatters
+        - next
+        - proxy
+        - proxy-container
+        - rest
+        - voice
+        - ws
+    validations:
+      required: true
+  - type: textarea
+    id: description
+    attributes:
+      label: Issue description
+      description: |
+        Describe the issue in as much detail as possible.
+
+        Tip: You can attach images or log files by clicking this area to highlight it and then dragging files into it.
+      placeholder: |
+        Steps to reproduce with below code sample:
+        1. do thing
+        2. do thing in Discord client
+        3. observe behavior
+        4. see error logs below
+    validations:
+      required: true
+  - type: textarea
+    id: codesample
+    attributes:
+      label: Code sample
+      description: Include a reproducible, minimal code sample. This will be automatically formatted into code, so no need for backticks.
+      render: typescript
+      placeholder: |
+        Your code sample should be...
+        ... Minimal - Use as little code as possible that still produces the same problem (and is understandable)
+        ... Complete - Provide all parts someone else needs to reproduce your problem
+        ... Reproducible - Test the code you're about to provide to make sure it reproduces the problem
+  - type: input
+    id: djs-version
+    attributes:
+      label: Package version
+      description: Which version of the package are you using? Run `npm list <package>` in your project directory and paste the output.
+      placeholder: We no longer support version 12 or earlier of discord.js
+    validations:
+      required: true
+  - type: input
+    id: node-version
+    attributes:
+      label: Node.js version
+      description: |
+        Which version of Node.js are you using? Run `node --version` in your project directory and paste the output.
+        If you are using TypeScript, please include its version (`npm list typescript`) as well.
+      placeholder: Node.js version 16.9+ is required for version 14.0.0+
+    validations:
+      required: true
+  - type: input
+    id: os
+    attributes:
+      label: Operating system
+      description: Which OS does your application run on?
+  - type: dropdown
+    id: priority
+    attributes:
+      label: Priority this issue should have
+      description: Please be realistic. If you need to elaborate on your reasoning, please use the Issue description field above.
+      options:
+        - Low (slightly annoying)
+        - Medium (should be fixed soon)
+        - High (immediate attention needed)
+    validations:
+      required: true
+  - type: dropdown
+    id: partials
+    attributes:
+      label: Which partials do you have configured?
+      description: |
+        Check your Client constructor for the `partials` key.
+
+        Tip: you can select multiple items
+      options:
+        - Not applicable (subpackage bug)
+        - No Partials
+        - User
+        - Channel
+        - GuildMember
+        - Message
+        - Reaction
+        - GuildScheduledEvent
+        - ThreadMember
+      multiple: true
+    validations:
+      required: true
+  - type: dropdown
+    id: intents
+    attributes:
+      label: Which gateway intents are you subscribing to?
+      description: |
+        Check your Client constructor options for the `intents` key.
+
+        Tip: you can select multiple items
+      options:
+        - Not applicable (subpackage bug)
+        - No Intents
+        - Guilds
+        - GuildMembers
+        - GuildModeration
+        - GuildEmojisAndStickers
+        - GuildIntegrations
+        - GuildWebhooks
+        - GuildInvites
+        - GuildVoiceStates
+        - GuildPresences
+        - GuildMessages
+        - GuildMessageReactions
+        - GuildMessageTyping
+        - DirectMessages
+        - DirectMessageReactions
+        - DirectMessageTyping
+        - MessageContent
+        - GuildScheduledEvents
+        - AutoModerationConfiguration
+        - AutoModerationExecution
+      multiple: true
+    validations:
+      required: true
+  - type: input
+    id: dev-release
+    attributes:
+      label: I have tested this issue on a development release
+      placeholder: d23280c (commit hash)
+      description: |
+        The issue might already be fixed in a development release or main. This is not required, but helps us greatly.
+        [discord.js only] To install the latest development release run `npm i discord.js@dev` in your project directory.
+        Run `npm list discord.js` and use the last part of the printed information (`d23280c` for `discord.js@xx.x.x-dev.1530234593.d23280c`)

.github/ISSUE_TEMPLATE/config.yml

@@ -1,5 +1,5 @@
 blank_issues_enabled: false
 contact_links:
   - name: Discord server
-    url: https://discord.gg/bRCvFy9
-    about: Have questions or need support? Please go to the Discord server, as issues that are just support-related will be closed and redirected there.
+    url: https://discord.gg/djs
+    about: Please visit our Discord server for questions and support requests.

.github/ISSUE_TEMPLATE/feature_request.md

@@ -1,26 +0,0 @@
----
-
-name: Feature request
-about: Request a feature for the core discord.js library
-title: ''
-labels: 'type: enhancement'
-assignees: ''
----
-<!--
-If you need help with discord.js installation or usage, please go to the discord.js Discord server instead:
-  https://discord.gg/bRCvFy9
-This issue tracker is only for bug reports and enhancement suggestions.
-You likely won't receive any basic help here.
--->
-
-**Is your feature request related to a problem? Please describe.**
-A clear and concise description of what the problem is. Eg. I'm always frustrated when [...]
-
-**Describe the ideal solution**
-A clear and concise description of what you want to happen.
-
-**Describe alternatives you've considered**
-A clear and concise description of any alternative solutions or features you've considered.
-
-**Additional context**
-Add any other context or screenshots about the feature request here.

.github/ISSUE_TEMPLATE/feature_request.yml

@@ -0,0 +1,54 @@
+name: Feature request
+description: Request a new feature (discord.js accepts documented features of the official Discord developer API only!)
+labels: [feature request]
+body:
+  - type: markdown
+    attributes:
+      value: |
+        We can only implement features that Discord publishes, documents, and merges into the Discord API documentation.
+        We do not implement unreleased features.
+        Use Discord for questions: https://discord.gg/djs
+  - type: dropdown
+    id: package
+    attributes:
+      label: Which package is this feature request for?
+      options:
+        - discord.js
+        - brokers
+        - builders
+        - collection
+        - core
+        - formatters
+        - next
+        - proxy
+        - proxy-container
+        - rest
+        - voice
+        - ws
+    validations:
+      required: true
+  - type: textarea
+    id: description
+    attributes:
+      label: Feature
+      description: A clear and concise description of what the problem is, or what feature you want to be implemented.
+      placeholder: I'm always frustrated when..., Discord has recently released..., A good addition would be...
+    validations:
+      required: true
+  - type: textarea
+    id: solution
+    attributes:
+      label: Ideal solution or implementation
+      description: A clear and concise description of what you want to happen.
+    validations:
+      required: true
+  - type: textarea
+    id: alternatives
+    attributes:
+      label: Alternative solutions or implementations
+      description: A clear and concise description of any alternative solutions or features you have considered.
+  - type: textarea
+    id: additional-context
+    attributes:
+      label: Other context
+      description: Any other context, screenshots, or file uploads that help us understand your feature request.

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,12 +1,12 @@
 **Please describe the changes this PR makes and why it should be merged:**
 
-**Status**
+**Status and versioning classification:**
 
-- [ ] Code changes have been tested against the Discord API, or there are no code changes
-- [ ] I know how to update typings and have done so, or typings don't need updating
-
-**Semantic versioning classification:**
-
-- [ ] This PR changes the library's interface (methods or parameters added)
-  - [ ] This PR includes breaking changes (methods removed or renamed, parameters moved or removed)
-- [ ] This PR **only** includes non-code changes, like changes to documentation, README, etc.
+<!--
+Please move lines that apply to you out of the comment:
+- Code changes have been tested against the Discord API, or there are no code changes
+- I know how to update typings and have done so, or typings don't need updating
+- This PR changes the library's interface (methods or parameters added)
+- This PR includes breaking changes (methods removed or renamed, parameters moved or removed)
+- This PR **only** includes non-code changes, like changes to documentation, README, etc.
+-->

.github/SUPPORT.md

@@ -1,7 +1,7 @@
 # Seeking support?
 
-We're sorry, we only use this issue tracker for bugs in the library itself and feature requests for it. We are not able to provide general support or answser questions on the issue tracker.
+We only use this issue tracker for bug reports and feature request. We are not able to provide general support or answer questions in the form of GitHub issues.
 
-Should you want to ask such questions, please post in one of our support channels in our Discord server: https://discord.gg/bRCvFy9
+For general questions about discord.js installation and use please use the dedicated support channels in our Discord server: https://discord.gg/djs
 
-Any issues that don't directly involve a bug in the library or a feature request will likely be closed and redirected to the Discord server.
+Any issues that don't directly involve a bug or a feature request will likely be closed and redirected.

.github/auto_assign.yml

@@ -0,0 +1,8 @@
+addReviewers: true
+reviewers:
+  - iCrawl
+  - SpaceEEC
+  - kyranet
+  - vladfrangu
+numberOfReviewers: 0
+runOnDraft: true

.github/issue-labeler.yml

@@ -0,0 +1,24 @@
+packages:brokers:
+  - '### Which package is this (bug report|feature request) for\?\n\nbrokers'
+packages:builders:
+  - '### Which package is this (bug report|feature request) for\?\n\nbuilders'
+packages:collection:
+  - '### Which package is this (bug report|feature request) for\?\n\ncollection'
+packages:core:
+  - '### Which package is this (bug report|feature request) for\?\n\ncore'
+packages:discord.js:
+  - '### Which package is this (bug report|feature request) for\?\n\ndiscord.js'
+packages:formatters:
+  - '### Which package is this (bug report|feature request) for\?\n\nformatters'
+packages:next:
+  - '### Which package is this (bug report|feature request) for\?\n\nnext'
+packages:proxy:
+  - '### Which package is this (bug report|feature request) for\?\n\nproxy'
+packages:proxy-container:
+  - '### Which package is this (bug report|feature request) for\?\n\nproxy-container'
+packages:rest:
+  - '### Which package is this (bug report|feature request) for\?\n\nrest'
+packages:voice:
+  - '### Which package is this (bug report|feature request) for\?\n\nvoice'
+packages:ws:
+  - '### Which package is this (bug report|feature request) for\?\n\nws'

.github/labeler.yml

@@ -0,0 +1,51 @@
+apps:guide:
+  - apps/guide/*
+  - apps/guide/**/*
+apps:website:
+  - apps/website/*
+  - apps/website/**/*
+packages:brokers:
+  - packages/brokers/*
+  - packages/brokers/**/*
+packages:builders:
+  - packages/builders/*
+  - packages/builders/**/*
+packages:collection:
+  - packages/collection/*
+  - packages/collection/**/*
+packages:core:
+  - packages/core/*
+  - packages/core/**/*
+packages:discord.js:
+  - packages/discord.js/*
+  - packages/discord.js/**/*
+packages:next:
+  - packages/next/*
+  - packages/next/**/*
+packages:docgen:
+  - packages/docgen/*
+  - packages/docgen/**/*
+packages:formatters:
+  - packages/formatters/*
+  - packages/formatters/**/*
+packages:proxy:
+  - packages/proxy/*
+  - packages/proxy/**/*
+packages:proxy-container:
+  - packages/proxy-container/*
+  - packages/proxy-container/**/*
+packages:rest:
+  - packages/rest/*
+  - packages/rest/**/*
+packages:ui:
+  - packages/ui/*
+  - packages/ui/**/*
+packages:util:
+  - packages/util/*
+  - packages/util/**/*
+packages:voice:
+  - packages/voice/*
+  - packages/voice/**/*
+packages:ws:
+  - packages/ws/*
+  - packages/ws/**/*

.github/labels.yml

@@ -0,0 +1,118 @@
+- name: api changes
+  color: '5663e9'
+- name: api support
+  color: '5663e9'
+- name: apps:guide
+  color: fbca04
+- name: apps:website
+  color: fbca04
+- name: backlog
+  color: 7ef7ef
+- name: backport
+  color: 88aabb
+- name: blocked
+  color: fc1423
+- name: bug
+  color: d73a4a
+- name: caching
+  color: 80c042
+- name: chore
+  color: ffffff
+- name: ci
+  color: 0075ca
+- name: dependencies
+  color: 276bd1
+- name: discord
+  color: '5663e9'
+- name: discussion
+  color: b6b1f9
+- name: documentation
+  color: 0075ca
+- name: duplicate
+  color: cfd3d7
+- name: error handling
+  color: 80c042
+- name: feature request
+  color: fcf95a
+- name: gateway
+  color: 80c042
+- name: good first issue
+  color: 7057ff
+- name: has PR
+  color: 4b1f8e
+- name: help wanted
+  color: '008672'
+- name: in progress
+  color: ffccd7
+- name: in review
+  color: aed5fc
+- name: interactions
+  color: 80c042
+- name: invalid
+  color: e4e669
+- name: need repro
+  color: c66037
+- name: packages:brokers
+  color: fbca04
+- name: packages:builders
+  color: fbca04
+- name: packages:collection
+  color: fbca04
+- name: packages:core
+  color: fbca04
+- name: packages:discord.js
+  color: fbca04
+- name: packages:next
+  color: fbca04
+- name: packages:docgen
+  color: fbca04
+- name: packages:formatters
+  color: fbca04
+- name: packages:proxy
+  color: fbca04
+- name: packages:proxy-container
+  color: fbca04
+- name: packages:rest
+  color: fbca04
+- name: packages:ui
+  color: fbca04
+- name: packages:util
+  color: fbca04
+- name: packages:voice
+  color: fbca04
+- name: packages:ws
+  color: fbca04
+- name: performance
+  color: 80c042
+- name: permissions
+  color: 80c042
+- name: priority:high
+  color: fc1423
+- name: question (please use Discord instead)
+  color: d876e3
+- name: ratelimits
+  color: 80c042
+- name: refactor
+  color: 1d637f
+- name: regression
+  color: ea8785
+- name: REST
+  color: 80c042
+- name: semver:major
+  color: c10f47
+- name: semver:minor
+  color: e4f486
+- name: semver:patch
+  color: e8be8b
+- name: sharding
+  color: 80c042
+- name: tests
+  color: f06dff
+- name: threads
+  color: 80c042
+- name: typings
+  color: 80c042
+- name: utility
+  color: 80c042
+- name: wontfix
+  color: ffffff

.github/tsc.json

@@ -1,18 +1,18 @@
 {
-  "problemMatcher": [
-      {
-          "owner": "tsc",
-          "pattern": [
-              {
-                  "regexp": "^(?:\\s+\\d+\\>)?([^\\s].*)\\((\\d+),(\\d+)\\)\\s*:\\s+(error|warning|info)\\s+(\\w{1,2}\\d+)\\s*:\\s*(.*)$",
-                  "file": 1,
-                  "line": 2,
-                  "column": 3,
-                  "severity": 4,
-                  "code": 5,
-                  "message": 6
-              }
-          ]
-      }
-  ]
+	"problemMatcher": [
+		{
+			"owner": "tsc",
+			"pattern": [
+				{
+					"regexp": "^(?:\\s+\\d+\\>)?([^\\s].*)\\((\\d+),(\\d+)\\)\\s*:\\s+(error|warning|info)\\s+(\\w{1,2}\\d+)\\s*:\\s*(.*)$",
+					"file": 1,
+					"line": 2,
+					"column": 3,
+					"severity": 4,
+					"code": 5,
+					"message": 6
+				}
+			]
+		}
+	]
 }

.github/workflows/codeql-analysis.yml

@@ -1,27 +0,0 @@
-name: "CodeQL"
-on:
-  push:
-  pull_request:
-  schedule:
-    - cron: '0 */12 * * 4'
-jobs:
-  analyze:
-    name: Analyze
-    runs-on: ubuntu-latest
-
-    steps:
-    - name: Checkout repository
-      uses: actions/checkout@v2
-      with:
-        fetch-depth: 2
-
-    - run: git checkout HEAD^2
-      if: ${{ github.event_name == 'pull_request' }}
-
-    - name: Initialize CodeQL
-      uses: github/codeql-action/init@v1
-      with:
-        languages: javascript
-
-    - name: Perform CodeQL Analysis
-      uses: github/codeql-action/analyze@v1

.github/workflows/deploy.yml

@@ -1,49 +0,0 @@
-name: Deployment
-on:
-  push:
-    branches:
-      - '*'
-      - '!webpack'
-      - '!docs'
-    tags:
-      - '*'
-jobs:
-  docs:
-    name: Documentation
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@master
-
-      - name: Install Node v12
-        uses: actions/setup-node@master
-        with:
-          node-version: 12
-
-      - name: Install dependencies
-        run: npm ci
-
-      - name: Build and deploy documentation
-        uses: discordjs/action-docs@v1
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-
-  webpack:
-    name: webpack
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@master
-
-      - name: Install Node v12
-        uses: actions/setup-node@master
-        with:
-          node-version: 12
-
-      - name: Install dependencies
-        run: npm ci
-
-      - name: Build and deploy webpack
-        uses: discordjs/action-webpack@v1
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/documentation.yml

@@ -0,0 +1,166 @@
+name: Documentation
+on:
+  push:
+    branches:
+      - 'main'
+    paths:
+      - 'packages/*/src/**'
+    tags:
+      - '**'
+  workflow_dispatch:
+    inputs:
+      ref:
+        description: 'The branch, tag or SHA to checkout'
+        required: true
+      ref_type:
+        type: choice
+        description: 'Branch or tag'
+        options:
+          - branch
+          - tag
+        required: true
+concurrency:
+  group: ${{ github.workflow }}-${{ github.head_ref || github.ref }}
+  cancel-in-progress: true
+jobs:
+  build:
+    name: Build documentation
+    runs-on: ubuntu-latest
+    env:
+      TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
+      TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
+    if: github.repository_owner == 'discordjs'
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+        with:
+          ref: ${{ inputs.ref || '' }}
+
+      - name: Install node.js v16
+        uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
+      - name: Install dependencies
+        uses: ./packages/actions/src/yarnCache
+
+      - name: Build dependencies
+        run: yarn build
+
+      - name: Build docs
+        run: yarn docs
+
+      - name: Upload docgen artifacts
+        uses: actions/upload-artifact@v3
+        with:
+          name: docgen
+          path: packages/*/docs/docs.json
+
+      - name: Upload api-extractor artifacts
+        uses: actions/upload-artifact@v3
+        with:
+          name: api-extractor
+          path: packages/*/docs/docs.api.json
+
+  upload:
+    name: Upload Documentation
+    needs: build
+    strategy:
+      max-parallel: 1
+      fail-fast: false
+      matrix:
+        package:
+          [
+            'brokers',
+            'builders',
+            'collection',
+            'core',
+            'discord.js',
+            'next',
+            'formatters',
+            'proxy',
+            'rest',
+            'util',
+            'voice',
+            'ws',
+          ]
+    runs-on: ubuntu-latest
+    env:
+      TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
+      TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      - name: Install node.js v16
+        uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
+      - name: Install dependencies
+        uses: ./packages/actions/src/yarnCache
+
+      - name: Build actions
+        run: yarn workspace @discordjs/actions build
+
+      - name: Download docgen artifacts
+        uses: actions/download-artifact@v3
+        with:
+          name: docgen
+          path: docs
+
+      - name: Download api-extractor artifacts
+        uses: actions/download-artifact@v3
+        with:
+          name: api-extractor
+          path: docs
+
+      - name: Checkout docs repository
+        uses: actions/checkout@v3
+        with:
+          repository: 'discordjs/docs'
+          token: ${{ secrets.DJS_DOCS }}
+          path: 'out'
+
+      - name: Extract package and semver from tag
+        if: ${{ github.ref_type == 'tag' }}
+        id: extract-tag
+        uses: ./packages/actions/src/formatTag
+        with:
+          tag: ${{ github.ref_name }}
+
+      - name: Move docs to correct directory
+        if: ${{ github.ref_type == 'tag' && matrix.package == steps.extract-tag.outputs.package }}
+        env:
+          PACKAGE: ${{ steps.extract-tag.outputs.package }}
+          SEMVER: ${{ steps.extract-tag.outputs.semver }}
+        run: |
+          mkdir -p out/${PACKAGE}
+          if [[ $PACKAGE == "discord.js" ]]; then
+            mv docs/${PACKAGE}/docs/docs.json out/${PACKAGE}/${SEMVER}.json
+          fi
+          if [[ $PACKAGE != "discord.js" ]]; then
+            mv docs/${PACKAGE}/docs/docs.api.json out/${PACKAGE}/${SEMVER}.api.json
+          fi
+
+      - name: Move docs to correct directory
+        if: ${{ github.ref_type == 'branch' }}
+        env:
+          PACKAGE: ${{ matrix.package }}
+        run: |
+          mkdir -p out/${PACKAGE}
+          if [[ $PACKAGE == "discord.js" ]]; then
+            mv docs/${PACKAGE}/docs/docs.json out/${PACKAGE}/${GITHUB_REF_NAME}.json
+          fi
+          if [[ $PACKAGE != "discord.js" ]]; then
+            mv docs/${PACKAGE}/docs/docs.api.json out/${PACKAGE}/${GITHUB_REF_NAME}.api.json
+          fi
+
+      - name: Commit and push
+        run: |
+          cd out
+          git config user.name github-actions[bot]
+          git config user.email 41898282+github-actions[bot]@users.noreply.github.com
+          git add .
+          git commit -m "Docs build for ${GITHUB_REF_TYPE} ${GITHUB_REF_NAME}: ${GITHUB_SHA}" || true
+          git push

.github/workflows/issue-triage.yml

@@ -0,0 +1,15 @@
+name: 'Issue Labeler'
+on:
+  issues:
+    types: [opened]
+
+jobs:
+  issue-triage:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: github/issue-labeler@v2.5
+        with:
+          repo-token: '${{ secrets.GITHUB_TOKEN }}'
+          configuration-path: .github/issue-labeler.yml
+          not-before: 2023-01-13T10:25:03.847Z
+          enable-versioned-regex: 0

.github/workflows/label-sync.yml

@@ -0,0 +1,23 @@
+name: Label sync
+on:
+  schedule:
+    - cron: '0 0 * * *'
+  workflow_dispatch:
+  push:
+    branches:
+      - main
+    paths:
+      - '.github/labels.yml'
+jobs:
+  label-sync:
+    name: Label sync
+    runs-on: ubuntu-latest
+    if: github.repository_owner == 'discordjs'
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      - name: Label sync
+        uses: crazy-max/ghaction-github-labeler@v4
+        with:
+          github-token: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/nextjs-bundle-analysis.yml

@@ -0,0 +1,102 @@
+name: 'Next.js Bundle Analysis'
+on:
+  push:
+    branches:
+      - 'main'
+  pull_request_target:
+    paths:
+      - 'apps/website/**'
+  workflow_dispatch:
+defaults:
+  run:
+    working-directory: apps/website
+permissions:
+  contents: read
+  actions: read
+  pull-requests: write
+jobs:
+  analyze:
+    name: Analyze
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      - name: Install node.js v16
+        uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
+      - name: Install dependencies
+        uses: ./packages/actions/src/yarnCache
+
+      - name: Restore next build
+        uses: actions/cache@v3
+        id: restore-build-cache
+        env:
+          cache-name: cache-next-build
+        with:
+          path: apps/website/.next/cache
+          key: ${{ runner.os }}-build-${{ env.cache-name }}
+
+      - name: Build packages
+        run: yarn run --top-level build
+
+      - name: Build website
+        run: yarn workspace @discordjs/website run build:local
+
+      - name: Analyze bundle
+        run: npx -yes -p github:hashicorp/nextjs-bundle-analysis report
+
+      - name: Upload bundle
+        uses: actions/upload-artifact@v3
+        with:
+          name: bundle
+          path: apps/website/.next/analyze/__bundle_analysis.json
+
+      - name: Download base branch bundle stats
+        uses: dawidd6/action-download-artifact@v2
+        if: success() && github.event.number
+        with:
+          workflow: nextjs-bundle-analysis.yml
+          commit: ${{ github.event.pull_request.base.sha }}
+          path: apps/website/.next/analyze/base
+
+      - name: Compare with base branch bundle
+        if: success() && github.event.number
+        run: ls -laR .next/analyze/base && npx -yes -p github:hashicorp/nextjs-bundle-analysis compare
+
+      - name: Get comment body
+        id: get-comment-body
+        if: success() && github.event.number
+        uses: actions/github-script@v6
+        with:
+          result-encoding: string
+          script: |
+            const fs = require('fs');
+            const comment = fs.readFileSync('apps/website/.next/analyze/__bundle_analysis_comment.txt', 'utf8');
+            core.setOutput('body', comment);
+
+      - name: Find Comment
+        uses: peter-evans/find-comment@v2
+        if: success() && github.event.number
+        id: fc
+        with:
+          issue-number: ${{ github.event.number }}
+          body-includes: '<!-- __NEXTJS_BUNDLE -->'
+
+      - name: Create Comment
+        uses: peter-evans/create-or-update-comment@v2
+        if: success() && github.event.number && steps.fc.outputs.comment-id == 0
+        with:
+          issue-number: ${{ github.event.number }}
+          body: ${{ steps.get-comment-body.outputs.body }}
+
+      - name: Update Comment
+        uses: peter-evans/create-or-update-comment@v2
+        if: success() && github.event.number && steps.fc.outputs.comment-id != 0
+        with:
+          issue-number: ${{ github.event.number }}
+          body: ${{ steps.get-comment-body.outputs.body }}
+          comment-id: ${{ steps.fc.outputs.comment-id }}
+          edit-mode: replace

.github/workflows/npm-auto-deprecate.yml

@@ -0,0 +1,26 @@
+name: npm auto deprecate
+on:
+  schedule:
+    - cron: '0 1 * * *'
+  workflow_dispatch:
+jobs:
+  npm-auto-deprecate:
+    name: npm auto deprecate
+    runs-on: ubuntu-latest
+    if: github.repository_owner == 'discordjs'
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      - name: Install node.js v16
+        uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
+      - name: Install dependencies
+        uses: ./packages/actions/src/yarnCache
+
+      - name: Deprecate versions
+        run: 'yarn npm-deprecate --name "*dev*" --package @discordjs/brokers @discordjs/builders @discordjs/collection @discordjs/core @discordjs/formatters discord.js @discordjs/next @discordjs/proxy @discordjs/rest @discordjs/util @discordjs/voice @discordjs/ws'
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_PUBLISH_TOKEN }}

.github/workflows/pr-triage.yml

@@ -0,0 +1,17 @@
+name: 'PR Triage'
+on:
+  pull_request_target:
+jobs:
+  pr-triage:
+    name: PR Triage
+    runs-on: ubuntu-latest
+    steps:
+      - name: Automatically label PR
+        uses: actions/labeler@v4
+        with:
+          repo-token: '${{ secrets.GITHUB_TOKEN }}'
+          sync-labels: true
+
+      - name: Automatically assign reviewers
+        if: github.event.action == 'opened'
+        uses: kentaro-m/auto-assign-action@v1.2.3

.github/workflows/publish-dev-docker.yml

@@ -0,0 +1,25 @@
+name: Publish dev docker images
+on:
+  schedule:
+    - cron: '0 */12 * * *'
+  workflow_dispatch:
+jobs:
+  docker-publish:
+    name: Docker publish
+    runs-on: ubuntu-latest
+    if: github.repository_owner == 'discordjs'
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v2
+
+      - name: Login to DockerHub
+        run: echo ${{ secrets.DOCKER_ACCESS_TOKEN }} | docker login -u ${{ secrets.DOCKER_USERNAME }} --password-stdin
+
+      - name: Build the image
+        run: docker build -t discordjs/proxy:latest -f packages/proxy-container/Dockerfile .
+
+      - name: Push image to DockerHub
+        run: docker push discordjs/proxy:latest

.github/workflows/publish-dev.yml

@@ -0,0 +1,63 @@
+name: Publish dev
+on:
+  schedule:
+    - cron: '0 */12 * * *'
+  workflow_dispatch:
+jobs:
+  npm-publish:
+    name: npm publish
+    strategy:
+      fail-fast: false
+      matrix:
+        include:
+          - package: '@discordjs/brokers'
+            folder: 'brokers'
+          - package: '@discordjs/builders'
+            folder: 'builders'
+          - package: '@discordjs/collection'
+            folder: 'collection'
+          - package: '@discordjs/core'
+            folder: 'core'
+          - package: '@discordjs/formatters'
+            folder: 'formatters'
+          - package: 'discord.js'
+            folder: 'discord.js'
+          - package: '@discordjs/next'
+            folder: 'next'
+          - package: '@discordjs/proxy'
+            folder: 'proxy'
+          - package: '@discordjs/rest'
+            folder: 'rest'
+          - package: '@discordjs/util'
+            folder: 'util'
+          - package: '@discordjs/voice'
+            folder: 'voice'
+          - package: '@discordjs/ws'
+            folder: 'ws'
+    runs-on: ubuntu-latest
+    env:
+      TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
+      TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
+    if: github.repository_owner == 'discordjs'
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      - name: Install node.js v16
+        uses: actions/setup-node@v3
+        with:
+          node-version: 16
+          registry-url: https://registry.npmjs.org/
+
+      - name: Install dependencies
+        uses: ./packages/actions/src/yarnCache
+
+      - name: Build dependencies
+        run: yarn build
+
+      - name: Publish package
+        run: |
+          yarn workspace ${{ matrix.package }} release --preid "dev.$(date +%s)-$(git rev-parse --short HEAD)"
+          yarn workspace ${{ matrix.package }} npm publish --tag dev || true
+        env:
+          YARN_NPM_AUTH_TOKEN: ${{ secrets.NPM_PUBLISH_TOKEN }}

.github/workflows/publish-docker.yml

@@ -0,0 +1,25 @@
+name: Publish docker images
+on:
+  workflow_dispatch:
+jobs:
+  docker-publish:
+    name: Docker publish
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v2
+
+      - name: Login to DockerHub
+        run: echo ${{ secrets.DOCKER_ACCESS_TOKEN }} | docker login -u ${{ secrets.DOCKER_USERNAME }} --password-stdin
+
+      - name: Build docker image
+        run: docker build -t discordjs/proxy:latest -f packages/proxy-container/Dockerfile .
+
+      - name: Tag image with major
+        run: docker tag discordjs/proxy discordjs/proxy:$(cut -d '.' -f1 <<< $(jq --raw-output '.version' packages/proxy-container/package.json))
+
+      - name: Push image to DockerHub
+        run: docker push --all-tags discordjs/proxy

.github/workflows/publish-release.yml

@@ -0,0 +1,39 @@
+name: Publish Release
+on:
+  release:
+    types: [released]
+jobs:
+  npm-publish:
+    name: npm publish
+    runs-on: ubuntu-latest
+    env:
+      TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
+      TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
+    if: github.repository_owner == 'discordjs'
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      - name: Install node.js v16
+        uses: actions/setup-node@v3
+        with:
+          node-version: 16
+          registry-url: https://registry.npmjs.org/
+
+      - name: Install dependencies
+        uses: ./packages/actions/src/yarnCache
+
+      - name: Build dependencies
+        run: yarn build
+
+      - name: Extract package and semver from tag
+        id: extract-tag
+        uses: ./packages/actions/src/formatTag
+        with:
+          tag: ${{ github.ref_name }}
+
+      - name: Publish package
+        run: |
+          yarn workspace ${{ steps.extract-tag.outputs.subpackage == 'true' && '@discordjs/' || '' }}${{ steps.extract-tag.outputs.package }} npm publish
+        env:
+          YARN_NPM_AUTH_TOKEN: ${{ secrets.NPM_PUBLISH_TOKEN }}

.github/workflows/test-cron.yml

@@ -1,79 +0,0 @@
-name: Testing Cron
-on:
-  schedule:
-    - cron: '0 */12 * * *'
-jobs:
-  lint:
-    name: ESLint
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v1
-
-      - name: Install Node v12
-        uses: actions/setup-node@v1
-        with:
-          node-version: 12
-
-      - name: Install dependencies
-        run: npm ci
-
-      - name: Run ESLint
-        uses: icrawl/action-eslint@v1
-
-  typings:
-    name: TSLint
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v1
-
-      - name: Install Node v12
-        uses: actions/setup-node@v1
-        with:
-          node-version: 12
-
-      - name: Install dependencies
-        run: npm ci
-
-      - name: Run TSLint
-        run: npm run lint:typings
-
-  typescript:
-    name: TypeScript
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v2
-
-      - name: Install Node v12
-        uses: actions/setup-node@v1
-        with:
-          node-version: 12
-
-      - name: Install dependencies
-        run: npm ci
-
-      - name: Register Problem Matcher
-        run: echo "##[add-matcher].github/tsc.json"
-
-      - name: Run TypeScript compiler
-        run: npm run test:typescript
-
-  docs:
-    name: Documentation
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v1
-
-      - name: Install Node v12
-        uses: actions/setup-node@v1
-        with:
-          node-version: 12
-
-      - name: Install dependencies
-        run: npm ci
-
-      - name: Test documentation
-        run: npm run docs:test

.github/workflows/test.yml

@@ -1,77 +0,0 @@
-name: Testing
-on: [push, pull_request]
-jobs:
-  lint:
-    name: ESLint
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v2
-
-      - name: Install Node v12
-        uses: actions/setup-node@v1
-        with:
-          node-version: 12
-
-      - name: Install dependencies
-        run: npm ci
-
-      - name: Run ESLint
-        uses: icrawl/action-eslint@v1
-
-  typings:
-    name: TSLint
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v2
-
-      - name: Install Node v12
-        uses: actions/setup-node@v1
-        with:
-          node-version: 12
-
-      - name: Install dependencies
-        run: npm ci
-
-      - name: Run TSLint
-        run: npm run lint:typings
-
-  typescript:
-    name: TypeScript
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v2
-
-      - name: Install Node v12
-        uses: actions/setup-node@v1
-        with:
-          node-version: 12
-
-      - name: Install dependencies
-        run: npm ci
-
-      - name: Register Problem Matcher
-        run: echo "##[add-matcher].github/tsc.json"
-
-      - name: Run TypeScript compiler
-        run: npm run test:typescript
-
-  docs:
-    name: Documentation
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v2
-
-      - name: Install Node v12
-        uses: actions/setup-node@v1
-        with:
-          node-version: 12
-
-      - name: Install dependencies
-        run: npm ci
-
-      - name: Test documentation
-        run: npm run docs:test

.github/workflows/tests.yml

@@ -0,0 +1,64 @@
+name: Tests
+on:
+  push:
+  pull_request:
+concurrency:
+  # Group based on workflow name and PR if it exists, if no PR, let it run so carryforward flags work
+  group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
+  cancel-in-progress: true
+jobs:
+  tests:
+    name: Tests
+    runs-on: ubuntu-latest
+    env:
+      TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
+      TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+
+      - name: Install node.js v16
+        uses: actions/setup-node@v3
+        with:
+          node-version: 16
+
+      - name: Install dependencies
+        uses: ./packages/actions/src/yarnCache
+
+      - name: Build dependencies (PR)
+        if: ${{ github.event_name != 'push' }}
+        run: yarn build --filter="...[origin/${{ github.event_name == 'pull_request' && github.event.pull_request.base.ref || 'main' }}]"
+
+      - name: Build dependencies (Push)
+        if: ${{ github.event_name == 'push' }}
+        run: yarn build --filter="...[HEAD^1]"
+
+      - name: ESLint (PR)
+        if: ${{ github.event_name != 'push' }}
+        run: yarn lint --filter="...[origin/${{ github.event_name == 'pull_request' && github.event.pull_request.base.ref || 'main' }}]" -- --format=compact
+
+      - name: ESLint (Push)
+        if: ${{ github.event_name == 'push' }}
+        run: yarn lint --filter="...[HEAD^1]" -- --format=compact
+
+      - name: Tests (PR)
+        if: ${{ github.event_name != 'push' }}
+        run: yarn test --filter="...[origin/${{ github.event_name == 'pull_request' && github.event.pull_request.base.ref || 'main' }}]"
+
+      - name: Tests (Push)
+        if: ${{ github.event_name == 'push' }}
+        run: yarn test --filter="...[HEAD^1]"
+
+      - name: Docs (PR)
+        if: ${{ github.event_name != 'push' }}
+        run: yarn docs --filter="...[origin/${{ github.event_name == 'pull_request' && github.event.pull_request.base.ref || 'main' }}]"
+
+      - name: Docs (Push)
+        if: ${{ github.event_name == 'push' }}
+        run: yarn docs --filter="...[HEAD^1]"
+
+      - name: Upload Coverage
+        if: github.repository_owner == 'discordjs'
+        uses: ./packages/actions/src/uploadCoverage

.gitignore

@@ -1,23 +1,44 @@
 # Packages
 node_modules/
-yarn.lock
 
 # Log files
 logs/
 *.log
+npm-debug.log*
 
-# Authentication
-test/auth.json
-test/auth.js
-docs/deploy/deploy_key
-docs/deploy/deploy_key.pub
-deploy/deploy_key
-deploy/deploy_key.pub
+# Runtime data
+pids
+*.pid
+*.seed
+
+# Env
+.env
+
+# Dist
+dist/
+dist-docs/
 
 # Miscellaneous
 .tmp/
-.vscode/
+.vscode/*
+!.vscode/extensions.json
+!.vscode/settings.json
 .idea/
-docs/docs.json
-typings/index.js
-webpack/
+.DS_Store
+.turbo
+tsconfig.tsbuildinfo
+coverage/
+out/
+
+# yarn
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions
+
+# Cache
+.prettiercache
+.eslintcache

.husky/commit-msg

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+yarn commitlint --edit $1

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+yarn build:affected && yarn lint-staged

.lintstagedrc.json

@@ -0,0 +1,5 @@
+{
+	"*": "prettier --ignore-unknown --write",
+	"{src/**,__tests__/**}.{mjs,js,cjs,ts,tsx,astro}": "eslint --ext .mjs,.js,.cjs,.ts,.tsx,.astro --fix",
+	"src/**.ts": "vitest related --run --config ../../vitest.config.ts"
+}

.npmignore

@@ -1,26 +0,0 @@
-# Packages
-node_modules/
-yarn.lock
-
-# Log files
-logs/
-*.log
-
-# Authentication
-deploy/
-
-# Miscellaneous
-.tmp/
-.vscode/
-docs/
-
-# NPM ignore
-.eslintrc.json
-.gitattributes
-.gitignore
-.travis.yml
-webpack.config.js
-.github/
-test/
-tsconfig.json
-tslint.json

.prettierrc.json

@@ -0,0 +1,8 @@
+{
+	"printWidth": 120,
+	"useTabs": true,
+	"singleQuote": true,
+	"quoteProps": "as-needed",
+	"trailingComma": "all",
+	"endOfLine": "lf"
+}

.tern-project

@@ -1,17 +0,0 @@
-{
-  "ecmaVersion": 7,
-  "libs": [],
-  "loadEagerly": ["./src/*.js"],
-  "dontLoad": ["node_modules/**"],
-  "plugins": {
-    "es_modules": {},
-    "node": {},
-    "doc_comment": {
-      "fullDocs": true,
-      "strong": true
-    },
-    "webpack": {
-      "configPath": "./webpack.config.js"
-    }
-  }
-}

.vscode/extensions.json

@@ -0,0 +1,15 @@
+{
+	"recommendations": [
+		"esbenp.prettier-vscode",
+		"dbaeumer.vscode-eslint",
+		"tamasfe.even-better-toml",
+		"github.vscode-pull-request-github",
+		"codezombiech.gitignore",
+		"eamodio.gitlens",
+		"christian-kohler.npm-intellisense",
+		"christian-kohler.path-intellisense",
+		"antfu.unocss",
+		"astro-build.astro-vscode",
+		"unifiedjs.vscode-mdx"
+	]
+}

.vscode/settings.json

@@ -0,0 +1,19 @@
+{
+	"eslint.workingDirectories": [{ "pattern": "./apps/*" }, { "pattern": "./packages/*" }],
+	"eslint.validate": ["javascript", "javascriptreact", "astro", "typescript", "typescriptreact"],
+	"prettier.documentSelectors": ["**/*.astro"],
+	"editor.defaultFormatter": "esbenp.prettier-vscode",
+	"editor.formatOnSave": true,
+	"editor.codeActionsOnSave": {
+		"source.fixAll": true,
+		"source.organizeImports": false
+	},
+	"editor.trimAutoWhitespace": false,
+	"files.associations": {
+		"*.mdx": "markdown"
+	},
+	"files.insertFinalNewline": true,
+	"files.eol": "\n",
+	"npm.packageManager": "yarn",
+	"typescript.tsdk": "node_modules/typescript/lib"
+}

.yarn/patches/@microsoft-tsdoc-config-npm-0.16.2-30fd115d09.patch

@@ -0,0 +1,14 @@
+diff --git a/lib/TSDocConfigFile.js b/lib/TSDocConfigFile.js
+index caf3515d60fd386c5909db5a0aa8b4180b10d602..6fa4f1984b6ba6b3a7aecd05e54477ebf141af94 100644
+--- a/lib/TSDocConfigFile.js
++++ b/lib/TSDocConfigFile.js
+@@ -31,8 +31,7 @@ const ajv_1 = __importDefault(require("ajv"));
+ const jju = __importStar(require("jju"));
+ const ajv = new ajv_1.default({ verbose: true });
+ function initializeSchemaValidator() {
+-    const jsonSchemaPath = resolve.sync('@microsoft/tsdoc/schemas/tsdoc.schema.json', { basedir: __dirname });
+-    const jsonSchemaContent = fs.readFileSync(jsonSchemaPath).toString();
++    const jsonSchemaContent = "{\"title\":\"TSDoc Configuration\",\"description\":\"Describes the TSDoc configuration for a TypeScript project\",\"type\":\"object\",\"properties\":{\"$schema\":{\"description\":\"Part of the JSON Schema standard, this optional keyword declares the URL of the schema that the file conforms to. Editors may download the schema and use it to perform syntax highlighting.\",\"type\":\"string\"},\"extends\":{\"description\":\"Optionally specifies one or more JSON config files that will be combined with this file.  This provides a way for standard settings to be shared across multiple projects.  Important: The \\\"extends\\\" paths are resolved using NodeJS module resolution, so a path to a local file MUST be prefixed with \\\"./\\\".\",\"type\":\"array\",\"items\":{\"type\":\"string\"}},\"noStandardTags\":{\"description\":\"By default, the config file loader will predefine all of the standardized TSDoc tags.  To disable this and start with a completely empty configuration, set \\\"noStandardTags\\\"=true.\",\"type\":\"boolean\"},\"tagDefinitions\":{\"description\":\"Additional tags to support when parsing documentation comments with TSDoc.\",\"type\":\"array\",\"items\":{\"$ref\":\"#/definitions/tsdocTagDefinition\"}},\"supportedHtmlElements\":{\"description\":\"The HTML element names that are supported in this configuration. Used in conjunction with the \\\"reportUnsupportedHtmlElements\\\" setting.\",\"type\":\"array\",\"items\":{\"type\":\"string\",\"pattern\":\"^[a-zA-Z0-9-]+$\"}},\"reportUnsupportedHtmlElements\":{\"description\":\"Whether an error should be reported when an unsupported HTML element is encountered in a doc comment. Defaults to \\\"true\\\" if the \\\"supportedHtmlElements\\\" field is present in this file, \\\"false\\\" if not.\",\"type\":\"boolean\"},\"supportForTags\":{\"description\":\"A collection of key/value pairs.  The key is a TSDoc tag name (e.g. \\\"@myTag\\\") that must be defined in this configuration.  The value is a boolean indicating whether the tag is supported.  The TSDoc parser may report warnings when unsupported tags are encountered.  If \\\"supportForTags\\\" is specified for at least one tag, then the \\\"reportUnsupportedTags\\\" validation check is enabled by default.\",\"type\":\"object\",\"patternProperties\":{\"@[a-zA-Z][a-zA-Z0-9]*$\":{\"type\":\"boolean\"}},\"additionalItems\":false}},\"required\":[\"$schema\"],\"additionalProperties\":false,\"definitions\":{\"tsdocTagDefinition\":{\"description\":\"Configuration for a custom supported TSDoc tag.\",\"type\":\"object\",\"properties\":{\"tagName\":{\"description\":\"Name of the custom tag. TSDoc tag names start with an at-sign (@) followed by ASCII letters using camelCase capitalization.\",\"type\":\"string\"},\"syntaxKind\":{\"description\":\"Syntax kind of the custom tag. \\\"inline\\\" means that this tag can appear inside other documentation sections (example: {@link}). \\\"block\\\" means that this tag starts a new documentation section (example: @remarks). \\\"modifier\\\" means that this tag's presence indicates an aspect of the associated API item (example: @internal).\",\"type\":\"string\",\"enum\":[\"inline\",\"block\",\"modifier\"]},\"allowMultiple\":{\"description\":\"If true, then this tag may appear multiple times in a doc comment. By default, a tag may only appear once.\",\"type\":\"boolean\"}},\"required\":[\"tagName\",\"syntaxKind\"],\"additionalProperties\":false}}}";
+     const jsonSchema = jju.parse(jsonSchemaContent, { mode: 'cjson' });
+     return ajv.compile(jsonSchema);
+ }

.yarnrc.yml

@@ -0,0 +1,11 @@
+nodeLinker: node-modules
+
+plugins:
+  - path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
+    spec: '@yarnpkg/plugin-interactive-tools'
+  - path: .yarn/plugins/@yarnpkg/plugin-workspace-tools.cjs
+    spec: '@yarnpkg/plugin-workspace-tools'
+  - path: .yarn/plugins/@yarnpkg/plugin-version.cjs
+    spec: '@yarnpkg/plugin-version'
+
+yarnPath: .yarn/releases/yarn-3.4.1.cjs

LICENSE

@@ -175,7 +175,8 @@
 
    END OF TERMS AND CONDITIONS
 
-   Copyright 2015 - 2020 Amish Shah
+   Copyright 2021 Noel Buechler
+   Copyright 2015 Amish Shah
 
    Licensed under the Apache License, Version 2.0 (the "License");
    you may not use this file except in compliance with the License.

README.md

@@ -1,34 +1,21 @@
 <div align="center">
-  <br />
-  <p>
-    <a href="https://discord.js.org"><img src="https://discord.js.org/static/logo.svg" width="546" alt="discord.js" /></a>
-  </p>
-  <br />
-  <p>
-    <a href="https://discord.gg/bRCvFy9"><img src="https://img.shields.io/discord/222078108977594368?color=7289da&logo=discord&logoColor=white" alt="Discord server" /></a>
-    <a href="https://www.npmjs.com/package/discord.js"><img src="https://img.shields.io/npm/v/discord.js.svg?maxAge=3600" alt="NPM version" /></a>
-    <a href="https://www.npmjs.com/package/discord.js"><img src="https://img.shields.io/npm/dt/discord.js.svg?maxAge=3600" alt="NPM downloads" /></a>
-    <a href="https://github.com/discordjs/discord.js/actions"><img src="https://github.com/discordjs/discord.js/workflows/Testing/badge.svg" alt="Build status" /></a>
-    <a href="https://david-dm.org/discordjs/discord.js"><img src="https://img.shields.io/david/discordjs/discord.js.svg?maxAge=3600" alt="Dependencies" /></a>
-    <a href="https://www.patreon.com/discordjs"><img src="https://img.shields.io/badge/donate-patreon-F96854.svg" alt="Patreon" /></a>
-  </p>
-  <p>
-    <a href="https://nodei.co/npm/discord.js/"><img src="https://nodei.co/npm/discord.js.png?downloads=true&stars=true" alt="npm installnfo" /></a>
-  </p>
+	<br />
+	<p>
+		<a href="https://discord.js.org"><img src="https://discord.js.org/static/logo.svg" width="546" alt="discord.js" /></a>
+	</p>
+	<br />
+	<p>
+		<a href="https://discord.gg/djs"><img src="https://img.shields.io/discord/222078108977594368?color=5865F2&logo=discord&logoColor=white" alt="Discord server" /></a>
+		<a href="https://www.npmjs.com/package/discord.js"><img src="https://img.shields.io/npm/v/discord.js.svg?maxAge=3600" alt="npm version" /></a>
+		<a href="https://www.npmjs.com/package/discord.js"><img src="https://img.shields.io/npm/dt/discord.js.svg?maxAge=3600" alt="npm downloads" /></a>
+		<a href="https://github.com/discordjs/discord.js/actions"><img src="https://github.com/discordjs/discord.js/actions/workflows/test.yml/badge.svg" alt="Tests status" /></a>
+		<a href="https://codecov.io/gh/discordjs/discord.js" ><img src="https://codecov.io/gh/discordjs/discord.js/branch/main/graph/badge.svg?precision=2" alt="Code coverage" /></a>
+	</p>
+	<p>
+		<a href="https://vercel.com/?utm_source=discordjs&utm_campaign=oss"><img src="https://raw.githubusercontent.com/discordjs/discord.js/main/.github/powered-by-vercel.svg" alt="Vercel" /></a>
+	</p>
 </div>
 
-## Table of contents
-
-- [About](#about)
-- [Installation](#installation)
-  - [Audio engines](#audio-engines)
-  - [Optional packages](#optional-packages)
-- [Example Usage](#example-usage)
-- [Links](#links)
-  - [Extensions](#extensions)
-- [Contributing](#contributing)
-- [Help](#help)
-
 ## About
 
 discord.js is a powerful [Node.js](https://nodejs.org) module that allows you to easily interact with the
@@ -41,71 +28,118 @@ discord.js is a powerful [Node.js](https://nodejs.org) module that allows you to
 
 ## Installation
 
-**Node.js 12.0.0 or newer is required.**  
-Ignore any warnings about unmet peer dependencies, as they're all optional.
+**Node.js 16.9.0 or newer is required.**
 
-Without voice support: `npm install discord.js`  
-With voice support ([@discordjs/opus](https://www.npmjs.com/package/@discordjs/opus)): `npm install discord.js @discordjs/opus`  
-With voice support ([opusscript](https://www.npmjs.com/package/opusscript)): `npm install discord.js opusscript`
-
-### Audio engines
-
-The preferred audio engine is @discordjs/opus, as it performs significantly better than opusscript. When both are available, discord.js will automatically choose @discordjs/opus.
-Using opusscript is only recommended for development environments where @discordjs/opus is tough to get working.
-For production bots, using @discordjs/opus should be considered a necessity, especially if they're going to be running on multiple servers.
+```sh-session
+npm install discord.js
+yarn add discord.js
+pnpm add discord.js
+```
 
 ### Optional packages
 
 - [zlib-sync](https://www.npmjs.com/package/zlib-sync) for WebSocket data compression and inflation (`npm install zlib-sync`)
 - [erlpack](https://github.com/discord/erlpack) for significantly faster WebSocket data (de)serialisation (`npm install discord/erlpack`)
-- One of the following packages can be installed for faster voice packet encryption and decryption:
-  - [sodium](https://www.npmjs.com/package/sodium) (`npm install sodium`)
-  - [libsodium.js](https://www.npmjs.com/package/libsodium-wrappers) (`npm install libsodium-wrappers`)
 - [bufferutil](https://www.npmjs.com/package/bufferutil) for a much faster WebSocket connection (`npm install bufferutil`)
 - [utf-8-validate](https://www.npmjs.com/package/utf-8-validate) in combination with `bufferutil` for much faster WebSocket processing (`npm install utf-8-validate`)
+- [@discordjs/voice](https://www.npmjs.com/package/@discordjs/voice) for interacting with the Discord Voice API (`npm install @discordjs/voice`)
 
 ## Example usage
 
+Install discord.js:
+
+```sh-session
+npm install discord.js
+yarn add discord.js
+pnpm add discord.js
+```
+
+Register a slash command against the Discord API:
+
 ```js
-const Discord = require('discord.js');
-const client = new Discord.Client();
+const { REST, Routes } = require('discord.js');
+
+const commands = [
+	{
+		name: 'ping',
+		description: 'Replies with Pong!',
+	},
+];
+
+const rest = new REST({ version: '10' }).setToken(TOKEN);
+
+(async () => {
+	try {
+		console.log('Started refreshing application (/) commands.');
+
+		await rest.put(Routes.applicationCommands(CLIENT_ID), { body: commands });
+
+		console.log('Successfully reloaded application (/) commands.');
+	} catch (error) {
+		console.error(error);
+	}
+})();
+```
+
+Afterwards we can create a quite simple example bot:
+
+```js
+const { Client, GatewayIntentBits } = require('discord.js');
+const client = new Client({ intents: [GatewayIntentBits.Guilds] });
 
 client.on('ready', () => {
-  console.log(`Logged in as ${client.user.tag}!`);
+	console.log(`Logged in as ${client.user.tag}!`);
 });
 
-client.on('message', msg => {
-  if (msg.content === 'ping') {
-    msg.reply('pong');
-  }
+client.on('interactionCreate', async (interaction) => {
+	if (!interaction.isChatInputCommand()) return;
+
+	if (interaction.commandName === 'ping') {
+		await interaction.reply('Pong!');
+	}
 });
 
-client.login('token');
+client.login(TOKEN);
 ```
 
 ## Links
 
-- [Website](https://discord.js.org/) ([source](https://github.com/discordjs/website))
-- [Documentation](https://discord.js.org/#/docs/main/master/general/welcome)
-- [Guide](https://discordjs.guide/) ([source](https://github.com/discordjs/guide)) - this is still for stable  
-  See also the [Update Guide](https://discordjs.guide/additional-info/changes-in-v12.html), including updated and removed items in the library.
-- [Discord.js Discord server](https://discord.gg/bRCvFy9)
-- [Discord API Discord server](https://discord.gg/discord-api)
-- [GitHub](https://github.com/discordjs/discord.js)
-- [NPM](https://www.npmjs.com/package/discord.js)
-- [Related libraries](https://discordapi.com/unofficial/libs.html)
+- [Website][website] ([source][website-source])
+- [Documentation][documentation]
+- [Guide][guide] ([source][guide-source])
+  See also the [Update Guide][guide-update], including updated and removed items in the library.
+- [discord.js Discord server][discord]
+- [Discord API Discord server][discord-api]
+- [GitHub][source]
+- [npm][npm]
+- [Related libraries][related-libs]
 
 ### Extensions
 
-- [RPC](https://www.npmjs.com/package/discord-rpc) ([source](https://github.com/discordjs/RPC))
+- [RPC][rpc] ([source][rpc-source])
 
 ## Contributing
 
 Before creating an issue, please ensure that it hasn't already been reported/suggested, and double-check the
-[documentation](https://discord.js.org/#/docs).  
-See [the contribution guide](https://github.com/discordjs/discord.js/blob/master/.github/CONTRIBUTING.md) if you'd like to submit a PR.
+[documentation][documentation].  
+See [the contribution guide][contributing] if you'd like to submit a PR.
 
 ## Help
 
 If you don't understand something in the documentation, you are experiencing problems, or you just need a gentle
-nudge in the right direction, please don't hesitate to join our official [Discord.js Server](https://discord.gg/bRCvFy9).
+nudge in the right direction, please don't hesitate to join our official [discord.js Server][discord].
+
+[website]: https://discord.js.org/
+[website-source]: https://github.com/discordjs/discord.js/tree/main/apps/website
+[documentation]: https://discord.js.org/#/docs
+[guide]: https://discordjs.guide/
+[guide-source]: https://github.com/discordjs/guide
+[guide-update]: https://discordjs.guide/additional-info/changes-in-v14.html
+[discord]: https://discord.gg/djs
+[discord-api]: https://discord.gg/discord-api
+[source]: https://github.com/discordjs/discord.js/tree/main/packages/discord.js
+[npm]: https://www.npmjs.com/package/discord.js
+[related-libs]: https://discord.com/developers/docs/topics/community-resources#libraries
+[rpc]: https://www.npmjs.com/package/discord-rpc
+[rpc-source]: https://github.com/discordjs/RPC
+[contributing]: https://github.com/discordjs/discord.js/blob/main/.github/CONTRIBUTING.md

api-extractor.json

@@ -0,0 +1,382 @@
+/**
+ * Config file for API Extractor.  For more info, please visit: https://api-extractor.com
+ */
+{
+	"$schema": "https://developer.microsoft.com/json-schemas/api-extractor/v7/api-extractor.schema.json",
+
+	/**
+	 * Optionally specifies another JSON config file that this file extends from.  This provides a way for
+	 * standard settings to be shared across multiple projects.
+	 *
+	 * If the path starts with "./" or "../", the path is resolved relative to the folder of the file that contains
+	 * the "extends" field.  Otherwise, the first path segment is interpreted as an NPM package name, and will be
+	 * resolved using NodeJS require().
+	 *
+	 * SUPPORTED TOKENS: none
+	 * DEFAULT VALUE: ""
+	 */
+	// "extends": "./shared/api-extractor-base.json"
+	// "extends": "my-package/include/api-extractor-base.json"
+
+	/**
+	 * Determines the "<projectFolder>" token that can be used with other config file settings.  The project folder
+	 * typically contains the tsconfig.json and package.json config files, but the path is user-defined.
+	 *
+	 * The path is resolved relative to the folder of the config file that contains the setting.
+	 *
+	 * The default value for "projectFolder" is the token "<lookup>", which means the folder is determined by traversing
+	 * parent folders, starting from the folder containing api-extractor.json, and stopping at the first folder
+	 * that contains a tsconfig.json file.  If a tsconfig.json file cannot be found in this way, then an error
+	 * will be reported.
+	 *
+	 * SUPPORTED TOKENS: <lookup>
+	 * DEFAULT VALUE: "<lookup>"
+	 */
+	// "projectFolder": "..",
+
+	/**
+	 * (REQUIRED) Specifies the .d.ts file to be used as the starting point for analysis.  API Extractor
+	 * analyzes the symbols exported by this module.
+	 *
+	 * The file extension must be ".d.ts" and not ".ts".
+	 *
+	 * The path is resolved relative to the folder of the config file that contains the setting; to change this,
+	 * prepend a folder token such as "<projectFolder>".
+	 *
+	 * SUPPORTED TOKENS: <projectFolder>, <packageName>, <unscopedPackageName>
+	 */
+	"mainEntryPointFilePath": "<projectFolder>/dist-docs/index.d.ts",
+
+	/**
+	 * A list of NPM package names whose exports should be treated as part of this package.
+	 *
+	 * For example, suppose that Webpack is used to generate a distributed bundle for the project "library1",
+	 * and another NPM package "library2" is embedded in this bundle.  Some types from library2 may become part
+	 * of the exported API for library1, but by default API Extractor would generate a .d.ts rollup that explicitly
+	 * imports library2.  To avoid this, we can specify:
+	 *
+	 *   "bundledPackages": [ "library2" ],
+	 *
+	 * This would direct API Extractor to embed those types directly in the .d.ts rollup, as if they had been
+	 * local files for library1.
+	 */
+	"bundledPackages": [],
+
+	/**
+	 * Determines how the TypeScript compiler engine will be invoked by API Extractor.
+	 */
+	"compiler": {
+		/**
+		 * Specifies the path to the tsconfig.json file to be used by API Extractor when analyzing the project.
+		 *
+		 * The path is resolved relative to the folder of the config file that contains the setting; to change this,
+		 * prepend a folder token such as "<projectFolder>".
+		 *
+		 * Note: This setting will be ignored if "overrideTsconfig" is used.
+		 *
+		 * SUPPORTED TOKENS: <projectFolder>, <packageName>, <unscopedPackageName>
+		 * DEFAULT VALUE: "<projectFolder>/tsconfig.json"
+		 */
+		// "tsconfigFilePath": "<projectFolder>/tsconfig.json",
+		/**
+		 * Provides a compiler configuration that will be used instead of reading the tsconfig.json file from disk.
+		 * The object must conform to the TypeScript tsconfig schema:
+		 *
+		 * http://json.schemastore.org/tsconfig
+		 *
+		 * If omitted, then the tsconfig.json file will be read from the "projectFolder".
+		 *
+		 * DEFAULT VALUE: no overrideTsconfig section
+		 */
+		// "overrideTsconfig": {
+		//   . . .
+		// }
+		/**
+		 * This option causes the compiler to be invoked with the --skipLibCheck option. This option is not recommended
+		 * and may cause API Extractor to produce incomplete or incorrect declarations, but it may be required when
+		 * dependencies contain declarations that are incompatible with the TypeScript engine that API Extractor uses
+		 * for its analysis.  Where possible, the underlying issue should be fixed rather than relying on skipLibCheck.
+		 *
+		 * DEFAULT VALUE: false
+		 */
+		// "skipLibCheck": true,
+	},
+
+	/**
+	 * Configures how the API report file (*.api.md) will be generated.
+	 */
+	"apiReport": {
+		/**
+		 * (REQUIRED) Whether to generate an API report.
+		 */
+		"enabled": false
+
+		/**
+		 * The filename for the API report files.  It will be combined with "reportFolder" or "reportTempFolder" to produce
+		 * a full file path.
+		 *
+		 * The file extension should be ".api.md", and the string should not contain a path separator such as "\" or "/".
+		 *
+		 * SUPPORTED TOKENS: <packageName>, <unscopedPackageName>
+		 * DEFAULT VALUE: "<unscopedPackageName>.api.md"
+		 */
+		// "reportFileName": "<unscopedPackageName>.api.md",
+
+		/**
+		 * Specifies the folder where the API report file is written.  The file name portion is determined by
+		 * the "reportFileName" setting.
+		 *
+		 * The API report file is normally tracked by Git.  Changes to it can be used to trigger a branch policy,
+		 * e.g. for an API review.
+		 *
+		 * The path is resolved relative to the folder of the config file that contains the setting; to change this,
+		 * prepend a folder token such as "<projectFolder>".
+		 *
+		 * SUPPORTED TOKENS: <projectFolder>, <packageName>, <unscopedPackageName>
+		 * DEFAULT VALUE: "<projectFolder>/temp/"
+		 */
+		// "reportFolder": "<projectFolder>/temp/",
+
+		/**
+		 * Specifies the folder where the temporary report file is written.  The file name portion is determined by
+		 * the "reportFileName" setting.
+		 *
+		 * After the temporary file is written to disk, it is compared with the file in the "reportFolder".
+		 * If they are different, a production build will fail.
+		 *
+		 * The path is resolved relative to the folder of the config file that contains the setting; to change this,
+		 * prepend a folder token such as "<projectFolder>".
+		 *
+		 * SUPPORTED TOKENS: <projectFolder>, <packageName>, <unscopedPackageName>
+		 * DEFAULT VALUE: "<projectFolder>/temp/"
+		 */
+		// "reportTempFolder": "<projectFolder>/temp/"
+	},
+
+	/**
+	 * Configures how the doc model file (*.api.json) will be generated.
+	 */
+	"docModel": {
+		/**
+		 * (REQUIRED) Whether to generate a doc model file.
+		 */
+		"enabled": true,
+
+		/**
+		 * The output path for the doc model file.  The file extension should be ".api.json".
+		 *
+		 * The path is resolved relative to the folder of the config file that contains the setting; to change this,
+		 * prepend a folder token such as "<projectFolder>".
+		 *
+		 * SUPPORTED TOKENS: <projectFolder>, <packageName>, <unscopedPackageName>
+		 * DEFAULT VALUE: "<projectFolder>/temp/<unscopedPackageName>.api.json"
+		 */
+		"apiJsonFilePath": "<projectFolder>/docs/docs.api.json"
+	},
+
+	/**
+	 * Configures how the .d.ts rollup file will be generated.
+	 */
+	"dtsRollup": {
+		/**
+		 * (REQUIRED) Whether to generate the .d.ts rollup file.
+		 */
+		"enabled": false
+
+		/**
+		 * Specifies the output path for a .d.ts rollup file to be generated without any trimming.
+		 * This file will include all declarations that are exported by the main entry point.
+		 *
+		 * If the path is an empty string, then this file will not be written.
+		 *
+		 * The path is resolved relative to the folder of the config file that contains the setting; to change this,
+		 * prepend a folder token such as "<projectFolder>".
+		 *
+		 * SUPPORTED TOKENS: <projectFolder>, <packageName>, <unscopedPackageName>
+		 * DEFAULT VALUE: "<projectFolder>/dist/<unscopedPackageName>.d.ts"
+		 */
+		// "untrimmedFilePath": "<projectFolder>/dist/<unscopedPackageName>.d.ts",
+
+		/**
+		 * Specifies the output path for a .d.ts rollup file to be generated with trimming for an "alpha" release.
+		 * This file will include only declarations that are marked as "@public", "@beta", or "@alpha".
+		 *
+		 * The path is resolved relative to the folder of the config file that contains the setting; to change this,
+		 * prepend a folder token such as "<projectFolder>".
+		 *
+		 * SUPPORTED TOKENS: <projectFolder>, <packageName>, <unscopedPackageName>
+		 * DEFAULT VALUE: ""
+		 */
+		// "alphaTrimmedFilePath": "<projectFolder>/dist/<unscopedPackageName>-alpha.d.ts",
+
+		/**
+		 * Specifies the output path for a .d.ts rollup file to be generated with trimming for a "beta" release.
+		 * This file will include only declarations that are marked as "@public" or "@beta".
+		 *
+		 * The path is resolved relative to the folder of the config file that contains the setting; to change this,
+		 * prepend a folder token such as "<projectFolder>".
+		 *
+		 * SUPPORTED TOKENS: <projectFolder>, <packageName>, <unscopedPackageName>
+		 * DEFAULT VALUE: ""
+		 */
+		// "betaTrimmedFilePath": "<projectFolder>/dist/<unscopedPackageName>-beta.d.ts",
+
+		/**
+		 * Specifies the output path for a .d.ts rollup file to be generated with trimming for a "public" release.
+		 * This file will include only declarations that are marked as "@public".
+		 *
+		 * If the path is an empty string, then this file will not be written.
+		 *
+		 * The path is resolved relative to the folder of the config file that contains the setting; to change this,
+		 * prepend a folder token such as "<projectFolder>".
+		 *
+		 * SUPPORTED TOKENS: <projectFolder>, <packageName>, <unscopedPackageName>
+		 * DEFAULT VALUE: ""
+		 */
+		// "publicTrimmedFilePath": "<projectFolder>/dist/<unscopedPackageName>-public.d.ts",
+
+		/**
+		 * When a declaration is trimmed, by default it will be replaced by a code comment such as
+		 * "Excluded from this release type: exampleMember".  Set "omitTrimmingComments" to true to remove the
+		 * declaration completely.
+		 *
+		 * DEFAULT VALUE: false
+		 */
+		// "omitTrimmingComments": true
+	},
+
+	/**
+	 * Configures how the tsdoc-metadata.json file will be generated.
+	 */
+	"tsdocMetadata": {
+		/**
+		 * Whether to generate the tsdoc-metadata.json file.
+		 *
+		 * DEFAULT VALUE: true
+		 */
+		// "enabled": true,
+		/**
+		 * Specifies where the TSDoc metadata file should be written.
+		 *
+		 * The path is resolved relative to the folder of the config file that contains the setting; to change this,
+		 * prepend a folder token such as "<projectFolder>".
+		 *
+		 * The default value is "<lookup>", which causes the path to be automatically inferred from the "tsdocMetadata",
+		 * "typings" or "main" fields of the project's package.json.  If none of these fields are set, the lookup
+		 * falls back to "tsdoc-metadata.json" in the package folder.
+		 *
+		 * SUPPORTED TOKENS: <projectFolder>, <packageName>, <unscopedPackageName>
+		 * DEFAULT VALUE: "<lookup>"
+		 */
+		// "tsdocMetadataFilePath": "<projectFolder>/dist/tsdoc-metadata.json"
+	},
+
+	/**
+	 * Specifies what type of newlines API Extractor should use when writing output files.  By default, the output files
+	 * will be written with Windows-style newlines.  To use POSIX-style newlines, specify "lf" instead.
+	 * To use the OS's default newline kind, specify "os".
+	 *
+	 * DEFAULT VALUE: "crlf"
+	 */
+	"newlineKind": "lf",
+
+	/**
+	 * Configures how API Extractor reports error and warning messages produced during analysis.
+	 *
+	 * There are three sources of messages:  compiler messages, API Extractor messages, and TSDoc messages.
+	 */
+	"messages": {
+		/**
+		 * Configures handling of diagnostic messages reported by the TypeScript compiler engine while analyzing
+		 * the input .d.ts files.
+		 *
+		 * TypeScript message identifiers start with "TS" followed by an integer.  For example: "TS2551"
+		 *
+		 * DEFAULT VALUE:  A single "default" entry with logLevel=warning.
+		 */
+		"compilerMessageReporting": {
+			/**
+			 * Configures the default routing for messages that don't match an explicit rule in this table.
+			 */
+			"default": {
+				/**
+				 * Specifies whether the message should be written to the the tool's output log.  Note that
+				 * the "addToApiReportFile" property may supersede this option.
+				 *
+				 * Possible values: "error", "warning", "none"
+				 *
+				 * Errors cause the build to fail and return a nonzero exit code.  Warnings cause a production build fail
+				 * and return a nonzero exit code.  For a non-production build (e.g. when "api-extractor run" includes
+				 * the "--local" option), the warning is displayed but the build will not fail.
+				 *
+				 * DEFAULT VALUE: "warning"
+				 */
+				"logLevel": "warning"
+
+				/**
+				 * When addToApiReportFile is true:  If API Extractor is configured to write an API report file (.api.md),
+				 * then the message will be written inside that file; otherwise, the message is instead logged according to
+				 * the "logLevel" option.
+				 *
+				 * DEFAULT VALUE: false
+				 */
+				// "addToApiReportFile": false
+			}
+
+			// "TS2551": {
+			//   "logLevel": "warning",
+			//   "addToApiReportFile": true
+			// },
+			//
+			// . . .
+		},
+
+		/**
+		 * Configures handling of messages reported by API Extractor during its analysis.
+		 *
+		 * API Extractor message identifiers start with "ae-".  For example: "ae-extra-release-tag"
+		 *
+		 * DEFAULT VALUE: See api-extractor-defaults.json for the complete table of extractorMessageReporting mappings
+		 */
+		"extractorMessageReporting": {
+			"default": {
+				"logLevel": "warning"
+				// "addToApiReportFile": false
+			},
+
+			// Disable the following warning:
+			// (ae-missing-release-tag) "x" is part of the package's API, but it is missing a release tag (@alpha, @beta, @public, or @internal)
+			"ae-missing-release-tag": {
+				"logLevel": "none"
+			}
+
+			// "ae-extra-release-tag": {
+			//   "logLevel": "warning",
+			//   "addToApiReportFile": true
+			// },
+			//
+			// . . .
+		},
+
+		/**
+		 * Configures handling of messages reported by the TSDoc parser when analyzing code comments.
+		 *
+		 * TSDoc message identifiers start with "tsdoc-".  For example: "tsdoc-link-tag-unescaped-text"
+		 *
+		 * DEFAULT VALUE:  A single "default" entry with logLevel=warning.
+		 */
+		"tsdocMessageReporting": {
+			"default": {
+				"logLevel": "warning"
+				// "addToApiReportFile": false
+			}
+
+			// "tsdoc-link-tag-unescaped-text": {
+			//   "logLevel": "warning",
+			//   "addToApiReportFile": true
+			// },
+			//
+			// . . .
+		}
+	}
+}

apps/guide/.eslintrc.json

@@ -0,0 +1,11 @@
+{
+	"extends": ["../../.eslintrc.json", "neon/react", "neon/astro", "neon/prettier"],
+	"settings": {
+		"react": {
+			"version": "detect"
+		}
+	},
+	"rules": {
+		"react/jsx-filename-extension": [1, { "extensions": [".tsx", ".astro"] }]
+	}
+}

apps/guide/.gitignore

@@ -0,0 +1,30 @@
+# Packages
+node_modules/
+
+# Log files
+logs/
+*.log
+npm-debug.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+
+# Env
+.env
+
+# Dist
+dist/
+typings/
+.cache/
+build/
+api/
+src/styles/unocss.css
+.next/
+
+# Miscellaneous
+.tmp/
+coverage/
+.vercel
+public/searchIndex

apps/guide/.lintstagedrc.cjs

@@ -0,0 +1 @@
+module.exports = require('../../.lintstagedrc.json');

apps/guide/.prettierignore

@@ -0,0 +1,15 @@
+# Autogenerated
+CHANGELOG.md
+.turbo
+dist/
+docs/**/*
+!docs/index.yml
+!docs/README.md
+coverage/
+.cache
+build/
+src/styles/unocss.css
+api/
+.next/
+.vercel/
+.cache/

apps/guide/.prettierrc.cjs

@@ -0,0 +1,8 @@
+module.exports = {
+	...require('../../.prettierrc.json'),
+	plugins: [
+		'prettier-plugin-astro',
+		'prettier-plugin-tailwindcss', // MUST come last
+	],
+	pluginSearchDirs: false,
+};

apps/guide/README.md

@@ -0,0 +1,46 @@
+<div align="center">
+	<br />
+	<p>
+		<a href="https://discord.js.org"><img src="https://discord.js.org/static/logo.svg" width="546" alt="discord.js" /></a>
+	</p>
+	<br />
+	<p>
+		<a href="https://discord.gg/djs"><img src="https://img.shields.io/discord/222078108977594368?color=5865F2&logo=discord&logoColor=white" alt="Discord server" /></a>
+		<a href="https://github.com/discordjs/discord.js/actions"><img src="https://github.com/discordjs/discord.js/actions/workflows/test.yml/badge.svg" alt="Build status" /></a>
+	</p>
+	<p>
+		<a href="https://vercel.com/?utm_source=discordjs&utm_campaign=oss"><img src="https://raw.githubusercontent.com/discordjs/discord.js/main/.github/powered-by-vercel.svg" alt="Vercel" /></a>
+	</p>
+</div>
+
+## Links
+
+- [Website][website] ([source][website-source])
+- [Documentation][documentation]
+- [Guide][guide] ([source][guide-source])
+  See also the [Update Guide][guide-update], including updated and removed items in the library.
+- [discord.js Discord server][discord]
+- [Discord API Discord server][discord-api]
+- [GitHub][source]
+- [Related libraries][related-libs]
+
+## Contributing
+
+See [the contribution guide][contributing] if you'd like to submit a PR.
+
+## Help
+
+If you don't understand something in the documentation, you are experiencing problems, or you just need a gentle
+nudge in the right direction, please don't hesitate to join our official [discord.js Server][discord].
+
+[website]: https://discord.js.org/
+[website-source]: https://github.com/discordjs/discord.js/tree/main/apps/website
+[documentation]: https://discord.js.org/
+[guide]: https://discordjs.guide/
+[guide-source]: https://github.com/discordjs/guide
+[guide-update]: https://discordjs.guide/additional-info/changes-in-v14.html
+[discord]: https://discord.gg/djs
+[discord-api]: https://discord.gg/discord-api
+[source]: https://github.com/discordjs/discord.js/tree/main/apps/guide
+[related-libs]: https://discord.com/developers/docs/topics/community-resources#libraries
+[contributing]: https://github.com/discordjs/discord.js/blob/main/.github/CONTRIBUTING.md

apps/guide/astro.config.ts

@@ -0,0 +1,118 @@
+import { fileURLToPath, URL } from 'node:url';
+import image from '@astrojs/image';
+import mdx from '@astrojs/mdx';
+import prefetch from '@astrojs/prefetch';
+import react from '@astrojs/react';
+import { remarkCodeHike } from '@code-hike/mdx';
+import { defineConfig } from 'astro/config';
+import compress from 'astro-compress';
+import critters from 'astro-critters';
+import { type Node, toString } from 'hast-util-to-string';
+import { h } from 'hastscript';
+import { escape } from 'html-escaper';
+import rehypeAutolinkHeadings from 'rehype-autolink-headings';
+import rehypeSlug from 'rehype-slug';
+import shikiThemeDarkPlus from 'shiki/themes/dark-plus.json' assert { type: 'json' };
+import Unocss from 'unocss/astro';
+
+const LinkIcon = h(
+	'svg',
+	{
+		width: '1rem',
+		height: '1rem',
+		viewBox: '0 0 24 24',
+		fill: 'none',
+		stroke: 'currentColor',
+		strokeWidth: '2',
+		strokeLinecap: 'round',
+		strokeLinejoin: 'round',
+	},
+	h('path', {
+		// eslint-disable-next-line id-length
+		d: 'M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71',
+	}),
+	h('path', {
+		// eslint-disable-next-line id-length
+		d: 'M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71',
+	}),
+);
+
+const createSROnlyLabel = (text: string) => {
+	const node = h('span.sr-only', `Section titled ${escape(text)}`);
+	node.properties!['is:raw'] = true;
+	return node;
+};
+
+const rootDir = new URL('../../', import.meta.url);
+
+export default defineConfig({
+	integrations: [
+		react(),
+		mdx({
+			remarkPlugins: [[remarkCodeHike, { autoImport: false, theme: shikiThemeDarkPlus, lineNumbers: true }]],
+			rehypePlugins: [
+				rehypeSlug,
+				[
+					rehypeAutolinkHeadings,
+					{
+						properties: {
+							class:
+								'relative inline-flex w-6 h-6 place-items-center place-content-center outline-0 text-black dark:text-white ml-2',
+						},
+						behavior: 'after',
+						group: ({ tagName }: { tagName: string }) =>
+							h('div', {
+								class: `[&>*]:inline-block [&>h1]:m-0 [&>h2]:m-0 [&>h3]:m-0 [&>h4]:m-0 level-${tagName}`,
+								tabIndex: -1,
+							}),
+						content: (heading: Node) => [
+							h(
+								`span.anchor-icon`,
+								{
+									ariaHidden: 'true',
+								},
+								LinkIcon,
+							),
+							createSROnlyLabel(toString(heading)),
+						],
+					},
+				],
+			],
+		}),
+		image({
+			serviceEntryPoint: '@astrojs/image/sharp',
+		}),
+		prefetch({
+			throttle: 3,
+		}),
+		Unocss({
+			configFile: fileURLToPath(new URL('unocss.config.ts', rootDir)),
+		}),
+		critters(),
+		compress(),
+	],
+	markdown: {
+		extendDefaultPlugins: true,
+		syntaxHighlight: false,
+	},
+	vite: {
+		resolve: {
+			alias: {
+				'ariakit/button': fileURLToPath(new URL('node_modules/ariakit/esm/button/index.js', rootDir)),
+				'ariakit/disclosure': fileURLToPath(new URL('node_modules/ariakit/esm/disclosure/index.js', rootDir)),
+				'ariakit/separator': fileURLToPath(new URL('node_modules/ariakit/esm/separator/index.js', rootDir)),
+				'ariakit-utils/dom': fileURLToPath(new URL('node_modules/ariakit-utils/esm/dom.js', rootDir)),
+				'ariakit-utils/events': fileURLToPath(new URL('node_modules/ariakit-utils/esm/events.js', rootDir)),
+				'ariakit-utils/focus': fileURLToPath(new URL('node_modules/ariakit-utils/esm/focus.js', rootDir)),
+				'ariakit-utils/misc': fileURLToPath(new URL('node_modules/ariakit-utils/esm/misc.js', rootDir)),
+				'ariakit-utils/platform': fileURLToPath(new URL('node_modules/ariakit-utils/esm/platform.js', rootDir)),
+				'ariakit-react-utils/hooks': fileURLToPath(new URL('node_modules/ariakit-react-utils/esm/hooks.js', rootDir)),
+				'ariakit-react-utils/misc': fileURLToPath(new URL('node_modules/ariakit-react-utils/esm/misc.js', rootDir)),
+				'ariakit-react-utils/system': fileURLToPath(new URL('node_modules/ariakit-react-utils/esm/system.js', rootDir)),
+				'react-icons/fi': fileURLToPath(new URL('node_modules/react-icons/fi/index.esm.js', rootDir)),
+				'react-icons/vsc': fileURLToPath(new URL('node_modules/react-icons/vsc/index.esm.js', rootDir)),
+				'react-use': fileURLToPath(new URL('node_modules/react-use/esm/index.js', rootDir)),
+			},
+		},
+	},
+});

apps/guide/package.json

@@ -0,0 +1,89 @@
+{
+	"name": "@discordjs/guide",
+	"version": "0.1.0",
+	"description": "Imagine a guide... that explores the many possibilities for your discord.js bot",
+	"private": true,
+	"scripts": {
+		"test": "vitest run",
+		"build:local": "yarn build:prod",
+		"build:prod": "yarn workspaces foreach -ptR run build && astro build",
+		"dev": "yarn workspaces foreach -ptR run build && astro dev",
+		"preview": "astro preview",
+		"lint": "prettier --check . && cross-env TIMING=1 eslint src --ext .mjs,.js,.cjs,.ts,.tsx,.astro --format=pretty",
+		"format": "prettier --write . && cross-env TIMING=1 eslint src --ext .mjs,.js,.cjs,.ts,.tsx,.astro --fix --format=pretty",
+		"fmt": "yarn format"
+	},
+	"type": "module",
+	"contributors": [
+		"Crawl <icrawltogo@gmail.com>"
+	],
+	"license": "Apache-2.0",
+	"keywords": [
+		"discord",
+		"api",
+		"bot",
+		"client",
+		"node",
+		"discordapp",
+		"discordjs"
+	],
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/discordjs/discord.js.git"
+	},
+	"bugs": {
+		"url": "https://github.com/discordjs/discord.js/issues"
+	},
+	"homepage": "https://discord.js.org",
+	"dependencies": {
+		"@code-hike/mdx": "^0.8.0",
+		"@discordjs/ui": "workspace:^",
+		"ariakit": "^2.0.0-next.43",
+		"react": "^18.2.0",
+		"react-custom-scrollbars-2": "^4.5.0",
+		"react-dom": "^18.2.0",
+		"react-icons": "^4.7.1",
+		"react-use": "^17.4.0"
+	},
+	"devDependencies": {
+		"@astrojs/image": "^0.15.1",
+		"@astrojs/mdx": "^0.17.2",
+		"@astrojs/prefetch": "^0.1.2",
+		"@astrojs/react": "^2.0.2",
+		"@testing-library/react": "^14.0.0",
+		"@testing-library/user-event": "^14.4.3",
+		"@types/node": "16.18.13",
+		"@types/react": "^18.0.28",
+		"@types/react-dom": "^18.0.11",
+		"@types/react-syntax-highlighter": "^15.5.6",
+		"@unocss/cli": "^0.50.1",
+		"@unocss/reset": "^0.50.1",
+		"@vitejs/plugin-react": "^3.1.0",
+		"@vitest/coverage-c8": "^0.29.1",
+		"astro": "^1.9.2",
+		"astro-compress": "^1.1.35",
+		"astro-critters": "^1.1.31",
+		"cross-env": "^7.0.3",
+		"eslint": "^8.35.0",
+		"eslint-config-neon": "^0.1.40",
+		"eslint-formatter-pretty": "^4.1.0",
+		"happy-dom": "^8.9.0",
+		"hast-util-to-string": "^2.0.0",
+		"hastscript": "^7.2.0",
+		"html-escaper": "^3.0.3",
+		"prettier": "^2.8.4",
+		"prettier-plugin-astro": "^0.8.0",
+		"prettier-plugin-tailwindcss": "^0.2.3",
+		"rehype-autolink-headings": "^6.1.1",
+		"rehype-slug": "^5.1.0",
+		"sharp": "^0.31.3",
+		"shiki": "^0.14.1",
+		"typescript": "^4.9.5",
+		"unocss": "^0.50.1",
+		"vercel": "^28.16.7",
+		"vitest": "^0.29.1"
+	},
+	"engines": {
+		"node": ">=16.9.0"
+	}
+}

apps/guide/public/browserconfig.xml

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square70x70logo src="/mstile-70x70.png"/>
+            <square150x150logo src="/mstile-150x150.png"/>
+            <square310x310logo src="/mstile-310x310.png"/>
+            <wide310x150logo src="/mstile-310x150.png"/>
+            <TileColor>#090a16</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>

apps/guide/public/safari-pinned-tab.svg

@@ -0,0 +1,32 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+ "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+ width="400.000000pt" height="400.000000pt" viewBox="0 0 400.000000 400.000000"
+ preserveAspectRatio="xMidYMid meet">
+<metadata>
+Created by potrace 1.14, written by Peter Selinger 2001-2017
+</metadata>
+<g transform="translate(0.000000,400.000000) scale(0.100000,-0.100000)"
+fill="#000000" stroke="none">
+<path d="M0 2000 l0 -2000 2000 0 2000 0 0 2000 0 2000 -2000 0 -2000 0 0
+-2000z m1305 795 c219 -47 373 -197 421 -411 24 -109 16 -315 -16 -399 l-23
+-61 -59 -11 c-110 -21 -182 -92 -203 -202 -11 -56 -11 -56 -68 -79 -76 -30
+-201 -42 -464 -42 l-223 0 0 610 0 610 283 0 c210 0 300 -4 352 -15z m890
+-585 c0 -543 -2 -601 -18 -659 -56 -198 -190 -334 -365 -370 -176 -37 -349 5
+-471 115 -48 44 -111 134 -111 161 0 6 19 14 43 18 23 4 73 18 110 32 l68 24
+50 -45 c56 -50 98 -66 175 -66 100 0 207 81 234 178 6 23 10 251 10 625 l0
+588 138 -3 137 -3 0 -595z m930 570 c93 -29 197 -84 252 -134 l44 -41 -61 -75
+c-34 -41 -67 -81 -74 -88 -10 -10 -25 -4 -78 32 -95 63 -154 81 -268 81 -79 0
+-103 -4 -142 -23 -62 -31 -90 -71 -96 -137 -8 -94 28 -137 168 -202 157 -73
+172 -80 240 -108 236 -97 341 -215 356 -400 16 -193 -82 -363 -258 -449 -91
+-45 -187 -66 -303 -66 -191 0 -390 74 -524 195 l-40 37 80 93 80 94 73 -53
+c168 -121 353 -155 491 -92 72 33 108 82 113 155 9 122 -37 162 -323 286 -258
+111 -350 179 -407 300 -69 148 -37 343 75 463 61 65 195 133 300 152 79 14
+222 4 302 -20z m-1367 -977 c45 -34 65 -69 70 -125 4 -61 -19 -106 -77 -145
+-90 -60 -226 3 -238 111 -3 24 -3 56 1 70 8 34 54 86 91 102 40 19 120 12 153
+-13z"/>
+<path d="M967 2543 c-4 -3 -7 -159 -7 -346 l0 -339 128 4 c101 3 136 8 172 24
+106 48 162 145 168 292 10 214 -69 334 -238 361 -73 12 -213 15 -223 4z"/>
+</g>
+</svg>

apps/guide/public/site.webmanifest

@@ -0,0 +1,19 @@
+{
+	"name": "discord.js guide",
+	"short_name": "discord.js guide",
+	"icons": [
+		{
+			"src": "/android-chrome-192x192.png",
+			"sizes": "192x192",
+			"type": "image/png"
+		},
+		{
+			"src": "/android-chrome-384x384.png",
+			"sizes": "384x384",
+			"type": "image/png"
+		}
+	],
+	"theme_color": "#1a1b1e",
+	"background_color": "#1a1b1e",
+	"display": "standalone"
+}

apps/guide/src/components/DocsLink.tsx

@@ -0,0 +1,3 @@
+export function DocsLink() {
+	return null;
+}

apps/guide/src/components/ExternalLink.tsx

@@ -0,0 +1,10 @@
+import { FiExternalLink } from 'react-icons/fi';
+
+export function ExternalLink({ href, title }: { href: string; title: string }) {
+	return (
+		<a className="text-blurple inline-flex place-items-center gap-2 text-sm font-semibold" href={href}>
+			<p>{title}</p>
+			<FiExternalLink size={18} />
+		</a>
+	);
+}

apps/guide/src/components/Navbar.tsx

@@ -0,0 +1,70 @@
+import { Button } from 'ariakit/button';
+import { useState, useEffect } from 'react';
+import { FiCommand } from 'react-icons/fi';
+import { VscColorMode, VscGithubInverted, VscMenu, VscSearch } from 'react-icons/vsc';
+import { useMedia } from 'react-use';
+import { Sidebar } from './Sidebar.jsx';
+import type { MDXPage } from './SidebarItems.jsx';
+
+export function Navbar({ pages }: { pages?: MDXPage[] | undefined }) {
+	const matches = useMedia('(min-width: 992px)', false);
+	const [opened, setOpened] = useState(false);
+
+	useEffect(() => {
+		if (matches) {
+			setOpened(false);
+		}
+	}, [matches]);
+
+	return (
+		<>
+			<header className="dark:bg-dark-600 dark:border-dark-100 bg-light-600 border-light-800 fixed top-0 left-0 z-20 w-full border-b">
+				<div className="h-18 block px-6">
+					<div className="flex h-full flex-row place-content-between place-items-center">
+						<Button
+							aria-label="Menu"
+							className="focus:ring-width-2 focus:ring-blurple flex h-6 w-6 transform-gpu cursor-pointer select-none appearance-none place-items-center rounded border-0 bg-transparent p-0 text-sm font-semibold leading-none no-underline outline-0 focus:ring active:translate-y-px lg:hidden"
+							onClick={() => setOpened((open) => !open)}
+						>
+							<VscMenu size={24} />
+						</Button>
+						<div className="hidden md:flex md:flex-row">Placeholder</div>
+						<div className="flex flex-row place-items-center gap-4">
+							<Button
+								as="div"
+								className="dark:bg-dark-800 focus:ring-width-2 focus:ring-blurple rounded bg-white px-4 py-2.5 outline-0 focus:ring"
+								// onClick={() => dialog?.toggle()}
+							>
+								<div className="flex flex-row place-items-center gap-4">
+									<VscSearch size={18} />
+									<span className="opacity-65">Search...</span>
+									<div className="opacity-65 flex flex-row place-items-center gap-2">
+										<FiCommand size={18} /> K
+									</div>
+								</div>
+							</Button>
+							<Button
+								aria-label="GitHub"
+								as="a"
+								className="focus:ring-width-2 focus:ring-blurple flex h-6 w-6 transform-gpu cursor-pointer select-none appearance-none place-items-center rounded rounded-full border-0 bg-transparent p-0 text-sm font-semibold leading-none no-underline outline-0 focus:ring active:translate-y-px"
+								href="https://github.com/discordjs/discord.js"
+								rel="noopener noreferrer"
+								target="_blank"
+							>
+								<VscGithubInverted size={24} />
+							</Button>
+							<Button
+								aria-label="Toggle theme"
+								className="focus:ring-width-2 focus:ring-blurple flex h-6 w-6 transform-gpu cursor-pointer select-none appearance-none place-items-center rounded-full rounded border-0 bg-transparent p-0 text-sm font-semibold leading-none no-underline outline-0 focus:ring active:translate-y-px"
+								// onClick={() => toggleTheme()}
+							>
+								<VscColorMode size={24} />
+							</Button>
+						</div>
+					</div>
+				</div>
+			</header>
+			<Sidebar opened={opened} pages={pages} />
+		</>
+	);
+}

apps/guide/src/components/Outline.tsx

@@ -0,0 +1,72 @@
+import type { MarkdownHeading } from 'astro';
+import { useEffect, useMemo, useState } from 'react';
+import { Scrollbars } from 'react-custom-scrollbars-2';
+import { VscListSelection } from 'react-icons/vsc';
+import { useLocation } from 'react-use';
+
+const LINK_HEIGHT = 30;
+const INDICATOR_SIZE = 10;
+const INDICATOR_OFFSET = (LINK_HEIGHT - INDICATOR_SIZE) / 2;
+
+export function Outline({ headings }: { headings: MarkdownHeading[] }) {
+	const state = useLocation();
+	const [active, setActive] = useState(0);
+
+	const headingItems = useMemo(
+		() =>
+			headings.map((heading, idx) => (
+				<a
+					className={`dark:border-dark-100 border-light-800 pl-6.5 focus:ring-width-2 focus:ring-blurple ml-[10px] border-l p-[5px] text-sm outline-0 focus:rounded focus:border-0 focus:ring ${
+						idx === active
+							? 'bg-blurple text-white'
+							: 'dark:hover:bg-dark-200 dark:active:bg-dark-100 hover:bg-light-700 active:bg-light-800'
+					}`}
+					href={`#${heading.slug}`}
+					key={heading.slug}
+					style={{ paddingLeft: `${heading.depth * 14}px` }}
+					title={heading.text}
+				>
+					<span className="line-clamp-1">{heading.text}</span>
+				</a>
+			)),
+		[headings, active],
+	);
+
+	useEffect(() => {
+		const idx = headings.findIndex((heading) => heading.slug === state.hash?.slice(1));
+		if (idx >= 0) {
+			setActive(idx);
+		}
+	}, [state, headings]);
+
+	return (
+		<Scrollbars
+			autoHide
+			hideTracksWhenNotNeeded
+			renderThumbVertical={(props) => <div {...props} className="dark:bg-dark-100 bg-light-900 z-30 rounded" />}
+			renderTrackVertical={(props) => (
+				<div {...props} className="absolute top-0.5 right-0.5 bottom-0.5 z-30 w-1.5 rounded" />
+			)}
+			universal
+		>
+			<div className="flex flex-col break-all p-3 pb-8">
+				<div className="mt-4 ml-2 flex flex-row gap-2">
+					<VscListSelection size={25} />
+					<span className="font-semibold">Contents</span>
+				</div>
+				<div className="mt-4 ml-2 flex flex-col gap-2">
+					<div className="relative flex flex-col">
+						<div
+							className="bg-blurple absolute h-[10px] w-[10px] rounded-full border-2 border-black dark:border-white"
+							style={{
+								left: INDICATOR_SIZE / 2 + 0.5,
+								transform: `translateY(${active * LINK_HEIGHT + INDICATOR_OFFSET}px)`,
+							}}
+						/>
+						{headingItems}
+					</div>
+				</div>
+			</div>
+		</Scrollbars>
+	);
+}

apps/guide/src/components/PageButton.tsx

@@ -0,0 +1,13 @@
+export function PageButton({ url, title, direction }: { direction: 'next' | 'prev'; title: string; url: string }) {
+	return (
+		<a
+			className="bg-light-600 hover:bg-light-700 active:bg-light-800 dark:bg-dark-600 dark:hover:bg-dark-500 dark:active:bg-dark-400 focus:ring-width-2 focus:ring-blurple flex transform-gpu cursor-pointer select-none appearance-none flex-row flex-col place-items-center gap-2 rounded py-3 px-4 leading-none no-underline outline-0 focus:ring active:translate-y-px"
+			href={url}
+		>
+			<h3 className="text-md font-semibold">{title}</h3>
+			<p className={`${direction === 'next' ? 'ml-auto' : 'mr-auto'} text-sm text-gray-600 dark:text-gray-400`}>
+				{direction === 'next' ? 'Next Page' : 'Previous Page'}
+			</p>
+		</a>
+	);
+}

apps/guide/src/components/ResultingCode.tsx

@@ -0,0 +1,3 @@
+export function ResultingCode() {
+	return null;
+}

apps/guide/src/components/Sidebar.tsx

@@ -0,0 +1,24 @@
+import { Scrollbars } from 'react-custom-scrollbars-2';
+import type { MDXPage } from './SidebarItems.jsx';
+
+export function Sidebar({ pages, opened }: { opened: boolean; pages?: MDXPage[] | undefined }) {
+	return (
+		<nav
+			className={`h-[calc(100vh - 73px)] dark:bg-dark-600 dark:border-dark-100 border-light-800 fixed top-[73px] left-0 bottom-0 z-20 w-full border-r bg-white ${
+				opened ? 'block' : 'hidden'
+			} lg:w-76 lg:max-w-76 lg:block`}
+		>
+			<Scrollbars
+				autoHide
+				hideTracksWhenNotNeeded
+				renderThumbVertical={(props) => <div {...props} className="dark:bg-dark-100 bg-light-900 z-30 rounded" />}
+				renderTrackVertical={(props) => (
+					<div {...props} className="absolute top-0.5 right-0.5 bottom-0.5 z-30 w-1.5 rounded" />
+				)}
+				universal
+			>
+				{pages ?? null}
+			</Scrollbars>
+		</nav>
+	);
+}

apps/guide/src/components/SidebarItems.tsx

@@ -0,0 +1,51 @@
+import { Section } from '@discordjs/ui';
+import type { MDXInstance } from 'astro';
+import { useEffect, useMemo, useState } from 'react';
+import { useLocation } from 'react-use';
+
+export type MDXPage = MDXInstance<{ category: string; title: string }>;
+
+export function SidebarItems({ pages }: { pages: MDXPage[] }) {
+	const state = useLocation();
+	const [active, setActive] = useState<string | undefined>('');
+
+	const categories = useMemo(
+		() =>
+			pages.reduce<Record<string, MDXPage[]>>((acc, page) => {
+				if (acc[page.frontmatter.category]) {
+					acc[page.frontmatter.category]?.push(page);
+				} else {
+					acc[page.frontmatter.category] = [page];
+				}
+
+				return acc;
+			}, {}),
+		[pages],
+	);
+
+	useEffect(() => {
+		setActive(state.pathname);
+	}, [state]);
+
+	return Object.keys(categories).map((category, idx) => (
+		<Section key={idx} title={category}>
+			{categories[category]?.map((member, index) => (
+				<a
+					className={`dark:border-dark-100 border-light-800 focus:ring-width-2 focus:ring-blurple ml-5 flex flex-col border-l p-[5px] pl-6 outline-0 focus:rounded focus:border-0 focus:ring ${
+						(member.url || '/') === active
+							? 'bg-blurple text-white'
+							: 'dark:hover:bg-dark-200 dark:active:bg-dark-100 hover:bg-light-700 active:bg-light-800'
+					}`}
+					// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
+					href={member.url || '/'}
+					key={index}
+					title={member.frontmatter.title}
+				>
+					<div className="flex flex-row place-items-center gap-2 lg:text-sm">
+						<span className="truncate">{member.frontmatter.title}</span>
+					</div>
+				</a>
+			)) ?? null}
+		</Section>
+	));
+}

apps/guide/src/components/SidebarLayout.astro

@@ -0,0 +1,180 @@
+---
+import { Separator } from 'ariakit/separator';
+import type { MarkdownLayoutProps } from 'astro';
+import { ExternalLink } from './ExternalLink.jsx';
+import { Navbar } from './Navbar.jsx';
+import { Outline } from './Outline.jsx';
+import { PageButton } from './PageButton.jsx';
+import { SidebarItems } from './SidebarItems.jsx';
+import { generateGithubURL } from '~/util/url.js';
+
+const pages = await Astro.glob<{ category: string; title: string }>('../pages/**/*.mdx');
+
+type Props = MarkdownLayoutProps<{}>;
+const { headings, url, frontmatter } = Astro.props;
+
+const groupedPages = pages.reduce<Record<string, typeof pages>>((acc, page) => {
+	const { category } = page.frontmatter;
+	acc[category] ??= [];
+
+	acc[category]?.push(page);
+	return acc;
+}, {});
+
+// @ts-expect-error props is not typed
+const category = frontmatter.category as string;
+
+const curCategoryPages = groupedPages[category];
+const curCategoryIndex = curCategoryPages!.findIndex((page) => page.url === url);
+
+const pagePrev = curCategoryPages![curCategoryIndex - 1];
+// eslint-disable-next-line @typescript-eslint/restrict-plus-operands
+const pageNext = curCategoryPages![curCategoryIndex + 1];
+---
+
+<script>
+	window.addEventListener('load', () => {
+		const headings = document.querySelectorAll(
+			'div.level-h1 > h1, div.level-h2 > h2, div.level-h3 > h3, div.level-h4 > h4',
+		);
+
+		const headingsObserver = new IntersectionObserver(
+			(entries) => {
+				entries.forEach((entry) => {
+					if (entry.isIntersecting) {
+						const location = window.location.toString().split('#')[0];
+						history.replaceState(null, '', location + '#' + entry.target.id);
+					}
+				});
+			},
+			{
+				root: null,
+				rootMargin: '-100px 0% -66%',
+				threshold: 1.0,
+			},
+		);
+
+		headings.forEach((heading) => headingsObserver.observe(heading));
+	});
+</script>
+
+<Navbar client:load>
+	<div class="flex flex-col gap-3 p-3 pb-32 lg:pb-12" slot="pages">
+		<SidebarItems client:load pages={pages} />
+	</div>
+</Navbar>
+<main class="pt-18 lg:pl-76 xl:pr-64">
+	<article class="dark:bg-dark-600 bg-light-600">
+		<div class="dark:bg-dark-800 relative z-10 min-h-[calc(100vh_-_70px)] bg-white p-6 pb-20 shadow">
+			<div class="prose max-w-full">
+				<slot />
+			</div>
+
+			<div
+				class="h-[calc(100vh - 72px)] dark:bg-dark-600 dark:border-dark-100 border-light-800 fixed top-[72px] right-0 bottom-0 z-20 hidden w-64 border-l bg-white pr-2 xl:block"
+			>
+				<Outline client:load headings={headings} />
+			</div>
+			<Separator className="my-5 border-light-800 dark:border-dark-100" />
+			<div class="flex flex-col space-y-5">
+				<div class="flex place-content-end">
+					<ExternalLink client:load href={generateGithubURL(url!)} title="Edit this page on github" />
+				</div>
+				<div class="flex w-full">
+					{
+						pagePrev && (
+							<PageButton
+								direction="prev"
+								title={pagePrev.frontmatter.title}
+								url={pagePrev.url === '' ? '/' : pagePrev.url!}
+							/>
+						)
+					}
+					<div class="ml-auto self-end justify-self-end">
+						{
+							pageNext && (
+								<PageButton
+									direction="next"
+									title={pageNext.frontmatter.title}
+									url={pageNext.url === '' ? '/' : pageNext.url!}
+								/>
+							)
+						}
+					</div>
+				</div>
+			</div>
+		</div>
+
+		<div class="h-76 md:h-52"></div>
+		<footer
+			class="dark:bg-dark-600 h-76 lg:pl-84 bg-light-600 xl:pr-76 fixed bottom-0 left-0 right-0 md:h-52 md:pl-4 md:pr-16"
+		>
+			<div class="mx-auto flex max-w-6xl flex-col place-items-center gap-12 pt-12 lg:place-content-center">
+				<div class="flex w-full flex-col place-content-between place-items-center gap-12 md:flex-row md:gap-0">
+					<a
+						class="focus:ring-width-2 focus:ring-blurple rounded outline-0 focus:ring"
+						href="https://vercel.com/?utm_source=discordjs&utm_campaign=oss"
+						rel="noopener noreferrer"
+						target="_blank"
+						title="Vercel"
+					>
+						<img alt="Vercel" src="/powered-by-vercel.svg" />
+					</a>
+					<div class="flex flex-row gap-6 md:gap-12">
+						<div class="flex flex-col gap-2">
+							<div class="text-lg font-semibold">Community</div>
+							<div class="flex flex-col gap-1">
+								<a
+									class="focus:ring-width-2 focus:ring-blurple rounded outline-0 focus:ring"
+									href="https://discord.gg/djs"
+									rel="noopener noreferrer"
+									target="_blank"
+								>
+									Discord
+								</a>
+								<a
+									class="focus:ring-width-2 focus:ring-blurple rounded outline-0 focus:ring"
+									href="https://github.com/discordjs/discord.js/discussions"
+									rel="noopener noreferrer"
+									target="_blank"
+								>
+									GitHub discussions
+								</a>
+							</div>
+						</div>
+						<div class="flex flex-col gap-2">
+							<div class="text-lg font-semibold">Project</div>
+							<div class="flex flex-col gap-1">
+								<a
+									class="focus:ring-width-2 focus:ring-blurple rounded outline-0 focus:ring"
+									href="https://github.com/discordjs/discord.js"
+									rel="noopener noreferrer"
+									target="_blank"
+								>
+									discord.js
+								</a>
+								<a
+									class="focus:ring-width-2 focus:ring-blurple rounded outline-0 focus:ring"
+									href="https://discordjs.guide"
+									rel="noopener noreferrer"
+									target="_blank"
+								>
+									discord.js guide
+								</a>
+								<a
+									class="focus:ring-width-2 focus:ring-blurple rounded outline-0 focus:ring"
+									href="https://discord-api-types.dev"
+									rel="noopener noreferrer"
+									target="_blank"
+								>
+									discord-api-types
+								</a>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</footer>
+	</article>
+	<div>Test</div>
+</main>

apps/guide/src/layouts/SidebarLayout.astro

@@ -0,0 +1,63 @@
+---
+import '../styles/main.css';
+import '@code-hike/mdx/styles.css';
+import '../styles/ch.css';
+import type { MarkdownLayoutProps } from 'astro';
+import SidebarLayout from '../components/SidebarLayout.astro';
+import { DESCRIPTION } from '../util/constants.js';
+
+type Props = MarkdownLayoutProps<{}>;
+const props = Astro.props;
+---
+
+<html lang="en">
+	<head>
+		<link href="/apple-touch-icon.png" rel="apple-touch-icon" sizes="180x180" />
+		<link href="/favicon-32x32.png" rel="icon" sizes="32x32" type="image/png" />
+		<link href="/favicon-16x16.png" rel="icon" sizes="16x16" type="image/png" />
+		<link href="/site.webmanifest" rel="manifest" />
+		<link color="#090a16" href="/safari-pinned-tab.svg" rel="mask-icon" />
+		<meta content="light dark" name="color-scheme" />
+		<meta content="discord.js" name="apple-mobile-web-app-title" />
+		<meta content="discord.js" name="application-name" />
+		<meta content="#090a16" name="msapplication-TileColor" />
+		<meta content={DESCRIPTION} name="description" />
+		<meta content="discord.js" property="og:site_name" />
+		<meta content="website" property="og:type" />
+		<meta content="discord.js guide" property="og:title" />
+		<meta content={DESCRIPTION} name="og:description" />
+		<meta content="https://discordjs.dev/open-graph.png" property="og:image" />
+		<meta content="summary_large_image" name="twitter:card" />
+		<meta content="@iCrawlToGo" name="twitter:creator" />
+
+		<title>discord.js</title>
+		<meta content="minimum-scale=1, initial-scale=1, width=device-width" name="viewport" />
+		<meta content="#5865f2" name="theme-color" />
+	</head>
+	<body class="dark:bg-dark-800 bg-white">
+		<script is:inline>
+			function setTheme(prefersDarkMode, persistedColorPreference) {
+				if (persistedColorPreference === 'dark' || (prefersDarkMode && persistedColorPreference !== 'light')) {
+					document.documentElement.classList.toggle('dark', true);
+				} else {
+					document.documentElement.classList.toggle('dark', false);
+				}
+			}
+
+			(() => {
+				const prefersDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
+				const persistedColorPreference = localStorage.getItem('theme') || 'auto';
+				setTheme(prefersDarkMode, persistedColorPreference);
+
+				const listener =
+					window.matchMedia &&
+					window
+						.matchMedia('(prefers-color-scheme: dark)')
+						.addEventListener('change', (ev) => setTheme(ev.matches, persistedColorPreference));
+			})();
+		</script>
+		<SidebarLayout {...props}>
+			<slot />
+		</SidebarLayout>
+	</body>
+</html>

apps/guide/src/pages/additional-info/async-await.mdx

@@ -0,0 +1,253 @@
+---
+layout: '../../layouts/SidebarLayout.astro'
+title: Understanding async/await
+category: Additional info
+---
+
+import { CH } from '@code-hike/mdx/components';
+import { Alert } from '@discordjs/ui';
+
+# Understanding async/await
+
+If you aren't very familiar with ECMAScript 2017, you may not know about async/await. It's a useful way to handle Promises in a hoisted manner. It's also slightly faster and increases overall readability.
+
+## How do Promises work?
+
+Before we can get into async/await, you should know what Promises are and how they work because async/await is just a way to handle Promises. If you know what Promises are and how to deal with them, you can skip this part.
+
+Promises are a way to handle asynchronous tasks in JavaScript; they are the newer alternative to callbacks. A Promise has many similarities to a progress bar; they represent an unfinished and ongoing process. An excellent example of this is a request to a server (e.g., discord.js sends requests to Discord's API).
+
+A Promise can have three states; pending, resolved, and rejected
+
+The **pending** state means that the Promise still is ongoing and neither resolved nor rejected.
+The **resolved** state means that the Promise is done and executed without any errors.
+The **rejected** state means that the Promise encountered an error and could not execute correctly.
+
+One important thing to know is that a Promise can only have one state simultaneously; it can never be pending and resolved, rejected and resolved, or pending and rejected. You may be asking, "How would that look in code?". Here is a small example:
+
+<Alert title="Tip" type="success">
+	This example uses ES6 code. If you do not know what that is, you should read up on that
+	[here](/additional-info/es6-syntax.md).
+</Alert>
+
+<CH.Code client:load>
+
+```js
+function deleteMessages(amount) {
+	return new Promise((resolve) => {
+		if (amount > 10) throw new Error("You can't delete more than 10 Messages at a time.");
+		setTimeout(() => resolve('Deleted 10 messages.'), 2000);
+	});
+}
+
+deleteMessages(5)
+	.then((value) => {
+		// `deleteMessages` is complete and has not encountered any errors
+		// the resolved value will be the string "Deleted 10 messages"
+	})
+	.catch((error) => {
+		// `deleteMessages` encountered an error
+		// the error will be an Error Object
+	});
+```
+
+</CH.Code>
+
+In this scenario, the _`deleteMessages`_ function returns a Promise. The _`.then()`_ method will trigger if the Promise resolves, and the _`.catch()`_ method if the Promise rejects. In the _`deleteMessages`_ function, the Promise is resolved after 2 seconds with the string "Deleted 10 messages.", so the _`.catch()`_ method will never be executed. You can also pass the _`.catch()`_ function as the second parameter of _`.then()`_.
+
+## How to implement async/await
+
+### Theory
+
+The following information is essential to know before working with async/await. You can only use the _`await`_ keyword inside a function declared as _`async`_ (you put the _`async`_ keyword before the _`function`_ keyword or before the parameters when using a callback function).
+
+A simple example would be:
+
+<CH.Code client:load>
+
+```js
+async function declaredAsAsync() {
+	// ...
+}
+```
+
+</CH.Code>
+
+or
+
+<CH.Code client:load>
+
+```js
+const declaredAsAsync = async () => {
+	// ...
+};
+```
+
+</CH.Code>
+
+You can use that as well if you use the arrow function as an event listener.
+
+<CH.Code client:load>
+
+```js
+client.on('event', async (first, last) => {
+	// ...
+});
+```
+
+</CH.Code>
+
+An important thing to know is that a function declared as _`async`_ will always return a Promise. In addition to this, if you return something, the Promise will resolve with that value, and if you throw an error, it will reject the Promise with that error.
+
+### Execution with discord.js code
+
+Now that you know how Promises work and what they are used for, let's look at an example that handles multiple Promises. Let's say you want to react with letters (regional indicators) in a specific order. For this example, here's a basic template for a discord.js bot with some ES6 adjustments.
+
+<CH.Code client:load>
+
+```js
+const { Client, GatewayIntentBits } = require('discord.js');
+
+const client = new Client({ intents: [GatewayIntentBits.Guilds] });
+
+client.once('ready', () => {
+	console.log('I am ready!');
+});
+
+client.on('interactionCreate', (interaction) => {
+	if (!interaction.isChatInputCommand()) return;
+
+	if (interaction.commandName === 'react') {
+		// ...
+	}
+});
+
+client.login('your-token-goes-here');
+```
+
+</CH.Code>
+
+If you don't know how Node.js asynchronous execution works, you would probably try something like this:
+
+<CH.Code client:load>
+
+```js mark=4:7
+client.on('interactionCreate', (interaction) => {
+	// ...
+	if (commandName === 'react') {
+		const message = interaction.reply({ content: 'Reacting!', fetchReply: true });
+		message.react('🇦');
+		message.react('🇧');
+		message.react('🇨');
+	}
+});
+```
+
+</CH.Code>
+
+But since all of these methods are started at the same time, it would just be a race to which server request finished first, so there would be no guarantee that it would react at all (if the message isn't fetched) or in the order you wanted it to. In order to make sure it reacts after the message is sent and in order (a, b, c), you'd need to use the _`.then()`_ callback from the Promises that these methods return. The code would look like this:
+
+<CH.Code client:load>
+
+```js mark=4:12
+client.on('interactionCreate', (interaction) => {
+	// ...
+	if (commandName === 'react') {
+		interaction.reply({ content: 'Reacting!', fetchReply: true }).then((message) => {
+			message
+				.react('🇦')
+				.then(() => message.react('🇧'))
+				.then(() => message.react('🇨'))
+				.catch((error) => {
+					// handle failure of any Promise rejection inside here
+				});
+		});
+	}
+});
+```
+
+</CH.Code>
+
+In this piece of code, the Promises are [chain resolved](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/then#Chaining) with each other, and if one of the Promises gets rejected, the function passed to _`.catch()`_ gets called. Here's the same code but with async/await:
+
+<CH.Code client:load>
+
+```js mark=1,4:7
+client.on('interactionCreate', async (interaction) => {
+	// ...
+	if (commandName === 'react') {
+		const message = await interaction.reply({ content: 'Reacting!', fetchReply: true });
+		await message.react('🇦');
+		await message.react('🇧');
+		await message.react('🇨');
+	}
+});
+```
+
+</CH.Code>
+
+It's mostly the same code, but how would you catch Promise rejections now since _`.catch()`_ isn't there anymore? That is also a useful feature with async/await; the error will be thrown if you await it so that you can wrap the awaited Promises inside a try/catch, and you're good to go.
+
+<CH.Code client:load>
+
+```js mark=1,4:11
+client.on('interactionCreate', async (interaction) => {
+	if (commandName === 'react') {
+		try {
+			const message = await interaction.reply({ content: 'Reacting!', fetchReply: true });
+			await message.react('🇦');
+			await message.react('🇧');
+			await message.react('🇨');
+		} catch (error) {
+			// handle failure of any Promise rejection inside here
+		}
+	}
+});
+```
+
+</CH.Code>
+
+This code looks clean and is also easy to read.
+
+So you may be asking, "How would I get the value the Promise resolved with?".
+
+Let's look at an example where you want to delete a sent reply.
+
+<CH.Code client:load>
+
+```js mark=3:10
+client.on('interactionCreate', (interaction) => {
+	// ...
+	if (commandName === 'delete') {
+		interaction
+			.reply({ content: 'This message will be deleted.', fetchReply: true })
+			.then((replyMessage) => setTimeout(() => replyMessage.delete(), 10000))
+			.catch((error) => {
+				// handle error
+			});
+	}
+});
+```
+
+</CH.Code>
+
+The return value of a _`.reply()`_ with the _`fetchReply`_ option set to _`true`_ is a Promise which resolves with the reply when it has been sent, but how would the same code with async/await look?
+
+<CH.Code client:load>
+
+```js mark=1,4:10
+client.on('interactionCreate', async (interaction) => {
+	if (commandName === 'delete') {
+		try {
+			const replyMessage = await interaction.reply({ content: 'This message will be deleted.', fetchReply: true });
+			setTimeout(() => replyMessage.delete(), 10000);
+		} catch (error) {
+			// handle error
+		}
+	}
+});
+```
+
+</CH.Code>
+
+With async/await, you can assign the awaited function to a variable representing the returned value. Now you know how you use async/await.

apps/guide/src/pages/additional-info/collections.mdx

@@ -0,0 +1,127 @@
+---
+layout: '../../layouts/SidebarLayout.astro'
+title: Collections
+category: Additional info
+---
+
+import { CH } from '@code-hike/mdx/components';
+import { Alert } from '@discordjs/ui';
+
+# Collections
+
+discord.js comes with a utility class known as _`Collection`_.
+It extends JavaScript's native _`Map`_ class, so it has all the _`Map`_ features and more!
+
+<Alert title="Warning" type="warning">
+	If you're not familiar with _`Map`_, read [MDN's page on
+	it](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map) before continuing. You
+	should be familiar with _`Array`_
+	[methods](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array) as well. We will
+	also use some ES6 features, so read up [here](/additional-info/es6-syntax.md) if you do not know what they are.
+</Alert>
+
+A _`Map`_ allows for an association between unique keys and their values.
+For example, how can you transform every value or filter the entries in a _`Map`_ easily?
+This is the point of the _`Collection`_ class!
+
+## Array-like Methods
+
+Many of the methods on _`Collection`_ correspond to their namesake in _`Array`_. One of them is _`find`_:
+
+<CH.Code client:load>
+
+```js
+// Assume we have an array of users and a collection of the same users.
+array.find((u) => u.discriminator === '1000');
+collection.find((u) => u.discriminator === '1000');
+```
+
+</CH.Code>
+
+The interface of the callback function is very similar between the two.
+For arrays, callbacks usually pass the parameters _`(value, index, array)`_, where _`value`_ is the value iterated to,
+_`index`_ is the current index, and _`array`_ is the array. For collections, you would have _`(value, key, collection)`_.
+Here, _`value`_ is the same, but _`key`_ is the key of the value, and _`collection`_ is the collection itself instead.
+
+Methods that follow this philosophy of staying close to the _`Array`_ interface are as follows:
+
+- _`find`_
+- _`filter`_ - Note that this returns a _`Collection`_ rather than an _`Array`_.
+- _`map`_ - Yet this returns an _`Array`_ of values instead of a _`Collection`_!
+- _`every`_
+- _`some`_
+- _`reduce`_
+- _`concat`_
+- _`sort`_
+
+## Converting to Array
+
+Since _`Collection`_ extends _`Map`_, it is an [iterable](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols), and can be converted to an _`Array`_ through either _`Array.from()`_ or spread syntax (_`...collection`_).
+
+<CH.Code client:load>
+
+```js
+// For values.
+Array.from(collection.values());
+[...collection.values()];
+
+// For keys.
+Array.from(collection.keys());
+[...collection.keys()];
+
+// For [key, value] pairs.
+Array.from(collection);
+[...collection];
+```
+
+</CH.Code>
+
+<Alert title="Warning" type="warning">
+	Many people convert Collections to Arrays way too much! This can lead to unnecessary and confusing code. Before you
+	use _`Array.from()`_ or similar, ask yourself if whatever you are trying to do can't be done with the given _`Map`_ or
+	_`Collection`_ methods or with a for-of loop.
+</Alert>
+
+## Extra Utilities
+
+Some methods are not from _`Array`_ and are instead entirely new to standard JavaScript.
+
+<CH.Code client:load>
+
+```js
+// A random value.
+collection.random();
+
+// The first value.
+collection.first();
+
+// The first 5 values.
+collection.first(5);
+
+// Similar to `first`, but from the end.
+collection.last();
+collection.last(2);
+
+// Removes anything that meets the condition from the collection.
+// Sort of like `filter`, but in-place.
+collection.sweep((user) => user.username === 'Bob');
+```
+
+</CH.Code>
+
+A more complicated method is _`partition`_, which splits a single Collection into two new Collections based on the provided function.
+You can think of it as two \_`filter`\_s, but done at the same time:
+
+<CH.Code client:load>
+
+```js
+// `bots` is a Collection of users where their `bot` property was true.
+// `humans` is a Collection where the property was false instead!
+const [bots, humans] = collection.partition((u) => u.bot);
+
+// Both return true.
+bots.every((b) => b.bot);
+humans.every((h) => !h.bot);
+```
+
+</CH.Code>