@jetbrains/ring-ui 5.0.104 → 5.0.106

package/components/editable-heading/editable-heading.js

@@ -21,10 +21,16 @@ export const EditableHeading = (props) => {
     const isSaveDisabled = !isSavingPossible || !children || children.trim() === '' || hasError || isSaving;
     const isCancelDisabled = isSaving;
     const isShortcutsDisabled = !isInFocus || isSaving;
-    const shortcutsMap = React.useMemo(() => ({
-        enter: isSaveDisabled ? noop : onSave,
-        esc: isCancelDisabled ? noop : onCancel
-    }), [isSaveDisabled, isCancelDisabled, onSave, onCancel]);
+    const shortcutsMap = React.useMemo(() => {
+        const map = {};
+        if (!isSaveDisabled) {
+            map.enter = onSave;
+        }
+        if (isCancelDisabled) {
+            map.esc = onCancel;
+        }
+        return map;
+    }, [isSaveDisabled, isCancelDisabled, onSave, onCancel]);
     const classes = classNames(styles.editableHeading, className, {
         [styles.fullSize]: isEditing && size === Size.FULL,
         [styles.isEditing]: isEditing,

package/components/http/http.d.ts

@@ -11,6 +11,7 @@ export declare class HTTPError extends ExtendableError {
 export declare const CODE: {
     UNAUTHORIZED: number;
 };
+type Method<T> = (url: string, params?: RequestParams) => Promise<T>;
 export interface FetchParams<T = unknown> extends Omit<RequestInit, 'body' | 'headers'> {
     body?: T;
     query?: Record<string, unknown> | undefined;
@@ -48,4 +49,13 @@ export default class HTTP implements Partial<HTTPAuth> {
     post: <T = any>(url: string, params?: RequestParamsWithoutMethod) => Promise<T>;
     delete: <T = any>(url: string, params?: RequestParamsWithoutMethod) => Promise<T>;
     put: <T = any>(url: string, params?: RequestParamsWithoutMethod) => Promise<T>;
+    /**
+     * Usage: const {promise, abort} = http.abortify(http.get<{id: string}>)('http://test.com');
+     * @param method
+     */
+    abortify: <T>(method: Method<T>) => (url: string, params?: RequestParams<boolean> | undefined) => {
+        promise: Promise<T>;
+        abort: () => void;
+    };
 }
+export {};

package/components/http/http.js

@@ -187,4 +187,18 @@ export default class HTTP {
         ...params,
         method: 'PUT'
     }));
+    /**
+     * Usage: const {promise, abort} = http.abortify(http.get<{id: string}>)('http://test.com');
+     * @param method
+     */
+    abortify = (method) => (...[url, params]) => {
+        const ctrl = new AbortController();
+        if (params && !('signal' in params)) {
+            params.signal = ctrl.signal;
+        }
+        return {
+            promise: method.call(this, url, params),
+            abort: () => ctrl.abort()
+        };
+    };
 }

package/components/input/input.d.ts

@@ -11,6 +11,9 @@ declare enum Size {
     L = "L",
     FULL = "FULL"
 }
+export interface InputTranslations {
+    clear: string;
+}
 export interface InputBaseProps {
     size: Size;
     enableShortcuts: boolean | string[];
@@ -25,6 +28,7 @@ export interface InputBaseProps {
     icon?: string | ComponentType | null | undefined;
     height?: ControlsHeight | undefined;
     afterInput?: ReactNode;
+    translations: InputTranslations;
 }
 type Override<D, S> = Omit<D, keyof S> & S;
 export type InputSpecificProps = Override<InputHTMLAttributes<HTMLInputElement>, InputBaseProps> & {
@@ -42,6 +46,9 @@ export declare class Input extends PureComponent<InputProps> {
         onChange: typeof noop;
         inputRef: typeof noop;
         enableShortcuts: string[];
+        translations: {
+            clear: string;
+        };
     };
     state: {
         empty: boolean;

package/components/input/input.js

@@ -27,7 +27,10 @@ export class Input extends PureComponent {
         size: Size.M,
         onChange: noop,
         inputRef: noop,
-        enableShortcuts: ['esc']
+        enableShortcuts: ['esc'],
+        translations: {
+            clear: 'Clear input'
+        }
     };
     state = {
         empty: true
@@ -92,7 +95,7 @@ export class Input extends PureComponent {
         // Modifiers
         size, active, multiline, borderless, 
         // Props
-        label, error, className, inputClassName, children, value, onClear, disabled, inputRef, onChange, enableShortcuts, id, placeholder, icon, height = this.context, afterInput, ...restProps } = this.props;
+        label, error, className, inputClassName, children, value, onClear, disabled, inputRef, onChange, enableShortcuts, id, placeholder, icon, translations, height = this.context, afterInput, ...restProps } = this.props;
         const { empty } = this.state;
         const clearable = !!onClear;
         const classes = classNames(className, styles.outerContainer, [styles[`size${size}`]], [styles[`height${height}`]], {
@@ -124,7 +127,7 @@ export class Input extends PureComponent {
           {multiline
                 ? (<textarea onChange={this.handleTextareaChange} rows={1} {...commonProps} {...restProps}/>)
                 : (<input onChange={this.handleInputChange} {...commonProps} {...restProps}/>)}
-          {clearable && !disabled && (<Button title="Clear input" data-test="ring-input-clear" className={styles.clear} icon={closeIcon} onClick={this.clear}/>)}
+          {clearable && !disabled && (<Button title={translations.clear} data-test="ring-input-clear" className={styles.clear} icon={closeIcon} onClick={this.clear}/>)}
           {afterInput}
         </div>
         {error && <div className={styles.errorText}>{error}</div>}
@@ -155,6 +158,7 @@ Input.propTypes = {
     disabled: PropTypes.bool,
     id: PropTypes.string,
     placeholder: PropTypes.string,
+    translations: PropTypes.object,
     icon: PropTypes.oneOfType([PropTypes.string, PropTypes.elementType])
 };
 export default Input;

package/components/user-card/card.d.ts

@@ -47,9 +47,9 @@ export default class UserCard extends PureComponent<UserCardProps> {
             banned: PropTypes.Validator<string>;
             online: PropTypes.Validator<string>;
             offline: PropTypes.Validator<string>;
-            copyToClipboard: PropTypes.Validator<string>;
-            copiedToClipboard: PropTypes.Validator<string>;
-            copingToClipboardError: PropTypes.Validator<string>;
+            copyToClipboard: PropTypes.Requireable<string>;
+            copiedToClipboard: PropTypes.Requireable<string>;
+            copingToClipboardError: PropTypes.Requireable<string>;
             unverified: PropTypes.Requireable<string>;
         }>>;
     };

package/components/user-card/card.js

@@ -28,9 +28,9 @@ export default class UserCard extends PureComponent {
             banned: PropTypes.string.isRequired,
             online: PropTypes.string.isRequired,
             offline: PropTypes.string.isRequired,
-            copyToClipboard: PropTypes.string.isRequired,
-            copiedToClipboard: PropTypes.string.isRequired,
-            copingToClipboardError: PropTypes.string.isRequired,
+            copyToClipboard: PropTypes.string,
+            copiedToClipboard: PropTypes.string,
+            copingToClipboardError: PropTypes.string,
             unverified: PropTypes.string
         })
     };
@@ -39,7 +39,7 @@ export default class UserCard extends PureComponent {
             banned: 'banned',
             online: 'online',
             offline: 'offline',
-            copyToClipboard: 'Copy to clipboard',
+            copyToClipboard: 'Copy email to clipboard',
             copiedToClipboard: 'Email was copied to clipboard',
             copingToClipboardError: 'Failed to copy to clipboard',
             unverified: 'Unverified'
@@ -75,7 +75,7 @@ export default class UserCard extends PureComponent {
               </div>
               <div className={styles.userLogin}>{user.login}</div>
               {user.email && (<span className={styles.userEmailWrapper}>
-                  <Link pseudo onClick={this.copyEmail} className={styles.userEmail}>
+                  <Link href={`mailto:${user.email}`} title={`mailto:${user.email}`} target="_blank" className={styles.userEmail}>
                     {user.email}
                   </Link>
                   {user.unverifiedEmail && (<span className={styles.unverifiedLabel}>{wording.unverified}</span>)}

package/components/user-card/user-card.css

@@ -29,7 +29,12 @@
 }
 
 .userInformationGeneral {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+
   height: 56px;
+  padding-top: 1px;
 }
 
 .userNameLine {
@@ -72,6 +77,10 @@
 .userCopyIcon svg {
   margin-left: 4px;
 
+  color: var(--ring-icon-color);
+}
+
+.userCopyIcon:hover svg {
   color: var(--ring-link-hover-color);
 }
 
@@ -81,7 +90,7 @@
   opacity: 1;
 }
 
-.userEmailWrapper:hover .userEmail {
+:has(.userCopyIcon:hover) > .userEmail {
   color: var(--ring-link-hover-color);
 }
 

package/dist/_helpers/card.js

@@ -71,8 +71,9 @@ class UserCard extends PureComponent {
     }, user.login), user.email && /*#__PURE__*/React.createElement("span", {
       className: modules_a4196c17.userEmailWrapper
     }, /*#__PURE__*/React.createElement(Link, {
-      pseudo: true,
-      onClick: this.copyEmail,
+      href: `mailto:${user.email}`,
+      title: `mailto:${user.email}`,
+      target: "_blank",
       className: modules_a4196c17.userEmail
     }, user.email), user.unverifiedEmail && /*#__PURE__*/React.createElement("span", {
       className: modules_a4196c17.unverifiedLabel
@@ -105,9 +106,9 @@ _defineProperty(UserCard, "propTypes", {
     banned: PropTypes.string.isRequired,
     online: PropTypes.string.isRequired,
     offline: PropTypes.string.isRequired,
-    copyToClipboard: PropTypes.string.isRequired,
-    copiedToClipboard: PropTypes.string.isRequired,
-    copingToClipboardError: PropTypes.string.isRequired,
+    copyToClipboard: PropTypes.string,
+    copiedToClipboard: PropTypes.string,
+    copingToClipboardError: PropTypes.string,
     unverified: PropTypes.string
   })
 });
@@ -116,7 +117,7 @@ _defineProperty(UserCard, "defaultProps", {
     banned: 'banned',
     online: 'online',
     offline: 'offline',
-    copyToClipboard: 'Copy to clipboard',
+    copyToClipboard: 'Copy email to clipboard',
     copiedToClipboard: 'Email was copied to clipboard',
     copingToClipboardError: 'Failed to copy to clipboard',
     unverified: 'Unverified'

package/dist/editable-heading/editable-heading.js

@@ -66,10 +66,16 @@ const EditableHeading = props => {
   const isSaveDisabled = !isSavingPossible || !children || children.trim() === '' || hasError || isSaving;
   const isCancelDisabled = isSaving;
   const isShortcutsDisabled = !isInFocus || isSaving;
-  const shortcutsMap = React.useMemo(() => ({
-    enter: isSaveDisabled ? noop : onSave,
-    esc: isCancelDisabled ? noop : onCancel
-  }), [isSaveDisabled, isCancelDisabled, onSave, onCancel]);
+  const shortcutsMap = React.useMemo(() => {
+    const map = {};
+    if (!isSaveDisabled) {
+      map.enter = onSave;
+    }
+    if (isCancelDisabled) {
+      map.esc = onCancel;
+    }
+    return map;
+  }, [isSaveDisabled, isCancelDisabled, onSave, onCancel]);
   const classes = classNames(modules_6e69b0fe.editableHeading, className, {
     [modules_6e69b0fe.fullSize]: isEditing && size === Size.FULL,
     [modules_6e69b0fe.isEditing]: isEditing,

package/dist/http/http.d.ts

@@ -11,6 +11,7 @@ export declare class HTTPError extends ExtendableError {
 export declare const CODE: {
     UNAUTHORIZED: number;
 };
+type Method<T> = (url: string, params?: RequestParams) => Promise<T>;
 export interface FetchParams<T = unknown> extends Omit<RequestInit, 'body' | 'headers'> {
     body?: T;
     query?: Record<string, unknown> | undefined;
@@ -48,4 +49,13 @@ export default class HTTP implements Partial<HTTPAuth> {
     post: <T = any>(url: string, params?: RequestParamsWithoutMethod) => Promise<T>;
     delete: <T = any>(url: string, params?: RequestParamsWithoutMethod) => Promise<T>;
     put: <T = any>(url: string, params?: RequestParamsWithoutMethod) => Promise<T>;
+    /**
+     * Usage: const {promise, abort} = http.abortify(http.get<{id: string}>)('http://test.com');
+     * @param method
+     */
+    abortify: <T>(method: Method<T>) => (url: string, params?: RequestParams<boolean> | undefined) => {
+        promise: Promise<T>;
+        abort: () => void;
+    };
 }
+export {};

package/dist/http/http.js

@@ -99,6 +99,20 @@ class HTTP {
       ...params,
       method: 'PUT'
     }));
+    _defineProperty(this, "abortify", method => function () {
+      for (var _len = arguments.length, _ref = new Array(_len), _key = 0; _key < _len; _key++) {
+        _ref[_key] = arguments[_key];
+      }
+      let [url, params] = _ref;
+      const ctrl = new AbortController();
+      if (params && !('signal' in params)) {
+        params.signal = ctrl.signal;
+      }
+      return {
+        promise: method.call(_this, url, params),
+        abort: () => ctrl.abort()
+      };
+    });
     if (_auth) {
       this.setAuth(_auth);
     }
@@ -139,8 +153,8 @@ class HTTP {
       } : {}),
       ...headers
     };
-    Object.entries(combinedHeaders).forEach(_ref => {
-      let [key, header] = _ref;
+    Object.entries(combinedHeaders).forEach(_ref2 => {
+      let [key, header] = _ref2;
       if (header === null || header === undefined) {
         Reflect.deleteProperty(combinedHeaders, key);
       }

package/dist/input/input.d.ts

@@ -11,6 +11,9 @@ declare enum Size {
     L = "L",
     FULL = "FULL"
 }
+export interface InputTranslations {
+    clear: string;
+}
 export interface InputBaseProps {
     size: Size;
     enableShortcuts: boolean | string[];
@@ -25,6 +28,7 @@ export interface InputBaseProps {
     icon?: string | ComponentType | null | undefined;
     height?: ControlsHeight | undefined;
     afterInput?: ReactNode;
+    translations: InputTranslations;
 }
 type Override<D, S> = Omit<D, keyof S> & S;
 export type InputSpecificProps = Override<InputHTMLAttributes<HTMLInputElement>, InputBaseProps> & {
@@ -42,6 +46,9 @@ export declare class Input extends PureComponent<InputProps> {
         onChange: typeof noop;
         inputRef: typeof noop;
         enableShortcuts: string[];
+        translations: {
+            clear: string;
+        };
     };
     state: {
         empty: boolean;

package/dist/input/input.js

@@ -115,6 +115,7 @@ class Input extends PureComponent {
       id,
       placeholder,
       icon,
+      translations,
       height = this.context,
       afterInput,
       ...restProps
@@ -163,7 +164,7 @@ class Input extends PureComponent {
     }, commonProps, restProps)) : /*#__PURE__*/React.createElement("input", _extends({
       onChange: this.handleInputChange
     }, commonProps, restProps)), clearable && !disabled && /*#__PURE__*/React.createElement(Button, {
-      title: "Clear input",
+      title: translations.clear,
       "data-test": "ring-input-clear",
       className: modules_88cfaf40.clear,
       icon: closeIcon,
@@ -177,7 +178,10 @@ _defineProperty(Input, "defaultProps", {
   size: Size.M,
   onChange: noop,
   inputRef: noop,
-  enableShortcuts: ['esc']
+  enableShortcuts: ['esc'],
+  translations: {
+    clear: 'Clear input'
+  }
 });
 _defineProperty(Input, "contextType", ControlsHeightContext);
 Input.propTypes = {
@@ -197,6 +201,7 @@ Input.propTypes = {
   disabled: PropTypes.bool,
   id: PropTypes.string,
   placeholder: PropTypes.string,
+  translations: PropTypes.object,
   icon: PropTypes.oneOfType([PropTypes.string, PropTypes.elementType])
 };