@elliemae/ds-search-field 2.0.0-alpha.1 → 2.0.0-alpha.13

package/esm/DSSearchField.js

@@ -1,67 +1,70 @@
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import 'react';
 import { PropTypes, describe } from 'react-desc';
-import { TabTypes } from '@elliemae/ds-basic/Tabs';
+import { TabTypes } from '@elliemae/ds-tabs';
 import DSSearchFieldImpl from './impl/DSSeachFieldImpl.js';
 export { default as DSModalSearchField } from './impl/components/ModalSearchField/ModalSearchField.js';
 
-const DSSearchField = ({
-  containerProps = {},
-  onChange = () => null,
-  searchOptionLabel = 'Advanced Search',
-  placeholder = 'Select field',
-  modalSize = 'x-large',
-  modalTitle = 'Search Field ID',
-  tabsAnimated = true,
-  tabsEnableMouseEvents = true,
-  tabType = TabTypes.NORMAL,
-  tabData = [],
-  searchGrid = false,
-  searchFilters = true,
-  confirmLabel = 'Apply',
-  rejectLabel = 'Cancel',
-  modalType = 'confirm',
-  onConfirmField = () => null,
-  onRejectField = () => null,
-  onTabChange = () => null,
-  appElement = '#root',
-  value = null,
-  additionalInfo = null,
-  displayProperty = 'name',
-  dropdownOptions = [],
-  customDataGridOptions = {},
-  customDropdownOptions = {},
-  useLookupIndicator = true,
-  searchable = false
-}) => /*#__PURE__*/_jsx(DSSearchFieldImpl, {
-  additionalInfo: additionalInfo,
-  appElement: appElement,
-  searchable: searchable,
-  confirmLabel: confirmLabel,
-  containerProps: containerProps,
-  customDataGridOptions: customDataGridOptions,
-  customDropdownOptions: customDropdownOptions,
-  displayProperty: displayProperty,
-  dropdownOptions: dropdownOptions,
-  modalSize: modalSize,
-  modalTitle: modalTitle,
-  modalType: modalType,
-  onChange: onChange,
-  onConfirmField: onConfirmField,
-  onRejectField: onRejectField,
-  onTabChange: onTabChange,
-  placeholder: placeholder,
-  rejectLabel: rejectLabel,
-  searchFilters: searchFilters,
-  searchGrid: searchGrid,
-  searchOptionLabel: searchOptionLabel,
-  tabData: tabData,
-  tabsAnimated: tabsAnimated,
-  tabsEnableMouseEvents: tabsEnableMouseEvents,
-  tabType: tabType,
-  useLookupIndicator: useLookupIndicator,
-  value: value
-});
+const DSSearchField = _ref => {
+  let {
+    containerProps = {},
+    onChange = () => null,
+    searchOptionLabel = 'Advanced Search',
+    placeholder = 'Select field',
+    modalSize = 'x-large',
+    modalTitle = 'Search Field ID',
+    tabsAnimated = true,
+    tabsEnableMouseEvents = true,
+    tabType = TabTypes.NORMAL,
+    tabData = [],
+    searchGrid = false,
+    searchFilters = true,
+    confirmLabel = 'Apply',
+    rejectLabel = 'Cancel',
+    modalType = 'confirm',
+    onConfirmField = () => null,
+    onRejectField = () => null,
+    onTabChange = () => null,
+    appElement = '#root',
+    value = null,
+    additionalInfo = null,
+    displayProperty = 'name',
+    dropdownOptions = [],
+    customDataGridOptions = {},
+    customDropdownOptions = {},
+    useLookupIndicator = true,
+    searchable = false
+  } = _ref;
+  return /*#__PURE__*/_jsx(DSSearchFieldImpl, {
+    additionalInfo: additionalInfo,
+    appElement: appElement,
+    searchable: searchable,
+    confirmLabel: confirmLabel,
+    containerProps: containerProps,
+    customDataGridOptions: customDataGridOptions,
+    customDropdownOptions: customDropdownOptions,
+    displayProperty: displayProperty,
+    dropdownOptions: dropdownOptions,
+    modalSize: modalSize,
+    modalTitle: modalTitle,
+    modalType: modalType,
+    onChange: onChange,
+    onConfirmField: onConfirmField,
+    onRejectField: onRejectField,
+    onTabChange: onTabChange,
+    placeholder: placeholder,
+    rejectLabel: rejectLabel,
+    searchFilters: searchFilters,
+    searchGrid: searchGrid,
+    searchOptionLabel: searchOptionLabel,
+    tabData: tabData,
+    tabsAnimated: tabsAnimated,
+    tabsEnableMouseEvents: tabsEnableMouseEvents,
+    tabType: tabType,
+    useLookupIndicator: useLookupIndicator,
+    value: value
+  });
+};
 
 const props = {
   /*

package/esm/impl/DSSeachFieldImpl.js

@@ -1,9 +1,17 @@
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/esnext.async-iterator.find.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.find.js';
+import 'core-js/modules/esnext.async-iterator.filter.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 { Component } from 'react';
 import { components } from 'react-select';
 import { convertPropToCssClassName } from '@elliemae/ds-classnames';
-import { DSComboBox2 } from '@elliemae/ds-basic/form/ComboBox';
+import { DSComboBox2 } from '@elliemae/ds-form';
 import ModalSearchField from './components/ModalSearchField/ModalSearchField.js';
 export { default as DSModalSearchField } from './components/ModalSearchField/ModalSearchField.js';
 import AdvanceSearchOption from './components/AdvanceSearchOption/AdvanceSearchOption.js';
@@ -30,7 +38,7 @@ class DSSearchFieldImpl extends Component {
   constructor(props) {
     super(props);
 
-    _defineProperty(this, "onChange", () => {
+    this.onChange = () => {
       const {
         selected: id,
         additionalInfo: [row]
@@ -39,9 +47,9 @@ class DSSearchFieldImpl extends Component {
         onChange
       } = this.props;
       onChange(id, row);
-    });
+    };
 
-    _defineProperty(this, "onChangeDropdown", value => {
+    this.onChangeDropdown = value => {
       const {
         dropdownOptions
       } = this.props;
@@ -53,9 +61,9 @@ class DSSearchFieldImpl extends Component {
       if (selected) onChange(value, {
         [displayProperty]: selected.label
       });
-    });
+    };
 
-    _defineProperty(this, "onKeyDown", event => {
+    this.onKeyDown = event => {
       setTimeout(() => {
         const {
           keycode
@@ -65,9 +73,9 @@ class DSSearchFieldImpl extends Component {
         } = this.props;
         if (value && keycode === 13) this.handleCloseModal();
       }, 0);
-    });
+    };
 
-    _defineProperty(this, "handleSelect", (selectedRow, rows) => {
+    this.handleSelect = (selectedRow, rows) => {
       let selected = selectedRow; // fix new datagrid callback format
 
       if (!selected) return;
@@ -77,36 +85,36 @@ class DSSearchFieldImpl extends Component {
         selected,
         additionalInfo
       });
-    });
+    };
 
-    _defineProperty(this, "handleConfirm", () => {
+    this.handleConfirm = () => {
       const {
         onConfirmField
       } = this.props;
       this.onChange();
       this.handleCloseModal();
       onConfirmField();
-    });
+    };
 
-    _defineProperty(this, "handleReject", () => {
+    this.handleReject = () => {
       const {
         onRejectField
       } = this.props;
       this.handleCloseModal();
       onRejectField();
-    });
+    };
 
-    _defineProperty(this, "handleOpenModal", () => {
+    this.handleOpenModal = () => {
       this.setState({
         openModal: true
       });
-    });
+    };
 
-    _defineProperty(this, "handleCloseModal", () => this.setState({
+    this.handleCloseModal = () => this.setState({
       openModal: false,
       selected: [],
       additionalInfo: []
-    }));
+    });
 
     advanceOption.label = props.searchOptionLabel;
     this.state = {
@@ -160,7 +168,7 @@ class DSSearchFieldImpl extends Component {
 
         if (props.data.isAdvance) {
           props.innerProps.onClick = this.handleOpenModal;
-          props.innerProps.className = `${props.innerProps.className} ${advanceOption.className}`;
+          props.innerProps.className = "".concat(props.innerProps.className, " ").concat(advanceOption.className);
         }
 
         return /*#__PURE__*/jsx(components.Option, _objectSpread({}, props));
@@ -181,11 +189,11 @@ class DSSearchFieldImpl extends Component {
     }
 
     return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread({}, containerProps), {}, {
-      className: `${cssClassName}`,
+      className: "".concat(cssClassName),
       children: [/*#__PURE__*/_jsx("div", {
-        className: `${classNameBlock('container-selector')}`
+        className: "".concat(classNameBlock('container-selector'))
       }, void 0, /*#__PURE__*/jsx(DSComboBox2, _objectSpread({
-        className: `${classNameElement('dropdown-field-selector')}`,
+        className: "".concat(classNameElement('dropdown-field-selector')),
         components: customComponents,
         onChange: this.onChangeDropdown,
         onKeyDown: this.onKeyDown,
@@ -194,7 +202,7 @@ class DSSearchFieldImpl extends Component {
         searchable: searchable
       }, customDropdownOptions)), useLookupIndicator && /*#__PURE__*/_jsx(LookupIndicator, {
         buttonType: "text",
-        className: `${classNameElement('btn-selector')} ${!value ? classNameModifier('btn-placeholder', 'btn-selector') : ''}`,
+        className: "".concat(classNameElement('btn-selector'), " ").concat(!value ? classNameModifier('btn-placeholder', 'btn-selector') : ''),
         onAdvanceSearchClick: this.handleOpenModal
       })), /*#__PURE__*/_jsx(ModalSearchField, {
         appElement: appElement,

package/esm/impl/components/AdvanceSearchOption/AdvanceSearchOption.js

@@ -1,16 +1,19 @@
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import 'react';
-import DSButton from '@elliemae/ds-basic/Button';
+import DSButton from '@elliemae/ds-button';
 
-const AdvanceSearchOption = ({
-  advanceSearchLabel = 'Advanced Search',
-  onAdvanceSearchClick = () => null
-}) => /*#__PURE__*/_jsx(DSButton, {
-  className: "advance-search-option-btn",
-  labelText: advanceSearchLabel,
-  onClick: onAdvanceSearchClick,
-  tabIndex: -1,
-  type: "button"
-});
+const AdvanceSearchOption = _ref => {
+  let {
+    advanceSearchLabel = 'Advanced Search',
+    onAdvanceSearchClick = () => null
+  } = _ref;
+  return /*#__PURE__*/_jsx(DSButton, {
+    className: "advance-search-option-btn",
+    labelText: advanceSearchLabel,
+    onClick: onAdvanceSearchClick,
+    tabIndex: -1,
+    type: "button"
+  });
+};
 
 export { AdvanceSearchOption as default };

package/esm/impl/components/LookupIndicator/LookupIndicator.js

@@ -1,24 +1,27 @@
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import 'react';
-import Search from '@elliemae/ds-icons/Search';
-import DSButton from '@elliemae/ds-basic/Button';
+import { Search } from '@elliemae/ds-icons';
+import DSButton from '@elliemae/ds-button';
 
 var _Search;
 
-const LookupIndicator = ({
-  onAdvanceSearchClick = () => null,
-  className = ''
-}) => /*#__PURE__*/_jsx(DSButton, {
-  "data-testid": "ds-searchfield-search-btn",
-  buttonType: "secondary",
-  className: className,
-  icon: _Search || (_Search = /*#__PURE__*/_jsx(Search, {})),
-  iconSize: "s",
-  onClick: e => {
-    e.stopPropagation();
-    e.preventDefault();
-    onAdvanceSearchClick();
-  }
-});
+const LookupIndicator = _ref => {
+  let {
+    onAdvanceSearchClick = () => null,
+    className = ''
+  } = _ref;
+  return /*#__PURE__*/_jsx(DSButton, {
+    "data-testid": "ds-searchfield-search-btn",
+    buttonType: "secondary",
+    className: className,
+    icon: _Search || (_Search = /*#__PURE__*/_jsx(Search, {})),
+    iconSize: "s",
+    onClick: e => {
+      e.stopPropagation();
+      e.preventDefault();
+      onAdvanceSearchClick();
+    }
+  });
+};
 
 export { LookupIndicator as default };

package/esm/impl/components/ModalSearchField/DataGridSearch.js

@@ -1,9 +1,15 @@
+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 _jsx from '@babel/runtime/helpers/esm/jsx';
 import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import 'core-js/modules/web.dom-collections.iterator.js';
 import { Component } from 'react';
-import DSToolbar, { ToolbarGroup } from '@elliemae/ds-basic/Toolbar';
-import DSSearchBox from '@elliemae/ds-basic/form/SearchBox';
+import DSToolbar, { ToolbarGroup } from '@elliemae/ds-toolbar';
+import { DSSearchBox } from '@elliemae/ds-form';
 import { DSDataGrid } from '@elliemae/ds-datagrids';
 import { uid } from 'uid';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
@@ -23,14 +29,14 @@ class DataGridSearch extends Component {
     this.handleFiltersChange = this.handleFiltersChange.bind(this);
   }
 
-  handleSearch(...args) {
+  handleSearch() {
     const {
       customDataGridOptions
     } = this.props;
     const {
       property,
       value
-    } = args[0];
+    } = arguments.length <= 0 ? undefined : arguments[0];
     const {
       filters
     } = this.state;
@@ -42,7 +48,7 @@ class DataGridSearch extends Component {
         id: uid(16)
       }]
     });
-    if (customDataGridOptions.onFiltersChange) customDataGridOptions.onFiltersChange(...args);
+    if (customDataGridOptions.onFiltersChange) customDataGridOptions.onFiltersChange(...arguments);
   }
 
   handleFiltersChange(nextFilters) {

package/esm/impl/components/ModalSearchField/ModalSearchField.js

@@ -1,68 +1,76 @@
 import _jsx from '@babel/runtime/helpers/esm/jsx';
+import 'core-js/modules/esnext.async-iterator.map.js';
+import 'core-js/modules/esnext.iterator.map.js';
 import 'react';
 import DSModal from '@elliemae/ds-modal';
-import { TabTypes, DSTabs, DSTab } from '@elliemae/ds-basic/Tabs';
+import { TabTypes, DSTabs, DSTab } from '@elliemae/ds-tabs';
 import DataGridSearch from './DataGridSearch.js';
 
-const ModalSearchField = ({
-  isOpen = false,
-  onClose = () => null,
-  modalTitle = 'Search Field ID',
-  modalSize = 'x-large',
-  tabsAnimated = true,
-  tabsEnableMouseEvents = true,
-  tabType = TabTypes.NORMAL,
-  tabData = [],
-  searchFilters = true,
-  searchGrid = false,
-  confirmLabel = 'Apply',
-  rejectLabel = 'Cancel',
-  modalType = 'confirm',
-  onConfirmField = () => null,
-  onRejectField = () => null,
-  handleSelect = () => null,
-  onTabChange = () => null,
-  appElement = null,
-  customDataGridOptions = {}
-}) => /*#__PURE__*/_jsx(DSModal, {
-  dataTestId: "ds-searchfield-modal",
-  appElement: appElement,
-  centered: false,
-  className: "modal-search-field",
-  confirmLabel: confirmLabel,
-  isOpen: isOpen,
-  modalTitle: modalTitle,
-  modalType: modalType,
-  onClose: onClose,
-  onConfirm: onConfirmField,
-  onReject: onRejectField,
-  rejectLabel: rejectLabel,
-  size: modalSize
-}, void 0, tabData.length > 0 && /*#__PURE__*/_jsx(DSTabs, {
-  animated: tabsAnimated,
-  enableMouseEvents: tabsEnableMouseEvents,
-  onlyRenderActiveTab: true,
-  onTabChange: onTabChange,
-  type: tabType
-}, void 0, tabData.map(({
-  tabId,
-  tabTitle,
-  columns,
-  rows,
-  boundFetchRows
-}) => /*#__PURE__*/_jsx(DSTab, {
-  className: "tab-content",
-  tabId: tabId,
-  title: tabTitle
-}, tabId, /*#__PURE__*/_jsx(DataGridSearch, {
-  boundFetchRows: boundFetchRows,
-  columns: columns,
-  customDataGridOptions: customDataGridOptions,
-  handleSelect: handleSelect,
-  id: `datagrid_search_field_${tabId}`,
-  rows: rows,
-  searchFilters: searchFilters,
-  searchGrid: searchGrid
-})))));
+const ModalSearchField = _ref => {
+  let {
+    isOpen = false,
+    onClose = () => null,
+    modalTitle = 'Search Field ID',
+    modalSize = 'x-large',
+    tabsAnimated = true,
+    tabsEnableMouseEvents = true,
+    tabType = TabTypes.NORMAL,
+    tabData = [],
+    searchFilters = true,
+    searchGrid = false,
+    confirmLabel = 'Apply',
+    rejectLabel = 'Cancel',
+    modalType = 'confirm',
+    onConfirmField = () => null,
+    onRejectField = () => null,
+    handleSelect = () => null,
+    onTabChange = () => null,
+    appElement = null,
+    customDataGridOptions = {}
+  } = _ref;
+  return /*#__PURE__*/_jsx(DSModal, {
+    dataTestId: "ds-searchfield-modal",
+    appElement: appElement,
+    centered: false,
+    className: "modal-search-field",
+    confirmLabel: confirmLabel,
+    isOpen: isOpen,
+    modalTitle: modalTitle,
+    modalType: modalType,
+    onClose: onClose,
+    onConfirm: onConfirmField,
+    onReject: onRejectField,
+    rejectLabel: rejectLabel,
+    size: modalSize
+  }, void 0, tabData.length > 0 && /*#__PURE__*/_jsx(DSTabs, {
+    animated: tabsAnimated,
+    enableMouseEvents: tabsEnableMouseEvents,
+    onlyRenderActiveTab: true,
+    onTabChange: onTabChange,
+    type: tabType
+  }, void 0, tabData.map(_ref2 => {
+    let {
+      tabId,
+      tabTitle,
+      columns,
+      rows,
+      boundFetchRows
+    } = _ref2;
+    return /*#__PURE__*/_jsx(DSTab, {
+      className: "tab-content",
+      tabId: tabId,
+      title: tabTitle
+    }, tabId, /*#__PURE__*/_jsx(DataGridSearch, {
+      boundFetchRows: boundFetchRows,
+      columns: columns,
+      customDataGridOptions: customDataGridOptions,
+      handleSelect: handleSelect,
+      id: "datagrid_search_field_".concat(tabId),
+      rows: rows,
+      searchFilters: searchFilters,
+      searchGrid: searchGrid
+    }));
+  })));
+};
 
 export { ModalSearchField as default };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-search-field",
-  "version": "2.0.0-alpha.1",
+  "version": "2.0.0-alpha.13",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Search Field",
   "module": "./esm/index.js",
@@ -56,19 +56,16 @@
     "build": "node ../../scripts/build/build.js"
   },
   "dependencies": {
-    "@elliemae/ds-basic": "2.0.0-alpha.1",
-    "@elliemae/ds-classnames": "2.0.0-alpha.1",
-    "@elliemae/ds-utilities": "2.0.0-alpha.1",
-    "react-edit": "~6.4.1",
-    "react-scroll-sync": "~0.8.0",
-    "react-select": "4.3.1",
-    "reactabular": "~8.3.0",
-    "reactabular-resizable": "~8.18.0",
-    "reactabular-table": "~8.14.0",
-    "searchtabular": "~1.9.0",
-    "sortabular": "~1.6.0",
-    "table-resolver": "~4.1.1",
-    "treetabular": "~3.6.0",
+    "@elliemae/ds-button": "2.0.0-alpha.13",
+    "@elliemae/ds-classnames": "2.0.0-alpha.13",
+    "@elliemae/ds-datagrids": "2.0.0-alpha.13",
+    "@elliemae/ds-form": "2.0.0-alpha.13",
+    "@elliemae/ds-icons": "2.0.0-alpha.13",
+    "@elliemae/ds-modal": "2.0.0-alpha.13",
+    "@elliemae/ds-tabs": "2.0.0-alpha.13",
+    "@elliemae/ds-toolbar": "2.0.0-alpha.13",
+    "react-desc": "~4.1.3",
+    "react-select": "~4.3.0",
     "uid": "~2.0.0"
   },
   "publishConfig": {