@revolist/revogrid 4.0.2-next → 4.0.2

package/dist/cjs/revogr-clipboard.cjs.entry.js

@@ -1,53 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-d3f67f2e.js');
-
-const Clipboard = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.copyRegion = index.createEvent(this, "copyRegion", 3);
-    this.pasteRegion = index.createEvent(this, "pasteRegion", 3);
-  }
-  onPaste(e) {
-    const clipboardData = this.getData(e);
-    const isHTML = clipboardData.types.indexOf('text/html') > -1;
-    const data = isHTML ? clipboardData.getData('text/html') : clipboardData.getData('text');
-    const parsedData = isHTML ? this.htmlParse(data) : this.textParse(data);
-    this.pasteRegion.emit(parsedData);
-    e.preventDefault();
-  }
-  copyStarted(e) {
-    this.copyRegion.emit(this.getData(e));
-    e.preventDefault();
-  }
-  async doCopy(e, data) {
-    e.setData('text/plain', data ? this.parserCopy(data) : '');
-  }
-  parserCopy(data) {
-    return data.map(rgRow => rgRow.join('\t')).join('\n');
-  }
-  textParse(data) {
-    const result = [];
-    const rows = data.split(/\r\n|\n|\r/);
-    for (let y in rows) {
-      result.push(rows[y].split('\t'));
-    }
-    return result;
-  }
-  htmlParse(data) {
-    const result = [];
-    const table = document.createRange().createContextualFragment(data).querySelector('table');
-    for (const rgRow of Array.from(table.rows)) {
-      result.push(Array.from(rgRow.cells).map(cell => cell.innerText));
-    }
-    return result;
-  }
-  getData(e) {
-    var _a;
-    return e.clipboardData || ((_a = window) === null || _a === void 0 ? void 0 : _a.clipboardData);
-  }
-};
-
-exports.revogr_clipboard = Clipboard;

package/dist/collection/components/button/button.js

@@ -1,4 +0,0 @@
-import { h } from '@stencil/core';
-export const RevoButton = (props, children) => {
-  return (h("button", Object.assign({}, props, { class: Object.assign(Object.assign({}, (typeof props.class === 'object' ? props.class : props.class ? { [props.class]: true } : '')), { ['revo-button']: true }) }), children));
-};

package/dist/collection/components/data/cellRenderer.js

@@ -1,19 +0,0 @@
-import { h } from '@stencil/core';
-import ColumnService from './columnService';
-import { DRAG_ICON_CLASS, DRAGGABLE_CLASS } from '../../utils/consts';
-const CellRenderer = ({ model, onDragStart }) => {
-  const els = [];
-  if (model.column.rowDrag && isRowDragService(model.column.rowDrag, model)) {
-    els.push(h("span", { class: DRAGGABLE_CLASS, onMouseDown: e => onDragStart(e) },
-      h("span", { class: DRAG_ICON_CLASS })));
-  }
-  els.push(`${ColumnService.getData(model.model[model.prop])}`);
-  return els;
-};
-export default CellRenderer;
-function isRowDragService(rowDrag, model) {
-  if (typeof rowDrag === 'function') {
-    return rowDrag(model);
-  }
-  return !!rowDrag;
-}

package/dist/collection/components/data/columnService.js

@@ -1,243 +0,0 @@
-import { h } from '@stencil/core';
-import { getSourceItem, getVisibleSourceItem, setSourceByVirtualIndex } from '../../store/dataSource/data.store';
-import { CELL_CLASS, DISABLED_CLASS } from '../../utils/consts';
-import { getRange } from '../../store/selection/selection.helpers';
-import { isGroupingColumn } from '../../plugins/groupingRow/grouping.service';
-export default class ColumnService {
-  constructor(dataStore, source) {
-    this.dataStore = dataStore;
-    this.source = source;
-    this.unsubscribe = [];
-    this.hasGrouping = false;
-    this.unsubscribe.push(source.onChange('source', s => this.checkGrouping(s)));
-    this.checkGrouping(source.get('source'));
-  }
-  get columns() {
-    return getVisibleSourceItem(this.source);
-  }
-  checkGrouping(cols) {
-    for (let rgCol of cols) {
-      if (isGroupingColumn(rgCol)) {
-        this.hasGrouping = true;
-        return;
-      }
-      this.hasGrouping = false;
-    }
-  }
-  isReadOnly(r, c) {
-    var _a;
-    const readOnly = (_a = this.columns[c]) === null || _a === void 0 ? void 0 : _a.readonly;
-    if (typeof readOnly === 'function') {
-      const data = this.rowDataModel(r, c);
-      return readOnly(data);
-    }
-    return readOnly;
-  }
-  static doMerge(existing, extra) {
-    let props = Object.assign(Object.assign({}, extra), existing);
-    // extend existing props
-    if (extra.class) {
-      if (typeof extra.class === 'object' && typeof props.class === 'object') {
-        props.class = Object.assign(Object.assign({}, extra.class), props.class);
-      }
-      else if (typeof extra.class === 'string' && typeof props.class === 'object') {
-        props.class[extra.class] = true;
-      }
-      else if (typeof props.class === 'string') {
-        props.class += ' ' + extra.class;
-      }
-    }
-    if (extra.style) {
-      props.style = Object.assign(Object.assign({}, extra.style), props.style);
-    }
-    return props;
-  }
-  mergeProperties(r, c, defaultProps) {
-    var _a;
-    const cellClass = {
-      [CELL_CLASS]: true,
-      [DISABLED_CLASS]: this.isReadOnly(r, c),
-    };
-    let props = Object.assign(Object.assign({}, defaultProps), { class: cellClass });
-    const extraPropsFunc = (_a = this.columns[c]) === null || _a === void 0 ? void 0 : _a.cellProperties;
-    if (extraPropsFunc) {
-      const data = this.rowDataModel(r, c);
-      const extra = extraPropsFunc(data);
-      if (!extra) {
-        return props;
-      }
-      return ColumnService.doMerge(props, extra);
-    }
-    return props;
-  }
-  customRenderer(_r, c, model, providers) {
-    var _a;
-    const tpl = (_a = this.columns[c]) === null || _a === void 0 ? void 0 : _a.cellTemplate;
-    if (tpl) {
-      return tpl(h, Object.assign(Object.assign({}, model), { providers }));
-    }
-    return;
-  }
-  getRowClass(r, prop) {
-    const model = getSourceItem(this.dataStore, r) || {};
-    return model[prop] || '';
-  }
-  getCellData(r, c) {
-    const data = this.rowDataModel(r, c);
-    return ColumnService.getData(data.model[data.prop]);
-  }
-  getSaveData(rowIndex, c, val) {
-    if (typeof val === 'undefined') {
-      val = this.getCellData(rowIndex, c);
-    }
-    const data = this.rowDataModel(rowIndex, c);
-    return {
-      prop: data.prop,
-      rowIndex,
-      val,
-      model: data.model,
-      type: this.dataStore.get('type'),
-    };
-  }
-  getCellEditor(_r, c, editors) {
-    var _a;
-    const editor = (_a = this.columns[c]) === null || _a === void 0 ? void 0 : _a.editor;
-    if (!editor) {
-      return undefined;
-    }
-    // reference
-    if (typeof editor === 'string') {
-      return editors[editor];
-    }
-    return editor;
-  }
-  rowDataModel(rowIndex, c) {
-    const column = this.columns[c];
-    const prop = column === null || column === void 0 ? void 0 : column.prop;
-    const model = getSourceItem(this.dataStore, rowIndex) || {};
-    return {
-      prop,
-      model,
-      data: this.dataStore.get('source'),
-      column,
-      rowIndex,
-    };
-  }
-  getRangeData(d) {
-    const changed = {};
-    // get original length sizes
-    const copyColLength = d.oldProps.length;
-    const copyFrom = this.copyRangeArray(d.oldRange, d.oldProps, this.dataStore);
-    const copyRowLength = copyFrom.length;
-    // rows
-    for (let rowIndex = d.newRange.y, i = 0; rowIndex < d.newRange.y1 + 1; rowIndex++, i++) {
-      // copy original data link
-      const copyRow = copyFrom[i % copyRowLength];
-      // columns
-      for (let colIndex = d.newRange.x, j = 0; colIndex < d.newRange.x1 + 1; colIndex++, j++) {
-        // check if old range area
-        if (rowIndex >= d.oldRange.y && rowIndex <= d.oldRange.y1 && colIndex >= d.oldRange.x && colIndex <= d.oldRange.x1) {
-          continue;
-        }
-        const p = this.columns[colIndex].prop;
-        const currentCol = j % copyColLength;
-        /** if can write */
-        if (!this.isReadOnly(rowIndex, colIndex)) {
-          /** to show before save */
-          if (!changed[rowIndex]) {
-            changed[rowIndex] = {};
-          }
-          changed[rowIndex][p] = copyRow[currentCol];
-        }
-      }
-    }
-    return changed;
-  }
-  getTransformedDataToApply(start, data) {
-    const changed = {};
-    const copyRowLength = data.length;
-    const colLength = this.columns.length;
-    const rowLength = this.dataStore.get('items').length;
-    // rows
-    let rowIndex = start.y;
-    let maxCol = 0;
-    for (let i = 0; rowIndex < rowLength && i < copyRowLength; rowIndex++, i++) {
-      // copy original data link
-      const copyRow = data[i % copyRowLength];
-      const copyColLength = (copyRow === null || copyRow === void 0 ? void 0 : copyRow.length) || 0;
-      // columns
-      let colIndex = start.x;
-      for (let j = 0; colIndex < colLength && j < copyColLength; colIndex++, j++) {
-        const p = this.columns[colIndex].prop;
-        const currentCol = j % colLength;
-        /** if can write */
-        if (!this.isReadOnly(rowIndex, colIndex)) {
-          /** to show before save */
-          if (!changed[rowIndex]) {
-            changed[rowIndex] = {};
-          }
-          changed[rowIndex][p] = copyRow[currentCol];
-        }
-      }
-      maxCol = Math.max(maxCol, colIndex - 1);
-    }
-    const range = getRange(start, {
-      y: rowIndex - 1,
-      x: maxCol,
-    });
-    return {
-      changed,
-      range,
-    };
-  }
-  applyRangeData(data) {
-    const items = {};
-    for (let rowIndex in data) {
-      const oldModel = (items[rowIndex] = getSourceItem(this.dataStore, parseInt(rowIndex, 10)));
-      for (let prop in data[rowIndex]) {
-        oldModel[prop] = data[rowIndex][prop];
-      }
-    }
-    setSourceByVirtualIndex(this.dataStore, items);
-  }
-  getRangeStaticData(d, value) {
-    const changed = {};
-    // rows
-    for (let rowIndex = d.y, i = 0; rowIndex < d.y1 + 1; rowIndex++, i++) {
-      // columns
-      for (let colIndex = d.x, j = 0; colIndex < d.x1 + 1; colIndex++, j++) {
-        const p = this.columns[colIndex].prop;
-        /** if can write */
-        if (!this.isReadOnly(rowIndex, colIndex)) {
-          /** to show before save */
-          if (!changed[rowIndex]) {
-            changed[rowIndex] = {};
-          }
-          changed[rowIndex][p] = value;
-        }
-      }
-    }
-    return changed;
-  }
-  copyRangeArray(range, rangeProps, store) {
-    const toCopy = [];
-    for (let i = range.y; i < range.y1 + 1; i++) {
-      const rgRow = [];
-      for (let prop of rangeProps) {
-        const item = getSourceItem(store, i);
-        rgRow.push(item[prop]);
-      }
-      toCopy.push(rgRow);
-    }
-    return toCopy;
-  }
-  static getData(val) {
-    if (typeof val === 'undefined' || val === null) {
-      return '';
-    }
-    return val.toString();
-  }
-  destroy() {
-    this.unsubscribe.forEach(f => f());
-  }
-}

package/dist/collection/components/data/rowRenderer.js

@@ -1,6 +0,0 @@
-import { h } from '@stencil/core';
-export const PADDING_DEPTH = 10;
-const RowRenderer = ({ rowClass, size, start, style, depth }, cells) => {
-  return (h("div", { class: `rgRow ${rowClass || ''}`, style: Object.assign(Object.assign({}, style), { height: `${size}px`, transform: `translateY(${start}px)`, paddingLeft: depth ? `${PADDING_DEPTH * depth}px` : undefined }) }, cells));
-};
-export default RowRenderer;

package/dist/collection/components/header/headerCellRenderer.js

@@ -1,19 +0,0 @@
-import { h } from '@stencil/core';
-import { ResizableElement } from '../../services/resizable.directive';
-import ColumnService from '../data/columnService';
-export const HeaderCellRenderer = ({ data, props }, children) => {
-  let colTemplate = (data === null || data === void 0 ? void 0 : data.name) || '';
-  let cellProps = props;
-  if (data === null || data === void 0 ? void 0 : data.columnTemplate) {
-    colTemplate = data.columnTemplate(h, data);
-  }
-  if (data === null || data === void 0 ? void 0 : data.columnProperties) {
-    const extra = data.columnProperties(data);
-    if (extra && typeof extra === 'object') {
-      cellProps = ColumnService.doMerge(props, extra);
-    }
-  }
-  return (h(ResizableElement, Object.assign({}, cellProps),
-    h("div", { class: 'header-content' }, colTemplate),
-    children));
-};

package/dist/collection/components/header/headerRenderer.js

@@ -1,45 +0,0 @@
-import { h } from '@stencil/core';
-import { FilterButton } from '../../plugins/filter/filter.button';
-import { SortingSign } from '../../plugins/sorting/sorting.sign';
-import { DATA_COL, FOCUS_CLASS, HEADER_CLASS, HEADER_SORTABLE_CLASS, MIN_COL_SIZE } from '../../utils/consts';
-import { HeaderCellRenderer } from './headerCellRenderer';
-const HeaderRenderer = (p) => {
-  var _a, _b, _c, _d, _e, _f;
-  const cellClass = {
-    [HEADER_CLASS]: true,
-    [HEADER_SORTABLE_CLASS]: !!((_a = p.data) === null || _a === void 0 ? void 0 : _a.sortable),
-  };
-  if ((_b = p.data) === null || _b === void 0 ? void 0 : _b.order) {
-    cellClass[p.data.order] = true;
-  }
-  const dataProps = {
-    [DATA_COL]: p.column.itemIndex,
-    canResize: p.canResize,
-    minWidth: ((_c = p.data) === null || _c === void 0 ? void 0 : _c.minSize) || MIN_COL_SIZE,
-    maxWidth: (_d = p.data) === null || _d === void 0 ? void 0 : _d.maxSize,
-    active: ['r'],
-    class: cellClass,
-    style: { width: `${p.column.size}px`, transform: `translateX(${p.column.start}px)` },
-    onResize: p.onResize,
-    onDoubleClick(originalEvent) {
-      p.onDoubleClick({ column: p.data, index: p.column.itemIndex, originalEvent });
-    },
-    onClick(originalEvent) {
-      if (originalEvent.defaultPrevented || !p.onClick) {
-        return;
-      }
-      p.onClick({ column: p.data, index: p.column.itemIndex, originalEvent });
-    },
-  };
-  if (p.range) {
-    if (p.column.itemIndex >= p.range.x && p.column.itemIndex <= p.range.x1) {
-      if (typeof dataProps.class === 'object') {
-        dataProps.class[FOCUS_CLASS] = true;
-      }
-    }
-  }
-  return (h(HeaderCellRenderer, { data: p.data, props: dataProps },
-    ((_e = p.data) === null || _e === void 0 ? void 0 : _e.order) ? h(SortingSign, { column: p.data }) : '',
-    p.canFilter && ((_f = p.data) === null || _f === void 0 ? void 0 : _f.filter) !== false ? h(FilterButton, { column: p.data }) : ''));
-};
-export default HeaderRenderer;

package/dist/collection/components/order/orderRenderer.js

@@ -1,50 +0,0 @@
-import { h } from '@stencil/core';
-/**
- * Draw drag
- */
-export class OrdererService {
-  constructor() {
-    this.parentY = 0;
-  }
-  start(parent, { pos, text, event }) {
-    var _a;
-    const { top } = parent.getBoundingClientRect();
-    this.parentY = top;
-    if (this.text) {
-      this.text.innerText = text;
-    }
-    this.move(pos);
-    this.moveTip({ x: event.x, y: event.y });
-    (_a = this.el) === null || _a === void 0 ? void 0 : _a.classList.remove('hidden');
-  }
-  end() {
-    var _a;
-    (_a = this.el) === null || _a === void 0 ? void 0 : _a.classList.add('hidden');
-  }
-  move(pos) {
-    this.moveElement(pos.end - this.parentY);
-  }
-  moveTip({ x, y }) {
-    if (!this.draggable) {
-      return;
-    }
-    this.draggable.style.left = `${x}px`;
-    this.draggable.style.top = `${y}px`;
-  }
-  moveElement(y) {
-    if (!this.rgRow) {
-      return;
-    }
-    this.rgRow.style.transform = `translateY(${y}px)`;
-  }
-}
-const OrderRenderer = ({ ref }) => {
-  const service = new OrdererService();
-  ref(service);
-  return (h("div", { class: "draggable-wrapper hidden", ref: e => (service.el = e) },
-    h("div", { class: "draggable", ref: el => (service.draggable = el) },
-      h("span", { class: "revo-alt-icon" }),
-      h("span", { ref: e => (service.text = e) })),
-    h("div", { class: "drag-position", ref: e => (service.rgRow = e) })));
-};
-export default OrderRenderer;

package/dist/collection/components/order/rowOrderService.js

@@ -1,68 +0,0 @@
-import { getItemByPosition } from '../../store/dimension/dimension.helpers';
-export default class RowOrderService {
-  constructor(config) {
-    this.config = config;
-    this.currentCell = null;
-    this.previousRow = null;
-  }
-  /** Drag finished, calculate and apply changes */
-  endOrder(e, data) {
-    if (this.currentCell === null) {
-      return;
-    }
-    const newRow = this.getCell(e, data);
-    // if position changed
-    if (newRow.y !== this.currentCell.y) {
-      // rgRow dragged out table
-      if (newRow.y < 0) {
-        newRow.y = 0;
-      }
-      // rgRow dragged to the top
-      else if (newRow.y < this.currentCell.y) {
-        newRow.y++;
-      }
-      this.config.positionChanged(this.currentCell.y, newRow.y);
-    }
-    this.clear();
-  }
-  /** Drag started, reserve initial cell for farther use */
-  startOrder(e, data) {
-    this.currentCell = this.getCell(e, data);
-    return this.currentCell;
-  }
-  move(y, data) {
-    const rgRow = this.getRow(y, data);
-    // if rgRow same as previous or below range (-1 = 0) do nothing
-    if (this.previousRow === rgRow.itemIndex || rgRow.itemIndex < -1) {
-      return null;
-    }
-    this.previousRow = rgRow.itemIndex;
-    return rgRow;
-  }
-  /** Drag stopped, probably cursor outside of document area */
-  clear() {
-    this.currentCell = null;
-    this.previousRow = null;
-  }
-  /** Calculate cell based on x, y position */
-  getRow(y, { el, rows }) {
-    const { top } = el.getBoundingClientRect();
-    const topRelative = y - top;
-    const rgRow = getItemByPosition(rows, topRelative);
-    const absolutePosition = {
-      itemIndex: rgRow.itemIndex,
-      start: rgRow.start + top,
-      end: rgRow.end + top,
-    };
-    return absolutePosition;
-  }
-  /** Calculate cell based on x, y position */
-  getCell({ x, y }, { el, rows, cols }) {
-    const { top, left } = el.getBoundingClientRect();
-    const topRelative = y - top;
-    const leftRelative = x - left;
-    const rgRow = getItemByPosition(rows, topRelative);
-    const rgCol = getItemByPosition(cols, leftRelative);
-    return { x: rgCol.itemIndex, y: rgRow.itemIndex };
-  }
-}

package/dist/collection/components/overlay/clipboard.service.js

@@ -1,39 +0,0 @@
-import slice from 'lodash/slice';
-import { h } from '@stencil/core';
-import { getRange } from '../../store/selection/selection.helpers';
-export class ClipboardService {
-  constructor(sv) {
-    this.sv = sv;
-  }
-  onCopy(e) {
-    const canCopy = this.sv.internalCopy();
-    if (canCopy.defaultPrevented) {
-      return false;
-    }
-    let focus = this.sv.selectionStoreService.focused;
-    let range = this.sv.selectionStoreService.ranged;
-    let data;
-    if (!range) {
-      range = getRange(focus, focus);
-    }
-    if (range) {
-      const columns = [...this.sv.columnService.columns];
-      const props = slice(columns, range.x, range.x1 + 1).map(v => v.prop);
-      data = this.sv.columnService.copyRangeArray(range, props, this.sv.dataStore);
-    }
-    this.clipboard.doCopy(e, data);
-    return true;
-  }
-  renderClipboard() {
-    return h("revogr-clipboard", { onCopyRegion: e => this.onCopy(e.detail), ref: e => (this.clipboard = e), onPasteRegion: e => this.onPaste(e.detail) });
-  }
-  onPaste(data) {
-    const focus = this.sv.selectionStoreService.focused;
-    const isEditing = this.sv.selectionStoreService.edited !== null;
-    if (!focus || isEditing) {
-      return;
-    }
-    const { changed, range } = this.sv.columnService.getTransformedDataToApply(focus, data);
-    this.sv.onRangeApply(changed, range);
-  }
-}

package/dist/collection/components/overlay/editors/edit.utils.js

@@ -1,5 +0,0 @@
-import { EDIT_INPUT_WR } from '../../../utils/consts';
-// is edit input
-export function isEditInput(el) {
-  return !!(el === null || el === void 0 ? void 0 : el.closest(`.${EDIT_INPUT_WR}`));
-}

package/dist/collection/components/overlay/editors/text.js

@@ -1,35 +0,0 @@
-import { h } from '@stencil/core';
-import { isEnterKey, isTab } from '../../../utils/keyCodes.utils';
-import { timeout } from '../../../utils/utils';
-export class TextEditor {
-  constructor(column, saveCallback) {
-    this.column = column;
-    this.saveCallback = saveCallback;
-    this.element = null;
-    this.editCell = null;
-  }
-  async componentDidRender() {
-    var _a;
-    if (this.editInput) {
-      await timeout();
-      (_a = this.editInput) === null || _a === void 0 ? void 0 : _a.focus();
-    }
-  }
-  onKeyDown(e) {
-    const isEnter = isEnterKey(e.code);
-    const isKeyTab = isTab(e.code);
-    if ((isKeyTab || isEnter) && e.target && this.saveCallback) {
-      // blur is needed to avoid autoscroll
-      this.editInput.blur();
-      // request callback which will close cell after all
-      this.saveCallback(e.target.value, isKeyTab);
-    }
-  }
-  // required
-  render() {
-    var _a;
-    return (h("input", { type: "text", value: ((_a = this.editCell) === null || _a === void 0 ? void 0 : _a.val) || '', ref: el => {
-        this.editInput = el;
-      }, onKeyDown: e => this.onKeyDown(e) }));
-  }
-}