@a3s-lab/office 0.1.0 → 0.2.2

package/dist/0~2582.js

@@ -0,0 +1,485 @@
+import { Extension } from "@tiptap/core";
+import { TableCell, TableHeader, TableRow } from "@tiptap/extension-table";
+import { NodeSelection } from "@tiptap/pm/state";
+import { CellSelection } from "@tiptap/pm/tables";
+import { renderDocumentTableBorders, setSelectedDocumentTableBorders, normalizeTableColor, uniformDocumentTableBorder, documentTableBordersFromElement, normalizeDocumentTableBorderWidth, normalizeDocumentTableBorderStyle, documentTableBordersFromAttributes, normalizeDocumentTableCellMarginOverrides, renderDocumentTableCellMarginOverrides, documentTableCellMarginOverridesFromElement, uniformDocumentTableBorders } from "./0~4750.js";
+const DOCUMENT_TABLE_STYLE_OPTIONS = [
+    {
+        id: 'grid',
+        label: '网格',
+        headerColor: '#f1f4f9',
+        bodyColor: '#ffffff',
+        alternateColor: '#ffffff',
+        borderColor: '#cfd5df',
+        borderStyle: 'solid',
+        borderWidth: 1
+    },
+    {
+        id: 'blueStripe',
+        label: '蓝色条纹',
+        headerColor: '#d9eaf7',
+        bodyColor: '#ffffff',
+        alternateColor: '#f7fbff',
+        borderColor: '#9fbad0',
+        borderStyle: 'solid',
+        borderWidth: 1
+    },
+    {
+        id: 'greenStripe',
+        label: '绿色条纹',
+        headerColor: '#ddeee7',
+        bodyColor: '#ffffff',
+        alternateColor: '#f4faf7',
+        borderColor: '#abc8be',
+        borderStyle: 'solid',
+        borderWidth: 1
+    },
+    {
+        id: 'grayStripe',
+        label: '灰色条纹',
+        headerColor: '#e7e9ed',
+        bodyColor: '#ffffff',
+        alternateColor: '#f6f7f9',
+        borderColor: '#b9c0ca',
+        borderStyle: 'solid',
+        borderWidth: 1
+    },
+    {
+        id: 'clean',
+        label: '简洁',
+        headerColor: '#f1f4f9',
+        bodyColor: '#ffffff',
+        alternateColor: '#ffffff',
+        borderColor: '#cfd5df',
+        borderStyle: 'none',
+        borderWidth: 0
+    }
+];
+const DEFAULT_DOCUMENT_TABLE_CELL_FORMAT = {
+    backgroundColor: '#ffffff',
+    verticalAlign: 'top',
+    borderColor: '#cfd5df',
+    borderStyle: 'solid',
+    borderWidth: 1,
+    borders: uniformDocumentTableBorders({
+        color: '#cfd5df',
+        style: 'solid',
+        width: 1
+    }),
+    margins: null
+};
+const DEFAULT_DOCUMENT_TABLE_HEADER_FORMAT = {
+    ...DEFAULT_DOCUMENT_TABLE_CELL_FORMAT,
+    backgroundColor: '#f1f4f9'
+};
+const DocumentTableCell = TableCell.extend({
+    addAttributes () {
+        return {
+            ...this.parent?.(),
+            ...documentTableCellAttributes(DEFAULT_DOCUMENT_TABLE_CELL_FORMAT)
+        };
+    }
+});
+const DocumentTableHeader = TableHeader.extend({
+    addAttributes () {
+        return {
+            ...this.parent?.(),
+            ...documentTableCellAttributes(DEFAULT_DOCUMENT_TABLE_HEADER_FORMAT)
+        };
+    }
+});
+const DocumentTableFormatting = Extension.create({
+    name: 'documentTableFormatting',
+    addCommands () {
+        return {
+            setDocumentTableCellFormat: (format)=>(props)=>setSelectedCellFormat(props, format),
+            setDocumentTableHorizontalAlignment: (alignment)=>(props)=>setSelectedCellAlignment(props, alignment),
+            applyDocumentTableStyle: (style)=>(props)=>applyTableStyle(props, style),
+            setDocumentTableBorders: (target, border)=>(props)=>setSelectedDocumentTableBorders(props, target, border)
+        };
+    }
+});
+function documentTableCellFormat(state) {
+    const position = selectedTableCellPositions(state.selection)[0];
+    const node = void 0 === position ? null : state.doc.nodeAt(position);
+    return node && isTableCell(node) ? formatFromAttributes(node.attrs) : null;
+}
+function documentTableHorizontalAlignment(state) {
+    const position = selectedTableCellPositions(state.selection)[0];
+    const cell = void 0 === position ? null : state.doc.nodeAt(position);
+    let alignment = 'left';
+    cell?.descendants((node)=>{
+        if ('paragraph' !== node.type.name && 'heading' !== node.type.name) return true;
+        if ('center' === node.attrs.textAlign || 'right' === node.attrs.textAlign) alignment = node.attrs.textAlign;
+        return false;
+    });
+    return alignment;
+}
+function activeDocumentTableStyle(state) {
+    const context = selectedTable(state.selection);
+    if (!context) return null;
+    for (const style of DOCUMENT_TABLE_STYLE_OPTIONS){
+        let matches = true;
+        context.node.forEach((row, _rowOffset, rowIndex)=>{
+            row.forEach((cell)=>{
+                const expected = tableStyleCellFormat(style, cell, rowIndex);
+                const actual = formatFromAttributes(cell.attrs);
+                const expectedBorder = {
+                    color: style.borderColor,
+                    style: style.borderStyle,
+                    width: style.borderWidth
+                };
+                const actualBorder = uniformDocumentTableBorder(actual.borders);
+                if (expected.backgroundColor !== actual.backgroundColor || !actualBorder || actualBorder.color !== expectedBorder.color || actualBorder.style !== expectedBorder.style || actualBorder.width !== expectedBorder.width) matches = false;
+            });
+        });
+        if (matches) return style.id;
+    }
+    return null;
+}
+function documentTableCellAttributes(defaults) {
+    return {
+        backgroundColor: {
+            default: defaults.backgroundColor,
+            parseHTML: (element)=>normalizeTableColor(element.dataset.officeCellFill || element.style.backgroundColor) ?? defaults.backgroundColor,
+            renderHTML: (attributes)=>{
+                const color = normalizeTableColor(String(attributes.backgroundColor ?? '')) ?? defaults.backgroundColor;
+                return {
+                    'data-office-cell-fill': color,
+                    style: `background-color: ${color}`
+                };
+            }
+        },
+        verticalAlign: {
+            default: defaults.verticalAlign,
+            parseHTML: (element)=>normalizeDocumentTableVerticalAlign(element.dataset.officeCellVerticalAlign || element.style.verticalAlign) ?? defaults.verticalAlign,
+            renderHTML: (attributes)=>{
+                const alignment = normalizeDocumentTableVerticalAlign(String(attributes.verticalAlign ?? '')) ?? defaults.verticalAlign;
+                return {
+                    'data-office-cell-vertical-align': alignment,
+                    style: `vertical-align: ${alignment}`
+                };
+            }
+        },
+        borderColor: {
+            default: defaults.borderColor,
+            parseHTML: (element)=>normalizeTableColor(element.dataset.officeCellBorderColor || element.style.borderColor) ?? defaults.borderColor,
+            renderHTML: ()=>({})
+        },
+        borderStyle: {
+            default: defaults.borderStyle,
+            parseHTML: (element)=>normalizeDocumentTableBorderStyle(element.dataset.officeCellBorderStyle || element.style.borderStyle) ?? defaults.borderStyle,
+            renderHTML: ()=>({})
+        },
+        borderWidth: {
+            default: defaults.borderWidth,
+            parseHTML: (element)=>normalizeDocumentTableBorderWidth(element.dataset.officeCellBorderWidth || element.style.borderWidth) ?? defaults.borderWidth,
+            renderHTML: ()=>({})
+        },
+        borders: {
+            default: defaults.borders,
+            parseHTML: (element)=>documentTableBordersFromElement(element, {
+                    color: defaults.borderColor,
+                    style: defaults.borderStyle,
+                    width: defaults.borderWidth
+                }),
+            renderHTML: (attributes)=>renderDocumentTableBorders(formatFromAttributes(attributes, defaults).borders)
+        },
+        margins: {
+            default: defaults.margins,
+            parseHTML: (element)=>documentTableCellMarginOverridesFromElement(element),
+            renderHTML: (attributes)=>renderDocumentTableCellMarginOverrides(attributes.margins)
+        }
+    };
+}
+function setSelectedCellFormat({ dispatch, state }, patch) {
+    const normalized = normalizeFormatPatch(patch);
+    if (!normalized) return false;
+    const positions = selectedTableCellPositions(state.selection);
+    if (!positions.length) return false;
+    const transaction = state.tr;
+    for (const position of positions){
+        const cell = transaction.doc.nodeAt(position);
+        if (!cell || !isTableCell(cell)) continue;
+        const current = formatFromAttributes(cell.attrs);
+        const changesBorder = void 0 !== normalized.borderColor || void 0 !== normalized.borderStyle || void 0 !== normalized.borderWidth;
+        const nextBorder = {
+            color: normalized.borderColor ?? current.borderColor,
+            style: normalized.borderStyle ?? current.borderStyle,
+            width: normalized.borderWidth ?? current.borderWidth
+        };
+        if ('none' === nextBorder.style) nextBorder.width = 0;
+        transaction.setNodeMarkup(position, void 0, {
+            ...cell.attrs,
+            ...normalized,
+            ...changesBorder ? {
+                borderColor: nextBorder.color,
+                borderStyle: nextBorder.style,
+                borderWidth: nextBorder.width,
+                borders: uniformDocumentTableBorders(nextBorder)
+            } : {}
+        });
+    }
+    if (dispatch && transaction.docChanged) dispatch(transaction.scrollIntoView());
+    return true;
+}
+function setSelectedCellAlignment({ dispatch, state }, alignment) {
+    if ('left' !== alignment && 'center' !== alignment && 'right' !== alignment) return false;
+    const positions = selectedTableCellPositions(state.selection);
+    if (!positions.length) return false;
+    const transaction = state.tr;
+    for (const position of positions){
+        const cell = transaction.doc.nodeAt(position);
+        if (cell && isTableCell(cell)) cell.descendants((node, offset)=>{
+            if ('paragraph' !== node.type.name && 'heading' !== node.type.name) return true;
+            transaction.setNodeMarkup(position + 1 + offset, void 0, {
+                ...node.attrs,
+                textAlign: alignment
+            });
+            return false;
+        });
+    }
+    if (dispatch && transaction.docChanged) dispatch(transaction.scrollIntoView());
+    return true;
+}
+function applyTableStyle({ dispatch, state }, styleId) {
+    const style = DOCUMENT_TABLE_STYLE_OPTIONS.find((candidate)=>candidate.id === styleId);
+    const context = selectedTable(state.selection);
+    if (!style || !context) return false;
+    const transaction = state.tr;
+    context.node.forEach((row, rowOffset, rowIndex)=>{
+        row.forEach((cell, cellOffset)=>{
+            const position = context.position + 2 + rowOffset + cellOffset;
+            const format = tableStyleCellFormat(style, cell, rowIndex);
+            const border = {
+                color: style.borderColor,
+                style: style.borderStyle,
+                width: style.borderWidth
+            };
+            transaction.setNodeMarkup(position, void 0, {
+                ...cell.attrs,
+                ...format,
+                borders: uniformDocumentTableBorders(border)
+            });
+        });
+    });
+    if (dispatch && transaction.docChanged) dispatch(transaction.scrollIntoView());
+    return true;
+}
+function selectedTableCellPositions(selection) {
+    if (selection instanceof CellSelection) {
+        const positions = [];
+        selection.forEachCell((_node, position)=>positions.push(position));
+        return positions;
+    }
+    if (selection instanceof NodeSelection && 'table' === selection.node.type.spec.tableRole) {
+        const positions = [];
+        selection.node.forEach((row, rowOffset)=>{
+            row.forEach((_cell, cellOffset)=>{
+                positions.push(selection.from + 2 + rowOffset + cellOffset);
+            });
+        });
+        return positions;
+    }
+    const position = ancestorPosition(selection.$from, isTableCell);
+    return null === position ? [] : [
+        position
+    ];
+}
+function selectedTable(selection) {
+    if (selection instanceof NodeSelection && 'table' === selection.node.type.spec.tableRole) return {
+        node: selection.node,
+        position: selection.from
+    };
+    for(let depth = selection.$from.depth; depth > 0; depth -= 1){
+        const node = selection.$from.node(depth);
+        if ('table' === node.type.spec.tableRole) return {
+            node,
+            position: selection.$from.before(depth)
+        };
+    }
+    return null;
+}
+function ancestorPosition(position, predicate) {
+    for(let depth = position.depth; depth > 0; depth -= 1)if (predicate(position.node(depth))) return position.before(depth);
+    return null;
+}
+function isTableCell(node) {
+    return 'cell' === node.type.spec.tableRole || 'header_cell' === node.type.spec.tableRole;
+}
+function tableStyleCellFormat(style, cell, rowIndex) {
+    return {
+        backgroundColor: 'header_cell' === cell.type.spec.tableRole ? style.headerColor : rowIndex % 2 === 1 ? style.alternateColor : style.bodyColor,
+        borderColor: style.borderColor,
+        borderStyle: style.borderStyle,
+        borderWidth: style.borderWidth
+    };
+}
+function normalizeFormatPatch(patch) {
+    const normalized = {};
+    if (void 0 !== patch.backgroundColor) {
+        const color = normalizeTableColor(patch.backgroundColor);
+        if (!color) return null;
+        normalized.backgroundColor = color;
+    }
+    if (void 0 !== patch.verticalAlign) {
+        const alignment = normalizeDocumentTableVerticalAlign(patch.verticalAlign);
+        if (!alignment) return null;
+        normalized.verticalAlign = alignment;
+    }
+    if (void 0 !== patch.borderColor) {
+        const color = normalizeTableColor(patch.borderColor);
+        if (!color) return null;
+        normalized.borderColor = color;
+    }
+    if (void 0 !== patch.borderStyle) {
+        const style = normalizeDocumentTableBorderStyle(patch.borderStyle);
+        if (!style) return null;
+        normalized.borderStyle = style;
+    }
+    if (void 0 !== patch.borderWidth) {
+        const width = normalizeDocumentTableBorderWidth(patch.borderWidth);
+        if (null === width) return null;
+        normalized.borderWidth = width;
+    }
+    if (void 0 !== patch.margins) if (null === patch.margins) normalized.margins = null;
+    else {
+        const margins = normalizeDocumentTableCellMarginOverrides(patch.margins);
+        if (!margins) return null;
+        normalized.margins = margins;
+    }
+    return normalized;
+}
+function formatFromAttributes(attributes, defaults = DEFAULT_DOCUMENT_TABLE_CELL_FORMAT) {
+    const fallbackBorder = {
+        color: normalizeTableColor(String(attributes.borderColor ?? '')) ?? defaults.borderColor,
+        style: normalizeDocumentTableBorderStyle(String(attributes.borderStyle ?? '')) ?? defaults.borderStyle,
+        width: normalizeDocumentTableBorderWidth(attributes.borderWidth) ?? defaults.borderWidth
+    };
+    if ('none' === fallbackBorder.style) fallbackBorder.width = 0;
+    const borders = documentTableBordersFromAttributes(attributes, fallbackBorder);
+    const representative = uniformDocumentTableBorder(borders) ?? borders.top;
+    return {
+        backgroundColor: normalizeTableColor(String(attributes.backgroundColor ?? '')) ?? defaults.backgroundColor,
+        verticalAlign: normalizeDocumentTableVerticalAlign(String(attributes.verticalAlign ?? '')) ?? defaults.verticalAlign,
+        borderColor: representative.color,
+        borderStyle: representative.style,
+        borderWidth: representative.width,
+        borders,
+        margins: normalizeDocumentTableCellMarginOverrides(attributes.margins)
+    };
+}
+function normalizeDocumentTableVerticalAlign(value) {
+    if ('top' === value || 'middle' === value || 'bottom' === value) return value;
+    if ('center' === value) return 'middle';
+    return null;
+}
+const DocumentTableRow = TableRow.extend({
+    addAttributes () {
+        return {
+            ...this.parent?.() ?? {},
+            cantSplit: booleanRowAttribute('cantSplit', 'officeCantSplit', 'data-office-cant-split'),
+            repeatHeader: booleanRowAttribute('repeatHeader', 'officeRepeatHeader', 'data-office-repeat-header'),
+            rowHeight: {
+                default: null,
+                parseHTML: (element)=>normalizeDocumentTableRowHeight(element.dataset.officeRowHeight || element.style.height),
+                renderHTML: (attributes)=>{
+                    const height = normalizeDocumentTableRowHeight(attributes.rowHeight);
+                    return null === height ? {} : {
+                        'data-office-row-height': String(height),
+                        style: `height: ${height}px`
+                    };
+                }
+            },
+            rowHeightRule: {
+                default: null,
+                parseHTML: (element)=>normalizeDocumentTableRowHeightRule(element.dataset.officeRowHeightRule),
+                renderHTML: (attributes)=>{
+                    const rule = normalizeDocumentTableRowHeightRule(attributes.rowHeightRule);
+                    return null === rule ? {} : {
+                        'data-office-row-height-rule': rule
+                    };
+                }
+            }
+        };
+    },
+    addCommands () {
+        return {
+            ...this.parent?.() ?? {},
+            setDocumentTableRowOptions: (options, commandOptions = {})=>({ chain, editor })=>{
+                    if (!editor.isActive('table')) return false;
+                    let commandChain = chain();
+                    if (false !== commandOptions.restoreFocus) commandChain = commandChain.focus();
+                    return commandChain.updateAttributes('tableRow', {
+                        cantSplit: Boolean(options.cantSplit),
+                        repeatHeader: Boolean(options.repeatHeader)
+                    }).run();
+                }
+        };
+    }
+});
+function documentTableRowOptions(editor) {
+    const attributes = editor.getAttributes('tableRow');
+    return {
+        cantSplit: directBoolean(attributes.cantSplit) ?? false,
+        repeatHeader: directBoolean(attributes.repeatHeader) ?? editor.isActive('tableHeader')
+    };
+}
+function canSetDocumentTableRowRepeatHeader(editor) {
+    const resolved = editor.state.selection.$from;
+    for(let depth = resolved.depth; depth > 0; depth -= 1){
+        if ('tableRow' !== resolved.node(depth).type.name) continue;
+        const tableDepth = depth - 1;
+        const table = resolved.node(tableDepth);
+        if ('table' !== table.type.name) break;
+        let leadingHeaderCount = 0;
+        for(let index = 0; index < table.childCount; index += 1){
+            if (!documentTableRowRepeats(table.child(index))) break;
+            leadingHeaderCount += 1;
+        }
+        return resolved.index(tableDepth) <= leadingHeaderCount;
+    }
+    return false;
+}
+function documentTableRowRepeats(node) {
+    const explicit = directBoolean(node.attrs.repeatHeader);
+    if (null !== explicit) return explicit;
+    if (0 === node.childCount) return false;
+    for(let index = 0; index < node.childCount; index += 1)if ('tableHeader' !== node.child(index).type.name) return false;
+    return true;
+}
+function documentTableRowCantSplit(node) {
+    return directBoolean(node.attrs.cantSplit) ?? false;
+}
+function documentTableRowHeight(attributes) {
+    const height = normalizeDocumentTableRowHeight(attributes.rowHeight);
+    return {
+        height,
+        rule: null === height ? null : normalizeDocumentTableRowHeightRule(attributes.rowHeightRule) ?? 'atLeast'
+    };
+}
+function normalizeDocumentTableRowHeight(value) {
+    const height = Number.parseFloat(String(value ?? '').replace(/px$/i, ''));
+    return Number.isFinite(height) && height > 0 ? Math.round(100 * height) / 100 : null;
+}
+function normalizeDocumentTableRowHeightRule(value) {
+    return 'exact' === value || 'atLeast' === value ? value : null;
+}
+function booleanRowAttribute(modelKey, datasetKey, htmlName) {
+    return {
+        default: null,
+        parseHTML: (element)=>directBoolean(element.dataset[datasetKey]),
+        renderHTML: (attributes)=>{
+            const value = directBoolean(attributes[modelKey]);
+            return null === value ? {} : {
+                [htmlName]: String(value)
+            };
+        }
+    };
+}
+function directBoolean(value) {
+    if (true === value || 'true' === value || '1' === value) return true;
+    if (false === value || 'false' === value || '0' === value) return false;
+    return null;
+}
+export { DEFAULT_DOCUMENT_TABLE_CELL_FORMAT, DOCUMENT_TABLE_STYLE_OPTIONS, DocumentTableCell, DocumentTableFormatting, DocumentTableHeader, DocumentTableRow, activeDocumentTableStyle, canSetDocumentTableRowRepeatHeader, documentTableCellFormat, documentTableHorizontalAlignment, documentTableRowCantSplit, documentTableRowHeight, documentTableRowOptions, documentTableRowRepeats, normalizeDocumentTableRowHeightRule, normalizeDocumentTableVerticalAlign };

package/dist/0~4595.js

@@ -706,6 +706,7 @@ function WorkOfficeRibbon({ ariaLabel, tabs, defaultTab, activeTab, onTabChange,
     const selectedLabel = tabs.find((tab)=>tab.id === selectedTab)?.label ?? tabs[0]?.label ?? '';
     const selectedPanel = panels[selectedTab];
     const hasSelectedPanel = null != selectedPanel;
+    const hasRibbonOverflow = ribbonOverflow.backward || ribbonOverflow.forward;
     const updateRibbonOverflow = useCallback(()=>{
         const toolbar = toolbarRef.current;
         if (!toolbar) return;
@@ -909,10 +910,11 @@ function WorkOfficeRibbon({ ariaLabel, tabs, defaultTab, activeTab, onTabChange,
                 "aria-labelledby": `${reactId}-tab-${selectedTab}`,
                 children: hasSelectedPanel && /*#__PURE__*/ jsxs(jsx_runtime_Fragment, {
                     children: [
-                        ribbonOverflow.backward && /*#__PURE__*/ jsx("button", {
+                        hasRibbonOverflow && /*#__PURE__*/ jsx("button", {
                             type: "button",
                             className: "work-office-ribbon-scroll previous",
                             "aria-label": `向左查看更多${selectedLabel}工具`,
+                            disabled: !ribbonOverflow.backward,
                             onClick: ()=>scrollRibbon(-1),
                             children: /*#__PURE__*/ jsx(ChevronLeft, {
                                 size: 15
@@ -921,16 +923,17 @@ function WorkOfficeRibbon({ ariaLabel, tabs, defaultTab, activeTab, onTabChange,
                         /*#__PURE__*/ jsx("div", {
                             ref: toolbarRef,
                             className: `work-office-toolbar ${toolbarClassName}`.trim(),
-                            "data-has-overflow": ribbonOverflow.backward || ribbonOverflow.forward ? 'true' : void 0,
+                            "data-has-overflow": hasRibbonOverflow ? 'true' : void 0,
                             role: "toolbar",
                             "aria-label": `${selectedLabel}工具栏`,
                             onScroll: updateRibbonOverflow,
                             children: selectedPanel
                         }),
-                        ribbonOverflow.forward && /*#__PURE__*/ jsx("button", {
+                        hasRibbonOverflow && /*#__PURE__*/ jsx("button", {
                             type: "button",
                             className: "work-office-ribbon-scroll next",
                             "aria-label": `向右查看更多${selectedLabel}工具`,
+                            disabled: !ribbonOverflow.forward,
                             onClick: ()=>scrollRibbon(1),
                             children: /*#__PURE__*/ jsx(ChevronRight, {
                                 size: 15
@@ -944,12 +947,16 @@ function WorkOfficeRibbon({ ariaLabel, tabs, defaultTab, activeTab, onTabChange,
 }
 function ribbonItemGeometry(toolbar) {
     return Array.from(toolbar.children).flatMap((element)=>element instanceof HTMLElement ? [
-            {
-                left: element.offsetLeft,
-                right: element.offsetLeft + element.offsetWidth
-            }
+            ribbonItemBounds(toolbar, element)
         ] : []);
 }
+function ribbonItemBounds(toolbar, element) {
+    const left = element.offsetParent === toolbar ? element.offsetLeft : element.offsetLeft - toolbar.offsetLeft;
+    return {
+        left,
+        right: left + element.offsetWidth
+    };
+}
 function scrollSelectedRibbonTabIntoView(tabList, selectedTab) {
     const selected = Array.from(tabList.children).find((element)=>element instanceof HTMLElement && element.dataset.tabId === selectedTab);
     if (!selected || tabList.clientWidth <= 0) return;