@jetbrains/ring-ui 6.0.1-beta.0 → 6.0.1

package/dist/select-ng/select-ng.js

@@ -1,630 +0,0 @@
-import { g as _objectSpread2, f as _extends, l as _typeof } from '../_helpers/_rollupPluginBabelHelpers.js';
-import 'core-js/modules/es.number.constructor.js';
-import 'core-js/modules/es.array.concat.js';
-import 'core-js/modules/es.array.map.js';
-import 'core-js/modules/es.array.filter.js';
-import 'core-js/modules/es.object.to-string.js';
-import 'core-js/modules/web.dom-collections.for-each.js';
-import 'core-js/modules/es.object.keys.js';
-import angular from 'angular';
-import React from 'react';
-import { unmountComponentAtNode, render } from '../global/react-render-adapter.js';
-import getEventKey from '../global/get-event-key.js';
-import Select, { RerenderableSelect } from '../select/select.js';
-import messageBundleNg from '../message-bundle-ng/message-bundle-ng.js';
-import { ControlsHeight } from '../global/controls-height.js';
-import SelectNgOptions from './select-ng__options.js';
-import SelectLazy from './select-ng__lazy.js';
-import 'core-js/modules/es.array.iterator.js';
-import 'core-js/modules/es.string.iterator.js';
-import 'core-js/modules/es.weak-map.js';
-import 'core-js/modules/web.dom-collections.iterator.js';
-import 'react-dom';
-import 'core-js/modules/es.array.index-of.js';
-import 'core-js/modules/es.array.reduce.js';
-import 'core-js/modules/es.string.trim.js';
-import 'core-js/modules/es.regexp.exec.js';
-import 'core-js/modules/es.array.find.js';
-import 'core-js/modules/es.string.replace.js';
-import 'core-js/modules/es.array.slice.js';
-import 'core-js/modules/es.object.assign.js';
-import 'core-js/modules/es.object.values.js';
-import 'classnames';
-import 'prop-types';
-import '@jetbrains/icons/chevron-down';
-import '@jetbrains/icons/close-12px';
-import 'deep-equal';
-import '../dropdown/dropdown.js';
-import '../global/data-tests.js';
-import 'core-js/modules/es.object.entries.js';
-import '../global/typescript-utils.js';
-import '../_helpers/anchor.js';
-import '@jetbrains/icons/chevron-10px';
-import '../icon/icon.js';
-import 'util-deprecate';
-import '../icon/icon__constants.js';
-import '../_helpers/icon.js';
-import '../icon/icon__svg.js';
-import 'core-js/modules/es.string.starts-with.js';
-import '../global/memoize.js';
-import 'core-js/modules/es.map.js';
-import '../button/button.js';
-import '../link/clickableLink.js';
-import '../_helpers/button__classes.js';
-import '../avatar/avatar.js';
-import '../global/url.js';
-import 'core-js/modules/es.string.match.js';
-import '../global/dom.js';
-import 'core-js/modules/es.string.split.js';
-import 'core-js/modules/es.set.js';
-import '../avatar/fallback-avatar.js';
-import 'core-js/modules/es.array.from.js';
-import '../global/get-uid.js';
-import 'core-js/modules/es.regexp.to-string.js';
-import '../popup/popup.js';
-import '../global/schedule-raf.js';
-import '../shortcuts/shortcuts.js';
-import '../shortcuts/core.js';
-import 'core-js/modules/es.array.includes.js';
-import 'core-js/modules/es.string.includes.js';
-import 'core-js/modules/es.array.splice.js';
-import 'core-js/modules/es.array.find-index.js';
-import 'combokeys';
-import '../global/sniffer.js';
-import 'sniffr';
-import '../tab-trap/tab-trap.js';
-import '../popup/position.js';
-import 'core-js/modules/es.array.sort.js';
-import '../popup/popup.consts.js';
-import '../popup/popup.target.js';
-import '../list/list.js';
-import 'core-js/modules/es.symbol.js';
-import 'core-js/modules/es.symbol.description.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/link.js';
-import '../_helpers/list.js';
-import '../list/list__item.js';
-import '../checkbox/checkbox.js';
-import '@jetbrains/icons/checkmark-14px';
-import '@jetbrains/icons/remove-14px';
-import '../global/prop-types.js';
-import '../global/composeRefs.js';
-import '../_helpers/checkbox.js';
-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 '../i18n/i18n-context.js';
-import '../i18n/i18n.js';
-import '../control-label/control-label.js';
-import '../_helpers/control-label.js';
-import '../_helpers/input.js';
-import '../global/rerender-hoc.js';
-import '../global/fuzzy-highlight.js';
-import '../select/select__popup.js';
-import '@jetbrains/icons/search';
-import '../loader-inline/loader-inline.js';
-import '../_helpers/loader-inline.js';
-import '../shortcuts/shortcuts-hoc.js';
-import '../tags-list/tags-list.js';
-import '../tag/tag.js';
-import '../caret/caret.js';
-import '../text/text.js';
-import '../_helpers/select__filter.js';
-
-var LOADER_DELAY = 150; // delay to show loader in ms
-var INFINITE_SCROLL_PACK_SIZE = 50;
-var DIALOG_NG_SELECTOR = '[data-anchor=dialog-container][data-in-sidebar=false]';
-/**
- * @name Select Ng
- */
-
-var angularModule = angular.module('Ring.select', [SelectNgOptions, messageBundleNg]);
-angularModule.directive('rgSelect', function rgSelectDirective() {
-  var types = {
-    input: Select.Type.INPUT,
-    button: Select.Type.BUTTON,
-    dropdown: Select.Type.CUSTOM,
-    suggest: Select.Type.INPUT
-  };
-  var sizes = {
-    FULL: Select.Size.FULL,
-    S: Select.Size.S,
-    M: Select.Size.M,
-    L: Select.Size.L
-  };
-  return {
-    /**
-     * @property {Object} scope
-     * @property {Object} scope.ngModel
-     * @property {String} scope.selectType - select type. Can be "button" (default), "input" or "dropdown"
-     * @property {String} scope.lazy - Load options lazily. "true" by default.
-     * @property {Boolean} scope.withInfiniteScroll - If true, rgSelect calls getOptions with skip parameter when the list is scrolled to the bottom
-     * @property {String} scope.options - query for options
-     * @property {Boolean} scope.externalFilter - whether or not to use the options function as a filter.
-     * "filter" property should not be passed in that case.
-     * @property {Boolean} scope.multiple - toggles multiple selection
-     * @property {Function} scope.onSelect - callback to call on item selection
-     * Receives "selected" property (<rg-select on-select='doSomethingWith(selected)'>)
-     * @property {Function} scope.onDeselect - callback to call on item deselection
-     * Receives "deselected" property (<rg-select on-deselect='doSomethingWith(deselected)'>)
-     * @property {Function} scope.onOpen - callback to call on select popup opening
-     * @property {Function} scope.onClose - callback to call on select popup closing
-     * @property {Function} scope.onChange - callback to call on selection change
-     * Receives "selected" property (<rg-select on-change='doSomethingWith(selected)'>)
-     * @property {String} scope.label - Label to place on empty select button
-     * @property {String} scope.selectedLabel - Label to replace any selected item/items with
-     * @property {String} scope.notFoundMessage - message to display if no options found
-     * @property {String} scope.loadingMessage - message to display while loading
-     * @property {Object} scope.config - hash to pass to react select component
-     * @property {Boolean} scope.configAutoUpdate - whether or not to watch for configuration updates
-     * @property {String} scope.size - select size. Can be "S", "M" (default), or "L".
-     */
-    scope: {
-      ngModel: '=',
-      selectType: '@',
-      lazy: '=?',
-      withInfiniteScroll: '=?',
-      // NB: Deprecated! Use infinite-scroll-pack-size="50" instead
-      infiniteScrollPackSize: '@',
-      options: '@',
-      optionsScope: '=',
-      label: '@',
-      selectedLabel: '@',
-      externalFilter: '=?',
-      filter: '=?',
-      tags: '=?',
-      multiple: '=?',
-      clear: '=?',
-      onSelect: '&',
-      onDeselect: '&',
-      onOpen: '&',
-      onClose: '&',
-      onChange: '&',
-      notFoundMessage: '@',
-      loadingMessage: '@',
-      config: '=?',
-      configAutoUpdate: '=',
-      selectInstance: '=?',
-      size: '@',
-      dir: '@'
-    },
-    bindToController: true,
-    controllerAs: 'selectCtrl',
-    require: ['?ngModel', 'rgSelect'],
-    link: function link(scope, iElement, iAttrs, ctrls) {
-      var ngModelCtrl = ctrls[0];
-      var rgSelectCtrl = ctrls[1];
-      rgSelectCtrl.setNgModelCtrl(ngModelCtrl);
-    },
-    controller: ["$q", "$scope", "$element", "$attrs", "$timeout", "SelectOptions", "RingMessageBundle", function controller($q, $scope, $element, $attrs, $timeout, SelectOptions, RingMessageBundle) {
-      /*eslint-disable consistent-this*/
-      var ctrl = this;
-      /*eslint-enable consistent-this*/
-      var element = $element[0];
-      var container = document.createElement('span');
-      var infiniteScrollPackSize = Number(ctrl.infiniteScrollPackSize) || (ctrl.withInfiniteScroll ? INFINITE_SCROLL_PACK_SIZE : 0);
-
-      /**
-       * Properties
-       */
-      ctrl.selectInstance = null;
-      ctrl.ngModelCtrl = null;
-      ctrl.query = null;
-      ctrl.dataReceived = false;
-      ctrl.skipNextModelSync = false;
-      var scope = ctrl.optionsScope ? ctrl.optionsScope : $scope.$parent;
-      ctrl.setNgModelCtrl = function (ngModelCtrl) {
-        ctrl.ngModelCtrl = ngModelCtrl;
-      };
-
-      /**
-       * @param {Array} options
-       */
-      function memorizeOptions(options, skip) {
-        if (ctrl.loadedOptions && skip > 0) {
-          ctrl.loadedOptions = ctrl.loadedOptions.concat(options);
-          ctrl.stopLoadingNewOptions = options.length === 0 && infiniteScrollPackSize;
-        } else {
-          ctrl.loadedOptions = options;
-        }
-        ctrl.lastSkip = skip;
-        return ctrl.loadedOptions;
-      }
-      function resetMemorizedOptions() {
-        ctrl.lastSkip = -1;
-        ctrl.loadedOptions = [];
-        ctrl.stopLoadingNewOptions = false;
-      }
-      function getType() {
-        // $attrs.type as fallback, not recommended to use because of native "type" attribute
-        return ctrl.selectType || $attrs.type;
-      }
-      function getCurrentSkipParameter(query, prevQuery) {
-        if (!infiniteScrollPackSize || query !== prevQuery || !ctrl.loadedOptions) {
-          return 0;
-        }
-        return ctrl.lastSkip < 0 ? 0 : ctrl.lastSkip + infiniteScrollPackSize;
-      }
-      function isInDialog() {
-        var dialogContainer = document.querySelector(DIALOG_NG_SELECTOR);
-        return dialogContainer && dialogContainer.contains(element);
-      }
-      ctrl.syncSelectToNgModel = function (selectedValue) {
-        function valueOf(option) {
-          if (option && option.originalModel) {
-            return ctrl.optionsParser.getValue(option.originalModel);
-          }
-          return ctrl.optionsParser.getValue(option);
-        }
-        if (ctrl.ngModelCtrl) {
-          ctrl.skipNextModelSync = true;
-          if (getType() === 'suggest') {
-            ctrl.ngModelCtrl.$setViewValue(selectedValue.label);
-          } else if (Array.isArray(selectedValue)) {
-            ctrl.ngModelCtrl.$setViewValue(selectedValue.map(valueOf));
-          } else {
-            ctrl.ngModelCtrl.$setViewValue(valueOf(selectedValue));
-          }
-        }
-      };
-      ctrl.convertNgModelToSelect = function (model) {
-        function convertItem(modelValue) {
-          var item = ctrl.optionsParser.getOptionByValue(modelValue, ctrl.loadedOptions || []);
-
-          // could happen when lazily fetching the data
-          if (item === undefined) {
-            item = modelValue;
-          }
-          return angular.extend({
-            key: ctrl.optionsParser.getKey(item),
-            label: ctrl.optionsParser.getLabel(item),
-            selectedLabel: ctrl.optionsParser.getSelectedLabel(item),
-            description: ctrl.optionsParser.getDescription(item),
-            originalModel: item
-          }, _typeof(item) === 'object' ? item : null);
-        }
-        if (model !== undefined && model !== null) {
-          if (Array.isArray(model)) {
-            return model.map(convertItem);
-          } else {
-            return convertItem(model);
-          }
-        }
-        return undefined;
-      };
-      var lastQuery = null;
-      var inProcessQueries = 0;
-      ctrl.getOptions = function (query, skip) {
-        return $q.when(ctrl.optionsParser.getOptions(query, skip));
-      };
-      var loaderDelayTimeout = null;
-      ctrl.showLoader = function () {
-        if (getType() !== 'suggest') {
-          reRenderSelect({
-            loading: true
-          });
-        }
-      };
-      ctrl.loadOptionsToSelect = function (query) {
-        if (ctrl.stopLoadingNewOptions && query === lastQuery) {
-          return $q.resolve();
-        }
-        ctrl.stopLoadingNewOptions = false;
-        var skip = getCurrentSkipParameter(query, lastQuery);
-        lastQuery = query;
-        $timeout.cancel(loaderDelayTimeout);
-
-        // Delay loader only when there is some data
-        // Otherwise, user can notice the "not found" message
-        if (ctrl.dataReceived) {
-          loaderDelayTimeout = $timeout(ctrl.showLoader, LOADER_DELAY);
-        } else {
-          ctrl.showLoader();
-        }
-        inProcessQueries++;
-        return ctrl.getOptions(query, skip).then(function (results) {
-          inProcessQueries--;
-          if (query !== lastQuery) {
-            return; // do not process the result if queries don't match
-          }
-
-          if (skip && ctrl.lastSkip !== -1 && skip !== ctrl.lastSkip + infiniteScrollPackSize && ctrl.infiniteScrollPackSize) {
-            return; // do not process the result if skips not match
-          }
-
-          var items = memorizeOptions(results.data || results, skip).map(ctrl.convertNgModelToSelect);
-          $timeout.cancel(loaderDelayTimeout);
-          ctrl.dataReceived = true;
-          reRenderSelect({
-            data: items,
-            loading: false
-          });
-        }).catch(function (error) {
-          inProcessQueries--;
-          $timeout.cancel(loaderDelayTimeout);
-          reRenderSelect({
-            loading: false
-          });
-          return $q.reject(error);
-        });
-      };
-      function setSelectModel(newValue) {
-        if (ctrl.skipNextModelSync) {
-          ctrl.skipNextModelSync = false;
-          return;
-        }
-        if (ctrl.ngModelCtrl) {
-          reRenderSelect({
-            selected: ctrl.convertNgModelToSelect(newValue)
-          });
-        }
-      }
-      function syncNgModelToSelect() {
-        $scope.$watch(function () {
-          return ctrl.ngModelCtrl && ctrl.ngModelCtrl.$modelValue;
-        }, setSelectModel, true);
-      }
-      function syncDisabled() {
-        $attrs.$observe('disabled', function (newValue) {
-          reRenderSelect({
-            disabled: newValue
-          });
-        });
-      }
-      function syncMultiple() {
-        $scope.$watch(function () {
-          return ctrl.multiple;
-        }, function () {
-          if (angular.isDefined(ctrl.multiple)) {
-            reRenderSelect({
-              multiple: ctrl.multiple
-            });
-          }
-        });
-      }
-      function syncConfig() {
-        $scope.$watchCollection(function () {
-          return ctrl.config;
-        }, function (config, old) {
-          if (config !== old) {
-            reRenderSelect(config);
-          }
-        });
-      }
-      function isSelectPopupOpen() {
-        return ctrl.selectInstance._popup.isVisible();
-      }
-      function attachDropdownIfNeeded() {
-        if (getType() === 'dropdown') {
-          var handler = function handler() {
-            ctrl.selectInstance._clickHandler();
-          };
-          element.addEventListener('click', handler);
-          element.addEventListener('keydown', function (event) {
-            var key = getEventKey(event);
-            var modifier = event.ctrlKey || event.altKey || event.metaKey || event.shiftKey;
-            if (key === 'Enter' && !modifier || key === ' ') {
-              if (!isSelectPopupOpen()) {
-                handler();
-
-                // XXX: preventDefault is needed because some controls (button, input, etc)
-                // have an activation behaviour which fires a `click` event on `keypress`
-                // @see https://www.w3.org/TR/2017/PR-html51-20170803/editing.html#activation
-                event.preventDefault();
-
-                // XXX: stopPropagation is needed because when a React component is rendered with
-                // shortcuts, document-level handlers are added. For example, `enter` that leads
-                // to this handler being called right after current function's call, which
-                // leads to the popup being closed immediately after opening.
-                // @see https://www.w3.org/TR/uievents/#Event_dispatch_and_DOM_event_flow
-                event.stopPropagation();
-              }
-            }
-          });
-        }
-      }
-      function listenToRouteChanges() {
-        $scope.$on('$locationChangeSuccess', function () {
-          if (isSelectPopupOpen()) {
-            ctrl.selectInstance._hidePopup();
-          }
-        });
-      }
-      function getSelectType() {
-        return types[getType()] || types.material;
-      }
-      function getSelectSize() {
-        return sizes[ctrl.size] || sizes.FULL;
-      }
-      function selectRef(instance) {
-        if (instance != null) {
-          ctrl.selectInstance = instance;
-        }
-      }
-      function reRenderSelect(props) {
-        var _ctrl$selectInstance;
-        if ((_ctrl$selectInstance = ctrl.selectInstance) !== null && _ctrl$selectInstance !== void 0 && _ctrl$selectInstance.node) {
-          ctrl.selectInstance.rerender(_objectSpread2(_objectSpread2({}, props), {}, {
-            ref: selectRef
-          }));
-        }
-      }
-
-      /**
-       * @param {newValue} newValue New value of options
-       * @param {value} value Previous value of options
-       */
-      function optionsWatcher(newValue, value) {
-        memorizeOptions(newValue, 0);
-        if (newValue === value) {
-          return;
-        }
-        if (ctrl.ngModelCtrl) {
-          setSelectModel(ctrl.ngModelCtrl.$modelValue);
-        }
-      }
-      function createDefaultConfig() {
-        var defaultConfig = {
-          label: ctrl.label || RingMessageBundle.select_label(),
-          selectedLabel: ctrl.selectedLabel,
-          allowAny: getType() === 'suggest',
-          hideArrow: getType() === 'suggest',
-          filter: ctrl.filter,
-          tags: ctrl.tags,
-          dir: ctrl.dir,
-          multiple: ctrl.multiple,
-          popupClassName: $attrs.popupClass,
-          clear: ctrl.clear,
-          ringPopupTarget: isInDialog() ? 'dialog-ng-popup-container' : null,
-          renderOptimization: getType() !== 'dropdown',
-          type: getSelectType(),
-          loadingMessage: ctrl.loadingMessage || RingMessageBundle.select_loading(),
-          notFoundMessage: ctrl.notFoundMessage || RingMessageBundle.select_options_not_found(),
-          targetElement: getType() === 'dropdown' ? element : null,
-          size: getSelectSize(),
-          height: ControlsHeight.S,
-          onBeforeOpen: function onBeforeOpen() {
-            resetMemorizedOptions();
-            ctrl.loadOptionsToSelect(ctrl.query);
-            $scope.$evalAsync(function () {});
-          },
-          onOpen: function onOpen() {
-            $scope.$evalAsync(function () {
-              ctrl.onOpen();
-            });
-          },
-          onClose: function onClose() {
-            ctrl.query = null;
-            $scope.$evalAsync(function () {
-              ctrl.onClose();
-            });
-          },
-          onSelect: function onSelect(selected, event) {
-            $scope.$evalAsync(function () {
-              ctrl.onSelect({
-                selected: selected,
-                event: event
-              });
-            });
-          },
-          onDeselect: function onDeselect(deselected, event) {
-            $scope.$evalAsync(function () {
-              ctrl.onDeselect({
-                deselected: deselected,
-                event: event
-              });
-            });
-          },
-          onChange: function onChange(selected, event) {
-            ctrl.syncSelectToNgModel(selected);
-            $scope.$evalAsync(function () {
-              ctrl.onChange({
-                selected: selected,
-                event: event
-              });
-            });
-          },
-          onFilter: function onFilter(query) {
-            $scope.$evalAsync(function () {
-              ctrl.query = query;
-              if (ctrl.externalFilter) {
-                ctrl.loadOptionsToSelect(query);
-              }
-              if (ctrl.onFilter) {
-                ctrl.onFilter(query);
-              }
-            });
-          },
-          reloadOptions: function reloadOptions(query) {
-            $scope.$evalAsync(function () {
-              ctrl.loadOptionsToSelect(query || ctrl.query);
-            });
-          },
-          getLoadedOptions: function getLoadedOptions() {
-            return ctrl.loadedOptions;
-          }
-        };
-        if (infiniteScrollPackSize) {
-          defaultConfig.onLoadMore = function () {
-            if (inProcessQueries === 0) {
-              $scope.$evalAsync(function () {
-                ctrl.loadOptionsToSelect(ctrl.query);
-              });
-            }
-          };
-        }
-        return defaultConfig;
-      }
-      function removeDefaultConfigPropFromUserConfig() {
-        if (!ctrl.defaultConfig || !ctrl.config) {
-          return;
-        }
-        Object.keys(ctrl.defaultConfig).filter(function (propName) {
-          return ctrl.config[propName] === ctrl.defaultConfig[propName];
-        }).forEach(function (propName) {
-          delete ctrl.config[propName];
-        });
-      }
-      ctrl.$onDestroy = function () {
-        unmountComponentAtNode(container);
-        removeDefaultConfigPropFromUserConfig();
-      };
-      ctrl.$onInit = function () {
-        ctrl.optionsParser = new SelectOptions(scope, ctrl.options);
-        ctrl.lazy = ctrl.hasOwnProperty('lazy') ? ctrl.lazy : true;
-
-        /**
-         * Provide specific filter function if externalFilter is enabled
-         */
-        if (ctrl.externalFilter) {
-          ctrl.filter = ctrl.filter || {};
-          ctrl.filter.fn = function () {
-            return true;
-          };
-        }
-        ctrl.defaultConfig = createDefaultConfig();
-        ctrl.config = angular.extend({}, ctrl.defaultConfig, ctrl.config || {});
-        if (getType() === 'suggest' || getType() === 'input') {
-          render( /*#__PURE__*/React.createElement(RerenderableSelect, _extends({
-            ref: selectRef
-          }, ctrl.config)), container);
-        } else {
-          ctrl.selectInstance = new SelectLazy(container, ctrl.config, ctrl, getType(), selectRef);
-        }
-
-        // Preserve existing contents of the directive
-        element.appendChild(container);
-        if (!ctrl.lazy) {
-          if (!ctrl.optionsParser.datasourceIsFunction) {
-            $scope.$watch(function () {
-              return ctrl.optionsParser.getOptions(ctrl.query, 0);
-            }, optionsWatcher, true);
-          } else {
-            ctrl.loadOptionsToSelect(ctrl.query);
-          }
-        }
-        syncNgModelToSelect();
-        syncDisabled();
-        syncMultiple();
-        if (ctrl.configAutoUpdate) {
-          syncConfig();
-        }
-        attachDropdownIfNeeded();
-        listenToRouteChanges();
-      };
-    }]
-  };
-});
-var selectNg = angularModule.name;
-
-export { selectNg as default };