@quadrats/react 1.1.8 → 1.1.9

package/accordion/toolbar/tsconfig.build.json

@@ -1,5 +0,0 @@
-{
-  "extends": "../../../../tsconfig.base.json",
-  "exclude": ["**/*.spec.*"],
-  "include": ["./src"]
-}

package/accordion/tsconfig.build.json

@@ -1,5 +0,0 @@
-{
-  "extends": "../../../tsconfig.base.json",
-  "exclude": ["**/*.spec.*"],
-  "include": ["./src"]
-}

package/align/src/constants.ts

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

package/align/src/createReactAlign.ts

@@ -1,27 +0,0 @@
-import isHotkey from 'is-hotkey';
-import { createAlign } from '@quadrats/common/align';
-import { ALIGN_LEFT_HOTKEY, ALIGN_CENTER_HOTKEY, ALIGN_RIGHT_HOTKEY } from './constants';
-import { ReactAlign } from './typings';
-
-export function createReactAlign(): ReactAlign {
-  const core = createAlign();
-
-  return {
-    ...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();
-        }
-      },
-    }),
-  };
-}

package/align/src/typings.ts

@@ -1,20 +0,0 @@
-import { Align, AlignValue } from '@quadrats/common/align';
-import { Editor } from '@quadrats/core';
-import { Handlers } from '@quadrats/react';
-
-export interface AlignLeaf {
-  align?: AlignValue;
-  alignVariant?: string;
-}
-
-export interface ReactAlignCreateHandlersOptions {
-  hotkeys?: {
-    left?: string;
-    center?: string;
-    right?: string;
-  };
-}
-
-export interface ReactAlign<E extends Editor = Editor> extends Align<E> {
-  createHandlers: (options?: ReactAlignCreateHandlersOptions) => Handlers;
-}

package/align/toolbar/src/AlignToolbarIcon.tsx

@@ -1,19 +0,0 @@
-import React from 'react';
-import { ToolbarIcon, ToolbarIconProps } from '@quadrats/react/toolbar';
-import { ReactAlign } from '@quadrats/react/align';
-import { AlignValue } from '@quadrats/common/align';
-import { useAlignTool } from './useAlignTool';
-
-export interface AlignToolbarIconProps extends Omit<ToolbarIconProps, 'active' | 'onClick'> {
-  controller: ReactAlign;
-  value: AlignValue;
-}
-
-function AlignToolbarIcon(props: AlignToolbarIconProps) {
-  const { controller, value, ...rest } = props;
-  const { active, onClick } = useAlignTool(controller, value);
-
-  return <ToolbarIcon {...rest} active={active} onClick={onClick} />;
-}
-
-export default AlignToolbarIcon;

package/align/toolbar/src/index.ts

@@ -1,3 +0,0 @@
-export * from './useAlignTool';
-
-export { AlignToolbarIconProps, default as AlignToolbarIcon } from './AlignToolbarIcon';

package/align/toolbar/src/useAlignTool.ts

@@ -1,18 +0,0 @@
-import { useQuadrats } from '@quadrats/react';
-import { ReactAlign } from '@quadrats/react/align';
-import { AlignValue } from '@quadrats/common/align';
-
-export function useAlignTool(controller: ReactAlign, value: AlignValue) {
-  const editor = useQuadrats();
-
-  return {
-    active: controller.isAlignActive(editor, value),
-    onClick: () => {
-      if (controller.isAlignActive(editor, value)) {
-        controller.removeAlign(editor);
-      } else {
-        controller.setAlign(editor, value);
-      }
-    },
-  };
-}

package/align/toolbar/tsconfig.build.json

@@ -1,5 +0,0 @@
-{
-  "extends": "../../../../tsconfig.base.json",
-  "exclude": ["**/*.spec.*"],
-  "include": ["./src"]
-}

package/align/tsconfig.build.json

@@ -1,5 +0,0 @@
-{
-  "extends": "../../../tsconfig.base.json",
-  "exclude": ["**/*.spec.*"],
-  "include": ["./src"]
-}

package/blockquote/jsx-serializer/src/createJsxSerializeBlockquote.ts

@@ -1,14 +0,0 @@
-import { BLOCKQUOTE_TYPE } from '@quadrats/common/blockquote';
-import { createJsxSerializeElement, CreateJsxSerializeElementOptions } from '@quadrats/react/jsx-serializer';
-import { defaultRenderBlockquoteElement } from './defaultRenderBlockquoteElement';
-import { JsxSerializeBlockquoteElementProps } from './typings';
-
-export type CreateJsxSerializeBlockquoteOptions = Partial<
-CreateJsxSerializeElementOptions<JsxSerializeBlockquoteElementProps>
->;
-
-export function createJsxSerializeBlockquote(options: CreateJsxSerializeBlockquoteOptions = {}) {
-  const { type = BLOCKQUOTE_TYPE, render = defaultRenderBlockquoteElement } = options;
-
-  return createJsxSerializeElement<JsxSerializeBlockquoteElementProps>({ type, render });
-}

package/blockquote/jsx-serializer/src/typings.ts

@@ -1,4 +0,0 @@
-import { BlockquoteElement } from '@quadrats/common/blockquote';
-import { JsxSerializeElementProps } from '@quadrats/react/jsx-serializer';
-
-export type JsxSerializeBlockquoteElementProps = JsxSerializeElementProps<BlockquoteElement>;

package/blockquote/jsx-serializer/tsconfig.build.json

@@ -1,5 +0,0 @@
-{
-  "extends": "../../../../tsconfig.base.json",
-  "exclude": ["**/*.spec.*"],
-  "include": ["./src"]
-}

package/blockquote/src/ReactBlockquote.spec.tsx

@@ -1,42 +0,0 @@
-/** @jsx jsx */
-
-import { parseHotkey } from 'is-hotkey';
-import { pipe } from '@quadrats/utils';
-import { createReactEditor } from '@quadrats/react';
-import { expectEditorEqualOutput, jsx, withTest } from '../../../../__fixtures__/hyperscript';
-import { BLOCKQUOTE_HOTKEY, createReactBlockquote } from '.';
-
-const Blockquote = createReactBlockquote();
-const handlers = Blockquote.createHandlers();
-
-describe('handlers', () => {
-  it('should trigger toggling on hotkey', () => {
-    const input = (
-      <editor>
-        <hp>
-          fo
-          <cursor />
-          o
-        </hp>
-      </editor>
-    );
-
-    const output = (
-      <editor>
-        <hblockquote>
-          fo
-          <cursor />
-          o
-        </hblockquote>
-      </editor>
-    );
-
-    const hotkey = parseHotkey(BLOCKQUOTE_HOTKEY);
-    const event = new KeyboardEvent('keydown', hotkey);
-    const editor = pipe(createReactEditor(), Blockquote.with, withTest(input));
-
-    handlers.onKeyDown?.(event as any, editor, () => {});
-
-    expectEditorEqualOutput(editor, output);
-  });
-});

package/blockquote/src/constants.ts

@@ -1,6 +0,0 @@
-/**
- * Default hotkey for toggling blockquote.
- *
- * @see [is-hotkey]{@link https://www.npmjs.com/package/is-hotkey}
- */
-export const BLOCKQUOTE_HOTKEY = 'ctrl+opt+q';

package/blockquote/src/createReactBlockquote.ts

@@ -1,105 +0,0 @@
-import isHotkey from 'is-hotkey';
-import { CreateBlockquoteOptions, createBlockquote } from '@quadrats/common/blockquote';
-import { createRenderElement } from '@quadrats/react';
-import { COMMON_SOFT_BREAK_HOTKEY, createOnKeyDownBreak } from '@quadrats/react/line-break';
-import { ReactBlockquote } from './typings';
-import { BLOCKQUOTE_HOTKEY } from './constants';
-import { defaultRenderBlockquoteElement } from './defaultRenderBlockquoteElement';
-import {
-  Editor,
-  getNodesByTypes,
-  ParagraphElement,
-  PARAGRAPH_TYPE,
-  QuadratsText,
-  Transforms,
-  Path,
-} from '@quadrats/core';
-
-export type CreateReactBlockquoteOptions = CreateBlockquoteOptions;
-
-export const BLOCKQUOTE_EXIT_BREAK_HOTKEY = 'enter';
-
-export function createReactBlockquote(options: CreateReactBlockquoteOptions = {}): ReactBlockquote {
-  const core = createBlockquote(options);
-  const { type } = core;
-  const onKeyDownBreak = createOnKeyDownBreak({
-    exitBreak: {
-      rules: [
-        {
-          hotkey: BLOCKQUOTE_EXIT_BREAK_HOTKEY,
-          match: {
-            includeTypes: [type],
-          },
-        },
-      ],
-    },
-    softBreak: {
-      rules: [
-        {
-          hotkey: COMMON_SOFT_BREAK_HOTKEY,
-          match: {
-            includeTypes: [type],
-          },
-        },
-      ],
-    },
-  });
-
-  return {
-    ...core,
-    createHandlers: ({ hotkey = BLOCKQUOTE_HOTKEY } = {}) => ({
-      onKeyDown: (event, editor, next) => {
-        if (isHotkey(hotkey, event)) {
-          core.toggleBlockquote(editor);
-        } else {
-          if (editor.selection) {
-            const [highestIsQuote] = getNodesByTypes(editor, [type], { mode: 'highest' });
-            const [selectInParagraph] = getNodesByTypes(editor, [PARAGRAPH_TYPE], { at: editor.selection });
-
-            if (isHotkey(BLOCKQUOTE_EXIT_BREAK_HOTKEY, event)) {
-              if (highestIsQuote && selectInParagraph) {
-                const [, quotePath] = highestIsQuote;
-                const isEnd = Editor.isEnd(editor, Editor.point(editor, editor.selection), quotePath);
-
-                const [paragraphNode] = selectInParagraph;
-                const text = ((paragraphNode as ParagraphElement).children[0] as QuadratsText).text;
-                const isEmptyParagraph = text.length === 0;
-
-                // move out the empty paragraph if end of the quote
-                if (isEnd && isEmptyParagraph) {
-                  event.preventDefault();
-                  const moveto = quotePath.slice();
-
-                  moveto[quotePath.length - 1] += 1;
-                  Transforms.moveNodes(editor, {
-                    at: editor.selection,
-                    to: moveto,
-                  });
-
-                  return;
-                }
-              }
-            } else if (event.key === 'Backspace') {
-              if (highestIsQuote && selectInParagraph) {
-                const [, quotePath] = highestIsQuote;
-                const [paragraphNode, currentPath] = selectInParagraph;
-                const isFirst = Path.equals(currentPath, quotePath.concat(0));
-                const text = ((paragraphNode as ParagraphElement).children[0] as QuadratsText).text;
-
-                if (isFirst && !text) {
-                  event.preventDefault();
-                  core.toggleBlockquote(editor);
-
-                  return;
-                }
-              }
-            }
-          }
-
-          onKeyDownBreak(event, editor, next);
-        }
-      },
-    }),
-    createRenderElement: ({ render = defaultRenderBlockquoteElement } = {}) => createRenderElement({ type, render }),
-  };
-}

package/blockquote/src/defaultRenderBlockquoteElement.tsx

@@ -1,15 +0,0 @@
-import React from 'react';
-import { RenderElementProps } from '@quadrats/react';
-
-export const defaultRenderBlockquoteElement = ({
-  attributes,
-  children,
-}: {
-  attributes?: RenderElementProps['attributes'];
-  children: RenderElementProps['children'];
-}) => (
-  <blockquote {...attributes} className="qdr-blockquote">
-    <div className="qdr-blockquote__line" />
-    {children}
-  </blockquote>
-);

package/blockquote/src/typings.ts

@@ -1,22 +0,0 @@
-import { JSX } from 'react';
-import { BlockquoteElement, Blockquote } from '@quadrats/common/blockquote';
-import { Editor } from '@quadrats/core';
-import { WithCreateHandlers, WithCreateRenderElement, RenderElementProps } from '@quadrats/react';
-
-export type RenderBlockquoteElementProps = RenderElementProps<BlockquoteElement>;
-
-export interface ReactBlockquoteCreateHandlersOptions {
-  /**
-   * The hotkey to toggle blockquote.
-   */
-  hotkey?: string;
-}
-
-export interface ReactBlockquoteCreateRenderElementOptions {
-  render?: (props: RenderBlockquoteElementProps) => JSX.Element | null | undefined;
-}
-
-export interface ReactBlockquote
-  extends Blockquote<Editor>,
-  WithCreateHandlers<[ReactBlockquoteCreateHandlersOptions?]>,
-  WithCreateRenderElement<[ReactBlockquoteCreateRenderElementOptions?]> {}

package/blockquote/toolbar/src/BlockquoteToolbarIcon.tsx

@@ -1,17 +0,0 @@
-import React from 'react';
-import { ToolbarIcon, ToolbarIconProps } from '@quadrats/react/toolbar';
-import { ReactBlockquote } from '@quadrats/react/blockquote';
-import { useBlockquoteTool } from './useBlockquoteTool';
-
-export interface BlockquoteToolbarIconProps extends Omit<ToolbarIconProps, 'active' | 'onClick'> {
-  controller: ReactBlockquote;
-}
-
-function BlockquoteToolbarIcon(props: BlockquoteToolbarIconProps) {
-  const { controller, ...rest } = props;
-  const { active, onClick } = useBlockquoteTool(controller);
-
-  return <ToolbarIcon {...rest} active={active} onClick={onClick} />;
-}
-
-export default BlockquoteToolbarIcon;

package/blockquote/toolbar/src/useBlockquoteTool.ts

@@ -1,11 +0,0 @@
-import { useQuadrats } from '@quadrats/react';
-import { ReactBlockquote } from '@quadrats/react/blockquote';
-
-export function useBlockquoteTool(controller: ReactBlockquote) {
-  const editor = useQuadrats();
-
-  return {
-    active: controller.isSelectionInBlockquote(editor),
-    onClick: () => controller.toggleBlockquote(editor),
-  };
-}

package/blockquote/toolbar/tsconfig.build.json

@@ -1,5 +0,0 @@
-{
-  "extends": "../../../../tsconfig.base.json",
-  "exclude": ["**/*.spec.*"],
-  "include": ["./src"]
-}

package/blockquote/tsconfig.build.json

@@ -1,5 +0,0 @@
-{
-  "extends": "../../../tsconfig.base.json",
-  "exclude": ["**/*.spec.*"],
-  "include": ["./src"]
-}

package/bold/jsx-serializer/src/createJsxSerializeBold.ts

@@ -1,8 +0,0 @@
-import { BOLD_TYPE } from '@quadrats/common/bold';
-import { createJsxSerializeToggleMarkCreator } from '@quadrats/react/toggle-mark/jsx-serializer';
-import { defaultRenderBold } from './defaultRenderBold';
-
-export const createJsxSerializeBold = createJsxSerializeToggleMarkCreator({
-  type: BOLD_TYPE,
-  render: defaultRenderBold,
-});

package/bold/jsx-serializer/tsconfig.build.json

@@ -1,5 +0,0 @@
-{
-  "extends": "../../../../tsconfig.base.json",
-  "exclude": ["**/*.spec.*"],
-  "include": ["./src"]
-}

package/bold/src/constants.ts

@@ -1,6 +0,0 @@
-/**
- * Default hotkey for toggling bold.
- *
- * @see [is-hotkey]{@link https://www.npmjs.com/package/is-hotkey}
- */
-export const BOLD_HOTKEY = 'mod+b';

package/bold/src/createReactBold.ts

@@ -1,11 +0,0 @@
-import { createBold } from '@quadrats/common/bold';
-import { createReactToggleMarkCreator } from '@quadrats/react/toggle-mark';
-import { BOLD_HOTKEY } from './constants';
-import { defaultRenderBold } from './defaultRenderBold';
-
-export const createReactBold = (variant?: string) => createReactToggleMarkCreator(
-  createBold(variant), {
-    hotkey: BOLD_HOTKEY,
-    render: defaultRenderBold,
-  },
-)();

package/bold/src/defaultRenderBold.tsx

@@ -1,12 +0,0 @@
-import React from 'react';
-import { BOLD_TYPE } from '@quadrats/common/bold';
-import { RenderMarkPropsBase } from '@quadrats/react/_internal';
-import { BoldLeaf } from './typings';
-
-export const defaultRenderBold = ({ children, leaf }: RenderMarkPropsBase<boolean>) => (
-  <strong className={(leaf as BoldLeaf).boldVariant
-    ? `${BOLD_TYPE}.${(leaf as BoldLeaf).boldVariant}` : `${BOLD_TYPE}`}
-  >
-    {children}
-  </strong>
-);

package/bold/src/typings.ts

@@ -1,6 +0,0 @@
-import { Text } from 'slate';
-
-export interface BoldLeaf extends Text {
-  bold: boolean;
-  boldVariant?: string;
-}

package/bold/tsconfig.build.json

@@ -1,5 +0,0 @@
-{
-  "extends": "../../../tsconfig.base.json",
-  "exclude": ["**/*.spec.*"],
-  "include": ["./src"]
-}

package/card/jsx-serializer/src/createJsxSerializeCard.ts

@@ -1,65 +0,0 @@
-/* eslint-disable @typescript-eslint/naming-convention */
-import { WithElementParent } from '@quadrats/core/serializers';
-import { CardElement, CardTypeKey, CardImageTypeKey, CardContentsTypeKey, CARD_TYPES } from '@quadrats/common/card';
-import { CreateJsxSerializeElementOptions, createJsxSerializeElements } from '@quadrats/react/jsx-serializer';
-import { defaultRenderCardElements } from './defaultRenderCardElements';
-import {
-  JsxSerializeCardElementProps,
-  JsxSerializeCardImageElementProps,
-  JsxSerializeCardContentsElementProps,
-} from './typings';
-
-export type CreateJsxSerializeCardOptions = Partial<
-  Record<CardTypeKey, Partial<CreateJsxSerializeElementOptions<JsxSerializeCardElementProps>>> &
-    Record<CardImageTypeKey, Partial<CreateJsxSerializeElementOptions<JsxSerializeCardImageElementProps>>> &
-    Record<CardContentsTypeKey, Partial<CreateJsxSerializeElementOptions<JsxSerializeCardContentsElementProps>>>
->;
-
-export function createJsxSerializeCard(options: CreateJsxSerializeCardOptions = {}) {
-  const { card = {}, card_image = {}, card_contents = {} } = options;
-
-  const cardType = card.type || CARD_TYPES.card;
-  const imageType = card_image.type || CARD_TYPES.card_image;
-  const contentsType = card_contents.type || CARD_TYPES.card_contents;
-
-  const renderCard = card.render || defaultRenderCardElements.card;
-  const renderCardImage = card_image.render || defaultRenderCardElements.card_image;
-  const renderCardContents = card_contents.render || defaultRenderCardElements.card_contents;
-
-  return createJsxSerializeElements([
-    {
-      type: cardType,
-      render: (props) => {
-        const { children } = props;
-        const element = props.element as CardElement & WithElementParent;
-
-        return renderCard({
-          children,
-          element,
-        });
-      },
-    },
-    {
-      type: imageType,
-      render: (props) => {
-        const { children, element } = props as JsxSerializeCardImageElementProps;
-
-        return renderCardImage({
-          children,
-          element,
-        });
-      },
-    },
-    {
-      type: contentsType,
-      render: (props) => {
-        const { children, element } = props as JsxSerializeCardContentsElementProps;
-
-        return renderCardContents({
-          children,
-          element,
-        });
-      },
-    },
-  ]);
-}

package/card/jsx-serializer/src/defaultRenderCardElements.tsx

@@ -1,9 +0,0 @@
-import React from 'react';
-import { CardWithoutToolbar, CardImage, CardContents } from '@quadrats/react/card';
-import { CardJsxSerializeElements } from './typings';
-
-export const defaultRenderCardElements: CardJsxSerializeElements = {
-  card: (props) => <CardWithoutToolbar {...props} />,
-  card_image: (props) => <CardImage {...props} />,
-  card_contents: (props) => <CardContents {...props} />,
-};

package/card/jsx-serializer/src/typings.ts

@@ -1,20 +0,0 @@
-import {
-  CardElement,
-  CardImageElement,
-  CardContentsElement,
-  CardTypeKey,
-  CardImageTypeKey,
-  CardContentsTypeKey,
-} from '@quadrats/common/card';
-import { JsxSerializeElementProps } from '@quadrats/react/jsx-serializer';
-
-export interface JsxSerializeCardElementProps extends JsxSerializeElementProps<CardElement> {}
-export interface JsxSerializeCardImageElementProps extends JsxSerializeElementProps<CardImageElement> {}
-export interface JsxSerializeCardContentsElementProps extends JsxSerializeElementProps<CardContentsElement> {}
-
-export type CardJsxSerializeElements = Record<
-  CardTypeKey,
-  (props: JsxSerializeCardElementProps) => JSX.Element | null | undefined
-> &
-  Record<CardImageTypeKey, (props: JsxSerializeCardImageElementProps) => JSX.Element | null | undefined> &
-  Record<CardContentsTypeKey, (props: JsxSerializeCardContentsElementProps) => JSX.Element | null | undefined>;

package/card/jsx-serializer/tsconfig.build.json

@@ -1,5 +0,0 @@
-{
-  "extends": "../../../../tsconfig.base.json",
-  "exclude": ["**/*.spec.*"],
-  "include": ["./src"]
-}