@jetbrains/ring-ui 5.1.23 → 5.1.24

package/dist/icon/icon.js

@@ -0,0 +1,110 @@
+import { _ as _defineProperty, a as _inherits, b as _createSuper, c as _classCallCheck, d as _createClass, e as _objectWithoutProperties, f 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';
+import { m as modules_29747b80 } from '../_helpers/icon.js';
+import IconSVG from './icon__svg.js';
+import 'core-js/modules/es.regexp.exec.js';
+import 'core-js/modules/es.string.replace.js';
+import 'core-js/modules/es.string.starts-with.js';
+import '../global/memoize.js';
+import 'core-js/modules/es.array.iterator.js';
+import 'core-js/modules/es.map.js';
+import 'core-js/modules/es.object.to-string.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/es.weak-map.js';
+
+var _excluded = ["className", "size", "color", "loading", "glyph", "width", "height", "suppressSizeWarning"];
+var _warnSize = deprecate(function () {}, "`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.\n\nWe strongly recommend to use icons handcrafted for particular sizes. If your icon doesn't exist in the desired size, please ask your designer to draw one. \"Responsive\" checkmark should be unchecked when exporting icon.'");
+var Icon = /*#__PURE__*/function (_PureComponent) {
+  _inherits(Icon, _PureComponent);
+  var _super = _createSuper(Icon);
+  function Icon() {
+    _classCallCheck(this, Icon);
+    return _super.apply(this, arguments);
+  }
+  _createClass(Icon, [{
+    key: "warnSize",
+    value: function warnSize() {
+      if (this.props.suppressSizeWarning) {
+        return;
+      }
+      _warnSize();
+    }
+  }, {
+    key: "getStyle",
+    value: function getStyle() {
+      var _this$props = this.props,
+        size = _this$props.size,
+        width = _this$props.width,
+        height = _this$props.height;
+      if (width || height) {
+        this.warnSize();
+        return {
+          width,
+          height
+        };
+      }
+      if (size) {
+        this.warnSize();
+        return {
+          width: size,
+          height: size
+        };
+      }
+      return undefined;
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$props2 = this.props,
+        className = _this$props2.className;
+        _this$props2.size;
+        var color = _this$props2.color,
+        loading = _this$props2.loading,
+        Glyph = _this$props2.glyph;
+        _this$props2.width;
+        _this$props2.height;
+        _this$props2.suppressSizeWarning;
+        var restProps = _objectWithoutProperties(_this$props2, _excluded);
+      if (!Glyph) {
+        return null;
+      }
+      var classes = classNames(modules_29747b80.icon, {
+        [modules_29747b80[color]]: !!color,
+        [modules_29747b80.loading]: loading
+      }, className);
+      return /*#__PURE__*/React.createElement("span", _extends({}, restProps, {
+        className: classes
+      }), typeof Glyph === 'string' ? /*#__PURE__*/React.createElement(IconSVG, {
+        src: Glyph,
+        style: this.getStyle()
+      }) : /*#__PURE__*/React.createElement(Glyph, {
+        className: modules_29747b80.glyph,
+        style: this.getStyle()
+      }));
+    }
+  }]);
+  return Icon;
+}(PureComponent);
+_defineProperty(Icon, "propTypes", {
+  className: PropTypes.string,
+  color: PropTypes.string,
+  glyph: PropTypes.oneOfType([PropTypes.string, PropTypes.elementType]).isRequired,
+  height: PropTypes.number,
+  size: PropTypes.number,
+  width: PropTypes.number,
+  loading: PropTypes.bool,
+  suppressSizeWarning: PropTypes.bool
+});
+_defineProperty(Icon, "defaultProps", {
+  className: '',
+  color: Color.DEFAULT,
+  glyph: ''
+});
+_defineProperty(Icon, "Color", Color);
+_defineProperty(Icon, "Size", Size);
+
+export { Color, Size, Icon as default };

package/dist/icon/icon__constants.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Commonly used icon colors.
+ * @enum {string}
+ */
+export declare enum Color {
+    BLUE = "blue",
+    DEFAULT = "",
+    GRAY = "gray",
+    GREEN = "green",
+    MAGENTA = "magenta",
+    RED = "red",
+    WHITE = "white"
+}
+/**
+ * @enum {number}
+ */
+export declare enum Size {
+    Size12 = 12,
+    Size14 = 14,
+    Size16 = 16,
+    Size18 = 18,
+    Size20 = 20,
+    Size24 = 24,
+    Size32 = 32,
+    Size40 = 40,
+    Size48 = 48,
+    Size64 = 64,
+    Size96 = 96,
+    Size128 = 128
+}

package/dist/icon/icon__constants.js

@@ -0,0 +1,34 @@
+/**
+ * Commonly used icon colors.
+ * @enum {string}
+ */
+var Color;
+(function (Color) {
+  Color["BLUE"] = "blue";
+  Color["DEFAULT"] = "";
+  Color["GRAY"] = "gray";
+  Color["GREEN"] = "green";
+  Color["MAGENTA"] = "magenta";
+  Color["RED"] = "red";
+  Color["WHITE"] = "white";
+})(Color || (Color = {}));
+/**
+ * @enum {number}
+ */
+var Size;
+(function (Size) {
+  Size[Size["Size12"] = 12] = "Size12";
+  Size[Size["Size14"] = 14] = "Size14";
+  Size[Size["Size16"] = 16] = "Size16";
+  Size[Size["Size18"] = 18] = "Size18";
+  Size[Size["Size20"] = 20] = "Size20";
+  Size[Size["Size24"] = 24] = "Size24";
+  Size[Size["Size32"] = 32] = "Size32";
+  Size[Size["Size40"] = 40] = "Size40";
+  Size[Size["Size48"] = 48] = "Size48";
+  Size[Size["Size64"] = 64] = "Size64";
+  Size[Size["Size96"] = 96] = "Size96";
+  Size[Size["Size128"] = 128] = "Size128";
+})(Size || (Size = {}));
+
+export { Color, Size };

package/dist/icon/icon__svg.d.ts

@@ -0,0 +1,15 @@
+import React, { SVGAttributes } from 'react';
+import PropTypes from 'prop-types';
+export interface IconSVGProps extends SVGAttributes<SVGSVGElement> {
+    src: string;
+}
+declare function IconSVG({ src, className, ...rest }: IconSVGProps): React.JSX.Element;
+declare namespace IconSVG {
+    var propTypes: {
+        className: PropTypes.Requireable<string>;
+        src: PropTypes.Validator<string>;
+        style: PropTypes.Requireable<object>;
+    };
+}
+declare const _default: React.MemoExoticComponent<typeof IconSVG>;
+export default _default;

package/dist/icon/icon__svg.js

@@ -0,0 +1,79 @@
+import { e as _objectWithoutProperties, f as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/es.regexp.exec.js';
+import 'core-js/modules/es.string.replace.js';
+import 'core-js/modules/es.string.starts-with.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';
+import 'core-js/modules/es.array.iterator.js';
+import 'core-js/modules/es.map.js';
+import 'core-js/modules/es.object.to-string.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/es.weak-map.js';
+
+var _excluded = ["src", "className"];
+function convertReactSVGDOMProperty(str) {
+  return str.replace(/[-|:]([a-z])/g, function (g) {
+    return g[1].toUpperCase();
+  });
+}
+function serializeAttrs(map) {
+  var res = {};
+  for (var i = 0; i < map.length; i++) {
+    var key = map[i].name;
+    var 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) {
+  var map = svgNode.attributes;
+  return map.length > 0 ? serializeAttrs(map) : null;
+}
+var getSVGFromSource = memoize(function (src) {
+  var svgContainer = document.createElement('div');
+  svgContainer.innerHTML = src;
+  var svg = svgContainer.firstElementChild;
+  svg.remove ? svg.remove() : svgContainer.removeChild(svg);
+  return {
+    props: extractSVGProps(svg),
+    html: svg.innerHTML
+  };
+});
+function isCompatibilityMode(iconSrc) {
+  var hasWidth = /width="[\d\.]+"/ig.test(iconSrc);
+  var hasHeight = /height="[\d\.]+"/ig.test(iconSrc);
+  return !hasWidth || !hasHeight;
+}
+function IconSVG(_ref) {
+  var src = _ref.src,
+    className = _ref.className,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var glyphClasses = classNames(modules_29747b80.glyph, {
+    [modules_29747b80.compatibilityMode]: isCompatibilityMode(src)
+  }, className);
+  var _getSVGFromSource = getSVGFromSource(src),
+    props = _getSVGFromSource.props,
+    html = _getSVGFromSource.html;
+  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.d.ts

@@ -0,0 +1,2 @@
+export { default } from './icon';
+export * from './icon';

package/dist/icon/index.js

@@ -0,0 +1,18 @@
+export { default } from './icon.js';
+export { Color, Size } from './icon__constants.js';
+import '../_helpers/_rollupPluginBabelHelpers.js';
+import 'react';
+import 'prop-types';
+import 'classnames';
+import 'util-deprecate';
+import '../_helpers/icon.js';
+import './icon__svg.js';
+import 'core-js/modules/es.regexp.exec.js';
+import 'core-js/modules/es.string.replace.js';
+import 'core-js/modules/es.string.starts-with.js';
+import '../global/memoize.js';
+import 'core-js/modules/es.array.iterator.js';
+import 'core-js/modules/es.map.js';
+import 'core-js/modules/es.object.to-string.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/es.weak-map.js';

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

@@ -0,0 +1,95 @@
+import { j as _slicedToArray } from '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/es.array.concat.js';
+import 'core-js/modules/es.array.index-of.js';
+import 'core-js/modules/es.regexp.exec.js';
+import 'core-js/modules/es.string.replace.js';
+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 '../global/ring-angular-component.js';
+import 'core-js/modules/es.object.to-string.js';
+import 'core-js/modules/web.dom-collections.for-each.js';
+
+/**
+ * @name Icon Ng
+ */
+
+var angularModule = angular.module('Ring.icon', [RingTemplateNg]);
+var 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=\"".concat(modules_29747b80.icon, "\" rg-template=\"normalizedGlyph\" rg-template-class=\"").concat(modules_29747b80.glyph, "\"></span>"),
+    controller: ["$scope", function controller($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>
+        var isEncoded = glyph.indexOf(BASE64_PREFIX) === 0;
+        return isEncoded ? window.atob(glyph.replace(BASE64_PREFIX, '')) : glyph;
+      }
+      $scope.$watch('glyph', function (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', function (value) {
+        if (value) {
+          iAttrs.$addClass(modules_29747b80.loading);
+        } else {
+          iAttrs.$removeClass(modules_29747b80.loading);
+        }
+      });
+      scope.$watch(function () {
+        return scope.color && Color[scope.color] && modules_29747b80[Color[scope.color]];
+      }, function (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'], function (_ref) {
+        var _ref2 = _slicedToArray(_ref, 3),
+          size = _ref2[0],
+          width = _ref2[1],
+          height = _ref2[2];
+        var svgNode = iElement[0].querySelector('svg');
+        if (!svgNode) {
+          return;
+        }
+        if (size && !width && !height) {
+          var sizeString = "".concat(size, "px");
+          var style = "width: ".concat(sizeString, "; height: ").concat(sizeString, ";");
+          svgNode.setAttribute('style', style);
+          return;
+        }
+        if (width) {
+          svgNode.setAttribute('style', "width: ".concat(width, "px;"));
+        }
+        if (height) {
+          svgNode.setAttribute('style', "height: ".concat(height, "px;"));
+        }
+      });
+    }
+  };
+});
+var IconNG = angularModule.name;
+
+export { IconNG as default };

package/dist/input/input.d.ts

@@ -0,0 +1,77 @@
+import React, { PureComponent, Ref, ComponentType, InputHTMLAttributes, TextareaHTMLAttributes, ReactNode } from 'react';
+import { ControlsHeight } from '../global/controls-height';
+import { LabelType } from '../control-label/control-label';
+declare function noop(): void;
+/**
+ * @name Input
+ */
+declare enum Size {
+    AUTO = "Auto",
+    S = "S",
+    M = "M",
+    L = "L",
+    FULL = "FULL"
+}
+export interface InputTranslations {
+    clear: string;
+}
+export interface InputBaseProps {
+    size: Size;
+    enableShortcuts: boolean | string[];
+    children?: string | undefined;
+    inputClassName?: string | null | undefined;
+    label?: ReactNode;
+    labelType?: LabelType;
+    active?: boolean | null | undefined;
+    error?: ReactNode | null | undefined;
+    borderless?: boolean | null | undefined;
+    onClear?: ((e: React.MouseEvent<HTMLButtonElement>) => void) | null | undefined;
+    loading?: boolean | null | undefined;
+    icon?: string | ComponentType | null | undefined;
+    height?: ControlsHeight | undefined;
+    afterInput?: ReactNode;
+    translations?: InputTranslations | null | undefined;
+}
+type Override<D, S> = Omit<D, keyof S> & S;
+export type InputSpecificProps = Override<InputHTMLAttributes<HTMLInputElement>, InputBaseProps> & {
+    multiline?: false | undefined;
+    inputRef: Ref<HTMLInputElement>;
+};
+type TextAreaSpecificProps = Override<TextareaHTMLAttributes<HTMLTextAreaElement>, InputBaseProps> & {
+    multiline: true;
+    inputRef: Ref<HTMLTextAreaElement>;
+};
+export type InputProps = InputSpecificProps | TextAreaSpecificProps;
+export declare class Input extends PureComponent<InputProps> {
+    static defaultProps: {
+        size: Size;
+        onChange: typeof noop;
+        inputRef: typeof noop;
+        enableShortcuts: string[];
+    };
+    state: {
+        empty: boolean;
+    };
+    componentDidMount(): void;
+    componentDidUpdate(): void;
+    componentWillUnmount(): void;
+    static contextType: React.Context<ControlsHeight>;
+    frame?: number;
+    input?: HTMLInputElement | HTMLTextAreaElement | null;
+    id: string;
+    getId(): string;
+    checkValue(): void;
+    stretch(el: HTMLElement | null | undefined): void;
+    adapt(): void;
+    inputRef: (el: HTMLInputElement | HTMLTextAreaElement | null) => void;
+    clear: (e: React.MouseEvent<HTMLButtonElement>) => void;
+    handleInputChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    handleTextareaChange: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
+    render(): React.JSX.Element;
+}
+export type ContainerProps<P extends InputProps> = JSX.LibraryManagedAttributes<typeof Input, P>;
+export type InputSpecificAttrs = ContainerProps<InputSpecificProps>;
+export type TextAreaSpecificAttrs = ContainerProps<TextAreaSpecificProps>;
+export type InputAttrs = InputSpecificAttrs | TextAreaSpecificAttrs;
+export default Input;
+export { Size };