@jetbrains/ring-ui 4.1.1 → 4.1.2

package/dist/shortcuts-hint-ng/shortcuts-hint-ng.js

@@ -0,0 +1,120 @@
+import { _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
+import angular from 'angular';
+import searchIcon from '@jetbrains/icons/search';
+import RingAngularComponent from '../global/ring-angular-component.js';
+import DialogNg from '../dialog-ng/dialog-ng.js';
+import ShortcutsNg from '../shortcuts-ng/shortcuts-ng.js';
+import RingTemplateNg from '../template-ng/template-ng.js';
+import IconNG from '../icon-ng/icon-ng.js';
+import InputNg from '../input-ng/input-ng.js';
+import { getShortcutTitle } from '../shortcuts/shortcut-title.js';
+import HintPopupTpl from './shortcuts-hint-ng__template.js';
+import 'focus-trap';
+import '../global/dom.js';
+import '../shortcuts/core.js';
+import 'combokeys';
+import '../global/sniffer.js';
+import 'sniffr';
+import '../button-ng/button-ng.js';
+import 'classnames';
+import '../global/theme.js';
+import 'react';
+import '../_helpers/button__classes.js';
+import '../icon/icon__constants.js';
+import '../_helpers/icon.js';
+import '../promised-click-ng/promised-click-ng.js';
+import '../compiler-ng/compiler-ng.js';
+import '../_helpers/dialog__body-scroll-preventer.js';
+import 'scrollbar-width';
+import '../_helpers/island.js';
+import '../dialog-ng/dialog-ng__template.js';
+import '@jetbrains/icons/close';
+import '../_helpers/input.js';
+
+/**
+ * @name Shortcuts Ng Hint Popup
+ */
+
+const angularModule = angular.module('Ring.shortcuts.hint-popup', [DialogNg, ShortcutsNg, IconNG, InputNg, RingTemplateNg]);
+
+const getTitle = title => typeof title === 'function' ? title() : title;
+
+class HintPopupService extends RingAngularComponent {
+  show() {
+    let popupConfig = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    let shortcutModes = arguments.length > 1 ? arguments[1] : undefined;
+    let okButtonLabel = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'Got it';
+    let searchPlaceholder = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 'Search';
+    const {
+      dialog,
+      shortcuts
+    } = this.$inject;
+    const modes = shortcutModes || shortcuts.getRegisteredShortcuts();
+    modes.forEach(mode => {
+      mode.shortcuts.forEach(shortcut => {
+        shortcut.titles = shortcut.titles || [];
+
+        if (shortcut.title && !shortcut.titles.includes(shortcut.title)) {
+          shortcut.titles.push(shortcut.title);
+        }
+      });
+    });
+    return dialog.show(Object.assign({
+      template: HintPopupTpl,
+      closeOnClick: true,
+      autoWidth: true,
+      cssClass: 'shortcuts-hint__dialog',
+      controllerAs: 'hintPopupCtrl',
+      buttons: [{
+        label: okButtonLabel,
+        default: true
+      }],
+
+      controller() {
+        // eslint-disable-next-line consistent-this
+        const ctrl = this;
+        ctrl.searchIcon = searchIcon;
+        ctrl.modes = modes;
+        ctrl.tailTemplate = popupConfig.tailTemplate;
+
+        ctrl.isArray = it => Array.isArray(it);
+
+        ctrl.searchText = '';
+        ctrl.searchPlaceholder = searchPlaceholder;
+        ctrl.getTitle = getTitle;
+      }
+
+    }, popupConfig));
+  }
+
+}
+
+_defineProperty(HintPopupService, "$inject", ['dialog', 'shortcuts']);
+
+function shortcutKeySymbolFilter(shortcut) {
+  return getShortcutTitle(shortcut);
+}
+
+function shortcutSearchFilter(shortcuts) {
+  let query = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+  return (shortcuts || []).filter(shortcut => {
+    const key = shortcut.key.join ? shortcut.key.join(' ') : shortcut.key;
+    const keysPresentation = shortcutKeySymbolFilter(key);
+
+    if (!shortcut.titles.length) {
+      return false;
+    } else {
+      const keyMatches = key.toLowerCase().indexOf(query.toLowerCase()) !== -1;
+      const titleMatches = shortcut.titles.map(getTitle).join(' ').toLowerCase().indexOf(query.toLowerCase()) !== -1;
+      const presentationMatches = keysPresentation.toLowerCase().indexOf(query.toLowerCase()) !== -1;
+      return keyMatches || titleMatches || presentationMatches;
+    }
+  });
+}
+
+angularModule.service('rgShortcutsHintPopup', HintPopupService);
+angularModule.filter('shortcutKeySymbol', () => shortcutKeySymbolFilter);
+angularModule.filter('shortcutSearch', () => shortcutSearchFilter);
+var shortcutsHintNg = angularModule.name;
+
+export { shortcutsHintNg as default };

package/dist/shortcuts-hint-ng/shortcuts-hint-ng__template.js

@@ -0,0 +1,50 @@
+var HintPopupTpl = `<div class="shortcuts-hint">
+
+  <div class="shortcuts-hint__search-input-wrapper">
+    <rg-input
+      ng-attr-placeholder="{{hintPopupCtrl.searchPlaceholder}}"
+      ng-model="hintPopupCtrl.searchText"
+    ></rg-input>
+    <rg-icon
+      class="shortcuts-hint__search-icon"
+      glyph="{{hintPopupCtrl.searchIcon}}"
+    ></rg-icon>
+  </div>
+
+  <div class="shortcuts-hint__columns">
+    <div class="shortcuts-hint__table">
+      <div ng-repeat="mode in hintPopupCtrl.modes"
+        class="shortcuts-hint__shortcut-block">
+
+        <div class="shortcuts-hint__table-title" ng-if="mode.title">
+          <div></div>
+          <div class="shortcuts-hint__shortcuts-title">{{hintPopupCtrl.getTitle(mode.title)}}</div>
+        </div>
+
+        <div ng-repeat="shortcut in mode.shortcuts | shortcutSearch:hintPopupCtrl.searchText"
+          class="shortcuts-hint__table-row">
+          <div class="shortcuts-hint__shortcut-cell">
+            <div class="shortcuts-hint__shortcut"
+              ng-if="hintPopupCtrl.isArray(shortcut.key)"
+              ng-repeat="key in shortcut.key track by $index">
+              {{key | shortcutKeySymbol}}
+            </div>
+            <span class="shortcuts-hint__shortcut"
+              ng-if="!hintPopupCtrl.isArray(shortcut.key)">{{shortcut.key | shortcutKeySymbol}}</span>
+          </div>
+          <div class="shortcuts-hint__hint">
+            <span ng-repeat="title in shortcut.titles">
+              {{hintPopupCtrl.getTitle(title)}}
+              <br ng-if="!$last">
+            </span>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div rg-template="hintPopupCtrl.tailTemplate"></div>
+
+</div>`;
+
+export { HintPopupTpl as default };

package/dist/shortcuts-ng/shortcuts-ng.js

@@ -0,0 +1,261 @@
+import angular from 'angular';
+import { getStyles } from '../global/dom.js';
+import shortcutsInstance from '../shortcuts/core.js';
+import '../_helpers/_rollupPluginBabelHelpers.js';
+import 'combokeys';
+import '../global/sniffer.js';
+import 'sniffr';
+
+const angularModule = angular.module('Ring.shortcuts', []);
+angularModule.provider('shortcuts', function provider() {
+  const modes = {};
+  const mainModes = {};
+  const reference = [];
+
+  function addMode(config) {
+    modes[config.id] = config.shortcuts;
+    mainModes[config.id] = !!config.main;
+
+    if (config.hasOwnProperty('title')) {
+      reference.push(config);
+    }
+
+    return this;
+  }
+
+  this.mode = addMode;
+  this.$get = ["$rootScope", function get($rootScope) {
+    return {
+      addMode,
+
+      bind(name, handlers, scope) {
+        const mode = modes[name]; // Nothing to bind
+
+        if (typeof handlers !== 'object') {
+          return;
+        } // No declaration
+
+
+        if (!mode) {
+          throw new Error(`Shortcut mode ${name} is not declared`);
+        }
+
+        mode.forEach(key => {
+          if (!angular.isFunction(handlers[key.action])) {
+            return;
+          }
+
+          shortcutsInstance.bind({
+            key: key.key,
+            scope: scope || name,
+            handler: function () {
+              // TODO Dirty hack ;(
+              const ret = handlers[key.action](...arguments);
+
+              if (!$rootScope.$$phase) {
+                // eslint-disable-line angular/no-private-call
+                $rootScope.$apply();
+              }
+
+              return ret;
+            }
+          });
+        });
+      },
+
+      triggerAction(mode, action) {
+        const actions = modes[mode];
+
+        for (let i = actions.length - 1; i >= 0; i--) {
+          if (actions[i].action === action) {
+            return shortcutsInstance.trigger(actions[i].key[0] || actions[i].key);
+          }
+        }
+
+        return undefined;
+      },
+
+      isMainMode: name => mainModes[name],
+      getRegisteredShortcuts: () => reference,
+      shortcuts: shortcutsInstance
+    };
+  }];
+});
+angularModule.directive('rgShortcutsApp', function rgShortcutsAppDirective() {
+  return {
+    restrict: 'A',
+    controller: ["$scope", "$rootScope", "$attrs", "shortcuts", function controller($scope, $rootScope, $attrs, shortcuts) {
+      $scope.zones = [];
+      $scope.loop = 'shortcutsLoop' in $attrs;
+
+      function getNext(current, back) {
+        const position = current && $scope.zones.indexOf(current);
+        let next;
+
+        if (position >= 0) {
+          next = back ? $scope.zones[position - 1] : $scope.zones[position + 1];
+        }
+
+        if (!next && ($scope.loop || !current)) {
+          next = back ? $scope.zones[$scope.zones.length - 1] : $scope.zones[0];
+        }
+
+        if (!next) {
+          next = $scope.zones[0];
+        } // Skip invisible zones
+
+
+        if (next && (!document.documentElement.contains(next.element) || getStyles(next.element).display === 'none')) {
+          next = getNext(next, back);
+        }
+
+        return next;
+      }
+
+      this.deselect = () => {
+        $scope.current.onBlur();
+        $scope.current = null;
+      };
+
+      this.getCurrent = () => $scope.current;
+
+      this.select = next => {
+        if ($scope.current === next) {
+          return;
+        }
+
+        if ($scope.current) {
+          shortcutsInstance.spliceScope($scope.current.scope);
+          this.deselect();
+        }
+
+        if (!next) {
+          return;
+        }
+
+        shortcutsInstance.pushScope(next.scope);
+        $scope.current = next;
+      };
+
+      this.route = (action, e, combo, mode) => {
+        let next; // There is nowhere to navigate
+
+        if (!$scope.zones.length) {
+          return false;
+        } // Reset current zone if it's not equal to the current scope
+
+
+        if ($scope.current && $scope.current.scope !== shortcutsInstance.getScope().pop().scopeId) {
+          this.deselect();
+        }
+
+        if (action === 'main') {
+          $scope.zones.forEach((zone, index) => {
+            if (shortcuts.isMainMode(zone.name)) {
+              next = $scope.zones[index];
+            }
+          });
+        } else {
+          next = getNext($scope.current, action === 'prev');
+        } // Select next zone and trigger same combo there
+
+
+        if (next) {
+          this.select(next);
+
+          if (shortcutsInstance.hasKey(combo, next.scope)) {
+            shortcutsInstance.trigger(combo);
+          } // Otherwise go back
+
+        } else {
+          shortcuts.triggerAction(mode, action === 'next' ? 'prev' : 'next');
+        }
+
+        return false;
+      };
+
+      this.sort = () => {
+        const orderedElements = Array.from(document.querySelectorAll('[rg-shortcuts]'));
+        $scope.zones.forEach(zone => {
+          zone.order = orderedElements.indexOf(zone.element);
+        });
+        $scope.zones.sort((a, b) => a.order - b.order);
+      };
+
+      this.setup = (zone, keys) => {
+        shortcuts.bind(zone.name, keys, zone.scope);
+        $scope.zones.push(zone);
+        this.sort();
+      };
+
+      this.destroy = zone => {
+        shortcutsInstance.spliceScope(zone.scope);
+        shortcutsInstance.unbindScope(zone.scope);
+        const position = $scope.zones.indexOf(zone);
+
+        if (position !== -1) {
+          $scope.zones.splice(position, 1);
+        }
+      }; // Initial setup
+
+
+      const keyMap = {
+        next: this.route.bind(this, 'next'),
+        prev: this.route.bind(this, 'prev'),
+        main: this.route.bind(this, 'main')
+      };
+      shortcuts.bind('ring-shortcuts', keyMap);
+      shortcutsInstance.pushScope('ring-shortcuts');
+    }]
+  };
+});
+angularModule.directive('rgShortcuts', ["$parse", function rgShortcutsDirective($parse) {
+  return {
+    restrict: 'A',
+    require: ['^rgShortcutsApp'],
+    link: function link($scope, iElement, iAttrs, shortcutsCtrl) {
+      // Closest controller
+      const shortcutsApp = shortcutsCtrl[shortcutsCtrl.length - 1];
+      const name = iAttrs.rgShortcuts;
+      const focusGetter = $parse(iAttrs.shortcutsFocus);
+      const blurGetter = $parse(iAttrs.shortcutsBlur);
+      const zone = {
+        name,
+        scope: `${name}-${$scope.$id}`,
+        element: iElement[0],
+        onBlur: blurGetter($scope) || angular.noop
+      };
+      $scope.$evalAsync(() => {
+        shortcutsApp.setup(zone, $scope.$eval(iAttrs.shortcutsMap));
+      });
+      $scope.$watch(() => focusGetter($scope), focusState => {
+        if (focusState) {
+          shortcutsApp.select(zone);
+        }
+      });
+      $scope.$on('$destroy', () => {
+        shortcutsApp.destroy(zone);
+      });
+    }
+  };
+}]);
+angularModule.directive('rgShortcutsGlobal', ["shortcuts", function rgShortcutsGlobalDirective(shortcuts) {
+  return {
+    restrict: 'A',
+    link: function link($scope, iElement, iAttrs) {
+      const name = iAttrs.rgShortcutsGlobal;
+      const scope = `${name}-${$scope.$id}`;
+      $scope.$evalAsync(() => {
+        shortcuts.bind(name, $scope.$eval(iAttrs.shortcutsMap), scope);
+        shortcutsInstance.pushScope(scope);
+      });
+      $scope.$on('$destroy', () => {
+        shortcutsInstance.spliceScope(scope);
+        shortcutsInstance.unbindScope(scope);
+      });
+    }
+  };
+}]);
+var ShortcutsNg = angularModule.name;
+
+export { ShortcutsNg as default };

package/dist/sidebar-ng/sidebar-ng.js

@@ -0,0 +1,111 @@
+import { _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
+import angular from 'angular';
+import chevronRightIcon from '@jetbrains/icons/chevron-right';
+import chevronLeftIcon from '@jetbrains/icons/chevron-left';
+import PlaceUnder from '../place-under-ng/place-under-ng.js';
+import IconNG from '../icon-ng/icon-ng.js';
+import RingAngularComponent from '../global/ring-angular-component.js';
+import ButtonNG from '../button-ng/button-ng.js';
+import template from './sidebar-ng__template.js';
+import buttonTemplate from './sidebar-ng__button-template.js';
+import 'just-debounce-it';
+import 'element-resize-detector';
+import '../global/dom.js';
+import '../icon/icon__constants.js';
+import '../template-ng/template-ng.js';
+import '../_helpers/icon.js';
+import 'classnames';
+import '../global/theme.js';
+import 'react';
+import '../_helpers/button__classes.js';
+
+/**
+ * @name Sidebar Ng
+ */
+
+const angularModule = angular.module('Ring.sidebar', [PlaceUnder, IconNG, ButtonNG]);
+
+class SidebarController extends RingAngularComponent {
+  constructor() {
+    super(...arguments);
+
+    this.$onInit = () => {
+      const {
+        $scope
+      } = this.$inject;
+      this.dialogIsActive = false;
+      this.showed = this.show; // dialog has been opened — open sidebar
+
+      $scope.$watch(() => this.dialogIsActive, () => {
+        if (this.dialogIsActive) {
+          this.show = true;
+        } else if (!this.showed) {
+          this.show = false;
+        }
+      });
+      $scope.$watch(() => this.show, () => {
+        if (!this.dialogIsActive) {
+          this.showed = this.show;
+        }
+      });
+    };
+  }
+
+}
+
+SidebarController.$inject = [];
+
+_defineProperty(SidebarController, "$inject", ['$scope']);
+
+function rgSidebarDirective() {
+  return {
+    restrict: 'E',
+    transclude: true,
+    replace: true,
+    scope: {},
+    controller: SidebarController,
+
+    /**
+    * {{
+    *   show: boolean,
+    *   placeUnderSibling: ?string, a selector for an element the sidebar should stick to
+    *   topOffset: ?number, sidebar top offset
+    * }}
+    */
+    bindToController: {
+      show: '=',
+      placeUnderSibling: '@',
+      topOffset: '=?',
+      dialogIsActive: '=?'
+    },
+    template,
+    controllerAs: 'sidebar'
+  };
+}
+
+function rgSidebarToggleButtonDirective() {
+  return {
+    restrict: 'E',
+    transclude: true,
+    replace: true,
+    scope: {},
+
+    controller() {
+      this.chevronRight = chevronRightIcon;
+      this.chevronLeft = chevronLeftIcon;
+    },
+
+    bindToController: {
+      model: '=',
+      dialogIsActive: '=?'
+    },
+    template: buttonTemplate,
+    controllerAs: 'button'
+  };
+}
+
+angularModule.directive('rgSidebar', rgSidebarDirective);
+angularModule.directive('rgSidebarToggleButton', rgSidebarToggleButtonDirective);
+var sidebarNg = angularModule.name;
+
+export { sidebarNg as default };

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

@@ -0,0 +1,20 @@
+var buttonTemplate = `<span>
+  <rg-button
+    ng-click="button.model = !button.model"
+    ng-disabled="button.dialogIsActive"
+  >
+    <rg-icon
+      ng-show="button.model"
+      glyph="{{button.chevronRight}}"
+    ></rg-icon>
+
+    <rg-icon
+      ng-show="!button.model"
+      glyph="{{button.chevronLeft}}"
+    ></rg-icon>
+
+    <span ng-transclude></span>
+  </rg-button>
+</span>`;
+
+export { buttonTemplate as default };

package/dist/sidebar-ng/sidebar-ng__template.js

@@ -0,0 +1,12 @@
+var template = `<div
+  class="ring-sidebar"
+  rg-place-under="{{sidebar.placeUnderSibling}}"
+  place-top-offset="{{sidebar.topOffset}}"
+  sync-height="true"
+  ng-class="{'ring-sidebar_active': sidebar.show}"
+>
+  <rg-dialog in-sidebar="true" active="sidebar.dialogIsActive"></rg-dialog>
+  <div class="ring-sidebar__content" ng-transclude ng-if="!sidebar.dialogIsActive"></div>
+</div>`;
+
+export { template as default };

package/dist/storage/storage.js

@@ -0,0 +1,56 @@
+import LocalStorage from './storage__local.js';
+import FallbackStorage from './storage__fallback.js';
+import '../alert-service/alert-service.js';
+import '../_helpers/_rollupPluginBabelHelpers.js';
+import 'react';
+import 'react-dom';
+import '../global/get-uid.js';
+import '../alert/alert.js';
+import 'classnames';
+import 'prop-types';
+import '@jetbrains/icons/exception';
+import '@jetbrains/icons/checkmark';
+import '@jetbrains/icons/warning';
+import '@jetbrains/icons/close';
+import '../icon/icon.js';
+import 'util-deprecate';
+import '../icon/icon__constants.js';
+import '../_helpers/icon.js';
+import '../icon/icon__svg.js';
+import '../global/memoize.js';
+import '../loader-inline/loader-inline.js';
+import '../global/theme.js';
+import '../global/data-tests.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/dom.js';
+import '../alert/container.js';
+import 'deep-equal';
+
+/**
+ * @name Storage
+ */
+
+/**
+ * @constructor
+ * @extends {LocalStorage}
+ */
+
+let Storage = LocalStorage; // Using try/catch here because of IE10+ protected mode and other browsers' quirks
+// See https://github.com/Modernizr/Modernizr/blob/master/feature-detects/storage/localstorage.js
+
+try {
+  const temp = 'testStorage';
+  localStorage.setItem(temp, temp);
+  localStorage.removeItem(temp);
+} catch (e) {
+  Storage = FallbackStorage;
+}
+
+const ActualStorage = Storage;
+
+export { ActualStorage as default };