@jetbrains/ring-ui 4.1.1 → 4.1.2

package/dist/template-ng/template-ng.js

@@ -0,0 +1,70 @@
+import { _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
+import angular from 'angular';
+import RingAngularComponent from '../global/ring-angular-component.js';
+
+/**
+ * @name Template Ng
+*/
+
+const angularModule = angular.module('Ring.template', []);
+
+class RgTemplateController extends RingAngularComponent {
+  constructor() {
+    super(...arguments);
+
+    _defineProperty(this, "currentScope", null);
+
+    _defineProperty(this, "render", template => {
+      const {
+        $scope,
+        $element,
+        $compile
+      } = this.$inject;
+      this.cleanup();
+      this.currentScope = $scope.$new();
+      this.currentScope.$evalAsync(() => {
+        $element.html(template);
+        this.addInnerClass();
+        $compile($element.contents())(this.currentScope);
+      });
+    });
+
+    _defineProperty(this, "addInnerClass", () => {
+      const {
+        rgTemplateClass
+      } = this.$inject.$attrs;
+
+      if (rgTemplateClass) {
+        this.$inject.$element.contents().addClass(rgTemplateClass);
+      }
+    });
+
+    const {
+      $scope: _$scope,
+      $attrs
+    } = this.$inject;
+
+    _$scope.$watch($attrs.rgTemplate || $attrs.template, this.render);
+  }
+
+  cleanup() {
+    if (this.currentScope) {
+      this.currentScope.$destroy();
+      this.currentScope = null;
+    }
+  }
+
+}
+
+RgTemplateController.$inject = [];
+
+_defineProperty(RgTemplateController, "$inject", ['$scope', '$element', '$attrs', '$compile']);
+
+angularModule.directive('rgTemplate', function rgTemplateDirective() {
+  return {
+    controller: RgTemplateController
+  };
+});
+var RingTemplateNg = angularModule.name;
+
+export { RingTemplateNg as default };

package/dist/text/text.js

@@ -0,0 +1,36 @@
+import { _ as _defineProperty, a as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+
+var modules_78d1bce6 = {"text":"text_rui_bc47","info":"info_rui_bc47"};
+
+/**
+ * @name Text
+ */
+
+class Text extends Component {
+  render() {
+    const {
+      children,
+      className,
+      info,
+      ...restProps
+    } = this.props;
+    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 { Text as default };

package/dist/theme-ng/theme-ng.js

@@ -0,0 +1,44 @@
+import { _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
+import angular from 'angular';
+import RingAngularComponent from '../global/ring-angular-component.js';
+
+const angularModule = angular.module('Ring.theme', []);
+
+class RingThemeComponent extends RingAngularComponent {
+  constructor() {
+    super(...arguments);
+
+    _defineProperty(this, "on", this.$inject.$scope.$on.bind(this.$inject.$scope));
+  }
+
+  $onInit() {
+    const {
+      $element
+    } = this.$inject;
+    $element[0].setAttribute('data-test', 'ring-theme');
+  }
+
+  $onChanges(changes) {
+    if (changes.theme && changes.theme.currentValue) {
+      const {
+        $scope
+      } = this.$inject;
+      $scope.$emit('change', {
+        prevTheme: typeof changes.theme.previousValue === 'string' && changes.theme.previousValue,
+        currentTheme: changes.theme.currentValue
+      });
+    }
+  }
+
+}
+
+_defineProperty(RingThemeComponent, "$inject", ['$scope', '$element']);
+
+_defineProperty(RingThemeComponent, "bindings", {
+  theme: '<'
+});
+
+angularModule.component('rgTheme', RingThemeComponent);
+var themeNg = angularModule.name;
+
+export { themeNg as default };

package/dist/title-ng/title-ng.js

@@ -0,0 +1,114 @@
+import angular from 'angular';
+
+const angularModule = angular.module('Ring.title', []);
+angularModule.directive('rgPageTitle', function rgPageTitleDirective() {
+  return {
+    scope: {
+      rgPageTitle: '@?',
+      noTitle: '@?',
+      delimiter: '@'
+    },
+    controller: ["$rootScope", "$scope", "$element", "$attrs", "pageTitle", "$injector", function controller($rootScope, $scope, $element, $attrs, pageTitle, $injector) {
+      const element = $element[0]; // Get title prefix from title element
+
+      const elementText = element.textContent;
+      let offScopeWatch = angular.noop; // Set page title on route change
+
+      const offRouteWatch = $rootScope.$on('$routeChangeSuccess', (event, current) => {
+        //Do nothing if we're being redirected
+        if (current.$$route && current.$$route.redirectTo) {
+          // eslint-disable-line angular/no-private-call
+          return;
+        }
+
+        let routeTitle = current.$$route && current.$$route.title; // eslint-disable-line angular/no-private-call
+
+        pageTitle.setCurrent($scope.rgPageTitle || elementText); // Use title: false to prevent title change on route
+
+        if (routeTitle !== false) {
+          if (angular.isArray(routeTitle) || angular.isFunction(routeTitle)) {
+            //Invoke injector
+            routeTitle = $injector.invoke(routeTitle);
+          }
+
+          pageTitle.addElement(routeTitle || $scope.noTitle);
+        }
+      });
+      $scope.$on('$destroy', () => {
+        offRouteWatch();
+        offScopeWatch();
+      });
+
+      this.$onInit = () => {
+        pageTitle.setDelimiter($scope.delimiter);
+
+        if ($attrs.rgPageTitle) {
+          offScopeWatch = $scope.$watch('rgPageTitle', newBaseTitle => {
+            pageTitle.setRootElement(newBaseTitle);
+          });
+        }
+      };
+    }]
+  };
+});
+angularModule.service('pageTitle', ["$interpolate", "$document", function service($interpolate, $document) {
+  let delimiter = ' | ';
+  let current = $document[0].title;
+
+  function setTitle(text) {
+    current = text && $interpolate(text)();
+    updateDocumentTitle(current);
+  }
+
+  function updateDocumentTitle(text) {
+    $document[0].title = text;
+  }
+
+  function prepend(element) {
+    setTitle(current ? element + delimiter + current : element);
+  }
+
+  function replacePart(element) {
+    let replaceIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+    const titleElements = current.split(delimiter);
+    titleElements[replaceIndex === -1 ? titleElements.length - 1 : replaceIndex] = element;
+    setTitle(titleElements.join(delimiter));
+  }
+
+  this.setDelimiter = newDelimiter => {
+    delimiter = newDelimiter || delimiter;
+  };
+
+  this.setCurrent = newBase => {
+    current = newBase;
+  };
+
+  this.setText = text => updateDocumentTitle(text);
+
+  this.addElement = (element, fieldName) => {
+    if (element.$promise) {
+      element.$promise.then(Data => {
+        this.addElement(Data[fieldName || 'name']);
+      });
+    } else {
+      prepend(fieldName ? element[fieldName] : element);
+    }
+  };
+
+  this.updateElement = (element, fieldName) => {
+    if (element.$promise) {
+      element.$promise.then(Data => {
+        this.updateElement(Data[fieldName || 'name']);
+      });
+    } else {
+      replacePart(fieldName ? element[fieldName] : element);
+    }
+  };
+
+  this.setRootElement = element => {
+    replacePart(element, -1);
+  };
+}]);
+var titleNg = angularModule.name;
+
+export { titleNg as default };

package/dist/toggle/toggle.js

@@ -0,0 +1,77 @@
+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 { 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_rui_ca2e","switch":"switch_rui_ca2e","disabled":"disabled_rui_ca2e","label":"label_rui_ca2e","leftLabel":"leftLabel_rui_ca2e","light":"light_rui_ca2e","dark":"dark_rui_ca2e","switchWrapper":"switchWrapper_rui_ca2e","input":"input_rui_ca2e","size20":"size20_rui_ca2e","paleSwitch":"paleSwitch_rui_ca2e"};
+
+const Size = {
+  Size16: modules_331c5aa7.size16,
+  Size20: modules_331c5aa7.size20
+};
+/**
+  * @name Toggle
+  */
+
+class Toggle extends PureComponent {
+  render() {
+    const {
+      className,
+      children,
+      disabled,
+      pale,
+      title,
+      leftLabel,
+      theme,
+      size = Size.Size16,
+      'data-test': dataTest,
+      onTransitionEnd,
+      ...restProps
+    } = this.props;
+    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$1 = withTheme()(Toggle);
+
+export { Size, Toggle$1 as default };

package/dist/toggle-ng/toggle-ng.js

@@ -0,0 +1,16 @@
+import angularComponentFactory from '../global/angular-component-factory.js';
+import Toggle from '../toggle/toggle.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 'classnames';
+import '../global/theme.js';
+import '../global/data-tests.js';
+
+var toggleNg = angularComponentFactory(Toggle, 'Toggle').name;
+
+export { toggleNg as default };

package/dist/tooltip/tooltip.js

@@ -0,0 +1,207 @@
+import { _ as _defineProperty, a as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
+import React, { Component, createContext } from 'react';
+import PropTypes from 'prop-types';
+import Popup from '../popup/popup.js';
+import { Listeners } from '../global/dom.js';
+import joinDataTestAttributes from '../global/data-tests.js';
+import scheduleRAF from '../global/schedule-raf.js';
+import 'react-dom';
+import 'classnames';
+import '../global/get-uid.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';
+
+var modules_cd5e45a9 = {"unit":"8px","tooltip":"tooltip_rui_b923"};
+
+const scheduleScroll = scheduleRAF();
+const TooltipContext = /*#__PURE__*/createContext();
+/**
+ * @name Tooltip
+ */
+
+class Tooltip extends Component {
+  constructor() {
+    super(...arguments);
+
+    _defineProperty(this, "state", {
+      showPopup: false,
+      showNestedPopup: false
+    });
+
+    _defineProperty(this, "listeners", new Listeners());
+
+    _defineProperty(this, "containerRef", el => {
+      this.containerNode = el;
+    });
+
+    _defineProperty(this, "tryToShowPopup", () => {
+      const {
+        delay,
+        title
+      } = this.props;
+
+      if (!title) {
+        return;
+      }
+
+      if (delay) {
+        this.timeout = setTimeout(this.showPopup, delay);
+      } else {
+        this.showPopup();
+      }
+    });
+
+    _defineProperty(this, "showPopup", () => {
+      var _this$context;
+
+      if (this.props.selfOverflowOnly) {
+        const {
+          containerNode
+        } = this; // rare cases when containerNode is null are possible;
+        // probably the collision is due to the asynchronous nature of the code,
+        // i.e. this code runs after the component is unmounted,
+        // although at first glance it looks unlikely.
+
+        if (!containerNode) {
+          return;
+        } // inline element?
+
+
+        if (containerNode.clientWidth === 0 && containerNode.clientHeight === 0) {
+          return;
+        }
+
+        if (containerNode.scrollWidth <= containerNode.clientWidth && containerNode.scrollHeight <= containerNode.clientHeight) {
+          return;
+        }
+      }
+
+      (_this$context = this.context) === null || _this$context === void 0 ? void 0 : _this$context.onNestedTooltipShow();
+      this.setState({
+        showPopup: true
+      });
+    });
+
+    _defineProperty(this, "hidePopup", () => {
+      var _this$context2;
+
+      clearTimeout(this.timeout);
+      (_this$context2 = this.context) === null || _this$context2 === void 0 ? void 0 : _this$context2.onNestedTooltipHide();
+      this.setState({
+        showPopup: false
+      });
+    });
+
+    _defineProperty(this, "popupRef", el => {
+      this.popup = el;
+    });
+
+    _defineProperty(this, "onNestedTooltipShow", () => {
+      this.setState({
+        showNestedPopup: true
+      });
+    });
+
+    _defineProperty(this, "onNestedTooltipHide", () => {
+      this.setState({
+        showNestedPopup: false
+      });
+    });
+  }
+
+  componentDidMount() {
+    if (this.props.title) {
+      this.addListeners();
+    }
+  }
+
+  componentDidUpdate(prevProps) {
+    if (!prevProps.title && this.props.title) {
+      this.addListeners();
+    } else if (prevProps.title && !this.props.title) {
+      this.listeners.removeAll();
+    }
+  }
+
+  componentWillUnmount() {
+    clearTimeout(this.timeout);
+    this.listeners.removeAll();
+  }
+
+  addListeners() {
+    this.listeners.add(this.containerNode, 'mouseover', this.tryToShowPopup);
+    this.listeners.add(this.containerNode, 'mouseout', this.hidePopup);
+    this.listeners.add(document, 'scroll', () => scheduleScroll(this.hidePopup), {
+      passive: true
+    });
+  }
+
+  render() {
+    const {
+      children,
+      'data-test': dataTest,
+      title,
+      delay,
+      selfOverflowOnly,
+      popupProps,
+      ...restProps
+    } = this.props;
+    const ariaProps = typeof title === 'string' && !!title ? {
+      'aria-label': title,
+      role: 'tooltip'
+    } : {};
+    const {
+      onNestedTooltipShow,
+      onNestedTooltipHide
+    } = this;
+    return /*#__PURE__*/React.createElement(TooltipContext.Provider, {
+      value: {
+        onNestedTooltipShow,
+        onNestedTooltipHide
+      }
+    }, /*#__PURE__*/React.createElement("span", _extends({}, ariaProps, restProps, {
+      ref: this.containerRef,
+      "data-test": joinDataTestAttributes('ring-tooltip', dataTest),
+      "data-test-title": typeof title === 'string' ? title : undefined
+    }), children, /*#__PURE__*/React.createElement(Popup, _extends({
+      trapFocus: false,
+      hidden: !this.state.showPopup || this.state.showNestedPopup,
+      onCloseAttempt: this.hidePopup,
+      maxHeight: 400,
+      className: modules_cd5e45a9.tooltip,
+      attached: false,
+      top: 4,
+      dontCloseOnAnchorClick: true,
+      ref: this.popupRef
+    }, popupProps), title)));
+  }
+
+}
+
+_defineProperty(Tooltip, "propTypes", {
+  delay: PropTypes.number,
+  selfOverflowOnly: PropTypes.bool,
+  popupProps: PropTypes.object,
+  title: PropTypes.node,
+  children: PropTypes.node,
+  'data-test': PropTypes.string
+});
+
+_defineProperty(Tooltip, "defaultProps", {
+  title: '',
+  selfOverflowOnly: false,
+  popupProps: {}
+});
+
+_defineProperty(Tooltip, "PopupProps", Popup.PopupProps);
+
+_defineProperty(Tooltip, "contextType", TooltipContext);
+
+export { Tooltip as default };

package/dist/tooltip-ng/tooltip-ng.js

@@ -0,0 +1,98 @@
+import angular from 'angular';
+import { createElement } from 'react';
+import { render } from 'react-dom';
+import classNames from 'classnames';
+import Popup from '../popup/popup.js';
+import '../_helpers/_rollupPluginBabelHelpers.js';
+import 'prop-types';
+import '../global/get-uid.js';
+import '../global/schedule-raf.js';
+import '../global/dom.js';
+import '../shortcuts/shortcuts.js';
+import '../shortcuts/core.js';
+import 'combokeys';
+import '../global/sniffer.js';
+import 'sniffr';
+import '../global/data-tests.js';
+import '../tab-trap/tab-trap.js';
+import '../popup/position.js';
+import '../popup/popup.consts.js';
+import '../popup/popup.target.js';
+
+/**
+ * @name Tooltip Ng
+*/
+
+const OPEN_CLASS = 'ring-tooltip-ng_open';
+const name = angular.module('Ring.tooltip', []);
+name.directive('rgTooltip', ["RgTooltipPopup", function rgTooltipDirective(RgTooltipPopup) {
+  return {
+    restrict: 'A',
+    link: function link(scope, iElement, iAttrs) {
+      const element = iElement[0];
+
+      const getTooltipText = () => {
+        try {
+          return scope.$eval(iAttrs.rgTooltip);
+        } catch (err) {
+          return iAttrs.rgTooltip;
+        }
+      };
+
+      const popupWrapper = new RgTooltipPopup(element, getTooltipText);
+      element.addEventListener('mouseover', () => {
+        popupWrapper.displayTooltip(iAttrs.rgTooltipClass);
+        element.classList.add(OPEN_CLASS);
+      });
+      element.addEventListener('mouseout', () => {
+        popupWrapper.hideTooltip();
+        element.classList.remove(OPEN_CLASS);
+      });
+    }
+  };
+}]);
+name.factory('RgTooltipPopup', function RgTooltipPopupDirective() {
+  // eslint-disable-next-line func-names
+  return function (anchorElement, textGetter) {
+    this.wrapperElement = document.createElement('span');
+    this.defaultProps = {
+      anchorElement,
+      maxHeight: 400,
+      attached: false,
+      dontCloseOnAnchorClick: true,
+      trapFocus: false
+    };
+
+    this.renderPopup = props => {
+      this.popup = render( /*#__PURE__*/createElement(Popup, { ...this.defaultProps,
+        ...props
+      }, this.text), this.wrapperElement);
+    };
+
+    this.displayTooltip = customClass => {
+      const text = textGetter();
+
+      if (!text) {
+        return;
+      }
+
+      this.text = text;
+      const className = classNames({
+        'ring-tooltip-ng': true
+      }, customClass);
+      this.renderPopup({
+        hidden: false,
+        className
+      });
+    };
+
+    this.hideTooltip = () => {
+      this.renderPopup({
+        hidden: true
+      });
+    };
+  };
+});
+var tooltipNg = name.name;
+
+export { tooltipNg as default };