@hi-ui/schema-editable-table 4.0.0-experimental.1

package/lib/cjs/cell/index.js

@@ -0,0 +1,204 @@
+/** @LICENSE
+ * @hi-ui/schema-editable-table
+ * https://github.com/XiaoMi/hiui/tree/master/packages/schema/schema-editable-table#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var tslib = require('tslib');
+var React = require('react');
+var lodashEs = require('lodash-es');
+var schemaFields = require('@hi-ui/schema-fields');
+var useSubscription = require('@hi-ui/use-subscription');
+var _const = require('../const.js');
+var ctx = require('../ctx.js');
+var hooks = require('../features/row-edit/hooks.js');
+require('@hi-ui/button');
+var editing = require('./editing.js');
+var dependency = require('./dependency.js');
+require('@hi-ui/ellipsis-tooltip');
+require('../utils/cls.js');
+require('@tanstack/react-table');
+require('@hi-ui/schema-utils');
+require('@hi-ui/schema-table-extensions');
+require('@hi-ui/tag');
+function _interopDefaultCompat(e) {
+  return e && _typeof(e) === 'object' && 'default' in e ? e : {
+    'default': e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var EditableCell = /*#__PURE__*/React__default["default"].memo(function EditableCellCore(props) {
+  var _a, _b;
+  var field = (_a = props.column.columnDef.meta) === null || _a === void 0 ? void 0 : _a.field;
+  var formBinding = editing.useEditingCellFormBinding(props);
+  var _useEditableSchemaTab = ctx.useEditableSchemaTableCtx(),
+    tableValue = _useEditableSchemaTab.subscription,
+    globalStaticRef = _useEditableSchemaTab.globalStaticRef;
+  var enableRowEdit = globalStaticRef.current.enableRowEdit;
+  var rowIndex = props.row.index;
+  var dataKey = props.column.id;
+  var rowData = tableValue.getValue()[rowIndex];
+  var fieldDeps = (((_b = field === null || field === void 0 ? void 0 : field.dependency) === null || _b === void 0 ? void 0 : _b.deps) || []).map(function (dep) {
+    return [rowIndex, dep];
+  });
+  var _c = useSubscription.useSubscribeList(tableValue, [[rowIndex, dataKey]].concat(fieldDeps), {
+      // 此处单元格全部可编辑，全部创建监听
+      skipSubscribe: false,
+      // 行编辑模式下，从 draft 中获取值
+      getFieldValueFromDraft: enableRowEdit
+    }),
+    fieldValue = _c.fieldValue,
+    changedDepValues = _c.changedDepValues,
+    rest = tslib.__rest(_c, ["fieldValue", "changedDepValues"]);
+  if (!field) return null;
+  formBinding.value = fieldValue;
+  var nextField = Object.assign(Object.assign({}, field), {
+    payload: Object.assign(Object.assign({}, field.payload), {
+      setSelectedRawOption: function setSelectedRawOption(values) {
+        var _a;
+        if (enableRowEdit) {
+          var _Object$assign, _rowIndex, _tableValue$mergeDraf;
+          // 行编辑模式：需要获取最新的 draft 数据
+          var draftRowData = ((_a = tableValue.getDraft()) === null || _a === void 0 ? void 0 : _a[rowIndex]) || {};
+          var currentData = draftRowData[_const.SELECTED_OPTION_RAW] || {};
+          var updatedData = Object.assign(Object.assign({}, currentData), (_Object$assign = {}, _Object$assign[dataKey] = values, _Object$assign));
+          tableValue.mergeDraft((_tableValue$mergeDraf = {}, _tableValue$mergeDraf[rowIndex] = (_rowIndex = {}, _rowIndex[_const.SELECTED_OPTION_RAW] = updatedData, _rowIndex), _tableValue$mergeDraf));
+        } else {
+          var _Object$assign2, _rowIndex2, _tableValue$mergeSile;
+          // 普通模式：从当前 rowData 获取数据
+          var _currentData = rowData[_const.SELECTED_OPTION_RAW] || {};
+          var _updatedData = Object.assign(Object.assign({}, _currentData), (_Object$assign2 = {}, _Object$assign2[dataKey] = values, _Object$assign2));
+          tableValue.mergeSilently((_tableValue$mergeSile = {}, _tableValue$mergeSile[rowIndex] = (_rowIndex2 = {}, _rowIndex2[_const.SELECTED_OPTION_RAW] = _updatedData, _rowIndex2), _tableValue$mergeSile));
+        }
+      }
+    })
+  });
+  var fieldProps = {
+    value: fieldValue,
+    field: nextField,
+    FieldClass: props.FieldClass,
+    ctx: {
+      field: nextField,
+      rowData: rowData,
+      rawData: rowData,
+      formBinding: formBinding,
+      rowIndex: rowIndex,
+      dataKey: dataKey,
+      formRef: {
+        current: null
+      } // TODO 待补充实现
+    },
+
+    // 行编辑模式下，失焦时保持激活状态
+    keepActiveOnBlur: enableRowEdit,
+    defaultActive: props.defaultActive
+  };
+  dependency.execCellDepsProcess({
+    fieldProps: fieldProps,
+    rowData: rowData,
+    rowIndex: rowIndex,
+    dataKey: dataKey,
+    changedDepValues: changedDepValues,
+    changedFieldNames: rest.changedFieldNames,
+    tableValue: tableValue
+  });
+  return /*#__PURE__*/React__default["default"].createElement(schemaFields.EditableCase, Object.assign({}, fieldProps));
+}, function (prev, next) {
+  var _a;
+  // 如果 column 配置要求总是更新，则返回 false 触发重渲染
+  if ((_a = prev.column.columnDef.meta) === null || _a === void 0 ? void 0 : _a.shouldUpdate) return false;
+  // 如果 defaultActive 为 true，则直接重渲染
+  // TODO 此处仍有BUG，会在行交换时触发
+  // 暂时记录，待后续优化
+  if (prev.defaultActive) return false;
+  // NOTE Cell 暂时始终打开值比较 待补充其他case
+  // 其余时候比较关键数据是否相等
+  return lodashEs.isEqual(prev.getValue(), next.getValue());
+});
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore 关闭 displayName 检查
+EditableCell.displayName = 'EditableCell';
+var CustomCell = /*#__PURE__*/React__default["default"].memo(
+// CustomCell 中的 Custom 是指包含自定义渲染
+function CustomCellCore(props) {
+  var _a, _b, _c, _d;
+  var field = (_a = props.column.columnDef.meta) === null || _a === void 0 ? void 0 : _a.field;
+  var _useEditableSchemaTab2 = ctx.useEditableSchemaTableCtx(),
+    tableValue = _useEditableSchemaTab2.subscription,
+    propsRef = _useEditableSchemaTab2.propsRef;
+  var FieldClass = schemaFields.useMatchFieldClass({
+    name: 'TableCellWrapper',
+    field: field,
+    fieldMap: (_b = props.table.options.meta) === null || _b === void 0 ? void 0 : _b.fieldMap
+  });
+  // 行编辑状态变更时会触发组件重渲染
+  var runtimeEditable = hooks.useRuntimeRowEditable(props.row.index);
+  var selfReadonly = schemaFields.useReadonly(field, runtimeEditable);
+  var readonly = !schemaFields.runDynamicEditable(field, selfReadonly, function () {
+    return {
+      type: 'edit-table',
+      rowIndex: props.row.index,
+      rowId: props.row.id,
+      columnIndex: props.column.getIndex(),
+      columnId: props.column.id,
+      rawData: props.row.$getRealtimeRowData()
+    };
+  });
+  // 2. 只读状态使用 ReadonlyCase
+  if (readonly) {
+    var dataKey = props.column.id;
+    var rowIndex = props.row.index;
+    var rowData = tableValue.getValue()[rowIndex];
+    var value = (_d = (_c = props.table.options.meta) === null || _c === void 0 ? void 0 : _c.getCellValue(rowIndex, dataKey)) !== null && _d !== void 0 ? _d : props.getValue();
+    return /*#__PURE__*/React__default["default"].createElement(schemaFields.ReadonlyCase, {
+      usedBy: "table",
+      value: value,
+      field: field,
+      FieldClass: FieldClass,
+      ctx: {
+        field: field,
+        rowData: rowData,
+        rawData: rowData,
+        rowIndex: rowIndex,
+        dataKey: dataKey
+      }
+    });
+  }
+  // 3. 可编辑状态使用 MemoCell
+  return /*#__PURE__*/React__default["default"].createElement(EditableCell, Object.assign({}, props, {
+    FieldClass: FieldClass,
+    defaultActive: propsRef.current.defaultActive
+  }));
+});
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore 关闭 displayName 检查
+CustomCell.displayName = 'CustomCell';
+// NOTE 此处之所以要分为 DftCell -> CustomCell -> EditableCell 三层，是因为需要区分出【简单】【只读】【可编辑】的字段
+// 【简单】字段：无自定义渲染，无依赖，无表单绑定，无监听，只有最单纯的 DOM 渲染
+// 【只读】字段：有自定义渲染，无依赖，无表单绑定，无监听 // TODO 后续只读部分可能会需要支持deps
+// 【可编辑】字段：有自定义渲染，有依赖，有控制，有表单绑定，有监听
+function DftCell(props) {
+  var _a;
+  var field = (_a = props.column.columnDef.meta) === null || _a === void 0 ? void 0 : _a.field;
+  if (!field) {
+    // 此处拦截，必须有 field 配置，否则报错
+    throw new Error('DftCell: field is required');
+  }
+  // 1. 简单字段且无自定义渲染，使用 SimpleCase
+  if (schemaFields.isSimpleCase(field)) {
+    return /*#__PURE__*/React__default["default"].createElement(schemaFields.SimpleCase, {
+      value: props.getValue()
+    });
+  }
+  return /*#__PURE__*/React__default["default"].createElement(CustomCell, Object.assign({}, props));
+}
+exports["default"] = DftCell;

package/lib/cjs/const.js

@@ -0,0 +1,35 @@
+/** @LICENSE
+ * @hi-ui/schema-editable-table
+ * https://github.com/XiaoMi/hiui/tree/master/packages/schema/schema-editable-table#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+require('react');
+require('lodash-es');
+require('@tanstack/react-table');
+require('ahooks');
+var ROW_HEIGHT = 40;
+var ROW_SELECTION_COL_WIDTH = 50;
+var ROW_INDEX_COL_ID = '_row_index_';
+var ROW_OPERATION_COL_WIDTH = 160;
+function isSystemCol(id) {
+  return id === ROW_INDEX_COL_ID;
+}
+// 分组特性中用于标识空值的特殊标记
+var EMPTY_VALUE = '__EMPTY_VALUE__';
+var SELECTED_OPTION_RAW = '_selected_raw_option_';
+exports.EMPTY_VALUE = EMPTY_VALUE;
+exports.ROW_HEIGHT = ROW_HEIGHT;
+exports.ROW_INDEX_COL_ID = ROW_INDEX_COL_ID;
+exports.ROW_OPERATION_COL_WIDTH = ROW_OPERATION_COL_WIDTH;
+exports.ROW_SELECTION_COL_WIDTH = ROW_SELECTION_COL_WIDTH;
+exports.SELECTED_OPTION_RAW = SELECTED_OPTION_RAW;
+exports.isSystemCol = isSystemCol;

package/lib/cjs/container/base.js

@@ -0,0 +1,39 @@
+/** @LICENSE
+ * @hi-ui/schema-editable-table
+ * https://github.com/XiaoMi/hiui/tree/master/packages/schema/schema-editable-table#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var React = require('react');
+var ctx = require('./ctx.js');
+var colGroup = require('./col-group.js');
+function _interopDefaultCompat(e) {
+  return e && _typeof(e) === 'object' && 'default' in e ? e : {
+    'default': e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+function NonVirtualContainer(props) {
+  var headerRef = React.useRef(null);
+  var bodyRef = React.useRef(null);
+  var footerRef = React.useRef(null);
+  var colGroup$1 = /*#__PURE__*/React__default["default"].createElement(colGroup.TableColGroup, null);
+  return /*#__PURE__*/React__default["default"].createElement(ctx.TableContainerContext.Provider, {
+    value: {
+      headerRef: headerRef,
+      bodyRef: bodyRef,
+      footerRef: footerRef,
+      colGroup: colGroup$1
+    }
+  }, props.children);
+}
+exports.NonVirtualContainer = NonVirtualContainer;

package/lib/cjs/container/bottom.js

@@ -0,0 +1,86 @@
+/** @LICENSE
+ * @hi-ui/schema-editable-table
+ * https://github.com/XiaoMi/hiui/tree/master/packages/schema/schema-editable-table#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var React = require('react');
+var schemaActionTrigger = require('@hi-ui/schema-action-trigger');
+var schemaUtils = require('@hi-ui/schema-utils');
+var ctx = require('../ctx.js');
+var component = require('../features/pagination/component.js');
+require('@hi-ui/use-subscription');
+require('lodash-es');
+require('@tanstack/react-table');
+require('ahooks');
+var cls = require('../utils/cls.js');
+require('./index.js');
+require('@hi-ui/checkbox');
+require('@hi-ui/radio');
+var indicator = require('../features/row-selection/indicator.js');
+function _interopDefaultCompat(e) {
+  return e && _typeof(e) === 'object' && 'default' in e ? e : {
+    'default': e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+function BottomRender(props) {
+  var _a;
+  var tableCtx = ctx.useEditableSchemaTableCtx();
+  var propsRef = tableCtx.propsRef,
+    globalStaticRef = tableCtx.globalStaticRef;
+  var paginationEl = propsRef.current.pagination ? ( /*#__PURE__*/React__default["default"].createElement(component.Pagination, Object.assign({
+    key: "pagination"
+  }, propsRef.current.pagination))) : null;
+  var rowSelectionIndicatorEl = ((_a = propsRef.current.rowSelection) === null || _a === void 0 ? void 0 : _a.enableIndicator) ? ( /*#__PURE__*/React__default["default"].createElement(indicator.RowSelectionIndicator, {
+    key: "row-selection-indicator"
+  })) : null;
+  var builtin = {
+    rowSelectionIndicator: rowSelectionIndicatorEl,
+    pagination: paginationEl
+  };
+  var dftLeft = [rowSelectionIndicatorEl];
+  var dftRight = [paginationEl];
+  var getLeft = props.left,
+    getRight = props.right;
+  var ctx$1 = {
+    tableCtx: tableCtx,
+    builtin: builtin
+  };
+  var left = schemaUtils.getGetterValue(getLeft, dftLeft, [ctx$1]);
+  var right = schemaUtils.getGetterValue(getRight, dftRight, [ctx$1]);
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: cls.cls('bottom-container'),
+    "data-is-bottom-empty": globalStaticRef.current.isBottomEmpty
+  }, /*#__PURE__*/React__default["default"].createElement(schemaActionTrigger.Actions
+  // left
+  , {
+    // left
+    className: cls.cls('bottom-container-left'),
+    actions: left,
+    data: [],
+    ctx: {
+      tableCtx: tableCtx
+    }
+  }), /*#__PURE__*/React__default["default"].createElement(schemaActionTrigger.Actions
+  // right
+  , {
+    // right
+    className: cls.cls('bottom-container-right'),
+    actions: right,
+    data: [],
+    ctx: {
+      tableCtx: tableCtx
+    }
+  }));
+}
+exports.BottomRender = BottomRender;

package/lib/cjs/container/col-group.js

@@ -0,0 +1,98 @@
+/** @LICENSE
+ * @hi-ui/schema-editable-table
+ * https://github.com/XiaoMi/hiui/tree/master/packages/schema/schema-editable-table#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var React = require('react');
+var ctx = require('../ctx.js');
+var _const = require('../const.js');
+var index = require('../header/index.js');
+function _interopDefaultCompat(e) {
+  return e && _typeof(e) === 'object' && 'default' in e ? e : {
+    'default': e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+// 基础 ColGroup
+function TableColGroup() {
+  var _useEditableSchemaTab = ctx.useEditableSchemaTableCtx(),
+    table = _useEditableSchemaTab.table;
+  return /*#__PURE__*/React__default["default"].createElement("colgroup", null, table.getVisibleLeafColumns().map(function (column) {
+    return /*#__PURE__*/React__default["default"].createElement(Col, {
+      key: column.id,
+      column: column
+    });
+  }));
+}
+// 虚拟化 ColGroup
+function VirtualColGroup(_ref) {
+  var virtualColumns = _ref.virtualColumns,
+    virtualColPadding = _ref.virtualColPadding;
+  var _useEditableSchemaTab2 = ctx.useEditableSchemaTableCtx(),
+    table = _useEditableSchemaTab2.table;
+  var headerGroups = table.getHeaderGroups();
+  var lastHeaderGroup = headerGroups[headerGroups.length - 1];
+  var realHeaders = lastHeaderGroup.headers;
+  var _groupHeaders = index.groupHeaders(realHeaders, table),
+    leftHeaders = _groupHeaders.left,
+    rightHeaders = _groupHeaders.right;
+  return /*#__PURE__*/React__default["default"].createElement("colgroup", null, leftHeaders.map(function (_ref2) {
+    var column = _ref2.column;
+    return /*#__PURE__*/React__default["default"].createElement(Col, {
+      key: column.id,
+      column: column
+    });
+  }), virtualColPadding.start > 0 && /*#__PURE__*/React__default["default"].createElement("col", {
+    style: {
+      width: virtualColPadding.start
+    }
+  }), virtualColumns.map(function (vc) {
+    var column = realHeaders[vc.index].column;
+    // 固定列不参与中间部分渲染
+    if (column.getIsPinned()) return null;
+    return /*#__PURE__*/React__default["default"].createElement(Col, {
+      key: column.id,
+      column: column
+    });
+  }), virtualColPadding.end > 0 && /*#__PURE__*/React__default["default"].createElement("col", {
+    style: {
+      width: virtualColPadding.end
+    }
+  }), rightHeaders.map(function (_ref3) {
+    var column = _ref3.column;
+    return /*#__PURE__*/React__default["default"].createElement(Col, {
+      key: column.id,
+      column: column
+    });
+  }));
+}
+function Col(props) {
+  var column = props.column;
+  var colWidth = column.getSize();
+  // 系统字段列使用固定宽度，其他列使用最小宽度+自动列宽
+  // 自动列宽分配是指：表格宽度超过所有列宽之和时，自动分配剩余宽度
+  // NOTE 预期如上述描述所示，但实测这样写系统字段还是会参与自动列宽分配
+  var maxWidth = _const.isSystemCol(column.id) ? colWidth : undefined;
+  return /*#__PURE__*/React__default["default"].createElement("col", {
+    key: column.id,
+    "data-id": column.id,
+    style: {
+      width: colWidth,
+      minWidth: colWidth,
+      maxWidth: maxWidth
+    }
+  });
+}
+exports.TableColGroup = TableColGroup;
+exports.VirtualColGroup = VirtualColGroup;

package/lib/cjs/container/column-virtual.js

@@ -0,0 +1,53 @@
+/** @LICENSE
+ * @hi-ui/schema-editable-table
+ * https://github.com/XiaoMi/hiui/tree/master/packages/schema/schema-editable-table#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var React = require('react');
+var ctx = require('./ctx.js');
+var hooks = require('./hooks.js');
+var colGroup = require('./col-group.js');
+function _interopDefaultCompat(e) {
+  return e && _typeof(e) === 'object' && 'default' in e ? e : {
+    'default': e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+function ColumnVirtualContainer(props) {
+  var headerRef = React.useRef(null);
+  var bodyRef = React.useRef(null);
+  var footerRef = React.useRef(null);
+  var _useColumnVirtualizer = hooks.useColumnVirtualizer(props.options),
+    columns = _useColumnVirtualizer.virtualItems,
+    colPadding = _useColumnVirtualizer.padding;
+  var colGroup$1 = /*#__PURE__*/React__default["default"].createElement(colGroup.VirtualColGroup, {
+    virtualColumns: columns,
+    virtualColPadding: colPadding
+  });
+  return /*#__PURE__*/React__default["default"].createElement(ctx.TableContainerContext.Provider, {
+    value: {
+      headerRef: headerRef,
+      bodyRef: bodyRef,
+      footerRef: footerRef,
+      colGroup: colGroup$1,
+      virtualize: {
+        columns: columns,
+        colPadding: {
+          left: colPadding.start,
+          right: colPadding.end
+        }
+      }
+    }
+  }, props.children);
+}
+exports.ColumnVirtualContainer = ColumnVirtualContainer;

package/lib/cjs/container/ctx.js

@@ -0,0 +1,32 @@
+/** @LICENSE
+ * @hi-ui/schema-editable-table
+ * https://github.com/XiaoMi/hiui/tree/master/packages/schema/schema-editable-table#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var React = require('react');
+function _interopDefaultCompat(e) {
+  return e && _typeof(e) === 'object' && 'default' in e ? e : {
+    'default': e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var TableContainerContext = /*#__PURE__*/React__default["default"].createContext(null);
+function useTableContainer() {
+  var context = React__default["default"].useContext(TableContainerContext);
+  if (!context) {
+    throw new Error('Table.* component must be rendered as child of Table component');
+  }
+  return context;
+}
+exports.TableContainerContext = TableContainerContext;
+exports.useTableContainer = useTableContainer;

package/lib/cjs/container/full-virtual.js

@@ -0,0 +1,61 @@
+/** @LICENSE
+ * @hi-ui/schema-editable-table
+ * https://github.com/XiaoMi/hiui/tree/master/packages/schema/schema-editable-table#readme
+ *
+ * Copyright (c) HiUI <mi-hiui@xiaomi.com>.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+'use strict';
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, '__esModule', {
+  value: true
+});
+var React = require('react');
+var ctx = require('./ctx.js');
+var hooks = require('./hooks.js');
+var colGroup = require('./col-group.js');
+function _interopDefaultCompat(e) {
+  return e && _typeof(e) === 'object' && 'default' in e ? e : {
+    'default': e
+  };
+}
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+function FullVirtualContainer(props) {
+  var headerRef = React.useRef(null);
+  var bodyRef = React.useRef(null);
+  var footerRef = React.useRef(null);
+  var _useRowVirtualizer = hooks.useRowVirtualizer(props.rowOptions),
+    rows = _useRowVirtualizer.virtualItems,
+    rowPadding = _useRowVirtualizer.padding;
+  var _useColumnVirtualizer = hooks.useColumnVirtualizer(props.columnOptions),
+    columns = _useColumnVirtualizer.virtualItems,
+    colPadding = _useColumnVirtualizer.padding;
+  var colGroup$1 = /*#__PURE__*/React__default["default"].createElement(colGroup.VirtualColGroup, {
+    virtualColumns: columns,
+    virtualColPadding: colPadding
+  });
+  return /*#__PURE__*/React__default["default"].createElement(ctx.TableContainerContext.Provider, {
+    value: {
+      headerRef: headerRef,
+      bodyRef: bodyRef,
+      footerRef: footerRef,
+      colGroup: colGroup$1,
+      virtualize: {
+        rows: rows,
+        columns: columns,
+        rowPadding: {
+          top: rowPadding.start,
+          bottom: rowPadding.end
+        },
+        colPadding: {
+          left: colPadding.start,
+          right: colPadding.end
+        }
+      }
+    }
+  }, props.children);
+}
+exports.FullVirtualContainer = FullVirtualContainer;