@revolist/revogrid 4.0.2-next → 4.0.2

package/dist/types/types/interfaces.d.ts

@@ -0,0 +1,243 @@
+import { VNode } from '../stencil-public-runtime';
+import { ObservableMap, Subscription } from '@stencil/store';
+import { DimensionCols, DimensionRows, DimensionColPin, DimensionType, MultiDimensionType } from './dimension';
+import { Cell, EditorCtr, FocusedCells, RangeArea, SelectionStoreState } from './selection';
+export type Observable<T> = ObservableMap<T>;
+export type PluginSubscribe<T> = Subscription<T>;
+export type ColumnDataSchemaModel = {
+    prop: ColumnProp;
+    model: DataType;
+    column: ColumnRegular;
+    rowIndex: number;
+    colIndex: number;
+    colType: DimensionCols;
+    type: DimensionRows;
+    data: DataSource;
+};
+export type CellTemplateProp = {
+    providers: Providers;
+} & ColumnDataSchemaModel;
+export type ReadOnlyFormat = boolean | ((params: ColumnDataSchemaModel) => boolean);
+export type RowDrag = boolean | {
+    (params: ColumnDataSchemaModel): boolean;
+};
+export interface ColumnGrouping {
+    children: ColumnDataSchema[];
+    name: DataFormat;
+}
+export interface ColumnProperties {
+    /** column inner template */
+    columnTemplate?: ColumnTemplateFunc;
+    /** cell properties */
+    columnProperties?: ColPropertiesFunc;
+}
+export type ColumnTypes = {
+    [name: string]: ColumnType;
+};
+export interface CellTemplate {
+    (createElement: HyperFunc<VNode>, props: CellTemplateProp, additionalData?: any): any;
+}
+export interface ColumnType extends ColumnProperties {
+    /** is column or cell readonly */
+    readonly?: ReadOnlyFormat;
+    /** default column size */
+    size?: number;
+    /**
+     * minimal column size
+     * this property can not be less than cell padding
+     * in order to keep performance on top and minimize dom elements number
+     */
+    minSize?: number;
+    /**  max column size */
+    maxSize?: number;
+    /** represents custom editor defined in @editors property */
+    editor?: string | EditorCtr;
+    /** cell properties */
+    cellProperties?: PropertiesFunc;
+    /** cell inner template, now template is async */
+    cellTemplate?: CellTemplate;
+    /** cell compare function */
+    cellCompare?: CellCompareFunc;
+}
+export type Order = 'asc' | 'desc' | undefined;
+export interface ColumnRegular extends ColumnType {
+    prop: ColumnProp;
+    pin?: DimensionColPin;
+    name?: DataFormat;
+    autoSize?: boolean;
+    filter?: boolean | string | string[];
+    sortable?: boolean;
+    order?: Order;
+    rowDrag?: RowDrag;
+    columnType?: string;
+    beforeSetup?(rgCol: ColumnRegular): void;
+    [key: string]: any;
+}
+export type ColumnDataSchema = ColumnGrouping | ColumnRegular;
+export type ColumnData = ColumnDataSchema[];
+export type ColumnTemplateProp = ColumnRegular & {
+    providers: Providers<DimensionCols | 'rowHeaders'>;
+    index: number;
+};
+export type ColumnPropProp = ColumnGrouping | ColumnTemplateProp;
+export type ColumnProp = string | number;
+export type DataFormat = any;
+export type CellProp = string | number | object | boolean | undefined;
+export type CellProps = {
+    style?: {
+        [key: string]: string | undefined;
+    };
+    class?: {
+        [key: string]: boolean;
+    } | string;
+    [attr: string]: CellProp;
+};
+/**
+ * Providers for grid which are going to be injected into each cell template
+ */
+export type Providers<T = DimensionRows> = {
+    type: T;
+    readonly: boolean;
+    data: Observable<DataSourceState<any, any>> | ColumnRegular[];
+    viewport: Observable<ViewportState>;
+    dimension: Observable<DimensionSettingsState>;
+    selection: Observable<SelectionStoreState>;
+};
+export interface HyperFunc<T> {
+    (tag: any): T;
+}
+export interface HyperFunc<T> {
+    (tag: any, data: any): T;
+}
+export interface HyperFunc<T> {
+    (tag: any, text: string): T;
+}
+export interface HyperFunc<T> {
+    (sel: any, children: Array<T | undefined | null>): T;
+}
+export interface HyperFunc<T> {
+    (sel: any, data: any, text: string): T;
+}
+export interface HyperFunc<T> {
+    (sel: any, data: any, children: Array<T | undefined | null>): T;
+}
+export interface HyperFunc<T> {
+    (sel: any, data: any, children: T): T;
+}
+export type FocusTemplateFunc = (createElement: HyperFunc<VNode>, detail: FocusRenderEvent) => any;
+export type CellCompareFunc = (prop: ColumnProp, a: DataType, b: DataType) => number;
+export type ColumnTemplateFunc = (createElement: HyperFunc<VNode>, props: ColumnTemplateProp, additionalData?: any) => any;
+export type PropertiesFunc = (props: ColumnDataSchemaModel) => CellProps | void | undefined;
+export type ColPropertiesFunc = (props: ColumnPropProp) => CellProps | void | undefined;
+export type DataType = {
+    [T in ColumnProp]: DataFormat;
+};
+export type DataSource = DataType[];
+export type DataLookup = {
+    [rowIndex: number]: DataType;
+};
+export type RowDefinition = {
+    type: DimensionRows;
+    size: number;
+    index: number;
+};
+export interface RowHeaders extends ColumnRegular {
+}
+export type ViewPortResizeEvent = {
+    dimension: DimensionType;
+    size: number;
+    rowHeader?: boolean;
+};
+export type ViewPortScrollEvent = {
+    dimension: DimensionType;
+    coordinate: number;
+    delta?: number;
+    outside?: boolean;
+};
+export type InitialHeaderClick = {
+    index: number;
+    originalEvent: MouseEvent;
+    column: ColumnRegular;
+};
+export type Range = {
+    start: number;
+    end: number;
+};
+export type ViewportStateItems = {
+    items: VirtualPositionItem[];
+} & Range;
+export interface ViewportState extends ViewportStateItems {
+    realCount: number;
+    virtualSize: number;
+}
+export type ViewSettingSizeProp = Record<string, number>;
+export interface VirtualPositionItem extends PositionItem {
+    size: number;
+}
+export type DataSourceState<T extends DataType | ColumnRegular, ST extends DimensionRows | DimensionCols> = {
+    items: number[];
+    proxyItems: number[];
+    source: T[];
+    groupingDepth: number;
+    groups: Record<any, any>;
+    type: ST;
+    trimmed: Record<any, any>;
+};
+export interface PositionItem {
+    itemIndex: number;
+    start: number;
+    end: number;
+}
+export interface DimensionCalc {
+    indexes: number[];
+    count: number;
+    positionIndexes: number[];
+    positionIndexToItem: {
+        [position: number]: PositionItem;
+    };
+    indexToItem: {
+        [index: number]: PositionItem;
+    };
+    trimmed: Record<any, any>;
+    sizes: ViewSettingSizeProp;
+}
+export interface DimensionSettingsState extends DimensionCalc {
+    realSize: number;
+    originItemSize: number;
+}
+export type DimensionStores = {
+    [T in MultiDimensionType]: Observable<DimensionSettingsState>;
+};
+export type ViewportStores = {
+    [T in MultiDimensionType]: Observable<ViewportState>;
+};
+export type DragStartEvent = {
+    originalEvent: MouseEvent;
+    model: ColumnDataSchemaModel;
+};
+export interface BeforeCellRenderEvent<T = any> extends AllDimensionType {
+    column: VirtualPositionItem;
+    row: VirtualPositionItem;
+    model: T;
+}
+export interface BeforeRowRenderEvent<T = any> extends AllDimensionType {
+    dataItem: T;
+    item: VirtualPositionItem;
+    node: VNode;
+}
+export type AfterRendererEvent = {
+    type: DimensionType;
+};
+export interface AllDimensionType {
+    rowType: DimensionRows;
+    colType: DimensionCols;
+}
+export type ApplyFocusEvent = AllDimensionType & FocusedCells;
+export interface FocusRenderEvent extends AllDimensionType {
+    range: RangeArea;
+    next?: Partial<Cell>;
+}
+export type ScrollCoordinateEvent = {
+    type: DimensionType;
+    coordinate: number;
+};

package/dist/types/types/plugin.d.ts

@@ -0,0 +1,9 @@
+export interface PluginBaseComponent {
+    destroy(): void;
+}
+export interface PluginConstructor {
+    new (revogrid: HTMLRevoGridElement, ...[]: Iterable<any>): PluginBaseComponent;
+}
+export interface PluginExternalConstructor {
+    new (revogrid: HTMLRevoGridElement, providers: Record<string, any>, ...[]: Iterable<any>): PluginBaseComponent;
+}

package/dist/types/types/plugin.types.d.ts

@@ -0,0 +1,12 @@
+import ColumnDataProvider from '../services/column.data.provider';
+import { DataProvider } from '../services/data.provider';
+import DimensionProvider from '../services/dimension.provider';
+import SelectionStoreConnector from '../services/selection.store.connector';
+import ViewportProvider from '../services/viewport.provider';
+export type PluginProviders = {
+    data: DataProvider;
+    dimension: DimensionProvider;
+    selection: SelectionStoreConnector;
+    column: ColumnDataProvider;
+    viewport: ViewportProvider;
+};

package/dist/types/types/selection.d.ts

@@ -0,0 +1,115 @@
+import { VNode } from '../stencil-public-runtime';
+import { DimensionRows, DimensionCols } from './dimension';
+import { ColumnProp, DataType, DataLookup, ColumnRegular, HyperFunc } from './interfaces';
+export type RowIndex = number;
+export type ColIndex = number;
+export type SelectionStoreState = {
+    range: RangeArea | null;
+    tempRange: RangeArea | null;
+    tempRangeType: string | null;
+    focus: Cell | null;
+    edit: EditCellStore | null;
+    lastCell: Cell | null;
+};
+export type RangeArea = {
+    x: ColIndex;
+    y: RowIndex;
+    x1: ColIndex;
+    y1: RowIndex;
+};
+export type TempRange = {
+    type: string;
+    area: RangeArea;
+};
+export type OldNewRangeMapping = {
+    [rowIndex: number]: {
+        [T in ColumnProp]: {
+            rowIndex: number;
+            colIndex: number;
+            colProp: ColumnProp;
+        };
+    };
+};
+export type ChangedRange = {
+    type: DimensionRows;
+    colType: DimensionCols;
+    newRange: RangeArea;
+    oldRange: RangeArea;
+    mapping: OldNewRangeMapping;
+    newData: {
+        [key: number]: DataType;
+    };
+};
+export interface Cell {
+    x: ColIndex;
+    y: RowIndex;
+}
+export type FocusedCells = {
+    focus: Cell;
+    end: Cell;
+};
+export type RangeAreaCss = {
+    left: string;
+    top: string;
+    width: string;
+    height: string;
+};
+export type SaveData = string;
+export type SaveDataDetails = {
+    rgRow: RowIndex;
+    rgCol: ColIndex;
+    type: DimensionRows;
+    prop: ColumnProp;
+    val: any;
+    preventFocus?: boolean;
+};
+export type BeforeEdit = BeforeSaveDataDetails;
+export type BeforeSaveDataDetails = {
+    prop: ColumnProp;
+    model: DataType;
+    val?: SaveData;
+    rowIndex: number;
+    colIndex: number;
+    colType: DimensionCols;
+    type: DimensionRows;
+};
+export type BeforeRangeSaveDataDetails = {
+    data: DataLookup;
+    models: {
+        [rowIndex: number]: DataType;
+    };
+    type: DimensionRows;
+};
+export type AfterEditEvent = BeforeRangeSaveDataDetails | BeforeSaveDataDetails;
+export interface EditCellStore extends Cell {
+    val?: SaveData;
+}
+export type EditCell = EditCellStore & BeforeSaveDataDetails;
+export type Editors = {
+    [name: string]: EditorCtr;
+};
+export interface EditorCtr {
+    new (column: ColumnRegular, save: (value: SaveData, preventFocus?: boolean) => void, close: (focusNext?: boolean) => void): EditorBase;
+}
+export interface EditorBase {
+    element?: Element | null;
+    editCell?: EditCell;
+    /**
+     * Autosave usage when you want to return value for models.
+    */
+    getValue?(): any;
+    /**
+     * For Editor plugin internal usage.
+     * Prevents Editor save. Manual save usage required.
+     */
+    beforeAutoSave?(val?: any): boolean;
+    beforeUpdate?(): void;
+    /**
+   * Before editor got disconnected.
+   * Can be triggered multiple times before actual disconnect.
+   */
+    beforeDisconnect?(): void;
+    componentDidRender?(): void;
+    disconnectedCallback?(): void;
+    render(createElement?: HyperFunc<VNode>, additionalData?: any): VNode | VNode[] | string | void;
+}

package/dist/types/types/theme.d.ts

@@ -0,0 +1,7 @@
+export interface ThemePackage {
+    defaultRowSize: number;
+}
+export type ThemeConfig = {
+    rowSize: number;
+};
+export type Theme = 'default' | 'material' | 'compact' | 'darkMaterial' | 'darkCompact' | string;

package/dist/types/types/viewport.interfaces.d.ts

@@ -0,0 +1,51 @@
+import { ColumnRegular, Observable, ViewPortScrollEvent, ViewportState } from './interfaces';
+import { DSourceState, JSX } from '..';
+import { DimensionCols } from './dimension';
+import { Cell, SelectionStoreState } from './selection';
+import { RowDataSources } from '../services/data.provider';
+import { DimensionStoreCollection } from '../store/dimension/dimension.store';
+import { ViewportStoreCollection } from '../store/viewport/viewport.store';
+import { JSXBase } from '../stencil-public-runtime';
+export type SlotType = 'content' | 'header' | 'footer';
+export interface ElementScroll {
+    changeScroll?(e: ViewPortScrollEvent, silent?: boolean): Promise<ViewPortScrollEvent>;
+    setScroll?(e: ViewPortScrollEvent): Promise<void>;
+}
+export type ElementsScroll = {
+    [key: string]: ElementScroll[];
+};
+export type HeaderProperties = JSX.RevogrHeader;
+export type ViewportProperties = JSX.RevogrViewportScroll & JSXBase.HTMLAttributes<HTMLRevogrViewportScrollElement>;
+export type ViewportColumn = {
+    colType: DimensionCols;
+    position: Cell;
+    fixWidth?: boolean;
+    viewports: ViewportStoreCollection;
+    dimensions: DimensionStoreCollection;
+    rowStores: RowDataSources;
+    colStore: Observable<DSourceState<ColumnRegular, DimensionCols>>;
+} & Partial<JSX.RevogrViewportScroll> & Partial<JSX.RevogrHeader>;
+export type ViewportData = {
+    /** Selection connection */
+    segmentSelectionStore: Observable<SelectionStoreState>;
+    /** Slot to put data */
+    slot: SlotType;
+    /** Current grid uniq Id */
+    uuid: string;
+    style?: {
+        [key: string]: string;
+    };
+} & JSX.RevogrOverlaySelection & JSX.RevogrData;
+export type ViewportProps = {
+    prop: JSX.RevogrViewportScroll & JSXBase.HTMLAttributes<HTMLRevogrViewportScrollElement>;
+    position: Cell;
+    type: DimensionCols;
+    /** Cols dataset */
+    viewportCol: Observable<ViewportState>;
+    /** header container props */
+    headerProp: HeaderProperties;
+    /** parent selector link */
+    /** viewport rows */
+    dataPorts: ViewportData[];
+    columnSelectionStore: Observable<SelectionStoreState>;
+};

package/dist/types/utils/browser.d.ts

@@ -0,0 +1 @@
+export declare function isSafariDesktop(): boolean;

package/dist/types/utils/consts.d.ts

@@ -1,9 +1,11 @@
-export declare const MIN_COL_SIZE: number;
+export declare const MIN_COL_SIZE = 30;
+export declare const RESIZE_INTERVAL = 40;
 export declare const DATA_COL = "data-rgCol";
 export declare const DATA_ROW = "data-rgRow";
 export declare const UUID = "grid-uuid";
 export declare const DISABLED_CLASS = "disabled";
 export declare const CELL_CLASS = "rgCell";
+export declare const ROW_HEADER_TYPE = "rowHeaders";
 export declare const HEADER_CLASS = "rgHeaderCell";
 export declare const HEADER_SORTABLE_CLASS = "sortable";
 export declare const HEADER_ROW_CLASS = "header-rgRow";
@@ -12,8 +14,10 @@ export declare const DRAG_ICON_CLASS = "revo-drag-icon";
 export declare const DRAGGABLE_CLASS = "revo-draggable";
 export declare const FOCUS_CLASS = "focused-cell";
 export declare const SELECTION_BORDER_CLASS = "selection-border-range";
+export declare const MOBILE_CLASS = "mobile-handler";
 export declare const TMP_SELECTION_BG_CLASS = "temp-bg-range";
 export declare const CELL_HANDLER_CLASS = "autofill-handle";
 export declare const EDIT_INPUT_WR = "edit-input-wrapper";
 export declare const DRAGG_TEXT = "Draggable item";
 export declare const GRID_INTERNALS = "__rvgr";
+export declare const ROW_FOCUSED_CLASS = "focused-rgRow";

package/dist/types/utils/events.d.ts

@@ -0,0 +1,2 @@
+export declare function verifyTouchTarget(touchEvent?: Touch, focusClass?: string): boolean;
+export declare function getFromEvent(e: MouseEvent | TouchEvent, prop: keyof Pick<Touch, 'clientX' | 'clientY' | 'screenX' | 'screenY'>, focusClass?: string): number | null;

package/dist/types/utils/{utils.d.ts → index.d.ts}

@@ -1,8 +1,24 @@
+export * from '../store/dimension/dimension.helpers';
 export declare function range(size: number, startAt?: number): number[];
 export declare function findPositionInArray<T>(this: T[], el: T, compareFn: (el: T, el2: T) => number): number;
+/**
+ * Sorted push
+ */
 export declare function pushSorted<T>(arr: T[], el: T, fn: (el: T, el2: T) => number): T[];
+/**
+ * Merge sorted array helper function
+ */
 export declare function mergeSortedArray<T>(arr1: T[], arr2: T[], compareFn?: (el: T, el2: T) => boolean): T[];
-export declare function getScrollbarWidth(doc: Document): number;
+/**
+ * Calculate system scrollbar size
+ */
+export declare function getScrollbarSize(document: Document): number;
 export declare function scaleValue(value: number, from: [number, number], to: [number, number]): number;
+/**
+ * Async timeout
+ */
 export declare function timeout(delay?: number): Promise<void>;
+/**
+ * Type script mixins
+ */
 export declare function applyMixins(derivedCtor: any, constructors: any[]): void;

package/dist/types/utils/key.codes.d.ts

@@ -0,0 +1,70 @@
+declare enum codes {
+    MOUSE_LEFT = 1,
+    MOUSE_RIGHT = 3,
+    MOUSE_MIDDLE = 2,
+    BACKSPACE = 8,
+    COMMA = 188,
+    INSERT = 45,
+    DELETE = 46,
+    END = 35,
+    ENTER = 13,
+    ESCAPE = 27,
+    CONTROL = 17,
+    COMMAND_LEFT = 91,
+    COMMAND_RIGHT = 93,
+    COMMAND_FIREFOX = 224,
+    ALT = 18,
+    HOME = 36,
+    PAGE_DOWN = 34,
+    PAGE_UP = 33,
+    PERIOD = 190,
+    SPACE = 32,
+    SHIFT = 16,
+    CAPS_LOCK = 20,
+    TAB = 9,
+    ARROW_RIGHT = 39,
+    ARROW_LEFT = 37,
+    ARROW_UP = 38,
+    ARROW_DOWN = 40,
+    F1 = 112,
+    F2 = 113,
+    F3 = 114,
+    F4 = 115,
+    F5 = 116,
+    F6 = 117,
+    F7 = 118,
+    F8 = 119,
+    F9 = 120,
+    F10 = 121,
+    F11 = 122,
+    F12 = 123,
+    A = 65,
+    C = 67,
+    D = 68,
+    F = 70,
+    L = 76,
+    O = 79,
+    P = 80,
+    S = 83,
+    V = 86,
+    X = 88
+}
+declare enum codesLetter {
+    ENTER = "Enter",
+    ENTER_NUM = "NumpadEnter",
+    A = "KeyA",
+    C = "KeyC",
+    X = "KeyX",
+    V = "KeyV",
+    ESCAPE = "Escape",
+    TAB = "Tab",
+    BACKSPACE = "Backspace",
+    DELETE = "Delete",
+    ARROW_RIGHT = "ArrowRight",
+    ARROW_LEFT = "ArrowLeft",
+    ARROW_UP = "ArrowUp",
+    ARROW_DOWN = "ArrowDown",
+    SHIFT = "Shift"
+}
+export default codes;
+export { codesLetter };

package/dist/types/utils/{keyCodes.utils.d.ts → key.utils.d.ts}

@@ -1,4 +1,4 @@
-import KeyCodesEnum from './keyCodes';
+import KeyCodesEnum from './key.codes';
 export declare function isLetterKey(code: number): boolean;
 export declare function isMetaKey(code: number): boolean;
 export declare function isCtrlKey(code: number, platform: string): boolean;
@@ -6,3 +6,7 @@ export declare function isCtrlMetaKey(code: KeyCodesEnum): boolean;
 export declare function isClear(code: string): boolean;
 export declare function isTab(code: string): boolean;
 export declare function isEnterKey(code: string): boolean;
+export declare function isCut(event: KeyboardEvent): boolean;
+export declare function isCopy(event: KeyboardEvent): boolean;
+export declare function isPaste(event: KeyboardEvent): boolean;
+export declare function isAll(event: KeyboardEvent): boolean;

package/dist/types/utils/mobile.d.ts

@@ -0,0 +1 @@
+export declare function isMobileDevice(): boolean;

package/dist/types/utils/platform.d.ts

@@ -1,4 +1,4 @@
 declare enum osPlatform {
-  mac = "Mac"
+    mac = "Mac"
 }
 export default osPlatform;

package/dist/types/utils/row-header-utils.d.ts

@@ -0,0 +1,2 @@
+import { RowHeaders } from '..';
+export declare const calculateRowHeaderSize: (itemsLength: number, rowHeaderColumn?: RowHeaders) => number;

package/dist/types/utils/store.utils.d.ts

@@ -1,6 +1,6 @@
+import { Observable } from '..';
 /** Set stores data */
-import { Observable } from '../interfaces';
 declare function setStore<T extends {
-  [key: string]: any;
+    [key: string]: any;
 }>(store: Observable<T>, data: Partial<T>): void;
 export { setStore };