@geogirafe/lib-geoportal/tools/state/layout.d.ts

GeoGirafe is a flexible application to build online geoportals.

import { StreetViewConfig } from '../configuration/streetviewconfig.js';
/**
 * The available Layouts of the Map Grid, defined by the Cells of each of their rows:
 * each number is the number of columns the Cell spans.
 * The name of a Layout is <number of columns>x<number of rows> when all its Cells have the same size,
 * or <cells of the first row>+<cells of the second row> when a Cell spans the whole width.
 */
declare const LAYOUTS: {
    readonly '1x1': readonly [readonly [1]];
    readonly '2x1': readonly [readonly [1, 1]];
    readonly '1x2': readonly [readonly [1], readonly [1]];
    readonly '2x2': readonly [readonly [1, 1], readonly [1, 1]];
    readonly '2+1': readonly [readonly [1, 1], readonly [2]];
    readonly '1+2': readonly [readonly [2], readonly [1, 1]];
};
export type LayoutType = keyof typeof LAYOUTS;
export declare const LAYOUT_TYPES: LayoutType[];
/** A Cell of a Layout: the row it is placed in, the column it starts at and the number of columns it spans. */
export type LayoutCell = {
    row: number;
    column: number;
    columnSpan: number;
};
/** Minimal size of a Column or of a Row of the Grid, in percent of the Grid. */
export declare const MIN_CELL_SIZE = 15;
/** Maximal size of a Column or of a Row of the Grid, in percent of the Grid. */
export declare const MAX_CELL_SIZE = 85;
/**
 * The Components that can be displayed in a Cell of the Grid.
 * To make a new Component available to the user, it is enough to add it to this list
 * (and to add its Element to the Grid in the HTML of the application).
 * A StreetView is only available when its provider is configured.
 */
export declare const AVAILABLE_CELL_COMPONENTS: readonly [{
    readonly id: "map-2d";
    readonly tagName: "girafe-map-2d";
    readonly label: "2D Map";
}, {
    readonly id: "map-3d";
    readonly tagName: "girafe-map-3d";
    readonly label: "3D Map";
}, {
    readonly id: "streetview-google";
    readonly tagName: "girafe-streetview-google";
    readonly label: "Google Street View";
    readonly provider: "google";
}];
type CellComponentDefinition = (typeof AVAILABLE_CELL_COMPONENTS)[number];
export type CellComponent = CellComponentDefinition['id'];
/** The content of a Cell of the Grid: a Component, or null when the Cell is empty. */
export type CellContent = CellComponent | null;
export declare function isLayoutType(value: unknown): value is LayoutType;
export declare function isCellComponent(value: unknown): value is CellComponent;
/** Whether a Component can be offered to the user: a StreetView needs the configuration of its provider. */
export declare function isCellComponentAvailable(id: CellComponent, streetviewConfig: StreetViewConfig | undefined): boolean;
/** The number of columns and of rows of a Layout. */
export declare function getGridSize(type: LayoutType): {
    columns: number;
    rows: number;
};
/** The Cells of a Layout, in the order they are indexed: row by row, from left to right. */
export declare function getLayoutCells(type: LayoutType): LayoutCell[];
/** The sizes, in percent, of the equally distributed columns and rows of a Layout. */
export declare function getDefaultSizes(type: LayoutType): {
    columns: number[];
    rows: number[];
};
/**
 * Distributes the Components on the Cells of a Layout.
 * The Components that are already placed keep their Cell as long as it still exists,
 * and the Cells that are added by the new Layout are left empty: a Component is only
 * displayed when the user explicitly chooses it, so that the libraries it needs
 * (Cesium, Google Maps, ...) are not loaded unnecessarily.
 */
export declare function distributeCells(type: LayoutType, currentCells: CellContent[]): CellContent[];
/**
 * The Layout of the Map Grid: which Layout is displayed, which Component is displayed
 * in each of its Cells, and the sizes of its columns and rows (in percent),
 * which the user can change by dragging the splitters.
 *
 * The Cells are indexed row by row: in a 2x2 Layout, the Cell 0 is the top-left one,
 * the Cell 1 the top-right one, the Cell 2 the bottom-left one and the Cell 3 the bottom-right one.
 */
export default class LayoutState {
    type: LayoutType;
    cells: CellContent[];
    sizes: {
        columns: number[];
        rows: number[];
    };
}
export {};