@revolist/revogrid 4.9.12 → 4.9.13

package/hydrate/index.mjs

@@ -3031,6 +3031,7 @@ var RevogrFilterPanelStyle0 = filterStyleCss;
 const defaultType = 'none';
 const FILTER_LIST_CLASS = 'multi-filter-list';
 const FILTER_LIST_CLASS_ACTION = 'multi-filter-list-action';
+const FILTER_ID = 'add-filter';
 /**
  * Filter panel for editing filters
  */
@@ -3068,22 +3069,27 @@ class FilterPanel {
         this.disableDynamicFiltering = false;
     }
     onMouseDown(e) {
-        if (this.changes && !e.defaultPrevented) {
-            const el = e.target;
-            const select = document.getElementById('add-filter');
-            if (select) {
-                select.value = defaultType;
-            }
-            this.currentFilterType = defaultType;
-            if (this.changes) {
-                this.changes.type = defaultType;
-            }
-            this.currentFilterId = -1;
-            const path = e.composedPath();
-            const isOutside = !path.includes(this.element);
-            if (isOutside && !isFilterBtn(el)) {
-                this.changes = undefined;
+        // click on anything then select drops values to default
+        if (!this.changes || e.defaultPrevented) {
+            return;
+        }
+        const path = e.composedPath();
+        const select = document.getElementById(FILTER_ID);
+        if (select instanceof HTMLSelectElement) {
+            // click on select should be skipped
+            if (path.includes(select)) {
+                return;
             }
+            select.value = defaultType;
+        }
+        this.currentFilterType = defaultType;
+        if (this.changes) {
+            this.changes.type = defaultType;
+        }
+        this.currentFilterId = -1;
+        const isOutside = !path.includes(this.element);
+        if (e.target instanceof HTMLElement && isOutside && !isFilterBtn(e.target)) {
+            this.changes = undefined;
         }
     }
     async show(newEntity) {
@@ -3165,19 +3171,22 @@ class FilterPanel {
             top: `${this.changes.y}px`,
         };
         const capts = Object.assign(this.filterCaptionsInternal, this.filterCaptions);
-        return (hAsync(Host, { style: style, ref: (el) => { var _a; ((_a = this.changes) === null || _a === void 0 ? void 0 : _a.autoCorrect) && this.autoCorrect(el); } }, hAsync("label", null, capts.title), hAsync("div", { class: "filter-holder" }, this.getFilterItemsList()), hAsync("div", { class: "add-filter" }, hAsync("select", { id: "add-filter", class: "select-css", onChange: e => this.onAddNewFilter(e) }, this.renderSelectOptions(this.currentFilterType))), hAsync("div", { class: "filter-actions" }, this.disableDynamicFiltering &&
+        return (hAsync(Host, { style: style, ref: (el) => { var _a; ((_a = this.changes) === null || _a === void 0 ? void 0 : _a.autoCorrect) && this.autoCorrect(el); } }, hAsync("label", null, capts.title), hAsync("div", { class: "filter-holder" }, this.getFilterItemsList()), hAsync("div", { class: "add-filter" }, hAsync("select", { id: FILTER_ID, class: "select-css", onChange: e => this.onAddNewFilter(e) }, this.renderSelectOptions(this.currentFilterType))), hAsync("div", { class: "filter-actions" }, this.disableDynamicFiltering &&
             hAsync("button", { id: "revo-button-save", "aria-label": "save", class: "revo-button green", onClick: () => this.onSave() }, capts.save), hAsync("button", { id: "revo-button-reset", "aria-label": "reset", class: "revo-button light", onClick: () => this.onReset() }, capts.reset), hAsync("button", { id: "revo-button-cancel", "aria-label": "cancel", class: "revo-button light", onClick: () => this.onCancel() }, capts.cancel))));
     }
     onFilterTypeChange(e, prop, index) {
-        const el = e.target;
-        this.filterItems[prop][index].type = el.value;
+        if (!(e.target instanceof HTMLSelectElement)) {
+            return;
+        }
+        this.filterItems[prop][index].type = e.target.value;
         // this re-renders the input to know if we need extra input
         this.filterId++;
         // adding setTimeout will wait for the next tick DOM update then focus on input
         setTimeout(() => {
             const input = document.getElementById('filter-input-' + this.filterItems[prop][index].id);
-            if (input)
+            if (input instanceof HTMLInputElement) {
                 input.focus();
+            }
         }, 0);
         if (!this.disableDynamicFiltering)
             this.debouncedApplyFilter();
@@ -14317,6 +14326,9 @@ class RevoGridComponent {
      * Can be specific part as rgRow or pinned rgRow or 'all' by default.
      */
     async refresh(type = 'all') {
+        if (!this.dataProvider) {
+            throw new Error('Not connected');
+        }
         this.dataProvider.refresh(type);
     }
     /**
@@ -14335,6 +14347,9 @@ class RevoGridComponent {
      * Scrolls viewport to specified row by index.
      */
     async scrollToRow(coordinate = 0) {
+        if (!this.dimensionProvider) {
+            throw new Error('Not connected');
+        }
         const y = this.dimensionProvider.getViewPortPos({
             coordinate,
             dimension: 'rgRow',
@@ -14345,6 +14360,9 @@ class RevoGridComponent {
      * Scrolls viewport to specified column by index.
      */
     async scrollToColumnIndex(coordinate = 0) {
+        if (!this.dimensionProvider) {
+            throw new Error('Not connected');
+        }
         const x = this.dimensionProvider.getViewPortPos({
             coordinate,
             dimension: 'rgCol',
@@ -14355,6 +14373,9 @@ class RevoGridComponent {
      * Scrolls viewport to specified column by prop
      */
     async scrollToColumnProp(prop, dimension = 'rgCol') {
+        if (!this.dimensionProvider) {
+            throw new Error('Not connected');
+        }
         const coordinate = this.columnProvider.getColumnIndexByProp(prop, dimension);
         if (coordinate < 0) {
             // already on the screen
@@ -14372,6 +14393,9 @@ class RevoGridComponent {
     }
     /** Add trimmed by type */
     async addTrimmed(trimmed, trimmedType = 'external', type = 'rgRow') {
+        if (!this.dataProvider) {
+            throw new Error('Not connected');
+        }
         const event = this.beforetrimmed.emit({
             trimmed,
             trimmedType,
@@ -14407,6 +14431,9 @@ class RevoGridComponent {
     }
     /**  Get data from source */
     async getSource(type = 'rgRow') {
+        if (!this.dataProvider) {
+            throw new Error('Not connected');
+        }
         return this.dataProvider.stores[type].store.get('source');
     }
     /**
@@ -14415,6 +14442,9 @@ class RevoGridComponent {
      * @param type - type of source
      */
     async getVisibleSource(type = 'rgRow') {
+        if (!this.dataProvider) {
+            throw new Error('Not connected');
+        }
         return getVisibleSourceItem(this.dataProvider.stores[type].store);
     }
     /**
@@ -14423,6 +14453,9 @@ class RevoGridComponent {
      * @param type - type of source
      */
     async getSourceStore(type = 'rgRow') {
+        if (!this.dataProvider) {
+            throw new Error('Not connected');
+        }
         return this.dataProvider.stores[type].store;
     }
     /**
@@ -14486,6 +14519,9 @@ class RevoGridComponent {
      */
     async getContentSize() {
         var _a;
+        if (!this.dimensionProvider) {
+            throw new Error('Not connected');
+        }
         return (_a = this.dimensionProvider) === null || _a === void 0 ? void 0 : _a.getFullSize();
     }
     /**
@@ -14555,11 +14591,12 @@ class RevoGridComponent {
         (_a = this.orderService) === null || _a === void 0 ? void 0 : _a.moveTip(e.detail);
     }
     async onCellEdit(e) {
+        var _a;
         const { defaultPrevented, detail } = this.beforeedit.emit(e.detail);
         await timeout();
         // apply data
         if (!defaultPrevented) {
-            this.dataProvider.setCellData(detail);
+            (_a = this.dataProvider) === null || _a === void 0 ? void 0 : _a.setCellData(detail);
             // @feature: incrimental update for cells
             // this.dataProvider.setCellData(detail, false);
             // await this.setDataAt({
@@ -14572,6 +14609,9 @@ class RevoGridComponent {
         }
     }
     onRangeEdit(e) {
+        if (!this.dataProvider) {
+            throw new Error('Not connected');
+        }
         const { defaultPrevented, detail } = this.beforerangeedit.emit(e.detail);
         if (defaultPrevented) {
             e.preventDefault();
@@ -14616,6 +14656,9 @@ class RevoGridComponent {
         this.columnChanged(this.columns);
     }
     columnChanged(newVal = []) {
+        if (!this.dimensionProvider) {
+            return;
+        }
         const columnGather = getColumns(newVal, 0, this.columnTypes);
         this.beforecolumnsset.emit(columnGather);
         this.dimensionProvider.applyNewColumns(columnGather.columns, this.disableVirtualX);
@@ -14633,11 +14676,17 @@ class RevoGridComponent {
         this.columnChanged(this.columns);
     }
     rowSizeChanged(s) {
+        if (!this.dimensionProvider) {
+            return;
+        }
         // clear existing data
         this.dimensionProvider.setSettings({ originItemSize: s }, 'rgRow');
         this.rowDefChanged(this.rowDefinitions, this.rowDefinitions, 'rowSize', true);
     }
     themeChanged(t, _, __ = 'theme', init = false) {
+        if (!this.dimensionProvider) {
+            return;
+        }
         this.themeService.register(t);
         this.dimensionProvider.setSettings({ originItemSize: this.themeService.rowSize }, 'rgRow');
         this.dimensionProvider.setSettings({ originItemSize: this.colSize }, 'rgCol');
@@ -14652,6 +14701,9 @@ class RevoGridComponent {
         this.afterthemechanged.emit(t);
     }
     dataSourceChanged(newVal = [], _, watchName) {
+        if (!this.dataProvider) {
+            return;
+        }
         let type = 'rgRow';
         switch (watchName) {
             case 'pinnedBottomSource':
@@ -14695,6 +14747,10 @@ class RevoGridComponent {
         this.dataSourceChanged(this.source, this.source, 'source');
     }
     rowDefChanged(after, before, _watchName, forceUpdate = true) {
+        // in firefox it's triggered before init
+        if (!this.dimensionProvider || !this.dataProvider) {
+            return;
+        }
         const { detail: { vals: newVal, oldVals: oldVal }, } = this.beforerowdefinition.emit({
             vals: after,
             oldVals: before,
@@ -14723,8 +14779,9 @@ class RevoGridComponent {
             }
         }
         Object.entries(newRows).forEach(([k, r]) => {
+            var _a;
             const type = k;
-            this.dimensionProvider.setCustomSizes(type, r.sizes || {});
+            (_a = this.dimensionProvider) === null || _a === void 0 ? void 0 : _a.setCustomSizes(type, r.sizes || {});
         });
     }
     trimmedRowsChanged(newVal = {}) {
@@ -14748,6 +14805,9 @@ class RevoGridComponent {
      * Stretch Plugin Apply
      */
     applyStretch(isStretch) {
+        if (!this.dimensionProvider || !this.dataProvider) {
+            return;
+        }
         if (isStretch === 'false') {
             isStretch = false;
         }
@@ -14791,6 +14851,9 @@ class RevoGridComponent {
     // #region Plugins
     setPlugins() {
         var _a;
+        if (!this.dimensionProvider || !this.dataProvider) {
+            return;
+        }
         // remove old plugins if any
         this.removePlugins();
         // pass data provider to plugins
@@ -14876,7 +14939,8 @@ class RevoGridComponent {
         this.groupingChanged(this.grouping);
         // init scrolling service
         this.scrollingService = new GridScrollingService((e) => {
-            this.dimensionProvider.setViewPortCoordinate({
+            var _a;
+            (_a = this.dimensionProvider) === null || _a === void 0 ? void 0 : _a.setViewPortCoordinate({
                 coordinate: e.coordinate,
                 type: e.dimension,
             });
@@ -14894,6 +14958,9 @@ class RevoGridComponent {
         return Promise.all(this.jobsBeforeRender);
     }
     render() {
+        if (!this.dimensionProvider || !this.dataProvider) {
+            return;
+        }
         const contentHeight = this.dimensionProvider.stores['rgRow'].store.get('realSize');
         // init viewport service helpers
         this.viewport = new ViewportService({
@@ -14929,7 +14996,7 @@ class RevoGridComponent {
             const headerProperties = Object.assign(Object.assign({}, view.headerProp), { type: view.type, additionalData: this.additionalData, viewportCol: view.viewportCol, selectionStore: view.columnSelectionStore, canResize: this.resize, readonly: this.readonly, columnFilter: !!this.filter });
             // Column headers
             const dataViews = [
-                hAsync("revogr-header", Object.assign({ key: '31f0cebc08d5e9222d058c138079ee1d6c228ed2' }, headerProperties, { slot: HEADER_SLOT })),
+                hAsync("revogr-header", Object.assign({}, headerProperties, { slot: HEADER_SLOT })),
             ];
             // Render viewport data (vertical sections)
             view.dataPorts.forEach(data => {
@@ -14951,12 +15018,12 @@ class RevoGridComponent {
         const typeCol = 'rgCol';
         const viewports = this.viewportProvider.stores;
         const dimensions = this.dimensionProvider.stores;
-        return (hAsync(Host, { key: '2563091c11d20bef3e25706e64822040002fe5a4' }, this.hideAttribution ? null : (hAsync("revogr-attribution", { class: "attribution" })), hAsync("div", { key: '58fbfb9a4169e6640ad1c4b0f238c006e23d0059', class: "main-viewport", onClick: (e) => {
+        return (hAsync(Host, null, this.hideAttribution ? null : (hAsync("revogr-attribution", { class: "attribution" })), hAsync("div", { class: "main-viewport", onClick: (e) => {
                 var _a;
                 if (e.currentTarget === e.target) {
                     (_a = this.viewport) === null || _a === void 0 ? void 0 : _a.clearEdit();
                 }
-            } }, hAsync("div", { key: '028984ab42f98828aba4d5b37b831b832978133f', class: "viewports" }, hAsync("slot", { key: '521dacf842476ff8ed35ec4c87c6276c331c4316', name: "viewport" }), viewportSections, hAsync("revogr-scroll-virtual", { key: 'd4e7a0c3cdda8fcc9e64841c0d16f1e557a75144', class: "vertical", dimension: typeRow, viewportStore: viewports[typeRow].store, dimensionStore: dimensions[typeRow].store, ref: el => this.scrollingService.registerElement(el, 'rowScroll'), onScrollvirtual: e => this.scrollingService.proxyScroll(e.detail) }), hAsync(OrderRenderer, { key: 'c49e93965594b38d6827f8f8c00e3004c8c392f8', ref: e => (this.orderService = e) }))), hAsync("revogr-scroll-virtual", { key: 'ccccd5bdfbd5ccd1dfb76727b7e903a95d262945', class: "horizontal", dimension: typeCol, viewportStore: viewports[typeCol].store, dimensionStore: dimensions[typeCol].store, ref: el => this.scrollingService.registerElement(el, 'colScroll'), onScrollvirtual: e => this.scrollingService.proxyScroll(e.detail) }), this.extraElements));
+            } }, hAsync("div", { class: "viewports" }, hAsync("slot", { name: "viewport" }), viewportSections, hAsync("revogr-scroll-virtual", { class: "vertical", dimension: typeRow, viewportStore: viewports[typeRow].store, dimensionStore: dimensions[typeRow].store, ref: el => this.scrollingService.registerElement(el, 'rowScroll'), onScrollvirtual: e => this.scrollingService.proxyScroll(e.detail) }), hAsync(OrderRenderer, { ref: e => (this.orderService = e) }))), hAsync("revogr-scroll-virtual", { class: "horizontal", dimension: typeCol, viewportStore: viewports[typeCol].store, dimensionStore: dimensions[typeCol].store, ref: el => this.scrollingService.registerElement(el, 'colScroll'), onScrollvirtual: e => this.scrollingService.proxyScroll(e.detail) }), this.extraElements));
     }
     disconnectedCallback() {
         // Remove all plugins, to avoid memory leaks and unexpected behaviour when the component is removed
@@ -16044,7 +16111,7 @@ class RevogrRowHeaders {
         const viewportHeader = Object.assign(Object.assign({}, this.headerProp), { colData: typeof this.rowHeaderColumn === 'object' ? [this.rowHeaderColumn] : [], viewportCol: viewport.store, canResize: false, type: ROW_HEADER_TYPE,
             // parent,
             slot: HEADER_SLOT });
-        return (hAsync(Host, { class: { [ROW_HEADER_TYPE]: true }, key: ROW_HEADER_TYPE }, hAsync("revogr-viewport-scroll", Object.assign({ key: '743c1dbaed3edf679c0616a2b79171a43d94806f' }, viewportScroll, { "row-header": true }), hAsync("revogr-header", Object.assign({ key: '53f1f64b1358d7828a5e45807915740ef198df21' }, viewportHeader)), dataViews)));
+        return (hAsync(Host, { class: { [ROW_HEADER_TYPE]: true }, key: ROW_HEADER_TYPE }, hAsync("revogr-viewport-scroll", Object.assign({ key: 'a63769297e9f09edbdccc04012137f843ae92f17' }, viewportScroll, { "row-header": true }), hAsync("revogr-header", Object.assign({ key: '796e213166053e66dbd99298991d92e48e1f49cb' }, viewportHeader)), dataViews)));
     }
     static get cmpMeta() { return {
         "$flags$": 0,
@@ -16373,7 +16440,7 @@ class RevogrScrollVirtual {
     }
     render() {
         const sizeType = this.dimension === 'rgRow' ? 'height' : 'width';
-        return (hAsync(Host, { key: '1bf8d494d6d65ffd27f0a663f5c62c9b60cd35e1', onScroll: (e) => this.onScroll(e) }, hAsync("div", { key: '3f554ca3e7822c9bb20fe830fc4122a0d52919ee', style: {
+        return (hAsync(Host, { key: '73aa9ba5bd17eea4d37eaecd63326fca29e4e231', onScroll: (e) => this.onScroll(e) }, hAsync("div", { key: 'c57e42d782f693dc2a93e98f157ef60ebe09398c', style: {
                 [sizeType]: `${getContentSize(this.dimensionStore.get('realSize'), this.size, this.viewportStore.get('virtualSize'))}px`,
             } })));
     }
@@ -16629,7 +16696,7 @@ class RevogrViewportScroll {
         this.setScrollVisibility('rgCol', this.horizontalScroll.clientWidth, this.contentWidth);
     }
     render() {
-        return (hAsync(Host, { key: '8395ce30127f30fff81dc67bfe2f4c3b087b2007', onWheel: this.horizontalMouseWheel, onScroll: (e) => this.applyScroll('rgCol', e) }, hAsync("div", { key: 'efd2db0f5b22b394e93923926f86f2ab9bffb8e0', class: "inner-content-table", style: { width: `${this.contentWidth}px` } }, hAsync("div", { key: '2794c7187ec23ac45dab5f6cb3f20ba59102b2a7', class: "header-wrapper", ref: e => (this.header = e) }, hAsync("slot", { key: '1a344d7e5cf58d77818390e8d541de88a75399d0', name: HEADER_SLOT })), hAsync("div", { key: '2aeb56f4bf3f3fc60eaeaffd8c18565beaa127ca', class: "vertical-inner", ref: el => (this.verticalScroll = el), onWheel: this.verticalMouseWheel, onScroll: (e) => this.applyScroll('rgRow', e) }, hAsync("div", { key: '59482ef73d3c4617c2511b8613056bbc200cd089', class: "content-wrapper", style: { height: `${this.contentHeight}px` } }, hAsync("slot", { key: 'f318ab365e5f6eddcd2812a314f55cac0959c3b4', name: CONTENT_SLOT }))), hAsync("div", { key: '265c036107a8ed3d47b767fec10ae0225cc927cf', class: "footer-wrapper", ref: e => (this.footer = e) }, hAsync("slot", { key: '2aa7e178375b462e666cf067e075856f592714b6', name: FOOTER_SLOT })))));
+        return (hAsync(Host, { key: '5a7d07c999e59a8b96a99c87e50103acb4f18406', onWheel: this.horizontalMouseWheel, onScroll: (e) => this.applyScroll('rgCol', e) }, hAsync("div", { key: '09ac58def608c3bc169ce12e09dd2dc2df1f90a2', class: "inner-content-table", style: { width: `${this.contentWidth}px` } }, hAsync("div", { key: 'c370a3b8d5d2f4925b77020ac85d5f4d06b876e0', class: "header-wrapper", ref: e => (this.header = e) }, hAsync("slot", { key: 'c5feeeaf90e42715bbf13619b2341d23257447fb', name: HEADER_SLOT })), hAsync("div", { key: '7c04ffd6e7893db57f883a736d0a4932743863ea', class: "vertical-inner", ref: el => (this.verticalScroll = el), onWheel: this.verticalMouseWheel, onScroll: (e) => this.applyScroll('rgRow', e) }, hAsync("div", { key: 'da5db752025ddaaf626411b445b3b90b5b81cdc8', class: "content-wrapper", style: { height: `${this.contentHeight}px` } }, hAsync("slot", { key: 'c5404f4628b68b4b18a6e9143c70e72c50616f9d', name: CONTENT_SLOT }))), hAsync("div", { key: 'ee9e1b5dd297f220aed3efef4b53b4dd74a11837', class: "footer-wrapper", ref: e => (this.footer = e) }, hAsync("slot", { key: '5ff132da3009d959a6e87fbbe3d22930f322c486', name: FOOTER_SLOT })))));
     }
     /**
      * Extra layer for scroll event monitoring, where MouseWheel event is not passing
@@ -16735,7 +16802,7 @@ class VNodeToHtml {
     render() {
         var _a, _b;
         this.vnodes = (_b = (_a = this.redraw) === null || _a === void 0 ? void 0 : _a.call(this)) !== null && _b !== void 0 ? _b : null;
-        return (hAsync(Host, { key: 'dcaa7c6bd2f1eef1dd9a7f95a723f8ec778681a0', style: { visibility: 'hidden', position: 'absolute' } }, this.vnodes));
+        return (hAsync(Host, { key: '8d02c8cc7a2520cebce307c7f3e7e07107a0a494', style: { visibility: 'hidden', position: 'absolute' } }, this.vnodes));
     }
     get el() { return getElement(this); }
     static get cmpMeta() { return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@revolist/revogrid",
-  "version": "4.9.12",
+  "version": "4.9.13",
   "type": "module",
   "description": "Virtual reactive data grid spreadsheet component - RevoGrid.",
   "license": "MIT",

package/standalone/revo-grid.js

@@ -3501,6 +3501,9 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
      * Can be specific part as rgRow or pinned rgRow or 'all' by default.
      */
     async refresh(type = 'all') {
+        if (!this.dataProvider) {
+            throw new Error('Not connected');
+        }
         this.dataProvider.refresh(type);
     }
     /**
@@ -3519,6 +3522,9 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
      * Scrolls viewport to specified row by index.
      */
     async scrollToRow(coordinate = 0) {
+        if (!this.dimensionProvider) {
+            throw new Error('Not connected');
+        }
         const y = this.dimensionProvider.getViewPortPos({
             coordinate,
             dimension: 'rgRow',
@@ -3529,6 +3535,9 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
      * Scrolls viewport to specified column by index.
      */
     async scrollToColumnIndex(coordinate = 0) {
+        if (!this.dimensionProvider) {
+            throw new Error('Not connected');
+        }
         const x = this.dimensionProvider.getViewPortPos({
             coordinate,
             dimension: 'rgCol',
@@ -3539,6 +3548,9 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
      * Scrolls viewport to specified column by prop
      */
     async scrollToColumnProp(prop, dimension = 'rgCol') {
+        if (!this.dimensionProvider) {
+            throw new Error('Not connected');
+        }
         const coordinate = this.columnProvider.getColumnIndexByProp(prop, dimension);
         if (coordinate < 0) {
             // already on the screen
@@ -3556,6 +3568,9 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
     }
     /** Add trimmed by type */
     async addTrimmed(trimmed, trimmedType = 'external', type = 'rgRow') {
+        if (!this.dataProvider) {
+            throw new Error('Not connected');
+        }
         const event = this.beforetrimmed.emit({
             trimmed,
             trimmedType,
@@ -3591,6 +3606,9 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
     }
     /**  Get data from source */
     async getSource(type = 'rgRow') {
+        if (!this.dataProvider) {
+            throw new Error('Not connected');
+        }
         return this.dataProvider.stores[type].store.get('source');
     }
     /**
@@ -3599,6 +3617,9 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
      * @param type - type of source
      */
     async getVisibleSource(type = 'rgRow') {
+        if (!this.dataProvider) {
+            throw new Error('Not connected');
+        }
         return getVisibleSourceItem(this.dataProvider.stores[type].store);
     }
     /**
@@ -3607,6 +3628,9 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
      * @param type - type of source
      */
     async getSourceStore(type = 'rgRow') {
+        if (!this.dataProvider) {
+            throw new Error('Not connected');
+        }
         return this.dataProvider.stores[type].store;
     }
     /**
@@ -3670,6 +3694,9 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
      */
     async getContentSize() {
         var _a;
+        if (!this.dimensionProvider) {
+            throw new Error('Not connected');
+        }
         return (_a = this.dimensionProvider) === null || _a === void 0 ? void 0 : _a.getFullSize();
     }
     /**
@@ -3739,11 +3766,12 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
         (_a = this.orderService) === null || _a === void 0 ? void 0 : _a.moveTip(e.detail);
     }
     async onCellEdit(e) {
+        var _a;
         const { defaultPrevented, detail } = this.beforeedit.emit(e.detail);
         await timeout();
         // apply data
         if (!defaultPrevented) {
-            this.dataProvider.setCellData(detail);
+            (_a = this.dataProvider) === null || _a === void 0 ? void 0 : _a.setCellData(detail);
             // @feature: incrimental update for cells
             // this.dataProvider.setCellData(detail, false);
             // await this.setDataAt({
@@ -3756,6 +3784,9 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
         }
     }
     onRangeEdit(e) {
+        if (!this.dataProvider) {
+            throw new Error('Not connected');
+        }
         const { defaultPrevented, detail } = this.beforerangeedit.emit(e.detail);
         if (defaultPrevented) {
             e.preventDefault();
@@ -3800,6 +3831,9 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
         this.columnChanged(this.columns);
     }
     columnChanged(newVal = []) {
+        if (!this.dimensionProvider) {
+            return;
+        }
         const columnGather = getColumns(newVal, 0, this.columnTypes);
         this.beforecolumnsset.emit(columnGather);
         this.dimensionProvider.applyNewColumns(columnGather.columns, this.disableVirtualX);
@@ -3817,11 +3851,17 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
         this.columnChanged(this.columns);
     }
     rowSizeChanged(s) {
+        if (!this.dimensionProvider) {
+            return;
+        }
         // clear existing data
         this.dimensionProvider.setSettings({ originItemSize: s }, 'rgRow');
         this.rowDefChanged(this.rowDefinitions, this.rowDefinitions, 'rowSize', true);
     }
     themeChanged(t, _, __ = 'theme', init = false) {
+        if (!this.dimensionProvider) {
+            return;
+        }
         this.themeService.register(t);
         this.dimensionProvider.setSettings({ originItemSize: this.themeService.rowSize }, 'rgRow');
         this.dimensionProvider.setSettings({ originItemSize: this.colSize }, 'rgCol');
@@ -3836,6 +3876,9 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
         this.afterthemechanged.emit(t);
     }
     dataSourceChanged(newVal = [], _, watchName) {
+        if (!this.dataProvider) {
+            return;
+        }
         let type = 'rgRow';
         switch (watchName) {
             case 'pinnedBottomSource':
@@ -3879,6 +3922,10 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
         this.dataSourceChanged(this.source, this.source, 'source');
     }
     rowDefChanged(after, before, _watchName, forceUpdate = true) {
+        // in firefox it's triggered before init
+        if (!this.dimensionProvider || !this.dataProvider) {
+            return;
+        }
         const { detail: { vals: newVal, oldVals: oldVal }, } = this.beforerowdefinition.emit({
             vals: after,
             oldVals: before,
@@ -3907,8 +3954,9 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
             }
         }
         Object.entries(newRows).forEach(([k, r]) => {
+            var _a;
             const type = k;
-            this.dimensionProvider.setCustomSizes(type, r.sizes || {});
+            (_a = this.dimensionProvider) === null || _a === void 0 ? void 0 : _a.setCustomSizes(type, r.sizes || {});
         });
     }
     trimmedRowsChanged(newVal = {}) {
@@ -3932,6 +3980,9 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
      * Stretch Plugin Apply
      */
     applyStretch(isStretch) {
+        if (!this.dimensionProvider || !this.dataProvider) {
+            return;
+        }
         if (isStretch === 'false') {
             isStretch = false;
         }
@@ -3975,6 +4026,9 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
     // #region Plugins
     setPlugins() {
         var _a;
+        if (!this.dimensionProvider || !this.dataProvider) {
+            return;
+        }
         // remove old plugins if any
         this.removePlugins();
         // pass data provider to plugins
@@ -4060,7 +4114,8 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
         this.groupingChanged(this.grouping);
         // init scrolling service
         this.scrollingService = new GridScrollingService((e) => {
-            this.dimensionProvider.setViewPortCoordinate({
+            var _a;
+            (_a = this.dimensionProvider) === null || _a === void 0 ? void 0 : _a.setViewPortCoordinate({
                 coordinate: e.coordinate,
                 type: e.dimension,
             });
@@ -4078,6 +4133,9 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
         return Promise.all(this.jobsBeforeRender);
     }
     render() {
+        if (!this.dimensionProvider || !this.dataProvider) {
+            return;
+        }
         const contentHeight = this.dimensionProvider.stores['rgRow'].store.get('realSize');
         // init viewport service helpers
         this.viewport = new ViewportService({
@@ -4113,7 +4171,7 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
             const headerProperties = Object.assign(Object.assign({}, view.headerProp), { type: view.type, additionalData: this.additionalData, viewportCol: view.viewportCol, selectionStore: view.columnSelectionStore, canResize: this.resize, readonly: this.readonly, columnFilter: !!this.filter });
             // Column headers
             const dataViews = [
-                h("revogr-header", Object.assign({ key: '31f0cebc08d5e9222d058c138079ee1d6c228ed2' }, headerProperties, { slot: HEADER_SLOT })),
+                h("revogr-header", Object.assign({}, headerProperties, { slot: HEADER_SLOT })),
             ];
             // Render viewport data (vertical sections)
             view.dataPorts.forEach(data => {
@@ -4135,12 +4193,12 @@ const RevoGridComponent = /*@__PURE__*/ proxyCustomElement(class RevoGridCompone
         const typeCol = 'rgCol';
         const viewports = this.viewportProvider.stores;
         const dimensions = this.dimensionProvider.stores;
-        return (h(Host, { key: '2563091c11d20bef3e25706e64822040002fe5a4' }, this.hideAttribution ? null : (h("revogr-attribution", { class: "attribution" })), h("div", { key: '58fbfb9a4169e6640ad1c4b0f238c006e23d0059', class: "main-viewport", onClick: (e) => {
+        return (h(Host, null, this.hideAttribution ? null : (h("revogr-attribution", { class: "attribution" })), h("div", { class: "main-viewport", onClick: (e) => {
                 var _a;
                 if (e.currentTarget === e.target) {
                     (_a = this.viewport) === null || _a === void 0 ? void 0 : _a.clearEdit();
                 }
-            } }, h("div", { key: '028984ab42f98828aba4d5b37b831b832978133f', class: "viewports" }, h("slot", { key: '521dacf842476ff8ed35ec4c87c6276c331c4316', name: "viewport" }), viewportSections, h("revogr-scroll-virtual", { key: 'd4e7a0c3cdda8fcc9e64841c0d16f1e557a75144', class: "vertical", dimension: typeRow, viewportStore: viewports[typeRow].store, dimensionStore: dimensions[typeRow].store, ref: el => this.scrollingService.registerElement(el, 'rowScroll'), onScrollvirtual: e => this.scrollingService.proxyScroll(e.detail) }), h(OrderRenderer, { key: 'c49e93965594b38d6827f8f8c00e3004c8c392f8', ref: e => (this.orderService = e) }))), h("revogr-scroll-virtual", { key: 'ccccd5bdfbd5ccd1dfb76727b7e903a95d262945', class: "horizontal", dimension: typeCol, viewportStore: viewports[typeCol].store, dimensionStore: dimensions[typeCol].store, ref: el => this.scrollingService.registerElement(el, 'colScroll'), onScrollvirtual: e => this.scrollingService.proxyScroll(e.detail) }), this.extraElements));
+            } }, h("div", { class: "viewports" }, h("slot", { name: "viewport" }), viewportSections, h("revogr-scroll-virtual", { class: "vertical", dimension: typeRow, viewportStore: viewports[typeRow].store, dimensionStore: dimensions[typeRow].store, ref: el => this.scrollingService.registerElement(el, 'rowScroll'), onScrollvirtual: e => this.scrollingService.proxyScroll(e.detail) }), h(OrderRenderer, { ref: e => (this.orderService = e) }))), h("revogr-scroll-virtual", { class: "horizontal", dimension: typeCol, viewportStore: viewports[typeCol].store, dimensionStore: dimensions[typeCol].store, ref: el => this.scrollingService.registerElement(el, 'colScroll'), onScrollvirtual: e => this.scrollingService.proxyScroll(e.detail) }), this.extraElements));
     }
     disconnectedCallback() {
         // Remove all plugins, to avoid memory leaks and unexpected behaviour when the component is removed