Skip to content

Commit

Permalink
Clarify htmlToSlateAST Readme on mutation variable (#72)
Browse files Browse the repository at this point in the history
  • Loading branch information
oddtinker authored Mar 14, 2022
1 parent b1fae60 commit 30a4886
Show file tree
Hide file tree
Showing 2 changed files with 9 additions and 2 deletions.
5 changes: 5 additions & 0 deletions .changeset/lemon-ladybugs-join.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@graphcms/html-to-slate-ast': patch
---

Clarify the htmlToSlateAST Readme on mutation variable
6 changes: 4 additions & 2 deletions packages/html-to-slate-ast/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ npm install @graphcms/html-to-slate-ast
```js
import { htmlToSlateAST } from '@graphcms/html-to-slate-ast';

const htmlString = '<div><p>test</p></div>'; // or import form a filr or database
const htmlString = '<div><p>test</p></div>'; // or import from a file or database
const ast = await htmlToSlateAST(htmlString);
```

Expand All @@ -49,7 +49,7 @@ mutation newArticle($title: String!, $content: RichTextAST) {
}
```

For sending the generated output from htmlToSlateAST using a GraphQL client, you should transform it into a RichText compatible object, for example:
Output generated by `htmlToSlateAST` will represent the `children` array of the [Slate editor object](https://docs.slatejs.org/api/nodes/editor). However, when creating or updating the value of a Rich text field, you are setting the value of the editor node itself. This means that the output should be transformed into a Rich text compatible object, for example:

```js
const data = await client.request(newArticleQuery, {
Expand All @@ -58,6 +58,8 @@ const data = await client.request(newArticleQuery, {
});
```

Here, in terms of Slate, `$content` is the editor node, so the `$ast` array must be assigned to the `children` key in that object.

You can see the full example using [graphql-request](https://github.com/prisma-labs/graphql-request) to mutate the data into GraphCMS [here](https://github.com/GraphCMS/rich-text/blob/main/packages/html-to-slate-ast/examples/graphql-request-script.js)

See the docs about the [Rich Text field type](https://graphcms.com/docs/schema/field-types#rich-text) and [Content Api mutations](https://graphcms.com/docs/content-api/mutations)
Expand Down

0 comments on commit 30a4886

Please sign in to comment.