@astral/ui 4.24.2 → 4.25.1

package/components/fileUploading/FileInput/styles.js

@@ -3,4 +3,8 @@ export const Input = styled.input `
   width: 0;
   height: 0;
   padding: 0;
+
+  &::file-selector-button { 
+    display: none; 
+  } 
 `;

package/hook-form/EditableText/EditingForm/EditingForm.d.ts

@@ -19,6 +19,7 @@ export type EditingFormProps<TValue = string> = {
         name: typeof FIELD_NAME;
         control: UseFormReturn<FormValues>['control'];
         fullWidth: boolean;
+        autoFocus: boolean;
     }) => ReactElement;
     /**
      * Функция валидации для редактируемого поля.

package/hook-form/EditableText/EditingForm/EditingForm.js

@@ -1,10 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button } from '../../../components/Button';
 import { Form } from '../../Form';
 import { FormSubmitButton } from '../../FormSubmitButton';
 import { FormTextField } from '../../FormTextField';
 import { FIELD_NAME } from '../constants';
-import { Description, FormFooter, Wrapper } from './styles';
+import { CancelButton, Description, FormFooter, Wrapper } from './styles';
 import { useLogic } from './useLogic';
 // biome-ignore lint/complexity/noUselessTypeConstraint: Фикс типизация в тестах
 export const EditingForm = (props) => {
@@ -14,5 +13,6 @@ export const EditingForm = (props) => {
                     name: FIELD_NAME,
                     control: formProps.form.control,
                     fullWidth: true,
-                }), _jsxs(FormFooter, { children: [_jsx(Button, { variant: "text", onClick: onClose, children: "\u041E\u0442\u043C\u0435\u043D\u0430" }), _jsx(FormSubmitButton, { children: "\u0421\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u044C" })] })] }) }));
+                    autoFocus: true,
+                }), _jsxs(FormFooter, { children: [_jsx(CancelButton, { variant: "text", onClick: onClose, children: "\u041E\u0442\u043C\u0435\u043D\u0430" }), _jsx(FormSubmitButton, { children: "\u0421\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u044C" })] })] }) }));
 };

package/hook-form/EditableText/EditingForm/styles.d.ts

@@ -16,3 +16,12 @@ export declare const FormFooter: import("../../../components/styled").StyledComp
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
+export declare const CancelButton: import("../../../components/styled").StyledComponent<Omit<import("../../..").WithoutEmotionSpecific<import("@mui/material").ButtonProps>, "color" | "component" | "variant" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple"> & {
+    variant?: "light" | "link" | "text" | "contained" | "outlined" | undefined;
+    loading?: boolean | undefined;
+    color?: "primary" | "success" | "warning" | "error" | "grey" | undefined;
+    component?: import("react").ElementType | undefined;
+    selected?: boolean | undefined;
+} & Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, ""> & import("react").RefAttributes<HTMLButtonElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;

package/hook-form/EditableText/EditingForm/styles.js

@@ -1,14 +1,37 @@
+import { Button, buttonClasses } from '../../../components/Button';
 import { styled } from '../../../components/styled';
 import { Typography } from '../../../components/Typography';
 export const Wrapper = styled.div `
   width: 400px;
   padding: ${({ theme }) => theme.spacing(4)};
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    width: auto;
+  }
 `;
 export const Description = styled(Typography) `
   margin-bottom: ${({ theme }) => theme.spacing(3)};
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    display: none;
+  }
 `;
 export const FormFooter = styled.footer `
   display: flex;
   gap: ${({ theme }) => theme.spacing(3)};
   justify-content: end;
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    padding-top: ${({ theme }) => theme.spacing(4)};
+
+    & .${buttonClasses.root} {
+      width: 100%;
+      height: 48px;
+    }
+  }
+`;
+export const CancelButton = styled(Button) `
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    display: none;
+  }
 `;

package/hook-form/EditableText/useLogic/useLogic.d.ts

@@ -14,5 +14,6 @@ export declare const useLogic: <TValue>({ isLoading, iconPosition, }: EditableTe
         open: boolean;
         onClose: () => void;
         anchorEl: import("../../../components/usePopover").AnchorType;
+        title: string;
     };
 };

package/hook-form/EditableText/useLogic/useLogic.js

@@ -24,6 +24,7 @@ export const useLogic = ({ isLoading, iconPosition, }) => {
             open: isOpen,
             onClose: actions.close,
             anchorEl: anchor,
+            title: 'Изменение данных',
         },
     };
 };

package/node/components/fileUploading/FileInput/styles.js

@@ -6,4 +6,8 @@ exports.Input = styled_1.styled.input `
   width: 0;
   height: 0;
   padding: 0;
+
+  &::file-selector-button { 
+    display: none; 
+  } 
 `;

package/node/hook-form/EditableText/EditingForm/EditingForm.d.ts

@@ -19,6 +19,7 @@ export type EditingFormProps<TValue = string> = {
         name: typeof FIELD_NAME;
         control: UseFormReturn<FormValues>['control'];
         fullWidth: boolean;
+        autoFocus: boolean;
     }) => ReactElement;
     /**
      * Функция валидации для редактируемого поля.

package/node/hook-form/EditableText/EditingForm/EditingForm.js

@@ -2,7 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EditingForm = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const Button_1 = require("../../../components/Button");
 const Form_1 = require("../../Form");
 const FormSubmitButton_1 = require("../../FormSubmitButton");
 const FormTextField_1 = require("../../FormTextField");
@@ -17,6 +16,7 @@ const EditingForm = (props) => {
                     name: constants_1.FIELD_NAME,
                     control: formProps.form.control,
                     fullWidth: true,
-                }), (0, jsx_runtime_1.jsxs)(styles_1.FormFooter, { children: [(0, jsx_runtime_1.jsx)(Button_1.Button, { variant: "text", onClick: onClose, children: "\u041E\u0442\u043C\u0435\u043D\u0430" }), (0, jsx_runtime_1.jsx)(FormSubmitButton_1.FormSubmitButton, { children: "\u0421\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u044C" })] })] }) }));
+                    autoFocus: true,
+                }), (0, jsx_runtime_1.jsxs)(styles_1.FormFooter, { children: [(0, jsx_runtime_1.jsx)(styles_1.CancelButton, { variant: "text", onClick: onClose, children: "\u041E\u0442\u043C\u0435\u043D\u0430" }), (0, jsx_runtime_1.jsx)(FormSubmitButton_1.FormSubmitButton, { children: "\u0421\u043E\u0445\u0440\u0430\u043D\u0438\u0442\u044C" })] })] }) }));
 };
 exports.EditingForm = EditingForm;

package/node/hook-form/EditableText/EditingForm/styles.d.ts

@@ -16,3 +16,12 @@ export declare const FormFooter: import("@emotion/styled/dist/declarations/src/t
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
+export declare const CancelButton: import("@emotion/styled/dist/declarations/src/types").StyledComponent<Omit<import("../../..").WithoutEmotionSpecific<import("@mui/material").ButtonProps>, "color" | "component" | "variant" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple"> & {
+    variant?: "light" | "link" | "text" | "contained" | "outlined" | undefined;
+    loading?: boolean | undefined;
+    color?: "primary" | "success" | "warning" | "error" | "grey" | undefined;
+    component?: import("react").ElementType | undefined;
+    selected?: boolean | undefined;
+} & Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, ""> & import("react").RefAttributes<HTMLButtonElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;

package/node/hook-form/EditableText/EditingForm/styles.js

@@ -1,17 +1,40 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.FormFooter = exports.Description = exports.Wrapper = void 0;
+exports.CancelButton = exports.FormFooter = exports.Description = exports.Wrapper = void 0;
+const Button_1 = require("../../../components/Button");
 const styled_1 = require("../../../components/styled");
 const Typography_1 = require("../../../components/Typography");
 exports.Wrapper = styled_1.styled.div `
   width: 400px;
   padding: ${({ theme }) => theme.spacing(4)};
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    width: auto;
+  }
 `;
 exports.Description = (0, styled_1.styled)(Typography_1.Typography) `
   margin-bottom: ${({ theme }) => theme.spacing(3)};
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    display: none;
+  }
 `;
 exports.FormFooter = styled_1.styled.footer `
   display: flex;
   gap: ${({ theme }) => theme.spacing(3)};
   justify-content: end;
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    padding-top: ${({ theme }) => theme.spacing(4)};
+
+    & .${Button_1.buttonClasses.root} {
+      width: 100%;
+      height: 48px;
+    }
+  }
+`;
+exports.CancelButton = (0, styled_1.styled)(Button_1.Button) `
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    display: none;
+  }
 `;

package/node/hook-form/EditableText/useLogic/useLogic.d.ts

@@ -14,5 +14,6 @@ export declare const useLogic: <TValue>({ isLoading, iconPosition, }: EditableTe
         open: boolean;
         onClose: () => void;
         anchorEl: import("../../../components/usePopover").AnchorType;
+        title: string;
     };
 };

package/node/hook-form/EditableText/useLogic/useLogic.js

@@ -27,6 +27,7 @@ const useLogic = ({ isLoading, iconPosition, }) => {
             open: isOpen,
             onClose: actions.close,
             anchorEl: anchor,
+            title: 'Изменение данных',
         },
     };
 };

package/package.json

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