@quadrats/react 1.1.8 → 1.1.10

package/accordion/index.cjs.js

@@ -0,0 +1,212 @@
+'use strict';
+
+var React = require('react');
+var clsx = require('clsx');
+var components = require('@quadrats/react/components');
+var icons = require('@quadrats/icons');
+var core = require('@quadrats/core');
+var react = require('@quadrats/react');
+var accordion = require('@quadrats/common/accordion');
+
+const AccordionContext = React.createContext({ expanded: true });
+
+function useAccordion() {
+    return React.useContext(AccordionContext);
+}
+
+function Accordion({ attributes, children, }) {
+    const [expanded, setExpanded] = React.useState(true);
+    return (React.createElement(AccordionContext.Provider, { value: {
+            expanded,
+        } },
+        React.createElement("div", Object.assign({}, attributes, { className: "qdr-accordion" }),
+            React.createElement("div", { className: "qdr-accordion__icon-wrapper", contentEditable: false, onClick: () => {
+                    setExpanded(status => !status);
+                } },
+                React.createElement(components.Icon, { className: clsx('qdr-accordion__icon', {
+                        'qdr-accordion__icon--expanded': expanded,
+                    }), icon: icons.AccordionDown, width: 24, height: 24 })),
+            React.createElement("div", { className: "qdr-accordion__wrapper" }, children))));
+}
+
+function AccordionTitle(props) {
+    const { compositionPath } = react.useComposition();
+    const { attributes, children, element } = props;
+    const editor = react.useQuadrats();
+    const path = react.ReactEditor.findPath(editor, element);
+    const text = core.Editor.string(editor, path);
+    const isEmpty = !text;
+    const locale = react.useLocale();
+    const placeholder = locale.editor.accordion.titlePlaceholder;
+    const composing = React.useMemo(() => core.Path.equals(compositionPath, path), [compositionPath, path]);
+    return (React.createElement("p", Object.assign({}, attributes, { className: "qdr-accordion__title" }),
+        children,
+        isEmpty && !composing && (React.createElement("span", { className: "qdr-accordion__title__placeholder", contentEditable: false }, placeholder))));
+}
+
+function AccordionContent(props) {
+    const { compositionPath } = react.useComposition();
+    const { attributes, children, element } = props;
+    const editor = react.useQuadrats();
+    const path = react.ReactEditor.findPath(editor, element);
+    const text = core.Editor.string(editor, path);
+    const isEmpty = !text;
+    const locale = react.useLocale();
+    const placeholder = locale.editor.accordion.contentPlaceholder;
+    const composing = React.useMemo(() => core.Path.equals(compositionPath, path), [compositionPath, path]);
+    const { expanded } = useAccordion();
+    if (!expanded)
+        return null;
+    return (React.createElement("p", Object.assign({}, attributes, { className: "qdr-accordion__content" }),
+        children,
+        isEmpty && !composing && (React.createElement("span", { className: "qdr-accordion__content__placeholder", contentEditable: false }, placeholder))));
+}
+
+const defaultRenderAccordionElements = {
+    accordion: props => React.createElement(Accordion, Object.assign({}, props)),
+    accordion_title: props => React.createElement(AccordionTitle, Object.assign({}, props)),
+    accordion_content: props => React.createElement(AccordionContent, Object.assign({}, props)),
+};
+
+function createReactAccordion(options = {}) {
+    const core$1 = accordion.createAccordion(options);
+    const { types } = core$1;
+    return Object.assign(Object.assign({}, core$1), { createHandlers: () => ({
+            onKeyDown(event, editor, next) {
+                if (event.nativeEvent.isComposing) {
+                    return;
+                }
+                if (core$1.isSelectionInAccordionTitle(editor)) {
+                    const blockEntry = editor.above({
+                        match: (node) => node.type === types.accordion_title,
+                    });
+                    if (!blockEntry)
+                        return;
+                    const [, currentPath] = blockEntry;
+                    const parentEntry = core.getParent(editor, currentPath);
+                    if (!parentEntry)
+                        return;
+                    const [, parentPath] = parentEntry;
+                    const isFirst = core.Path.equals(currentPath, parentPath.concat(0));
+                    if (isFirst) {
+                        if (event.key === 'Backspace') {
+                            const text = core.Editor.string(editor, currentPath);
+                            if (!text) {
+                                event.preventDefault();
+                                core.Transforms.removeNodes(editor, { at: parentPath });
+                                return;
+                            }
+                            if (editor.selection && editor.selection.anchor.offset === 0) {
+                                event.preventDefault();
+                                return;
+                            }
+                        }
+                        if (editor.selection && event.key === 'Enter') {
+                            event.preventDefault();
+                            core.Transforms.select(editor, core.Editor.end(editor, core.Path.next(currentPath)));
+                            return;
+                        }
+                    }
+                    return;
+                }
+                if (core$1.isSelectionInAccordionContent(editor)) {
+                    const blockEntry = editor.above({
+                        match: (node) => node.type === types.accordion_content,
+                    });
+                    if (!blockEntry)
+                        return;
+                    const [, blockPath] = blockEntry;
+                    const prePath = core.Path.previous(blockPath);
+                    const [preNode] = core.Editor.node(editor, prePath);
+                    const text = core.Editor.string(editor, blockPath);
+                    if (event.key === 'Backspace') {
+                        if (core.Element.isElement(preNode)) {
+                            const preType = preNode.type;
+                            if (preType === types.accordion_title) {
+                                const firstTextEntry = core.Node.first(editor, blockPath);
+                                const [, firstTextPath] = firstTextEntry;
+                                if (editor.selection &&
+                                    core.Path.equals(editor.selection.anchor.path, firstTextPath) &&
+                                    editor.selection.anchor.offset === 0) {
+                                    event.preventDefault();
+                                    core.Transforms.select(editor, core.Editor.end(editor, prePath));
+                                    return;
+                                }
+                            }
+                            return;
+                        }
+                        return;
+                    }
+                    if (!text && editor.selection && event.key === 'Enter') {
+                        const parentEntry = core.getParent(editor, blockPath);
+                        if (!parentEntry)
+                            return;
+                        const [, parentPath] = parentEntry;
+                        event.preventDefault();
+                        const moveto = parentPath.slice();
+                        if (core.Element.isElement(preNode)) {
+                            const preType = preNode.type;
+                            if (preType === types.accordion_content) {
+                                core.Transforms.removeNodes(editor, { at: editor.selection });
+                            }
+                        }
+                        core.Transforms.insertNodes(editor, { type: core.PARAGRAPH_TYPE, children: [{ text: '' }] }, {
+                            at: editor.selection,
+                            select: true,
+                        });
+                        moveto[parentPath.length - 1] += 1;
+                        core.Transforms.moveNodes(editor, {
+                            at: editor.selection,
+                            to: moveto,
+                        });
+                        return;
+                    }
+                }
+                next();
+            },
+        }), createRenderElement: (options = {}) => {
+            const renderAccordion = options.accordion || defaultRenderAccordionElements.accordion;
+            const renderAccordionTitle = options.accordion_title || defaultRenderAccordionElements.accordion_title;
+            const renderAccordionContent = options.accordion_content || defaultRenderAccordionElements.accordion_content;
+            return react.createRenderElements([
+                {
+                    type: types.accordion,
+                    render: (props) => {
+                        const { attributes, children, element } = props;
+                        return renderAccordion({
+                            attributes,
+                            element,
+                            children,
+                        });
+                    },
+                },
+                {
+                    type: types.accordion_title,
+                    render: (props) => {
+                        const { attributes, children, element } = props;
+                        return renderAccordionTitle({
+                            attributes,
+                            element,
+                            children,
+                        });
+                    },
+                },
+                {
+                    type: types.accordion_content,
+                    render: (props) => {
+                        const { attributes, children, element } = props;
+                        return renderAccordionContent({
+                            attributes,
+                            element,
+                            children,
+                        });
+                    },
+                },
+            ]);
+        } });
+}
+
+exports.AccordionContext = AccordionContext;
+exports.createReactAccordion = createReactAccordion;
+exports.defaultRenderAccordionElements = defaultRenderAccordionElements;
+exports.useAccordion = useAccordion;

package/accordion/index.js

@@ -0,0 +1,10 @@
+export { AccordionContext } from './contexts/AccordionContext.js';
+export { useAccordion } from './hooks/useAccordion.js';
+import 'react';
+import 'clsx';
+import '@quadrats/react/components';
+import '@quadrats/icons';
+import '@quadrats/core';
+import '@quadrats/react';
+export { defaultRenderAccordionElements } from './defaultRenderAccordionElements.js';
+export { createReactAccordion } from './createReactAccordion.js';

package/accordion/jsx-serializer/createJsxSerializeAccordion.d.ts

@@ -0,0 +1,5 @@
+import { AccordionTypeKey, AccordionTitleTypeKey, AccordionContentTypeKey } from '@quadrats/common/accordion';
+import { CreateJsxSerializeElementOptions, JsxSerializeElementProps } from '@quadrats/react/jsx-serializer';
+import { JsxSerializeAccordionElementProps } from './typings';
+export type CreateJsxSerializeAccordionOptions = Partial<Record<AccordionTypeKey, Partial<CreateJsxSerializeElementOptions<JsxSerializeAccordionElementProps>>> & Record<AccordionTitleTypeKey, Partial<CreateJsxSerializeElementOptions<JsxSerializeElementProps>>> & Record<AccordionContentTypeKey, Partial<CreateJsxSerializeElementOptions<JsxSerializeElementProps>>>>;
+export declare function createJsxSerializeAccordion(options?: CreateJsxSerializeAccordionOptions): (props: JsxSerializeElementProps) => import("react").JSX.Element | null | undefined;

package/accordion/jsx-serializer/createJsxSerializeAccordion.js

@@ -0,0 +1,48 @@
+import { ACCORDION_TYPES } from '@quadrats/common/accordion';
+import { createJsxSerializeElements } from '@quadrats/react/jsx-serializer';
+import { defaultRenderAccordionElements } from './defaultRenderAccordionElements.js';
+
+function createJsxSerializeAccordion(options = {}) {
+    const { accordion = {}, accordion_title = {}, accordion_content = {}, } = options;
+    const accordionType = accordion.type || ACCORDION_TYPES.accordion;
+    const titleType = accordion_title.type || ACCORDION_TYPES.accordion_title;
+    const contentType = accordion_content.type || ACCORDION_TYPES.accordion_content;
+    const renderAccordion = accordion.render || defaultRenderAccordionElements.accordion;
+    const renderAccordionTitle = accordion_title.render || defaultRenderAccordionElements.accordion_title;
+    const renderAccordionContent = accordion_content.render || defaultRenderAccordionElements.accordion_content;
+    return createJsxSerializeElements([
+        {
+            type: accordionType,
+            render: (props) => {
+                const { children } = props;
+                const element = props.element;
+                return renderAccordion({
+                    children,
+                    element,
+                });
+            },
+        },
+        {
+            type: titleType,
+            render: (props) => {
+                const { children, element } = props;
+                return renderAccordionTitle({
+                    children,
+                    element,
+                });
+            },
+        },
+        {
+            type: contentType,
+            render: (props) => {
+                const { children, element } = props;
+                return renderAccordionContent({
+                    children,
+                    element,
+                });
+            },
+        },
+    ]);
+}
+
+export { createJsxSerializeAccordion };

package/accordion/jsx-serializer/defaultRenderAccordionElements.d.ts

@@ -0,0 +1,2 @@
+import { AccordionJsxSerializeElements } from './typings';
+export declare const defaultRenderAccordionElements: AccordionJsxSerializeElements;

package/accordion/jsx-serializer/defaultRenderAccordionElements.js

@@ -0,0 +1,16 @@
+import React from 'react';
+import { defaultRenderAccordionElements as defaultRenderAccordionElements$1, useAccordion } from '@quadrats/react/accordion';
+
+const AccordionContentJsxSerializeElement = ({ children }) => {
+    const { expanded } = useAccordion();
+    if (!expanded)
+        return null;
+    return React.createElement("p", { className: "qdr-accordion__content" }, children);
+};
+const defaultRenderAccordionElements = {
+    accordion: defaultRenderAccordionElements$1.accordion,
+    accordion_title: ({ children }) => React.createElement("p", { className: "qdr-accordion__title" }, children),
+    accordion_content: props => React.createElement(AccordionContentJsxSerializeElement, Object.assign({}, props)),
+};
+
+export { defaultRenderAccordionElements };

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

@@ -0,0 +1,64 @@
+'use strict';
+
+var React = require('react');
+var accordion = require('@quadrats/react/accordion');
+var accordion$1 = require('@quadrats/common/accordion');
+var jsxSerializer = require('@quadrats/react/jsx-serializer');
+
+const AccordionContentJsxSerializeElement = ({ children }) => {
+    const { expanded } = accordion.useAccordion();
+    if (!expanded)
+        return null;
+    return React.createElement("p", { className: "qdr-accordion__content" }, children);
+};
+const defaultRenderAccordionElements = {
+    accordion: accordion.defaultRenderAccordionElements.accordion,
+    accordion_title: ({ children }) => React.createElement("p", { className: "qdr-accordion__title" }, children),
+    accordion_content: props => React.createElement(AccordionContentJsxSerializeElement, Object.assign({}, props)),
+};
+
+function createJsxSerializeAccordion(options = {}) {
+    const { accordion = {}, accordion_title = {}, accordion_content = {}, } = options;
+    const accordionType = accordion.type || accordion$1.ACCORDION_TYPES.accordion;
+    const titleType = accordion_title.type || accordion$1.ACCORDION_TYPES.accordion_title;
+    const contentType = accordion_content.type || accordion$1.ACCORDION_TYPES.accordion_content;
+    const renderAccordion = accordion.render || defaultRenderAccordionElements.accordion;
+    const renderAccordionTitle = accordion_title.render || defaultRenderAccordionElements.accordion_title;
+    const renderAccordionContent = accordion_content.render || defaultRenderAccordionElements.accordion_content;
+    return jsxSerializer.createJsxSerializeElements([
+        {
+            type: accordionType,
+            render: (props) => {
+                const { children } = props;
+                const element = props.element;
+                return renderAccordion({
+                    children,
+                    element,
+                });
+            },
+        },
+        {
+            type: titleType,
+            render: (props) => {
+                const { children, element } = props;
+                return renderAccordionTitle({
+                    children,
+                    element,
+                });
+            },
+        },
+        {
+            type: contentType,
+            render: (props) => {
+                const { children, element } = props;
+                return renderAccordionContent({
+                    children,
+                    element,
+                });
+            },
+        },
+    ]);
+}
+
+exports.createJsxSerializeAccordion = createJsxSerializeAccordion;
+exports.defaultRenderAccordionElements = defaultRenderAccordionElements;

package/accordion/jsx-serializer/index.js

@@ -0,0 +1,2 @@
+export { defaultRenderAccordionElements } from './defaultRenderAccordionElements.js';
+export { createJsxSerializeAccordion } from './createJsxSerializeAccordion.js';

package/accordion/jsx-serializer/package.json

@@ -1,10 +1,7 @@
 {
   "name": "@quadrats/react/accordion/jsx-serializer",
   "sideEffects": false,
-  "quadratsConfig": {
-    "deps": [
-      "jsx-serializer",
-      "accordion"
-    ]
-  }
+  "main": "./index.cjs.js",
+  "module": "./index.js",
+  "typings": "./index.d.ts"
 }

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

@@ -0,0 +1,4 @@
+import { AccordionElement, AccordionTypeKey, AccordionTitleTypeKey, AccordionContentTypeKey } from '@quadrats/common/accordion';
+import { JsxSerializeElementProps } from '@quadrats/react/jsx-serializer';
+export type JsxSerializeAccordionElementProps = JsxSerializeElementProps<AccordionElement>;
+export type AccordionJsxSerializeElements = Record<AccordionTypeKey, (props: JsxSerializeAccordionElementProps) => JSX.Element | null | undefined> & Record<AccordionTitleTypeKey, (props: JsxSerializeElementProps) => JSX.Element | null | undefined> & Record<AccordionContentTypeKey, (props: JsxSerializeElementProps) => JSX.Element | null | undefined>;

package/accordion/package.json

@@ -4,12 +4,7 @@
     "**/*.css",
     "**/*.scss"
   ],
-  "quadratsConfig": {
-    "deps": [
-      "__ROOT__"
-    ],
-    "styles": {
-      "accordion": "accordion"
-    }
-  }
+  "main": "./index.cjs.js",
+  "module": "./index.js",
+  "typings": "./index.d.ts"
 }

package/accordion/toolbar/AccordionToolbarIcon.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { ToolbarIconProps } from '@quadrats/react/toolbar';
+import { ReactAccordion } from '@quadrats/react/accordion';
+export interface AccordionToolbarIconProps extends Omit<ToolbarIconProps, 'active' | 'onClick'> {
+    controller: ReactAccordion;
+}
+declare function AccordionToolbarIcon(props: AccordionToolbarIconProps): React.JSX.Element;
+export default AccordionToolbarIcon;

package/accordion/toolbar/AccordionToolbarIcon.js

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

package/accordion/toolbar/index.cjs.js

@@ -0,0 +1,22 @@
+'use strict';
+
+var react = require('@quadrats/react');
+var tslib = require('tslib');
+var React = require('react');
+var toolbar = require('@quadrats/react/toolbar');
+
+function useAccordionTool(controller) {
+    const editor = react.useSlateStatic();
+    return {
+        onClick: () => controller.insertAccordion(editor),
+    };
+}
+
+function AccordionToolbarIcon(props) {
+    const { controller } = props, rest = tslib.__rest(props, ["controller"]);
+    const { onClick } = useAccordionTool(controller);
+    return React.createElement(toolbar.ToolbarIcon, Object.assign({}, rest, { onClick: onClick }));
+}
+
+exports.AccordionToolbarIcon = AccordionToolbarIcon;
+exports.useAccordionTool = useAccordionTool;

package/accordion/toolbar/index.d.ts

@@ -0,0 +1,2 @@
+export * from './useAccordionTool';
+export { AccordionToolbarIconProps, default as AccordionToolbarIcon } from './AccordionToolbarIcon';

package/accordion/toolbar/index.js

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

package/accordion/toolbar/package.json

@@ -1,10 +1,7 @@
 {
   "name": "@quadrats/react/accordion/toolbar",
   "sideEffects": false,
-  "quadratsConfig": {
-    "deps": [
-      "toolbar",
-      "accordion"
-    ]
-  }
+  "main": "./index.cjs.js",
+  "module": "./index.js",
+  "typings": "./index.d.ts"
 }

package/accordion/toolbar/useAccordionTool.d.ts

@@ -0,0 +1,4 @@
+import { ReactAccordion } from '@quadrats/react/accordion';
+export declare function useAccordionTool(controller: ReactAccordion): {
+    onClick: () => void;
+};

package/accordion/toolbar/useAccordionTool.js

@@ -0,0 +1,10 @@
+import { useSlateStatic } from '@quadrats/react';
+
+function useAccordionTool(controller) {
+    const editor = useSlateStatic();
+    return {
+        onClick: () => controller.insertAccordion(editor),
+    };
+}
+
+export { useAccordionTool };

package/accordion/typings.d.ts

@@ -0,0 +1,25 @@
+import { Editor } from '@quadrats/core';
+import { Accordion, AccordionElement, AccordionTypeKey, AccordionTitleTypeKey, AccordionContentTypeKey } from '@quadrats/common/accordion';
+import { WithCreateHandlers, WithCreateRenderElement, RenderElementProps } from '@quadrats/react';
+export type AccordionContextType = {
+    expanded: boolean;
+};
+export type RenderAccordionElementProps = RenderElementProps<AccordionElement>;
+export type AccordionRenderElements = Record<AccordionTypeKey, (props: {
+    attributes?: RenderElementProps['attributes'];
+    children: RenderElementProps['children'];
+    element: RenderAccordionElementProps['element'];
+}) => JSX.Element | null | undefined> & Record<AccordionTitleTypeKey, (props: {
+    attributes?: RenderElementProps['attributes'];
+    children: RenderElementProps['children'];
+    element: RenderElementProps['element'];
+}) => JSX.Element | null | undefined> & Record<AccordionContentTypeKey, (props: {
+    attributes?: RenderElementProps['attributes'];
+    children: RenderElementProps['children'];
+    element: RenderElementProps['element'];
+}) => JSX.Element | null | undefined>;
+export type ReactAccordionCreateRenderElementOptions = {
+    [K in AccordionTypeKey | AccordionTitleTypeKey | AccordionContentTypeKey]?: AccordionRenderElements[K];
+};
+export interface ReactAccordion extends Accordion<Editor>, WithCreateHandlers, WithCreateRenderElement<[ReactAccordionCreateRenderElementOptions?]> {
+}

package/align/constants.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Default hotkey for toggling align.
+ *
+ * @see [is-hotkey]{@link https://www.npmjs.com/package/is-hotkey}
+ */
+export declare const ALIGN_LEFT_HOTKEY = "mod+shift+l";
+export declare const ALIGN_CENTER_HOTKEY = "mod+shift+e";
+export declare const ALIGN_RIGHT_HOTKEY = "mod+shift+r";

package/align/constants.js

@@ -0,0 +1,10 @@
+/**
+ * Default hotkey for toggling align.
+ *
+ * @see [is-hotkey]{@link https://www.npmjs.com/package/is-hotkey}
+ */
+const ALIGN_LEFT_HOTKEY = 'mod+shift+l';
+const ALIGN_CENTER_HOTKEY = 'mod+shift+e';
+const ALIGN_RIGHT_HOTKEY = 'mod+shift+r';
+
+export { ALIGN_CENTER_HOTKEY, ALIGN_LEFT_HOTKEY, ALIGN_RIGHT_HOTKEY };

package/align/createReactAlign.d.ts

@@ -0,0 +1,2 @@
+import { ReactAlign } from './typings';
+export declare function createReactAlign(): ReactAlign;

package/align/createReactAlign.js

@@ -0,0 +1,26 @@
+import isHotkey from 'is-hotkey';
+import { createAlign } from '@quadrats/common/align';
+import { ALIGN_RIGHT_HOTKEY, ALIGN_LEFT_HOTKEY, ALIGN_CENTER_HOTKEY } from './constants.js';
+
+function createReactAlign() {
+    const core = createAlign();
+    return Object.assign(Object.assign({}, core), { createHandlers: ({ hotkeys = {} } = {}) => ({
+            onKeyDown: (event, editor, next) => {
+                const { left = ALIGN_LEFT_HOTKEY, center = ALIGN_CENTER_HOTKEY, right = ALIGN_RIGHT_HOTKEY } = hotkeys;
+                if (isHotkey(left, event)) {
+                    core.setAlign(editor, 'left');
+                }
+                else if (isHotkey(center, event)) {
+                    core.setAlign(editor, 'center');
+                }
+                else if (isHotkey(right, event)) {
+                    core.setAlign(editor, 'right');
+                }
+                else {
+                    next();
+                }
+            },
+        }) });
+}
+
+export { createReactAlign };

package/align/index.cjs.js

@@ -0,0 +1,39 @@
+'use strict';
+
+var isHotkey = require('is-hotkey');
+var align = require('@quadrats/common/align');
+
+/**
+ * Default hotkey for toggling align.
+ *
+ * @see [is-hotkey]{@link https://www.npmjs.com/package/is-hotkey}
+ */
+const ALIGN_LEFT_HOTKEY = 'mod+shift+l';
+const ALIGN_CENTER_HOTKEY = 'mod+shift+e';
+const ALIGN_RIGHT_HOTKEY = 'mod+shift+r';
+
+function createReactAlign() {
+    const core = align.createAlign();
+    return Object.assign(Object.assign({}, core), { createHandlers: ({ hotkeys = {} } = {}) => ({
+            onKeyDown: (event, editor, next) => {
+                const { left = ALIGN_LEFT_HOTKEY, center = ALIGN_CENTER_HOTKEY, right = ALIGN_RIGHT_HOTKEY } = hotkeys;
+                if (isHotkey(left, event)) {
+                    core.setAlign(editor, 'left');
+                }
+                else if (isHotkey(center, event)) {
+                    core.setAlign(editor, 'center');
+                }
+                else if (isHotkey(right, event)) {
+                    core.setAlign(editor, 'right');
+                }
+                else {
+                    next();
+                }
+            },
+        }) });
+}
+
+exports.ALIGN_CENTER_HOTKEY = ALIGN_CENTER_HOTKEY;
+exports.ALIGN_LEFT_HOTKEY = ALIGN_LEFT_HOTKEY;
+exports.ALIGN_RIGHT_HOTKEY = ALIGN_RIGHT_HOTKEY;
+exports.createReactAlign = createReactAlign;

package/align/index.js

@@ -0,0 +1,2 @@
+export { ALIGN_CENTER_HOTKEY, ALIGN_LEFT_HOTKEY, ALIGN_RIGHT_HOTKEY } from './constants.js';
+export { createReactAlign } from './createReactAlign.js';

package/align/package.json

@@ -1,9 +1,7 @@
 {
   "name": "@quadrats/react/align",
   "sideEffects": false,
-  "quadratsConfig": {
-    "deps": [
-      "__ROOT__"
-    ]
-  }
+  "main": "./index.cjs.js",
+  "module": "./index.js",
+  "typings": "./index.d.ts"
 }

package/align/toolbar/AlignToolbarIcon.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { ToolbarIconProps } from '@quadrats/react/toolbar';
+import { ReactAlign } from '@quadrats/react/align';
+import { AlignValue } from '@quadrats/common/align';
+export interface AlignToolbarIconProps extends Omit<ToolbarIconProps, 'active' | 'onClick'> {
+    controller: ReactAlign;
+    value: AlignValue;
+}
+declare function AlignToolbarIcon(props: AlignToolbarIconProps): React.JSX.Element;
+export default AlignToolbarIcon;