@a3s-lab/office 0.19.0 → 0.21.0

package/dist/0~spreadsheet-editor.js

@@ -4,7 +4,7 @@ import { Workbook } from "@fortune-sheet/react";
 import { AArrowDown, AArrowUp, AlignCenter, AlignLeft, AlignRight, AlignVerticalJustifyCenter, AlignVerticalJustifyEnd, AlignVerticalJustifyStart, ArrowDown, ArrowDownToLine, ArrowLeft, ArrowLeftToLine, ArrowRight, ArrowRightToLine, ArrowUp, ArrowUpToLine, BadgeJapaneseYen, BarChart3, BetweenHorizontalEnd, BetweenHorizontalStart, BetweenVerticalEnd, BetweenVerticalStart, Bold, Bookmark, Calculator, Check, ChevronDown, ChevronLeft, ChevronRight, ClipboardPaste, Cloud, Columns3, Copy, CopyPlus, DecimalsArrowLeft, DecimalsArrowRight, Eraser, Eye, EyeOff, FileX2, Globe2, Grid2X2, Grid3X3, Hash, Italic, KeyRound, Layers2, Link2, Link2Off, ListChecks, ListFilter, LocateFixed, Merge, MessageSquareX, MoveHorizontal, MoveVertical, Paintbrush, Palette, PanelLeft, PanelTop, PanelsTopLeft, Pencil, Percent, Plus, Printer, Redo2, RefreshCw, Rows3, Save, Scissors, Search, Settings2, ShieldCheck, Sigma, SortAsc, SortDesc, Strikethrough, SwatchBook, Table2, TableProperties, Trash2, Underline, Undo2, WrapText, X } from "lucide-react";
 import { Fragment as external_react_Fragment, cloneElement, memo, useCallback, useEffect, useId, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { genarate, indexToColumnChar, update as core_update } from "@fortune-sheet/core";
-import { freezeImportedSpreadsheetCell, spreadsheetTextOrientationFromChoice, spreadsheetMatrixProfile, withoutEditableRange, spreadsheetTextOrientationFromAngle, isSpreadsheetTextOrientationId, normalizeSpreadsheetConditionalVisualOptions, spreadsheetUnderlineCellValue, effectiveSpreadsheetPageSetup, attachSpreadsheetShownCommentCells, withEditableRange, sameSpreadsheetHistoryValue, createOfficeSpreadsheetCollaborationBinding as createWorkOfficeSpreadsheetCollaborationBinding, isSpreadsheetConditionalComparisonOperator, spreadsheetConditionalIconForValue, defaultSpreadsheetConditionalIconThresholds, spreadsheetUnderlineStyle, normalizeSpreadsheetDateValidationBoundary, sheetProtectionAuthority, editableRangeCellCount, unlockedCellCount, registerDerivedSpreadsheetMatrix, editableRangeRequiresCredentials, spreadsheetTextOrientationCellStyle, normalizeSpreadsheetConditionalIconSetFormat, defaultSpreadsheetDataBarOptions, spreadsheetConditionalThresholdValue, spreadsheetTextOrientationChoiceFromCell, normalizeSheetProtectionAuthority, withSheetProtection, defaultSpreadsheetColorScaleThresholds, spreadsheetProtectionKey, protectedSheetCount, SPREADSHEET_CONDITIONAL_ICON_SETS, SPREADSHEET_CONDITIONAL_COMPARISON_OPERATORS, withSheetSelectionPermissions, spreadsheetConditionalComparisonNeedsUpperValue, drawSpreadsheetConditionalIcon, spreadsheetTextOrientationFromCell, replaceOfficeSpreadsheetCollaboration as replaceWorkOfficeSpreadsheetCollaboration, readOfficeSpreadsheetCollaboration as readWorkOfficeSpreadsheetCollaboration, spreadsheetConditionalThresholdsEqual, isSpreadsheetUnderlineStyle, spreadsheetVisibleTextRotationFromCell } from "./6164.js";
+import { freezeImportedSpreadsheetCell, spreadsheetTextOrientationFromChoice, spreadsheetMatrixProfile, withoutEditableRange, spreadsheetTextOrientationFromAngle, isSpreadsheetTextOrientationId, normalizeSpreadsheetConditionalVisualOptions, spreadsheetCellValueWithDiagonalBorder, spreadsheetUnderlineCellValue, effectiveSpreadsheetPageSetup, attachSpreadsheetShownCommentCells, withEditableRange, sameSpreadsheetHistoryValue, createOfficeSpreadsheetCollaborationBinding as createWorkOfficeSpreadsheetCollaborationBinding, isSpreadsheetConditionalComparisonOperator, spreadsheetConditionalIconForValue, defaultSpreadsheetConditionalIconThresholds, spreadsheetUnderlineStyle, normalizeSpreadsheetDateValidationBoundary, sheetProtectionAuthority, editableRangeCellCount, unlockedCellCount, registerDerivedSpreadsheetMatrix, editableRangeRequiresCredentials, spreadsheetTextOrientationCellStyle, normalizeSpreadsheetConditionalIconSetFormat, defaultSpreadsheetDataBarOptions, spreadsheetConditionalThresholdValue, spreadsheetTextOrientationChoiceFromCell, normalizeSheetProtectionAuthority, withSheetProtection, defaultSpreadsheetColorScaleThresholds, spreadsheetProtectionKey, spreadsheetDiagonalBorderFromCellValue, SPREADSHEET_CONDITIONAL_ICON_SETS, protectedSheetCount, withSheetSelectionPermissions, SPREADSHEET_CONDITIONAL_COMPARISON_OPERATORS, spreadsheetConditionalComparisonNeedsUpperValue, drawSpreadsheetConditionalIcon, spreadsheetTextOrientationFromCell, replaceOfficeSpreadsheetCollaboration as replaceWorkOfficeSpreadsheetCollaboration, readOfficeSpreadsheetCollaboration as readWorkOfficeSpreadsheetCollaboration, spreadsheetConditionalThresholdsEqual, isSpreadsheetUnderlineStyle, spreadsheetVisibleTextRotationFromCell } from "./5045.js";
 import { workSpreadsheetChartSupportsGrouping, createSpreadsheetChartFromSelection, normalizeWorkSpreadsheetDataLabelPosition, normalizeSpreadsheetPrintTitleColumns, normalizeSpreadsheetPrintTitleRows, formulaHasStructuredReference, normalizeWorkSpreadsheetErrorBars, defaultPivotValueCaption, workSpreadsheetChartSupportsBarSpacing, normalizeWorkSpreadsheetChartGrouping, spreadsheetGridSize, normalizeWorkSpreadsheetChartAxisGroup, normalizeWorkSpreadsheetScatterStyle, cloneSparseMatrix, spreadsheetPivotAggregationLabel, workSpreadsheetChartAxisIsCategoryAxis, reconcileSpreadsheetChartPreviews, normalizeWorkSpreadsheetChartAxes, normalizeWorkSpreadsheetDoughnutHoleSize, normalizeWorkSpreadsheetChartLegendPosition, spreadsheetChartCount, workSpreadsheetChartTypeLabel, sparseArrayEntries, normalizeWorkSpreadsheetTrendline, effectiveSpreadsheetCalculationSettings, spreadsheetPivotIntersects, normalizeWorkSpreadsheetDataLabels, spreadsheetPivotOutputContains, normalizeSpreadsheetPrintArea, spreadsheetCellAddress, formatSpreadsheetCellRanges, normalizeWorkSpreadsheetChartLayout, spreadsheetFormulaRangeForCell, workSpreadsheetChartAxisIsValueAxis, normalizeWorkSpreadsheetChartSmoothLines, spreadsheetPivotFilterValueKey, normalizeWorkSpreadsheetBubbleScale, normalizeWorkSpreadsheetChartSeriesStyle, volatileSpreadsheetFormulaFunctions, sparseArrayIndexes, normalizeWorkSpreadsheetBubbleSizeRepresents, workSpreadsheetChartSupportsTrendlines, normalizeWorkSpreadsheetChartLegendOverlay, parseSpreadsheetChartReference, workSpreadsheetChartGroupingIsStacked, normalizeWorkSpreadsheetChartGapWidth, workSpreadsheetChartSupportsSmoothLines, refreshSpreadsheetPivotTables, createSpreadsheetPivotFromSelection, reconcileSpreadsheetPivots, spreadsheetPivotCount, sparseMatrixColumnCount, workSpreadsheetChartSupportsErrorBars, formulaHasExternalReference, isValidSpreadsheetDefinedName, spreadsheetPivotValidation, deleteSpreadsheetPivotTable, workSpreadsheetChartAxisDefaultLabelPosition, workSpreadsheetChartSupportsSeriesAnalysis, parseSpreadsheetCellRanges, spreadsheetPivotFilterItems, spreadsheetPivotFields, normalizeWorkSpreadsheetChartOverlap, spreadsheetFormulaRangeConflict, spreadsheetSheetsWithChartPreviews, workSpreadsheetChartUsesNumericXAxis, workSpreadsheetChartAxisShowsMajorGridlinesByDefault, workSpreadsheetChartSupportsAxes, normalizeWorkSpreadsheetCombinationSeriesType, normalizeWorkSpreadsheetRadarStyle } from "./8715.js";
 import { moveOfficeMenuFocus, stepOfficeZoom, useOfficeRemoteParticipants, Popover, officePresenceColor, useOfficePublishPresenceLocation, button_Button, icon_button_IconButton, moveOfficeGridMenuFocus, office_text_field_OfficeTextField, useDialogFocusScope, useOfficeEditorWheelZoom } from "./0~6090.js";
 import { useOfficeTaskPaneEscape, OfficeCheckbox, CommittedOfficeNumberField, useOfficeDialog, useOfficeTaskPaneModal, createOfficeKernelClient, officeFontFamilies, CollectionState, OfficeNumberField, handleOfficeTaskPaneKeyDown } from "./0~7048.js";
@@ -86,6 +86,74 @@ function drawCellValue(context, bounds, cell, conditionalTextColor) {
         context.fillText(String(value), bounds.startX + 4, bounds.startY + height / 2, bounds.endX - bounds.startX - 8);
     }
 }
+function drawSpreadsheetDiagonalDownBorder(context, bounds, line) {
+    drawSpreadsheetDiagonalBorder(context, bounds, line, 'down');
+}
+function drawSpreadsheetDiagonalUpBorder(context, bounds, line) {
+    drawSpreadsheetDiagonalBorder(context, bounds, line, 'up');
+}
+function drawSpreadsheetDiagonalBorder(context, bounds, line, direction) {
+    const left = Math.round(bounds.startX) + 0.5;
+    const top = Math.round(bounds.startY) + 0.5;
+    const right = Math.round(bounds.endX) - 1.5;
+    const bottom = Math.round(bounds.endY) - 1.5;
+    if (right <= left || bottom <= top) return;
+    context.save();
+    context.strokeStyle = line.color;
+    context.lineCap = 'butt';
+    context.lineWidth = spreadsheetDiagonalLineWidth(line.style);
+    context.setLineDash(spreadsheetDiagonalLineDash(line.style));
+    const startY = 'down' === direction ? top : bottom;
+    const endY = 'down' === direction ? bottom : top;
+    if ('7' === line.style) {
+        drawLine(context, left, startY - 1, right, endY - 1);
+        drawLine(context, left, startY + 1, right, endY + 1);
+    } else drawLine(context, left, startY, right, endY);
+    context.restore();
+}
+function drawLine(context, startX, startY, endX, endY) {
+    context.beginPath();
+    context.moveTo(startX, startY);
+    context.lineTo(endX, endY);
+    context.stroke();
+}
+function spreadsheetDiagonalLineWidth(style) {
+    if ('2' === style) return 0.5;
+    if ([
+        '8',
+        '9',
+        '10',
+        '11',
+        '12'
+    ].includes(style)) return 2;
+    if ('13' === style) return 3;
+    return 1;
+}
+function spreadsheetDiagonalLineDash(style) {
+    if ('3' === style) return [
+        1,
+        2
+    ];
+    if ('4' === style || '9' === style) return [
+        5,
+        3
+    ];
+    if ('5' === style || '10' === style || '12' === style) return [
+        6,
+        3,
+        1,
+        3
+    ];
+    if ('6' === style || '11' === style) return [
+        6,
+        3,
+        1,
+        3,
+        1,
+        3
+    ];
+    return [];
+}
 function parseSpreadsheetConditionalColor(value) {
     const hexadecimal = /^#?([0-9a-f]{6})$/i.exec(value.trim());
     if (hexadecimal) return {
@@ -577,7 +645,8 @@ const spreadsheetCellBorderTargets = [
     'inside',
     'horizontal',
     'vertical',
-    'diagonal'
+    'diagonalDown',
+    'diagonalUp'
 ];
 const spreadsheetCellBorderStyles = [
     'thin',
@@ -615,8 +684,7 @@ const spreadsheetNativeBorderTypeByTarget = {
     outside: 'border-outside',
     inside: 'border-inside',
     horizontal: 'border-horizontal',
-    vertical: 'border-vertical',
-    diagonal: 'border-slash'
+    vertical: 'border-vertical'
 };
 const spreadsheetNativeBorderStyleByName = {
     thin: '1',
@@ -635,36 +703,29 @@ function spreadsheetNativeBorderStyle(style) {
 }
 function canSetSpreadsheetCellBorders(content, sheetId, range, format) {
     const normalizedRange = spreadsheet_cell_range_normalizeSpreadsheetCellRange(range);
-    return Boolean(content.sheets.some((sheet)=>sheet.id === sheetId) && normalizedRange && normalizeSpreadsheetBorderFormat(format) && ('diagonal' !== format.target || spreadsheet_cell_range_spreadsheetCellRangeArea(normalizedRange) <= MAX_SPREADSHEET_DIAGONAL_BORDER_CELLS) && spreadsheetBorderInfoIsWritable(content.sheets.find((sheet)=>sheet.id === sheetId)));
+    return Boolean(content.sheets.some((sheet)=>sheet.id === sheetId) && normalizedRange && normalizeSpreadsheetBorderFormat(format) && (!isSpreadsheetDiagonalBorderTarget(format.target) || spreadsheet_cell_range_spreadsheetCellRangeArea(normalizedRange) <= MAX_SPREADSHEET_DIAGONAL_BORDER_CELLS) && spreadsheetBorderInfoIsWritable(content.sheets.find((sheet)=>sheet.id === sheetId)));
 }
 function setSpreadsheetCellBorders(content, sheetId, range, format) {
     const sheetIndex = content.sheets.findIndex((sheet)=>sheet.id === sheetId);
     const sheet = content.sheets[sheetIndex];
     const normalizedRange = spreadsheet_cell_range_normalizeSpreadsheetCellRange(range);
     const normalizedFormat = normalizeSpreadsheetBorderFormat(format);
-    if (!sheet || !normalizedRange || !normalizedFormat || !spreadsheetBorderInfoIsWritable(sheet) || 'diagonal' === normalizedFormat.target && spreadsheet_cell_range_spreadsheetCellRangeArea(normalizedRange) > MAX_SPREADSHEET_DIAGONAL_BORDER_CELLS) return null;
-    const borderType = spreadsheetNativeBorderTypeByTarget[normalizedFormat.target];
+    if (!sheet || !normalizedRange || !normalizedFormat || !spreadsheetBorderInfoIsWritable(sheet) || isSpreadsheetDiagonalBorderTarget(normalizedFormat.target) && spreadsheet_cell_range_spreadsheetCellRangeArea(normalizedRange) > MAX_SPREADSHEET_DIAGONAL_BORDER_CELLS) return null;
     const source = Array.isArray(sheet.config?.borderInfo) ? sheet.config.borderInfo : [];
+    if (isSpreadsheetDiagonalBorderTarget(normalizedFormat.target)) {
+        const borderInfo = [
+            ...compactSpreadsheetBorderInfo(source, normalizedRange, 'border-slash'),
+            ...spreadsheetDiagonalBorderRecords(sheet, normalizedRange, normalizedFormat.target, normalizedFormat.color, spreadsheetNativeBorderStyleByName[normalizedFormat.style])
+        ];
+        return contentWithSpreadsheetBorderInfo(content, sheetIndex, sheet, borderInfo);
+    }
+    const borderType = spreadsheetNativeBorderTypeByTarget[normalizedFormat.target];
     const compacted = compactSpreadsheetBorderInfo(source, normalizedRange, borderType);
     const borderInfo = [
         ...compacted,
         ...spreadsheetNativeBorderRecords(normalizedRange, borderType, normalizedFormat.color, spreadsheetNativeBorderStyleByName[normalizedFormat.style])
     ];
-    const nextSheet = {
-        ...sheet,
-        config: {
-            ...sheet.config,
-            borderInfo: borderInfo
-        }
-    };
-    const sheets = [
-        ...content.sheets
-    ];
-    sheets[sheetIndex] = nextSheet;
-    return {
-        ...content,
-        sheets
-    };
+    return contentWithSpreadsheetBorderInfo(content, sheetIndex, sheet, borderInfo);
 }
 function spreadsheetCellBordersAt(sheet, row, column) {
     const borders = {};
@@ -678,7 +739,7 @@ function spreadsheetCellBordersAt(sheet, row, column) {
             applyResolvedCellBorderLine(borders, 'right', candidate.value.r);
             applyResolvedCellBorderLine(borders, 'top', candidate.value.t);
             applyResolvedCellBorderLine(borders, 'bottom', candidate.value.b);
-            applyResolvedCellBorderLine(borders, 'diagonal', candidate.value.s);
+            applyResolvedCellDiagonalBorders(borders, candidate.value);
             continue;
         }
         if ('range' !== candidate.rangeType || !isSpreadsheetNativeBorderType(candidate.borderType) || !Array.isArray(candidate.range)) continue;
@@ -690,6 +751,69 @@ function spreadsheetCellBordersAt(sheet, row, column) {
     }
     return borders;
 }
+function spreadsheetRenderableDiagonalBorders(sheet) {
+    const borders = new Map();
+    const source = Array.isArray(sheet.config?.borderInfo) ? sheet.config.borderInfo : [];
+    for (const candidate of source){
+        if (!spreadsheet_cell_border_isRecord(candidate)) continue;
+        if ('cell' === candidate.rangeType) {
+            if (!spreadsheet_cell_border_isRecord(candidate.value)) continue;
+            const row = finiteSpreadsheetBorderIndex(candidate.value.row_index);
+            const column = finiteSpreadsheetBorderIndex(candidate.value.col_index);
+            if (null === row || null === column) continue;
+            const key = `${row}_${column}`;
+            const diagonal = spreadsheetDiagonalBorderFromCellValue(candidate.value);
+            if (void 0 === diagonal) continue;
+            if (!diagonal) {
+                borders.delete(key);
+                continue;
+            }
+            const line = resolvedCellBorderLine(diagonal.line);
+            if (!line) {
+                borders.delete(key);
+                continue;
+            }
+            borders.set(key, {
+                border: {
+                    ...diagonal.down ? {
+                        down: line
+                    } : {},
+                    ...diagonal.up ? {
+                        up: line
+                    } : {}
+                },
+                column,
+                row
+            });
+            continue;
+        }
+        if ('range' !== candidate.rangeType || 'border-none' !== candidate.borderType && 'border-slash' !== candidate.borderType || !Array.isArray(candidate.range)) continue;
+        const line = resolvedRangeBorderLine(candidate);
+        for (const rangeCandidate of candidate.range){
+            const range = parseSpreadsheetCellRange(rangeCandidate);
+            if (range) {
+                for (const [key, entry] of borders)if (spreadsheetCellRangeContains(range, entry.row, entry.column)) {
+                    if ('border-none' === candidate.borderType || !entry.border.up) {
+                        borders.delete(key);
+                        continue;
+                    }
+                    borders.set(key, {
+                        ...entry,
+                        border: {
+                            up: line ?? entry.border.up
+                        }
+                    });
+                }
+            }
+        }
+    }
+    return new Map([
+        ...borders
+    ].map(([key, entry])=>[
+            key,
+            entry.border
+        ]));
+}
 function normalizeSpreadsheetBorderFormat(format) {
     if (!spreadsheetCellBorderTargets.includes(format.target) || !spreadsheetCellBorderStyles.includes(format.style)) return null;
     const color = normalizeSpreadsheetBorderColor(format.color);
@@ -716,14 +840,26 @@ function compactSpreadsheetBorderInfo(formats, range, appliedType) {
             format
         ];
         if ('cell' === format.rangeType) {
-            if (!supersedesAll || !spreadsheet_cell_border_isRecord(format.value)) return [
+            if (!spreadsheet_cell_border_isRecord(format.value)) return [
                 format
             ];
             const row = finiteSpreadsheetBorderIndex(format.value.row_index);
             const column = finiteSpreadsheetBorderIndex(format.value.col_index);
-            return null !== row && null !== column && spreadsheetCellRangeContains(range, row, column) ? [] : [
+            const selected = null !== row && null !== column && spreadsheetCellRangeContains(range, row, column);
+            if (!selected) return [
+                format
+            ];
+            if (supersedesAll) return [];
+            if ('border-slash' !== appliedType) return [
                 format
             ];
+            const value = spreadsheetCellValueWithDiagonalBorder(format.value, null);
+            return Object.keys(value).some((key)=>'row_index' !== key && 'col_index' !== key) ? [
+                {
+                    ...format,
+                    value
+                }
+            ] : [];
         }
         if ('range' !== format.rangeType || !isSpreadsheetNativeBorderType(format.borderType) || !Array.isArray(format.range) || !supersedesAll && format.borderType !== appliedType) return [
             format
@@ -733,9 +869,14 @@ function compactSpreadsheetBorderInfo(formats, range, appliedType) {
             if (!parsed) return [
                 candidate
             ];
-            if ('border-slash' === format.borderType) return spreadsheetCellRangesIntersect(parsed, range) ? [] : [
-                candidate
-            ];
+            if ('border-slash' === format.borderType) {
+                if (!spreadsheetCellRangesIntersect(parsed, range)) return [
+                    candidate
+                ];
+                return 1 === spreadsheet_cell_range_spreadsheetCellRangeArea(parsed) ? [] : [
+                    candidate
+                ];
+            }
             return subtractSpreadsheetCellRange(parsed, range);
         });
         return remaining.length ? [
@@ -747,7 +888,7 @@ function compactSpreadsheetBorderInfo(formats, range, appliedType) {
     });
 }
 function spreadsheetNativeBorderRecords(range, borderType, color, style) {
-    if ('border-slash' !== borderType) return [
+    return [
         {
             rangeType: 'range',
             borderType,
@@ -758,28 +899,91 @@ function spreadsheetNativeBorderRecords(range, borderType, color, style) {
             ]
         }
     ];
+}
+function spreadsheetDiagonalBorderRecords(sheet, range, target, color, style) {
     const records = [];
-    for(let row = range.row[0]; row <= range.row[1]; row += 1)for(let column = range.column[0]; column <= range.column[1]; column += 1)records.push({
-        rangeType: 'range',
-        borderType,
-        color,
-        style,
-        range: [
-            {
-                row: [
-                    row,
-                    row
-                ],
-                column: [
-                    column,
-                    column
-                ],
-                row_focus: row,
-                column_focus: column
+    const existing = spreadsheetDiagonalBorderDirectionsInRange(sheet, range);
+    for(let row = range.row[0]; row <= range.row[1]; row += 1)for(let column = range.column[0]; column <= range.column[1]; column += 1){
+        const current = existing.get(`${row}_${column}`);
+        const border = {
+            down: 'diagonalDown' === target || Boolean(current?.down),
+            line: {
+                color,
+                style
+            },
+            up: 'diagonalUp' === target || Boolean(current?.up)
+        };
+        records.push({
+            rangeType: 'cell',
+            value: spreadsheetCellValueWithDiagonalBorder({
+                col_index: column,
+                row_index: row
+            }, border)
+        });
+    }
+    return records;
+}
+function spreadsheetDiagonalBorderDirectionsInRange(sheet, selection) {
+    const directions = new Map();
+    const source = Array.isArray(sheet.config?.borderInfo) ? sheet.config.borderInfo : [];
+    for (const candidate of source){
+        if (!spreadsheet_cell_border_isRecord(candidate)) continue;
+        if ('cell' === candidate.rangeType) {
+            if (!spreadsheet_cell_border_isRecord(candidate.value)) continue;
+            const row = finiteSpreadsheetBorderIndex(candidate.value.row_index);
+            const column = finiteSpreadsheetBorderIndex(candidate.value.col_index);
+            if (null === row || null === column || !spreadsheetCellRangeContains(selection, row, column)) continue;
+            const diagonal = spreadsheetDiagonalBorderFromCellValue(candidate.value);
+            if (void 0 === diagonal) continue;
+            const line = diagonal && resolvedCellBorderLine(diagonal.line);
+            setSpreadsheetDiagonalDirections(directions, row, column, Boolean(line && diagonal?.down), Boolean(line && diagonal?.up));
+            continue;
+        }
+        if ('range' !== candidate.rangeType || 'border-none' !== candidate.borderType && 'border-slash' !== candidate.borderType || !Array.isArray(candidate.range)) continue;
+        const line = resolvedRangeBorderLine(candidate);
+        for (const rangeCandidate of candidate.range){
+            const range = parseSpreadsheetCellRange(rangeCandidate);
+            if (!range || !spreadsheetCellRangesIntersect(range, selection)) continue;
+            const startRow = Math.max(range.row[0], selection.row[0]);
+            const endRow = Math.min(range.row[1], selection.row[1]);
+            const startColumn = Math.max(range.column[0], selection.column[0]);
+            const endColumn = Math.min(range.column[1], selection.column[1]);
+            for(let row = startRow; row <= endRow; row += 1)for(let column = startColumn; column <= endColumn; column += 1){
+                if ('border-none' === candidate.borderType) {
+                    directions.delete(`${row}_${column}`);
+                    continue;
+                }
+                const current = directions.get(`${row}_${column}`);
+                setSpreadsheetDiagonalDirections(directions, row, column, Boolean(line), Boolean(current?.up));
             }
-        ]
+        }
+    }
+    return directions;
+}
+function setSpreadsheetDiagonalDirections(directions, row, column, down, up) {
+    const key = `${row}_${column}`;
+    if (!down && !up) return void directions.delete(key);
+    directions.set(key, {
+        down,
+        up
     });
-    return records;
+}
+function contentWithSpreadsheetBorderInfo(content, sheetIndex, sheet, borderInfo) {
+    const nextSheet = {
+        ...sheet,
+        config: {
+            ...sheet.config,
+            borderInfo: borderInfo
+        }
+    };
+    const sheets = [
+        ...content.sheets
+    ];
+    sheets[sheetIndex] = nextSheet;
+    return {
+        ...content,
+        sheets
+    };
 }
 function applyResolvedCellBorderLine(borders, side, value) {
     if (null === value) return void delete borders[side];
@@ -791,6 +995,26 @@ function applyResolvedCellBorderLine(borders, side, value) {
         style
     };
 }
+function applyResolvedCellDiagonalBorders(borders, value) {
+    const diagonal = spreadsheetDiagonalBorderFromCellValue(value);
+    if (void 0 === diagonal) return;
+    delete borders.diagonalDown;
+    delete borders.diagonalUp;
+    if (!diagonal) return;
+    const line = resolvedCellBorderLine(diagonal.line);
+    if (!line) return;
+    if (diagonal.down) borders.diagonalDown = line;
+    if (diagonal.up) borders.diagonalUp = line;
+}
+function resolvedCellBorderLine(value) {
+    if (!spreadsheet_cell_border_isRecord(value)) return null;
+    const color = 'string' == typeof value.color ? normalizeSpreadsheetBorderColor(value.color) : null;
+    const style = 'string' == typeof value.style ? value.style : null;
+    return color && style ? {
+        color,
+        style
+    } : null;
+}
 function resolvedRangeBorderLine(value) {
     const color = 'string' == typeof value.color ? normalizeSpreadsheetBorderColor(value.color) : null;
     const style = 'string' == typeof value.style ? value.style : null;
@@ -826,7 +1050,8 @@ function applyResolvedRangeBorder(borders, range, row, column, type, line) {
             delete borders.bottom;
             delete borders.left;
             delete borders.right;
-            delete borders.diagonal;
+            delete borders.diagonalDown;
+            delete borders.diagonalUp;
             break;
         case 'border-all':
             set('top');
@@ -855,10 +1080,16 @@ function applyResolvedRangeBorder(borders, range, row, column, type, line) {
             if (!onRight) set('right');
             break;
         case 'border-slash':
-            set('diagonal');
+            if (line) {
+                borders.diagonalDown = line;
+                if (borders.diagonalUp) borders.diagonalUp = line;
+            } else delete borders.diagonalDown;
             break;
     }
 }
+function isSpreadsheetDiagonalBorderTarget(target) {
+    return 'diagonalDown' === target || 'diagonalUp' === target;
+}
 function isSpreadsheetNativeBorderType(value) {
     return 'string' == typeof value && spreadsheetNativeBorderTypes.has(value);
 }
@@ -2756,10 +2987,11 @@ const spreadsheetCommandCatalog = {
             group: 'font'
         },
         shortcut: {
-            label: 'Cmd/Ctrl+B',
-            aria: 'Control+B Meta+B',
+            label: 'Cmd/Ctrl+B 或 Ctrl+2',
+            aria: 'Control+B Meta+B Control+2',
             editor: [
-                'Mod-b'
+                'Mod-b',
+                'Control-2'
             ]
         }
     },
@@ -2772,10 +3004,11 @@ const spreadsheetCommandCatalog = {
             group: 'font'
         },
         shortcut: {
-            label: 'Cmd/Ctrl+I',
-            aria: 'Control+I Meta+I',
+            label: 'Cmd/Ctrl+I 或 Ctrl+3',
+            aria: 'Control+I Meta+I Control+3',
             editor: [
-                'Mod-i'
+                'Mod-i',
+                'Control-3'
             ]
         }
     },
@@ -2788,10 +3021,11 @@ const spreadsheetCommandCatalog = {
             group: 'font'
         },
         shortcut: {
-            label: 'Cmd/Ctrl+U',
-            aria: 'Control+U Meta+U',
+            label: 'Cmd/Ctrl+U 或 Ctrl+4',
+            aria: 'Control+U Meta+U Control+4',
             editor: [
-                'Mod-u'
+                'Mod-u',
+                'Control-4'
             ]
         }
     },
@@ -3124,9 +3358,18 @@ const spreadsheetCommandCatalog = {
             group: 'font'
         }
     },
-    borderDiagonal: {
-        id: 'font.borderDiagonal',
-        label: '斜线框线',
+    borderDiagonalDown: {
+        id: 'font.borderDiagonalDown',
+        label: '斜下框线',
+        location: {
+            area: 'ribbon',
+            tab: 'home',
+            group: 'font'
+        }
+    },
+    borderDiagonalUp: {
+        id: 'font.borderDiagonalUp',
+        label: '斜上框线',
         location: {
             area: 'ribbon',
             tab: 'home',
@@ -4074,14 +4317,16 @@ const MAX_SPREADSHEET_PER_CELL_BORDER_CELLS = 10000;
 function setSpreadsheetCellBordersPerCell(content, sheetId, range, formats) {
     const normalizedRange = spreadsheet_cell_range_normalizeSpreadsheetCellRange(range);
     const normalizedFormats = formats.map(normalizeSpreadsheetBorderFormat);
-    if (!normalizedRange || spreadsheet_cell_range_spreadsheetCellRangeArea(normalizedRange) > MAX_SPREADSHEET_PER_CELL_BORDER_CELLS || normalizedFormats.some((format)=>!format || ![
+    const area = normalizedRange ? spreadsheet_cell_range_spreadsheetCellRangeArea(normalizedRange) : 1 / 0;
+    if (!normalizedRange || area > MAX_SPREADSHEET_PER_CELL_BORDER_CELLS || normalizedFormats.some((format)=>!format || ![
             'top',
             'bottom',
             'left',
             'right',
             'all',
-            'diagonal'
-        ].includes(format.target))) return null;
+            'diagonalDown',
+            'diagonalUp'
+        ].includes(format.target)) || area > 4096 && normalizedFormats.some((format)=>format?.target === 'diagonalDown' || format?.target === 'diagonalUp')) return null;
     const next = setSpreadsheetCellBorders(content, sheetId, normalizedRange, {
         target: 'none',
         color: '#000000',
@@ -4097,6 +4342,9 @@ function setSpreadsheetCellBordersPerCell(content, sheetId, range, formats) {
             row_index: row,
             col_index: column
         };
+        let diagonalDown = false;
+        let diagonalUp = false;
+        let diagonalLine = null;
         for (const format of normalizedFormats){
             if (!format) continue;
             const line = {
@@ -4107,11 +4355,22 @@ function setSpreadsheetCellBordersPerCell(content, sheetId, range, formats) {
             if ('all' === format.target || 'right' === format.target) value.r = line;
             if ('all' === format.target || 'top' === format.target) value.t = line;
             if ('all' === format.target || 'bottom' === format.target) value.b = line;
-            if ('diagonal' === format.target) value.s = line;
+            if ('diagonalDown' === format.target) {
+                diagonalDown = true;
+                diagonalLine = line;
+            }
+            if ('diagonalUp' === format.target) {
+                diagonalUp = true;
+                diagonalLine = line;
+            }
         }
         records.push({
             rangeType: 'cell',
-            value
+            value: diagonalLine && (diagonalDown || diagonalUp) ? spreadsheetCellValueWithDiagonalBorder(value, {
+                down: diagonalDown,
+                line: diagonalLine,
+                up: diagonalUp
+            }) : value
         });
     }
     const borderInfo = [
@@ -4177,8 +4436,9 @@ function canApplySpreadsheetCellFormat(content, request) {
                 'left',
                 'right',
                 'all',
-                'diagonal'
-            ].includes(format.target)) || normalized.some((format)=>format?.target === 'diagonal') && spreadsheet_cell_range_spreadsheetCellRangeArea(range) > 4096) return false;
+                'diagonalDown',
+                'diagonalUp'
+            ].includes(format.target)) || normalized.some((format)=>format?.target === 'diagonalDown' || format?.target === 'diagonalUp') && spreadsheet_cell_range_spreadsheetCellRangeArea(range) > 4096) return false;
     }
     return true;
 }
@@ -4696,14 +4956,16 @@ function sameCellStyleBorders(actual, formats) {
         if ('all' === format.target || 'right' === format.target) expected.right = line;
         if ('all' === format.target || 'top' === format.target) expected.top = line;
         if ('all' === format.target || 'bottom' === format.target) expected.bottom = line;
-        if ('diagonal' === format.target) expected.diagonal = line;
+        if ('diagonalDown' === format.target) expected.diagonalDown = line;
+        if ('diagonalUp' === format.target) expected.diagonalUp = line;
     }
     return [
         'top',
         'bottom',
         'left',
         'right',
-        'diagonal'
+        'diagonalDown',
+        'diagonalUp'
     ].every((side)=>actual[side]?.color === expected[side]?.color && actual[side]?.style === expected[side]?.style);
 }
 function createSpreadsheetCellStyleExtension() {
@@ -6614,15 +6876,18 @@ function createSpreadsheetKeyboardShortcutExtension() {
         name: 'spreadsheetKeyboardShortcuts',
         addKeyboardShortcuts: ()=>({
                 'Mod-a': ({ can, commands }, event)=>selectSpreadsheetFormulaBarContents(event) || runSpreadsheetSelectionScopeShortcut(event, can.selectCellRange, commands.selectCellRange, 'all'),
-                'Mod-b': ({ can, commands, context }, event)=>runSpreadsheetCellFormatShortcut(event, context, can.setCellFormat, commands.setCellFormat, 'bl'),
+                [spreadsheetCommandCatalog.bold.shortcut.editor["0"]]: ({ can, commands, context }, event)=>runSpreadsheetCellFormatShortcut(event, context, can.setCellFormat, commands.setCellFormat, 'bl'),
+                [spreadsheetCommandCatalog.bold.shortcut.editor["1"]]: ({ can, commands, context }, event)=>runSpreadsheetCellFormatShortcut(event, context, can.setCellFormat, commands.setCellFormat, 'bl'),
                 'Mod-c': ({ can, commands }, event)=>runSpreadsheetClipboardShortcut(event, can.copySelection, commands.copySelection),
                 'Mod-d': ({ can, commands }, event)=>runSpreadsheetFillShortcut(event, can.fillSelectedCells, commands.fillSelectedCells, 'down'),
-                'Mod-i': ({ can, commands, context }, event)=>runSpreadsheetCellFormatShortcut(event, context, can.setCellFormat, commands.setCellFormat, 'it'),
+                [spreadsheetCommandCatalog.italic.shortcut.editor["0"]]: ({ can, commands, context }, event)=>runSpreadsheetCellFormatShortcut(event, context, can.setCellFormat, commands.setCellFormat, 'it'),
+                [spreadsheetCommandCatalog.italic.shortcut.editor["1"]]: ({ can, commands, context }, event)=>runSpreadsheetCellFormatShortcut(event, context, can.setCellFormat, commands.setCellFormat, 'it'),
                 'Mod-r': ({ can, commands }, event)=>runSpreadsheetFillShortcut(event, can.fillSelectedCells, commands.fillSelectedCells, 'right'),
                 'Mod-v': ({ can, commands }, event)=>runSpreadsheetClipboardShortcut(event, can.pasteSelection, commands.pasteSelection),
                 [spreadsheetCommandCatalog.pasteSpecial.shortcut.editor["0"]]: ({ can, commands }, event)=>runSpreadsheetPasteSpecialShortcut(event, can.openPasteSpecial, commands.openPasteSpecial),
                 'Mod-x': ({ can, commands }, event)=>runSpreadsheetClipboardShortcut(event, can.cutSelection, commands.cutSelection),
-                'Mod-u': ({ can, commands, context }, event)=>runSpreadsheetCellFormatShortcut(event, context, can.setCellFormat, commands.setCellFormat, 'un'),
+                [spreadsheetCommandCatalog.underline.shortcut.editor["0"]]: ({ can, commands, context }, event)=>runSpreadsheetCellFormatShortcut(event, context, can.setCellFormat, commands.setCellFormat, 'un'),
+                [spreadsheetCommandCatalog.underline.shortcut.editor["1"]]: ({ can, commands, context }, event)=>runSpreadsheetCellFormatShortcut(event, context, can.setCellFormat, commands.setCellFormat, 'un'),
                 'Mod-5': ({ can, commands, context }, event)=>runSpreadsheetCellFormatShortcut(event, context, can.setCellFormat, commands.setCellFormat, 'cl'),
                 [spreadsheetCommandCatalog.numberFormatGeneral.shortcut.editor["0"]]: ({ can, commands, context }, event)=>runSpreadsheetNumberFormatShortcut(event, context, can.setCellFormat, commands.setCellFormat, 'general'),
                 [spreadsheetCommandCatalog.numberFormatNumber.shortcut.editor["0"]]: ({ can, commands, context }, event)=>runSpreadsheetNumberFormatShortcut(event, context, can.setCellFormat, commands.setCellFormat, 'number'),
@@ -10189,8 +10454,12 @@ const spreadsheetBorderTargetOptions = [
         definition: spreadsheetCommandCatalog.borderVertical
     },
     {
-        target: 'diagonal',
-        definition: spreadsheetCommandCatalog.borderDiagonal
+        target: 'diagonalDown',
+        definition: spreadsheetCommandCatalog.borderDiagonalDown
+    },
+    {
+        target: 'diagonalUp',
+        definition: spreadsheetCommandCatalog.borderDiagonalUp
     }
 ];
 function SpreadsheetBorderRibbon({ can, commands }) {
@@ -10609,7 +10878,12 @@ function SpreadsheetFontRibbonGroup({ can, commands, toolbarCell }) {
                 ariaLabel: "文字颜色",
                 value: textColor,
                 disabled: !can.setCellFormat('fc', textColor),
-                onValueChange: (value)=>commands.setCellFormat('fc', value)
+                onValueChange: (value)=>commands.setCellFormat('fc', value),
+                resetAction: {
+                    kind: 'automatic',
+                    label: '自动颜色',
+                    onSelect: ()=>commands.setCellFormat('fc', void 0)
+                }
             }),
             /*#__PURE__*/ jsx(OfficeColorPicker, {
                 compact: true,
@@ -10617,7 +10891,12 @@ function SpreadsheetFontRibbonGroup({ can, commands, toolbarCell }) {
                 ariaLabel: "填充颜色",
                 value: fillColor,
                 disabled: !can.setCellFormat('bg', fillColor),
-                onValueChange: (value)=>commands.setCellFormat('bg', value)
+                onValueChange: (value)=>commands.setCellFormat('bg', value),
+                resetAction: {
+                    kind: 'none',
+                    label: '无填充',
+                    onSelect: ()=>commands.setCellFormat('bg', void 0)
+                }
             }),
             /*#__PURE__*/ jsx(SpreadsheetBorderRibbon, {
                 can: can,
@@ -12664,8 +12943,12 @@ const borderTargets = [
         label: '右框线'
     },
     {
-        target: 'diagonal',
-        label: '对角线'
+        target: 'diagonalDown',
+        label: '斜下框线'
+    },
+    {
+        target: 'diagonalUp',
+        label: '斜上框线'
     }
 ];
 function SpreadsheetFormatCellsPanel(props) {
@@ -13098,10 +13381,16 @@ function BorderPreview({ draft }) {
                     borderRight: line('right')
                 }
             }),
-            line('diagonal') && /*#__PURE__*/ jsx("span", {
-                className: "diagonal",
+            line('diagonalDown') && /*#__PURE__*/ jsx("span", {
+                className: "diagonal-down",
+                style: {
+                    borderTop: line('diagonalDown')
+                }
+            }),
+            line('diagonalUp') && /*#__PURE__*/ jsx("span", {
+                className: "diagonal-up",
                 style: {
-                    borderTop: line('diagonal')
+                    borderTop: line('diagonalUp')
                 }
             }),
             /*#__PURE__*/ jsx("strong", {
@@ -13372,7 +13661,8 @@ function borderFormatsAt(sheet, row, column) {
         'bottom',
         'left',
         'right',
-        'diagonal'
+        'diagonalDown',
+        'diagonalUp'
     ].flatMap((target)=>{
         const line = resolved[target];
         if (!line) return [];
@@ -20310,20 +20600,22 @@ function applySpreadsheetPasteBorders(content, sheetId, snapshot, plan, processe
             [
                 'bottom',
                 'b'
-            ],
-            [
-                'diagonal',
-                's'
             ]
         ];
         for (const [side, key] of sides){
             const line = source.borders[side];
             if (line) value[key] = structuredClone(line);
         }
-        return Object.keys(value).length > 2 ? [
+        const diagonal = source.borders.diagonalUp ?? source.borders.diagonalDown ?? null;
+        const withDiagonal = diagonal ? spreadsheetCellValueWithDiagonalBorder(value, {
+            down: Boolean(source.borders.diagonalDown),
+            line: structuredClone(diagonal),
+            up: Boolean(source.borders.diagonalUp)
+        }) : value;
+        return Object.keys(withDiagonal).length > 2 ? [
             {
                 rangeType: 'cell',
-                value
+                value: withDiagonal
             }
         ] : [];
     });
@@ -22611,6 +22903,16 @@ function SpreadsheetEditorSurface({ autoFocus = true, content, collaborationHist
     ]);
     const tableStylesBySheetRef = useRef(tableStylesBySheet);
     tableStylesBySheetRef.current = tableStylesBySheet;
+    const diagonalBordersBySheet = useMemo(()=>new Map(materializedContent.sheets.flatMap((sheet)=>sheet.id ? [
+                [
+                    sheet.id,
+                    spreadsheetRenderableDiagonalBorders(sheet)
+                ]
+            ] : [])), [
+        materializedContent.sheets
+    ]);
+    const diagonalBordersBySheetRef = useRef(diagonalBordersBySheet);
+    diagonalBordersBySheetRef.current = diagonalBordersBySheet;
     useEffect(()=>{
         setPreviewActiveSheetId(preview ? contentActiveSheetId : null);
     }, [
@@ -22742,6 +23044,9 @@ function SpreadsheetEditorSurface({ autoFocus = true, content, collaborationHist
                     }
                 } finally{
                     finishSpreadsheetTableCellRender(cell, cellInfo, tableStyle, context);
+                    const diagonal = diagonalBordersBySheetRef.current.get(activeSheetIdRef.current)?.get(`${cellInfo.row}_${cellInfo.column}`);
+                    if (diagonal?.down) drawSpreadsheetDiagonalDownBorder(context, cellInfo, diagonal.down);
+                    if (diagonal?.up) drawSpreadsheetDiagonalUpBorder(context, cellInfo, diagonal.up);
                 }
             }
         }), [