@quadrats/react 0.5.1 → 0.5.5

package/blockquote/typings.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { BlockquoteElement, Blockquote } from '@quadrats/common/blockquote';
-import { WithCreateHandlers, WithCreateRenderElement, RenderElementProps } from '@quadrats/react';
+import { WithCreateHandlers, WithCreateRenderElement, RenderElementProps, ReactEditor } from '@quadrats/react';
 export declare type RenderBlockquoteElementProps = RenderElementProps<BlockquoteElement>;
 export interface ReactBlockquoteCreateHandlersOptions {
     /**
@@ -11,5 +11,5 @@ export interface ReactBlockquoteCreateHandlersOptions {
 export interface ReactBlockquoteCreateRenderElementOptions {
     render?: (props: RenderBlockquoteElementProps) => JSX.Element | null | undefined;
 }
-export interface ReactBlockquote extends Blockquote, WithCreateHandlers<[ReactBlockquoteCreateHandlersOptions?]>, WithCreateRenderElement<[ReactBlockquoteCreateRenderElementOptions?]> {
+export interface ReactBlockquote extends Blockquote<ReactEditor>, WithCreateHandlers<[ReactBlockquoteCreateHandlersOptions?]>, WithCreateRenderElement<[ReactBlockquoteCreateRenderElementOptions?]> {
 }

package/core/components/Quadrats.d.ts

@@ -1,7 +1,11 @@
 /// <reference types="react" />
 import { Slate } from 'slate-react';
 import { ConfigsProviderProps } from '@quadrats/react/configs';
-export declare type QuadratsProps = Pick<Parameters<typeof Slate>[0], 'children' | 'editor' | 'onChange' | 'value'> & Omit<ConfigsProviderProps, 'children'>;
+import { Descendant } from '..';
+export declare type QuadratsProps = Pick<Parameters<typeof Slate>[0], 'children' | 'editor'> & Omit<ConfigsProviderProps, 'children'> & {
+    onChange: (value: Descendant[]) => void;
+    value: Descendant[];
+};
 /**
  * Provide configs of quadrats and control the value.
  */

package/core/composeHandlers.js

@@ -1,6 +1,6 @@
 function createEventHandler(editor, handlers) {
     const [handler, ...restHandlers] = handlers;
-    return (event) => handler(event, editor, () => {
+    return event => handler(event, editor, () => {
         const next = restHandlers.length > 0 ? createEventHandler(editor, restHandlers) : () => { };
         next(event);
     });
@@ -24,7 +24,7 @@ function composeHandlers(handlersList) {
         return acc;
     }, {});
     const handlersEntries = Object.entries(handlersListRecord);
-    return (editor) => handlersEntries.reduce((acc, [name, handlers]) => {
+    return editor => handlersEntries.reduce((acc, [name, handlers]) => {
         acc[name] = createEventHandler(editor, handlers);
         return acc;
     }, {});

package/core/composeRenderElements.js

@@ -6,7 +6,7 @@ import DefaultElement from './components/DefaultElement.js';
  * To compose sequential `renderElement`s to single.
  */
 function composeRenderElements(renderElements) {
-    return composeRenderElementsBase((props) => React.createElement(DefaultElement, Object.assign({}, props)), renderElements);
+    return composeRenderElementsBase(props => React.createElement(DefaultElement, Object.assign({}, props)), renderElements);
 }
 
 export { composeRenderElements };

package/core/composeRenderLeafs.js

@@ -6,7 +6,7 @@ import DefaultLeaf from './components/DefaultLeaf.js';
  * To compose sequential `renderLeaf`s or `renderMark`s to single.
  */
 function composeRenderLeafs(renderLeafs) {
-    return composeRenderLeafsBase((props) => React.createElement(DefaultLeaf, Object.assign({}, props)), renderLeafs);
+    return composeRenderLeafsBase(props => React.createElement(DefaultLeaf, Object.assign({}, props)), renderLeafs);
 }
 
 export { composeRenderLeafs };

package/core/index.d.ts

@@ -1,9 +1,10 @@
-import { BaseEditor, QuadratsElement, QuadratsText } from '@quadrats/core';
+import { QuadratsElement, QuadratsText } from '@quadrats/core';
 import { ReactEditor } from 'slate-react';
 export { useSlateStatic, useFocused, useReadOnly, useSelected, useSlate as useQuadrats, ReactEditor, } from 'slate-react';
 export * from './typings/handler';
 export * from './typings/renderer';
 export * from './typings/with';
+export * from './typings/descendant';
 export { default as Editable, EditableProps } from './components/Editable';
 export { default as DefaultElement } from './components/DefaultElement';
 export { default as DefaultLeaf } from './components/DefaultLeaf';
@@ -17,7 +18,7 @@ export { createRenderElements } from './createRenderElements';
 export { createRenderMark } from './createRenderMark';
 declare module 'slate' {
     interface CustomTypes {
-        Editor: BaseEditor & ReactEditor;
+        Editor: ReactEditor;
         Element: QuadratsElement;
         Text: QuadratsText;
     }

package/core/typings/descendant.d.ts

@@ -0,0 +1,2 @@
+import { QuadratsElement, QuadratsText } from '@quadrats/core';
+export declare type Descendant = QuadratsElement | QuadratsText;

package/divider/typings.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
 import { Divider, DividerElement } from '@quadrats/common/divider';
-import { WithCreateRenderElement, RenderElementProps } from '@quadrats/react';
+import { WithCreateRenderElement, RenderElementProps, ReactEditor } from '@quadrats/react';
 export declare type RenderDividerElementProps = RenderElementProps<DividerElement>;
 export interface ReactDividerCreateRenderElementOptions {
     render?: (props: RenderDividerElementProps) => JSX.Element | null | undefined;
 }
-export interface ReactDivider extends Divider, WithCreateRenderElement<[ReactDividerCreateRenderElementOptions?]> {
+export interface ReactDivider extends Divider<ReactEditor>, WithCreateRenderElement<[ReactDividerCreateRenderElementOptions?]> {
 }

package/embed/toolbar/EmbedToolbarIcon.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { Editor } from '@quadrats/core';
+import { ReactEditor } from '@quadrats/react';
 import { InputWidgetConfig } from '@quadrats/common/input-widget';
 import { ReactEmbed } from '@quadrats/react/embed';
 import { ToolbarIconProps } from '@quadrats/react/toolbar';
@@ -9,7 +9,7 @@ export interface EmbedToolbarIconProps<Provider extends string> extends Omit<Too
      * The providers supported by this icon.
      */
     providers: Provider[];
-    startToolInput?: (editor: Editor, inputConfig: InputWidgetConfig) => void;
+    startToolInput?: (editor: ReactEditor, inputConfig: InputWidgetConfig) => void;
 }
 declare function EmbedToolbarIcon<Provider extends string>(props: EmbedToolbarIconProps<Provider>): JSX.Element;
 export default EmbedToolbarIcon;

package/embed/toolbar/index.cjs.js

@@ -15,12 +15,12 @@ function useEmbedTool(controller, providers, getPlaceholder, startToolInput) {
     const editor = react.useSlateStatic();
     const defaultStartToolInput = toolbar.useStartToolInput();
     const start = startToolInput
-        ? (inputConfig) => startToolInput(editor, inputConfig)
+        ? inputConfig => startToolInput(editor, inputConfig)
         : defaultStartToolInput;
     return {
         onClick: () => start({
             getPlaceholder,
-            confirm: (embedCode) => controller.insertEmbed(editor, providers, embedCode),
+            confirm: embedCode => controller.insertEmbed(editor, providers, embedCode),
         }),
     };
 }

package/embed/toolbar/useEmbedTool.d.ts

@@ -1,6 +1,6 @@
-import { Editor } from '@quadrats/core';
 import { InputWidgetConfig } from '@quadrats/common/input-widget';
+import { ReactEditor } from '@quadrats/react';
 import { ReactEmbed } from '@quadrats/react/embed';
-export declare function useEmbedTool<P extends string>(controller: ReactEmbed<P>, providers: P[], getPlaceholder: InputWidgetConfig['getPlaceholder'], startToolInput?: (editor: Editor, inputConfig: InputWidgetConfig) => void): {
+export declare function useEmbedTool<P extends string>(controller: ReactEmbed<P>, providers: P[], getPlaceholder: InputWidgetConfig['getPlaceholder'], startToolInput?: (editor: ReactEditor, inputConfig: InputWidgetConfig) => void): {
     onClick: () => void;
 };

package/embed/toolbar/useEmbedTool.js

@@ -5,12 +5,12 @@ function useEmbedTool(controller, providers, getPlaceholder, startToolInput) {
     const editor = useSlateStatic();
     const defaultStartToolInput = useStartToolInput();
     const start = startToolInput
-        ? (inputConfig) => startToolInput(editor, inputConfig)
+        ? inputConfig => startToolInput(editor, inputConfig)
         : defaultStartToolInput;
     return {
         onClick: () => start({
             getPlaceholder,
-            confirm: (embedCode) => controller.insertEmbed(editor, providers, embedCode),
+            confirm: embedCode => controller.insertEmbed(editor, providers, embedCode),
         }),
     };
 }

package/embed/typings.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { Embed, EmbedElement } from '@quadrats/common/embed';
-import { WithCreateRenderElement, RenderElementProps } from '@quadrats/react';
+import { WithCreateRenderElement, RenderElementProps, ReactEditor } from '@quadrats/react';
 export interface WithEmbedRenderData<RenderData> {
     /**
      * The data deserialized from element by corresponding strategy.
@@ -10,5 +10,5 @@ export interface WithEmbedRenderData<RenderData> {
 export interface RenderEmbedElementProps<EmbedData extends Record<string, unknown>, RenderData> extends RenderElementProps<EmbedElement & EmbedData>, WithEmbedRenderData<RenderData> {
 }
 export declare type ReactEmbedCreateRenderElementOptions<Provider extends string> = Record<Provider, (props: RenderEmbedElementProps<any, any>) => JSX.Element | null | undefined>;
-export interface ReactEmbed<Provider extends string> extends Embed<Provider>, WithCreateRenderElement<[ReactEmbedCreateRenderElementOptions<Provider>]> {
+export interface ReactEmbed<Provider extends string> extends Embed<Provider, ReactEditor>, WithCreateRenderElement<[ReactEmbedCreateRenderElementOptions<Provider>]> {
 }

package/file-uploader/typings.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
 import { FileUploader, FileUploaderElement } from '@quadrats/common/file-uploader';
-import { RenderElementProps, WithCreateRenderElement } from '@quadrats/react';
+import { ReactEditor, RenderElementProps, WithCreateRenderElement } from '@quadrats/react';
 export declare type RenderFileUploaderElementProps = RenderElementProps<FileUploaderElement>;
 export declare type RenderFileUploaderElement = (props: RenderFileUploaderElementProps) => JSX.Element | null | undefined;
 export interface FileUploaderCreateRenderElementOptions {
     render?: RenderFileUploaderElement;
 }
-export declare type ReactFileUploader = FileUploader & WithCreateRenderElement<[FileUploaderCreateRenderElementOptions?]>;
+export declare type ReactFileUploader = FileUploader<ReactEditor> & WithCreateRenderElement<[FileUploaderCreateRenderElementOptions?]>;

package/footnote/index.cjs.js

@@ -34,13 +34,13 @@ function createReactFootnote(options = {}) {
 function useFootnotes(editor) {
     const footnoteNodes = Array.from(core.getNodes(editor, {
         at: [],
-        match: (node) => node.type === footnote.FOOTNOTE_TYPE,
+        match: node => node.type === footnote.FOOTNOTE_TYPE,
     }));
     const footnotes = footnoteNodes.map((node) => {
         var _a, _b;
         const nodeData = node === null || node === void 0 ? void 0 : node[0];
         return {
-            wrapperText: (_b = (_a = (nodeData === null || nodeData === void 0 ? void 0 : nodeData.children)) === null || _a === void 0 ? void 0 : _a.map((childNode) => childNode.text).join('')) !== null && _b !== void 0 ? _b : '',
+            wrapperText: (_b = (_a = (nodeData === null || nodeData === void 0 ? void 0 : nodeData.children)) === null || _a === void 0 ? void 0 : _a.map(childNode => childNode.text).join('')) !== null && _b !== void 0 ? _b : '',
             footnote: nodeData === null || nodeData === void 0 ? void 0 : nodeData.footnote,
             index: nodeData === null || nodeData === void 0 ? void 0 : nodeData.index,
         };
@@ -61,10 +61,10 @@ function deepSearchFootnoteFromNodes(nodes) {
 }
 function useFootnotesFromNodes(nodes) {
     const filter = deepSearchFootnoteFromNodes(nodes);
-    return filter.map((element) => {
+    return filter.map(element => {
         var _a;
         return ({
-            wrapperText: (_a = (element === null || element === void 0 ? void 0 : element.children)) === null || _a === void 0 ? void 0 : _a.map((childNode) => childNode.text).join(''),
+            wrapperText: (_a = (element === null || element === void 0 ? void 0 : element.children)) === null || _a === void 0 ? void 0 : _a.map(childNode => childNode.text).join(''),
             footnote: element.footnote,
             index: element.index,
         });

package/footnote/typings.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
 import { Footnote, FootnoteElement } from '@quadrats/common/footnote';
-import { RenderElementProps, ReactWithable, WithCreateRenderElement } from '@quadrats/react';
+import { RenderElementProps, ReactWithable, WithCreateRenderElement, ReactEditor } from '@quadrats/react';
 export declare type RenderFootnoteElementProps = RenderElementProps<FootnoteElement>;
 export interface ReactFootnoteCreateRenderElementOptions {
     render?: (props: RenderFootnoteElementProps) => JSX.Element | null | undefined;
 }
-export interface ReactFootnote extends Omit<Footnote, 'with'>, WithCreateRenderElement<[ReactFootnoteCreateRenderElementOptions?]>, ReactWithable {
+export interface ReactFootnote extends Omit<Footnote<ReactEditor>, 'with'>, WithCreateRenderElement<[ReactFootnoteCreateRenderElementOptions?]>, ReactWithable {
 }

package/footnote/useFootnotes.d.ts

@@ -1,4 +1,4 @@
-import { Editor } from '@quadrats/core';
 import { FootnoteData } from '@quadrats/common/footnote';
-export declare function useFootnotes(editor: Editor): FootnoteData[];
+import { ReactEditor } from 'slate-react';
+export declare function useFootnotes(editor: ReactEditor): FootnoteData[];
 export default useFootnotes;

package/footnote/useFootnotes.js

@@ -4,13 +4,13 @@ import { FOOTNOTE_TYPE } from '@quadrats/common/footnote';
 function useFootnotes(editor) {
     const footnoteNodes = Array.from(getNodes(editor, {
         at: [],
-        match: (node) => node.type === FOOTNOTE_TYPE,
+        match: node => node.type === FOOTNOTE_TYPE,
     }));
     const footnotes = footnoteNodes.map((node) => {
         var _a, _b;
         const nodeData = node === null || node === void 0 ? void 0 : node[0];
         return {
-            wrapperText: (_b = (_a = (nodeData === null || nodeData === void 0 ? void 0 : nodeData.children)) === null || _a === void 0 ? void 0 : _a.map((childNode) => childNode.text).join('')) !== null && _b !== void 0 ? _b : '',
+            wrapperText: (_b = (_a = (nodeData === null || nodeData === void 0 ? void 0 : nodeData.children)) === null || _a === void 0 ? void 0 : _a.map(childNode => childNode.text).join('')) !== null && _b !== void 0 ? _b : '',
             footnote: nodeData === null || nodeData === void 0 ? void 0 : nodeData.footnote,
             index: nodeData === null || nodeData === void 0 ? void 0 : nodeData.index,
         };

package/footnote/useFootnotesFromNodes.js

@@ -14,10 +14,10 @@ function deepSearchFootnoteFromNodes(nodes) {
 }
 function useFootnotesFromNodes(nodes) {
     const filter = deepSearchFootnoteFromNodes(nodes);
-    return filter.map((element) => {
+    return filter.map(element => {
         var _a;
         return ({
-            wrapperText: (_a = (element === null || element === void 0 ? void 0 : element.children)) === null || _a === void 0 ? void 0 : _a.map((childNode) => childNode.text).join(''),
+            wrapperText: (_a = (element === null || element === void 0 ? void 0 : element.children)) === null || _a === void 0 ? void 0 : _a.map(childNode => childNode.text).join(''),
             footnote: element.footnote,
             index: element.index,
         });

package/heading/typings.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { Heading, HeadingElement, HeadingLevel } from '@quadrats/common/heading';
-import { WithCreateHandlers, WithCreateRenderElement, RenderElementProps } from '@quadrats/react';
+import { WithCreateHandlers, WithCreateRenderElement, RenderElementProps, ReactEditor } from '@quadrats/react';
 export declare type RenderHeadingElementProps = RenderElementProps<HeadingElement>;
 export interface ReactHeadingCreateHandlersOptions {
     /**
@@ -11,5 +11,5 @@ export interface ReactHeadingCreateHandlersOptions {
 export interface ReactHeadingCreateRenderElementOptions {
     render?: (props: RenderHeadingElementProps) => JSX.Element | null | undefined;
 }
-export interface ReactHeading<Level extends HeadingLevel> extends Heading<Level>, WithCreateHandlers<[ReactHeadingCreateHandlersOptions?]>, WithCreateRenderElement<[ReactHeadingCreateRenderElementOptions?]> {
+export interface ReactHeading<Level extends HeadingLevel> extends Heading<Level, ReactEditor>, WithCreateHandlers<[ReactHeadingCreateHandlersOptions?]>, WithCreateRenderElement<[ReactHeadingCreateRenderElementOptions?]> {
 }

package/image/components/Image.js

@@ -7,9 +7,7 @@ function Image(props) {
     const { attributes, children, element, resizeImage, src, } = props;
     const editor = useSlateStatic();
     const { focusedAndSelected, imageRef, onResizeStart } = useImageResizer(element, resizeImage);
-    return (
-    // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-noninteractive-element-interactions
-    React.createElement("div", Object.assign({}, attributes, { className: "qdr-image", onClick: () => Transforms.select(editor, ReactEditor.findPath(editor, element)), onMouseDown: (event) => event.preventDefault(), role: "img" }),
+    return (React.createElement("div", Object.assign({}, attributes, { className: "qdr-image", onClick: () => Transforms.select(editor, ReactEditor.findPath(editor, element)), onMouseDown: event => event.preventDefault(), role: "img" }),
         React.createElement("div", { className: "qdr-image__spacer" }, children),
         React.createElement("div", { contentEditable: false },
             focusedAndSelected && (React.createElement(React.Fragment, null,

package/image/createReactImage.js

@@ -85,7 +85,7 @@ function createReactImage(options = {}) {
                     })
                         .reduce((prev, imageFile) => __awaiter(this, void 0, void 0, function* () {
                         yield prev;
-                        return readFileAsDataURL(imageFile).then((dataURL) => core.insertImage(editor, dataURL));
+                        return readFileAsDataURL(imageFile).then(dataURL => core.insertImage(editor, dataURL));
                     }), Promise.resolve());
                     return;
                 }

package/image/hooks/useImageResizer.js

@@ -78,11 +78,11 @@ function useImageResizer(element, resizeImage) {
         function onCancelResize() {
             setStartPoint(undefined);
         }
-        moveEvents.forEach((moveEvent) => document.addEventListener(moveEvent, onResize));
-        endEvents.forEach((endEvent) => document.addEventListener(endEvent, onCancelResize));
+        moveEvents.forEach(moveEvent => document.addEventListener(moveEvent, onResize));
+        endEvents.forEach(endEvent => document.addEventListener(endEvent, onCancelResize));
         return () => {
-            moveEvents.forEach((moveEvent) => document.removeEventListener(moveEvent, onResize));
-            endEvents.forEach((endEvent) => document.removeEventListener(endEvent, onCancelResize));
+            moveEvents.forEach(moveEvent => document.removeEventListener(moveEvent, onResize));
+            endEvents.forEach(endEvent => document.removeEventListener(endEvent, onCancelResize));
         };
     }, [editor, element, focusedAndSelected, resizeImage, startPoint]);
     return {

package/image/index.cjs.js

@@ -104,11 +104,11 @@ function useImageResizer(element, resizeImage) {
         function onCancelResize() {
             setStartPoint(undefined);
         }
-        moveEvents.forEach((moveEvent) => document.addEventListener(moveEvent, onResize));
-        endEvents.forEach((endEvent) => document.addEventListener(endEvent, onCancelResize));
+        moveEvents.forEach(moveEvent => document.addEventListener(moveEvent, onResize));
+        endEvents.forEach(endEvent => document.addEventListener(endEvent, onCancelResize));
         return () => {
-            moveEvents.forEach((moveEvent) => document.removeEventListener(moveEvent, onResize));
-            endEvents.forEach((endEvent) => document.removeEventListener(endEvent, onCancelResize));
+            moveEvents.forEach(moveEvent => document.removeEventListener(moveEvent, onResize));
+            endEvents.forEach(endEvent => document.removeEventListener(endEvent, onCancelResize));
         };
     }, [editor, element, focusedAndSelected, resizeImage, startPoint]);
     return {
@@ -122,9 +122,7 @@ function Image(props) {
     const { attributes, children, element, resizeImage, src, } = props;
     const editor = react.useSlateStatic();
     const { focusedAndSelected, imageRef, onResizeStart } = useImageResizer(element, resizeImage);
-    return (
-    // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-noninteractive-element-interactions
-    React__default.createElement("div", Object.assign({}, attributes, { className: "qdr-image", onClick: () => core.Transforms.select(editor, react.ReactEditor.findPath(editor, element)), onMouseDown: (event) => event.preventDefault(), role: "img" }),
+    return (React__default.createElement("div", Object.assign({}, attributes, { className: "qdr-image", onClick: () => core.Transforms.select(editor, react.ReactEditor.findPath(editor, element)), onMouseDown: event => event.preventDefault(), role: "img" }),
         React__default.createElement("div", { className: "qdr-image__spacer" }, children),
         React__default.createElement("div", { contentEditable: false },
             focusedAndSelected && (React__default.createElement(React__default.Fragment, null,
@@ -233,7 +231,7 @@ function createReactImage(options = {}) {
                     })
                         .reduce((prev, imageFile) => tslib.__awaiter(this, void 0, void 0, function* () {
                         yield prev;
-                        return utils.readFileAsDataURL(imageFile).then((dataURL) => core$1.insertImage(editor, dataURL));
+                        return utils.readFileAsDataURL(imageFile).then(dataURL => core$1.insertImage(editor, dataURL));
                     }), Promise.resolve());
                     return;
                 }

package/image/typings.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { Image, ImageCaptionElement, ImageCaptionTypeKey, ImageElement, ImageFigureElement, ImageFigureTypeKey, ImageTypeKey } from '@quadrats/common/image';
-import { WithCreateHandlers, WithCreateRenderElement, RenderElementProps, ReactWithable } from '@quadrats/react';
+import { WithCreateHandlers, WithCreateRenderElement, RenderElementProps, ReactWithable, ReactEditor } from '@quadrats/react';
 export interface RenderImageFigureElementProps extends RenderElementProps<ImageFigureElement> {
     style?: {
         width: string;
@@ -15,5 +15,5 @@ export declare type ImageRenderElements = Record<ImageFigureTypeKey, (props: Ren
 export declare type ReactImageCreateRenderElementOptions = {
     [K in ImageFigureTypeKey | ImageTypeKey | ImageCaptionTypeKey]?: ImageRenderElements[K];
 };
-export interface ReactImage<Hosting extends string> extends Omit<Image<Hosting>, 'with'>, WithCreateHandlers, WithCreateRenderElement<[ReactImageCreateRenderElementOptions?]>, ReactWithable {
+export interface ReactImage<Hosting extends string> extends Omit<Image<Hosting, ReactEditor>, 'with'>, WithCreateHandlers, WithCreateRenderElement<[ReactImageCreateRenderElementOptions?]>, ReactWithable {
 }

package/index.cjs.js

@@ -74,7 +74,7 @@ function Quadrats(props) {
 
 function createEventHandler(editor, handlers) {
     const [handler, ...restHandlers] = handlers;
-    return (event) => handler(event, editor, () => {
+    return event => handler(event, editor, () => {
         const next = restHandlers.length > 0 ? createEventHandler(editor, restHandlers) : () => { };
         next(event);
     });
@@ -98,7 +98,7 @@ function composeHandlers(handlersList) {
         return acc;
     }, {});
     const handlersEntries = Object.entries(handlersListRecord);
-    return (editor) => handlersEntries.reduce((acc, [name, handlers]) => {
+    return editor => handlersEntries.reduce((acc, [name, handlers]) => {
         acc[name] = createEventHandler(editor, handlers);
         return acc;
     }, {});
@@ -108,14 +108,14 @@ function composeHandlers(handlersList) {
  * To compose sequential `renderElement`s to single.
  */
 function composeRenderElements(renderElements) {
-    return _internal.composeRenderElementsBase((props) => React__default.createElement(DefaultElement, Object.assign({}, props)), renderElements);
+    return _internal.composeRenderElementsBase(props => React__default.createElement(DefaultElement, Object.assign({}, props)), renderElements);
 }
 
 /**
  * To compose sequential `renderLeaf`s or `renderMark`s to single.
  */
 function composeRenderLeafs(renderLeafs) {
-    return _internal.composeRenderLeafsBase((props) => React__default.createElement(DefaultLeaf, Object.assign({}, props)), renderLeafs);
+    return _internal.composeRenderLeafsBase(props => React__default.createElement(DefaultLeaf, Object.assign({}, props)), renderLeafs);
 }
 
 function createReactEditor() {

package/input-block/typings.d.ts

@@ -6,7 +6,7 @@ export declare type RenderInputBlockElement = (props: RenderInputBlockElementPro
 export interface ReactInputBlockCreateRenderElementOptions {
     render?: RenderInputBlockElement;
 }
-export interface ReactInputBlock extends Omit<InputBlock, 'remove' | 'confirm'>, WithCreateRenderElement<[ReactInputBlockCreateRenderElementOptions?]> {
+export interface ReactInputBlock extends Omit<InputBlock<ReactEditor>, 'remove' | 'confirm'>, WithCreateRenderElement<[ReactInputBlockCreateRenderElementOptions?]> {
     remove(editor: ReactEditor, element: InputBlockElement): void;
     confirm(editor: ReactEditor, element: InputBlockElement, value: string): void;
 }

package/link/typings.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
 import { Link, LinkElement } from '@quadrats/common/link';
-import { RenderElementProps, ReactWithable, WithCreateRenderElement } from '@quadrats/react';
+import { RenderElementProps, ReactWithable, WithCreateRenderElement, ReactEditor } from '@quadrats/react';
 export declare type RenderLinkElementProps = RenderElementProps<LinkElement>;
 export interface ReactLinkCreateRenderElementOptions {
     render?: (props: RenderLinkElementProps) => JSX.Element | null | undefined;
 }
-export interface ReactLink extends Omit<Link, 'with'>, WithCreateRenderElement<[ReactLinkCreateRenderElementOptions?]>, ReactWithable {
+export interface ReactLink extends Omit<Link<ReactEditor>, 'with'>, WithCreateRenderElement<[ReactLinkCreateRenderElementOptions?]>, ReactWithable {
 }

package/list/createReactList.js

@@ -4,7 +4,7 @@ import { defaultRenderListElements } from './defaultRenderListElements.js';
 
 function createReactList(options = {}) {
     const core = createList(options);
-    return Object.assign(Object.assign({}, core), { createRenderElement: (options = {}) => createRenderElements(['ol', 'ul', 'li'].map((key) => ({
+    return Object.assign(Object.assign({}, core), { createRenderElement: (options = {}) => createRenderElements(['ol', 'ul', 'li'].map(key => ({
             type: core.types[key],
             render: options[key] || defaultRenderListElements[key],
         }))), createHandlers: () => ({

package/list/index.cjs.js

@@ -18,7 +18,7 @@ const defaultRenderListElements = {
 
 function createReactList(options = {}) {
     const core = list.createList(options);
-    return Object.assign(Object.assign({}, core), { createRenderElement: (options = {}) => react.createRenderElements(['ol', 'ul', 'li'].map((key) => ({
+    return Object.assign(Object.assign({}, core), { createRenderElement: (options = {}) => react.createRenderElements(['ol', 'ul', 'li'].map(key => ({
             type: core.types[key],
             render: options[key] || defaultRenderListElements[key],
         }))), createHandlers: () => ({

package/list/typings.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
 import { List, ListElement, ListTypeKey } from '@quadrats/common/list';
-import { WithCreateHandlers, WithCreateRenderElement, RenderElementProps } from '@quadrats/react';
+import { WithCreateHandlers, WithCreateRenderElement, RenderElementProps, ReactEditor } from '@quadrats/react';
 export declare type RenderListElementProps = RenderElementProps<ListElement>;
 export declare type ReactListCreateRenderElementOptions = {
     [key in ListTypeKey]?: (props: RenderListElementProps) => JSX.Element | null | undefined;
 };
-export interface ReactList extends List, WithCreateHandlers, WithCreateRenderElement<[ReactListCreateRenderElementOptions?]> {
+export interface ReactList extends List<ReactEditor>, WithCreateHandlers, WithCreateRenderElement<[ReactListCreateRenderElementOptions?]> {
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quadrats/react",
-  "version": "0.5.1",
+  "version": "0.5.5",
   "description": "",
   "author": "Rytass",
   "homepage": "https://github.com/Quadrats/quadrats#readme",
@@ -20,8 +20,8 @@
     "url": "https://github.com/Quadrats/quadrats/issues"
   },
   "dependencies": {
-    "@quadrats/common": "^0.5.1",
-    "@quadrats/core": "^0.5.1",
+    "@quadrats/common": "^0.5.3",
+    "@quadrats/core": "^0.5.2",
     "@quadrats/icons": "^0.5.0",
     "@quadrats/locales": "^0.5.0",
     "@quadrats/theme": "^0.5.0",

package/read-more/typings.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
 import { ReadMore, ReadMoreElement } from '@quadrats/common/read-more';
-import { WithCreateRenderElement, RenderElementProps } from '@quadrats/react';
+import { WithCreateRenderElement, RenderElementProps, ReactEditor } from '@quadrats/react';
 export declare type RenderReadMoreElementProps = RenderElementProps<ReadMoreElement>;
 export interface ReactReadMoreCreateRenderElementOptions {
     render?: (props: RenderReadMoreElementProps) => JSX.Element | null | undefined;
 }
-export interface ReactReadMore extends ReadMore, WithCreateRenderElement<[ReactReadMoreCreateRenderElementOptions?]> {
+export interface ReactReadMore extends ReadMore<ReactEditor>, WithCreateRenderElement<[ReactReadMoreCreateRenderElementOptions?]> {
 }

package/toggle-mark/typings.d.ts

@@ -1,5 +1,5 @@
 import { ToggleMark } from '@quadrats/common/toggle-mark';
-import { CreateRenderMarkOptions, RenderMarkProps, WithCreateHandlers, WithCreateRenderLeaf } from '@quadrats/react';
+import { CreateRenderMarkOptions, ReactEditor, RenderMarkProps, WithCreateHandlers, WithCreateRenderLeaf } from '@quadrats/react';
 export declare type RenderToggleMarkProps = RenderMarkProps<boolean>;
 export interface ReactToggleMarkCreateHandlersOptions {
     /**
@@ -8,5 +8,5 @@ export interface ReactToggleMarkCreateHandlersOptions {
     hotkey?: string;
 }
 export declare type ReactToggleMarkCreateRenderLeafOptions = Partial<Omit<CreateRenderMarkOptions<boolean>, 'type'>>;
-export interface ReactToggleMark extends ToggleMark, WithCreateHandlers<[ReactToggleMarkCreateHandlersOptions?]>, WithCreateRenderLeaf<[ReactToggleMarkCreateRenderLeafOptions?]> {
+export interface ReactToggleMark extends ToggleMark<ReactEditor>, WithCreateHandlers<[ReactToggleMarkCreateHandlersOptions?]>, WithCreateRenderLeaf<[ReactToggleMarkCreateRenderLeafOptions?]> {
 }

package/toolbar/components/Toolbar.js

@@ -35,7 +35,7 @@ function Toolbar(props) {
     const focused = ReactEditor.isFocused(editor);
     const { selection } = editor;
     const [toolInput, setToolInput] = useState();
-    const startToolInput = useCallback((inputConfig) => setToolInput(Object.assign(Object.assign({}, inputConfig), { currentSelection: selection })), [selection]);
+    const startToolInput = useCallback(inputConfig => setToolInput(Object.assign(Object.assign({}, inputConfig), { currentSelection: selection })), [selection]);
     let renderExpandedStatus;
     if (toolInput) {
         const { currentSelection } = toolInput;

package/toolbar/components/ToolbarInput.js

@@ -19,9 +19,7 @@ function ToolbarInput({ exit, toolInput }) {
     const locale = useLocale();
     const placeholder = getPlaceholder(locale);
     return (React.createElement("div", { className: "qdr-toolbar__input__wrapper" },
-        React.createElement("input", { defaultValue: toolInput.defaultValue, 
-            // eslint-disable-next-line jsx-a11y/no-autofocus
-            autoFocus: true, className: "qdr-toolbar__input", placeholder: placeholder, onKeyDown: onKeyDown, onBlur: exit }),
+        React.createElement("input", { defaultValue: toolInput.defaultValue, autoFocus: true, className: "qdr-toolbar__input", placeholder: placeholder, onKeyDown: onKeyDown, onBlur: exit }),
         React.createElement("svg", { className: "qdr-toolbar__input__cross", viewBox: "0 0 320 512", onMouseDown: onExit },
             React.createElement("path", { 
                 // eslint-disable-next-line max-len

package/toolbar/index.cjs.js

@@ -39,9 +39,7 @@ function ToolbarInput({ exit, toolInput }) {
     const locale = react.useLocale();
     const placeholder = getPlaceholder(locale);
     return (React__default.createElement("div", { className: "qdr-toolbar__input__wrapper" },
-        React__default.createElement("input", { defaultValue: toolInput.defaultValue, 
-            // eslint-disable-next-line jsx-a11y/no-autofocus
-            autoFocus: true, className: "qdr-toolbar__input", placeholder: placeholder, onKeyDown: onKeyDown, onBlur: exit }),
+        React__default.createElement("input", { defaultValue: toolInput.defaultValue, autoFocus: true, className: "qdr-toolbar__input", placeholder: placeholder, onKeyDown: onKeyDown, onBlur: exit }),
         React__default.createElement("svg", { className: "qdr-toolbar__input__cross", viewBox: "0 0 320 512", onMouseDown: onExit },
             React__default.createElement("path", { 
                 // eslint-disable-next-line max-len
@@ -77,7 +75,7 @@ function Toolbar(props) {
     const focused = react.ReactEditor.isFocused(editor);
     const { selection } = editor;
     const [toolInput, setToolInput] = React.useState();
-    const startToolInput = React.useCallback((inputConfig) => setToolInput(Object.assign(Object.assign({}, inputConfig), { currentSelection: selection })), [selection]);
+    const startToolInput = React.useCallback(inputConfig => setToolInput(Object.assign(Object.assign({}, inputConfig), { currentSelection: selection })), [selection]);
     let renderExpandedStatus;
     if (toolInput) {
         const { currentSelection } = toolInput;