@elliemae/ds-datagrids 1.61.0 → 2.0.0-alpha.12

package/cjs/columns/IconColumn.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _jsx = require('@babel/runtime/helpers/jsx');
 var React = require('react');
 var dsUtilities = require('@elliemae/ds-utilities');
 var DSButton = require('@elliemae/ds-button');
@@ -8,62 +8,58 @@ var dsClassnames = require('@elliemae/ds-classnames');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
 
-var _IntentIconColors;
-var Intents = {
+const Intents = {
   SUCCESS: 'success',
   INFO: 'info',
   DANGER: 'danger',
   WARNING: 'warning'
 };
-var IntentIconColors = (_IntentIconColors = {}, _defineProperty__default['default'](_IntentIconColors, Intents.SUCCESS, ['success', 900]), _defineProperty__default['default'](_IntentIconColors, Intents.INFO, ['brand-primary', 600]), _defineProperty__default['default'](_IntentIconColors, Intents.DANGER, ['danger', 900]), _defineProperty__default['default'](_IntentIconColors, Intents.WARNING, ['warning', 900]), _IntentIconColors);
-var ValueWrapper = dsClassnames.aggregatedClasses('span')('icon-column-cell');
+const IntentIconColors = {
+  [Intents.SUCCESS]: ['success', 900],
+  [Intents.INFO]: ['brand-primary', 600],
+  [Intents.DANGER]: ['danger', 900],
+  [Intents.WARNING]: ['warning', 900]
+};
+const ValueWrapper = dsClassnames.aggregatedClasses('span')('icon-column-cell');
 
-var addColorToIcon = function addColorToIcon(icon, intentColor) {
+const addColorToIcon = (icon, intentColor) => {
   if (icon.props.color) {
     return icon;
   }
 
-  return /*#__PURE__*/React__default['default'].cloneElement(icon, {
+  return /*#__PURE__*/React__default["default"].cloneElement(icon, {
     color: intentColor
   });
 };
 
 function createColumn(_ref) {
-  var property = _ref.property,
-      label = _ref.label,
-      headerIcon = _ref.headerIcon,
-      _ref$getRowIcon = _ref.getRowIcon,
-      getRowIcon = _ref$getRowIcon === void 0 ? function () {
-    return null;
-  } : _ref$getRowIcon,
-      _ref$isVisited = _ref.isVisited,
-      isVisited = _ref$isVisited === void 0 ? function () {
-    return null;
-  } : _ref$isVisited,
-      _ref$intent = _ref.intent,
-      intent = _ref$intent === void 0 ? Intents.SUCCESS : _ref$intent,
-      _ref$width = _ref.width,
-      width = _ref$width === void 0 ? 60 : _ref$width,
-      onClick = _ref.onClick,
-      visible = _ref.visible,
-      resizable = _ref.resizable,
-      sortable = _ref.sortable,
-      searchable = _ref.searchable;
+  let {
+    property,
+    label,
+    headerIcon,
+    getRowIcon = () => null,
+    isVisited = () => null,
+    intent = Intents.SUCCESS,
+    width = 60,
+    onClick,
+    visible,
+    resizable,
+    sortable,
+    searchable
+  } = _ref;
 
-  var formatter = function formatter(value, extraParams) {
-    var icon = getRowIcon(value, extraParams);
+  const formatter = (value, extraParams) => {
+    const icon = getRowIcon(value, extraParams);
 
-    var onClickHandler = function onClickHandler(e) {
-      return onClick(e, extraParams);
-    };
+    const onClickHandler = e => onClick(e, extraParams);
 
-    return /*#__PURE__*/React__default['default'].createElement(ValueWrapper, {
+    return /*#__PURE__*/_jsx__default["default"](ValueWrapper, {
       className: dsUtilities.cx("icc-".concat(intent), isVisited(value, extraParams))
-    }, icon && addColorToIcon(icon, IntentIconColors[intent]), onClick && typeof value !== 'undefined' ? /*#__PURE__*/React__default['default'].createElement(DSButton__default['default'], {
+    }, void 0, icon && addColorToIcon(icon, IntentIconColors[intent]), onClick && typeof value !== 'undefined' ? /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
       buttonType: "text",
       intent: intent,
       labelText: value,
@@ -72,17 +68,15 @@ function createColumn(_ref) {
   };
 
   return {
-    property: property,
-    label: label,
+    property,
+    label,
     headerStyle: {
       justifyContent: 'center'
     },
     header: {
-      formatters: [function () {
-        return /*#__PURE__*/React__default['default'].createElement("span", null, /*#__PURE__*/React__default['default'].cloneElement(headerIcon, {
-          color: IntentIconColors[intent]
-        }));
-      }]
+      formatters: [() => /*#__PURE__*/_jsx__default["default"]("span", {}, void 0, /*#__PURE__*/React__default["default"].cloneElement(headerIcon, {
+        color: IntentIconColors[intent]
+      }))]
     },
     cell: {
       formatters: [formatter]
@@ -90,13 +84,12 @@ function createColumn(_ref) {
     cellStyle: {
       justifyContent: 'center'
     },
-    width: width,
+    width,
     visible: typeof visible === 'undefined' || visible,
-    resizable: resizable,
-    sortable: sortable,
-    searchable: searchable
+    resizable,
+    sortable,
+    searchable
   };
 }
 
 module.exports = createColumn;
-//# sourceMappingURL=IconColumn.js.map

package/cjs/columns/NumberColumn.js

@@ -1,9 +1,6 @@
 'use strict';
 
 function createNumberColumn(_ref) {
-  _ref.label;
-      _ref.property;
 }
 
 module.exports = createNumberColumn;
-//# sourceMappingURL=NumberColumn.js.map

package/cjs/components/BodyCell.js

@@ -1,118 +1,101 @@
 'use strict';
 
-var _extends = require('@babel/runtime/helpers/extends');
-var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
+var _jsx = require('@babel/runtime/helpers/jsx');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 var React = require('react');
-var PropTypes = require('prop-types');
 var FocusGridManager = require('@elliemae/ds-shared/FocusGroup/FocusGrid');
 var utils = require('@elliemae/ds-shared/createDataInstance/utils');
 var DSTruncatedTooltipText = require('@elliemae/ds-truncated-tooltip-text');
+var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
-var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
 var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var DSTruncatedTooltipText__default = /*#__PURE__*/_interopDefaultLegacy(DSTruncatedTooltipText);
 
-var _excluded = ["rowData", "rowKey", "isScrolling"];
+const _excluded = ["rowData", "rowKey", "isScrolling"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
 function BodyCell(_ref) {
-  var Component = _ref.component,
-      classProps = _ref.classProps,
-      rowProps = _ref.rowProps,
-      column = _ref.column,
-      columnIndex = _ref.columnIndex,
-      rowIndex = _ref.rowIndex,
-      grid = _ref.grid;
-
-  var rowData = rowProps.rowData,
-      rowKey = rowProps.rowKey,
-      isScrolling = rowProps.isScrolling,
-      extraRowProps = _objectWithoutProperties__default['default'](rowProps, _excluded);
-
-  var property = column.property,
-      cell = column.cell,
-      props = column.props;
-  var evaluatedProperty = property || cell && cell.property;
-  var ref = React.useRef(null);
-
-  var _useContext = React.useContext(FocusGridManager.FocusGridContext),
-      register = _useContext.register;
-
-  var registerFocus = React.useCallback(function (node) {
+  let {
+    component: Component,
+    classProps,
+    rowProps,
+    column,
+    columnIndex,
+    rowIndex,
+    grid
+  } = _ref;
+
+  const {
+    rowData,
+    rowKey,
+    isScrolling
+  } = rowProps,
+        extraRowProps = _objectWithoutProperties__default["default"](rowProps, _excluded);
+
+  const {
+    property,
+    cell,
+    props
+  } = column;
+  const evaluatedProperty = property || cell && cell.property;
+  const ref = React.useRef(null);
+  const {
+    register
+  } = React.useContext(FocusGridManager.FocusGridContext);
+  const registerFocus = React.useCallback(node => {
     register(node, rowIndex, columnIndex);
   }, []);
-  React.useEffect(function () {
+  React.useEffect(() => {
     registerFocus(ref.current);
   }, [ref.current]);
-
-  var _ref2 = cell || {},
-      _ref2$transforms = _ref2.transforms,
-      transforms = _ref2$transforms === void 0 ? [] : _ref2$transforms,
-      _ref2$formatters = _ref2.formatters,
-      formatters = _ref2$formatters === void 0 ? [] : _ref2$formatters,
-      _ref2$fixedFormatters = _ref2.fixedFormatters,
-      fixedFormatters = _ref2$fixedFormatters === void 0 ? [] : _ref2$fixedFormatters,
-      _ref2$scrollingFormat = _ref2.scrollingFormatters,
-      scrollingFormatters = _ref2$scrollingFormat === void 0 ? [] : _ref2$scrollingFormat;
-
-  var extraParameters = _objectSpread({
-    columnIndex: columnIndex,
+  const {
+    transforms = [],
+    formatters = [],
+    fixedFormatters = [],
+    // useful for the toolbar trigger at the last column
+    scrollingFormatters = []
+  } = cell || {};
+
+  const extraParameters = _objectSpread({
+    columnIndex,
     property: evaluatedProperty,
-    column: column,
-    rowData: rowData,
-    rowIndex: rowIndex,
-    rowKey: rowKey,
-    isScrolling: isScrolling,
+    column,
+    rowData,
+    rowIndex,
+    rowKey,
+    isScrolling,
     // improve performance on scroll rendering a lightweight component instead
-    registerFocus: registerFocus
+    registerFocus
   }, extraRowProps);
 
-  var withTooltip = function withTooltip(v) {
-    return classProps && classProps.wrapText ? v : /*#__PURE__*/React__default['default'].createElement(DSTruncatedTooltipText__default['default'], {
-      value: v
-    });
-  };
+  const withTooltip = v => classProps && classProps.wrapText ? v : /*#__PURE__*/_jsx__default["default"](DSTruncatedTooltipText__default["default"], {
+    value: v
+  });
 
-  var value = rowData["_".concat(evaluatedProperty)] || rowData[evaluatedProperty];
-  var transformed = utils.evaluateTransforms(transforms, value, extraParameters);
-  return /*#__PURE__*/React__default['default'].createElement(Component, _extends__default['default']({
+  const value = rowData["_".concat(evaluatedProperty)] || rowData[evaluatedProperty];
+  const transformed = utils.evaluateTransforms(transforms, value, extraParameters);
+  return /*#__PURE__*/jsxRuntime.jsx(Component, _objectSpread(_objectSpread(_objectSpread(_objectSpread({
     ref: ref,
     "data-testid": "column-".concat(property),
     tabIndex: -1,
     classProps: classProps
-  }, props, cell && cell.props, transformed), transformed.children || utils.evaluateFormatters(!isScrolling ? [withTooltip].concat(_toConsumableArray__default['default'](formatters), _toConsumableArray__default['default'](fixedFormatters)) : [].concat(_toConsumableArray__default['default'](scrollingFormatters), _toConsumableArray__default['default'](fixedFormatters)), value, extraParameters, grid));
+  }, props), cell && cell.props), transformed), {}, {
+    children: transformed.children || utils.evaluateFormatters(!isScrolling ? [withTooltip, ...formatters, ...fixedFormatters] : [...scrollingFormatters, ...fixedFormatters], value, extraParameters, grid)
+  }));
 }
 
-BodyCell.propTypes = {
-  component: PropTypes__default['default'].element,
-  classProps: PropTypes__default['default'].shape({
-    wrapText: PropTypes__default['default'].bool
-  }),
-  rowProps: PropTypes__default['default'].shape({
-    rowData: PropTypes__default['default'].shape({}),
-    rowKey: PropTypes__default['default'].string,
-    isScrolling: PropTypes__default['default'].bool
-  }),
-  column: PropTypes__default['default'].shape({
-    property: PropTypes__default['default'].string,
-    cell: PropTypes__default['default'].any,
-    props: PropTypes__default['default'].shape({})
-  }),
-  columnIndex: PropTypes__default['default'].number,
-  rowIndex: PropTypes__default['default'].number,
-  grid: PropTypes__default['default'].any
-};
-
 module.exports = BodyCell;
-//# sourceMappingURL=BodyCell.js.map

package/cjs/components/BodyList.js

@@ -1,42 +1,54 @@
 'use strict';
 
-var _extends = require('@babel/runtime/helpers/extends');
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _jsx = require('@babel/runtime/helpers/jsx');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 var React = require('react');
-var components_NoResults = require('./NoResults.js');
-require('styled-components');
-require('@elliemae/ds-system');
+var NoResults = require('./NoResults.js');
+var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var _excluded = ["component", "rows", "rowRenderer", "noResultsPlaceholder", "innerRef", "innerBodyRef"];
+const _excluded = ["component", "rows", "rowRenderer", "noResultsPlaceholder", "innerRef", "innerBodyRef"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
 function BodyWrapperDefaultRenderer(_ref) {
-  var Component = _ref.component,
-      rows = _ref.rows,
-      rowRenderer = _ref.rowRenderer,
-      noResultsPlaceholder = _ref.noResultsPlaceholder,
-      innerRef = _ref.innerRef;
-      _ref.innerBodyRef;
-      var otherBodyProps = _objectWithoutProperties__default['default'](_ref, _excluded);
-
-  return /*#__PURE__*/React__default['default'].createElement(Component, _extends__default['default']({}, otherBodyProps, {
-    innerRef: innerRef
-  }), rows.length ? rows.map(function (row, index) {
-    return rowRenderer(row, {
-      index: index
-    }, {});
-  }) : /*#__PURE__*/React__default['default'].createElement(components_NoResults, {
+  let {
+    component: Component,
+    rows,
+    rowRenderer,
+    noResultsPlaceholder,
+    innerRef,
+    innerBodyRef
+  } = _ref,
+      otherBodyProps = _objectWithoutProperties__default["default"](_ref, _excluded);
+
+  return /*#__PURE__*/jsxRuntime.jsx(Component, _objectSpread(_objectSpread({}, otherBodyProps), {}, {
     innerRef: innerRef,
-    rowRenderer: rowRenderer
-  }, noResultsPlaceholder));
+    children: rows.length ? rows.map((row, index) => rowRenderer(row, {
+      index
+    }, {})) : /*#__PURE__*/_jsx__default["default"](NoResults, {
+      innerRef: innerRef,
+      rowRenderer: rowRenderer
+    }, void 0, noResultsPlaceholder)
+  }));
 }
 
-var BodyList = /*#__PURE__*/React__default['default'].memo(BodyWrapperDefaultRenderer);
+var BodyList = /*#__PURE__*/React__default["default"].memo(BodyWrapperDefaultRenderer);
 
 module.exports = BodyList;
-//# sourceMappingURL=BodyList.js.map

package/cjs/components/ColumnVisibilityMenuOption.js

@@ -2,48 +2,43 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
+require('core-js/modules/esnext.async-iterator.reduce.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.reduce.js');
+require('core-js/modules/web.dom-collections.iterator.js');
 
 function getColumnVisibilityMenuOption(_ref) {
-  var columns = _ref.columns,
-      onColumnVisibilityChange = _ref.onColumnVisibilityChange,
-      searchable = _ref.searchable,
-      height = _ref.height;
-
-  var _columns$reduce = columns.reduce(function (result, column, index) {
-    return {
-      items: [].concat(_toConsumableArray__default['default'](result.items), [{
-        id: column.property,
-        label: column.label,
-        checked: column.visible,
-        onClick: function onClick() {
-          return onColumnVisibilityChange(column, index);
-        }
-      }]),
-      active: !column.visible ? result.active : [].concat(_toConsumableArray__default['default'](result.active), [column.property])
-    };
-  }, {
+  let {
+    columns,
+    onColumnVisibilityChange,
+    searchable,
+    height
+  } = _ref;
+  const {
+    items,
+    active
+  } = columns.reduce((result, column, index) => ({
+    items: [...result.items, {
+      id: column.property,
+      label: column.label,
+      checked: column.visible,
+      onClick: () => onColumnVisibilityChange(column, index)
+    }],
+    active: !column.visible ? result.active : [...result.active, column.property]
+  }), {
     items: [],
     active: []
-  }),
-      items = _columns$reduce.items,
-      active = _columns$reduce.active;
-
+  });
   return {
     type: 'SelectionGroup',
     id: 'column-visibility-option',
     multi: true,
-    searchable: searchable,
+    searchable,
     closeOnClick: false,
-    active: active,
-    items: items,
-    height: height
+    active,
+    items,
+    height
   };
 }
 
 exports.getColumnVisibilityMenuOption = getColumnVisibilityMenuOption;
-//# sourceMappingURL=ColumnVisibilityMenuOption.js.map

package/cjs/components/ColumnsOptionsMenuSection.js

@@ -1,41 +1,42 @@
 'use strict';
 
-var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
-var React = require('react');
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('core-js/modules/esnext.async-iterator.reduce.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.reduce.js');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('react');
 var dsMenu = require('@elliemae/ds-menu');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 
-var ColumnsOptionsMenuSection = function ColumnsOptionsMenuSection(_ref) {
-  var columns = _ref.columns,
-      onColumnVisibilityChange = _ref.onColumnVisibilityChange,
-      _ref$searchable = _ref.searchable,
-      searchable = _ref$searchable === void 0 ? false : _ref$searchable,
-      height = _ref.height;
-  return function () {
-    var _columns$reduce = columns.reduce(function (result, column, index) {
-      return {
-        items: [].concat(_toConsumableArray__default['default'](result.items), [{
-          id: column.property,
-          label: column.label,
-          checked: column.visible,
-          onClick: function onClick() {
-            return onColumnVisibilityChange(column, index);
-          }
-        }]),
-        active: typeof column.visible === 'undefined' || column.visible ? [].concat(_toConsumableArray__default['default'](result.active), [column.property]) : result.active
-      };
-    }, {
+const ColumnsOptionsMenuSection = _ref => {
+  let {
+    columns,
+    onColumnVisibilityChange,
+    searchable = false,
+    height // eslint-disable-next-line react/display-name
+
+  } = _ref;
+  return () => {
+    const {
+      items,
+      active
+    } = columns.reduce((result, column, index) => ({
+      items: [...result.items, {
+        id: column.property,
+        label: column.label,
+        checked: column.visible,
+        onClick: () => onColumnVisibilityChange(column, index)
+      }],
+      active: typeof column.visible === 'undefined' || column.visible ? [...result.active, column.property] : result.active
+    }), {
       items: [],
       active: []
-    }),
-        items = _columns$reduce.items,
-        active = _columns$reduce.active;
-
-    return /*#__PURE__*/React__default['default'].createElement(dsMenu.Menu.SelectionGroup, {
+    });
+    return /*#__PURE__*/_jsx__default["default"](dsMenu.Menu.SelectionGroup, {
       active: active,
       height: height,
       items: items,
@@ -46,4 +47,3 @@ var ColumnsOptionsMenuSection = function ColumnsOptionsMenuSection(_ref) {
 };
 
 module.exports = ColumnsOptionsMenuSection;
-//# sourceMappingURL=ColumnsOptionsMenuSection.js.map