@xlcalc/vue 0.0.0-stage → 0.21.2

package/dist/core/list.d.ts

@@ -0,0 +1,17 @@
+import type { SheetEmit } from './sheet.js';
+import type { SheetState } from './state.js';
+import type { Windows } from './windows.js';
+import type { ListSort } from '../contract/view.js';
+export declare function useList(s: SheetState, w: Windows, emit: SheetEmit, props: {
+    sort?: ListSort | null;
+    openRows?: boolean;
+}): {
+    sortable: (c: number) => boolean;
+    sortOf: (c: number) => ListSort["dir"] | null;
+    toggleSort: (c: number) => void;
+    alignOf: (c: number) => "left" | "right" | "center" | undefined;
+    click: (r: number, c: number) => boolean;
+    key: (e: KeyboardEvent) => boolean;
+    totals: import("vue").ComputedRef<(string | null)[] | null>;
+};
+export type List = ReturnType<typeof useList>;

package/dist/core/menu.d.ts

@@ -0,0 +1,155 @@
+import type { CellRect } from 'xlcalc/contract';
+import type { SheetInfo } from '../contract/source.js';
+import type { Clip } from './clip.js';
+import type { Commands } from './commands.js';
+import type { Explain } from './explain.js';
+import type { Filter } from './filter.js';
+import type { Outline, OutlineAxis, OutlineOp } from './outline.js';
+import type { Selection } from './selection.js';
+import type { SheetState } from './state.js';
+export type MenuKind = 'rows' | 'columns' | 'sheet' | 'cells';
+export interface MenuItem {
+    id: string;
+    label: string;
+    run: () => void;
+    disabled?: boolean;
+    /** A separator above it, between groups. */
+    group?: boolean;
+}
+/** The open menu: where it is and what it acts on (the selected rows or columns, a sheet by its index; the cell menu acts on the selection). */
+export interface OpenMenu {
+    kind: MenuKind;
+    x: number;
+    y: number;
+    first: number;
+    last: number;
+}
+/** A small dialog over the sheet: a size in Excel's units, the confirmation before a sheet with data is deleted, the hidden sheets, rows or columns to group. */
+export type MenuDialog = {
+    kind: 'size';
+    axis: 'columns' | 'rows';
+    first: number;
+    last: number;
+    draft: string;
+    error: string;
+} | {
+    kind: 'deleteSheet';
+    sheet: string;
+} | {
+    kind: 'unhide';
+    sheets: string[];
+} | {
+    kind: 'outline';
+    op: OutlineOp;
+    axis: OutlineAxis;
+    rect: CellRect;
+};
+export interface MenuDeps {
+    pickSheet: (index: number) => Promise<void>;
+    tabs: () => {
+        sheet: SheetInfo;
+        i: number;
+    }[];
+    outline: Outline;
+    clip: Clip;
+    filter: Filter;
+    explain: Explain;
+    /** Whether the workbook freezes panes on the displayed sheet: the first freeze item is then Unfreeze Panes, as in Excel. */
+    frozen: () => boolean;
+}
+export declare function useMenu(s: SheetState, sel: Selection, cmd: Commands, deps: MenuDeps): {
+    open: import("vue").ShallowRef<OpenMenu | null, OpenMenu | null>;
+    items: import("vue").ComputedRef<MenuItem[]>;
+    caption: import("vue").ComputedRef<string>;
+    dialog: import("vue").Ref<{
+        kind: "size";
+        axis: "columns" | "rows";
+        first: number;
+        last: number;
+        draft: string;
+        error: string;
+    } | {
+        kind: "deleteSheet";
+        sheet: string;
+    } | {
+        kind: "unhide";
+        sheets: string[];
+    } | {
+        kind: "outline";
+        op: OutlineOp;
+        axis: OutlineAxis;
+        rect: {
+            top: number;
+            left: number;
+            bottom: number;
+            right: number;
+        };
+    } | null, MenuDialog | {
+        kind: "size";
+        axis: "columns" | "rows";
+        first: number;
+        last: number;
+        draft: string;
+        error: string;
+    } | {
+        kind: "deleteSheet";
+        sheet: string;
+    } | {
+        kind: "unhide";
+        sheets: string[];
+    } | {
+        kind: "outline";
+        op: OutlineOp;
+        axis: OutlineAxis;
+        rect: {
+            top: number;
+            left: number;
+            bottom: number;
+            right: number;
+        };
+    } | null>;
+    renaming: import("vue").Ref<{
+        index: number;
+        draft: string;
+    } | null, {
+        index: number;
+        draft: string;
+    } | {
+        index: number;
+        draft: string;
+    } | null>;
+    renameInput: import("vue").Ref<HTMLInputElement | null, HTMLInputElement | null>;
+    close: () => null;
+    choose: (item: MenuItem) => void;
+    openLines: (kind: "rows" | "columns", line: number, x: number, y: number) => boolean;
+    openSheet: (index: number, x: number, y: number) => Promise<boolean>;
+    openCells: (row: number, col: number, x: number, y: number) => void;
+    linesAvailable: import("vue").ComputedRef<boolean>;
+    applySize: () => void;
+    askOutline: (op: OutlineOp) => void;
+    applyOutline: () => void;
+    addSheet: () => Promise<import("../index.js").EditOutcome | null>;
+    confirmDelete: () => void;
+    unhide: (name: string) => void;
+    startRename: (index: number) => void;
+    commitRename: (left?: boolean) => Promise<void>;
+    cancelRename: () => null;
+    press: {
+        start: (e: PointerEvent, open: (x: number, y: number) => void) => void;
+        move: (e: PointerEvent) => void;
+        cancel: () => void;
+        after: () => boolean;
+        pressing: () => boolean;
+        context: (e: MouseEvent) => boolean;
+    };
+};
+export type Menu = ReturnType<typeof useMenu>;
+/** A long press on a touch screen: held still for `LONG_PRESS_MS`, it opens what `start` was given; moved beyond the slop, it scrolls instead. */
+export declare function useLongPress(): {
+    start: (e: PointerEvent, open: (x: number, y: number) => void) => void;
+    move: (e: PointerEvent) => void;
+    cancel: () => void;
+    after: () => boolean;
+    pressing: () => boolean;
+    context: (e: MouseEvent) => boolean;
+};

package/dist/core/merge.d.ts

@@ -0,0 +1,19 @@
+import type { CellRect } from 'xlcalc/contract';
+import type { EditOutcome } from '../contract/source.js';
+import type { Commands } from './commands.js';
+import type { Selection } from './selection.js';
+import { type SheetState } from './state.js';
+import type { AlertAnswer, SheetAlert } from './validation.js';
+import type { Windows } from './windows.js';
+import type { MergeCommand } from '../contract/view.js';
+interface MergeDeps {
+    /** Shows an alert and waits for the answer. */
+    ask: (alert: SheetAlert) => Promise<AlertAnswer>;
+}
+export declare function useMerge(s: SheetState, w: Windows, sel: Selection, cmd: Commands, deps: MergeDeps): {
+    available: import("vue").ComputedRef<boolean>;
+    area: import("vue").ComputedRef<CellRect | null>;
+    run: (command: MergeCommand) => Promise<EditOutcome | null>;
+};
+export type Merge = ReturnType<typeof useMerge>;
+export {};

package/dist/core/navigation.d.ts

@@ -0,0 +1,72 @@
+import type { CellRect, GridReference } from 'xlcalc/contract';
+import type { Formula } from './formula.js';
+import type { Selection } from './selection.js';
+import type { SheetState } from './state.js';
+/** A location to return to: sheet, selection and scroll. */
+export interface Place {
+    sheet: number;
+    selected: SheetState['selected']['value'];
+    extent: SheetState['extent']['value'];
+    scrollTop: number;
+    scrollLeft: number;
+}
+export interface NavigationDeps {
+    pickSheet: (index: number) => Promise<void>;
+    notify: (text: string) => void;
+}
+export declare function useNavigation(s: SheetState, sel: Selection, f: Formula, deps: NavigationDeps): {
+    history: import("vue").Ref<{
+        sheet: number;
+        selected: {
+            row: number;
+            col: number;
+        } | null;
+        extent: {
+            row: number;
+            col: number;
+        } | null;
+        scrollTop: number;
+        scrollLeft: number;
+    }[], Place[] | {
+        sheet: number;
+        selected: {
+            row: number;
+            col: number;
+        } | null;
+        extent: {
+            row: number;
+            col: number;
+        } | null;
+        scrollTop: number;
+        scrollLeft: number;
+    }[]>;
+    flash: import("vue").Ref<{
+        sheet: string;
+        rect: {
+            top: number;
+            left: number;
+            bottom: number;
+            right: number;
+        };
+    } | null, {
+        sheet: string;
+        rect: CellRect;
+    } | {
+        sheet: string;
+        rect: {
+            top: number;
+            left: number;
+            bottom: number;
+            right: number;
+        };
+    } | null>;
+    goBack: () => Promise<void>;
+    goPlace: (text: string) => Promise<boolean>;
+    goRef: (r: GridReference) => Promise<void>;
+    addressDraft: import("vue").Ref<string, string>;
+    addressFocused: import("vue").Ref<boolean, boolean>;
+    goAddress: () => Promise<boolean>;
+    takePendingFocus: () => string | null;
+    copyCellLink: () => Promise<void>;
+};
+export type Navigation = ReturnType<typeof useNavigation>;

package/dist/core/outline.d.ts

@@ -0,0 +1,34 @@
+import type { OutlineGroup } from '../contract/source.js';
+import type { Commands } from './commands.js';
+import type { Selection } from './selection.js';
+import type { SheetState } from './state.js';
+import type { Viewport } from './viewport.js';
+export type OutlineAxis = 'rows' | 'columns';
+export type OutlineOp = 'group' | 'ungroup';
+/** What a row or column shows in one level's slot: a piece of a group's bracket, or the button of a group whose summary it is. */
+export interface OutlineMark {
+    /** The slot, from 1 (the outer groups) at the bar's outer edge. */
+    level: number;
+    /** The bracket runs along the row or column; `start` is its end away from the summary, with a tick toward the headers. */
+    bracket?: 'line' | 'start';
+    /** The group whose button the row or column holds, with the bracket's end toward the group while it is expanded. */
+    button?: OutlineGroup;
+}
+interface OutlineDeps {
+    notify: (text: string) => void;
+    /** Asks whether a cell range groups its rows or its columns, as Excel's dialog does. */
+    ask: (op: OutlineOp) => void;
+}
+export declare function useOutline(s: SheetState, v: Viewport, sel: Selection, cmd: Commands, deps: OutlineDeps): {
+    outline: import("vue").ComputedRef<import("../index.js").SheetOutline | null>;
+    can: import("vue").ComputedRef<boolean>;
+    marks: (axis: OutlineAxis, line: number) => OutlineMark[];
+    at: (level: number) => number;
+    toggle: (axis: OutlineAxis, g: OutlineGroup) => void;
+    showLevel: (axis: OutlineAxis, level: number) => void;
+    lines: (op: OutlineOp, axis: OutlineAxis, first: number, last: number) => void;
+    key: (e: KeyboardEvent) => boolean;
+    tap: (e: MouseEvent) => void;
+};
+export type Outline = ReturnType<typeof useOutline>;
+export {};

package/dist/core/point.d.ts

@@ -0,0 +1,34 @@
+import type { Ref } from 'vue';
+import type { ScanOptions } from 'xlcalc/contract';
+import type { EditorState } from './editing.js';
+import type { Selection } from './selection.js';
+import type { SheetState } from './state.js';
+import type { Viewport } from './viewport.js';
+/** What a press points at: cells, entire columns (a letter) or entire rows (a number). */
+export type PointKind = 'cells' | 'columns' | 'rows';
+interface PointDeps {
+    /** The open editor's element. */
+    input: () => HTMLTextAreaElement | null;
+    /** Shows the draft's new text with its caret in the editor. */
+    show: () => void;
+    /** Closes the function list. */
+    closeList: () => void;
+    /** How the workbook's formula text is parsed (its locale); null while the locale loads. */
+    scan: () => ScanOptions | null;
+    /** Enters the draft and moves the selection in the arrow's direction. */
+    commit: (dr: -1 | 0 | 1, dc: -1 | 0 | 1) => void;
+}
+export declare function usePoint(s: SheetState, sel: Selection, v: Viewport, editor: Ref<EditorState | null>, deps: PointDeps): {
+    down: (e: PointerEvent, at: {
+        kind: PointKind;
+        row: number;
+        col: number;
+    } | null) => boolean;
+    move: (e: PointerEvent) => void;
+    up: () => void;
+    key: (e: KeyboardEvent) => boolean;
+    onMouseDown: (e: MouseEvent) => void;
+    took: () => boolean;
+};
+export type Point = ReturnType<typeof usePoint>;
+export {};

package/dist/core/ref-paint.d.ts

@@ -0,0 +1,21 @@
+/** A piece of a text node to color: its offsets and color, underlined while a held Ctrl or Cmd would navigate to it. */
+export interface RefPaint {
+    from: number;
+    to: number;
+    color: string;
+    underline?: boolean;
+}
+/** Painted ranges, each with its highlight's name, to remove on the next paint. */
+export type Painted = [name: string, range: Range][];
+/** Whether the browser paints highlights; otherwise the layer colors references with spans. */
+export declare const canPaint: () => boolean;
+/** Colors `pieces` of `node` in place of what `before` painted; null only removes the old paint. */
+export declare function paintRefs(node: Text | null, pieces: RefPaint[], before: Painted): Painted;
+/**
+ * The piece of `layer`'s text under a point (of the mouse or a finger), by the boxes its characters are drawn in, its line's
+ * height around them and `slop` pixels to either side; -1 when off all of them. Beyond a line's end or between lines there is none.
+ */
+export declare function pieceAtPoint(layer: HTMLElement, pieces: {
+    from: number;
+    to: number;
+}[], x: number, y: number, slop?: number): number;

package/dist/core/selection.d.ts

@@ -0,0 +1,45 @@
+import type { CellPosition, CellRect } from 'xlcalc/contract';
+import { type Geometry } from './geometry.js';
+import type { SheetState } from './state.js';
+import type { Viewport } from './viewport.js';
+/** A drawn cell's position from its `data-cell` (`row:col`); null for anything else. */
+export declare function cellOfData(data: string | null | undefined): CellPosition | null;
+export declare function useSelection(s: SheetState, geo: Geometry, v: Viewport): {
+    fullRect: import("vue").ComputedRef<CellRect | null>;
+    selRect: import("vue").ComputedRef<CellRect | null>;
+    wholeColumns: import("vue").ComputedRef<{
+        first: number;
+        last: number;
+    } | null>;
+    wholeRows: import("vue").ComputedRef<{
+        first: number;
+        last: number;
+    } | null>;
+    linesOf: (whole: {
+        first: number;
+        last: number;
+    } | null, line: number) => {
+        first: number;
+        last: number;
+    };
+    multi: import("vue").ComputedRef<boolean>;
+    selectionRef: import("vue").ComputedRef<string>;
+    gridRef: import("vue").ComputedRef<string>;
+    isActive: (row: number, col: number) => boolean;
+    pickCell: (row: number, col: number, extend?: boolean) => void;
+    pickColumn: (col: number, extend?: boolean) => void;
+    pickRow: (row: number, extend?: boolean) => void;
+    selectAll: () => void;
+    stretchTo: (r: CellRect) => void;
+    selectRect: (r: CellRect) => void;
+    onCellDown: (e: PointerEvent, row: number, col: number) => void;
+    onCellTap: (e: MouseEvent, row: number, col: number) => boolean;
+    onGridMove: (e: PointerEvent) => void;
+    onGridUp: () => void;
+    revealCell: (row: number, col: number) => void;
+    measure: () => void;
+    navKey: (e: KeyboardEvent) => boolean;
+    keyTarget: (a: CellPosition, e: KeyboardEvent) => CellPosition | Promise<CellPosition | null> | null;
+    step: (dr: -1 | 0 | 1, dc: -1 | 0 | 1) => void;
+};
+export type Selection = ReturnType<typeof useSelection>;