@jetbrains/ring-ui 4.1.0-beta.9 → 4.1.1

package/dist/select/select__filter.js

@@ -1,49 +0,0 @@
-import '../_helpers/_rollupPluginBabelHelpers.js';
-import 'react';
-import 'prop-types';
-import 'classnames';
-import '../input/input.js';
-import '../global/sniffer.js';
-import '../list/list.js';
-export { S as default } from '../_helpers/select__filter.js';
-import '@jetbrains/icons/close';
-import '../global/theme.js';
-import '../button/button.js';
-import 'focus-visible';
-import '@jetbrains/icons/chevron-10px';
-import '../icon/icon.js';
-import 'util-deprecate';
-import '../icon/icon__constants.js';
-import '../_helpers/icon__svg.js';
-import '../global/memoize.js';
-import '../link/clickableLink.js';
-import '../_helpers/button__classes.js';
-import '../global/get-uid.js';
-import 'sniffr';
-import 'react-virtualized/dist/es/List';
-import 'react-virtualized/dist/es/AutoSizer';
-import 'react-virtualized/dist/es/WindowScroller';
-import 'react-virtualized/dist/es/CellMeasurer';
-import 'memoize-one';
-import '../global/data-tests.js';
-import '../global/schedule-raf.js';
-import '../global/dom.js';
-import '../shortcuts/shortcuts.js';
-import '../shortcuts/core.js';
-import 'combokeys';
-import '../global/create-stateful-context.js';
-import '../list/list__link.js';
-import '../link/link.js';
-import '../_helpers/list.js';
-import '../list/list__item.js';
-import '../avatar/avatar.js';
-import '../global/url.js';
-import '../checkbox/checkbox.js';
-import '@jetbrains/icons/checkmark';
-import '@jetbrains/icons/remove-10px';
-import '../list/list__custom.js';
-import '../global/get-event-key.js';
-import '../list/list__title.js';
-import '../list/list__separator.js';
-import '../list/list__hint.js';
-import '../list/consts.js';

package/dist/select/select__popup.js

@@ -1,541 +0,0 @@
-import { _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
-import React, { PureComponent } from 'react';
-import classNames from 'classnames';
-import searchIcon from '@jetbrains/icons/search';
-import memoizeOne from 'memoize-one';
-import PropTypes from 'prop-types';
-import Icon from '../icon/icon.js';
-import Popup, { getPopupContainer } from '../popup/popup.js';
-import { maxHeightForDirection } from '../popup/position.js';
-import { PopupTargetContext } from '../popup/popup.target.js';
-import List from '../list/list.js';
-import LoaderInline from '../loader-inline/loader-inline.js';
-import shortcutsHOC from '../shortcuts/shortcuts-hoc.js';
-import { getStyles } from '../global/dom.js';
-import getUID from '../global/get-uid.js';
-import memoize from '../global/memoize.js';
-import TagsList from '../tags-list/tags-list.js';
-import Caret from '../caret/caret.js';
-import Shortcuts from '../shortcuts/shortcuts.js';
-import Button from '../button/button.js';
-import Text from '../text/text.js';
-import { DEFAULT_DIRECTIONS } from '../popup/popup.consts.js';
-import { m as modules_b607bec2, S as SelectFilter } from '../_helpers/select__filter.js';
-import 'util-deprecate';
-import '../icon/icon__constants.js';
-import '../_helpers/icon__svg.js';
-import 'react-dom';
-import '../global/schedule-raf.js';
-import '../global/data-tests.js';
-import '../tab-trap/tab-trap.js';
-import '../shortcuts/core.js';
-import 'combokeys';
-import '../global/sniffer.js';
-import 'sniffr';
-import 'react-virtualized/dist/es/List';
-import 'react-virtualized/dist/es/AutoSizer';
-import 'react-virtualized/dist/es/WindowScroller';
-import 'react-virtualized/dist/es/CellMeasurer';
-import '../global/create-stateful-context.js';
-import '../list/list__link.js';
-import '../link/link.js';
-import 'focus-visible';
-import '../link/clickableLink.js';
-import '../_helpers/list.js';
-import '../list/list__item.js';
-import '../avatar/avatar.js';
-import '../global/url.js';
-import '../checkbox/checkbox.js';
-import '@jetbrains/icons/checkmark';
-import '@jetbrains/icons/remove-10px';
-import '../list/list__custom.js';
-import '../global/get-event-key.js';
-import '../list/list__title.js';
-import '../list/list__separator.js';
-import '../list/list__hint.js';
-import '../list/consts.js';
-import '../global/theme.js';
-import '../_helpers/inject-styles.js';
-import '../global/conic-gradient.js';
-import 'conic-gradient';
-import '../global/supports-css.js';
-import '../global/inject-styles.js';
-import '../global/radial-gradient-mask.js';
-import '../tag/tag.js';
-import '@jetbrains/icons/close';
-import '@jetbrains/icons/chevron-10px';
-import '../_helpers/button__classes.js';
-import '../input/input.js';
-
-const INPUT_MARGIN_COMPENSATION = -14;
-const FILTER_HEIGHT = 35;
-const TOOLBAR_HEIGHT = 49;
-
-function noop() {}
-
-const FilterWithShortcuts = shortcutsHOC(SelectFilter);
-class SelectPopup extends PureComponent {
-  constructor() {
-    super(...arguments);
-
-    _defineProperty(this, "state", {
-      popupFilterShortcutsOptions: {
-        modal: true,
-        disabled: true
-      },
-      tagsActiveIndex: null
-    });
-
-    _defineProperty(this, "isClickingPopup", false);
-
-    _defineProperty(this, "onFilterFocus", () => {
-      this._togglePopupFilterShortcuts(false);
-
-      this.setState({
-        tagsActiveIndex: null
-      });
-    });
-
-    _defineProperty(this, "popupFilterOnBlur", () => {
-      if (this.state.tagsActiveIndex === null) {
-        this._togglePopupFilterShortcuts(true);
-      }
-    });
-
-    _defineProperty(this, "mouseDownHandler", () => {
-      this.isClickingPopup = true;
-    });
-
-    _defineProperty(this, "mouseUpHandler", () => {
-      this.isClickingPopup = false;
-    });
-
-    _defineProperty(this, "onListSelect", (selected, event, opts) => {
-      const getSelectItemEvent = () => {
-        let customEvent;
-
-        if (document.createEvent) {
-          customEvent = document.createEvent('Event');
-          customEvent.initEvent('select', true, false);
-        }
-
-        if (event && event.persist) {
-          event.persist();
-        }
-
-        customEvent.originalEvent = event;
-        return customEvent;
-      };
-
-      this.props.onSelect(selected, getSelectItemEvent(), opts);
-    });
-
-    _defineProperty(this, "tabPress", event => {
-      this.props.onCloseAttempt(event, true);
-    });
-
-    _defineProperty(this, "onClickHandler", () => this.filter.focus());
-
-    _defineProperty(this, "handleRemoveTag", memoize(tag => event => this.removeTag(tag, event)));
-
-    _defineProperty(this, "handleTagClick", memoize(tag => () => {
-      this.setState({
-        tagsActiveIndex: this.props.selected.indexOf(tag)
-      });
-    }));
-
-    _defineProperty(this, "handleListResize", () => {
-      this.forceUpdate();
-    });
-
-    _defineProperty(this, "handleSelectAll", () => this.props.onSelectAll(this.props.data.filter(item => !item.disabled).length !== this.props.selected.length));
-
-    _defineProperty(this, "getSelectAll", () => {
-      const activeFilters = this.props.data.filter(item => !item.disabled);
-      return /*#__PURE__*/React.createElement("div", {
-        className: modules_b607bec2.selectAll
-      }, activeFilters.length === 0 ? /*#__PURE__*/React.createElement("span", null) : /*#__PURE__*/React.createElement(Button, {
-        text: true,
-        inline: true,
-        onClick: this.handleSelectAll
-      }, activeFilters.length !== this.props.selected.length ? 'Select all' : 'Deselect all'), /*#__PURE__*/React.createElement(Text, {
-        info: true
-      }, `${this.props.selected.length} selected`));
-    });
-
-    _defineProperty(this, "_adjustListMaxHeight", memoizeOne((hidden, userDefinedMaxHeight, ringPopupTarget) => {
-      if (hidden) {
-        return userDefinedMaxHeight;
-      } // Calculate list's maximum height that can't
-      // get beyond the screen
-      // @see RG-1838, JT-48358
-
-
-      const minMaxHeight = 100;
-      const directions = this.props.directions || DEFAULT_DIRECTIONS; // Note:
-      // Create a method which'll be called only when the popup opens and before
-      // render the list would be a better way
-
-      const anchorNode = this.props.anchorElement;
-      const containerNode = getPopupContainer(ringPopupTarget) || document.documentElement;
-      return Math.min(directions.reduce((maxHeight, direction) => Math.max(maxHeight, maxHeightForDirection(direction, anchorNode, getStyles(containerNode).position !== 'static' ? containerNode : null)), minMaxHeight), userDefinedMaxHeight);
-    }));
-
-    _defineProperty(this, "popupRef", el => {
-      this.popup = el;
-    });
-
-    _defineProperty(this, "listRef", el => {
-      this.list = el;
-    });
-
-    _defineProperty(this, "filterRef", el => {
-      this.filter = el;
-      this.caret = new Caret(this.filter);
-    });
-
-    _defineProperty(this, "shortcutsScope", getUID('select-popup-'));
-
-    _defineProperty(this, "shortcutsMap", {
-      tab: this.tabPress
-    });
-
-    _defineProperty(this, "popupFilterShortcuts", {
-      map: {
-        up: event => this.list && this.list.upHandler(event),
-        down: event => this.list && this.list.downHandler(event),
-        home: event => this.list && this.list.homeHandler(event),
-        end: event => this.list && this.list.endHandler(event),
-        enter: event => this.list ? this.list.enterHandler(event) : this.props.onEmptyPopupEnter(event),
-        esc: event => this.props.onCloseAttempt(event, true),
-        tab: event => this.tabPress(event),
-        backspace: event => this.handleBackspace(event),
-        del: () => this.removeSelectedTag(),
-        left: () => this.handleNavigation(true),
-        right: () => this.handleNavigation()
-      }
-    });
-  }
-
-  componentDidMount() {
-    window.document.addEventListener('mouseup', this.mouseUpHandler);
-  }
-
-  componentWillUnmount() {
-    window.document.removeEventListener('mouseup', this.mouseUpHandler);
-  }
-
-  // This flag is set to true while an item in the popup is being clicked
-  focusFilter() {
-    setTimeout(() => this.filter.focus());
-  }
-
-  isEventTargetFilter(event) {
-    return event.target && event.target.matches('input,textarea');
-  }
-
-  handleNavigation(navigateLeft) {
-    if (this.isEventTargetFilter(event) && this.caret.getPosition() > 0) {
-      return;
-    }
-
-    let newIndex = null;
-
-    if (navigateLeft) {
-      newIndex = this.state.tagsActiveIndex === null ? this.props.selected.length - 1 : this.state.tagsActiveIndex - 1;
-    } else if (this.state.tagsActiveIndex !== null) {
-      newIndex = this.state.tagsActiveIndex + 1;
-    }
-
-    if (newIndex !== null && (newIndex >= this.props.selected.length || newIndex < 0)) {
-      newIndex = null;
-      this.focusFilter();
-    }
-
-    this.setState({
-      tagsActiveIndex: newIndex
-    });
-  }
-
-  removeTag(tag, event) {
-    const _tag = tag || this.props.selected.slice(0)[this.props.selected.length - 1];
-
-    if (_tag) {
-      this.onListSelect(_tag, event, {
-        tryKeepOpen: true
-      });
-      this.setState({
-        tagsActiveIndex: null
-      });
-      this.focusFilter();
-    }
-  }
-
-  removeSelectedTag() {
-    if (this.state.tagsActiveIndex != null) {
-      this.removeTag(this.props.selected[this.state.tagsActiveIndex]);
-      return false;
-    }
-
-    return true;
-  }
-
-  handleBackspace(event) {
-    if (!this.props.tags) {
-      return true;
-    }
-
-    if (!this.isEventTargetFilter(event)) {
-      this.removeSelectedTag();
-      return false;
-    }
-
-    if (!event.target.value) {
-      this.removeTag();
-      return false;
-    }
-
-    return true;
-  }
-
-  _togglePopupFilterShortcuts(shortcutsDisabled) {
-    this.setState({
-      popupFilterShortcutsOptions: {
-        modal: true,
-        disabled: shortcutsDisabled
-      }
-    });
-  }
-
-  isVisible() {
-    return this.popup && this.popup.isVisible();
-  }
-
-  getFilter() {
-    if (this.props.filter || this.props.tags) {
-      return /*#__PURE__*/React.createElement("div", {
-        className: modules_b607bec2.filterWrapper,
-        "data-test": "ring-select-popup-filter"
-      }, /*#__PURE__*/React.createElement(Icon, {
-        glyph: searchIcon,
-        className: modules_b607bec2.filterIcon,
-        "data-test-custom": "ring-select-popup-filter-icon"
-      }), /*#__PURE__*/React.createElement(FilterWithShortcuts, {
-        rgShortcutsOptions: this.state.popupFilterShortcutsOptions,
-        rgShortcutsMap: this.popupFilterShortcuts.map,
-        value: this.props.filterValue,
-        inputRef: this.filterRef,
-        onBlur: this.popupFilterOnBlur,
-        onFocus: this.onFilterFocus,
-        className: "ring-js-shortcuts",
-        placeholder: this.props.filter.placeholder,
-        onChange: this.props.onFilter,
-        onClick: this.onClickHandler,
-        onClear: this.props.onClear,
-        "data-test-custom": "ring-select-popup-filter-input",
-        listId: this.props.listId,
-        enableShortcuts: Object.keys(this.popupFilterShortcuts.map)
-      }));
-    }
-
-    return null;
-  }
-
-  getTags() {
-    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(TagsList, {
-      tags: this.props.selected,
-      activeIndex: this.state.tagsActiveIndex,
-      handleRemove: this.handleRemoveTag,
-      handleClick: this.handleTagClick,
-      disabled: this.props.disabled
-    }));
-  }
-
-  getFilterWithTags() {
-    if (this.props.tags) {
-      const classes = classNames([modules_b607bec2.filterWithTags, {
-        [modules_b607bec2.filterWithTagsFocused]: !this.state.popupFilterShortcutsOptions.disabled
-      }]);
-      return /*#__PURE__*/React.createElement("div", {
-        className: classes
-      }, this.getTags(), this.getFilter());
-    }
-
-    return this.getFilter();
-  }
-
-  getBottomLine() {
-    const {
-      loading,
-      message
-    } = this.props;
-    return (loading || message) && /*#__PURE__*/React.createElement("div", {
-      className: modules_b607bec2.bottomLine
-    }, loading && /*#__PURE__*/React.createElement(LoaderInline, null), message && /*#__PURE__*/React.createElement("div", {
-      className: modules_b607bec2.message
-    }, message));
-  }
-
-  getList(ringPopupTarget) {
-    if (this.props.data.length) {
-      let {
-        maxHeight
-      } = this.props;
-
-      if (this.props.anchorElement) {
-        maxHeight = this._adjustListMaxHeight(this.props.hidden, maxHeight, ringPopupTarget);
-      }
-
-      if (this.props.filter) {
-        maxHeight -= FILTER_HEIGHT;
-      }
-
-      if (this.props.toolbar) {
-        maxHeight -= TOOLBAR_HEIGHT;
-      }
-
-      return /*#__PURE__*/React.createElement(List, {
-        id: this.props.listId,
-        maxHeight: maxHeight,
-        data: this.props.data,
-        activeIndex: this.props.activeIndex,
-        ref: this.listRef,
-        restoreActiveIndex: true,
-        activateFirstItem: true,
-        onSelect: this.onListSelect,
-        onResize: this.handleListResize,
-        onScrollToBottom: this.props.onLoadMore,
-        hidden: this.props.hidden,
-        shortcuts: !this.props.hidden,
-        disableMoveOverflow: this.props.disableMoveOverflow,
-        disableMoveDownOverflow: this.props.loading,
-        disableScrollToActive: this.props.disableScrollToActive,
-        compact: this.props.compact,
-        renderOptimization: this.props.renderOptimization
-      });
-    }
-
-    return null;
-  }
-
-  render() {
-    const {
-      toolbar,
-      className,
-      multiple,
-      hidden,
-      isInputMode,
-      anchorElement,
-      minWidth,
-      onCloseAttempt,
-      directions,
-      top,
-      left,
-      style,
-      dir,
-      filter
-    } = this.props;
-    const classes = classNames(modules_b607bec2.popup, className);
-    return /*#__PURE__*/React.createElement(PopupTargetContext.Consumer, null, ringPopupTarget => {
-      const filterWithTags = this.getFilterWithTags();
-      const selectAll = multiple && !multiple.limit && multiple.selectAll && this.getSelectAll();
-      const list = this.getList(this.props.ringPopupTarget || ringPopupTarget);
-      const bottomLine = this.getBottomLine();
-      const hasContent = filterWithTags || selectAll || list || bottomLine || toolbar;
-      return /*#__PURE__*/React.createElement(Popup, {
-        trapFocus: false,
-        ref: this.popupRef,
-        hidden: hidden || !hasContent,
-        attached: isInputMode,
-        className: classes,
-        dontCloseOnAnchorClick: true,
-        anchorElement: anchorElement,
-        minWidth: minWidth,
-        onCloseAttempt: onCloseAttempt,
-        directions: directions,
-        top: top || (isInputMode ? INPUT_MARGIN_COMPENSATION : null),
-        left: left,
-        onMouseDown: this.mouseDownHandler,
-        target: this.props.ringPopupTarget,
-        autoCorrectTopOverflow: false,
-        style: style
-      }, /*#__PURE__*/React.createElement("div", {
-        dir: dir
-      }, !hidden && filter && /*#__PURE__*/React.createElement(Shortcuts, {
-        map: this.shortcutsMap,
-        scope: this.shortcutsScope
-      }), hidden ? /*#__PURE__*/React.createElement("div", null) : filterWithTags, selectAll, list, bottomLine, toolbar));
-    });
-  }
-
-}
-
-_defineProperty(SelectPopup, "propTypes", {
-  activeIndex: PropTypes.number,
-  anchorElement: PropTypes.instanceOf(HTMLElement),
-  className: PropTypes.string,
-  compact: PropTypes.bool,
-  data: PropTypes.array,
-  dir: PropTypes.oneOf(['ltr', 'rtl']),
-  directions: PropTypes.array,
-  disabled: PropTypes.bool,
-  disableMoveOverflow: PropTypes.bool,
-  disableScrollToActive: PropTypes.bool,
-  filter: PropTypes.oneOfType([PropTypes.bool, PropTypes.shape({
-    value: PropTypes.string,
-    placeholder: PropTypes.string
-  })]),
-  filterValue: PropTypes.string,
-  hidden: PropTypes.bool,
-  isInputMode: PropTypes.bool,
-  listId: PropTypes.string,
-  maxHeight: PropTypes.number,
-  message: PropTypes.string,
-  minWidth: PropTypes.number,
-  multiple: PropTypes.oneOfType([PropTypes.bool, PropTypes.shape({
-    label: PropTypes.string,
-    limit: PropTypes.number,
-    selectAll: PropTypes.bool
-  })]),
-  left: PropTypes.bool,
-  loading: PropTypes.bool,
-  onClear: PropTypes.func,
-  onCloseAttempt: PropTypes.func,
-  onEmptyPopupEnter: PropTypes.func,
-  onFilter: PropTypes.func,
-  onLoadMore: PropTypes.func,
-  onSelect: PropTypes.func,
-  onSelectAll: PropTypes.func,
-  renderOptimization: PropTypes.bool,
-  ringPopupTarget: PropTypes.string,
-  selected: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
-  style: PropTypes.object,
-  tags: PropTypes.object,
-  toolbar: PropTypes.node,
-  top: PropTypes.number
-});
-
-_defineProperty(SelectPopup, "defaultProps", {
-  data: [],
-  activeIndex: null,
-  toolbar: null,
-  filter: false,
-  multiple: false,
-  message: null,
-  anchorElement: null,
-  maxHeight: 600,
-  minWidth: 240,
-  loading: false,
-  onSelect: noop,
-  onCloseAttempt: noop,
-  onFilter: noop,
-  onClear: noop,
-  onLoadMore: noop,
-  selected: [],
-  tags: null,
-  ringPopupTarget: null,
-  onSelectAll: noop,
-  onEmptyPopupEnter: noop
-});
-
-export default SelectPopup;