@operato/data-grist 9.0.0-beta.6 → 9.0.0-beta.62

package/dist/src/data-grid/event-handlers/data-grid-body-keydown-handler.js

@@ -1,226 +0,0 @@
-/**
- * ox-grid-body 의 keydown handler
- *
- * - handler의 this 는 ox-grid-body임.
- */
-export async function dataGridBodyKeydownHandler(e) {
-    // 한글 Composing 이벤트는 무시
-    if (e.isComposing)
-        return;
-    // arrow-key
-    const key = e.key;
-    var { row = 0, column = 0 } = this.focused || {};
-    var { records = [] } = this.data || {};
-    var maxrow = this.config.rows.appendable ? records.length : records.length - 1;
-    var maxcolumn = (this.columns || []).filter(column => !column.hidden).length - 1;
-    if (this.editTarget) {
-        switch (key) {
-            case 'Escape':
-            case 'Esc':
-            /* TODO 편집이 취소되어야 한다. */
-            case 'Enter':
-                this.editTarget = null;
-                this.focus();
-                return;
-            case 'Tab':
-                this.editTarget = null;
-                if (e.shiftKey) {
-                    column = Math.max(0, column - 1);
-                }
-                else {
-                    column = Math.min(maxcolumn, column + 1);
-                }
-                this.focus();
-                break;
-            // case 'Down':
-            // case 'ArrowDown':
-            //   this.editTarget = null
-            //   row = Math.min(maxrow, row + 1)
-            //   this.focus()
-            //   break
-            case 'PageUp':
-            case 'PageDown':
-            case 'End':
-            case 'Home':
-                // e.preventDefault()
-                // return
-                break;
-            default:
-                if (e.metaKey || e.ctrlKey) {
-                    /* Window System에 선택된 영역이 없다면, 셀을 복사/붙여넣기 한다. */
-                    switch (e.key) {
-                        case 'c':
-                            const selection = window.getSelection();
-                            if (!selection || !selection.anchorNode || selection.type != 'Range') {
-                                /*
-                                  editor가 select 인 경우 자체 복사 기능이 없으므로 this.copy()를 사용하도록 하기 위해서, selection.type != 'Range' 조건을 추가했다.
-                                  select인 경우에는 selection.type 이 'Caret' 이었다.
-                                 */
-                                this.copy();
-                                e.preventDefault();
-                            }
-                            break;
-                        case 'v':
-                            this.paste();
-                            break;
-                    }
-                }
-                return;
-        }
-    }
-    else {
-        switch (key) {
-            case 'Up':
-            case 'ArrowUp':
-                if (e.shiftKey) {
-                    let { start } = this._selectBlock || {};
-                    let focused = this.focusedField;
-                    if (focused && focused.rowIndex > 0) {
-                        this.setSelectBlock(start || focused, this.getFieldByIndex(focused.rowIndex - 1, focused.columnIndex));
-                    }
-                }
-                else {
-                    this.setSelectBlock();
-                    if (e.metaKey || e.ctrlKey) {
-                        row = 0;
-                    }
-                    else {
-                        row = Math.max(0, row - 1);
-                    }
-                }
-                break;
-            case 'Down':
-            case 'ArrowDown':
-                if (e.shiftKey) {
-                    let { start } = this._selectBlock || {};
-                    let focused = this.focusedField;
-                    if (focused) {
-                        let end = this.getFieldByIndex(focused.rowIndex + 1, focused.columnIndex);
-                        if (end) {
-                            this.setSelectBlock(start || focused, end);
-                        }
-                    }
-                }
-                else {
-                    this.setSelectBlock();
-                    if (e.metaKey || e.ctrlKey) {
-                        row = maxrow;
-                    }
-                    else {
-                        row = Math.min(maxrow, row + 1);
-                    }
-                }
-                break;
-            case 'Enter':
-                this.setSelectBlock();
-                this.startEditTarget(row, column, null);
-                return;
-            case 'Left':
-            case 'ArrowLeft':
-            case 'Backspace':
-                if (e.shiftKey) {
-                    let { start } = this._selectBlock || {};
-                    let focused = this.focusedField;
-                    if (focused && focused.columnIndex > 0) {
-                        this.setSelectBlock(start || focused, this.getFieldByIndex(focused.rowIndex, focused.columnIndex - 1));
-                    }
-                }
-                else {
-                    this.setSelectBlock();
-                    if (e.metaKey || e.ctrlKey) {
-                        column = 0;
-                    }
-                    else {
-                        column = Math.max(0, column - 1);
-                    }
-                }
-                break;
-            case 'Right':
-            case 'ArrowRight':
-                if (e.shiftKey) {
-                    let { start } = this._selectBlock || {};
-                    let focused = this.focusedField;
-                    if (focused) {
-                        let end = this.getFieldByIndex(focused.rowIndex, focused.columnIndex + 1, false);
-                        if (end) {
-                            this.setSelectBlock(start || focused, end);
-                        }
-                    }
-                }
-                else {
-                    this.setSelectBlock();
-                    if (e.metaKey || e.ctrlKey) {
-                        column = maxcolumn;
-                    }
-                    else {
-                        column = Math.min(maxcolumn, column + 1);
-                    }
-                }
-                break;
-            case 'Tab':
-                this.editTarget = null;
-                this.setSelectBlock();
-                if (e.shiftKey) {
-                    column = Math.max(0, column - 1);
-                }
-                else {
-                    column = Math.min(maxcolumn, column + 1);
-                }
-                this.focus();
-                break;
-            case 'PageUp':
-                /* TODO 페이지당 레코드의 수를 계산해서 증감시켜야 한다. */
-                this.setSelectBlock();
-                row = Math.max(0, row - 10);
-                break;
-            case 'PageDown':
-            case ' ':
-                this.setSelectBlock();
-                row = Math.min(maxrow, row + 10);
-                break;
-            case 'Esc':
-            case 'Escape':
-                this.setSelectBlock();
-                return;
-            case 'End':
-                this.setSelectBlock();
-                row = maxrow;
-                break;
-            case 'Home':
-                this.setSelectBlock();
-                row = 0;
-                break;
-            default:
-                if (e.metaKey || e.ctrlKey) {
-                    switch (e.key) {
-                        case 'c':
-                            const selection = window.getSelection();
-                            if (!selection || !selection.anchorNode || selection.type != 'Range') {
-                                /*
-                                  에디터 상태가 아닌 경우에도, selection.type != 'Range' 조건을 추가해서,
-                                  셀렉션이 된 상태에서는 기본 동작으로 텍스트 복사를 할 수 있도록 했다.
-                                  보통은, 싱글 필드가 셀렉션박스로 지정된 경우에 자체 텍스트의 일부를 복사하기 위해서 필요하다.
-                                 */
-                                this.copy();
-                                e.preventDefault();
-                            }
-                            break;
-                        case 'v':
-                            this.paste();
-                            break;
-                    }
-                    return;
-                }
-                else if (key.length === 1) {
-                    this.setSelectBlock();
-                    this.startEditTarget(row, column, key);
-                }
-        }
-    }
-    if (!this.focused || this.focused.row !== row || this.focused.column !== column) {
-        this.dispatchEvent(new CustomEvent('focus-change', { bubbles: true, composed: true, detail: { row, column } }));
-    }
-    /* arrow key에 의한 scrollbar의 자동 움직임을 하지 못하도록 한다. */
-    e.preventDefault();
-}
-//# sourceMappingURL=data-grid-body-keydown-handler.js.map

package/dist/src/data-grid/event-handlers/data-grid-body-keydown-handler.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"data-grid-body-keydown-handler.js","sourceRoot":"","sources":["../../../../src/data-grid/event-handlers/data-grid-body-keydown-handler.ts"],"names":[],"mappings":"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","sourcesContent":["import { DataGridBody } from '../data-grid-body.js'\n\n/**\n * ox-grid-body 의 keydown handler\n *\n * - handler의 this 는 ox-grid-body임.\n */\nexport async function dataGridBodyKeydownHandler(this: DataGridBody, e: KeyboardEvent): Promise<void> {\n  // 한글 Composing 이벤트는 무시\n  if (e.isComposing) return\n\n  // arrow-key\n  const key = e.key\n  var { row = 0, column = 0 } = this.focused || {}\n  var { records = [] } = this.data || {}\n  var maxrow = this.config.rows.appendable ? records.length : records.length - 1\n  var maxcolumn = (this.columns || []).filter(column => !column.hidden).length - 1\n\n  if (this.editTarget) {\n    switch (key) {\n      case 'Escape':\n      case 'Esc':\n      /* TODO 편집이 취소되어야 한다. */\n      case 'Enter':\n        this.editTarget = null\n\n        this.focus()\n        return\n\n      case 'Tab':\n        this.editTarget = null\n        if (e.shiftKey) {\n          column = Math.max(0, column - 1)\n        } else {\n          column = Math.min(maxcolumn, column + 1)\n        }\n        this.focus()\n        break\n\n      // case 'Down':\n      // case 'ArrowDown':\n      //   this.editTarget = null\n      //   row = Math.min(maxrow, row + 1)\n      //   this.focus()\n      //   break\n\n      case 'PageUp':\n      case 'PageDown':\n      case 'End':\n      case 'Home':\n        // e.preventDefault()\n        // return\n        break\n\n      default:\n        if (e.metaKey || e.ctrlKey) {\n          /* Window System에 선택된 영역이 없다면, 셀을 복사/붙여넣기 한다. */\n          switch (e.key) {\n            case 'c':\n              const selection = window.getSelection()\n              if (!selection || !selection.anchorNode || selection.type != 'Range') {\n                /* \n                  editor가 select 인 경우 자체 복사 기능이 없으므로 this.copy()를 사용하도록 하기 위해서, selection.type != 'Range' 조건을 추가했다.\n                  select인 경우에는 selection.type 이 'Caret' 이었다.\n                 */\n                this.copy()\n                e.preventDefault()\n              }\n              break\n            case 'v':\n              this.paste()\n              break\n          }\n        }\n        return\n    }\n  } else {\n    switch (key) {\n      case 'Up':\n      case 'ArrowUp':\n        if (e.shiftKey) {\n          let { start } = this._selectBlock || {}\n          let focused = this.focusedField\n          if (focused && focused.rowIndex > 0) {\n            this.setSelectBlock(start || focused, this.getFieldByIndex(focused.rowIndex - 1, focused.columnIndex))\n          }\n        } else {\n          this.setSelectBlock()\n          if (e.metaKey || e.ctrlKey) {\n            row = 0\n          } else {\n            row = Math.max(0, row - 1)\n          }\n        }\n        break\n\n      case 'Down':\n      case 'ArrowDown':\n        if (e.shiftKey) {\n          let { start } = this._selectBlock || {}\n          let focused = this.focusedField\n          if (focused) {\n            let end = this.getFieldByIndex(focused.rowIndex + 1, focused.columnIndex)\n            if (end) {\n              this.setSelectBlock(start || focused, end)\n            }\n          }\n        } else {\n          this.setSelectBlock()\n          if (e.metaKey || e.ctrlKey) {\n            row = maxrow\n          } else {\n            row = Math.min(maxrow, row + 1)\n          }\n        }\n        break\n\n      case 'Enter':\n        this.setSelectBlock()\n        this.startEditTarget(row, column, null)\n        return\n\n      case 'Left':\n      case 'ArrowLeft':\n      case 'Backspace':\n        if (e.shiftKey) {\n          let { start } = this._selectBlock || {}\n          let focused = this.focusedField\n          if (focused && focused.columnIndex > 0) {\n            this.setSelectBlock(start || focused, this.getFieldByIndex(focused.rowIndex, focused.columnIndex - 1))\n          }\n        } else {\n          this.setSelectBlock()\n          if (e.metaKey || e.ctrlKey) {\n            column = 0\n          } else {\n            column = Math.max(0, column - 1)\n          }\n        }\n        break\n\n      case 'Right':\n      case 'ArrowRight':\n        if (e.shiftKey) {\n          let { start } = this._selectBlock || {}\n          let focused = this.focusedField\n          if (focused) {\n            let end = this.getFieldByIndex(focused.rowIndex, focused.columnIndex + 1, false)\n            if (end) {\n              this.setSelectBlock(start || focused, end)\n            }\n          }\n        } else {\n          this.setSelectBlock()\n          if (e.metaKey || e.ctrlKey) {\n            column = maxcolumn\n          } else {\n            column = Math.min(maxcolumn, column + 1)\n          }\n        }\n        break\n\n      case 'Tab':\n        this.editTarget = null\n        this.setSelectBlock()\n        if (e.shiftKey) {\n          column = Math.max(0, column - 1)\n        } else {\n          column = Math.min(maxcolumn, column + 1)\n        }\n        this.focus()\n        break\n\n      case 'PageUp':\n        /* TODO 페이지당 레코드의 수를 계산해서 증감시켜야 한다. */\n        this.setSelectBlock()\n        row = Math.max(0, row - 10)\n        break\n\n      case 'PageDown':\n      case ' ':\n        this.setSelectBlock()\n        row = Math.min(maxrow, row + 10)\n        break\n\n      case 'Esc':\n      case 'Escape':\n        this.setSelectBlock()\n        return\n\n      case 'End':\n        this.setSelectBlock()\n        row = maxrow\n        break\n\n      case 'Home':\n        this.setSelectBlock()\n        row = 0\n        break\n\n      default:\n        if (e.metaKey || e.ctrlKey) {\n          switch (e.key) {\n            case 'c':\n              const selection = window.getSelection()\n              if (!selection || !selection.anchorNode || selection.type != 'Range') {\n                /* \n                  에디터 상태가 아닌 경우에도, selection.type != 'Range' 조건을 추가해서,\n                  셀렉션이 된 상태에서는 기본 동작으로 텍스트 복사를 할 수 있도록 했다.\n                  보통은, 싱글 필드가 셀렉션박스로 지정된 경우에 자체 텍스트의 일부를 복사하기 위해서 필요하다.\n                 */\n                this.copy()\n                e.preventDefault()\n              }\n              break\n            case 'v':\n              this.paste()\n              break\n          }\n          return\n        } else if (key.length === 1) {\n          this.setSelectBlock()\n          this.startEditTarget(row, column, key)\n        }\n    }\n  }\n\n  if (!this.focused || this.focused.row !== row || this.focused.column !== column) {\n    this.dispatchEvent(new CustomEvent('focus-change', { bubbles: true, composed: true, detail: { row, column } }))\n  }\n\n  /* arrow key에 의한 scrollbar의 자동 움직임을 하지 못하도록 한다. */\n  e.preventDefault()\n}\n"]}

package/dist/src/data-grist.d.ts

@@ -1,355 +0,0 @@
-import './data-grid/data-grid.js';
-import './data-list/data-list.js';
-import './data-card/data-card.js';
-import { LitElement, PropertyValues } from 'lit';
-import { PagePreferenceProvider } from '@operato/p13n';
-import { DataCard } from './data-card/data-card.js';
-import { DataConsumer } from './data-consumer.js';
-import { DataGrid } from './data-grid/data-grid.js';
-import { DataList } from './data-list/data-list.js';
-import { ColumnConfig, FetchHandler, FilterValue, GristConfig, GristData, GristRecord, GristSelectFunction, PaginationConfig, SortersConfig, ValidationReason } from './types.js';
-/**
- * A custom element for rendering data in a grid, list, or card format.
- *
- * @element ox-grist
- */
-export declare class DataGrist extends LitElement implements DataConsumer {
-    static styles: import("lit").CSSResult[];
-    /**
-     * The rendering mode of the component, which can be 'GRID', 'LIST', or 'CARD'.
-     * Default is 'GRID'.
-     *
-     * @property {string}
-     */
-    mode: 'GRID' | 'LIST' | 'CARD';
-    /**
-     * The configuration object for the data grist.
-     *
-     * @property {Object}
-     */
-    config: any;
-    /**
-     * The data to be displayed in the data grist.
-     *
-     * @property {GristData}
-     */
-    data: GristData;
-    /**
-     * An array of selected records in the data grist.
-     *
-     * @property {GristRecord[]}
-     */
-    selectedRecords?: GristRecord[];
-    /**
-     * Indicates whether explicit fetching of data is enabled. If true, data will be fetched
-     * only when `fetch` method is called. Default is false.
-     *
-     * @property {boolean}
-     */
-    explicitFetch: boolean;
-    /**
-     * The fetch handler function used to retrieve data from a remote source.
-     *
-     * @property {FetchHandler}
-     */
-    fetchHandler?: FetchHandler;
-    /**
-     * Additional fetch options to be passed to the fetch handler.
-     *
-     * @property {Object}
-     */
-    fetchOptions: any;
-    /**
-     * An array of filter values to be applied to the data grist.
-     *
-     * @property {FilterValue[]}
-     */
-    filters?: FilterValue[];
-    /**
-     * An array of sorters to determine the order of records in the data grist.
-     *
-     * @property {SortersConfig}
-     */
-    sorters?: SortersConfig;
-    /**
-     * The pagination configuration for the data grist.
-     *
-     * @property {PaginationConfig}
-     */
-    pagination?: PaginationConfig;
-    /**
-     * Indicates whether URL parameters are sensitive to changes. If true, changes in URL
-     * parameters will trigger data fetching. Default is undefined.
-     *
-     * @property {boolean}
-     */
-    urlParamsSensitive?: boolean;
-    personalConfigProvider: PagePreferenceProvider;
-    personalConfig?: {
-        columns?: Partial<ColumnConfig>[];
-        [key: string]: any;
-    };
-    _data: GristData;
-    _config: GristConfig;
-    private _showSpinner;
-    head: HTMLElement;
-    grist: DataGrid | DataList | DataCard;
-    private wrap;
-    private timeCapsule?;
-    private snapshotTaker?;
-    private dataProvider?;
-    private pulltorefreshHandle?;
-    private headroom?;
-    private orginPaddingTop?;
-    private originMarginTop?;
-    private lastLocation;
-    private pendingFetch?;
-    private popstateEventHandler;
-    private fetchParamsChangeEventHandler;
-    firstUpdated(): Promise<void>;
-    connectedCallback(): Promise<void>;
-    disconnectedCallback(): void;
-    private resetPullToRefresh;
-    private setPullToRefresh;
-    applyUpdatedConfiguration(): void;
-    private setHeadroom;
-    render(): import("lit-html").TemplateResult<1>;
-    private onKeydown;
-    /**
-     * Gets the current state of the component. The state includes information about the
-     * dirty records and their changes.
-     *
-     * @getter
-     * @public
-     * @type {string}
-     */
-    get state(): string;
-    /**
-     * Undoes the previous change in the component's data by restoring it to the previous state.
-     * This method is part of the TimeCapsule feature, allowing users to revert changes.
-     */
-    undo(): void;
-    /**
-     * Redoes the previously undone change in the component's data by restoring it to the next state.
-     * This method is part of the TimeCapsule feature, allowing users to reapply changes.
-     */
-    redo(): void;
-    /**
-     * Fetches data from a data source and updates the component's data. This method is used to retrieve
-     * new data or refresh the existing data in the component.
-     *
-     * @method
-     * @param {boolean} reset - If true, the method resets the scroll position to the top.
-     */
-    fetch(reset?: boolean): Promise<void>;
-    updated(changes: PropertyValues<this>): Promise<void>;
-    /**
-     * Represents the compiled configuration of the component, which includes various settings and
-     * column configurations. You can access this property to get information about how the component
-     * is configured.
-     *
-     * @getter
-     * @public
-     * @type  {GristConfig}
-     */
-    get compiledConfig(): GristConfig;
-    /**
-     * Returns the dirty data in the component, which includes the records that have been added,
-     * modified, or deleted but have not been committed to the main data yet.
-     *
-     * @getter
-     * @public
-     * @type  {GristData} - An object representing the dirty data.
-     */
-    get dirtyData(): GristData;
-    /**
-     * Returns an array of GristRecord objects representing the records in the dirty state. These are
-     * the records that have been added, modified, or deleted but have not been committed to the main
-     * data yet.
-     *
-     * @getter
-     * @public
-     * @type  {GristRecord[]} - An array of GristRecord objects representing the dirty records.
-     */
-    get dirtyRecords(): GristRecord[];
-    /**
-     * Exports a list of patches representing the changes in the dirty state of records. Each patch
-     * contains information about whether a record was added, modified, or deleted, along with the
-     * record's unique identifier and the changed field values.
-     *
-     * @param {Object} options - Export options that control the format of the patch list.
-     * @param {string} options.flagName - The name of the flag field in the patch indicating the change type (default: 'patchFlag').
-     * @param {string} options.addedFlag - The flag value for added records (default: '+').
-     * @param {string} options.deletedFlag - The flag value for deleted records (default: '-').
-     * @param {string} options.modifiedFlag - The flag value for modified records (default: 'M').
-     * @param {string} options.idField - The name of the unique identifier field (default: 'id').
-     * @returns {Object[]} - An array of objects representing the patches.
-     */
-    exportPatchList({ flagName, addedFlag, deletedFlag, modifiedFlag, idField }: {
-        flagName?: string | undefined;
-        addedFlag?: string | undefined;
-        deletedFlag?: string | undefined;
-        modifiedFlag?: string | undefined;
-        idField?: string | undefined;
-    }): {
-        [x: string]: string;
-    }[];
-    /**
-     * Exports the selected records or all records in the component, depending on the specified options.
-     * You can use this method to export data from the component in various formats or for different purposes.
-     *
-     * @param {Object} options - Export options that control the behavior of the export.
-     * @param {boolean} options.ifSelectedOnly - If true, exports only the selected records. If false, exports all records.
-     * @param {boolean} options.includeHiddenField - If true, includes hidden fields in the exported data.
-     * @returns {Object[]} - An array of objects representing the exported records.
-     */
-    exportRecords({ ifSelectedOnly, includeHiddenField }?: {
-        ifSelectedOnly?: boolean | undefined;
-        includeHiddenField?: boolean | undefined;
-    }): any[];
-    /**
-     * Gets the currently selected records in the component. It returns an array of GristRecord objects
-     * that are currently selected. You can access this getter to retrieve the selected records.
-     *
-     * @getter
-     * @public
-     * @type {GristRecord[]}
-     */
-    get selected(): GristRecord[];
-    /**
-     * Sets the currently selected records in the component. You can use this setter to programmatically
-     * select specific records by providing an array of GristRecord objects to be selected.
-     *
-     * @setter
-     * @public
-     * @type {GristRecord[]}
-     */
-    set selected(selected: GristRecord[]);
-    /**
-     * Selects records in the component based on the provided selector function. You can use this method
-     * to programmatically select specific records in the component.
-     *
-     * @method
-     * @param {GristSelectFunction} selector - A function that determines which records to select.
-     * @param {boolean} reset - If true, clears the previous selection before applying the new one.
-     *                         If false, adds to the existing selection.
-     */
-    select(selector: GristSelectFunction, reset?: boolean): void;
-    /**
-     * Shows the loading spinner in the component's UI to indicate ongoing data loading or processing.
-     * You can call this method to display the spinner when necessary.
-     */
-    showSpinner(): void;
-    /**
-     * Hides the loading spinner in the component's UI to indicate that data loading or processing has completed.
-     * You can call this method to hide the spinner when loading or processing is finished.
-     */
-    hideSpinner(): void;
-    /**
-     * Focuses on the component, making it the active element in the document. This method is useful
-     * when you want to programmatically set focus to the component.
-     */
-    focus(): void;
-    /**
-     * Commits the changes made in the dirty state to the component's data. This method updates the
-     * component's data with the changes made in the dirty state and clears the dirty state.
-     */
-    commit(): void;
-    /**
-     * Shows the headroom element in the component. The headroom element is typically used for
-     * displaying additional information or controls at the top of the component.
-     */
-    showHeadroom(): void;
-    /**
-     * Hides the headroom element in the component. This method hides the additional information
-     * or controls displayed at the top of the component.
-     */
-    hideHeadroom(): void;
-    /**
-     * Toggles the visibility of the headroom element in the component. If the headroom element is
-     * currently visible, this method hides it. If it's hidden, this method shows it.
-     */
-    toggleHeadroom(): void;
-    /**
-     * Forced internal data to be reflected on the screen
-     * Data changing through a normal method is automatically reflected on the screen, so it is a method that does not need to be used in general.
-     * Therefore, it will be deprecated.
-     * @method
-     */
-    refresh(): void;
-    /**
-     * Resets the component's data to its original state before any changes were made.
-     * This method discards all unsaved changes and restores the data to its initial state.
-     *
-     * @method
-     * @public
-     */
-    reset(): void;
-    private traverseReset;
-    private traverseExpanded;
-    /**
-     * Checks for dirty records in the component's data and marks them as dirty.
-     * Dirty records are those that have unsaved changes.
-     */
-    checkDirties(): void;
-    /**
-     * Clones the selected records in the component's data. It creates a copy of the selected records
-     * and marks them as new (added) records.
-     */
-    cloneSelectedRecords(): void;
-    /**
-     * Adds child nodes to selected records in the component's tree data. It allows users to add child nodes
-     * to the selected parent records.
-     */
-    addChildNodes(): void;
-    /**
-     * Adds sibling nodes to selected records in the component's tree data. It allows users to add sibling nodes
-     * to the selected records.
-     */
-    addSiblingNodes(): void;
-    /**
-     * Deletes the selected records in the component's data. It removes the selected records from the data,
-     * optionally marking them as deleted.
-     *
-     * @method
-     * @param {boolean} dirty - If true, the method marks the records as deleted.
-     */
-    deleteSelectedRecords(dirty?: boolean): void;
-    /**
-     * Adds a new record to the data grid. The added record is marked as newly created
-     * by setting the `__dirty__` flag to '+'. This flag indicates that the record
-     * is in a "new" state and hasn't been committed to the main data yet.
-     *
-     * @param {GristRecord} [record] - An optional record to add. If no record is provided,
-     * an empty record with the `__dirty__` flag set to '+' will be added.
-     */
-    addRecord(record?: GristRecord): void;
-    /**
-     * Retrieves the search text used for filtering records.
-     *
-     * @property {string}
-     */
-    get searchText(): string;
-    /**
-     * Sets the search text for filtering records.
-     *
-     * @property {string}
-     */
-    set searchText(searchText: string);
-    /**
-     * Returns the current pagination limit.
-     * @returns {number} The current pagination limit value
-     */
-    getCurrentLimit(): number;
-    /**
-     * Checks the validity of dirty records.
-     * @returns {Array<{record: GristRecord, invalidFields: Array<{field: string, reason: ValidationReason}>}>} List of invalid records and their corresponding invalid fields
-     */
-    checkDirtyRecordsValidity(): {
-        record: GristRecord;
-        invalidFields: {
-            field: string;
-            reason: ValidationReason;
-        }[];
-    }[];
-}