New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

slate-serializers

Package Overview
Dependencies
Maintainers
1
Versions
50
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

slate-serializers - npm Package Compare versions

Comparing version 0.4.1 to 1.0.0

src/index.d.ts

67

package.json
{
"name": "slate-serializers",
"version": "0.4.1",
"description": "Serialize Slate JSON objects to HTML and vice versa. Define rules to modify the end result.",
"main": "lib/index.js",
"types": "lib/index.d.ts",
"scripts": {
"build": "tsc",
"format": "npx prettier --write .",
"lint": "tslint -p tsconfig.json",
"release": "standard-version",
"prepare": "npm run build",
"prepublishOnly": "npm test && npm run lint",
"test": "jest"
},
"repository": {
"type": "git",
"url": "git+https://github.com/thompsonsj/slate-serializers.git"
},
"files": [
"lib/**/*"
],
"author": "",
"license": "ISC",
"bugs": {
"url": "https://github.com/thompsonsj/slate-serializers/issues"
},
"homepage": "https://github.com/thompsonsj/slate-serializers#readme",
"devDependencies": {
"@commitlint/cli": "^17.6.3",
"@commitlint/config-conventional": "^17.6.3",
"@types/html-escaper": "^3.0.0",
"@types/jest": "^29.5.1",
"@types/react": ">=16",
"@types/react-test-renderer": "^18.0.0",
"commitizen": "^4.3.0",
"husky": "^8.0.3",
"jest": "^29.5.0",
"jest-environment-jsdom": "^29.5.0",
"jsdom": "^21.1.1",
"postcss": "^8.4.24",
"postcss-js": "^4.0.1",
"prettier": "2.8.8",
"react-test-renderer": "^18.2.0",
"ts-jest": "^29.1.0",
"tslint": "^6.1.3",
"tslint-config-prettier": "^1.18.0",
"typescript": "^5.0.4"
},
"commitlint": {
"extends": [
"@commitlint/config-conventional"
]
},
"version": "1.0.0",
"type": "commonjs",
"dependencies": {
"@testing-library/react": "^14.0.0",
"css-select": "^5.1.0",

@@ -63,3 +12,2 @@ "dom-serializer": "^2.0.0",

"htmlparser2": "~7.2.0",
"nanoid": "^4.0.2",
"slate": "^0.94.1",

@@ -69,6 +17,9 @@ "slate-hyperscript": "^0.77.0"

"peerDependencies": {
"@types/react": ">=16",
"react": ">=16",
"react-dom": ">=16"
}
"@slate-serializers/dom": "1.0.0",
"@slate-serializers/html": "1.0.0",
"@slate-serializers/utilities": "1.0.0",
"tslib": "2.5.0"
},
"main": "./src/index.js",
"types": "./src/index.d.ts"
}
# slate-serializers
A collection of serializers to convert [Slate](https://www.npmjs.com/package/slate) JSON objects to various formats and vice versa. Designed to work in both Node.js and browser environments.
This package has been split into separate packages. As more serializers are introduced, the number of dependencies increase. It makes sense to maintain separate packages to keep the serializers as efficient as possible for their desired use case.
There is no need to change - `slate-serializers` will continue to be maintained alongside the new serializers. However, upgrading will keep the dependency tree minimal for your project.
Serializers included so far:
Original docs available at [packages/slate-serializers/docs/original.md](packages/slate-serializers/docs/original.md).
- [`slateToHtml`](#slatetohtml)
- [`htmlToSlate`](#htmltoslate)
- [`slateToDom`](#slatetodom)
## New packages
View the demo at [https://thompsonsj.github.io/slate-serializers-demo](https://thompsonsj.github.io/slate-serializers-demo).
An overview is available at [README.md](README.md).
## Setup
## Upgrade
### Compatibility
### HTML serializers
Serializers are only compatible with Slate >=0.50.0. Earlier versions used a different data model.
Change import from `slate-serializers` to `@slate-serializers/html`.
Note that compatibility has only been tested with Slate v0.72.8. These serializers are still in active development/testing.
If importing configuration objects, change the name as follows.
- `slateToDomConfig` to `slateToHtmlConfig`.
- `payloadSlateToDomConfig` to `payloadSlateToHtmlConfig`.
- `slateDemoSlateToDomConfig` to `slateDemoSlateToHtmlConfig`
### Install
### DOM serializer
```bash
yarn add slate-serializers
# or
npm install slate-serializers
```
### Configuration
Each serializer uses a default configuration, which may not transform your data effectively.
One of the principles of Slate is its [**schema-less core**](https://docs.slatejs.org/#principles).
Check configuration objects in [src/config/](src/config/). Extend the default configuration or write your own in order to apply your schema/transformation rules.
## Serializers
### slateToHtml
```ts
import { slateToHtml } from 'slate-serializers'
const slate = [
{
children: [
{
text: 'Heading 1',
},
],
type: 'h1',
},
{
children: [
{
text: 'Paragraph 1',
},
],
type: 'p',
},
]
const serializedToHtml = slateToHtml(slate)
// output
// <h1>Heading 1</h1><p>Paragraph 1</p>
```
#### Configuration
By default, `slateToHtml` incorporates transformation rules based on the example in [Deserializing | Serializing | Slate](https://docs.slatejs.org/concepts/10-serializing#deserializing).
If you are using [Payload CMS](https://payloadcms.com/), import the Payload configuration file and pass it as a parameter to the serializer.
```ts
import { slateToHtml, payloadSlateToDomConfig } from 'slate-serializers'
const slate = [
{
children: [
{
text: 'Heading 1',
},
],
type: 'h1',
},
]
const serializedToHtml = slateToHtml(slate, payloadSlateToDomConfig)
```
You can create your own configuration file that implements your schema. See [src/config/slateToDom/payload.ts](src/config/slateToDom/payload.ts) for an example of how to extend the default configuration or copy [src/config/slateToDom/default.ts](src/config/slateToDom/default.ts) and rewrite it as appropriate.
### htmlToSlate
```ts
import { htmlToSlate } from 'slate-serializers'
const html = `<h1>Heading 1</h1><p>Paragraph 1</p>`
const serializedToSlate = htmlToSlate(html)
// output
/*
[
{
children: [
{
text: 'Heading 1',
},
],
type: 'h1',
},
{
children: [
{
text: 'Paragraph 1',
},
],
type: 'p',
},
]
/*
```
#### Configuration
By default, `htmlToSlate` incorporates transformation rules based on the example in [HTML | Serializing | Slate](https://docs.slatejs.org/concepts/10-serializing#html).
If you are using [Payload CMS](https://payloadcms.com/), import the Payload configuration file and pass it as a parameter to the serializer.
```ts
import { htmlToSlate, payloadHtmlToSlateConfig } from 'slate-serializers'
const html = `<h1>Heading 1</h1><p>Paragraph 1</p>`
const serializedToSlate = htmlToSlate(html, payloadHtmlToSlateConfig)
```
You can create your own configuration file that implements your schema. See [src/config/htmlToSlate/payload.ts](src/config/htmlToSlate/payload.ts) for an example of how to extend the default configuration or copy [src/config/htmlToSlate/default.ts](src/config/htmlToSlate/default.ts) and rewrite it as appropriate.
For a breakdown of configuration options, see [docs/config/htmlToSlate.md](docs/config/htmlToSlate.md).
#### Whitespace
`htmlToSlate` processes whitespace in a similar way to browsers. It minifies whitespace while trying to preserve meaning. For details, see [docs/engineering.md#whitespace](docs/engineering.md#whitespace).
### slateToDom
`slateToHtml` is a simple wrapper that runs [`dom-serializer`](https://www.npmjs.com/package/dom-serializer) on the output from `slateToDom`.
`slateToDom` is made available in case you wish to work with the DOM output yourself or run `dom-serializer` using any of the available options.
It accepts the same configuration object as [slateToHtml](#slatetohtml).
### Commits
TLDR: contributors can format commit messages in any way, maintainers should use conventional commits.
This repository uses [conventional commits](https://www.conventionalcommits.org/en/v1.0.0/).
Conventional commits are not enforced. General guidance:
- Commit messages can be formatted in any way on a pull request.
- Conventional commit messages are preferred on pull request squash and merge.
Run `npx cz` instead of `git commit` to lint commit messages using [@commitlint/cli](https://www.npmjs.com/package/@commitlint/cli).
Change import from `slate-serializers` to `@slate-serializers/dom`.
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc