@jetbrains/ring-ui 4.1.4 → 5.0.0-beta.1

package/components/error-page-ng/error-page-ng.examples.js

@@ -4,9 +4,9 @@ import AngularRoute from 'angular-route';
 
 import angularDecorator, {APP_NAME} from '../../.storybook/angular-decorator';
 
-import authMock from '@jetbrains/ring-ui/components/auth-ng/auth-ng.mock';
+import authMock from '../auth-ng/auth-ng.mock';
 
-import ErrorPageNG from '@jetbrains/ring-ui/components/error-page-ng/error-page-ng';
+import ErrorPageNG from './error-page-ng';
 
 export default {
   title: 'Legacy Angular/Error Page Ng',

package/components/footer/footer.d.ts

@@ -0,0 +1,28 @@
+/**
+ * @name Footer
+ */
+import React, { HTMLAttributeAnchorTarget, ReactChild } from 'react';
+/**
+ * Return copyright string
+ * @param year {int}
+ * @returns {string}
+ */
+export declare function copyright(year: number): string;
+export interface FooterLinkItem {
+    copyright?: number | null | undefined;
+    label?: string | null | undefined;
+    url?: string | null | undefined;
+    target?: HTMLAttributeAnchorTarget | undefined;
+    title?: string | undefined;
+}
+declare type FooterItem = FooterLinkItem | ReactChild;
+declare type FooterItems = readonly (FooterItem | readonly FooterItem[])[];
+export interface FooterProps {
+    className?: string | null | undefined;
+    floating?: boolean | null | undefined;
+    left?: FooterItems | null | undefined;
+    center?: FooterItems | null | undefined;
+    right?: FooterItems | null | undefined;
+}
+declare const Footer: React.NamedExoticComponent<FooterProps>;
+export default Footer;

package/components/footer/footer.jsx

@@ -0,0 +1,96 @@
+/**
+ * @name Footer
+ */
+import React, { memo, isValidElement } from 'react';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+import Link from '../link/link';
+import styles from './footer.css';
+const FooterColumn = memo(function FooterColumn({ position, children }) {
+    const classes = classNames({
+        [styles.columnLeft]: position === 'left',
+        [styles.columnCenter]: position === 'center',
+        [styles.columnRight]: position === 'right'
+    });
+    return (<div className={classes}>
+      <ul className={styles.columnItem}>
+        {children}
+      </ul>
+    </div>);
+});
+FooterColumn.propTypes = {
+    position: PropTypes.oneOf(['left', 'center', 'right']).isRequired,
+    children: PropTypes.node
+};
+/**
+ * Return copyright string
+ * @param year {int}
+ * @returns {string}
+ */
+export function copyright(year) {
+    const currentYear = (new Date()).getUTCFullYear();
+    const ndash = '–';
+    let ret = 'Copyright © ';
+    if (year >= currentYear) {
+        ret += year;
+    }
+    else {
+        ret += year + ndash + currentYear;
+    }
+    return ret;
+}
+/**
+ * @constructor
+ * @extends {ReactComponent}
+ */
+const FooterLine = memo(function FooterLine(props) {
+    const items = Array.isArray(props.item) ? props.item : [props.item];
+    function renderItem(item) {
+        if (isValidElement(item) || typeof item !== 'object') {
+            return item;
+        }
+        const element = (item.copyright ? copyright(item.copyright) : '') + (item.label || item);
+        if (item.url) {
+            return (<Link href={item.url} target={item.target} key={item.url + item.title} title={item.title}>{element}</Link>);
+        }
+        return element;
+    }
+    return (<li className={styles.line}>
+      {items.map(renderItem)}
+    </li>);
+});
+FooterLine.propTypes = {
+    item: PropTypes.oneOfType([
+        PropTypes.object,
+        PropTypes.array,
+        PropTypes.string
+    ])
+};
+const Footer = memo(function Footer({ floating, className, left, center, right }) {
+    function content(elements, position) {
+        if (!elements) {
+            return false;
+        }
+        return (<FooterColumn key={position} position={position}>
+        {elements.map((item, idx) => (<FooterLine 
+            // eslint-disable-next-line react/no-array-index-key
+            key={idx} item={item}/>))}
+      </FooterColumn>);
+    }
+    const classes = classNames(styles.footer, className, {
+        [styles.footerFloating]: floating
+    });
+    return (<footer className={classes} data-test="ring-footer">{[
+            content(left, 'left'),
+            content(center, 'center'),
+            content(right, 'right')
+        ]}</footer>);
+});
+Footer.propTypes = {
+    className: PropTypes.string,
+    floating: PropTypes.bool,
+    left: PropTypes.array,
+    center: PropTypes.array,
+    right: PropTypes.array
+};
+export default Footer;

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

@@ -1,9 +1,9 @@
 import angular from 'angular';
 
 import angularDecorator, {APP_NAME} from '../../.storybook/angular-decorator';
-import '@jetbrains/ring-ui/components/link/link__legacy.css';
+import '../link/link__legacy.css';
 
-import FooterNG from '@jetbrains/ring-ui/components/footer-ng/footer-ng';
+import FooterNG from './footer-ng';
 
 export default {
   title: 'Legacy Angular/Footer Ng',

package/components/form/form.examples.js

@@ -2,11 +2,11 @@ import angular from 'angular';
 
 import angularDecorator, {APP_NAME} from '../../.storybook/angular-decorator';
 
-import '@jetbrains/ring-ui/components/input/input-legacy.css';
-import '@jetbrains/ring-ui/components/form/form.css';
-import '@jetbrains/ring-ui/components/input-size/input-size.css';
+import '../input/input-legacy.css';
+import './form.css';
+import '../input-size/input-size.css';
 
-import ButtonNG from '@jetbrains/ring-ui/components/button-ng/button-ng';
+import ButtonNG from '../button-ng/button-ng';
 
 export default {
   title: 'Style-only/Form',

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

@@ -2,15 +2,15 @@ import angular from 'angular';
 
 import angularDecorator, {APP_NAME} from '../../.storybook/angular-decorator';
 
-import '@jetbrains/ring-ui/components/form/form.css';
+import '../form/form.css';
 
-import ButtonNG from '@jetbrains/ring-ui/components/button-ng/button-ng';
-import SelectNG from '@jetbrains/ring-ui/components/select-ng/select-ng';
-import CheckboxNG from '@jetbrains/ring-ui/components/checkbox-ng/checkbox-ng';
+import ButtonNG from '../button-ng/button-ng';
+import SelectNG from '../select-ng/select-ng';
+import CheckboxNG from '../checkbox-ng/checkbox-ng';
 
-import InputNG from '@jetbrains/ring-ui/components/input-ng/input-ng';
+import InputNG from '../input-ng/input-ng';
 
-import FormNG from '@jetbrains/ring-ui/components/form-ng/form-ng';
+import FormNG from './form-ng';
 
 export default {
   title: 'Legacy Angular/Form Ng',

package/components/global/compose.d.ts

@@ -0,0 +1,7 @@
+declare function compose<A, R1, R2, R3, R4, R5, R6, R7>(f7: (a: R6) => R7, f6: (a: R5) => R6, f5: (a: R4) => R5, f4: (a: R3) => R4, f3: (a: R2) => R3, f2: (a: R1) => R2, f1: (a: A) => R1): (a: A) => R7;
+declare function compose<A, R1, R2, R3, R4, R5, R6>(f6: (a: R5) => R6, f5: (a: R4) => R5, f4: (a: R3) => R4, f3: (a: R2) => R3, f2: (a: R1) => R2, f1: (a: A) => R1): (a: A) => R6;
+declare function compose<A, R1, R2, R3, R4, R5>(f5: (a: R4) => R5, f4: (a: R3) => R4, f3: (a: R2) => R3, f2: (a: R1) => R2, f1: (a: A) => R1): (a: A) => R5;
+declare function compose<A, R1, R2, R3, R4>(f4: (a: R3) => R4, f3: (a: R2) => R3, f2: (a: R1) => R2, f1: (a: A) => R1): (a: A) => R4;
+declare function compose<A, R1, R2, R3>(f3: (a: R2) => R3, f2: (a: R1) => R2, f1: (a: A) => R1): (a: A) => R3;
+declare function compose<A, R1, R2>(f2: (a: R1) => R2, f1: (a: A) => R1): (a: A) => R2;
+export default compose;

package/components/global/compose.js

@@ -1,4 +1,4 @@
-const compose = (...funcs) =>
-  funcs.reduce((acc, func) => arg => acc(func(arg)), arg => arg);
-
+function compose(...funcs) {
+    return funcs.reduce((acc, func) => arg => acc(func(arg)), arg => arg);
+}
 export default compose;

package/components/global/composeRefs.d.ts

@@ -0,0 +1,3 @@
+import { Ref } from 'react';
+declare const _default: <T>(...refs: (Ref<T> | undefined)[]) => (value: T | null) => void;
+export default _default;

package/components/global/composeRefs.js

@@ -1,7 +1,8 @@
-export default (...refs) => value => refs.forEach(ref => {
-  if (typeof ref === 'function') {
-    ref(value);
-  } else if (ref != null) {
-    ref.current = value;
-  }
+export default (...refs) => (value) => refs.forEach(ref => {
+    if (typeof ref === 'function') {
+        ref(value);
+    }
+    else if (ref != null) {
+        ref.current = value;
+    }
 });