docs: adds custom anchor tags to docs with duplicate headings (#9521)

### What?
Adds custom anchor tags to docs where duplicate headings exist.

### Why?
Anchor links would not correctly navigate to the proper point on the
page if there were multiple headings with the same string.

### How?
The website now supports adding custom `#anchor` to a heading in
markdown that will attach to the headings and table of content list
items. This PR adds custom anchors to the docs that have duplicate
headings.

**Example:**
```md
/docs/upload/storage-adapters.mdx

### Usage#vercel-blob-installation
```
Generates the path:
`/docs/upload/storage-adapters#vercel-blob-installation`
This commit is contained in:
Tylan Davis
2024-11-25 16:31:08 -05:00
committed by GitHub
parent b5f89d5199
commit aa26312b96
4 changed files with 32 additions and 32 deletions

View File

@@ -108,7 +108,7 @@ called with an argument object with the following properties:
| `id` | The `id` of the current document being edited. `id` is `undefined` during the `create` operation |
| `user` | An object containing the currently authenticated user |
## Example
### Example#filter-options-example
```ts
const uploadField = {

View File

@@ -77,7 +77,7 @@ export const MyFeature = createServerFeature({
This allows you to add i18n translations scoped to your feature. This specific example translation will be available under `lexical:myFeature:label` - `myFeature` being your feature key.
### Markdown Transformers
### Markdown Transformers#server-feature-markdown-transformers
The Server Feature, just like the Client Feature, allows you to add markdown transformers. Markdown transformers on the server are used when [converting the editor from or to markdown](/docs/lexical/converters#markdown-lexical).
@@ -120,7 +120,7 @@ export const MyFeature = createServerFeature({
In this example, the node will be outputted as `+++` in Markdown, and the markdown `+++` will be converted to a `MyNode` node in the editor.
### Nodes
### Nodes#server-feature-nodes
While nodes added to the server feature do not control how the node is rendered in the editor, they control other aspects of the node:
- HTML conversion
@@ -266,7 +266,7 @@ export const MyClientFeature = createClientFeature({
Explore the APIs available through ClientFeature to add the specific functionality you need. Remember, do not import directly from `'@payloadcms/richtext-lexical'` when working on the client-side, as it will cause errors with webpack or turbopack. Instead, use `'@payloadcms/richtext-lexical/client'` for all client-side imports. Type-imports are excluded from this rule and can always be imported.
### Nodes
### Nodes#client-feature-nodes
Add nodes to the `nodes` array in **both** your client & server feature. On the server side, nodes are utilized for backend operations like HTML conversion in a headless editor. On the client side, these nodes are integral to how content is displayed and managed in the editor, influencing how they are rendered, behave, and saved in the database.
@@ -705,7 +705,7 @@ export const MyClientFeature = createClientFeature({
| **`keywords`** | Keywords are used to match the item for different texts typed after the '/'. E.g. you might want to show a horizontal rule item if you type both /hr, /separator, /horizontal etc. In addition to the keywords, the label and key will be used to find the right slash menu item. |
### Markdown Transformers
### Markdown Transformers#client-feature-markdown-transformers
The Client Feature, just like the Server Feature, allows you to add markdown transformers. Markdown transformers on the client are used to create new nodes when a certain markdown pattern is typed in the editor.

View File

@@ -102,7 +102,7 @@ const post = await payload.find({
The following Collection operations are available through the Local API:
### Create
### Create#collection-create
```js
// The created Post document is returned
@@ -134,7 +134,7 @@ const post = await payload.create({
})
```
### Find
### Find#collection-find
```js
// Result will be a paginated set of Posts.
@@ -155,7 +155,7 @@ const result = await payload.find({
})
```
### Find by ID
### Find by ID#collection-find-by-id
```js
// Result will be a Post document.
@@ -171,7 +171,7 @@ const result = await payload.findByID({
})
```
### Count
### Count#collection-count
```js
// Result will be an object with:
@@ -187,7 +187,7 @@ const result = await payload.count({
})
```
### Update by ID
### Update by ID#collection-update-by-id
```js
// Result will be the updated Post document.
@@ -219,7 +219,7 @@ const result = await payload.update({
})
```
### Update Many
### Update Many#collection-update-many
```js
// Result will be an object with:
@@ -258,7 +258,7 @@ const result = await payload.update({
})
```
### Delete
### Delete#collection-delete
```js
// Result will be the now-deleted Post document.
@@ -275,7 +275,7 @@ const result = await payload.delete({
})
```
### Delete Many
### Delete Many#collection-delete-many
```js
// Result will be an object with:
@@ -394,7 +394,7 @@ const result = await payload.verifyEmail({
The following Global operations are available through the Local API:
### Find
### Find#global-find
```js
// Result will be the Header Global.
@@ -409,7 +409,7 @@ const result = await payload.findGlobal({
})
```
### Update
### Update#global-update
```js
// Result will be the updated Header Global.

View File

@@ -19,13 +19,13 @@ Payload offers additional storage adapters to handle file uploads. These adapter
## Vercel Blob Storage
[`@payloadcms/storage-vercel-blob`](https://www.npmjs.com/package/@payloadcms/storage-vercel-blob)
### Installation
### Installation#vercel-blob-installation
```sh
pnpm add @payloadcms/storage-vercel-blob
```
### Usage
### Usage#vercel-blob-usage
- Configure the `collections` object to specify which collections should use the Vercel Blob adapter. The slug _must_ match one of your existing collection slugs.
- Ensure you have `BLOB_READ_WRITE_TOKEN` set in your Vercel environment variables. This is usually set by Vercel automatically after adding blob storage to your project.
@@ -55,7 +55,7 @@ export default buildConfig({
})
```
### Configuration Options
### Configuration Options#vercel-blob-configuration
| Option | Description | Default |
| -------------------- | -------------------------------------------------------------------- | ----------------------------- |
@@ -68,13 +68,13 @@ export default buildConfig({
## S3 Storage
[`@payloadcms/storage-s3`](https://www.npmjs.com/package/@payloadcms/storage-s3)
### Installation
### Installation#s3-installation
```sh
pnpm add @payloadcms/storage-s3
```
### Usage
### Usage#s3-usage
- Configure the `collections` object to specify which collections should use the S3 Storage adapter. The slug _must_ match one of your existing collection slugs.
- The `config` object can be any [`S3ClientConfig`](https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/client/s3) object (from [`@aws-sdk/client-s3`](https://github.com/aws/aws-sdk-js-v3)). _This is highly dependent on your AWS setup_. Check the AWS documentation for more information.
@@ -109,20 +109,20 @@ export default buildConfig({
})
```
#### Configuration Options
### Configuration Options#s3-configuration
See the the [AWS SDK Package](https://github.com/aws/aws-sdk-js-v3) and [`S3ClientConfig`](https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/client/s3) object for guidance on AWS S3 configuration.
## Azure Blob Storage
[`@payloadcms/storage-azure`](https://www.npmjs.com/package/@payloadcms/storage-azure)
### Installation
### Installation#azure-installation
```sh
pnpm add @payloadcms/storage-azure
```
### Usage
### Usage#azure-usage
- Configure the `collections` object to specify which collections should use the Azure Blob adapter. The slug _must_ match one of your existing collection slugs.
- When enabled, this package will automatically set `disableLocalStorage` to `true` for each collection.
@@ -151,7 +151,7 @@ export default buildConfig({
})
```
### Configuration Options
### Configuration Options#azure-configuration
| Option | Description | Default |
| ---------------------- | ------------------------------------------------------------------------ | ------- |
@@ -165,13 +165,13 @@ export default buildConfig({
## Google Cloud Storage
[`@payloadcms/storage-gcs`](https://www.npmjs.com/package/@payloadcms/storage-gcs)
### Installation
### Installation#gcs-installation
```sh
pnpm add @payloadcms/storage-gcs
```
### Usage
### Usage#gcs-usage
- Configure the `collections` object to specify which collections should use the Google Cloud Storage adapter. The slug _must_ match one of your existing collection slugs.
- When enabled, this package will automatically set `disableLocalStorage` to `true` for each collection.
@@ -201,7 +201,7 @@ export default buildConfig({
})
```
### Configuration Options
### Configuration Options#gcs-configuration
| Option | Description | Default |
| ------------- | --------------------------------------------------------------------------------------------------- | --------- |
@@ -215,13 +215,13 @@ export default buildConfig({
## Uploadthing Storage
[`@payloadcms/storage-uploadthing`](https://www.npmjs.com/package/@payloadcms/storage-uploadthing)
### Installation
### Installation#uploadthing-installation
```sh
pnpm add @payloadcms/storage-uploadthing
```
### Usage
### Usage#uploadthing-usage
- Configure the `collections` object to specify which collections should use uploadthing. The slug _must_ match one of your existing collection slugs and be an `upload` type.
- Get a token from Uploadthing and set it as `token` in the `options` object.
@@ -244,7 +244,7 @@ export default buildConfig({
})
```
### Configuration Options
### Configuration Options#uploadthing-configuration
| Option | Description | Default |
| ---------------- | ----------------------------------------------- | ------------- |
@@ -259,11 +259,11 @@ export default buildConfig({
If you need to create a custom storage adapter, you can use the [`@payloadcms/plugin-cloud-storage`](https://www.npmjs.com/package/@payloadcms/plugin-cloud-storage) package. This package is used internally by the storage adapters mentioned above.
### Installation
### Installation#custom-installation
`pnpm add @payloadcms/plugin-cloud-storage`
### Usage
### Usage#custom-usage
Reference any of the existing storage adapters for guidance on how this should be structured. Create an adapter following the `GeneratedAdapter` interface. Then, pass the adapter to the `cloudStorage` plugin.