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

package/dist/tags-input/tags-input.js

@@ -1,474 +0,0 @@
-import { _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
-import React, { PureComponent, Component } from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import getEventKey from '../global/get-event-key.js';
-import Select from '../select/select.js';
-import TagsList from '../tags-list/tags-list.js';
-import Caret from '../caret/caret.js';
-import memoize from '../global/memoize.js';
-import rerenderHOC from '../global/rerender-hoc.js';
-import '@jetbrains/icons/chevron-10px';
-import '@jetbrains/icons/close';
-import 'deep-equal';
-import '../dropdown/dropdown.js';
-import '../global/data-tests.js';
-import '../_helpers/anchor.js';
-import '../icon/icon.js';
-import 'util-deprecate';
-import '../icon/icon__constants.js';
-import '../_helpers/icon__svg.js';
-import '../button/button.js';
-import 'focus-visible';
-import '../global/theme.js';
-import '../link/clickableLink.js';
-import '../_helpers/button__classes.js';
-import '../avatar/avatar.js';
-import '../global/url.js';
-import '../global/dom.js';
-import '../popup/popup.js';
-import 'react-dom';
-import '../global/get-uid.js';
-import '../global/schedule-raf.js';
-import '../shortcuts/shortcuts.js';
-import '../shortcuts/core.js';
-import 'combokeys';
-import '../global/sniffer.js';
-import 'sniffr';
-import '../tab-trap/tab-trap.js';
-import '../popup/position.js';
-import '../popup/popup.consts.js';
-import '../popup/popup.target.js';
-import '../list/list.js';
-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/create-stateful-context.js';
-import '../list/list__link.js';
-import '../link/link.js';
-import '../_helpers/list.js';
-import '../list/list__item.js';
-import '../checkbox/checkbox.js';
-import '@jetbrains/icons/checkmark';
-import '@jetbrains/icons/remove-10px';
-import '../list/list__custom.js';
-import '../list/list__title.js';
-import '../list/list__separator.js';
-import '../list/list__hint.js';
-import '../list/consts.js';
-import '../input/input.js';
-import '../global/fuzzy-highlight.js';
-import '../select/select__popup.js';
-import '@jetbrains/icons/search';
-import '../loader-inline/loader-inline.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 '../shortcuts/shortcuts-hoc.js';
-import '../text/text.js';
-import '../_helpers/select__filter.js';
-import '../tag/tag.js';
-
-var modules_5aa8aaf3 = {"tagsInput":"tagsInput_tagsInput__3bf16b19","tagsInputLegacyMode":"tagsInput_tagsInputLegacyMode__3bf16b19","tagsList":"tagsInput_tagsList__3bf16b19","tag":"tagsInput_tag__3bf16b19","tagsInputDisabled":"tagsInput_tagsInputDisabled__3bf16b19","underline":"tagsInput_underline__3bf16b19","tagsInputFocused":"tagsInput_tagsInputFocused__3bf16b19","tagsSelect":"tagsInput_tagsSelect__3bf16b19","focusUnderline":"tagsInput_focusUnderline__3bf16b19"};
-
-function noop() {}
-/**
- * @name Tags Input
- */
-
-
-const POPUP_VERTICAL_SHIFT = 2;
-class TagsInput extends PureComponent {
-  constructor() {
-    var _this;
-
-    super(...arguments);
-    _this = this;
-
-    _defineProperty(this, "state", {
-      tags: [],
-      prevTags: null,
-      suggestions: [],
-      loading: true,
-      focused: false,
-      query: '',
-      activeIndex: 0
-    });
-
-    _defineProperty(this, "nodeRef", node => {
-      this.node = node;
-    });
-
-    _defineProperty(this, "ngModelStateField", TagsInput.ngModelStateField);
-
-    _defineProperty(this, "focusInput", () => {
-      this.getInputNode().focus();
-    });
-
-    _defineProperty(this, "addTag", tag => {
-      const isUniqueTag = this.state.tags.filter(item => tag.key === item.key).length === 0;
-      this.select.clear();
-      this.select.filterValue('');
-
-      if (isUniqueTag) {
-        this.setState(prevState => ({
-          tags: prevState.tags.concat([tag])
-        }));
-        this.props.onAddTag({
-          tag
-        });
-        this.setActiveIndex();
-      }
-    });
-
-    _defineProperty(this, "clickHandler", event => {
-      if (event.target !== this.node) {
-        return;
-      }
-
-      this.loadSuggestions(this.getInputNode().value);
-      this.focusInput();
-    });
-
-    _defineProperty(this, "filterExistingTags", suggestions => {
-      const tagsMap = new Map(this.state.tags.map(tag => [tag.key, tag]));
-      return suggestions.filter(suggestion => !tagsMap.has(suggestion.key));
-    });
-
-    _defineProperty(this, "loadSuggestions", function () {
-      let query = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
-      return _this.setState({
-        loading: true,
-        query
-      }, async () => {
-        try {
-          let allSuggestions = _this.props.dataSource({
-            query
-          });
-
-          if (typeof allSuggestions.then === 'function') {
-            allSuggestions = await allSuggestions;
-          }
-
-          const suggestions = _this.filterExistingTags(allSuggestions);
-
-          if (_this.node && query === _this.state.query) {
-            _this.setState({
-              suggestions,
-              loading: false
-            });
-          }
-        } catch (e) {
-          _this.setState({
-            loading: false
-          });
-        }
-      });
-    });
-
-    _defineProperty(this, "_focusHandler", () => {
-      this.setActiveIndex(null);
-      this.setState({
-        focused: true
-      });
-    });
-
-    _defineProperty(this, "_blurHandler", () => {
-      this.setState({
-        focused: false
-      });
-    });
-
-    _defineProperty(this, "selectTag", moveForward => {
-      const activeIndex = typeof this.state.activeIndex === 'number' ? this.state.activeIndex : this.state.tags.length + 1;
-      let newActiveIndex = activeIndex + (moveForward ? 1 : -1);
-
-      if (newActiveIndex >= this.state.tags.length) {
-        newActiveIndex = this.state.tags.length - 1;
-      } else if (newActiveIndex < 0) {
-        newActiveIndex = 0;
-      }
-
-      if (this.state.activeIndex !== newActiveIndex) {
-        this.setActiveIndex(newActiveIndex);
-      }
-    });
-
-    _defineProperty(this, "handleKeyDown", event => {
-      const key = getEventKey(event);
-
-      const isInputFocused = () => event.target.matches(this.getInputNode().tagName);
-
-      if (key === ' ' && this.props.allowAddNewTags) {
-        event.stopPropagation();
-        const value = this.getInputNode().value;
-
-        if (value !== '') {
-          this.handleTagCreation(value);
-        }
-
-        return true;
-      }
-
-      if (this.select._popup.isVisible()) {
-        return true;
-      }
-
-      if (key === 'ArrowLeft') {
-        if (this.getInputNode() && this.caret.getPosition() > 0) {
-          return true;
-        }
-
-        this.selectTag();
-        return false;
-      }
-
-      if (key === 'ArrowRight' && !isInputFocused()) {
-        if (this.state.activeIndex === this.state.tags.length - 1) {
-          if (!this.props.disabled) {
-            this.getInputNode().focus();
-            this.setActiveIndex();
-          }
-        } else {
-          this.selectTag(true);
-        }
-
-        return false;
-      }
-
-      if (!this.props.disabled) {
-        if (key === 'Backspace' && !this.getInputNode().value) {
-          event.preventDefault();
-          const tagsLength = this.state.tags.length;
-
-          this.select._hidePopup(true); // otherwise confirmation may be overlapped by popup
-
-
-          this.onRemoveTag(this.state.tags[tagsLength - 1]);
-          return false;
-        }
-
-        if ((key === 'Delete' || key === 'Backspace') && this.state.tags[this.state.activeIndex]) {
-          this.onRemoveTag(this.state.tags[this.state.activeIndex]).then(() => this.selectTag(true));
-          return false;
-        }
-      }
-
-      return true;
-    });
-
-    _defineProperty(this, "handleClick", memoize(tag => () => {
-      this.setActiveIndex(this.state.tags.indexOf(tag));
-    }));
-
-    _defineProperty(this, "handleRemove", memoize(tag => () => this.onRemoveTag(tag)));
-
-    _defineProperty(this, "handleTagCreation", label => {
-      this.addTag({
-        key: label,
-        label
-      });
-    });
-
-    _defineProperty(this, "selectRef", el => {
-      this.select = el;
-    });
-  }
-
-  static getDerivedStateFromProps(_ref, _ref2) {
-    let {
-      tags
-    } = _ref;
-    let {
-      prevTags
-    } = _ref2;
-    const nextState = {
-      prevTags: tags
-    };
-
-    if (tags != null && tags !== prevTags) {
-      Object.assign(nextState, {
-        tags,
-        activeIndex: tags.length
-      });
-    }
-
-    return nextState;
-  }
-
-  componentDidMount() {
-    if (this.props.autoOpen && !this.props.disabled) {
-      this.focusInput();
-      this.loadSuggestions();
-
-      this.select._showPopup();
-    }
-  }
-
-  getInputNode() {
-    if (!this.input) {
-      this.input = this.select.filter;
-      this.caret = new Caret(this.input);
-    }
-
-    return this.input;
-  }
-
-  setActiveIndex(activeIndex) {
-    this.setState({
-      activeIndex
-    });
-  }
-
-  onRemoveTag(tagToRemove) {
-    return Promise.resolve(this.props.onRemoveTag({
-      tag: tagToRemove
-    })).then(() => {
-      const tags = this.state.tags.filter(tag => tag !== tagToRemove);
-
-      if (this.node) {
-        this.setState({
-          tags
-        });
-        this.focusInput();
-      }
-
-      return tags;
-    }, this.focusInput);
-  }
-
-  render() {
-    const {
-      focused,
-      tags,
-      activeIndex
-    } = this.state;
-    const {
-      legacyMode,
-      disabled,
-      canNotBeEmpty,
-      allowAddNewTags,
-      filter
-    } = this.props;
-    const classes = classNames(modules_5aa8aaf3.tagsInput, {
-      [modules_5aa8aaf3.tagsInputDisabled]: disabled,
-      [modules_5aa8aaf3.tagsInputFocused]: focused,
-      [modules_5aa8aaf3.tagsInputLegacyMode]: legacyMode
-    }, this.props.className);
-    return /*#__PURE__*/React.createElement("div", {
-      // it transfers focus to input
-      role: "presentation",
-      className: classes,
-      onKeyDown: this.handleKeyDown,
-      onClick: this.clickHandler,
-      ref: this.nodeRef
-    }, /*#__PURE__*/React.createElement(TagsList, {
-      tags: tags,
-      activeIndex: activeIndex,
-      disabled: disabled,
-      canNotBeEmpty: canNotBeEmpty,
-      handleRemove: this.handleRemove,
-      className: modules_5aa8aaf3.tagsList,
-      tagClassName: modules_5aa8aaf3.tag,
-      handleClick: this.handleClick
-    }, /*#__PURE__*/React.createElement(Select, {
-      ref: this.selectRef,
-      size: Select.Size.AUTO,
-      type: Select.Type.INPUT_WITHOUT_CONTROLS,
-      inputPlaceholder: this.props.placeholder,
-      data: this.state.suggestions,
-      className: classNames(modules_5aa8aaf3.tagsSelect),
-      onSelect: this.addTag,
-      onFocus: this._focusHandler,
-      onBlur: this._blurHandler,
-      renderOptimization: this.props.renderOptimization,
-      add: allowAddNewTags ? {
-        prefix: 'Add new tag'
-      } : undefined,
-      onAdd: allowAddNewTags ? this.handleTagCreation : undefined,
-      filter: filter,
-      maxHeight: this.props.maxPopupHeight,
-      minWidth: this.props.minPopupWidth,
-      top: POPUP_VERTICAL_SHIFT,
-      loading: this.state.loading,
-      onFilter: this.loadSuggestions,
-      onBeforeOpen: this.loadSuggestions,
-      onKeyDown: this.handleKeyDown,
-      disabled: this.props.disabled,
-      loadingMessage: this.props.loadingMessage,
-      notFoundMessage: this.props.notFoundMessage
-    })), !legacyMode && /*#__PURE__*/React.createElement("div", {
-      className: modules_5aa8aaf3.underline
-    }), !legacyMode && /*#__PURE__*/React.createElement("div", {
-      className: modules_5aa8aaf3.focusUnderline
-    }));
-  }
-
-}
-
-_defineProperty(TagsInput, "propTypes", {
-  className: PropTypes.string,
-  tags: PropTypes.array,
-
-  /**
-   * Datasource should return array(or promise) of suggestions.
-   * Each suggestion should contain key and label fields.
-   * DataSource should handle caching and response racing (when later request
-   * responded earlier) by himself.
-   */
-  dataSource: PropTypes.func,
-  onAddTag: PropTypes.func,
-  onRemoveTag: PropTypes.func,
-  customTagComponent: (props, propName, componentName) => {
-    if (props[propName] && !props[propName].prototype instanceof Component) {
-      return new Error(`Invalid prop ${propName} supplied to ${componentName}. Validation failed.`);
-    }
-
-    return null;
-  },
-  maxPopupHeight: PropTypes.number,
-  minPopupWidth: PropTypes.number,
-  placeholder: PropTypes.string,
-  canNotBeEmpty: PropTypes.bool,
-  disabled: PropTypes.bool,
-  autoOpen: PropTypes.bool,
-  renderOptimization: PropTypes.bool,
-  legacyMode: PropTypes.bool,
-  filter: PropTypes.oneOfType([PropTypes.bool, PropTypes.shape({
-    fn: PropTypes.func
-  })]),
-  loadingMessage: PropTypes.string,
-  notFoundMessage: PropTypes.string,
-  allowAddNewTags: PropTypes.bool
-});
-
-_defineProperty(TagsInput, "defaultProps", {
-  dataSource: noop,
-  onAddTag: noop,
-  onRemoveTag: noop,
-  customTagComponent: null,
-  maxPopupHeight: 500,
-  minPopupWidth: 360,
-  canNotBeEmpty: false,
-  disabled: false,
-  autoOpen: false,
-  renderOptimization: true,
-  legacyMode: false,
-  allowAddNewTags: false,
-  filter: {
-    fn: () => true
-  },
-  placeholder: 'Select an option'
-});
-
-_defineProperty(TagsInput, "ngModelStateField", 'tags');
-
-const RerenderableTagsInput = rerenderHOC(TagsInput);
-
-export default TagsInput;
-export { RerenderableTagsInput };

package/dist/tags-list/tags-list.js

@@ -1,94 +0,0 @@
-import { b as _extends, a as _objectWithoutProperties, _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import Tag from '../tag/tag.js';
-import '@jetbrains/icons/close';
-import '../icon/icon.js';
-import 'util-deprecate';
-import '../icon/icon__constants.js';
-import '../_helpers/icon__svg.js';
-import '../global/memoize.js';
-import '../button/button.js';
-import 'focus-visible';
-import '@jetbrains/icons/chevron-10px';
-import '../global/theme.js';
-import '../link/clickableLink.js';
-import '../_helpers/button__classes.js';
-
-function noop() {}
-/**
- * @name Tags List
- */
-
-
-class TagsList extends Component {
-  renderTag(tag, focusTag) {
-    const TagComponent = this.props.customTagComponent || Tag;
-    const readOnly = this.props.disabled || tag.readOnly || this.props.canNotBeEmpty && this.props.tags.length === 1;
-    const {
-      tagClassName
-    } = this.props;
-    return /*#__PURE__*/React.createElement(TagComponent, _extends({}, tag, {
-      readOnly: readOnly,
-      disabled: this.props.disabled || tag.disabled,
-      focused: focusTag,
-      onClick: this.props.handleClick(tag),
-      onRemove: this.props.handleRemove(tag),
-      className: tagClassName
-    }), tag.label);
-  }
-
-  render() {
-    const _this$props = this.props,
-          {
-      children,
-      className,
-      customTagComponent,
-      canNotBeEmpty,
-      handleClick,
-      tagClassName,
-      handleRemove,
-      tags,
-      activeIndex
-    } = _this$props,
-          props = _objectWithoutProperties(_this$props, ["children", "className", "customTagComponent", "canNotBeEmpty", "handleClick", "tagClassName", "handleRemove", "tags", "activeIndex"]);
-
-    const classes = classNames('ring-js-shortcuts', className);
-    const tagsList = (this.props.tags || []).map((tag, index) => this.renderTag(tag, this.props.activeIndex === index));
-    return /*#__PURE__*/React.createElement("div", _extends({
-      "data-test": "ring-tags-list",
-      className: classes
-    }, props), tagsList, children);
-  }
-
-}
-
-_defineProperty(TagsList, "propTypes", {
-  children: PropTypes.node,
-  tags: PropTypes.array,
-  customTagComponent: (props, propName, componentName) => {
-    if (props[propName] && !props[propName].prototype instanceof Component) {
-      return new Error(`Invalid prop ${propName} supplied to ${componentName}. Validation failed.`);
-    }
-
-    return null;
-  },
-  activeIndex: PropTypes.number,
-  canNotBeEmpty: PropTypes.bool,
-  disabled: PropTypes.bool,
-  handleClick: PropTypes.func,
-  handleRemove: PropTypes.func,
-  className: PropTypes.string,
-  tagClassName: PropTypes.string
-});
-
-_defineProperty(TagsList, "defaultProps", {
-  customTagComponent: null,
-  canNotBeEmpty: false,
-  disabled: false,
-  handleClick: noop,
-  handleRemove: noop
-});
-
-export default TagsList;

package/dist/text/text.js

@@ -1,38 +0,0 @@
-import { a as _objectWithoutProperties, b as _extends, _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-
-var modules_78d1bce6 = {"text":"text_text__bc47c17b","info":"text_info__bc47c17b"};
-
-/**
- * @name Text
- */
-
-class Text extends Component {
-  render() {
-    const _this$props = this.props,
-          {
-      children,
-      className,
-      info
-    } = _this$props,
-          restProps = _objectWithoutProperties(_this$props, ["children", "className", "info"]);
-
-    const classes = classNames(modules_78d1bce6.text, className, {
-      [modules_78d1bce6.info]: info
-    });
-    return /*#__PURE__*/React.createElement("span", _extends({
-      className: classes
-    }, restProps), children);
-  }
-
-}
-
-_defineProperty(Text, "propTypes", {
-  children: PropTypes.node,
-  info: PropTypes.bool,
-  className: PropTypes.string
-});
-
-export default Text;

package/dist/toggle/toggle.js

@@ -1,80 +0,0 @@
-import { a as _objectWithoutProperties, b as _extends, _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
-import React, { PureComponent } from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import { withTheme } from '../global/theme.js';
-import joinDataTestAttributes from '../global/data-tests.js';
-
-var modules_331c5aa7 = {"unit":"8px","padding":"2px","disabled-line-color":"hsla(0,0%,100%,.9)","duration":".3s","timing-function":"cubic-bezier(.23,1,.32,1)","toggle":"toggle_toggle__ca2e3a7a","switch":"toggle_switch__ca2e3a7a","disabled":"toggle_disabled__ca2e3a7a","label":"toggle_label__ca2e3a7a","leftLabel":"toggle_leftLabel__ca2e3a7a","light":"toggle_light__ca2e3a7a","dark":"toggle_dark__ca2e3a7a","switchWrapper":"toggle_switchWrapper__ca2e3a7a","input":"toggle_input__ca2e3a7a","size20":"toggle_size20__ca2e3a7a","paleSwitch":"toggle_paleSwitch__ca2e3a7a"};
-
-const Size = {
-  Size16: modules_331c5aa7.size16,
-  Size20: modules_331c5aa7.size20
-};
-/**
-  * @name Toggle
-  */
-
-class Toggle extends PureComponent {
-  render() {
-    const _this$props = this.props,
-          {
-      className,
-      children,
-      disabled,
-      pale,
-      title,
-      leftLabel,
-      theme,
-      size = Size.Size16,
-      'data-test': dataTest,
-      onTransitionEnd
-    } = _this$props,
-          restProps = _objectWithoutProperties(_this$props, ["className", "children", "disabled", "pale", "title", "leftLabel", "theme", "size", "data-test", "onTransitionEnd"]);
-
-    const classes = classNames(className, size, modules_331c5aa7.toggle, modules_331c5aa7[theme], disabled && modules_331c5aa7.disabled);
-    return /*#__PURE__*/React.createElement("label", {
-      className: classes,
-      title: title,
-      "data-test": joinDataTestAttributes('ring-toggle', dataTest)
-    }, leftLabel && /*#__PURE__*/React.createElement("span", {
-      className: modules_331c5aa7.leftLabel
-    }, leftLabel), /*#__PURE__*/React.createElement("span", {
-      className: modules_331c5aa7.switchWrapper
-    }, /*#__PURE__*/React.createElement("input", _extends({
-      "data-test": "ring-toggle-input"
-    }, restProps, {
-      type: "checkbox",
-      disabled: disabled,
-      className: modules_331c5aa7.input
-    })), /*#__PURE__*/React.createElement("span", {
-      className: classNames(modules_331c5aa7.switch, pale && modules_331c5aa7.paleSwitch),
-      onTransitionEnd: onTransitionEnd
-    })), children && /*#__PURE__*/React.createElement("span", {
-      className: modules_331c5aa7.label
-    }, children));
-  }
-
-}
-
-_defineProperty(Toggle, "propTypes", {
-  children: PropTypes.node,
-  name: PropTypes.string,
-  className: PropTypes.string,
-  title: PropTypes.string,
-  leftLabel: PropTypes.node,
-  defaultChecked: PropTypes.bool,
-  checked: PropTypes.bool,
-  disabled: PropTypes.bool,
-  pale: PropTypes.bool,
-  onChange: PropTypes.func,
-  onTransitionEnd: PropTypes.func,
-  theme: PropTypes.string,
-  size: PropTypes.oneOf(Object.values(Size)),
-  'data-test': PropTypes.string
-});
-
-var toggle = withTheme()(Toggle);
-
-export default toggle;
-export { Size };