@elliemae/ds-search-field 2.3.1 → 3.0.0-alpha.3

package/esm/impl/DSSeachFieldImpl.js

@@ -1,234 +0,0 @@
-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-form';
-import ModalSearchField from './components/ModalSearchField/ModalSearchField.js';
-export { default as DSModalSearchField } from './components/ModalSearchField/ModalSearchField.js';
-import AdvanceSearchOption from './components/AdvanceSearchOption/AdvanceSearchOption.js';
-import LookupIndicator from './components/LookupIndicator/LookupIndicator.js';
-import { jsxs, 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; }
-const advanceOption = {
-  className: 'advanced-search-option',
-  label: 'Advanced search',
-  value: 'search-field-advance-option',
-  isAdvance: true
-};
-const {
-  cssClassName,
-  classNameElement,
-  classNameModifier,
-  classNameBlock
-} = convertPropToCssClassName('query-builder-addon-search-field');
-
-class DSSearchFieldImpl extends Component {
-  constructor(props) {
-    super(props);
-
-    this.onChange = () => {
-      const {
-        selected: id,
-        additionalInfo: [row]
-      } = this.state;
-      const {
-        onChange
-      } = this.props;
-      onChange(id, row);
-    };
-
-    this.onChangeDropdown = value => {
-      const {
-        dropdownOptions
-      } = this.props;
-      const selected = dropdownOptions.find(op => op.value === value);
-      const {
-        onChange,
-        displayProperty
-      } = this.props;
-      if (selected) onChange(value, {
-        [displayProperty]: selected.label
-      });
-    };
-
-    this.onKeyDown = event => {
-      setTimeout(() => {
-        const {
-          keycode
-        } = event;
-        const {
-          value
-        } = this.props;
-        if (value && keycode === 13) this.handleCloseModal();
-      }, 0);
-    };
-
-    this.handleSelect = (selectedRow, rows) => {
-      let selected = selectedRow; // fix new datagrid callback format
-
-      if (!selected) return;
-      if (selected.id) selected = selected.id;else if (selected[0] && selected[0].id) selected = selected[0].id;
-      const additionalInfo = rows.filter(row => selected === row.id);
-      this.setState({
-        selected,
-        additionalInfo
-      });
-    };
-
-    this.handleConfirm = () => {
-      const {
-        onConfirmField
-      } = this.props;
-      this.onChange();
-      this.handleCloseModal();
-      onConfirmField();
-    };
-
-    this.handleReject = () => {
-      const {
-        onRejectField
-      } = this.props;
-      this.handleCloseModal();
-      onRejectField();
-    };
-
-    this.handleOpenModal = () => {
-      this.setState({
-        openModal: true
-      });
-    };
-
-    this.handleCloseModal = () => this.setState({
-      openModal: false,
-      selected: [],
-      additionalInfo: []
-    });
-
-    advanceOption.label = props.searchOptionLabel;
-    this.state = {
-      openModal: false,
-      selected: null,
-      additionalInfo: []
-    };
-  }
-
-  render() {
-    const {
-      placeholder,
-      modalTitle,
-      modalSize,
-      tabsAnimated,
-      tabsEnableMouseEvents,
-      tabType,
-      tabData,
-      searchFilters,
-      searchGrid,
-      confirmLabel,
-      rejectLabel,
-      modalType,
-      appElement,
-      value,
-      additionalInfo,
-      displayProperty,
-      dropdownOptions,
-      searchOptionLabel,
-      customDataGridOptions,
-      customDropdownOptions,
-      useLookupIndicator,
-      onTabChange,
-      containerProps,
-      searchable
-    } = this.props;
-    const {
-      openModal
-    } = this.state;
-    let options = [...dropdownOptions, advanceOption];
-    let displayValue = !value ? placeholder : value;
-    if (additionalInfo && additionalInfo[displayProperty]) displayValue = additionalInfo[displayProperty];
-    const defaultoption = {
-      value,
-      label: displayValue
-    };
-    const customComponents = {
-      Option: props => {
-        // return <AdvanceSearchOption onAdvanceSearchClick={this.handleOpenModal} />
-        props.innerProps.className = 'em-ds-combobox__option';
-
-        if (props.data.isAdvance) {
-          props.innerProps.onClick = this.handleOpenModal;
-          props.innerProps.className = "".concat(props.innerProps.className, " ").concat(advanceOption.className);
-        }
-
-        return /*#__PURE__*/jsx(components.Option, _objectSpread({}, props));
-      },
-      IndicatorSeparator: () => null,
-      NoOptionsMessage: props => /*#__PURE__*/jsx(AdvanceSearchOption, _objectSpread({
-        advanceSearchLabel: searchOptionLabel,
-        onAdvanceSearchClick: this.handleOpenModal
-      }, props))
-    };
-
-    if (useLookupIndicator) {
-      customComponents.DropdownIndicator = () => null;
-    }
-
-    if (!options.find(o => o.value === defaultoption.value)) {
-      options = [defaultoption, ...options];
-    }
-
-    return /*#__PURE__*/jsxs("div", _objectSpread(_objectSpread({}, containerProps), {}, {
-      className: "".concat(cssClassName),
-      children: [/*#__PURE__*/_jsx("div", {
-        className: "".concat(classNameBlock('container-selector'))
-      }, void 0, /*#__PURE__*/jsx(DSComboBox2, _objectSpread({
-        className: "".concat(classNameElement('dropdown-field-selector')),
-        components: customComponents,
-        onChange: this.onChangeDropdown,
-        onKeyDown: this.onKeyDown,
-        options: options,
-        value: value,
-        searchable: searchable
-      }, customDropdownOptions)), useLookupIndicator && /*#__PURE__*/_jsx(LookupIndicator, {
-        buttonType: "text",
-        className: "".concat(classNameElement('btn-selector'), " ").concat(!value ? classNameModifier('btn-placeholder', 'btn-selector') : ''),
-        onAdvanceSearchClick: this.handleOpenModal
-      })), /*#__PURE__*/_jsx(ModalSearchField, {
-        appElement: appElement,
-        confirmLabel: confirmLabel,
-        customDataGridOptions: customDataGridOptions,
-        handleSelect: this.handleSelect,
-        isOpen: openModal,
-        modalSize: modalSize,
-        modalTitle: modalTitle,
-        modalType: modalType,
-        onClose: this.handleCloseModal,
-        onConfirmField: this.handleConfirm,
-        onRejectField: this.handleReject,
-        onTabChange: onTabChange,
-        placeholder: placeholder,
-        rejectLabel: rejectLabel,
-        searchFilters: searchFilters,
-        searchGrid: searchGrid,
-        tabData: tabData,
-        tabsAnimated: tabsAnimated,
-        tabsEnableMouseEvents: tabsEnableMouseEvents,
-        tabType: tabType
-      })]
-    }));
-  }
-
-}
-
-export { DSSearchFieldImpl as default };

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

@@ -1,19 +0,0 @@
-import _jsx from '@babel/runtime/helpers/esm/jsx';
-import 'react';
-import DSButton from '@elliemae/ds-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,27 +0,0 @@
-import _jsx from '@babel/runtime/helpers/esm/jsx';
-import 'react';
-import { Search } from '@elliemae/ds-icons';
-import DSButton from '@elliemae/ds-button';
-
-var _Search;
-
-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,108 +0,0 @@
-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-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';
-
-const _excluded = ["onFiltersChange"];
-
-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 DataGridSearch extends Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      filters: props.filters || []
-    };
-    this.handleSearch = this.handleSearch.bind(this);
-    this.handleFiltersChange = this.handleFiltersChange.bind(this);
-  }
-
-  handleSearch() {
-    const {
-      customDataGridOptions
-    } = this.props;
-    const {
-      property,
-      value
-    } = arguments.length <= 0 ? undefined : arguments[0];
-    const {
-      filters
-    } = this.state;
-    this.setState({
-      filters: [...filters, {
-        group: property,
-        label: 'All',
-        value,
-        id: uid(16)
-      }]
-    });
-    if (customDataGridOptions.onFiltersChange) customDataGridOptions.onFiltersChange(...arguments);
-  }
-
-  handleFiltersChange(nextFilters) {
-    const {
-      customDataGridOptions
-    } = this.props;
-    this.setState({
-      filters: nextFilters
-    });
-    if (customDataGridOptions.onFiltersChange) customDataGridOptions.onFiltersChange(nextFilters);
-  }
-
-  render() {
-    const {
-      id,
-      rows,
-      columns,
-      boundFetchRows,
-      searchFilters,
-      searchGrid = true,
-      customDataGridOptions,
-      handleSelect
-    } = this.props;
-
-    const restCustomDataGridOptions = _objectWithoutProperties(customDataGridOptions, _excluded);
-
-    const {
-      filters
-    } = this.state;
-    return /*#__PURE__*/jsxs(Fragment, {
-      children: [/*#__PURE__*/_jsx(DSToolbar, {
-        withDepth: false
-      }, void 0, /*#__PURE__*/_jsx(ToolbarGroup, {}, void 0, /*#__PURE__*/_jsx(DSSearchBox, {
-        cleanOnSearch: true,
-        onSearch: this.handleSearch,
-        placeholder: "Search all"
-      }))), /*#__PURE__*/_jsx("div", {
-        className: "datagrid-tab-content"
-      }, void 0, /*#__PURE__*/jsx(DSDataGrid, _objectSpread({
-        columns: columns,
-        filters: filters,
-        fluidHeight: true,
-        getData: boundFetchRows,
-        id: id,
-        onFiltersChange: this.handleFiltersChange,
-        onSelectRow: rowId => handleSelect(rowId, rows),
-        rows: rows,
-        searchFilters: searchFilters,
-        searchGrid: searchGrid,
-        selectable: true
-      }, restCustomDataGridOptions)))]
-    });
-  }
-
-}
-
-export { DataGridSearch as default };

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

@@ -1,76 +0,0 @@
-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-tabs';
-import DataGridSearch from './DataGridSearch.js';
-
-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/esm/index.js

@@ -1,2 +0,0 @@
-export { DSSearchFieldWithSchema, default } from './DSSearchField.js';
-export { default as DSModalSearchField } from './impl/components/ModalSearchField/ModalSearchField.js';