@contember/react-slate-editor-base 2.0.0-alpha.9 → 2.0.0-beta.2

package/dist/types/types/plugins.d.ts

@@ -1,8 +1,7 @@
 import { Editor, Element, Path } from 'slate';
 import { FunctionComponent, ReactNode } from 'react';
 import { RenderElementProps, RenderLeafProps } from 'slate-react';
-import { Environment } from '@contember/react-binding';
-import { EntityAccessor } from '@contember/binding';
+import { EntityAccessor, Environment } from '@contember/react-binding';
 export type EditorPluginWrapperProps = {
     children?: ReactNode;
     editor: Editor;

package/dist/types/types/plugins.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"plugins.d.ts","sourceRoot":"","sources":["../../../src/types/plugins.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAA;AAC7C,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACpD,OAAO,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AACjE,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAA;AAEnD,MAAM,MAAM,wBAAwB,GAAG;IAAE,QAAQ,CAAC,EAAE,SAAS,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAAA;AAC/E,MAAM,MAAM,YAAY,GAAG,CAAC,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC,GAAG;IACvD,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,SAAS,CAAC;QAAC,WAAW,EAAE,WAAW,CAAC;QAAC,MAAM,EAAE,cAAc,CAAA;KAAE,KAAK,IAAI,CAAA;IACxH,YAAY,CAAC,EAAE,iBAAiB,CAAC,wBAAwB,CAAC,CAAA;IAC1D,YAAY,CAAC,EAAE,iBAAiB,CAAC,wBAAwB,CAAC,CAAA;IAC1D,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,QAAQ,CAAC,EAAE,SAAS,CAAA;KAAE,EAAE,WAAW,EAAE,WAAW,KAAK,SAAS,CAAA;CACvF,CAAA;AAGD,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,OAAO,IAAI,iBAAiB,CAAC,kBAAkB,GAAG;IAAE,OAAO,EAAE,CAAC,CAAA;CAAE,CAAC,CAAA;AAEvG,MAAM,WAAW,mBAAmB,CAAC,CAAC,SAAS,OAAO;IACrD,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC,CAAA;IACf,MAAM,EAAE,eAAe,CAAC,CAAC,CAAC,CAAA;IAC1B,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,OAAO,EAAE,CAAC,CAAC;QAAC,IAAI,EAAE,IAAI,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,cAAc,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,IAAI,CAAA;IACtG,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAA;KAAE,KAAK,OAAO,CAAA;IACvE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,CAAC,EAAE,OAAO,GAAG,CAAC,CAAC,IAAI,EAAE;QAAE,OAAO,EAAE,CAAC,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,OAAO,CAAC,CAAA;IACtE,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAA;KAAE,KAAK,IAAI,CAAA;IACzE,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,CAAA;KAAE,KAAK,OAAO,CAAA;CAC/E;AAGD,MAAM,WAAW,gBAAgB;IAChC,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,EAAE,CAAC,CAAC,EAAE,aAAa,KAAK,OAAO,CAAA;IACvC,MAAM,EAAE,iBAAiB,CAAC,eAAe,CAAC,CAAA;CAC1C"}
+{"version":3,"file":"plugins.d.ts","sourceRoot":"","sources":["../../../src/types/plugins.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAA;AAC7C,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACpD,OAAO,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,aAAa,CAAA;AACjE,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAEtE,MAAM,MAAM,wBAAwB,GAAG;IAAE,QAAQ,CAAC,EAAE,SAAS,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAAA;AAC/E,MAAM,MAAM,YAAY,GAAG,CAAC,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC,GAAG;IACvD,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,SAAS,CAAC;QAAC,WAAW,EAAE,WAAW,CAAC;QAAC,MAAM,EAAE,cAAc,CAAA;KAAE,KAAK,IAAI,CAAA;IACxH,YAAY,CAAC,EAAE,iBAAiB,CAAC,wBAAwB,CAAC,CAAA;IAC1D,YAAY,CAAC,EAAE,iBAAiB,CAAC,wBAAwB,CAAC,CAAA;IAC1D,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,QAAQ,CAAC,EAAE,SAAS,CAAA;KAAE,EAAE,WAAW,EAAE,WAAW,KAAK,SAAS,CAAA;CACvF,CAAA;AAGD,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,OAAO,IAAI,iBAAiB,CAAC,kBAAkB,GAAG;IAAE,OAAO,EAAE,CAAC,CAAA;CAAE,CAAC,CAAA;AAEvG,MAAM,WAAW,mBAAmB,CAAC,CAAC,SAAS,OAAO;IACrD,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC,CAAA;IACf,MAAM,EAAE,eAAe,CAAC,CAAC,CAAC,CAAA;IAC1B,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,OAAO,EAAE,CAAC,CAAC;QAAC,IAAI,EAAE,IAAI,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,cAAc,EAAE,MAAM,IAAI,CAAA;KAAE,KAAK,IAAI,CAAA;IACtG,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAA;KAAE,KAAK,OAAO,CAAA;IACvE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,CAAC,EAAE,OAAO,GAAG,CAAC,CAAC,IAAI,EAAE;QAAE,OAAO,EAAE,CAAC,CAAC;QAAC,MAAM,EAAE,MAAM,CAAA;KAAE,KAAK,OAAO,CAAC,CAAA;IACtE,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,CAAA;KAAE,KAAK,IAAI,CAAA;IACzE,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,CAAA;KAAE,KAAK,OAAO,CAAA;CAC/E;AAGD,MAAM,WAAW,gBAAgB;IAChC,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,EAAE,CAAC,CAAC,EAAE,aAAa,KAAK,OAAO,CAAA;IACvC,MAAM,EAAE,iBAAiB,CAAC,eAAe,CAAC,CAAA;CAC1C"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@contember/react-slate-editor-base",
   "license": "Apache-2.0",
-  "version": "2.0.0-alpha.9",
+  "version": "2.0.0-beta.2",
   "type": "module",
   "sideEffects": false,
   "main": "./dist/production/index.js",
@@ -11,6 +11,7 @@
         "types": "./dist/types/index.d.ts",
         "development": "./dist/development/index.js",
         "production": "./dist/production/index.js",
+        "typescript": "./src/index.ts",
         "default": "./dist/production/index.js"
       },
       "require": {
@@ -33,22 +34,22 @@
     "directory": "packages/react-slate-editor-base"
   },
   "dependencies": {
-    "@contember/binding": "2.0.0-alpha.9",
-    "@contember/react-binding": "2.0.0-alpha.9",
-    "@contember/utilities": "2.0.0-alpha.9",
-    "@radix-ui/primitive": "^1.0.1",
-    "@radix-ui/react-slot": "^1.0.2",
+    "@contember/react-binding": "2.0.0-beta.2",
+    "@contember/utilities": "2.0.0-beta.2",
+    "@radix-ui/primitive": "^1.1.0",
+    "@radix-ui/react-slot": "^1.1.0",
     "is-hotkey": "^0.2.0",
     "slate": "^0.103.0",
-    "slate-history": "^0.100.0",
-    "slate-react": "^0.102.0"
+    "slate-history": "^0.109.0",
+    "slate-react": "^0.110.1"
   },
   "peerDependencies": {
     "react": "^18 || ^19",
     "react-dom": "^18 || ^19"
   },
   "devDependencies": {
+    "@types/is-hotkey": "^0.1.10",
     "react": "^18.3.1",
     "react-dom": "^18.3.1"
   }
-}
+}

package/src/components/RichTextEditor.tsx

@@ -28,7 +28,7 @@ export const RichTextEditor: FunctionComponent<RichTextEditorProps> = Component(
 			() => QueryLanguage.desugarRelativeSingleField(props, environment),
 			[environment, props],
 		)
-		const fieldAccessor = useMemo(() => entity.getRelativeSingleField<string>(desugaredField), [entity, desugaredField])
+		const fieldAccessor = useMemo(() => entity.getField<string>(desugaredField), [entity, desugaredField])
 
 		// The cache is questionable, really.
 		const [contemberFieldElementCache] = useState(() => new WeakMap<FieldAccessor<string>, SlateElement[]>())
@@ -91,7 +91,7 @@ export const RichTextEditor: FunctionComponent<RichTextEditorProps> = Component(
 		const onChange = useCallback(
 			(value: Descendant[]) => {
 				getParent().batchUpdates(getAccessor => {
-					const fieldAccessor = getAccessor().getRelativeSingleField(desugaredField)
+					const fieldAccessor = getAccessor().getField(desugaredField)
 
 					if (SlateNode.string({ type: 'dummy', children: value }) === '' && fieldAccessor.valueOnServer === null) {
 						fieldAccessor.updateValue(null)
@@ -100,7 +100,7 @@ export const RichTextEditor: FunctionComponent<RichTextEditorProps> = Component(
 
 					if (SlateElement.isElement(value[0])) {
 						fieldAccessor.updateValue(serialize(value[0].children))
-						contemberFieldElementCache.set(getAccessor().getRelativeSingleField(desugaredField), value as SlateElement[])
+						contemberFieldElementCache.set(getAccessor().getField(desugaredField), value as SlateElement[])
 					}
 				})
 			},

package/src/editor/createEditor.ts

@@ -2,7 +2,7 @@ import { createEditorWithEssentials } from './createEditorWithEssentials'
 import { Editor } from 'slate'
 import { EditorPlugin, EditorPluginWrapperProps } from '../types'
 import { createElement, FunctionComponent, ReactNode } from 'react'
-import { EntityAccessor } from '@contember/binding'
+import { EntityAccessor } from '@contember/react-binding'
 import { Environment } from '@contember/react-binding'
 
 

package/src/plugins/element/tables/TableHtmlDeserializer.ts

@@ -0,0 +1,37 @@
+import { HtmlDeserializerPlugin } from '../../../types'
+import { tableCellElementType } from './TableCellElement'
+import { tableElementType } from './TableElement'
+import { tableRowElementType } from './TableRowElement'
+
+export const tableHTMLDeserializer: HtmlDeserializerPlugin = {
+	processBlockPaste: ({ element, next, cumulativeTextAttrs }) => {
+		if (element.tagName === 'TABLE') {
+			return [
+				{
+					type: tableElementType,
+					children: next(element.childNodes, cumulativeTextAttrs),
+				},
+			]
+		}
+
+		if (element.tagName === 'TR') {
+			return [
+				{
+					type: tableRowElementType,
+					children: next(element.childNodes, cumulativeTextAttrs),
+				},
+			]
+		}
+
+		if (element.tagName === 'TD' || element.tagName === 'TH') {
+			return [
+				{
+					type: tableCellElementType,
+					children: next(element.childNodes, cumulativeTextAttrs),
+				},
+			]
+		}
+
+		return null
+	},
+}

package/src/plugins/element/tables/withTables.ts

@@ -3,6 +3,7 @@ import { ContemberEditor } from '../../../editor'
 import { isTableCellElement, TableCellElement, tableCellElementPlugin } from './TableCellElement'
 import { getTableElementColumnCount, getTableElementRowCount, isTableElement, TableElement, tableElementPlugin } from './TableElement'
 import { getTableCellCoordinates, selectTableCellContents } from './TableElementSelection'
+import { tableHTMLDeserializer } from './TableHtmlDeserializer'
 import { TableModifications } from './TableModifications'
 import { isTableRowElement, TableRowElement, tableRowElementPlugin } from './TableRowElement'
 import { ElementRenderer } from '../../../types'
@@ -24,6 +25,8 @@ export const withTables = ({ renderTable, renderTableCell, renderTableRow }: {
 	editor.registerElement(tableCellElementPlugin({ render: renderTableCell }))
 	editor.registerElement(tableRowElementPlugin({ render: renderTableRow }))
 
+	editor.htmlDeserializer.registerPlugin(tableHTMLDeserializer)
+
 	Object.assign<Editor, Partial<Editor>>(editor, {
 		insertBreak: () => {
 			const closestBlockEntry = ContemberEditor.closestBlockEntry(editor)

package/src/tsconfig.json

@@ -4,7 +4,6 @@
 		"outDir": "../dist/types"
 	},
 	"references": [
-		{ "path": "../../binding/src" },
 		{ "path": "../../react-binding/src" },
 		{ "path": "../../utilities/src" },
 	]

package/src/types/plugins.ts

@@ -1,8 +1,7 @@
 import { Editor, Element, Path } from 'slate'
 import { FunctionComponent, ReactNode } from 'react'
 import { RenderElementProps, RenderLeafProps } from 'slate-react'
-import { Environment } from '@contember/react-binding'
-import { EntityAccessor } from '@contember/binding'
+import { EntityAccessor, Environment } from '@contember/react-binding'
 
 export type EditorPluginWrapperProps = { children?: ReactNode; editor: Editor }
 export type EditorPlugin = ((editor: Editor) => void) | {