@jetbrains/ring-ui-built 8.0.0-beta.4 → 8.0.0-beta.5

package/components/auth/auth.js

@@ -12,8 +12,9 @@ import '../global/get-uid.js';
 import '../alert/alert.js';
 import 'classnames';
 import '@jetbrains/icons/exception';
-import '@jetbrains/icons/checkmark';
+import '@jetbrains/icons/success';
 import '@jetbrains/icons/warning';
+import '@jetbrains/icons/info-filled';
 import '@jetbrains/icons/close';
 import '../icon/icon.js';
 import 'util-deprecate';
@@ -32,6 +33,11 @@ import '../global/controls-height.js';
 import '../global/configuration.js';
 import '../_helpers/button.classes.js';
 import '../_helpers/theme.js';
+import '../alert/alert-heading.js';
+import '../heading/heading.js';
+import '../_helpers/heading.js';
+import '../_helpers/alert.js';
+import '../alert/alert-actions.js';
 import '../alert/container.js';
 import 'react-dom';
 import '../link/link.js';

package/components/auth/down-notification.js

@@ -11,8 +11,9 @@ import '../alert/container.js';
 import 'react-dom';
 import 'classnames';
 import '@jetbrains/icons/exception';
-import '@jetbrains/icons/checkmark';
+import '@jetbrains/icons/success';
 import '@jetbrains/icons/warning';
+import '@jetbrains/icons/info-filled';
 import '@jetbrains/icons/close';
 import '../icon/icon.js';
 import 'util-deprecate';
@@ -30,6 +31,11 @@ import '../global/controls-height.js';
 import '../global/configuration.js';
 import '../_helpers/button.classes.js';
 import '../_helpers/theme.js';
+import '../alert/alert-heading.js';
+import '../heading/heading.js';
+import '../_helpers/heading.js';
+import '../_helpers/alert.js';
+import '../alert/alert-actions.js';
 import '../_helpers/link.js';
 
 var styles = {"title":"ring-down-notification-title","error":"ring-down-notification-error"};

package/components/auth/storage.js

@@ -6,8 +6,9 @@ import '../alert/alert.js';
 import 'react';
 import 'classnames';
 import '@jetbrains/icons/exception';
-import '@jetbrains/icons/checkmark';
+import '@jetbrains/icons/success';
 import '@jetbrains/icons/warning';
+import '@jetbrains/icons/info-filled';
 import '@jetbrains/icons/close';
 import '../icon/icon.js';
 import 'util-deprecate';
@@ -27,6 +28,11 @@ import '../global/controls-height.js';
 import '../global/configuration.js';
 import '../_helpers/button.classes.js';
 import '../_helpers/theme.js';
+import '../alert/alert-heading.js';
+import '../heading/heading.js';
+import '../_helpers/heading.js';
+import '../_helpers/alert.js';
+import '../alert/alert-actions.js';
 import '../alert/container.js';
 import 'react-dom';
 

package/components/clipboard/clipboard.js

@@ -6,8 +6,9 @@ import '../alert/alert.js';
 import 'react';
 import 'classnames';
 import '@jetbrains/icons/exception';
-import '@jetbrains/icons/checkmark';
+import '@jetbrains/icons/success';
 import '@jetbrains/icons/warning';
+import '@jetbrains/icons/info-filled';
 import '@jetbrains/icons/close';
 import '../icon/icon.js';
 import 'util-deprecate';
@@ -27,6 +28,11 @@ import '../global/controls-height.js';
 import '../global/configuration.js';
 import '../_helpers/button.classes.js';
 import '../_helpers/theme.js';
+import '../alert/alert-heading.js';
+import '../heading/heading.js';
+import '../_helpers/heading.js';
+import '../_helpers/alert.js';
+import '../alert/alert-actions.js';
 import '../alert/container.js';
 import 'react-dom';
 

package/components/date-picker/consts.d.ts

@@ -34,6 +34,7 @@ export interface DateInputTranslations {
     addSecondDate?: string;
     addTime?: string;
     selectName?: string;
+    selectDate?: string;
 }
 export interface DateSpecificPopupProps {
     withTime?: false | undefined;

package/components/date-picker/date-input.js

@@ -93,6 +93,7 @@ class DateInput extends React.PureComponent {
       locale
     } = this.props;
     const {
+      messages,
       translate
     } = this.context;
     let displayText = '';
@@ -105,7 +106,7 @@ class DateInput extends React.PureComponent {
     } else if (name === 'time') {
       displayText = time || '';
     }
-    const placeholder = ((_translations$addFirs, _translations$addSeco, _translations$addTime, _translations$selectN) => {
+    const placeholder = ((_translations$addFirs, _translations$addSeco, _translations$addTime, _ref, _ref2, _ref3, _translations$selectD) => {
       switch (name) {
         case 'from':
           return fromPlaceholder || ((_translations$addFirs = translations?.addFirstDate) !== null && _translations$addFirs !== void 0 ? _translations$addFirs : translate('addFirstDate'));
@@ -114,7 +115,7 @@ class DateInput extends React.PureComponent {
         case 'time':
           return timePlaceholder || ((_translations$addTime = translations?.addTime) !== null && _translations$addTime !== void 0 ? _translations$addTime : translate('addTime'));
         default:
-          return ((_translations$selectN = translations?.selectName) !== null && _translations$selectN !== void 0 ? _translations$selectN : translate('selectName')).replace('%name%', name).replace('{{name}}', name);
+          return ((_ref = (_ref2 = (_ref3 = (_translations$selectD = translations?.selectDate) !== null && _translations$selectD !== void 0 ? _translations$selectD : translations?.selectName) !== null && _ref3 !== void 0 ? _ref3 : messages.selectDate) !== null && _ref2 !== void 0 ? _ref2 : messages.selectName) !== null && _ref !== void 0 ? _ref : translate('selectDate')).replace('%name%', name).replace('{{name}}', name);
       }
     })();
     const classes = classNames(styles.filter, name !== 'time' && styles[`${name}Input`], divider && (name === 'from' || name === 'time') && styles[`${name}InputWithDivider`], 'ring-js-shortcuts');

package/components/header/header.js

@@ -79,10 +79,16 @@ import '../alert-service/alert-service.js';
 import 'react-dom/client';
 import '../alert/alert.js';
 import '@jetbrains/icons/exception';
-import '@jetbrains/icons/checkmark';
+import '@jetbrains/icons/success';
 import '@jetbrains/icons/warning';
+import '@jetbrains/icons/info-filled';
 import '@jetbrains/icons/close';
 import '../loader-inline/loader-inline.js';
+import '../alert/alert-heading.js';
+import '../heading/heading.js';
+import '../_helpers/heading.js';
+import '../_helpers/alert.js';
+import '../alert/alert-actions.js';
 import '../alert/container.js';
 import '../auth/auth.js';
 import '../auth/window-flow.js';

package/components/header/smart-profile.js

@@ -9,8 +9,9 @@ import '../global/get-uid.js';
 import '../alert/alert.js';
 import 'classnames';
 import '@jetbrains/icons/exception';
-import '@jetbrains/icons/checkmark';
+import '@jetbrains/icons/success';
 import '@jetbrains/icons/warning';
+import '@jetbrains/icons/info-filled';
 import '@jetbrains/icons/close';
 import '../icon/icon.js';
 import 'util-deprecate';
@@ -29,6 +30,11 @@ import '../global/controls-height.js';
 import '../global/configuration.js';
 import '../_helpers/button.classes.js';
 import '../_helpers/theme.js';
+import '../alert/alert-heading.js';
+import '../heading/heading.js';
+import '../_helpers/heading.js';
+import '../_helpers/alert.js';
+import '../alert/alert-actions.js';
 import '../alert/container.js';
 import 'react-dom';
 import '../avatar/avatar.js';

package/components/http/http.d.ts

@@ -20,7 +20,7 @@ export interface RequestParams<RawBody extends boolean = true | false> extends F
 export type RequestParamsWithoutMethod<RawBody extends boolean = boolean> = Omit<RequestParams<RawBody>, 'method'>;
 export interface HTTPAuth {
     requestToken(): Promise<string | null> | string | null;
-    forceTokenUpdate(): Promise<string | null>;
+    forceTokenUpdate(failedToken?: string | null): Promise<string | null>;
 }
 export default class HTTP implements Partial<HTTPAuth> {
     baseUrl: string | null | undefined;
@@ -28,7 +28,7 @@ export default class HTTP implements Partial<HTTPAuth> {
     fetchConfig: RequestInit;
     requestToken?: () => Promise<string | null> | string | null;
     shouldRefreshToken?: (error: string) => boolean;
-    forceTokenUpdate?: () => Promise<string | null>;
+    forceTokenUpdate?: (failedToken?: string | null) => Promise<string | null>;
     constructor(auth?: HTTPAuth, baseUrl?: string | null | undefined, fetchConfig?: RequestInit);
     setAuth: (auth: HTTPAuth) => void;
     setBaseUrl: (baseUrl: string | null | undefined) => void;

package/components/http/http.js

@@ -54,7 +54,7 @@ class HTTP {
   setAuth = auth => {
     this.requestToken = () => auth.requestToken();
     this.shouldRefreshToken = auth.constructor.shouldRefreshToken;
-    this.forceTokenUpdate = () => auth.forceTokenUpdate();
+    this.forceTokenUpdate = failedToken => auth.forceTokenUpdate(failedToken);
   };
   setBaseUrl = baseUrl => {
     this.baseUrl = baseUrl;
@@ -170,7 +170,7 @@ class HTTP {
       }
       const shouldRefreshToken = typeof error.data.error === 'string' ? this.shouldRefreshToken?.(error.data.error) : false;
       if (shouldRefreshToken) {
-        token = await this.forceTokenUpdate?.();
+        token = await this.forceTokenUpdate?.(token);
         response = await this._performRequest(url, token, params);
         return this._processResponse(response);
       }

package/components/i18n/i18n.d.ts

@@ -23,6 +23,7 @@ export declare function getTranslations(): Partial<{
     addSecondDate: string;
     addTime: string;
     selectName: string;
+    selectDate: string;
     setDate: string;
     setDateTime: string;
     setPeriod: string;

package/components/i18n/i18n.js

@@ -18,6 +18,7 @@ var addFirstDate = "Add first date";
 var addSecondDate = "Add second date";
 var addTime = "Add time";
 var selectName = "Select {{name}}";
+var selectDate = "Select a date";
 var setDate = "Set a date";
 var setDateTime = "Set date and time";
 var setPeriod = "Set a period";
@@ -70,6 +71,7 @@ var defaultMessages = {
 	addSecondDate: addSecondDate,
 	addTime: addTime,
 	selectName: selectName,
+	selectDate: selectDate,
 	setDate: setDate,
 	setDateTime: setDateTime,
 	setPeriod: setPeriod,

package/components/internal/reorder-animation-context.js

@@ -0,0 +1,159 @@
+import { c } from 'react/compiler-runtime';
+import { createContext, useState, useRef, useEffect } from 'react';
+import { parseCssDuration } from '../global/parse-css-duration.js';
+import { requestAnimationFrameWithCleanup, setTimeoutWithCleanup } from '../global/schedule-with-cleanup.js';
+import { s as styles } from '../_helpers/table.js';
+
+/** How long to wait for the data to change after {@link expectReorder} is called. */
+const pendingReorderTimeoutMs = 1000;
+const ReorderAnimationContext = /*#__PURE__*/createContext({
+  reorderAnimation: null,
+  expectReorder: () => {}
+});
+function useReorderAnimationContextValue(t0) {
+  const $ = c(20);
+  if ($[0] !== "669a1fb3f5ac9a1cdad72a7fc204b97d9b35bce2182bb3bb8f0bd0acb524b958") {
+    for (let $i = 0; $i < 20; $i += 1) {
+      $[$i] = Symbol.for("react.memo_cache_sentinel");
+    }
+    $[0] = "669a1fb3f5ac9a1cdad72a7fc204b97d9b35bce2182bb3bb8f0bd0acb524b958";
+  }
+  const {
+    noColumnReorderAnimation,
+    noItemReorderAnimation,
+    tableRef,
+    data,
+    columns
+  } = t0;
+  const [reorderAnimation, setReorderAnimation] = useState(null);
+  const pendingReorderRef = useRef(null);
+  let t1;
+  if ($[1] !== columns || $[2] !== data || $[3] !== noColumnReorderAnimation || $[4] !== noItemReorderAnimation) {
+    t1 = function expectReorder(reorderSpec) {
+      const isColumn = reorderSpec.direction === "columns";
+      if (isColumn && noColumnReorderAnimation || !isColumn && noItemReorderAnimation) {
+        return;
+      }
+      if (pendingReorderRef.current) {
+        window.clearTimeout(pendingReorderRef.current.timerId);
+      }
+      const timerId = window.setTimeout(() => {
+        pendingReorderRef.current = null;
+      }, pendingReorderTimeoutMs);
+      pendingReorderRef.current = {
+        ...reorderSpec,
+        timerId,
+        columns,
+        data
+      };
+    };
+    $[1] = columns;
+    $[2] = data;
+    $[3] = noColumnReorderAnimation;
+    $[4] = noItemReorderAnimation;
+    $[5] = t1;
+  } else {
+    t1 = $[5];
+  }
+  const expectReorder = t1;
+  let t2;
+  let t3;
+  if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
+    t2 = () => () => {
+      if (pendingReorderRef.current) {
+        window.clearTimeout(pendingReorderRef.current.timerId);
+        pendingReorderRef.current = null;
+      }
+    };
+    t3 = [];
+    $[6] = t2;
+    $[7] = t3;
+  } else {
+    t2 = $[6];
+    t3 = $[7];
+  }
+  useEffect(t2, t3);
+  let t4;
+  let t5;
+  if ($[8] !== columns || $[9] !== data || $[10] !== tableRef) {
+    t4 = () => {
+      const table = tableRef.current;
+      const pendingReorder = pendingReorderRef.current;
+      if (!table || !pendingReorder) {
+        return;
+      }
+      const {
+        direction,
+        data: pendingData,
+        columns: pendingColumns
+      } = pendingReorder;
+      const isColumn_0 = direction === "columns";
+      if (isColumn_0 && columns === pendingColumns || !isColumn_0 && data === pendingData) {
+        return;
+      }
+      pendingReorderRef.current = null;
+      const {
+        fromIndex,
+        insertionIndex
+      } = pendingReorder;
+      const index = fromIndex < insertionIndex ? insertionIndex - 1 : insertionIndex;
+      return requestAnimationFrameWithCleanup(() => setReorderAnimation(prev => prev == null ? {
+        direction,
+        index,
+        phase: "initial",
+        className: styles.reorderAnimationInitial
+      } : prev));
+    };
+    t5 = [data, columns, tableRef];
+    $[8] = columns;
+    $[9] = data;
+    $[10] = tableRef;
+    $[11] = t4;
+    $[12] = t5;
+  } else {
+    t4 = $[11];
+    t5 = $[12];
+  }
+  useEffect(t4, t5);
+  let t6;
+  let t7;
+  if ($[13] !== reorderAnimation || $[14] !== tableRef) {
+    t6 = () => {
+      if (reorderAnimation?.phase === "initial") {
+        return requestAnimationFrameWithCleanup(() => setReorderAnimation(prev_0 => prev_0 === reorderAnimation ? {
+          ...prev_0,
+          phase: "fade-out",
+          className: styles.reorderAnimationFadeOut
+        } : prev_0));
+      }
+      if (reorderAnimation?.phase === "fade-out") {
+        const fadeOutMs = parseCssDuration(window.getComputedStyle(tableRef.current).getPropertyValue("--reorder-animation-fade-out-duration"));
+        return setTimeoutWithCleanup(() => setReorderAnimation(prev_1 => prev_1 === reorderAnimation ? null : prev_1), fadeOutMs);
+      }
+    };
+    t7 = [reorderAnimation, tableRef];
+    $[13] = reorderAnimation;
+    $[14] = tableRef;
+    $[15] = t6;
+    $[16] = t7;
+  } else {
+    t6 = $[15];
+    t7 = $[16];
+  }
+  useEffect(t6, t7);
+  let t8;
+  if ($[17] !== expectReorder || $[18] !== reorderAnimation) {
+    t8 = {
+      reorderAnimation,
+      expectReorder
+    };
+    $[17] = expectReorder;
+    $[18] = reorderAnimation;
+    $[19] = t8;
+  } else {
+    t8 = $[19];
+  }
+  return t8;
+}
+
+export { ReorderAnimationContext, useReorderAnimationContextValue };