realgrid-react/dist/index.es.js

RealGrid2 wrapping Component for React

var C = Object.defineProperty;
var g = (n, r, t) => r in n ? C(n, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[r] = t;
var o = (n, r, t) => (g(n, typeof r != "symbol" ? r + "" : r, t), t);
import p from "react";
import * as u from "realgrid";
const m = (n, ...r) => (r.forEach((t) => {
  for (const i in t) {
    if (i === "children")
      continue;
    const e = t[i];
    e === null ? n[i] = null : e === void 0 ? delete n[i] : Array.isArray(e) ? n[i] = [...e] : typeof e == "object" ? e instanceof Date ? n[i] = new Date(e) : n[i] = m(n[i] == null ? {} : n[i], e) : n[i] = e;
  }
}), n), c = (n, r = {}, t = {}) => {
  n = n || {};
  const i = ["children", "rows", "$grid"];
  for (const [e, s] of Object.entries(r))
    if (!i.includes(e))
      if (!t.hasOwnProperty(e))
        n[e] = null;
      else if (Array.isArray(s))
        (!t[e] || JSON.stringify(s) != JSON.stringify(t[e])) && (n[e] = t[e]);
      else if (s instanceof Object && !(s instanceof Date || Array.isArray(s) || typeof s == "function"))
        if (!(t[e] instanceof Object))
          n[e] = t[e];
        else {
          const d = c({}, s, t[e]);
          Object.keys(d).length && (n[e] = d);
        }
      else
        typeof s == "function" ? s.toString() !== t[e].toString() && (n[e] = t[e]) : s !== t[e] && (n[e] = t[e]);
  for (const [e, s] of Object.entries(t))
    i.includes(e) || r.hasOwnProperty(e) || (n[e] = s);
  return n;
};
class w extends p.Component {
  constructor(t) {
    super(t);
    // property field
    o(this, "_gridView", null);
    o(this, "_dataProvider", null);
    // field
    o(this, "_mountCBs", []);
    o(this, "_mountTimer");
    o(this, "_columnsChanged");
    o(this, "gridContainer");
    this.gridContainer = p.createRef();
  }
  getProps(t) {
    return t || {};
  }
  // private methods
  $_connectEvents(t, i, e) {
    for (let s in e)
      s && typeof s == "string" && s.startsWith("on") && (t.hasOwnProperty(s) && (t[s] = e[s]), i.hasOwnProperty(s) && (i[s] = e[s]), s === "onDataRowInserting" && (i.onRowInserting = e[s]));
  }
  $_executeCallback() {
    var t;
    if (this.gridView && (clearTimeout(this._mountTimer), !(!this._mountCBs || !this._mountCBs.length))) {
      this.gridView.beginUpdate();
      try {
        this.dataProvider.beginUpdate();
        try {
          for (; this._mountCBs && this._mountCBs.length; ) {
            const i = this._mountCBs.shift();
            i == null || i.call(this);
          }
        } finally {
          this.dataProvider.endUpdate();
        }
      } finally {
        this._columnsChanged && this.props.onRGDataColumnsChanged && ((t = this.props) == null || t.onRGDataColumnsChanged(this.gridView), this._columnsChanged = !1), this.gridView.endUpdate(!0), this._mountTimer = null, this._mountCBs = [];
      }
    }
  }
  // public Method
  addCallback(t, i) {
    this._mountCBs.push(t), clearTimeout(this._mountTimer), this._columnsChanged = i === "column", this._mountTimer = setTimeout(() => {
      this.$_executeCallback();
    }, 20);
  }
  removeCallback(t) {
    if (this._mountCBs) {
      const i = this._mountCBs.indexOf(t);
      i >= 0 && this._mountCBs.splice(i, 1);
    }
  }
  componentDidMount() {
    const { grid: t, dataProvider: i, props: e } = this.createObject();
    this._gridView = t, this._dataProvider = i, this.$_executeCallback(), this.$_connectEvents(t, i, e), t.setOptions(e.gridProps || {}), i.setOptions(e.dataProps || {}), e.rowStyleCallback && t.setRowStyleCallback(e.rowStyleCallback), e.cellStyleCallback && t.setCellStyleCallback(e.cellStyleCallback), e.layout && t.setColumnLayout(e.layout);
  }
  componentWillUnmount() {
    this.beforeDestroy(), this._gridView = this._gridView && this._gridView.destroy(), this._dataProvider = this._dataProvider && this._dataProvider.destroy();
  }
  componentDidUpdate(t, i, e) {
    this.$_executeCallback();
    const s = this.getProps(this.props) || {}, d = this.gridView, h = this.dataProvider;
    this.$_connectEvents(d, h, s);
    let l = c({}, t.dataProps, s.dataProps);
    h.setOptions(l), l = c({}, t.gridProps, s.gridProps), d.setOptions(l), l = c([], t.layout || [], s.layout || []), l && l.length > 0 && d.setColumnLayout(s.layout);
  }
  render() {
    const t = {};
    t.$grid = this;
    let i = 0;
    const e = p.Children.map(this.props.children, (s) => (s && s.type.CType === "$$RGColumn$$" ? t.displayIndex = s.props.displayIndex ?? i++ : delete t.displayIndex, s && p.cloneElement(s, t)));
    return p.createElement("div", { style: { width: "100%", height: "100%" }, ref: (s) => this.gridContainer = s }, e);
  }
}
class D extends w {
  constructor() {
    super(...arguments);
    o(this, "createObject", () => {
      var s;
      const t = m({}, this.getProps(this.props)), i = new u.GridView(this.gridContainer, t.accessibility, t.waiOptions), e = new u.LocalDataProvider((s = t.dataProps) == null ? void 0 : s.undoable);
      return i.setDataSource(e), {
        grid: i,
        dataProvider: e,
        props: t
      };
    });
    o(this, "beforeDestroy", () => {
      const t = m({}, this.getProps(this.props));
      return t.onDestroy && t.onDestroy.call(this, this.gridView), { props: t };
    });
  }
  get gridView() {
    return this._gridView;
  }
  get dataProvider() {
    return this._dataProvider;
  }
  componentDidMount() {
    var i;
    super.componentDidMount();
    const t = this.props.rows;
    t && Array.isArray(t) && t.length > 0 && ((i = this.dataProvider) == null || i.setRows(t));
  }
  componentDidUpdate(t, i, e) {
    super.componentDidUpdate(t, i, e), t.rows != this.props.rows && this.dataProvider.setRows(this.props.rows);
  }
}
class V extends w {
  constructor() {
    super(...arguments);
    o(this, "createObject", () => {
      var s;
      const t = m({}, this.getProps(this.props)), i = new u.TreeView(this.gridContainer), e = new u.LocalTreeDataProvider((s = t.dataProps) == null ? void 0 : s.undoable);
      return i.setTreeOptions(t.treeOptions || {}), i.setDataSource(e), {
        grid: i,
        dataProvider: e,
        props: t
      };
    });
    o(this, "beforeDestroy", () => {
      const t = m({}, this.getProps(this.props));
      return t.onDestroy && t.onDestroy.call(this, this.gridView), { props: t };
    });
  }
  get gridView() {
    return this._gridView;
  }
  get dataProvider() {
    return this._dataProvider;
  }
  componentDidMount() {
    var i, e;
    super.componentDidMount();
    const t = this.props.rows;
    Array.isArray(t) ? (i = this.dataProvider) == null || i.setRows(t, this.props.treeField, this.props.needSorting, this.props.childrenField, this.props.iconField) : (e = this.dataProvider) == null || e.setObjectRows(this.props.json, this.props.rowsProp, this.props.childrenProp, this.props.iconProp);
  }
  componentDidUpdate(t, i, e) {
    var d, h;
    const s = this.props.rows;
    (this.props.treeField || this.props.rowsProp) && t.rows !== s && (Array.isArray(s) ? (d = this.dataProvider) == null || d.setRows(s, this.props.treeField, this.props.needSorting, this.props.childrenField, this.props.iconField) : (h = this.dataProvider) == null || h.setObjectRows(this.props.json, this.props.rowsProp, this.props.childrenProp, this.props.iconProp)), super.componentDidUpdate(t, i, e);
  }
}
class a extends p.Component {
  // 실제로 어떤 모델 또는 객체를 참조하는지.
  constructor(t) {
    super(t);
    o(this, "$parent");
    o(this, "$model");
    o(this, "_type");
    this.$parent = t.$grid;
  }
  _doUpdate() {
  }
  componentDidMount() {
    const t = this.$parent;
    t && t.addCallback(this.mountCB, this._type);
  }
  componentWillUnmount() {
    const t = this.$parent;
    t && (t.removeCallback(this.mountCB), this.unMountCB()), this.$model = null;
  }
  componentDidUpdate(t, i, e) {
    let s = c({}, this.props, t);
    !(Object.keys(s).length === 0) && this.$model && this.$model.assignFrom && this.$model.assignFrom(s), this._doUpdate();
  }
  render() {
    return p.createElement(p.Fragment);
  }
}
class f extends a {
  constructor() {
    super(...arguments);
    o(this, "_column");
    o(this, "mountCB", () => {
      const t = this.$parent.gridView;
      t && (this._column = this.$model = t.addColumn({ ...this.props, type: "series" }, this.props.displayIndex ?? -1));
    });
    o(this, "unMountCB", () => {
      const t = this.$parent.gridView;
      this._column && t && !t._view.disposing && t.removeColumn(this._column.name);
    });
  }
  componentDidMount() {
    super.componentDidMount();
  }
  componentWillUnmount() {
    super.componentWillUnmount();
  }
  componentDidUpdate(t, i, e) {
    if (super.componentDidUpdate(t, i, e), t.width !== this.props.width) {
      const s = this.$model.layout;
      s && (s.cellWidth = this.props.width);
    }
  }
}
o(f, "CType", "$$RGColumn$$");
class P extends a {
  constructor() {
    super(...arguments);
    o(this, "mountCB", () => {
      var t;
      (t = this.$parent.gridView) == null || t.setStateBar({ ...this.props }), this.$model = this.$parent.gridView.stateBar;
    });
    o(this, "unMountCB", () => {
      var t;
      (t = this.$parent.gridView) == null || t.setStateBar({});
    });
  }
}
class R extends a {
  constructor() {
    super(...arguments);
    o(this, "mountCB", () => {
      var t;
      (t = this.$parent.gridView) == null || t.setRowIndicator({ ...this.props }), this.$model = this.$parent.gridView.rowIndicator;
    });
    o(this, "unMountCB", () => {
    });
  }
}
class b extends a {
  constructor() {
    super(...arguments);
    o(this, "mountCB", () => {
      var t;
      (t = this.$parent.gridView) == null || t.setHeaderSummaries({ ...this.props }), this.$model = this.$parent.gridView.headerSummaries;
    });
    o(this, "unMountCB", () => {
    });
  }
  componentDidMount() {
    super.componentDidMount();
  }
  componentWillUnmount() {
    super.componentWillUnmount();
  }
}
class v extends a {
  constructor() {
    super(...arguments);
    o(this, "mountCB", () => {
      var t;
      (t = this.$parent.gridView) == null || t.setHeaderSummary({ ...this.props }), this.$model = this.$parent.gridView.headerSummary;
    });
    o(this, "unMountCB", () => {
    });
  }
}
class x extends a {
  constructor() {
    super(...arguments);
    o(this, "mountCB", () => {
      var t;
      (t = this.$parent.gridView) == null || t.setHeader({ ...this.props }), this.$model = this.$parent.gridView.header;
    });
    o(this, "unMountCB", () => {
    });
  }
}
class M extends a {
  constructor() {
    super(...arguments);
    o(this, "mountCB", () => {
      var t;
      this.$parent.gridView instanceof u.GridView && ((t = this.$parent.gridView) == null || t.setGroupPanel({ visible: !0, ...this.props }), this.$model = this.$parent.gridView.groupPanel);
    });
    o(this, "unMountCB", () => {
    });
  }
}
class S extends a {
  constructor() {
    super(...arguments);
    o(this, "mountCB", () => {
      var t;
      (t = this.$parent.gridView) == null || t.setFooter({ ...this.props }), this.$model = this.$parent.gridView.footer;
    });
    o(this, "unMountCB", () => {
    });
  }
}
class U extends a {
  constructor() {
    super(...arguments);
    o(this, "mountCB", () => {
      var t;
      (t = this.$parent.gridView) == null || t.setFooters({ ...this.props }), this.$model = this.$parent.gridView.footers;
    });
    o(this, "unMountCB", () => {
    });
  }
}
class F extends a {
  constructor() {
    super(...arguments);
    o(this, "mountCB", () => {
      var t;
      (t = this.$parent.gridView) == null || t.setFilterPanel({ ...this.props }), this.$model = this.$parent.gridView.filterPanel;
    });
    o(this, "unMountCB", () => {
    });
  }
}
class G extends a {
  constructor() {
    super(...arguments);
    o(this, "_field");
    o(this, "mountCB", () => {
      const t = this.$parent.gridView, i = t == null ? void 0 : t.getDataSource();
      i && !i.fieldByName(this.props.fieldName) && (this._field = i.addField(this.props));
    });
    o(this, "unMountCB", () => {
      if (this._field) {
        const t = this.$parent.gridView, i = t == null ? void 0 : t.getDataSource();
        i && i.removeField(this._field.fieldName);
      }
    });
  }
}
class y extends a {
  constructor() {
    super(...arguments);
    o(this, "fieldName");
    o(this, "mounted");
    o(this, "_column");
    o(this, "mountCB", () => {
      const t = this.$parent.gridView, i = this.$parent.props.autoGenerateField, e = t == null ? void 0 : t.getDataSource();
      let s = this.props.fieldName;
      i && (!s && this.props.field && (s = this.props.field.fieldName), e && !e.fieldByName(s) && e.addField(this.props.field || s)), t && (this._column = this.$model = t.addColumn({ ...this.props, fieldName: s }, this.props.displayIndex ?? -1));
    });
    o(this, "unMountCB", () => {
      const t = this.$parent.gridView;
      if (this._column && t && !t._view.disposing) {
        let i = this._column.fieldName;
        t.removeColumn(this._column.name);
        const e = this.$parent.props.autoGenerateField, s = t == null ? void 0 : t.getDataSource();
        e && i && s && (t.columnByField(i) || s.removeField(i));
      }
    });
  }
  componentDidMount() {
    this._type = "column", super.componentDidMount();
  }
  componentWillUnmount() {
    super.componentWillUnmount();
  }
  componentDidUpdate(t, i, e) {
    if (super.componentDidUpdate(t, i, e), t.width !== this.props.width) {
      const s = this.$model.layout;
      s && (s.cellWidth = this.props.width);
    }
  }
}
o(y, "CType", "$$RGColumn$$");
class O extends a {
  constructor() {
    super(...arguments);
    o(this, "mountCB", () => {
      var t;
      (t = this.$parent.gridView) == null || t.setCheckBar({ ...this.props }), this.$model = this.$parent.gridView.checkBar;
    });
    o(this, "unMountCB", () => {
    });
  }
}
class $ extends a {
  constructor() {
    super(...arguments);
    o(this, "_column");
    o(this, "mountCB", () => {
      const t = this.$parent.gridView;
      t && (this._column = this.$model = t.addColumn({ ...this.props, type: "literal" }, this.props.displayIndex ?? -1));
    });
    o(this, "unMountCB", () => {
      const t = this.$parent.gridView;
      this._column && t && !t._view.disposing && t.removeColumn(this._column.name);
    });
  }
  componentDidMount() {
    super.componentDidMount();
  }
  componentWillUnmount() {
    super.componentWillUnmount();
  }
  componentDidUpdate(t, i, e) {
    if (super.componentDidUpdate(t, i, e), t.width !== this.props.width) {
      const s = this.$model.layout;
      s && (s.cellWidth = this.props.width);
    }
  }
}
o($, "CType", "$$RGColumn$$");
export {
  O as RGCheckBar,
  y as RGDataColumn,
  G as RGDataField,
  F as RGFilterPanel,
  S as RGFooter,
  U as RGFooters,
  M as RGGroupPanel,
  x as RGHeader,
  b as RGHeaderSummaries,
  v as RGHeaderSummary,
  $ as RGLiteralColumn,
  R as RGRowIndicator,
  f as RGSeriesColumn,
  P as RGStateBar,
  D as RealGridReact,
  V as RealTreeReact
};