@revolist/revogrid 3.2.4 → 3.2.5

package/dist/collection/components/selection-temp-range/revogr-temp-range.js

@@ -0,0 +1,141 @@
+/*!
+ * Built by Revolist
+ */
+import { Component, Prop, h, Host } from '@stencil/core';
+import { throttle } from 'lodash';
+import { TMP_SELECTION_BG_CLASS } from '../../utils/consts';
+import { getElStyle } from '../overlay/selection.utils';
+export class RevogrFocus {
+  constructor() {
+    this.onChange = throttle((e) => this.doChange(e), 300);
+  }
+  doChange(e) {
+    e === null || e === void 0 ? void 0 : e.scrollIntoView({
+      block: 'nearest',
+      inline: 'nearest',
+    });
+  }
+  componentDidRender() {
+    if (this.el) {
+      this.onChange(this.el);
+    }
+  }
+  render() {
+    const data = this.selectionStore.get('tempRange');
+    const type = this.selectionStore.get('tempRangeType');
+    if (!data) {
+      return;
+    }
+    let directionY = 'bottom';
+    let derectionX = 'right';
+    const range = this.getRange();
+    if (!range) {
+      return;
+    }
+    if (data.y < range.y) {
+      directionY = 'top';
+    }
+    if (data.x < range.x) {
+      derectionX = 'left';
+    }
+    const directionClass = `${derectionX} ${directionY}`;
+    const style = getElStyle(data, this.dimensionRow.state, this.dimensionCol.state);
+    return (h(Host, { class: {
+        [TMP_SELECTION_BG_CLASS]: true,
+        [type || '']: true,
+      }, style: style },
+      h("div", { class: directionClass, ref: (e) => (this.el = e) })));
+  }
+  getRange() {
+    const range = this.selectionStore.get('range');
+    if (range) {
+      return range;
+    }
+    const focus = this.selectionStore.get('focus');
+    if (!focus) {
+      return null;
+    }
+    return Object.assign(Object.assign({}, focus), { x1: focus.x, y1: focus.y });
+  }
+  static get is() { return "revogr-temp-range"; }
+  static get originalStyleUrls() { return {
+    "$": ["revogr-temp-range-style.scss"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["revogr-temp-range-style.css"]
+  }; }
+  static get properties() { return {
+    "selectionStore": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "Observable<Selection.SelectionStoreState>",
+        "resolved": "ObservableMap<SelectionStoreState>",
+        "references": {
+          "Observable": {
+            "location": "import",
+            "path": "../../interfaces"
+          },
+          "Selection": {
+            "location": "import",
+            "path": "../../interfaces"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Dynamic stores"
+      }
+    },
+    "dimensionRow": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "Observable<RevoGrid.DimensionSettingsState>",
+        "resolved": "ObservableMap<DimensionSettingsState>",
+        "references": {
+          "Observable": {
+            "location": "import",
+            "path": "../../interfaces"
+          },
+          "RevoGrid": {
+            "location": "import",
+            "path": "../../interfaces"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      }
+    },
+    "dimensionCol": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "Observable<RevoGrid.DimensionSettingsState>",
+        "resolved": "ObservableMap<DimensionSettingsState>",
+        "references": {
+          "Observable": {
+            "location": "import",
+            "path": "../../interfaces"
+          },
+          "RevoGrid": {
+            "location": "import",
+            "path": "../../interfaces"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      }
+    }
+  }; }
+}

package/dist/{revo-grid/app-globals-7e6866ba.js → collection/global/global.js}

@@ -1,9 +1,8 @@
 /*!
  * Built by Revolist
  */
-import { s as setMode } from './index-8a604c17.js';
-import { T as ThemeService } from './themeService-ddaaa364.js';
-
+import { setMode } from '@stencil/core';
+import ThemeService from '../themeManager/themeService';
 setMode(elm => {
   let theme = elm.theme || elm.getAttribute('theme');
   if (typeof theme === 'string') {
@@ -15,8 +14,3 @@ setMode(elm => {
   }
   return parsedTheme;
 });
-const globalFn = () => { };
-
-const globalScripts = globalFn;
-
-export { globalScripts as g };

package/dist/collection/index.js

@@ -0,0 +1,4 @@
+/*!
+ * Built by Revolist
+ */
+export * from './components';

package/dist/collection/plugins/autoSizeColumn.js

@@ -0,0 +1,233 @@
+/*!
+ * Built by Revolist
+ */
+/**
+ * Plugin module for revo-grid grid system
+ * Add support for automatic column resize
+ */
+import each from 'lodash/each';
+import reduce from 'lodash/reduce';
+import BasePlugin from './basePlugin';
+import ColumnDataProvider from '../services/column.data.provider';
+import { columnTypes } from '../store/storeTypes';
+import { getSourceItem } from '../store/dataSource/data.store';
+const LETTER_BLOCK_SIZE = 7;
+var ColumnAutoSizeMode;
+(function (ColumnAutoSizeMode) {
+  // increases column width on header click according the largest text value
+  ColumnAutoSizeMode["headerClickAutosize"] = "headerClickAutoSize";
+  // increases column width on data set and text edit, decreases performance
+  ColumnAutoSizeMode["autoSizeOnTextOverlap"] = "autoSizeOnTextOverlap";
+  // increases and decreases column width based on all items sizes, worst for performance
+  ColumnAutoSizeMode["autoSizeAll"] = "autoSizeAll";
+})(ColumnAutoSizeMode || (ColumnAutoSizeMode = {}));
+export default class AutoSizeColumn extends BasePlugin {
+  constructor(revogrid, providers, config) {
+    super(revogrid);
+    this.providers = providers;
+    this.config = config;
+    this.autoSizeColumns = null;
+    /** for edge case when no columns defined before data */
+    this.dataResolve = null;
+    this.dataReject = null;
+    this.letterBlockSize = (config === null || config === void 0 ? void 0 : config.letterBlockSize) || LETTER_BLOCK_SIZE;
+    // create test container to check text width
+    if (config === null || config === void 0 ? void 0 : config.preciseSize) {
+      this.precsizeCalculationArea = this.initiatePresizeElement();
+      revogrid.appendChild(this.precsizeCalculationArea);
+    }
+    const aftersourceset = ({ detail: { source } }) => {
+      this.setSource(source);
+    };
+    const afteredit = ({ detail }) => {
+      this.afteredit(detail);
+    };
+    const afterEditAll = ({ detail }) => {
+      this.afterEditAll(detail);
+    };
+    const beforecolumnsset = ({ detail: { columns } }) => {
+      this.columnSet(columns);
+    };
+    const headerDblClick = ({ detail }) => {
+      const type = ColumnDataProvider.getColumnType(detail);
+      const size = this.getColumnSize(detail.index, type);
+      if (size) {
+        this.providers.dimensionProvider.setDimensionSize(type, {
+          [detail.index]: size,
+        });
+      }
+    };
+    this.addEventListener('beforecolumnsset', beforecolumnsset);
+    switch (config === null || config === void 0 ? void 0 : config.mode) {
+      case ColumnAutoSizeMode.autoSizeOnTextOverlap:
+        this.addEventListener('aftersourceset', aftersourceset);
+        this.addEventListener('afteredit', afteredit);
+        break;
+      case ColumnAutoSizeMode.autoSizeAll:
+        this.addEventListener('aftersourceset', aftersourceset);
+        this.addEventListener('afteredit', afterEditAll);
+        break;
+      default:
+        this.addEventListener('headerdblClick', headerDblClick);
+        break;
+    }
+  }
+  async setSource(source) {
+    let autoSize = this.autoSizeColumns;
+    if (this.dataReject) {
+      this.dataReject();
+      this.clearPromise();
+    }
+    /** If data set first and no column provided await until get one */
+    if (!autoSize) {
+      const request = new Promise((resolve, reject) => {
+        this.dataResolve = resolve;
+        this.dataReject = reject;
+      });
+      try {
+        autoSize = await request;
+      }
+      catch (e) {
+        return;
+      }
+    }
+    // calculate sizes
+    each(autoSize, (_v, type) => {
+      const sizes = {};
+      each(autoSize[type], rgCol => {
+        // calculate size
+        rgCol.size = sizes[rgCol.index] = source.reduce((prev, rgRow) => Math.max(prev, this.getLength(rgRow[rgCol.prop])), 0);
+      });
+      this.providers.dimensionProvider.setDimensionSize(type, sizes);
+    });
+  }
+  getLength(len) {
+    var _a;
+    const padding = 15;
+    if (!len) {
+      return 0;
+    }
+    try {
+      const str = len.toString();
+      /**if exact calculation required proxy with html element, slow operation */
+      if ((_a = this.config) === null || _a === void 0 ? void 0 : _a.preciseSize) {
+        this.precsizeCalculationArea.innerText = str;
+        return this.precsizeCalculationArea.scrollWidth + padding * 2;
+      }
+      return str.length * this.letterBlockSize + padding * 2;
+    }
+    catch (e) {
+      return 0;
+    }
+  }
+  afteredit(e) {
+    let data;
+    if (this.isRangeEdit(e)) {
+      data = e.data;
+    }
+    else {
+      data = { 0: { [e.prop]: e.val } };
+    }
+    each(this.autoSizeColumns, (columns, type) => {
+      const sizes = {};
+      each(columns, rgCol => {
+        // calculate size
+        const size = reduce(data, (prev, rgRow) => {
+          if (typeof rgRow[rgCol.prop] === 'undefined') {
+            return prev;
+          }
+          return Math.max(prev || 0, this.getLength(rgRow[rgCol.prop]));
+        }, undefined);
+        if (size && rgCol.size < size) {
+          rgCol.size = sizes[rgCol.index] = size;
+        }
+      });
+      this.providers.dimensionProvider.setDimensionSize(type, sizes);
+    });
+  }
+  afterEditAll(e) {
+    const props = {};
+    if (this.isRangeEdit(e)) {
+      each(e.data, r => each(r, (_v, p) => (props[p] = true)));
+    }
+    else {
+      props[e.prop] = true;
+    }
+    each(this.autoSizeColumns, (columns, type) => {
+      const sizes = {};
+      each(columns, rgCol => {
+        if (props[rgCol.prop]) {
+          const size = this.getColumnSize(rgCol.index, type);
+          if (size) {
+            sizes[rgCol.index] = size;
+          }
+        }
+      });
+      this.providers.dimensionProvider.setDimensionSize(type, sizes);
+    });
+  }
+  getColumnSize(index, type) {
+    const rgCol = this.autoSizeColumns[type][index];
+    if (!rgCol) {
+      return 0;
+    }
+    return reduce(this.providers.dataProvider.stores, (r, s) => {
+      const perStore = reduce(s.store.get('items'), (prev, _row, i) => {
+        const item = getSourceItem(s.store, i);
+        return Math.max(prev || 0, this.getLength(item[rgCol.prop]));
+      }, 0);
+      return Math.max(r, perStore);
+    }, rgCol.size || 0);
+  }
+  columnSet(columns) {
+    var _a;
+    for (let t of columnTypes) {
+      const type = t;
+      const cols = columns[type];
+      for (let i in cols) {
+        if (cols[i].autoSize || ((_a = this.config) === null || _a === void 0 ? void 0 : _a.allColumns)) {
+          if (!this.autoSizeColumns) {
+            this.autoSizeColumns = {};
+          }
+          if (!this.autoSizeColumns[type]) {
+            this.autoSizeColumns[type] = {};
+          }
+          this.autoSizeColumns[type][i] = Object.assign(Object.assign({}, cols[i]), { index: parseInt(i, 10) });
+        }
+      }
+    }
+    if (this.dataResolve) {
+      this.dataResolve(this.autoSizeColumns);
+      this.clearPromise();
+    }
+  }
+  clearPromise() {
+    this.dataResolve = null;
+    this.dataReject = null;
+  }
+  isRangeEdit(e) {
+    return !!e.data;
+  }
+  initiatePresizeElement() {
+    const styleForFontTest = {
+      position: 'absolute',
+      fontSize: '14px',
+      height: '0',
+      width: '0',
+      whiteSpace: 'nowrap',
+      top: '0',
+      overflowX: 'scroll',
+    };
+    const el = document.createElement('div');
+    for (let s in styleForFontTest) {
+      el.style[s] = styleForFontTest[s];
+    }
+    el.classList.add('revo-test-container');
+    return el;
+  }
+  destroy() {
+    var _a;
+    super.destroy();
+    (_a = this.precsizeCalculationArea) === null || _a === void 0 ? void 0 : _a.remove();
+  }
+}

package/dist/collection/plugins/basePlugin.js

@@ -0,0 +1,30 @@
+/*!
+ * Built by Revolist
+ */
+export default class BasePlugin {
+  constructor(revogrid) {
+    this.revogrid = revogrid;
+    this.subscriptions = {};
+  }
+  addEventListener(name, func) {
+    this.revogrid.addEventListener(name, func);
+    this.subscriptions[name] = func;
+  }
+  removeEventListener(type) {
+    this.revogrid.removeEventListener(type, this.subscriptions[type]);
+    delete this.subscriptions[type];
+  }
+  emit(eventName, detail) {
+    const event = new CustomEvent(eventName, { detail: detail, cancelable: true });
+    this.revogrid.dispatchEvent(event);
+    return event;
+  }
+  clearSubscriptions() {
+    for (let type in this.subscriptions) {
+      this.removeEventListener(type);
+    }
+  }
+  destroy() {
+    this.clearSubscriptions();
+  }
+}

package/dist/{revo-grid/dispatcher-891af82e.js → collection/plugins/dispatcher.js}

@@ -4,7 +4,7 @@
 /**
  * Dispatch custom event to element
  */
-function dispatch(target, eventName, detail) {
+export function dispatch(target, eventName, detail) {
   const event = new CustomEvent(eventName, {
     detail,
     cancelable: true,
@@ -16,9 +16,7 @@ function dispatch(target, eventName, detail) {
 /**
  * Dispatch event by other event target
  */
-function dispatchOnEvent(e, eventName, detail) {
+export function dispatchOnEvent(e, eventName, detail) {
   e.preventDefault();
   return dispatch(e.target, eventName, detail);
 }
-
-export { dispatch as d };

package/dist/collection/plugins/export/csv.js

@@ -0,0 +1,71 @@
+/*!
+ * Built by Revolist
+ */
+import { getGroupingName, isGrouping } from '../groupingRow/grouping.service';
+const INITIAL = {
+  mime: 'text/csv',
+  fileKind: 'csv',
+  // BOM signature
+  bom: true,
+  columnDelimiter: ',',
+  rowDelimiter: '\r\n',
+  encoding: '',
+};
+// The ASCII character code 13 is called a Carriage Return or CR.
+const CARRIAGE_RETURN = String.fromCharCode(13);
+// Chr(13) followed by a Chr(10) that compose a proper CRLF.
+const LINE_FEED = String.fromCharCode(10);
+const DOUBLE_QT = String.fromCharCode(34);
+const NO_BREAK_SPACE = String.fromCharCode(0xfeff);
+const escapeRegex = new RegExp('"', 'g');
+export default class ExportCsv {
+  constructor(options = {}) {
+    this.options = Object.assign(Object.assign({}, INITIAL), options);
+  }
+  doExport({ data, headers, props }) {
+    let result = this.options.bom ? NO_BREAK_SPACE : '';
+    // any header
+    if ((headers === null || headers === void 0 ? void 0 : headers.length) > 0) {
+      headers.forEach(header => {
+        // ignore empty
+        if (!header.length) {
+          return;
+        }
+        result += this.prepareHeader(header, this.options.columnDelimiter);
+        result += this.options.rowDelimiter;
+      });
+    }
+    data.forEach((rgRow, index) => {
+      if (index > 0) {
+        result += this.options.rowDelimiter;
+      }
+      // support grouping
+      if (isGrouping(rgRow)) {
+        result += this.parseCell(getGroupingName(rgRow), this.options.columnDelimiter);
+        return;
+      }
+      result += props.map(p => this.parseCell(rgRow[p], this.options.columnDelimiter)).join(this.options.columnDelimiter);
+    });
+    return result;
+  }
+  prepareHeader(columnHeaders, columnDelimiter) {
+    let result = '';
+    const newColumnHeaders = columnHeaders.map(v => this.parseCell(v, columnDelimiter, true));
+    result += newColumnHeaders.join(columnDelimiter);
+    return result;
+  }
+  parseCell(value, columnDelimiter, force = false) {
+    let escape = value;
+    if (typeof value !== 'string') {
+      escape = JSON.stringify(value);
+    }
+    const toEscape = [CARRIAGE_RETURN, DOUBLE_QT, LINE_FEED, columnDelimiter];
+    if (typeof escape === 'undefined') {
+      return '';
+    }
+    if (escape !== '' && (force || toEscape.some(i => escape.indexOf(i) >= 0))) {
+      return `"${escape.replace(escapeRegex, '""')}"`;
+    }
+    return escape;
+  }
+}

package/dist/collection/plugins/export/export.plugin.js

@@ -0,0 +1,168 @@
+/*!
+ * Built by Revolist
+ */
+import fill from 'lodash/fill';
+import { columnTypes, rowTypes } from '../../store/storeTypes';
+import { timeout } from '../../utils/utils';
+import BasePlugin from '../basePlugin';
+import ExportCsv from './csv';
+var ExportTypes;
+(function (ExportTypes) {
+  ExportTypes["csv"] = "csv";
+})(ExportTypes || (ExportTypes = {}));
+export default class ExportFilePlugin extends BasePlugin {
+  /** Exports string */
+  async exportString(options = {}, t = ExportTypes.csv) {
+    const data = await this.beforeexport();
+    if (!data) {
+      return null;
+    }
+    return this.formatter(t, options).doExport(data);
+  }
+  /** Exports Blob */
+  async exportBlob(options = {}, t = ExportTypes.csv) {
+    return await this.getBlob(this.formatter(t, options));
+  }
+  /** Export file */
+  async exportFile(options = {}, t = ExportTypes.csv) {
+    const formatter = this.formatter(t, options);
+    const blob = await this.getBlob(formatter);
+    // url
+    const URL = window.URL || window.webkitURL;
+    const a = document.createElement('a');
+    const { filename, fileKind } = formatter.options;
+    const name = `${filename}.${fileKind}`;
+    const url = URL.createObjectURL(blob);
+    a.style.display = 'none';
+    a.setAttribute('href', url);
+    a.setAttribute('download', name);
+    this.revogrid.appendChild(a);
+    a.dispatchEvent(new MouseEvent('click'));
+    this.revogrid.removeChild(a);
+    // delay for revoke, correct for some browsers
+    await timeout(120);
+    URL.revokeObjectURL(url);
+  }
+  /** Blob object */
+  async getBlob(formatter) {
+    const type = `${formatter.options.mime};charset=${formatter.options.encoding}`;
+    if (typeof Blob !== 'undefined') {
+      const data = await this.beforeexport();
+      if (!data) {
+        return null;
+      }
+      return new Blob([formatter.doExport(data)], { type });
+    }
+    return null;
+  }
+  // before event
+  async beforeexport() {
+    let data = await this.getData();
+    const event = this.emit('beforeexport', { data });
+    if (event.defaultPrevented) {
+      return null;
+    }
+    return event.detail.data;
+  }
+  async getData() {
+    const data = await this.getSource();
+    const colSource = [];
+    const colPromises = [];
+    columnTypes.forEach((t, i) => {
+      colPromises.push(this.getColPerSource(t).then(s => (colSource[i] = s)));
+    });
+    await Promise.all(colPromises);
+    const columns = {
+      headers: [],
+      props: [],
+    };
+    for (let source of colSource) {
+      source.headers.forEach((h, i) => {
+        if (!columns.headers[i]) {
+          columns.headers[i] = [];
+        }
+        columns.headers[i].push(...h);
+      });
+      columns.props.push(...source.props);
+    }
+    return Object.assign({ data }, columns);
+  }
+  async getColPerSource(t) {
+    const store = await this.revogrid.getColumnStore(t);
+    const source = store.get('source');
+    const virtualIndexes = store.get('items');
+    const depth = store.get('groupingDepth');
+    const groups = store.get('groups');
+    const colNames = [];
+    const colProps = [];
+    const visibleItems = virtualIndexes.reduce((r, v, virtualIndex) => {
+      const prop = source[v].prop;
+      colNames.push(source[v].name || '');
+      colProps.push(prop);
+      r[prop] = virtualIndex;
+      return r;
+    }, {});
+    const rows = this.getGroupHeaders(depth, groups, virtualIndexes, visibleItems);
+    rows.push(colNames);
+    return {
+      headers: rows,
+      props: colProps,
+    };
+  }
+  getGroupHeaders(depth, groups, items, visibleItems) {
+    const rows = [];
+    const template = fill(new Array(items.length), '');
+    for (let d = 0; d < depth; d++) {
+      const rgRow = [...template];
+      rows.push(rgRow);
+      if (!groups[d]) {
+        continue;
+      }
+      const levelGroups = groups[d];
+      // add names of groups
+      levelGroups.forEach((group) => {
+        const minIndex = this.findGroupStartIndex(group.ids, visibleItems);
+        if (typeof minIndex === 'number') {
+          rgRow[minIndex] = group.name;
+        }
+      });
+    }
+    return rows;
+  }
+  findGroupStartIndex(ids, visibleItems) {
+    let min;
+    ids.forEach(id => {
+      const current = visibleItems[id];
+      if (typeof current === 'number') {
+        if (typeof min !== 'number' || min > current) {
+          min = current;
+        }
+      }
+    });
+    return min;
+  }
+  async getSource() {
+    const data = [];
+    const promisesData = [];
+    rowTypes.forEach(t => {
+      const dataPart = [];
+      data.push(dataPart);
+      const promise = this.revogrid.getVisibleSource(t).then((d) => dataPart.push(...d));
+      promisesData.push(promise);
+    });
+    await Promise.all(promisesData);
+    return data.reduce((r, v) => {
+      r.push(...v);
+      return r;
+    }, []);
+  }
+  // get correct class for future multiple types support
+  formatter(type, options = {}) {
+    switch (type) {
+      case ExportTypes.csv:
+        return new ExportCsv(options);
+      default:
+        throw new Error('Unknown format');
+    }
+  }
+}

package/dist/collection/plugins/export/types.js

@@ -0,0 +1,4 @@
+/*!
+ * Built by Revolist
+ */
+export {};