@elliemae/ds-datagrids 2.2.0-alpha.4 → 3.0.0-next.2

package/esm/plugins/column-sizing/useStylesheetHelpers.js

@@ -1,51 +1,122 @@
-import * as React from "react";
-import * as stylesheet from "stylesheet-helpers";
-import { useState, useEffect } from "react";
-import { set } from "@elliemae/ds-utilities";
-import { getColumnNameFromProperty } from "./getColumnNameFromProperty";
-import { getScrollbarWidth } from "../../utilities/getScrollbarSize";
+import 'core-js/modules/esnext.async-iterator.map.js';
+import 'core-js/modules/esnext.iterator.map.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import * as stylesheet from 'stylesheet-helpers';
+import { useState, useEffect } from 'react';
+import { set } from '@elliemae/ds-utilities';
+import getColumnFromProperty from './getColumnNameFromProperty.js';
+import { getScrollbarWidth } from '../../utilities/getScrollbarSize.js';
+
 const SCROLLBAR_WIDTH = getScrollbarWidth();
-const RowStylesheetHelper = ({ grid, className }) => {
-  const { styleSheet, styleSheetElement } = stylesheet.create();
-  const update = (width) => {
-    const widths = typeof width === "string" ? width : `${width}px`;
-    stylesheet.updateProperties(window, styleSheet, className, width ? { width: widths, minWidth: widths, maxWidth: widths } : { width: null, minWidth: null, maxWidth: null });
-    const { hasScroll } = grid.getState();
-    const headerWidth = `${width + (hasScroll ? SCROLLBAR_WIDTH : 0)}px`;
-    stylesheet.updateProperties(window, styleSheet, `${className}-header`, width ? { width: headerWidth, minWidth: headerWidth, maxWidth: headerWidth } : { width: null, minWidth: null, maxWidth: null });
+const RowStylesheetHelper = _ref => {
+  let {
+    grid,
+    className
+  } = _ref;
+  const {
+    styleSheet,
+    styleSheetElement
+  } = stylesheet.create();
+
+  const update = width => {
+    const widths = typeof width === 'string' ? width : "".concat(width, "px");
+    stylesheet.updateProperties(window, styleSheet, className, width ? {
+      width: widths,
+      minWidth: widths,
+      maxWidth: widths
+    } : {
+      width: null,
+      minWidth: null,
+      maxWidth: null
+    });
+    const {
+      hasScroll
+    } = grid.getState();
+    const headerWidth = "".concat(width + (hasScroll ? SCROLLBAR_WIDTH : 0), "px");
+    stylesheet.updateProperties(window, styleSheet, "".concat(className, "-header"), width ? {
+      width: headerWidth,
+      minWidth: headerWidth,
+      maxWidth: headerWidth
+    } : {
+      width: null,
+      minWidth: null,
+      maxWidth: null
+    });
   };
+
   const remove = () => styleSheetElement.remove();
+
   const getRowClassName = () => className;
+
   return {
     update,
     remove,
     getRowClassName
   };
 };
-const getColumnClassName = ({ globalId, column, isHeader = false, getId }) => `column-${globalId}-${getId(column)}${isHeader ? "-header" : ""}`;
-function setWidth({ styleSheet, className, width, minWidth }) {
+
+const getColumnClassName = _ref2 => {
+  let {
+    globalId,
+    column,
+    isHeader = false,
+    getId
+  } = _ref2;
+  return "column-".concat(globalId, "-").concat(getId(column)).concat(isHeader ? '-header' : '');
+};
+
+function setWidth(_ref3) {
+  let {
+    styleSheet,
+    className,
+    width,
+    minWidth
+  } = _ref3;
   let widths;
-  if (typeof width === "string")
-    widths = width;
-  if (typeof width === "number")
-    widths = `${width}px`;
+  if (typeof width === 'string') widths = width;
+  if (typeof width === 'number') widths = "".concat(width, "px");
   let minWidths;
-  if (typeof minWidth === "string")
-    minWidths = minWidth;
-  if (typeof minWidth === "number")
-    minWidths = `${minWidth}px`;
+  if (typeof minWidth === 'string') minWidths = minWidth;
+  if (typeof minWidth === 'number') minWidths = "".concat(minWidth, "px");
   stylesheet.updateProperties(window, styleSheet, className, {
-    width: `${widths || minWidths}`,
-    minWidth: `${widths || minWidths}`,
-    maxWidth: `${widths || minWidths}`
+    width: "".concat(widths || minWidths),
+    minWidth: "".concat(widths || minWidths),
+    // minWidth: `${minWidths || widths}`,
+    maxWidth: "".concat(widths || minWidths)
   });
 }
-function updateStyle({ styleSheet, className, style }) {
+
+function updateStyle(_ref4) {
+  let {
+    styleSheet,
+    className,
+    style
+  } = _ref4;
   stylesheet.updateProperties(window, styleSheet, className, style);
 }
-function columnSizesHelperImpl({ globalId, getId = ({ property }) => getColumnNameFromProperty(property) }) {
-  const { styleSheetElement, styleSheet } = stylesheet.create();
-  const updateBodyHeaderWidth = ({ className, headerClassName, width, minWidth }) => {
+
+function columnSizesHelperImpl(_ref5) {
+  let {
+    globalId,
+    getId = _ref6 => {
+      let {
+        property
+      } = _ref6;
+      return getColumnFromProperty(property);
+    }
+  } = _ref5;
+  const {
+    styleSheetElement,
+    styleSheet
+  } = stylesheet.create();
+
+  const updateBodyHeaderWidth = _ref7 => {
+    let {
+      className,
+      headerClassName,
+      width,
+      minWidth
+    } = _ref7;
     setWidth({
       styleSheet,
       className,
@@ -60,16 +131,24 @@ function columnSizesHelperImpl({ globalId, getId = ({ property }) => getColumnNa
       isHeader: true
     });
   };
+
   return {
     decorateColumns: (columns, grid) => {
       const {
-        props: { minColumnWidth }
+        props: {
+          minColumnWidth
+        }
       } = grid.getInstance();
-      return columns.map((column) => {
-        const cellClassName = getColumnClassName({ globalId, getId, column });
-        const headerClassName = `${cellClassName}-header`;
-        set(column, "header.props.className", headerClassName);
-        set(column, "cell.props.className", cellClassName);
+      return columns.map(column => {
+        const cellClassName = getColumnClassName({
+          globalId,
+          getId,
+          column
+        });
+        const headerClassName = "".concat(cellClassName, "-header");
+        set(column, 'header.props.className', headerClassName);
+        set(column, 'cell.props.className', cellClassName);
+
         column.updateBodyHeaderWidth = (width, minWidth) => {
           updateBodyHeaderWidth({
             className: cellClassName,
@@ -78,6 +157,7 @@ function columnSizesHelperImpl({ globalId, getId = ({ property }) => getColumnNa
             minWidth
           });
         };
+
         column.updateWidth = (width, minWidth) => {
           setWidth({
             styleSheet,
@@ -86,53 +166,80 @@ function columnSizesHelperImpl({ globalId, getId = ({ property }) => getColumnNa
             minWidth
           });
         };
-        column.updateStyle = (style) => updateStyle({
+
+        column.updateStyle = style => updateStyle({
           styleSheet,
           className: cellClassName,
           style
         });
-        column.headerHookEffects = [
-          () => {
-            useEffect(() => {
-              const { resizedColumns } = grid.getInstance();
-              const resizedWidth = resizedColumns.current[column.uuid];
-              updateBodyHeaderWidth({
-                className: cellClassName,
-                headerClassName,
-                width: resizedWidth || column.width || minColumnWidth,
-                minWidth: resizedWidth || column.minWidth || minColumnWidth || column.width
-              });
-            }, [column.uuid]);
-          }
-        ];
+
+        column.headerHookEffects = [() => {
+          useEffect(() => {
+            const {
+              resizedColumns
+            } = grid.getInstance();
+            const resizedWidth = resizedColumns.current[column.uuid];
+            updateBodyHeaderWidth({
+              className: cellClassName,
+              headerClassName,
+              width: resizedWidth || column.width || minColumnWidth,
+              minWidth: resizedWidth || column.minWidth || minColumnWidth || column.width
+            });
+          }, [column.uuid]);
+        }];
         return column;
       });
     },
+
     getColumnCellClassName(column) {
-      return getColumnClassName({ globalId, getId, column });
+      return getColumnClassName({
+        globalId,
+        getId,
+        column
+      });
     },
+
     getColumnHeaderClassName(column) {
-      return `${getColumnClassName({ globalId, getId, column })}-header`;
+      return "".concat(getColumnClassName({
+        globalId,
+        getId,
+        column
+      }), "-header");
     },
+
     cleanup() {
       styleSheetElement.remove();
     }
+
   };
 }
+
 function useStylesheetHelpers(grid) {
   const {
-    props: { bindColumnsSizeTo, bindRowSizeTo }
+    props: {
+      bindColumnsSizeTo,
+      bindRowSizeTo
+    }
   } = grid;
   const [columnsStylesheet] = useState(() => columnSizesHelperImpl({
     globalId: bindColumnsSizeTo || grid.uuid,
-    getId: ({ uuid }) => getColumnNameFromProperty(uuid)
+    getId: _ref8 => {
+      let {
+        uuid
+      } = _ref8;
+      return getColumnFromProperty(uuid);
+    }
   }));
-  const rowClassName = `row-${bindRowSizeTo || grid.uuid}`;
-  const [rowsStylesheet] = useState(() => RowStylesheetHelper({ grid, className: rowClassName }));
-  return { columnsStylesheet, rowsStylesheet, rowClassName };
+  const rowClassName = "row-".concat(bindRowSizeTo || grid.uuid);
+  const [rowsStylesheet] = useState(() => RowStylesheetHelper({
+    grid,
+    className: rowClassName
+  }));
+  return {
+    columnsStylesheet,
+    rowsStylesheet,
+    rowClassName
+  };
 }
-export {
-  RowStylesheetHelper,
-  useStylesheetHelpers
-};
-//# sourceMappingURL=useStylesheetHelpers.js.map
+
+export { RowStylesheetHelper, useStylesheetHelpers };

package/esm/plugins/column-sizing/utils.js

@@ -1,14 +1,16 @@
-import * as React from "react";
-import { get } from "@elliemae/ds-utilities";
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import { get } from '@elliemae/ds-utilities';
+
 function getScrollbarSizeFromHeaderAndBody(refs) {
-  const innerBodyOffsetWidth = get(refs, ["innerBody", "current", "offsetWidth"]);
-  const headerOffsetWidth = get(refs, ["header", "current", "offsetWidth"]);
+  const innerBodyOffsetWidth = get(refs, ['innerBody', 'current', 'offsetWidth']);
+  const headerOffsetWidth = get(refs, ['header', 'current', 'offsetWidth']);
   return headerOffsetWidth - innerBodyOffsetWidth;
 }
-const isScrollbarVisible = (element) => element.scrollHeight > element.clientHeight;
-const getPercentageValue = (percentString) => {
-  if (typeof percentString !== "string")
-    return null;
+const isScrollbarVisible = element => element.scrollHeight > element.clientHeight;
+const getPercentageValue = percentString => {
+  if (typeof percentString !== 'string') return null;
   const result = percentString.match(/(\d+|\d*[.,]\d{1,2})/);
   return result && Number(result[0]);
 };
@@ -16,24 +18,20 @@ const getColumnWidthSize = (width, minWidth, column) => {
   if (column.special) {
     return column.width;
   }
-  if (minWidth && minWidth > width)
-    return minWidth;
+
+  if (minWidth && minWidth > width) return minWidth;
   return width;
 };
-const calculateMinWidthForWrappedText = (columns) => {
+const calculateMinWidthForWrappedText = columns => {
   let longestWord = 0;
-  columns.forEach(({ label }) => {
-    const localLongestWord = label.split(" ").sort((a, b) => b.length - a.length)[0].length;
-    if (localLongestWord > longestWord)
-      longestWord = localLongestWord;
+  columns.forEach(_ref => {
+    let {
+      label
+    } = _ref;
+    const localLongestWord = label.split(' ').sort((a, b) => b.length - a.length)[0].length;
+    if (localLongestWord > longestWord) longestWord = localLongestWord;
   });
   return longestWord * 8.5;
 };
-export {
-  calculateMinWidthForWrappedText,
-  getColumnWidthSize,
-  getPercentageValue,
-  getScrollbarSizeFromHeaderAndBody,
-  isScrollbarVisible
-};
-//# sourceMappingURL=utils.js.map
+
+export { calculateMinWidthForWrappedText, getColumnWidthSize, getPercentageValue, getScrollbarSizeFromHeaderAndBody, isScrollbarVisible };

package/esm/plugins/custom-cell-renderer/CustomRendererPlugin.js

@@ -1,11 +1,10 @@
-import * as React from "react";
-import { createInstancePlugin } from "@elliemae/ds-shared/createDataInstance/createInstancePlugin";
-import { addCustomRendererToCell } from "./addCustomRendererToCell";
+import createInstancePlugin from '@elliemae/ds-shared/createDataInstance/createInstancePlugin';
+import addCustomRendererToCell from './addCustomRendererToCell.js';
+
 const decorateColumn = (column, grid) => addCustomRendererToCell(grid)(column);
-const CustomRendererPlugin = createInstancePlugin("custom-renderer", {
+
+const CustomRendererPlugin = createInstancePlugin('custom-renderer', {
   decorateColumn
 });
-export {
-  CustomRendererPlugin
-};
-//# sourceMappingURL=CustomRendererPlugin.js.map
+
+export { CustomRendererPlugin };

package/esm/plugins/custom-cell-renderer/addCustomRendererToCell.js

@@ -1,48 +1,63 @@
-import * as React from "react";
-import { isFunction, get } from "@elliemae/ds-utilities";
-import { appendCellFormatter } from "@elliemae/ds-shared/useDataGrid/initColumnDefinition";
-import { getRendererComponent } from "./getRendererComponent";
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import { get, isFunction } from '@elliemae/ds-utilities';
+import { appendCellFormatter } from '@elliemae/ds-shared/useDataGrid/initColumnDefinition';
+import getRendererComponent from './getRendererComponent.js';
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); 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 = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 const getRenderer = (renderer, grid, column) => (value, metaData) => {
   const {
-    props: { customHandlers, parentRowData }
+    props: {
+      customHandlers,
+      parentRowData
+    }
   } = grid.getInstance();
+
   if (column && column.formatExpandable && value && value.props && value.props.children && value.props.children.length === 2) {
-    return [
-      value.props.children[0],
-      renderer({
-        value: value.props.children[1],
-        metaData: { ...metaData, parentRowData },
-        customHandlers
-      })
-    ];
+    return [value.props.children[0], renderer({
+      value: value.props.children[1],
+      // apply custom render only to the original value not the arrow
+      metaData: _objectSpread(_objectSpread({}, metaData), {}, {
+        parentRowData
+      }),
+      customHandlers
+    })];
   }
+
   return renderer({
     value,
-    metaData: { ...metaData, parentRowData },
+    metaData: _objectSpread(_objectSpread({}, metaData), {}, {
+      parentRowData
+    }),
     customHandlers
   });
 };
-const addCustomRendererToCell = (grid) => (column) => {
-  const { customRenderer } = column;
-  const customHeaderRenderer = get(column, ["header", "customRenderer"]);
-  if (!customRenderer && !customHeaderRenderer)
-    return column;
+
+const addCustomRendererToCell = grid => column => {
+  const {
+    customRenderer
+  } = column;
+  const customHeaderRenderer = get(column, ['header', 'customRenderer']);
+  if (!customRenderer && !customHeaderRenderer) return column;
+
   if (isFunction(customHeaderRenderer)) {
     column.header.formatters.push(getRenderer(customHeaderRenderer, grid));
   }
+
   if (isFunction(customRenderer)) {
     column = appendCellFormatter(getRenderer(customRenderer, grid, column), column);
   } else {
-    if (!customRenderer)
-      return column;
+    if (!customRenderer) return column;
     column.cell.formatters.push((value, columnData) => getRendererComponent(grid, customRenderer, columnData));
   }
+
   return column;
 };
-var addCustomRendererToCell_default = addCustomRendererToCell;
-export {
-  addCustomRendererToCell,
-  addCustomRendererToCell_default as default,
-  getRenderer
-};
-//# sourceMappingURL=addCustomRendererToCell.js.map
+
+export { addCustomRendererToCell as default, getRenderer };

package/esm/plugins/custom-cell-renderer/getRendererComponent.js

@@ -1,9 +1,22 @@
-import * as React from "react";
-import React2 from "react";
-import { DSButton } from "@elliemae/ds-button";
-import { DSCheckbox, DSComboBox, DSRadio, DSTextBox, DSToggle } from "@elliemae/ds-form";
-import { DSDropdownMenu } from "@elliemae/ds-dropdownmenu";
-import * as renderers from "../../components/renderers";
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'react';
+import DSButton from '@elliemae/ds-button';
+import { DSCheckbox, DSComboBox, DSRadio, DSTextBox, DSToggle } from '@elliemae/ds-form';
+import DSDropdownMenu from '@elliemae/ds-dropdownmenu';
+import * as index from '../../components/renderers/index.js';
+import { jsx } from 'react/jsx-runtime';
+
+const _excluded = ["type", "handlers"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); 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 = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 const components = {
   DSButton,
   DSCheckbox,
@@ -13,22 +26,31 @@ const components = {
   DSToggle,
   DSDropdownMenu
 };
-const getRendererComponent = ({ props }, { type = "DSTextBox", handlers, ...rest }, { rowData }) => {
-  const Component = components[type] || renderers[type];
-  const { customHandlers, rowKey } = props;
+
+const getRendererComponent = (_ref2, _ref, _ref3) => {
+  let {
+    props
+  } = _ref2;
+  let {
+    rowData
+  } = _ref3;
+
+  let {
+    type = 'DSTextBox',
+    handlers
+  } = _ref,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  const Component = components[type] || index[type];
+  const {
+    customHandlers,
+    rowKey
+  } = props;
   const mappedHandlers = {};
-  Object.keys(handlers).forEach((key) => {
-    mappedHandlers[handlers[key]] = () => typeof customHandlers[key] === "function" ? customHandlers[key](rowData, rowData[rowKey]) : null;
+  Object.keys(handlers).forEach(key => {
+    mappedHandlers[handlers[key]] = () => typeof customHandlers[key] === 'function' ? customHandlers[key](rowData, rowData[rowKey]) : null;
   });
-  return /* @__PURE__ */ React2.createElement(Component, {
-    ...rowData,
-    ...mappedHandlers,
-    ...rest
-  });
-};
-var getRendererComponent_default = getRendererComponent;
-export {
-  getRendererComponent_default as default,
-  getRendererComponent
+  return /*#__PURE__*/jsx(Component, _objectSpread(_objectSpread(_objectSpread({}, rowData), mappedHandlers), rest));
 };
-//# sourceMappingURL=getRendererComponent.js.map
+
+export { getRendererComponent as default };

package/esm/plugins/custom-cell-renderer/index.js

@@ -1,6 +1 @@
-import * as React from "react";
-import { CustomRendererPlugin } from "./CustomRendererPlugin";
-export {
-  CustomRendererPlugin
-};
-//# sourceMappingURL=index.js.map
+export { CustomRendererPlugin } from './CustomRendererPlugin.js';

package/esm/plugins/editable/EditableComponents/ComboBox.js

@@ -1,39 +1,65 @@
-import * as React from "react";
-import React2, { Component } from "react";
-import { DSComboBox } from "@elliemae/ds-form";
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import { Component } from 'react';
+import { DSComboBox } from '@elliemae/ds-form';
+import { jsx } from 'react/jsx-runtime';
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); 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 = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 class ComboBox extends Component {
   constructor(props) {
     super(props);
-    this.state = { value: props.value };
+    this.state = {
+      value: props.value
+    };
+    this.handleBlur = this.handleBlur.bind(this);
+    this.handleChange = this.handleChange.bind(this);
   }
+
   handleChange(value) {
-    const { onValue } = this.props;
+    const {
+      onValue
+    } = this.props; // some how this is executed before handleBlur, and handleBlur before the value is set
+    // causing the value to be the same as the prevProp
+    // todo: find a better solution to this
+
     setTimeout(() => onValue(value), 1);
-    this.setState({ value });
+    this.setState({
+      value
+    });
   }
+
   handleBlur() {
-    const { onValue } = this.props;
-    const { value } = this.state;
+    const {
+      onValue
+    } = this.props;
+    const {
+      value
+    } = this.state;
     onValue(value);
   }
+
   render() {
-    const { value } = this.state;
-    return /* @__PURE__ */ React2.createElement(DSComboBox, {
-      ...this.props,
+    const {
+      value
+    } = this.state;
+    return /*#__PURE__*/jsx(DSComboBox, _objectSpread(_objectSpread({}, this.props), {}, {
       menuIsOpen: true,
       onBlur: this.handleBlur,
       onChange: this.handleChange,
-      onClick: (e) => e.stopPropagation(),
-      value
-    });
+      onClick: e => e.stopPropagation(),
+      value: value
+    }));
   }
+
 }
 ComboBox.defaultProps = {
   onValue: () => null
 };
-var ComboBox_default = ComboBox;
-export {
-  ComboBox,
-  ComboBox_default as default
-};
-//# sourceMappingURL=ComboBox.js.map
+
+export { ComboBox as default };