@quadrats/react 0.4.0 → 0.5.1

package/file-uploader/toolbar/useFileUploaderTool.js

@@ -1,7 +1,7 @@
-import { useEditor } from '@quadrats/react';
+import { useSlateStatic } from '@quadrats/react';
 
 function useFileUploaderTool(controller, options) {
-    const editor = useEditor();
+    const editor = useSlateStatic();
     return {
         onClick: () => controller.upload(editor, options),
     };

package/footnote/createReactFootnote.js

@@ -6,17 +6,6 @@ function createReactFootnote(options = {}) {
     const core = createFootnote(options);
     const { type } = core;
     return Object.assign(Object.assign({}, core), { createRenderElement: ({ render = defaultRenderFootnoteElement } = {}) => createRenderElement({ type, render }), with(editor) {
-            const { insertData, insertText } = editor;
-            editor.insertData = (data) => {
-                const text = data.getData('text/plain');
-                if (text) {
-                    if (core.isSelectionInFootnote(editor)) {
-                        insertText(text);
-                        return;
-                    }
-                }
-                insertData(data);
-            };
             return core.with(editor);
         } });
 }

package/footnote/defaultRenderFootnoteElement.js

@@ -8,7 +8,7 @@ const defaultRenderFootnoteElement = ({ attributes, children, element, placement
     const { footnote, index } = element;
     return (React.createElement(React.Fragment, null,
         React.createElement(Tooltip, { placement: placement, popup: footnote },
-            React.createElement("a", Object.assign({}, attributes, { href: "./#", target: "_blank" }), children)),
+            React.createElement("span", Object.assign({ style: { textDecoration: 'underline' } }, attributes), children)),
         React.createElement("sup", Object.assign({}, attributes, { style: { color: 'var(--qdr-sup)', userSelect: 'none' }, contentEditable: false }), `[${index !== null && index !== void 0 ? index : 1}]`)));
 };
 

package/footnote/index.cjs.js

@@ -6,6 +6,7 @@ var React = require('react');
 var components = require('@quadrats/react/components');
 var react = require('@quadrats/react');
 var footnote = require('@quadrats/common/footnote');
+var core = require('@quadrats/core');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e["default"] : e; }
 
@@ -18,7 +19,7 @@ const defaultRenderFootnoteElement = ({ attributes, children, element, placement
     const { footnote, index } = element;
     return (React__default.createElement(React__default.Fragment, null,
         React__default.createElement(components.Tooltip, { placement: placement, popup: footnote },
-            React__default.createElement("a", Object.assign({}, attributes, { href: "./#", target: "_blank" }), children)),
+            React__default.createElement("span", Object.assign({ style: { textDecoration: 'underline' } }, attributes), children)),
         React__default.createElement("sup", Object.assign({}, attributes, { style: { color: 'var(--qdr-sup)', userSelect: 'none' }, contentEditable: false }), `[${index !== null && index !== void 0 ? index : 1}]`)));
 };
 
@@ -26,20 +27,51 @@ function createReactFootnote(options = {}) {
     const core = footnote.createFootnote(options);
     const { type } = core;
     return Object.assign(Object.assign({}, core), { createRenderElement: ({ render = defaultRenderFootnoteElement } = {}) => react.createRenderElement({ type, render }), with(editor) {
-            const { insertData, insertText } = editor;
-            editor.insertData = (data) => {
-                const text = data.getData('text/plain');
-                if (text) {
-                    if (core.isSelectionInFootnote(editor)) {
-                        insertText(text);
-                        return;
-                    }
-                }
-                insertData(data);
-            };
             return core.with(editor);
         } });
 }
 
+function useFootnotes(editor) {
+    const footnoteNodes = Array.from(core.getNodes(editor, {
+        at: [],
+        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 : '',
+            footnote: nodeData === null || nodeData === void 0 ? void 0 : nodeData.footnote,
+            index: nodeData === null || nodeData === void 0 ? void 0 : nodeData.index,
+        };
+    });
+    return footnotes;
+}
+
+function deepSearchFootnoteFromNodes(nodes) {
+    const result = nodes.flatMap((element) => {
+        var _a, _b, _c, _d;
+        const curNode = core.Node.isNode(element)
+            && element.type === footnote.FOOTNOTE_TYPE ? element : null;
+        const child = core.Node.isNodeList((_a = element) === null || _a === void 0 ? void 0 : _a.children)
+            ? deepSearchFootnoteFromNodes((_c = (_b = element) === null || _b === void 0 ? void 0 : _b.children) !== null && _c !== void 0 ? _c : []) : null;
+        return (_d = curNode !== null && curNode !== void 0 ? curNode : child) !== null && _d !== void 0 ? _d : [];
+    });
+    return result;
+}
+function useFootnotesFromNodes(nodes) {
+    const filter = deepSearchFootnoteFromNodes(nodes);
+    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(''),
+            footnote: element.footnote,
+            index: element.index,
+        });
+    });
+}
+
 exports.createReactFootnote = createReactFootnote;
 exports.defaultRenderFootnoteElement = defaultRenderFootnoteElement;
+exports.useFootnotes = useFootnotes;
+exports.useFootnotesFromNodes = useFootnotesFromNodes;

package/footnote/index.d.ts

@@ -1,3 +1,5 @@
 export * from './typings';
 export { defaultRenderFootnoteElement } from './defaultRenderFootnoteElement';
 export { CreateReactFootnoteOptions, createReactFootnote } from './createReactFootnote';
+export { default as useFootnotes } from './useFootnotes';
+export { default as useFootnotesFromNodes } from './useFootnotesFromNodes';

package/footnote/index.js

@@ -1,2 +1,4 @@
 export { defaultRenderFootnoteElement } from './defaultRenderFootnoteElement.js';
 export { createReactFootnote } from './createReactFootnote.js';
+export { useFootnotes } from './useFootnotes.js';
+export { useFootnotesFromNodes } from './useFootnotesFromNodes.js';

package/footnote/jsx-serializer/createJsxSerializeFootnote.d.ts

@@ -2,4 +2,4 @@
 import { CreateJsxSerializeElementOptions } from '@quadrats/react/jsx-serializer';
 import { JsxSerializeFootnoteElementProps } from './typings';
 export declare type CreateJsxSerializeFootnoteOptions = Partial<CreateJsxSerializeElementOptions<JsxSerializeFootnoteElementProps>>;
-export declare function createJsxSerializeFootnote(options?: CreateJsxSerializeFootnoteOptions): (props: import("@quadrats/react/jsx-serializer").JsxSerializeElementProps<import("slate").Element>) => JSX.Element | null | undefined;
+export declare function createJsxSerializeFootnote(options?: CreateJsxSerializeFootnoteOptions): (props: import("@quadrats/react/jsx-serializer").JsxSerializeElementProps<import("@quadrats/core").QuadratsElement>) => JSX.Element | null | undefined;

package/footnote/jsx-serializer/defaultRenderFootnoteElement.js

@@ -3,7 +3,7 @@ import React from 'react';
 const defaultRenderFootnoteElement = ({ children, element }) => {
     var _a;
     return (React.createElement(React.Fragment, null,
-        React.createElement("a", { href: "./#" }, children),
+        React.createElement("span", { style: { textDecoration: 'underline' } }, children),
         React.createElement("sup", { style: { color: 'var(--qdr-sup)' } }, `[${(_a = element.index) !== null && _a !== void 0 ? _a : 1}]`)));
 };
 

package/footnote/jsx-serializer/index.cjs.js

@@ -13,7 +13,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 const defaultRenderFootnoteElement = ({ children, element }) => {
     var _a;
     return (React__default.createElement(React__default.Fragment, null,
-        React__default.createElement("a", { href: "./#" }, children),
+        React__default.createElement("span", { style: { textDecoration: 'underline' } }, children),
         React__default.createElement("sup", { style: { color: 'var(--qdr-sup)' } }, `[${(_a = element.index) !== null && _a !== void 0 ? _a : 1}]`)));
 };
 

package/footnote/toolbar/FootnoteToolbarIcon.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { ToolbarIconProps } from '@quadrats/react/toolbar';
+import { ReactFootnote } from '@quadrats/react/footnote';
+import { UseFootnoteToolOptions } from './useFootnoteTool';
+export interface FootnoteToolbarIconProps extends Omit<ToolbarIconProps, 'active' | 'onClick'> {
+    controller: ReactFootnote;
+    options?: UseFootnoteToolOptions;
+}
+declare function FootnoteToolbarIcon(props: FootnoteToolbarIconProps): JSX.Element;
+export default FootnoteToolbarIcon;

package/footnote/toolbar/FootnoteToolbarIcon.js

@@ -0,0 +1,12 @@
+import { __rest } from 'tslib';
+import React from 'react';
+import { ToolbarIcon } from '@quadrats/react/toolbar';
+import { useFootnoteTool } from './useFootnoteTool.js';
+
+function FootnoteToolbarIcon(props) {
+    const { controller, options = {} } = props, rest = __rest(props, ["controller", "options"]);
+    const { active, onClick } = useFootnoteTool(controller, options);
+    return React.createElement(ToolbarIcon, Object.assign({}, rest, { active: active, onClick: onClick }));
+}
+
+export { FootnoteToolbarIcon as default };

package/footnote/toolbar/index.cjs.js

@@ -0,0 +1,36 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var react = require('@quadrats/react');
+var toolbar = require('@quadrats/react/toolbar');
+var tslib = require('tslib');
+var React = require('react');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e["default"] : e; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+function useFootnoteTool(controller, options = {}) {
+    const editor = react.useQuadrats();
+    const startToolInput = toolbar.useStartToolInput();
+    return {
+        active: controller.isSelectionInFootnote(editor),
+        onClick: () => startToolInput({
+            getPlaceholder: (locale) => locale.editor.footnote.inputPlaceholder,
+            confirm: (footnoteText) => {
+                controller.upsertFootnoteAndUpdateIndex(editor, footnoteText, options);
+            },
+            defaultValue: controller.getFootnoteText(editor),
+        }),
+    };
+}
+
+function FootnoteToolbarIcon(props) {
+    const { controller, options = {} } = props, rest = tslib.__rest(props, ["controller", "options"]);
+    const { active, onClick } = useFootnoteTool(controller, options);
+    return React__default.createElement(toolbar.ToolbarIcon, Object.assign({}, rest, { active: active, onClick: onClick }));
+}
+
+exports.FootnoteToolbarIcon = FootnoteToolbarIcon;
+exports.useFootnoteTool = useFootnoteTool;

package/footnote/toolbar/index.d.ts

@@ -0,0 +1,2 @@
+export * from './useFootnoteTool';
+export { FootnoteToolbarIconProps, default as FootnoteToolbarIcon } from './FootnoteToolbarIcon';

package/footnote/toolbar/index.js

@@ -0,0 +1,2 @@
+export { useFootnoteTool } from './useFootnoteTool.js';
+export { default as FootnoteToolbarIcon } from './FootnoteToolbarIcon.js';

package/footnote/toolbar/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@quadrats/react/footnote/toolbar",
+  "sideEffects": false,
+  "main": "./index.cjs.js",
+  "module": "./index.js",
+  "typings": "./index.d.ts"
+}

package/footnote/toolbar/useFootnoteTool.d.ts

@@ -0,0 +1,7 @@
+import { FootnoteUpsertFootnoteOptions } from '@quadrats/common/footnote';
+import { ReactFootnote } from '@quadrats/react/footnote';
+export declare type UseFootnoteToolOptions = FootnoteUpsertFootnoteOptions;
+export declare function useFootnoteTool(controller: ReactFootnote, options?: UseFootnoteToolOptions): {
+    active: boolean;
+    onClick: () => void;
+};

package/footnote/toolbar/useFootnoteTool.js

@@ -0,0 +1,19 @@
+import { useQuadrats } from '@quadrats/react';
+import { useStartToolInput } from '@quadrats/react/toolbar';
+
+function useFootnoteTool(controller, options = {}) {
+    const editor = useQuadrats();
+    const startToolInput = useStartToolInput();
+    return {
+        active: controller.isSelectionInFootnote(editor),
+        onClick: () => startToolInput({
+            getPlaceholder: (locale) => locale.editor.footnote.inputPlaceholder,
+            confirm: (footnoteText) => {
+                controller.upsertFootnoteAndUpdateIndex(editor, footnoteText, options);
+            },
+            defaultValue: controller.getFootnoteText(editor),
+        }),
+    };
+}
+
+export { useFootnoteTool };

package/footnote/useFootnotes.d.ts

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

package/footnote/useFootnotes.js

@@ -0,0 +1,21 @@
+import { getNodes } from '@quadrats/core';
+import { FOOTNOTE_TYPE } from '@quadrats/common/footnote';
+
+function useFootnotes(editor) {
+    const footnoteNodes = Array.from(getNodes(editor, {
+        at: [],
+        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 : '',
+            footnote: nodeData === null || nodeData === void 0 ? void 0 : nodeData.footnote,
+            index: nodeData === null || nodeData === void 0 ? void 0 : nodeData.index,
+        };
+    });
+    return footnotes;
+}
+
+export { useFootnotes as default, useFootnotes };

package/footnote/useFootnotesFromNodes.d.ts

@@ -0,0 +1,4 @@
+import { Descendant } from '@quadrats/core';
+import { FootnoteData } from '@quadrats/common/footnote';
+export declare function useFootnotesFromNodes(nodes: Descendant[]): FootnoteData[];
+export default useFootnotesFromNodes;

package/footnote/useFootnotesFromNodes.js

@@ -0,0 +1,27 @@
+import { Node } from '@quadrats/core';
+import { FOOTNOTE_TYPE } from '@quadrats/common/footnote';
+
+function deepSearchFootnoteFromNodes(nodes) {
+    const result = nodes.flatMap((element) => {
+        var _a, _b, _c, _d;
+        const curNode = Node.isNode(element)
+            && element.type === FOOTNOTE_TYPE ? element : null;
+        const child = Node.isNodeList((_a = element) === null || _a === void 0 ? void 0 : _a.children)
+            ? deepSearchFootnoteFromNodes((_c = (_b = element) === null || _b === void 0 ? void 0 : _b.children) !== null && _c !== void 0 ? _c : []) : null;
+        return (_d = curNode !== null && curNode !== void 0 ? curNode : child) !== null && _d !== void 0 ? _d : [];
+    });
+    return result;
+}
+function useFootnotesFromNodes(nodes) {
+    const filter = deepSearchFootnoteFromNodes(nodes);
+    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(''),
+            footnote: element.footnote,
+            index: element.index,
+        });
+    });
+}
+
+export { useFootnotesFromNodes as default, useFootnotesFromNodes };

package/heading/constants.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Default hotkey for toggling heading.
+ *
+ * @remarks
+ * If the hotkey is `ctrl+opt`, the level 1 hotkey will be `ctrl+opt+1`, and so on.
+ *
+ * @see [is-hotkey]{@link https://www.npmjs.com/package/is-hotkey}
+ */
+export declare const HEADING_HOTKEY = "ctrl+opt";

package/heading/constants.js

@@ -0,0 +1,11 @@
+/**
+ * Default hotkey for toggling heading.
+ *
+ * @remarks
+ * If the hotkey is `ctrl+opt`, the level 1 hotkey will be `ctrl+opt+1`, and so on.
+ *
+ * @see [is-hotkey]{@link https://www.npmjs.com/package/is-hotkey}
+ */
+const HEADING_HOTKEY = 'ctrl+opt';
+
+export { HEADING_HOTKEY };

package/heading/createReactHeading.d.ts

@@ -0,0 +1,4 @@
+import { CreateHeadingOptions, HeadingLevel } from '@quadrats/common/heading';
+import { ReactHeading } from './typings';
+export declare type CreateReactHeadingOptions<L extends HeadingLevel> = CreateHeadingOptions<L>;
+export declare function createReactHeading<L extends HeadingLevel = HeadingLevel>(options?: CreateReactHeadingOptions<L>): ReactHeading<L>;

package/heading/createReactHeading.js

@@ -0,0 +1,47 @@
+import isHotkey from 'is-hotkey';
+import { createHeading } from '@quadrats/common/heading';
+import { createRenderElement } from '@quadrats/react';
+import { createOnKeyDownBreak } from '@quadrats/react/line-break';
+import { HEADING_HOTKEY } from './constants.js';
+import { defaultRenderHeadingElement } from './defaultRenderHeadingElement.js';
+
+function createReactHeading(options = {}) {
+    const core = createHeading(options);
+    const { type } = core;
+    return Object.assign(Object.assign({}, core), { createHandlers: ({ hotkey = HEADING_HOTKEY } = {}) => {
+            const onKeyDownBreak = createOnKeyDownBreak({
+                exitBreak: {
+                    rules: [
+                        {
+                            hotkey: 'enter',
+                            match: {
+                                onlyAtEdge: true,
+                                includeTypes: [type],
+                            },
+                        },
+                    ],
+                },
+            });
+            return {
+                onKeyDown(event, editor, next) {
+                    /**
+                     * Only toggle if the hotkey is fired and the key is the same as level.
+                     */
+                    const keyAsNumber = +event.key;
+                    if (!Number.isNaN(keyAsNumber) && isHotkey(hotkey, event)) {
+                        try {
+                            core.toggleHeadingNodes(editor, keyAsNumber);
+                            event.preventDefault();
+                            // eslint-disable-next-line no-empty
+                        }
+                        catch (_a) { }
+                    }
+                    else {
+                        onKeyDownBreak(event, editor, next);
+                    }
+                },
+            };
+        }, createRenderElement: ({ render = defaultRenderHeadingElement } = {}) => createRenderElement({ type, render }) });
+}
+
+export { createReactHeading };

package/heading/defaultRenderHeadingElement.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+import { HeadingElement } from '@quadrats/common/heading';
+import { RenderElementProps } from '@quadrats/react';
+export declare const HEADING_COMPONENTS: {
+    readonly 1: "h1";
+    readonly 2: "h2";
+    readonly 3: "h3";
+    readonly 4: "h4";
+    readonly 5: "h5";
+    readonly 6: "h6";
+};
+export declare const defaultRenderHeadingElement: ({ attributes, children, element, }: {
+    attributes?: {
+        'data-slate-node': "element";
+        'data-slate-inline'?: true | undefined;
+        'data-slate-void'?: true | undefined;
+        dir?: "rtl" | undefined;
+        ref: any;
+    } | undefined;
+    children: RenderElementProps['children'];
+    element: HeadingElement;
+}) => JSX.Element | null;

package/heading/defaultRenderHeadingElement.js

@@ -0,0 +1,19 @@
+import React from 'react';
+
+const HEADING_COMPONENTS = {
+    1: 'h1',
+    2: 'h2',
+    3: 'h3',
+    4: 'h4',
+    5: 'h5',
+    6: 'h6',
+};
+const defaultRenderHeadingElement = ({ attributes, children, element, }) => {
+    const Component = HEADING_COMPONENTS[element.level];
+    if (!Component) {
+        return null;
+    }
+    return React.createElement(Component, Object.assign({}, attributes), children);
+};
+
+export { HEADING_COMPONENTS, defaultRenderHeadingElement };

package/heading/index.cjs.js

@@ -0,0 +1,83 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var isHotkey = require('is-hotkey');
+var heading = require('@quadrats/common/heading');
+var react = require('@quadrats/react');
+var lineBreak = require('@quadrats/react/line-break');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e["default"] : e; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var isHotkey__default = /*#__PURE__*/_interopDefaultLegacy(isHotkey);
+
+/**
+ * Default hotkey for toggling heading.
+ *
+ * @remarks
+ * If the hotkey is `ctrl+opt`, the level 1 hotkey will be `ctrl+opt+1`, and so on.
+ *
+ * @see [is-hotkey]{@link https://www.npmjs.com/package/is-hotkey}
+ */
+const HEADING_HOTKEY = 'ctrl+opt';
+
+const HEADING_COMPONENTS = {
+    1: 'h1',
+    2: 'h2',
+    3: 'h3',
+    4: 'h4',
+    5: 'h5',
+    6: 'h6',
+};
+const defaultRenderHeadingElement = ({ attributes, children, element, }) => {
+    const Component = HEADING_COMPONENTS[element.level];
+    if (!Component) {
+        return null;
+    }
+    return React__default.createElement(Component, Object.assign({}, attributes), children);
+};
+
+function createReactHeading(options = {}) {
+    const core = heading.createHeading(options);
+    const { type } = core;
+    return Object.assign(Object.assign({}, core), { createHandlers: ({ hotkey = HEADING_HOTKEY } = {}) => {
+            const onKeyDownBreak = lineBreak.createOnKeyDownBreak({
+                exitBreak: {
+                    rules: [
+                        {
+                            hotkey: 'enter',
+                            match: {
+                                onlyAtEdge: true,
+                                includeTypes: [type],
+                            },
+                        },
+                    ],
+                },
+            });
+            return {
+                onKeyDown(event, editor, next) {
+                    /**
+                     * Only toggle if the hotkey is fired and the key is the same as level.
+                     */
+                    const keyAsNumber = +event.key;
+                    if (!Number.isNaN(keyAsNumber) && isHotkey__default(hotkey, event)) {
+                        try {
+                            core.toggleHeadingNodes(editor, keyAsNumber);
+                            event.preventDefault();
+                            // eslint-disable-next-line no-empty
+                        }
+                        catch (_a) { }
+                    }
+                    else {
+                        onKeyDownBreak(event, editor, next);
+                    }
+                },
+            };
+        }, createRenderElement: ({ render = defaultRenderHeadingElement } = {}) => react.createRenderElement({ type, render }) });
+}
+
+exports.HEADING_HOTKEY = HEADING_HOTKEY;
+exports.createReactHeading = createReactHeading;
+exports.defaultRenderHeadingElement = defaultRenderHeadingElement;

package/heading/index.d.ts

@@ -0,0 +1,4 @@
+export * from './typings';
+export { HEADING_HOTKEY } from './constants';
+export { defaultRenderHeadingElement } from './defaultRenderHeadingElement';
+export { CreateReactHeadingOptions, createReactHeading } from './createReactHeading';

package/heading/index.js

@@ -0,0 +1,3 @@
+export { HEADING_HOTKEY } from './constants.js';
+export { defaultRenderHeadingElement } from './defaultRenderHeadingElement.js';
+export { createReactHeading } from './createReactHeading.js';

package/heading/jsx-serializer/createJsxSerializeHeading.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { CreateJsxSerializeElementOptions } from '@quadrats/react/jsx-serializer';
+import { JsxSerializeHeadingElementProps } from './typings';
+export declare type CreateJsxSerializeHeadingOptions = Partial<CreateJsxSerializeElementOptions<JsxSerializeHeadingElementProps>>;
+export declare function createJsxSerializeHeading(options?: CreateJsxSerializeHeadingOptions): (props: import("@quadrats/react/jsx-serializer").JsxSerializeElementProps<import("@quadrats/core").QuadratsElement>) => JSX.Element | null | undefined;

package/heading/jsx-serializer/createJsxSerializeHeading.js

@@ -0,0 +1,10 @@
+import { HEADING_TYPE } from '@quadrats/common/heading';
+import { createJsxSerializeElement } from '@quadrats/react/jsx-serializer';
+import { defaultRenderHeadingElement } from '@quadrats/react/heading';
+
+function createJsxSerializeHeading(options = {}) {
+    const { type = HEADING_TYPE, render = defaultRenderHeadingElement } = options;
+    return createJsxSerializeElement({ type, render });
+}
+
+export { createJsxSerializeHeading };

package/heading/jsx-serializer/defaultRenderHeadingElement.d.ts

@@ -0,0 +1 @@
+export { defaultRenderHeadingElement } from '@quadrats/react/heading';

package/heading/jsx-serializer/index.cjs.js

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var heading = require('@quadrats/react/heading');
+var heading$1 = require('@quadrats/common/heading');
+var jsxSerializer = require('@quadrats/react/jsx-serializer');
+
+function createJsxSerializeHeading(options = {}) {
+    const { type = heading$1.HEADING_TYPE, render = heading.defaultRenderHeadingElement } = options;
+    return jsxSerializer.createJsxSerializeElement({ type, render });
+}
+
+exports.defaultRenderHeadingElement = heading.defaultRenderHeadingElement;
+exports.createJsxSerializeHeading = createJsxSerializeHeading;

package/heading/jsx-serializer/index.d.ts

@@ -0,0 +1,3 @@
+export * from './typings';
+export { defaultRenderHeadingElement } from './defaultRenderHeadingElement';
+export { CreateJsxSerializeHeadingOptions, createJsxSerializeHeading } from './createJsxSerializeHeading';

package/heading/jsx-serializer/index.js

@@ -0,0 +1,2 @@
+export { defaultRenderHeadingElement } from '@quadrats/react/heading';
+export { createJsxSerializeHeading } from './createJsxSerializeHeading.js';

package/heading/jsx-serializer/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@quadrats/react/heading/jsx-serializer",
+  "sideEffects": false,
+  "main": "./index.cjs.js",
+  "module": "./index.js",
+  "typings": "./index.d.ts"
+}

package/heading/jsx-serializer/typings.d.ts

@@ -0,0 +1,3 @@
+import { HeadingElement } from '@quadrats/common/heading';
+import { JsxSerializeElementProps } from '@quadrats/react/jsx-serializer';
+export declare type JsxSerializeHeadingElementProps = JsxSerializeElementProps<HeadingElement>;

package/heading/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@quadrats/react/heading",
+  "sideEffects": false,
+  "main": "./index.cjs.js",
+  "module": "./index.js",
+  "typings": "./index.d.ts"
+}

package/heading/toolbar/HeadingToolbarIcon.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { HeadingLevel } from '@quadrats/common/heading';
+import { ReactHeading } from '@quadrats/react/heading';
+import { ToolbarIconProps } from '@quadrats/react/toolbar';
+export interface HeadingToolbarIconProps<Level extends HeadingLevel, ValidLevel extends Level> extends Omit<ToolbarIconProps, 'active' | 'onClick'> {
+    controller: ReactHeading<Level>;
+    level: ValidLevel;
+}
+declare function HeadingToolbarIcon<Level extends HeadingLevel, ValidLevel extends Level>(props: HeadingToolbarIconProps<Level, ValidLevel>): JSX.Element;
+export default HeadingToolbarIcon;