@jetbrains/ring-ui 4.1.0-beta.8 → 4.1.3

package/dist/http/http.js

@@ -1,4 +1,4 @@
-import { _ as _defineProperty, a as _objectWithoutProperties, c as _objectSpread2 } from '../_helpers/_rollupPluginBabelHelpers.js';
+import { _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
 import ExtendableError from 'es6-error';
 import { encodeURL, joinBaseURLAndPath } from '../global/url.js';
 
@@ -52,16 +52,14 @@ class HTTP {
 
     _defineProperty(this, "fetch", async function (url) {
       let params = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-
       const {
         body,
-        query = {}
-      } = params,
-            fetchConfig = _objectWithoutProperties(params, ["body", "query"]);
-
-      const response = await _this._fetch(_this._makeRequestUrl(url, query), _objectSpread2(_objectSpread2({}, fetchConfig), {}, {
+        query = {},
+        ...fetchConfig
+      } = params;
+      const response = await _this._fetch(_this._makeRequestUrl(url, query), { ...fetchConfig,
         body: body ? JSON.stringify(body) : body
-      }));
+      });
       return _this._processResponse(response);
     });
 
@@ -91,28 +89,31 @@ class HTTP {
 
     _defineProperty(this, "getMetaForResponse", response => this._requestsMeta.get(response));
 
-    _defineProperty(this, "get", (url, params) => this.request(url, _objectSpread2({
-      method: 'GET'
-    }, params)));
+    _defineProperty(this, "get", (url, params) => this.request(url, {
+      method: 'GET',
+      ...params
+    }));
 
-    _defineProperty(this, "post", (url, params) => this.request(url, _objectSpread2({
-      method: 'POST'
-    }, params)));
+    _defineProperty(this, "post", (url, params) => this.request(url, {
+      method: 'POST',
+      ...params
+    }));
 
     if (_auth) {
       this.setAuth(_auth);
     }
 
     this.setBaseUrl(_baseUrl);
-
     const {
-      headers
-    } = defaultFetchConfig,
-          defaultConfig = _objectWithoutProperties(defaultFetchConfig, ["headers"]);
-
-    this.fetchConfig = _objectSpread2(_objectSpread2(_objectSpread2({}, defaultConfig), _fetchConfig), {}, {
-      headers: _objectSpread2(_objectSpread2({}, headers), _fetchConfig.headers)
-    });
+      headers,
+      ...defaultConfig
+    } = defaultFetchConfig;
+    this.fetchConfig = { ...defaultConfig,
+      ..._fetchConfig,
+      headers: { ...headers,
+        ..._fetchConfig.headers
+      }
+    };
   }
 
   _fetch() {
@@ -126,29 +127,29 @@ class HTTP {
 
   _performRequest(url, token) {
     let params = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-
     const {
       headers,
       body,
       query = {},
-      sendRawBody
-    } = params,
-          fetchConfig = _objectWithoutProperties(params, ["headers", "body", "query", "sendRawBody"]);
-
-    const combinedHeaders = _objectSpread2(_objectSpread2(_objectSpread2({}, this.fetchConfig.headers), token ? {
-      Authorization: `${TOKEN_TYPE} ${token}`
-    } : {}), headers);
-
+      sendRawBody,
+      ...fetchConfig
+    } = params;
+    const combinedHeaders = { ...this.fetchConfig.headers,
+      ...(token ? {
+        Authorization: `${TOKEN_TYPE} ${token}`
+      } : {}),
+      ...headers
+    };
     Object.keys(combinedHeaders).forEach(key => {
       if (combinedHeaders[key] === null || combinedHeaders[key] === undefined) {
         Reflect.deleteProperty(combinedHeaders, key);
       }
     });
-    return this._fetch(this._makeRequestUrl(url, query), _objectSpread2(_objectSpread2(_objectSpread2({}, this.fetchConfig), {}, {
-      headers: combinedHeaders
-    }, fetchConfig), {}, {
+    return this._fetch(this._makeRequestUrl(url, query), { ...this.fetchConfig,
+      headers: combinedHeaders,
+      ...fetchConfig,
       body: body && !sendRawBody ? JSON.stringify(body) : body
-    }));
+    });
   }
 
   _storeRequestMeta(parsedResponse, rawResponse) {
@@ -212,5 +213,4 @@ class HTTP {
 
 }
 
-export default HTTP;
-export { CODE, HTTPError, defaultFetchConfig };
+export { CODE, HTTPError, HTTP as default, defaultFetchConfig };

package/dist/http/http.mock.js

@@ -1,5 +1,5 @@
-import { c as _objectSpread2 } from '../_helpers/_rollupPluginBabelHelpers.js';
 import HTTP from './http.js';
+import '../_helpers/_rollupPluginBabelHelpers.js';
 import 'es6-error';
 import '../global/url.js';
 
@@ -19,9 +19,9 @@ class HTTPMock extends HTTP {
   _fetch(url, params) {
     this.requests = [...this.requests, {
       url,
-      params: _objectSpread2(_objectSpread2({}, params), {}, {
+      params: { ...params,
         body: params.body ? JSON.parse(params.body) : params.body
-      })
+      }
     }];
     return {
       status: 200,
@@ -62,4 +62,4 @@ class HTTPMock extends HTTP {
 
 }
 
-export default HTTPMock;
+export { HTTPMock as default };

package/dist/hub-source/hub-source.js

@@ -127,4 +127,4 @@ class HubSource {
 
 _defineProperty(HubSource, "TOP_ALL", -1);
 
-export default HubSource;
+export { HubSource as default };

package/dist/hub-source/hub-source__users-groups.js

@@ -59,4 +59,4 @@ class HubSourceUsersGroups {
 
 }
 
-export default HubSourceUsersGroups;
+export { HubSourceUsersGroups as default };

package/dist/icon/icon.js

@@ -1,11 +1,12 @@
-import { a as _objectWithoutProperties, b as _extends, _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
+import { _ as _defineProperty, a as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
 import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import deprecate from 'util-deprecate';
 import { Color, Size } from './icon__constants.js';
 export { Size } from './icon__constants.js';
-import { m as modules_29747b80, I as IconSVG } from '../_helpers/icon__svg.js';
+import { m as modules_29747b80 } from '../_helpers/icon.js';
+import IconSVG from './icon__svg.js';
 import '../global/memoize.js';
 
 const warnSize = deprecate(() => {}, `\`size\`, \`width\` and \`height\` props are not recommended to use in Ring UI \`Icon\` component. The intrinsic sizes of SVG icon (\`width\` and \`height\` SVG attributes) are used instead.
@@ -47,8 +48,7 @@ class Icon extends PureComponent {
   }
 
   render() {
-    const _this$props = this.props,
-          {
+    const {
       className,
       size,
       color,
@@ -56,9 +56,9 @@ class Icon extends PureComponent {
       glyph: Glyph,
       width,
       height,
-      suppressSizeWarning
-    } = _this$props,
-          restProps = _objectWithoutProperties(_this$props, ["className", "size", "color", "loading", "glyph", "width", "height", "suppressSizeWarning"]);
+      suppressSizeWarning,
+      ...restProps
+    } = this.props;
 
     if (!Glyph) {
       return null;
@@ -102,4 +102,4 @@ _defineProperty(Icon, "Color", Color);
 
 _defineProperty(Icon, "Size", Size);
 
-export default Icon;
+export { Icon as default };

package/dist/icon/icon__svg.js

@@ -1,6 +1,81 @@
-import '../_helpers/_rollupPluginBabelHelpers.js';
-import 'react';
-import 'classnames';
-import 'prop-types';
-import '../global/memoize.js';
-export { I as default } from '../_helpers/icon__svg.js';
+import { a as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
+import React, { memo } from 'react';
+import classNames from 'classnames';
+import PropTypes from 'prop-types';
+import memoize from '../global/memoize.js';
+import { m as modules_29747b80 } from '../_helpers/icon.js';
+
+function convertReactSVGDOMProperty(str) {
+  return str.replace(/[-|:]([a-z])/g, g => g[1].toUpperCase());
+}
+
+function serializeAttrs(map) {
+  const res = {};
+
+  for (let i = 0; i < map.length; i++) {
+    const key = map[i].name;
+    let prop = key;
+
+    if (key === 'class') {
+      prop = 'className';
+    } else if (!key.startsWith('data-')) {
+      prop = convertReactSVGDOMProperty(key);
+    }
+
+    res[prop] = map[i].value;
+  }
+
+  return res;
+}
+
+function extractSVGProps(svgNode) {
+  const map = svgNode.attributes;
+  return map.length > 0 ? serializeAttrs(map) : null;
+}
+
+const getSVGFromSource = memoize(src => {
+  const svgContainer = document.createElement('div');
+  svgContainer.innerHTML = src;
+  const svg = svgContainer.firstElementChild;
+  svg.remove ? svg.remove() : svgContainer.removeChild(svg);
+  return {
+    props: extractSVGProps(svg),
+    html: svg.innerHTML
+  };
+});
+
+function isCompatibilityMode(iconSrc) {
+  const hasWidth = /width="[\d\.]+"/ig.test(iconSrc);
+  const hasHeight = /height="[\d\.]+"/ig.test(iconSrc);
+  return !hasWidth || !hasHeight;
+}
+
+function IconSVG(_ref) {
+  let {
+    src,
+    className,
+    ...rest
+  } = _ref;
+  const glyphClasses = classNames(modules_29747b80.glyph, {
+    [modules_29747b80.compatibilityMode]: isCompatibilityMode(src)
+  }, className);
+  const {
+    props,
+    html
+  } = getSVGFromSource(src);
+  return /*#__PURE__*/React.createElement("svg", _extends({}, props, rest, {
+    className: glyphClasses,
+    dangerouslySetInnerHTML: {
+      __html: html
+    }
+  }));
+}
+
+IconSVG.propTypes = {
+  className: PropTypes.string,
+  src: PropTypes.string.isRequired,
+  style: PropTypes.object
+};
+var IconSVG$1 = /*#__PURE__*/memo(IconSVG);
+
+export { IconSVG$1 as default };

package/dist/icon/index.js

@@ -5,5 +5,6 @@ import 'react';
 import 'prop-types';
 import 'classnames';
 import 'util-deprecate';
-import '../_helpers/icon__svg.js';
+import '../_helpers/icon.js';
+import './icon__svg.js';
 import '../global/memoize.js';

package/dist/icon-ng/icon-ng.js

@@ -0,0 +1,89 @@
+import angular from 'angular';
+import { Color } from '../icon/icon__constants.js';
+import RingTemplateNg from '../template-ng/template-ng.js';
+import { m as modules_29747b80 } from '../_helpers/icon.js';
+import '../_helpers/_rollupPluginBabelHelpers.js';
+import '../global/ring-angular-component.js';
+
+/**
+ * @name Icon Ng
+ */
+
+const angularModule = angular.module('Ring.icon', [RingTemplateNg]);
+const BASE64_PREFIX = 'data:image/svg+xml;base64,';
+angularModule.directive('rgIcon', function rgIconDirective() {
+  return {
+    restrict: 'E',
+    scope: {
+      glyph: '@',
+      loading: '=?',
+      color: '@?',
+      size: '@?',
+      height: '@?',
+      width: '@?'
+    },
+    template: `<span class="${modules_29747b80.icon}" rg-template="normalizedGlyph" rg-template-class="${modules_29747b80.glyph}"></span>`,
+    controller: ["$scope", $scope => {
+      function decodeBase64IfNeeded(glyph) {
+        // This hack allows passing SVG content as string from angular templates like
+        // <rg-icon glyph="data:image/svg+xml;base64,PHN2ZyB4bWx...></rg-icon>
+        const isEncoded = glyph.indexOf(BASE64_PREFIX) === 0;
+        return isEncoded ? window.atob(glyph.replace(BASE64_PREFIX, '')) : glyph;
+      }
+
+      $scope.$watch('glyph', value => {
+        if (!value) {
+          return;
+        }
+
+        $scope.normalizedGlyph = decodeBase64IfNeeded(value);
+      });
+    }],
+    link: function link(scope, iElement, iAttrs) {
+      iAttrs.$addClass('ring-icon'); // TODO: We keep this class for now for compatibility reasons (styles overrides)
+
+      scope.$watch('loading', value => {
+        if (value) {
+          iAttrs.$addClass(modules_29747b80.loading);
+        } else {
+          iAttrs.$removeClass(modules_29747b80.loading);
+        }
+      });
+      scope.$watch(() => scope.color && Color[scope.color] && modules_29747b80[Color[scope.color]], (colorClass, prevColorClass) => {
+        if (colorClass) {
+          iAttrs.$addClass(colorClass); // Remove previous class, but don't remove initial one
+
+          if (prevColorClass && prevColorClass !== colorClass) {
+            iAttrs.$removeClass(prevColorClass);
+          }
+        }
+      });
+      scope.$watchGroup(['size', 'width', 'height'], _ref => {
+        let [size, width, height] = _ref;
+        const svgNode = iElement[0].querySelector('svg');
+
+        if (!svgNode) {
+          return;
+        }
+
+        if (size && !width && !height) {
+          const sizeString = `${size}px`;
+          const style = `width: ${sizeString}; height: ${sizeString};`;
+          svgNode.setAttribute('style', style);
+          return;
+        }
+
+        if (width) {
+          svgNode.setAttribute('style', `width: ${width}px;`);
+        }
+
+        if (height) {
+          svgNode.setAttribute('style', `height: ${height}px;`);
+        }
+      });
+    }
+  };
+});
+var IconNG = angularModule.name;
+
+export { IconNG as default };

package/dist/input/input.js

@@ -1,4 +1,4 @@
-import { _ as _defineProperty, a as _objectWithoutProperties, b as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
+import { _ as _defineProperty, a as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
 import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
@@ -8,17 +8,17 @@ export { default as Theme } from '../global/theme.js';
 import Button from '../button/button.js';
 import getUID from '../global/get-uid.js';
 import Icon from '../icon/icon.js';
+import { m as modules_88cfaf40 } from '../_helpers/input.js';
 import 'focus-visible';
 import '@jetbrains/icons/chevron-10px';
 import '../link/clickableLink.js';
 import '../_helpers/button__classes.js';
 import '../icon/icon__constants.js';
 import 'util-deprecate';
-import '../_helpers/icon__svg.js';
+import '../_helpers/icon.js';
+import '../icon/icon__svg.js';
 import '../global/memoize.js';
 
-var modules_88cfaf40 = {"unit":"8px","iconOffset":"22px","input":"input_input__74bd3acf","container":"input_container__74bd3acf global_fontLower__0f8f4370 global_font__0f8f4370","compact":"input_compact__74bd3acf","clearable":"input_clearable__74bd3acf","light":"input_light__74bd3acf","dark":"input_dark__74bd3acf","withIcon":"input_withIcon__74bd3acf","label":"input_label__74bd3acf","icon":"input_icon__74bd3acf","clear":"input_clear__74bd3acf","empty":"input_empty__74bd3acf","active":"input_active__74bd3acf","noLabel":"input_noLabel__74bd3acf","error":"input_error__74bd3acf","underline":"input_underline__74bd3acf","focusUnderline":"input_focusUnderline__74bd3acf","errorUnderline":"input_errorUnderline__74bd3acf","errorText":"input_errorText__74bd3acf","sizeS":"input_sizeS__74bd3acf","sizeM":"input_sizeM__74bd3acf","sizeL":"input_sizeL__74bd3acf","sizeFULL":"input_sizeFULL__74bd3acf"};
-
 function noop() {}
 /**
  * @name Input
@@ -105,8 +105,7 @@ class Input extends PureComponent {
   }
 
   render() {
-    const _this$props = this.props,
-          {
+    const {
       // Modifiers
       theme,
       size,
@@ -129,10 +128,9 @@ class Input extends PureComponent {
       id,
       placeholder,
       icon,
-      renderUnderline
-    } = _this$props,
-          restProps = _objectWithoutProperties(_this$props, ["theme", "size", "active", "multiline", "borderless", "compact", "label", "error", "className", "inputClassName", "children", "value", "onClear", "disabled", "inputRef", "onChange", "enableShortcuts", "id", "placeholder", "icon", "renderUnderline"]);
-
+      renderUnderline,
+      ...restProps
+    } = this.props;
     const minimizeMargins = compact || borderless;
     const {
       empty
@@ -227,5 +225,4 @@ _defineProperty(Input, "defaultProps", {
 
 var Input$1 = withTheme()(Input);
 
-export default Input$1;
-export { Input, Size };
+export { Input, Size, Input$1 as default };

package/dist/input-ng/input-ng.js

@@ -0,0 +1,166 @@
+import { _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
+import angular from 'angular';
+import classNames from 'classnames';
+import closeIcon from '@jetbrains/icons/close';
+import RingAngularComponent from '../global/ring-angular-component.js';
+import { m as modules_88cfaf40 } from '../_helpers/input.js';
+import Theme from '../global/theme.js';
+import ButtonNG from '../button-ng/button-ng.js';
+import 'react';
+import '../global/dom.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';
+
+var modules_c40fa551 = {"errorText":"errorText_rui_e22b","clear":"clear_rui_e22b"};
+
+const angularModule = angular.module('Ring.input', [ButtonNG]);
+
+class RingInputComponent extends RingAngularComponent {
+  $onInit() {
+    this.closeIcon = closeIcon;
+
+    if (!this.ngModelCtrl) {
+      return;
+    }
+
+    this.ngModelCtrl.$render = () => {
+      this.value = this.ngModelCtrl.$viewValue;
+    };
+  }
+
+  onInputChange() {
+    if (!this.ngModelCtrl) {
+      return;
+    }
+
+    this.ngModelCtrl.$setViewValue(this.value);
+  }
+
+  stretch(el) {
+    if (!el) {
+      return;
+    }
+
+    el.style.height = `${el.scrollHeight}px`;
+  }
+
+  onKeyUp() {
+    if (!this.inputNode) {
+      this.inputNode = this.$inject.$element[0].querySelector('[data-test="ring-input"]');
+    }
+
+    if (this.multiline && this.inputNode.scrollHeight > this.inputNode.clientHeight) {
+      this.stretch(this.inputNode);
+    }
+  }
+
+  onClear() {
+    this.value = '';
+  }
+
+  getContainerClasses() {
+    return classNames(modules_88cfaf40.container, modules_88cfaf40[this.theme || Theme.LIGHT], this.size ? [modules_88cfaf40[`size${this.size}`]] : null, {
+      [modules_88cfaf40.active]: this.active,
+      [modules_88cfaf40.error]: this.error != null,
+      [modules_88cfaf40.empty]: !this.value,
+      [modules_88cfaf40.noLabel]: !this.label,
+      [modules_88cfaf40.clearable]: this.clearable,
+      [modules_88cfaf40.borderless]: this.borderless
+    });
+  }
+
+}
+
+_defineProperty(RingInputComponent, "$inject", ['$element']);
+
+_defineProperty(RingInputComponent, "require", {
+  ngModelCtrl: '?ngModel'
+});
+
+_defineProperty(RingInputComponent, "bindings", {
+  name: '@',
+  required: '@',
+  ngMinlength: '@',
+  ngMaxlength: '@',
+  placeholder: '@',
+  ngModel: '<',
+  onChange: '&',
+  label: '@',
+  hint: '@',
+  size: '@',
+  theme: '@',
+  disabled: '@',
+  active: '<',
+  error: '@',
+  empty: '<',
+  clearable: '<',
+  borderless: '<',
+  multiline: '<'
+});
+
+_defineProperty(RingInputComponent, "template", `
+<div
+  data-test="ring-input-container"
+  ng-class="$ctrl.getContainerClasses()"
+>
+  <input
+    aria-label="{{$ctrl.label || $ctrl.placeholder}}"
+    type="text"
+    data-test="ring-input"
+    class="${modules_88cfaf40.input}"
+    name="{{$ctrl.name}}"
+    ng-if="!$ctrl.multiline"
+    placeholder="{{$ctrl.placeholder}}"
+    ng-model="$ctrl.value"
+    ng-required="$ctrl.required"
+    ng-disabled="$ctrl.disabled"
+    ng-minlength="$ctrl.ngMinlength"
+    ng-maxlength="$ctrl.ngMaxlength"
+    ng-change="$ctrl.onInputChange()"
+    ng-keyup="$ctrl.onKeyUp()"
+  />
+
+  <textarea
+    aria-label="{{$ctrl.label || $ctrl.placeholder}}"
+    data-test="ring-input"
+    ng-if="$ctrl.multiline"
+    class="${modules_88cfaf40.input}"
+    rows="1"
+    name="{{$ctrl.name}}"
+    placeholder="{{$ctrl.placeholder}}"
+    ng-model="$ctrl.value"
+    ng-required="$ctrl.required"
+    ng-disabled="$ctrl.disabled"
+    ng-minlength="$ctrl.ngMinlength"
+    ng-maxlength="$ctrl.ngMaxlength"
+    ng-change="$ctrl.onInputChange()"
+    ng-keyup="$ctrl.onKeyUp()"
+  ></textarea>
+
+  <rg-button
+    ng-if="$ctrl.clearable"
+    data-test="ring-input-clear"
+    class="${modules_88cfaf40.clear} ${modules_c40fa551.clear}"
+    icon="{{:: $ctrl.closeIcon}}"
+    ng-click="$ctrl.onClear()"
+  ></rg-button>
+
+  <label
+    ng-if="!$ctrl.borderless"
+    class="${modules_88cfaf40.label}"
+  >{{$ctrl.label}}</label>
+
+  <div ng-if="!$ctrl.borderless" class="${modules_88cfaf40.underline}"></div>
+  <div ng-if="!$ctrl.borderless" class="${modules_88cfaf40.focusUnderline}"></div>
+  <div ng-if="!$ctrl.borderless" class="${modules_88cfaf40.errorUnderline}"></div>
+  <div ng-if="!$ctrl.borderless && $ctrl.error" class="${modules_88cfaf40.errorText} ${modules_c40fa551.errorText}">{{$ctrl.error}}</div>
+</div>
+  `);
+
+angularModule.component('rgInput', RingInputComponent);
+var InputNg = angularModule.name;
+
+export { InputNg as default };

package/dist/island/adaptive-island-hoc.js

@@ -44,5 +44,4 @@ function adaptiveIslandHOC(ComposedComponent) {
   }, _defineProperty(_class, "propTypes", ComposedComponent.propTypes), _temp;
 }
 
-export default adaptiveIslandHOC;
-export { PhaseContext, ScrollHandlerContext };
+export { PhaseContext, ScrollHandlerContext, adaptiveIslandHOC as default };

package/dist/island/content.js

@@ -1,4 +1,4 @@
-import { _ as _defineProperty, b as _extends, a as _objectWithoutProperties } from '../_helpers/_rollupPluginBabelHelpers.js';
+import { _ as _defineProperty, a as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
@@ -89,18 +89,16 @@ class Content extends Component {
   }
 
   render() {
-    const _this$props = this.props,
-          {
+    const {
       children,
       className,
       bottomBorder,
       scrollableWrapperClassName,
       onScroll,
       onScrollToBottom,
-      fade
-    } = _this$props,
-          restProps = _objectWithoutProperties(_this$props, ["children", "className", "bottomBorder", "scrollableWrapperClassName", "onScroll", "onScrollToBottom", "fade"]);
-
+      fade,
+      ...restProps
+    } = this.props;
     const {
       scrolledToTop,
       scrolledToBottom
@@ -155,4 +153,4 @@ const ContentWrapper = props => /*#__PURE__*/React.createElement(ScrollHandlerCo
   return /*#__PURE__*/React.createElement(Content, _extends({}, props, addProps));
 });
 
-export default ContentWrapper;
+export { ContentWrapper as default };