@astral/ui 4.77.0 → 4.78.0

package/components/Avatar/styles.js

@@ -1,4 +1,4 @@
-import Avatar from '@mui/material/Avatar';
+import Avatar, { avatarClasses } from '@mui/material/Avatar';
 import { styled } from '../styled/styled';
 const getFont = (size) => {
     if (size === 'sm') {
@@ -14,4 +14,8 @@ export const StyledAvatar = styled(Avatar, {
 }) `
   font-size: ${({ theme, $size }) => theme.typography[getFont($size)].fontSize};
   font-weight: ${({ theme, $size }) => theme.typography[getFont($size)].fontWeight};
+
+  & .${avatarClasses.img} {
+    background-color: ${({ theme }) => theme.palette.grey[200]};
+  }
 `;

package/components/fileUploading/FileUploader/public.d.ts

@@ -1,3 +1,3 @@
 export { fileUploaderClassnames } from '../constants';
-export type { FileId, FileUploaderNotify, FileUploaderProps, RestrictionFn, RestrictionFnResult, UploadedFileData, UploadFile, } from '../types';
+export type { FileId, FileUploaderMetaInfo, FileUploaderNotify, FileUploaderProps, RestrictionFn, RestrictionFnResult, UploadedFileData, UploadFile, } from '../types';
 export { FileUploader } from './FileUploader';

package/components/fileUploading/hooks/useFileUploader/useFileUploader.js

@@ -57,7 +57,7 @@ inputRef, notify, onChange, onUploadFile, onDeleteFile, name, isError, onView, g
         onUploadFile,
         getErrorMessage,
     });
-    const handleChange = (event) => {
+    const handleChange = (event, metaInfo) => {
         // Преобразуем к массиву и удаляем дубликаты
         const droppedFiles = Array.from(event.target.files || []).filter((droppedFile) => !files.find((file) => compareFile(droppedFile, file)));
         const addedFiles = droppedFiles
@@ -78,22 +78,25 @@ inputRef, notify, onChange, onUploadFile, onDeleteFile, name, isError, onView, g
             ];
         }, []);
         if (isMultiple) {
-            onChange([...files, ...addedFiles]);
+            onChange([...files, ...addedFiles], metaInfo);
         }
         else if (addedFiles.length) {
-            onChange(addedFiles[0]);
+            onChange(addedFiles[0], metaInfo);
         }
         if (addedFiles.length < droppedFiles.length) {
             notifyWarning(addedFiles.length, droppedFiles.length);
         }
-        enqueueFiles(addedFiles);
+        enqueueFiles(addedFiles, metaInfo);
+    };
+    const handleFileInputChange = (event) => {
+        handleChange(event, { inputSourceType: 'fileInput' });
     };
     const { isDragActive, ...dropZoneActions } = useDnD({
         isDisabled,
         onChange: (droppedFiles) => {
             handleChange({
                 target: { files: droppedFiles },
-            });
+            }, { inputSourceType: 'dragAndDrop' });
         },
     });
     const handleDelete = (fileId) => {
@@ -142,7 +145,7 @@ inputRef, notify, onChange, onUploadFile, onDeleteFile, name, isError, onView, g
                 accept: accept.join(),
                 ref: inputRef,
                 value: '',
-                onChange: handleChange,
+                onChange: handleFileInputChange,
                 name,
                 isMultiple,
                 isDisabled,

package/components/fileUploading/hooks/useSyncFiles/useSyncFiles.d.ts

@@ -1,4 +1,8 @@
+import { type RefObject } from 'react';
 import type { FileId, SpecificSelfFileParams, UploadFile } from '../../types';
+type ChangeMetaInfo = {
+    inputSourceType?: 'fileInput' | 'dragAndDrop';
+};
 type UseSyncFilesParams<TMultiple extends boolean = false> = {
     /**
      * Список файлов, которые приходят как value в компонент
@@ -15,7 +19,11 @@ type UseSyncFilesParams<TMultiple extends boolean = false> = {
     /**
      * Функция, вызываемая при изменении списка файлов
      */
-    onChange: TMultiple extends true ? (value: UploadFile[]) => void : (value: UploadFile | null) => void;
+    onChange: TMultiple extends true ? (value: UploadFile[], metaInfo?: ChangeMetaInfo) => void : (value: UploadFile | null, metaInfo?: ChangeMetaInfo) => void;
+    /**
+     * Ref с metaInfo последнего пользовательского действия
+     */
+    metaInfoRef: RefObject<ChangeMetaInfo | undefined>;
 };
 export declare const useSyncFiles: <TMultiple extends boolean>(props: UseSyncFilesParams<TMultiple>) => void;
 export {};

package/components/fileUploading/hooks/useSyncFiles/useSyncFiles.js

@@ -1,14 +1,14 @@
 import { useEffect } from 'react';
 import { isEmpty } from '../../../utils/isEmpty';
 export const useSyncFiles = (props) => {
-    const { isMultiple, files, selfFiles } = props;
+    const { isMultiple, files, selfFiles, metaInfoRef } = props;
     const handleSingleFileChange = (updatedFiles) => {
         const { onChange } = props;
-        onChange(updatedFiles.length > 0 ? updatedFiles[0] : null);
+        onChange(updatedFiles.length > 0 ? updatedFiles[0] : null, metaInfoRef.current);
     };
     const handleMultipleFileChange = (updatedFiles) => {
         const { onChange } = props;
-        onChange(updatedFiles);
+        onChange(updatedFiles, metaInfoRef.current);
     };
     useEffect(() => {
         if (isEmpty(selfFiles)) {

package/components/fileUploading/hooks/useUploadFiles/useUploadFiles.d.ts

@@ -1,4 +1,7 @@
 import type { FileId, UploadedFileData, UploadFile } from '../../types';
+type ChangeMetaInfo = {
+    inputSourceType?: 'fileInput' | 'dragAndDrop';
+};
 type UseUploadFilesParams = {
     /**
      * Список файлов, которые приходят как value в компонент
@@ -11,7 +14,7 @@ type UseUploadFilesParams = {
     /**
      * Функция, вызываемая при изменении списка файлов
      */
-    onChange: ((value: UploadFile[]) => void) | ((value: UploadFile | null) => void);
+    onChange: ((value: UploadFile[], metaInfo?: ChangeMetaInfo) => void) | ((value: UploadFile | null, metaInfo?: ChangeMetaInfo) => void);
     /**
      * Функция загрузки файлов на сервер
      * @param fileId - Идентификатор файла
@@ -31,7 +34,7 @@ type UseUploadFilesParams = {
     getErrorMessage?: (fileId: FileId, error: Error) => string;
 };
 export declare const useUploadFiles: ({ isMultiple, files: externalFiles, onChange, onUploadFile, getErrorMessage, }: UseUploadFilesParams) => {
-    enqueueFiles: (files: UploadFile[]) => void;
+    enqueueFiles: (files: UploadFile[], metaInfo?: ChangeMetaInfo) => void;
     refetchFile: (fileToSend: UploadFile) => void;
     selfFiles: Record<string, UploadFile & import("../../types").SpecificSelfFileParams>;
     setErrorStatusFile: (fileId: string, errorMsg: string) => void;

package/components/fileUploading/hooks/useUploadFiles/useUploadFiles.js

@@ -1,13 +1,23 @@
-import { useEffect, useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import { ABORT_ERROR_CODE, UPLOAD_ERROR_MESSAGE } from '../../constants';
 import { useSelfFiles } from '../useSelfFiles';
 import { useSyncFiles } from '../useSyncFiles';
 export const useUploadFiles = ({ isMultiple, files: externalFiles, onChange, onUploadFile, getErrorMessage, }) => {
     const [fileQueue, setFileQueue] = useState([]);
+    // Хранит metaInfo последнего пользовательского действия,
+    // чтобы передавать его в onChange при синхронизации статусов загрузки
+    const metaInfoRef = useRef(undefined);
     const { selfFiles, setLoadingStatusFile, setSuccessStatusFile, setErrorStatusFile, updateFileInfo, } = useSelfFiles();
     // При изменении статусов обновляем внешнее состояние
-    useSyncFiles({ isMultiple, files: externalFiles, selfFiles, onChange });
-    const enqueueFiles = (files) => {
+    useSyncFiles({
+        isMultiple,
+        files: externalFiles,
+        selfFiles,
+        onChange,
+        metaInfoRef,
+    });
+    const enqueueFiles = (files, metaInfo) => {
+        metaInfoRef.current = metaInfo;
         const acceptedFiles = files.filter(({ status }) => !status?.isRestrictionError);
         setFileQueue(acceptedFiles);
     };

package/components/fileUploading/types.d.ts

@@ -6,6 +6,12 @@ export type RestrictionFnResult = {
 };
 export type RestrictionFn = (value: File) => RestrictionFnResult | undefined;
 export type FileId = string;
+export type FileUploaderMetaInfo = {
+    /**
+     * Способ загрузки файла (fileInput или dragAndDrop)
+     */
+    inputSourceType?: 'fileInput' | 'dragAndDrop';
+};
 /**
  * Расширенная информация о переданном accept
  */
@@ -231,6 +237,7 @@ type SingleFileUploaderProps = {
     /**
      * Функция, вызываемая при изменении списка файлов (добавление/удаление)
      * @param value - Объект загруженного файла или null при удалении
+     * @param metaInfo.inputSourceType - Способ загрузки файла (fileInput или dragAndDrop)
      * @remarks
      * Вызывается в следующих случаях:
      * - При добавлении нового файла через диалог выбора или drag-n-drop
@@ -238,7 +245,7 @@ type SingleFileUploaderProps = {
      * - При изменении статуса загрузки файла (loading/success/error)
      * - При обновлении информации о файле после успешной загрузки
      */
-    onChange: (value: UploadFile | null) => void;
+    onChange: (value: UploadFile | null, metaInfo?: FileUploaderMetaInfo) => void;
 } & BaseFileUploaderProps;
 type MultipleFileUploaderProps = {
     value: UploadFile[];
@@ -253,6 +260,7 @@ type MultipleFileUploaderProps = {
     /**
      * Функция, вызываемая при изменении списка файлов (добавление/удаление)
      * @param value - Массив объектов загруженных файлов
+     * @param metaInfo.inputSourceType - Способ загрузки файла (fileInput или dragAndDrop)
      * @remarks
      * Вызывается в следующих случаях:
      * - При добавлении новых файлов через диалог выбора или drag-n-drop
@@ -260,7 +268,7 @@ type MultipleFileUploaderProps = {
      * - При изменении статуса загрузки файла (loading/success/error)
      * - При обновлении информации о файле после успешной загрузки
      */
-    onChange: (value: UploadFile[]) => void;
+    onChange: (value: UploadFile[], metaInfo?: FileUploaderMetaInfo) => void;
 } & BaseFileUploaderProps;
 export type FileUploaderProps = MultipleFileUploaderProps | SingleFileUploaderProps;
 export type SpecificSelfFileParams = {

package/hook-form/FormFileUploader/FormFileUploader.d.ts

@@ -1,7 +1,10 @@
 /// <reference types="react" />
-import { type FileUploaderNotify, type FileUploaderProps, type UploadFile } from '../../components/fileUploading/FileUploader';
+import { type FileUploaderMetaInfo, type FileUploaderNotify, type FileUploaderProps, type UploadFile } from '../../components/fileUploading/FileUploader';
 import { type WithFormFieldProps } from '../types';
-type BaseFileUploaderProps = Omit<FileUploaderProps, 'value' | 'isMultiple' | 'maxFileCount' | 'notify' | 'onChange'>;
+export type FormFileUploaderMetaInfo = FileUploaderMetaInfo;
+type BaseFileUploaderProps = Omit<FileUploaderProps, 'value' | 'isMultiple' | 'maxFileCount' | 'notify' | 'onChange'> & {
+    onChange?: (value: FormFileUploaderValue | FormFileUploaderValue[], metaInfo?: FormFileUploaderMetaInfo) => void;
+};
 type SingleFileUploaderProps = {
     isMultiple?: false;
     maxFileCount?: never;

package/hook-form/FormFileUploader/FormFileUploader.js

@@ -5,11 +5,16 @@ import { useFormFieldProps } from '../useFormFieldProps';
 /**
  * FileUploader для формы
  */
-const FormFileUploaderInner = (props, ref) => {
-    const { error, ...fieldProps } = useFormFieldProps(props);
+const FormFileUploaderInner = ({ onChange: propsOnChange, ...props }, ref) => {
+    const { error, onChange, ...fieldProps } = useFormFieldProps(props);
+    const handleChange = (value, metaInfo) => {
+        onChange(value);
+        propsOnChange?.(value, metaInfo);
+    };
+    return (
     // biome-ignore lint/suspicious/noTsIgnore:  Ошибка типизации при пробросе пропсов: isMultiple
     // @ts-ignore
     // TODO https://track.astral.ru/soft/browse/UIKIT-1926
-    return _jsx(FileUploader, { isError: error, ...fieldProps, ref: ref });
+    _jsx(FileUploader, { isError: error, onChange: handleChange, ...fieldProps, ref: ref }));
 };
 export const FormFileUploader = forwardRefWithGeneric(FormFileUploaderInner);

package/hook-form/FormPageLayoutBase/styles.js

@@ -25,12 +25,16 @@ export const StyledPageContent = styled(PageContent) `
 
   border-top: 1px solid ${({ theme }) => theme.palette.grey[300]};
 
-  .${pageContentClassnames.content} {
-    ${({ theme }) => theme.breakpoints.up('sm')} {
+  ${({ theme }) => theme.breakpoints.up('sm')} {
+    .${pageContentClassnames.content} {
       overflow: unset;
 
       height: auto;
       padding: 0;
+
+      &.${pageContentClassnames.contentHasHeader}, &.${pageContentClassnames.hasAside} {
+        padding: 0;
+      }
     }
   }
 

package/hook-form/FormPreviewFileUploader/FormPreviewFileUploader.d.ts

@@ -1,9 +1,16 @@
 import type { ForwardedRef } from 'react';
 import { type PreviewFileUploaderProps } from '../../components/fileUploading/PreviewFileUploader';
+import { type FileUploaderMetaInfo, type UploadFile } from '../../components/fileUploading/types';
 import { type WithFormFieldProps } from '../types';
-export type FormPreviewFileUploaderProps<TFieldValues extends object> = WithFormFieldProps<Omit<PreviewFileUploaderProps, 'value' | 'onChange'>, TFieldValues>;
+export type FormPreviewFileUploaderValue = UploadFile;
+export type FormPreviewFileUploaderMetaInfo = FileUploaderMetaInfo;
+export type FormPreviewFileUploaderProps<TFieldValues extends object> = WithFormFieldProps<Omit<PreviewFileUploaderProps, 'value' | 'onChange'>, TFieldValues> & {
+    onChange?: (value: FormPreviewFileUploaderValue | null, metaInfo?: FormPreviewFileUploaderMetaInfo) => void;
+};
 /**
  * PreviewFileUploader для формы
  */
-export declare const FormPreviewFileUploaderInner: <TFieldValues extends object>(props: FormPreviewFileUploaderProps<TFieldValues>, ref: ForwardedRef<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-export declare const FormPreviewFileUploader: <TFieldValues extends object>(props: Omit<Omit<import("../..").UsePreviewFileUploaderParams, "onChange" | "value">, "error" | "name"> & Omit<import("react-hook-form").UseControllerProps<TFieldValues>, "rules"> & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | null;
+export declare const FormPreviewFileUploaderInner: <TFieldValues extends object>({ onChange: propsOnChange, ...props }: FormPreviewFileUploaderProps<TFieldValues>, ref: ForwardedRef<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
+export declare const FormPreviewFileUploader: <TFieldValues extends object>(props: Omit<Omit<import("../..").UsePreviewFileUploaderParams, "onChange" | "value">, "error" | "name"> & Omit<import("react-hook-form").UseControllerProps<TFieldValues>, "rules"> & {
+    onChange?: ((value: FormPreviewFileUploaderValue | null, metaInfo?: FormPreviewFileUploaderMetaInfo) => void) | undefined;
+} & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | null;

package/hook-form/FormPreviewFileUploader/FormPreviewFileUploader.js

@@ -5,8 +5,12 @@ import { useFormFieldProps } from '../useFormFieldProps';
 /**
  * PreviewFileUploader для формы
  */
-export const FormPreviewFileUploaderInner = (props, ref) => {
-    const { error, ...fieldProps } = useFormFieldProps(props);
-    return _jsx(PreviewFileUploader, { isError: error, ...fieldProps, ref: ref });
+export const FormPreviewFileUploaderInner = ({ onChange: propsOnChange, ...props }, ref) => {
+    const { error, onChange, ...fieldProps } = useFormFieldProps(props);
+    const handleChange = (value, metaInfo) => {
+        onChange(value);
+        propsOnChange?.(value, metaInfo);
+    };
+    return (_jsx(PreviewFileUploader, { isError: error, onChange: handleChange, ...fieldProps, ref: ref }));
 };
 export const FormPreviewFileUploader = forwardRefWithGeneric(FormPreviewFileUploaderInner);

package/node/components/Avatar/styles.js

@@ -1,10 +1,30 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.StyledAvatar = void 0;
-const Avatar_1 = __importDefault(require("@mui/material/Avatar"));
+const Avatar_1 = __importStar(require("@mui/material/Avatar"));
 const styled_1 = require("../styled/styled");
 const getFont = (size) => {
     if (size === 'sm') {
@@ -20,4 +40,8 @@ exports.StyledAvatar = (0, styled_1.styled)(Avatar_1.default, {
 }) `
   font-size: ${({ theme, $size }) => theme.typography[getFont($size)].fontSize};
   font-weight: ${({ theme, $size }) => theme.typography[getFont($size)].fontWeight};
+
+  & .${Avatar_1.avatarClasses.img} {
+    background-color: ${({ theme }) => theme.palette.grey[200]};
+  }
 `;

package/node/components/fileUploading/FileUploader/public.d.ts

@@ -1,3 +1,3 @@
 export { fileUploaderClassnames } from '../constants';
-export type { FileId, FileUploaderNotify, FileUploaderProps, RestrictionFn, RestrictionFnResult, UploadedFileData, UploadFile, } from '../types';
+export type { FileId, FileUploaderMetaInfo, FileUploaderNotify, FileUploaderProps, RestrictionFn, RestrictionFnResult, UploadedFileData, UploadFile, } from '../types';
 export { FileUploader } from './FileUploader';

package/node/components/fileUploading/hooks/useFileUploader/useFileUploader.js

@@ -60,7 +60,7 @@ inputRef, notify, onChange, onUploadFile, onDeleteFile, name, isError, onView, g
         onUploadFile,
         getErrorMessage,
     });
-    const handleChange = (event) => {
+    const handleChange = (event, metaInfo) => {
         // Преобразуем к массиву и удаляем дубликаты
         const droppedFiles = Array.from(event.target.files || []).filter((droppedFile) => !files.find((file) => (0, compareFile_1.compareFile)(droppedFile, file)));
         const addedFiles = droppedFiles
@@ -81,22 +81,25 @@ inputRef, notify, onChange, onUploadFile, onDeleteFile, name, isError, onView, g
             ];
         }, []);
         if (isMultiple) {
-            onChange([...files, ...addedFiles]);
+            onChange([...files, ...addedFiles], metaInfo);
         }
         else if (addedFiles.length) {
-            onChange(addedFiles[0]);
+            onChange(addedFiles[0], metaInfo);
         }
         if (addedFiles.length < droppedFiles.length) {
             notifyWarning(addedFiles.length, droppedFiles.length);
         }
-        enqueueFiles(addedFiles);
+        enqueueFiles(addedFiles, metaInfo);
+    };
+    const handleFileInputChange = (event) => {
+        handleChange(event, { inputSourceType: 'fileInput' });
     };
     const { isDragActive, ...dropZoneActions } = (0, useDnD_1.useDnD)({
         isDisabled,
         onChange: (droppedFiles) => {
             handleChange({
                 target: { files: droppedFiles },
-            });
+            }, { inputSourceType: 'dragAndDrop' });
         },
     });
     const handleDelete = (fileId) => {
@@ -145,7 +148,7 @@ inputRef, notify, onChange, onUploadFile, onDeleteFile, name, isError, onView, g
                 accept: accept.join(),
                 ref: inputRef,
                 value: '',
-                onChange: handleChange,
+                onChange: handleFileInputChange,
                 name,
                 isMultiple,
                 isDisabled,

package/node/components/fileUploading/hooks/useSyncFiles/useSyncFiles.d.ts

@@ -1,4 +1,8 @@
+import { type RefObject } from 'react';
 import type { FileId, SpecificSelfFileParams, UploadFile } from '../../types';
+type ChangeMetaInfo = {
+    inputSourceType?: 'fileInput' | 'dragAndDrop';
+};
 type UseSyncFilesParams<TMultiple extends boolean = false> = {
     /**
      * Список файлов, которые приходят как value в компонент
@@ -15,7 +19,11 @@ type UseSyncFilesParams<TMultiple extends boolean = false> = {
     /**
      * Функция, вызываемая при изменении списка файлов
      */
-    onChange: TMultiple extends true ? (value: UploadFile[]) => void : (value: UploadFile | null) => void;
+    onChange: TMultiple extends true ? (value: UploadFile[], metaInfo?: ChangeMetaInfo) => void : (value: UploadFile | null, metaInfo?: ChangeMetaInfo) => void;
+    /**
+     * Ref с metaInfo последнего пользовательского действия
+     */
+    metaInfoRef: RefObject<ChangeMetaInfo | undefined>;
 };
 export declare const useSyncFiles: <TMultiple extends boolean>(props: UseSyncFilesParams<TMultiple>) => void;
 export {};

package/node/components/fileUploading/hooks/useSyncFiles/useSyncFiles.js

@@ -4,14 +4,14 @@ exports.useSyncFiles = void 0;
 const react_1 = require("react");
 const isEmpty_1 = require("../../../utils/isEmpty");
 const useSyncFiles = (props) => {
-    const { isMultiple, files, selfFiles } = props;
+    const { isMultiple, files, selfFiles, metaInfoRef } = props;
     const handleSingleFileChange = (updatedFiles) => {
         const { onChange } = props;
-        onChange(updatedFiles.length > 0 ? updatedFiles[0] : null);
+        onChange(updatedFiles.length > 0 ? updatedFiles[0] : null, metaInfoRef.current);
     };
     const handleMultipleFileChange = (updatedFiles) => {
         const { onChange } = props;
-        onChange(updatedFiles);
+        onChange(updatedFiles, metaInfoRef.current);
     };
     (0, react_1.useEffect)(() => {
         if ((0, isEmpty_1.isEmpty)(selfFiles)) {

package/node/components/fileUploading/hooks/useUploadFiles/useUploadFiles.d.ts

@@ -1,4 +1,7 @@
 import type { FileId, UploadedFileData, UploadFile } from '../../types';
+type ChangeMetaInfo = {
+    inputSourceType?: 'fileInput' | 'dragAndDrop';
+};
 type UseUploadFilesParams = {
     /**
      * Список файлов, которые приходят как value в компонент
@@ -11,7 +14,7 @@ type UseUploadFilesParams = {
     /**
      * Функция, вызываемая при изменении списка файлов
      */
-    onChange: ((value: UploadFile[]) => void) | ((value: UploadFile | null) => void);
+    onChange: ((value: UploadFile[], metaInfo?: ChangeMetaInfo) => void) | ((value: UploadFile | null, metaInfo?: ChangeMetaInfo) => void);
     /**
      * Функция загрузки файлов на сервер
      * @param fileId - Идентификатор файла
@@ -31,7 +34,7 @@ type UseUploadFilesParams = {
     getErrorMessage?: (fileId: FileId, error: Error) => string;
 };
 export declare const useUploadFiles: ({ isMultiple, files: externalFiles, onChange, onUploadFile, getErrorMessage, }: UseUploadFilesParams) => {
-    enqueueFiles: (files: UploadFile[]) => void;
+    enqueueFiles: (files: UploadFile[], metaInfo?: ChangeMetaInfo) => void;
     refetchFile: (fileToSend: UploadFile) => void;
     selfFiles: Record<string, UploadFile & import("../../types").SpecificSelfFileParams>;
     setErrorStatusFile: (fileId: string, errorMsg: string) => void;

package/node/components/fileUploading/hooks/useUploadFiles/useUploadFiles.js

@@ -7,10 +7,20 @@ const useSelfFiles_1 = require("../useSelfFiles");
 const useSyncFiles_1 = require("../useSyncFiles");
 const useUploadFiles = ({ isMultiple, files: externalFiles, onChange, onUploadFile, getErrorMessage, }) => {
     const [fileQueue, setFileQueue] = (0, react_1.useState)([]);
+    // Хранит metaInfo последнего пользовательского действия,
+    // чтобы передавать его в onChange при синхронизации статусов загрузки
+    const metaInfoRef = (0, react_1.useRef)(undefined);
     const { selfFiles, setLoadingStatusFile, setSuccessStatusFile, setErrorStatusFile, updateFileInfo, } = (0, useSelfFiles_1.useSelfFiles)();
     // При изменении статусов обновляем внешнее состояние
-    (0, useSyncFiles_1.useSyncFiles)({ isMultiple, files: externalFiles, selfFiles, onChange });
-    const enqueueFiles = (files) => {
+    (0, useSyncFiles_1.useSyncFiles)({
+        isMultiple,
+        files: externalFiles,
+        selfFiles,
+        onChange,
+        metaInfoRef,
+    });
+    const enqueueFiles = (files, metaInfo) => {
+        metaInfoRef.current = metaInfo;
         const acceptedFiles = files.filter(({ status }) => !status?.isRestrictionError);
         setFileQueue(acceptedFiles);
     };

package/node/components/fileUploading/types.d.ts

@@ -6,6 +6,12 @@ export type RestrictionFnResult = {
 };
 export type RestrictionFn = (value: File) => RestrictionFnResult | undefined;
 export type FileId = string;
+export type FileUploaderMetaInfo = {
+    /**
+     * Способ загрузки файла (fileInput или dragAndDrop)
+     */
+    inputSourceType?: 'fileInput' | 'dragAndDrop';
+};
 /**
  * Расширенная информация о переданном accept
  */
@@ -231,6 +237,7 @@ type SingleFileUploaderProps = {
     /**
      * Функция, вызываемая при изменении списка файлов (добавление/удаление)
      * @param value - Объект загруженного файла или null при удалении
+     * @param metaInfo.inputSourceType - Способ загрузки файла (fileInput или dragAndDrop)
      * @remarks
      * Вызывается в следующих случаях:
      * - При добавлении нового файла через диалог выбора или drag-n-drop
@@ -238,7 +245,7 @@ type SingleFileUploaderProps = {
      * - При изменении статуса загрузки файла (loading/success/error)
      * - При обновлении информации о файле после успешной загрузки
      */
-    onChange: (value: UploadFile | null) => void;
+    onChange: (value: UploadFile | null, metaInfo?: FileUploaderMetaInfo) => void;
 } & BaseFileUploaderProps;
 type MultipleFileUploaderProps = {
     value: UploadFile[];
@@ -253,6 +260,7 @@ type MultipleFileUploaderProps = {
     /**
      * Функция, вызываемая при изменении списка файлов (добавление/удаление)
      * @param value - Массив объектов загруженных файлов
+     * @param metaInfo.inputSourceType - Способ загрузки файла (fileInput или dragAndDrop)
      * @remarks
      * Вызывается в следующих случаях:
      * - При добавлении новых файлов через диалог выбора или drag-n-drop
@@ -260,7 +268,7 @@ type MultipleFileUploaderProps = {
      * - При изменении статуса загрузки файла (loading/success/error)
      * - При обновлении информации о файле после успешной загрузки
      */
-    onChange: (value: UploadFile[]) => void;
+    onChange: (value: UploadFile[], metaInfo?: FileUploaderMetaInfo) => void;
 } & BaseFileUploaderProps;
 export type FileUploaderProps = MultipleFileUploaderProps | SingleFileUploaderProps;
 export type SpecificSelfFileParams = {

package/node/hook-form/FormFileUploader/FormFileUploader.d.ts

@@ -1,7 +1,10 @@
 /// <reference types="react" />
-import { type FileUploaderNotify, type FileUploaderProps, type UploadFile } from '../../components/fileUploading/FileUploader';
+import { type FileUploaderMetaInfo, type FileUploaderNotify, type FileUploaderProps, type UploadFile } from '../../components/fileUploading/FileUploader';
 import { type WithFormFieldProps } from '../types';
-type BaseFileUploaderProps = Omit<FileUploaderProps, 'value' | 'isMultiple' | 'maxFileCount' | 'notify' | 'onChange'>;
+export type FormFileUploaderMetaInfo = FileUploaderMetaInfo;
+type BaseFileUploaderProps = Omit<FileUploaderProps, 'value' | 'isMultiple' | 'maxFileCount' | 'notify' | 'onChange'> & {
+    onChange?: (value: FormFileUploaderValue | FormFileUploaderValue[], metaInfo?: FormFileUploaderMetaInfo) => void;
+};
 type SingleFileUploaderProps = {
     isMultiple?: false;
     maxFileCount?: never;

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

@@ -8,11 +8,16 @@ const useFormFieldProps_1 = require("../useFormFieldProps");
 /**
  * FileUploader для формы
  */
-const FormFileUploaderInner = (props, ref) => {
-    const { error, ...fieldProps } = (0, useFormFieldProps_1.useFormFieldProps)(props);
+const FormFileUploaderInner = ({ onChange: propsOnChange, ...props }, ref) => {
+    const { error, onChange, ...fieldProps } = (0, useFormFieldProps_1.useFormFieldProps)(props);
+    const handleChange = (value, metaInfo) => {
+        onChange(value);
+        propsOnChange?.(value, metaInfo);
+    };
+    return (
     // biome-ignore lint/suspicious/noTsIgnore:  Ошибка типизации при пробросе пропсов: isMultiple
     // @ts-ignore
     // TODO https://track.astral.ru/soft/browse/UIKIT-1926
-    return (0, jsx_runtime_1.jsx)(FileUploader_1.FileUploader, { isError: error, ...fieldProps, ref: ref });
+    (0, jsx_runtime_1.jsx)(FileUploader_1.FileUploader, { isError: error, onChange: handleChange, ...fieldProps, ref: ref }));
 };
 exports.FormFileUploader = (0, forwardRefWithGeneric_1.forwardRefWithGeneric)(FormFileUploaderInner);

package/node/hook-form/FormPageLayoutBase/styles.js

@@ -28,12 +28,16 @@ exports.StyledPageContent = (0, styled_1.styled)(PageContent_1.PageContent) `
 
   border-top: 1px solid ${({ theme }) => theme.palette.grey[300]};
 
-  .${PageContent_1.pageContentClassnames.content} {
-    ${({ theme }) => theme.breakpoints.up('sm')} {
+  ${({ theme }) => theme.breakpoints.up('sm')} {
+    .${PageContent_1.pageContentClassnames.content} {
       overflow: unset;
 
       height: auto;
       padding: 0;
+
+      &.${PageContent_1.pageContentClassnames.contentHasHeader}, &.${PageContent_1.pageContentClassnames.hasAside} {
+        padding: 0;
+      }
     }
   }
 

package/node/hook-form/FormPreviewFileUploader/FormPreviewFileUploader.d.ts

@@ -1,9 +1,16 @@
 import type { ForwardedRef } from 'react';
 import { type PreviewFileUploaderProps } from '../../components/fileUploading/PreviewFileUploader';
+import { type FileUploaderMetaInfo, type UploadFile } from '../../components/fileUploading/types';
 import { type WithFormFieldProps } from '../types';
-export type FormPreviewFileUploaderProps<TFieldValues extends object> = WithFormFieldProps<Omit<PreviewFileUploaderProps, 'value' | 'onChange'>, TFieldValues>;
+export type FormPreviewFileUploaderValue = UploadFile;
+export type FormPreviewFileUploaderMetaInfo = FileUploaderMetaInfo;
+export type FormPreviewFileUploaderProps<TFieldValues extends object> = WithFormFieldProps<Omit<PreviewFileUploaderProps, 'value' | 'onChange'>, TFieldValues> & {
+    onChange?: (value: FormPreviewFileUploaderValue | null, metaInfo?: FormPreviewFileUploaderMetaInfo) => void;
+};
 /**
  * PreviewFileUploader для формы
  */
-export declare const FormPreviewFileUploaderInner: <TFieldValues extends object>(props: FormPreviewFileUploaderProps<TFieldValues>, ref: ForwardedRef<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-export declare const FormPreviewFileUploader: <TFieldValues extends object>(props: Omit<Omit<import("../..").UsePreviewFileUploaderParams, "onChange" | "value">, "error" | "name"> & Omit<import("react-hook-form").UseControllerProps<TFieldValues>, "rules"> & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | null;
+export declare const FormPreviewFileUploaderInner: <TFieldValues extends object>({ onChange: propsOnChange, ...props }: FormPreviewFileUploaderProps<TFieldValues>, ref: ForwardedRef<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
+export declare const FormPreviewFileUploader: <TFieldValues extends object>(props: Omit<Omit<import("../..").UsePreviewFileUploaderParams, "onChange" | "value">, "error" | "name"> & Omit<import("react-hook-form").UseControllerProps<TFieldValues>, "rules"> & {
+    onChange?: ((value: FormPreviewFileUploaderValue | null, metaInfo?: FormPreviewFileUploaderMetaInfo) => void) | undefined;
+} & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | null;

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

@@ -8,9 +8,13 @@ const useFormFieldProps_1 = require("../useFormFieldProps");
 /**
  * PreviewFileUploader для формы
  */
-const FormPreviewFileUploaderInner = (props, ref) => {
-    const { error, ...fieldProps } = (0, useFormFieldProps_1.useFormFieldProps)(props);
-    return (0, jsx_runtime_1.jsx)(PreviewFileUploader_1.PreviewFileUploader, { isError: error, ...fieldProps, ref: ref });
+const FormPreviewFileUploaderInner = ({ onChange: propsOnChange, ...props }, ref) => {
+    const { error, onChange, ...fieldProps } = (0, useFormFieldProps_1.useFormFieldProps)(props);
+    const handleChange = (value, metaInfo) => {
+        onChange(value);
+        propsOnChange?.(value, metaInfo);
+    };
+    return ((0, jsx_runtime_1.jsx)(PreviewFileUploader_1.PreviewFileUploader, { isError: error, onChange: handleChange, ...fieldProps, ref: ref }));
 };
 exports.FormPreviewFileUploaderInner = FormPreviewFileUploaderInner;
 exports.FormPreviewFileUploader = (0, forwardRefWithGeneric_1.forwardRefWithGeneric)(exports.FormPreviewFileUploaderInner);

package/package.json

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