@revolist/revogrid 4.0.2-next → 4.0.2

package/dist/collection/components/header/revogr-header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"revogr-header.js","sourceRoot":"","sources":["../../../src/components/header/revogr-header.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Prop,\n} from '@stencil/core';\nimport { HTMLStencilElement, VNode } from '@stencil/core/internal';\nimport keyBy from 'lodash/keyBy';\n\nimport { HEADER_ACTUAL_ROW_CLASS, HEADER_ROW_CLASS } from '../../utils/consts';\nimport { Groups } from '../../store/dataSource/data.store';\nimport HeaderRenderer from './header-renderer';\nimport ColumnGroupsRenderer from '../../plugins/groupingColumn/columnGroupsRenderer';\nimport { ResizeProps } from '../../services/resizable.directive';\nimport {\n  ColumnRegular,\n  DimensionSettingsState,\n  InitialHeaderClick,\n  Observable,\n  Providers,\n  ViewportState,\n  ViewSettingSizeProp,\n} from '../../types/interfaces';\nimport { DimensionCols } from '../../types/dimension';\nimport { SelectionStoreState } from '../../types/selection';\n\n@Component({\n  tag: 'revogr-header',\n  styleUrl: 'revogr-header-style.scss',\n})\nexport class RevogrHeaderComponent {\n  // #region Properties\n  /**\n   * Stores\n   */\n  /** Viewport X */\n  @Prop() viewportCol: Observable<ViewportState>;\n  /** Dimension settings X */\n  @Prop() dimensionCol: Observable<DimensionSettingsState>;\n  /** Selection, range, focus */\n  @Prop() selectionStore: Observable<SelectionStoreState>;\n\n  /**\n   * Column groups\n   */\n  @Prop() groups: Groups;\n  /**\n   * Grouping depth, how many levels of grouping\n   */\n  @Prop() groupingDepth = 0;\n\n  /**\n   * Readonly mode\n   */\n  @Prop() readonly: boolean;\n  /**\n   * If columns can be resized\n   */\n  @Prop() canResize: boolean;\n  /**\n   * Defines resize position\n   */\n  @Prop() resizeHandler: ResizeProps['active'];\n\n  /**\n   * Columns - defines an array of grid columns.\n   */\n  @Prop() colData: ColumnRegular[];\n\n  /**\n   * Column filter\n   */\n  @Prop() columnFilter: boolean;\n\n  /**\n   * Column type\n   */\n  @Prop() type!: DimensionCols | 'rowHeaders';\n\n  /**\n   * Extra properties to pass into header renderer, such as vue or react components to handle parent\n   */\n  @Prop() additionalData: any = {};\n  // #endregion\n\n  // #region Events\n\n  /**\n   * On initial header click\n  */\n  @Event({\n    eventName: 'beforeheaderclick',\n  })\n  initialHeaderClick: EventEmitter<InitialHeaderClick>;\n\n  /**\n   * On header resize\n  */\n  @Event({\n    eventName: 'headerresize',\n  })\n  headerresize: EventEmitter<ViewSettingSizeProp>;\n\n  /**\n   * On before header resize\n  */\n  @Event({ eventName: 'beforeheaderresize', cancelable: true })\n  beforeResize: EventEmitter<ColumnRegular[]>;\n\n  /**\n   * On header double click\n   */\n  @Event({\n    eventName: 'headerdblclick',\n  })\n  headerdblClick: EventEmitter<InitialHeaderClick>;\n  // #endregion\n\n  @Element() element!: HTMLStencilElement;\n\n  private onResize({ width }: { width?: number }, index: number) {\n    const col = this.colData[index];\n    const event = this.beforeResize.emit([\n      {\n        ...col,\n        size: width || undefined,\n      },\n    ]);\n    if (event.defaultPrevented) {\n      return;\n    }\n    this.headerresize.emit({ [index]: width || 0 });\n  }\n\n  private onResizeGroup(\n    changedX: number,\n    startIndex: number,\n    endIndex: number,\n  ) {\n    const sizes: ViewSettingSizeProp = {};\n    const cols = keyBy(this.viewportCol.get('items'), 'itemIndex');\n    const change = changedX / (endIndex - startIndex + 1);\n    for (let i = startIndex; i <= endIndex; i++) {\n      const item = cols[i];\n      if (item) {\n        sizes[i] = item.size + change;\n      }\n    }\n    this.headerresize.emit(sizes);\n  }\n\n  render() {\n    const cols = this.viewportCol.get('items');\n    const range = this.selectionStore?.get('range');\n    const cells: VNode[] = [];\n    const visibleProps: { [prop: string]: number } = {};\n\n    // render header columns\n    for (let rgCol of cols) {\n      const colData = this.colData[rgCol.itemIndex];\n      cells.push(\n        <HeaderRenderer\n          range={range}\n          column={rgCol}\n          data={{\n            ...colData,\n            index: rgCol.itemIndex,\n            providers: this.providers,\n          }}\n          canFilter={!!this.columnFilter}\n          canResize={this.canResize}\n          active={this.resizeHandler}\n          onResize={e => this.onResize(e, rgCol.itemIndex)}\n          onDoubleClick={e => this.headerdblClick.emit(e)}\n          onClick={e => this.initialHeaderClick.emit(e)}\n          additionalData={this.additionalData}\n        />,\n      );\n      visibleProps[colData?.prop] = rgCol.itemIndex;\n    }\n\n    return [\n      <div class=\"group-rgRow\">\n        <ColumnGroupsRenderer\n          canResize={this.canResize}\n          active={this.resizeHandler}\n          visibleProps={visibleProps}\n          providers={this.providers}\n          groups={this.groups}\n          dimensionCol={this.dimensionCol.state}\n          depth={this.groupingDepth}\n          onResize={(changedX, startIndex, endIndex) =>\n            this.onResizeGroup(changedX, startIndex, endIndex)\n          }\n          additionalData={this.additionalData}\n        />\n      </div>,\n      <div class={`${HEADER_ROW_CLASS} ${HEADER_ACTUAL_ROW_CLASS}`}>\n        {cells}\n      </div>,\n    ];\n  }\n\n  get providers(): Providers<DimensionCols | 'rowHeaders'> {\n    return {\n      type: this.type,\n      readonly: this.readonly,\n      data: this.colData,\n      viewport: this.viewportCol,\n      dimension: this.dimensionCol,\n      selection: this.selectionStore,\n    };\n  }\n}\n"]}

package/dist/collection/components/order/order-renderer.js

@@ -0,0 +1,50 @@
+/*!
+ * Built by Revolist OU ❤️
+ */
+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;
+//# sourceMappingURL=order-renderer.js.map

package/dist/collection/components/order/order-renderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"order-renderer.js","sourceRoot":"","sources":["../../../src/components/order/order-renderer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAS,MAAM,eAAe,CAAC;AAMzC;;GAEG;AACH,MAAM,OAAO,cAAc;IAA3B;QACU,YAAO,GAAG,CAAC,CAAC;IAoCtB,CAAC;IA9BC,KAAK,CAAC,MAAmB,EAAE,EAAE,GAAG,EAAE,IAAI,EAAE,KAAK,EAA0D;;QACrG,MAAM,EAAE,GAAG,EAAE,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;QAC/C,IAAI,CAAC,OAAO,GAAG,GAAG,CAAC;QACnB,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,IAAI,CAAC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;QAC7B,CAAC;QACD,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACf,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC;QACzC,MAAA,IAAI,CAAC,EAAE,0CAAE,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;IACtC,CAAC;IACD,GAAG;;QACD,MAAA,IAAI,CAAC,EAAE,0CAAE,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;IACnC,CAAC;IACD,IAAI,CAAC,GAAiB;QACpB,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,GAAG,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC;IAC3C,CAAC;IACD,OAAO,CAAC,EAAE,CAAC,EAAE,CAAC,EAAQ;QACpB,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC;YACpB,OAAO;QACT,CAAC;QACD,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,GAAG,GAAG,CAAC,IAAI,CAAC;QACrC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,GAAG,GAAG,CAAC,IAAI,CAAC;IACtC,CAAC;IAEO,WAAW,CAAC,CAAS;QAC3B,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YAChB,OAAO;QACT,CAAC;QACD,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,SAAS,GAAG,cAAc,CAAC,KAAK,CAAC;IACpD,CAAC;CACF;AAED,MAAM,aAAa,GAAG,CAAC,EAAE,GAAG,EAAS,EAAW,EAAE;IAChD,MAAM,OAAO,GAAG,IAAI,cAAc,EAAE,CAAC;IACrC,GAAG,CAAC,OAAO,CAAC,CAAC;IACb,OAAO,CACL,WAAK,KAAK,EAAC,0BAA0B,EAAC,GAAG,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAC;QAC9D,WAAK,KAAK,EAAC,WAAW,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,SAAS,GAAG,EAAE,CAAC;YACxD,YAAM,KAAK,EAAC,eAAe,GAAG;YAC9B,YAAM,GAAG,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,IAAI,GAAG,CAAC,CAAC,GAAI,CAClC;QACN,WAAK,KAAK,EAAC,eAAe,EAAC,GAAG,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,KAAK,GAAG,CAAC,CAAC,GAAI,CACxD,CACP,CAAC;AACJ,CAAC,CAAC;AACF,eAAe,aAAa,CAAC","sourcesContent":["import { h, VNode } from '@stencil/core';\nimport { PositionItem } from '../../types/interfaces';\nimport { Cell } from '../../types/selection';\n\ntype Props = { ref: { (e: OrdererService): void } };\n\n/**\n * Draw drag\n */\nexport class OrdererService {\n  private parentY = 0;\n  el!: HTMLElement;\n  rgRow!: HTMLElement;\n  text!: HTMLElement;\n  draggable!: HTMLElement;\n\n  start(parent: HTMLElement, { pos, text, event }: { pos: PositionItem; text: string; event: MouseEvent }) {\n    const { top } = parent.getBoundingClientRect();\n    this.parentY = top;\n    if (this.text) {\n      this.text.innerText = text;\n    }\n    this.move(pos);\n    this.moveTip({ x: event.x, y: event.y });\n    this.el?.classList.remove('hidden');\n  }\n  end() {\n    this.el?.classList.add('hidden');\n  }\n  move(pos: PositionItem) {\n    this.moveElement(pos.end - this.parentY);\n  }\n  moveTip({ x, y }: Cell) {\n    if (!this.draggable) {\n      return;\n    }\n    this.draggable.style.left = `${x}px`;\n    this.draggable.style.top = `${y}px`;\n  }\n\n  private moveElement(y: number) {\n    if (!this.rgRow) {\n      return;\n    }\n    this.rgRow.style.transform = `translateY(${y}px)`;\n  }\n}\n\nconst OrderRenderer = ({ ref }: Props): VNode[] => {\n  const service = new OrdererService();\n  ref(service);\n  return (\n    <div class=\"draggable-wrapper hidden\" ref={e => (service.el = e)}>\n      <div class=\"draggable\" ref={el => (service.draggable = el)}>\n        <span class=\"revo-alt-icon\" />\n        <span ref={e => (service.text = e)} />\n      </div>\n      <div class=\"drag-position\" ref={e => (service.rgRow = e)} />\n    </div>\n  );\n};\nexport default OrderRenderer;\n"]}

package/dist/collection/components/order/order-row.service.js

@@ -0,0 +1,72 @@
+/*!
+ * Built by Revolist OU ❤️
+ */
+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 };
+    }
+}
+//# sourceMappingURL=order-row.service.js.map

package/dist/collection/components/order/order-row.service.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"order-row.service.js","sourceRoot":"","sources":["../../../src/components/order/order-row.service.ts"],"names":[],"mappings":"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","sourcesContent":["import { getItemByPosition } from '../../store/dimension/dimension.helpers';\nimport { DimensionSettingsState, PositionItem } from '../..';\nimport { Cell } from '../..';\n\ntype EventData = { el: HTMLElement; rows: DimensionSettingsState; cols: DimensionSettingsState };\ninterface Config {\n  positionChanged(from: number, to: number): void;\n}\n\nexport default class RowOrderService {\n  private currentCell: Cell | null = null;\n  private previousRow: number | null = null;\n\n  constructor(private config: Config) {}\n\n  /** Drag finished, calculate and apply changes */\n  endOrder(e: MouseEvent, data: EventData) {\n    if (this.currentCell === null) {\n      return;\n    }\n    const newRow = this.getCell(e, data);\n\n    // if position changed\n    if (newRow.y !== this.currentCell.y) {\n      // rgRow dragged out table\n      if (newRow.y < 0) {\n        newRow.y = 0;\n      }\n      // rgRow dragged to the top\n      else if (newRow.y < this.currentCell.y) {\n        newRow.y++;\n      }\n      this.config.positionChanged(this.currentCell.y, newRow.y);\n    }\n    this.clear();\n  }\n\n  /** Drag started, reserve initial cell for farther use */\n  startOrder(e: MouseEvent, data: EventData): Cell {\n    this.currentCell = this.getCell(e, data);\n    return this.currentCell;\n  }\n\n  move(y: number, data: EventData): PositionItem | null {\n    const rgRow = this.getRow(y, data);\n    // if rgRow same as previous or below range (-1 = 0) do nothing\n    if (this.previousRow === rgRow.itemIndex || rgRow.itemIndex < -1) {\n      return null;\n    }\n    this.previousRow = rgRow.itemIndex;\n    return rgRow;\n  }\n\n  /** Drag stopped, probably cursor outside of document area */\n  clear() {\n    this.currentCell = null;\n    this.previousRow = null;\n  }\n\n  /** Calculate cell based on x, y position */\n  getRow(y: number, { el, rows }: EventData): PositionItem {\n    const { top } = el.getBoundingClientRect();\n    const topRelative = y - top;\n    const rgRow = getItemByPosition(rows, topRelative);\n    const absolutePosition = {\n      itemIndex: rgRow.itemIndex,\n      start: rgRow.start + top,\n      end: rgRow.end + top,\n    };\n    return absolutePosition;\n  }\n\n  /** Calculate cell based on x, y position */\n  getCell({ x, y }: Cell, { el, rows, cols }: EventData): Cell {\n    const { top, left } = el.getBoundingClientRect();\n    const topRelative = y - top;\n    const leftRelative = x - left;\n    const rgRow = getItemByPosition(rows, topRelative);\n    const rgCol = getItemByPosition(cols, leftRelative);\n    return { x: rgCol.itemIndex, y: rgRow.itemIndex };\n  }\n}\n"]}