@payloadcms/richtext-slate 3.0.0-beta.35 → 3.0.0-beta.37
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/cell/index.js +4 -1
- package/dist/cell/index.js.map +1 -1
- package/dist/field/RichText.js +162 -130
- package/dist/field/RichText.js.map +1 -1
- package/dist/field/elements/Button.js +11 -5
- package/dist/field/elements/Button.js.map +1 -1
- package/dist/field/elements/ListButton.js +5 -3
- package/dist/field/elements/ListButton.js.map +1 -1
- package/dist/field/elements/blockquote/Blockquote.d.ts +1 -2
- package/dist/field/elements/blockquote/Blockquote.d.ts.map +1 -1
- package/dist/field/elements/blockquote/Blockquote.js +5 -3
- package/dist/field/elements/blockquote/Blockquote.js.map +1 -1
- package/dist/field/elements/blockquote/index.js +5 -3
- package/dist/field/elements/blockquote/index.js.map +1 -1
- package/dist/field/elements/h1/Heading1.d.ts +1 -2
- package/dist/field/elements/h1/Heading1.d.ts.map +1 -1
- package/dist/field/elements/h1/Heading1.js +5 -1
- package/dist/field/elements/h1/Heading1.js.map +1 -1
- package/dist/field/elements/h1/index.js +5 -3
- package/dist/field/elements/h1/index.js.map +1 -1
- package/dist/field/elements/h2/Heading2.d.ts +1 -2
- package/dist/field/elements/h2/Heading2.d.ts.map +1 -1
- package/dist/field/elements/h2/Heading2.js +5 -1
- package/dist/field/elements/h2/Heading2.js.map +1 -1
- package/dist/field/elements/h2/index.js +5 -3
- package/dist/field/elements/h2/index.js.map +1 -1
- package/dist/field/elements/h3/Heading3.d.ts +1 -2
- package/dist/field/elements/h3/Heading3.d.ts.map +1 -1
- package/dist/field/elements/h3/Heading3.js +5 -1
- package/dist/field/elements/h3/Heading3.js.map +1 -1
- package/dist/field/elements/h3/index.js +5 -3
- package/dist/field/elements/h3/index.js.map +1 -1
- package/dist/field/elements/h4/Heading4.d.ts +1 -2
- package/dist/field/elements/h4/Heading4.d.ts.map +1 -1
- package/dist/field/elements/h4/Heading4.js +5 -1
- package/dist/field/elements/h4/Heading4.js.map +1 -1
- package/dist/field/elements/h4/index.js +5 -3
- package/dist/field/elements/h4/index.js.map +1 -1
- package/dist/field/elements/h5/Heading5.d.ts +1 -2
- package/dist/field/elements/h5/Heading5.d.ts.map +1 -1
- package/dist/field/elements/h5/Heading5.js +5 -1
- package/dist/field/elements/h5/Heading5.js.map +1 -1
- package/dist/field/elements/h5/index.js +5 -3
- package/dist/field/elements/h5/index.js.map +1 -1
- package/dist/field/elements/h6/Heading6.d.ts +1 -2
- package/dist/field/elements/h6/Heading6.d.ts.map +1 -1
- package/dist/field/elements/h6/Heading6.js +5 -1
- package/dist/field/elements/h6/Heading6.js.map +1 -1
- package/dist/field/elements/h6/index.js +5 -3
- package/dist/field/elements/h6/index.js.map +1 -1
- package/dist/field/elements/indent/Button.js +20 -12
- package/dist/field/elements/indent/Button.js.map +1 -1
- package/dist/field/elements/indent/Element.js +5 -3
- package/dist/field/elements/indent/Element.js.map +1 -1
- package/dist/field/elements/li/ListItem.js +5 -3
- package/dist/field/elements/li/ListItem.js.map +1 -1
- package/dist/field/elements/link/Button/index.js +46 -39
- package/dist/field/elements/link/Button/index.js.map +1 -1
- package/dist/field/elements/link/Element/index.d.ts +1 -2
- package/dist/field/elements/link/Element/index.d.ts.map +1 -1
- package/dist/field/elements/link/Element/index.js +101 -83
- package/dist/field/elements/link/Element/index.js.map +1 -1
- package/dist/field/elements/link/LinkDrawer/index.js +29 -22
- package/dist/field/elements/link/LinkDrawer/index.js.map +1 -1
- package/dist/field/elements/ol/OrderedList.js +5 -3
- package/dist/field/elements/ol/OrderedList.js.map +1 -1
- package/dist/field/elements/ol/index.js +5 -3
- package/dist/field/elements/ol/index.js.map +1 -1
- package/dist/field/elements/relationship/Button/index.js +26 -12
- package/dist/field/elements/relationship/Button/index.js.map +1 -1
- package/dist/field/elements/relationship/Element/index.js +69 -44
- package/dist/field/elements/relationship/Element/index.js.map +1 -1
- package/dist/field/elements/textAlign/index.js +20 -10
- package/dist/field/elements/textAlign/index.js.map +1 -1
- package/dist/field/elements/ul/UnorderedList.js +5 -3
- package/dist/field/elements/ul/UnorderedList.js.map +1 -1
- package/dist/field/elements/ul/index.js +5 -3
- package/dist/field/elements/ul/index.js.map +1 -1
- package/dist/field/elements/upload/Button/index.js +26 -14
- package/dist/field/elements/upload/Button/index.js.map +1 -1
- package/dist/field/elements/upload/Element/UploadDrawer/index.js +25 -17
- package/dist/field/elements/upload/Element/UploadDrawer/index.js.map +1 -1
- package/dist/field/elements/upload/Element/index.js +108 -72
- package/dist/field/elements/upload/Element/index.js.map +1 -1
- package/dist/field/icons/AlignCenter/index.js +7 -5
- package/dist/field/icons/AlignCenter/index.js.map +1 -1
- package/dist/field/icons/AlignLeft/index.js +7 -5
- package/dist/field/icons/AlignLeft/index.js.map +1 -1
- package/dist/field/icons/AlignRight/index.js +7 -5
- package/dist/field/icons/AlignRight/index.js.map +1 -1
- package/dist/field/icons/Blockquote/index.js +14 -9
- package/dist/field/icons/Blockquote/index.js.map +1 -1
- package/dist/field/icons/Bold/index.js +14 -9
- package/dist/field/icons/Bold/index.js.map +1 -1
- package/dist/field/icons/Code/index.js +8 -6
- package/dist/field/icons/Code/index.js.map +1 -1
- package/dist/field/icons/IndentLeft/index.js +31 -24
- package/dist/field/icons/IndentLeft/index.js.map +1 -1
- package/dist/field/icons/IndentRight/index.js +31 -24
- package/dist/field/icons/IndentRight/index.js.map +1 -1
- package/dist/field/icons/Italic/index.js +14 -9
- package/dist/field/icons/Italic/index.js.map +1 -1
- package/dist/field/icons/Link/index.js +14 -9
- package/dist/field/icons/Link/index.js.map +1 -1
- package/dist/field/icons/OrderedList/index.js +14 -9
- package/dist/field/icons/OrderedList/index.js.map +1 -1
- package/dist/field/icons/Relationship/index.js +24 -18
- package/dist/field/icons/Relationship/index.js.map +1 -1
- package/dist/field/icons/Strikethrough/index.js +14 -9
- package/dist/field/icons/Strikethrough/index.js.map +1 -1
- package/dist/field/icons/Underline/index.js +14 -9
- package/dist/field/icons/Underline/index.js.map +1 -1
- package/dist/field/icons/UnorderedList/index.js +14 -9
- package/dist/field/icons/UnorderedList/index.js.map +1 -1
- package/dist/field/icons/Upload/index.js +16 -11
- package/dist/field/icons/Upload/index.js.map +1 -1
- package/dist/field/icons/headings/H1/index.js +14 -9
- package/dist/field/icons/headings/H1/index.js.map +1 -1
- package/dist/field/icons/headings/H2/index.js +14 -9
- package/dist/field/icons/headings/H2/index.js.map +1 -1
- package/dist/field/icons/headings/H3/index.js +14 -9
- package/dist/field/icons/headings/H3/index.js.map +1 -1
- package/dist/field/icons/headings/H4/index.js +14 -9
- package/dist/field/icons/headings/H4/index.js.map +1 -1
- package/dist/field/icons/headings/H5/index.js +14 -9
- package/dist/field/icons/headings/H5/index.js.map +1 -1
- package/dist/field/icons/headings/H6/index.js +14 -9
- package/dist/field/icons/headings/H6/index.js.map +1 -1
- package/dist/field/index.js +17 -13
- package/dist/field/index.js.map +1 -1
- package/dist/field/leaves/Button.d.ts +1 -2
- package/dist/field/leaves/Button.d.ts.map +1 -1
- package/dist/field/leaves/Button.js +5 -3
- package/dist/field/leaves/Button.js.map +1 -1
- package/dist/field/leaves/bold/Bold/index.d.ts +1 -2
- package/dist/field/leaves/bold/Bold/index.d.ts.map +1 -1
- package/dist/field/leaves/bold/Bold/index.js +5 -1
- package/dist/field/leaves/bold/Bold/index.js.map +1 -1
- package/dist/field/leaves/bold/index.js +5 -3
- package/dist/field/leaves/bold/index.js.map +1 -1
- package/dist/field/leaves/code/Code/index.d.ts +1 -2
- package/dist/field/leaves/code/Code/index.d.ts.map +1 -1
- package/dist/field/leaves/code/Code/index.js +5 -1
- package/dist/field/leaves/code/Code/index.js.map +1 -1
- package/dist/field/leaves/code/index.js +5 -3
- package/dist/field/leaves/code/index.js.map +1 -1
- package/dist/field/leaves/italic/Italic/index.d.ts +1 -2
- package/dist/field/leaves/italic/Italic/index.d.ts.map +1 -1
- package/dist/field/leaves/italic/Italic/index.js +5 -1
- package/dist/field/leaves/italic/Italic/index.js.map +1 -1
- package/dist/field/leaves/italic/index.js +5 -3
- package/dist/field/leaves/italic/index.js.map +1 -1
- package/dist/field/leaves/strikethrough/Strikethrough/index.d.ts +1 -2
- package/dist/field/leaves/strikethrough/Strikethrough/index.d.ts.map +1 -1
- package/dist/field/leaves/strikethrough/Strikethrough/index.js +5 -1
- package/dist/field/leaves/strikethrough/Strikethrough/index.js.map +1 -1
- package/dist/field/leaves/strikethrough/index.js +5 -3
- package/dist/field/leaves/strikethrough/index.js.map +1 -1
- package/dist/field/leaves/underline/Underline/index.d.ts +1 -2
- package/dist/field/leaves/underline/Underline/index.d.ts.map +1 -1
- package/dist/field/leaves/underline/Underline/index.js +5 -1
- package/dist/field/leaves/underline/Underline/index.js.map +1 -1
- package/dist/field/leaves/underline/index.js +5 -3
- package/dist/field/leaves/underline/index.js.map +1 -1
- package/dist/field/providers/ElementButtonProvider.js +5 -3
- package/dist/field/providers/ElementButtonProvider.js.map +1 -1
- package/dist/field/providers/ElementProvider.js +5 -3
- package/dist/field/providers/ElementProvider.js.map +1 -1
- package/dist/field/providers/LeafButtonProvider.js +5 -3
- package/dist/field/providers/LeafButtonProvider.js.map +1 -1
- package/dist/field/providers/LeafProvider.js +5 -3
- package/dist/field/providers/LeafProvider.js.map +1 -1
- package/dist/generateComponentMap.js +7 -6
- package/dist/generateComponentMap.js.map +1 -1
- package/package.json +14 -8
package/dist/cell/index.js
CHANGED
|
@@ -1,9 +1,12 @@
|
|
|
1
1
|
'use client';
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
3
|
import React from 'react';
|
|
3
4
|
export const RichTextCell = ({ cellData })=>{
|
|
4
5
|
const flattenedText = cellData?.map((i)=>i?.children?.map((c)=>c.text)).join(' ');
|
|
5
6
|
// Limiting the number of characters shown is done in a CSS rule
|
|
6
|
-
return /*#__PURE__*/
|
|
7
|
+
return /*#__PURE__*/ _jsx("span", {
|
|
8
|
+
children: flattenedText
|
|
9
|
+
});
|
|
7
10
|
};
|
|
8
11
|
|
|
9
12
|
//# sourceMappingURL=index.js.map
|
package/dist/cell/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/cell/index.tsx"],"sourcesContent":["'use client'\nimport type { DefaultCellComponentProps } from 'payload/types'\n\nimport React from 'react'\n\nexport const RichTextCell: React.FC<DefaultCellComponentProps<any[]>> = ({ cellData }) => {\n const flattenedText = cellData?.map((i) => i?.children?.map((c) => c.text)).join(' ')\n\n // Limiting the number of characters shown is done in a CSS rule\n return <span>{flattenedText}</span>\n}\n"],"names":["React","RichTextCell","cellData","flattenedText","map","i","children","c","text","join","span"],"rangeMappings":"
|
|
1
|
+
{"version":3,"sources":["../../src/cell/index.tsx"],"sourcesContent":["'use client'\nimport type { DefaultCellComponentProps } from 'payload/types'\n\nimport React from 'react'\n\nexport const RichTextCell: React.FC<DefaultCellComponentProps<any[]>> = ({ cellData }) => {\n const flattenedText = cellData?.map((i) => i?.children?.map((c) => c.text)).join(' ')\n\n // Limiting the number of characters shown is done in a CSS rule\n return <span>{flattenedText}</span>\n}\n"],"names":["React","RichTextCell","cellData","flattenedText","map","i","children","c","text","join","span"],"rangeMappings":";;;;;;;;;","mappings":"AAAA;;AAGA,OAAOA,WAAW,QAAO;AAEzB,OAAO,MAAMC,eAA2D,CAAC,EAAEC,QAAQ,EAAE;IACnF,MAAMC,gBAAgBD,UAAUE,IAAI,CAACC,IAAMA,GAAGC,UAAUF,IAAI,CAACG,IAAMA,EAAEC,IAAI,GAAGC,KAAK;IAEjF,gEAAgE;IAChE,qBAAO,KAACC;kBAAMP;;AAChB,EAAC"}
|
package/dist/field/RichText.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
3
|
import { getTranslation } from '@payloadcms/translations';
|
|
3
4
|
import { FieldDescription } from '@payloadcms/ui/forms/FieldDescription';
|
|
4
5
|
import { FieldError } from '@payloadcms/ui/forms/FieldError';
|
|
@@ -8,7 +9,7 @@ import { useField } from '@payloadcms/ui/forms/useField';
|
|
|
8
9
|
import { withCondition } from '@payloadcms/ui/forms/withCondition';
|
|
9
10
|
import { useEditDepth } from '@payloadcms/ui/providers/EditDepth';
|
|
10
11
|
import { useTranslation } from '@payloadcms/ui/providers/Translation';
|
|
11
|
-
import isHotkey from 'is-hotkey';
|
|
12
|
+
import { isHotkey } from 'is-hotkey';
|
|
12
13
|
import React, { useCallback, useEffect, useMemo, useRef } from 'react';
|
|
13
14
|
import { Node, Element as SlateElement, Text, Transforms, createEditor } from 'slate';
|
|
14
15
|
import { withHistory } from 'slate-history';
|
|
@@ -151,18 +152,22 @@ const RichTextField = (props)=>{
|
|
|
151
152
|
}
|
|
152
153
|
}
|
|
153
154
|
if (Element) {
|
|
154
|
-
const el = /*#__PURE__*/
|
|
155
|
+
const el = /*#__PURE__*/ _jsx(ElementProvider, {
|
|
155
156
|
attributes: attr,
|
|
156
157
|
childNodes: children,
|
|
157
158
|
editorRef: editorRef,
|
|
158
159
|
element: element,
|
|
159
160
|
fieldProps: props,
|
|
160
161
|
path: path,
|
|
161
|
-
schemaPath: schemaPath
|
|
162
|
-
|
|
162
|
+
schemaPath: schemaPath,
|
|
163
|
+
children: Element
|
|
164
|
+
});
|
|
163
165
|
return el;
|
|
164
166
|
}
|
|
165
|
-
return /*#__PURE__*/
|
|
167
|
+
return /*#__PURE__*/ _jsx("div", {
|
|
168
|
+
...attr,
|
|
169
|
+
children: children
|
|
170
|
+
});
|
|
166
171
|
}, [
|
|
167
172
|
elements,
|
|
168
173
|
path,
|
|
@@ -175,21 +180,27 @@ const RichTextField = (props)=>{
|
|
|
175
180
|
return matchedLeaves.reduce((result, [, leafConfig], i)=>{
|
|
176
181
|
if (leafConfig?.Leaf) {
|
|
177
182
|
const Leaf = leafConfig.Leaf;
|
|
178
|
-
return /*#__PURE__*/
|
|
183
|
+
return /*#__PURE__*/ _jsx(LeafProvider, {
|
|
179
184
|
attributes: attributes,
|
|
180
185
|
editorRef: editorRef,
|
|
181
186
|
fieldProps: props,
|
|
182
|
-
key: i,
|
|
183
187
|
leaf: leaf,
|
|
184
188
|
path: path,
|
|
185
189
|
result: result,
|
|
186
|
-
schemaPath: schemaPath
|
|
187
|
-
|
|
190
|
+
schemaPath: schemaPath,
|
|
191
|
+
children: Leaf
|
|
192
|
+
}, i);
|
|
188
193
|
}
|
|
189
194
|
return result;
|
|
190
|
-
}, /*#__PURE__*/
|
|
195
|
+
}, /*#__PURE__*/ _jsx("span", {
|
|
196
|
+
...attributes,
|
|
197
|
+
children: children
|
|
198
|
+
}));
|
|
191
199
|
}
|
|
192
|
-
return /*#__PURE__*/
|
|
200
|
+
return /*#__PURE__*/ _jsx("span", {
|
|
201
|
+
...attributes,
|
|
202
|
+
children: children
|
|
203
|
+
});
|
|
193
204
|
}, [
|
|
194
205
|
path,
|
|
195
206
|
props,
|
|
@@ -266,130 +277,151 @@ const RichTextField = (props)=>{
|
|
|
266
277
|
}
|
|
267
278
|
}
|
|
268
279
|
if (!valueToRender) valueToRender = defaultRichTextValue;
|
|
269
|
-
return /*#__PURE__*/
|
|
280
|
+
return /*#__PURE__*/ _jsxs("div", {
|
|
270
281
|
className: classes,
|
|
271
282
|
style: {
|
|
272
283
|
...style,
|
|
273
284
|
width
|
|
274
|
-
}
|
|
275
|
-
}, /*#__PURE__*/ React.createElement(FieldLabel, {
|
|
276
|
-
CustomLabel: CustomLabel,
|
|
277
|
-
label: label,
|
|
278
|
-
required: required,
|
|
279
|
-
...labelProps || {}
|
|
280
|
-
}), /*#__PURE__*/ React.createElement("div", {
|
|
281
|
-
className: `${baseClass}__wrap`
|
|
282
|
-
}, /*#__PURE__*/ React.createElement(FieldError, {
|
|
283
|
-
CustomError: CustomError,
|
|
284
|
-
path: path,
|
|
285
|
-
...errorProps || {}
|
|
286
|
-
}), /*#__PURE__*/ React.createElement(Slate, {
|
|
287
|
-
editor: editor,
|
|
288
|
-
key: JSON.stringify({
|
|
289
|
-
initialValue,
|
|
290
|
-
path
|
|
291
|
-
}),
|
|
292
|
-
onChange: handleChange,
|
|
293
|
-
value: valueToRender
|
|
294
|
-
}, /*#__PURE__*/ React.createElement("div", {
|
|
295
|
-
className: `${baseClass}__wrapper`
|
|
296
|
-
}, Object.keys(elements)?.length + Object.keys(leaves)?.length > 0 && /*#__PURE__*/ React.createElement("div", {
|
|
297
|
-
className: [
|
|
298
|
-
`${baseClass}__toolbar`,
|
|
299
|
-
drawerIsOpen && `${baseClass}__drawerIsOpen`
|
|
300
|
-
].filter(Boolean).join(' '),
|
|
301
|
-
ref: toolbarRef
|
|
302
|
-
}, /*#__PURE__*/ React.createElement("div", {
|
|
303
|
-
className: `${baseClass}__toolbar-wrap`
|
|
304
|
-
}, Object.values(elements).map((element)=>{
|
|
305
|
-
const Button = element?.Button;
|
|
306
|
-
if (Button) {
|
|
307
|
-
return /*#__PURE__*/ React.createElement(ElementButtonProvider, {
|
|
308
|
-
fieldProps: props,
|
|
309
|
-
key: element.name,
|
|
310
|
-
path: path,
|
|
311
|
-
schemaPath: schemaPath
|
|
312
|
-
}, Button);
|
|
313
|
-
}
|
|
314
|
-
return null;
|
|
315
|
-
}), Object.values(leaves).map((leaf)=>{
|
|
316
|
-
const Button = leaf?.Button;
|
|
317
|
-
if (Button) {
|
|
318
|
-
return /*#__PURE__*/ React.createElement(LeafButtonProvider, {
|
|
319
|
-
fieldProps: props,
|
|
320
|
-
key: leaf.name,
|
|
321
|
-
path: path,
|
|
322
|
-
schemaPath: schemaPath
|
|
323
|
-
}, Button);
|
|
324
|
-
}
|
|
325
|
-
return null;
|
|
326
|
-
}))), /*#__PURE__*/ React.createElement("div", {
|
|
327
|
-
className: `${baseClass}__editor`,
|
|
328
|
-
ref: editorRef
|
|
329
|
-
}, /*#__PURE__*/ React.createElement(Editable, {
|
|
330
|
-
className: `${baseClass}__input`,
|
|
331
|
-
id: `field-${path.replace(/\./g, '__')}`,
|
|
332
|
-
onKeyDown: (event)=>{
|
|
333
|
-
if (event.key === 'Enter') {
|
|
334
|
-
if (event.shiftKey) {
|
|
335
|
-
event.preventDefault();
|
|
336
|
-
editor.insertText('\n');
|
|
337
|
-
} else {
|
|
338
|
-
const selectedElement = Node.descendant(editor, editor.selection.anchor.path.slice(0, -1));
|
|
339
|
-
if (SlateElement.isElement(selectedElement)) {
|
|
340
|
-
// Allow hard enter to "break out" of certain elements
|
|
341
|
-
if (editor.shouldBreakOutOnEnter(selectedElement)) {
|
|
342
|
-
event.preventDefault();
|
|
343
|
-
const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path);
|
|
344
|
-
if (Text.isText(selectedLeaf) && String(selectedLeaf.text).length === editor.selection.anchor.offset) {
|
|
345
|
-
Transforms.insertNodes(editor, {
|
|
346
|
-
children: [
|
|
347
|
-
{
|
|
348
|
-
text: ''
|
|
349
|
-
}
|
|
350
|
-
]
|
|
351
|
-
});
|
|
352
|
-
} else {
|
|
353
|
-
Transforms.splitNodes(editor);
|
|
354
|
-
Transforms.setNodes(editor, {});
|
|
355
|
-
}
|
|
356
|
-
}
|
|
357
|
-
}
|
|
358
|
-
}
|
|
359
|
-
}
|
|
360
|
-
if (event.key === 'Backspace') {
|
|
361
|
-
const selectedElement = Node.descendant(editor, editor.selection.anchor.path.slice(0, -1));
|
|
362
|
-
if (SlateElement.isElement(selectedElement) && selectedElement.type === 'li') {
|
|
363
|
-
const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path);
|
|
364
|
-
if (Text.isText(selectedLeaf) && String(selectedLeaf.text).length === 0) {
|
|
365
|
-
event.preventDefault();
|
|
366
|
-
Transforms.unwrapNodes(editor, {
|
|
367
|
-
match: (n)=>SlateElement.isElement(n) && listTypes.includes(n.type),
|
|
368
|
-
mode: 'lowest',
|
|
369
|
-
split: true
|
|
370
|
-
});
|
|
371
|
-
Transforms.setNodes(editor, {
|
|
372
|
-
type: undefined
|
|
373
|
-
});
|
|
374
|
-
}
|
|
375
|
-
} else if (editor.isVoid(selectedElement)) {
|
|
376
|
-
Transforms.removeNodes(editor);
|
|
377
|
-
}
|
|
378
|
-
}
|
|
379
|
-
Object.keys(hotkeys).forEach((hotkey)=>{
|
|
380
|
-
if (isHotkey(hotkey, event)) {
|
|
381
|
-
event.preventDefault();
|
|
382
|
-
const mark = hotkeys[hotkey];
|
|
383
|
-
toggleLeaf(editor, mark);
|
|
384
|
-
}
|
|
385
|
-
});
|
|
386
285
|
},
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
286
|
+
children: [
|
|
287
|
+
/*#__PURE__*/ _jsx(FieldLabel, {
|
|
288
|
+
CustomLabel: CustomLabel,
|
|
289
|
+
label: label,
|
|
290
|
+
required: required,
|
|
291
|
+
...labelProps || {}
|
|
292
|
+
}),
|
|
293
|
+
/*#__PURE__*/ _jsxs("div", {
|
|
294
|
+
className: `${baseClass}__wrap`,
|
|
295
|
+
children: [
|
|
296
|
+
/*#__PURE__*/ _jsx(FieldError, {
|
|
297
|
+
CustomError: CustomError,
|
|
298
|
+
path: path,
|
|
299
|
+
...errorProps || {}
|
|
300
|
+
}),
|
|
301
|
+
/*#__PURE__*/ _jsx(Slate, {
|
|
302
|
+
editor: editor,
|
|
303
|
+
onChange: handleChange,
|
|
304
|
+
value: valueToRender,
|
|
305
|
+
children: /*#__PURE__*/ _jsxs("div", {
|
|
306
|
+
className: `${baseClass}__wrapper`,
|
|
307
|
+
children: [
|
|
308
|
+
Object.keys(elements)?.length + Object.keys(leaves)?.length > 0 && /*#__PURE__*/ _jsx("div", {
|
|
309
|
+
className: [
|
|
310
|
+
`${baseClass}__toolbar`,
|
|
311
|
+
drawerIsOpen && `${baseClass}__drawerIsOpen`
|
|
312
|
+
].filter(Boolean).join(' '),
|
|
313
|
+
ref: toolbarRef,
|
|
314
|
+
children: /*#__PURE__*/ _jsxs("div", {
|
|
315
|
+
className: `${baseClass}__toolbar-wrap`,
|
|
316
|
+
children: [
|
|
317
|
+
Object.values(elements).map((element)=>{
|
|
318
|
+
const Button = element?.Button;
|
|
319
|
+
if (Button) {
|
|
320
|
+
return /*#__PURE__*/ _jsx(ElementButtonProvider, {
|
|
321
|
+
fieldProps: props,
|
|
322
|
+
path: path,
|
|
323
|
+
schemaPath: schemaPath,
|
|
324
|
+
children: Button
|
|
325
|
+
}, element.name);
|
|
326
|
+
}
|
|
327
|
+
return null;
|
|
328
|
+
}),
|
|
329
|
+
Object.values(leaves).map((leaf)=>{
|
|
330
|
+
const Button = leaf?.Button;
|
|
331
|
+
if (Button) {
|
|
332
|
+
return /*#__PURE__*/ _jsx(LeafButtonProvider, {
|
|
333
|
+
fieldProps: props,
|
|
334
|
+
path: path,
|
|
335
|
+
schemaPath: schemaPath,
|
|
336
|
+
children: Button
|
|
337
|
+
}, leaf.name);
|
|
338
|
+
}
|
|
339
|
+
return null;
|
|
340
|
+
})
|
|
341
|
+
]
|
|
342
|
+
})
|
|
343
|
+
}),
|
|
344
|
+
/*#__PURE__*/ _jsx("div", {
|
|
345
|
+
className: `${baseClass}__editor`,
|
|
346
|
+
ref: editorRef,
|
|
347
|
+
children: /*#__PURE__*/ _jsx(Editable, {
|
|
348
|
+
className: `${baseClass}__input`,
|
|
349
|
+
id: `field-${path.replace(/\./g, '__')}`,
|
|
350
|
+
onKeyDown: (event)=>{
|
|
351
|
+
if (event.key === 'Enter') {
|
|
352
|
+
if (event.shiftKey) {
|
|
353
|
+
event.preventDefault();
|
|
354
|
+
editor.insertText('\n');
|
|
355
|
+
} else {
|
|
356
|
+
const selectedElement = Node.descendant(editor, editor.selection.anchor.path.slice(0, -1));
|
|
357
|
+
if (SlateElement.isElement(selectedElement)) {
|
|
358
|
+
// Allow hard enter to "break out" of certain elements
|
|
359
|
+
if (editor.shouldBreakOutOnEnter(selectedElement)) {
|
|
360
|
+
event.preventDefault();
|
|
361
|
+
const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path);
|
|
362
|
+
if (Text.isText(selectedLeaf) && String(selectedLeaf.text).length === editor.selection.anchor.offset) {
|
|
363
|
+
Transforms.insertNodes(editor, {
|
|
364
|
+
children: [
|
|
365
|
+
{
|
|
366
|
+
text: ''
|
|
367
|
+
}
|
|
368
|
+
]
|
|
369
|
+
});
|
|
370
|
+
} else {
|
|
371
|
+
Transforms.splitNodes(editor);
|
|
372
|
+
Transforms.setNodes(editor, {});
|
|
373
|
+
}
|
|
374
|
+
}
|
|
375
|
+
}
|
|
376
|
+
}
|
|
377
|
+
}
|
|
378
|
+
if (event.key === 'Backspace') {
|
|
379
|
+
const selectedElement = Node.descendant(editor, editor.selection.anchor.path.slice(0, -1));
|
|
380
|
+
if (SlateElement.isElement(selectedElement) && selectedElement.type === 'li') {
|
|
381
|
+
const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path);
|
|
382
|
+
if (Text.isText(selectedLeaf) && String(selectedLeaf.text).length === 0) {
|
|
383
|
+
event.preventDefault();
|
|
384
|
+
Transforms.unwrapNodes(editor, {
|
|
385
|
+
match: (n)=>SlateElement.isElement(n) && listTypes.includes(n.type),
|
|
386
|
+
mode: 'lowest',
|
|
387
|
+
split: true
|
|
388
|
+
});
|
|
389
|
+
Transforms.setNodes(editor, {
|
|
390
|
+
type: undefined
|
|
391
|
+
});
|
|
392
|
+
}
|
|
393
|
+
} else if (editor.isVoid(selectedElement)) {
|
|
394
|
+
Transforms.removeNodes(editor);
|
|
395
|
+
}
|
|
396
|
+
}
|
|
397
|
+
Object.keys(hotkeys).forEach((hotkey)=>{
|
|
398
|
+
if (isHotkey(hotkey, event)) {
|
|
399
|
+
event.preventDefault();
|
|
400
|
+
const mark = hotkeys[hotkey];
|
|
401
|
+
toggleLeaf(editor, mark);
|
|
402
|
+
}
|
|
403
|
+
});
|
|
404
|
+
},
|
|
405
|
+
placeholder: getTranslation(placeholder, i18n),
|
|
406
|
+
readOnly: readOnly,
|
|
407
|
+
renderElement: renderElement,
|
|
408
|
+
renderLeaf: renderLeaf,
|
|
409
|
+
spellCheck: true
|
|
410
|
+
})
|
|
411
|
+
})
|
|
412
|
+
]
|
|
413
|
+
})
|
|
414
|
+
}, JSON.stringify({
|
|
415
|
+
initialValue,
|
|
416
|
+
path
|
|
417
|
+
})),
|
|
418
|
+
CustomDescription !== undefined ? CustomDescription : /*#__PURE__*/ _jsx(FieldDescription, {
|
|
419
|
+
...descriptionProps || {}
|
|
420
|
+
})
|
|
421
|
+
]
|
|
422
|
+
})
|
|
423
|
+
]
|
|
424
|
+
});
|
|
393
425
|
};
|
|
394
426
|
export const RichText = withCondition(RichTextField);
|
|
395
427
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/field/RichText.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from '@payloadcms/ui/fields/shared'\nimport type { ClientValidate } from 'payload/types'\nimport type { BaseEditor, BaseOperation } from 'slate'\nimport type { HistoryEditor } from 'slate-history'\nimport type { ReactEditor } from 'slate-react'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { FieldDescription } from '@payloadcms/ui/forms/FieldDescription'\nimport { FieldError } from '@payloadcms/ui/forms/FieldError'\nimport { FieldLabel } from '@payloadcms/ui/forms/FieldLabel'\nimport { useFieldProps } from '@payloadcms/ui/forms/FieldPropsProvider'\nimport { useField } from '@payloadcms/ui/forms/useField'\nimport { withCondition } from '@payloadcms/ui/forms/withCondition'\nimport { useEditDepth } from '@payloadcms/ui/providers/EditDepth'\nimport { useTranslation } from '@payloadcms/ui/providers/Translation'\nimport isHotkey from 'is-hotkey'\nimport React, { useCallback, useEffect, useMemo, useRef } from 'react'\nimport { Node, Element as SlateElement, Text, Transforms, createEditor } from 'slate'\nimport { withHistory } from 'slate-history'\nimport { Editable, Slate, withReact } from 'slate-react'\n\nimport type { ElementNode, RichTextPlugin, TextNode } from '../types.js'\nimport type { EnabledFeatures } from './types.js'\n\nimport { defaultRichTextValue } from '../data/defaultValue.js'\nimport { richTextValidate } from '../data/validation.js'\nimport { listTypes } from './elements/listTypes.js'\nimport { hotkeys } from './hotkeys.js'\nimport './index.scss'\nimport { toggleLeaf } from './leaves/toggle.js'\nimport { withEnterBreakOut } from './plugins/withEnterBreakOut.js'\nimport { withHTML } from './plugins/withHTML.js'\nimport { ElementButtonProvider } from './providers/ElementButtonProvider.js'\nimport { ElementProvider } from './providers/ElementProvider.js'\nimport { LeafButtonProvider } from './providers/LeafButtonProvider.js'\nimport { LeafProvider } from './providers/LeafProvider.js'\n\nconst baseClass = 'rich-text'\n\ndeclare module 'slate' {\n interface CustomTypes {\n Editor: BaseEditor & ReactEditor & HistoryEditor\n Element: ElementNode\n Text: TextNode\n }\n}\n\nconst RichTextField: React.FC<\n FormFieldBase & {\n elements: EnabledFeatures['elements']\n leaves: EnabledFeatures['leaves']\n name: string\n placeholder?: string\n plugins: RichTextPlugin[]\n richTextComponentMap: Map<string, React.ReactNode>\n width?: string\n }\n> = (props) => {\n const {\n name,\n CustomDescription,\n CustomError,\n CustomLabel,\n className,\n descriptionProps,\n elements,\n errorProps,\n label,\n labelProps,\n leaves,\n path: pathFromProps,\n placeholder,\n plugins,\n readOnly,\n required,\n style,\n validate = richTextValidate,\n width,\n } = props\n\n const { i18n } = useTranslation()\n const editorRef = useRef(null)\n const toolbarRef = useRef(null)\n\n const drawerDepth = useEditDepth()\n const drawerIsOpen = drawerDepth > 1\n\n const memoizedValidate: ClientValidate = useCallback(\n (value, validationOptions) => {\n if (typeof validate === 'function') {\n return validate(value, {\n ...validationOptions,\n req: {\n t: i18n.t,\n },\n required,\n })\n }\n },\n [validate, required, i18n],\n )\n\n const { path: pathFromContext } = useFieldProps()\n\n const { initialValue, path, schemaPath, setValue, showError, value } = useField({\n path: pathFromContext || pathFromProps || name,\n validate: memoizedValidate,\n })\n\n const editor = useMemo(() => {\n let CreatedEditor = withEnterBreakOut(withHistory(withReact(createEditor())))\n\n CreatedEditor = withHTML(CreatedEditor)\n\n if (plugins.length) {\n CreatedEditor = plugins.reduce((editorWithPlugins, plugin) => {\n return plugin(editorWithPlugins)\n }, CreatedEditor)\n }\n\n return CreatedEditor\n }, [plugins])\n\n const renderElement = useCallback(\n ({ attributes, children, element }) => {\n // return <div {...attributes}>{children}</div>\n\n const matchedElement = elements[element.type]\n const Element = matchedElement?.Element\n\n let attr = { ...attributes }\n\n // this converts text alignment to margin when dealing with void elements\n if (element.textAlign) {\n if (element.type === 'relationship' || element.type === 'upload') {\n switch (element.textAlign) {\n case 'left':\n attr = { ...attr, style: { marginRight: 'auto' } }\n break\n case 'right':\n attr = { ...attr, style: { marginLeft: 'auto' } }\n break\n case 'center':\n attr = { ...attr, style: { marginLeft: 'auto', marginRight: 'auto' } }\n break\n default:\n attr = { ...attr, style: { textAlign: element.textAlign } }\n break\n }\n } else if (element.type === 'li') {\n switch (element.textAlign) {\n case 'right':\n attr = { ...attr, style: { listStylePosition: 'inside', textAlign: 'right' } }\n break\n case 'center':\n attr = { ...attr, style: { listStylePosition: 'inside', textAlign: 'center' } }\n break\n case 'left':\n default:\n attr = { ...attr, style: { listStylePosition: 'outside', textAlign: 'left' } }\n break\n }\n } else {\n attr = { ...attr, style: { textAlign: element.textAlign } }\n }\n }\n\n if (Element) {\n const el = (\n <ElementProvider\n attributes={attr}\n childNodes={children}\n editorRef={editorRef}\n element={element}\n fieldProps={props}\n path={path}\n schemaPath={schemaPath}\n >\n {Element}\n </ElementProvider>\n )\n\n return el\n }\n\n return <div {...attr}>{children}</div>\n },\n [elements, path, props, schemaPath],\n )\n\n const renderLeaf = useCallback(\n ({ attributes, children, leaf }) => {\n const matchedLeaves = Object.entries(leaves).filter(([leafName]) => leaf[leafName])\n\n if (matchedLeaves.length > 0) {\n return matchedLeaves.reduce(\n (result, [, leafConfig], i) => {\n if (leafConfig?.Leaf) {\n const Leaf = leafConfig.Leaf\n\n return (\n <LeafProvider\n attributes={attributes}\n editorRef={editorRef}\n fieldProps={props}\n key={i}\n leaf={leaf}\n path={path}\n result={result}\n schemaPath={schemaPath}\n >\n {Leaf}\n </LeafProvider>\n )\n }\n\n return result\n },\n <span {...attributes}>{children}</span>,\n )\n }\n\n return <span {...attributes}>{children}</span>\n },\n [path, props, schemaPath, leaves],\n )\n\n // All slate changes fire the onChange event\n // including selection changes\n // so we will filter the set_selection operations out\n // and only fire setValue when onChange is because of value\n const handleChange = useCallback(\n (val: unknown) => {\n const ops = editor?.operations.filter((o: BaseOperation) => {\n if (o) {\n return o.type !== 'set_selection'\n }\n return false\n })\n\n if (ops && Array.isArray(ops) && ops.length > 0) {\n if (!readOnly && val !== defaultRichTextValue && val !== value) {\n setValue(val)\n }\n }\n },\n [editor?.operations, readOnly, setValue, value],\n )\n\n useEffect(() => {\n function setClickableState(clickState: 'disabled' | 'enabled') {\n const selectors = 'button, a, [role=\"button\"]'\n const toolbarButtons: (HTMLAnchorElement | HTMLButtonElement)[] =\n toolbarRef.current?.querySelectorAll(selectors)\n\n ;(toolbarButtons || []).forEach((child) => {\n const isButton = child.tagName === 'BUTTON'\n const isDisabling = clickState === 'disabled'\n child.setAttribute('tabIndex', isDisabling ? '-1' : '0')\n if (isButton) child.setAttribute('disabled', isDisabling ? 'disabled' : null)\n })\n }\n\n if (readOnly) {\n setClickableState('disabled')\n }\n\n return () => {\n if (readOnly) {\n setClickableState('enabled')\n }\n }\n }, [readOnly])\n\n // useEffect(() => {\n // // If there is a change to the initial value, we need to reset Slate history\n // // and clear selection because the old selection may no longer be valid\n // // as returned JSON may be modified in hooks and have a different shape\n // if (editor.selection) {\n // console.log('deselecting');\n // ReactEditor.deselect(editor);\n // }\n // }, [path, editor]);\n\n const classes = [\n baseClass,\n 'field-type',\n className,\n showError && 'error',\n readOnly && `${baseClass}--read-only`,\n ]\n .filter(Boolean)\n .join(' ')\n\n let valueToRender = value\n\n if (typeof valueToRender === 'string') {\n try {\n const parsedJSON = JSON.parse(valueToRender)\n valueToRender = parsedJSON\n } catch (err) {\n valueToRender = null\n }\n }\n\n if (!valueToRender) valueToRender = defaultRichTextValue\n\n return (\n <div\n className={classes}\n style={{\n ...style,\n width,\n }}\n >\n <FieldLabel\n CustomLabel={CustomLabel}\n label={label}\n required={required}\n {...(labelProps || {})}\n />\n <div className={`${baseClass}__wrap`}>\n <FieldError CustomError={CustomError} path={path} {...(errorProps || {})} />\n <Slate\n editor={editor}\n key={JSON.stringify({ initialValue, path })} // makes sure slate is completely re-rendered when initialValue changes, bypassing the slate-internal value memoization. That way, external changes to the form will update the editor\n onChange={handleChange}\n value={valueToRender as any[]}\n >\n <div className={`${baseClass}__wrapper`}>\n {Object.keys(elements)?.length + Object.keys(leaves)?.length > 0 && (\n <div\n className={[`${baseClass}__toolbar`, drawerIsOpen && `${baseClass}__drawerIsOpen`]\n .filter(Boolean)\n .join(' ')}\n ref={toolbarRef}\n >\n <div className={`${baseClass}__toolbar-wrap`}>\n {Object.values(elements).map((element) => {\n const Button = element?.Button\n\n if (Button) {\n return (\n <ElementButtonProvider\n fieldProps={props}\n key={element.name}\n path={path}\n schemaPath={schemaPath}\n >\n {Button}\n </ElementButtonProvider>\n )\n }\n\n return null\n })}\n {Object.values(leaves).map((leaf) => {\n const Button = leaf?.Button\n\n if (Button) {\n return (\n <LeafButtonProvider\n fieldProps={props}\n key={leaf.name}\n path={path}\n schemaPath={schemaPath}\n >\n {Button}\n </LeafButtonProvider>\n )\n }\n\n return null\n })}\n </div>\n </div>\n )}\n <div className={`${baseClass}__editor`} ref={editorRef}>\n <Editable\n className={`${baseClass}__input`}\n id={`field-${path.replace(/\\./g, '__')}`}\n onKeyDown={(event) => {\n if (event.key === 'Enter') {\n if (event.shiftKey) {\n event.preventDefault()\n editor.insertText('\\n')\n } else {\n const selectedElement = Node.descendant(\n editor,\n editor.selection.anchor.path.slice(0, -1),\n )\n\n if (SlateElement.isElement(selectedElement)) {\n // Allow hard enter to \"break out\" of certain elements\n if (editor.shouldBreakOutOnEnter(selectedElement)) {\n event.preventDefault()\n const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path)\n\n if (\n Text.isText(selectedLeaf) &&\n String(selectedLeaf.text).length === editor.selection.anchor.offset\n ) {\n Transforms.insertNodes(editor, { children: [{ text: '' }] })\n } else {\n Transforms.splitNodes(editor)\n Transforms.setNodes(editor, {})\n }\n }\n }\n }\n }\n\n if (event.key === 'Backspace') {\n const selectedElement = Node.descendant(\n editor,\n editor.selection.anchor.path.slice(0, -1),\n )\n\n if (SlateElement.isElement(selectedElement) && selectedElement.type === 'li') {\n const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path)\n if (Text.isText(selectedLeaf) && String(selectedLeaf.text).length === 0) {\n event.preventDefault()\n Transforms.unwrapNodes(editor, {\n match: (n) => SlateElement.isElement(n) && listTypes.includes(n.type),\n mode: 'lowest',\n split: true,\n })\n\n Transforms.setNodes(editor, { type: undefined })\n }\n } else if (editor.isVoid(selectedElement)) {\n Transforms.removeNodes(editor)\n }\n }\n\n Object.keys(hotkeys).forEach((hotkey) => {\n if (isHotkey(hotkey, event as any)) {\n event.preventDefault()\n const mark = hotkeys[hotkey]\n toggleLeaf(editor, mark)\n }\n })\n }}\n placeholder={getTranslation(placeholder, i18n)}\n readOnly={readOnly}\n renderElement={renderElement}\n renderLeaf={renderLeaf}\n spellCheck\n />\n </div>\n </div>\n </Slate>\n {CustomDescription !== undefined ? (\n CustomDescription\n ) : (\n <FieldDescription {...(descriptionProps || {})} />\n )}\n </div>\n </div>\n )\n}\n\nexport const RichText = withCondition(RichTextField)\n"],"names":["getTranslation","FieldDescription","FieldError","FieldLabel","useFieldProps","useField","withCondition","useEditDepth","useTranslation","isHotkey","React","useCallback","useEffect","useMemo","useRef","Node","Element","SlateElement","Text","Transforms","createEditor","withHistory","Editable","Slate","withReact","defaultRichTextValue","richTextValidate","listTypes","hotkeys","toggleLeaf","withEnterBreakOut","withHTML","ElementButtonProvider","ElementProvider","LeafButtonProvider","LeafProvider","baseClass","RichTextField","props","name","CustomDescription","CustomError","CustomLabel","className","descriptionProps","elements","errorProps","label","labelProps","leaves","path","pathFromProps","placeholder","plugins","readOnly","required","style","validate","width","i18n","editorRef","toolbarRef","drawerDepth","drawerIsOpen","memoizedValidate","value","validationOptions","req","t","pathFromContext","initialValue","schemaPath","setValue","showError","editor","CreatedEditor","length","reduce","editorWithPlugins","plugin","renderElement","attributes","children","element","matchedElement","type","attr","textAlign","marginRight","marginLeft","listStylePosition","el","childNodes","fieldProps","div","renderLeaf","leaf","matchedLeaves","Object","entries","filter","leafName","result","leafConfig","i","Leaf","key","span","handleChange","val","ops","operations","o","Array","isArray","setClickableState","clickState","selectors","toolbarButtons","current","querySelectorAll","forEach","child","isButton","tagName","isDisabling","setAttribute","classes","Boolean","join","valueToRender","parsedJSON","JSON","parse","err","stringify","onChange","keys","ref","values","map","Button","id","replace","onKeyDown","event","shiftKey","preventDefault","insertText","selectedElement","descendant","selection","anchor","slice","isElement","shouldBreakOutOnEnter","selectedLeaf","isText","String","text","offset","insertNodes","splitNodes","setNodes","unwrapNodes","match","n","includes","mode","split","undefined","isVoid","removeNodes","hotkey","mark","spellCheck","RichText"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../src/field/RichText.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from '@payloadcms/ui/fields/shared'\nimport type { ClientValidate } from 'payload/types'\nimport type { BaseEditor, BaseOperation } from 'slate'\nimport type { HistoryEditor } from 'slate-history'\nimport type { ReactEditor } from 'slate-react'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { FieldDescription } from '@payloadcms/ui/forms/FieldDescription'\nimport { FieldError } from '@payloadcms/ui/forms/FieldError'\nimport { FieldLabel } from '@payloadcms/ui/forms/FieldLabel'\nimport { useFieldProps } from '@payloadcms/ui/forms/FieldPropsProvider'\nimport { useField } from '@payloadcms/ui/forms/useField'\nimport { withCondition } from '@payloadcms/ui/forms/withCondition'\nimport { useEditDepth } from '@payloadcms/ui/providers/EditDepth'\nimport { useTranslation } from '@payloadcms/ui/providers/Translation'\nimport { isHotkey } from 'is-hotkey'\nimport React, { useCallback, useEffect, useMemo, useRef } from 'react'\nimport { Node, Element as SlateElement, Text, Transforms, createEditor } from 'slate'\nimport { withHistory } from 'slate-history'\nimport { Editable, Slate, withReact } from 'slate-react'\n\nimport type { ElementNode, RichTextPlugin, TextNode } from '../types.js'\nimport type { EnabledFeatures } from './types.js'\n\nimport { defaultRichTextValue } from '../data/defaultValue.js'\nimport { richTextValidate } from '../data/validation.js'\nimport { listTypes } from './elements/listTypes.js'\nimport { hotkeys } from './hotkeys.js'\nimport './index.scss'\nimport { toggleLeaf } from './leaves/toggle.js'\nimport { withEnterBreakOut } from './plugins/withEnterBreakOut.js'\nimport { withHTML } from './plugins/withHTML.js'\nimport { ElementButtonProvider } from './providers/ElementButtonProvider.js'\nimport { ElementProvider } from './providers/ElementProvider.js'\nimport { LeafButtonProvider } from './providers/LeafButtonProvider.js'\nimport { LeafProvider } from './providers/LeafProvider.js'\n\nconst baseClass = 'rich-text'\n\ndeclare module 'slate' {\n interface CustomTypes {\n Editor: BaseEditor & ReactEditor & HistoryEditor\n Element: ElementNode\n Text: TextNode\n }\n}\n\nconst RichTextField: React.FC<\n FormFieldBase & {\n elements: EnabledFeatures['elements']\n leaves: EnabledFeatures['leaves']\n name: string\n placeholder?: string\n plugins: RichTextPlugin[]\n richTextComponentMap: Map<string, React.ReactNode>\n width?: string\n }\n> = (props) => {\n const {\n name,\n CustomDescription,\n CustomError,\n CustomLabel,\n className,\n descriptionProps,\n elements,\n errorProps,\n label,\n labelProps,\n leaves,\n path: pathFromProps,\n placeholder,\n plugins,\n readOnly,\n required,\n style,\n validate = richTextValidate,\n width,\n } = props\n\n const { i18n } = useTranslation()\n const editorRef = useRef(null)\n const toolbarRef = useRef(null)\n\n const drawerDepth = useEditDepth()\n const drawerIsOpen = drawerDepth > 1\n\n const memoizedValidate: ClientValidate = useCallback(\n (value, validationOptions) => {\n if (typeof validate === 'function') {\n return validate(value, {\n ...validationOptions,\n req: {\n t: i18n.t,\n },\n required,\n })\n }\n },\n [validate, required, i18n],\n )\n\n const { path: pathFromContext } = useFieldProps()\n\n const { initialValue, path, schemaPath, setValue, showError, value } = useField({\n path: pathFromContext || pathFromProps || name,\n validate: memoizedValidate,\n })\n\n const editor = useMemo(() => {\n let CreatedEditor = withEnterBreakOut(withHistory(withReact(createEditor())))\n\n CreatedEditor = withHTML(CreatedEditor)\n\n if (plugins.length) {\n CreatedEditor = plugins.reduce((editorWithPlugins, plugin) => {\n return plugin(editorWithPlugins)\n }, CreatedEditor)\n }\n\n return CreatedEditor\n }, [plugins])\n\n const renderElement = useCallback(\n ({ attributes, children, element }) => {\n // return <div {...attributes}>{children}</div>\n\n const matchedElement = elements[element.type]\n const Element = matchedElement?.Element\n\n let attr = { ...attributes }\n\n // this converts text alignment to margin when dealing with void elements\n if (element.textAlign) {\n if (element.type === 'relationship' || element.type === 'upload') {\n switch (element.textAlign) {\n case 'left':\n attr = { ...attr, style: { marginRight: 'auto' } }\n break\n case 'right':\n attr = { ...attr, style: { marginLeft: 'auto' } }\n break\n case 'center':\n attr = { ...attr, style: { marginLeft: 'auto', marginRight: 'auto' } }\n break\n default:\n attr = { ...attr, style: { textAlign: element.textAlign } }\n break\n }\n } else if (element.type === 'li') {\n switch (element.textAlign) {\n case 'right':\n attr = { ...attr, style: { listStylePosition: 'inside', textAlign: 'right' } }\n break\n case 'center':\n attr = { ...attr, style: { listStylePosition: 'inside', textAlign: 'center' } }\n break\n case 'left':\n default:\n attr = { ...attr, style: { listStylePosition: 'outside', textAlign: 'left' } }\n break\n }\n } else {\n attr = { ...attr, style: { textAlign: element.textAlign } }\n }\n }\n\n if (Element) {\n const el = (\n <ElementProvider\n attributes={attr}\n childNodes={children}\n editorRef={editorRef}\n element={element}\n fieldProps={props}\n path={path}\n schemaPath={schemaPath}\n >\n {Element}\n </ElementProvider>\n )\n\n return el\n }\n\n return <div {...attr}>{children}</div>\n },\n [elements, path, props, schemaPath],\n )\n\n const renderLeaf = useCallback(\n ({ attributes, children, leaf }) => {\n const matchedLeaves = Object.entries(leaves).filter(([leafName]) => leaf[leafName])\n\n if (matchedLeaves.length > 0) {\n return matchedLeaves.reduce(\n (result, [, leafConfig], i) => {\n if (leafConfig?.Leaf) {\n const Leaf = leafConfig.Leaf\n\n return (\n <LeafProvider\n attributes={attributes}\n editorRef={editorRef}\n fieldProps={props}\n key={i}\n leaf={leaf}\n path={path}\n result={result}\n schemaPath={schemaPath}\n >\n {Leaf}\n </LeafProvider>\n )\n }\n\n return result\n },\n <span {...attributes}>{children}</span>,\n )\n }\n\n return <span {...attributes}>{children}</span>\n },\n [path, props, schemaPath, leaves],\n )\n\n // All slate changes fire the onChange event\n // including selection changes\n // so we will filter the set_selection operations out\n // and only fire setValue when onChange is because of value\n const handleChange = useCallback(\n (val: unknown) => {\n const ops = editor?.operations.filter((o: BaseOperation) => {\n if (o) {\n return o.type !== 'set_selection'\n }\n return false\n })\n\n if (ops && Array.isArray(ops) && ops.length > 0) {\n if (!readOnly && val !== defaultRichTextValue && val !== value) {\n setValue(val)\n }\n }\n },\n [editor?.operations, readOnly, setValue, value],\n )\n\n useEffect(() => {\n function setClickableState(clickState: 'disabled' | 'enabled') {\n const selectors = 'button, a, [role=\"button\"]'\n const toolbarButtons: (HTMLAnchorElement | HTMLButtonElement)[] =\n toolbarRef.current?.querySelectorAll(selectors)\n\n ;(toolbarButtons || []).forEach((child) => {\n const isButton = child.tagName === 'BUTTON'\n const isDisabling = clickState === 'disabled'\n child.setAttribute('tabIndex', isDisabling ? '-1' : '0')\n if (isButton) child.setAttribute('disabled', isDisabling ? 'disabled' : null)\n })\n }\n\n if (readOnly) {\n setClickableState('disabled')\n }\n\n return () => {\n if (readOnly) {\n setClickableState('enabled')\n }\n }\n }, [readOnly])\n\n // useEffect(() => {\n // // If there is a change to the initial value, we need to reset Slate history\n // // and clear selection because the old selection may no longer be valid\n // // as returned JSON may be modified in hooks and have a different shape\n // if (editor.selection) {\n // console.log('deselecting');\n // ReactEditor.deselect(editor);\n // }\n // }, [path, editor]);\n\n const classes = [\n baseClass,\n 'field-type',\n className,\n showError && 'error',\n readOnly && `${baseClass}--read-only`,\n ]\n .filter(Boolean)\n .join(' ')\n\n let valueToRender = value\n\n if (typeof valueToRender === 'string') {\n try {\n const parsedJSON = JSON.parse(valueToRender)\n valueToRender = parsedJSON\n } catch (err) {\n valueToRender = null\n }\n }\n\n if (!valueToRender) valueToRender = defaultRichTextValue\n\n return (\n <div\n className={classes}\n style={{\n ...style,\n width,\n }}\n >\n <FieldLabel\n CustomLabel={CustomLabel}\n label={label}\n required={required}\n {...(labelProps || {})}\n />\n <div className={`${baseClass}__wrap`}>\n <FieldError CustomError={CustomError} path={path} {...(errorProps || {})} />\n <Slate\n editor={editor}\n key={JSON.stringify({ initialValue, path })} // makes sure slate is completely re-rendered when initialValue changes, bypassing the slate-internal value memoization. That way, external changes to the form will update the editor\n onChange={handleChange}\n value={valueToRender as any[]}\n >\n <div className={`${baseClass}__wrapper`}>\n {Object.keys(elements)?.length + Object.keys(leaves)?.length > 0 && (\n <div\n className={[`${baseClass}__toolbar`, drawerIsOpen && `${baseClass}__drawerIsOpen`]\n .filter(Boolean)\n .join(' ')}\n ref={toolbarRef}\n >\n <div className={`${baseClass}__toolbar-wrap`}>\n {Object.values(elements).map((element) => {\n const Button = element?.Button\n\n if (Button) {\n return (\n <ElementButtonProvider\n fieldProps={props}\n key={element.name}\n path={path}\n schemaPath={schemaPath}\n >\n {Button}\n </ElementButtonProvider>\n )\n }\n\n return null\n })}\n {Object.values(leaves).map((leaf) => {\n const Button = leaf?.Button\n\n if (Button) {\n return (\n <LeafButtonProvider\n fieldProps={props}\n key={leaf.name}\n path={path}\n schemaPath={schemaPath}\n >\n {Button}\n </LeafButtonProvider>\n )\n }\n\n return null\n })}\n </div>\n </div>\n )}\n <div className={`${baseClass}__editor`} ref={editorRef}>\n <Editable\n className={`${baseClass}__input`}\n id={`field-${path.replace(/\\./g, '__')}`}\n onKeyDown={(event) => {\n if (event.key === 'Enter') {\n if (event.shiftKey) {\n event.preventDefault()\n editor.insertText('\\n')\n } else {\n const selectedElement = Node.descendant(\n editor,\n editor.selection.anchor.path.slice(0, -1),\n )\n\n if (SlateElement.isElement(selectedElement)) {\n // Allow hard enter to \"break out\" of certain elements\n if (editor.shouldBreakOutOnEnter(selectedElement)) {\n event.preventDefault()\n const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path)\n\n if (\n Text.isText(selectedLeaf) &&\n String(selectedLeaf.text).length === editor.selection.anchor.offset\n ) {\n Transforms.insertNodes(editor, { children: [{ text: '' }] })\n } else {\n Transforms.splitNodes(editor)\n Transforms.setNodes(editor, {})\n }\n }\n }\n }\n }\n\n if (event.key === 'Backspace') {\n const selectedElement = Node.descendant(\n editor,\n editor.selection.anchor.path.slice(0, -1),\n )\n\n if (SlateElement.isElement(selectedElement) && selectedElement.type === 'li') {\n const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path)\n if (Text.isText(selectedLeaf) && String(selectedLeaf.text).length === 0) {\n event.preventDefault()\n Transforms.unwrapNodes(editor, {\n match: (n) => SlateElement.isElement(n) && listTypes.includes(n.type),\n mode: 'lowest',\n split: true,\n })\n\n Transforms.setNodes(editor, { type: undefined })\n }\n } else if (editor.isVoid(selectedElement)) {\n Transforms.removeNodes(editor)\n }\n }\n\n Object.keys(hotkeys).forEach((hotkey) => {\n if (isHotkey(hotkey, event as any)) {\n event.preventDefault()\n const mark = hotkeys[hotkey]\n toggleLeaf(editor, mark)\n }\n })\n }}\n placeholder={getTranslation(placeholder, i18n)}\n readOnly={readOnly}\n renderElement={renderElement}\n renderLeaf={renderLeaf}\n spellCheck\n />\n </div>\n </div>\n </Slate>\n {CustomDescription !== undefined ? (\n CustomDescription\n ) : (\n <FieldDescription {...(descriptionProps || {})} />\n )}\n </div>\n </div>\n )\n}\n\nexport const RichText = withCondition(RichTextField)\n"],"names":["getTranslation","FieldDescription","FieldError","FieldLabel","useFieldProps","useField","withCondition","useEditDepth","useTranslation","isHotkey","React","useCallback","useEffect","useMemo","useRef","Node","Element","SlateElement","Text","Transforms","createEditor","withHistory","Editable","Slate","withReact","defaultRichTextValue","richTextValidate","listTypes","hotkeys","toggleLeaf","withEnterBreakOut","withHTML","ElementButtonProvider","ElementProvider","LeafButtonProvider","LeafProvider","baseClass","RichTextField","props","name","CustomDescription","CustomError","CustomLabel","className","descriptionProps","elements","errorProps","label","labelProps","leaves","path","pathFromProps","placeholder","plugins","readOnly","required","style","validate","width","i18n","editorRef","toolbarRef","drawerDepth","drawerIsOpen","memoizedValidate","value","validationOptions","req","t","pathFromContext","initialValue","schemaPath","setValue","showError","editor","CreatedEditor","length","reduce","editorWithPlugins","plugin","renderElement","attributes","children","element","matchedElement","type","attr","textAlign","marginRight","marginLeft","listStylePosition","el","childNodes","fieldProps","div","renderLeaf","leaf","matchedLeaves","Object","entries","filter","leafName","result","leafConfig","i","Leaf","span","handleChange","val","ops","operations","o","Array","isArray","setClickableState","clickState","selectors","toolbarButtons","current","querySelectorAll","forEach","child","isButton","tagName","isDisabling","setAttribute","classes","Boolean","join","valueToRender","parsedJSON","JSON","parse","err","onChange","keys","ref","values","map","Button","id","replace","onKeyDown","event","key","shiftKey","preventDefault","insertText","selectedElement","descendant","selection","anchor","slice","isElement","shouldBreakOutOnEnter","selectedLeaf","isText","String","text","offset","insertNodes","splitNodes","setNodes","unwrapNodes","match","n","includes","mode","split","undefined","isVoid","removeNodes","hotkey","mark","spellCheck","stringify","RichText"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
3
|
import { Tooltip } from '@payloadcms/ui/elements/Tooltip';
|
|
3
4
|
import React, { useCallback, useState } from 'react';
|
|
4
5
|
import { useSlate } from 'slate-react';
|
|
@@ -20,7 +21,7 @@ export const ElementButton = (props)=>{
|
|
|
20
21
|
type
|
|
21
22
|
]);
|
|
22
23
|
const Tag = el;
|
|
23
|
-
return /*#__PURE__*/
|
|
24
|
+
return /*#__PURE__*/ _jsxs(Tag, {
|
|
24
25
|
...el === 'button' && {
|
|
25
26
|
type: 'button'
|
|
26
27
|
},
|
|
@@ -31,10 +32,15 @@ export const ElementButton = (props)=>{
|
|
|
31
32
|
].filter(Boolean).join(' '),
|
|
32
33
|
onClick: onClick || defaultOnClick,
|
|
33
34
|
onMouseEnter: ()=>setShowTooltip(true),
|
|
34
|
-
onMouseLeave: ()=>setShowTooltip(false)
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
35
|
+
onMouseLeave: ()=>setShowTooltip(false),
|
|
36
|
+
children: [
|
|
37
|
+
tooltip && /*#__PURE__*/ _jsx(Tooltip, {
|
|
38
|
+
show: showTooltip,
|
|
39
|
+
children: tooltip
|
|
40
|
+
}),
|
|
41
|
+
children
|
|
42
|
+
]
|
|
43
|
+
});
|
|
38
44
|
};
|
|
39
45
|
|
|
40
46
|
//# sourceMappingURL=Button.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/field/elements/Button.tsx"],"sourcesContent":["'use client'\nimport type { ElementType } from 'react'\n\nimport { Tooltip } from '@payloadcms/ui/elements/Tooltip'\nimport React, { useCallback, useState } from 'react'\nimport { useSlate } from 'slate-react'\n\nimport type { ButtonProps } from './types.js'\n\nimport '../buttons.scss'\nimport { isElementActive } from './isActive.js'\nimport { toggleElement } from './toggle.js'\n\nexport const baseClass = 'rich-text__button'\n\nexport const ElementButton: React.FC<ButtonProps> = (props) => {\n const { type = 'type', children, className, el = 'button', format, onClick, tooltip } = props\n\n const editor = useSlate()\n const [showTooltip, setShowTooltip] = useState(false)\n\n const defaultOnClick = useCallback(\n (event) => {\n event.preventDefault()\n setShowTooltip(false)\n toggleElement(editor, format, type)\n },\n [editor, format, type],\n )\n\n const Tag: ElementType = el\n\n return (\n <Tag\n {...(el === 'button' && { type: 'button' })}\n className={[\n baseClass,\n className,\n isElementActive(editor, format, type) && `${baseClass}__button--active`,\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={onClick || defaultOnClick}\n onMouseEnter={() => setShowTooltip(true)}\n onMouseLeave={() => setShowTooltip(false)}\n >\n {tooltip && <Tooltip show={showTooltip}>{tooltip}</Tooltip>}\n {children}\n </Tag>\n )\n}\n"],"names":["Tooltip","React","useCallback","useState","useSlate","isElementActive","toggleElement","baseClass","ElementButton","props","type","children","className","el","format","onClick","tooltip","editor","showTooltip","setShowTooltip","defaultOnClick","event","preventDefault","Tag","filter","Boolean","join","onMouseEnter","onMouseLeave","show"],"rangeMappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/field/elements/Button.tsx"],"sourcesContent":["'use client'\nimport type { ElementType } from 'react'\n\nimport { Tooltip } from '@payloadcms/ui/elements/Tooltip'\nimport React, { useCallback, useState } from 'react'\nimport { useSlate } from 'slate-react'\n\nimport type { ButtonProps } from './types.js'\n\nimport '../buttons.scss'\nimport { isElementActive } from './isActive.js'\nimport { toggleElement } from './toggle.js'\n\nexport const baseClass = 'rich-text__button'\n\nexport const ElementButton: React.FC<ButtonProps> = (props) => {\n const { type = 'type', children, className, el = 'button', format, onClick, tooltip } = props\n\n const editor = useSlate()\n const [showTooltip, setShowTooltip] = useState(false)\n\n const defaultOnClick = useCallback(\n (event) => {\n event.preventDefault()\n setShowTooltip(false)\n toggleElement(editor, format, type)\n },\n [editor, format, type],\n )\n\n const Tag: ElementType = el\n\n return (\n <Tag\n {...(el === 'button' && { type: 'button' })}\n className={[\n baseClass,\n className,\n isElementActive(editor, format, type) && `${baseClass}__button--active`,\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={onClick || defaultOnClick}\n onMouseEnter={() => setShowTooltip(true)}\n onMouseLeave={() => setShowTooltip(false)}\n >\n {tooltip && <Tooltip show={showTooltip}>{tooltip}</Tooltip>}\n {children}\n </Tag>\n )\n}\n"],"names":["Tooltip","React","useCallback","useState","useSlate","isElementActive","toggleElement","baseClass","ElementButton","props","type","children","className","el","format","onClick","tooltip","editor","showTooltip","setShowTooltip","defaultOnClick","event","preventDefault","Tag","filter","Boolean","join","onMouseEnter","onMouseLeave","show"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,SAASA,OAAO,QAAQ,kCAAiC;AACzD,OAAOC,SAASC,WAAW,EAAEC,QAAQ,QAAQ,QAAO;AACpD,SAASC,QAAQ,QAAQ,cAAa;AAItC,OAAO,kBAAiB;AACxB,SAASC,eAAe,QAAQ,gBAAe;AAC/C,SAASC,aAAa,QAAQ,cAAa;AAE3C,OAAO,MAAMC,YAAY,oBAAmB;AAE5C,OAAO,MAAMC,gBAAuC,CAACC;IACnD,MAAM,EAAEC,OAAO,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,KAAK,QAAQ,EAAEC,MAAM,EAAEC,OAAO,EAAEC,OAAO,EAAE,GAAGP;IAExF,MAAMQ,SAASb;IACf,MAAM,CAACc,aAAaC,eAAe,GAAGhB,SAAS;IAE/C,MAAMiB,iBAAiBlB,YACrB,CAACmB;QACCA,MAAMC,cAAc;QACpBH,eAAe;QACfb,cAAcW,QAAQH,QAAQJ;IAChC,GACA;QAACO;QAAQH;QAAQJ;KAAK;IAGxB,MAAMa,MAAmBV;IAEzB,qBACE,MAACU;QACE,GAAIV,OAAO,YAAY;YAAEH,MAAM;QAAS,CAAC;QAC1CE,WAAW;YACTL;YACAK;YACAP,gBAAgBY,QAAQH,QAAQJ,SAAS,CAAC,EAAEH,UAAU,gBAAgB,CAAC;SACxE,CACEiB,MAAM,CAACC,SACPC,IAAI,CAAC;QACRX,SAASA,WAAWK;QACpBO,cAAc,IAAMR,eAAe;QACnCS,cAAc,IAAMT,eAAe;;YAElCH,yBAAW,KAAChB;gBAAQ6B,MAAMX;0BAAcF;;YACxCL;;;AAGP,EAAC"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
'use client';
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
3
|
import React, { useCallback } from 'react';
|
|
3
4
|
import { useSlate } from 'slate-react';
|
|
4
5
|
import '../buttons.scss';
|
|
@@ -14,15 +15,16 @@ export const ListButton = ({ children, className, format, onClick })=>{
|
|
|
14
15
|
editor,
|
|
15
16
|
format
|
|
16
17
|
]);
|
|
17
|
-
return /*#__PURE__*/
|
|
18
|
+
return /*#__PURE__*/ _jsx("button", {
|
|
18
19
|
className: [
|
|
19
20
|
baseClass,
|
|
20
21
|
className,
|
|
21
22
|
isListActive(editor, format) && `${baseClass}__button--active`
|
|
22
23
|
].filter(Boolean).join(' '),
|
|
23
24
|
onClick: onClick || defaultOnClick,
|
|
24
|
-
type: "button"
|
|
25
|
-
|
|
25
|
+
type: "button",
|
|
26
|
+
children: children
|
|
27
|
+
});
|
|
26
28
|
};
|
|
27
29
|
|
|
28
30
|
//# sourceMappingURL=ListButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/field/elements/ListButton.tsx"],"sourcesContent":["'use client'\n\nimport React, { useCallback } from 'react'\nimport { useSlate } from 'slate-react'\n\nimport type { ButtonProps } from './types.js'\n\nimport '../buttons.scss'\nimport { isListActive } from './isListActive.js'\nimport { toggleList } from './toggleList.js'\n\nexport const baseClass = 'rich-text__button'\n\nexport const ListButton: React.FC<ButtonProps> = ({ children, className, format, onClick }) => {\n const editor = useSlate()\n\n const defaultOnClick = useCallback(\n (event) => {\n event.preventDefault()\n toggleList(editor, format)\n },\n [editor, format],\n )\n\n return (\n <button\n className={[\n baseClass,\n className,\n isListActive(editor, format) && `${baseClass}__button--active`,\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={onClick || defaultOnClick}\n type=\"button\"\n >\n {children}\n </button>\n )\n}\n"],"names":["React","useCallback","useSlate","isListActive","toggleList","baseClass","ListButton","children","className","format","onClick","editor","defaultOnClick","event","preventDefault","button","filter","Boolean","join","type"],"rangeMappings":"
|
|
1
|
+
{"version":3,"sources":["../../../src/field/elements/ListButton.tsx"],"sourcesContent":["'use client'\n\nimport React, { useCallback } from 'react'\nimport { useSlate } from 'slate-react'\n\nimport type { ButtonProps } from './types.js'\n\nimport '../buttons.scss'\nimport { isListActive } from './isListActive.js'\nimport { toggleList } from './toggleList.js'\n\nexport const baseClass = 'rich-text__button'\n\nexport const ListButton: React.FC<ButtonProps> = ({ children, className, format, onClick }) => {\n const editor = useSlate()\n\n const defaultOnClick = useCallback(\n (event) => {\n event.preventDefault()\n toggleList(editor, format)\n },\n [editor, format],\n )\n\n return (\n <button\n className={[\n baseClass,\n className,\n isListActive(editor, format) && `${baseClass}__button--active`,\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={onClick || defaultOnClick}\n type=\"button\"\n >\n {children}\n </button>\n )\n}\n"],"names":["React","useCallback","useSlate","isListActive","toggleList","baseClass","ListButton","children","className","format","onClick","editor","defaultOnClick","event","preventDefault","button","filter","Boolean","join","type"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAEA,OAAOA,SAASC,WAAW,QAAQ,QAAO;AAC1C,SAASC,QAAQ,QAAQ,cAAa;AAItC,OAAO,kBAAiB;AACxB,SAASC,YAAY,QAAQ,oBAAmB;AAChD,SAASC,UAAU,QAAQ,kBAAiB;AAE5C,OAAO,MAAMC,YAAY,oBAAmB;AAE5C,OAAO,MAAMC,aAAoC,CAAC,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,MAAM,EAAEC,OAAO,EAAE;IACxF,MAAMC,SAAST;IAEf,MAAMU,iBAAiBX,YACrB,CAACY;QACCA,MAAMC,cAAc;QACpBV,WAAWO,QAAQF;IACrB,GACA;QAACE;QAAQF;KAAO;IAGlB,qBACE,KAACM;QACCP,WAAW;YACTH;YACAG;YACAL,aAAaQ,QAAQF,WAAW,CAAC,EAAEJ,UAAU,gBAAgB,CAAC;SAC/D,CACEW,MAAM,CAACC,SACPC,IAAI,CAAC;QACRR,SAASA,WAAWE;QACpBO,MAAK;kBAEJZ;;AAGP,EAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Blockquote.d.ts","sourceRoot":"","sources":["../../../../src/field/elements/blockquote/Blockquote.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Blockquote.d.ts","sourceRoot":"","sources":["../../../../src/field/elements/blockquote/Blockquote.tsx"],"names":[],"mappings":"AAKA,OAAO,cAAc,CAAA;AAErB,eAAO,MAAM,UAAU,+CAQtB,CAAA"}
|
|
@@ -1,13 +1,15 @@
|
|
|
1
1
|
'use client';
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
3
|
import React from 'react';
|
|
3
4
|
import { useElement } from '../../providers/ElementProvider.js';
|
|
4
5
|
import './index.scss';
|
|
5
6
|
export const Blockquote = ()=>{
|
|
6
7
|
const { attributes, children } = useElement();
|
|
7
|
-
return /*#__PURE__*/
|
|
8
|
+
return /*#__PURE__*/ _jsx("blockquote", {
|
|
8
9
|
className: "rich-text-blockquote",
|
|
9
|
-
...attributes
|
|
10
|
-
|
|
10
|
+
...attributes,
|
|
11
|
+
children: children
|
|
12
|
+
});
|
|
11
13
|
};
|
|
12
14
|
|
|
13
15
|
//# sourceMappingURL=Blockquote.js.map
|