@astral/ui 4.26.0 → 4.26.1

package/components/PageHeader/HeaderContent/HeaderContent.js

@@ -13,5 +13,5 @@ export const HeaderContent = ({ backButton, description, subheader, breadcrumbs,
         }
         return (_jsx(BreadcrumbsWrapper, { children: Array.isArray(breadcrumbs) ? (_jsx(Breadcrumbs, { children: breadcrumbs })) : (breadcrumbs) }));
     };
-    return (_jsxs(_Fragment, { children: [renderBreadcrumbs(), _jsx(DesktopTitleWrapper, { children: _jsx(Title, { backButton: backButton, title: title, isLoading: isLoading, hasDescription: Boolean(description), hasBreadcrumbs: Boolean(breadcrumbs) }) }), _jsx(Description, { description: description, isLoading: isLoading }), actions && (_jsx(PageActions, { className: classNames(pageHeaderClassnames.pageHeaderActions), isLoading: isLoading, size: "medium", ...actions })), subheader && _jsx(PageSubheader, { children: subheader }), filters && _jsx(PageFilters, { children: filters })] }));
+    return (_jsxs(_Fragment, { children: [renderBreadcrumbs(), _jsx(DesktopTitleWrapper, { children: _jsx(Title, { backButton: backButton, title: title, isLoading: isLoading, hasDescription: Boolean(description), hasBreadcrumbs: Boolean(breadcrumbs) }) }), _jsx(Description, { description: description, isLoading: isLoading }), actions && (_jsx(PageActions, { className: classNames(pageHeaderClassnames.pageHeaderActions), isLoading: isLoading, size: "medium", ...actions })), filters && _jsx(PageFilters, { children: filters }), subheader && _jsx(PageSubheader, { children: subheader })] }));
 };

package/hook-form/FormFilters/FormFilters.js

@@ -6,7 +6,7 @@ import { FormControlProvider } from '../FormControlProvider';
 import { formFiltersClassnames } from './constants';
 import { FormFiltersDialog } from './FormFiltersDialog';
 import { FormFiltersSkeleton } from './FormFiltersSkeleton';
-import { AllFiltersButtonWrapper, MainFiltersWrapper, StyledBadge, StyledCounter, Wrapper, } from './styles';
+import { AllFiltersButtonWrapper, MainFiltersWrapper, StyledBadge, StyledCounter, SubmitButtonWrapper, Wrapper, } from './styles';
 import { useLogic } from './useLogic';
 /**
  * Компонент для отображения фильтров формы
@@ -16,5 +16,5 @@ export const FormFilters = (props) => {
     if (isLoading) {
         return _jsx(FormFiltersSkeleton, {});
     }
-    return (_jsxs(_Fragment, { children: [_jsx(FormControlProvider, { size: "small", hideHelperText: true, children: _jsx(Form, { form: headerForm, onSubmit: headerForm.handleSubmit(onSubmit), children: _jsxs(Wrapper, { children: [SearchField && (_jsx(SearchField, { control: headerForm.control, fullWidth: true })), _jsx(AllFiltersButtonWrapper, { className: allFiltersButtonClassName, children: _jsx(StyledBadge, { color: "error", badgeContent: counter, variant: "dot", children: _jsx(Button, { onClick: onOpenModal, variant: "outlined", color: "grey", startIcon: _jsx(Filter2OutlineMd, {}), endIcon: counter ? (_jsx(StyledCounter, { color: "error", content: counter })) : null, className: formFiltersClassnames.allFiltersButton, children: "\u0412\u0441\u0435 \u0444\u0438\u043B\u044C\u0442\u0440\u044B" }) }) }), _jsx(MainFiltersWrapper, { className: formFiltersClassnames.pageHeaderFilters, columns: mainFiltersColumns, children: MainFilters && (_jsx(MainFilters, { control: headerForm.control, isModal: false })) }), SubmitButton && (_jsx(SubmitButton, { size: "medium", className: formFiltersClassnames.submitButton }))] }) }) }), _jsx(FormFiltersDialog, { ...dialogProps })] }));
+    return (_jsxs(_Fragment, { children: [_jsx(FormControlProvider, { size: "small", hideHelperText: true, children: _jsx(Form, { form: headerForm, onSubmit: headerForm.handleSubmit(onSubmit), children: _jsxs(Wrapper, { children: [SearchField && (_jsx(SearchField, { control: headerForm.control, fullWidth: true })), _jsx(AllFiltersButtonWrapper, { className: allFiltersButtonClassName, children: _jsx(StyledBadge, { color: "error", badgeContent: counter, variant: "dot", children: _jsx(Button, { onClick: onOpenModal, variant: "outlined", color: "grey", startIcon: _jsx(Filter2OutlineMd, {}), endIcon: counter ? (_jsx(StyledCounter, { color: "error", content: counter })) : null, className: formFiltersClassnames.allFiltersButton, children: "\u0412\u0441\u0435 \u0444\u0438\u043B\u044C\u0442\u0440\u044B" }) }) }), _jsx(MainFiltersWrapper, { className: formFiltersClassnames.pageHeaderFilters, columns: mainFiltersColumns, children: MainFilters && (_jsx(MainFilters, { control: headerForm.control, isModal: false })) }), SubmitButton && (_jsx(SubmitButtonWrapper, { children: _jsx(SubmitButton, { size: "medium", className: formFiltersClassnames.submitButton }) }))] }) }) }), _jsx(FormFiltersDialog, { ...dialogProps })] }));
 };

package/hook-form/FormFilters/styles.d.ts

@@ -27,3 +27,7 @@ export declare const StyledCounter: import("../../components/styled").StyledComp
 } & {
     theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;
+export declare const SubmitButtonWrapper: import("../../components/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/hook-form/FormFilters/styles.js

@@ -88,7 +88,14 @@ export const StyledBadge = styled(Badge) `
     }
 `;
 export const StyledCounter = styled(Counter) `
-   ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('sm')} {
     display: none;
   }
 `;
+export const SubmitButtonWrapper = styled.div `
+  white-space: nowrap;
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    display: contents;
+  }
+`;

package/node/components/PageHeader/HeaderContent/HeaderContent.js

@@ -16,6 +16,6 @@ const HeaderContent = ({ backButton, description, subheader, breadcrumbs, action
         }
         return ((0, jsx_runtime_1.jsx)(styles_1.BreadcrumbsWrapper, { children: Array.isArray(breadcrumbs) ? ((0, jsx_runtime_1.jsx)(Breadcrumbs_1.Breadcrumbs, { children: breadcrumbs })) : (breadcrumbs) }));
     };
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [renderBreadcrumbs(), (0, jsx_runtime_1.jsx)(styles_1.DesktopTitleWrapper, { children: (0, jsx_runtime_1.jsx)(Title_1.Title, { backButton: backButton, title: title, isLoading: isLoading, hasDescription: Boolean(description), hasBreadcrumbs: Boolean(breadcrumbs) }) }), (0, jsx_runtime_1.jsx)(Description_1.Description, { description: description, isLoading: isLoading }), actions && ((0, jsx_runtime_1.jsx)(PageActions_1.PageActions, { className: (0, classNames_1.classNames)(constants_1.pageHeaderClassnames.pageHeaderActions), isLoading: isLoading, size: "medium", ...actions })), subheader && (0, jsx_runtime_1.jsx)(styles_1.PageSubheader, { children: subheader }), filters && (0, jsx_runtime_1.jsx)(styles_1.PageFilters, { children: filters })] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [renderBreadcrumbs(), (0, jsx_runtime_1.jsx)(styles_1.DesktopTitleWrapper, { children: (0, jsx_runtime_1.jsx)(Title_1.Title, { backButton: backButton, title: title, isLoading: isLoading, hasDescription: Boolean(description), hasBreadcrumbs: Boolean(breadcrumbs) }) }), (0, jsx_runtime_1.jsx)(Description_1.Description, { description: description, isLoading: isLoading }), actions && ((0, jsx_runtime_1.jsx)(PageActions_1.PageActions, { className: (0, classNames_1.classNames)(constants_1.pageHeaderClassnames.pageHeaderActions), isLoading: isLoading, size: "medium", ...actions })), filters && (0, jsx_runtime_1.jsx)(styles_1.PageFilters, { children: filters }), subheader && (0, jsx_runtime_1.jsx)(styles_1.PageSubheader, { children: subheader })] }));
 };
 exports.HeaderContent = HeaderContent;

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

@@ -19,6 +19,6 @@ const FormFilters = (props) => {
     if (isLoading) {
         return (0, jsx_runtime_1.jsx)(FormFiltersSkeleton_1.FormFiltersSkeleton, {});
     }
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(FormControlProvider_1.FormControlProvider, { size: "small", hideHelperText: true, children: (0, jsx_runtime_1.jsx)(Form_1.Form, { form: headerForm, onSubmit: headerForm.handleSubmit(onSubmit), children: (0, jsx_runtime_1.jsxs)(styles_1.Wrapper, { children: [SearchField && ((0, jsx_runtime_1.jsx)(SearchField, { control: headerForm.control, fullWidth: true })), (0, jsx_runtime_1.jsx)(styles_1.AllFiltersButtonWrapper, { className: allFiltersButtonClassName, children: (0, jsx_runtime_1.jsx)(styles_1.StyledBadge, { color: "error", badgeContent: counter, variant: "dot", children: (0, jsx_runtime_1.jsx)(Button_1.Button, { onClick: onOpenModal, variant: "outlined", color: "grey", startIcon: (0, jsx_runtime_1.jsx)(Filter2OutlineMd_1.Filter2OutlineMd, {}), endIcon: counter ? ((0, jsx_runtime_1.jsx)(styles_1.StyledCounter, { color: "error", content: counter })) : null, className: constants_1.formFiltersClassnames.allFiltersButton, children: "\u0412\u0441\u0435 \u0444\u0438\u043B\u044C\u0442\u0440\u044B" }) }) }), (0, jsx_runtime_1.jsx)(styles_1.MainFiltersWrapper, { className: constants_1.formFiltersClassnames.pageHeaderFilters, columns: mainFiltersColumns, children: MainFilters && ((0, jsx_runtime_1.jsx)(MainFilters, { control: headerForm.control, isModal: false })) }), SubmitButton && ((0, jsx_runtime_1.jsx)(SubmitButton, { size: "medium", className: constants_1.formFiltersClassnames.submitButton }))] }) }) }), (0, jsx_runtime_1.jsx)(FormFiltersDialog_1.FormFiltersDialog, { ...dialogProps })] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(FormControlProvider_1.FormControlProvider, { size: "small", hideHelperText: true, children: (0, jsx_runtime_1.jsx)(Form_1.Form, { form: headerForm, onSubmit: headerForm.handleSubmit(onSubmit), children: (0, jsx_runtime_1.jsxs)(styles_1.Wrapper, { children: [SearchField && ((0, jsx_runtime_1.jsx)(SearchField, { control: headerForm.control, fullWidth: true })), (0, jsx_runtime_1.jsx)(styles_1.AllFiltersButtonWrapper, { className: allFiltersButtonClassName, children: (0, jsx_runtime_1.jsx)(styles_1.StyledBadge, { color: "error", badgeContent: counter, variant: "dot", children: (0, jsx_runtime_1.jsx)(Button_1.Button, { onClick: onOpenModal, variant: "outlined", color: "grey", startIcon: (0, jsx_runtime_1.jsx)(Filter2OutlineMd_1.Filter2OutlineMd, {}), endIcon: counter ? ((0, jsx_runtime_1.jsx)(styles_1.StyledCounter, { color: "error", content: counter })) : null, className: constants_1.formFiltersClassnames.allFiltersButton, children: "\u0412\u0441\u0435 \u0444\u0438\u043B\u044C\u0442\u0440\u044B" }) }) }), (0, jsx_runtime_1.jsx)(styles_1.MainFiltersWrapper, { className: constants_1.formFiltersClassnames.pageHeaderFilters, columns: mainFiltersColumns, children: MainFilters && ((0, jsx_runtime_1.jsx)(MainFilters, { control: headerForm.control, isModal: false })) }), SubmitButton && ((0, jsx_runtime_1.jsx)(styles_1.SubmitButtonWrapper, { children: (0, jsx_runtime_1.jsx)(SubmitButton, { size: "medium", className: constants_1.formFiltersClassnames.submitButton }) }))] }) }) }), (0, jsx_runtime_1.jsx)(FormFiltersDialog_1.FormFiltersDialog, { ...dialogProps })] }));
 };
 exports.FormFilters = FormFilters;

package/node/hook-form/FormFilters/styles.d.ts

@@ -27,3 +27,7 @@ export declare const StyledCounter: import("@emotion/styled/dist/declarations/sr
 } & {
     theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;
+export declare const SubmitButtonWrapper: import("@emotion/styled/dist/declarations/src/types").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

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

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.StyledCounter = exports.StyledBadge = exports.MainFiltersWrapper = exports.AllFiltersButtonWrapper = exports.Wrapper = void 0;
+exports.SubmitButtonWrapper = exports.StyledCounter = exports.StyledBadge = exports.MainFiltersWrapper = exports.AllFiltersButtonWrapper = exports.Wrapper = void 0;
 const Badge_1 = require("@mui/material/Badge");
 const FormLabel_1 = require("@mui/material/FormLabel");
 const InputBase_1 = require("@mui/material/InputBase");
@@ -91,7 +91,14 @@ exports.StyledBadge = (0, styled_1.styled)(Badge_2.Badge) `
     }
 `;
 exports.StyledCounter = (0, styled_1.styled)(Counter_1.Counter) `
-   ${({ theme }) => theme.breakpoints.down('sm')} {
+  ${({ theme }) => theme.breakpoints.down('sm')} {
     display: none;
   }
 `;
+exports.SubmitButtonWrapper = styled_1.styled.div `
+  white-space: nowrap;
+
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    display: contents;
+  }
+`;

package/package.json

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