@jetbrains/ring-ui 5.0.103 → 5.0.105

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;
@@ -40,12 +41,21 @@ export default class HTTP implements Partial<HTTPAuth> {
     private _storeRequestMeta;
     private _processResponse;
     private static _isErrorStatus;
-    fetch: (url: string, params?: FetchParams) => Promise<any>;
+    fetch: <T = any>(url: string, params?: FetchParams) => Promise<T>;
     authorizedFetch(...args: Parameters<HTTP['_performRequest']>): Promise<any>;
-    request: (url: string, params?: RequestParams) => Promise<any>;
+    request: <T = any>(url: string, params?: RequestParams) => Promise<T>;
     getMetaForResponse: (response: object) => Partial<Response> | undefined;
-    get: (url: string, params?: RequestParamsWithoutMethod) => Promise<any>;
-    post: (url: string, params?: RequestParamsWithoutMethod) => Promise<any>;
-    delete: (url: string, params?: RequestParamsWithoutMethod) => Promise<any>;
-    put: (url: string, params?: RequestParamsWithoutMethod) => Promise<any>;
+    get: <T = any>(url: string, params?: RequestParamsWithoutMethod) => Promise<T>;
+    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

@@ -123,6 +123,8 @@ export default class HTTP {
     static _isErrorStatus(status) {
         return status < STATUS_OK_IF_MORE_THAN || status >= STATUS_BAD_IF_MORE_THAN;
     }
+    // TODO: Replace any to never/unknown in next release and remove eslint-disable
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     fetch = async (url, params = {}) => {
         const { body, query = {}, ...fetchConfig } = params;
         const response = await this._fetch(this._makeRequestUrl(url, query), {
@@ -136,6 +138,8 @@ export default class HTTP {
         const response = await this._performRequest(...args);
         return this._processResponse(response);
     }
+    // TODO: Replace any to never/unknown in next release and remove eslint-disable
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     request = async (url, params) => {
         let token = await this.requestToken?.();
         let response = await this._performRequest(url, token, params);
@@ -159,20 +163,42 @@ export default class HTTP {
         }
     };
     getMetaForResponse = (response) => this._requestsMeta.get(response);
+    // TODO: Replace any to never/unknown in next release and remove eslint-disable
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     get = (url, params) => (this.request(url, {
         ...params,
         method: 'GET'
     }));
+    // TODO: Replace any to never/unknown in next release and remove eslint-disable
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     post = (url, params) => (this.request(url, {
         ...params,
         method: 'POST'
     }));
+    // TODO: Replace any to never/unknown in next release and remove eslint-disable
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     delete = (url, params) => (this.request(url, {
         ...params,
         method: 'DELETE'
     }));
+    // TODO: Replace any to never/unknown in next release and remove eslint-disable
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     put = (url, params) => (this.request(url, {
         ...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
         })
     };

package/dist/_helpers/card.js

@@ -105,9 +105,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
   })
 });

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;
@@ -40,12 +41,21 @@ export default class HTTP implements Partial<HTTPAuth> {
     private _storeRequestMeta;
     private _processResponse;
     private static _isErrorStatus;
-    fetch: (url: string, params?: FetchParams) => Promise<any>;
+    fetch: <T = any>(url: string, params?: FetchParams) => Promise<T>;
     authorizedFetch(...args: Parameters<HTTP['_performRequest']>): Promise<any>;
-    request: (url: string, params?: RequestParams) => Promise<any>;
+    request: <T = any>(url: string, params?: RequestParams) => Promise<T>;
     getMetaForResponse: (response: object) => Partial<Response> | undefined;
-    get: (url: string, params?: RequestParamsWithoutMethod) => Promise<any>;
-    post: (url: string, params?: RequestParamsWithoutMethod) => Promise<any>;
-    delete: (url: string, params?: RequestParamsWithoutMethod) => Promise<any>;
-    put: (url: string, params?: RequestParamsWithoutMethod) => Promise<any>;
+    get: <T = any>(url: string, params?: RequestParamsWithoutMethod) => Promise<T>;
+    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);
       }
@@ -203,10 +217,15 @@ class HTTP {
   static _isErrorStatus(status) {
     return status < STATUS_OK_IF_MORE_THAN || status >= STATUS_BAD_IF_MORE_THAN;
   }
+  // TODO: Replace any to never/unknown in next release and remove eslint-disable
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
   async authorizedFetch() {
     const response = await this._performRequest(...arguments);
     return this._processResponse(response);
   }
+  // TODO: Replace any to never/unknown in next release and remove eslint-disable
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
 }
 
 export { CODE, HTTPError, HTTP as default, defaultFetchConfig };

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])
 };
 

package/dist/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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jetbrains/ring-ui",
-  "version": "5.0.103",
+  "version": "5.0.105",
   "description": "JetBrains UI library",
   "author": "JetBrains",
   "license": "Apache-2.0",
@@ -84,19 +84,19 @@
     "@rollup/plugin-replace": "^5.0.2",
     "@storybook/addon-a11y": "6.5.16",
     "@storybook/addon-docs": "6.5.16",
-    "@storybook/addon-essentials": "6.5.15",
+    "@storybook/addon-essentials": "6.5.16",
     "@storybook/addon-storyshots": "6.5.16",
     "@storybook/addon-storyshots-puppeteer": "6.5.16",
     "@storybook/addon-storysource": "6.5.16",
     "@storybook/addons": "6.5.16",
     "@storybook/builder-webpack5": "6.5.16",
-    "@storybook/client-api": "6.5.15",
+    "@storybook/client-api": "6.5.16",
     "@storybook/core": "6.5.16",
     "@storybook/html": "6.5.16",
-    "@storybook/manager-webpack5": "6.5.15",
+    "@storybook/manager-webpack5": "6.5.16",
     "@storybook/react": "6.5.16",
     "@storybook/source-loader": "6.5.16",
-    "@storybook/theming": "6.5.15",
+    "@storybook/theming": "6.5.16",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^14.4.3",
     "@types/chai": "^4.3.4",
@@ -108,15 +108,15 @@
     "@types/react-dom": "^18.0.10",
     "@types/sinon": "^10.0.13",
     "@types/sinon-chai": "^3.2.9",
-    "@typescript-eslint/eslint-plugin": "^5.49.0",
-    "@typescript-eslint/parser": "^5.49.0",
+    "@typescript-eslint/eslint-plugin": "^5.50.0",
+    "@typescript-eslint/parser": "^5.50.0",
     "@wojtekmaj/enzyme-adapter-react-17": "^0.8.0",
     "angular": "^1.8.3",
     "angular-mocks": "^1.8.3",
     "angular-route": "^1.8.3",
     "babel-plugin-react-docgen": "^4.2.1",
     "babel-plugin-require-context-hook": "^1.0.0",
-    "caniuse-lite": "^1.0.30001449",
+    "caniuse-lite": "^1.0.30001450",
     "chai": "^4.3.7",
     "chai-as-promised": "^7.1.1",
     "chai-dom": "^1.10.0",
@@ -125,7 +125,7 @@
     "core-js": "^3.27.2",
     "cpy-cli": "^3.1.1",
     "enzyme": "^3.11.0",
-    "eslint": "^8.32.0",
+    "eslint": "^8.33.0",
     "eslint-import-resolver-webpack": "^0.13.2",
     "eslint-plugin-angular": "^4.1.0",
     "eslint-plugin-bdd": "^2.1.1",
@@ -158,7 +158,7 @@
     "react-test-renderer": "^18.2.0",
     "regenerator-runtime": "^0.13.11",
     "rimraf": "^4.1.2",
-    "rollup": "^3.11.0",
+    "rollup": "^3.12.1",
     "rollup-plugin-clear": "^2.0.7",
     "rollup-plugin-styles": "^4.0.0",
     "sinon": "^15.0.1",
@@ -169,7 +169,7 @@
     "svg-inline-loader": "^0.8.2",
     "teamcity-service-messages": "^0.1.14",
     "terser-webpack-plugin": "^5.3.6",
-    "typescript": "~4.9.4",
+    "typescript": "~4.9.5",
     "wallaby-webpack": "^3.9.16",
     "webpack": "^5.75.0",
     "webpack-cli": "^5.0.1",
@@ -212,7 +212,7 @@
     "@ungap/url-search-params": "^0.2.2",
     "babel-loader": "9.1.2",
     "babel-plugin-transform-define": "^2.1.0",
-    "browserslist": "^4.21.4",
+    "browserslist": "^4.21.5",
     "change-case": "^4.1.1",
     "classnames": "^2.3.2",
     "combokeys": "^3.0.1",