ProfectusModule: features/grids/grid
Interfaces
BaseGrid
• BaseGrid: Object
The properties that are added onto a processed BoardOptions to create a Board.
| Name | Type | Description |
|---|---|---|
[Component] | GenericComponent | The Vue component used to render this feature. |
[GatherProps] | () => Record<string, unknown> | A function to gather the props the vue component requires for this feature. |
cellState | Persistent<Record<string | number, State>> | The persistent state of this grid, which is a dictionary of cell states. |
cells | Record<string | number, GridCell> | A dictionary of cells within this grid. |
getID | (id: string | number, state: State) => string | Get the auto-generated ID for identifying a specific cell of this grid that appears in the DOM. Will not persist between refreshes or updates. |
getState | (id: string | number) => State | Get the persistent state of the given cell. |
id | string | An auto-generated ID for identifying features that appear in the DOM. Will not persist between refreshes or updates. |
setState | (id: string | number, state: State) => void | Set the persistent state of the given cell. |
type | typeof GridType | A symbol that helps identify features of the same type. |
Defined in
profectus/src/features/grids/grid.ts:254
GridCell
• GridCell: Object
Represents a cell within a grid. These properties will typically be accessed via a cell proxy that calls functions on the grid to get the properties for a specific cell.
See
createGridProxy
| Name | Type | Description |
|---|---|---|
canClick | boolean | Whether this cell can be clicked. |
classes? | Record<string, boolean> | Dictionary of CSS classes to apply to this feature. |
display | CoercableComponent | The main text that appears in the display. |
id | string | A unique identifier for the grid cell. |
onClick? | (e?: MouseEvent | TouchEvent) => void | A function that is called when the cell is clicked. |
onHold? | VoidFunction | A function that is called when the cell is held down. |
startState | State | The initial persistent state of this cell. |
state | State | The persistent state of this cell. |
style? | StyleValue | CSS to apply to this feature. |
title? | CoercableComponent | A header to appear at the top of the display. |
visibility | boolean | Visibility | Whether this cell should be visible. |
Defined in
profectus/src/features/grids/grid.ts:196
GridOptions
• GridOptions: Object
An object that configures a Grid.
| Name | Type | Description |
|---|---|---|
cols | Computable<number> | The number of columns in the grid. |
getCanClick? | CellComputable<boolean> | A computable to determine if a cell can be clicked. |
getClasses? | CellComputable<Record<string, boolean>> | A computable to get the CSS classes for a cell. |
getDisplay | CellComputable<CoercableComponent> | A computable to get the display component for a cell. |
getStartState | Computable<State> | (id: string | number) => State | A computable to get the initial persistent state of a cell. |
getStyle? | CellComputable<StyleValue> | A computable to get the CSS styles for a cell. |
getTitle? | CellComputable<CoercableComponent> | A computable to get the title component for a cell. |
getVisibility? | CellComputable<boolean | Visibility> | A computable to determine the visibility of a cell. |
onClick? | (id: string | number, state: State, e?: MouseEvent | TouchEvent) => void | A function that is called when a cell is clicked. |
onHold? | (id: string | number, state: State) => void | A function that is called when a cell is held down. |
rows | Computable<number> | The number of rows in the grid. |
visibility? | Computable<boolean | Visibility> | Whether this grid should be visible. |
Defined in
profectus/src/features/grids/grid.ts:224
Type Aliases
CellComputable
Ƭ CellComputable<T>: Computable<T> | (id: string | number, state: State) => T
A type representing a computable value for a cell in the grid.
Type parameters
| Name |
|---|
T |
Defined in
profectus/src/features/grids/grid.ts:28
GenericGrid
Ƭ GenericGrid: Replace<Grid<GridOptions>, { getCanClick: ProcessedComputable<boolean> ; getVisibility: ProcessedComputable<Visibility | boolean> ; visibility: ProcessedComputable<Visibility | boolean> }>
A type that matches any valid Grid object.
Defined in
profectus/src/features/grids/grid.ts:293
Grid
Ƭ Grid<T>: Replace<T & BaseGrid, { cols: GetComputableType<T["cols"]> ; getCanClick: GetComputableTypeWithDefault<T["getCanClick"], true> ; getClasses: GetComputableType<T["getClasses"]> ; getDisplay: GetComputableType<T["getDisplay"]> ; getStartState: GetComputableType<T["getStartState"]> ; getStyle: GetComputableType<T["getStyle"]> ; getTitle: GetComputableType<T["getTitle"]> ; getVisibility: GetComputableTypeWithDefault<T["getVisibility"], Visible> ; rows: GetComputableType<T["rows"]> ; visibility: GetComputableTypeWithDefault<T["visibility"], Visible> }>
An object that represents a feature that is a grid of cells that all behave according to the same rules.
Type parameters
| Name | Type |
|---|---|
T | extends GridOptions |
Defined in
profectus/src/features/grids/grid.ts:276
Variables
GridType
• Const GridType: typeof GridType
A symbol used to identify Grid features.
Defined in
profectus/src/features/grids/grid.ts:25
Functions
createGrid
▸ createGrid<T>(optionsFunc): Grid<T>
Lazily creates a grid with the given options.
Type parameters
| Name | Type |
|---|---|
T | extends GridOptions |
Parameters
| Name | Type | Description |
|---|---|---|
optionsFunc | OptionsFunc<T, BaseGrid, GenericGrid> | Grid options. |
Returns
Grid<T>
Defined in
profectus/src/features/grids/grid.ts:306
Components
GridCell Component
Props
| Name | Type |
|---|---|
visibility* | processedPropType<Visibility | boolean>(Number, Boolean) |
onClick | (e?: MouseEvent | TouchEvent) => void |
onHold | VoidFunction |
display* | processedPropType<CoercableComponent>(Object, String, Function) |
title | processedPropType<CoercableComponent>(Object, String, Function) |
style | processedPropType<StyleValue>(String, Object, Array) |
canClick* | processedPropType<boolean>(Boolean) |
id* | string |
Grid Component
Props
| Name | Type |
|---|---|
visibility* | processedPropType<Visibility | boolean>(Number, Boolean) |
rows* | processedPropType<number>(Number) |
cols* | processedPropType<number>(Number) |
cells* | processedPropType<Record<string, GridCell>>(Object) |