SearSuite
← All packages

API reference

@searsuite/sear-plugin-web-sheet-tabbar

Web workbook Sheet tabs and Sheet-structure commands.

13 exportsderived from source

classSearWebBottomBarsource ↗
class SearWebBottomBar extends SheetBottomBarAdapter<HTMLElement, SearWebBottomBarMountOptions>

Browser DOM implementation of the bottom sheet tab/status bar.

constructorconstructor
SearWebBottomBar(platform: Platform): SearWebBottomBar

Constructs a bottom bar adapter bound to one platform.

platform: Platform
propertysymbolstatic
readonly symbol: typeof symbol

DI token for resolving the browser bottom bar adapter.

methoddestroy
destroy(): void
methodmount
mount(target: HTMLElement, options?: SearWebBottomBarMountOptions): void
target: HTMLElement
options: SearWebBottomBarMountOptions
classSheetBottomBarAdaptersource ↗
class SheetBottomBarAdapter<TTarget, TOptions>

Platform-neutral lifecycle contract for a complete bottom-bar renderer.

constructorconstructor
SheetBottomBarAdapter<TTarget, TOptions>(): SheetBottomBarAdapter<TTarget, TOptions>
propertysymbolstatic
readonly symbol: symbol
methoddestroy
destroy(): void
methodmount
mount(target: TTarget, options?: TOptions): void
target: TTarget
options: TOptions
classSheetStatusBarAdaptersource ↗
class SheetStatusBarAdapter<TTarget>

Platform-neutral lifecycle contract for a sheet status-bar renderer.

constructorconstructor
SheetStatusBarAdapter<TTarget>(): SheetStatusBarAdapter<TTarget>
propertysymbolstatic
readonly symbol: symbol
methoddestroy
destroy(): void
methodmount
mount(target: TTarget, model: SheetStatusBarModel): void
target: TTarget
model: SheetStatusBarModel
methodupdate
update(model: SheetStatusBarModel): void
model: SheetStatusBarModel
classSheetTabBarAdaptersource ↗
class SheetTabBarAdapter<TTarget>

Platform-neutral lifecycle contract for a sheet tab-bar renderer.

constructorconstructor
SheetTabBarAdapter<TTarget>(): SheetTabBarAdapter<TTarget>
propertysymbolstatic
readonly symbol: symbol
methoddestroy
destroy(): void
methodmount
mount(target: TTarget, model: SheetTabBarModel): void
target: TTarget
model: SheetTabBarModel
methodupdate
update(model: SheetTabBarModel): void
model: SheetTabBarModel
classWebSheetStatusBarsource ↗
class WebSheetStatusBar extends SheetStatusBarAdapter<HTMLElement>

Browser DOM adapter for the status and zoom segment of the bottom bar.

constructorconstructor
WebSheetStatusBar(): WebSheetStatusBar
methoddestroy
destroy(): void
methodmount
mount(target: HTMLElement, model: SheetStatusBarModel): void
target: HTMLElement
model: SheetStatusBarModel
methodupdate
update(model: SheetStatusBarModel): void
model: SheetStatusBarModel
Inherited members 1

Inherited from SheetStatusBarAdapter.

classWebSheetTabBarsource ↗
class WebSheetTabBar extends SheetTabBarAdapter<HTMLElement>

Browser DOM adapter for the sheet tabs segment of the bottom bar.

constructorconstructor
WebSheetTabBar(): WebSheetTabBar
methoddestroy
destroy(): void
methodmount
mount(target: HTMLElement, model: SheetTabBarModel): void
target: HTMLElement
model: SheetTabBarModel
methodupdate
update(model: SheetTabBarModel): void
model: SheetTabBarModel
Inherited members 1

Inherited from SheetTabBarAdapter.

interfaceSearWebBottomBarCreateSheetStateInputsource ↗
interface SearWebBottomBarCreateSheetStateInput

Input passed when the bottom bar needs a new sheet payload.

propertyindex
readonly index: number

Destination index in WorkbookDocumentState.sheets.

propertyname
readonly name: string

User-facing sheet name generated for the workbook command.

propertysheetId
readonly sheetId: string

Stable sheet id generated for the workbook command.

interfaceSearWebBottomBarMountOptionssource ↗
interface SearWebBottomBarMountOptions

Mount options for the browser bottom bar.

propertystatusBar
readonly statusBar?: SheetStatusBarAdapter<HTMLElement>

Optional status adapter. Hosts may provide a custom implementation.

propertystatusText
readonly statusText?: string

Status text shown at the right edge.

propertytabBar
readonly tabBar?: SheetTabBarAdapter<HTMLElement>

Optional tabs adapter. Hosts may provide a custom implementation.

propertyworkbook
readonly workbook?: SearWebBottomBarWorkbookBinding

Optional workbook binding. Without it, the bottom bar renders the static replica.

propertyzoomText
readonly zoomText?: string

Zoom label shown in the bottom bar.

interfaceSearWebBottomBarWorkbookBindingsource ↗
interface SearWebBottomBarWorkbookBinding

Workbook binding used by SearWebBottomBar.

propertycreateSheetState
readonly createSheetState?: (input: SearWebBottomBarCreateSheetStateInput): SheetDocumentState

Creates the initial SheetDocumentState for a newly added sheet.

propertyeditor
readonly editor: WorkbookEditor

Workbook editor whose command bus owns sheet-list actions.

interfaceSheetStatusBarModelsource ↗
interface SheetStatusBarModel

Platform-neutral view model for status and zoom controls.

propertyonViewOptionsClick
readonly onViewOptionsClick: (): void
propertyonZoomInClick
readonly onZoomInClick: (): void
propertyonZoomOutClick
readonly onZoomOutClick: (): void
propertystatusText
readonly statusText: string
propertyzoomText
readonly zoomText: string
interfaceSheetTabBarItemsource ↗
interface SheetTabBarItem

Stable sheet item data shared by all tab-bar renderers.

propertyactive
readonly active: boolean
propertycolor
readonly color?: string
propertyid
readonly id: string
propertyname
readonly name: string
interfaceSheetTabBarModelsource ↗
interface SheetTabBarModel

Platform-neutral view model for the sheet tabs segment.

propertyonActivateSheetClick
readonly onActivateSheetClick: (sheetId: string): void
propertyonAddSheetClick
readonly onAddSheetClick: (): void
propertyonSheetsButtonClick
readonly onSheetsButtonClick: (): void
propertysheets
readonly sheets: readonly SheetTabBarItem[]
variableSHEET_BOTTOM_BAR_CSSsource ↗
SHEET_BOTTOM_BAR_CSS: "\n.sear-sheet-bottom-bar {\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n height: 36px;\n padding: 0 10px 0 12px;\n border: 1px solid rgba(23, 26, 29, 0.08);\n border-bottom: 0;\n border-radius: 0;\n background: #f6f7fa;\n box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.92);\n color: rgba(23, 24, 28, 0.78);\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"PingFang SC\", \"Microsoft YaHei\", Arial, sans-serif;\n font-size: 12px;\n line-height: 1;\n user-select: none;\n}\n\n.sear-sheet-bottom-bar button {\n border: 0;\n appearance: none;\n font: inherit;\n color: inherit;\n}\n\n.sear-sheet-bottom-bar__tabs-panel,\n.sear-sheet-bottom-bar__status-panel {\n display: flex;\n align-items: center;\n height: 100%;\n}\n\n.sear-sheet-bottom-bar__tabs-panel {\n gap: 8px;\n min-width: 0;\n flex: 1 1 auto;\n}\n\n.sear-sheet-bottom-bar__status-panel {\n gap: 6px;\n margin-left: auto;\n}\n\n.sear-sheet-bottom-bar__icon-button,\n.sear-sheet-bottom-bar__grid,\n.sear-sheet-bottom-bar__zoom-button,\n.sear-sheet-bottom-bar__add {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n background: transparent;\n cursor: default;\n}\n\n.sear-sheet-bottom-bar__icon-button {\n width: 22px;\n height: 22px;\n color: #79829a;\n}\n\n.sear-sheet-bottom-bar__add {\n width: 22px;\n height: 22px;\n color: #7a8297;\n}\n\n.sear-sheet-bottom-bar__tabs {\n display: flex;\n align-items: center;\n gap: 6px;\n min-width: 0;\n overflow-x: auto;\n scrollbar-width: none;\n}\n\n.sear-sheet-bottom-bar__tabs::-webkit-scrollbar {\n display: none;\n}\n\n.sear-sheet-bottom-bar__tab {\n min-width: 74px;\n max-width: 160px;\n height: 28px;\n padding: 0 12px;\n border-radius: 6px;\n background: rgba(255, 255, 255, 0.66);\n box-shadow: 0 1px 2px rgba(23, 26, 29, 0.04);\n color: rgba(23, 24, 28, 0.72);\n font-size: 13px;\n font-weight: 500;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n border-top: 2px solid var(--sear-sheet-tab-color, transparent);\n}\n\n.sear-sheet-bottom-bar__tab--active {\n background: #fff;\n color: #256cfb;\n font-weight: 600;\n}\n\n.sear-sheet-bottom-bar__status {\n color: rgba(23, 24, 28, 0.48);\n font-size: 12px;\n font-weight: 500;\n white-space: nowrap;\n}\n\n.sear-sheet-bottom-bar__grid {\n width: 22px;\n height: 22px;\n color: #7182ac;\n}\n\n.sear-sheet-bottom-bar__divider {\n width: 1px;\n height: 20px;\n margin: 0 4px 0 6px;\n background: rgba(23, 26, 29, 0.08);\n}\n\n.sear-sheet-bottom-bar__zoom-button {\n width: 22px;\n height: 22px;\n color: rgba(23, 24, 28, 0.86);\n}\n\n.sear-sheet-bottom-bar__zoom-value {\n min-width: 46px;\n color: rgba(23, 24, 28, 0.86);\n font-size: 13px;\n font-weight: 500;\n text-align: center;\n white-space: nowrap;\n}\n\n.sear-sheet-bottom-bar svg {\n display: block;\n flex: 0 0 14px;\n width: 14px;\n height: 14px;\n}\n\n.sear-sheet-bottom-bar button:hover {\n background: rgba(23, 26, 29, 0.05);\n border-radius: 5px;\n}\n\n.sear-sheet-bottom-bar__tab:hover {\n background: #fff;\n}\n\n.sear-sheet-bottom-bar__toast {\n position: fixed;\n bottom: 24px;\n left: 50%;\n z-index: 10000;\n padding: 9px 16px;\n border-radius: 6px;\n background: rgba(54, 55, 56, 0.96);\n box-shadow: 0 4px 24px rgba(0, 0, 0, 0.12);\n color: #fff;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"PingFang SC\", Arial, sans-serif;\n font-size: 13px;\n line-height: 18px;\n pointer-events: none;\n transform: translateX(-50%);\n}\n"

CSS injected by SearWebBottomBar for the browser sheet bottom bar.