# SpreadsheetView Auto-generated @jbrowse/mobx-state-tree API for the current JBrowse release — see [pluggable elements](https://jbrowse.org/jb2-staging/docs/developer_guide/) for concepts. Provided by the `spreadsheet-view` plugin. [View source](https://github.com/GMOD/jbrowse-components/blob/main/plugins/spreadsheet-view/src/SpreadsheetView/SpreadsheetViewModel.ts). ## Example usage Hand-authored under `defaultSession.views`. The `init` shorthand loads a tabular file (VCF/BED/CSV/etc) straight into the grid, skipping the import form; `assembly` is used to resolve genomic coordinates in the rows: ```js { type: 'SpreadsheetView', init: { assembly: 'hg38', uri: 'https://example.com/variants.vcf.gz', fileType: 'VCF', }, } ``` Members a composed model contributes are listed here too, so these tables are the whole surface. ## Properties | Member | Description | Defined by | | --- | --- | --- | | **type**
type: types.literal('SpreadsheetView') | | SpreadsheetView | | **height**
height: types.stripDefault(types.number, defaultHeight) | the height of the sheet in pixels | SpreadsheetView | | **hideVerticalResizeHandle**
hideVerticalResizeHandle: types.stripDefault(types.boolean, false)
 | chrome switch, for an embed that sizes the view itself | SpreadsheetView | | **importWizard**
importWizard: types.optional(ImportWizardModel, () =>
            ImportWizardModel.create(),
          )
 | | SpreadsheetView | | **spreadsheet**
spreadsheet: types.maybe(Spreadsheet()) | | SpreadsheetView | | **init**
init: types.frozen<SpreadsheetViewInit | undefined>() | used for initializing the view from a session snapshot | SpreadsheetView | | **id**
id: ElementId | | [BaseViewModel](../baseviewmodel#property-id) | | **displayName**
displayName: types.maybe(types.string) | displayName is displayed in the header of the view, or assembly names being used if none is specified | [BaseViewModel](../baseviewmodel#property-displayname) | | **minimized**
minimized: types.stripDefault(types.boolean, false) | collapse the view to its header bar, keeping it in the session rather than closing it | [BaseViewModel](../baseviewmodel#property-minimized) | ## Volatiles | Member | Description | Defined by | | --- | --- | --- | | **width**
width: 400 | | SpreadsheetView | | **bodyMounted**
bodyMounted: true | Whether the container has this view's body in the DOM.

`ViewContainer` mounts a view's body only while an IntersectionObserver says it is on screen, to hold the app under the WebGL2 context ceiling (`reference/GPU_CONTEXT_BUDGET.md`). A view below the fold therefore has no canvas, so nothing ever calls `markCanvasDrawn` and the pre-first-paint term of `displayPhase` pins every display in it at `loading` with nothing left to resolve it — which parks `[data-app-phase="ready"]` for the whole app on a view the user cannot see.

Defaults true so the containers that always mount a body — embedded views, workspace panels, and any test rendering a display directly — are unaffected and need not set it.

The raw flag, written by this view's own container. A display asks `effectiveBodyMounted` instead, because a nested view has no container of its own. | [BaseViewModel](../baseviewmodel#volatile-bodymounted) | ## Getters | Member | Description | Defined by | | --- | --- | --- | | **showLoading**
boolean | Named to match LGV/dotplot/synteny/circular/breakpoint-split, which is what `ViewContainer` reads to publish `data-view-phase`. Without it this view published `ready` for its whole load, so a capture or a browser test waiting on that attribute treated a spreadsheet still fetching and parsing its VCF as settled — and there is no display-level wait to fall back on here, since a spreadsheet mounts no displays at all.

The one view whose loading state renders *inside* its import form rather than replacing it: the wizard keeps the chosen file, type and assembly on screen and puts a spinner above them, which is more useful than a bare loading screen that throws that context away. The phase is about the model, not about which component is mounted. | SpreadsheetView | | **importedTrackId**
any | the track showing the loaded file, which the views a row drills down into open. One derivation, not a recorded id: after `registerImportedTrack` the session holds a track pointing at the file, so the same location match that decides whether to build one is also what finds it afterwards | SpreadsheetView | | **effectiveBodyMounted**
boolean | Whether this view's body is in the DOM, counting the views it is nested inside — which is the question a display's phase actually asks.

`bodyMounted` alone answers it only for a view a container renders directly. A view nested in another view (a synteny row, a breakpoint panel) has no container writing its flag, so it reads `true` forever while its whole subtree is out of the DOM, and every display in it waits for a first paint that nothing will make — the hang this flag exists to prevent, one level down.

An ancestor that does not carry the flag at all leaves the answer alone rather than excusing the paint: only an explicit `false` unmounts, so a duck-typed stand-in that forgot it keeps waiting, which is the failure that shows up as a slow test rather than as a picture of an empty view. | [BaseViewModel](../baseviewmodel#getter-effectivebodymounted) | ## Methods | Member | Description | | --- | --- | | **menuItems**
() => { label: string; icon: OverridableComponent<SvgIconTypeMap<{}, "svg">> & { muiName: string; }; onClick: () => void; }[]
 | | ## Actions | Member | Description | Defined by | | --- | --- | --- | | **setHeight**
(newHeight: number) => number | | SpreadsheetView | | **resizeHeight**
(distance: number) => number | returns the distance actually applied, which is less than the requested one once the drag runs into minHeight — the ResizeHandle needs that to keep the bar under the pointer | SpreadsheetView | | **displaySpreadsheet**
(spreadsheet?: ModelCreationType<ExtractCFromProps<…>> | undefined) => void
 | load a new spreadsheet and set our mode to display it. When the incoming data has the same columns as what's shown (i.e. a session-cached URI being re-fetched on reload), carry over the user's column-visibility and SV-type filter — a fresh parse only supplies columns/rowSet, so a plain replace would reset them. The column match keeps this from leaking view state across different files. | SpreadsheetView | | **setInit**
(init?: SpreadsheetViewInit | undefined) => void | | SpreadsheetView | | **registerImportedTrack**
(assemblyName: string) => void | Put the loaded file in the session as a track, so the linear and breakpoint views a row opens have the records the row came from. Without it every drill-down landed on an empty view and the reader had to add the same file again by hand.

Idempotent on purpose, and cheaply so: the trackId is derived from the file's location and `addSessionTrackConf` dedupes against everything the session can already resolve, so a reloaded session re-importing its cached URI reuses the track rather than stacking a second one. `trackConfForImportedFile` declines outright when a track for the file already exists.

**Nothing takes the track back out** — not `returnToImportForm`, not closing this view. The views that opened it are the reason it exists and they outlive the sheet, so removing it would empty a linear view the reader is still reading. It is an ordinary session track from that point on: it shows up in the track selector, it saves with the session, and the reader closes it there. Importing a second file adds a second track rather than replacing this one, which is the same answer — they loaded two files. | SpreadsheetView | | **loadSpreadsheet**
(assemblyName: string) => Promise<void> | the single load funnel: fetch+parse via the import wizard, then display the result. Every entry point (declarative init, cached reload, the import form's Open button) routes through here so the view stays the sole owner of displaySpreadsheet | SpreadsheetView | | **returnToImportForm**
() => void | drop the loaded sheet and the cached location together: leaving the cache behind makes afterAttach re-fetch the dismissed file on the next session load, putting the user back where they left | SpreadsheetView | | **applyInit**
(init: SpreadsheetViewInit) => Promise<void> | apply a declarative init (from addView / sv-inspector): point the import wizard at the file and load it. Without a uri there is nothing to load, so the wizard is only seeded — the import form then opens on the caller's assembly and file type instead of whichever assembly happens to sort first | SpreadsheetView | | **setDisplayName**
(name: string) => void | | [BaseViewModel](../baseviewmodel#action-setdisplayname) | | **setWidth**
(newWidth: number) => void | width is an important attribute of the view model, when it becomes set, it often indicates when the app can start drawing to it. certain views like lgv are strict about this because if it tries to draw before it knows the width it should draw to, it may start fetching data for regions it doesn't need to

setWidth is updated by a ResizeObserver generally, the views often need to know how wide they are to properly draw genomic regions | [BaseViewModel](../baseviewmodel#action-setwidth) | | **setBodyMounted**
(flag: boolean) => void | See `bodyMounted`. Written by the view's container, which is the only thing that knows whether it rendered the body. | [BaseViewModel](../baseviewmodel#action-setbodymounted) | | **setMinimized**
(flag: boolean) => void | | [BaseViewModel](../baseviewmodel#action-setminimized) |