@skyux/data-grid 15.2.0 → 15.3.0

package/types/skyux-data-grid.d.ts

@@ -1,5 +1,6 @@
 import * as _angular_core from '@angular/core';
 import { OnInit, TemplateRef, Signal } from '@angular/core';
+import { SkyDataColumnSource, SkyDataSelectionSource, SkyDataSortSource, SkyDataColumnOption } from '@skyux/lists';
 import { GridApi, GridOptions } from 'ag-grid-community';
 
 /**
@@ -14,6 +15,18 @@ interface SkyDataGridRowData {
     id: string;
 }
 
+/**
+ * Information regarding a row whose deletion has been cancelled or confirmed.
+ * @preview
+ */
+interface SkyDataGridRowDeleteArgs {
+    /**
+     * The ID of the row whose deletion has been cancelled or confirmed.
+     * @required
+     */
+    id: string;
+}
+
 /**
  * Applies a sort to a `SkyDataGrid` and reflects updates when the grid's sort changes.
  * @preview
@@ -39,7 +52,9 @@ interface SkyDataGridSort {
 declare class SkyDataGridColumn implements OnInit {
     #private;
     /**
-     * Whether the column is hidden.
+     * Whether the column is hidden. When the grid's `selectedColumnIds` is set,
+     * it determines which columns display instead. In a data manager's column
+     * picker, the column starts hidden and users can choose to display it.
      * @default false
      */
     readonly columnHidden: _angular_core.InputSignalWithTransform<boolean, unknown>;
@@ -54,6 +69,11 @@ declare class SkyDataGridColumn implements OnInit {
      * @default 'text'
      */
     readonly dataType: _angular_core.InputSignal<"number" | "boolean" | "text" | "date">;
+    /**
+     * The text to display beneath the column's `headingText` in a data
+     * manager's column picker.
+     */
+    readonly description: _angular_core.InputSignal<string | undefined>;
     /**
      * The property to retrieve cell information from an entry on the grid `data` array.
      * You must provide either the `columnId` or `field` property for every column,
@@ -100,7 +120,9 @@ declare class SkyDataGridColumn implements OnInit {
     /**
      * Whether the column is locked. The intent is to display locked columns first
      * on the left side of the grid. If set to `true`, then users cannot drag the column
-     * to another position or drag other columns before it.
+     * to another position or drag other columns before it. In a data manager's
+     * column picker, a locked column always displays and is not offered as an
+     * option.
      * @default false
      */
     readonly locked: _angular_core.InputSignalWithTransform<boolean, unknown>;
@@ -143,7 +165,7 @@ declare class SkyDataGridColumn implements OnInit {
      */
     protected readonly cellTemplate: _angular_core.Signal<TemplateRef<unknown> | undefined>;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkyDataGridColumn, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkyDataGridColumn, "sky-data-grid-column", never, { "columnHidden": { "alias": "columnHidden"; "required": false; "isSignal": true; }; "columnId": { "alias": "columnId"; "required": false; "isSignal": true; }; "dataType": { "alias": "dataType"; "required": false; "isSignal": true; }; "field": { "alias": "field"; "required": false; "isSignal": true; }; "flexWidth": { "alias": "flexWidth"; "required": false; "isSignal": true; }; "headingText": { "alias": "headingText"; "required": true; "isSignal": true; }; "headingHidden": { "alias": "headingHidden"; "required": false; "isSignal": true; }; "helpPopoverTitle": { "alias": "helpPopoverTitle"; "required": false; "isSignal": true; }; "helpPopoverContent": { "alias": "helpPopoverContent"; "required": false; "isSignal": true; }; "helpKey": { "alias": "helpKey"; "required": false; "isSignal": true; }; "locked": { "alias": "locked"; "required": false; "isSignal": true; }; "resizable": { "alias": "resizable"; "required": false; "isSignal": true; }; "sortable": { "alias": "sortable"; "required": false; "isSignal": true; }; "template": { "alias": "template"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "wrapText": { "alias": "wrapText"; "required": false; "isSignal": true; }; }, {}, ["templateChild"], never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkyDataGridColumn, "sky-data-grid-column", never, { "columnHidden": { "alias": "columnHidden"; "required": false; "isSignal": true; }; "columnId": { "alias": "columnId"; "required": false; "isSignal": true; }; "dataType": { "alias": "dataType"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "field": { "alias": "field"; "required": false; "isSignal": true; }; "flexWidth": { "alias": "flexWidth"; "required": false; "isSignal": true; }; "headingText": { "alias": "headingText"; "required": true; "isSignal": true; }; "headingHidden": { "alias": "headingHidden"; "required": false; "isSignal": true; }; "helpPopoverTitle": { "alias": "helpPopoverTitle"; "required": false; "isSignal": true; }; "helpPopoverContent": { "alias": "helpPopoverContent"; "required": false; "isSignal": true; }; "helpKey": { "alias": "helpKey"; "required": false; "isSignal": true; }; "locked": { "alias": "locked"; "required": false; "isSignal": true; }; "resizable": { "alias": "resizable"; "required": false; "isSignal": true; }; "sortable": { "alias": "sortable"; "required": false; "isSignal": true; }; "template": { "alias": "template"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "wrapText": { "alias": "wrapText"; "required": false; "isSignal": true; }; }, {}, ["templateChild"], never, true, never>;
 }
 
 /**
@@ -151,7 +173,7 @@ declare class SkyDataGridColumn implements OnInit {
  * Provide the `data` array and one `sky-data-grid-column` for each column to render.
  * @preview
  */
-declare class SkyDataGrid {
+declare class SkyDataGrid implements SkyDataColumnSource, SkyDataSelectionSource, SkyDataSortSource {
     #private;
     /**
      * Whether the grid sorts the data order when a column header is clicked.
@@ -255,6 +277,22 @@ declare class SkyDataGrid {
      * @default 1
      */
     readonly page: _angular_core.ModelSignal<number>;
+    /**
+     * The IDs of the rows that display an inline delete confirmation. This is
+     * two-way bindable: an ID is removed when the user cancels the deletion of
+     * its row, or when its row is no longer in the grid.
+     * @default []
+     */
+    readonly rowDeleteIds: _angular_core.ModelSignal<string[]>;
+    /**
+     * Fires when the user cancels the deletion of a row.
+     */
+    readonly rowDeleteCancel: _angular_core.OutputEmitterRef<SkyDataGridRowDeleteArgs>;
+    /**
+     * Fires when the user confirms the deletion of a row. To complete the
+     * deletion, remove the row from `data`.
+     */
+    readonly rowDeleteConfirm: _angular_core.OutputEmitterRef<SkyDataGridRowDeleteArgs>;
     /**
      * The set of IDs for the rows to select in a multiselect grid.
      * Rows with IDs that are not included are de-selected in the grid. This is two-way bindable:
@@ -262,6 +300,15 @@ declare class SkyDataGrid {
      * @default []
      */
     readonly selectedRowIds: _angular_core.ModelSignal<string[]>;
+    /**
+     * The IDs of the columns to display, in display order. Columns that are not
+     * included are hidden. An ID that does not match a column is ignored until a
+     * column with that ID is declared. This is two-way bindable: once set, it
+     * emits a new value when the user reorders columns. When `undefined`, every
+     * column displays in declaration order except those marked `columnHidden`.
+     * Displayed locked columns come first.
+     */
+    readonly selectedColumnIds: _angular_core.ModelSignal<string[] | undefined>;
     /**
      * The current sort applied to the grid. This is two-way bindable: it emits a new value
      * whenever the user sorts a column, and you can set it to sort the grid programmatically.
@@ -270,6 +317,34 @@ declare class SkyDataGrid {
      */
     readonly sort: _angular_core.ModelSignal<SkyDataGridSort | undefined>;
     protected readonly columns: Signal<readonly SkyDataGridColumn[]>;
+    /**
+     * The columns the grid can display, in declaration order. Read by column
+     * picker integrations through `SkyDataColumnSource`.
+     * @internal
+     */
+    readonly columnOptions: Signal<readonly SkyDataColumnOption[]>;
+    /**
+     * The widths in pixels of the columns users resized, keyed by column ID.
+     * Read by data manager integrations through `SkyDataColumnSource`.
+     * @internal
+     */
+    readonly columnWidths: Signal<Readonly<Record<string, number>>>;
+    /**
+     * The IDs of the columns that display, in display order: the
+     * `selectedColumnIds` that match a declared column or, when
+     * `selectedColumnIds` is `undefined`, every column not marked `columnHidden`.
+     * Locked columns come first, as the grid displays them. Read by column
+     * picker integrations through `SkyDataColumnSource`.
+     * @internal
+     */
+    readonly displayedColumnIds: Signal<string[]>;
+    /**
+     * The selectors of the elements the grid keeps visible at the top of the
+     * viewport while the page scrolls. Read by column picker integrations
+     * through `SkyDataColumnSource`.
+     * @internal
+     */
+    readonly viewkeeperClasses: Signal<string[]>;
     protected readonly gridApi: _angular_core.WritableSignal<GridApi<SkyDataGridRowData> | undefined>;
     protected readonly gridOptions: Signal<GridOptions<SkyDataGridRowData> | undefined>;
     protected readonly gridReady: _angular_core.WritableSignal<boolean>;
@@ -278,10 +353,52 @@ declare class SkyDataGrid {
     protected readonly pageItemsCount: _angular_core.WritableSignal<number>;
     protected readonly skyViewkeeper: Signal<string[]>;
     constructor();
+    /**
+     * Stops the grid from removing the IDs of rows that are not in `data` from
+     * `selectedRowIds`. Called by data manager integrations through
+     * `SkyDataSelectionSource` when they keep rows that a search or filter hides
+     * selected.
+     * @internal
+     */
+    disableSelectionPruning(): void;
+    /**
+     * Stops the grid from keeping the `viewkeeperClasses` elements visible
+     * itself. Called by column picker integrations through `SkyDataColumnSource`
+     * when a container keeps them visible instead.
+     * @internal
+     */
+    disableViewkeeper(): void;
+    /**
+     * Sets the columns that display and their order. Called by column picker
+     * integrations through `SkyDataColumnSource`.
+     * @internal
+     */
+    setDisplayedColumnIds(columnIds: readonly string[]): void;
+    /**
+     * Sets the widths in pixels of columns, keyed by column ID, and starts
+     * tracking the widths users give columns. Columns that are not included
+     * return to the widths they are declared with or, when declared without
+     * one, the widths the grid gave them. Called by data manager
+     * integrations through `SkyDataColumnSource`.
+     * @internal
+     */
+    setColumnWidths(columnWidths: Readonly<Record<string, number>>): void;
+    /**
+     * Sets the selected rows. Called by data manager integrations through
+     * `SkyDataSelectionSource`.
+     * @internal
+     */
+    setSelectedRowIds(selectedRowIds: readonly string[]): void;
+    /**
+     * Sets the sort the grid applies. Called by data manager integrations
+     * through `SkyDataSortSource`.
+     * @internal
+     */
+    setSort(sort: SkyDataGridSort | undefined): void;
     protected currentPageChange(page: number): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<SkyDataGrid, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkyDataGrid, "sky-data-grid", never, { "autoSort": { "alias": "autoSort"; "required": false; "isSignal": true; }; "autoPage": { "alias": "autoPage"; "required": false; "isSignal": true; }; "columnFit": { "alias": "columnFit"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "labelText": { "alias": "labelText"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "minHeight": { "alias": "minHeight"; "required": false; "isSignal": true; }; "multiselect": { "alias": "multiselect"; "required": false; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "pageQueryParam": { "alias": "pageQueryParam"; "required": false; "isSignal": true; }; "rowCount": { "alias": "rowCount"; "required": false; "isSignal": true; }; "stacked": { "alias": "stacked"; "required": false; "isSignal": true; }; "topScrollEnabled": { "alias": "topScrollEnabled"; "required": false; "isSignal": true; }; "page": { "alias": "page"; "required": false; "isSignal": true; }; "selectedRowIds": { "alias": "selectedRowIds"; "required": false; "isSignal": true; }; "sort": { "alias": "sort"; "required": false; "isSignal": true; }; }, { "page": "pageChange"; "selectedRowIds": "selectedRowIdsChange"; "sort": "sortChange"; }, ["columns"], never, true, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkyDataGrid, "sky-data-grid", never, { "autoSort": { "alias": "autoSort"; "required": false; "isSignal": true; }; "autoPage": { "alias": "autoPage"; "required": false; "isSignal": true; }; "columnFit": { "alias": "columnFit"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "data": { "alias": "data"; "required": false; "isSignal": true; }; "labelText": { "alias": "labelText"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "minHeight": { "alias": "minHeight"; "required": false; "isSignal": true; }; "multiselect": { "alias": "multiselect"; "required": false; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "pageQueryParam": { "alias": "pageQueryParam"; "required": false; "isSignal": true; }; "rowCount": { "alias": "rowCount"; "required": false; "isSignal": true; }; "stacked": { "alias": "stacked"; "required": false; "isSignal": true; }; "topScrollEnabled": { "alias": "topScrollEnabled"; "required": false; "isSignal": true; }; "page": { "alias": "page"; "required": false; "isSignal": true; }; "rowDeleteIds": { "alias": "rowDeleteIds"; "required": false; "isSignal": true; }; "selectedRowIds": { "alias": "selectedRowIds"; "required": false; "isSignal": true; }; "selectedColumnIds": { "alias": "selectedColumnIds"; "required": false; "isSignal": true; }; "sort": { "alias": "sort"; "required": false; "isSignal": true; }; }, { "page": "pageChange"; "rowDeleteIds": "rowDeleteIdsChange"; "rowDeleteCancel": "rowDeleteCancel"; "rowDeleteConfirm": "rowDeleteConfirm"; "selectedRowIds": "selectedRowIdsChange"; "selectedColumnIds": "selectedColumnIdsChange"; "sort": "sortChange"; }, ["columns"], never, true, never>;
 }
 
 export { SkyDataGrid, SkyDataGridColumn };
-export type { SkyDataGridRowData, SkyDataGridSort };
+export type { SkyDataGridRowData, SkyDataGridRowDeleteArgs, SkyDataGridSort };