Skip to content

Commit e2cde17

Browse files
feat: add slate-serializer (ENG-738) (#7)
1 parent a9f4a0a commit e2cde17

27 files changed

+751
-16
lines changed

README.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,9 @@ A collection of libraries maintained by the Voiceflow team.
77
### Libraries
88

99
- [`@voiceflow/normal-store`](./libs/normal-store/README.md) - tools for interacting with normalized data structures
10+
- [`@voiceflow/bidirectional-adapter`](./libs/bidirectional-adapter/README.md) - bi-directional adapter factory used to decouple data structures between systems
11+
- [`@voiceflow/composite-reducer`](./libs/composite-reducer/README.md) - break down reducers by properties
12+
- [`@voiceflow/slate-serializer`](./libs/slate-serializer/README.md) - utilities for rendering slate data with react
1013

1114
## Install
1215

libs/bidirectional-adapter/tsconfig.json

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,6 @@
55
"baseUrl": ".",
66
"paths": {
77
"@/*": ["./src/*"]
8-
},
9-
"isolatedModules": false,
10-
"experimentalDecorators": true,
11-
"emitDecoratorMetadata": true
8+
}
129
}
1310
}
Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,4 @@
11
{
22
"$schema": "https://json.schemastore.org/tsconfig",
3-
"extends": "@voiceflow/tsconfig",
4-
"compilerOptions": {
5-
"isolatedModules": false,
6-
"experimentalDecorators": true,
7-
"emitDecoratorMetadata": true
8-
}
3+
"extends": "@voiceflow/tsconfig"
94
}

libs/normal-store/tsconfig.json

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,6 @@
55
"baseUrl": ".",
66
"paths": {
77
"@/*": ["./src/*"]
8-
},
9-
"isolatedModules": false,
10-
"experimentalDecorators": true,
11-
"emitDecoratorMetadata": true
8+
}
129
}
1310
}
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import { createConfig } from '@voiceflow/dependency-cruiser-config';
2+
3+
export default createConfig();

libs/slate-serializer/README.md

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
# Slate Serializer
2+
3+
Utilities for converting slate data into raw text or JSX.
4+
5+
## Installation
6+
7+
```sh
8+
yarn add @voiceflow/slate-serializer @voiceflow/dtos-interact slate
9+
# or
10+
npm install @voiceflow/slate-serializer @voiceflow/dtos-interact slate
11+
```
12+
13+
If you want to use the JSX serializer make sure to install `react`.
14+
15+
```sh
16+
yarn add react
17+
# or
18+
npm install react
19+
```
20+
21+
## Usage
22+
23+
You can access type guards and other extraction utilities through the main import.
24+
25+
```tsx
26+
import { isLinkElement, getTextCSSProperties } from '@voiceflow/react-chat';
27+
```
28+
29+
### Text Serialization
30+
31+
If you need the textual representation you can import the text serializer.
32+
33+
```tsx
34+
import { serializeToText } from '@voiceflow/react-chat/text';
35+
36+
const text = serializeToText(slateValue);
37+
```
38+
39+
You can turn off `encodeVariables` to avoid encoding variables in the text.
40+
41+
```tsx
42+
import { serializeToText } from '@voiceflow/react-chat/text';
43+
44+
const textWithoutVariables = serializeToText(slateValue, { encodeVariables: false });
45+
```
46+
47+
### JSX Serialization
48+
49+
If you want to render the result in a browser you can serialize to JSX.
50+
51+
```tsx
52+
import { serializeToJSX } from '@voiceflow/react-chat/jsx';
53+
54+
const content = <div>{serializeToJSX(slateValue)}</div>;
55+
```
56+
57+
### Markdown Serialization
58+
59+
If you want to render the result in a browser you can serialize to JSX.
60+
61+
```tsx
62+
import { serializeToMarkdown } from '@voiceflow/react-chat/markdown';
63+
64+
const content = <div>{serializeToMarkdown(slateValue)}</div>;
65+
```

libs/slate-serializer/package.json

Lines changed: 97 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
{
2+
"name": "@voiceflow/slate-serializer",
3+
"version": "2.0.0",
4+
"description": "Utilities for serializing slate data",
5+
"keywords": [
6+
"react",
7+
"slate",
8+
"voiceflow"
9+
],
10+
"homepage": "https://github.com/voiceflow/oss/tree/master/libs/slate-serializer#readme",
11+
"bugs": {
12+
"url": "https://github.com/voiceflow/oss/issues"
13+
},
14+
"repository": {
15+
"type": "git",
16+
"url": "git+https://github.com/voiceflow/oss.git"
17+
},
18+
"license": "ISC",
19+
"author": "Ben Teichman",
20+
"type": "module",
21+
"exports": {
22+
".": {
23+
"types": "./build/esm/index.d.ts",
24+
"import": "./build/esm/index.mjs",
25+
"require": "./build/cjs/index.cjs"
26+
},
27+
"./text": {
28+
"types": "./build/esm/serializers/text.d.ts",
29+
"import": "./build/esm/serializers/text.mjs",
30+
"require": "./build/cjs/serializers/text.cjs"
31+
},
32+
"./markdown": {
33+
"types": "./build/esm/serializers/markdown.d.ts",
34+
"import": "./build/esm/serializers/markdown.mjs",
35+
"require": "./build/cjs/serializers/markdown.cjs"
36+
},
37+
"./jsx": {
38+
"types": "./build/esm/serializers/jsx.d.ts",
39+
"import": "./build/esm/serializers/jsx.mjs",
40+
"require": "./build/cjs/serializers/jsx.cjs"
41+
}
42+
},
43+
"main": "build/cjs/index.js",
44+
"types": "build/esm/index.d.ts",
45+
"typesVersions": {
46+
"*": {
47+
"text": [
48+
"./build/esm/serializers/text.d.ts"
49+
],
50+
"jsx": [
51+
"./build/esm/serializers/jsx.d.ts"
52+
],
53+
"markdown": [
54+
"./build/esm/serializers/markdown.d.ts"
55+
]
56+
}
57+
},
58+
"files": [
59+
"build"
60+
],
61+
"scripts": {
62+
"build": "yarn g:turbo run build:cmd --filter=@voiceflow/slate-serializer...",
63+
"build:cmd": "yarn g:build:pkg",
64+
"clean": "yarn g:rimraf build",
65+
"lint": "yarn g:run-p -c lint:eslint lint:prettier",
66+
"lint:eslint": "yarn g:eslint",
67+
"lint:fix": "yarn g:run-p -c \"lint:eslint --fix\" \"lint:prettier --write\"",
68+
"lint:prettier": "yarn g:prettier --check",
69+
"tdd": "yarn g:vitest",
70+
"test": "yarn g:run-p -c test:dependencies test:types test:unit",
71+
"test:dependencies": "yarn g:depcruise",
72+
"test:types": "yarn g:tsc --noEmit",
73+
"test:unit": "yarn g:vitest run --coverage"
74+
},
75+
"dependencies": {
76+
"csstype": "3.2.3"
77+
},
78+
"devDependencies": {
79+
"@types/react": "18.2.4",
80+
"@voiceflow/dtos-interact": "1.17.1",
81+
"react": "18.2.0",
82+
"slate": "0.94.1",
83+
"zod": "3.22.4"
84+
},
85+
"peerDependencies": {
86+
"@voiceflow/dtos-interact": "^1.17.1",
87+
"react": "^17.0.2",
88+
"slate": "^0.72.3",
89+
"zod": "^3"
90+
},
91+
"engines": {
92+
"node": "20"
93+
},
94+
"volta": {
95+
"extends": "../../package.json"
96+
}
97+
}
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
sonar.projectName=oss-slate-serializer
2+
sonar.sources=src/
3+
sonar.tests=src/
4+
sonar.exclusions=src/**/*.test.ts
5+
sonar.test.inclusions=src/**/*.test.ts
6+
sonar.cpd.exclusions=src/**/*.test.ts
7+
sonar.typescript.tsconfigPath=tsconfig.json
8+
sonar.javascript.lcov.reportPaths=sonar/coverage/lcov.info
Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import { createElement } from '@test/fixtures';
2+
import { SlateTextElementType } from '@voiceflow/dtos-interact';
3+
import { describe, expect, it } from 'vitest';
4+
5+
import { isLinkElement } from '@/guards';
6+
7+
describe('Guards', () => {
8+
describe('isLinkElement()', () => {
9+
it('valid link', () => {
10+
expect(isLinkElement(createElement({ type: SlateTextElementType.LINK }))).to.be.equal(true);
11+
});
12+
13+
it('invalid link', () => {
14+
expect(isLinkElement(createElement())).to.be.equal(false);
15+
});
16+
});
17+
});
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import type { AnySlateTextElement, SlateTextLinkElement, SlateTextVariableElement } from '@voiceflow/dtos-interact';
2+
import { SlateTextElementType } from '@voiceflow/dtos-interact';
3+
4+
export const isLinkElement = (element: AnySlateTextElement): element is SlateTextLinkElement =>
5+
element.type === SlateTextElementType.LINK;
6+
7+
export const isVariableElement = (element: AnySlateTextElement): element is SlateTextVariableElement =>
8+
element.type === SlateTextElementType.VARIABLE;

0 commit comments

Comments
 (0)