@jetbrains/ring-ui 6.0.1-beta.0 → 6.0.1

package/components/link-ng/link-ng.test.js

@@ -1,29 +0,0 @@
-/*global inject*/
-import 'angular';
-import 'angular-mocks';
-
-import linkStyles from '../link/link.css';
-
-import Link from './link-ng';
-
-describe('LinkNg', () => {
-  let element;
-  let scope;
-  let $compile;
-
-  beforeEach(window.module(Link));
-
-  beforeEach(inject(($rootScope, _$compile_) => {
-    scope = $rootScope.$new();
-    $compile = _$compile_;
-    element = $compile('<rg-link href="http://google.com"></rg-link>')(scope)[0];
-  }));
-
-  it('should replace with a tag', () => {
-    element.should.match(`a.${linkStyles.link.split(' ')[0]}`);
-  });
-
-  it('should pass attributes to a tag', () => {
-    element.should.have.attribute('href', 'http://google.com');
-  });
-});

package/components/loader/__mocks__/loader__core.js

@@ -1,5 +0,0 @@
-export default class LoaderCore {
-  startAnimation() {}
-  stopAnimation() {}
-  destroy() {}
-}

package/components/loader-inline-ng/loader-inline-ng.examples.js

@@ -1,28 +0,0 @@
-import angular from 'angular';
-
-import angularDecorator, {APP_NAME} from '../../.storybook/angular-decorator';
-
-import LoaderInlineNg from './loader-inline-ng';
-
-export default {
-  title: 'Legacy Angular/Loader Inline Ng',
-  decorators: [angularDecorator()],
-
-  parameters: {
-    notes: 'Wraps markup for loader-inline component.'
-  }
-};
-
-export const simple = () => {
-  angular.module(APP_NAME, [LoaderInlineNg]);
-
-  return `
-      <div>
-        <span>some text on top</span>
-        <div>before <rg-loader-inline/> Some text after</div>
-        <div>some text under loader</div>
-      </div>
-    `;
-};
-
-simple.storyName = 'Loader Inline Ng';

package/components/loader-inline-ng/loader-inline-ng.js

@@ -1,17 +0,0 @@
-import angular from 'angular';
-
-import styles from '../loader-inline/loader-inline.css';
-
-/**
- * @name Loader Inline Ng
- */
-
-
-const angularModule = angular.module('Ring.loader-inline', []);
-
-angularModule.
-  component('rgLoaderInline', {
-    template: `<div data-test="ring-loader-inline-ng" class="${styles.loader}"></div>`
-  });
-
-export default angularModule.name;

package/components/loader-inline-ng/loader-inline-ng.test.js

@@ -1,28 +0,0 @@
-/*global inject*/
-import 'angular';
-import 'angular-mocks';
-
-import styles from '../loader-inline/loader-inline.css';
-
-import LoaderInline from './loader-inline-ng';
-
-describe('LoaderInline', () => {
-  let element;
-  let scope;
-  let $compile;
-
-  beforeEach(window.module(LoaderInline));
-
-  beforeEach(inject(($rootScope, _$compile_) => {
-    scope = $rootScope.$new();
-    $compile = _$compile_;
-    element = $compile('<rg-loader-inline></rg-loader-inline>')(scope)[0];
-    scope.$digest();
-  }));
-
-  it('should render loader markup', () => {
-    element.should.contain(`.${styles.loader}`);
-    element.should.contain('[data-test="ring-loader-inline-ng"]');
-  });
-
-});

package/components/loader-ng/loader-ng.examples.js

@@ -1,27 +0,0 @@
-import angular from 'angular';
-
-import angularDecorator, {APP_NAME} from '../../.storybook/angular-decorator';
-
-import LoaderNg from './loader-ng';
-
-export default {
-  title: 'Legacy Angular/Loader Ng',
-  decorators: [angularDecorator()],
-
-  parameters: {
-    notes: 'Displays the loader.',
-    hermione: {skip: true}
-  }
-};
-
-export const basic = () => {
-  angular.module(APP_NAME, [LoaderNg]);
-
-  return `
-      <div>
-        <rg-loader/>
-      </div>
-    `;
-};
-
-basic.storyName = 'Loader Ng';

package/components/loader-ng/loader-ng.js

@@ -1,37 +0,0 @@
-import angular from 'angular';
-
-import RingAngularComponent from '../global/ring-angular-component';
-import LoaderCore from '../loader/loader__core';
-
-/**
- * @name Loader Ng
- */
-
-
-const angularModule = angular.module('Ring.loader', []);
-
-class RgLoaderComponent extends RingAngularComponent {
-
-  static bindings = {
-    message: '@'
-  };
-
-  constructor(...args) {
-    super(...args);
-    const {$element} = this.$inject;
-    this.loader = new LoaderCore($element[0], {message: this.message});
-  }
-
-  $onDestroy() {
-    this.loader.destroy();
-  }
-
-  $onChanges(changes) {
-    this.loader.updateMessage(changes.message.currentValue);
-  }
-}
-RgLoaderComponent.$inject = ['$element'];
-
-angularModule.component('rgLoader', RgLoaderComponent);
-
-export default angularModule.name;

package/components/loader-ng/loader-ng.test.js

@@ -1,41 +0,0 @@
-/*global inject*/
-import 'angular';
-import 'angular-mocks';
-
-import loaderStyles from '../loader/loader.css';
-
-import Loader from './loader-ng';
-
-describe('Loader', () => {
-  let element;
-  let scope;
-  let $compile;
-
-  beforeEach(window.module(Loader));
-
-  beforeEach(inject(($rootScope, _$compile_) => {
-    scope = $rootScope.$new();
-    scope.message = 'foo';
-    $compile = _$compile_;
-    element = $compile('<rg-loader message="{{message}}"></rg-loader>')(scope)[0];
-    scope.$digest();
-  }));
-
-  it('should init', () => {
-    element.should.exist;
-  });
-
-  it('should render loader', () => {
-    element.should.contain(`.${loaderStyles.canvas}`);
-  });
-
-  it('should render text', () => {
-    element.querySelector(`.${loaderStyles.text}`).textContent.should.equal('foo');
-  });
-
-  it('should update text', () => {
-    scope.message = 'bar';
-    scope.$digest();
-    element.querySelector(`.${loaderStyles.text}`).textContent.should.equal('bar');
-  });
-});

package/components/loader-screen-ng/loader-screen-ng.examples.js

@@ -1,30 +0,0 @@
-import angular from 'angular';
-
-import angularDecorator, {APP_NAME} from '../../.storybook/angular-decorator';
-
-import LoaderScreen from './loader-screen-ng';
-
-export default {
-  title: 'Legacy Angular/Loader Screen Ng',
-  decorators: [angularDecorator()],
-
-  parameters: {
-    notes: 'Provides an Angular wrapper for Loader Screen.',
-    hermione: {skip: true}
-  }
-};
-
-export const basic = () => {
-  angular.module(APP_NAME, [LoaderScreen]).run(loaderScreen => {
-    loaderScreen.setVisible(true);
-    loaderScreen.startInitialLoading();
-  });
-
-  return `
-      <div>
-        <div rg-loader-screen="Loading..."></div>
-      </div>
-    `;
-};
-
-basic.storyName = 'Loader Screen Ng';

package/components/loader-screen-ng/loader-screen-ng.js

@@ -1,95 +0,0 @@
-import angular from 'angular';
-
-import loaderNg from '../loader-ng/loader-ng';
-import styles from '../loader-screen/loader-screen.css';
-
-/**
- * @name Loader Screen Ng
- */
-
-const angularModule = angular.module('Ring.loader-screen', [loaderNg]);
-
-angularModule.service('loaderScreen', function service($timeout, $rootScope) {
-  // TODO in CSS Modules version put constant to global.css
-  const ordinaryLoadingTTL = 100;
-
-  let initialLoading = false;
-  let loadingFailed = false;
-  let showLoader;
-  let showLoaderPromise;
-
-  this.startLoading = (ttl = ordinaryLoadingTTL) => {
-    if (showLoaderPromise) {
-      return; // already scheduled to show
-    }
-
-    showLoaderPromise = $timeout(() => {
-      this.setVisible(true);
-    }, ttl);
-  };
-
-  this.stopLoading = () => {
-    if (showLoaderPromise) {
-      $timeout.cancel(showLoaderPromise);
-      showLoaderPromise = null;
-    }
-
-    this.setVisible(false);
-  };
-
-  this.startInitialLoading = () => {
-    initialLoading = true;
-    this.setVisible(true);
-  };
-
-  this.stopInitialLoading = () => {
-    initialLoading = false;
-    this.setVisible(false);
-  };
-
-  $rootScope.isInitialLoading = () => initialLoading;
-  $rootScope.isLoaderVisible = () => showLoader;
-
-  $rootScope.isLoadingFailed = () => loadingFailed;
-
-  this.failInitialLoading = error => {
-    this.stopInitialLoading();
-    loadingFailed = true;
-    $rootScope.error = error;
-  };
-
-  this.setVisible = visible => {
-    showLoader = visible;
-  };
-
-  /* eslint-disable angular/on-watch */
-  $rootScope.$on('$routeChangeSuccess', () => {
-    this.stopInitialLoading();
-  });
-
-  $rootScope.$on('$routeChangeError', (event, current, previous, rejection) => {
-    if (!rejection || !(rejection.silent || rejection.authRedirect)) {
-      this.failInitialLoading(rejection);
-    }
-  });
-  /* eslint-enable angular/on-watch */
-});
-
-angularModule.directive('rgLoaderScreen', function rgLoaderScreenDirective() {
-  return {
-    restrict: 'A',
-
-    scope: {
-      message: '@rgLoaderScreen'
-    },
-
-    template: `
-<div class="${styles.loaderScreen}" ng-if="$root.isLoaderVisible()">
-  <rg-loader class="${styles.loader}"
-    message="{{$root.isInitialLoading() ? message : ''}}"></rg-loader>
-</div>
-    `
-  };
-});
-
-export default angularModule.name;

package/components/markdown/code.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-import { CodeProps } from 'react-markdown/lib/ast-to-react';
-export interface MarkdownCodeProps extends CodeProps {
-    language?: string;
-}
-declare const MarkdownCode: ({ children, language, inline, className }: MarkdownCodeProps) => React.JSX.Element;
-export default MarkdownCode;

package/components/markdown/code.js

@@ -1,17 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import Code from '../code/code';
-const MarkdownCode = ({ children, language, inline, className }) => {
-    // Hack for updated react-markdown RG-2193
-    const lang = language ?? (className?.
-        split(' ').
-        find(name => name.startsWith('language-'))?.
-        replace('language-', ''));
-    return (<Code language={lang} className={className} code={children?.join('') || ''} inline={inline}/>);
-};
-MarkdownCode.propTypes = {
-    language: PropTypes.string,
-    children: PropTypes.array.isRequired,
-    inline: PropTypes.bool
-};
-export default MarkdownCode;

package/components/markdown/heading.d.ts

@@ -1,11 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { HeadingProps } from 'react-markdown/lib/ast-to-react';
-declare const MarkdownHeading: {
-    ({ level, children }: HeadingProps): React.JSX.Element;
-    propTypes: {
-        level: PropTypes.Validator<number>;
-        children: PropTypes.Validator<any[]>;
-    };
-};
-export default MarkdownHeading;

package/components/markdown/heading.js

@@ -1,9 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import Heading from '../heading/heading';
-const MarkdownHeading = ({ level, children }) => <Heading level={level}>{children}</Heading>;
-MarkdownHeading.propTypes = {
-    level: PropTypes.number.isRequired,
-    children: PropTypes.array.isRequired
-};
-export default MarkdownHeading;

package/components/markdown/link.d.ts

@@ -1,12 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { ReactMarkdownProps } from 'react-markdown/lib/complex-types';
-declare const MarkdownLink: {
-    ({ href, title, children }: JSX.IntrinsicElements['a'] & ReactMarkdownProps): React.JSX.Element;
-    propTypes: {
-        href: PropTypes.Requireable<string>;
-        title: PropTypes.Requireable<string>;
-        children: PropTypes.Validator<any[]>;
-    };
-};
-export default MarkdownLink;

package/components/markdown/link.js

@@ -1,10 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import Link from '../link/link';
-const MarkdownLink = ({ href, title, children }) => <Link href={href} title={title}>{children}</Link>;
-MarkdownLink.propTypes = {
-    href: PropTypes.string,
-    title: PropTypes.string,
-    children: PropTypes.array.isRequired
-};
-export default MarkdownLink;

package/components/message-bundle-ng/message-bundle-ng.js

@@ -1,67 +0,0 @@
-import angular from 'angular';
-/**
- * This service is used by directive to correctly show messages.
- * You can decorate this service to provide your own localized messages.
- */
-const angularModule = angular.module('Ring.message-bundle', []);
-
-/**
- * Empty i18n function. If project supports localization, it should decorate i18n
- * with translating function
- */
-function emptyI18n() {
-  return str => str;
-}
-
-function RingMessageBundle(ringI18n) {
-  const i18n = ringI18n;
-
-  /* eslint-disable camelcase */
-  this.form_required = () => i18n('Value is required');
-  this.form_invalid = () => i18n('Value is invalid');
-  this.form_url = () => i18n('Should be a valid URL');
-  this.form_email = () => i18n('Should be a valid email');
-  this.form_number = () => i18n('Should be a number');
-  this.form_maxlength = () => i18n('Is too long');
-  this.form_minlength = () => i18n('Is too short');
-  this.form_pattern = () => i18n('Doesn\'t match the pattern');
-  this.form_equalvalue = () => i18n('Is not the same');
-  this.form_unique = () => i18n('Is not unique');
-  this.form_max = () => i18n('Is out of range');
-  this.form_min = () => i18n('Is out of range');
-  this.form_save = () => i18n('Save');
-  this.form_saved = () => i18n('Saved');
-  this.form_cancel = () => i18n('Cancel');
-  this.avatareditor_nosupport = () => i18n('Sorry, your browser doesn\'t support File API');
-  this.avatareditor_noselected = () => i18n('No image file was selected');
-  this.avatareditor_delete = () => i18n('Delete Image');
-  this.avatareditor_add = () => i18n('Add Image');
-  this.errorpage_seriouslywrong = () => i18n('Oh-oh... Something went seriously wrong.');
-  this.errorpage_offline = () => i18n('There\'s nothing we can do: The server seems to be offline.');
-  this.errorpage_disconnected = () => i18n('Disconnected');
-  this.errorpage_disconnectedmsg = () => i18n('No, no one\'s there.');
-  this.errorpage_401 = () => i18n('Authorization required');
-  this.errorpage_401msg = () => i18n('You have requested access to a page that requires authorization, but the request is missing valid authentication credentials. It can also mean that your account has been banned.');
-  this.errorpage_403 = () => i18n('Woah, you can\'t touch this!');
-  this.errorpage_403msg = () => i18n('Unfortunately, you are not allowed to access the page you\'ve requested. It seems you don\'t have sufficient permissions.');
-  this.errorpage_404 = () => i18n('Nope, can\'t find it!');
-  this.errorpage_404msg = () => i18n('Despite our best efforts, there\'s nothing here to show you with the URL you requested. Most likely the URL is invalid or you don\'t have permissions to access the page.');
-  this.errorpage_500 = () => i18n('Oh-oh... Something went seriously wrong');
-  this.errorpage_500msg = () => i18n('Despite our best efforts, the server is not working properly.');
-  this.select_options_not_found = () => i18n('No options found');
-  this.select_loading = () => i18n('Loading...');
-  this.select_label = () => i18n('Select an option');
-  this.previous_page = () => i18n('previous');
-  this.next_page = () => i18n('next page');
-  this.first_page = () => i18n('First page');
-  this.last_page = () => i18n('Last page');
-  this.items_per_page = () => i18n('per page');
-  this.confirmation_ok = () => i18n('Ok');
-  this.confirmation_cancel = () => i18n('Cancel');
-/* eslint-enable camelcase */
-}
-
-angularModule.factory('ringI18n', emptyI18n);
-angularModule.service('RingMessageBundle', ['ringI18n', RingMessageBundle]);
-
-export default angularModule.name;

package/components/old-browsers-message/__mocks__/old-browsers-message.js

@@ -1 +0,0 @@
-export function stop() {}

package/components/pager-ng/pager-ng.examples.js

@@ -1,37 +0,0 @@
-import angular from 'angular';
-
-import angularDecorator, {APP_NAME} from '../../.storybook/angular-decorator';
-
-import RingPager from './pager-ng';
-
-export default {
-  title: 'Legacy Angular/Pager Ng',
-  decorators: [angularDecorator()],
-
-  parameters: {
-    notes: 'Provides an Angular wrapper for Pager.'
-  }
-};
-
-export const basic = () => {
-  angular.module(APP_NAME, [RingPager]).controller('testCtrl', function controller() {
-    this.total = 750;
-    this.currentPage = 1;
-
-    this.onPageChange = page => {
-      this.currentPage = page;
-    };
-  });
-
-  return `
-      <div ng-controller="testCtrl as ctrl">
-        <rg-pager
-          total="ctrl.total"
-          current-page="ctrl.currentPage"
-          on-page-change="ctrl.onPageChange"
-        ></rg-pager>
-      </div>
-    `;
-};
-
-basic.storyName = 'Pager Ng';

package/components/pager-ng/pager-ng.js

@@ -1,7 +0,0 @@
-/**
- * @name Pager Ng
- */
-import angularComponentFactory from '../global/angular-component-factory';
-import Pager from '../pager/pager';
-
-export default angularComponentFactory(Pager, 'Pager').name;

package/components/palette/palette.examples.js

@@ -1,63 +0,0 @@
-import angular from 'angular';
-
-import angularDecorator, {APP_NAME} from '../../.storybook/angular-decorator';
-
-import './palette.css';
-
-export default {
-  title: 'Style-only/Color fields palette',
-  decorators: [angularDecorator()],
-
-  parameters: {
-    notes: 'Defines the color palette used for tags and custom fields.',
-    hermione: {skip: true},
-    a11y: {options: {rules: {'color-contrast': {enabled: false}}}}
-  }
-};
-
-export const basic = () => {
-  angular.module(APP_NAME, []).controller('TestCtrl', function controller() {
-    const xrange = num => [...Array(num)].map((val, index) => index);
-
-    this.arr5 = xrange(5);
-    this.arr7 = xrange(7);
-  });
-
-  return `
-      <div ng-controller="TestCtrl as testCtrl">
-        <h4>ColorId</h4>
-        <div ng-repeat="i in testCtrl.arr5" class="example">
-          <div ng-repeat="j in testCtrl.arr7"
-            ng-init="colorId = i * 7 + j + 1"
-            ng-attr-class="ring-palette_color-{{colorId}}">
-            Color {{colorId}}
-          </div>
-        </div>
-        <h4>ToneId and BrightnessId</h4>
-        <div class="example" ng-repeat="toneId in testCtrl.arr7">
-          <div><b>Tone {{toneId}}:</b></div>
-          <div ng-repeat="brightnessId in testCtrl.arr5"
-            ng-attr-class="ring-palette_tone-{{toneId}}-{{brightnessId}}">
-            Brightness {{brightnessId}}
-          </div>
-        </div>
-      </div>
-    `;
-};
-
-basic.storyName = 'Color fields palette';
-
-basic.parameters = {
-  storyStyles: `
-<style>
-  .example {
-    margin: 4px;
-  }
-
-  .example div {
-    width: 90px;
-    display: inline-block;
-  }
-</style>
-      `
-};

package/components/panel-ng/panel-ng.js

@@ -1,20 +0,0 @@
-/**
- * @name Panel Ng
- */
-import angular from 'angular';
-
-import styles from '../panel/panel.css';
-import {addClasses} from '../global/dom';
-
-
-const angularModule = angular.module('Ring.panel', []);
-
-angularModule.directive('rgPanel', function rgEqualValueDirective() {
-  return {
-    link: function link(scope, iElement) {
-      addClasses(iElement[0].classList, styles.panel);
-    }
-  };
-});
-
-export default angularModule.name;

package/components/permissions-ng/permissions-ng.css

@@ -1,5 +0,0 @@
-@import "../global/variables.css";
-
-:global(.ring-permission-hide) {
-  display: none !important;
-}