@vonaffenfels/slate-editor 1.1.45 → 1.1.47
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/BlockEditor.js +9 -9
- package/dist/Renderer.js +1 -1
- package/dist/index.js +1 -1
- package/package.json +2 -2
- package/src/BlockEditor.js +12 -1
- package/src/Serializer/Serializer.js +64 -54
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vonaffenfels/slate-editor",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.47",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"scripts": {
|
|
@@ -72,7 +72,7 @@
|
|
|
72
72
|
"cssnano": "^5.0.1",
|
|
73
73
|
"escape-html": "^1.0.3"
|
|
74
74
|
},
|
|
75
|
-
"gitHead": "
|
|
75
|
+
"gitHead": "30dcf149050e852dd3e7636525506b1b75e09d4d",
|
|
76
76
|
"publishConfig": {
|
|
77
77
|
"access": "public"
|
|
78
78
|
}
|
package/src/BlockEditor.js
CHANGED
|
@@ -156,6 +156,11 @@ export default function BlockEditor({
|
|
|
156
156
|
|
|
157
157
|
const newValueFixed = fixValue(newValue);
|
|
158
158
|
|
|
159
|
+
// fix for unnecessary value changes, not so pretty but works
|
|
160
|
+
if (JSON.stringify(newValueFixed) === JSON.stringify(value)) {
|
|
161
|
+
return;
|
|
162
|
+
}
|
|
163
|
+
|
|
159
164
|
if (newValueFixed.length > 0) {
|
|
160
165
|
onChange(newValueFixed);
|
|
161
166
|
} else {
|
|
@@ -232,6 +237,9 @@ export default function BlockEditor({
|
|
|
232
237
|
}, []);
|
|
233
238
|
|
|
234
239
|
const handleSidebarEditorChange = newElement => {
|
|
240
|
+
console.log("Vincent-Debug, BlockEditor.js:237", "sidebar editor change");
|
|
241
|
+
|
|
242
|
+
|
|
235
243
|
let newNodeProps = {
|
|
236
244
|
block: newElement.block,
|
|
237
245
|
isEmpty: false,
|
|
@@ -387,7 +395,10 @@ export default function BlockEditor({
|
|
|
387
395
|
<Slate
|
|
388
396
|
editor={editor}
|
|
389
397
|
value={value}
|
|
390
|
-
onChange={
|
|
398
|
+
onChange={v => {
|
|
399
|
+
onSlateChange(v);
|
|
400
|
+
console.log("YEEEEEE");
|
|
401
|
+
}}
|
|
391
402
|
>
|
|
392
403
|
<div>
|
|
393
404
|
<Toolbar
|
|
@@ -7,6 +7,7 @@ import {Leaf} from "../Nodes/Leaf";
|
|
|
7
7
|
import {StorybookDisplay} from "../Nodes/StorybookDisplay";
|
|
8
8
|
import classNames from "classnames";
|
|
9
9
|
import {addAdsToValue} from "./ads";
|
|
10
|
+
import ErrorBoundary from "../Blocks/ErrorBoundary";
|
|
10
11
|
|
|
11
12
|
function isEmptyNode(node) {
|
|
12
13
|
if (!node.type) {
|
|
@@ -106,7 +107,7 @@ export function Serializer({
|
|
|
106
107
|
const renderElement = (props, isInSlot = false) => {
|
|
107
108
|
const typeProps = getPropsForType(props.type, isInSlot);
|
|
108
109
|
const Wrapper = typeProps.wrapper || function ({children}) {
|
|
109
|
-
return
|
|
110
|
+
return <ErrorBoundary>{children}</ErrorBoundary>;
|
|
110
111
|
};
|
|
111
112
|
|
|
112
113
|
switch (props.type) {
|
|
@@ -124,7 +125,10 @@ export function Serializer({
|
|
|
124
125
|
storybookComponentDataLoader: storybookComponentDataLoader,
|
|
125
126
|
};
|
|
126
127
|
|
|
127
|
-
return <
|
|
128
|
+
return <ErrorBoundary><Wrapper
|
|
129
|
+
id={props?.attributes?.id}
|
|
130
|
+
type={props.type}
|
|
131
|
+
block={props.block}><StorybookDisplay {...storyProps} /></Wrapper></ErrorBoundary>;
|
|
128
132
|
}
|
|
129
133
|
case 'layout': {
|
|
130
134
|
let isGrid = true;
|
|
@@ -137,55 +141,59 @@ export function Serializer({
|
|
|
137
141
|
});
|
|
138
142
|
}
|
|
139
143
|
|
|
140
|
-
return <
|
|
141
|
-
<
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
"block-editor-layout
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
144
|
+
return <ErrorBoundary>
|
|
145
|
+
<Wrapper type={props.type}>
|
|
146
|
+
<div
|
|
147
|
+
data-cols={props.children.length}
|
|
148
|
+
className={classNames("block-editor-layout", {
|
|
149
|
+
"block-editor-layout-grid": isGrid,
|
|
150
|
+
"block-editor-layout-flex": !isGrid,
|
|
151
|
+
"block-editor-table-border-wrapper": props?.attributes?.tableBorder,
|
|
152
|
+
"md:grid-cols-1": props.children.length === 1,
|
|
153
|
+
"md:grid-cols-2": props.children.length === 2,
|
|
154
|
+
"md:grid-cols-3": props.children.length === 3,
|
|
155
|
+
"md:grid-cols-4": props.children.length === 4,
|
|
156
|
+
"md:grid-cols-5": props.children.length === 5,
|
|
157
|
+
"grid-cols-1": props?.attributes?.mobileColumnSpan === 1,
|
|
158
|
+
"grid-cols-2": props?.attributes?.mobileColumnSpan === 2,
|
|
159
|
+
"md:space-x-4": props.attributes?.spacing,
|
|
160
|
+
"mt-16": props?.attributes?.margin?.top,
|
|
161
|
+
"mr-16": props?.attributes?.margin?.right,
|
|
162
|
+
"mb-16": props?.attributes?.margin?.bottom,
|
|
163
|
+
"ml-16": props?.attributes?.margin?.left,
|
|
164
|
+
"justify-center": props?.attributes?.justifyCenter,
|
|
165
|
+
[typeProps.classNameSite + " site-width"]: !isInSlot && (props.attributes?.width === "site" || props.attributes?.width === "full"),
|
|
166
|
+
[typeProps.classNameArticle + " article-width"]: !isInSlot && (props.attributes?.width === "article" || !props.attributes?.width),
|
|
167
|
+
})}
|
|
168
|
+
>
|
|
169
|
+
{props.children.map((v, i) => <Fragment
|
|
170
|
+
key={"layout-pos-" + i}>{serializeNode(v, i, isInSlot)}</Fragment>)}
|
|
171
|
+
</div>
|
|
172
|
+
</Wrapper>
|
|
173
|
+
</ErrorBoundary>;
|
|
168
174
|
}
|
|
169
175
|
case 'layout-slot':
|
|
170
|
-
return <
|
|
171
|
-
<
|
|
172
|
-
className={classNames({
|
|
173
|
-
["block-editor-layout-" + props.attributes.name]: true,
|
|
174
|
-
"mt-4": props.attributes?.margin?.top,
|
|
175
|
-
"md:mr-4": props.attributes?.margin?.right,
|
|
176
|
-
"mb-4": props.attributes?.margin?.bottom,
|
|
177
|
-
"md:ml-4": props.attributes?.margin?.left,
|
|
178
|
-
})}
|
|
179
|
-
>
|
|
176
|
+
return <ErrorBoundary>
|
|
177
|
+
<Wrapper type={props.type}>
|
|
180
178
|
<div
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
179
|
+
className={classNames({
|
|
180
|
+
["block-editor-layout-" + props.attributes.name]: true,
|
|
181
|
+
"mt-4": props.attributes?.margin?.top,
|
|
182
|
+
"md:mr-4": props.attributes?.margin?.right,
|
|
183
|
+
"mb-4": props.attributes?.margin?.bottom,
|
|
184
|
+
"md:ml-4": props.attributes?.margin?.left,
|
|
185
|
+
})}
|
|
186
|
+
>
|
|
187
|
+
<div
|
|
188
|
+
style={{top: props.attributes?.sticky && "80px"}}
|
|
189
|
+
className={classNames({"sticky": props.attributes?.sticky})}>
|
|
190
|
+
{props.children.map((v, i) => <div
|
|
191
|
+
key={"layout-slot-" + i}
|
|
192
|
+
>{serializeNode(v, i, props.attributes.name)}</div>)}
|
|
193
|
+
</div>
|
|
186
194
|
</div>
|
|
187
|
-
</
|
|
188
|
-
</
|
|
195
|
+
</Wrapper>
|
|
196
|
+
</ErrorBoundary>;
|
|
189
197
|
default: {
|
|
190
198
|
const defaultProps = {
|
|
191
199
|
specialClassMap: specialClassMap,
|
|
@@ -200,13 +208,15 @@ export function Serializer({
|
|
|
200
208
|
key={props.type + "-pos-item-" + i}>{serializeNode(v, i, isInSlot)}</Fragment>),
|
|
201
209
|
};
|
|
202
210
|
|
|
203
|
-
return <
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
211
|
+
return <ErrorBoundary>
|
|
212
|
+
<Default
|
|
213
|
+
{...defaultProps}
|
|
214
|
+
isInSlot={isInSlot}
|
|
215
|
+
isRenderer={isRenderer}
|
|
216
|
+
transformAttributes={transformAttributes}
|
|
217
|
+
defaultComponentReplacement={defaultComponentReplacement}
|
|
218
|
+
/>
|
|
219
|
+
</ErrorBoundary>;
|
|
210
220
|
}
|
|
211
221
|
}
|
|
212
222
|
};
|