@astral/ui 4.55.2 → 4.55.4

package/components/ConfigProvider/ConfigProvider.d.ts

@@ -1,6 +1,7 @@
 import { type ReactElement, type ReactNode } from 'react';
 import { type LanguageMap } from '../DatePicker/types';
 import { type PlaceholderImageProps } from '../placeholders/Placeholder/Image';
+import { type CaptureException } from '../services/ErrorService';
 import { type NextFeatureFlagsContextProps } from './NextFeatureFlagsContext';
 type Language = 'ru';
 type ImagesMap = {
@@ -45,7 +46,7 @@ export type ConfigContextProps = {
      * @default russianMap
      */
     datePickerLanguageMap: LanguageMap;
-    captureException: (error: any) => void;
+    captureException: CaptureException;
     /**
      * Карта для типовых изображений.
      * Используется в компонентах ui-kit, где требуется отображение декоративных

package/components/ErrorBoundary/ErrorBoundary.d.ts

@@ -1,5 +1,4 @@
 import React, { type ReactNode } from 'react';
-import { ConfigContext } from '../ConfigProvider';
 import { ErrorBoundaryTypeError } from './enums';
 export type State = {
     /**
@@ -23,14 +22,12 @@ type Props = {
  * @example <ErrorBoundary><InsecureComponent/></ErrorBoundary>
  */
 declare class ErrorBoundary extends React.Component<Props, State> {
-    static contextType: React.Context<import("../ConfigProvider").ConfigContextProps>;
-    context: React.ContextType<typeof ConfigContext>;
     state: State;
+    componentDidCatch(error: Error): void;
+    render(): React.ReactNode;
     static getDerivedStateFromError(error: Error): {
         hasError: boolean;
         typeError: ErrorBoundaryTypeError;
     };
-    componentDidCatch(error: Error): void;
-    render(): React.ReactNode;
 }
 export { ErrorBoundary };

package/components/ErrorBoundary/ErrorBoundary.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
-import { ConfigContext } from '../ConfigProvider';
 import { InternalErrorPlaceholder } from '../placeholders/InternalErrorPlaceholder';
 import { OutdatedReleasePlaceholder } from '../placeholders/OutdatedReleasePlaceholder';
+import { ErrorService } from '../services/ErrorService';
 import { CONDITION_TYPE_ERROR } from './constants';
 import { ErrorBoundaryTypeError } from './enums';
 /**
@@ -25,15 +25,8 @@ class ErrorBoundary extends React.Component {
             typeError: ErrorBoundaryTypeError.Default,
         };
     }
-    static getDerivedStateFromError(error) {
-        return {
-            hasError: true,
-            typeError: CONDITION_TYPE_ERROR.find(({ condition }) => condition(error))?.type ??
-                ErrorBoundaryTypeError.Default,
-        };
-    }
     componentDidCatch(error) {
-        this.context.captureException(error);
+        ErrorService.getInstance().captureException(error);
     }
     render() {
         if (this.state.hasError) {
@@ -41,6 +34,12 @@ class ErrorBoundary extends React.Component {
         }
         return this.props.children;
     }
+    static getDerivedStateFromError(error) {
+        return {
+            hasError: true,
+            typeError: CONDITION_TYPE_ERROR.find(({ condition }) => condition(error))?.type ??
+                ErrorBoundaryTypeError.Default,
+        };
+    }
 }
-ErrorBoundary.contextType = ConfigContext;
 export { ErrorBoundary };

package/components/PageHeader/PageHeader.js

@@ -7,7 +7,7 @@ import { MobilePageActions } from './MobilePageActions';
 import { MobileTitleWrapper, Wrapper } from './styles';
 import { Title } from './Title';
 import { useLogic } from './useLogic';
-const mobilePageHeader = cva(pageHeaderClassnames.pageHeaderMobileTitle, {
+const mobilePageHeaderCva = cva(pageHeaderClassnames.pageHeaderMobileTitle, {
     variants: {
         hasTitle: {
             true: pageHeaderClassnames.hasTitle,
@@ -17,11 +17,18 @@ const mobilePageHeader = cva(pageHeaderClassnames.pageHeaderMobileTitle, {
         },
     },
 });
+const rootCva = cva(pageHeaderClassnames.root, {
+    variants: {
+        hasActions: {
+            true: pageHeaderClassnames.hasActions,
+        },
+    },
+});
 export const PageHeader = (props) => {
     const { title, description, subheader, breadcrumbs, actions, backButton, className, filters, } = props;
     const { isLoading, mobileTitleActions, isShowMobileActions } = useLogic(props);
-    return (_jsxs(_Fragment, { children: [_jsxs(MobileTitleWrapper, { className: mobilePageHeader({
+    return (_jsxs(_Fragment, { children: [_jsxs(MobileTitleWrapper, { className: mobilePageHeaderCva({
                     hasTitle: Boolean(title) || isLoading,
                     hasBackButton: Boolean(backButton),
-                }), children: [_jsx(Title, { backButton: backButton, title: title, isLoading: isLoading }), mobileTitleActions && mobileTitleActions] }), _jsx(Wrapper, { className: classNames(pageHeaderClassnames.root, className), children: _jsx(HeaderContent, { breadcrumbs: breadcrumbs, backButton: backButton, title: title, description: description, actions: actions, subheader: subheader, filters: filters, isLoading: isLoading }) }), isShowMobileActions && (_jsx(MobilePageActions, { className: classNames(pageHeaderClassnames.pageHeaderActions), isLoading: isLoading, ...actions }))] }));
+                }), children: [_jsx(Title, { backButton: backButton, title: title, isLoading: isLoading }), mobileTitleActions && mobileTitleActions] }), _jsx(Wrapper, { className: classNames(rootCva({ hasActions: Boolean(actions) }), className), children: _jsx(HeaderContent, { breadcrumbs: breadcrumbs, backButton: backButton, title: title, description: description, actions: actions, subheader: subheader, filters: filters, isLoading: isLoading }) }), isShowMobileActions && (_jsx(MobilePageActions, { className: classNames(pageHeaderClassnames.pageHeaderActions), isLoading: isLoading, ...actions }))] }));
 };

package/components/PageHeader/constants.d.ts

@@ -9,5 +9,6 @@ export declare const pageHeaderClassnames: {
     quickFilters: string;
     hasFilters: string;
     hasSubheader: string;
+    hasActions: string;
 };
 export declare const PAGE_HEADER_HEIGHT_MOBILE = "48px";

package/components/PageHeader/constants.js

@@ -10,5 +10,6 @@ export const pageHeaderClassnames = {
     quickFilters: createUIKitClassname('page-header__quick-filters'),
     hasFilters: createUIKitClassname('page-header_has-filters'),
     hasSubheader: createUIKitClassname('page-header_has-subheader'),
+    hasActions: createUIKitClassname('page-header_has-actions'),
 };
 export const PAGE_HEADER_HEIGHT_MOBILE = '48px';

package/components/PageHeader/styles.js

@@ -12,6 +12,10 @@ export const Wrapper = styled.header `
 
   ${({ theme }) => theme.breakpoints.down('laptop')} {
     padding: ${({ theme }) => theme.spacing(0, 4)};
+
+    &.${pageHeaderClassnames.hasActions} {
+      grid-template-columns: min-content 1fr auto auto;
+    }
   }
 
   ${({ theme }) => theme.breakpoints.down('sm')} {

package/components/ProductSwitcher/useLogic/useLogic.js

@@ -1,11 +1,10 @@
-import { useContext, useState } from 'react';
-import { ConfigContext } from '../../ConfigProvider';
+import { useState } from 'react';
+import { ErrorService } from '../../services/ErrorService';
 import { useMenu } from '../../useMenu';
 export const useLogic = ({ getProducts, filter }) => {
     const [products, setProducts] = useState([]);
     const [isLoading, setIsLoading] = useState(false);
     const [isError, setIsError] = useState(false);
-    const { captureException } = useContext(ConfigContext);
     const { open, anchorRef, handleOpenMenu, handleCloseMenu } = useMenu();
     const filterProductList = (productList) => {
         const { hostname } = new URL(window.origin);
@@ -32,7 +31,9 @@ export const useLogic = ({ getProducts, filter }) => {
         }
         catch (error) {
             setIsError(true);
-            captureException(error);
+            ErrorService.getInstance().captureException(error, {
+                place: 'ProductSwitcher',
+            });
         }
         finally {
             setIsLoading(false);

package/components/fileUploading/FileUploaderFile/Actions/useLogic/useLogic.js

@@ -1,11 +1,9 @@
-import { useContext } from 'react';
-import { ConfigContext } from '../../../../ConfigProvider';
+import { ErrorService } from '../../../../services/ErrorService';
 import { ABORT_ERROR_MESSAGE, EXTENSIONS_IN_NEW_TAB, VIEW_NEW_TAB_ERROR_MESSAGE, } from '../../../constants';
 import { useGenerateLocalFileURL } from '../../../hooks/useGenerateLocalFileURL';
 import { MimeTypeRegistry } from '../../../services/MimeTypeRegistry';
 import { generateAttrLinkNewTab } from '../../../utils/generateAttrLinkNewTab';
 export const useLogic = ({ fileId, file, fileUrl, isUploadError, generateDownloadLink, onDelete, onRetry, onView, setErrorStatusFile, selfFiles, isLoading, isError, isDeletingFile, fileName, }) => {
-    const { captureException } = useContext(ConfigContext);
     const { generateUrl } = useGenerateLocalFileURL();
     const { controller } = selfFiles[fileId] || {};
     const isVisibleAbortButton = Boolean(controller);
@@ -55,7 +53,7 @@ export const useLogic = ({ fileId, file, fileUrl, isUploadError, generateDownloa
             onClick: () => {
                 // biome-ignore lint/suspicious/noConsole: Ошибка для интеграторов
                 console.warn(VIEW_NEW_TAB_ERROR_MESSAGE);
-                captureException(`FileId: ${fileId}: ${VIEW_NEW_TAB_ERROR_MESSAGE}`);
+                ErrorService.getInstance().captureCustomError('FileUploader', `FileId: ${fileId}: ${VIEW_NEW_TAB_ERROR_MESSAGE}`);
             },
         };
     };

package/components/fileUploading/PreviewFileUploaderFile/FilePreview/useLogic/useLogic.js

@@ -1,11 +1,9 @@
-import { useContext } from 'react';
-import { ConfigContext } from '../../../../ConfigProvider';
+import { ErrorService } from '../../../../services/ErrorService';
 import { EXTENSIONS_IN_NEW_TAB, VIEW_NEW_TAB_ERROR_MESSAGE, } from '../../../constants';
 import { useGenerateLocalFileURL } from '../../../hooks/useGenerateLocalFileURL';
 import { MimeTypeRegistry } from '../../../services/MimeTypeRegistry';
 import { generateAttrLinkNewTab } from '../../../utils/generateAttrLinkNewTab';
 export const useLogic = ({ fileId, file, fileUrl, generateDownloadLink, onDelete, onView, fileType, }) => {
-    const { captureException } = useContext(ConfigContext);
     const { generateUrl } = useGenerateLocalFileURL();
     const isPdfFile = MimeTypeRegistry.getInstance()
         .getExtensionsByMimeType((file?.type || fileType))
@@ -48,7 +46,7 @@ export const useLogic = ({ fileId, file, fileUrl, generateDownloadLink, onDelete
             onClick: () => {
                 // biome-ignore lint/suspicious/noConsole: Ошибка для интеграторов
                 console.warn(VIEW_NEW_TAB_ERROR_MESSAGE);
-                captureException(`FileId: ${fileId}: ${VIEW_NEW_TAB_ERROR_MESSAGE}`);
+                ErrorService.getInstance().captureCustomError('PreviewFileUploader', `FileId: ${fileId}: ${VIEW_NEW_TAB_ERROR_MESSAGE}`);
             },
         };
     };

package/components/services/ErrorService/ErrorService.d.ts

@@ -1,3 +1,13 @@
+export type CaptureException = (error: unknown, data?: {
+    extra?: Record<string, unknown>;
+}) => void;
+type ErrorExtra = {
+    /**
+     * Место, где произошла ошибка. Например, название компонента
+     */
+    place: string;
+    [key: string]: unknown;
+};
 /**
  * Занимается логированием ошибок и отправкой их в sentry
  */
@@ -6,12 +16,14 @@ export declare class ErrorService {
     private static instance;
     private _captureException?;
     private constructor();
-    init(captureException: (error: Error) => void): void;
-    captureException: (error: Error) => void;
+    init(captureException: CaptureException): void;
+    captureException: (error: unknown, extra?: ErrorExtra) => void;
+    captureCustomError: (place: string, message: string) => void;
     /**
      * Логирует ошибку в консоль и отправляет в sentry
      * */
-    logError: (componentName: string, message: string) => void;
+    logError: (place: string, message: string) => void;
     static getInstance(): ErrorService;
     private createError;
 }
+export {};

package/components/services/ErrorService/ErrorService.js

@@ -4,16 +4,19 @@
 export class ErrorService {
     constructor(logger) {
         this.logger = logger;
-        this.captureException = (error) => {
+        this.captureException = (error, extra) => {
             if (this._captureException) {
-                this._captureException(error);
+                this._captureException(error, extra ? { extra } : undefined);
             }
         };
+        this.captureCustomError = (place, message) => {
+            this.captureException(this.createError(place, message));
+        };
         /**
          * Логирует ошибку в консоль и отправляет в sentry
          * */
-        this.logError = (componentName, message) => {
-            const error = this.createError(componentName, message);
+        this.logError = (place, message) => {
+            const error = this.createError(place, message);
             this.logger.error(error);
             this.captureException(error);
         };

package/hook-form/useFormWizard/useFormWizard.js

@@ -1,5 +1,5 @@
-import { useContext, useMemo, useRef, useState } from 'react';
-import { ConfigContext } from '../../components/ConfigProvider';
+import { useMemo, useRef, useState } from 'react';
+import { ErrorService } from '../../components/services/ErrorService';
 import { useForm } from '../useForm';
 import { useFormWatchFields } from '../useFormWatchFields';
 import { CHANGE_STEP_REASON } from './constants';
@@ -20,7 +20,6 @@ import { compareSteps, getWatchFields } from './utils';
  * <FormWizard {...formWizardProps} />
  */
 export const useFormWizard = ({ initialStepId, defaultValues, isDisabled, steps, autoSaveStrategy, onChangeStep, onAutoSave, onSubmit, onAutoSaveError, }) => {
-    const { captureException } = useContext(ConfigContext);
     const calculateInitialVisibleSteps = () => steps.filter(({ shouldSkip }) => shouldSkip?.calculate
         ? !shouldSkip.calculate(defaultValues)
         : true);
@@ -95,7 +94,11 @@ export const useFormWizard = ({ initialStepId, defaultValues, isDisabled, steps,
                 setCurrentStepId(nextStepId);
             })
                 .catch((error) => {
-                captureException(error);
+                ErrorService.getInstance().captureException(error, {
+                    place: 'useFormWizard',
+                    currentStepId,
+                    nextStepId,
+                });
             });
         }
         setCurrentStepId(nextStepId);

package/node/components/ConfigProvider/ConfigProvider.d.ts

@@ -1,6 +1,7 @@
 import { type ReactElement, type ReactNode } from 'react';
 import { type LanguageMap } from '../DatePicker/types';
 import { type PlaceholderImageProps } from '../placeholders/Placeholder/Image';
+import { type CaptureException } from '../services/ErrorService';
 import { type NextFeatureFlagsContextProps } from './NextFeatureFlagsContext';
 type Language = 'ru';
 type ImagesMap = {
@@ -45,7 +46,7 @@ export type ConfigContextProps = {
      * @default russianMap
      */
     datePickerLanguageMap: LanguageMap;
-    captureException: (error: any) => void;
+    captureException: CaptureException;
     /**
      * Карта для типовых изображений.
      * Используется в компонентах ui-kit, где требуется отображение декоративных

package/node/components/ErrorBoundary/ErrorBoundary.d.ts

@@ -1,5 +1,4 @@
 import React, { type ReactNode } from 'react';
-import { ConfigContext } from '../ConfigProvider';
 import { ErrorBoundaryTypeError } from './enums';
 export type State = {
     /**
@@ -23,14 +22,12 @@ type Props = {
  * @example <ErrorBoundary><InsecureComponent/></ErrorBoundary>
  */
 declare class ErrorBoundary extends React.Component<Props, State> {
-    static contextType: React.Context<import("../ConfigProvider").ConfigContextProps>;
-    context: React.ContextType<typeof ConfigContext>;
     state: State;
+    componentDidCatch(error: Error): void;
+    render(): React.ReactNode;
     static getDerivedStateFromError(error: Error): {
         hasError: boolean;
         typeError: ErrorBoundaryTypeError;
     };
-    componentDidCatch(error: Error): void;
-    render(): React.ReactNode;
 }
 export { ErrorBoundary };

package/node/components/ErrorBoundary/ErrorBoundary.js

@@ -6,9 +6,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ErrorBoundary = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = __importDefault(require("react"));
-const ConfigProvider_1 = require("../ConfigProvider");
 const InternalErrorPlaceholder_1 = require("../placeholders/InternalErrorPlaceholder");
 const OutdatedReleasePlaceholder_1 = require("../placeholders/OutdatedReleasePlaceholder");
+const ErrorService_1 = require("../services/ErrorService");
 const constants_1 = require("./constants");
 const enums_1 = require("./enums");
 /**
@@ -31,15 +31,8 @@ class ErrorBoundary extends react_1.default.Component {
             typeError: enums_1.ErrorBoundaryTypeError.Default,
         };
     }
-    static getDerivedStateFromError(error) {
-        return {
-            hasError: true,
-            typeError: constants_1.CONDITION_TYPE_ERROR.find(({ condition }) => condition(error))?.type ??
-                enums_1.ErrorBoundaryTypeError.Default,
-        };
-    }
     componentDidCatch(error) {
-        this.context.captureException(error);
+        ErrorService_1.ErrorService.getInstance().captureException(error);
     }
     render() {
         if (this.state.hasError) {
@@ -47,6 +40,12 @@ class ErrorBoundary extends react_1.default.Component {
         }
         return this.props.children;
     }
+    static getDerivedStateFromError(error) {
+        return {
+            hasError: true,
+            typeError: constants_1.CONDITION_TYPE_ERROR.find(({ condition }) => condition(error))?.type ??
+                enums_1.ErrorBoundaryTypeError.Default,
+        };
+    }
 }
 exports.ErrorBoundary = ErrorBoundary;
-ErrorBoundary.contextType = ConfigProvider_1.ConfigContext;

package/node/components/PageHeader/PageHeader.js

@@ -10,7 +10,7 @@ const MobilePageActions_1 = require("./MobilePageActions");
 const styles_1 = require("./styles");
 const Title_1 = require("./Title");
 const useLogic_1 = require("./useLogic");
-const mobilePageHeader = (0, cva_1.cva)(constants_1.pageHeaderClassnames.pageHeaderMobileTitle, {
+const mobilePageHeaderCva = (0, cva_1.cva)(constants_1.pageHeaderClassnames.pageHeaderMobileTitle, {
     variants: {
         hasTitle: {
             true: constants_1.pageHeaderClassnames.hasTitle,
@@ -20,12 +20,19 @@ const mobilePageHeader = (0, cva_1.cva)(constants_1.pageHeaderClassnames.pageHea
         },
     },
 });
+const rootCva = (0, cva_1.cva)(constants_1.pageHeaderClassnames.root, {
+    variants: {
+        hasActions: {
+            true: constants_1.pageHeaderClassnames.hasActions,
+        },
+    },
+});
 const PageHeader = (props) => {
     const { title, description, subheader, breadcrumbs, actions, backButton, className, filters, } = props;
     const { isLoading, mobileTitleActions, isShowMobileActions } = (0, useLogic_1.useLogic)(props);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(styles_1.MobileTitleWrapper, { className: mobilePageHeader({
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(styles_1.MobileTitleWrapper, { className: mobilePageHeaderCva({
                     hasTitle: Boolean(title) || isLoading,
                     hasBackButton: Boolean(backButton),
-                }), children: [(0, jsx_runtime_1.jsx)(Title_1.Title, { backButton: backButton, title: title, isLoading: isLoading }), mobileTitleActions && mobileTitleActions] }), (0, jsx_runtime_1.jsx)(styles_1.Wrapper, { className: (0, classNames_1.classNames)(constants_1.pageHeaderClassnames.root, className), children: (0, jsx_runtime_1.jsx)(HeaderContent_1.HeaderContent, { breadcrumbs: breadcrumbs, backButton: backButton, title: title, description: description, actions: actions, subheader: subheader, filters: filters, isLoading: isLoading }) }), isShowMobileActions && ((0, jsx_runtime_1.jsx)(MobilePageActions_1.MobilePageActions, { className: (0, classNames_1.classNames)(constants_1.pageHeaderClassnames.pageHeaderActions), isLoading: isLoading, ...actions }))] }));
+                }), children: [(0, jsx_runtime_1.jsx)(Title_1.Title, { backButton: backButton, title: title, isLoading: isLoading }), mobileTitleActions && mobileTitleActions] }), (0, jsx_runtime_1.jsx)(styles_1.Wrapper, { className: (0, classNames_1.classNames)(rootCva({ hasActions: Boolean(actions) }), className), children: (0, jsx_runtime_1.jsx)(HeaderContent_1.HeaderContent, { breadcrumbs: breadcrumbs, backButton: backButton, title: title, description: description, actions: actions, subheader: subheader, filters: filters, isLoading: isLoading }) }), isShowMobileActions && ((0, jsx_runtime_1.jsx)(MobilePageActions_1.MobilePageActions, { className: (0, classNames_1.classNames)(constants_1.pageHeaderClassnames.pageHeaderActions), isLoading: isLoading, ...actions }))] }));
 };
 exports.PageHeader = PageHeader;

package/node/components/PageHeader/constants.d.ts

@@ -9,5 +9,6 @@ export declare const pageHeaderClassnames: {
     quickFilters: string;
     hasFilters: string;
     hasSubheader: string;
+    hasActions: string;
 };
 export declare const PAGE_HEADER_HEIGHT_MOBILE = "48px";

package/node/components/PageHeader/constants.js

@@ -13,5 +13,6 @@ exports.pageHeaderClassnames = {
     quickFilters: (0, createUIKitClassname_1.createUIKitClassname)('page-header__quick-filters'),
     hasFilters: (0, createUIKitClassname_1.createUIKitClassname)('page-header_has-filters'),
     hasSubheader: (0, createUIKitClassname_1.createUIKitClassname)('page-header_has-subheader'),
+    hasActions: (0, createUIKitClassname_1.createUIKitClassname)('page-header_has-actions'),
 };
 exports.PAGE_HEADER_HEIGHT_MOBILE = '48px';

package/node/components/PageHeader/styles.js

@@ -15,6 +15,10 @@ exports.Wrapper = styled_1.styled.header `
 
   ${({ theme }) => theme.breakpoints.down('laptop')} {
     padding: ${({ theme }) => theme.spacing(0, 4)};
+
+    &.${constants_1.pageHeaderClassnames.hasActions} {
+      grid-template-columns: min-content 1fr auto auto;
+    }
   }
 
   ${({ theme }) => theme.breakpoints.down('sm')} {

package/node/components/ProductSwitcher/useLogic/useLogic.js

@@ -2,13 +2,12 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useLogic = void 0;
 const react_1 = require("react");
-const ConfigProvider_1 = require("../../ConfigProvider");
+const ErrorService_1 = require("../../services/ErrorService");
 const useMenu_1 = require("../../useMenu");
 const useLogic = ({ getProducts, filter }) => {
     const [products, setProducts] = (0, react_1.useState)([]);
     const [isLoading, setIsLoading] = (0, react_1.useState)(false);
     const [isError, setIsError] = (0, react_1.useState)(false);
-    const { captureException } = (0, react_1.useContext)(ConfigProvider_1.ConfigContext);
     const { open, anchorRef, handleOpenMenu, handleCloseMenu } = (0, useMenu_1.useMenu)();
     const filterProductList = (productList) => {
         const { hostname } = new URL(window.origin);
@@ -35,7 +34,9 @@ const useLogic = ({ getProducts, filter }) => {
         }
         catch (error) {
             setIsError(true);
-            captureException(error);
+            ErrorService_1.ErrorService.getInstance().captureException(error, {
+                place: 'ProductSwitcher',
+            });
         }
         finally {
             setIsLoading(false);

package/node/components/fileUploading/FileUploaderFile/Actions/useLogic/useLogic.js

@@ -1,14 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useLogic = void 0;
-const react_1 = require("react");
-const ConfigProvider_1 = require("../../../../ConfigProvider");
+const ErrorService_1 = require("../../../../services/ErrorService");
 const constants_1 = require("../../../constants");
 const useGenerateLocalFileURL_1 = require("../../../hooks/useGenerateLocalFileURL");
 const MimeTypeRegistry_1 = require("../../../services/MimeTypeRegistry");
 const generateAttrLinkNewTab_1 = require("../../../utils/generateAttrLinkNewTab");
 const useLogic = ({ fileId, file, fileUrl, isUploadError, generateDownloadLink, onDelete, onRetry, onView, setErrorStatusFile, selfFiles, isLoading, isError, isDeletingFile, fileName, }) => {
-    const { captureException } = (0, react_1.useContext)(ConfigProvider_1.ConfigContext);
     const { generateUrl } = (0, useGenerateLocalFileURL_1.useGenerateLocalFileURL)();
     const { controller } = selfFiles[fileId] || {};
     const isVisibleAbortButton = Boolean(controller);
@@ -58,7 +56,7 @@ const useLogic = ({ fileId, file, fileUrl, isUploadError, generateDownloadLink,
             onClick: () => {
                 // biome-ignore lint/suspicious/noConsole: Ошибка для интеграторов
                 console.warn(constants_1.VIEW_NEW_TAB_ERROR_MESSAGE);
-                captureException(`FileId: ${fileId}: ${constants_1.VIEW_NEW_TAB_ERROR_MESSAGE}`);
+                ErrorService_1.ErrorService.getInstance().captureCustomError('FileUploader', `FileId: ${fileId}: ${constants_1.VIEW_NEW_TAB_ERROR_MESSAGE}`);
             },
         };
     };

package/node/components/fileUploading/PreviewFileUploaderFile/FilePreview/useLogic/useLogic.js

@@ -1,14 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useLogic = void 0;
-const react_1 = require("react");
-const ConfigProvider_1 = require("../../../../ConfigProvider");
+const ErrorService_1 = require("../../../../services/ErrorService");
 const constants_1 = require("../../../constants");
 const useGenerateLocalFileURL_1 = require("../../../hooks/useGenerateLocalFileURL");
 const MimeTypeRegistry_1 = require("../../../services/MimeTypeRegistry");
 const generateAttrLinkNewTab_1 = require("../../../utils/generateAttrLinkNewTab");
 const useLogic = ({ fileId, file, fileUrl, generateDownloadLink, onDelete, onView, fileType, }) => {
-    const { captureException } = (0, react_1.useContext)(ConfigProvider_1.ConfigContext);
     const { generateUrl } = (0, useGenerateLocalFileURL_1.useGenerateLocalFileURL)();
     const isPdfFile = MimeTypeRegistry_1.MimeTypeRegistry.getInstance()
         .getExtensionsByMimeType((file?.type || fileType))
@@ -51,7 +49,7 @@ const useLogic = ({ fileId, file, fileUrl, generateDownloadLink, onDelete, onVie
             onClick: () => {
                 // biome-ignore lint/suspicious/noConsole: Ошибка для интеграторов
                 console.warn(constants_1.VIEW_NEW_TAB_ERROR_MESSAGE);
-                captureException(`FileId: ${fileId}: ${constants_1.VIEW_NEW_TAB_ERROR_MESSAGE}`);
+                ErrorService_1.ErrorService.getInstance().captureCustomError('PreviewFileUploader', `FileId: ${fileId}: ${constants_1.VIEW_NEW_TAB_ERROR_MESSAGE}`);
             },
         };
     };

package/node/components/services/ErrorService/ErrorService.d.ts

@@ -1,3 +1,13 @@
+export type CaptureException = (error: unknown, data?: {
+    extra?: Record<string, unknown>;
+}) => void;
+type ErrorExtra = {
+    /**
+     * Место, где произошла ошибка. Например, название компонента
+     */
+    place: string;
+    [key: string]: unknown;
+};
 /**
  * Занимается логированием ошибок и отправкой их в sentry
  */
@@ -6,12 +16,14 @@ export declare class ErrorService {
     private static instance;
     private _captureException?;
     private constructor();
-    init(captureException: (error: Error) => void): void;
-    captureException: (error: Error) => void;
+    init(captureException: CaptureException): void;
+    captureException: (error: unknown, extra?: ErrorExtra) => void;
+    captureCustomError: (place: string, message: string) => void;
     /**
      * Логирует ошибку в консоль и отправляет в sentry
      * */
-    logError: (componentName: string, message: string) => void;
+    logError: (place: string, message: string) => void;
     static getInstance(): ErrorService;
     private createError;
 }
+export {};

package/node/components/services/ErrorService/ErrorService.js

@@ -7,16 +7,19 @@ exports.ErrorService = void 0;
 class ErrorService {
     constructor(logger) {
         this.logger = logger;
-        this.captureException = (error) => {
+        this.captureException = (error, extra) => {
             if (this._captureException) {
-                this._captureException(error);
+                this._captureException(error, extra ? { extra } : undefined);
             }
         };
+        this.captureCustomError = (place, message) => {
+            this.captureException(this.createError(place, message));
+        };
         /**
          * Логирует ошибку в консоль и отправляет в sentry
          * */
-        this.logError = (componentName, message) => {
-            const error = this.createError(componentName, message);
+        this.logError = (place, message) => {
+            const error = this.createError(place, message);
             this.logger.error(error);
             this.captureException(error);
         };

package/node/hook-form/useFormWizard/useFormWizard.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useFormWizard = void 0;
 const react_1 = require("react");
-const ConfigProvider_1 = require("../../components/ConfigProvider");
+const ErrorService_1 = require("../../components/services/ErrorService");
 const useForm_1 = require("../useForm");
 const useFormWatchFields_1 = require("../useFormWatchFields");
 const constants_1 = require("./constants");
@@ -23,7 +23,6 @@ const utils_1 = require("./utils");
  * <FormWizard {...formWizardProps} />
  */
 const useFormWizard = ({ initialStepId, defaultValues, isDisabled, steps, autoSaveStrategy, onChangeStep, onAutoSave, onSubmit, onAutoSaveError, }) => {
-    const { captureException } = (0, react_1.useContext)(ConfigProvider_1.ConfigContext);
     const calculateInitialVisibleSteps = () => steps.filter(({ shouldSkip }) => shouldSkip?.calculate
         ? !shouldSkip.calculate(defaultValues)
         : true);
@@ -98,7 +97,11 @@ const useFormWizard = ({ initialStepId, defaultValues, isDisabled, steps, autoSa
                 setCurrentStepId(nextStepId);
             })
                 .catch((error) => {
-                captureException(error);
+                ErrorService_1.ErrorService.getInstance().captureException(error, {
+                    place: 'useFormWizard',
+                    currentStepId,
+                    nextStepId,
+                });
             });
         }
         setCurrentStepId(nextStepId);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@astral/ui",
-  "version": "4.55.2",
+  "version": "4.55.4",
   "browser": "./index.js",
   "main": "./node/index.js",
   "dependencies": {