@quadrats/react 1.1.7 → 1.1.8

package/read-more/index.cjs.js

@@ -1,27 +0,0 @@
-'use strict';
-
-var React = require('react');
-var react = require('@quadrats/react');
-var readMore = require('@quadrats/common/read-more');
-
-function ReadMore(props) {
-    const { attributes } = props;
-    const { readMore } = react.useLocale().editor;
-    return (React.createElement("div", Object.assign({}, attributes, { className: "qdr-read-more", contentEditable: false }),
-        React.createElement("div", { className: "qdr-read-more__container" },
-            React.createElement("div", { className: "qdr-read-more__container__line" }),
-            React.createElement("span", { className: "qdr-read-more__container__description" }, readMore),
-            React.createElement("div", { className: "qdr-read-more__container__line" }))));
-}
-
-const defaultRenderReadMoreElement = (props) => React.createElement(ReadMore, Object.assign({}, props));
-
-function createReactReadMore(options = {}) {
-    const core = readMore.createReadMore(options);
-    const { type } = core;
-    return Object.assign(Object.assign({}, core), { createRenderElement: ({ render = defaultRenderReadMoreElement } = {}) => react.createRenderElement({ type, render }) });
-}
-
-exports.ReadMore = ReadMore;
-exports.createReactReadMore = createReactReadMore;
-exports.defaultRenderReadMoreElement = defaultRenderReadMoreElement;

package/read-more/index.js

@@ -1,3 +0,0 @@
-export { default as ReadMore } from './components/ReadMore.js';
-export { defaultRenderReadMoreElement } from './defaultRenderReadMoreElement.js';
-export { createReactReadMore } from './createReactReadMore.js';

package/read-more/jsx-serializer/createJsxSerializeReadMore.d.ts

@@ -1,4 +0,0 @@
-import { CreateJsxSerializeElementOptions } from '@quadrats/react/jsx-serializer';
-import { JsxSerializeReadMoreProps } from './typings';
-export type CreateJsxSerializeReadMoreOptions = Partial<CreateJsxSerializeElementOptions<JsxSerializeReadMoreProps>>;
-export declare function createJsxSerializeReadMore(options?: CreateJsxSerializeReadMoreOptions): (props: import("@quadrats/react/jsx-serializer").JsxSerializeElementProps) => import("react").JSX.Element | null | undefined;

package/read-more/jsx-serializer/createJsxSerializeReadMore.js

@@ -1,10 +0,0 @@
-import { READ_MORE_TYPE } from '@quadrats/common/read-more';
-import { createJsxSerializeElement } from '@quadrats/react/jsx-serializer';
-import { defaultRenderReadMoreElement } from '@quadrats/react/read-more';
-
-function createJsxSerializeReadMore(options = {}) {
-    const { type = READ_MORE_TYPE, render = defaultRenderReadMoreElement } = options;
-    return createJsxSerializeElement({ type, render });
-}
-
-export { createJsxSerializeReadMore };

package/read-more/jsx-serializer/index.cjs.js

@@ -1,13 +0,0 @@
-'use strict';
-
-var readMore = require('@quadrats/react/read-more');
-var readMore$1 = require('@quadrats/common/read-more');
-var jsxSerializer = require('@quadrats/react/jsx-serializer');
-
-function createJsxSerializeReadMore(options = {}) {
-    const { type = readMore$1.READ_MORE_TYPE, render = readMore.defaultRenderReadMoreElement } = options;
-    return jsxSerializer.createJsxSerializeElement({ type, render });
-}
-
-exports.defaultRenderReadMoreElement = readMore.defaultRenderReadMoreElement;
-exports.createJsxSerializeReadMore = createJsxSerializeReadMore;

package/read-more/jsx-serializer/index.js

@@ -1,2 +0,0 @@
-export { defaultRenderReadMoreElement } from '@quadrats/react/read-more';
-export { createJsxSerializeReadMore } from './createJsxSerializeReadMore.js';

package/read-more/jsx-serializer/typings.d.ts

@@ -1,3 +0,0 @@
-import { ReadMoreElement } from '@quadrats/common/read-more';
-import { JsxSerializeElementProps } from '@quadrats/react/jsx-serializer';
-export type JsxSerializeReadMoreProps = JsxSerializeElementProps<ReadMoreElement>;

package/read-more/read-more.css

@@ -1 +0,0 @@
-.qdr-read-more{position:relative;margin:var(--qdr-spacing-14) 0;width:100%;color:var(--qdr-divider);text-align:center}.qdr-read-more__container{display:flex;align-items:center;justify-content:space-between}.qdr-read-more__container__description{color:var(--qdr-text-secondary);position:relative;z-index:1;padding:0 var(--qdr-spacing-7);font-size:var(--qdr-typography-article-body2-font-size);line-height:var(--qdr-typography-article-body2-line-height);letter-spacing:var(--qdr-typography-article-body2-letter-spacing);font-weight:var(--qdr-typography-article-body2-font-weight)}.qdr-read-more__container__line{flex:1;height:2px;background-image:repeating-linear-gradient(to right, var(--qdr-border), var(--qdr-border) 10px, transparent 10px, transparent 15px)}

package/read-more/toolbar/ReadMoreToolbarIcon.d.ts

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

package/read-more/toolbar/ReadMoreToolbarIcon.js

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

package/read-more/toolbar/index.cjs.js

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

package/read-more/toolbar/index.d.ts

@@ -1,2 +0,0 @@
-export * from './useReadMoreTool';
-export { ReadMoreToolbarIconProps, default as ReadMoreToolbarIcon } from './ReadMoreToolbarIcon';

package/read-more/toolbar/index.js

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

package/read-more/toolbar/useReadMoreTool.d.ts

@@ -1,4 +0,0 @@
-import { ReactReadMore } from '@quadrats/react/read-more';
-export declare function useReadMoreTool(controller: ReactReadMore): {
-    onClick: () => void;
-};

package/read-more/toolbar/useReadMoreTool.js

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

package/read-more/typings.d.ts

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

package/strikethrough/constants.d.ts

@@ -1,6 +0,0 @@
-/**
- * Default hotkey for toggling strikethrough.
- *
- * @see [is-hotkey]{@link https://www.npmjs.com/package/is-hotkey}
- */
-export declare const STRIKETHROUGH_HOTKEY = "mod+opt+s";

package/strikethrough/constants.js

@@ -1,8 +0,0 @@
-/**
- * Default hotkey for toggling strikethrough.
- *
- * @see [is-hotkey]{@link https://www.npmjs.com/package/is-hotkey}
- */
-const STRIKETHROUGH_HOTKEY = 'mod+opt+s';
-
-export { STRIKETHROUGH_HOTKEY };

package/strikethrough/createReactStrikethrough.d.ts

@@ -1 +0,0 @@
-export declare const createReactStrikethrough: (variant?: string) => import("@quadrats/react/toggle-mark").ReactToggleMark;

package/strikethrough/createReactStrikethrough.js

@@ -1,11 +0,0 @@
-import { createStrikethrough } from '@quadrats/common/strikethrough';
-import { createReactToggleMarkCreator } from '@quadrats/react/toggle-mark';
-import { defaultRenderStrikethrough } from './defaultRenderStrikethrough.js';
-import { STRIKETHROUGH_HOTKEY } from './constants.js';
-
-const createReactStrikethrough = (variant) => createReactToggleMarkCreator(createStrikethrough(variant), {
-    hotkey: STRIKETHROUGH_HOTKEY,
-    render: defaultRenderStrikethrough,
-})();
-
-export { createReactStrikethrough };

package/strikethrough/defaultRenderStrikethrough.d.ts

@@ -1,3 +0,0 @@
-import React from 'react';
-import { RenderMarkPropsBase } from '@quadrats/react/_internal';
-export declare const defaultRenderStrikethrough: ({ children, leaf }: RenderMarkPropsBase<boolean>) => React.JSX.Element;

package/strikethrough/defaultRenderStrikethrough.js

@@ -1,7 +0,0 @@
-import React from 'react';
-import { STRIKETHROUGH_TYPE } from '@quadrats/common/strikethrough';
-
-const defaultRenderStrikethrough = ({ children, leaf }) => (React.createElement("del", { className: leaf.strikethroughVariant
-        ? `${STRIKETHROUGH_TYPE}.${leaf.strikethroughVariant}` : `${STRIKETHROUGH_TYPE}` }, children));
-
-export { defaultRenderStrikethrough };

package/strikethrough/index.cjs.js

@@ -1,24 +0,0 @@
-'use strict';
-
-var React = require('react');
-var strikethrough = require('@quadrats/common/strikethrough');
-var toggleMark = require('@quadrats/react/toggle-mark');
-
-/**
- * Default hotkey for toggling strikethrough.
- *
- * @see [is-hotkey]{@link https://www.npmjs.com/package/is-hotkey}
- */
-const STRIKETHROUGH_HOTKEY = 'mod+opt+s';
-
-const defaultRenderStrikethrough = ({ children, leaf }) => (React.createElement("del", { className: leaf.strikethroughVariant
-        ? `${strikethrough.STRIKETHROUGH_TYPE}.${leaf.strikethroughVariant}` : `${strikethrough.STRIKETHROUGH_TYPE}` }, children));
-
-const createReactStrikethrough = (variant) => toggleMark.createReactToggleMarkCreator(strikethrough.createStrikethrough(variant), {
-    hotkey: STRIKETHROUGH_HOTKEY,
-    render: defaultRenderStrikethrough,
-})();
-
-exports.STRIKETHROUGH_HOTKEY = STRIKETHROUGH_HOTKEY;
-exports.createReactStrikethrough = createReactStrikethrough;
-exports.defaultRenderStrikethrough = defaultRenderStrikethrough;

package/strikethrough/index.js

@@ -1,3 +0,0 @@
-export { STRIKETHROUGH_HOTKEY } from './constants.js';
-export { defaultRenderStrikethrough } from './defaultRenderStrikethrough.js';
-export { createReactStrikethrough } from './createReactStrikethrough.js';

package/strikethrough/jsx-serializer/createJsxSerializeStrikethrough.d.ts

@@ -1 +0,0 @@
-export declare const createJsxSerializeStrikethrough: (options?: import("@quadrats/react/toggle-mark/jsx-serializer").CreateJsxSerializeToggleMarkOptions) => (props: Omit<import("@quadrats/react/jsx-serializer").JsxSerializeMarkProps<boolean>, "mark">) => import("react").JSX.Element;

package/strikethrough/jsx-serializer/createJsxSerializeStrikethrough.js

@@ -1,10 +0,0 @@
-import { STRIKETHROUGH_TYPE } from '@quadrats/common/strikethrough';
-import { createJsxSerializeToggleMarkCreator } from '@quadrats/react/toggle-mark/jsx-serializer';
-import { defaultRenderStrikethrough } from '@quadrats/react/strikethrough';
-
-const createJsxSerializeStrikethrough = createJsxSerializeToggleMarkCreator({
-    type: STRIKETHROUGH_TYPE,
-    render: defaultRenderStrikethrough,
-});
-
-export { createJsxSerializeStrikethrough };

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

@@ -1,13 +0,0 @@
-'use strict';
-
-var strikethrough = require('@quadrats/react/strikethrough');
-var strikethrough$1 = require('@quadrats/common/strikethrough');
-var jsxSerializer = require('@quadrats/react/toggle-mark/jsx-serializer');
-
-const createJsxSerializeStrikethrough = jsxSerializer.createJsxSerializeToggleMarkCreator({
-    type: strikethrough$1.STRIKETHROUGH_TYPE,
-    render: strikethrough.defaultRenderStrikethrough,
-});
-
-exports.defaultRenderStrikethrough = strikethrough.defaultRenderStrikethrough;
-exports.createJsxSerializeStrikethrough = createJsxSerializeStrikethrough;

package/strikethrough/jsx-serializer/index.js

@@ -1,2 +0,0 @@
-export { defaultRenderStrikethrough } from '@quadrats/react/strikethrough';
-export { createJsxSerializeStrikethrough } from './createJsxSerializeStrikethrough.js';

package/strikethrough/typings.d.ts

@@ -1,5 +0,0 @@
-import { Text } from 'slate';
-export interface StrikethroughLeaf extends Text {
-    strikethrough: boolean;
-    strikethroughVariant?: string;
-}

package/table/components/ColumnDragButton.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-interface ColumnDragButtonProps {
-    columnIndex: number;
-    style?: React.CSSProperties;
-    onClick: (e: React.MouseEvent) => void;
-    checkIsTitleColumn: (columnIndex: number) => boolean;
-}
-export declare const COLUMN_DRAG_TYPE = "TABLE_COLUMN";
-export declare const ColumnDragButton: React.FC<ColumnDragButtonProps>;
-export {};

package/table/components/ColumnDragButton.js

@@ -1,41 +0,0 @@
-import React, { useRef, useEffect } from 'react';
-import { useDrag } from 'react-dnd';
-import { getEmptyImage } from 'react-dnd-html5-backend';
-import clsx from 'clsx';
-import { Icon } from '@quadrats/react/components';
-import { Drag } from '@quadrats/icons';
-import { useTableDragContext } from '../contexts/TableDragContext.js';
-
-const COLUMN_DRAG_TYPE = 'TABLE_COLUMN';
-const ColumnDragButton = ({ columnIndex, style, onClick, checkIsTitleColumn, }) => {
-    const buttonRef = useRef(null);
-    const { setDragState, setDropTargetIndex, setDragDirection } = useTableDragContext();
-    const isTitle = checkIsTitleColumn(columnIndex);
-    const [{ isDragging }, drag, preview] = useDrag(() => ({
-        type: COLUMN_DRAG_TYPE,
-        item: () => {
-            const dragItem = { columnIndex, isTitle };
-            setDragState({ type: 'column', columnIndex, isTitle });
-            return dragItem;
-        },
-        collect: (monitor) => ({
-            isDragging: monitor.isDragging(),
-        }),
-        end: () => {
-            setDragState(null);
-            setDropTargetIndex(null);
-            setDragDirection(null);
-        },
-    }), [columnIndex, isTitle, setDragState, setDropTargetIndex, setDragDirection]);
-    // 使用空白圖片作為 drag preview，避免顯示預設的拖曳圖像
-    useEffect(() => {
-        preview(getEmptyImage(), { captureDraggingState: true });
-    }, [preview]);
-    drag(buttonRef);
-    return (React.createElement("button", { ref: buttonRef, type: "button", contentEditable: false, style: style, onClick: onClick, title: "\u9EDE\u64CA\u958B\u555F\u9078\u55AE\uFF0C\u62D6\u66F3\u4EE5\u79FB\u52D5", className: clsx('qdr-table__cell-column-action', {
-            'qdr-table__cell-column-action--dragging': isDragging,
-        }) },
-        React.createElement(Icon, { icon: Drag, width: 20, height: 20 })));
-};
-
-export { COLUMN_DRAG_TYPE, ColumnDragButton };

package/table/components/RowDragButton.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-interface RowDragButtonProps {
-    rowIndex: number;
-    headerRowCount: number;
-    style?: React.CSSProperties;
-    onClick: (e: React.MouseEvent) => void;
-}
-export declare const ROW_DRAG_TYPE = "TABLE_ROW";
-export declare const RowDragButton: React.FC<RowDragButtonProps>;
-export {};

package/table/components/RowDragButton.js

@@ -1,42 +0,0 @@
-import React, { useRef, useEffect } from 'react';
-import { useDrag } from 'react-dnd';
-import { getEmptyImage } from 'react-dnd-html5-backend';
-import clsx from 'clsx';
-import { Icon } from '@quadrats/react/components';
-import { Drag } from '@quadrats/icons';
-import { useTableDragContext } from '../contexts/TableDragContext.js';
-
-const ROW_DRAG_TYPE = 'TABLE_ROW';
-const RowDragButton = ({ rowIndex, headerRowCount, style, onClick }) => {
-    const buttonRef = useRef(null);
-    const { setDragState, setDropTargetIndex, setDragDirection } = useTableDragContext();
-    // 判斷當前 row 是否在 header 中
-    const isInHeader = rowIndex < headerRowCount;
-    const [{ isDragging }, drag, preview] = useDrag(() => ({
-        type: ROW_DRAG_TYPE,
-        item: () => {
-            const dragItem = { rowIndex, isInHeader };
-            setDragState({ type: 'row', rowIndex, isInHeader });
-            return dragItem;
-        },
-        collect: (monitor) => ({
-            isDragging: monitor.isDragging(),
-        }),
-        end: () => {
-            setDragState(null);
-            setDropTargetIndex(null);
-            setDragDirection(null);
-        },
-    }), [rowIndex, isInHeader, setDragState, setDropTargetIndex, setDragDirection]);
-    // 使用空白圖片作為 drag preview，避免顯示預設的拖曳圖像
-    useEffect(() => {
-        preview(getEmptyImage(), { captureDraggingState: true });
-    }, [preview]);
-    drag(buttonRef);
-    return (React.createElement("button", { ref: buttonRef, type: "button", contentEditable: false, style: style, onClick: onClick, title: "\u9EDE\u64CA\u958B\u555F\u9078\u55AE\uFF0C\u62D6\u66F3\u4EE5\u79FB\u52D5", className: clsx('qdr-table__cell-row-action', {
-            'qdr-table__cell-row-action--dragging': isDragging,
-        }) },
-        React.createElement(Icon, { icon: Drag, width: 20, height: 20 })));
-};
-
-export { ROW_DRAG_TYPE, RowDragButton };

package/table/components/Table.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { RenderElementProps } from '@quadrats/react';
-import { RenderTableElementProps } from '../typings';
-declare function Table({ attributes, children, element, }: {
-    attributes?: RenderElementProps['attributes'];
-    children: RenderElementProps['children'];
-    element: RenderTableElementProps['element'];
-}): React.JSX.Element;
-export default Table;

package/table/components/Table.js

@@ -1,236 +0,0 @@
-import React, { useRef, useMemo, useCallback } from 'react';
-import { Element } from '@quadrats/core';
-import { TableActionsContext } from '../contexts/TableActionsContext.js';
-import { TableMetadataContext } from '../contexts/TableMetadataContext.js';
-import { TableStateContext } from '../contexts/TableStateContext.js';
-import { TableDragProvider } from '../contexts/TableDragContext.js';
-import { TABLE_ROW_TYPE, TABLE_CELL_TYPE, TABLE_DEFAULT_MAX_COLUMNS, TABLE_DEFAULT_MAX_ROWS } from '@quadrats/common/table';
-import { useTableActions } from '../hooks/useTableActions.js';
-import { Icon } from '@quadrats/react/components';
-import { Drag } from '@quadrats/icons';
-import { useTableStates } from '../hooks/useTableStates.js';
-import { getTableElements } from '../utils/helper.js';
-
-function Table({ attributes, children, element, }) {
-    const { addColumn, addRow, addColumnAndRow, deleteRow, deleteColumn, moveRowToBody, moveRowToHeader, unsetColumnAsTitle, setColumnAsTitle, pinColumn, pinRow, unpinColumn, unpinRow, moveOrSwapRow, moveOrSwapColumn, } = useTableActions(element);
-    const { tableSelectedOn, setTableSelectedOn, tableHoveredOn, setTableHoveredOn } = useTableStates();
-    const portalContainerRef = useRef(null);
-    const { columnCount, rowCount, normalCols, bodyCount, tableElements } = useMemo(() => {
-        const elements = getTableElements(element);
-        if (!elements.tableMainElement) {
-            return {
-                columnCount: 0,
-                rowCount: 0,
-                treatAsTitleCols: 0,
-                normalCols: 0,
-                bodyCount: 0,
-                headerCount: 0,
-                tableElements: elements,
-            };
-        }
-        const headerRowElements = elements.tableHeaderElement
-            ? elements.tableHeaderElement.children.filter((child) => Element.isElement(child) && child.type.includes(TABLE_ROW_TYPE))
-            : [];
-        const bodyRowElements = elements.tableBodyElement
-            ? elements.tableBodyElement.children.filter((child) => Element.isElement(child) && child.type.includes(TABLE_ROW_TYPE))
-            : [];
-        const cols = bodyRowElements.length > 0 && Element.isElement(bodyRowElements[0]) ? bodyRowElements[0].children.length : 0;
-        const treatAsTitleCols = bodyRowElements.length > 0 && Element.isElement(bodyRowElements[0])
-            ? bodyRowElements[0].children.filter((row) => (Element.isElement(row) ? row.treatAsTitle : false)).length
-            : 0;
-        const rows = headerRowElements.length + bodyRowElements.length;
-        return {
-            columnCount: cols,
-            rowCount: rows,
-            headerCount: headerRowElements.length,
-            bodyCount: bodyRowElements.length,
-            treatAsTitleCols,
-            normalCols: cols - treatAsTitleCols,
-            tableElements: elements,
-        };
-    }, [element]);
-    // 預計算所有 cell positions
-    const cellPositions = useMemo(() => {
-        const positions = new Map();
-        if (!tableElements.tableMainElement)
-            return positions;
-        const { tableHeaderElement, tableBodyElement } = tableElements;
-        let globalRowIndex = 0;
-        // Process header rows
-        if (tableHeaderElement && Element.isElement(tableHeaderElement)) {
-            for (const row of tableHeaderElement.children) {
-                if (Element.isElement(row) && row.type.includes(TABLE_ROW_TYPE)) {
-                    for (let colIndex = 0; colIndex < row.children.length; colIndex++) {
-                        const cell = row.children[colIndex];
-                        if (Element.isElement(cell) && cell.type.includes(TABLE_CELL_TYPE)) {
-                            positions.set(cell, {
-                                columnIndex: colIndex,
-                                rowIndex: globalRowIndex,
-                            });
-                        }
-                    }
-                    globalRowIndex++;
-                }
-            }
-        }
-        // Process body rows
-        if (tableBodyElement && Element.isElement(tableBodyElement)) {
-            for (const row of tableBodyElement.children) {
-                if (Element.isElement(row) && row.type.includes(TABLE_ROW_TYPE)) {
-                    for (let colIndex = 0; colIndex < row.children.length; colIndex++) {
-                        const cell = row.children[colIndex];
-                        if (Element.isElement(cell) && cell.type.includes(TABLE_CELL_TYPE)) {
-                            positions.set(cell, {
-                                columnIndex: colIndex,
-                                rowIndex: globalRowIndex,
-                            });
-                        }
-                    }
-                    globalRowIndex++;
-                }
-            }
-        }
-        return positions;
-    }, [tableElements]);
-    // 預計算 pinned columns 和 rows
-    const { pinnedColumns, pinnedRows } = useMemo(() => {
-        const columns = new Set();
-        const rows = new Set();
-        if (!tableElements.tableBodyElement)
-            return { pinnedColumns: columns, pinnedRows: rows };
-        const { tableHeaderElement, tableBodyElement } = tableElements;
-        // 檢查 pinned columns - 只需要檢查第一個 body row
-        if (Element.isElement(tableBodyElement) && tableBodyElement.children.length > 0) {
-            const firstBodyRow = tableBodyElement.children[0];
-            if (Element.isElement(firstBodyRow) && firstBodyRow.type.includes(TABLE_ROW_TYPE)) {
-                for (let colIndex = 0; colIndex < firstBodyRow.children.length; colIndex++) {
-                    const cell = firstBodyRow.children[colIndex];
-                    if (Element.isElement(cell) &&
-                        cell.type.includes(TABLE_CELL_TYPE) &&
-                        cell.treatAsTitle &&
-                        cell.pinned) {
-                        columns.add(colIndex);
-                    }
-                }
-            }
-        }
-        // 檢查 pinned rows - 只需要檢查 header rows
-        if (tableHeaderElement && Element.isElement(tableHeaderElement)) {
-            for (let rowIndex = 0; rowIndex < tableHeaderElement.children.length; rowIndex++) {
-                const row = tableHeaderElement.children[rowIndex];
-                if (Element.isElement(row) && row.type.includes(TABLE_ROW_TYPE)) {
-                    // 檢查這一行的所有 cells 是否都是 pinned
-                    const allCellsPinned = row.children.every((cell) => Element.isElement(cell) && cell.type.includes(TABLE_CELL_TYPE) && cell.pinned);
-                    if (allCellsPinned) {
-                        rows.add(rowIndex);
-                    }
-                }
-            }
-        }
-        return { pinnedColumns: columns, pinnedRows: rows };
-    }, [tableElements]);
-    const isReachMaximumColumns = useMemo(() => {
-        return columnCount >= TABLE_DEFAULT_MAX_COLUMNS;
-    }, [columnCount]);
-    const isReachMaximumRows = useMemo(() => {
-        return TABLE_DEFAULT_MAX_ROWS > 0 ? rowCount >= TABLE_DEFAULT_MAX_ROWS : false;
-    }, [rowCount]);
-    const isReachMinimumNormalColumns = useMemo(() => {
-        return normalCols <= 1;
-    }, [normalCols]);
-    const isReachMinimumBodyRows = useMemo(() => {
-        return bodyCount <= 1;
-    }, [bodyCount]);
-    const isColumnPinned = useCallback((columnIndex) => {
-        return pinnedColumns.has(columnIndex);
-    }, [pinnedColumns]);
-    const isRowPinned = useCallback((rowIndex) => {
-        return pinnedRows.has(rowIndex);
-    }, [pinnedRows]);
-    const actionsValue = useMemo(() => ({
-        addColumn,
-        addRow,
-        addColumnAndRow,
-        deleteRow,
-        deleteColumn,
-        moveRowToBody,
-        moveRowToHeader,
-        unsetColumnAsTitle,
-        setColumnAsTitle,
-        pinColumn,
-        pinRow,
-        unpinColumn,
-        unpinRow,
-        moveOrSwapRow,
-        moveOrSwapColumn,
-    }), [
-        addColumn,
-        addRow,
-        addColumnAndRow,
-        deleteRow,
-        deleteColumn,
-        moveRowToBody,
-        moveRowToHeader,
-        unsetColumnAsTitle,
-        setColumnAsTitle,
-        pinColumn,
-        pinRow,
-        unpinColumn,
-        unpinRow,
-        moveOrSwapRow,
-        moveOrSwapColumn,
-    ]);
-    const metadataValue = useMemo(() => ({
-        tableElement: element,
-        columnCount,
-        rowCount,
-        portalContainerRef,
-        isReachMaximumColumns,
-        isReachMaximumRows,
-        isReachMinimumNormalColumns,
-        isReachMinimumBodyRows,
-        pinnedColumns,
-        pinnedRows,
-        cellPositions,
-        isColumnPinned,
-        isRowPinned,
-    }), [
-        element,
-        columnCount,
-        rowCount,
-        portalContainerRef,
-        isReachMaximumColumns,
-        isReachMaximumRows,
-        isReachMinimumNormalColumns,
-        isReachMinimumBodyRows,
-        pinnedColumns,
-        pinnedRows,
-        cellPositions,
-        isColumnPinned,
-        isRowPinned,
-    ]);
-    const stateValue = useMemo(() => ({
-        tableSelectedOn,
-        setTableSelectedOn,
-        tableHoveredOn,
-        setTableHoveredOn,
-    }), [tableSelectedOn, setTableSelectedOn, tableHoveredOn, setTableHoveredOn]);
-    return (React.createElement(TableDragProvider, null,
-        React.createElement(TableActionsContext.Provider, { value: actionsValue },
-            React.createElement(TableMetadataContext.Provider, { value: metadataValue },
-                React.createElement(TableStateContext.Provider, { value: stateValue },
-                    React.createElement("div", Object.assign({}, attributes, { className: "qdr-table" }),
-                        children,
-                        React.createElement("button", { type: "button", onClick: (evt) => {
-                                evt.preventDefault();
-                                evt.stopPropagation();
-                                setTableSelectedOn((prev) => ((prev === null || prev === void 0 ? void 0 : prev.region) === 'table' ? undefined : { region: 'table' }));
-                            }, onMouseDown: (evt) => {
-                                evt.preventDefault();
-                                evt.stopPropagation();
-                            }, className: "qdr-table__selection", title: (tableSelectedOn === null || tableSelectedOn === void 0 ? void 0 : tableSelectedOn.region) === 'table' ? 'Deselect Table' : 'Select Table' },
-                            React.createElement(Icon, { icon: Drag, width: 20, height: 20 })),
-                        React.createElement("div", { ref: portalContainerRef, className: "qdr-table__portal-container", "data-slate-editor": false, contentEditable: false })))))));
-}
-
-export { Table as default };

package/table/components/TableBody.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-import { RenderElementProps } from '@quadrats/react';
-import { TableElement } from '@quadrats/common/table';
-declare function TableBody(props: RenderElementProps<TableElement>): React.JSX.Element;
-export default TableBody;