@unipin/angular-applet 21.3.1 → 21.5.0

package/fesm2022/unipin-angular-applet-grids.mjs

@@ -1,8 +1,12 @@
-import { up, generateContrastColor } from '@unipin/angular-applet/common';
+import { themeQuartz, RowApiModule, RowStyleModule, PinnedRowModule, CellStyleModule, TextEditorModule, PaginationModule, RowSelectionModule, ClientSideRowModelModule, ClientSideRowModelApiModule, InfiniteRowModelModule, ModuleRegistry } from 'ag-grid-community';
+import { up, generateContrastColor, formatCapitalize } from '@unipin/angular-applet/common';
 import { badgeVariants } from '@unipin/angular-applet/badge';
+import * as i0 from '@angular/core';
+import { Injectable, input, model, booleanAttribute, output, computed, ChangeDetectionStrategy, Component } from '@angular/core';
+import { AgGridAngular } from 'ag-grid-angular';
 
 const rowNumberColumn = {
-    maxWidth: 55,
+    maxWidth: 60,
     pinned: 'left',
     sortable: false,
     lockPinned: true,
@@ -17,21 +21,53 @@ const rowNumberColumn = {
     }
 };
 
-function renderFlag(value) {
-    if (!value ||
-        !value.length) {
+const gridDefaultColDef = {
+    flex: 1,
+    minWidth: 200,
+    sortable: true,
+    resizable: true,
+    editable: true,
+    sortingOrder: ['asc', 'desc'],
+    cellStyle: {
+        textAlign: 'left'
+    }
+};
+const gridTheme = themeQuartz.withParams({
+    headerFontWeight: 'bold',
+    accentColor: 'var(--primary)',
+    wrapperBorderRadius: 'var(--radius)',
+    wrapperBorder: '1px solid var(--border)',
+});
+
+function renderFlag(countryCode) {
+    const codes = [countryCode].flat().filter(Boolean);
+    if (!codes.length) {
         return '';
     }
-    const values = Array.isArray(value) ? value : [value];
-    return `
-    <div class="d-flex align-items-center gap-2 h-100 fw-medium">
-      ${values.map((v) => {
+    const flagTemplate = codes.map((c) => {
+        const code = String(c).trim().toLowerCase();
+        const countryFlagSrc = `https://flagicons.lipis.dev/flags/1x1/${code}.svg`;
+        const globalFlagSrc = 'https://www.svgrepo.com/show/405734/globe-showing-asia-australia.svg';
+        const isGlobal = !code || code === 'go';
+        const style = isGlobal ? 'scale-[1.4]' : '';
+        const source = isGlobal ? globalFlagSrc : countryFlagSrc;
         return `
-              <div class="d-flex align-items-center gap-1 size-full">
-                <div title="${v}" class="fflag-up border rounded fflag-${v}"></div>
-              </div>
-            `;
-    }).join('')}
+        <div
+          class="h-full overflow-hidden border border-border rounded-md relative" 
+          title="${code}"
+        >
+          <img 
+            loading="lazy"
+            alt="${code}" 
+            src="${source}" 
+            class="block size-full object-cover ${style}" 
+          />
+        </div>
+      `;
+    });
+    return `
+    <div class="flex items-center justify-center gap-2 size-full">
+      ${flagTemplate.join('')}
     </div>
   `;
 }
@@ -106,16 +142,393 @@ function renderStatusBadge(value, { additionalStatus, additionalClass = '' }) {
             additionalClass
         });
     }
-    return renderGridBadge(value, {
-        isAutoGenerateColor: true,
+    return renderGridBadge(formatCapitalize(value), {
+        isAutoGenerateColor: false,
         variant: used.variant,
         additionalClass: up(used.class, additionalClass)
     });
 }
 
+class GridService {
+    constructor() {
+        this.apis = new Map();
+    }
+    setApi(id, api) {
+        this.apis.set(id, api);
+    }
+    getApi(id) {
+        return this.apis.get(id);
+    }
+    refreshGridCache(id, forceRefresh = false) {
+        const api = this.apis.get(id);
+        if (!api) {
+            return;
+        }
+        api.refreshInfiniteCache();
+        if (forceRefresh) {
+            api.paginationGoToFirstPage();
+            api.purgeInfiniteCache();
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: GridService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: GridService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: GridService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+class UpGridComponent {
+    constructor(service) {
+        this.service = service;
+        this.columnDefs = input.required(...(ngDevMode ? [{ debugName: "columnDefs" }] : /* istanbul ignore next */ []));
+        this.noRowText = input('Data not found', ...(ngDevMode ? [{ debugName: "noRowText" }] : /* istanbul ignore next */ []));
+        this.rowModelType = input('infinite', ...(ngDevMode ? [{ debugName: "rowModelType" }] : /* istanbul ignore next */ []));
+        this.rowSelection = input('single', ...(ngDevMode ? [{ debugName: "rowSelection" }] : /* istanbul ignore next */ []));
+        this.getRowClass = input(undefined, ...(ngDevMode ? [{ debugName: "getRowClass" }] : /* istanbul ignore next */ []));
+        this.id = input('grid-pagination', ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
+        this.inlineClass = input('', { ...(ngDevMode ? { debugName: "inlineClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+        this.rowPerPage = model(50, ...(ngDevMode ? [{ debugName: "rowPerPage" }] : /* istanbul ignore next */ []));
+        this.pagination = input(true, { ...(ngDevMode ? { debugName: "pagination" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+        this.gridReady = output();
+        this.rowClicked = output();
+        this.selectionChanged = output();
+        this.datasourceRefreshed = output();
+        this.theme = gridTheme;
+        this.defaultColDef = gridDefaultColDef;
+        this._computedClass = computed(() => {
+            return up('block size-full', this.inlineClass());
+        }, ...(ngDevMode ? [{ debugName: "_computedClass" }] : /* istanbul ignore next */ []));
+    }
+    ngOnInit() {
+        const modules = [
+            RowApiModule,
+            RowStyleModule,
+            PinnedRowModule,
+            CellStyleModule,
+            TextEditorModule,
+            PaginationModule,
+            RowSelectionModule,
+        ];
+        switch (this.rowModelType()) {
+            case 'infinite':
+                modules.push(InfiniteRowModelModule);
+                break;
+            case 'clientSide':
+                modules.push(ClientSideRowModelModule, ClientSideRowModelApiModule);
+                break;
+        }
+        ModuleRegistry.registerModules(modules);
+    }
+    changePagination({ newPageSize, api }) {
+        if (newPageSize) {
+            this.rowPerPage.set(api.paginationGetPageSize());
+        }
+    }
+    dragColumn({ api }) {
+        localStorage.setItem(this.id(), btoa(JSON.stringify(api.getColumnState())));
+    }
+    setDatasource(ev) {
+        this.gridReady.emit(ev);
+        this.service.setApi(this.id(), ev.api);
+        this.setNoRowTemplate(ev.api, this.noRowText());
+        const saved = localStorage.getItem(this.id());
+        if (saved) {
+            try {
+                const state = JSON.parse(atob(saved));
+                ev.api.setColumnsVisible(ev.api.getAllGridColumns(), true);
+                ev.api.applyColumnState({
+                    state,
+                    applyOrder: true
+                });
+            }
+            catch { }
+        }
+        if (this.rowModelType() === 'infinite') {
+            ev.api.setGridOption('datasource', {
+                getRows: ({ api, sortModel, failCallback: fail, successCallback: success, }) => {
+                    api.setGridOption('loading', true);
+                    this.setNoRowTemplate(api, this.noRowText());
+                    const page = api.paginationGetCurrentPage();
+                    const pageSize = api.paginationGetPageSize();
+                    const failCallback = (message) => {
+                        fail();
+                        api.setGridOption('loading', false);
+                        if (message) {
+                            this.setNoRowTemplate(api, message);
+                        }
+                        api.showNoRowsOverlay();
+                    };
+                    const successCallback = (data, count) => {
+                        api.setGridOption('loading', false);
+                        if (page === 0) {
+                            if (!data.length) {
+                                this.setNoRowTemplate(api, this.noRowText());
+                                api.showNoRowsOverlay();
+                            }
+                            this.count = count;
+                        }
+                        success(data, this.count);
+                    };
+                    this.datasourceRefreshed.emit({
+                        page,
+                        pageSize,
+                        failCallback,
+                        successCallback,
+                        sort: !sortModel.length ? undefined : {
+                            colId: sortModel[0].colId || '',
+                            sort: sortModel[0].sort || 'asc'
+                        }
+                    });
+                }
+            });
+        }
+    }
+    setNoRowTemplate(api, text) {
+        api.setGridOption('overlayNoRowsTemplate', `<span class="text-lg">${text}</span>`);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: UpGridComponent, deps: [{ token: GridService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.7", type: UpGridComponent, isStandalone: true, selector: "up-grid", inputs: { columnDefs: { classPropertyName: "columnDefs", publicName: "columnDefs", isSignal: true, isRequired: true, transformFunction: null }, noRowText: { classPropertyName: "noRowText", publicName: "noRowText", isSignal: true, isRequired: false, transformFunction: null }, rowModelType: { classPropertyName: "rowModelType", publicName: "rowModelType", isSignal: true, isRequired: false, transformFunction: null }, rowSelection: { classPropertyName: "rowSelection", publicName: "rowSelection", isSignal: true, isRequired: false, transformFunction: null }, getRowClass: { classPropertyName: "getRowClass", publicName: "getRowClass", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, inlineClass: { classPropertyName: "inlineClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, rowPerPage: { classPropertyName: "rowPerPage", publicName: "rowPerPage", isSignal: true, isRequired: false, transformFunction: null }, pagination: { classPropertyName: "pagination", publicName: "pagination", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rowPerPage: "rowPerPageChange", gridReady: "gridReady", rowClicked: "rowClicked", selectionChanged: "selectionChanged", datasourceRefreshed: "datasourceRefreshed" }, host: { properties: { "class": "_computedClass()" } }, ngImport: i0, template: `
+    <ag-grid-angular 
+      class="size-full"
+      
+      [theme]="theme"
+      [animateRows]="true"
+      [defaultColDef]="defaultColDef" 
+
+      [columnDefs]="columnDefs()"
+      [getRowClass]="getRowClass()"
+      [rowModelType]="rowModelType()"
+      [rowSelection]="rowSelection()"
+
+      [pagination]="pagination()"
+      [cacheBlockSize]="rowPerPage()" 
+      [paginationPageSize]="rowPerPage()"
+
+      (rowClicked)="rowClicked.emit($event)"
+      (selectionChanged)="selectionChanged.emit($event)"
+       
+      (dragStopped)="dragColumn($event)"
+      (gridReady)="setDatasource($event)"
+      (paginationChanged)="changePagination($event)"
+    />
+  `, isInline: true, dependencies: [{ kind: "component", type: AgGridAngular, selector: "ag-grid-angular", inputs: ["gridOptions", "modules", "statusBar", "sideBar", "suppressContextMenu", "preventDefaultOnContextMenu", "allowContextMenuWithControlKey", "columnMenu", "suppressMenuHide", "enableBrowserTooltips", "tooltipTrigger", "tooltipShowDelay", "tooltipSwitchShowDelay", "tooltipHideDelay", "tooltipMouseTrack", "tooltipShowMode", "tooltipInteraction", "popupParent", "copyHeadersToClipboard", "copyGroupHeadersToClipboard", "clipboardDelimiter", "suppressCopyRowsToClipboard", "suppressCopySingleCellRanges", "suppressLastEmptyLineOnPaste", "suppressClipboardPaste", "suppressClipboardApi", "suppressCutToClipboard", "columnDefs", "defaultColDef", "defaultColGroupDef", "columnTypes", "dataTypeDefinitions", "maintainColumnOrder", "enableStrictPivotColumnOrder", "suppressFieldDotNotation", "headerHeight", "groupHeaderHeight", "floatingFiltersHeight", "pivotHeaderHeight", "pivotGroupHeaderHeight", "hidePaddedHeaderRows", "allowDragFromColumnsToolPanel", "suppressMovableColumns", "suppressColumnMoveAnimation", "suppressMoveWhenColumnDragging", "suppressDragLeaveHidesColumns", "suppressGroupChangesColumnVisibility", "suppressMakeColumnVisibleAfterUnGroup", "suppressRowGroupHidesColumns", "colResizeDefault", "suppressAutoSize", "autoSizePadding", "skipHeaderOnAutoSize", "autoSizeStrategy", "animateColumnResizing", "components", "editType", "suppressStartEditOnTab", "getFullRowEditValidationErrors", "invalidEditValueMode", "singleClickEdit", "suppressClickEdit", "readOnlyEdit", "stopEditingWhenCellsLoseFocus", "enterNavigatesVertically", "enterNavigatesVerticallyAfterEdit", "enableCellEditingOnBackspace", "undoRedoCellEditing", "undoRedoCellEditingLimit", "defaultCsvExportParams", "suppressCsvExport", "defaultExcelExportParams", "suppressExcelExport", "excelStyles", "findSearchValue", "findOptions", "quickFilterText", "cacheQuickFilter", "includeHiddenColumnsInQuickFilter", "quickFilterParser", "quickFilterMatcher", "applyQuickFilterBeforePivotOrAgg", "excludeChildrenWhenTreeDataFiltering", "enableAdvancedFilter", "alwaysPassFilter", "includeHiddenColumnsInAdvancedFilter", "advancedFilterParent", "advancedFilterBuilderParams", "advancedFilterParams", "suppressAdvancedFilterEval", "suppressSetFilterByDefault", "enableFilterHandlers", "filterHandlers", "enableCharts", "chartThemes", "customChartThemes", "chartThemeOverrides", "chartToolPanelsDef", "chartMenuItems", "loadingCellRenderer", "loadingCellRendererParams", "loadingCellRendererSelector", "localeText", "masterDetail", "keepDetailRows", "keepDetailRowsCount", "detailCellRenderer", "detailCellRendererParams", "detailRowHeight", "detailRowAutoHeight", "context", "alignedGrids", "tabIndex", "rowBuffer", "valueCache", "valueCacheNeverExpires", "enableCellExpressions", "suppressTouch", "suppressFocusAfterRefresh", "suppressBrowserResizeObserver", "suppressPropertyNamesCheck", "suppressChangeDetection", "debug", "loading", "overlayLoadingTemplate", "loadingOverlayComponent", "loadingOverlayComponentParams", "suppressLoadingOverlay", "overlayNoRowsTemplate", "noRowsOverlayComponent", "noRowsOverlayComponentParams", "suppressNoRowsOverlay", "suppressOverlays", "overlayComponent", "overlayComponentParams", "overlayComponentSelector", "activeOverlay", "activeOverlayParams", "pagination", "paginationPageSize", "paginationPageSizeSelector", "paginationAutoPageSize", "paginateChildRows", "suppressPaginationPanel", "pivotMode", "pivotPanelShow", "pivotMaxGeneratedColumns", "pivotDefaultExpanded", "pivotColumnGroupTotals", "pivotRowTotals", "pivotSuppressAutoColumn", "suppressExpandablePivotGroups", "functionsReadOnly", "aggFuncs", "formulaDataSource", "formulaFuncs", "suppressAggFuncInHeader", "alwaysAggregateAtRootLevel", "aggregateOnlyChangedColumns", "suppressAggFilteredOnly", "removePivotHeaderRowWhenSingleValueColumn", "animateRows", "cellFlashDuration", "cellFadeDuration", "allowShowChangeAfterFilter", "domLayout", "ensureDomOrder", "enableCellSpan", "enableRtl", "suppressColumnVirtualisation", "suppressMaxRenderedRowRestriction", "suppressRowVirtualisation", "rowDragManaged", "refreshAfterGroupEdit", "rowDragInsertDelay", "suppressRowDrag", "suppressMoveWhenRowDragging", "rowDragEntireRow", "rowDragMultiRow", "rowDragText", "dragAndDropImageComponent", "dragAndDropImageComponentParams", "fullWidthCellRenderer", "fullWidthCellRendererParams", "embedFullWidthRows", "groupDisplayType", "groupDefaultExpanded", "autoGroupColumnDef", "groupMaintainOrder", "groupSelectsChildren", "groupLockGroupColumns", "groupAggFiltering", "groupTotalRow", "grandTotalRow", "suppressStickyTotalRow", "groupSuppressBlankHeader", "groupSelectsFiltered", "showOpenedGroup", "groupHideParentOfSingleChild", "groupRemoveSingleChildren", "groupRemoveLowestSingleChildren", "groupHideOpenParents", "groupHideColumnsUntilExpanded", "groupAllowUnbalanced", "rowGroupPanelShow", "groupRowRenderer", "groupRowRendererParams", "treeData", "treeDataChildrenField", "treeDataParentIdField", "rowGroupPanelSuppressSort", "suppressGroupRowsSticky", "groupHierarchyConfig", "pinnedTopRowData", "pinnedBottomRowData", "enableRowPinning", "isRowPinnable", "isRowPinned", "rowModelType", "rowData", "asyncTransactionWaitMillis", "suppressModelUpdateAfterUpdateTransaction", "datasource", "cacheOverflowSize", "infiniteInitialRowCount", "serverSideInitialRowCount", "suppressServerSideFullWidthLoadingRow", "cacheBlockSize", "maxBlocksInCache", "maxConcurrentDatasourceRequests", "blockLoadDebounceMillis", "purgeClosedRowNodes", "serverSideDatasource", "serverSideSortAllLevels", "serverSideEnableClientSideSort", "serverSideOnlyRefreshFilteredGroups", "serverSidePivotResultFieldSeparator", "viewportDatasource", "viewportRowModelPageSize", "viewportRowModelBufferSize", "alwaysShowHorizontalScroll", "alwaysShowVerticalScroll", "debounceVerticalScrollbar", "suppressHorizontalScroll", "suppressScrollOnNewData", "suppressScrollWhenPopupsAreOpen", "suppressAnimationFrame", "suppressMiddleClickScrolls", "suppressPreventDefaultOnMouseWheel", "scrollbarWidth", "rowSelection", "cellSelection", "rowMultiSelectWithClick", "suppressRowDeselection", "suppressRowClickSelection", "suppressCellFocus", "suppressHeaderFocus", "selectionColumnDef", "rowNumbers", "suppressMultiRangeSelection", "enableCellTextSelection", "enableRangeSelection", "enableRangeHandle", "enableFillHandle", "fillHandleDirection", "suppressClearOnFillReduction", "sortingOrder", "accentedSort", "unSortIcon", "suppressMultiSort", "alwaysMultiSort", "multiSortKey", "suppressMaintainUnsortedOrder", "icons", "rowHeight", "rowStyle", "rowClass", "rowClassRules", "suppressRowHoverHighlight", "suppressRowTransform", "columnHoverHighlight", "gridId", "deltaSort", "treeDataDisplayType", "enableGroupEdit", "initialState", "theme", "loadThemeGoogleFonts", "themeCssLayer", "styleNonce", "themeStyleContainer", "getContextMenuItems", "getMainMenuItems", "postProcessPopup", "processUnpinnedColumns", "processCellForClipboard", "processHeaderForClipboard", "processGroupHeaderForClipboard", "processCellFromClipboard", "sendToClipboard", "processDataFromClipboard", "isExternalFilterPresent", "doesExternalFilterPass", "getChartToolbarItems", "createChartContainer", "focusGridInnerElement", "navigateToNextHeader", "tabToNextHeader", "navigateToNextCell", "tabToNextCell", "tabToNextGridContainer", "getLocaleText", "getDocument", "paginationNumberFormatter", "getGroupRowAgg", "isGroupOpenByDefault", "ssrmExpandAllAffectsAllRows", "initialGroupOrderComparator", "processPivotResultColDef", "processPivotResultColGroupDef", "getDataPath", "getChildCount", "getServerSideGroupLevelParams", "isServerSideGroupOpenByDefault", "isApplyServerSideTransaction", "isServerSideGroup", "getServerSideGroupKey", "getBusinessKeyForNode", "getRowId", "resetRowDataOnUpdate", "processRowPostCreate", "isRowSelectable", "isRowMaster", "fillOperation", "postSortRows", "getRowStyle", "getRowClass", "getRowHeight", "isFullWidthRow", "isRowValidDropPosition"], outputs: ["toolPanelVisibleChanged", "toolPanelSizeChanged", "columnMenuVisibleChanged", "contextMenuVisibleChanged", "cutStart", "cutEnd", "pasteStart", "pasteEnd", "columnVisible", "columnPinned", "columnResized", "columnMoved", "columnValueChanged", "columnPivotModeChanged", "columnPivotChanged", "columnGroupOpened", "newColumnsLoaded", "gridColumnsChanged", "displayedColumnsChanged", "virtualColumnsChanged", "columnEverythingChanged", "columnsReset", "columnHeaderMouseOver", "columnHeaderMouseLeave", "columnHeaderClicked", "columnHeaderContextMenu", "componentStateChanged", "cellValueChanged", "cellEditRequest", "rowValueChanged", "cellEditingStarted", "cellEditingStopped", "rowEditingStarted", "rowEditingStopped", "bulkEditingStarted", "bulkEditingStopped", "batchEditingStarted", "batchEditingStopped", "undoStarted", "undoEnded", "redoStarted", "redoEnded", "cellSelectionDeleteStart", "cellSelectionDeleteEnd", "rangeDeleteStart", "rangeDeleteEnd", "fillStart", "fillEnd", "filterOpened", "filterChanged", "filterModified", "filterUiChanged", "floatingFilterUiChanged", "advancedFilterBuilderVisibleChanged", "findChanged", "chartCreated", "chartRangeSelectionChanged", "chartOptionsChanged", "chartDestroyed", "cellKeyDown", "gridReady", "firstDataRendered", "gridSizeChanged", "modelUpdated", "virtualRowRemoved", "viewportChanged", "bodyScroll", "bodyScrollEnd", "dragStarted", "dragStopped", "dragCancelled", "stateUpdated", "paginationChanged", "rowDragEnter", "rowDragMove", "rowDragLeave", "rowDragEnd", "rowDragCancel", "rowResizeStarted", "rowResizeEnded", "columnRowGroupChanged", "rowGroupOpened", "expandOrCollapseAll", "pivotMaxColumnsExceeded", "pinnedRowDataChanged", "pinnedRowsChanged", "rowDataUpdated", "asyncTransactionsFlushed", "storeRefreshed", "headerFocused", "cellClicked", "cellDoubleClicked", "cellFocused", "cellMouseOver", "cellMouseOut", "cellMouseDown", "rowClicked", "rowDoubleClicked", "rowSelected", "selectionChanged", "cellContextMenu", "rangeSelectionChanged", "cellSelectionChanged", "tooltipShow", "tooltipHide", "sortChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: UpGridComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'up-grid',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: {
+                        '[class]': '_computedClass()',
+                    },
+                    imports: [
+                        AgGridAngular,
+                    ],
+                    template: `
+    <ag-grid-angular 
+      class="size-full"
+      
+      [theme]="theme"
+      [animateRows]="true"
+      [defaultColDef]="defaultColDef" 
+
+      [columnDefs]="columnDefs()"
+      [getRowClass]="getRowClass()"
+      [rowModelType]="rowModelType()"
+      [rowSelection]="rowSelection()"
+
+      [pagination]="pagination()"
+      [cacheBlockSize]="rowPerPage()" 
+      [paginationPageSize]="rowPerPage()"
+
+      (rowClicked)="rowClicked.emit($event)"
+      (selectionChanged)="selectionChanged.emit($event)"
+       
+      (dragStopped)="dragColumn($event)"
+      (gridReady)="setDatasource($event)"
+      (paginationChanged)="changePagination($event)"
+    />
+  `,
+                }]
+        }], ctorParameters: () => [{ type: GridService }], propDecorators: { columnDefs: [{ type: i0.Input, args: [{ isSignal: true, alias: "columnDefs", required: true }] }], noRowText: [{ type: i0.Input, args: [{ isSignal: true, alias: "noRowText", required: false }] }], rowModelType: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowModelType", required: false }] }], rowSelection: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowSelection", required: false }] }], getRowClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "getRowClass", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], inlineClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], rowPerPage: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowPerPage", required: false }] }, { type: i0.Output, args: ["rowPerPageChange"] }], pagination: [{ type: i0.Input, args: [{ isSignal: true, alias: "pagination", required: false }] }], gridReady: [{ type: i0.Output, args: ["gridReady"] }], rowClicked: [{ type: i0.Output, args: ["rowClicked"] }], selectionChanged: [{ type: i0.Output, args: ["selectionChanged"] }], datasourceRefreshed: [{ type: i0.Output, args: ["datasourceRefreshed"] }] } });
+
+class UpSnapshotGridComponent {
+    constructor(service) {
+        this.service = service;
+        this.columnDefs = input.required(...(ngDevMode ? [{ debugName: "columnDefs" }] : /* istanbul ignore next */ []));
+        this.noRowText = input('Data not found', ...(ngDevMode ? [{ debugName: "noRowText" }] : /* istanbul ignore next */ []));
+        this.rowSelection = input('single', ...(ngDevMode ? [{ debugName: "rowSelection" }] : /* istanbul ignore next */ []));
+        this.getRowClass = input(undefined, ...(ngDevMode ? [{ debugName: "getRowClass" }] : /* istanbul ignore next */ []));
+        this.id = input('grid-snapshot', ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
+        this.inlineClass = input('', { ...(ngDevMode ? { debugName: "inlineClass" } : /* istanbul ignore next */ {}), alias: 'class' });
+        this.rowPerPage = model(50, ...(ngDevMode ? [{ debugName: "rowPerPage" }] : /* istanbul ignore next */ []));
+        this.pagination = input(true, { ...(ngDevMode ? { debugName: "pagination" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+        this.gridReady = output();
+        this.rowClicked = output();
+        this.selectionChanged = output();
+        this.datasourceRefreshed = output();
+        this.theme = gridTheme;
+        this.defaultColDef = gridDefaultColDef;
+        this._computedClass = computed(() => {
+            return up('block size-full', this.inlineClass());
+        }, ...(ngDevMode ? [{ debugName: "_computedClass" }] : /* istanbul ignore next */ []));
+    }
+    ngOnInit() {
+        ModuleRegistry.registerModules([
+            RowApiModule,
+            RowStyleModule,
+            PinnedRowModule,
+            CellStyleModule,
+            TextEditorModule,
+            PaginationModule,
+            RowSelectionModule,
+            InfiniteRowModelModule
+        ]);
+    }
+    changePagination({ newPageSize, api }) {
+        if (newPageSize) {
+            this.rowPerPage.set(api.paginationGetPageSize());
+        }
+    }
+    dragColumn({ api }) {
+        localStorage.setItem(this.id(), btoa(JSON.stringify(api.getColumnState())));
+    }
+    setDatasource(ev) {
+        this.gridReady.emit(ev);
+        this.service.setApi(this.id(), ev.api);
+        this.setNoRowTemplate(ev.api, this.noRowText());
+        const saved = localStorage.getItem(this.id());
+        if (saved) {
+            try {
+                const state = JSON.parse(atob(saved));
+                ev.api.setColumnsVisible(ev.api.getAllGridColumns(), true);
+                ev.api.applyColumnState({
+                    state,
+                    applyOrder: true
+                });
+            }
+            catch { }
+        }
+        ev.api.setGridOption('datasource', {
+            getRows: ({ api, sortModel, failCallback: fail, successCallback: success, }) => {
+                api.setGridOption('loading', true);
+                this.setNoRowTemplate(api, this.noRowText());
+                const page = api.paginationGetCurrentPage();
+                const pageSize = api.paginationGetPageSize();
+                if (page === 0) {
+                    this.after = undefined;
+                }
+                const failCallback = (message) => {
+                    fail();
+                    api.setGridOption('loading', false);
+                    if (message) {
+                        this.setNoRowTemplate(api, message);
+                    }
+                    api.showNoRowsOverlay();
+                };
+                const successCallback = (data, { endCursor, hasNextPage }) => {
+                    api.setGridOption('loading', false);
+                    if (!data.length &&
+                        page === 0) {
+                        this.setNoRowTemplate(api, this.noRowText());
+                        api.showNoRowsOverlay();
+                    }
+                    if (hasNextPage &&
+                        endCursor) {
+                        this.after = endCursor;
+                        success(data, undefined);
+                        return;
+                    }
+                    success(data, page * pageSize + data.length);
+                };
+                this.datasourceRefreshed.emit({
+                    after: this.after ?? null,
+                    pageSize,
+                    failCallback,
+                    successCallback,
+                    sort: !sortModel.length ? undefined : {
+                        colId: sortModel[0].colId || '',
+                        sort: sortModel[0].sort || 'asc'
+                    }
+                });
+            }
+        });
+    }
+    setNoRowTemplate(api, text) {
+        api.setGridOption('overlayNoRowsTemplate', `<span class="text-lg">${text}</span>`);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: UpSnapshotGridComponent, deps: [{ token: GridService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.7", type: UpSnapshotGridComponent, isStandalone: true, selector: "up-snapshot-grid", inputs: { columnDefs: { classPropertyName: "columnDefs", publicName: "columnDefs", isSignal: true, isRequired: true, transformFunction: null }, noRowText: { classPropertyName: "noRowText", publicName: "noRowText", isSignal: true, isRequired: false, transformFunction: null }, rowSelection: { classPropertyName: "rowSelection", publicName: "rowSelection", isSignal: true, isRequired: false, transformFunction: null }, getRowClass: { classPropertyName: "getRowClass", publicName: "getRowClass", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, inlineClass: { classPropertyName: "inlineClass", publicName: "class", isSignal: true, isRequired: false, transformFunction: null }, rowPerPage: { classPropertyName: "rowPerPage", publicName: "rowPerPage", isSignal: true, isRequired: false, transformFunction: null }, pagination: { classPropertyName: "pagination", publicName: "pagination", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rowPerPage: "rowPerPageChange", gridReady: "gridReady", rowClicked: "rowClicked", selectionChanged: "selectionChanged", datasourceRefreshed: "datasourceRefreshed" }, host: { properties: { "class": "_computedClass()" } }, ngImport: i0, template: `
+    <ag-grid-angular 
+      class="size-full"
+      rowModelType="infinite"
+      
+      [theme]="theme"
+      [animateRows]="true"
+      [defaultColDef]="defaultColDef" 
+
+      [columnDefs]="columnDefs()"
+      [getRowClass]="getRowClass()"
+      [rowSelection]="rowSelection()"
+
+      [pagination]="pagination()"
+      [cacheBlockSize]="rowPerPage()" 
+      [paginationPageSize]="rowPerPage()"
+
+      (rowClicked)="rowClicked.emit($event)"
+      (selectionChanged)="selectionChanged.emit($event)"
+       
+      (dragStopped)="dragColumn($event)"
+      (gridReady)="setDatasource($event)"
+      (paginationChanged)="changePagination($event)"
+    />
+  `, isInline: true, dependencies: [{ kind: "component", type: AgGridAngular, selector: "ag-grid-angular", inputs: ["gridOptions", "modules", "statusBar", "sideBar", "suppressContextMenu", "preventDefaultOnContextMenu", "allowContextMenuWithControlKey", "columnMenu", "suppressMenuHide", "enableBrowserTooltips", "tooltipTrigger", "tooltipShowDelay", "tooltipSwitchShowDelay", "tooltipHideDelay", "tooltipMouseTrack", "tooltipShowMode", "tooltipInteraction", "popupParent", "copyHeadersToClipboard", "copyGroupHeadersToClipboard", "clipboardDelimiter", "suppressCopyRowsToClipboard", "suppressCopySingleCellRanges", "suppressLastEmptyLineOnPaste", "suppressClipboardPaste", "suppressClipboardApi", "suppressCutToClipboard", "columnDefs", "defaultColDef", "defaultColGroupDef", "columnTypes", "dataTypeDefinitions", "maintainColumnOrder", "enableStrictPivotColumnOrder", "suppressFieldDotNotation", "headerHeight", "groupHeaderHeight", "floatingFiltersHeight", "pivotHeaderHeight", "pivotGroupHeaderHeight", "hidePaddedHeaderRows", "allowDragFromColumnsToolPanel", "suppressMovableColumns", "suppressColumnMoveAnimation", "suppressMoveWhenColumnDragging", "suppressDragLeaveHidesColumns", "suppressGroupChangesColumnVisibility", "suppressMakeColumnVisibleAfterUnGroup", "suppressRowGroupHidesColumns", "colResizeDefault", "suppressAutoSize", "autoSizePadding", "skipHeaderOnAutoSize", "autoSizeStrategy", "animateColumnResizing", "components", "editType", "suppressStartEditOnTab", "getFullRowEditValidationErrors", "invalidEditValueMode", "singleClickEdit", "suppressClickEdit", "readOnlyEdit", "stopEditingWhenCellsLoseFocus", "enterNavigatesVertically", "enterNavigatesVerticallyAfterEdit", "enableCellEditingOnBackspace", "undoRedoCellEditing", "undoRedoCellEditingLimit", "defaultCsvExportParams", "suppressCsvExport", "defaultExcelExportParams", "suppressExcelExport", "excelStyles", "findSearchValue", "findOptions", "quickFilterText", "cacheQuickFilter", "includeHiddenColumnsInQuickFilter", "quickFilterParser", "quickFilterMatcher", "applyQuickFilterBeforePivotOrAgg", "excludeChildrenWhenTreeDataFiltering", "enableAdvancedFilter", "alwaysPassFilter", "includeHiddenColumnsInAdvancedFilter", "advancedFilterParent", "advancedFilterBuilderParams", "advancedFilterParams", "suppressAdvancedFilterEval", "suppressSetFilterByDefault", "enableFilterHandlers", "filterHandlers", "enableCharts", "chartThemes", "customChartThemes", "chartThemeOverrides", "chartToolPanelsDef", "chartMenuItems", "loadingCellRenderer", "loadingCellRendererParams", "loadingCellRendererSelector", "localeText", "masterDetail", "keepDetailRows", "keepDetailRowsCount", "detailCellRenderer", "detailCellRendererParams", "detailRowHeight", "detailRowAutoHeight", "context", "alignedGrids", "tabIndex", "rowBuffer", "valueCache", "valueCacheNeverExpires", "enableCellExpressions", "suppressTouch", "suppressFocusAfterRefresh", "suppressBrowserResizeObserver", "suppressPropertyNamesCheck", "suppressChangeDetection", "debug", "loading", "overlayLoadingTemplate", "loadingOverlayComponent", "loadingOverlayComponentParams", "suppressLoadingOverlay", "overlayNoRowsTemplate", "noRowsOverlayComponent", "noRowsOverlayComponentParams", "suppressNoRowsOverlay", "suppressOverlays", "overlayComponent", "overlayComponentParams", "overlayComponentSelector", "activeOverlay", "activeOverlayParams", "pagination", "paginationPageSize", "paginationPageSizeSelector", "paginationAutoPageSize", "paginateChildRows", "suppressPaginationPanel", "pivotMode", "pivotPanelShow", "pivotMaxGeneratedColumns", "pivotDefaultExpanded", "pivotColumnGroupTotals", "pivotRowTotals", "pivotSuppressAutoColumn", "suppressExpandablePivotGroups", "functionsReadOnly", "aggFuncs", "formulaDataSource", "formulaFuncs", "suppressAggFuncInHeader", "alwaysAggregateAtRootLevel", "aggregateOnlyChangedColumns", "suppressAggFilteredOnly", "removePivotHeaderRowWhenSingleValueColumn", "animateRows", "cellFlashDuration", "cellFadeDuration", "allowShowChangeAfterFilter", "domLayout", "ensureDomOrder", "enableCellSpan", "enableRtl", "suppressColumnVirtualisation", "suppressMaxRenderedRowRestriction", "suppressRowVirtualisation", "rowDragManaged", "refreshAfterGroupEdit", "rowDragInsertDelay", "suppressRowDrag", "suppressMoveWhenRowDragging", "rowDragEntireRow", "rowDragMultiRow", "rowDragText", "dragAndDropImageComponent", "dragAndDropImageComponentParams", "fullWidthCellRenderer", "fullWidthCellRendererParams", "embedFullWidthRows", "groupDisplayType", "groupDefaultExpanded", "autoGroupColumnDef", "groupMaintainOrder", "groupSelectsChildren", "groupLockGroupColumns", "groupAggFiltering", "groupTotalRow", "grandTotalRow", "suppressStickyTotalRow", "groupSuppressBlankHeader", "groupSelectsFiltered", "showOpenedGroup", "groupHideParentOfSingleChild", "groupRemoveSingleChildren", "groupRemoveLowestSingleChildren", "groupHideOpenParents", "groupHideColumnsUntilExpanded", "groupAllowUnbalanced", "rowGroupPanelShow", "groupRowRenderer", "groupRowRendererParams", "treeData", "treeDataChildrenField", "treeDataParentIdField", "rowGroupPanelSuppressSort", "suppressGroupRowsSticky", "groupHierarchyConfig", "pinnedTopRowData", "pinnedBottomRowData", "enableRowPinning", "isRowPinnable", "isRowPinned", "rowModelType", "rowData", "asyncTransactionWaitMillis", "suppressModelUpdateAfterUpdateTransaction", "datasource", "cacheOverflowSize", "infiniteInitialRowCount", "serverSideInitialRowCount", "suppressServerSideFullWidthLoadingRow", "cacheBlockSize", "maxBlocksInCache", "maxConcurrentDatasourceRequests", "blockLoadDebounceMillis", "purgeClosedRowNodes", "serverSideDatasource", "serverSideSortAllLevels", "serverSideEnableClientSideSort", "serverSideOnlyRefreshFilteredGroups", "serverSidePivotResultFieldSeparator", "viewportDatasource", "viewportRowModelPageSize", "viewportRowModelBufferSize", "alwaysShowHorizontalScroll", "alwaysShowVerticalScroll", "debounceVerticalScrollbar", "suppressHorizontalScroll", "suppressScrollOnNewData", "suppressScrollWhenPopupsAreOpen", "suppressAnimationFrame", "suppressMiddleClickScrolls", "suppressPreventDefaultOnMouseWheel", "scrollbarWidth", "rowSelection", "cellSelection", "rowMultiSelectWithClick", "suppressRowDeselection", "suppressRowClickSelection", "suppressCellFocus", "suppressHeaderFocus", "selectionColumnDef", "rowNumbers", "suppressMultiRangeSelection", "enableCellTextSelection", "enableRangeSelection", "enableRangeHandle", "enableFillHandle", "fillHandleDirection", "suppressClearOnFillReduction", "sortingOrder", "accentedSort", "unSortIcon", "suppressMultiSort", "alwaysMultiSort", "multiSortKey", "suppressMaintainUnsortedOrder", "icons", "rowHeight", "rowStyle", "rowClass", "rowClassRules", "suppressRowHoverHighlight", "suppressRowTransform", "columnHoverHighlight", "gridId", "deltaSort", "treeDataDisplayType", "enableGroupEdit", "initialState", "theme", "loadThemeGoogleFonts", "themeCssLayer", "styleNonce", "themeStyleContainer", "getContextMenuItems", "getMainMenuItems", "postProcessPopup", "processUnpinnedColumns", "processCellForClipboard", "processHeaderForClipboard", "processGroupHeaderForClipboard", "processCellFromClipboard", "sendToClipboard", "processDataFromClipboard", "isExternalFilterPresent", "doesExternalFilterPass", "getChartToolbarItems", "createChartContainer", "focusGridInnerElement", "navigateToNextHeader", "tabToNextHeader", "navigateToNextCell", "tabToNextCell", "tabToNextGridContainer", "getLocaleText", "getDocument", "paginationNumberFormatter", "getGroupRowAgg", "isGroupOpenByDefault", "ssrmExpandAllAffectsAllRows", "initialGroupOrderComparator", "processPivotResultColDef", "processPivotResultColGroupDef", "getDataPath", "getChildCount", "getServerSideGroupLevelParams", "isServerSideGroupOpenByDefault", "isApplyServerSideTransaction", "isServerSideGroup", "getServerSideGroupKey", "getBusinessKeyForNode", "getRowId", "resetRowDataOnUpdate", "processRowPostCreate", "isRowSelectable", "isRowMaster", "fillOperation", "postSortRows", "getRowStyle", "getRowClass", "getRowHeight", "isFullWidthRow", "isRowValidDropPosition"], outputs: ["toolPanelVisibleChanged", "toolPanelSizeChanged", "columnMenuVisibleChanged", "contextMenuVisibleChanged", "cutStart", "cutEnd", "pasteStart", "pasteEnd", "columnVisible", "columnPinned", "columnResized", "columnMoved", "columnValueChanged", "columnPivotModeChanged", "columnPivotChanged", "columnGroupOpened", "newColumnsLoaded", "gridColumnsChanged", "displayedColumnsChanged", "virtualColumnsChanged", "columnEverythingChanged", "columnsReset", "columnHeaderMouseOver", "columnHeaderMouseLeave", "columnHeaderClicked", "columnHeaderContextMenu", "componentStateChanged", "cellValueChanged", "cellEditRequest", "rowValueChanged", "cellEditingStarted", "cellEditingStopped", "rowEditingStarted", "rowEditingStopped", "bulkEditingStarted", "bulkEditingStopped", "batchEditingStarted", "batchEditingStopped", "undoStarted", "undoEnded", "redoStarted", "redoEnded", "cellSelectionDeleteStart", "cellSelectionDeleteEnd", "rangeDeleteStart", "rangeDeleteEnd", "fillStart", "fillEnd", "filterOpened", "filterChanged", "filterModified", "filterUiChanged", "floatingFilterUiChanged", "advancedFilterBuilderVisibleChanged", "findChanged", "chartCreated", "chartRangeSelectionChanged", "chartOptionsChanged", "chartDestroyed", "cellKeyDown", "gridReady", "firstDataRendered", "gridSizeChanged", "modelUpdated", "virtualRowRemoved", "viewportChanged", "bodyScroll", "bodyScrollEnd", "dragStarted", "dragStopped", "dragCancelled", "stateUpdated", "paginationChanged", "rowDragEnter", "rowDragMove", "rowDragLeave", "rowDragEnd", "rowDragCancel", "rowResizeStarted", "rowResizeEnded", "columnRowGroupChanged", "rowGroupOpened", "expandOrCollapseAll", "pivotMaxColumnsExceeded", "pinnedRowDataChanged", "pinnedRowsChanged", "rowDataUpdated", "asyncTransactionsFlushed", "storeRefreshed", "headerFocused", "cellClicked", "cellDoubleClicked", "cellFocused", "cellMouseOver", "cellMouseOut", "cellMouseDown", "rowClicked", "rowDoubleClicked", "rowSelected", "selectionChanged", "cellContextMenu", "rangeSelectionChanged", "cellSelectionChanged", "tooltipShow", "tooltipHide", "sortChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.7", ngImport: i0, type: UpSnapshotGridComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'up-snapshot-grid',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: {
+                        '[class]': '_computedClass()',
+                    },
+                    imports: [
+                        AgGridAngular,
+                    ],
+                    template: `
+    <ag-grid-angular 
+      class="size-full"
+      rowModelType="infinite"
+      
+      [theme]="theme"
+      [animateRows]="true"
+      [defaultColDef]="defaultColDef" 
+
+      [columnDefs]="columnDefs()"
+      [getRowClass]="getRowClass()"
+      [rowSelection]="rowSelection()"
+
+      [pagination]="pagination()"
+      [cacheBlockSize]="rowPerPage()" 
+      [paginationPageSize]="rowPerPage()"
+
+      (rowClicked)="rowClicked.emit($event)"
+      (selectionChanged)="selectionChanged.emit($event)"
+       
+      (dragStopped)="dragColumn($event)"
+      (gridReady)="setDatasource($event)"
+      (paginationChanged)="changePagination($event)"
+    />
+  `,
+                }]
+        }], ctorParameters: () => [{ type: GridService }], propDecorators: { columnDefs: [{ type: i0.Input, args: [{ isSignal: true, alias: "columnDefs", required: true }] }], noRowText: [{ type: i0.Input, args: [{ isSignal: true, alias: "noRowText", required: false }] }], rowSelection: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowSelection", required: false }] }], getRowClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "getRowClass", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], inlineClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "class", required: false }] }], rowPerPage: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowPerPage", required: false }] }, { type: i0.Output, args: ["rowPerPageChange"] }], pagination: [{ type: i0.Input, args: [{ isSignal: true, alias: "pagination", required: false }] }], gridReady: [{ type: i0.Output, args: ["gridReady"] }], rowClicked: [{ type: i0.Output, args: ["rowClicked"] }], selectionChanged: [{ type: i0.Output, args: ["selectionChanged"] }], datasourceRefreshed: [{ type: i0.Output, args: ["datasourceRefreshed"] }] } });
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { renderFlag, renderGridBadge, renderStatusBadge, rowNumberColumn };
+export { GridService, UpGridComponent, UpSnapshotGridComponent, gridDefaultColDef, gridTheme, renderFlag, renderGridBadge, renderStatusBadge, rowNumberColumn };
 //# sourceMappingURL=unipin-angular-applet-grids.mjs.map