@a3s-lab/office 0.17.0 → 0.19.0

package/dist/internal/features/work/editors/spreadsheet-text-orientation-command.d.ts

@@ -0,0 +1,18 @@
+import type { Cell } from '@fortune-sheet/core';
+import { type SpreadsheetTextOrientationId } from '../work-spreadsheet-text-orientation';
+import { type OfficeEditorExtension } from './office-editor-extension';
+import type { SpreadsheetCommandContext, SpreadsheetCommandRange, SpreadsheetEditorCommands } from './spreadsheet-command-controller';
+export declare const MAX_SPREADSHEET_TEXT_ORIENTATION_CELLS = 10000;
+export interface SpreadsheetTextOrientationApiCall {
+    name: 'setCellFormatByRange';
+    args: [
+        'rt' | 'tr',
+        Cell['rt'] | Cell['tr'] | undefined,
+        SpreadsheetCommandRange,
+        {
+            id: string;
+        }
+    ];
+}
+export declare function createSpreadsheetTextOrientationExtension(): OfficeEditorExtension<SpreadsheetCommandContext, SpreadsheetEditorCommands>;
+export declare function spreadsheetTextOrientationApiCalls(range: SpreadsheetCommandRange, sheetId: string, choice: SpreadsheetTextOrientationId): SpreadsheetTextOrientationApiCall[];

package/dist/internal/features/work/editors/spreadsheet-underline-ribbon.d.ts

@@ -0,0 +1,6 @@
+import type { SpreadsheetEditorCanCommands, SpreadsheetEditorCommands } from './spreadsheet-command-controller';
+export declare function SpreadsheetUnderlineRibbon({ can, commands, value, }: {
+    can: SpreadsheetEditorCanCommands;
+    commands: SpreadsheetEditorCommands;
+    value: unknown;
+}): import("react").JSX.Element;

package/dist/internal/features/work/editors/spreadsheet-view-ribbon.d.ts

@@ -0,0 +1,8 @@
+import type { Selection } from '@fortune-sheet/core';
+import type { SpreadsheetEditorCanCommands, SpreadsheetEditorCommands } from './spreadsheet-command-controller';
+export declare function SpreadsheetFreezePanesMenu({ active, can, commands, selection, }: {
+    active: boolean;
+    can: SpreadsheetEditorCanCommands;
+    commands: SpreadsheetEditorCommands;
+    selection: Selection;
+}): import("react").JSX.Element;

package/dist/internal/features/work/editors/spreadsheet-visibility-shortcuts.d.ts

@@ -0,0 +1,3 @@
+import { type OfficeEditorExtension } from './office-editor-extension';
+import type { SpreadsheetCommandContext, SpreadsheetEditorCommands } from './spreadsheet-command-controller';
+export declare function createSpreadsheetVisibilityShortcutExtension(): OfficeEditorExtension<SpreadsheetCommandContext, SpreadsheetEditorCommands>;

package/dist/internal/features/work/work-spreadsheet-text-orientation.d.ts

@@ -0,0 +1,21 @@
+import type { Cell } from '@fortune-sheet/core';
+export declare const spreadsheetTextOrientationIds: readonly ["horizontal", "angleCounterclockwise", "angleClockwise", "vertical", "rotateUp", "rotateDown"];
+export type SpreadsheetTextOrientationId = (typeof spreadsheetTextOrientationIds)[number];
+export type SpreadsheetTextOrientation = {
+    kind: 'rotation';
+    angle: number;
+} | {
+    kind: 'stacked';
+};
+export type SpreadsheetTextOrientationCellStyle = Pick<Cell, 'rt' | 'tr'>;
+export declare function isSpreadsheetTextOrientationId(value: unknown): value is SpreadsheetTextOrientationId;
+export declare function spreadsheetTextOrientationFromChoice(choice: SpreadsheetTextOrientationId): SpreadsheetTextOrientation;
+export declare function spreadsheetTextOrientationFromAngle(value: unknown): SpreadsheetTextOrientation | null;
+export declare function spreadsheetTextOrientationFromXlsx(value: unknown): SpreadsheetTextOrientation | null;
+export declare function spreadsheetExplicitTextOrientationFromCell(cell: Pick<Cell, 'rt' | 'tr'> | null | undefined): SpreadsheetTextOrientation | null;
+export declare function spreadsheetTextOrientationFromCell(cell: Pick<Cell, 'rt' | 'tr'> | null | undefined): SpreadsheetTextOrientation;
+export declare function spreadsheetTextOrientationCellStyle(orientation: SpreadsheetTextOrientation | null | undefined): SpreadsheetTextOrientationCellStyle | null;
+export declare function spreadsheetTextOrientationXlsxValue(orientation: SpreadsheetTextOrientation | null | undefined): number | null;
+export declare function spreadsheetTextOrientationXlsxValueFromCell(cell: Pick<Cell, 'rt' | 'tr'> | null | undefined): number | null;
+export declare function spreadsheetVisibleTextRotationFromCell(cell: Pick<Cell, 'rt' | 'tr'> | null | undefined): number;
+export declare function spreadsheetTextOrientationChoiceFromCell(cell: Pick<Cell, 'rt' | 'tr'> | null | undefined): SpreadsheetTextOrientationId | null;

package/dist/internal/features/work/work-spreadsheet-underline.d.ts

@@ -0,0 +1,8 @@
+export declare const spreadsheetUnderlineStyles: readonly ["none", "single", "double", "singleAccounting", "doubleAccounting"];
+export type SpreadsheetUnderlineStyle = (typeof spreadsheetUnderlineStyles)[number];
+export type SpreadsheetUnderlineCellValue = 0 | 1 | 2 | 3 | 4;
+export declare function isSpreadsheetUnderlineStyle(value: unknown): value is SpreadsheetUnderlineStyle;
+export declare function spreadsheetUnderlineCellValue(style: SpreadsheetUnderlineStyle): SpreadsheetUnderlineCellValue;
+export declare function spreadsheetUnderlineStyle(value: unknown): SpreadsheetUnderlineStyle;
+export declare function spreadsheetUnderlineCellValueFromXlsx(value: string | null): SpreadsheetUnderlineCellValue;
+export declare function spreadsheetUnderlineCellValueFromSheetJs(value: unknown): SpreadsheetUnderlineCellValue;

package/dist/internal/features/work/work-xlsx-cell-style-xml.d.ts

@@ -1,4 +1,5 @@
 import type { XlsxCellBorderLine } from './work-xlsx-cell-borders';
+import type { SpreadsheetUnderlineStyle } from './work-spreadsheet-underline';
 export interface XlsxDirectAlignmentStyle {
     horizontal?: 'center' | 'left' | 'right';
     textRotation?: number;
@@ -13,5 +14,5 @@ export declare function writeXlsxAlignment(document: Document, xf: Element, styl
 export declare function setXlsxValueChild(document: Document, parent: Element, name: string, value: string, order: readonly string[]): void;
 export declare function setXlsxColorChild(document: Document, parent: Element, color: string, order: readonly string[]): void;
 export declare function setXlsxToggleChild(document: Document, parent: Element, name: string, enabled: boolean, order: readonly string[]): void;
-export declare function setXlsxUnderlineChild(document: Document, parent: Element, enabled: boolean, order: readonly string[]): void;
+export declare function setXlsxUnderlineChild(document: Document, parent: Element, style: SpreadsheetUnderlineStyle, order: readonly string[]): void;
 export declare function xlsxRgbColor(value: unknown): string | null;

package/dist/styles.css

@@ -14985,6 +14985,37 @@ button.work-office-collaboration-participant:hover .work-office-collaboration-lo
   grid-template-columns: 20px minmax(0, 1fr);
 }
 
+.work-spreadsheet-orientation-menu > button, .work-spreadsheet-rows-columns-menu > button {
+  grid-template-columns: 20px minmax(0, 1fr) auto;
+}
+
+.work-spreadsheet-orientation-menu > button:after {
+  border: 1px solid var(--a3s-faint);
+  content: "";
+  border-radius: 50%;
+  width: 9px;
+  height: 9px;
+}
+
+.work-spreadsheet-orientation-menu > button[aria-checked="true"]:after {
+  border-color: var(--work-office-menu-accent);
+  background: var(--work-office-menu-accent);
+  box-shadow: inset 0 0 0 2px var(--a3s-overlay-surface);
+}
+
+.work-spreadsheet-orientation-glyph {
+  stroke: currentColor;
+  stroke-width: 1.45px;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  flex: none;
+  overflow: visible;
+}
+
+.work-spreadsheet-orientation-trigger.active .work-spreadsheet-orientation-glyph {
+  color: var(--work-spreadsheet-accent);
+}
+
 .work-spreadsheet-find-select-menu > button, .work-spreadsheet-paste-menu > button {
   grid-template-columns: 20px minmax(0, 1fr) auto;
 }
@@ -15021,6 +15052,23 @@ button.work-office-collaboration-participant:hover .work-office-collaboration-lo
   color: currentColor;
 }
 
+@media (width <= 640px) {
+  .work-spreadsheet-orientation-menu, .work-spreadsheet-rows-columns-menu {
+    border-radius: 12px;
+    width: calc(100vw - 16px);
+    max-width: none;
+    max-height: min(68dvh, 520px);
+    padding: 8px;
+  }
+
+  .work-spreadsheet-orientation-menu > button, .work-spreadsheet-rows-columns-menu > button {
+    gap: 10px;
+    min-height: 44px;
+    padding: 9px 10px;
+    font-size: 12px;
+  }
+}
+
 .work-spreadsheet-cell-style-panel {
   gap: 10px;
   width: min(440px, 100vw - 32px);
@@ -15138,7 +15186,7 @@ button.work-office-collaboration-participant:hover .work-office-collaboration-lo
   }
 }
 
-.work-spreadsheet-border-split-root {
+.work-spreadsheet-border-split-root, .work-spreadsheet-underline-split-root {
   border-radius: 6px;
   flex: none;
   align-items: stretch;
@@ -15146,6 +15194,118 @@ button.work-office-collaboration-participant:hover .work-office-collaboration-lo
   display: inline-flex;
 }
 
+.work-office-ribbon .work-office-toolbar .work-spreadsheet-underline-primary, .work-office-ribbon .work-office-toolbar .work-spreadsheet-underline-disclosure {
+  border-radius: 0;
+  height: 29px;
+  padding: 0;
+}
+
+.work-office-ribbon .work-office-toolbar .work-spreadsheet-underline-primary {
+  border-radius: 6px 0 0 6px;
+  width: 29px;
+  min-width: 29px;
+}
+
+.work-office-ribbon .work-office-toolbar .work-spreadsheet-underline-disclosure {
+  border-left: 1px solid color-mix(in srgb, var(--a3s-line) 72%, transparent);
+  border-radius: 0 6px 6px 0;
+  width: 16px;
+  min-width: 16px;
+}
+
+.work-spreadsheet-underline-disclosure svg {
+  transition: transform .12s;
+}
+
+.work-spreadsheet-underline-disclosure[aria-expanded="true"] svg {
+  transform: rotate(180deg);
+}
+
+.work-spreadsheet-underline-primary:focus-visible, .work-spreadsheet-underline-disclosure:focus-visible {
+  box-shadow: inset 0 0 0 1px var(--work-spreadsheet-accent);
+  outline: 0;
+}
+
+.work-spreadsheet-underline-menu {
+  width: min(252px, 100vw - 32px);
+}
+
+.work-spreadsheet-underline-menu > button {
+  grid-template-columns: 22px minmax(0, 1fr) 14px;
+}
+
+.work-spreadsheet-underline-menu > button[aria-checked="true"] {
+  background: color-mix(in srgb,
+    var(--work-office-menu-accent) 9%,
+    transparent);
+}
+
+.work-spreadsheet-underline-menu > button[aria-checked="true"]:after {
+  color: var(--work-office-menu-accent);
+  content: "✓";
+  text-align: center;
+  grid-column: 3;
+  font-size: 12px;
+  font-weight: 700;
+}
+
+.work-spreadsheet-underline-glyph {
+  width: 20px;
+  height: 20px;
+  color: var(--work-office-menu-accent);
+  place-items: center;
+  display: grid;
+  position: relative;
+}
+
+.work-spreadsheet-underline-glyph[data-underline-style="none"] {
+  opacity: .42;
+}
+
+.work-spreadsheet-underline-glyph[data-underline-style="none"]:after {
+  content: "";
+  background: currentColor;
+  width: 18px;
+  height: 1px;
+  position: absolute;
+  transform: rotate(-38deg);
+}
+
+.work-spreadsheet-underline-glyph[data-underline-style="double"]:before {
+  content: "";
+  background: currentColor;
+  height: 1px;
+  position: absolute;
+  bottom: 1px;
+  left: 2px;
+  right: 2px;
+}
+
+.work-spreadsheet-underline-glyph[data-underline-style="singleAccounting"] svg line, .work-spreadsheet-underline-glyph[data-underline-style="doubleAccounting"] svg line {
+  display: none;
+}
+
+.work-spreadsheet-underline-glyph[data-underline-style="singleAccounting"]:after, .work-spreadsheet-underline-glyph[data-underline-style="doubleAccounting"]:before, .work-spreadsheet-underline-glyph[data-underline-style="doubleAccounting"]:after {
+  content: "";
+  background: currentColor;
+  height: 1px;
+  position: absolute;
+  left: 0;
+  right: 0;
+}
+
+.work-spreadsheet-underline-glyph[data-underline-style="singleAccounting"]:after {
+  bottom: 1px;
+}
+
+.work-spreadsheet-underline-glyph[data-underline-style="doubleAccounting"]:before {
+  bottom: 3px;
+}
+
+.work-spreadsheet-underline-glyph[data-underline-style="doubleAccounting"]:after {
+  bottom: 0;
+}
+
 .work-office-ribbon .work-office-toolbar .work-spreadsheet-border-primary, .work-office-ribbon .work-office-toolbar .work-spreadsheet-border-disclosure {
   border-radius: 0;
   height: 29px;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@a3s-lab/office",
-  "version": "0.17.0",
+  "version": "0.19.0",
   "description": "Open-source collaborative browser editors for documents, Markdown, spreadsheets, presentations, and PDFs.",
   "keywords": [
     "office",
@@ -90,6 +90,7 @@
     "playground:visual:spreadsheet-data-validation": "playwright test visual-tests/spreadsheet-data-validation.functional.spec.ts --config playwright.config.ts",
     "playground:visual:spreadsheet-hyperlink": "playwright test visual-tests/spreadsheet-hyperlink.functional.spec.ts --config playwright.config.ts",
     "playground:visual:spreadsheet-ribbon": "playwright test visual-tests/spreadsheet-ribbon.functional.spec.ts --config playwright.config.ts",
+    "playground:visual:spreadsheet-underline": "playwright test visual-tests/spreadsheet-underline.functional.spec.ts --config playwright.config.ts",
     "playground:visual:spreadsheet-table": "playwright test visual-tests/spreadsheet-table.functional.spec.ts --config playwright.config.ts",
     "playground:visual:update": "playwright test --config playwright.config.ts --update-snapshots",
     "performance:fixtures": "bun .a3s-test/performance/generate-fixtures.ts",
@@ -133,10 +134,14 @@
     "test:e2e:writer-ribbon:check": "a3s-test check tests/e2e/word-ribbon-collapse.acl --json",
     "test:e2e:spreadsheet-ribbon": "a3s-test run tests/e2e/spreadsheet-ribbon-alignment.acl --json",
     "test:e2e:spreadsheet-ribbon:check": "a3s-test check tests/e2e/spreadsheet-ribbon-alignment.acl --json",
+    "test:e2e:spreadsheet-orientation-visibility": "a3s-test run tests/e2e/spreadsheet-ribbon-orientation-visibility.acl --json",
+    "test:e2e:spreadsheet-orientation-visibility:check": "a3s-test check tests/e2e/spreadsheet-ribbon-orientation-visibility.acl --json",
     "test:e2e:spreadsheet-cell-style": "a3s-test run tests/e2e/spreadsheet-cell-style.acl --json",
     "test:e2e:spreadsheet-cell-style:check": "a3s-test check tests/e2e/spreadsheet-cell-style.acl --json",
     "test:e2e:spreadsheet-font-size-border-shortcuts": "a3s-test run tests/e2e/spreadsheet-font-size-border-shortcuts.acl --json",
     "test:e2e:spreadsheet-font-size-border-shortcuts:check": "a3s-test check tests/e2e/spreadsheet-font-size-border-shortcuts.acl --json",
+    "test:e2e:spreadsheet-underline-styles": "a3s-test run tests/e2e/spreadsheet-underline-styles.acl --json",
+    "test:e2e:spreadsheet-underline-styles:check": "a3s-test check tests/e2e/spreadsheet-underline-styles.acl --json",
     "test:e2e:spreadsheet-table": "a3s-test run tests/e2e/spreadsheet-table.acl --json",
     "test:e2e:spreadsheet-table:check": "a3s-test check tests/e2e/spreadsheet-table.acl --json",
     "test:e2e:spreadsheet-cell-fill": "a3s-test run tests/e2e/spreadsheet-cell-fill.acl --json",