@jetbrains/ring-ui 4.1.1 → 4.1.2

package/dist/query-assist/query-assist__suggestions.js

@@ -0,0 +1,47 @@
+import 'react';
+import '../list/list.js';
+export { Q as default } from '../_helpers/query-assist__suggestions.js';
+import '../_helpers/_rollupPluginBabelHelpers.js';
+import 'prop-types';
+import 'classnames';
+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 'util-deprecate';
+import 'memoize-one';
+import '../global/data-tests.js';
+import '../global/get-uid.js';
+import '../global/schedule-raf.js';
+import '../global/memoize.js';
+import '../global/dom.js';
+import '../shortcuts/shortcuts.js';
+import '../shortcuts/core.js';
+import 'combokeys';
+import '../global/sniffer.js';
+import 'sniffr';
+import '../global/create-stateful-context.js';
+import '../list/list__link.js';
+import '../link/link.js';
+import 'focus-visible';
+import '../link/clickableLink.js';
+import '../_helpers/link.js';
+import '../_helpers/list.js';
+import '../list/list__item.js';
+import '../avatar/avatar.js';
+import '../global/url.js';
+import '../avatar/fallback-avatar.js';
+import '../checkbox/checkbox.js';
+import '@jetbrains/icons/checkmark';
+import '@jetbrains/icons/remove-10px';
+import '../icon/icon.js';
+import '../icon/icon__constants.js';
+import '../_helpers/icon.js';
+import '../icon/icon__svg.js';
+import '../_helpers/checkbox.js';
+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/query-assist-ng/query-assist-ng.js

@@ -0,0 +1,82 @@
+import angularComponentFactory from '../global/angular-component-factory.js';
+import QueryAssist from '../query-assist/query-assist.js';
+import '../_helpers/_rollupPluginBabelHelpers.js';
+import 'angular';
+import 'react';
+import 'react-dom';
+import '../global/ring-angular-component.js';
+import '../global/react-dom-renderer.js';
+import 'prop-types';
+import 'just-debounce-it';
+import 'classnames';
+import 'deep-equal';
+import '@jetbrains/icons/search';
+import '@jetbrains/icons/close';
+import '../global/get-uid.js';
+import '../global/data-tests.js';
+import '../global/dom.js';
+import '../caret/caret.js';
+import '../contenteditable/contenteditable.js';
+import 'react-dom/server';
+import '../popup-menu/popup-menu.js';
+import '../popup/popup.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 'util-deprecate';
+import 'memoize-one';
+import '../global/memoize.js';
+import '../global/create-stateful-context.js';
+import '../list/list__link.js';
+import '../link/link.js';
+import 'focus-visible';
+import '../link/clickableLink.js';
+import '../_helpers/link.js';
+import '../_helpers/list.js';
+import '../list/list__item.js';
+import '../avatar/avatar.js';
+import '../global/url.js';
+import '../avatar/fallback-avatar.js';
+import '../checkbox/checkbox.js';
+import '@jetbrains/icons/checkmark';
+import '@jetbrains/icons/remove-10px';
+import '../icon/icon.js';
+import '../icon/icon__constants.js';
+import '../_helpers/icon.js';
+import '../icon/icon__svg.js';
+import '../_helpers/checkbox.js';
+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 '../loader-inline/loader-inline.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 '../global/rerender-hoc.js';
+import '../button/button.js';
+import '@jetbrains/icons/chevron-10px';
+import '../_helpers/button__classes.js';
+import '../_helpers/query-assist__suggestions.js';
+
+var queryAssistNg = angularComponentFactory(QueryAssist, 'QueryAssist').name;
+
+export { queryAssistNg as default };

package/dist/radio/radio.js

@@ -0,0 +1,41 @@
+import { _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import getUID from '../global/get-uid.js';
+import RadioItem, { RadioContext } from './radio__item.js';
+import 'classnames';
+import '../_helpers/radio.js';
+
+/**
+ * @name Radio
+ */
+
+class Radio extends Component {
+  constructor() {
+    super(...arguments);
+
+    _defineProperty(this, "uid", getUID('ring-radio-'));
+  }
+
+  render() {
+    return /*#__PURE__*/React.createElement(RadioContext.Provider, {
+      value: {
+        name: this.uid,
+        ...this.props
+      }
+    }, this.props.children);
+  }
+
+}
+
+_defineProperty(Radio, "propTypes", {
+  name: PropTypes.string,
+  disabled: PropTypes.bool,
+  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.bool]),
+  onChange: PropTypes.func,
+  children: PropTypes.node.isRequired
+});
+
+_defineProperty(Radio, "Item", RadioItem);
+
+export { Radio as default };

package/dist/radio/radio__item.js

@@ -0,0 +1,77 @@
+import { _ as _defineProperty, a as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
+import React, { createContext, Component, forwardRef } from 'react';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+import getUID from '../global/get-uid.js';
+import { m as modules_df92307a } from '../_helpers/radio.js';
+
+const RadioContext = /*#__PURE__*/createContext({});
+class Radio extends Component {
+  constructor() {
+    super(...arguments);
+
+    _defineProperty(this, "uid", getUID('ring-radio-item-'));
+
+    _defineProperty(this, "inputRef", el => {
+      this.input = el;
+    });
+
+    _defineProperty(this, "labelRef", el => {
+      this.label = el;
+    });
+  }
+
+  render() {
+    const {
+      className,
+      children,
+      ...restProps
+    } = this.props;
+    const classes = classNames(modules_df92307a.radio, className);
+    return /*#__PURE__*/React.createElement("label", {
+      ref: this.labelRef,
+      className: classes,
+      htmlFor: this.uid
+    }, /*#__PURE__*/React.createElement("input", _extends({
+      name: name,
+      id: this.uid
+    }, restProps, {
+      ref: this.inputRef,
+      className: modules_df92307a.input,
+      type: "radio"
+    })), /*#__PURE__*/React.createElement("span", {
+      className: modules_df92307a.circle
+    }), /*#__PURE__*/React.createElement("span", {
+      className: modules_df92307a.label
+    }, children));
+  }
+
+}
+
+_defineProperty(Radio, "propTypes", {
+  className: PropTypes.string,
+  children: PropTypes.node,
+  value: PropTypes.string,
+  name: PropTypes.string,
+  checked: PropTypes.bool,
+  onChange: PropTypes.func
+});
+
+const RadioItem = /*#__PURE__*/forwardRef(function RadioItem(props, ref) {
+  return /*#__PURE__*/React.createElement(RadioContext.Consumer, null, _ref => {
+    let {
+      value,
+      onChange,
+      ...restContext
+    } = _ref;
+    return /*#__PURE__*/React.createElement(Radio, _extends({
+      ref: ref
+    }, restContext, {
+      checked: value != null ? value === props.value : undefined,
+      onChange: onChange && (() => onChange(props.value))
+    }, props));
+  });
+});
+RadioItem.propTypes = Radio.propTypes;
+
+export { Radio, RadioContext, RadioItem as default };

package/dist/radio-ng/radio-ng.js

@@ -0,0 +1,63 @@
+import angular from 'angular';
+import { m as modules_df92307a } from '../_helpers/radio.js';
+import proxyAttrs from '../proxy-attrs/proxy-attrs.js';
+import getUID from '../global/get-uid.js';
+
+/**
+ * @name Radio Ng
+ */
+
+const angularModule = angular.module('Ring.radio', []);
+angularModule.directive('rgRadio', function rgCheckboxDirective() {
+  return {
+    restrict: 'E',
+    transclude: true,
+    replace: true,
+    template: proxyAttrs(`
+      <label class="${modules_df92307a.radio}" data-test="ring-radio">
+        <input
+          type="radio"
+          class=${modules_df92307a.input}
+
+          data-proxy-ng-disabled
+          data-proxy-ng-model
+          data-proxy-ng-change
+          data-proxy-name
+          data-proxy-value
+          data-proxy-ng-value
+        />
+        <span class="${modules_df92307a.circle}"></span><span
+         class="${modules_df92307a.label}" ng-transclude></span>
+      </label>
+
+`),
+    link: function link(scope, iElement) {
+      const element = iElement[0];
+      const input = element.querySelector('input[type="radio"]');
+
+      function applyPassedID() {
+        const {
+          id
+        } = element;
+        element.setAttribute('for', id);
+        input.setAttribute('id', id);
+        element.removeAttribute('id');
+      }
+
+      function generateID() {
+        const id = getUID('ring-radio-item-');
+        element.setAttribute('for', id);
+        input.setAttribute('id', id);
+      }
+
+      if (element.id) {
+        applyPassedID();
+      } else {
+        generateID();
+      }
+    }
+  };
+});
+var radioNg = angularModule.name;
+
+export { radioNg as default };

package/dist/save-field-ng/save-field-ng.js

@@ -0,0 +1,335 @@
+import angular from 'angular';
+import '../loader-inline/loader-inline.js';
+import ButtonSet from '../button-set-ng/button-set-ng.js';
+import MessageBundle from '../message-bundle-ng/message-bundle-ng.js';
+import Form from '../form-ng/form-ng.js';
+import ShortcutsNg from '../shortcuts-ng/shortcuts-ng.js';
+import ButtonNG from '../button-ng/button-ng.js';
+import PromisedClick from '../promised-click-ng/promised-click-ng.js';
+import template from './save-field-ng__template.js';
+import '../_helpers/_rollupPluginBabelHelpers.js';
+import 'react';
+import 'classnames';
+import 'prop-types';
+import '../global/theme.js';
+import '../global/data-tests.js';
+import '../_helpers/inject-styles.js';
+import '../global/conic-gradient.js';
+import 'conic-gradient';
+import '../global/memoize.js';
+import '../global/supports-css.js';
+import '../global/inject-styles.js';
+import '../global/radial-gradient-mask.js';
+import '../global/get-uid.js';
+import '../_helpers/button-set.js';
+import '@jetbrains/angular-elastic';
+import '../global/dom.js';
+import '../shortcuts/core.js';
+import 'combokeys';
+import '../global/sniffer.js';
+import 'sniffr';
+import '../global/ring-angular-component.js';
+import '../icon-ng/icon-ng.js';
+import '../icon/icon__constants.js';
+import '../template-ng/template-ng.js';
+import '../_helpers/icon.js';
+import '../_helpers/button__classes.js';
+
+const angularModule = angular.module('Ring.save-field', [MessageBundle,
+/**
+ * for error-bubble
+ */
+Form, ShortcutsNg, ButtonNG, ButtonSet, PromisedClick]);
+angularModule.constant('rgSaveFieldShortcutsMode', {
+  id: 'ring-save-field',
+  shortcuts: [{
+    key: 'ctrl+enter',
+    action: 'comboSubmit'
+  }, {
+    key: 'enter',
+    action: 'submit'
+  }, {
+    key: 'esc',
+    action: 'cancel'
+  }, {
+    key: 'up',
+    action: 'noop'
+  }, {
+    key: 'down',
+    action: 'noop'
+  }]
+});
+angularModule.directive('rgSaveField', ["RingMessageBundle", "$timeout", "$q", "$compile", "$parse", function rgSaveFieldDirective(RingMessageBundle, $timeout, $q, $compile, $parse) {
+  const MULTI_LINE_SPLIT_PATTERN = /(\r\n|\n|\r)/gm;
+  const MULTI_LINE_LIST_MODE = 'list';
+  const CUSTOM_ERROR_ID = 'customError';
+  const ERROR_DESCRIPTION = 'error_description';
+  const ERROR_DEVELOPER_MSG = 'error_developer_message';
+  return {
+    require: 'rgSaveField',
+    transclude: true,
+    template,
+    scope: {
+      api: '=?',
+      value: '=',
+      workingValue: '=',
+      onSave: '&',
+      afterSave: '&?',
+      validate: '&?',
+      parseElement: '&?',
+      formatElement: '&?',
+      multiline: '@'
+    },
+    link: function link(scope, iElem, iAttrs, ctrl) {
+      const placeholder = angular.element(iElem[0].querySelector('.ring-save-field__transclude-placeholder'));
+      $compile(angular.element('<div rg-error-bubble="saveFieldForm"></div>'))(scope, errorBubble => {
+        placeholder.append(errorBubble);
+      });
+      const customError = {
+        message: ''
+      };
+      let isTextarea = false;
+      const draftMode = iAttrs.workingValue;
+      const valueField = draftMode ? 'workingValue' : 'value';
+
+      function submitChanges() {
+        if (!scope.saveFieldForm.$valid || scope.loading || angular.equals(scope.initial, scope[valueField])) {
+          return false;
+        }
+
+        function afterSaveCall() {
+          return $q.when(scope.afterSave({
+            value: scope[valueField]
+          }));
+        }
+
+        function success() {
+          scope.initial = angular.copy(scope[valueField]);
+          scope.saveFieldForm.$setPristine();
+          scope.done = true;
+
+          if (draftMode) {
+            scope.value = scope.workingValue;
+          }
+
+          $timeout(() => {
+            scope.done = false;
+          }, 1000); //eslint-disable-line no-magic-numbers
+
+          if (scope.afterSave) {
+            if (draftMode) {
+              return $timeout(afterSaveCall); // we need digest to sync value before calling after save
+            } else {
+              return afterSaveCall();
+            }
+          }
+
+          return undefined;
+        }
+
+        function error(err) {
+          let message;
+
+          if (typeof err === 'string') {
+            message = err;
+          } else if (typeof err === 'object') {
+            const errorData = err.data || err;
+            message = errorData[ERROR_DESCRIPTION] || errorData[ERROR_DEVELOPER_MSG];
+          }
+
+          customError.message = message;
+          scope.saveFieldForm.$setValidity(CUSTOM_ERROR_ID, false, customError);
+        }
+
+        scope.cancelBlur();
+        scope.loading = true;
+        let onsave = ctrl.getSave();
+
+        if (onsave) {
+          onsave = $q.when(onsave(scope[valueField]));
+        } else {
+          onsave = $q.when(scope.onSave({
+            value: scope[valueField]
+          }));
+        }
+
+        return onsave.then(success, error).then(() => {
+          scope.loading = false;
+        });
+      }
+
+      function resetValue() {
+        if (scope.loading) {
+          return;
+        }
+
+        scope.$evalAsync(() => {
+          scope[valueField] = scope.initial ? scope.initial : '';
+          scope.saveFieldForm.$setValidity(CUSTOM_ERROR_ID, true, customError);
+          scope.saveFieldForm.$setPristine();
+        });
+      }
+
+      function addMultilineProcessing(controlName) {
+        const stopWatch = scope.$watch(`saveFieldForm.${controlName}`, control => {
+          if (!control || !control.$formatters || !control.$parsers) {
+            return;
+          }
+
+          control.$formatters.push(value => {
+            if (!value) {
+              return value;
+            }
+
+            let formattedValue;
+
+            if (iAttrs.formatElement) {
+              formattedValue = value.map(element => scope.formatElement({
+                element
+              }));
+            } else {
+              formattedValue = value;
+            }
+
+            return formattedValue.join('\n');
+          });
+          control.$parsers.push(value => {
+            let array = value && value.split(MULTI_LINE_SPLIT_PATTERN) || [];
+
+            function notEmpty(val) {
+              return val && val.trim() && val !== '\n';
+            }
+
+            array = array.filter(notEmpty);
+
+            if (iAttrs.parseElement) {
+              array = array.map(element => scope.parseElement({
+                element: element.trim()
+              }));
+            }
+
+            return array;
+          });
+          stopWatch();
+        });
+      }
+
+      scope.cancelBlur = () => {
+        $timeout(() => {
+
+        }, 10);
+      };
+
+      if (draftMode) {
+        scope.$watch('value', value => {
+          scope.workingValue = angular.copy(value);
+          scope.initial = value;
+        });
+      }
+
+      scope.$watch(valueField, value => {
+        let promise = null;
+
+        if (scope.saveFieldForm.$pristine) {
+          scope.initial = value;
+        } else if (scope.initial && angular.equals(scope.initial, value)) {
+          resetValue();
+        } else if (scope.validate) {
+          promise = scope.validate({
+            value
+          });
+        }
+
+        $q.when(promise).then(error => {
+          if (error) {
+            return $q.reject(error);
+          } else {
+            customError.message = '';
+            scope.saveFieldForm.$setValidity(CUSTOM_ERROR_ID, true, customError);
+            return undefined;
+          }
+        }).catch(error => {
+          customError.message = error;
+          scope.saveFieldForm.$setValidity(CUSTOM_ERROR_ID, false, customError);
+        });
+      });
+      let inputNode = iElem[0].querySelector('input, .ring-save-field__input');
+
+      if (!inputNode) {
+        inputNode = iElem[0].querySelector('textarea');
+        isTextarea = !!inputNode;
+      }
+
+      if (inputNode) {
+        inputNode.classList.add('ring-js-shortcuts');
+        inputNode.addEventListener('focus', () => {
+          scope.$evalAsync(() => {
+            scope.focus = true;
+          });
+        });
+        inputNode.addEventListener('blur', () => {
+          scope.$evalAsync(() => {
+            scope.focus = false;
+          });
+        });
+
+        if (isTextarea && scope.multiline === MULTI_LINE_LIST_MODE) {
+          addMultilineProcessing(inputNode.name);
+        }
+      }
+
+      scope.wording = {
+        save: RingMessageBundle.form_save(),
+        saved: RingMessageBundle.form_saved(),
+        cancel: RingMessageBundle.form_cancel()
+      };
+      scope.keyMap = {
+        comboSubmit: e => {
+          if (isTextarea) {
+            e.preventDefault();
+            submitChanges();
+          }
+        },
+        submit: e => {
+          if (!isTextarea) {
+            e.preventDefault();
+            submitChanges();
+          }
+        },
+        cancel: resetValue,
+        noop: angular.noop
+      };
+      scope.api = {
+        save: submitChanges,
+        cancel: resetValue
+      };
+      scope.submitChanges = ctrl.submitChanges = submitChanges;
+      scope.cancelChanges = ctrl.cancelChanges = resetValue;
+      scope.focus = false;
+      scope.$on('$destroy', () => {
+        // 1) Bindings are already disabled by this time, so replacing scope.value = ... has no effect
+        // 2) We can't use scope.value.someField because we don't know anything about scope.value, it's passed from the outside
+        // 3) Probably we can use controllerAs to add one more object layer (ctrl.value) so the JS linking would work
+        // but errorBubble works with scope only, so a large refactoring of rgSaveField and other components is needed.
+        // This is the simplest solution:
+        if (iAttrs.value) {
+          $parse(iAttrs.value).assign(scope.$parent, scope.initial);
+        }
+      });
+    },
+
+    controller() {
+      let onSave = null;
+
+      this.setSave = cb => {
+        onSave = cb;
+      };
+
+      this.getSave = () => onSave;
+    }
+
+  };
+}]);
+var saveFieldNg = angularModule.name;
+
+export { saveFieldNg as default };

package/dist/save-field-ng/save-field-ng__template.js

@@ -0,0 +1,34 @@
+var template = `<div class="ring-save-field" ng-form="saveFieldForm" rg-shortcuts="ring-save-field" shortcuts-map="keyMap" shortcuts-focus="focus">
+  <span class="ring-save-field__transclude-placeholder" ng-transclude=""></span>
+
+  <rg-button
+    ng-show="saveFieldForm.$dirty && saveFieldForm.$valid"
+    mode="primary"
+    class="ring-save-field__button ng-hide"
+    ng-mousedown="cancelBlur()"
+
+    rg-promised-click="submitChanges($event)"
+    promised-mode="loader"
+  >
+    {{wording.save}}
+  </rg-button>
+
+  <rg-button
+    ng-show="saveFieldForm.$dirty && !loading"
+    class="ring-save-field__button ng-hide"
+    ng-click="cancelChanges($event)"
+    ng-mousedown="cancelBlur()"
+  >
+    {{wording.cancel}}
+  </rg-button>
+
+  <rg-button
+    ng-show="done"
+    ng-disabled="true"
+    class="ring-save-field__button ng-hide"
+  >
+    {{wording.saved}}
+  </rg-button>
+</div>`;
+
+export { template as default };