Mount an Excel-style ribbon (Home, Insert, Data, View) bound to
grid.actions, in normal document flow. Groups shrink, then collapse into
dropdowns, as the host narrows. Returns the piece with an idempotent
destroy.
Declaration
Referenced by
Workspace packages depending on @sheetwrite/core
@sheetwrite/benchdependency@sheetwrite/chartsdependency@sheetwrite/docs-startdependency@sheetwrite/reactdependency@sheetwrite/sveltedependency@sheetwrite/vuedependency@sheetwrite/xlsxdependency
Public exports naming createRibbon
interface Grid {
readonly store: Store;
readonly actions: GridActions;
getRuntimeResourceSnapshot(
operation: RuntimeResourceOperation,
phase: RuntimeResourcePhase,
runtime?: RuntimeMemoryObservation,
): RuntimeResourceSnapshot;
getCommandState(command: GridCommandName): GridCommandState;
getFocusCellStyle(): CellStyle;
summarizeSelection(
signal?: AbortSignal,
): Promise<SelectionSummary | null>;
setActiveSheet(id: SheetId): void;
scrollToCell(addr: CellAddress): void;
// … 145 more lines — see the API reference
}interface Grid {
readonly store: Store;
readonly actions: GridActions;
getRuntimeResourceSnapshot(
operation: RuntimeResourceOperation,
phase: RuntimeResourcePhase,
runtime?: RuntimeMemoryObservation,
): RuntimeResourceSnapshot;
getCommandState(command: GridCommandName): GridCommandState;
getFocusCellStyle(): CellStyle;
summarizeSelection(
signal?: AbortSignal,
): Promise<SelectionSummary | null>;
setActiveSheet(id: SheetId): void;
scrollToCell(addr: CellAddress): void;
// … 145 more lines — see the API reference
}interface Grid {
readonly store: Store;
readonly actions: GridActions;
getRuntimeResourceSnapshot(
operation: RuntimeResourceOperation,
phase: RuntimeResourcePhase,
runtime?: RuntimeMemoryObservation,
): RuntimeResourceSnapshot;
getCommandState(
command: GridCommandName,
): GridCommandState;
getFocusCellStyle(): CellStyle;
summarizeSelection(
signal?: AbortSignal,
): Promise<SelectionSummary | null>;
setActiveSheet(
id: SheetId,
): void;
scrollToCell(
// … 300 more lines — see the API reference
}Imperative grid handle for document commands, events, rendering, and teardown. @example import type { Grid } from "@sheetwrite/core"; function updateTotal(grid: Grid) { const sheet = grid.getActiveSheet(); const result = grid.applyTransaction({ patches: [{ op: "set", addr: { sheet, row: 0, col: 0 }, value: { kind: "literal", value: 42 } }], }); if (result.status === "applied") grid.scrollToCell({ sheet, row: 0, col: 0 }); return grid.aggregate(0, "sum"); } @see createGrid @see Grid.applyTransactionAPI reference →interface RibbonOptions {
focusGrid?: () => void;
onHeightChange?: (height: number) => void;
icons?: IconOverrides;
}interface RibbonOptions {
focusGrid?: () => void;
onHeightChange?: (height: number) => void;
icons?: IconOverrides;
}interface RibbonOptions {
focusGrid?: () => void;
onHeightChange?: (
height: number,
) => void;
icons?: IconOverrides;
}Options for createRibbon.API reference →interface ShellPiece {
readonly element: HTMLElement;
destroy(): void;
}interface ShellPiece {
readonly element: HTMLElement;
destroy(): void;
}interface ShellPiece {
readonly element: HTMLElement;
destroy(): void;
}A mounted shell piece: its root element plus an idempotent teardown.API reference →