realgrid-react/dist/index.es.js

RealGrid2 wrapping Component for React

var f = Object.defineProperty;
var C = (n, r, t) => r in n ? f(n, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[r] = t;
var o = (n, r, t) => (C(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 s in t) {
    if (s === "children")
      continue;
    const e = t[s];
    e === null ? n[s] = null : e === void 0 ? delete n[s] : Array.isArray(e) ? n[s] = [...e] : typeof e == "object" ? e instanceof Date ? n[s] = new Date(e) : n[s] = m(n[s] == null ? {} : n[s], e) : n[s] = e;
  }
}), n), c = (n, r = {}, t = {}) => {
  n = n || {};
  const s = ["children", "rows", "$grid"];
  for (const [e, i] of Object.entries(r))
    if (!s.includes(e))
      if (!t.hasOwnProperty(e))
        n[e] = null;
      else if (Array.isArray(i))
        (!t[e] || JSON.stringify(i) != JSON.stringify(t[e])) && (n[e] = t[e]);
      else if (i instanceof Object && !(i instanceof Date || Array.isArray(i) || typeof i == "function"))
        if (!(t[e] instanceof Object))
          n[e] = t[e];
        else {
          const d = c({}, i, t[e]);
          Object.keys(d).length && (n[e] = d);
        }
      else
        typeof i == "function" ? i.toString() !== t[e].toString() && (n[e] = t[e]) : i !== t[e] && (n[e] = t[e]);
  for (const [e, i] of Object.entries(t))
    s.includes(e) || r.hasOwnProperty(e) || (n[e] = i);
  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, s, e) {
    for (let i in e)
      i && typeof i == "string" && i.startsWith("on") && (t.hasOwnProperty(i) && (t[i] = e[i]), s.hasOwnProperty(i) && (s[i] = e[i]), i === "onDataRowInserting" && (s.onRowInserting = e[i]));
  }
  $_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 s = this._mountCBs.shift();
            s == null || s.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, s) {
    this._mountCBs.push(t), clearTimeout(this._mountTimer), this._columnsChanged = s === "column", this._mountTimer = setTimeout(() => {
      this.$_executeCallback();
    }, 20);
  }
  removeCallback(t) {
    if (this._mountCBs) {
      const s = this._mountCBs.indexOf(t);
      s >= 0 && this._mountCBs.splice(s, 1);
    }
  }
  componentDidMount() {
    const { grid: t, dataProvider: s, props: e } = this.createObject();
    if (this._gridView = t, this._dataProvider = s, this.$_executeCallback(), this.$_connectEvents(t, s, e), t.setOptions(e.gridProps || {}), s.setOptions(e.dataProps || {}), e.rowStyleCallback && t.setRowStyleCallback(e.rowStyleCallback), e.cellStyleCallback && t.setCellStyleCallback(e.cellStyleCallback), e.layout && t.setColumnLayout(e.layout), e.onInitialized) {
      const i = e.onInitialized.constructor.name;
      i === "Function" ? e.onInitialized(t) : i === "AsyncFunction" && Promise.resolve(e.onInitialized(t));
    }
  }
  componentWillUnmount() {
    this.beforeDestroy(), this._gridView = this._gridView && this._gridView.destroy(), this._dataProvider = this._dataProvider && this._dataProvider.destroy();
  }
  componentDidUpdate(t, s, e) {
    this.$_executeCallback();
    const i = this.getProps(this.props) || {}, d = this.gridView, h = this.dataProvider;
    this.$_connectEvents(d, h, i);
    let l = c({}, t.dataProps, i.dataProps);
    h.setOptions(l), l = c({}, t.gridProps, i.gridProps), d.setOptions(l), l = c([], t.layout || [], i.layout || []), l && l.length > 0 && d.setColumnLayout(i.layout);
  }
  render() {
    const t = {};
    t.$grid = this;
    let s = 0;
    const e = p.Children.map(this.props.children, (i) => (i && i.type.CType === "$$RGColumn$$" ? t.displayIndex = i.props.displayIndex ?? s++ : delete t.displayIndex, i && p.cloneElement(i, t)));
    return p.createElement("div", { style: { width: "100%", height: "100%" }, ref: (i) => this.gridContainer = i }, e);
  }
}
class D extends w {
  constructor() {
    super(...arguments);
    o(this, "createObject", () => {
      var i;
      const t = m({}, this.getProps(this.props)), s = new u.GridView(this.gridContainer, t.accessibility, t.waiOptions), e = new u.LocalDataProvider((i = t.dataProps) == null ? void 0 : i.undoable);
      return s.setDataSource(e), {
        grid: s,
        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 s;
    super.componentDidMount();
    const t = this.props.rows;
    t && Array.isArray(t) && t.length > 0 && ((s = this.dataProvider) == null || s.setRows(t));
  }
  componentDidUpdate(t, s, e) {
    super.componentDidUpdate(t, s, e), t.rows != this.props.rows && this.dataProvider.setRows(this.props.rows);
  }
}
class P extends w {
  constructor() {
    super(...arguments);
    o(this, "createObject", () => {
      var i;
      const t = m({}, this.getProps(this.props)), s = new u.TreeView(this.gridContainer), e = new u.LocalTreeDataProvider((i = t.dataProps) == null ? void 0 : i.undoable);
      return s.setTreeOptions(t.treeOptions || {}), s.setDataSource(e), {
        grid: s,
        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 s, e;
    super.componentDidMount();
    const t = this.props.rows;
    Array.isArray(t) ? (s = this.dataProvider) == null || s.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, s, e) {
    var d, h;
    const i = this.props.rows;
    (this.props.treeField || this.props.rowsProp) && t.rows !== i && (Array.isArray(i) ? (d = this.dataProvider) == null || d.setRows(i, 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, s, 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, s, e) {
    let i = c({}, this.props, t);
    !(Object.keys(i).length === 0) && this.$model && this.$model.assignFrom && this.$model.assignFrom(i), this._doUpdate();
  }
  render() {
    return p.createElement(p.Fragment);
  }
}
class g 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, s, e) {
    if (super.componentDidUpdate(t, s, e), t.width !== this.props.width) {
      const i = this.$model.layout;
      i && (i.cellWidth = this.props.width);
    }
  }
}
o(g, "CType", "$$RGColumn$$");
class V 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 v 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 R 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 b 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 F 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 U 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, s = t == null ? void 0 : t.getDataSource();
      s && !s.fieldByName(this.props.fieldName) && (this._field = s.addField(this.props));
    });
    o(this, "unMountCB", () => {
      if (this._field) {
        const t = this.$parent.gridView, s = t == null ? void 0 : t.getDataSource();
        s && s.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, s = this.$parent.props.autoGenerateField, e = t == null ? void 0 : t.getDataSource();
      let i = this.props.fieldName;
      s && (!i && this.props.field && (i = this.props.field.fieldName), e && !e.fieldByName(i) && e.addField(this.props.field || i)), t && (this._column = this.$model = t.addColumn({ ...this.props, fieldName: i }, this.props.displayIndex ?? -1));
    });
    o(this, "unMountCB", () => {
      const t = this.$parent.gridView;
      if (this._column && t && !t._view.disposing) {
        let s = this._column.fieldName;
        t.removeColumn(this._column.name);
        const e = this.$parent.props.autoGenerateField, i = t == null ? void 0 : t.getDataSource();
        e && s && i && (t.columnByField(s) || i.removeField(s));
      }
    });
  }
  componentDidMount() {
    this._type = "column", super.componentDidMount();
  }
  componentWillUnmount() {
    super.componentWillUnmount();
  }
  componentDidUpdate(t, s, e) {
    if (super.componentDidUpdate(t, s, e), t.width !== this.props.width) {
      const i = this.$model.layout;
      i && (i.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, s, e) {
    if (super.componentDidUpdate(t, s, e), t.width !== this.props.width) {
      const i = this.$model.layout;
      i && (i.cellWidth = this.props.width);
    }
  }
}
o($, "CType", "$$RGColumn$$");
export {
  O as RGCheckBar,
  y as RGDataColumn,
  G as RGDataField,
  U as RGFilterPanel,
  S as RGFooter,
  F as RGFooters,
  M as RGGroupPanel,
  x as RGHeader,
  R as RGHeaderSummaries,
  b as RGHeaderSummary,
  $ as RGLiteralColumn,
  v as RGRowIndicator,
  g as RGSeriesColumn,
  V as RGStateBar,
  D as RealGridReact,
  P as RealTreeReact
};